<!--base styles-->


body {	
font-family: 'Francois One';
}

body {
font-family: 'Francois One';
}

a {
text-decoration: none; 
color: #666666;
}

body.getintouch a.getintoucha {
color: black;
}

body.mystory a.mystorya {
color: black;
}

body.mywork a.myworka {
color: black;
}

#navigation ul li a:hover {
color: black;
opacity: .25;
}
	
a:active {
color: black;
}

header {
width: 100%;
background-color: black;
color: white;
overflow: hidden;
}

#headerwrap {
width: 60%;
max-width: 960px;
min-width:300px;
margin: auto;
padding-left: 5%;
padding-right:5%;
background-color: black;
display: block;

}

#responsive_headline {
float: left;
padding-top: 8%;
width: 80%;
display:block;
}

#responsive_headline img {
max-width: 100%;
vertical-align: bottom;
}
		
#tagline {
float: left;
width: 15.75%;
}

#tagline img {
padding-top:50%;
max-width: 100%;
display: block;
vertical-align: bottom;
}

.navli {
padding-left: 6%;
}

#navigation {
width: 60%;
max-width:960px;
min-width:300px;
margin: auto;
padding-left:5%;
padding-right: 5%;
}

#nav ul {
list-style: none;
}

#navigation ul li {
float: left;
font-size: 4em;
width: 100%;
display: block;
}

.navli {
padding-left: 6%;
}

#gallerynav {
width: 40%;
max-width: 100%;
padding-top: 1%;
margin: 0 0 0 40%;
clear: both;

}

#gallerynav img.directions {
width: 10%;
max-width: 100%;
}

#gallerynav img.gallery {
width:33%;
max-width: 100%;
padding: 1.25% .15% 1% .15%;
}


#wrapper {
margin: auto auto 5%;
max-width: 960px;
min-width: 300px;
padding-left: 5%;
padding-right: 5%;
padding-top: 2%;
width: 60%;
}

#wrapper p.bottomline {
padding-bottom: 3%;
}

#errorcontainer {
padding: 10% 0 5% 0;
text-align: center;
}

#contactthankyou {
padding: 10% 0 5% 0;
text-align: center;	
}

#footerwrap {
width: 60%;
max-width:960px;
min-width:300px;
margin: auto;
padding-left:5%;
padding-right: 5%;
}

#footerwrap p {
padding-top: .5%;
}

#footerwrap p.topline {
line-height: 2%;
padding-top: 0.7%;	
}

#footerwrap img {
max-width: 100%;
padding-top: 0.7%;
vertical-align: bottom;
width: 3%;}

html, body {height: 100%;}

#wrap {min-height: 100%;
	overflow:auto;
	margin-bottom: 10%;
		}

#main {}  /* must be same height as the footer */

footer {position: relative;
	margin-top: -14%; /* negative value of footer height */
	height: 30%;
	color: white;
	clear:both;
	background-color: black;
	} 

/*Opera Fix*/
body:before {
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;/
}

p.instructions {
text-align: center;
padding: 1% 0 2% 0;	
}

#clear {
	clear: both;
}