
/********** LAYOUT CSS **********/

div#wrapper {
	font-size: 1.1em;
	width: 1000px;
	margin: 0 auto;
}

a#top {}

/*** header ***/

div#header {
	height: 96px;
	background: url(../../_images/_ui/bg_header.jpg) no-repeat;
	position: relative;
}

    div#header ul.utilitynav {
	    list-style: none;
	    margin: 0;
	    padding: 0;
	    position: absolute;
	    top: 18px;
	    right: 230px;
    }
	    div#header ul.utilitynav li {
		    display: inline;
		    margin: 0;
		    padding: 0;
		    font-size: 0.9em;
	    }
		    div#header ul.utilitynav li a:link,
		    div#header ul.utilitynav li a:visited,
		    div#header ul.utilitynav li a:hover,
		    div#header ul.utilitynav li a:visited:hover,
		    div#header ul.utilitynav li a:active {
			    color: #b2a694;
			    padding: 0 15px;
			    border-left: 1px solid #957a64;
		    }
		    div#header ul.utilitynav li:first-child a:link,
		    div#header ul.utilitynav li:first-child a:visited,
		    div#header ul.utilitynav li:first-child a:hover,
		    div#header ul.utilitynav li:first-child a:visited:hover,
		    div#header ul.utilitynav li:first-child a:active {
			    border: 0px none;
		    }

    div#header ul.subutilitynav {
	    list-style: none;
	    margin: 0;
	    padding: 0;
	    position: absolute;
	    top: 58px;
	    right: 5px;
		width:635px;
    }
	    div#header ul.subutilitynav li {
		    display: inline;
			float:left;
		    margin: 0;
		    padding: 0;
		    font-size: 0.9em;
	    }
		    div#header ul.subutilitynav li a:link,
		    div#header ul.subutilitynav li a:visited,
		    div#header ul.subutilitynav li a:hover,
		    div#header ul.subutilitynav li a:visited:hover,
		    div#header ul.subutilitynav li a:active {
			    color: #b2a694;
			    padding: 0 15px;
			    border-left: 1px solid #957a64;
		    }
		    div#header ul.subutilitynav li:first-child a:link,
		    div#header ul.subutilitynav li:first-child a:visited,
		    div#header ul.subutilitynav li:first-child a:hover,
		    div#header ul.subutilitynav li:first-child a:visited:hover,
		    div#header ul.subutilitynav li:first-child a:active {
			    border: 0px none;
		    }
		    
		    div#header ul.subutilitynav li.left 
		    {
		        float:left;   
		        border:none; 
		        width:40px;
		    }
		    
		    div#header ul.subutilitynav li.left a
		    {
		       display:block;
		       width:21px;
		       height:21px;     
		    }
		     div#header ul.subutilitynav li.right 
		    {
		        float:right;   
		        border:none; 
		        width:30px;
		    }
		    
		    div#header ul.subutilitynav li.right a
		    {
				border-left:0px;
				display:block;
				width:21px;
				height:21px;
				padding:0;     
		    }

fieldset#sitesearch {
	position: absolute;
	top: 16px;
    right: 25px;
}

a#logo_sfo {
	width: 141px;
	height: 67px;
	background: url(../../_images/_ui/logo_sfo.png) no-repeat;
	position: absolute;
	top: 16px;
	left: 40px;
}
    a#logo_sfo span {
	    position: absolute;
	    left: -999999px;
    }

/*** /header ***/

/*** mainnav ***/

div#mainnav {
	height: 154px;
	background: url(../../_images/_ui/bg_mainnav.jpg) no-repeat;
	position: relative;
}

