/*---------------------------------------Defult Setting--------------------------------------*/

@import url("/theme/cmslib.css");
html {}

body {
	background-color: #121212;
	font-family: 'Source Sans Pro', sans-serif;
	font-family: 'IBM Plex Serif', serif;
	overflow-x:hidden;
}

body.cmsview {
	padding-top: 50px;
}

.container {
}

main {
	display: block;
	width: 100%;
	min-height: 78vh;
}

img {
	max-width: 100%;
	height: auto;
}

h1.title {
	font-weight: 200;
	font-size: 29px;
}

.prodlist h2 {
	font-size: 17px;
}
#cms-prod-view .photo {
    width: 100%;
}

/*---------------------------------------------------------------------------------------------*/


/*====================================== Navigation ===========================================*/

a:focus {
	outline: none;
	outline: none;
	outline-offset: none;
}

.navbar-brand img {
	top: 0px;
	left: 0px;
	position: absolute;
}

.navleft ul {
	border: 0px solid red;
	margin-left: 40%;
}

.navbar-right {
	border: 0px solid green;
	background-color: #f10000;
}

.navbar-right li:nth-child(1) {
	display: none;
}

.navbar-right li a {
	padding: 0px;
}

.navbar-nav {}

.navbar-nav>li {
	text-transform: uppercase;
	font-size: 13px;
}

#navbar {
	position: relative;
	margin-left: 20%;
}

.navbar-default {
	background-color: #1d1d1e;
	border-color: #1d1d1e;
}

.navbar-default .navbar-nav>li>a {
	color: #fff;
}

#navbar .navbar-nav>li {
	padding: 0px 5px 0px;
}

#navbar .navbar-nav>li>a {
	padding: 15px 25px;
}

#navbar .navbar-nav>li>a:hover {
	background: transparent;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
	color: #fff;
	background-color: #f10000;
}

#theme-header .loginbutton {
	display: none;
}


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


/*========================================= Home Section ==============================================*/
/*----------- dreamSquare02 Section -------------*/
#dreamsquare02 {
	padding: 10px 0px 10px 0px;
}

#dreamsquare {
	padding: 10px 0px 10px 0px;
}



/*----------- Square02 Section -------------*/

#square02 {
	padding: 20px 0px 20px 0px;
}

.pad3 {
	padding: 3px;
}

