/* 
    Document   : screen
    Created on : May 17, 2010, 2:32:44 PM
    Author     : Me
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/

    The ways of controlling markup:
    #1 by using the id(e.g. #header)
    #2 by using an element(e.g body)
    #3 by using a context selector(e.g. #aside>div)


*/

root { 
    display: block;
}

body{
    background-color: #E0E0E0;
    margin: 0;
    padding: 0;

}

#sitewrapper{
    width:80%;
    min-width: 900px;
    margin-left: auto;
    margin-right: auto;

}

#header{
    background-color: #6F47D7;
    color: #240672;
    font-weight: 700;
}

#logo img{
    width: 600px;
    height: 100px;
    margin-left: 8em;
}


#outercontainer{
    position: relative;
    overflow: auto;
    background-color: #e0e0e0;
    margin: 0;
    padding: 0;

}

#sidenav{
    width: 20%;
    float: left;
    background-color: #e0e0e0;
    color: #240672;
    font-weight: 500;
    padding-top: 3em;
}

/*
#sidenav ul{
    margin: 0;
    padding-left: 10px;
    font: bold medium Helvetica, Arial, serif;

}

#sidenav li{
    list-style:none;
}

#sidenav a,
#sidenav a:link,
#sidenav a:visited{
    text-decoration: none;

}
*/





/* menu list container */
#sidemenu{                        
    list-style-type: none;      /* disable the display of the list item bullets */
    margin: 0px;                /* space around the list container */
    padding: 0px;               /* space within the list container */
    position: static;           /* need this so that the z-index stuff works correctly */
    background-color: #E0E0E0;
   
    z-index: 20;                /* push the menu up in the layer order a bit so it isn't hidden behind anything */
    min-height: 300px;
    /* Browser plug-ins like Flash or Quicktime may not allow you to overlap then with this menu! */
}

/* top-level menu element */
#sidemenu li{                      
    list-style-type: none;      /* disable the display of the list item bullets */
    float: left;                /* this is to allow for the horizontal main menu */
    /* border: black solid 1px;     border for each of the main menu items */
    /* background-color: #442B83;  /* main menu item font color (not links) */
    margin: 0px;                /* spacing between main menu items */
    padding: 0px;               /* padding within main menu items */
    width: 120px;               /* the width of each main menu item */
    display: block;
    border: 1px solid;
    color: #93B52D;
}

/* third-level (or greater) menu element list elements */
#sidemenu ul {                     
    position: absolute;         /* this is so that it doesn't push that page content around on hover */
    margin: 0px;                /* space around the list container */
    padding: 0px;               /* space within the list container */
    list-style-type: none;      /* disable the display of the list item bullets */
    display: none;
    width: 120px;               /* should be the same as #sidemenu li width */
    z-index: 99;                /* want to be sure this is above the rest of the menu */
}

/* second-level or greater menu element links */
#sidemenu ul li{                   
    border: none;               /* sub-menu item border settings */
    margin: 0px;                /* spacing between sub-menu containers */
    padding: 3px;               /* This is for padding between menu items in the drop-downs */
    width: 114px;               /* (padding*2) must be subtracted from #sidemenu li width and set for this one, or borders won't display properly. */
    border: 1px solid;
    color: #93B52D;
  

}

/* top-level menu element links */
#sidemenu li a{                    
    text-align: center;         /* text alignment in main menu item links */
    width: 120px;               /* set this to #sidemenu ul width */
    display: block;
    color: #FF8E00;
    list-style:none;
}

#sidemenu a:visited,
#sidemenu li a:visited{
    color: #FF8E00;

}


/* all the other level menu link elements */
#sidemenu ul a {                  
    padding: 3px;
    margin: 0px;
    width: 108px;               /* (padding*2) must be subtracted from #sidemenu ul li width and set for this one, or borders won't display properly. */
    display: block;
}

/* top-level hovering properties */
#sidemenu a:hover,                 
#sidemenu li:hover{
    display: block;
    color: red;
    left: 8em;

   
}

/* higher level hovering properties */
#sidemenu ul li:hover,             
#sidemenu ul li a:hover{
    display: block;
    width: 109px;               /* should be set to the same value as #sidemenu ul li width */
}

/* higher-level list containers */
#sidemenu ul ul{                   
    display: none;              /* don't display by default */
    position: absolute;
    margin-left: 12em;         /* this should be the width of #sidemenu ul li */
    margin-top: -2em;           /* this will push the sub-menu up to the level of it's parent */
}

/* only non-MSIE browsers use this */
#sidemenu ul li>ul,
#sidemenu ul ul li>ul{
    margin-top: -2em;           /* should be set to the same as #sidemenu ul ul margin-top */
}

/* additional sub-menu levels in the next 2 blocks. (For up to 5 levels of drop menus) */
#sidemenu li:hover ul ul,              
#sidemenu li:hover ul ul ul,
#sidemenu li:hover ul ul ul ul,
#sidemenu li:hover ul ul ul ul ul{
    display:none;
}

#sidemenu li:hover ul,
#sidemenu ul li:hover ul,
#sidemenu ul ul li:hover ul,
#sidemenu ul ul ul li:hover ul,
#sidemenu ul ul ul ul li:hover ul{
    display:block;
}

