/* only ipad 1024 and bigger screen landscape screen */

@media only screen and (min-width: 768px) {
#mainmenu > ul { display: block !important; }
}



/*==========================================================================================================*/

@media only screen and (max-width: 1023px) {
body { min-width: 320px; }
img { max-width: 100%; width: auto; height: auto; }
.wrap { width: auto; padding: 0 20px; }
.default-grid.form-grid.cols2 .col { width: auto; float: none; }
.buttonset .col a { margin: 0 5px 8px 0; }
.default-grid.cols4 .col { width: 50%; }
.cols2.default-grid.tab-grid .col { width: 100%; }
.image-block figure { width: 45%; }
#mainmenu li.logo-space { display: none }
#logo { position: relative; top: 0; left: 25%; transform: translateX(0); -webkit-transform: translateX(0); }
#header { margin: 0 }
#footer #logo { display: none }
.white-box { top: 0 }
.comman-box.margin-box { margin: 0 }
.photo-gallery li { width: 50%; }
.gallary-box-img { padding: 20px; }
.tabnav { width: 100%; margin-bottom: 25px; }
.tab-container { width: 100%; }
.about-box .cols2 .col { width: 100%; }
.about-box .cols2 .col:first-child { margin-bottom: 25px; }
.photo-gallery li .category { font-size: 16px; }
.we-whitebox p { max-width: 200px; }
.defult-banner { background-position: center center; height: 200px; }
.services-page-title h1 { font-size: 42px; }
.services-page-title:before { top: 56px; }
.what-we-colm .cols .col { width: 60%; float: none; margin: 0 auto }
.col.second { transform: scale(1.0); -webkit-transform: scale(1.0); -o-transform: scale(1.0); -moz-transform: scale(1.0); }
.what-we-do { padding: 20px 0 }
.what-we-colm { padding: 0 }
.comman-box, .comman-box-blue { background-position: center center; background-size: cover }
.contact-box .col { width: 100%; }
.contact-box .col:first-child { margin-bottom: 25px; }
.information ul li { padding: 0 }
}



/*==========================================================================================================*/

