/*

QNM - Mobile Stylesheet
Handwritten by Richard Wilmot (AztecMedia.eu)
http://www.qnm.ltd.uk/

*/


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


																				/* ------------ Defaults ------------ */

body {
	min-width:1px;
	}
	
#container {
	margin:auto;
	width:100%;
	}
	
	
																				/* ------------ Mobile Header ------------ */
#mobile-header {
	display: block;
	width:100%;
	height:42px;
	float:left;
	background:url(../images/nav-bg.png) no-repeat bottom left;
}

#mobile-header a {
	display:block;
	height:30px;
	padding-left:40px;
	color:#FFF;
	font-size:120%;
	font-weight:bold;
	line-height:30px;
	margin-top:5px;
	background:url(../images/mobile-menu-bg.png) no-repeat 0 0;
}

#col-2 {
	padding:10px 0
}



																				/* ------------ Hides ------------ */
#navigation,
#hero,
#col-1,
#col-3,
#home #col-2 img,
#footer #newsletter {
	display: none !important;
}


#home #col-2 {
    max-width: 412px;
}


	
#container-outer {
	background:url(../images/body-bg-plain.jpg) no-repeat top center;
	}


																				/* ------------ Branding ------------ */

#branding {
	height:auto;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	width:100%;
	padding:0 10px
}

#branding a.logo {
	float:none;
	margin:auto;
	margin-top:5px;
}

#branding span {
	width:100%;
	position:static;
	display:block;
	margin:10px 5px;
	background:none;
	text-align:center;
	text-indent:0;
	font-size:150%;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

#branding ul {
	width:100%;
	position:static;
	margin:5px;
	text-align: center;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

#branding li {
	display: inline-block;
	float:none
}


																		/* ------------ Gallery ------------ */

.gallery .img,
.gallery .img4 {
	margin:5px 5px 0 0;
}


.gallery .img2 {
	margin:5px 0 0 0;
}

																					/* ------------ Login ------------ */

#login {
	height:auto;
	width:100%;
	float:none;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}


#login h2 {
	width:90%;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

#login #loginform {
	float:none;
	width:100%;
	height:40px;
	position:relative;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}



#login #loginform input {
	margin-left:10px;
}

#login #loginform p.error {
	bottom:-8px;
	left:0px;
	padding:3px 5px 5px 28px;
	height:30px;
	line-height:30px;
	background-position:5px 12px
}

#login .welcome {
	margin-left:10px;
}


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



#contact  #col-2 form label {
	width:100%;
	text-align:left;
}

																			/* ------------ Client Area ------------ */

.warning {
	font-size:110%
}
																			/* ------------ Footer ------------ */

#footer-container {
	min-width:1px;
	text-align:center
}


}

