/* original code by http://templates.tupence.co.uk March 2011 */
/***************************
 RESET BROWSER DEFAULT MARGINS, PADDING AND BORDERS
***************************/
html, body, div, h1, h2, h3, h4, h5, h6, p, a, img, ul, li, header{
margin:0;
padding:0;
border:0;
}

/*****************
GENERAL LAYOUT
******************/
/***** render html5 elements as block in non-supported browsers ****/
header, footer, section, nav, article {/*add any html5 elements you use*/
display: block;
}
body{
background:url(bodybg.jpg) repeat #3c3c3c;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:.875em;
text-align:center;
}
#wrapper{
width:960px;
overflow:hidden;
margin:0 auto;
text-align:left;
}
/***************
HEADER
*************/
header{
background:url(header.png) left center no-repeat;
margin-bottom:20px;
height:104px;
}
header h1{
font-family:Georgia, "Times New Roman", Times, serif;
text-transform:lowercase;
padding-top:20px;
margin-left:210px;
font-size:3.6em;
letter-spacing:-2px;
font-weight:normal;
color:#e1f5f3;
text-shadow: 1px 1px 0px #252525, 3px 3px 0px #637170;
}
header h1 span.tag{
font-size:.5em;
color:#728886;
text-shadow: none;
}
header a{
color:#e1f5f3;
text-decoration:none;
}
header a:hover, header a:focus{
color:#bebee9;
}
/****************** 
SKIP NAV 
so that people browsing without a mouse can avoid having to go through the navigation every time they visit a page
******************/
#access{
text-align:center;
padding:0 0 0 10px;
}
#access a{
position:absolute; 
left:-9999em; /*moves the links off the page and not visible they are in focus*/
width:200px; 
z-index:999; 
display:block;
}
#access a:focus{
left:20px; /*moves the links back onto the page*/
top:20px; 
font-size:90%;
color:#fff; 
background-color:#6a6a6a;
padding:10px; 
font-weight:bold; 
text-decoration:underline;
}
/*************
NAVIGATION COLUMN
****************/
nav{
float: left;
position: relative;
width: 200px;
margin:-40px -200px 0 0;
background: url(navbg01.png) no-repeat;
}
nav ul.links{/*text links box*/
margin: 210px 0 0 20px;
background:#57758a;
border:10px solid #bddbe5;
-webkit-border-radius:20px;
-moz-border-radius:20px;
border-radius:20px;
}
nav ul.social{/*social media image links*/
margin:30px 0 0 40px;
}
nav li{
list-style-type:none;
line-height:1.4em;
margin: 5px 0;
padding:3px 5px 3px 10px;
font-size:1.2em;
letter-spacing:-1px;
text-transform:lowercase;
}
nav a{
color:#ede8f6;
text-decoration:none;
text-shadow: 0px 1px 0px #2d3142;
}
nav a:active, nav a:hover, nav a:focus, nav a.now{
text-shadow:0 0 0 #fff;
color:#fff;
}
nav a:active, nav a:focus{
outline:none;
border:1px solid #fff;
}
nav img{
opacity:.7;
}
nav img:hover{
opacity:1;
}
/**************
CONTENT
**************/
#content {
float: left;
width:690px;
overflow:hidden;
padding:0 20px 10px 50px; 
margin:-20px 0 0 200px;
background:#3c3c3c;
color:#fcfcf6;
}
#content p{
line-height:1.5em;
margin-bottom:10px;
font-size:.9em;
}
#content ul{
margin:5px 0 10px 20px;
}
#content li{
margin-bottom:5px;
font-size:.9em;
}
#content h1, #content h2, #content h3, #content h4{
font-family:Georgia, "Times New Roman", Times, serif;
font-weight:normal;
color:#cfebd8;
}
#content h2{
font-size:2.1em;
text-shadow: 0px -1px 0px #7d7d7d;
margin:20px 0;
}
#content h3{
font-size:1.6em;
margin-top:30px;
}
#content h4{
font-size:1.4em;
margin-top:30px;
}
#content a:link{
color:#cce1f2;
}
#content a:visited{
color:#d4d2de;
}
#content a:active, #content a:hover, #content a:focus{
color:#fcfcf6;
text-decoration:none;
}
#content a:active, #content a:focus{
border:1px solid #fff;
}

/** IMAGES **/
.imgcenter{
text-align:center;
padding:7px 0;
}
.imgcenter img{
padding:3px;
border:8px solid #646464;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
article#pics{
margin:20px 0;
}
article#pics ul{
list-style-type:none;
margin:0;
}
article#pics li{
float:left;
position:relative;
display:inline block;
width:150px; /* width of the largest image used*/
padding:5px 10px;
margin:0;
}
article#pics img{
border:4px solid #646464;
}
/***********
FOOTER
************/
footer {
clear: left;
background:url(footer.png) top left no-repeat;
padding:50px 0 0 40px;
margin:10px 0 30px 0;
text-align:justify;
}
footer p{
color:#fff;
font-size:.9em;
font-family:Arial, Helvetica, sans-serif;
line-height:1.5em;
margin-bottom:10px;
}
footer a:link{
color:#cce1f2;
}
footer a:visited{
color:#d8d7de;
}
footer a:active, footer a:hover, footer a:focus{
color:#fcfcf6;
text-decoration:none;
}

/**********
BASE
***********/
#base{
border-top:4px solid #bddbe5;
border-bottom:4px solid #bddbe5;
margin:10px 0 30px 0;
padding:10px 0;
}
#base p{
color:#ccc;
font-size:.8em;
line-height:1.3em;
margin-bottom:5px;
}
#base a{
color:#c8d5df;
}
#base a:active, #base a:hover, #base a:focus{
color:#fcfcf6;
text-decoration:none;
}