@charset "utf-8";
/* CSS Document */

div.statistics-main-content { max-width: 1248px; height: auto;  margin: 0 auto; padding: 10px 0 10px 0; }

div.statistics-main-content h1,
div.statistics-main-content p { font-weight: 100; margin: 10px 100px; line-height: 120%; }

div.statistics-main-content p { font-size: 15px; }

div.statistics-main-content p span.pros-green-shape { color: #35753e; font-weight: bold; }

div.statistics-main-content p span.cons-red-shape { color: #ab263d; font-weight: bold; }

/* diagrams */
div.statistics-main-content div.statistics-diagram-shape { width: 590px; height: 220px; margin: 60px auto 0 auto; }

div.statistics-main-content div.statistics-diagram-shape div.diagram-percent-item { width: 81px; height: 100%;  float: left; margin-left: 1px; position: relative; }

/* set color diagrams */

div.statistics-main-content div.statistics-diagram-shape div.dFirst div.diagram-percent-item-value,
div.statistics-main-content div.statistics-diagram-shape div.dSeventh div.diagram-percent-item-value { width: 100%; min-height: 20%; background-color: #5b7778; bottom: 0; position: absolute; }

div.statistics-main-content div.statistics-diagram-shape div.dSecond div.diagram-percent-item-value,
div.statistics-main-content div.statistics-diagram-shape div.dSixth div.diagram-percent-item-value { width: 100%; min-height: 20%; background-color: #edbc3c; bottom: 0; position: absolute; }

div.statistics-main-content div.statistics-diagram-shape div.dThird div.diagram-percent-item-value,
div.statistics-main-content div.statistics-diagram-shape div.dFifth div.diagram-percent-item-value { width: 100%; min-height: 20%; background-color: #92a7a8; bottom: 0; position: absolute; }

div.statistics-main-content div.statistics-diagram-shape div.dFourth div.diagram-percent-item-value { width: 100%; min-height: 20%; background-color: #313b3d; bottom: 0; position: absolute; }

div.statistics-main-content div.statistics-diagram-shape div.dFirst div.diagram-percent-item-value span,
div.statistics-main-content div.statistics-diagram-shape div.dSeventh div.diagram-percent-item-value span { width: 100%; height: 7px; position: absolute; background: #5b7778; }

div.statistics-main-content div.statistics-diagram-shape div.dSecond div.diagram-percent-item-value span,
div.statistics-main-content div.statistics-diagram-shape div.dSixth div.diagram-percent-item-value span { width: 100%; height: 7px; position: absolute; background: #edbc3c; }

div.statistics-main-content div.statistics-diagram-shape div.dThird div.diagram-percent-item-value span,
div.statistics-main-content div.statistics-diagram-shape div.dFifth div.diagram-percent-item-value span { width: 100%; height: 7px; position: absolute; background: #92a7a8; }

div.statistics-main-content div.statistics-diagram-shape div.dFourth div.diagram-percent-item-value span { width: 100%; height: 7px; position: absolute; background: #313b3d; }

/* set text */
div.statistics-main-content div.statistics-diagram-shape div.diagram-percent-item div.diagram-percent-item-value p.diagram-percent-item-value-text { background-color: #eaf0ee; width: 100%; height: auto; margin: 0; padding: 12px 0 6px 0; text-align: center; }

/* slider bar */
div.statistics-main-content div.slider-content-shape { width: 923px; height: 50px; margin: 0 auto;  }

div.statistics-main-content div.slider-content-shape div#decision-shape,
div.statistics-main-content div.slider-content-shape div#decision-shape-oppose { width: 87px; height: 50px; float: left;  margin: 0; font-size: 15px; color: #959595; }

div.statistics-main-content div.slider-content-shape div#decision-shape { text-align: right; }

div.statistics-main-content div.slider-content-shape div#decision-shape-oppose { text-align: left; }

div.statistics-main-content div.slider-content-shape div.slider { border: none;  width: 733px; height: 50px; float: left; background: url(../images/slider-bar-statististics-shape.png) no-repeat -17px 0; margin: 0; }

div.statistics-main-content div.slider-content-shape div.slider  div#track2 { margin: 0 auto; width: 573px;  height: 43px; clear:both;  border: none;  }

div.statistics-main-content div.slider-content-shape div.slider  div#track2 div#handle2 { width: 81px; height: 47px; background: url(../images/slider-bar-statististics-shape-picker.png) no-repeat top; border: none; }

/* share it */
div.share-it-content-shape { width: 100%; height: 129px; margin: 30px 0 0 0; background: url(../images/share-it-shape.png) left top repeat-x; line-height: 120%; }

div.share-it-content-shape h1 { font-family: Arial; font-size: 60px; color: #CCCCCC; margin: 0 0 0 400px; padding-top: 40px; }
div.share-it-content-shape p { font-family: Arial; font-size: 18px; color: #313b3d; margin: 20px 0 0 405px; float: left; }

div.share-it-content-shape div.share-buttons-shape { width: 293px; height: 50px;  margin: -25px 0 0 710px; }

div.share-it-content-shape div.share-buttons-shape div.share-item-button { width: 80px; height: 32px;  float: left; margin: -15px 15px 0 0; position: relative; }

div.share-it-content-shape div.share-buttons-shape div.share-item-button a { border: none; outline: none; }

div.share-it-content-shape div.share-buttons-shape div.share-item-button a img { border: none; outline: none; }

div.share-it-content-shape div.share-buttons-shape div.share-item-button span {  }

.st_facebook_custom { background: url(../images/share-button-facebook.png) left center transparent no-repeat; padding: 0 80px 20px 0; opacity: 0.8; cursor: pointer; }

.st_facebook_custom:hover { opacity: 1; }

.st_twitter_custom { background: url(../images/share-button-twitter.png) left center transparent no-repeat; padding: 0 80px 20px 0; opacity: 0.8; cursor: pointer; }

.st_twitter_custom:hover { opacity: 1; }

.st_email_custom { background: url(../images/share-button-via-email.png) left center transparent no-repeat; padding: 0 80px 20px 0; opacity: 0.8; cursor: pointer; }

.st_email_custom:hover { opacity: 1; }

/* ranking */
div.rank-pros-cons-shape { width: 100%; height: auto; background-color: #f8f8f8; /* margin: 0 0 60px 0; */ padding: 0 0 60px 0; }

div.rank-pros-cons-shape div.rank-text-shape { width: 1248px; margin: 0 auto; height: auto; text-align: left; margin: 20px auto; border: 1px solid #f8f8f8; }

div.rank-pros-cons-shape div.rank-text-shape h2 { margin: 80px 0 0 100px; font-weight: bold; }

div.rank-pros-cons-shape div.rank-text-shape h2 span { color: #313b3d; }

div.rank-pros-cons-shape div.rank-text-shape p { margin: 2px 0 0 100px; font-size: 14px; height: auto; }

div.rank-pros-cons-shape div.rank-text-shape p span {  float: left; }

div.rank-pros-cons-shape div.rank-text-shape p span:nth-child(1) { width: 70px; height: 20px; }

div.rank-pros-cons-shape div.rank-text-shape p span:nth-child(2) { width: 30px; height: 9px; background-color: #35753e; margin: 7px 5px 0 0; }

div.rank-pros-cons-shape div.rank-text-shape p span:nth-child(3) { width: 30px; height: 20px; }

div.rank-pros-cons-shape div.rank-text-shape p span:nth-child(4) { width: 30px; height: 9px; background-color: #ab263d; margin: 7px 0; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape { clear: both; width: 1248px; height: 424px; margin: 50px auto;   }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div { height: 100%; float: left;  }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div p { margin: 7px 0 0 20px; color: #FFFFFF; font-size: 13px; height: 40px; overflow: hidden; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div a { margin: 2px 0 0 20px; color: #000000; font-size: 11px; text-decoration: underline; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div a:nth-child(3) { margin: 2px 0; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-left,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-right { width: 95px; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-left { background: url(../images/statistics-left-box-shape.png) no-repeat 60px 10px;}

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-right { background: url(../images/statistics-right-box-shape.png) no-repeat 60px 10px; }
	
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons { width: 525px; background: url(../images/statistics-rankings-bottom-shadow.png) no-repeat; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-shape,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-shape { width: 489px; height: 366px; margin: 2px 14px 0 14px; overflow: hidden; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-shape div,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-shape div { width: 487px; height: 69px; border: 1px solid #000000; border-radius: 8px; margin: 2px 0 0 0; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-shape h2,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-shape h2 { font-size: 16px; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-even { background-color: #3b8145; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-odd { background-color: #35753e; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-odd { background-color: #ab263d; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-even { background-color: #ba2a43; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-arrow-shape,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-arrow-shape { height: 30px; margin: 10px 20px; border: none; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-arrow-shape a,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-arrow-shape a { margin: 10px; }

div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-pros div.box-pros-arrow-shape span,
div.rank-pros-cons-shape div.pros-cons-popular-rankings-shape div.box-cons div.box-cons-arrow-shape span { font-weight: bold; }

/* new layouts */
div.top-container-statistics { width: 1248px; margin: 20px auto 0 auto; height: 60px; }

div.top-container-statistics div.top-container-statistics-left { width: 400px; height: 60px; float: left; }

div.top-container-statistics div.top-container-statistics-right { width: 300px; height: 60px; float: right; }

div.top-container-statistics div.top-container-statistics-left h2 { height: 70px; font-size: 24px; font-family: "Tahoma"; color: #313b3d; background: url(../images/statistics-tick-icon.png) no-repeat left top; padding: 9px  0 0 45px; }

div.top-container-statistics div.view-all-polls { margin: 15px 0; /* width: 125px; */ height: 30px; float: right; margin-right: 10px; }

div.top-container-statistics div.view-all-polls p { background: url(../images/view-poll-back-to-polls.png) repeat-x bottom; /* width: 120px; */ padding: 0 7px 7px 7px; text-align: center; margin: 5px; }

div.top-container-statistics div.view-all-polls p a:link,
div.top-container-statistics div.view-all-polls p a:visited { font-size: 14px; padding: 3px 25px 3px 0; font-family: "Tahoma"; font-weight: bold; color: #1b83b8; background: url(../images/view-polls-page-right-arrow.png) no-repeat right top;  }

div.top-container-statistics div.view-all-polls p a:hover { color: #313b3d; }

div.statistics-shadow { width: 1248px; height: 12px; margin: 0 auto 40px auto; background: url(../images/polls-page-bottom-shadow.png) no-repeat left top; }

div.rank-pros-cons-shape div.upper-shape-arguments { width: 1057px; height: 460px; margin: 30px auto; clear: both; }

div.rank-pros-cons-shape div.upper-shape-arguments div.positives div#argument-container-pros div.positive-arguments,
div.rank-pros-cons-shape div.upper-shape-arguments div.negatives div#argument-container-cons div.negative-arguments { cursor: default; }

div.rank-pros-cons-shape div.upper-shape-arguments div.middle-shadow { width: 10px; height: 400px; float: left; margin: 30px 0 30px 40px; background: url(../images/dropped-vertical-shadow.png) no-repeat; }












