/* CSS Document */
h1,h2,h3,h4,h5{font: Arial, Helvetica, sans-serif; color: #4a372d;}
body {background: url(images/bg.png); font-family: Arial, Helvetica, sans-serif; color: #4a372d;}
body a{color: #4a372d;}
body a:hover{color: #1961b1}

#container{margin: 0 auto; width: 1000px; margin-top: 10px;}

#title {background: url(images/title.gif) no-repeat top left; position: relative; width: 328px; height: 222px; padding: 0; margin: 0; float: left; clear: left;}
#title a{display: block; width: 328px; height: 222px;}
#title span{display: none;}

#navframe{background: url(images/navframe.gif) no-repeat top left; position: relative; width: 264px; height: 289px; margin: 50px 0 0 30px; padding: 0; float: left; clear: left;}

#nav{width: 71px; height: 128px; background: url(images/nav.jpg) no-repeat top left; margin: 80px 0 0 80px; padding: 0; position: absolute;}
#nav ul{list-style: none; margin: 0; padding: 0;}
#nav ul li{display:inline; padding:0; margin:0;}
#nav ul li a{display:block; float:left; height: 28px;}
#nav ul li a span{display: none;}

#nav ul li.twoD a{width: 50px;}
#nav ul li.threeD a{width: 50px;}
#nav ul li.video a{width: 65px; height: 35px;}
#nav ul li.web a{width: 60px; height: 33px;}

#nav ul li a:hover{background: url(images/nav.jpg) no-repeat top left;}
#nav ul li.twoD a:hover{background-position: 0 -127px;}
#nav ul li.threeD a:hover{background-position: 0 -155px;}
#nav ul li.video a:hover{background-position: 0 -183px;}
#nav ul li.web a:hover{background-position: 0 -218px;}

#main{background: url(images/main.gif) no-repeat top left; position: relative; float: left; width: 598px; height: 516px; margin: 0 20px 0 0; padding: 0; float: right; text-align: center;}
#main .intro{width: 372px; height: 304px; overflow: hidden; padding: 0; margin: 100px 0 0 105px; #margin-left: -10px;}
#main .vertical{width: 372px; height: 304px; padding: 0; margin: 105px 0 0 112px; #margin-left: -5px;}
#main .verticalPair{width: 372px; height: 304px; padding: 0; margin: 135px 0 0 110px; #margin-left: -5px;}
#main .horizontal{width: 372px; height: 304px; padding: 0; margin: 134px 0 0 110px; #margin-left: -5px;}
#main .video{width: 372px; height: 304px; padding: 0; margin: 130px 0 0 110px; #margin-left: -5px;}
#main .web{width: 372px; height: 304px; padding: 0; margin: 106px 0 0 110px; #margin-left: -5px;}

#main .parasol{width: 372px; height: 304px; padding: 0; margin: 108px 0 0 110px; #margin-left: -5px;}
#main .sam{width: 372px; height: 304px; padding: 0; margin: 145px 0 0 110px; #margin-left: -5px;}
#main .hat{width: 372px; height: 304px; padding: 0; margin: 166px 0 0 110px; #margin-left: -5px;}
#main .typeface{width: 372px; height: 304px; padding: 0; margin: 175px 0 0 110px; #margin-left: -5px;}
#main .logo{width: 372px; height: 304px; padding: 0; margin: 177px 0 0 110px; #margin-left: -5px;}

#main h1{font-size: 19px; margin: 40px 0 15px 15px; padding: 0;}
#main h2{font-size: .9em; margin: 0 0 15px 15px; padding: 0;}
#main p{font-size: .9em; margin: 0 0 15px; padding: 0;}
#main ul li{list-style: none; font-size: .9em; text-align: left; margin: 10px 0 0 25px;}
#main img{border: 1px solid #4a372d; margin: 2px;}
#main a img{border: 1px solid #4a372d; margin: 2px;}
#main a:hover img{border: 1px solid #69a4ee;}

#numberPane{position: absolute; float: left; clear: both; text-align: left; margin: 0; padding: 0; top: 420px; left: 110px;}

#infobox{position: relative; width: 400px; height: 95px; margin: 8px 120px 0 0; padding: 0; float: right; clear: right;}
#infobox span{display: none;}

#leftArrow{background: url(images/left.png) no-repeat top left; height: 31px; width: 37px; padding: 0; margin: 30px 0 0 0; position: relative; float: left;}
#leftArrow a{display:block; height: 31px; width: 37px;}
#leftArrow a span{display: none;}
#leftArrow a:hover{background: url(images/left.png) no-repeat top left; background-position: -37px 0;}

#rightArrow{background: url(images/right.png) no-repeat top left; background-position: -37px 0; height: 31px; width: 37px; padding: 0; margin: 30px 0 0 0; position: relative; float: right; clear: both;}
#rightArrow a{display:block; height: 31px; width: 37px;}
#rightArrow a span{display: none;}
#rightArrow a:hover{background: url(images/right.png) no-repeat top left; background-position: 0 0;}

#infoplate{background: url(images/infoplate.gif) no-repeat top left; position: relative; width: 308px; height: 95px; padding: 0; margin: 0 0 0 50px;}
#infoplate p{font-size: 13px; padding: 15px 29px 0 25px; margin: 0;}
#infoplate p.fiveLines{font-size: 13px; padding: 7px 25px 0 25px; margin: 0;}