@-webkit-keyframes fadeInUp {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 2000px, 0);
		transform: translate3d(0, 2000px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes fadeInUpBig {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 2000px, 0);
		transform: translate3d(0, 2000px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.fadeInUpBig {
	-webkit-animation-name: fadeInUpBig;
	animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeInDown {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes fadeInDown {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
	from {
		opacity: 1;
		-webkit-transform: translate3d(0, -2000px, 0);
		transform: translate3d(0, -2000px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes fadeInDownBig {
	from {
		opacity: 1;
		-webkit-transform: translate3d(0, -2000px, 0);
		transform: translate3d(0, -2000px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.fadeInDownBig {
	-webkit-animation-name: fadeInDownBig;
	animation-name: fadeInDownBig;
}

.snip1543 {
	background-color: #fff;
	color: #ffffff;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 16px;
	margin: 0px 0px;
	max-width: 100%;
	min-width: 230px;
	overflow: hidden;
	position: relative;
	text-align: left;
	width: 100%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

.snip1543 *,
.snip1543 *:before,
.snip1543 *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.45s ease;
	transition: all 0.45s ease;
}

.snip1543 img {
	/*backface-visibility: hidden;
    */
	max-width: 100%;
	vertical-align: top;
}

.snip1543:before,
.snip1543:after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	content: '';
	background-color: #0054a6;
	opacity: 0.5;
	-webkit-transition: all 0.45s ease;
	transition: all 0.45s ease;
}

.snip1543:before {
	-webkit-transform: skew(30deg) translateX(-80%);
	transform: skew(30deg) translateX(-80%);
}

.snip1543:after {
	-webkit-transform: skew(-30deg) translateX(-70%);
	transform: skew(-30deg) translateX(-70%);
}

.snip1543 figcaption {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 1;
	bottom: 0;
	padding: 130px 40% 25px 20px;
}

.snip1543 figcaption:before,
.snip1543 figcaption:after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #f00006;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
	content: '';
	opacity: 0.5;
	z-index: -1;
}

.snip1543 figcaption:before {
	-webkit-transform: skew(30deg) translateX(-100%);
	transform: skew(30deg) translateX(-100%);
}

.snip1543 figcaption:after {
	-webkit-transform: skew(-30deg) translateX(-90%);
	transform: skew(-30deg) translateX(-90%);
}

.snip1543 h3,
.snip1543 p {
	margin: 0 0 20px 0;
	opacity: 1;
	letter-spacing: 1px;
}

.snip1543 h3 {
	font-family: 'IBM Plex Serif', serif;
	font-size: 36px;
	font-weight: 700;
	line-height: 1em;
	text-transform: lowercase;
	text-align: left;
}

.snip1543 p {
	font-size: 0.7em;
	text-align: left;
}

.snip1543 a {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 1;
}

.snip1543:hover h3,
.snip1543.hover h3,
.snip1543:hover p,
.snip1543.hover p {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	opacity: 0.9;
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.snip1543:hover:before,
.snip1543.hover:before {
	-webkit-transform: skew(30deg) translateX(-20%);
	transform: skew(30deg) translateX(-20%);
	-webkit-transition-delay: 0.05s;
	transition-delay: 0.05s;
}

.snip1543:hover:after,
.snip1543.hover:after {
	-webkit-transform: skew(-30deg) translateX(-10%);
	transform: skew(-30deg) translateX(-10%);
}

.snip1543:hover figcaption:before,
.snip1543.hover figcaption:before {
	-webkit-transform: skew(30deg) translateX(-40%);
	transform: skew(30deg) translateX(-40%);
	-webkit-transition-delay: 0.15s;
	transition-delay: 0.15s;
}

.snip1543:hover figcaption:after,
.snip1543.hover figcaption:after {
	-webkit-transform: skew(-30deg) translateX(-30%);
	transform: skew(-30deg) translateX(-30%);
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}


/*----------- End Square02 Section -------------*/


/*----------- Square Section -------------*/

.cDarkBlue {
	background-color: #1e1e36;
}

.cLightBlue {
	background-color: #0054a6;
}

.spacer {
	height: 20px;
}

#square {
	padding: 20px 0px 20px 0px;
}

.text01,
.text02,
.text03,
.text04 {
	color: #ffffff;
	padding: 33px;
	height: 287px;
}

.text-title {
	font-family: 'IBM Plex Serif', serif;
	font-size: 2em;
	line-height: 0.75em;
}

.text-main {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 0.37em;
	line-height: 1.1em;
	text-align: justify;
}

.leftside,
.rightside,
.pics {
	padding: 0px;
}


/*------------ End Square Section --------*/


/*============================================= Appointment ======================================================*/

.appointment {
    padding: 60px 0px 60px 0px;
    background-color: #564d4d;
}

.appointment h2,
h3,
p {
	text-align: center;
	color: #ffffff;
}

button.btn.btn-primary.app {
	background-color: #25aae1;
	color: #ffffff;
	border-radius: 20px;
	padding: 10px 40px;
	width: 14%;
	margin-left: 0px;
}


/*============================================= End Appointment ======================================================*/


/*============================================= Footer ======================================================*/

footer.footer {
	background-color: #212121;
	color: #9b9b9b;
	font-size: 0.8em;
}

#footer {
	padding: 25px;
}

footer.footer a {
	padding: 0px 10px;
}

footer.footer a:active,
a:hover {
	outline: 0;
	color: #fff;
}

.footer-link {
	position: absolute;
	margin-left: 6px;
}

.social img {
	width: 25%;
	margin-top: -7px;
}

.copyright {
	background-color: #000000;
	padding: 10px 0px;
}

.sideMenuhide img {
	position: fixed;
	right: 0%;
	bottom: 20%;
	width: 4%;
	height: auto;
	cursor: pointer;
	z-index: 999;
	transition: all .4s linear;
}


/*=============================================================== End Footer ======================================================*/


/*=============================================================== About ======================================================*/

#about {
	padding: 20px 0px 20px 0px;
}

.serv-text {
	padding: 20px;
	color: #fff;
}


/*=============================================================== End About ======================================================*/


/*=============================================================== Services ======================================================*/

.pad5 {
	padding: 5px;
}

#services {
	background: url(/theme/Admin_BS/imgs/services_bg.jpg)top center no-repeat;
	background-size: cover;
}

.serv-pics {
	margin-left: -4%;
	padding: 0px;
}

#services .snip1543 {
	background-color: #fff;
	color: #ffffff;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 16px;
	margin: 0px 0px;
	max-width: 100%;
	overflow: hidden;
	position: relative;
	text-align: left;
	width: 100%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	max-height: 240px;
}

#services .snip1543 figcaption {
	position: absolute;
	top: -106px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 1;
	bottom: 0;
	padding: 124px 22% 25px 20px;
}


/*------------- aircond services --------------*/

#aircond {
	padding: 20px 0px 20px 0px;
	background: url(/theme/Admin_BS/imgs/aircond_bg.jpg);
	background-size: cover;
}

.aircond-text {
	color: #fff;
}

.aircond-pics {
	margin-left: -3.5%;
	padding: 0px;
}


/*------------- engine services --------------*/

#engine {
	padding: 20px 0px 20px 0px;
	background: url(/theme/Admin_BS/imgs/aircond_bg.jpg);
	background-size: cover;
}

.engine-text {
	color: #fff;
}

.engine-pics {
	margin-left: -3.5%;
	padding: 0px;
}


/*------------- engine services --------------*/

#others {
	padding: 20px 0px 20px 0px;
	background: url(/theme/Admin_BS/imgs/others_bg.jpg);
	background-size: cover;
}

