#chartLine { height: 290px; div#charttools { display: none; } } .chart_wrapper { border: 1px solid #ccc; margin-bottom: 10px; overflow: hidden; background: #DEDEDE; } body.polls.comparison .chart_wrapper { margin-top: 20px; margin-bottom: 20px; } .chart_wrapper .embed { width: 100%; background: #DEDEDE; padding: 0px 5px; } .chart_container { margin: 0 10px; border: 1px solid #ccc; background: #fff; } .chartdiv { position: relative; overflow: hidden; color: #666; font: 11px Verdana,Arial,Helvetica,sans-serif; clear: both; width: 100%; } .chartdiv .plot, #chartdiv2 .plot { fill: rgba(250, 250, 255, 0.6); } .chartdiv .grid .tick, #chartdiv2 .grid .tick { stroke: lightgrey; opacity: 0.7; } .chartdiv .grid path, #chartdiv2 .grid path { stroke-width: 0; } .chartdiv .axis path, .chartdiv .axis line, #chartdiv2 .axis path, #chartdiv2 .axis line { fill: none; stroke: none; shape-rendering: crispEdges; } .chartdiv .x.axis path, #chartdiv2 .x.axis path { display: none; } .chartdiv .d_line, #chartdiv2 .d_line { fill: none; stroke: #3B5998; stroke-width: 3px; } .chartdiv .r_line, #chartdiv2 .r_line { fill: none; stroke: #D30015; stroke-width: 3px; } .chartdiv .t_line, #chartdiv2 .t_line { fill: none; stroke: #666; stroke-width: 3px; } .chartdiv .d_circle, #chartdiv2 .d_circle { fill: #3B5998; r: 6; } .chartdiv .r_circle, #chartdiv2 .r_circle { fill: #D30015; r: 6; } .chartdiv .t_circle, #chartdiv2 .t_circle { fill: #666; r: 6; } .clear-button { font: 14px sans-serif; cursor: pointer; display: block; text-align: center; padding: 5px; border: 1px solid #ccc; margin: 0 10px 10px; } .chartdiv .brush .extent { stroke: #fff; fill-opacity: .125; shape-rendering: crispEdges; } .chartdiv .verticalLine { pointer-events: none; stroke: #666; } .chartdiv .currentDateLine { pointer-events: none; stroke: #cc0000; } .chartdiv .eventDateLine { pointer-events: none; stroke: #000000; } .chartdiv .d_tooltip, .chartdiv .r_tooltip, .chartdiv .t_tooltip, .chartdiv .date_tooltip, .chartdiv .d_line, .chartdiv .r_line, .chartdiv .t_line, .chartdiv .d_circle, .chartdiv .r_circle, .chartdiv .t_circle { pointer-events: none; } .chartdiv .d_tooltip, .chartdiv .r_tooltip, .chartdiv .t_tooltip, .chartdiv .date_tooltip { display: block; position: absolute; padding: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: 2px solid #fff; color: #fff; opacity: 0; } .chartdiv .d_tooltip { background: #3B5998; } .chartdiv .r_tooltip { background: #D30015; } .chartdiv .t_tooltip { background: #666; } .chartdiv .date_tooltip { background: #D30015; width: 80px; text-align: center; } .chartdiv .graph_sep { pointer-events: none; stroke: #666; } .chartdiv .toss_ups { pointer-events: none; fill: #666; } .chartdiv .toss_ups_am_label { pointer-events: none; position: absolute; left: 40px; top: 143px; color: #666; } .chartdiv .candidate_line, .chartdiv .disapprove_line, #chartdiv2 .disapprove_line { fill: none; /*stroke: #ff0000;*/ stroke-width: 3px; } .chartdiv .approve_line, #chartdiv2 .approve_line { fill: none; /*stroke: #000;*/ stroke-width: 3px; } /* NEW FOR RACE MAPS */ .chartdiv .spread_line, .chartdiv .spread_line_1, .chartdiv .spread_line_2 { fill: none; stroke-width: 0; } .chartdiv .spread_area { fill: rgba(127,201,127,0.5); stroke-width: 0; } .chartdiv .spread_area_above { fill: rgba(127,127,201,0.5); stroke-width: 0; } .chartdiv .spread_area_below { fill: rgba(127,201,127,0.5); stroke-width: 0; } .chartdiv .disapprove_tooltip { /*background: #ff0000;*/ } .chartdiv .approve_tooltip { /*background: #000;*/ } .chartdiv .spread_tooltip_approve { /*background: #000;*/ } .chartdiv .spread_tooltip_disapprove { /*background: #ff0000 !important;*/ } .chartdiv .spread_circle_disapprove { /*fill: #ff0000 !important;*/ } .chartdiv .candidate_tooltip, .chartdiv .disapprove_tooltip, .chartdiv .approve_tooltip, .chartdiv .spread_tooltip, .chartdiv .spread_tooltip_1, .chartdiv .spread_tooltip_2, .chartdiv .candidate_circle, .chartdiv .disapprove_circle, .chartdiv .approve_circle, .chartdiv .spread_circle, .chartdiv .candidate_line, .chartdiv .disapprove_line, .chartdiv .approve_line, .chartdiv .spread_line, .chartdiv .spread_line_1, .chartdiv .spread_line_2, .chartdiv .spread_area { pointer-events: none; } .chartdiv .candidate_tooltip, .chartdiv .disapprove_tooltip, .chartdiv .approve_tooltip, .chartdiv .spread_tooltip, .chartdiv .spread_tooltip_1, .chartdiv .spread_tooltip_2 { display: block; position: absolute; padding: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: 2px solid #fff; color: #fff; opacity: 0; } .chartdiv .candidate_tooltip.hide { display: none !important; } .chartdiv .disapprove_circle { /*fill: #ff0000;*/ r: 6; } .chartdiv .approve_circle { /*fill: #000;*/ r: 6; } .chartdiv .spread_circle { /*fill: #000;*/ r: 6; } #charttools { clear: both; /*border-top: 2px solid #E5E5E5; background-color: #F7F7F7;*/ overflow: hidden; margin: 0 10px; border: 1px solid #ccc; border-top: none; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e8e8e8+0,ffffff+100 */ background: #e8e8e8; /* Old browsers */ background: -moz-linear-gradient(top, #e8e8e8 0%, #ffffff 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #e8e8e8 0%,#ffffff 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #e8e8e8 0%,#ffffff 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #e8e8e8 0%,#ffffff 100%); /* IE10+ */ background: linear-gradient(to bottom, #e8e8e8 0%,#ffffff 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ } div#alpha.layout_1 #charttools { width: 762px; } @media only screen and ( max-width : 414px ) { .rcb_none.rcb_mobile { display: inline-block; } } @media only screen and ( min-width : 415px ) { .rcb_none.rcb_normal { display: inline-block; } } .rcb_none { display: none; } .race_charts_button { font-size: 12px; background-color: #F7F7F7; border: 1px solid #ABADB3; padding: 5px 10px; cursor: pointer; margin-bottom: 5px; margin-right: 5px; margin-top: 5px; } .race_charts_button:hover { background-color:#ccc; } .race_charts_button.selected { color: #DC0000; border-bottom: 2px solid #DC0000; background-color: #FBFBFB; font-weight: bold; } .race_charts_button.selected:hover { background-color:#ccc; } #charttools .from, #charttools .to { display: inline-block; padding: 0 10px 7px; } #charttools #from_date, #charttools #to_date { border: 1px solid #ABADB3; } #charttools #from_date:hover, #charttools #to_date:hover { background-color:#ccc; } #charttools .zoom { float: right; } .chart_datepicker { text-align: center; width: 70px; border: none; background-color: #F7F7F7; cursor: pointer; text-decoration: underline; color: #222; padding-left: 20px; padding-right: 20px; } #ui-datepicker-div { border: 2px solid #E5E5E5; background-color: #fff; } #ui-datepicker-div .ui-datepicker-header { background-color: #DC0000; color: #fff; text-align: center; overflow: auto; padding: 10px; } #ui-datepicker-div .ui-datepicker-prev { background-image: url(/asset/img/white-bg-chev-left.png); width: 24px; height: 24px; cursor: pointer; float: left; } #ui-datepicker-div .ui-datepicker-prev span { display: none; } #ui-datepicker-div .ui-datepicker-next { background-image: url(/asset/img/white-bg-chev-right.png); width: 24px; height: 24px; cursor: pointer; float: right; } #ui-datepicker-div .ui-datepicker-next span { display: none; } #ui-datepicker-div table.ui-datepicker-calendar { width: 250px; text-align: center; } #ui-datepicker-div table.ui-datepicker-calendar .ui-datepicker-unselectable { color: #666; } .chart_header { display: table; width: 100%; overflow: auto; box-sizing: border-box; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f7f7f7+0,dedede+100 */ background: #f7f7f7; /* Old browsers */ background: -moz-linear-gradient(top, #f7f7f7 0%, #dedede 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#dedede)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f7f7f7 0%,#dedede 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f7f7f7 0%,#dedede 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f7f7f7 0%,#dedede 100%); /* IE10+ */ background: linear-gradient(to bottom, #f7f7f7 0%,#dedede 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#dedede',GradientType=0 ); /* IE6-9 */ } .chart_branding { display: table-cell; vertical-align: middle; /* min-width: 306px;*/ min-width: 295px; padding-right: 10px; padding-top: 6px; } .chart_branding .logo { float: left; padding: 10px; } .chart_branding .logo img { width: 69px; } .chart_branding .title { padding: 10px 0 0; font-size: 11px; color: #666; text-transform: uppercase; } .chart_branding .subtitle { padding: 4px 0 0; font-size: 15px; line-height: 1; margin-left: 89px; } .chart_branding .subtitle.mobile { display: none; } body.polls.comparison .chart_branding .subtitle { font-size: 14px; } .chart_legend { padding: 2px; overflow: auto; float: right; font-size: 12px; background: #fff; border: 1px solid #ccc; margin: 5px 10px; /*max-width: 400px;*/ } body.polls.comparison .chart_legend { min-width: 415px; } body.polls.comparison .chart_legend.combined { min-width: 655px; } body.polls.comparison .chart_branding.combined { min-width: 110px; } body.polls.comparison .chart_branding.combined .subtitle { font-size: 13px; } .chart_legend .candidate { /*float: left;*/ /*min-width: 107px;*/ } .chart_legend .candidate > div { float: left; /*margin-bottom: 2px;*/ } .chart_legend .candidate > div.color_line { width: 25px; height: 3px; margin-right: 2px; margin-left: 10px; margin-top: 6px; } .chart_legend .candidate > div.value { margin-right: 5px; color: #fff; font: 9px Verdana,Arial,Helvetica,sans-serif; } .chart_legend .candidate > div.value > span { margin-right: 0; width: 28px; text-align: center; padding: 2px 0; display: inline-block; } .chart_legend .candidate > div.desc { margin-right: 0px; padding-top: 0px; } .chart_legend .candidate > div.desc > span { margin-left: 5px; font-size: 10px; font-weight: bold; } body.polls.comparison .line_type div { width:40px; border: 0; border-bottom: 2px solid black; margin: 0 5px; } body.polls.comparison .line_type.type_2 div { border-style:dotted; } body.polls.comparison .line_type.type_3 div { border-style:dashed; } body.polls.comparison .line_type.type_4 div { border-style:dotted; border-width: 1px; } body.polls.comparison .chartdiv .date_tooltip { width: 180px; } /* Make chart legend larger on ipad and up when just 2 candidates */ @media only screen and ( min-width : 768px ) { .chart_legend.small_legend { font-size: 14px; margin-top: 21px; } .chart_legend.small_legend .candidate > div.desc { padding-top: 2px; } .chart_legend.small_legend .candidate > div.value { font-size: 12px; } .chart_legend.small_legend .candidate > div.value > span { padding: 3px 4px; } } @media only screen and ( max-width : 1159px ) { /*.chart_legend { max-width: 500px; float: right; overflow: auto; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; padding: 0; width: 56%; }*/ /*.chart_header { display: block; } .chart_branding { display: block; float: left; overflow: hidden; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; min-width: 0; width: 42%; padding: 0; }*/ } @media only screen and ( min-width : 568px ) and ( max-width : 1023px ){ /*.chart_branding { width: 28%; } .chart_branding .logo { display: none; } .chart_branding .title { padding: 10px 10px 0; } .chart_branding .subtitle { clear: both; padding: 10px; }*/ /*.chart_legend { width: 72%; }*/ .chart_branding { width: 290px; } } @media only screen and ( min-width : 922px ) and ( max-width : 1135px ){ .chart_header { padding: 5px 10px 5px 0; } .chart_branding { min-width: 0; } .chart_legend { display: table-cell; float: none; width: 66%; } .chart_legend.small_legend { display: block; float: right; width: auto; margin-right: 0; } .chart_legend.medium_legend { display: block; float: right; width: auto; margin-right: 0; } } /*@media only screen and ( min-width : 568px ) and ( max-width : 767px ){ .chart_branding { width: 28%; } .chart_branding .logo { display: none; } .chart_branding .title { padding: 10px 10px 0; } .chart_branding .subtitle { clear: both; padding: 10px; } .chart_legend { width: 72%; } }*/ /*@media only screen and ( min-width : 710px ) and ( max-width : 767px ){ .chart_branding .logo { display: block; } .chart_branding .subtitle { clear: none; padding: 10px; } }*/ @media only screen and ( max-width : 912px ) { .chart_legend.combined { float: none; clear: both; padding: 10px; width: auto; } .chart_legend.combined.small_legend, .chart_legend.combined.medium_legend { float: right; clear: none; width: 38%; padding: 4px 10px; margin: 5px 10px 5px 0; } .chart_branding.combined { display: block; width: auto; } .chart_branding.combined.small_legend, .chart_branding.combined.medium_legend { display: block; width: 56%; float: left; box-sizing: border-box; min-width:0; padding: 0; } } @media only screen and ( max-width : 767px ) { #chart_apply { width: 100%; border-right: none; } #chart_reset { display: none; } .chart_legend { float: none; clear: both; padding: 10px; width: auto; } .chart_legend.small_legend, .chart_legend.medium_legend { float: right; clear: none; width: 38%; padding: 4px 10px; margin: 5px 10px 5px 0; } .chart_branding { display: block; width: auto; } .chart_branding.small_legend, .chart_branding.medium_legend { display: block; width: 56%; float: left; box-sizing: border-box; min-width:0; padding: 0; } } @media only screen and ( max-width : 649px ) { .chart_legend.medium_legend { float: none; clear: both; padding: 10px; width: auto; } .chart_branding.medium_legend { display: block; width: auto; } } @media only screen and ( max-width : 568px ) { #chart_apply, #charttools .from, #charttools .to { display: none; } body.polls.comparison .chart_legend.combined { min-width: 0px; width: auto; } } @media only screen and ( max-width : 449px ) { .chart_legend.small_legend .candidate > div { /*clear: left;*/ } .chart_legend { overflow: auto; display: block; } .chart_legend tr { display: inline; } .chart_legend tr td.candidate { float: left; width: 33.33%; box-sizing: border-box; } .chart_legend.small_legend { overflow: visible; display: table; padding: 0; } .chart_legend.small_legend tr { display: table-row; } .chart_legend.small_legend tr td.candidate { float: none; width: auto; } /* Disable all of above for combined */ .chart_legend.combined { overflow: auto; display: table; } .chart_legend.combined tr { display: table-row; } .chart_legend.combined tr td.candidate { float: none; width: auto; box-sizing: normal; } /* apply 2 column early for combined */ .chart_legend.combined tr td.candidate { width: 107px; float: none; display: inline-block; } .chart_legend.combined { -webkit-column-count: 2; /* Chrome, Safari, Opera */ -moz-column-count: 2; /* Firefox */ column-count: 2; } .chart_legend.combined tbody { display: inline; } .chart_branding .subtitle.desktop { display: none; } .chart_branding .subtitle.mobile { display: block; } } @media only screen and ( max-width : 399px ) { .chart_legend tr td.candidate { width: 100%; float: none; display: inline-block; } /*.chart_legend tr td.candidate:nth-child(even) { float: right; }*/ .chart_legend { -webkit-column-count: 2; /* Chrome, Safari, Opera */ -moz-column-count: 2; /* Firefox */ column-count: 2; } .chart_legend tbody { display: inline; } .chart_header { display: block; overflow: hidden; } .chart_legend.small_legend tr td.candidate { width: auto; } } /**************************** EMBED STYLES ***************************************/ .embed_container { /**/display: none; overflow:hidden; background: #f6f6f6; height: 250px; border-top: 1px solid #ccc; position: relative; z-index: 3; } .embed_container a#widget_close { display: block; width: 17px; height: 17px; background: transparent url('http://www.realclearpolitics.com/images/bg_close.gif') no-repeat; text-align: right; position: absolute; top: 10px; right: 10px; font: bold 12px Arial, Helvetica, sans-serif; color: #666; } .embed_container textarea { margin: 10px 10px 5px 10px; width: 90%; max-width: 550px; height: 65px; border: 1px solid #ccc; } .embed_container p.embed_description { margin: 0 10px 10px 10px; padding: 0 0 10px 0; border-bottom: 1px solid #999; color: #666; font: 10px Verdana, Arial, Helvetica, sans-serif; } .embed_container a.widget_size { display: block; background: #ccc; border: 1px solid #999; margin: 2px auto 0 auto; } .embed_container a.on { border: 1px solid #666; background: #aaa; } .embed_container div.widget_custom { display: block; background: #ccc; border: 1px solid #999; margin: 2px auto 0 auto; } .embed_container div.widget_custom input { border: 1px solid #999; width: 30px; } .embed_container div.on { border: 1px solid #666; background: #aaa; color: #666; } .embed_container div.on input { border: 1px solid #666; } .embed_container a:hover { text-decoration: none; } .embed_container a#widget_180x338 { width: 18px; height: 33px; } .embed_container a#widget_300x338 { width: 30px; height: 33px; } .embed_container a#widget_450x338 { width: 45px; height: 33px; } .embed_container td { vertical-align: top; padding-right: 15px; padding-bottom: 20px; text-align: center; font: 9px Verdana, Arial, Helvetica, sans-serif; color: #999; } .embed_container table { margin-left: 20px; margin-top: 10px; } .embed_container td.preview { vertical-align: middle; padding-left: 20px; } .embed_container td.min { vertical-align: middle; padding-left: 0; text-align: left; font-style:italic; width: 50px; } .embed_container h4 { margin: 10px 10px 0 10px; color: #666; font: 18px Georgia, "Times New Roman", Times, serif; } #embed_facebox { display: none; } #embed_widget { text-align: center; padding: 10px 10px 0 10px; } #embed_iframe { display: none; } .ds { border-right: 1px solid #e7e7e7; height: 26px; position: relative; z-index: 100; } .lsbb { background: #eee; border-color: #ccc #999 #999 #ccc; border-right: 1px solid #999; border-style: solid; border-width: 1px; height: 24px; } .lsb { background-position: center bottom; background: transparent url('http://www.realclearpolitics.com/images/election_2010_submit.gif') repeat-x bottom; border: medium none; color: #333; cursor: pointer; font: 13px Arial, Helvetica, sans-serif; height: 24px; margin: 0; vertical-align: top; } /**********************************************************************************/