/* CSS Document */

@media (min-width: 220px) and (max-width: 768px) {
	body{
    -webkit-text-size-adjust: none;
  	}
	html {
	-webkit-text-size-adjust: none;
	}
	html,body,.wrapper {max-width:768px;overflow-x: hidden;-webkit-overflow-scrolling: touch; min-width:320px; width:100%; -webkit-text-size-adjust: none;}
	.container {
		width:80%;
		padding:10%;
	}
	.ss1 .container {
		width:100%;
		padding:10% 0px;
	}
	.ss1 .slideHolder {
		width:100%;
	}
	.fullScreen {
		height: 800 !important;
	}
	.img, .home>img:first-of-type, .services>img:first-of-type, 
.community>img:first-of-type, .sustainability>img:first-of-type, .about>img:first-of-type, .contact>img:first-of-type {
		width:80%;
		height:auto;
		padding:0px !important;
	}
	.hs1 .container div {
		position:relative;
		top:0px;
	}
	.hs1 img {
		display:none;
	}
	.hs2 .container img, .hs4 .container img, .hs6 .container img, .hs7 .container div img, .ss3 .container img {
		position:relative;
		top:0;
		left:0;
		float:left;
		width:20%;
		height:auto;
		margin-right:5%;
		margin-bottom:5%;
	}
	 .hs7 .container div img {
		 left:0px;
		 top:0px;
	 }
	.hs2 .container p, .hs4 .container h2, .hs4 .container p, .hs6 .container h2, .hs6 .container p {
		font-size: 34px;
		font-weight: bold;
		padding:0 10% 0 0;
	}
	.hs4 .container p {
		font-size: 20px;
	}
	.hs3, .homebg03 {
		height:auto;
	}
	.hs3 .container {
		height:auto;
	}
	.homebg02, .homebg03, .servicesbg02, .communitybg02, .sustainabilitybg02 {
		height:100%;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
		background-attachment: fixed;
	}
	.hs3 .container>div {
		height:auto;
		position:relative;
		top: 0px;
		left: 0px;
		z-index: 50;
		width:100%;
	}
	.hs3 .container h2 {
		padding:0 0 5% 0;
	}
	.hs3 .container p {
		padding:0 0;
	}
	.hs3 .container img {
		display:none;
	}
	.hs5>div:first-of-type {
		display:none;
	}
	.hs5 div:first-of-type {
		position:relative;
		background:none;
		height:auto;
	}
	.hs5 .container a:first-of-type {
		position:relative;
		top:0px;
		left:0px;
	}
	.hs5 .container h2 {
    	color: #fff;
		font-size: 36px;
		font-weight: bold;
		padding:5% 10%;
		width:80%;
		background: rgba(0,0,0,0.5);
		margin-bottom:5%;
	}
	.hs5 .container {
		height:auto;
	}
	.hs7 .container div {
		width:100%; 
		padding:0;
		float: none;
		position: relative;
		margin-top:0px;
		margin-bottom:10%;
	}
	.hs7 .container div h2 {
		background:none;
	}
	.ss2 {
    	background: #f7941d;
    	padding:0 0 0 0;
    	border-bottom: 5px solid #fff;
	}
	.wf {
		height:auto;
		background-color:#3A3A3C;
	}
	header {
		display:none;
	}
	.hbm {
		height:31px;
		width:60px;
		position:fixed;
		z-index:99999;
		top:15px;
		right:5%;
		background:url(../_gfx/icon_hamburger.png) no-repeat left top;
		cursor:pointer;
	}
	.hbmN {
		height:60px;
		position:fixed;
		top:0px;
		left:0px;
		z-index:99980;
		background-color:#f1f1f2;
		width:100%;
		overflow:hidden;
	} 
	.hbmN img {
		width:auto;
		height:40px;
		padding:10px 5%;
	}
	nav {
		margin-top:0px;
	}
	nav li, nav li:first-of-type {
		text-transform: uppercase;
		margin:0px;
		padding:0px;
		float:none;
		display:block;
	}
	nav li a {
		display:block;
		padding:2.5% 5%;
		float:none;
	}
	nav li:last-of-type {
		float:none;
	}
	.hs3 .container>div {
		background: rgba(0,0,0,0.5);
	}
	.hs3 .container>div h2 {
		padding:10% 10% 0 10%;
		font-size:28px;
	}
	.hs3 .container>div p {
		padding:10% 10% 10% 10%;
	}
	.ss1 .slideHolder {
		margin:0 15%;
		width:70%;
	}
	.ss1 .slideHolder .hide, .ss1 .slideHolder .show {
		position: absolute;
		top: 0px;
		left:0px;
		z-index: 100;
		width: 100%;
	}
	.ss1 .slideHolder .hide img, .ss1 .slideHolder .show img {
		width: 100% !important;
		height:auto !important;
	}
	.slide>img {
		width:5%;
		height:auto
	}
	.ss1 .next, .ss1 .last {
		position: absolute;
		top: 45%;
		cursor: pointer;
	}
	.ss1 .last {
    	left: 5%;
	}
	.ss1 .next {
    	right: 5%;
	}
	.ss2 ul {
    	padding-bottom:0px;
    	float: left;
	}
	.ss25 .container div {
		width:100%;
	}
	.ss25 h2 {
		font-size: 28px;
		padding-top: 10%;
		padding-bottom: 0px;
		padding-left:10%;
		padding-right: 10%;
	}
	.ss2 ul {
		width:80%;
		padding-right:10%;
		margin-left: 50px;
	}
	.ss25 p, .ss25 ul {
		color: #fff;
		font-size: 18px;
		padding-bottom: 20px;
		padding-left: 10%;
		padding-right: 10%;
	}
	.wrapper.ss3 {
		padding: 0px 0 0px 0;
	}
	.ss3 .container h2 {
		padding-left:0px;
		color: #fff;
		padding-right: 0px;
		font-size: 26px;
	}
	.ss3 .container p {
		padding-left:0px;
		color: #fff;
		padding-right:0px;
		font-size: 18px;
		line-height: 26px;
	}
	.ss4 .container div ul:first-of-type {
   	 margin-right: 0px;
	}
	.ss4 .container div ul {
		float:none;
	}
	.ss4 {
    	padding:0px;
	}
	.ss4 .container {
		height: auto;
	}
	.ss4 .container div {
		position:relative;
		height:auto;
		width:90%;
		padding:5%
	}
	.ss6 {
		height:500px;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
		background-attachment: fixed;
	}
	.ss5 .container, .ss7 .container, .ss8  .container{
		padding:0;
	}
	.ss55 .container, .ss75 .container, .ss85  .container{
		padding:20px 0 0 0;
	}
	.ss5 h2, .ss8 h2, .ss7 h2 {
		display:inline-block;
	}
	.ss5 p, .ss8 p, .ss7 p {
		display:none;
	}
	.ss55 p:first-of-type, .ss85 p:first-of-type, .ss75 p:first-of-type {
		padding-top: 0px;
		padding-bottom: 30px;
	}
	.ss55 p, .ss85 p, .ss75 p {
		color: #fff;
		font-size: 22px;
		padding-left:0px;
		padding-bottom: 30px;
	}
	.lbImg {
		width:70%;
		height:auto;
	}
	.last2, .next2 {
		width:5%;
		height:auto;
	}
	.last2 {
		left:5%;
	}
	.next2 {
		right:5%;
	}
	.cs1 .container h2 {
		padding:0;
	}
	.cs2 .container {
		padding:10%;
	}
	.cs2 .container img {
		width:80%;
		margin:0 auto;
	}
	.cs4 {
		padding: 0px;
	}
	.cs4 .container h2 {
		margin-bottom:2.5%;
	}
	.cs4 .container p,.cs4 .container ul li {
		font-size: 20px;
		font-weight: normal;
		padding-bottom:10%;
	}
	.cs5 {
		background-image:none;
		height:auto;
	}
	.cs5 .container {
		padding:0 0;
		width:100%;
		height:auto;
	}
	.cs5 .container img {
		width:100%;
		height:auto;
		display:block;
	}
	.cs6 .container div img {
		position:relative;
		top: 0px;
		left: 0px;
	}
	.cs6 .container div h2, .cs6 .container div p {
		padding-left:0px;
		padding-top:5%;
	}
	.sys1 {
		background-image:none;
		height:auto;
		background-color:#19334A;
	}
	.sys1 .container h2 {
		padding-left:0px;
		text-shadow: 0px 2px 2px #000;
		padding-top:10%;
		padding-bottom: 24px;
	}
	.sys1 .container p {
		padding-left:0px;
	}
	.sys2 .container p:first-of-type {
    	padding-right:0px;
	}
	.sys3 {
		height:auto;
	}
	.sys3>div:nth-child(1), .sys3>div:nth-child(2) {
		display:none;
	}
	.sys3 .container h2 {
    	background: rgba(0,0,0,0.5);
    	padding: 10%;
	}
	.sys3>div:nth-child(3) {
		position:relative;
		top:0px;
		left:0px;
		height:auto;
	}
	.sys4 .container {
		background: url(../_gfx/arrow-lrg.png) no-repeat 5% 10%;
   		padding:10%;
		background-size:20%;
	} 
	.sys4 .container h2:first-of-type, .sys4 .container p:first-of-type {
		padding-left:20%;
	} 
	.sys4 .container h2, .sys4 .container p {
		padding-left:0%;
	}
	.sys5 .container p {
		width:100%;
	}
	.as3 .container>div {
		position: relative;
		clear: both;
		padding-left: 0px;
		min-height: 186px;
		padding-right:0px;
		padding-bottom:10%;
	}
	.swithOne, .swithTwo, .swithOne:hover, .swithTwo:hover {
		height:156px;
		width: 280px;
		position:relative;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
	}
	.as5 .leftNews{
		display:none;
	}
	.as5 .container {
		padding:0;
		width:100%;
	}
	.as5 .container>div:last-of-type {
		float: none;
		width:80%;
		border-left:none;
		min-height: auto;
		background-color: #fff;
		padding:10%;
	}
	.contact .container>div:first-of-type {
		position:relative !important;
		top:0px !important;
		left:0px !important;
	}
	.contact #contactForm {
		width:auto !important;
		color: #fff;
		position:relative;
		top:0px;
		left: 0px;
		background: rgba(0,0,0,0.7);
		padding: 10%;
		margin-top:10%;
		display:none;
	}
	.contact #contactForm div.description {
		position:relative;
		top:0;
		right:0;
		margin-top: 0px;
		margin-bottom: 0px;
	}
	.contact #contactForm>input:nth-child(2), .contact #contactForm>input:nth-child(4), .contact #contactForm>input:nth-child(6), .contact #contactForm>input:nth-child(8) {
		padding:5%;
		width:90%;
		display: block;
		margin-top: 8px;
		margin-bottom: 10px;
	}
	.contact #contactForm div.description textarea {
		display: block;
		width:90%;
		min-width:90%;
		max-width:90%;
		margin-top: 8px;
		height: 159px;
		min-height: 159px;
		max-height: 159px;
		padding:5%;
	}
	.contact #contactForm .submit {
		width: 106px;
		height: 46px;
		background: url(../_gfx/sub-btn.png) no-repeat left top;
		position:relative;
		left:0px;
		top:0px;
		margin-top:10%;
	}
	.contact #contactForm div:first-of-type label {
		display:block;
		margin-bottom:10px;
	}
	.cbs1 {
		padding-top:10%;
	}
	.cbs1 .container {
		position:relative;
	}
	.cbs1 .container iframe{
		position:relative;
		top:0;
		left:0;
		width:100%; 
		height:80%;
	}
	.cbs1 .container div {
		padding-left:0px;
		padding-top:10%;
		font-size: 20px;
	}
	.cbs1 .container div p {
		padding-bottom:10%;
	}
	.cbs2 .container p.nbp {
		padding-bottom:5%;
	}
	.cs6 .container div img {
		width:100%;
	}
	.ss2>.container>div {
		display:none !important;
	}
	.ss2 h2 {
		font-size:28px;
	}
	.ss2 ul li {
		display:block;
		font-size:18px;
	}
	.l1 ul li {
		padding-bottom:10px;
	}
