.nodesktop {
	display: none;
}

#container {
	width: 940px;
	margin: 0 auto;
}

/*header*/
header {
    margin: 25px 0;
}
header h1 {
	width: 340px;
	float: left;
	margin: 0;
}

#topnav {
	background-color: transparent;
	text-align: right;
	width: 940px;
	padding: 0;
	position: absolute;

}
#topnav p {
    border: 0;
    float: none;
    padding: 0;
}

nav {
	float: right;
	padding: 0;
    height: 28px;
    margin-top: 130px;
}
nav a, nav a.mobilefirst {
    font-size: 17px;
    margin: 0 0 0 40px;
    padding: 0 5px 4px;
}


/*content*/
/*index-callout*/

#content.page-index #callout hgroup {
    background-color: transparent;
    display: block;
    float: left;
    margin: 0;
    width: 72%;
}
#content.page-index p.callnow {
    display: block;
    float: left;
    margin: 40px 3% 0 2%;
    padding-left: 1%;
    padding-right: 1%;
    width: 21%;
}

#content.page-index #callout h1 {
    font-size: 30px;
    line-height: 36px;
}
#callout h2 {
  font-size: 18px;
  line-height: 26px;
}


/*content*/
/*services-callout*/
.page-services #callout div {
    background: url("../images/services-callout-desktop.jpg") no-repeat scroll 100% 0 transparent;
}
.page-services #callout h1 {
    font-size: 28px;
    line-height: 36px;
    width: 430px;
}




/*sections*/
/*home*/
#content #servicepreview, 
#content #christchurch {
	margin: 35px 0;
}
#servicepreview article {
	width: 300px;
	margin: 0 20px 0 0;
	float: left;
	padding: 0;
	min-height: 450px;
}
#servicepreview article#preview-commercial {
	margin: 0;
}
#servicepreview article p,
#servicepreview article a {
	margin-left: 20px;
	margin-right: 20px;
}
#servicepreview article p {
  min-height: 135px;
}
/*images home x3 - services concrete */
#servicepreview article h3 {
	background: url(../images/home-concreteservices.jpg) no-repeat 0 100%;
	padding: 10px 22px 175px 22px;
	text-align: center;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #servicepreview article h3 {
    background: url(../images/home-concreteservices@2x.jpg) no-repeat 0 100%;
    background-size: 200%;
  }
}
/*images home x3 - services excavation*/
#servicepreview article#preview-excavation h3 {
	background: url(../images/home-excavation.jpg) no-repeat 0 100%;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #servicepreview article#preview-excavation h3 {
    background: url(../images/home-excavation@2x.jpg) no-repeat 0 100%;
    background-size: 200%;
  }
}
/*images home x3 - commercial*/
#servicepreview article#preview-commercial h3 {
	background: url(../images/home-commercial.jpg) no-repeat 0 100%;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #servicepreview article#preview-commercial h3 {
    background: url(../images/home-commercial@2x.jpg) no-repeat 0 100%;
    background-size: 200%;
  }
}
#servicepreview h3{color:#ffffff;}


