/*--------------- wolfworkstudio.com / style.css----------------------


------------------Author: Deb Teitsworth, wolfworkstudio.com----------


----------------------------------------------------------------------*/


/*------------------------- GLOBAL STYLES --------------------------*/



* {
margin: 0;
padding: 0;
outline-style: none;
}

body {
background-image: url("images/gray.jpg");
font-family: Palatino Linotype,Book Antiqua3,Palatino6,serif;
font-size: 85%;
}

#container {
background-image: url("images/moon.png");
background-repeat: no-repeat;
background-position: right top;
width: 1050px;
margin: auto;
z-index: -10;
}

blockquote {
padding-left: 25px;
}


/*--------------------------- MASTHEAD -----------------------------*/


#masthead {
width: 705px;
margin: auto;
}

#masthead .h1 {
position: relative;
width: 705px;
height: 75px;
font-size: 16px;
overflow: hidden;
z-index: -20;
}

#title span {
position: absolute;
width: 705px;
height: 75px;
left: 0;
top: 0;
margin: 0;
background-image: url("images/title.gif");
background-repeat: no-repeat;
}


/*-------------------------- NAVIGATION ----------------------------*/


#nav:after { /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

#nav {
width: 700px;
height: 30px;
list-style: none;
padding-top: 5px;
border-bottom: 1px solid #252525;
}

#nav ul li {
float: left;
display: inline;
margin-top: 7px;
padding-right: 5px;
}

#nav ul li a {
display: inline-block; /* fixes the invisible bottom border in stupid IE for some reason */
color: white;
background-image:  url("images/gray-med.gif");
font-size: 12px;
text-transform: lowercase;
text-decoration: none;
padding: 0px 4px 2px 4px;
border-top: 1px solid #757575;
border-right: 1px solid #454545;
border-bottom: 1px solid #454545;
border-left: 1px solid #757575;
}

#nav ul li a:hover, #nav ul li a.selected {
color: #252525;	
background-image:  url("images/gray-lite.gif");
text-decoration: none;
border-top: 1px solid #252525;
border-right: 1px solid #c6c6c6;
border-bottom: 1px solid #c6c6c6;
border-left: 1px solid #252525;
}


/*---------------------------- CONTENT -----------------------------*/


#contentwrap {
background-image: url("images/content-box.gif");
background-repeat: no-repeat;
width: 705px;
margin: 7px auto 0;
}

#content {	
width: 700px;
height: 330px;
padding-bottom: 20px;
}

.scroll {
width: 700px;
height: 275px;
overflow: scroll;
overflow-y: scroll; 
overflow-x: hidden;
}

.leftimg {
vertical-align: text-bottom;
width: 140px;
margin-right: 8px;
padding: 4px;
border: 1px solid #535353;
}

.rightimg {
float: right;
text-align: center;
font-size: .8em;
margin-right: 8px;
margin-left: 3px;
padding: 2px;
border: 1px solid #535353;
}

#content h3 {
padding: 15px 15px 10px 25px;
font-size: 15px;
font-family: Lucida Sans Unicode,Lucida Grande,sans-serif;
color: #252525;
}

#content h4 {
padding: 3px 15px 10px 25px;
font-size: 13px;
font-family: Lucida Sans Unicode,Lucida Grande,sans-serif;
color: #252525;
}

#content h6 {
color: #454545;
font-family: Lucida Sans Unicode,Lucida Grande,sans-serif;
color: #252525;
font-size: 12px;
margin-top: -30px;
padding: 0 0 5px 25px;
}

#content p {
padding: 0 25px 10px 35px;
font-size: 110%;
}

#content #click {
color: #454545;
font-family: Lucida Sans Unicode,Lucida Grande,sans-serif;
font-size: 90%;
margin-left: -10px;
}

#portfolio_scroll {
margin-top: -50px;
}

#portfolio_scroll td {
color: #858585;
font-family: Palatino Linotype,Book Antiqua3,Palatino6,serif;
font-size: 90%;
padding-top: 10px;
}

ul {
padding-left: 25px;
}

#content ul {
padding-right: 40px;
padding-bottom: 5px;
padding-left: 60px;
}

ul.buttonlist li {
list-style-type: none;
background-image: url("images/gray-button.gif");
background-repeat: no-repeat;
background-position: 0pt 0.4em;
margin-top: -3px;
padding-left: 1.5em;
}

form {
width: 560px;
background-color: #eeeeee;
color: #252525;
margin-top: auto;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}

p.legend {
font-weight: bold;
text-transform: uppercase;
margin-left: -20px;
padding-top: 10px;
}

#personal {
background-color: #ffffff;
margin-top: -10px;
margin-right: 15px;
margin-bottom: 0pt;
margin-left: 15px;
padding-top: 5px;
padding-right: 0pt;
padding-bottom: 0pt;
padding-left: 15px;
}

#message {
background-color: #ffffff;
margin-top: -10px;
margin-right: 15px;
margin-bottom: 15px;
margin-left: 15px;
padding-top: 5px;
padding-right: 0pt;
padding-bottom: 15px;
padding-left: 15px;
}

#form_buttons {
margin-top: -7px;
}


/*---------------------------- FOOTER ------------------------------*/


#footer {
z-index: 500;
width: 680px;
height: 30px;
font-family: Palatino Linotype,Book Antiqua3,Palatino6,serif;
font-size: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
padding: 10px 10px 30px 10px;
}

#footer a {
color: white;
margin-top: -3px;
padding: 0;
}

address {
color: white;
float: right;
height: 35px;
font-family: Palatino Linotype,Book Antiqua3,Palatino6,serif;
font-size: 110%;
font-style: normal;
margin-top: -5px;
padding-top: 0;
}

.valid a {
float: left;
margin-right: 7px;
}

#bottom-image {
background-image: url(images/mtns.png);
background-repeat: no-repeat;
background-position: center center;
height: 165px;
width: 100%;
position: fixed;
bottom: 0px;
z-index: -500;
}