﻿#summary {
    display: none;
}

#leftColumn {
    float: left;
    width: 234px;
    text-align: center;
}

#leftAd {
    margin: 20px auto;
    text-align: center;
    clear: left;
    width: 160px;
    height: 600px;
    -webkit-box-shadow: 7px 7px 15px #3C0000;
    -moz-box-shadow: 7px 7px 15px #3C0000;
    box-shadow: 7px 7px 15px #3C0000;
}

#chartFilterSelector {    
    width: 250px;
    background-color: #530000;
    float: left;
    margin: 0 24px 20px 0;
    text-align: center;
    border-radius: 30px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    -webkit-box-shadow: inset 0 5px 10px rgba(0,0,0,0.3);
    -moz-box-shadow: inset 0 5px 10px rgba(0,0,0,0.3);
    box-shadow: inset 0 5px 10px rgba(0,0,0,0.3);
}
.chartFilterSelectorHeading {
    border-bottom:1px solid #754038;
    clear:left;
    color:#DFDAC4;
    font-size:18px;
    line-height:1em;
    margin: 0 auto 9px;
    padding: 15px 0 10px;
    position:relative;
    width: 215px;
    text-transform: uppercase;
}

.customListsHeading {
    border-bottom: 1px solid #DFDAC4;
    clear: left;
    color: #DFDAC4;
    font-size: 18px;
    font-weight: bold;
    line-height: 1em;
    margin: 0 auto;
    padding: 0 0 10px;
    position: relative;
    width: 215px;
}

.customLists {
    font-size: 11px;
    line-height: 1.2em;
    padding:10px;
}

#chartFilterSelector hr {
    height: 1px;
    width: 215px;
    margin: 0 auto;
}

#chartFilterSelector label {
    width: 67px;
    float: left;
    margin-right: 10px;
    text-align: right;
    clear: left;
    padding: 6px 0 6px 2px;
}

#chartFilterSelector input {
    margin-top: 8px;
    float: left;
    padding: 2px 0 2px 3px;
}

#chartFilterSelector select {
    background-color: #FFFADB;
	border: 1px solid #CBB945;
	color: #776B1B;
	margin: 4px 0 0;
    width: 215px;
}

.txtDirector, .txtActor {
   background-color:#FFFADB;
   border:1px solid #CBB945;
   color:#776B1B;
   margin: 4px 0 0 17px !important;
   width: 210px;
   float: left;
}

