/* ========================================================================== Site: Subtv Media File: media.css Version: 1.0 Author: Roman Leinwather & Faren Gambril Last updated: 09/03/2009 ========================================================================== TABLE OF CONTENT I. Secondary navigation II. Main Content ========================================================================== */ /* I. Secondary navigation ========================================================================== */ #media_page #secondary_navigation a {display:block; height:27px;} #media_page #secondary_navigation #general_information_sn {background: url(../img/media_secondary_nav_sprite.png) 0 0 no-repeat;} #media_page #secondary_navigation #opportunities_sn {background: url(../img/media_secondary_nav_sprite.png) -167px 0 no-repeat;} #media_page #secondary_navigation #audience_sn {background: url(../img/media_secondary_nav_sprite.png) -333px 0 no-repeat;} #media_page #secondary_navigation #contact_us_sn {background: url(../img/media_secondary_nav_sprite.png) -501px 0 no-repeat;} #media_page #secondary_navigation #general_information_sn:hover, #media_page #secondary_navigation #general_information_sn.selected {background: url(../img/media_secondary_nav_sprite.png) 0px -29px no-repeat;} #media_page #secondary_navigation #opportunities_sn:hover, #media_page #secondary_navigation #opportunities_sn.selected {background: url(../img/media_secondary_nav_sprite.png) -167px -29px no-repeat;} #media_page #secondary_navigation #audience_sn:hover, #media_page #secondary_navigation #audience_sn.selected {background: url(../img/media_secondary_nav_sprite.png) -333px -29px no-repeat;} #media_page #secondary_navigation #contact_us_sn:hover, #media_page #secondary_navigation #contact_us_sn.selected {background: url(../img/media_secondary_nav_sprite.png) -501px -29px no-repeat;} /* II. Main Content ========================================================================== */ /* 4 COLUMNS TEMPLATE */ #main_content {float:left; padding:0 20px 20px 20px; width:950px; overflow:hidden;} #main_content div {float:left; width:200px; background: url(../img/box_bg.png) bottom right no-repeat; margin-right:20px; padding:10px;} #main_content div h3 {font-size:20px; padding-bottom:15px;} #main_content div.column_1 h3 {background: url(../img/about_icons_sprite.png) -21px 0 no-repeat; padding-top:110px;} #main_content div.column_2 h3 {background: url(../img/about_icons_sprite.png) -23px -172px no-repeat; padding-top:110px;} #main_content div.column_3 h3 {background: url(../img/about_icons_sprite.png) -27px -387px no-repeat; padding-top:110px;} #main_content div.column_4 h3 {background: url(../img/about_icons_sprite.png) -25px -638px no-repeat; padding-top:110px;} #main_content div.column_4 {margin-right:0px;} #main_content #wide_cover {width:10000px;} /* 1 Column Layout */ #main_content div.column_long {width:760px; padding-left:160px; background: url(../img/about_icons_sprite.png) -63px 18px no-repeat;} #main_content div.column_long #university_text {float:left; width: 350px;} #main_content div.column_long #university_text h3 {float:left; width: 350px;} #main_content div.column_long #university_text p {float:left; width: 350px; padding-right:20px;} #main_content div.column_long #university_box {float:left; width:350px; margin-right:0px;} #main_content div.column_long #university_box ul {float:left; width:350px; height:150px; background:#999; padding:10px 0; background:#f2f2f2; border:1px solid #e1e1e1; overflow:auto;} #main_content div.column_long #university_box ul li {float:left; width:300px; margin: 5px 0 0 10px; padding:2px 0px 2px 20px; background: url(../img/list_bullet.png) 5px 7px no-repeat; } #main_content div.column_long #university_box ul li.odd {float:left; background:#fff url(../img/list_bullet.png) 5px 7px no-repeat;} /* 5 What we offer */ #main_content div#general_information_block {width:950px; float:left;} #main_content div#general_information_block div.column_long h4 {font-weight:bold; padding-bottom:5px; float:left;} #main_content div#general_information_block div.column_long p {width:960px; padding-right:20px; float:left;} #main_content div#general_information_block div.column_long a {color:#00a0f4; text-decoration:none;} #main_content div#general_information_block div.column_long a:hover {color:#00a0f4;} #main_content div#general_information_block div.column_long ul {width:760px; padding-right:20px; float:left;} #main_content div#general_information_block div.column_long ul li {padding-bottom:10px; float:left; width:760px;} #main_content div#general_information_block div.column_long ul li li {background: url(../img/list_bullet.png) 0 5px no-repeat; padding: 0 0 2px 20px; float:left; clear:both;} /* 5 What we offer Vid Buttons */ #main_content div#general_information_block #spot_video {display:block; width:167px; height:31px; background: url(../img/media_buttons_sprite.png) 0 0 no-repeat;} #main_content div#general_information_block #spot_video:hover {background: url(../img/media_buttons_sprite.png) 0 -31px no-repeat;} #main_content div#general_information_block #film_video {display:block; width:145px; height:31px; background: url(../img/media_buttons_sprite.png) -166px 0 no-repeat; margin-top:10px;} #main_content div#general_information_block #film_video:hover {background: url(../img/media_buttons_sprite.png) -166px -31px no-repeat;} #main_content div#general_information_block #sponsor_video {display:block; width:147px; height:31px; background: url(../img/media_buttons_sprite.png) -310px 0 no-repeat; margin-top:10px;} #main_content div#general_information_block #sponsor_video:hover {background: url(../img/media_buttons_sprite.png) -310px -31px no-repeat;} /* 6 The screens */ #main_content div#opportunities_block {width:950px; float:left;} #main_content div#opportunities_block img {float:left; padding: 20px 10px 20px 0;} #main_content div#opportunities_block p#screens_description {float:left; width:130px; clear:none; padding:44px 0 0 33px; font-style:italic; font-family:Georgia, "Times New Roman", Times, serif; font-size:11px; background: url(../img/quote_top.png) 1px 36px no-repeat;} #main_content div#opportunities_block p#screens_description span {font-weight:bold; padding:10px 31px 0 0; display:block; background: url(../img/quote_bottom.png) bottom right no-repeat;} #main_content div#opportunities_block p {clear:both;} /* 6 The screens Vid Buttons */ #main_content div#opportunities_block #screens_video {display:block; width:147px; height:31px; background: url(../img/media_buttons_sprite.png) -460px 0 no-repeat; margin-top:10px;} #main_content div#opportunities_block #screens_video:hover {background: url(../img/media_buttons_sprite.png) -460px -31px no-repeat;} /* 7 Universities */ #main_content div#audience_block {width:950px; float:left;} /* 8 Competitive Rates */ #main_content div#contact_us_block {width:950px; float:left;} #main_content div#contact_us_block div.column_long h4 {font-weight:bold; padding-bottom:10px; float:left;} #main_content div#contact_us_block div.column_long p {width:760px; padding-right:20px; float:left;} #main_content div#contact_us_block div.column_long ul {width:760px; padding-right:20px; float:left;} #main_content div#contact_us_block div.column_long ul li {padding:0 0 3px 20px; float:left; background: url(../img/list_bullet.png) 0 5px no-repeat; clear:both;}