#main{ margin:auto; height: 260px; width: 950px; overflow: hidden; color: white; font-family: arial; position:relative; } #pics, #pics img{ z-index: -5000; width: 650px; margin: 0; padding: 0; height: 260px; } #info{ height: 260px; float: left; clear: right; width: 300px; background: url('../../images/home_page/interactive/black_welcome_whole.png'); background-repeat: no-repeat; position:relative; } .replace ul{ margin-left: -25px; } #top{ width: 251px; margin: auto; position: relative; top: 10px; bottom: 20px; } #top .title{ font-size: 14px; line-height: 20px; margin-top:5px; margin-bottom: 5px; } #message { width: 125px; padding-left: 21px; float: left; } #message .message_text{ font-size: 12px; line-height: 16px; padding-top: 21px; text-indent: -4px; } #image { height: 260px; float: left; padding-left: 25px; padding-top: 25px; } #image img { width: 90px; height: 128px; } #interactive{ display: block; height: 260px; width: 650px; float: left; z-index: -200; overflow:hidden; font-size: 14px; } #submenu1{ top: -40px; visibility: hidden; position: relative; float: left; clear: left; height: 40px; width: 215px; background: url('../../images/home_page/interactive/sub_menu.png') repeat-y; z-index: 1000; } #submenu1 p, #submenu2 p, #submenu3 p{ color: #d3d3d3; margin-left: 25px; margin-top: 10px; cursor: pointer; } #submenu1 p span:hover, #submenu2 p span:hover, #submenu3 p span:hover{ color: #FFFFFF; } #submenu1 p span, #submenu2 p span, #submenu3 p span{ width: 100px; position: relative; left: 13px; top: -13px; } #submenu1 ul, #submenu2 ul, #submenu3 ul{ font-size: 12px; letter-spacing: -.5px; position: relative; left: 40px; width: 175px; } #submenu1 a, #submenu2 a, #submenu3 a{ color: inherit; text-decoration: none; } #submenu2, #submenu3{ top: -40px; visibility: hidden; position: relative; margin-left: 0px; float: left; height: 40px; width: 215px; background: url('../../images/home_page/interactive/sub_menu.png') repeat-y; z-index: 1000; } /*CSS Menu with Sprites*/ #menu{ padding-top: 1px; height: 30px; margin: auto; width: 950px; padding-bottom: 10px; } #menu ul{ height: 30px; width: 950px; position: relative; padding: 0; margin: 0; } #menu li a{ display: block; top: 0; width: 163px; height: 30px; } #menu ul li{ display: inline; float: left; } li#president_message a{ left: 0; width: 300px; background-image: url('../../images/home_page/interactive/darkgreybar_rounded.jpg'); background-position: 0px -31px; } li#president_message a:hover, li#president_message a.active{ left: 0; width: 300px; background-position: 0 0; } li#honorCode a{ left: 0; width: 162px; background-image: url('../../images/home_page/interactive/bluebar_middle.png'); background-position: -31px; } li#honorCode a:hover, li#honorCode a.active{ left: 0; width: 162px; background-position: 0 0; } li a p{ font-size: 64%; color: white; letter-spacing: 2px; text-align: center; padding-top: 10px; } li#learningModel a{ left: 0; list-style: none; width: 162px; text-decoration: none; background-image: url('../../images/home_page/interactive/bluebar_middle.png'); background-position: 0px -31px; } li#learningModel a:hover, li#learningModel a.active{ left: 0; width: 162px; background-position: 0px 0; } li#leadershipDevelopment a{ left: 0; width: 190px; background-position: -380px -31px; } li#leadershipDevelopment a:hover, li#leadershipDevelopment a.active{ left: 0; width: 190px; background-position: -380px 0; } li#disciplePreparation a{ left: 0; width: 190px; background-position: -570px -31px; } li#disciplePreparation a:hover, li#disciplePreparation a.active{ left: 0; width: 190px; background-position: -570px 0; } li#spiritOfRicks a{ left: 0; width: 164px; text-decoration: none; background-image: url('../../images/home_page/interactive/bluebar_rounded.png'); background-position: 0px -31px; } li#spiritOfRicks a:hover, li#spiritOfRicks a.active{ left: 0; width: 164px; background-position: 0 0; } /*End of CSS menu with sprites*/ #submenu1 .video{ margin: auto auto auto 15px; } .separator{ visibility: hidden; z-index: 100; position: relative; top: -40px; width: 2px; height: 50px; float: left; margin-left: 0px; background-image: url('../../images/home_page/interactive/two_px_divider_line.png'); } #main div p span{ margin-left: 2px; } #more { position:absolute; top:263px; width:298px; height: 38px; z-index: 1000; } #more p { position: relative; margin-left: 0px; line-height: 13px; color: #ccc; width: 200px; float: left; top: 0px; font-size: 12px; } #more a{ position: relative; width: 16px; height: 16px; margin-left: 30px; top: 5px; float: left; clear: right; } #more img { width: 16px; height: 16px; } .leftBox{ position: absolute; margin-top: -23px; margin-left: 15px; }