.chartsActorResult, .chartsDirectorResult {
	padding: 0;
	background: #FFFADB none repeat scroll 0 0;
    border: 1px solid #8F6863;
    color: #776B1B;
	overflow: hidden;
	z-index: 99999;
	margin: -1px 0 0 0;
    border-top: none;
    -webkit-box-shadow: 0 55px 90px rgba(0,0,0,0.5);
    -moz-box-shadow: 0 55px 90px rgba(0,0,0,0.5);
    box-shadow: 0 55px 90px rgba(0,0,0,0.5);
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.chartsActorResult ul, .chartsDirectorResult ul {
	width: 100%;
	list-style-position: outside;
	list-style: none;
	padding: 0;
	margin: 0;
	-webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.chartsActorResult li, .chartsDirectorResult li {
	margin: 0px;
	padding: 5px 10px;	
    cursor: pointer;
	display: block;
	/* 
	if width will be 100% horizontal scrollbar will apear 
	when scroll mode will be used
	*/
	/*width: 100%;*/
	font: menu;
	/* 
	it is very important, if line-height not setted or setted 
	in relative units scroll will be broken in firefox
	*/
	line-height: 16px;
	overflow: hidden;
	border-bottom: 1px solid #EEE;
}

.chartsActorResult img, .chartsDirectorResult img {
    display: none;
}

.listOptions {
    text-align: right;
    padding: 10px 0 25px 0;
    font-size: 12px;
}

#saveList {
    background: url("/images/disk_blue.png") no-repeat;
    padding: 0 5px 0 21px;
    vertical-align: middle;
}

.shareList, .rankList {
    color: #feea95;
    font-size: 15px;
    padding: 8px 8px 10px 34px;
    background-color: #481512; /* fallback color */     
    background-image: -moz-linear-gradient(0% 50% 90deg,#481617, #693f40);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 50%, from(#693f40), to(#481617));
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    width: 265px;
    font-weight: bold;
    margin-bottom: 10px;
    border: 1px solid #7d5852;
    text-decoration: none;
    margin-left: 7px;
    text-transform: uppercase;
    -webkit-box-shadow: 4px 4px 10px #580C0C;    
    -moz-box-shadow: 4px 4px 10px #580C0C;
    box-shadow: 5px 5px 15px #580C0C;
    position: relative;
}


a.shareList:hover, a.rankList:hover {
	background-color: #6e3531; /* fallback color */     
    background-image: -moz-linear-gradient(0% 50% 90deg,#692f2f, #903f39);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 50%, from(#903f39), to(#692f2f));
    border: 1px solid #a4746c;
    text-decoration: none;
    color: #ffe373;
}

a.shareList:before {
    content: url("/images/facebook.gif");
    position: absolute;
    top: 9px;
    left: 11px;
}

a.rankList:before {
    content: url("/images/arrow_right_green.png");
    position: absolute;
    top: 10px;
    left: 11px;
}

#applyFiltersCenter {
    margin: 0 auto;
    padding: 5px 0 55px;
    width: 103px;
}

.applyFiltersButton {
    clear: both;
    padding: 0;
    margin-bottom: -17px;
}

#examplesDefinition {
    border-bottom:1px solid #754038;
    clear:left;
    font-size:14px;
    line-height:1.2em;
    margin: 15px auto 0;
    padding-bottom:7px;
    width:215px;
}

#examples {
    padding: 10px 20px 20px 39px !important;
    text-align: left;    
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUzMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjMzJSIgc3RvcC1jb2xvcj0iIzUzMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjUiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzUzMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top, rgba(83,0,0,0) 0%, rgba(83,0,0,0.5) 33%, rgba(83,0,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(83,0,0,0)), color-stop(33%,rgba(83,0,0,0.5)), color-stop(100%,rgba(83,0,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(83,0,0,0) 0%,rgba(83,0,0,0.5) 33%,rgba(83,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(83,0,0,0) 0%,rgba(83,0,0,0.5) 33%,rgba(83,0,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(83,0,0,0) 0%,rgba(83,0,0,0.5) 33%,rgba(83,0,0,1) 100%); /* IE10+ */
background: linear-gradient(top, rgba(83,0,0,0) 0%,rgba(83,0,0,0.5) 33%,rgba(83,0,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00530000', endColorstr='#530000',GradientType=0 ); /* IE6-8 */
}

#examples li {
    font-size: 12px;
    margin-bottom: 10px;
}

#chart {
    width: 608px;
    float: left;
    color: #dfdac4;
    line-height: 1em;
}

#chart p {
    line-height: 1.1em;
}

#decidedBy {
    font-size: 12px;
}

#chartModifiers {
    font-size: 10px;
    border-bottom: 2px solid #754038;
    padding-bottom: 2px;
    font-weight: bold;    
}

#chartModifiers select {
    background-color: #FFFADB;
	border: 1px solid #CBB945;
	color: #776B1B;
	margin: 5px 5px 2px;
	font-size: 10px;
}

#chartModifiers .details {
    margin-left: 9px;
}

.sortLink {
    margin: 0;
}

.sortLinkSelected {
    font-weight: bold;
    background: #754038;    
    padding: 6px 7px;
    -moz-border-radius-topleft:6px;
    -moz-border-radius-topright:6px;
    -webkit-border-top-left-radius:6px;
    -webkit-border-top-right-radius:6px;
}

#chartModifiers div {
    text-align: left;
    float: left;
    margin: 8px 8px 0 0;
}

#pagination {
    text-align: right;
}

#bottomPagination {
    font-size:11px;
    margin: 5px 0 0 0;
    padding:5px 0 0;
    text-align:right;
    width:610px;
    float: right;
}

