@charset "utf-8 ";
/* @import url(fonts/weblogma_yekan.css); */
@charset "UTF-8 ";
/* @import url(fonts/b-mitra.css); */
/*@import url(fonts/aa.css);*/

* {
	//font-family: B Mitra;
	font-family: Garamond;
	border-width: 1px;
	border-color: Red;
	!important
}

body {
	position: relative;
    font-family:Garamond,Arial;
    //margin:0;
    padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
    background: #EEE;
    //direction: rtl;
	//display: none;
}

/* subsetting section */
header {
	display: inline-block;
	margin-bottom: -42px;
	background: white;
	margin-top: 53px;
	border-radius: 4px;
}

div {
	//border-style: solid;
	//border-width: 1px;
}

table {
}

td {
	border-width: 1px;
	border-color: black;
}

div.scatter
{
	display: inline-block;
	width: 30%;
	height: 200px;
}

div.subsetGroup
{
	direction: rtl;
	//max-width: 1000;
	width: 1000;
	float: right;
	display: inline-block;
	vertical-align: top;
	//text-align: center;
	margin-left: auto;
	margin-right: auto;
}

div.valueGroup
{
	float: right;
	text-align: right;
	margin-top: 0;
	margin-right: 30px;
	width: auto;
	padding: 5 5 5 5;
	border: YellowGreen solid 1px;
	background-color: whitesmoke;
	border-radius: 4px;
	//padding-right: 500;
	//text-align: left;
	//float: right;
	//display: inline-block;
}

div.big-logo
{
	position: absolute;
	left: 30;
	bottom: 10;
	display: none;
	padding: 0px;
}

div.locationGroup
{
	//width: 250;
	text-align: right;
	float: right;
	//position: absolute;
	//bottom: 30;
	//left: 30;
	//display: inline-block;	
	padding: 5 5 5 5;
	width: auto;
	background-color: whitesmoke;
	border: Maroon solid 1px;
	border-radius: 4px;
//	border-style: solid;
	padding: 5px;
}

div.timeSlider
{
	//background-color: #f5f5f5;
	width: 45%;
	border-color: black;
	border-width: 1px;
	border-radius: 4px;
//	border-style: solid;
	padding: 5px;
	display: none;
}

label 
{
	vertical-align: top;
	font-family: Garamond;
	font-style: normal;
	/*margin-right: 5px;*/
}

label.btn
{
	font-size: 80%;
}


.diagrams div
{
	padding: 4% 4% 4% 4%;
}

select.subset {
	text-align: right;
	width: 100;
	height: 80;
	font-family:Garamond;
	font-size: 100%;
	display: inline-block;
}

.subsetting button {
	font-size: 80%;
	font-family:Garamond;
	direction: rtl;
	height: 30;
	display:inline-block;
	margin-top: 5px;
	margin-left: 2%
	text-align: center;
	width: 48%;
	float: left;
}

.scat
{
	//fill: transparent;
	fill-opacity: 0.2;
	stroke-opacity: 0.2;
}

.scat.selected
{
	opacity: 0.8;
	fill-opacity: 0.8;
	stroke: yellow;
}

text.scatt
{
	display: none;
	font-size: 80%;
}

.scat.dim
{
	stroke-opacity: 0.05;
	fill-opacity: 0.05;
}

.scat.selected.dim
{
	stroke-opacity: 0.6;
	fill-opacity: 0.6;
}

text.scatt.selected
{
	display: inline-block;
}

/*.mplot
{
	display:inline-block;
	width: 250px;
	height: 250px;
	margin: 1em;	
}*/

.mplotName
{
	position: absolute;
	top: 20px;
	right: 20px;
	fill: blue;
	font-size: 80%;
	opacity: 0.7;
}

.bar {
  //fill: steelblue;
  stroke:black;
  stroke-width: 1px;
}

.bar:hover {
  fill: brown;
}

.axis {
  font: 10px sans-serif;
}

.x path,
.axis line {
  fill: none;
  stroke: #000;
  stroke-width: 2px;
  shape-rendering: crispEdges;
}

.x.axis path {
   display: none;
}

td {
	position: relative;
}

/*#main {
	//display: inline-block;
	position: absolute;
	vertical-align: top;
	width: 100%;
	height: 100%;
	top:0;
	border-style: solid;
	border-width: 0px;
}*/

#ostan {
	width: auto;
	height: 400;
	background-color: white;
	float:top;
}

