/* Page d'accueil des graphiques */
#data-graphics input {
	width: 70%;
}

#data-graphics .graph-thumbnail {
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 0px;
	position: relative;
    border: 1px solid #dddddd;
    border-radius: 6px;
    transition: border 0.2s ease-in-out;
}

#data-graphics .graph-thumbnail .content {
	height: 225px;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
	margin-left: 40px;
	margin-right: 40px;
	margin-top: 40px;
}

#data-graphics .graph-thumbnail .overlay {
    color: white;
    opacity: 0;
    position: absolute;
    display: inline-block;
    text-align: center;
    width: 100%;
    height: 100%;
}

#data-graphics .graph-thumbnail .overlay:hover {
    color: white;
    opacity: 0.7;
    background-color: black;
    border-radius: 6px;
    transition: border 0.2s ease-in-out;
}

#data-graphics .graph-thumbnail img {
    width: 300px;
    height: 225px;
}

#data-graphics .row.special-background {
    background-color: #f7f7f7;
    border-bottom: 1px solid #dedede;
    margin-bottom: 0px;
}

.page-title.data-graphics-title {
	font-size: 1.5em;
}

.data-graphics-helper {
    margin-bottom: 10px;
    text-align: right;
}

.data-graphics-helper h2 {
    display: inline-block;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 0px;
}

.data-graphics-helper a {
    display: inline-block;
    text-decoration: underline;
}

.data-graphics-helper .glyphicon.glyphicon-info-sign {
    font-size: 12px;
    color: #0880b8;
}

/* Graphique des tendances */
#data-graphics-tendencies #tendencies-graphic circle:hover, 
#data-graphics-tendencies #tendencies-graphic text.label:hover {
	cursor: pointer;
}

#data-graphics-tendencies .graphic-filters .checkbox-type label {
	padding-left: 0;
}

#data-graphics-tendencies .graphic-filters .checkbox-type input[type="checkbox"] {
	display: none;
}

#data-graphics-tendencies .graphic-filters input[type="radio"] {
	margin-left: 0px;
}

#data-graphics-tendencies .graphic-filters .checkbox-type .glyphicon {
	padding-right: 3px;
}

#data-graphics-tendencies .graphic-filters .multiselect-native-select .caret {
	color: #0880b8;
	margin-left: 5px;
}

#data-graphics-tendencies .graphic-filters button[type="submit"],
#data-graphics-tendencies .graphic-filters button.export-xls,
#data-graphics-tendencies .graphic-filters .multiselect,
#data-graphics-tendencies .graphic-filters .btn-group {
	border-radius: 0;
	width: 100%
}

#data-graphics-tendencies .graphic-filters button .glyphicon {
	color: #0880b8;
	margin-right: 5px;
}

#data-graphics-tendencies .export-xls {
	margin: 10px 0;
	padding-top: 5px;
    display: block;
    border-top: 1px solid #cccccc;
}

#data-graphics-tendencies .export-xls[data-toggle="modal"] {
	font-size: 11px;
}

#data-graphics-tendencies .graphic-filters button.export-xls {
	padding-top: 0;
}

#data-graphics-tendencies #picto-download-xls {
    background-repeat: round;
	display: inline-block;
	margin-right: 5px;
    position: relative;
    top: 7px;
}

#data-graphics-tendencies #button1 {
	float: none;
}

#data-graphics-tendencies #button2 {
	clear: left;
}

#data-graphics-tendencies .showmoreinfos {
	background-color: #f7f7f7;
	border-top: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
	clear: both;
	margin: 20px 0;
}

#data-graphics-tendencies .showmoreinfos a {
	display: block;
	padding: 10px 0;
}

#data-graphics-tendencies .showmoreinfos .glyphicon {
	color: #0880b8;
	margin: 0 10px;
}

/* Graphique des vocabulaires */
#vocabularies-graphic g:hover {
	cursor: pointer;
}

/* Graphique des transpositions de directive */
#transpositions-graphic circle {
  fill: rgb(245, 245, 245);
  stroke: rgb(31, 119, 180);
  stroke-width: 1px;
}

/* #transpositions-graphic svg { */
/* 	background: url(/legilux_front_office/assets/img/graphics/eu_flag.png) no-repeat center; */
/* } */

#transpositions-graphic .level2 circle {
  fill: rgb(167, 199, 241);
}

.graphic-filters .legendLevel2 {
	background-color: rgb(167, 199, 241);
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 4px;
}

#transpositions-graphic .level3 circle {
  fill: rgb(255, 146, 38);
}

.graphic-filters .legendLevel3 {
	background-color: rgb(255, 146, 38);
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 4px;
}

#transpositions-graphic .level4 circle {
  fill: rgb(116, 166, 232);
}

.graphic-filters .legendLevel4 {
	background-color: rgb(116, 166, 232);
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 4px;
}

#transpositions-graphic g:hover {
  cursor: pointer;
}

#transpositions-graphic text {
  font-size: 10px;
  text-anchor: middle;
}

#transpositions-graphic textPath {
  font-size: 12px;
}

#transpositions-graphic .node--hover circle {
  stroke: #000;
  stroke-width: 1.2px;
}

/* Graphique des relations */
#data-graphics-act-relationship input {
	width: 70%;
	max-width: 500px;
}
#act-relationship-graphic svg {
	border-left: 1px solid #dedede;
}
#act-relationship-graphic svg:hover {
	cursor: move;
}
#act-relationship-graphic line {
	stroke: #999;
	stroke-opacity: 0.6;
}
#act-relationship-graphic circle {
	stroke: #fff;
	stroke-width: 1.5px;
}
#act-relationship-graphic .main circle {
	stroke: #e0021b;
    stroke-dasharray: 2;
    fill: #f7f7f7;
    stroke-width: 1px;
}
#act-relationship-graphic text {
    font-weight: bold;
}
#act-relationship-graphic text.info {
    font-weight: normal;
}
#act-relationship-graphic .main text {
    fill: #000;
}
#act-relationship-graphic .node:hover {
	cursor: default;
	text-decoration: none;
}
#act-relationship-graphic .node.expandable:hover {
	cursor: pointer;
}
#act-relationship-graphic .legend {
	font-size: 12px;
	display: none;
}
#act-relationship-graphic rect {
	stroke-width: 2;
}
#data-graphics-act-relationship .filters .glyphicon {
	margin-right: 5px;
}
#data-graphics-act-relationship .filters input[type="checkbox"],
#data-graphics-act-relationship .filters input[type="radio"] {
	margin-left: 0px;
}
#data-graphics-act-relationship .filters button#reset-graph {
	border-radius: 0;
	width: 100%
}
#data-graphics-act-relationship .filters button#reset-graph .glyphicon {
	color: #0880b8;
}

/* Filtres */

.graphic-filters .submit {
	margin-top: 10px;
}

.graphic-filters .jq-slider {
	margin-top: 30px;
}

.graphic-filters .jq-slider .ui-rangeSlider-bar {
	background-color: rgba(224,2,27,1);
}
