/* 
    Document   : screen
    Created on : Feb 3, 2010, 11:58:51 AM
    Author     : Timc
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   Css Selectors (are case sensitive)
1- Elememt selector - you declare the element name (e.g. body)
2- ID selector - it controls elements that have an id attribute (e.g. #header)
3- Context selector - based on the parent and inheritance of children
4- Class selector - contorls elements and is reusable (e.g. .red)
*/

img{
   border-style: none; /* to remove border on all image links */
}

#header ul,
#nav ul,
#footer ul,
#content h1{
   margin-bottom: 0;
   margin-top: 0;
}

body{
   margin: 0;
   padding: 0;
   max-width: 1024px;
   min-width: 800px;
}

#header{
   height: 1.05in;
   padding-left: .5em;
   background-color: #7F7B7A;
   position: relative;
}

#header #tools{
   position: absolute;
   top: 0;
   right: .5em;
   width: auto;
   text-align: right;
}

#nav{
   height: .26in;
   background-color: #BFBFBF;
}

#subnav ul,
#nav ul{
   list-style-type: none;
}

#nav li{
   display: inline;
   text-indent: 15px;
}

#centerbox{
   background-color: #EFEFEF;
   max-width: 1024px;
   min-width: 700px;
   min-height: 5in;
   position: relative;
}

#subnav{
   width: 15%;
   min-height: 6.07in;
   overflow: hidden;
   background-color: #BFBFBF;
   position: absolute;
   top: 0;
   left: 0;
}

#content{
   width: 75%;
   max-height: 6in;
   overflow: auto;
   position: relative;
   top: 0;
   left: 15%;
   padding-bottom: .5ex;
}
#content div,
#subnav div,
#aside div{
   min-height: 1in;
   padding-left: .5em;
   padding-right: .5em;
}

#aside{
   width: 10%;
   position: absolute;
   top: 0;
   left: 90%;
}

#footer{
   position: relative;
   padding-left: .5em;
   padding-bottom: .5ex;
   background-color: #D6D3CE;
}

a.squarebutton{
   background: transparent url('/images/square-gray-left.gif') no-repeat top left;
   display: block;
   float: left;
   font: normal 12px Arial; /* Change 12px as desired */
   line-height: 15px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
   height: 23px; /* Height of button background height */
   padding-left: 9px; /* Width of left menu image */
   text-decoration: none;
}

a:link.squarebutton, a:visited.squarebutton, a:active.squarebutton{
   color: #494949; /*button text color*/
}

a.squarebutton span{
   background: transparent url('/images/square-gray-right.gif') no-repeat top right;
   display: block;
   padding: 4px 30px 4px 0; /*Set 9px below to match value of 'padding-left' value above*/
}

a.squarebutton:hover{ /* Hover state CSS */
                      background-position: bottom left;
}

a.squarebutton:hover span{ /* Hover state CSS */
                           background-position: bottom right;
                           color: black;
}

.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
                overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
                margin-left: auto;
                margin-right: auto;
                width: 70%;
                min-width: 600px;
}