/*

Hogleaze Storage - Mobile Stylesheet
Handwritten by Richard Wilmot (aztecmedia.eu)
http://www.patioanddriveways.co.uk

*/

@media screen and (max-width: 820px) {
																			/* ------------ Header ------------ */

#header-container {
	height:100%;
}
	
																			/* ------------ Features (homepage) ------------ */


#features li {
	margin:auto;
	margin-bottom:20px;
	float:none !important;
	}
	
	
																		/* ------------ Projects ------------ */

#project-list li {
	display: inline-block;
	float:none !important;
	overflow:hidden;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
}



	
						
}
	

@media screen and (max-width: 620px) {
	
																				/* ------------ Defaults ------------ */

body, html {
	font-size:14px;
	line-height:24px;
	}
	
																			/* ------------ Header ------------ */

#header a.tel,
#header a.email {
	font-size:13px
}

#header ul.logos {
	top:25px;
}	

#header ul.logos li {
	height:30px;
}

.which-trusted-trader {
	background:url(../images/which-trusted-trader-small.gif) no-repeat top left;
	width:39px;
}
.natural-paving-approved-installer {
	background: url(../images/natural-paving-approved-installer-small.gif) no-repeat top left;
	width:62px;
}
.brett-approved-installer {
	background: url(../images/brett-approved-installer-small.gif) no-repeat top left;
	width:44px;
}
	

																			/* ------------ Nav ------------ */

#nav {
	padding:0;
}

#nav .standard-menu {
    display: none;
}

#nav .menu {
    background: url(../images/mobile-btn.png) no-repeat top left;
    display: block;
    height: 40px;
    text-indent: -25000px;
    width: 40px;
	cursor:pointer
}

.mobile-menu {
	position:absolute;
	z-index:1000;
    background: url(../images/mobile-btn.png) no-repeat top left;
	padding-top:39px;
	width:100%
}

.mobile-menu ul {
	margin: 0 5px;
	background:#FFF;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	overflow:hidden;
	padding:5px 10px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}


.mobile-menu li a {
	text-decoration:none;
	color:#869d89;
	font-size:14px;
	text-transform:uppercase;
	font-family: 'Roboto', sans-serif;
	font-weight:300;
}

																			/* ------------ Content ------------ */

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

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

#footer-container,
#footer {
	height:auto;
	padding:0
}


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

#footer {
	padding: 10px 20px 5px 20px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

#footer p.copyright,
#footer p.reg-no {
	width:100%;
	text-align:center;
	float:none;
}






	
}

@media screen and (max-width: 500px) {
	
a.facebook {
	width:50px;
	height:50px;
	display:block;
	background:url(../images/facebook-small.png)  no-repeat top left;
	position: absolute;
	left:80px;
	top:20px;
	text-indent:-25000px;
	z-index:3000;
}

a.facebook:hover {
	background:url(../images/facebook-small.png)  no-repeat 0 -50px;
	left:80px;
}


																			/* ------------ Header ------------ */

#header a.tel,
#header a.email {
	width:20px;
	overflow:hidden
}



	


																				/* ------------ Contact	 ------------ */



.contactform input,
.contactform textarea {
	width:100%;
}
	
	



	
}


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

a.facebook {
	width:50px;
	height:50px;
	display:block;
	background:url(../images/facebook-small.png)  no-repeat top left;
	position: absolute;
	left: auto;
	right:10px;
	top:20px;
	text-indent:-25000px;
	z-index:3000;
}

a.facebook:hover {
	background:url(../images/facebook-small.png)  no-repeat 0 -50px;
	right:20px;
}

#header ul.logos {
	display:none
}	
	
																				/* ------------ Features (homepage) ------------ */


#features {
	text-align: center;
}

#features li {
    -webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	}
	
#features li a {
	padding-left:0px;
	font-size:20px;
}
	
#features li a:hover {
	background-position: 20px 0
}

																		/* ------------ Projects ------------ */

#project-list li a {
	padding-left:0px;
}

#project-list li a:hover {
	background-position: 20px 0
}
	
}