.posterThumbImg {
    -webkit-box-shadow: 3px 3px 5px #3C0000;
    -moz-box-shadow: 3px 3px 5px #3C0000;
    box-shadow: 3px 3px 5px #3C0000;
    border: 2px solid #444;
    padding: 2px;           
    background-color: #000;
    background-image: linear-gradient(top, #000000 0%, #ddd 50%, #333333 100%);
    background-image: -o-linear-gradient(top, #000000 0%, #ddd 50%, #333333 100%);
    background-image: -moz-linear-gradient(top, #000000 0%, #ddd 50%, #333333 100%);
    background-image: -webkit-linear-gradient(top, #000000 0%, #ddd 50%, #333333 100%);
    background-image: -ms-linear-gradient(top, #000000 0%, #ddd 50%, #333333 100%);
    background-image: -webkit-gradient(
	    linear,
	    left top,
	    left bottom,
	    color-stop(0, #000000),
	    color-stop(0.5, #ddd),
	    color-stop(1, #333333)
    );  
}

.chartEntry {
    width: 610px;
	height: 165px;
	position: relative;
	float: left;
	padding-bottom: 11px;
	-webkit-box-shadow: 1px 7px 20px #3C0000;
    -moz-box-shadow: 1px 7px 20px #3C0000;
	box-shadow: 1px 7px 20px #3C0000;
}

.altChartEntry {
    width: 610px;
	height: 163px;
	background-color: #6A1B1C;
	position: relative;
	float: left;
	-webkit-box-shadow: 1px 7px 20px #3C0000;
    -moz-box-shadow: 1px 7px 20px #3C0000;
	box-shadow: 1px 7px 20px #3C0000;
	padding-bottom: 11px;
}

.recChartEntry {
    background-image: -moz-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: -webkit-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: -o-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: -ms-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: linear-gradient(top,#b27f4c,#996533 50.0%);
    padding-bottom: 0;
    border-bottom: 10px solid #530000;
    width: 630px;
    margin-left: -10px;
    -webkit-box-shadow: 0 10px 20px #3C0000;
    -moz-box-shadow: 0 10px 20px #3C0000;
    box-shadow: 0 10px 20px #3C0000;
    z-index: 5000;    
}

.recNotice {
    border-top: 1px solid #CCB087;
    border-bottom: 1px solid #DDC8A3;
    padding: 10px 15px;
    float: left;
    clear: left;
    position: relative;
    background-image: -moz-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: -webkit-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: -o-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: -ms-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: linear-gradient(top,#b27f4c,#996533 50.0%);
    font-family: 'GraublauWebBold';
    text-transform: uppercase;
    font-size: 16px;
    color: #fff;
    width: 600px;
    margin: 2px 0 0 -10px;
}

.movieInfo {
	float: left;
	width: 610px;
	clear: left;
	position: relative;
}

.movieThumb {
    float: left;
    padding: 15px 18px 0 14px;
}

.movieDetails {
    padding-top: 12px;
    font-family: Arial, sans-serif;
}

.movieRanking {
    color: #fff;
    font-weight: bold;
    font-size: 25px;
    line-height: 1em !important;
    font-family: 'GraublauWebBold';
}

.movieTitle {
    font-weight: bold;
    font-size: 16px;
    line-height: 1.5em !important;
    font-family: 'GraublauWebBold', 'Trebuchet MS', Arial, sans-serif;
}

.director {
    font-size: 10px;
    line-height: 1.5em !important;
}

.genre {
    font-size: 10px;
    line-height: 1.5em !important;
}

.seenStatus {
    font-size: 11px;
    padding-top: 11px;
    float: left;
}

.seenStatusDivider {
    color: #ac9081;
}

.userPosition {
    font-weight: bold;
    color: #fff;
}

.rankingMovement {
    position:absolute;
    right:22px;
    top:15px;
}

.sparkline {
    float: left;
}

.rankingMovementArrow {
    margin: 3px 0 0 3px;
    float: left;
    display: block;
}

.rankingChange {
    margin: 4px 0 0 1px;
    display: block;
    float: left;
    font-weight: bold;
}

.serviceButtons {
	height: 38px;
	position: relative;
	margin-top: 14px;
	background-color: #754038;
}

.filterLink:hover
{
	text-decoration: none;
	border-bottom: 1px dashed;
}

#chartsListView {
    width: 610px;
    font-size: 11px;
    border-collapse: collapse; 
}

#chartsListView td {
    border-bottom: 1px solid #754038;
}

#chartsListView tr th, #chartsListView tr td {
    text-align: center;
    padding: 4px;    
}

#chartsListViewHead {
    background-color: #530000;
    border-bottom: 2px solid #350000;
    font-size: 11px; 
}

#globalRankingColumn {
    width:44px;
}

#movieTitleColumn {
    width:190px;
}

#releaseYearColumn {
    width:35px;
}

#directorColumn {
    width:85px;
}

#mpaaRatingColumn {
    width:34px;
}

#yourRankingColumn {
    width:44px;
}

