/* Mobile Portrait View */

@media screen and (max-width: 29.938em) {

h3 { padding:0;}
h2 { font-size:22px;}
#header-wrapper {
	padding-top: 5px;
	padding-right: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
}
.header{ width:100%;}
.header .container { padding:0;}
.header .logo { float:none; margin:0; width:100%; padding:20px;}
.container { padding:0 15px;}
.banner { width:100%; padding:0 15px;}
.container { width:100%;}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col-13, .col-14 { width:100%; padding:0 20px;}
.content p { padding:0;}
.content { padding:40px 0;}
.content-left { width:100%;}
.welcome-pic { position:relative; width:100%;}
.service-box { margin-bottom:30px;}
.testimonials #owl-demo .item { padding:0 20px;}
#footer .menu, #footer .blog, #footer .newsletter { width:100%; padding:0; margin-bottom:30px;}
#footer .blog { margin:0 0 30px 0; border:none;}
#banner-wrapper .bx-wrapper .bx-caption { width:50%; padding:0 10px;}
#banner-wrapper .bx-caption h1 { font-size:16px; line-height:16px;}
#banner-wrapper .bx-caption p { display: none;}
#banner-wrapper img { position:relative; width:100%; display:block; text-align:center;}
}

/* Mobile Landscape View */

@media screen and (max-width:47.938em) and (min-width:30.000em) { 

h3 { padding:0;}
h2 { font-size:22px;}
#header-wrapper {
	padding-top: 5px;
	padding-right: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
}
.header{ width:100%;}
.header .container { width:100%; padding:0;}
.header .logo { float:none; margin:0; width:100%; padding:20px;}
.container { width:450px; padding:0 15px; margin:0 auto;}
.banner { width:100%; padding:0 15px;}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col-13, .col-14 { width:100%; padding:0 20px;}
.content p { padding:0;}
.content { padding:80px 0;}
.content-left { width:100%;}
.welcome-pic { position:relative; width:100%;}
.service-box { margin-bottom:30px;}
.testimonials #owl-demo .item { padding:0 20px;}
#footer .menu, #footer .blog, #footer .newsletter { width:100%; padding:0; margin-bottom:30px;}
#footer .blog { margin:0 0 30px 0; border:none;}
#banner-wrapper .bx-wrapper .bx-caption { width:50%; padding:0 10px;}
#banner-wrapper .bx-caption h1 { font-size:18px; line-height:18px;}
#banner-wrapper .bx-caption p { display: none;}
#banner-wrapper img { position:relative; width:100%; display:block; text-align:center;}

}

@media screen and (max-width:61.188em) and (min-width:20.000em) {

.nav { width:100%; margin:0; background:#fff;}
.nav li { display:block; padding-bottom:0; border-bottom:#e4e2e2 solid 1px;}
.nav li a { padding:0; color:#000; font-size:15px; line-height:35px; margin:0;}
.nav li a:hover , .nav li.current a {color:#000; box-shadow:none;}

.nav li ul { display:block; width:100%;}
.nav li:hover ul { position:relative; width:100%;}
.nav li ul li a { padding:0 20px; font-size:15px !important; box-shadow:none; margin:0;}
.nav li:hover ul li a:hover, .nav li:hover ul li.current a { box-shadow:none; }

.toggleMenu { z-index:12; display: none; padding:10px 50px 10px 17px; background:#fd5e2a url(../images/toggle-bg.png) no-repeat right center; font:normal 12px Arial, Helvetica, sans-serif; text-align:left; height:auto; margin:1px 0 0 0; text-decoration:none; position:relative; right:0; top:0; width:100%; border-bottom:0 !important; color:#fff;}
.toggleMenu:hover { color:#fff;}

}

/* Tablet View */

@media screen and (max-width:63.938em) and (min-width:48.000em) {

#header-wrapper { padding:15px;}
.header { width:100%;}
.header .logo { margin:15px 0; width:40%;}
.banner { width:100%; padding:0 15px;}
.container { width:100%;}
.services .col-3 { width:50%;}
.service-box { margin-bottom:30px;}
.toggleMenu { float:right; width:41px; height:40px; padding:0; font-size:0; top:28px;}
#footer .blog { width:44%;}
#banner-wrapper .bx-wrapper .bx-caption { width:46%; padding:0 15px;}
#banner-wrapper .bx-caption h1 { font-size:22px; line-height:30px;}
#banner-wrapper .bx-caption p { font-size:17px;}

}

@media screen and (max-width:73.063em) and (min-width:64.000em) {
	
#header-wrapper {padding-top: 5px; padding-right: 5px; padding-left: 5px; padding-bottom: 5px;}
.container { width:auto; padding:0 15px;}
.nav li a { font-size:14px; margin:0 5px;}
#footer .blog { width:45%;}
#banner-wrapper .bx-wrapper .bx-caption { width:46%; padding:0 30px;}
#banner-wrapper .bx-caption h1 { font-size:28px; line-height:30px;}

}
