/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark

Note - this is a modification of the Meyer reset

*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    -webkit-margin-before: 0;
	-webkit-margin-after: 0;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/* =========================================================================== */

/* regular styles */


@font-face {  
	font-family: sofiapro;  
	src: url('fonts/SofiaProRegular-webfont.eot');  
	src: url('fonts/SofiaProRegular-webfont.eot?#iefix') format('embedded-opentype'),
		 url('fonts/SofiaProRegular-webfont.woff') format('woff'),
		 url('fonts/SofiaProRegular-webfont.ttf') format("truetype"),
		 url('fonts/SofiaProRegular-webfont.svg#sofia_prolight') format('svg');
	font-weight: bold;
	font-style: normal; 
} 

@font-face {  
	font-family: sofiapro;  
	src: url('fonts/sofiaprolight-webfont.eot');  
	src: url('fonts/sofiaprolight-webfont.eot?#iefix') format('embedded-opentype'),
		 url('fonts/sofiaprolight-webfont.woff') format('woff'),
		 url('fonts/sofiaprolight-webfont.ttf') format("truetype"),
		 url('fonts/sofiaprolight-webfont.svg#sofia_prolight') format('svg');
	font-weight: normal;
	font-style: normal; 
} 

body {
	background-color: #554e44;
	font-family: sofiapro, helvetica, sans-serif; 
	font-size: 1em;
	font-weight: normal;
	font-style: normal;
	color: #333;
}

.hidden {
	display: none;
}

a:link, a:visited {
	text-decoration: none;
}

p {
	padding: .5em 0;
}

h1 {
	font-size: 1.5em;
	padding: .6em 0 .5em 0;
	margin: .2em 0;
	line-height: 1.2em;
	font-weight: bold;
}

h2 {
	font-size: 1.3em;
	padding: .3em 0;
	margin-top: .4em;
	line-height: 1.2em;
	font-weight: bold;
}

h3 {
	font-size: 1.2em;
	padding: .2em 0;
	margin-top: .4em;
	line-height: 1.2em;
	font-weight: bold;
}

h4 {
	font-size: 1.1em;
	line-height: 1.2em;
	font-weight: bold;
	padding: .3em 0 0 0;
	margin-top: .3em;
}

h5 {
	font-size: 1em;
	line-height: 1.2em;
	font-weight: bold;
	margin-top: .3em;
}

.no-bullet {
	list-style-type: none;
}

ul {
	margin: .5em 0 .5em 1em;
}

ul li {
	padding-bottom: .4em;
}

.float-right {
	float: right;
}

.float-left {
	float: left;
}



#page-wrapper {
	background: #dd9944 url('images/paper-speckle-pattern.jpg') repeat;
	float: left;
	width: 100%;
	overflow:hidden
}



/* header logo and tab */	

#page-header {
	width: 100%;
	max-width: 1140px;
	margin: .5em auto 0 auto;
}

#cfd-logo {
	max-width: 480px;
	margin: 0 0 0 4.5%;
	float: left;
}

#tab-div {
	float: right;
	width: 20%;
	margin-top: 1em;
}

#tab {
	float: right;
	width: 100%;
	background-color: #554e44;
	color: #ffffff;
	font-size: .85em;
	font-weight: normal;
	line-height: 1.25em;
	padding: 0 .5em;
}

#tab p {
	padding: .35em 0;
}

#tab-shadow {
	float: left;
	clear: right;
	
}







/* nav */

nav {  
    height: 3.5em;  
    width: 100%;
    margin-top: -.1em;
    font-size: 1em;  
    font-weight: normal;  
    float: left;  
    background-color: #bbb5aa; 
	-webkit-box-shadow:  0px 0px 5px 5px rgba(50, 50, 50, .3);
    -moz-box-shadow:    0px 5px 5px rgba(50, 50, 50, 0.3);     
	box-shadow:  0px 0px 5px 5px rgba(50, 50, 50, .3);
}
nav ul { 
    padding: 0;  
    margin: 0 auto;  
    max-width: 1140px;  
    height: 3.5em;    
}

nav li {  
	margin-left: 0.5%;
    display: inline;  
    float: left; 
    width: 16.25%; 
    background-color: #bbb5aa;
    padding-bottom: 0;   
} 

li.first-menu-item {  
	margin-left: 0;
}   

nav a {  
    color: #333;  
    display: block;  
    text-align: center;  
    text-decoration: none;  
    line-height: 3.5em;
} 

nav a:hover, nav a:active {  
    background-color: #9d9588;  
} 

nav a#pull {  
    display: none;  
}   

.clearfix:before,  
.clearfix:after {  
    content: " ";  
    display: table;  
}  

