﻿/* CSS for Cosmopolitan */

/* play - when you edit anything here apart from color(s) you have to edit all other section styles that apply */
#overview_container .ov_section { border: 5px solid #D93939; display: block; }
#overview_container .ov_section_second { border: 5px solid #D93939; border-top: 0; display: block; padding: 0 5px 5px 5px; margin: 0; }
#overview_container .ov_section_second p { margin: 0; padding: 0; padding-bottom: 10px; color: #555555; }
#overview_container .ov_section_third { border: 5px solid #D93939; border-top: 0; display: block; padding: 5px 5px 5px 5px; margin: 0; }
#overview_container .ov_section_fourth { border: 5px solid #D93939; border-top: 0; display: block; padding: 0 5px 5px 5px; margin: 0; } * html #overview_container .ov_section_fourth { /* ie only */ padding-bottom: 2px; }
#overview_container .ov_section_fourth h4 { color: #D93939; font-size: 20px; margin: 0; margin-top: 5px; margin-left: 2px; padding: 0; font-weight: bold; }
#overview_container .ov_section_articles { background: #D93939; margin: 0; padding: 0 6px 0 6px; height: 24px; color: #EEEEEE; line-height: 22px; }
#overview_container .ov_section_articles_search { background: #D93939; margin: 0; padding: 0 6px 0 6px; height: 38px; color: #EEEEEE; line-height: 22px; }
#overview_container .ov_section_articles_head { background: #D93939; margin: 0; padding: 4px 6px 0 6px; height: 42px; color: #EEEEEE; line-height: 22px; }
#overview_container .ov_section_articles_head h4 { font-size: 22px; margin: 0; padding: 0; font-weight: bold; }
#overview_container .ov_section_articles_head h5 { font-size: 14px; margin: 0; padding: 0; }
#overview_container .ov_section_articles h5 { font-size: 14px; margin: 0; padding: 0; }
#overview_container .ov_section_articles a { font-size: 11px; color: #EEEEEE; text-transform: none; text-decoration: none; font-weight: bold; }
#overview_container .ov_section_articles a:hover { text-decoration: underline; }
#overview_container .art_section_comments { display: block; padding: 5px 0 5px 0; margin: 0; }

#ov_section_nav ul { width: 716px; background: #D93939; float: left; margin: 0; padding: 0; padding-left: 2px; color: #FFFFFF; list-style-type: none; color: #EEEEEE; }
#ov_section_nav li { float: left; display: inline; padding: 0 5px 0 5px; height: 20px; text-align: center; background: #D93939; line-height: 14px; } 
#ov_section_nav a { color: #FF9F9A; text-decoration: none; font-weight: bold; }
#ov_section_nav a:hover { text-decoration: underline; }

#ov_section_intro { width: 434px; height: 121px; background: #D93939; margin-left: 3px; padding: 14px; vertical-align: top; }
#ov_section_intro h3 { padding: 0; margin: 0; color: #FD9393; font-size: 22px; font-weight: 100; }
#ov_section_intro h4 { padding: 0; padding-bottom: 6px; margin: 0; color: #EEEEEE; font-size: 22px; font-weight: 100; line-height: 24px; }
#ov_section_intro a { font-size: 10px; color: #FF8D88; text-decoration: underline; text-transform: uppercase; }
#ov_section_intro a:hover { text-decoration: none; }
#ov_section_intro p { color: #EEEEEE; }

#art_section_head { display: inline; float: left; width: 436px; background: #D93939; padding: 6px 14px 8px 20px; margin-bottom: 10px; margin-left: -20px; }
#art_section_head h4 { padding: 0; margin: 0; color: #FFFFFF; font-size: 28px; font-weight: 100; }
#art_section_head h5 { padding: 0; margin: 0; margin-top: 3px; color: #FFFFFF; font-size: 12px; font-weight: bold; }
#art_section_body { margin: 0 20px 10px 20px; }
#art_section_foot { float: left; width: 442px; height: 26px; background: #868686; color: #EEEEEE; padding: 0 14px 0 14px; line-height: 24px; font-weight: bold; margin-left: -20px; }