.others-text {
	color: #fff;
}

.others-pics {
	margin-left: -3.5%;
	padding: 0px;
}


/*=============================================================== End Of Services ======================================================*/


/*=============================================================== Location ======================================================*/

#location {
	padding: 20px 0px 0px 0px;
}

#location .container-fluid {
	padding: 0px;
}

.loc-pics {
	margin-left: -3.5%;
	padding: 0px;
	position: absolute;
	top: 3.2%;
	left: 0;
}

#map {
	margin-top: -68px;
}

.map-location {
	position: relative;
	margin-left: 40%;
	margin-top: -3.2%;
}

.overlapped-text {
	position: absolute;
	background-color: rgba(0, 0, 0, 0.5);
	width: 19%;
	z-index: 99;
	bottom: -5px;
	left: 54%;
	padding: 16px;
	font-family: sans-serif;
	font-size: 0.7em;
	letter-spacing: 1.5px;
	color: #fff;
}


/*=============================================================== End Of Location ======================================================*/


/*=============================================================== Contact Us ======================================================*/

#contactus {
	padding: 20px 0px 0px 0px;
}

.contact-text {
	color: #fff;
}

.contact-pics {
    margin-left: -3.5%;
    padding: 0px;
    top: -5px;
}


/*=============================================================== End Contact Us ======================================================*/


/*=============================================================== Product ======================================================*/

#productpage {
	padding: 20px 0px 20px 0px;
	background: #000;
}

#template-prodcat ul.prodnav.list-inline {
	display: none;
}

#template-prodcat select.form-control.cms-sel-categories {
	width: 30%;
}

#opt-sortby ul.list-inline.clearfix {
	display: none;
}

#opt-pricerange {
	display: none;
}

#qty .caption {
	display: none;
}

.prodnav {
	display: none;
}

#template-prod> ul.prodlist li {
	width: 33%;
	display: inline-block;
}

#template-prod .w3-card {
	background-color: #fff;
	margin:4px 4px;
}

.price.w3-container._transition {
	background-color: #5b5a5a;
	color: #fff;
	padding: 1.01em 16px;
}

.addcart.w3-container._transition {
	background-color: #000000;
	padding: 0.5em;
}

header.w3-container._transition {
	background-color: #393131;
	color: #fff;
}

footer.w3-container._transition {
	background-color: #ed3439;
	color: #fff;
	height: 30px;
	display: none;
}

footer.w3-container._transition h6 {
	font-size: 0.9em;
	margin-top: 6px;
}

section.desc.w3-container._transition {
	background-color: #5c5b5b;
	color: #fff;
	padding: 5%;
	font-family: 'Source Sans Pro', sans-serif;
	line-height: 1.5em;
	height: 100px;
}

.prodlist .w3-container {
	padding: 0.01em 5px;
}

.prodlist .thumb img {
	margin-bottom: 0px;
}

.thumb.w3-container {
	text-align: center;
}

#productpage .btn-primary {
	color: #fff;
	background-color: #010101;
	border-color: #010101;
	width: 100%;
	margin-left: 0;
}

#productpage .btn-primary:hover {
	color: #fff;
	background-color: #010101;
	border-color: #010101;
}

.page-prod {
	background: url(/theme/Admin_BS/imgs/prod_bg.jpg)top center no-repeat;
	background-size: cover;
}