.listTitle {
    text-align: left !important;
}

.adSenseText {
	text-align: center;
    margin: 15px 0;
    width: 610px;
    /*background: #6A1B1C;*/
    float: left;
    padding: 10px 0;
}

.netflixButton {
	bottom: 6px;
	right: 22px;
	position: absolute;
}

.amazonButton {
	bottom: 3px;
	right: 214px;
	position: absolute;
}

.itunesButton {
	bottom: 7px;
	right: 120px;
	position: absolute;
}

.fbLikes {
	bottom: 10px;
	left: 89px;
	position: absolute;
}

.googleplusone {
	bottom: 10px;
	left: 15px;
	position: absolute;
}

.noMovies {
	position: absolute;
	padding-top: 16px;
	font-size: 16px;
}

.galleryPosterImg {
    -webkit-box-shadow: 0 8px 15px #3C0000;
    -moz-box-shadow: 0 8px 15px #3C0000;
    box-shadow: 0 8px 15px #3C0000;
    border: 3px solid #444;
    padding: 3px;
    background-color: black;
    background-image: linear-gradient(top,#000 0,#ddd 50%,#333 100%);
    background-image: -o-linear-gradient(top,#000 0,#ddd 50%,#333 100%);
    background-image: -moz-linear-gradient(top,#000 0,#ddd 50%,#333 100%);
    background-image: -webkit-linear-gradient(top,#000 0,#ddd 50%,#333 100%);
    background-image: -ms-linear-gradient(top,#000 0,#ddd 50%,#333 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#000),color-stop(0.5,#ddd),color-stop(1,#333));
    margin: 10px 0 0;
    max-width: 106px;
    max-height: 167px;
    height: 157px;
    width: 106px;
    -webkit-transition: border-color 0.3s ease-out, background 0.3s ease-out;
    -moz-transition: border-color 0.3s ease-out, background 0.3s ease-out;
    -o-transition: border-color 0.3s ease-out, background 0.3s ease-out;
    transition: border-color 0.3s ease-out, background 0.3s ease-out;
}

.galleryPosterImg:hover {
    border-color: #b27f4c;
    background: #996633;
}

#progressPercentage {
    margin-top: 8px;
    margin-bottom: -23px;
    font-weight: bold;
    color: white;
    font-size: 14px;
}

#progressText {
    clear: both;
    padding: 0 0 15px 0;
    text-align: right;
    margin: 10px 11px -35px 0;
    font-size: 12px;
    text-transform: uppercase;
}

.theTotalMovies, .theTotalMoviesSeen {
    font-weight: bold;
    color: #fff;
}

/* Corner radius */
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; -khtml-border-top-left-radius: 5px; border-top-left-radius: 5px; }
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; -khtml-border-top-right-radius: 5px; border-top-right-radius: 5px; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; -khtml-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -khtml-border-bottom-right-radius: 5px; border-bottom-right-radius: 5px; }

/* Overlays */
.ui-widget-overlay { background: #666666 url(images/ui-bg_diagonals-thick_20_666666_40x40.png) 50% 50% repeat; opacity: .50;filter:Alpha(Opacity=50); }
.ui-widget-shadow { margin: -5px 0 0 -5px; padding: 5px; background: #000000 url(images/ui-bg_flat_10_000000_40x100.png) 50% 50% repeat-x; opacity: .20;filter:Alpha(Opacity=20); -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.ui-progressbar { height:2em; text-align: left; overflow: hidden; }
.ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; }

#seenProgressBar {
    margin: 0 0 15px;
}

#seenProgressBar .ui-widget-header {
    background: #963;
    background-image: -moz-linear-gradient(top,#b27f4c,#996533 50.0%);
    background-image: -webkit-linear-gradient(top,#CCA87C,#996533 50%);
    background-image: -o-linear-gradient(top,#b27f4c,#996533 100.0%);
    background-image: -ms-linear-gradient(top,#b27f4c,#996533 100.0%);
    background-image: linear-gradient(top,#b27f4c,#996533 100.0%);
}

.ui-widget-content {
    background: #530000;
    -webkit-box-shadow: inset 0 5px 10px rgba(0,0,0,0.3);
    -moz-box-shadow: inset 0 5px 10px rgba(0,0,0,0.3);
    box-shadow: inset 0 5px 10px rgba(0,0,0,0.3);
    border-bottom: 1px solid #6B3330;
}