.homebg01 {
	background-attachment:scroll; 
	background-image:url(../_gfx/bg-home01Mobile.jpg);	
	min-height:800px;
	display:none;
}
.homebg02 {
	background-attachment:scroll;  
}
.homebg03 {
	background-attachment:scroll; 
}
.communitybg01 {
	background-attachment:scroll;
	background-image:url(../_gfx/bg-community01Mobile.jpg);	
	min-height:800px; 
	display:none;  
}
.communitybg02 {
	background-attachment:scroll; 
}
.sustainabilitybg01 {
	background-attachment:scroll;
	background-image:url(../_gfx/bg-sustainability01Mobile.jpg);	
	min-height:800px; 
	display:none;
}
.sustainabilitybg02 {
	background-attachment:scroll; 
	background-image:url(../_gfx/bg-sys03Mobile.jpg);
}
.aboutbg01 {
	background-attachment:scroll; 
	background-image: url(../_gfx/bg-about01Mobile.jpg);	
	min-height:800px;
	display:none;
}
.contactbg01 {
	background-attachment:scroll; 
	background-image: url(../_gfx/bg-contact01Mobile.jpg);	
	min-height:800px;
	display:none;
}
.servicesbg01 {
	background-attachment:scroll; 
	background-image:url(../_gfx/bg-services01Mobile.jpg);	
display:none;
	min-height:800px;
}
.servicesbg02, .ss6 {
	background-attachment:scroll;
	background-image:url(../_gfx/bg-services02Mobile.jpg); 
}
	.homebg01, .servicesbg01, .communitybg01, .sustainabilitybg01, .aboutbg01, .contactbg01 {
		background-attachment:scroll;
	}
	.as2 ul li {
		height:auto;
		width:50%;
		padding:0;
		background-image:none;
	}
	.as2 ul li img{
		width:100%;
	}
	.cs3 {
    	min-height: 400px;
	}
	.fullScreen  img:first-of-type, .fullScreen  .parallax {
		display:none;
	}
	.mobleHeader {
		display:block;
		width:100%;
		height:auto;
	}
	.fullScreen .container{
		padding:0;
	}
	.sys2 .container {
		padding-top:40px;
		padding-bottom:40px;
	}
	.ss6 {
		height:auto;
	}
	.ss6 .container {
		padding:0px;
		width:100%;
	}
	.sys5 {
		padding-top:0px;
	}
	.cbs1 {
		padding-bottom:0px;
	}
	.as5 .container>div:last-of-type .imageCaption {
		height:auto;
		margin-bottom: 25px;
		width:65%;
		padding-left:35%;
	}
	.as5 .container>div:last-of-type .imageCaption img {
		width:25% !important;
	}
}
@media(max-width: 480px) {
	.cs2 .container ul li {
		width:40%;
		padding:0 5%;
		float:left;
		margin:0;
	}
	.cs2 .container ul li:nth-child(1), .cs2 .container ul li:nth-child(3), .cs2 .container ul li:nth-child(6), .cs2 .container ul li:nth-child(8) {
		clear:both;
	}
	.cs2 .container ul li:nth-child(8) {
		width:90%;
	}
	.cs2 .container ul li img{
		width:100%;
	}
}
@media (min-width: 481px) and (max-width: 768px) {
}