.particular {
	padding: 0;
	position: relative;
	margin: 0;
	left: 104px;
}

.particular .title {
	border: 0px solid green;
	margin-bottom: -6%;
	color: #dc143c;
	word-wrap: break-word;
	width: 230px;
	height: 360px;
}

.message {
	position: absolute;
	width: 22%;
	top: 21.2%;
	left: 42.4%;
	float: right;
	z-index: 999;
	border-top: 1px dashed #a5a5a5;
	border-bottom: 1px dashed #a5a5a5;
	padding: 20px 0px 20px 0px;
	font-size: 0.8em;
	line-height: 18px;
	letter-spacing: 1px;
	color: #000;
}

.input-group {
	position: relative;
	display: table;
	border-collapse: separate;
	width: 260px;
}

.btn.btn-primary.addtocart {
	background-color: #000000;
	width: 260px;
	border-radius: 15px;
	border-color: #686868;
	border: none;
	position: relative;
	margin-left: 0;
}

#cms-prod-view {
	clear: both;
	position: relative;
	margin-top: 40px;
}

#cms-prod-view .particular .value {
	word-wrap: break-word;
	width: 40%;
}

#cms-prod-view .particular .list-inline> li {
	margin: 10px -5px -5px 0px;
	display: block;
}
.opt-group {
    color: #fff;
}
.col-sm-offset-2.col-sm-10.value {
    margin-left: 0;
}
/*=============================================================== enquiry ======================================================*/

.shoppingcart {
	padding: 20px 0px;
}


/*=============================================================== end enquiry ======================================================*/


/*=========================================================== BIG SCREEN SETTING  ==================================================*/


@media screen and (max-width: 1920px) and (min-width: 1800px) {


/*==================================== Location ===================================*/

#map {
    margin-top: 59px;
    height: 755px!important;
}
.map-location {
    position: relative;
    margin-left: 39%;
    margin-top: -3.2%;
}
.overlapped-text {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    width: 16%;
    z-index: 99;
    bottom: 35px;
    left: 50%;
    padding: 16px;
    font-family: sans-serif;
    font-size: 0.7em;
    letter-spacing: 1.5px;
    color: #fff;
}
.loc-pics {
	margin-left: -3.5%;
	padding: 0px;
	position: absolute;
	top: 7%;
	left: 0;
}
}



/*=========================================================== Mobile View  ==================================================*/
@media all 
and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) 
and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) 
and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) 
and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) 
and (max-width: 1024px), only screen and (min-resolution: 192dpi) 
and (max-width: 1024px), only screen and (min-resolution: 2dppx) 
and (max-width: 1024px) {

/*---------------------------- Navigation ---------------------------*/
.navbar-brand img {
    left: -80px;
    max-width: 60%;
}
#navbar {
    margin-left: 0%;
    min-height: 375px;
}
.navbar-nav {
    margin: 7.5px 0px;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: transparent !important;
}
.navbar-collapse {
    padding-left: 0px !important;
} 

/*---------------------------- End Navigation ---------------------------*/

/*---------------------------- Home ---------------------------*/

.snip1543 h3,
.snip1543 p {
	margin: 0 0 20px 0;
	opacity: 1 !important;
	letter-spacing: 1px;
}
/*---------------------------- Appointment ---------------------------*/
button.btn.btn-primary.app {
    width: auto;
}

/*---------------------------- Footer ---------------------------*/

#footer {
    padding: 20px;
}
.footer-link {
    position: relative;
    margin-left: 0px;
    text-align: center;
}
.pull-right {
    float: none !important;
    text-align: center;
}
.social img {
    width: 10%;
    margin-top: 7px;
    margin-left: -16px;
}
.sideMenuhide img {
    bottom: 33%;
    width: 15%;
}
/*---------------------------- End Home ---------------------------*/

/*---------------------------- About ---------------------------*/
.serv-pics {
    margin-left: -10%;
}
.serv-text, .aircond-text, .engine-text, .orthers-text, .contact-text {
    padding: 10px;
}
/*---------------------------- End About ---------------------------*/

/*---------------------------- Services ---------------------------*/
#services, #aircond, #engine, #others{
    background: transparent;
}
/*---------------------------- End Services ---------------------------*/
/*---------------------------- Location ---------------------------*/
.map-location {
    position: relative;
    margin-left: 0%;
    margin-top: 80.8%;
}
.overlapped-text {
    width: 37%;
    bottom: -142px;
    left: 64%;    
}
/*---------------------------- End Location ---------------------------*/
/*---------------------------- Contact ---------------------------*/

