/* 
    Document   : screen
    Created on : Feb 3, 2010, 9:59:19 AM
    Author     : Robert
    Description:
        Purpose of the stylesheet follows.
*/

/* 
CSS Selectors
1- Element 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 - the name of the parent followed by the name or type of
    the descendent
        *Note* When only effecting the parent, child, etc. use > (e.g. #header>p)
4- Class selector - controls elements and is reusealbe (e.g. .red)
*/

body{
    font-family: calibri, sans-serif;
    margin: 0;
    padding: 0;
 }

#header{
    height: 72px;
    background-color: #0099CC;
    margin-top: 0;
    margin-bottom: 0;
    background-image: url(/images/header.png);
    background-repeat: no-repeat;
    min-width: 1050px;
}


#nav{
    top: 72px;
    left: 0;
    height: .25in;
    width: 100%;
    color: white;
    background-color: #0099CC;
    min-width: 1050px;
    border-bottom-style: solid;
    border-color: black;
}

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

#nav li{
    position: relative;
    float: left;
    list-style: none;
    margin: 0;
    padding:0;
}

#nav li a{
    width: 150px;
    height: .25in;
    display: block;
    text-decoration:none;
    text-align: center;
    line-height: 30px;
    color: white;
}

#nav li:hover ul{
    display: block;
    background-color: #0099CC;
    color: #333333;
}

#nav li a:hover{
    color: #333333;
}

#nav ul ul{
    position: absolute;
    top: .255in;
    visibility: hidden;
}

#nav ul li:hover ul{
    visibility: visible;
}

#centerbox{
    overflow: auto;
    color: white;
    background-color: #333333;
    width: 100%;
    height: 100%;
    min-width: 1050px;
    border-bottom-style: solid;
    border-color: #0099CC;
}

#side_menu div{
   margin-left: -1.5em;
    line-height: 25px;
}

#side_menu{
    width: 10%;
    float: left;
    color: white;
    background-color: #333333;
    max-width: 150px;
    min-width: 150px;
}

#side_menu ul{
    list-style-type: none;
    text-decoration: none;
 }

 #side_menu ul.blog{
     margin-left: -1.5em;
}

#side_menu ul.portfolio{
    margin-left: -1.5em;
    font-size: smaller;
}

#side_menu li a{
    display: block;
    text-decoration: none;
    color: white;
}

#side_menu li a:hover{
    color: #0099CC;
}

#content div{
    padding-left: 1.5em;
    padding-top: 1em;
    padding-right: 2em;
}

#content{
    color: #000066;
    background-color: white;
    width: 80%;
    float: left;
    min-width: 900px;
    max-width: 900px;
    min-height: 405px;
  }


#content .robert_photo{
    padding-right: 1.5em;
    float: left;
}

#content .resume{
    margin-left: -1.5em;
}

#content .tv{
    margin-left: -1.5em;
    padding: 0;
}
#content .radio{
    margin-left: 2em;
    font-size: smaller;
}

#content .lightbox{
    border-style: outset;
    border-width: 4px;
    border-color: #0099CC;
}


#aside{
    width: 10%;
    min-width: 75px;
}

#footer{
    height: .5in;
    width: 100%;
    min-width: 1050px;
    color: white;
    text-align: center;
    background-color: black;
 }

#footer ul{
    list-style-type: none;
    display: inline;
}

#footer li{
    display: inline;
 }

 #footer li a{
     color: white;
     text-decoration: none;
     display: inline-block;
}

#footer li a:hover{
    color: #0099CC;
}

 /* This method uses floats to layout the webpage
#centerbox{
     position: relative;
     overflow: auto;
     background-color: gray;
}

#side_menu{
    width: 10%;
    float: left;
}
#content{
    margin-bottom: 0;
}
#content{
    width:90%;
    float: left;
    background-color: white;
}

#footer ul{
    margin-top:0;
    list-style-type: none;
}
#footer li{
    display: inline;
}
#footer{
    height: .5in;
    width: 100%;
    background-color: green;
} */
