/* CSS Document */

* {
background-color:none;
border: 0px;
padding: 0px;
margin: 0px;
}

html {
width: 100% auto;
height: 500px;
}

body { /*IE Rule*/
border: 0px dashed pink;
background-color:#FFFFFF;
text-align: center;
height: 500px;
}

html>body body { /*All Other Browsers*/
border: 0px dashed pink;
background-color:#FFFFFF;
text-align:center;
height: 500px;
}

div.container { /*IE Rule*/
border: 0px solid orange;
width: 900px;
height: 700px;
margin:0px auto;
text-align: left;
overflow: hidden; /*makes boxes size correctly in IE*/
}

html>body div.container { /*All Other Browsers*/
border: 0px solid orange;
width: 900px;
height: auto;
margin:0px auto;
text-align: left;
overflow: visible; /*makes boxes size correctly in all other browsers*/
}

div.banner {
border: 0px solid orange;
position:relative;
height:auto;
width:900px;
}

div.content {
border: 0px solid blue;
position:relative;
width: 900px;
height: 670px;
}

div.nav {
border: 0px solid green;
position:relative;
height: 100% auto;
width: 157px;
}

div.portfolio {
border: 0px solid red;
position:relative;
bottom: 377px;
left: 215px;
width: 680px; /*sets width of artwork area. same as iframe.*/
height: 770px;
/*overflow: visible;*/
}

iframe {
border: 0px dashed black;
width: 680px; /*sets width of artwork area. same as portfolio*/
height: 770px;
/*overflow: visible;*/
}

/*BANNER CONTENT*/
img.name { 
position:relative;
width:190px;
height:136px;
}
img.brushstroke {
position:relative;
width:560px;
height:39px;
}
img.contact {
position:relative;
width:150px;
height:136px; 
}
/*END BANNER CONTENT*/

/*NAV*/
div.nav a {
width: 157px;
height: 28px;
display: block;
}

div.nav a.illustration{background: url(http://www.kimherbst.com/images/buttons/illustrationOver.gif)} /*preload mouseover*/
div.nav a.illustration{background: url(http://www.kimherbst.com/images/buttons/illustration.gif)}
div.nav a.illustration:hover{background: url(http://www.kimherbst.com/images/buttons/illustrationOver.gif)}

div.nav a.design{background-image: url(http://www.kimherbst.com/images/buttons/designOver.gif)}/*preload mouseover*/
div.nav a.design{background-image: url(http://www.kimherbst.com/images/buttons/design.gif)}
div.nav a.design:hover{background-image: url(http://www.kimherbst.com/images/buttons/designOver.gif)}

div.nav a.comics{background-image: url(http://www.kimherbst.com/images/buttons/comicsOver.gif)}/*preload mouseover*/
div.nav a.comics{background-image: url(http://www.kimherbst.com/images/buttons/comics.gif)}
div.nav a.comics:hover{background-image: url(http://www.kimherbst.com/images/buttons/comicsOver.gif)}

div.nav a.blog{background-image: url(http://www.kimherbst.com/images/buttons/blogOver.gif)}/*preload mouseover*/
div.nav a.blog{background-image: url(http://www.kimherbst.com/images/buttons/blog.gif)}
div.nav a.blog:hover{background-image: url(http://www.kimherbst.com/images/buttons/blogOver.gif)}

div.nav a.shop{background-image: url(http://www.kimherbst.com/images/buttons/shopOver.gif)}/*preload mouseover*/
div.nav a.shop{background-image: url(http://www.kimherbst.com/images/buttons/shop.gif)}
div.nav a.shop:hover{background-image: url(http://www.kimherbst.com/images/buttons/shopOver.gif)}

div.nav a.about{background-image: url(http://www.kimherbst.com/images/buttons/aboutOver.gif)}/*preload mouseover*/
div.nav a.about{background-image: url(http://www.kimherbst.com/images/buttons/about.gif)}
div.nav a.about:hover{background-image: url(http://www.kimherbst.com/images/buttons/aboutOver.gif)}

div.nav a.links{background-image: url(http://www.kimherbst.com/images/buttons/linksOver.gif)}/*preload mouseover*/
div.nav a.links{background-image: url(http://www.kimherbst.com/images/buttons/links.gif)}
div.nav a.links:hover{background-image: url(http://www.kimherbst.com/images/buttons/linksOver.gif)}
/*END NAV*/

p {
position: relative;
top: 105px;
font-family:Arial, Helvetica, sans-serif, "Trebuchet MS";
font-size:10px;
color:#333333;
}

p.linksection {
color:#333333;
font-weight:bold;
font-size:12px;
}

p.copyright {
border: 0px solid red;
position: relative;
margin-left: 25px;
}

p.ra-sun {
border: 0px solid red;
position: relative;
margin-left: 25px;
margin-bottom: 5px;
}

/*p.linknames { 
}*/ /*Currently, she doesn't need special formatting for the link names*/

a.links2 {color:#CC6600; text-decoration:none;}
a.links2:hover {color:#999999; text-decoration:none;}
a.links2:visited {color:#CC6600; text-decoration:none; font-family: }