.contact-pics {
    margin-left: -9%;
    padding: 0px;
}
/*---------------------------- End Contact ---------------------------*/

/*---------------------------- Product ---------------------------*/
#template-prod> ul.prodlist li {
    width: 100%;
    display: inline-block;
}
#template-prodcat select.form-control.cms-sel-categories {
    width: 97%;
}
.particular {
    left: 4%;
}
.particular .title {
    margin-bottom: 20px;
    width: 90%;
    height: auto;
}
.message {
    position: relative;
    width: 80%;
    margin: 28px;
    top: 0;
    left: 0;
    float: none;
}

}


/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 800px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 


.navbar-header {
    height: 75px;
}
.navbar-toggle {
    margin-top: 21px;
}
#cms-prod-view .photo {
    width: 46%;
}




/*---------------------------- Home ---------------------------*/ 	
#square02 .col-md-3 {
    width: 49%;
    display: inline-block;
}  	
  	
.col-md-6.leftside {
    width: 47%;
    height: auto;
    padding: 0px;
    display: inline-block;
    float: left;
}
.col-md-6.rightside {
    width: 47%;
    height: auto;
    padding: 0px;
    display: inline-block;
		float: left;
}  	
  	
/*---------------------------- Footer ---------------------------*/ 		
 .social img {
    width: 5%;
}    
.copyright {
    text-align: center;
}
.sideMenuhide img {
    bottom: 43%;
    width: 10%;
} 	

/*---------------------------- Services ---------------------------*/ 
#services .row01 {
	Width:49%;
	display:inline-block;
}
#services .row02 {
	Width:49%;
	display:inline-block;
}
/*---------------------------- Location ---------------------------*/ 
.map-location {
    margin-top: 71.8%;
}
.overlapped-text {
    width: 25%;
    bottom: -127px;
    left: 75%;
}

/*---------------------------- Product ---------------------------*/ 
#productpage .col-sm-4 {
    width: 48%;
    display: inline-block;
}
#template-prod> ul.prodlist li {
    width: 48%;
}
#template-prodcat select.form-control.cms-sel-categories {
    width: 47%;
}
#cms-prod-view .particular .value {
    width: 100%;
}

.particular {
    left: 350px;
    top: -221px;
}
.particular .title {
    width: 40%;
}
.message {
    width: 38%;
    top: -235px;
    left: 326px;
}
}


/*==================================   iPHONE 5   =====================================*/ 
/* Portrait */
@media screen 
  and (min-device-width: 320px) 
  and (max-device-height: 568px) 
  and (-webkit-device-pixel-ratio: 2) 
  and (orientation: portrait) {

.map-location {
   margin-top: 79.8%;
}
.overlapped-text {
   bottom: -172px !important;
}

}
/* Landscape */
@media screen 
  and (min-device-width: 320px) 
  and (max-device-height: 320px) 
  and (-webkit-device-pixel-ratio: 2) 
  and (orientation: landscape) {


.particular {
    left: 276px ;
    top: -196px ;
}
.message {
    top: -213px;
    left: 253px;
}
#map {
    margin-top: -59px;
}
.overlapped-text {
    bottom: -142px;
}

#cms-prod-view .photo {
    width: 46%;
}

}



/*==================================   iPHONE X   =====================================*/ 
/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 823px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
 
/*---------------------------- Navigation ---------------------------*/ 

#navbar {
    min-height: 0;
    margin-left: 91px !important;
}
.navbar-brand img {
    left: -138px !important;
}
.navbar-nav {
    margin:0;
}


/*---------------------------- Home ---------------------------*/ 


#square02 .col-md-3 {
    width: 49%;
    display: inline-block;
}
.col-md-6.leftside {
    width: 47%;
    height: auto;
    padding: 0px;
    display: inline-block;
    float: left;
}
.col-md-6.rightside {
    width: 47%;
    height: auto;
    padding: 0px;
    display: inline-block;
		float: left;
} 
.text01,
.text02,
.text03,
.text04 {
	color: #ffffff;
	padding: 33px !important;
	height: 287px !important;
}


/*---------------------------- Services ---------------------------*/ 


#services .col-md-6 {
    width: 40% !important;
    display: inline-block !important;
}

/*---------------------------- Location ---------------------------*/ 

#map {
    margin-top: -187px;
}



#cms-prod-view .photo {
    width: 46%;
}
}