.clearfix:after {  
    clear: both;  
} 
 
.clearfix {  
    *zoom: 1;  
}   



/* main content */

#main-content {
	width: 100%; 
	float: left;
	margin: 0 auto 3.5em auto;
	font-size: .95em; 
	line-height: 1.5em;
	padding: 1em 0 1em 0;
	background-color: #ffffff;
	border-top: #bbb5aa .2em solid;
	border-bottom: #bbb5aa .2em solid;
	-webkit-box-shadow:  0px 0px 5px 5px rgba(50, 50, 50, .3);
	-moz-box-shadow:    0px 5px 5px rgba(50, 50, 50, 0.3); 
    box-shadow:  0px 0px 5px 5px rgba(50, 50, 50, .3);
}

.auto-margin {
	margin: 0 auto;  
    max-width: 1140px;  
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	padding: 0;
}

.text-padding {
	padding: 0 15px;
}

#left-content {
	float: left;
	-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: 66.5%;
	padding: 0 1.5%;
	border-right: 1px solid #cccccc;
}

aside {
	width: 33.0%;
	float: right;
	 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	margin-left: 0.5%;
    padding: 0 1.5%;
}

img.right-col-img {
	padding-top: 2em;
}

header h1 {
	padding: 0 0 .5em;
}

#main-content a {  
    color: #888;  
} 

#main-content a:hover {  
    color: #554e44; 
    text-decoration: underline; 
} 

a#thumb1:hover, a#thumb2:hover, a#thumb3:hover {  
    text-decoration: none; 
} 

div.index-group {
	float: left;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	margin-left: 2%;
	width: 32.0%;
	text-align: center;
	background: #bbb5aa url('images/light-bg.jpg') repeat;
	padding: 0 1em 1em;
	-webkit-box-shadow: inset 0px 0px 7px 3px rgba(50, 50, 50, .2);
    box-shadow: inset 0px 0px 7px 3px rgba(50, 50, 50, .2);
    -webkit-border-radius: 12px;
    border-radius: 12px;
    color: #332211;
}

div.first-group {
	margin-left: 0;
}

div.main-thumb {
	background: #bbb5aa url('images/light-bg.jpg') repeat;
 	-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 1em 1em;
	-webkit-box-shadow: inset 0px 0px 7px 3px rgba(50, 50, 50, .2);
    box-shadow: inset 0px 0px 7px 3px rgba(50, 50, 50, .2);
    -webkit-border-radius: 12px;
    border-radius: 12px;
    color: #332211;
}

div.index-group header {
	margin-top: .5em;
	display: inline-block;
	margin: .5em auto;
}

div.index-group img {
	border: none;
	cursor: auto;
	float: left;
	margin-right: .75em;
}

div.index-group h1 {
	float: left;
	margin-top: .75em;
}

div.index-group p {
	clear: both;
}

#main-content div.index-group a {
	color: #332211;
}

#main-content div.index-group a:hover {
	text-decoration: none;
}

input[type="text"], textarea, select {
	width: 90%;
}

#form-messages.success {
	padding: .25em .5em;
	margin: 1em 0;
	color: #3b723b;
	background-color: #dff0d8;
	border: 1px solid #d6e9c6;
	border-radius:10px;
}

#form-messages.error {
	padding: .25em .5em;
	margin: 1em 0;
	color: #a23f3d;
	background-color: #f2dede;
	border: 1px solid rgba(185, 74, 72, 0.3);
	border-radius:10px;
}

input:required {
    box-shadow:none;
}

#ajax-contact input, textarea, button, select {
	box-sizing: border-box;
	width:100%;
	border-radius:10px;
	padding:.4em;
	border:2px solid #ccc;
	font-size:.9em;
	color:#393939;
	margin-bottom:1.5em;
}


#ajax-contact button[type="submit"] {
	border:2px solid #999;
	background-color:#bbb5aa;
	padding:.5em;
	font-size:1em;
	letter-spacing:1px;
}

#ajax-contact button[type="submit"]:hover {
	cursor:pointer;
	background-color:#ccc;
	border:2px solid #bbb;
}

a.index-group {
	width: 45%;
	display: block;
	float: left;
	margin-left: 2%;
}

div.highslide-gallery {
	background: #bbb5aa url('images/light-bg.jpg') repeat;
	margin-bottom: 2em;
	-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: 2%;
	-webkit-box-shadow: inset 0px 0px 7px 3px rgba(50, 50, 50, .2);
    box-shadow: inset 0px 0px 7px 3px rgba(50, 50, 50, .2);
    -webkit-border-radius: 12px;
    border-radius: 12px;
    color: #332211;
    overflow-x: hidden;
}