@media only screen and (max-width: 767px) {
#header { position: relative; }
#mainmenu { z-index: 200 }
#mainmenu > ul { display: none; position: absolute; left: 0; width: 100%; top: 100%; background: #ab3332; z-index: 5; }
#mainmenu ul li { float: none; margin: 0; padding: 0; border-bottom: solid 1px #d33635; width: 100%; line-height: 36px; text-align: left }
#mainmenu ul li a { padding: 8px 15px; display: block; }
#mainmenu ul li a:after { display: none; }
/* Responsive Menu line icon*/

#menu { display: block; text-align: left; padding: 20px; }
.menulines-button { padding: 0; cursor: pointer; user-select: none; text-transform: uppercase; font-size: 16px; text-decoration: none; color: #fff; text-decoration: none; }
.menulines-button em { font-style: normal; font-weight: bold; margin-left: 10px; }
.menulines-button:hover { text-decoration: none; }
.menulines { display: inline-block; width: 20px; height: 3px; background: #fff; position: relative; float: left; margin: 9px 0 0 0; -moz-transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); opacity: 1; }
.menulines:before, .menulines:after { display: inline-block; width: 20px; height: 3px; background: #fff; transition: 550ms; position: absolute; left: 0; content: ''; -webkit-transform-origin: 0.28571rem center; transform-origin: 0.28571rem center; -moz-transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition: all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transform-origin: 0.28571rem center; -moz-transform-origin: 0.28571rem center; -ms-transform-origin: 0.28571rem center; transform-origin: 0.28571rem center; }
.menulines:before { top: 7px; }
.menulines:after { top: -7px; }
.menuopen .menulines { background: none; }
.menuopen .menulines:before, .menuopen .menulines:after { -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; top: 0; }
.menuopen .menulines:before { -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); }
.menuopen .menulines:after { -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); }
.default-grid.cols3 .col { width: 50%; }
.default-grid.cols3 .col:nth-child(3) { clear: left; }
.tabnav { display: none; }
.tab-data { margin: 0 0 30px; }
.tab-data .tabnav { display: block; }
.tabMobiletrigger { position: relative; margin: 0; padding: 10px 40px 10px 0; line-height: 100%; text-align: center; cursor: pointer; display: block; font-size: 18px !important; border-bottom: 2px solid #e2e2e2; text-align: left }
.tabMobiletrigger:after { content: ''; position: absolute; right: 16px; top: 50%; margin-top: -3px; border-top: solid 6px #848690; border-left: solid 6px transparent; border-right: solid 6px transparent; }
.tabMobiletrigger.rotate { background: #fff; color: #444; border-bottom-color: #9497ce; }
.tabcontent { padding: 15px 0; border-bottom: 2px solid #848690; margin: 0; }
.tabMobiletrigger.rotate:after { border-top-color: #9497ce; transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); }
.tabcontent input[type="button"].save-continue, .tabcontent input[type="submit"].save-continue, .tabcontent input[type="button"].back-btn, .tabcontent input[type="submit"].back-btn, .tabcontent input[type="submit"].save, .tabcontent input[type="submit"].cancel, input[type="submit"].small-button { font-size: 17px; }
.tabcontent input[type="button"].save-continue, .tabcontent input[type="submit"].save-continue, .tabcontent input[type="submit"].save, .tabcontent input[type="button"].back-btn, .tabcontent input[type="submit"].back-btn, .tabcontent input[type="submit"].cancel, input[type="submit"].small-button { background-size: auto 100%; }
.heading-listblock.cols2 .col, .dropcaps-box.cols2 .col { width: 100%; float: none; }
h1, h2 { font-size: 40px; }
.what-we-colm .cols .col { width: 80%; float: none; margin: 0 auto }
}

/*==========================================================================================================*/

/* only iphone4 landscape & Potriat 300 by 480*/

@media only screen and (max-width: 567px) {
.default-grid.cols3 .col, .default-grid.cols2 .col, .default-grid.cols4 .col { width: auto; float: none; }
table.res-table tr th { display: none; }
table.res-table tr td { display: block; position: relative; padding-left: 50%; }
table.res-table td:before { content: attr(data-th) ": "; font-weight: bold; width: 50%; display: block; padding-right: 10px; position: absolute; left: 0; top: 0; padding: 10px 10px; }
table.res-table { border-top: 0; }
#logo { width: 200px; }
.list-block.cols3 .col { width: 100%; float: none; }
.image-block figure { width: 100%; float: none; padding-right: 0; }
.image-block.right-align figure { padding-left: 0; }
h1, h2 { font-size: 34px; }
.white-box { padding: 30px 10px 30px; }
.white-box h1 { font-size: 35px }
.white-box-data h5 { font-size: 18px; }
.morbtn { margin-top: 0; }
.comman-box, .comman-box-blue { height: 72px; background-position: center center; background-size: cover }
.comman-title h1 { font-size: 35px; }
.what-we-colm { padding: 20px 0 }
.testimonials-box { padding: 20px 0; }
.footer-data { padding: 20px 0 20px }
.about-box-can { padding: 20px 5px; }
.about-box { padding: 20px 0 }
.cols { clear: both; margin-left: 0; margin-right: 0; }
.defult-banner { height: 150px; }
#logo { display: block; left: 50%; transform: translateX(-50%); padding: 15px; width: 200px; }
.photo-gallery li { width: auto; }
.service-newbox ul li { width: 50%; font-size: 18px; }
.service-newbox ul li figure { margin-bottom: 5px; }
.service-newbox ul li figure img { width: 35%; }
.contact-box-can { padding: 25px 0 }
.information ul li p { font-size: 16px; }
.form-block .col { padding: 0; margin: 0 }
.form-block .col:first-child { margin: 0 }
.photo-gallery li { padding: 0 }

.imageGallery li img { width: 100%; min-height: auto; }

}

/*==========================================================================================================*/

/* only iphone landscape 340 by 478*/

@media only screen and (max-width: 480px) {
.form-inline .form-group label, .form-inline .form-group .field-box { float: none; display: block; width: auto; }
.form-inline .form-group label.blank { display: none; }
h1, h2 { font-size: 30px; }
.service-newbox ul li { width: 100%; font-size: 18px; }
.service-newbox ul li figure img { width: 25%; }
}

/*==========================================================================================================*/

/* only iphone portrait 300 by 479*/

@media only screen and (max-width: 479px) {
#mainmenu { margin: 12px 0 0; }
}

/*==========================================================================================================*/

/* Retina css */ 

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2) {
 .sprites, .sp-after:after, .sp-before:before {
background-image:url(../images/bgi/sprites@2x.png);
 -moz-background-size:237px 207px;
-ms-background-size:237px 207px;
-o-background-size:237px 207px;
-webkit-background-size:237px 207px;
background-size:237px 207px;
}
}