/*==================================   iPAD   =====================================*/ 

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

/*---------------------------- Navigation ---------------------------*/ 

#navbar {
    min-height: 0;
    margin-left: 93px;
}
.navbar-brand img {
    left: -145px;
}
.navbar-nav {
    margin:0;
}

/*---------------------------- Home ---------------------------*/ 

#square02 .col-md-3 {
	width:45%;
	display:inline-block;
}
.col-md-6.leftside {
    width: 48%;
    height: auto;
    padding: 0px;
    display: inline-block;
}
.col-md-6.rightside {
    width: 48%;
    height: auto;
    padding: 0px;
    display: inline-block;
}


/*---------------------------- Footer ---------------------------*/ 
.social img {
    width: 5%;
}
.sideMenuhide img {
    bottom: 16%;
    width: 9%;
}
/*---------------------------- Services ---------------------------*/

.serv-text {
    padding-top: 20px;
    width: 100%;
}
#services .row01 {
	Width:49%;
	display:inline-block;
}
#services .row02 {
	Width:49%;
	display:inline-block;
}
.aircond-text {
    width: 100%;
    padding: 65px 10px 58px 10px;
}
.engine-text {
    width: 100%;
    padding: 65px 10px 58px 10px;
}
.others-text {
    width: 100%;
    padding: 65px 10px 58px 10px;
}
/*---------------------------- Location ---------------------------*/
.overlapped-text {
    width: 22%;
    bottom: -128px;
    left: 78%;
}
/*---------------------------- Product ---------------------------*/
#productpage .col-sm-4 {
    width: 48%;
    display: inline-block;
}
#template-prod> ul.prodlist li {
    width: 48%;
}
#template-prodcat select.form-control.cms-sel-categories {
    width: 47%;
}
#cms-prod-view .particular .value {
    width: 100%;
}

.particular {
    left: 85px;
    top: 0px;
}
.particular .title {
    width: 48%;
}
.message {
    width: 38%;
    left: 312px;
}


}
/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {


/*---------------------------- Navigation ---------------------------*/ 

#navbar {
    min-height: 0;
    margin-left: 260px;
}
.navbar-brand img {
    left: 0px;
}
.navbar-nav {
    margin:0;
}
/*---------------------------- Home ---------------------------*/ 

.text01, .text02, .text03, .text04 {
    color: #ffffff;
    padding: 33px;
    height: 236px;
}

/*---------------------------- Footer ---------------------------*/ 
.social img {
    width: 3%;
}
.sideMenuhide img {
    bottom: 21%;
    width: 6%;
}

/*---------------------------- Services ---------------------------*/ 
#services .col-md-6 {
    width: 40%;
    display: contents;
}

/*---------------------------- Location ---------------------------*/ 
.overlapped-text {
    width: 23%;
    bottom: 2px;
    left: 55%;
}
.loc-pics {
    width: 76%;
}
.map-location {
    margin-left: 41%;
    margin-top:0;
}
/*---------------------------- Product ---------------------------*/ 

#productpage .col-sm-4 {
    width: 48%;
    display: inline-block;
}
#template-prod> ul.prodlist li {
    width: 48%;
}
#template-prodcat select.form-control.cms-sel-categories {
    width: 47%;
}
#cms-prod-view .particular .value {
    width: 100%;
}

.particular {
    left: 85px;
    top: 0px;
}
.particular .title {
    width: 48%;
}
.message {
    width: 27%;
    left: 383px;
}
#cms-prod-view .photo {
    width: 100%;
}

}

/*==================================   iPAD PRO   =====================================*/ 

@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {


/*---------------------------- Home ---------------------------*/ 

.text01, .text02, .text03, .text04 {
    color: #ffffff;
    padding: 33px;
    height: 227px;
}
/*---------------------------- Footer ---------------------------*/ 
.sideMenuhide img {
    bottom: 21%;
    width: 9%;
}
/*---------------------------- Location ---------------------------*/ 
.overlapped-text {
    width: 23%;
    bottom: 2px;
    left: 55%;
}
.loc-pics {
    width: 76%;
    top:2%;
}
.map-location {
    margin-left: 41%;
    margin-top:0;
}
}

@media only screen 
  and (min-device-width: 1366px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {


/*---------------------------- Location ---------------------------*/ 
.loc-pics {
    margin-left: -3.5%;
    padding: 0px;
    position: absolute;
    top: 1.8%;
    left: 0;
}


#cms-prod-view .photo {
    width: 46%;
}
}