div.gallery-wrap {
	width: 100%;
	clear: both;
}

div.gallery-wrap img {
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	margin: 1.2%;
}

div.highslide-gallery header {
	display: block;
}

div.highslide-gallery header img {
	float: left;
	margin: 0 .5em 0 1.2%;
}

div.highslide-gallery header h1 {
	float: left;
	margin-top: .75em;
}

#contact a {
	color: #85bfa4;
}


/* footer */

footer {
	width: 100%;
	float: left;
	background-color: #554e44;
	padding: 1.25em 0 1em 0;
	-webkit-box-shadow:  0 -5px 5px 0px rgba(50, 50, 50, .3);
    -moz-box-shadow:   -5px 5px 0px rgba(50, 50, 50, 0.3);     
	box-shadow:  0 -5px 5px 0px rgba(50, 50, 50, .3);
	color: #ffffff;
	font-size: .9em;
	line-height: 1.25em;
}

footer a:link, footer a:visited {
	color: #ffffff;
	text-decoration: none;
}

footer a:hover {
	color: #bbb5aa;
	text-decoration: underline;
}	

ul#footer-info {
	text-align: center;
	margin: 0;
}

ul#footer-info li {
	list-style-type: none;
	display: inline-block;
	margin: 0 .75em;
}



/* media queries */

@media screen and (max-width: 1139px) { 
	div.gallery-wrap img {
		width: 9.9474474%;
	}
	
	img.right-col-img {
		width: 90%;
	}
} 

@media screen and (max-width: 700px) {  
	#cfd-logo {
		width: 65%;
		margin-left: 15%;
	}
	
	#tab-div {
		float: right;
		width: 100%;
		margin-top: 0;
	}
	
	#tab-shadow {
		display: none;
	}
	
	#tab {
		margin: 0;
		float: none;
		text-align: center;
	}
	
	aside {
		clear: both;
		float: left;
		width: 100%;
		border-left: none;
		border-top: 1px solid #cccccc;
		padding: 1em 1em 0 15px;
	}
	
	#left-content {
		width: 100%;
		padding: 0 15px;
	}
	
	img.right-col-img {
		width: 40%;
		padding-top: 2em;
	}

	div.highslide-gallery {
		float: none;
		margin-left: 0;
		width: 100%;
		margin: 1em auto;
	}
	
	input[type="text"], textarea, select {
		width: 100%;
	}
	
	input[type="submit"] {
		margin-bottom: 2em;
	}
	
	div.gallery-wrap img {
		width: 12.66667%;
		margin: 2%
	}
	
	div.highslide-gallery header img {
		margin: 0 .5em 0 2%;
	}
	
	div.index-group {
		float: none;
		margin-left: 0;
		width: 100%;
		margin-bottom: 1em;
	}
}

@media screen and (max-width: 590px) {  
    
    html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
	}
    
    nav {   
        height: auto;  
        position: relative;
        -webkit-box-shadow:  0 -5px 5px 0px rgba(50, 50, 50, .35);
    	-moz-box-shadow:    -5px 5px 0px rgba(50, 50, 50, 0.35);     
		box-shadow:  0 -5px 5px 0px rgba(50, 50, 50, .35);
    }  
    nav ul {  
        width: 100%;  
        display: none;  
        height: auto;  
    }  
    nav li {  
        width: 50%;  
        float: left;  
        position: relative;
        margin-right: 0;
        margin-left: 0;
    }  
 
    nav a {  
        text-align: left;  
        width: 100%;  
        text-indent: 15px; 
        background-color: #554e44;   
        color: #ffffff;
        line-height: 3em;
    } 
    
    nav a:hover {  
        color: #ffffff;
    }
    
    nav a#pull {  
        display: block;  
        background-color: #bbb5aa;  
        width: 100%;  
        position: relative;
        -webkit-box-shadow:  inset 0 -5px 5px 0px rgba(50, 50, 50, .4);
    	-moz-box-shadow:    inset -5px 5px 0px rgba(50, 50, 50, 0.4);    
		box-shadow: inset 0 -5px 5px 0px rgba(50, 50, 50, .4); 
		height: 3.5em; 
		color: #000000;
		line-height: 3.5em;
    }   
    
    nav a#pull:after {  
        content:"";  
        background: url('images/nav-icon.png') no-repeat right center;  
        width: 85%;  
        height: 1.5em;  
        display: inline-block;  
        position: absolute;  
        right: 15px;  
        top: 15px; 
    } 
    
    div.gallery-wrap img {
		width: 19%;
		margin: 3%
	}
	
	div.highslide-gallery header img {
		margin: 0 .5em 0 3%;
	}

}  