/*sections*/
/*services - excavation*/
#excavation,
#services {
  margin: 35px 0 0;
  position: relative
}
#excavation {
  margin-top: 50px;
}
#services article {
	background: transparent url(../images/services-concrete-1.jpg) no-repeat 100% 0;
	padding: 0;
	overflow: visible;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #services article {
    background-image: url(../images/services-concrete-1@2x.jpg);
    background-size: 200%;
  }
}
#excavation article {
  background: transparent url(../images/services-excavation.jpg) no-repeat 100% 0;
  padding: 0;
  overflow: visible;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #excavation article {
    background-image: url(../images/services-excavation@2x.jpg);
    background-size: 200%;
  }
}
#excavation article div,
#services article div {
	background-color: #EEEEEE;
	width: 490px;
	padding: 30px 80px 30px 50px;
	min-height: 190px;
}
#excavation article h1, 
#excavation article h2, 
#excavation article li, 
#excavation article p 
#services article h1, 
#services article h2, 
#services article li, 
#services article p {
  color: #000000;
}
#excavation article h1, 
#excavation article h2, 
#services article h1,
#services article h2 {
	font-size: 30px;
}
#excavation article p
#services article p {
	margin-bottom: 10px;
	clear: both;
}
/*concrete services, 3-in-1*/
#services article#services-concrete div:first-child {
	padding-top: 20px;
}
#services article#services-concrete {
	background: transparent url(../images/services-concrete-2.jpg) no-repeat 100% 280px;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #services article#services-concrete {
    background-image: url(../images/services-concrete-2@2x.jpg);
    background-size: 200%;
  }
}
#services article#services-concrete:after {
	content: ".";
	display: block;
	background: transparent url(../images/services-concrete-1.jpg) no-repeat 0 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 300px;
    height: 260px;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #services article#services-concrete:after {
    background-image: url(../images/services-concrete-1@2x.jpg);
    background-size: 200%;
  }
}
#services article#services-concrete div {
	padding: 0 80px 0 50px;
	min-height: auto;
}
#services article#services-concrete div.concrete3 {
	padding: 0 80px 15px 50px;
	min-height: auto;
}
#services article#services-concrete h2 {
	padding-top: 20px;
}
#services-concrete ul {
	overflow: hidden;
	margin-bottom: 10px;
}
#services-concrete li {
    float: left;
    margin-right: 20px;
    width: 25%;
}

/*services -image replacements*/
#services article#services-commercial {
	background-image: url(../images/services-commercial.jpg);
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #services article#services-commercial {
    background-image: url(../images/services-commercial@2x.jpg);
    background-size: 200%;
  }
}
#services article#services-excavation {
	background-image: url(../images/services-excavation.jpg);
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #services article#services-excavation {
    background-image: url(../images/services-excavation@2x.jpg);
    background-size: 200%;
  }
}
#services article#services-boxing {
	background-image: url(../images/services-boxing.jpg);
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #services article#services-boxing {
    background-image: url(../images/services-boxing@2x.jpg);
    background-size: 200%;
  }
}
#services article#services-sawcutting {
	background-image: url(../images/services-sawcutting.jpg);
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #services article#services-sawcutting {
    background-image: url(../images/services-sawcutting@2x.jpg);
    background-size: 200%;
  }
}


/*section*/
/*contact*/
body #content.page-contact {
	background: url(../images/contact-desktop.jpg) no-repeat 100% 0;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  body #content.page-contact {
    background: url(../images/contact-desktop@2x.jpg) no-repeat 100% 0;
    background-size: 200%;
  }
}

body #content.page-contact section {
	background-color: #EEEEEE;
	width: 620px;
	margin-top: 50px;
}

#content #contactdetails {
  min-height: 250px;
}

body #content.page-contact #contactdetails h1 {
	font-size: 30px;
	padding-top: 20px;
	margin-bottom: 15px;
}
#content.page-contact #contactdetails h2 {
	clear: both;
	padding-top: 30px;
}
.contact-phone,
.contact-email {
	float: left;
	height: 40px;
	padding-top: 7px;
	margin-top: 20px;
}
.contact-phone {
	padding-left: 42px;
	width: 160px;
	background: url(../images/contact-phone.png) no-repeat 0 0;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  .contact-phone {
	background: url(../images/contact-phone@2x.png) no-repeat 0 0;
    background-size: 200%;
  }
}
.contact-email {
	padding-left: 90px;
	width: 200px;
	background: url(../images/contact-email.png) no-repeat 0 0;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  .contact-email {
	background: url(../images/contact-email@2x.png) no-repeat 0 0;
    background-size: 200%;
  }
}


/*footernav*/
#footernav {
    display: none;
}

/*footer*/
#footerwrap {
	padding: 25px 0 0 140px;
	width: 800px;
	margin: 0 auto;
	background: url(../images/footer-man.png) no-repeat 0 0;
	min-height: 94px;
}
@media 
only all and (min-device-pixel-ratio: 2),
only all and (-webkit-min-device-pixel-ratio: 2){
  #footerwrap  {
    background-image: url(../images/footer-man@2x.png);
    background-size: 200%;
  }
}