/** ** CLEO BACHELORS 2008 ** =========================== **/ /* * Global Styles */ * { margin: 0; padding: 0; } a { color: #54798b; outline: 0; text-decoration: none; } body { background: #adbcc4 url(cleo/bachelors_phase2/bg/body.jpg) center top no-repeat fixed; color: #000; font-family: arial, helvetica, sans-serif; font-size: 12px; line-height: 18px; } em { font-style: italic; } img { border: 0; } strong { font-weight: bold; } td { vertical-align: top; } div { zoom: 1; } /* * NineMSN */ .ad300 { overflow: hidden; width: 300px; } .ad300 a, .ad300 img { display: block; } .initNinemsn { position: absolute; top: -1000px; left: 0px; width: 1px; } .initNinemsnBanner { position: absolute; top: 68px; left: 262px; } .initNinemsnBannerGalleryPopup { position: absolute; top: 18px; left: 0px; z-index: 999; } div#outerBox { position: relative !important; width: 990px !important; margin: 0 auto !important; } #hd_src_div #hd_ms_input { width: auto !important; } #msnhd_div3 { padding: 0 !important; } #nmsnhd_1, #nmsnhd_2 { width: 990px !important; } #pod_list #nmsnmd { padding-top: 20px !important; } #msnmd_div { display: none !important; } #tmpHeader1 { height: 59px; overflow: hidden; } #tmpHeader2 { left: 262px; position: absolute; top: 15px; } #tmpHeader3 { left: 15px; position: absolute; top: 0; } #nw_ft, #nw_ft_cpy { margin: 0 auto !important; } #msnbtmbanner { text-align: center; } #M1DIV { line-height: 1px; font-size: 1px; } /* * Container */ /* #outerBox { background: #fcfcfc; margin: 0 auto; width: 990px; } */ #mainBox { background: #fcfcfc; margin: 70px 0 0 0; width: 990px; } /* * Header */ #Masthead_pnlContent { background: #adbcc4; width: 990px; } #Masthead_pnlContent h1, #Masthead_pnlContent h1 a, #Masthead_pnlContent h1 a img { display: block; height: 90px; width: 250px; } /* * Nav */ #nav { height: 33px; list-style: none; margin: 8px 0 0; overflow: hidden; padding: 0 0 28px; position: relative; } #nav li { background: #497184 url(cleo/bachelors_phase2/bg/nav.png) 0 0 repeat-x; display: inline; float: left; margin: 0 2px 0 0; } #nav li a { color: #fff; display: block; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; padding: 7px 0 8px; text-align: center; text-transform: uppercase; } /* "Helvetica Neue", "Arial Narrow", 16px */ #nav li a:hover, #nav li a:focus { color: #e9c634; } #nav li.home { width: 82px; } #nav li.entertainment { width: 146px; } #nav li.style { width: 87px; } #nav li.men { width: 116px; } #nav li.health { width: 93px; } #nav li.stuff { width: 86px; } #nav li.competitions { width: 135px; } #nav li.forums { width: 103px; } #nav li.bachelors { background: #497184 url(cleo/bachelors_phase2/bg/nav_active.png) 0 0 repeat-x; margin: 0; width: 126px; } #nav li.home a { background: url(cleo/bachelors_phase2/bg/nav_left.png) 0 0 no-repeat; } #nav li.bachelors a { color: #1c4555; } #nav li ul { background: #fdfcfc url(cleo/bachelors_phase2/bg/sub_nav.gif) center bottom no-repeat; bottom: 0; left: 0; list-style: none; padding: 0 0 0 8px; position: absolute; width: 982px; } #nav li ul li { background: transparent; margin: 0; } #nav li ul li a { background: transparent; color: #2d5b72 !important; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; padding: 4px 16px 6px; } #nav li ul li a.active, #nav li ul li a:hover { color: #c8a615 !important; } #nav li ul li a.active { font-weight: bold; } /* * Sub Header */ .flash_slider { background: #fff; height: 76px; padding: 23px 0 0 28px; } .sub_header { background: #fff url(cleo/bachelors_phase2/bg/sub_header.gif) 630px 17px no-repeat; overflow: hidden; padding: 21px 0 0 668px; position: relative; width: 322px; } .sub_header .sponsor a { left: 402px; position: absolute; top: 17px; z-index: 9; } .sub_header .sponsor a, .sub_header .sponsor img { display: block; } .sub_header .search { border: 1px solid #abbfc3; display: inline; float: left; margin: 0 0 3px 16px; padding: 1px; position: relative; width: 273px; z-index: 9; } .sub_header .search label { background: url(cleo/bachelors_phase2/bg/search.gif); float: left; height: 11px; margin: 2px 0 0 -18px; overflow: hidden; position: relative; text-indent: -9999px; width: 11px; z-index: 99; } .sub_header .search input { border: 0; font-family: Arial, Helvetica, sans-serif; float: left; font-size: 11px; width: 251px; } .sub_header .search .btn { float: right; width: auto; } .sub_header .user_controls { clear: both; font-size: 10px; padding: 0 0 10px; position: relative; text-align: right; width: 297px; z-index: 9; } .sub_header .user_controls li { background: url(cleo/bachelors_phase2/bg/seperator.gif) 0 3px no-repeat; display: inline; padding: 0 6px 0 9px; } .sub_header .user_controls li.first { background: transparent; } .sub_header .user_controls a { color: #43697c; font-weight: bold; text-transform: uppercase; } .sub_header_home { background-position: 712px 17px; padding-left: 731px; width: 259px; } .sub_header_home .sponsor a { left: 483px; } .sub_header_home .search { width: 211px; } .sub_header_home .search input { width: 189px; } .sub_header_home .user_controls { width: 235px; } /* * Main Content */ #tcMidContent { padding: 0 31px 100px 29px; } #MiddleContent_pnlContent h2 { background-repeat: no-repeat; height: 74px; margin: -52px 0 0; position: relative; text-indent: -9999px; width: 417px; } /* * Headings */ #MiddleContent_pnlContent h2#cleo_bachelors { background-image: url(cleo/bachelors_phase2/ir/h2/cleo_bachelors.png); } #MiddleContent_pnlContent h2#bachelor_archive { background-image: url(cleo/bachelors_phase2/ir/h2/bachelor_archive.png); } #MiddleContent_pnlContent h2#bachelor_tv { background-image: url(cleo/bachelors_phase2/ir/h2/bachelor_tv.png); } #MiddleContent_pnlContent h2#cleo_bachelors { background-image: url(cleo/bachelors_phase2/ir/h2/cleo_bachelors.png); } #MiddleContent_pnlContent h2#bachelor_profiles { background-image: url(cleo/bachelors_phase2/ir/h2/bachelor_profiles.png); } #MiddleContent_pnlContent h2#h2_face_off { background-image: url(cleo/bachelors_phase2/ir/h2/face_off.png); } #MiddleContent_pnlContent h2#hottest_hoods { background-image: url(cleo/bachelors_phase2/ir/h2/hottest_hoods.png); } #MiddleContent_pnlContent h2#bachelor_home { background-image: url(cleo/bachelors_phase2/ir/h2/bachelor_home.png); } #MiddleContent_pnlContent h2#wildcard_profiles { background-image: url(cleo/bachelors_phase2/ir/h2/wildcard_profiles.png); } #MiddleContent_pnlContent h2#wildcard_home { background-image: url(cleo/bachelors_phase2/ir/h2/wildcard_home.png); } #MiddleContent_pnlContent h2#bachelor_home_short { background-image: url(cleo/bachelors_phase2/ir/h2/bachelor_home_short.png); } #MiddleContent_pnlContent h2#past_winners { background-image: url(cleo/bachelors_phase2/ir/h2/past_winners.png); } #MiddleContent_pnlContent h2#the_boys { background-image: url(cleo/bachelors_phase2/ir/h2/the_boys.gif); } /* * Home Page */ #home { margin: 0 -5px 0 -4px; overflow: hidden; position: relative; } #home .flash_slider { height: auto; } #home .flash_slider div { height: 76px; margin: 0 0 0 -28px; } #home .flash_slider h3 { background: url(cleo/bachelors_phase2/ir/whos_hot_right_now.png); height: 18px; margin: 0 0 12px; overflow: hidden; text-indent: -9999px; width: 191px; } #home .flash_slider h3.theBoys { background: url(cleo/bachelors_phase3/ir/the_bachelor_boys.png); height: 18px; margin: 0 0 12px; overflow: hidden; text-indent: -9999px; width: 191px; } #flash_container { margin: -15px 0 0; } .homepage_pods { overflow: hidden; padding: 16px 0 0; } .homepage_pods .ad300 { float: left; } .pod_container { margin: 21px -15px 0 0; overflow: hidden; width: 616px; } .homepage_pods .bachelor_spotlight, .pod_container .bachelor_spotlight { float: left; margin: 0 15px 0 0; height: 228px; overflow: hidden; } .homepage_pods .article_list { float: left; margin: 0 15px 0 0; } .pod_container .featured_story { float: left; } #img_pod { float: left; margin: 0 15px 0 0; } #img_pod a, #img_pod img { display: block; height: 250px; width: 146px; } #bachelor_tv_pod { background: #686868 url(cleo/bachelors_phase2/bg/bachelor_tv.jpg) 0 0 repeat-x; float: left; height: 250px; margin: 0 15px 0 0; position: relative; width: 146px; } #bachelor_tv_pod a { bottom: 8px; display: block; left: 0; position: absolute; } #bachelor_tv_pod img { display: block; } #bachelor_tv_pod h4 { margin: 17px 0 12px 13px; } #bachelor_tv_pod h4 a { background: url(cleo/bachelors_phase2/ir/bachelor_tv.gif); height: 19px; overflow: hidden; position: static; text-indent: -9999px; width: 119px; } #bachelor_tv_pod p { color: #a8a7a8; font-size: 11px; line-height: 16px; margin: 0 15px; } #bachelor_tv_pod .more { display: none; } .quiz_pod { border-top: 1px solid #cac9c9; color: #18232d; float: left; font-size: 11px; line-height: 14px; margin: 0 15px 0 0; overflow: hidden; padding: 67px 27px 0 10px; position: relative; width: 270px; } .quiz_pod h4 { left: 10px; position: absolute; top: 13px; } .quiz_pod h4 a { background: url(cleo/bachelors_phase2/ir/take_the_bachelor_quiz.png); display: block; height: 39px; overflow: hidden; text-indent: -9999px; width: 215px; } .quiz_pod a, .quiz_pod a img { display: block; } .quiz_pod p { margin: 10px 0 0; } .quiz_pod .more { display: none; } .subscribe_pod { background: #e6e6e6; border: 1px solid #cac9c9; float: left; padding: 19px 16px 23px 28px; position: relative; width: 254px; } .subscribe_pod ul { color: #364049; font-family: Arial, Helvetica, sans-serif; float: left; font-size: 14px; line-height: 14px; list-style: none; margin: 0 10px 0 0; overflow: hidden; text-align: center; text-transform: uppercase; width: 86px; } /* "Helvetica Neue", "Arial Narrow" */ .subscribe_pod li { border-bottom: 1px dotted #aaabac; margin: 0 0 -1px; padding: 4px 0; } .subscribe_pod strong { color: #345a6d; display: block; font-size: 22px; font-weight: bold; line-height: 22px; margin: 0 0 1px; } .subscribe_pod img { background: #fff; border: 1px dotted #aaabac; display: block; float: left; padding: 5px; } .subscribe_pod .expand a { background: url(cleo/bachelors_phase2/btn/expand.png); display: block; height: 48px; left: -12px; margin: -24px 0 0; overflow: hidden; position: absolute; text-indent: -9999px; top: 50%; width: 30px; } .top_100_pod { background: #54798b; float: left; font-size: 11px; line-height: 14px; margin: 0 15px 0 0; padding: 16px 14px 13px; width: 411px; } .top_100_pod h3 { background: url(cleo/bachelors_phase2/ir/top_100_wildcard_profiles.png); height: 20px; margin: 0 0 16px; overflow: hidden; text-indent: -9999px; width: 264px; } .top_100_pod a, .top_100_pod a img { display: block; } .top_100_pod h4 { font-size: 12px; font-weight: bold; margin: 13px 0 6px; } .top_100_pod h4 a { color: #000; display: inline; } .top_100_pod p { margin: 0 0 3px; } .top_100_pod .more { color: #cbdce5; display: inline; font-size: 10px; font-weight: bold; } .winners_2008_pod { background: #becdd0 url(cleo/bachelors_phase2/bg/interview_with_2008_winners.png) 37px 0 no-repeat; float: left; font-size: 11px; font-weight: bold; margin: 0 10px 0 0; padding: 11px 11px 42px; text-transform: uppercase; width: 269px; } .winners_2008_pod h3 { background: url(cleo/bachelors_phase2/ir/interview_with_2008_winners.png); height: 47px; margin: 0 0 15px; overflow: hidden; text-indent: -9999px; width: 145px; } .winners_2008_pod ul { background: #54798b; list-style: none; overflow: hidden; } .winners_2008_pod ul li { background: #54798b; border-left: 1px dotted #becdd0; float: left; } .winners_2008_pod ul li.first { border: none; } .winners_2008_pod ul li a { color: #d7e0e4; overflow: hidden; padding: 8px 0 3px; } .winners_2008_pod ul li a, .winners_2008_pod ul li img { display: block; } .winners_2008_pod ul li span { float: left; margin: 2px 6px 0; } .highlight { background: #000; color: #abaaaa; overflow: hidden; position: relative; } .highlight h3 { height: 124px; overflow: hidden; position: absolute; right: 0; text-indent: -9999px; top: 0; width: 229px; } .highlight .img { float: left; } .highlight .img a, .highlight .img img { display: block; } .highlight .description { float: left; padding: 110px 0 0; position: relative; z-index: 9; } .highlight .description h4 { font-size: 20px; font-weight: normal; margin: 0 0 15px; text-transform: uppercase; } .highlight .description h4 a { color: #becdd0; } .highlight h3.your_no1 { background: url(cleo/bachelors_phase2/ir/your_no1.png); } .highlight h3.your_winner { background: url(cleo/bachelors_phase2/ir/your_winner.png); } .highlight h3.winner_2008 { background: url(cleo/bachelors_phase2/ir/winner_2008.png); } .wildcard_home { background: #000 url(cleo/bachelors_phase2/bg/wildcard_home.jpg) 0 0 no-repeat; } .wildcard_home .img { padding: 121px 94px 83px 90px; width: 172px; } .wildcard_home .img a, .wildcard_home .img img { height: 168px; width: 172px; } .wildcard_home .description { width: 230px; } .wildcard_home .description p { margin: 0 0 17px; } .wildcard_home .description .view_profile a { background: url(cleo/bachelors_phase2/btn/view_wildcard_profile.png); display: block; height: 26px; margin: 0 0 17px; overflow: hidden; text-indent: -9999px; width: 118px; } .winner_home { background: #000 url(cleo/bachelors_phase2/bg/winner_home.jpg) 0 0 no-repeat; height: 372px; } .winner_home .img { padding: 42px 65px 0 49px; width: 241px; } .winner_home .img a, .winner_home .img img { height: 287px; width: 241px; } .winner_home .description { width: 220px; } .past_winners { background: #000 url(cleo/bachelors_phase2/bg/past_winners.gif) 0 0 no-repeat; color: #becdd0; font-size: 11px; line-height: 16px; height: 372px; } .past_winners .img { padding: 54px 47px 0 46px; width: 241px; } .past_winners .img a { background: url(cleo/bachelors_phase2/btn/view_my_profile.gif) 0 bottom no-repeat; padding: 0 0 34px; } .past_winners .img a, .past_winners .img img { height: 263px; width: 241px; } .past_winners .description { padding: 100px 0 0; width: 250px; } .past_winners .description h4 { margin: 0 0 12px; } .past_winners .description dl { font-size: 12px; line-height: 18px; margin: 0 0 4px; overflow: hidden; } .past_winners .description dl dt { clear: left; float: left; margin: 0 3px 2px 0; } .past_winners .description dl dd { margin: 0 0 2px; } /* * Profile Page */ #profile { background: #becdd0; color: #000; font-size: 11px; line-height: 16px; overflow: hidden; padding: 21px 24px 8px 23px; position: relative; } #profile .intro { background: #fff; overflow: hidden; padding: 12px 0 13px; } #profile .image { border-right: 1px dotted #3f6578; float: left; padding: 0 15px 0 13px; width: 245px; } #profile .image a { background: url(cleo/bachelors_phase2/btn/launch_gallery.png) left bottom no-repeat; display: block; padding: 0 0 24px; } #profile .image img { display: block; height: 325px; width: 245px; } #profile .description { float: left; padding: 34px 0 0 44px; width: 200px; } #profile h3 { border-bottom: 1px dotted #345a6d; color: #0e080a; font-size: 23px; line-height: 29px; padding: 0 0 4px; margin: 0 0 12px; } #profile dl { color: #345a6d; font-size: 14px; line-height: 18px; margin: 0 0 11px; overflow: hidden; } #profile dt { clear: left; float: left; margin: 0 4px 0 0; } #profile dd { font-weight: bold; padding: 0 0 6px; } #profile ul { list-style: none; } #profile ul li { padding: 0 0 4px; } #profile ul a { display: block; overflow: hidden; text-indent: -9999px; width: 192px; } #profile ul .vote_for_me a { background: url(cleo/bachelors_phase2/btn/profile/vote_for_me.png); height: 32px; } #profile ul .join_my_facebook a { background: url(cleo/bachelors_phase2/btn/profile/join_my_facebook.png); height: 34px; } #profile ul .launch_gallery a { background: url(cleo/bachelors_phase2/btn/profile/launch_gallery.png); height: 35px; } #profile ul .watch_my_video a { background: url(cleo/bachelors_phase2/btn/profile/watch_my_video.png); height: 34px; } #profile .body { padding: 22px 0 0; } #profile .body p { margin: 0 0 6px; } #profile #tools { background: url(cleo/bachelors_phase2/bg/tools.png); } #profile .more a { background: url(cleo/bachelors_phase2/btn/buy_this_months_issue.jpg); display: block; height: 34px; margin: 16px 0 0; overflow: hidden; text-indent: -9999px; width: 517px; } a.profile_back { background: url(cleo/bachelors_phase2/btn/profile/back-button.jpg) no-repeat; display: block; height: 44px; margin: 0; padding: 0; text-indent: -9999px; } /* * Article */ .article { background: #54798b; color: #fff; line-height: 19px; overflow: hidden; padding: 17px 27px; } .article #tools { background: url(cleo/bachelors_phase2/bg/tools_article_ie6.png); } *>.article #tools { background: url(cleo/bachelors_phase2/bg/tools_article.png); } .article #articleImage { display: block; margin: 0 -13px 26px; } .article h3 { color: #000; font-size: 20px; font-weight: normal; line-height: 20px; margin: 0 0 7px; text-transform: uppercase; } .article .date { color: #000; font-size: 11px; font-weight: bold; margin: 0 0 9px; } .article p { margin: 0 0 13px; } .article a { color: #e8c741; } .article .insert { background: url(cleo/bachelors_phase2/bg/insert.jpg); color: #000; display: inline; float: right; height: 187px; margin: 0 -27px 5px 15px; overflow: hidden; padding: 22px 28px 0 57px; position: relative; width: 150px; } .article .insert h4 { font-size: 15px; font-weight: bold; line-height: 18px; margin: 0 0 3px; text-transform: uppercase; } .article .insert p { height: 90px; margin: 0; overflow: hidden; } .article .insert .comment { background: url(cleo/bachelors_phase2/btn/comment.png); bottom: 28px; display: block; height: 46px; overflow: hidden; position: absolute; right: 0; text-indent: -9999px; width: 186px; } .article .left { float: left; margin: 3px 24px 10px 0; } .article .right { float: right; margin: 3px 0 10px 24px; } .article .action { background: url(cleo/bachelors_phase2/btn/arrow_green_right.gif) right 5px no-repeat; clear: both; float: left; font-size: 13px; font-weight: bold; margin: 5px 0 2px; padding: 0 11px 0 0; text-transform: uppercase; } /* * Wildcard Profile Page */ #wildcard_profile { background: #becdd0; color: #000; overflow: hidden; padding: 27px 38px 27px; } #wildcard_profile h3 { font-size: 20px; font-weight: bold; line-height: 20px; margin: 79px 0 3px; text-transform: uppercase; } #wildcard_profile .byline { color: #3b3b3b; font-size: 10px; margin: 0 0 6px; } #wildcard_profile dl { float: left; font-size: 13px; margin: 0 0 6px; overflow: hidden; width: 221px; } #wildcard_profile dl dt { clear: both; float: left; font-weight: bold; margin: 0 4px 4px 0; } #wildcard_profile dl dd { margin: 0 0 4px; } #wildcard_profile .intro { clear: none; float: left; font-size: 13px; font-weight: bold; width: 221px; } #wildcard_profile .intro p { margin: 0 0 10px; } #wildcard_profile p { clear: both; } #wildcard_profile dl.questions { clear: both; float: none; font-size: 12px; margin: 0; width: auto; } #wildcard_profile dl.questions strong { color: #1d4558; margin: 0 3px 0 0; } #wildcard_profile dl.questions dt { float: none; font-weight: normal; margin: 0 0 3px; } #wildcard_profile dl.questions dd { margin: 0 0 3px; } #wildcard_profile .profile_gallery { float: left; margin: 0 32px 27px 0; width: 272px; } #wildcard_profile .profile_gallery a, #wildcard_profile .profile_gallery a img { display: block; } #wildcard_profile .profile_gallery a img { border: 11px solid #fff; } #wildcard_profile .profile_gallery ul { list-style: none; margin: 14px -11px 0 0; overflow: hidden; width: 283px; } #wildcard_profile .profile_gallery ul li { float: left; margin: 0 11px 0 0; } #wildcard_profile .profile_gallery ul li a { height: 24px; overflow: hidden; text-indent: -9999px; } #wildcard_profile .profile_gallery ul li.launch_gallery a { background: url(cleo/bachelors_phase2/btn/launch_wildcard_gallery.png); width: 118px; } #wildcard_profile .profile_gallery ul li.add_me_to_facebook a { background: url(cleo/bachelors_phase2/btn/add_me_to_facebook.png); width: 143px; } #wildcard_profile #tools { background: url(cleo/bachelors_phase2/bg/tools_wildcard.png); } #profile_list { background: url(cleo/bachelors_phase2/bg/top100.gif) 0 bottom no-repeat; font-size: 12px; line-height: 19px; list-style: none; margin: 0 -19px -9px 0; overflow: hidden; padding: 0 0 1px; width: 620px; } #profile_list li { background: #54798b; color: #fff; float: left; height: 164px; margin: 0 19px 18px 0; overflow: hidden; width: 291px; } #profile_list li a.image { float: left; margin: 25px 20px 26px 26px; } #profile_list li a.image img { height: 113px; width: 85px; } #profile_list li dl { display: inline; float: left; margin: 14px 26px 2px 0; overflow: hidden; width: 134px; } #profile_list li dl dt { clear: left; float: left; margin: 0 3px 0 0; } #profile_list li a { color: #000; font-size: 10px; font-weight: bold; text-transform: uppercase; } /* * Face Off */ #face_off { background: url(cleo/bachelors_phase2/bg/face_off.jpg); color: #becdd0; font-size: 17px; height: 599px; line-height: 18px; position: relative; width: 598px; } #face_off h3 { color: #fff; font-size: 23px; font-weight: bold; margin: 0 0 7px 13px; } #face_off div { height: 63px; margin: 0 0 0 13px; } #face_off .image { display: block; } #face_off .image img { display: block; height: 325px; width: 245px; } #face_off .pick_me, #face_off .vote_for_me { background: url(cleo/bachelors_phase2/btn/vote_for_me.png); display: block; height: 33px; margin: 57px 0 0 14px; overflow: hidden; text-indent: -9999px; width: 192px; } #face_off .pick_me { background: url(cleo/bachelors_phase3/btn/pick_me.png); } #face_off .view_profile { background: url(cleo/bachelors_phase2/btn/view_profile.png); display: block; height: 30px; margin: 0 0 0 14px; overflow: hidden; text-indent: -9999px; width: 192px; } #face_off .vs { background: url(cleo/bachelors_phase2/ir/vs_large.gif); height: 121px; left: 219px; overflow: hidden; position: absolute; text-indent: -9999px; top: 213px; width: 134px; z-index: 9; } *>#face_off .vs { background: url(cleo/bachelors_phase2/ir/vs_large.png); } #face_off .contestant_1, #face_off .contestant_2 { position: absolute; top: 25px; width: 245px; } #face_off .contestant_1 { left: 15px; } #face_off .contestant_2 { left: 311px; } #face_off .contestant_1 .image span { background-image: url(cleo/bachelors_phase2/face_off/frame_1.gif); } #face_off .contestant_2 .image span { background-image: url(cleo/bachelors_phase2/face_off/frame_2.gif); } /* * Gallery Index */ .gallery_thumbs { display: inline; float: left; font-size: 12px; line-height: 18px; list-style: none; margin: 0 -11px 0 0; text-align: center; text-transform: uppercase; width: 612px; } .gallery_thumbs li { background: #18232d; color: #fff; float: left; height: 204px; margin: 0 28px 25px 0; overflow: hidden; position: relative; width: 125px; } .gallery_thumbs li a.image, .gallery_thumbs li a.image img { display: block; } .gallery_thumbs li p { height: 18px; margin: 11px 5px 0; overflow: hidden; } .gallery_thumbs li a { display: none; } /* * Gallery Thumbs */ #gallery { background: #BECDD0; margin: -15px 0 0; overflow: hidden; padding: 30px; width: 510px; } #gallery { background: #BECDD0; margin: -22px 0 0; overflow: hidden; padding: 21px 24px 21px 23px; width: 554px; } #gallery .intro { background: #fff; overflow: hidden; padding: 12px 0 13px; } #gallery .gallery_images { float: left; font-size: 11px; margin: 0 20px -3px 0; padding: 0 0 0 10px; width: 274px; } #gallery .galleryList { float: left; list-style: none; margin: 0 0 1px; width: 264px; } #gallery .galleryList li { float: left; margin: 0 10px 10px 0; } #gallery .galleryList li a { display: block; height: 105px; width: 78px; overflow: hidden; } #gallery .photo_counter { display: inline; float: right; margin: 0 18px 0 0; } #gallery .gallery_description { color: #3F6578; float: left; line-height: 16px; padding: 61px 0 0; width: 216px; } #gallery .gallery_description h3 { color: #000; font-size: 20px; font-weight: normal; line-height: 20px; margin: 0 0 6px -2px; text-transform: uppercase; } #gallery #tools { background: url(cleo/bachelors_phase2/bg/tools.png); } /* * Gallery Popup */ #gallery_popup { background: #000; color: #fff; padding: 108px 0 0; position: relative; } #gallery_popup h1 { padding: 0 30px; } #gallery_popup h1 img { display: block; } #gallery_popup h2 { color: #adbbc4; font-size: 16px; font-weight: bold; line-height: 22px; margin: 0 0 15px; text-transform: uppercase; } #gallery_popup .content { margin: -7px 0 0; overflow: hidden; padding: 0 30px 30px; position: relative; } #gallery_popup .gallery_image { float: left; font-size: 11px; margin: 0 29px 0 0; width: 387px; } #gallery_popup .gallery_image .pager { float: right; list-style: none; margin: 0 5px 7px; } #gallery_popup .gallery_image .pager li { float: left; margin: 0 0 0 5px; } #gallery_popup .gallery_image .pager li a { display: block; height: 10px; margin: 4px 0 0; overflow: hidden; text-indent: -9999px; width: 7px; } #gallery_popup .gallery_image .pager li.galleryPagerPrev a { background: url(cleo/bachelors/arrow/chevron_left.gif); } #gallery_popup .gallery_image .pager li.galleryPagerNext a { background: url(cleo/bachelors/arrow/chevron_right.gif); } #gallery_popup .gallery_image div { clear: both; } #gallery_popup .gallery_image div img { border: 2px solid #93a3b0; display: block; height: 510px; width: 383px; } #gallery_popup .gallery_description { float: left; padding: 20px 0 266px; width: 298px; } #gallery_popup .gallery_description .imageCaption { clear: both; margin: 5px 0 3px; } #gallery_popup .gallery_description .view_my_profile { clear: both; margin: 5px 0 12px; } #gallery_popup .gallery_description .view_my_profile a { background: url(cleo/bachelors/arrow/white_right.gif) right 4px no-repeat; color: #fff; font-weight: bold; padding: 0 8px 0 0; text-transform: uppercase; } #gallery_popup .gallery_description .vote_for_me a { background: url(cleo/bachelors_phase2/btn/vote_for_me.png); display: block; height: 33px; text-indent: -9999px; width: 192px; } #gallery_popup .ad_unit { bottom: 30px; left: 447px; position: absolute; } #gallery_popup .close { background: #52778a; font-size: 9px; font-weight: bold; padding: 9px 0 11px 702px; text-transform: uppercase; } #gallery_popup .close a { background: url(cleo/bachelors_phase2/btn/popup_close.gif) 0 1px no-repeat; color: #fff; padding: 0 0 0 13px; } #gallery_popup .rating { clear: left; overflow: hidden; padding: 0; } #gallery_popup .rating dt { color: #23b5dc; float: left; font-size: 12px; font-weight: bold; width: 173px; } #gallery_popup .rating dd { background: url(cleo/bachelors_phase2/icon/stars_small.gif) no-repeat; float: left; height: 12px; margin: 3px 0 0; overflow: hidden; text-indent: -9999px; width: 65px; } #gallery_popup .rating dd.one { background-position: 0 -12px; } #gallery_popup .rating dd.two { background-position: 0 -24px; } #gallery_popup .rating dd.three { background-position: 0 -36px; } #gallery_popup .rating dd.four { background-position: 0 -48px; } #gallery_popup .rating dd.five { background-position: 0 -60px; } #gallery_popup #galleryYourRating { background: url(cleo/bachelors_phase2/ir/rating_results.png) 0 0 no-repeat; overflow: hidden; padding: 51px 0 0; } #gallery_popup #galleryYourRating dt { font-size: 14px; padding: 3px 0 0; } #gallery_popup #galleryYourRating dd { background: url(cleo/bachelors_phase2/icon/stars.gif) no-repeat; height: 18px; margin: 0; width: 90px; } #gallery_popup #galleryYourRating dd.one { background-position: 0 -18px; } #gallery_popup #galleryYourRating dd.two { background-position: 0 -36px; } #gallery_popup #galleryYourRating dd.three { background-position: 0 -54px; } #gallery_popup #galleryYourRating dd.four { background-position: 0 -72px; } #gallery_popup #galleryYourRating dd.five { background-position: 0 -90px; } #gallery_popup #galleryRateThis { background: url(cleo/bachelors_phase2/ir/make_your_rating.png) 0 0 no-repeat; overflow: hidden; padding: 51px 0 0; } #gallery_popup #galleryRateThis div { display: none; } #gallery_popup #galleryRateThis p { color: #23b5dc; float: left; font-size: 14px; font-weight: bold; padding: 3px 0 0; width: 173px; } #galleryRateThis ul { background: url(cleo/bachelors_phase2/icon/stars.gif) no-repeat; float: left; height: 18px; list-style: none; overflow: hidden; position: relative; width: 90px; } #galleryRateThis ul li { float: left; } #galleryRateThis ul li a { display: block; float: left; height: 18px; left: 0; overflow: hidden; position: absolute; text-indent: -9999px; top: 0; width: 18px; z-index: 20; } #galleryRateThis ul li.one a { left: 0; } #galleryRateThis ul li.two a { left: 18px; } #galleryRateThis ul li.three a { left: 36px; } #galleryRateThis ul li.four a { left: 54px; } #galleryRateThis ul li.five a { left: 72px; } #galleryRateThis ul li a:hover, #galleryRateThis ul li a:focus, #galleryRateThis ul li a:active { background: url(cleo/bachelors_phase2/icon/stars.gif) no-repeat; left: 0; width: 90px; z-index: 2; } #galleryRateThis ul li.one a:hover, #galleryRateThis ul li.one a:focus, #galleryRateThis ul li.one a:active { background-position: 0 -18px; } #galleryRateThis ul li.two a:hover, #galleryRateThis ul li.two a:focus, #galleryRateThis ul li.two a:active { background-position: 0 -36px; } #galleryRateThis ul li.three a:hover, #galleryRateThis ul li.three a:focus, #galleryRateThis ul li.three a:active { background-position: 0 -54px; } #galleryRateThis ul li.four a:hover, #galleryRateThis ul li.four a:focus, #galleryRateThis ul li.four a:active { background-position: 0 -72px; } #galleryRateThis ul li.five a:hover, #galleryRateThis ul li.five a:focus, #galleryRateThis ul li.five a:active { background-position: 0 -90px; } /* * Video */ #video { background: #becdd0; color: #3f3e3e; font-size: 11px; line-height: 15px; overflow: hidden; padding: 21px 17px 27px; width: 566px; } #video .video_player { float: left; height: 281px; margin: 0 21px 0 0; width: 368px; } #video .description { float: left; width: 176px; } #video .description h3 { color: #070707; font-size: 20px; font-weight: normal; line-height: 25px; margin: 0 0 9px; } #video .description select { color: #333333; font-family: Arial, Helvetica, sans-serif; font-size: 11px; margin: 30px 0 0; padding: 1px; width: 126px; } #other_videos { background: #becdd0; float: left; font-size: 11px; line-height: 16px; margin: 0 0 -43px; overflow: hidden; padding: 0 24px 35px; width: 552px; } #other_videos h3 { background: url(cleo/bachelors_phase2/ir/featured_videos.png); height: 21px; margin: 0 0 15px; overflow: hidden; text-indent: -9999px; width: 193px; } #other_videos ul { float: left; list-style: none; margin: 0 -24px 0 0; width: 576px; } #other_videos ul li { background: #18232d; color: #becdd0; float: left; margin: 0 24px 23px 0; overflow: hidden; padding: 7px 6px 9px; width: 156px; } #other_videos ul li a, #other_videos ul li a img { display: block; } #other_videos ul li p { margin: 7px 4px 6px; } #other_videos ul li h4 { display: none; } #other_videos ul li .action { background: url(cleo/bachelors_phase2/bg/bachelor_tv_more.png) no-repeat; color: #becdd0; float: right; margin: 0 2px 0 0; padding: 1px 8px 1px 17px; text-transform: uppercase; } .bottom_pods { list-style: none; margin: 50px -29px 0 0; overflow: hidden; width: 630px; } .bottom_pods li { float: left; margin: 0 30px 0 0; } .bottom_pods li a, .bottom_pods li img { display: block; } /* * Tools */ #tools { height: 35px; list-style: none; overflow: hidden; padding: 16px 0 0 105px; position: absolute; right: 0; top: 2px; width: 112px; } #tools li { float: left; margin: 0 12px 0 0; } #tools li a { display: block; height: 15px; text-indent: -9999px; } #tools li a.printTool { background: url(cleo/bachelors_phase2/btn/tools/print.gif); width: 15px; } #tools li a#sendToFriendTool { background: url(cleo/bachelors_phase2/btn/tools/email.gif); width: 16px; } #tools li a#commentsTool { background: url(cleo/bachelors_phase2/btn/tools/comment.gif); width: 15px; } #tools li a#archiveTool { background: url(cleo/bachelors_phase2/btn/tools/archive.gif); width: 11px; } /* * Pager */ #pager { clear: both; color: #3e687e; font-size: 11px; font-weight: bold; list-style: none; margin: 20px 24px 0; text-align: center; text-transform: uppercase; width: 553px; } #pager li { background: url(cleo/bachelors_phase2/bg/pager_seperator.gif) 0 4px no-repeat; display: inline; padding: 0 3px 0 7px; } #pager li a { color: #000; font-weight: normal; } #pager #pagerPreviousItem { background: transparent; float: left; padding: 0; } #pager #pagerNextItem { background: transparent; float: right; margin: -18px 0 0; padding: 0; } #pager .pagerFirstPage { background: url(cleo/bachelors_phase2/ir/page.gif) 0 4px no-repeat; padding-left: 38px; } #pager #pagerPreviousItem a { background: url(cleo/bachelors_phase2/btn/pagination_prev.gif) 0 2px no-repeat; color: #3e687e; font-size: 10px; font-weight: bold; padding-left: 12px; } #pager #pagerNextItem a { background: url(cleo/bachelors_phase2/btn/pagination_next.gif) right 2px no-repeat; color: #3e687e; font-size: 10px; font-weight: bold; padding-right: 12px; } #pager #pagerFirstItem, #pager #pagerLastItem { display: none; } /* * Form */ .form_container { background: #becdd0; padding: 18px 20px 12px; position: relative; } .form { font-size: 11px; line-height: 16px; } .form h4 { font-size: 12px; font-weight: bold; line-height: 16px; text-transform: uppercase; } .form p { margin: 0 0 29px; } .form ul { list-style: none; overflow: hidden; } .form ul li { clear: both; margin: 0 0 6px; padding: 0 0 0 188px; position: relative; width: 321px; } .form ul li label { display: block; font-weight: bold; left: 0; position: absolute; top: 3px; width: 162px; } .form ul li label span { color: #fff; } .form ul li input, .form ul li textarea { border: 1px solid #cdcdcd; font-family: Arial, Helvetica, sans-serif; font-size: 11px; padding: 3px; } .form ul li input { width: 164px; } .form ul li textarea { height: 71px; overflow: auto; width: 315px; } .form ul li.checkbox { line-height: 12px; padding-top: 11px; } .form ul li.checkbox label { font-weight: normal; padding: 0 0 0 22px; position: static; width: auto; } .form ul li.checkbox input { border: none; left: 188px; ~left: 184px; padding: 0; position: absolute; top: 10px; ~top: 6px; width: auto; } .form ul li.button input { border: 0; margin: 39px 0 0; padding: 0; width: auto; } /* * Comments */ #comments { border: solid #cdcdcd; border-width: 1px 0; font-size: 11px; line-height: 14px; margin: 20px 0 0; overflow: hidden; padding: 7px 23px 0; width: 555px; } #comments h4 { background: url(cleo/bachelors_phase2/ir/your_comments.png) 0 4px no-repeat; color: #345a6d; font-family: "Helvetica Neue", "Arial Narrow", Arial, Helvetica, sans-serif; font-size: 18px; font-weight: normal; line-height: 22px; margin: 0 0 10px; padding: 0 0 0 115px; } #comments h4 span { left: -9999px; position: absolute; } #comments .comments { list-style: none; overflow: hidden; padding: 0 0 2px; } #comments .comments li { margin: 0 0 12px; padding: 0 0 15px; position: relative; width: 555px; } #comments .comments li .byline { color: #99a5ac; font-weight: bold; } #comments .comments li a { bottom: 0; color: #6aa7c9; font-weight: bold; left: 0; position: absolute; } #comments .comments li div { clear: both; } #comments .comments li div a { position: static; } #comments .form { border-top: 1px solid #cdcdcd; margin: 0 -23px; padding: 12px 23px 5px; } #comments .form h4 { background: url(cleo/bachelors_phase2/ir/add_a_comment.png); height: 13px; margin: 0 0 10px; overflow: hidden; padding: 0; text-indent: -9999px; width: 106px; } /* * Right Column */ #tcRightContent { padding: 22px 29px 100px 0; width: 300px; } #RightNav_pnlContent { position: relative; } #RightNav_pnlContent .ad300 { margin: 0 0 17px; } /* * Right Nav */ #right_nav { list-style: none; margin: 0 -6px 13px -4px; overflow: hidden; width: 310px; } #right_nav li { float: left; } #right_nav .search { margin: 0 -1px 0 0; padding: 11px 0 0; width: 147px; } #right_nav .search label { background: url(cleo/bachelors_phase2/icon/magnifying_class.gif); float: left; height: 11px; margin: 2px 4px 0 0; overflow: hidden; text-indent: -9999px; width: 11px; } #right_nav .search input { border: 1px solid #c8c8c8; float: left; font-family: Arial, Helvetica, sans-serif; font-size: 10px; padding: 0 2px; width: 107px; } #right_nav .search input.button { border: none; height: 10px; left: 126px; padding: 0; position: absolute; top: 13px; width: 17px; } #right_nav .sign_in a { background: url(cleo/bachelors_phase2/btn/sign_in.gif); display: block; height: 34px; text-indent: -9999px; width: 78px; } #right_nav .join_now a { background: url(cleo/bachelors_phase2/btn/join_now.gif); display: block; height: 34px; text-indent: -9999px; width: 86px; } /* * Bachelor Spotlight */ .bachelor_spotlight { background: #54798b; color: #000000; font-size: 11px; line-height: 14px; margin: 0 0 19px 0; padding: 12px 14px 11px; position: relative; width: 272px; } .bachelor_spotlight h3 { background: url(cleo/bachelors_phase2/ir/bachelor_spotlight.png); height: 17px; margin: 0 0 11px; text-indent: -9999px; width: 175px; } .bachelor_spotlight h3.winner { background: url(cleo/bachelors_phase3/ir/bachelor_spotlight_winner.png); height: 19px; margin: 0 0 11px; text-indent: -9999px; width: 175px; } .bachelor_spotlight .image a { display: block; } .bachelor_spotlight .image img { border: 1px solid #94a2aa; display: block; } .bachelor_spotlight h4 { border-bottom: 1px dotted #8ba6b4; color: #fff; font-size: 14px; font-weight: bold; line-height: 16px; padding: 5px 0 3px; } .bachelor_spotlight dl { color: #cbdce5; font-size: 13px; line-height: 18px; margin: 1px 0 2px; overflow: hidden; } .bachelor_spotlight dt { clear: left; float: left; margin: 0 4px 0 0; } .bachelor_spotlight dd { font-weight: bold; overflow: hidden; height: 18px; } .bachelor_spotlight p { margin: 0 0 6px; } .bachelor_spotlight .view_profile { background: url(cleo/bachelors_phase2/btn/view_profile.gif); display: block; height: 15px; overflow: hidden; text-indent: -9999px; width: 108px; } .bachelor_winner { width: 251px; } .bachelor_winner h3 { background: url(cleo/bachelors_phase2/ir/winner.png); height: 20px; width: 82px; } /* * Face Off Pod */ #face_off_pod { background: #000 url(cleo/bachelors_phase2/bg/face_off_pod.jpg); color: #fff; height: 250px; line-height: 14px; margin: 0 0 17px; overflow: hidden; position: relative; width: 300px; } #face_off_pod h2 { background: url(cleo/bachelors_phase2/ir/face_off_pod.png); height: 18px; margin: 15px 0 0 21px; overflow: hidden; text-indent: -9999px; width: 77px; } #face_off_pod div { position: absolute; text-align: center; top: 44px; width: 110px; } #face_off_pod div a, #face_off_pod div a img, #face_off_pod div a span { display: block; } #face_off_pod div a span { margin: 0 -18px 2px; } #face_off_pod div a strong { font-size: 17px; font-weight: bold; } #face_off_pod div a { color: #fff; } #face_off_pod div a img { border: 1px solid #343434; height: 153px; margin: 0 auto 8px; width: 108px; } #face_off_pod .contestant_1 { left: 20px; } #face_off_pod .contestant_2 { left: 170px; } #face_off_pod .vs { background: url(cleo/bachelors_phase2/ir/vs.gif); height: 65px; left: 110px; text-indent: -9999px; top: 87px; width: 73px; z-index: 10; } *>#face_off_pod .vs { background: url(cleo/bachelors_phase2/ir/vs.png); } /* * Article List Pod */ .article_list { border: solid #cac9c9; border-width: 1px 0; font-size: 11px; line-height: 14px; margin: 0 0 17px; padding: 12px 20px 0 3px; width: 277px; } .article_list h3 { overflow: hidden; text-indent: -9999px; } .article_list h4 { color: #a68606; font-family: "Helvetica Neue", "Arial Narrow", Arial, Helvetica, sans-serif; font-size: 18px; font-weight: normal; line-height: 18px; margin: 4px 0 0; text-transform: uppercase; } .article_list h4 strong { font-weight: bold; } .article_list ul { list-style: none; margin: 5px 0 -1px; } .article_list a { border-bottom: 1px solid #cac9c9; color: #18232d; display: block; height: 1%; padding: 5px 0; } .article_list h3.breaking_news { background: url(cleo/bachelors_phase2/ir/breaking_news.png); height: 19px; width: 136px; } .article_list h3.latest_posts { background: url(cleo/bachelors_phase2/ir/latest_posts.png); height: 19px; width: 114px; } /* * Featured Story Pod */ .featured_story { background: #e3e3e3; border: 1px solid #cac9c9; color: #18232d; font-size: 11px; line-height: 14px; margin: 0 0 17px; overflow: hidden; padding: 11px 13px 12px; width: 272px; } .featured_story h3 { background: url(cleo/bachelors_phase2/ir/featured_story.png); height: 17px; margin: 0 0 11px; overflow: hidden; text-indent: -9999px; width: 135px; } .featured_story a { display: block; } .featured_story a img { border: 1px solid #9aa7ae; display: block; } .featured_story h4 { font-size: 11px; font-weight: bold; margin: 11px 0 4px; } .featured_story h4 a { color: #54798b; display: inline; } .featured_story p { margin: 0 0 11px; } .featured_story .more { background: url(cleo/bachelors_phase2/btn/view_story.gif); height: 15px; overflow: hidden; text-indent: -9999px; width: 79px; } /* * Expand Box */ #subscribe { background: #FFF; border: 1px solid #c6c6c6; clear: both; float: left; margin: 0 -1px 9px -3px; padding: 29px 17px 29px 42px; position: relative; width: 243px; } #subscribe div { color: #999; float: left; font-size: 17px; line-height: 17px; padding: 9px 17px 0 0; text-align: center; width: 78px; } #subscribe div em { color: #63accc; display: block; font-size: 63px; font-style: normal; line-height: 63px; margin: 0 0 -3px; text-align: center; } #subscribe div img { display: block; margin: 0 0 11px; } #subscribe div a { display: block; margin: 9px 0 0; } #subscribe div a img { margin: 0; } #subscribe img.mag_shot { display: block; float: left; } #subscribe a.extend { display: block; left: -12px; position: absolute; margin: -24px 0 0; top: 50%; } #subscribe a.extend img { display: block; } #outerPopout { display: none; overflow: hidden; position: absolute; right: 0; top: 16px; width: 512px; z-index: 9999; } #popout { background: #FFF; border: 1px solid #d3d3d3; display: inline; float: left; font-size: 11px; line-height: 16px; margin: 0 0 0 512px; padding: 26px 0 12px 35px; position: relative; width: 460px; } #popout .btn_close { display: block; left: -1px; margin: -21px 0 0; position: absolute; top: 50%; } #popout .subscribe { float: left; width: 240px; } #popout .subscribe img { display: block; } #popout .subscribe .mag_shot { margin: 0 0 7px 10px; } #popout .this_month { float: left; padding: 4px 12px; width: 196px; } #popout h2 { background: url(cleo/bachelors_phase2/ir/this_month_in_cleo.png); height: 52px; margin: 0 0 18px; overflow: hidden; text-indent: -9999px; width: 133px; } #popout h3 { color: #a68606; font-size: 15px; font-weight: normal; margin: 7px 0 0; text-transform: uppercase; } #popout p { margin: 3px 0 11px; } #popout ul { line-height: 14px; margin: 4px 0 11px 14px; } #popout ul li { margin: 0 0 2px; } /* * Footer */ #Footer_pnlContent { background: url(cleo/bachelors_phase2/bg/footer.png) 31px 0 no-repeat; line-height: 16px; overflow: hidden; width: 990px; } #site_info { font-size: 11px; overflow: hidden; } #site_info h2 { clear: both; display: inline; float: left; font-size: 11px; font-weight: bold; margin: 1px 0 0 196px; text-transform: lowercase; white-space: nowrap; } #footer_nav { list-style: none; margin: 13px 0 0; text-align: center; } #footer_nav li { background: url(cleo/bachelors_phase2/bg/footer_seperator.gif) right 3px no-repeat; display: inline; } #footer_nav li a { color: #537387; font-weight: bold; padding: 0 6px; } #footer_nav li.rss { background: transparent; } #footer_nav li.rss a { background: url(cleo/bachelors_phase2/btn/rss.png) right 0 no-repeat; padding-right: 18px; } #sister_sites { float: left; font-size: 10px; list-style: none; margin: 0 160px 0 0; overflow: hidden; padding: 0 0 24px 0; width: 519px; } #sister_sites li { background: url(cleo/bachelors_phase2/bg/sister_sites.gif) right 4px no-repeat; float: left; } #sister_sites li a { color: #000; display: block; margin: 0 4px 0 0; padding: 0 6px; } #sister_sites li.last { background: transparent; margin: 0 -11px 0 0; } /* * Thank You For Voting Popup */ #pnlThanksForVoting { position: absolute; z-index: 999; display: none; } #pnlThanksForVoting_Inner { position: relative; top: 50px; left: 200px; width: 400px; height: 300px; background: transparent url(../images/cleo/bachelors/btn/thankyou.jpg) no-repeat; text-align: right; } #pnlThanksForVoting_Inner a { display: block; width: 400px; height: 300px; text-indent: -9999px; background: url(cleo/bachelors/btn/thankyou.jpg) no-repeat; text-align: left; }