@media (min-width: 768px){ /* Style for Desktop and Tablet*/
	.header-wrap .icon-talk{ display:none}
	.mobile-menu-btn{ display:none}
}
@media (min-width: 993px){ /* Style for Desktop and Tablet*/
	.btn-device{ display: none; }
	.section-business-detail .section-header .icon-section-line{ display: none; }
}
 
@media (max-height: 900px) {
	.product-category{ height: 650px }
} 
@media (min-width: 993px) and (max-width: 1400px) {
	.navbar-nav > li > a{ padding: 0 15px; }
	.business-wrap{
		padding-left: 20px;
		padding-right: 20px
	}
	.business-wrap [class^="col"] {
	   padding-left: 20px;
	   padding-right: 20px;
	}
	.business-item{ margin-bottom: 40px }	
	.business-item h2{ 
		height: 70px;
		font-size: 20px;
		line-height: 25px;
	}
	.business-item.horizontal h2{
		font-size: 30px;
		line-height: 40px;
	}
	.business-item.horizontal h2 span{ padding-left: 50px }

	.section-business .section-header {
	    margin-bottom: 100px;
	    margin-top: 30px;
	}

	.modal-info .carousel-control.left {left: -80px;}
	.modal-info .carousel-control.right {right: -80px;}

	.section-about-company table tr td {
	    font-size: 13px;
	    padding-bottom: 5px;
	}
	.contact-address-wrap{ height: 470px }
	.company-info{ width: 400px }
	.section-about-company table tr td:first-child{ width: 155px; }
	.company-logo .img{ width: 220px }
}

@media (min-width: 993px) and (max-width: 1200px) {
	.container-fluid{
		padding-left:30px;
		padding-right:30px;  
	}
	
	.navbar-nav > li > a{
		padding: 0 10px;
		font-size:12px;
	}
	.logo-wrap{
		display: block;
		width: 310px;
	}
	.header .eco-image{ margin-left:10px; width: 130px }


	
}