.art_make_comments_head { width: 698px; height: 24px; background: #D93939; color: #EEEEEE; padding: 0 14px 0 14px; line-height: 24px; }
.art_make_comments_head h4 { padding: 0; margin: 0; color: #FFFFFF; font-size: 14px; font-weight: bold; }
.art_make_comments_head a { color: #EEEEEE; text-decoration: underline; font-weight: bold; }
.art_make_comments_head a:hover { text-decoration: none; }

#quiz_section_head { display: inline; float: left; width: 436px; background: #D93939; padding: 6px 14px 8px 20px; margin-bottom: 10px; margin-left: -20px; }
#quiz_section_head h4 { padding: 0; margin: 0; color: #FFFFFF; font-size: 34px; font-weight: 100; }
#quiz_section_body { margin: 0 20px 10px 20px; }
#quiz_section_foot { float: left; }
#quiz_section_foot img { float: left; margin-left: -4px; } * html #quiz_section_foot img { /* ie only */ margin-left: -2px; }
#quiz_section_foot a { font-size: 11px; color: #000000; text-decoration: none; }
#quiz_section_foot a:hover { text-decoration: underline; }

#quiz_result { background: #D93939; padding: 14px; } * html #quiz_result { /* ie only */ margin-bottom: 5px; }
#quiz_result p { color: #FFFFFF; padding-bottom: 0; }
#quiz_result h4 { color: #FB9E9E; font-size: 26px; margin: 0; padding: 0; font-weight: 100; }
#quiz_result h5 { color: #FFFFFF; font-size: 16px; margin: 0; margin-left: 5px; padding: 0; font-weight: bold; }

.quiz_other_head { width: 678px; height: 24px; background: #000000; color: #EEEEEE; padding: 0 14px 0 14px; line-height: 24px; font-weight: bold; }
.quiz_other_head h4 { padding: 0; margin: 0; color: #FFFFFF; font-size: 14px; font-weight: bold; }

.quiz_questions_head { width: 678px; height: 24px; background: #D93939; color: #EEEEEE; padding: 0 14px 0 14px; line-height: 24px; font-weight: bold; }
.quiz_questions_head h4 { padding: 0; margin: 0; color: #FFFFFF; font-size: 14px; font-weight: bold; }

.quiz_bg_options { background: #F7D7D7; padding: 6px 16px 6px 16px; margin-top: 3px; color: #555555; }
.quiz_bg_options ul { margin: 0; padding: 0; }
.quiz_bg_options li { list-style-type: none; }
.quiz_bg_div p { padding: 0; margin: 0; }

.button_last { padding-top: 14px; }

.quiz_bg_div { background: url(../images/img_div_comments.gif) repeat-x bottom left; }
.quiz_bg_div h5 { padding: 10px 20px 10px 14px; margin: 0; color: #000000; font-size: 11px; font-weight: bold; }
.quiz_bg_div p { padding: 0 20px 10px 14px; margin: 0; }
.quiz_last { background: none; }
.quiz_last h5 { padding: 10px 20px 10px 14px; margin: 0; color: #000000; font-size: 11px; font-weight: bold; }
.quiz_last p { padding: 0 20px 10px 14px; margin: 0; }

.gig_search_head { background: #D93939; margin: 0; padding: 0 6px 0 6px; height: 27px; color: #EEEEEE; line-height: 22px; } * html .gig_search_head { /* ie only */ height: 30px; }
.gig_search_head h5 { font-size: 14px; margin: 0; margin-top: 4px; padding: 0; }
.gig_search { float: right; margin-right: 40px; } * html .gig_search { /* ie only */ margin-right: 20px; }

.gig_table { padding: 0 0 0 6px; margin: 0; }

#gig_content h4 { padding: 0 0 2px 0; margin: 0; color: #D93939; font-size: 15px; font-weight: bold; }
#gig_content h5 { padding: 0 0 8px 0; margin: 0; color: #000000; font-size: 11px; font-weight: bold; }
#gig_content p { padding: 0; margin: 0; }
#gig_content a { font-size: 11px; color: #D73CC2; text-decoration: none; font-weight: bold; text-transform: none; }
#gig_content a:hover { text-decoration: underline; }

.gig_bg_div { background: url(../images/img_div_comments.gif) repeat-x bottom left; }
.gig_last { background: none; }

#video_container { background: #000000; padding: 8px; margin: 6px 6px 6px 0; }
#video_container .video_bdr { border: 9px solid #000000; }
#video_container .video_txt { border: 2px solid #D93939; padding: 14px 14px 4px 14px; margin-top: 3px; }
#video_container .video_txt h5 { color: #D93939; font-size: 14px; margin: 0; padding: 0; }
#video_container .video_txt h6 { color: #FFFFFF; font-size: 12px; margin: 0; margin-bottom: 10px; padding: 0; }
#video_container .video_txt p { color: #949494; padding: 0; padding-bottom: 10px; margin: 0; }

.video_nav_container h5 { color: #D93939; font-size: 14px; margin: 0; margin-left: 5px; padding: 0; padding-top: 2px; }
.video_nav { width: 540px; float: right; margin-top: -7px; margin-bottom: -7px; padding: 0; } * html .video_nav { /* ie only */ margin-top: 4px; margin-bottom: -2px; }
.video_nav #video_items { display: block; height: 26px; font-size: 11px; background: transparent url(../images/bg_video_nav.gif) repeat-x top left; font-family: Arial, Helvetica, sans-serif; }
.video_nav #video_items { margin: 0; padding: 0; list-style-type: none; width: auto; }
.video_nav #video_items ul { margin-left: -38px; list-style-type: none; } * html .video_nav #video_items ul { margin-left: 2px; }
.video_nav #video_items ul li { float: left; margin: 0 1px 0 0; }
.video_nav #video_items ul li a { display: block; float: left; color: #9D2424; text-decoration: none; padding: 6px 5px 0 5px; height: 26px; font-weight: bold; }
.video_nav #video_items ul li a:hover, .video_nav #video_items ul li a.current { color: #FFFFFF; background: transparent url(../images/bg_video_nav_over.gif) repeat-x top center; }

#video_items_container a { display: block; float: left; text-decoration: none; width: 312px; height: 99px; margin: 0; padding: 0; background: url(../images/bg_video_item.gif) repeat-x top left; } * html #video_items_container a { /* ie only */ float: none; }
#video_items_container a:hover, #video_items_container a.current { background: url(../images/bg_video_item_over.gif) repeat-x top left; }
#video_items_container img { float: left; padding: 4px; padding-right: 10px; }
#video_items_container h5 { color: #D93939; font-size: 12px; margin: 0; margin-top: 14px; padding: 0; }
#video_items_container h6 { color: #000000; font-size: 11px; margin: 0; margin-bottom: 10px; padding: 0; }
#video_items_container p { color: #555555; padding: 0; margin: 0; }

#overview_articles .article_div { background: url(../images/bg_article_div_play.gif) repeat-x top left; }
#overview_articles .article_div_left { background: url(../images/bg_article_div_play.gif) repeat-x top left; padding-left: 0; }
#overview_articles .article_left { padding-left: 0; }
#overview_articles .article p { padding-top: 10px; padding-bottom: 0; }

#overview_articles .ov_section_hdr { padding: 0; margin: 0; color: #D93939; font-size: 14px; text-transform: uppercase; font-weight: bold; }
/* play - end */

/* more cosmo - specific styles for more cosmo box */
#more_cosmo { float: right; margin: 9px 0 20px 0; width: 716px; }
/* more cosmo - end */