/*#Linechart {
	float: bottom;
	width: auto;
	height: 400;
	background-color: white;
}*/

/*#barChart1
{
	height: 400;
	width: 200;
	margin-top: 400;
	float: right;
	background-color: white;
	border-width: 1px;
	border-style: solid;
	display: inline-block;
}

#barChart2
{
	height: 400;
	width: 200;
	margin-top: 400;
	float: left;
	background-color: white;
	border-radius: 1px;
	border-style: solid;
}*/



.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.x.axis path {
  display: none;
}

.line {
  fill: none;
  stroke: steelblue;
  stroke-width: 1.5px;
}
.province { 
	fill: rgb(255, 0,0);
	stroke: 0;
	stroke-linejoin: round;
}

.state
{
	stroke-width: 1.2px;
	stroke: #888;
	fill: none;
	stroke-linejoin: round;
	z-index: -99999;
}
.state:hover
{
	fill: none;
}

path.province {
  stroke-width: .5px;
  stroke: #888;
  fill: #999;
  cursor: pointer;
}

/* must be provided for the hash mask to work */
pattern path 
{
	stroke: white;
}

path.selected
{
	stroke: green;
	stroke-width: 3px;
	mask: url(#mask)
}

rect.selected {
	stroke: green;
	stroke-width: 3px;
	mask: url(#mask)	
}

path:hover {
	fill: rgb(255, 0, 0);
	!important
}

.hidden {
	display: none;
}

div.tooltip {
	font-family: Garamond;
	color: #222;
	background-color: #fff;
	padding: .5em;
	text-shadow: #f5f5f5 0 1px 0;
	border-radius: 4px;
	opacity: 0.8;
	/*direction: rtl;
	text-align: right;*/
	position: absolute;
	!important
}

p, ul.large > li {
	font-family: Garamond;
	font-size: 140%;
	text-align: justify;
	text-justify: inter-word;
}

strong { font-family: Garamond}

h1, h2, h3, h4, h5, h6 
{
	font-family: Arial Black;
	font-size: 130%;
	color: dodgerblue;
}

.legend
{
	position: absolute;
}

.barTitle
{
	position: absolute;
	right: 50px;
	top: 30px;
	font-family: Garamond;
	font-size: 100%;
	font-weight: Bold;
}

/*ul.subsetting li {
	display: inline-block;
	margin-left: 0;
	padding-right: 10;
	padding-left: 10;
	text-align: right;
	list-style-type: none;
}*/

.subsetting
{
	direction: rtl;
}

.subsetting label
{
	font-weight: normal;
}

ul.subsetting li {
	display: inline-block;
	height: auto;
	//width: 70px;
	font-size: 16px;
	margin-left: 0;
	padding-right: 10;
	padding-left: 10;
	text-align: right;
	list-style-type: none;
}
ul.subsetting {
	margin-right: 10;
	margin-left: 10;
	margin-top: 5;
	padding-right: 10;
	text-align: right;
	background-color: whitesmoke;
	border: YellowGreen solid 1px;
	border-radius: 2px;
	overflow-x: hidden;
	overflow: auto;
	height: 70px;
	min-width: 100px;
}

#subsetBtn
{
	width: 100%;
	//background-color: YellowGreen;
}

div.projectTitle
{
	//display: none;
	position: fixed;
	left: 0;
	top: 0; 
	margin: auto;
	width: 100%;
	text-align: center;
	//background: red;
	z-index: -1;
}

div.projectTitle p
{
	font-family: Garamond;
	font-size: 170%;
	direction: rtl;
	text-align: center;
	margin-bottom: 0px; /* override creative.css */
}

div#barChart1, #barChart2, #locCompare, #barChart3
{
	//padding: 2% 2% 3% 3%;
	//padding: 0 0 0 0 ;
}

.tick line 
{
	stroke: #E0E0E0;
	stroke-width: 1px;
	shape-rendering: geometricPrecision;
}

.tick text 
{
	font-family: Garamond;
	font-size: 120%;
}

.tooltip > .tooltip-inner {
	font-family: Garamond;
	font-style: normal;
	text-shadow: none;
}

#tabbedBarCharts
{
	overflow: auto;
	position: relative;
}

.no-gutter > [class*='col-'] {
	padding-left: 0px;
	padding-right: 0px;
}

.subset-btn
{
	width: 30%;
	height: 30px;
	margin-left: 2px;
}

#main-container
{
	margin-top: 65px;
}

@media (min-width: 480px) {
	.navbar-nav > li {
		float: left;
	}
}

.axis2 line, 
.axis2 path {
	stroke-width: 1px;
	stroke: #999;
	fill: transparent;
}

.axis2 .tick text 
{
	font-size: 100%;
}

svg#scatter
{
	padding-top: 10px;
}

#main svg {
	margin-top: -65px;
}

.d3-tip {
	font-family: Garamond;
}

.valueImg
{
	width: 8px;
}

#showWinner
{
	float: right;
	text-align: right;
	margin-top: 0;
	margin-right: 30px;
	width: auto;
	padding: 5 5 5 5;
	border: YellowGreen solid 1px;
	background-color: whitesmoke;
	border-radius: 4px;
}

.rightFloat
{
	float: right;
}

.scat.highlight
{
	stroke-opacity: 0.6 !important;
	stroke-width: 1px !important;
	stroke: black !important;
	//fill: yellow !important;
	//fill-opacity: 0.5;
	//mask: url(#mask)
	
}

.scat.highlight.dim
{
	stroke-opacity: 1.0 !important; 
}

g.CandidBars > rect.bar
{
	
} 

.valSelector
{
	margin-left: 30px;
}

#legendImage
{
	position: absolute;
	top: 300px;
	left: 40px;
	margin-left: auto;
	margin-right: auto;
	width: 100px;
}

.rtl
{
	direction: rtl;
}


input[type='checkbox']
{
	width: 1.4em;
	height: 1.4em;
	margin: 1.2em 0px;
}
input[type="checkbox"] ~ label
{
	float: left;
	margin: 5px 10px;
	font-size: 180%;
}

.clear
{
	clear: both;
}

.clearAfter::after
{
	clear: both;
}

.cadre
{
	overflow: auto;
}

.cadre::after
{
	clear: both;
}

.copyright
{
	text-align: center;
}

#logo
{
	width: 50px;
	/*margin-top: -15px;*/
}

#siteTitle
{
	width: 170px;
	font-family: Garamond;
	padding-top: 15px;
}

#links
{
	margin-right: 35px;
}

/*#tripDiv
{
	//position: relative;
	left: 30px;
	bottom: 150px;
}*/


/*.navbar-fixed-top {
    min-height: 60px;
}

.navbar-nav > li > a {
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 60px;
}

@media (max-width: 767px) {
    .navbar-nav > li > a {
    line-height: 20px;
    padding-top: 10px;
    padding-bottom: 10px;}
}*/

.nav>li>a {
	padding: 10px 10px;
}

@media (min-width: 768px) {
	.navbar-nav>li>a {
		padding-top: 15px;
		padding-bottom: 15px;
	}
}

.cc-selector input{
    margin:0;padding:0;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none;
}
#rohani{background-image:url(../img/gerdha/rohani.png) !important;}
#raisi{background-image:url(../img/gerdha/raisi.png) !important;}
#turnout{background-image:url(../img/gerdha/turnout.png) !important;}
#winner{background-image:url(../img/gerdha/winner.png) !important;}
#sort{background-image:url(../img/sort.png) !important; }
#showTrip{background-image:url(../img/travels-en.png) !important; }

.cc-selector input:active +.drinkcard-cc{opacity: .9;}
.cc-selector input:checked +.drinkcard-cc{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
}

.drinkcard-cc.small
{
	width:20px;
	height:20px;
}
.drinkcard-cc{
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
    width:65px;height:60px;
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    -webkit-filter: brightness(1) grayscale(1) opacity(.7);
       -moz-filter: brightness(1) grayscale(1) opacity(.7);
            filter: brightness(1) grayscale(1) opacity(.7);
}
.drinkcard-cc:hover{
    -webkit-filter: brightness(1) grayscale(.5) opacity(.9);
       -moz-filter: brightness(1) grayscale(.5) opacity(.9);
            filter: brightness(1) grayscale(.5) opacity(.9);
}

/* Extras */
a:visited{color:#888}
a{color:#444;text-decoration:none;}
p{margin-bottom:.3em;}


/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
 
    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
}

#tripIcon
{
	position: relative;
	left: -30px;
	top: 25px;
}

#locType
{
	margin-top: 25px;
}

.wide-margin
{
	margin-left: 50px;
	margin-right: 100px;
}