/* 
    Document   : screen
    Created on : May 17, 2010, 9:54:02 AM
    Author     : Ezbuck
    Description:
        Purpose of the stylesheet follows.
*/

/*
css/
 Six ways of controlling shtml using css\
1- declare an element name (e.g. body)
2- declare an id (e.g. #header)
<p><strong>Hi</strong>This is my sweet awesome web page check me out!</p>
3- declare a class (e.g. .home)
4- declare a context selector (e.g. #nav ul)
5- declare a pseudo-class selector (e.g. a:link)
6- Use an attribute selector (e.g. a[title~=home])
*/

root { 
    display: block;
}

body{
background-color: green;
margin: 0;
padding: 0;
}

#header{
height: 100px;
background-color: green;
text-align: center;

}


#header img[src=\/images\/zach\.jpg]{
 position: absolute;
 left: 5%;
 top: 5%;
}
#center{
position: relative;/* this controls the div and its children */
overflow: auto;
background-color: blue;
}
#nav{
background-color: blue;
border: double thick black;
}

#nav ul{
 margin: 0;
 padding: 0 2px 0 0;
 font: bold medium "Palatino Linotype", "Book Antigua", Palatino, serif;
}

#nav li{
 display: inline;
 padding: 0;
 margin: 0;
 list-style-type: none;
 text-align: center;
}

/* Style the links in the navigation bar*/
#nav ul li a{
 display: inline-block;
 width: 7em;
 padding: 3px .5em 0 .5em;
 margin-left: 8px;
 border: 1px solid lime;
 background-color: black;
 text-decoration: none;
 border-top-left-radius: 10px;
 border-top-right-radius: 10px;
 -moz-border-radius-topright: 10px;
 -moz-border-radius-topleft: 10px;
 -webkit-border-top-left-radius: 10px;
 -webkit-border-top-right-radius: 10px;
 -o-border-top-left-radius: 10px;
 -o-border-top-right-radius: 10px;
 
}

#nav a:link{
 color: white;
}

#nav a:visited{
 color: green;
 outline: none;
}

#nav a:hover,
#nav a:focus{
 color: blue;
 background-color: black;
 border-color: white;
 border-bottom: 10px solid black;
}

.home #nav a[title~=home],
.buck #nav a[title~=about],
.rockies #nav a[title~=rockies],
.disneyland #nav a[title~=disneyland],
.chihuahua #nav a[title~=mission],
.entertainment #nav a[title~=entertain]{
 color: blue;
 background-color: black;
 border-color: white;
 border-bottom: 10px solid black;
}

#subnav{
position: absolute;
background-color: black;
color: blue;
width: 30%;
height: 90%;
float: left;
}

/* Style the links in the navigation bar*/
#subnav ul li a{
 display: inline-block;
 width: 20%;
 padding: 3px .5em 0 .5em;
 margin-left: 8px;
 border: 1px solid lime;
 background-color: black;
 text-decoration: none;
 border-top-left-radius: 10px;
 border-top-right-radius: 10px;
 -moz-border-radius-topright: 10px;
 -moz-border-radius-topleft: 10px;
 -webkit-border-top-left-radius: 10px;
 -webkit-border-top-right-radius: 10px;
 -o-border-top-left-radius: 10px;
 -o-border-top-right-radius: 10px;
}

#subnav a:link{
 color: white;
}

#subnav a:visited{
 color: green;
 outline: none;
}

#subnav a:hover,
#subnav a:focus{
 color: blue;
 background-color: black;
 border-color: white;
 border-bottom: 10px solid black;
}

#rightcol{
width: 80%;
float: left;
}

#rightcol>div{
    border-left: 1px solid #000;
}

#content{
position: relative;
background-color: white;
text-align: center;
width: 90%;
float: right;
}

#content h1{
margin-top: 0;
}

#content>div{
 padding: 10px;
}

#content fieldset{
 border: none;
}

#content label{
 font-weight: bold;
 width: 6em;
 margin-right: 1em;
 float: left;
 text-align: right;
}

#content #captcha{
float: left;
margin-right: 1em;
}

#footer{
background-color: green;
bottom: 0;
}

#footer ul li{
 display: inline;
 padding: 0;
 margin: 0;
 list-style-type: none;
 text-align: center;
}

#footer a:link{
 color: white;
}

#footer a:visited{
 color: yellow;
 outline: none;
}