ul#siteNav {
	list-style: none;
	width: 210px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 8px;
	left: 40px;
}
	ul#siteNav li {
		line-height: 10px;
		text-transform: uppercase;
		height: 10px;
		margin: 0;
		padding: 7px 0;
		border-top: 1px solid #8c6245;
	}
	ul#siteNav li:first-child {
		border: 0px none;
	}
        ul#siteNav li a {
            position: relative;
            display: block;
            height: 10px;
            text-decoration: none;
        }
	    ul#siteNav li a:link,
	    ul#siteNav li a:visited {
		    color: #f3e8d3;
	    }
	    ul#siteNav li a:hover,
	    ul#siteNav li a:visited:hover,
	    ul#siteNav li a:active {
		    color: #fdbf57;
	    }
	    ul#siteNav li.in a {
		    color: #fdbf57;
	    }
        ul#siteNav li#nav_calendar a {
            background: url(../../_images/_mainnav/nav_calendar.png) no-repeat;
        }
        ul#siteNav li#nav_tickets a {
            background: url(../../_images/_mainnav/nav_tickets.png) no-repeat;
        }
        ul#siteNav li#nav_visit a {
            background: url(../../_images/_mainnav/nav_visit.png) no-repeat;
        }
        ul#siteNav li#nav_support a {
            background: url(../../_images/_mainnav/nav_support.png) no-repeat;
        }
        ul#siteNav li#nav_join a {
            background: url(../../_images/_mainnav/nav_join.png) no-repeat;
        }
        ul#siteNav li#nav_calendar.in a,
        ul#siteNav li#nav_calendar a:hover,
        ul#siteNav li#nav_tickets.in a,
        ul#siteNav li#nav_tickets a:hover,
        ul#siteNav li#nav_visit.in a,
        ul#siteNav li#nav_visit a:hover,
        ul#siteNav li#nav_support.in a,
        ul#siteNav li#nav_support a:hover,
        ul#siteNav li#nav_join.in a,
        ul#siteNav li#nav_join a:hover {
            background-position: 0px -10px;
        }
            ul#siteNav li a span {
                position: absolute;
                left: -999999px;
            }

div#sectionHeader {
    position: absolute;
    top: 36px;
    right: 35px;
}
    div#sectionHeader h6 {
	    color: #fdbf57;
	    font-family: Arial, Verdana, sans-serif;
	    font-size: 4.0em;
	    font-weight: normal;
	    letter-spacing: -3px;
	    line-height: 1.2em;
	    text-align: right;
	    text-transform: uppercase;
	    margin: 0;
    }

ul#sectionNav {
	list-style: none;
	height: 29px;
	margin: 0;
	padding: 0;
	position: absolute;
	bottom: 0px;
	right: 35px;
}
	ul#sectionNav li {
		color: #333333;
		line-height: 29px;
		height: 29px;
		float: left;
		display: inline;
		margin: 0 0 0 1px;
		padding: 0 12px;
		border-right: 1px solid #b5813c;
		border-left: 1px solid #c59c65;
		background: url(../../_images/_ui/bg_sectionnav.gif) no-repeat center top;
	}
	ul#sectionNav li.first {
		margin: 0;
		padding: 0 12px 0 15px;
		border-left: 0px none;
		background-position: left top;
	}
	ul#sectionNav li.last {
		padding: 0 15px 0 12px;
		border-right: 0px none;
		background-position: right top;
	}
	ul#sectionNav li.in {
		background-position: center bottom;
	}
	ul#sectionNav li.first.in {
		background-position: left bottom;
	}
	ul#sectionNav li.last.in {
		background-position: right bottom;
	}
	    ul#sectionNav li a:link,
	    ul#sectionNav li a:visited {
		    color: #f3e8d3;
	    }
	    ul#sectionNav li a:hover,
	    ul#sectionNav li a:visited:hover,
	    ul#sectionNav li a:active {
		    color: #4b1d03;
	    }
	    ul#sectionNav li.in a {
		    color: #4b1d03;
	    }

/*** /mainnav ***/

/*** footer ***/

