@media only screen and ( max-width:768px ) {

.services { width:90% !important; margin:5% 5% 0 5% !important; }
.c3 { width:90%; margin:0 5%; }
.c4 { width:100%; min-height:230px; margin:0; }

.info, .info-img {
float:right;
text-align:center;
width:100%;
padding:0;
}

#banner {
float:left;
width:100%;
height:520px;
margin:0;
padding:0;
color:#FFFFFF;
z-index:0;
}

#banner h1 {
font-size:40px;
font-weight:300;
color:#FFF;
line-height:50px;
text-align:center;
margin:100px 0 25px 0;
padding:0;
}

#sub-banner {
float:left;
width:100%;
height:350px;
margin:0;
padding:0;
color:#FFFFFF;
z-index:0;
}

#sub-banner h1 {
font-size:40px;
font-weight:300;
color:#FFF;
line-height:50px;
text-align:center;
margin:120px 0 25px 0;
padding:0;
}

}


@media only screen and ( max-width:480px ) and (-webkit-min-device-pixel-ratio: 2),
	only screen and ( max-width:480px ) and (min--moz-device-pixel-ratio: 2),
	only screen and ( max-width:480px ) and (-o-min-device-pixel-ratio: 2/1),
	only screen and ( max-width:480px ) and (min-device-pixel-ratio: 2) 
	{
	
#top-wrapper { min-height:60px; }
#top-content { min-height:60px; line-height:60px; }

a.menu-link {
float: right;
display: block;
background:#FFF;
height:60px;
line-height:60px;
margin:0 5% 0 0;
padding:0;
font-size:12px;
font-weight:300;
color:#555;
letter-spacing:1px;
text-decoration:none;
text-align:center;
}
nav[role=navigation] li { height:60px; line-height:60px; }
nav[role=navigation] li a { height:60px; line-height:60px; }


#banner {
float:left;
width:100%;
height:550px;
margin:0;
padding:0;
color:#FFFFFF;
z-index:0;
}

#banner h1 {
font-size:40px;
font-weight:300;
color:#FFF;
line-height:50px;
text-align:center;
margin:130px 0 25px 0;
padding:0;
}

#sub-banner {
float:left;
width:100%;
height:350px;
margin:0;
padding:0;
color:#FFFFFF;
z-index:0;
}

#sub-banner h1 {
font-size:40px;
font-weight:300;
color:#FFF;
line-height:50px;
text-align:center;
margin:150px 0 25px 0;
padding:0;
}

.c3 img { width:50%; }

.c4 { width:100%; min-height:250px; margin:0; }

}