/* 
    Document   : screen
    Created on : May 19, 2010, 10:24:20 AM
    Author     : justinhughes
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   There are 6 ways of controling the web page
1- declare an element (eg. body)
2- declare an id (eg. #header)
3- declare a class (e.g. .home)
4- declare a context selector (e.g. #nav ul)
5- declare pseudo class selector (e.g. a:link, a:visited, a:hover, a:focus, a:active)
6- use an attribute selector (e.g. a[title~=home])
*/

root {
    display: block;
}

body{
    background-color: #969EA1;
}

#header{
    background-image: url(/images/logo.jpg);
    height: 200px;
    background-position: center;
    background-repeat: no-repeat;
}

#nav{
    padding-left: 15%;
}

#nav ul{
    margin: 0;
    padding: 0 0 0 2px;
    font: bold medium Georgia;
}

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

#nav li a{
    display: inline-block;
    width: 6em;
    padding: 3px .5em 2px .5em;
    margin-left: 2px;
    border: 1px solid #000;
    background-color: #000;
    color: #fff;
    text-decoration: none;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -o-border-top-left-radius: 4px;
    -o-border-top-right-radius: 4px;
}

#nav a:link{
    color: #fff;
}

#nav a:visited{
outline: none;
}

#nav a:hover,
#nav a:focus{
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    color: #fff;
    background-color: #000;
}

.home #nav a[title~=home],
.prints #nav a[title~=prints],
.services #nav a[title~=services],
.gallery #nav a[title~=gallery],
.pricing #nav a[title~=pricing]{
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    color: #fff;
    background-color: #000;
}

#middle{
   position: relative;
   overflow: auto;
}

#middle>div{

}

#content{
    width: 85%;
    float: right;
    font: medium Georgia;
}

#content>div{
    padding: 5px;
    border: 1px solid #000;
}

#content ul.picture_links{
    margin: 14px;
    padding: 16px;
    position: relative;
    overflow: auto;
}

#content ul.picture_links li{
    display: inline;
    float: left;
    padding: 16px;
    margin: 14px;
}

#content ul.picture_links li img{
    border: none;
    float: left;
    }

#content ul.pictures{
    margin: 14px;
    padding: 16px;
    position: relative;
    overflow: auto;
}

#content ul.pictures li{
    display: inline;
    float: left;
    padding: 16px;
    margin: 14px;
}

#content ul.pictures li img{
    border: none;
    }

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

#subnav{
    width: 15%;
    float: left;
    padding-top: 15px;
}

#subnav>div{
    background-color: #BAAA96;
    border: 2px solid #000;
}

#subnav ul{
  margin: 0;
  padding: 0;
}

#subnav ul li{
    text-decoration: none;
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    color: #000;
    text-align: center;
}

#subnav ul a{
    color: #000;
    font: bold medium Georgia;
    text-decoration: none;
    list-style: none;
    padding: 0;
    margin: 0;
}

#footer{}