div#footer {
	height: 30px;
	background: url(../../_images/_ui/bg_footer.jpg) no-repeat;
	padding: 112px 20px 7px 20px;
}

    div#footer ul.footernav {
	    list-style: none;
	    margin: 0;
	    padding: 0;
    }
	    div#footer ul.footernav li {
		    display: inline;
		    margin: 0;
		    padding: 0 15px;
		    border-left: 1px solid #705d55;
		    font-size: 0.9em;
	    }
	    div#footer ul.footernav li:first-child {
		    padding: 0 15px 0 0;
		    border: 0px none;
	    }
		    div#footer ul.footernav li a:link,
		    div#footer ul.footernav li a:visited,
		    div#footer ul.footernav li a:hover,
		    div#footer ul.footernav li a:visited:hover,
		    div#footer ul.footernav li a:active {
			    color: #c1b19d;
		    }
		    
		div#footer ul.footernav li.right 
		{
		    float:right;
		    border:none;  
			padding: 0 10px 0 0;  
		}
		
		    div#footer ul.footernav li.right a
		    {
		        width:21px;
		        height:21px; 
		        display:block; 
		    }    

                 a.youtube 
                 {
                     background:url(../../_images/common/youtube-rounded.png) no-repeat;
                 }
                 
                 a.twitter 
                 {
                     background:url(../../_images/common/twitter-rounded.png) no-repeat;
                 }
                 
                 a.facebook 
                 {
                     background:url(../../_images/common/facebook-rounded.png) no-repeat;
                 }
            
/*** /footer ***/

/*** content ***/

div#content {
    min-height: 400px;
    padding: 1px 0 40px 0;
    background: #f5f4e8;
}
    div#content div#fullCol {
        width: 920px;
        min-height: 400px;
        padding: 20px 40px 20px 40px;
    }
    div#content div#mainCol {
        float: right;
        display: inline;
        width: 680px;
        min-height: 400px;
        padding: 20px 35px 20px 0;
    }
    div#content div#subCol {
        float: left;
        display: inline;
        width: 200px;
        min-height: 240px;
        padding: 20px 10px 60px 45px;
        background: #ba3638 url(../../_images/_ui/bg_subcol_br.gif) no-repeat right bottom;
    }

/* tertinav */

ul#tertiNav {
	list-style: none;
	margin: 0 -10px 0 -45px;
	padding: 0;
}
	ul#tertiNav li {
		color: #f5f4e8;
		line-height: 1.2em;
		margin: 0;
		padding: 8px 10px 7px 55px;
		border-bottom: 1px solid #c85e60;
		position: relative;
	}
	ul#tertiNav li.in {
		background: #000000;
	}
	    ul#tertiNav li a:link,
	    ul#tertiNav li a:visited {
		    color: #f5f4e8;
	    }
	    ul#tertiNav li a:hover,
	    ul#tertiNav li a:visited:hover,
	    ul#tertiNav li a:active {
		    color: #fdbf57;
	    }
	    ul#tertiNav li.in a {
		    color: #fdbf57;
	    }
	    ul#tertiNav li span.indicator {
		    visibility: hidden;
		    width: 7px;
		    height: 28px;
		    background: url(../../_images/_ui/tertinav_in.gif) no-repeat;
		    position: absolute;
		    right: -7px;
		    top: 0px;
	    }
	    ul#tertiNav li.in span.indicator {
		    visibility: visible;
	    }

/* /tertinav**/

/*** /content ***/

/*** homepage  ***/

div.homepage  {
    background: url(../../_images/home/bg/bg1.jpg) no-repeat top;
}
    div.homepage div#header {
        background: none;
    }
    div.homepage div#mainnav {
        background: none;
    }
    div.homepage div#footer {
	    background: url(../../_images/_ui/bg_homefooter.jpg) no-repeat;
	    padding: 22px 20px 7px 20px;
    }
    div.homepage div#content {
        min-height: 441px;
        height: 441px;
        padding: 0;
        background: none;
    }
        div.homepage div#content div#uppercontent {
            width: 1000px;
            height: 247px;
            position: relative;
            z-index: 2;
        }
        div.homepage div#content div#lowercontent {
            width: 1000px;
            height: 194px;
            background: url(../../_images/home/bg_lowercontent.jpg) no-repeat;
            position: relative;
            z-index: 1;
        }

/*** /homepage  ***/

/*** misc  ***/