li>ul {
/*    top: auto;*/
    margin-top: -15px;
    left: 121px;
    top:70px
}

/* This is used for the content that will appear below the menu */
.content {
    clear: left;
}


#sidenav>div{

}


#innercontainer{
    width: 80%;
    float: left;
    padding: 0;
    margin: 0;

}
/*
#innercontainer>div{
    margin-left: 5px;
    border-left: 0px solid #000;
}*/

#nav{
    background-color: #E0E0E0;
    font-weight: 700;
    margin: 0;
    padding: 7px 0 0 0;
    list-style:none;
}

#nav ul{
    margin: 0;
    padding: 0;
    font: medium Helvetica, Arial, serif;

}

#nav ul li{
    padding: 2px 0 0 0;
    margin: 0;
    display: inline;
    text-align: center;
}

#nav ul li a{
    display: inline-block;
    width:75px;
    padding: 10px 2px 2px 5px;
    margin: 0 0 0 10px;
    /* border: 1px solid #A65C00;    temp 
     background-color: #759D00;   temp */
    background: none repeat scroll 0 0 #759D00;
    color: #D6F870;
    text-decoration: none;
    font-weight: bold;
    border-top-left-radius: 10px;    /* CSS 3 */
    border-top-right-radius: 10px;   /* CSS 3 */
    -moz-border-radius-topleft: 10px;    /* firefox */
    -moz-border-radius-topright: 10px;   /* firefox */
    -webkit-border-top-left-radius: 10px;    /* Safari-Chrome */
    -webkit-border-top-right-radius: 10px;   /* Safari-Chrome 3 */
    -o-border-top-left-radius: 10px;    /* Opera */
    -o-border-top-right-radius: 10px;   /* Opera */
}

#nav a:link{
    color: #759D00;
    background-color: #D6F870;
}

#nav a:visited{
    color: #759D00;
    outline: none;
    background-color: #D6F870;
}

#nav a:hover{
    color: #D6F870;;
    background: #93B52D;
}

.home #nav a[title~=home],
.china #nav a[title~=china],
.blog #nav a[title~=blog],
.links #nav a[title~=links],
.utilities #nav a[title~=utilities],
.about #nav a[title~=about]{
    color: #D6F870;
    background-color: #759D00;
    /*background: none repeat scroll 0 0 #759D00;
    border-color: #933;
    border-bottom: none;*/
    cursor:default;
}

#content{
    margin: 0 0 0 0;
    padding: 1px 0 0 0;
    background-color: #FFFFFF;
}

#content ul.gallery{
    padding:0;
    margin:0;
    position: relative;
    overflow: auto;
}

#content h1{
    margin-top: 0;
}

#content h2{
    color: #A65C00;
    padding: 0;
    margin-left: 10px;
}

#content h3{
    color: #FF8E00;
    margin-left: 20px;
}

#content p{
    margin: 0 1.5em 0 25px;
    padding: 0;
}

/*#content>div{
    padding: 10px;
}*/

#travelmap{
    height: 460px;
    width: 600px;
    margin: 0 10px 0 10px;
    padding-bottom: 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;
}*/

#content input[type=radio]{
    display: block;
}

#content ul.gallery li{
    float: left;
    list-style: none;
    display: inline;
    width: 92px;
    height: 92px;
    margin: 5px;

}

#content img[title~=meat],
#content img[alt~="Christmas"]{
    margin: 0 25px 25px 15px;
}

#captchawrapper{
    position: relative;
    overflow: auto;
    margin: 0;
    padding: 0;
}

#picture{
    float: left;
    width: 200px;
    padding: 15px 10px 5px 10px;
}

#choices{
    
    padding: 15px 10px 5px 10px;
}

.home #content{
    min-height: 400px;
}


#content ul{
    margin:0;
}

#resume{
    position: relative;
    overflow: auto;
    margin:0 15px 0 15px;
    padding: 0 0 4px 0;
}


#resume .side{
    width: 20%;
    margin: 0;
    padding: 0;
    float: left;

}

#resume .spacer{
    margin-top:3px;
}

#resume .info{
    width: 80%;
    margin: 0;
    padding: 0;
    float: left;
}

#resume h2{
    color: black;
}

#resume h3{
    font-size: medium;
    font-weight: 900;
    margin: 0;
    padding: 0;
    color: black;
}

#resume h4{
    font-weight: 700;
    font-size: medium;
    margin: 0;
    padding: 0;
    color: black;
}

#resume h5{
    font-weight: 600;
    font-size: medium;
    font-style: italic;
    text-align: right;
    margin: 0;
    padding: 0;
    color: black;
}

#resume h6{
    font-size: medium;
    font-weight: bold;
    margin: 0;
    padding: 0;
    margin-left: 10px;
    color: black;
}

#resume p{
    margin-left: 25px;
}

#content ul.gallery img{
    border: none;
}

#footer{
    background-color: #D6F870;
    color: #759D00;
    font-weight: 500;
    font-size: small;
    text-align: center;
    margin: 0;
    padding: 5px 0 4px 0;
}

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

#footer li{
    display: inline;
    padding: 0 1em 0 0;

}