@media (min-width: 768px) and (max-width: 992px) { /* Style for Tablet*/

	.container-fluid {
	    padding-left: 20px;
	    padding-right: 20px;
	}


	.title{
	 	font-size: 50px;
	 	line-height: 40px;
	}
	.section-home .article-box{
		font-size:16px;
		line-height: 25px; 
	}
	.contact-item h3{
		font-size: 20px;
    	line-height: 30px;
	}

	.section-banner .eco-image{ max-width: 250px; left: 20px}
	.section-banner .eco-image img{ width: 100% }

	.section-eco .article-box .title-img img{ max-width:60% }
	
	.featured-item.small{ height: 226px }


	.product-item{ padding-top: 25px; }
	.product-item .photo{
		height: 70px;
		padding: 10px 0
	}
	.product-item .photo img{ max-height: 70px; }
	.product-item .name{ height: 50px }

	.product-item.category,
	.product-item.category .photo{ height: 180px; }
	.product-item .zoom{ height: 40px }
 

	.section-reference .container-fluid{
		padding-left: 40px;
    	padding-right: 40px; 
	}
	.reference-wrap {
	    padding-left: 0;
	    padding-right: 0;
	}
	.reference-wrap [class^="col"] {
	    padding-left: 10px;
	    padding-right: 10px;
	    margin-bottom: 20px;
	} 

	.installation-detail{ line-height: 25px; font-size: 15px }

	.contact-address-wrap{
		height: 470px; 
	}
	.contactus-item p{
		padding-left:30px;
		font-size: 14px
	}
	.contactus-item.left p {width: 165px;}
	.contactus-item.center p {width: 230px;}
	.contactus-item.right p {width: 179px;}

	.section-contact-form .left {padding: 40px 45px;}
	.form-contact .buttons{ text-align: center; }
	.form-contact .buttons .btn{ width: 110px }
	.map{ height: 470px }
 
 	
 	.business-wrap .row {
	    margin-left: -15px;
	    margin-right: -15px;
	}
	.business-wrap [class^="col"] {
	   padding-left: 25px;
	   padding-right: 25px;
	}
	.business-item{ margin-bottom: 50px }	
	
	.business-item.horizontal h2 span{ padding-left: 50px }

	.section-business .section-header {
	    margin-bottom:70px;
	    margin-top: 0;
	}

	.business-category-item .caption span{
		font-size: 16px;
		line-height: 21px;
		max-width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}

	.section-header h2{
		font-size: 42px;
		line-height: 42px;
	}
	.section-header .icons { 
	    margin: 20px auto 0 !important;
	}
	.section-header p{ 
		margin-top: 10px;
		font-size: 16px;
	}

	.section-business-detail .section-header h2{
		 font-size: 46px;
		 float: none;
	}
	.section-business-detail .section-header h2:before{ display: none;}
	.section-business-detail .section-header h2 .icon-section-line{ display:inline-block; }
	.business-item h2{ 
		height: 70px;
		font-size: 18px;
		line-height: 23px;
	}
	.section-business-detail .section-header h3{
		font-size: 25px;
		line-height: 30px;
		text-align: center;
		margin-top: 55px;
		margin-bottom:20px; 
	}
	.section-business-detail .section-header{ padding: 0 }
	.business-item.horizontal h2{
		font-size: 25px;
		line-height: 35px;
	}
	.section-business .section-header p{ margin-top: 15px }
	.contact-address-wrap .section-header .icons{ margin-top:30px !important  }

	.modal-info .modal-content{max-width: 730px;}
	.modal-info .carousel-control{
		-webkit-transform: scale(0.7,0.7);
		transform: scale(0.7,0.7);
	}
	.modal-info .carousel-control.left {left: -80px;}
	.modal-info .carousel-control.right {right: -80px;}

	.news-item.horizontal{ height: 239px }
	.news-item.horizontal .detail{ padding:25px }
	.news-item.horizontal h2{ margin-bottom: 10px; }
	.news-item.horizontal .readmore{margin-top: 10px;}
	.news-item.horizontal .detail .wrap{ height: 154px }

	.news-modal-detail .detail {padding: 40px 40px;}

	.section-about-company .left,
	.section-about-company .right{ height: 480px }
	
	.company-logo .img{ width: 220px }

	.section-company-item [class^="col"].item3{float: right;}

	.section-business-detail .section-header article{ 
		padding-left: 10px; 
		padding-right: 10px;
		width: auto; 
	}
	.section-business-thumb [class^="col"] {
	    margin-bottom: 20px;
	    padding-left: 10px;
	    padding-right: 10px;
	}

	.business-logo img{
		-webkit-transform: scale(0.6);
		transform: scale(0.6);
	}

}

 
@media (max-width: 992px){
	/*body{ background: #7fa177  }*/
	.header{
		position: fixed;
	}
	.page {
		background: #fff;
		float: left;
		width: 100%;
	}
	.header{ padding: 10px 0 }
	.header .eco-image{ top:14px;  margin-left: 5px}
	.header-bar{ height: 58px }
	.logo-site a{ width: 70px }
	.news-item .photo .date{
		font-size: 14px;
		height:35px;
		line-height: 35px;
		padding: 0 15px;
	}
	.news-item .photo .date .icons{ top:9px}

	.section-about-banner{ padding-top: 58px; }

	.section-footer{ text-align: center; }
	.section-footer .copyright{ text-align: center; }
	.section-footer .followus{
		float: none;
		display: inline-block;
		margin-top:20px; 
	}

	.section-about-company table tr td {
	    font-size: 14px;
	    padding-bottom: 5px;
	    vertical-align: top;
	    display: block;
	    width: 100%;
	    padding-bottom: 8px;
	}
	.section-about-company table tr td:first-child{
		font-weight: 500;
		padding-bottom: 0
	} 
	.section-about-company h2{ 
		margin-bottom: 15px;
		font-size: 20px;
	}
	.company-info{ 
		width: 265px;
		padding: 50px 0 0 
	}

	.contact-address-wrap{ padding-top: 58px }

	
	
}
@media (max-width: 767px){
	.container-fluid{
		padding-left: 15px;
		padding-right: 15px
	}
	 
	.title{
	 	font-size: 30px;
	 	line-height:35px;
	}

	.title-line{ 
		margin-bottom:15px;
		font-size: 20px;
	}
	.title-line span{ padding:0 15px  }

	.section-eco .article-box .title-text{
		font-size: 20px;
		line-height: 30px;
		margin-bottom: 20px
	}
	.section-eco .article-box .title-text.big{
		font-size: 25px;
		line-height: 35px; 
	}
	.section-home .article-box p{ margin-bottom: 15px; }

	.section-home {
	    padding-bottom:40px;
	    padding-top:40px;
	}

	.section-banner .eco-image{ display: none; }
	.section-home .article-box{
		font-size:14px;
		line-height: 25px; 
	}
	.section-home .article-box .title-large{ margin-bottom: 13px }
	.section-home .article-box .buttons{ margin-top:15px }
	.section-home .article-box .btn-seemore {margin-top: 5px;}

	.section-about-banner{ height: auto !important; }
	.section-about-banner .section-header{
		padding-top: 40px;
		padding-bottom: 30px;
		top:0; 
	 -webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
	}
	.section-about-banner .section-header p{ margin:15px auto 15px  }

	.scrollto-target{ display: none; }

	.section-our-business{ background-position:0 -70px; padding-bottom: 25px }
 	.section-our-business:before{ display: none; }

	.section-news-event{ margin-top:15px  }
	.section-news-event .buttons{margin-top: 30px;}
	.section-news-event:before{ display: none; }

	.news-item{ margin-bottom:30px;  }
	.news-item h2{
		margin: 20px 0 10px
	}

	.section-featured{ padding-bottom: 30px }
	.featured-item{ margin-bottom: 20px }
 
	.section-eco {
		padding-top: 50px;
		padding-bottom:35px;
	}
	.section-eco .article-box .title-img{ padding:0 10px; margin-bottom:30px  }

	

	.section-our-product .article-box .icon-logo{ display: none; }
	.section-our-product .article-box .buttons{margin-bottom: 10px; }

	.installation-wrap [class^="col"]{ margin-bottom:30px  } 


	.section-contact {
		padding-top: 70px;
	    padding-bottom:20px;
	}

	.contact-item{ margin-bottom:40px  }
	
	.contact-address-wrap{ height: 380px }

	.contact-item-wrap{ padding-top: 40px; padding-bottom: 40px }

	.map{ height: 380px }

	.title-form{
		font-size: 18px;
		line-height: 20px;
	}
	.btn-modal-close{
		width: 30px;
		height: 30px;
	}
	.btn-modal-close .icons{top: 7px}
	.modal{/* right: 10px; left: 10px; */}
	.modal-catalog .modal-body{ padding:30px 15px 15px; }



	.modal-fullscreen.modal {
	    left: 0;
	    right: 0;
	}

	.form-catalog .buttons{ margin-top:20px  }

	.form-success h3{
		font-size: 18px;
		line-height: 20px;
		margin-top:34px 
	}
	.form-success .buttons{ margin-top:40px  }

	.section-body { 
	    padding-bottom: 40px;
	    padding-top: 40px;
	}
	.section-header { 
	    margin-bottom: 40px; 
	}
	.product-wrap .row{
		margin-left:-5px; 
		margin-right:-5px;
	}
	.product-wrap [class^="col"] {
	    padding-left: 10px;
	    padding-right: 10px;
	}
	
	.pagination{ margin-top: 40px }
	.pagination > li > .text{ padding: 0 10px }
	.pagination > li > .prev{ margin-right:10px  } 
	.pagination > li > .dot{ margin-left: 10px; }

	.section-reference .container-fluid{
		width: auto;
		padding-left:15px; 
		padding-right:15px; 
	}
	.reference-wrap {
	    padding-left: 0;
	    padding-right: 0;
	}
	.reference-wrap [class^="col"] {
	    padding-left: 0;
	    padding-right: 0;
	     margin-bottom: 30px
	}
	.reference-wrap .pagination{ margin-top:30px  }
 

	.contactus-item{
		display: block;
		margin: 20px auto;
		width: 250px;
	}
	.contactus-item p{ display: block; }
	.contactus-item.left,
	.contactus-item.center,
	.contactus-item.right{
		text-align: left; 
		display: block;
	}

	.contact-address-wrap .section-header .icons{ margin-top:30px !important  }

	.section-contact-form .left { 
	    padding: 30px 15px;
	}
	.form-contact .buttons{ text-align: center; }

	.business-wrap [class^="col"] {
	    padding-left: 0;
	    padding-right: 0;
	}
	.business-item{ margin-bottom: 30px }
	.business-item.vertical{ height: auto !important; }

	.business-item.horizontal h2{
		 font-size: 18px;
    	line-height: 23px;
	}
	.business-item.horizontal h2 span{ padding-left: 20px }

	.section-header h2{
		font-size:30px;
		line-height:35px;
	}
	.section-header .icons { 
	    margin: 15px auto 0 !important;
	}
	.section-header p{ 
		margin-top: 15px;
		font-size: 14px;
    	line-height: 20px;
	}
	.business-item h2{ 
		height: 70px;
		font-size: 18px;
		line-height: 23px;
	}
	.business-item.horizontal h2{
		font-size: 25px;
		line-height: 35px;
	}
	.section-business .section-header{
		margin-top:0px;
		margin-bottom: 40px;
		padding-left: 25px;
		padding-right: 25px;
	}
	.section-business .section-header p{ margin-top: 15px }

	.modal-header h2{
		font-size: 25px;
		line-height: 30px;
	}
	.modal-header h4{ font-size: 16px }
	.modal-header .icons {margin: 25px 0 35px;}
	.reference-gallery img{ margin-bottom:30px  }
	.reference-gallery img:last-child{ margin-bottom:0  }

	.product-category{ height:400px }
	.modal-info .carousel-control{
		-webkit-transform: scale(0.5,0.5);
		transform: scale(0.5,0.5);
		opacity: 0.3
	}
	.modal-info .carousel-control.left {left: -10px;}
	.modal-info .carousel-control.right {right:-10px;}

	.news-item.horizontal{ height: auto; margin-bottom: 30px }
	.news-item.horizontal .photo{ width: 100%; }
	.news-item.horizontal .detail{ width: 100%; padding:30px }
	.news-item.horizontal h2{ margin-bottom: 15px; }
	.news-item.horizontal .readmore{margin-top: 15px;}
	.news-item.horizontal .detail .wrap{ height: auto; }

	#newsModal.modal-info{
		left: 0;
		right: 0;
	}
	.news-modal-detail .detail{
		padding:35px 20px;
	}

	#newsModal.modal-info .carousel-control{ top: 10% }
	#newsModal.modal-info .carousel-control{ opacity: 1 }

	.section-about-company .left{ height: auto }
	.section-about-company .right{ height: 350px}

	.company-info{
		padding: 50px 0 40px
	}
	.company-logo .img{ max-width: 200px }

	.news-item-wrap .navigation{ margin-top: -15px }

	.total-slides-wrap,
	.flex-direction-nav{ display: none !important; }

	.business-category-item .caption span{
		font-size: 16px;
		line-height: 23px;
		/*max-width: 100%;*/
		padding-left: 15px;
		padding-right: 15px;

	}
	.section-business-detail .section-header{ padding: 0 }

	.section-business-detail .section-header h2{
		font-size: 30px;
    	line-height: 35px;
		float: none;
	}
	.section-business-detail .section-header h2:before{ display: none;}
	.section-business-detail .section-header h2 .icon-section-line{ display:inline-block; }
	.business-item h2{ 
		height: 70px;
		font-size: 18px;
		line-height: 23px;
	}
	.section-business-detail .section-header h3{
		font-size: 20px;
		line-height: 30px;
		text-align: center;
		margin-top: 30px;
		margin-bottom:10px; 
	}

	.fancybox-buttons .fancybox-nav:hover {background-color: rgba(255,255,255,0);}
	.section-business-thumb {
	    padding-left: 0;
	    padding-right: 0;
	}

	.section-business-thumb [class^="col"] {
	    margin-bottom: 30px;
	    padding-left: 0;
	    padding-right: 0;
	}

	.business-detail{ padding-bottom: 20px; }
	.business-detail p{ margin-bottom: 0 }

}
@media (max-width: 600px){
	.section-footer{
		padding:30px 0 
	}
	.section-footer .followus{ margin-top: 30px }
	.section-footer .copyright span,
	.section-footer .copyright a{
		display: block;
	}

	.installation-detail{ 
		line-height: 25px; 
		font-size: 15px
	}
	.installation-detail .number{
		width: 40px;
		height: 40px;
		font-size: 20px;
		line-height: 40px;
	}
	.installation-detail p{
		padding-left:55px 
	}

	.header .eco-image{ display: none; }

	 
}
@media (max-width: 480px){
	 .form-catalog .btn{
	 	width: 100px;
	 	font-size: 14px;
	 	padding:0 
	 }

	 .product-wrap .row{
		margin-left:0; 
		margin-right:0;
	}
	.product-wrap [class^="col"] {
	    padding-left: 0;
	    padding-right: 0;
	    width: 100%
	}

	.section-header h2{
		 font-size: 30px;
    	line-height: 35px;
	}
	.section-header .icons { 
	    margin: 15px auto 10px;
	}
	.section-header p {
	    font-size: 14px;
	    line-height: 20px;
	}

	.pagination > li > a,
	.pagination > li > span {
		height: 25px;
		width: 25px;
		line-height: 25px;
	}
	.pagination > li > .text {
		padding: 0 5px;
		width: 15px;
		height: 25px;
	}
	.pagination > li > .text > span{ display: none; }
	.pagination > li > .dot{ display: none; }
	.pagination > li > .prev{ margin-right:0px  } 
	.pagination > li > .next{ margin-left:0px  } 
	.pagination > li > a > .arrow{ display: block; }

	.installation-detail{ 
		padding-top: 20px;
		padding-bottom: 20px;
		line-height: 23px;
	}

	.form-contact .buttons .btn{ width: 100px }

	.business-item h2 {
	    font-size: 14px;
	    height: 60px;
	    line-height: 20px;
	}
	.business-item.horizontal h2{
		 font-size: 14px;
    	line-height: 20px;
	}
	.business-item.horizontal h2 span{ padding-left: 15px }

	.section-header h2{
		font-size: 24px;
    	line-height: 35px;
	}

	.product-category{ height:320px }

	.news-item.horizontal .detail{padding:25px 20px }

	.company-info{
		width: auto;
		padding-left:20px;
		padding-right:20px  
	}

	.business-logo img{
		-webkit-transform: scale(0.6);
		transform: scale(0.6);
	}
	
}
@media (max-width: 400px){

	 
}
@media (max-width: 340px){
	.company-item h3{
		font-size: 16px;
		padding-left:10px;
		padding-right:10px; 
	}
	.company-item .icon{ margin-top:65px;  }
	
	.business-category [class^="col"]{
		width: 100%;
		display: block;
	}

	 
}


/*Retina Display Media Query*/

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 

	.icons{
		background-image:url(../img/icons-retina.png);
		background-size:500px
	}	 
	.section-header .btn-back .arrow-left{ top: 9px }
	.seemore{ display: none !important; }

	@media (min-width: 768px) and (max-width: 992px) {
		.modal-info .modal-content{ max-width: 100% }
	}

	.product-item .photo a:before{ visibility: hidden; opacity: 0; display: none; }
}