div.subcolcallout {
	color: #cfc39f;
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size: 1.1em;
	font-style: italic;
	margin: 80px 0 1.5em 0;
	padding-right: 20px;
}
    div.subcolcallout h3 {
	    color: #cfc39f;
    }
    div.subcolcallout p {
	    line-height: 2.2em;
    }
    div.subcolcallout a {
	    color: #ffffff;
    }

ul.splashpage {
    list-style: none;
    width: 680px;
    padding: 1.5em 0 0 0;
    background: url(../../_images/_ui/hr.gif) repeat-x left top;
}
    ul.splashpage li {
	    margin: 0 0 1.5em 0;
	    padding: 0 0 1.5em 0;
	    background: url(../../_images/_ui/hr.gif) repeat-x left bottom;
	    zoom: 1;
    }
        ul.splashpage li div.colA {
	        float: left;
	        display: inline;
        }
            ul.splashpage li div.colA img {
	            border: 1px solid #ffffff;
            }
            ul.splashpage li div.colA img.graphic {
	            border: 1px solid #f5f4e8;
            }
        ul.splashpage li div.colB {
	        float: right;
	        display: inline;
	        width: 415px;
        }
            ul.splashpage li div.colB p,
            ul.splashpage li div.colB ul {
	            margin: 0;
            }
                ul.splashpage li div.colB ul li {
	                background: none;
                }

div.twoCols {
    margin: 0 0 1.5em 0;
}
    div.twoCols div.colA {
	    float: left;
	    display: inline;
	    width: 450px;
	    margin: 0 20px 0 0;
    }
    div.twoCols div.colB {
	    float: left;
	    display: inline;
	    width: 450px;
    }
    div.twoCols div.colA_wide {
	    float: left;
	    display: inline;
	    width: 600px;
	    margin: 0 20px 0 0;
    }
    div.twoCols div.colB_narrow {
	    float: left;
	    display: inline;
	    width: 300px;
	    padding-top: 5.2em;
    }

div.threeCols {
    margin: 0 0 1.5em 0;
}
    div.threeCols div.colA {
	    float: left;
	    display: inline;
	    width: 330px;
	    margin: 0 20px 0 0;
    }
    div.threeCols div.colB {
	    float: left;
	    display: inline;
	    width: 330px;
	    margin: 0 20px 0 0;
    }
    div.threeCols div.colC {
	    float: left;
	    display: inline;
	    width: 220px;
    }

div.infobox {
	margin: 0 0 1.5em 0;
	padding: 12px 15px 2px 15px;
	border: 1px solid #ffffff;
	background: #dfddcb;
}
    div.infobox ul,
    div.infobox ol,
    div.infobox dl,
    div.infobox p {
	    margin: 0 0 1.0em 0;
    }
    div.infobox div.colA {
	    float: left;
	    display: inline;
	    width: 400px;
    }
    div.infobox div.colB {
	    float: right;
	    display: inline;
	    width: 220px;
    }

ul.tablistnav {
	list-style: none;
    float: left;
    display: inline;
	width: 680px;
	margin: 0;
	border-bottom: 2px solid #000000;
}
    ul.tablistnav li {
		line-height: 31px;
		height: 31px;
		float: left;
		display: inline;
	    margin: 0;
	    padding: 0 25px;
		border-left: 1px solid #ffffff;
		background: url(../../_images/_ui/tabsbg.gif) no-repeat center top;
    }
    ul.tablistnav li.first {
		border: 0px none;
		background-position: left top;
    }
    ul.tablistnav li.last {
		background-position: right top;
    }
    ul.tablistnav li.in {
		background-position: center bottom;
	}
        ul.tablistnav li.in a {
		    color: #ffffff;
	    }
	ul.tablistnav li.first.in {
		background-position: left bottom;
	}
	ul.tablistnav li.last.in {
		background-position: right bottom;
	}

/*** /misc  ***/

/*** sitemap  ***/

ul.sitemapSectionList {
	list-style: none;
	margin-left: 20px;
}
	ul.sitemapSectionList li {
		margin: 0;
	}
	ul.sitemapSectionList ul {
		list-style: none;
		margin-left: 20px;
	}

/*** /sitemap  ***/

