/*================fontface================*/
@font-face {
    font-family: 'fontello';
    src: url('../fonts/fontello-metrix.eot?63735431');
    src: url('../fonts/fontello-metrix.eot?63735431#iefix') format('embedded-opentype'), url('../fonts/fontello-metrix.woff2?63735431') format('woff2'), url('../fonts/fontello-metrix.woff?63735431') format('woff'), url('../fonts/fontello-metrix.ttf?63735431') format('truetype'), url('../fonts/fontello-metrix.svg?63735431#fontello-metrix') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'vivaldi';
    src: url('../fonts/vivaldii-webfont.eot');
    src: url('../fonts/vivaldii-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/vivaldii-webfont.woff2') format('woff2'), url('../fonts/vivaldii-webfont.woff') format('woff'), url('../fonts/vivaldii-webfont.ttf') format('truetype'), url('../fonts/vivaldii-webfont.svg#vivaldiitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'impactregular';
    src: url('../fonts/impact-webfont.eot');
    src: url('../fonts/impact-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/impact-webfont.woff2') format('woff2'), url('../fonts/impact-webfont.woff') format('woff'), url('../fonts/impact-webfont.ttf') format('truetype'), url('../fonts/impact-webfont.svg#impactregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansbold';
    src: url('../fonts/opensans-bold-webfont.eot');
    src: url('../fonts/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-bold-webfont.woff2') format('woff2'), url('../fonts/opensans-bold-webfont.woff') format('woff'), url('../fonts/opensans-bold-webfont.ttf') format('truetype'), url('../fonts/opensans-bold-webfont.svg#open_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansbold_italic';
    src: url('../fonts/opensans-bolditalic-webfont.eot');
    src: url('../fonts/opensans-bolditalic-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-bolditalic-webfont.woff2') format('woff2'), url('../fonts/opensans-bolditalic-webfont.woff') format('woff'), url('../fonts/opensans-bolditalic-webfont.ttf') format('truetype'), url('../fonts/opensans-bolditalic-webfont.svg#open_sansbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansitalic';
    src: url('../fonts/opensans-italic-webfont.eot');
    src: url('../fonts/opensans-italic-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-italic-webfont.woff2') format('woff2'), url('../fonts/opensans-italic-webfont.woff') format('woff'), url('../fonts/opensans-italic-webfont.ttf') format('truetype'), url('../fonts/opensans-italic-webfont.svg#open_sansitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansregular';
    src: url('../fonts/opensans-regular-webfont.eot');
    src: url('../fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-regular-webfont.woff2') format('woff2'), url('../fonts/opensans-regular-webfont.woff') format('woff'), url('../fonts/opensans-regular-webfont.ttf') format('truetype'), url('../fonts/opensans-regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'interstateblackcondensed';
    src: url('../fonts/interstate-blackcondensed-webfont.eot');
    src: url('../fonts/interstate-blackcondensed-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/interstate-blackcondensed-webfont.woff2') format('woff2'), url('../fonts/interstate-blackcondensed-webfont.woff') format('woff'), url('../fonts/interstate-blackcondensed-webfont.ttf') format('truetype'), url('../fonts/interstate-blackcondensed-webfont.svg#interstateblackcondensed') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*==============reset==============*/
button[type=submit] {
    border: none;
    background-image: none;
    background-color: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

button[type=submit]:focus, button[type=submit]:active, button[type=submit]:valid, button[type=submit]:visited {
    border: none;
    outline: 0;
}

:focus {
    outline-style: none;
}

/*=================================*/

html {
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-transition: background-color .25s;
    -moz-transition: background-color .25s;
    -o-transition: background-color .25s;
    transition: background-color .25s;
}

body {
    background-color: rgba(0, 0, 0, 0);
    padding-top: 50px;
    padding-bottom: 69px;
    -webkit-transition: opacity .25s ease-in;
    -moz-transition: opacity .25s ease-in;
    -o-transition: opacity .25s ease-in;
    transition: opacity .25s ease-in;
    transition: background-color .4s;
}

body .navbar-inverse {
    /*background-color: #3e3939;*/
    background-color: #173A62;
}

.container {
    width: 100%;
}

/*-----------timer sur progressbar---------------*/
.container progress {
    position: absolute;
    top: 50px;
    width: 98%;
    height: 4px;
    margin: 10px auto;
    display: block;
    -webkit-appearance: none;
    border: none;
    border-radius: 50px;
    background: rgba(91, 141, 199, 0.8);
}

.container progress::-webkit-progress-bar {
    background: #346195;
}

progress::-webkit-progress-value {
    background: rgba(255, 255, 255, .8);
    -webkit-animation: move 0s linear 0 infinite;
}

progress::-moz-progress-bar {
    background: rgba(255, 255, 255, .8);
    -moz-animation: move 0s linear 0 infinite;
}

@-webkit-keyframes move {
    100% {
        background-position: 0px 10px, 0 10px, 0 10px
    }

    0% {
        background-position: -900px 0px, 0 0, 0 0
    }
}

@-moz-keyframes move {
    100% {
        background-position: 0px 10px, 0 10px, 0 10px
    }

    0% {
        background-position: -900px 0px, 0 0, 0 0
    }
}

/*----------fin progressBar------------*/

.fontello {
    font-family: fontello;
}

/* Set padding to keep content from hitting the edges */
.large_metrix, .medium_metrix, .intra_metrix, .mobile_metrix {
    background: rgb(91, 141, 199); /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, rgba(91, 141, 199, 1) 0%, rgba(4, 55, 112, 1) 100%, rgba(4, 55, 112, 1) 102%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(91, 141, 199, 1) 0%, rgba(4, 55, 112, 1) 100%, rgba(4, 55, 112, 1) 102%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, rgba(91, 141, 199, 1) 0%, rgba(4, 55, 112, 1) 100%, rgba(4, 55, 112, 1) 102%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5b8dc7', endColorstr='#043770', GradientType=1); /* IE6-9 fallback on horizontal gradient */
}

.large_metrix footer p {
    color: #fff;
    margin: 0;
}

.body-content {
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 30px;
}

.body-content:before {
    position: absolute;
    top: 50%;
    content: '';
    width: 99%;
    height: 50%;
    background-image: url(/Content/img/fond-body-content.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.navbar-right li {
    float: none;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
}

.navbar-inverse .navbar-nav > li > a {
    color: #fff;
    font-size: 15px;
}

.navbar-inverse .navbar-nav > li > a:hover {
    color: #10E4B0;
}

.picto_deconnexion {
    font-size: 23px;
}

/* Search bar dans la liste des utilisateurs */
.search_bar {
    font-size: 14px;
    border: none;
    border-left: solid 1px #ddd;
    height: 25px;
    margin: 5px 0;
}

.search_bar:after {
    content: 'S';
    font-family: fontello;
}

/* Override the default bootstrap behavior where horizontal description lists
   will truncate terms that are too long to fit in the left column
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

/*===============================================================================*/
/*customisation des checkboxs*/

.test input[type=checkbox], input[type=radio] {
    display: inherit;
}

input[type=checkbox], input[type=radio] {
    display: none;
}

.checkbox, .radio {
    padding-left: 20px;
    padding-right: 10px;
}

.checkbox:before, .radio:before {
    position: absolute;
    content: "";
    top: 3px;
    left: 0;
    width: 12px;
    height: 12px;
    border: solid 1px #333;
    border-radius: 2px;
}

input[type=checkbox]:checked + .checkbox:after,
input[type=radio]:checked + .radio:after,
.after:after,
input[type=checkbox]:checked + input + .checkbox:after {
    font-family: fontello;
    font-style: italic;
    content: "0";
    font-size: 16px;
    position: absolute;
    left: -1px;
    top: 3px;
    line-height: 13px;
    z-index: 10;
    color: #19d39c;
    transition: all ease-in-out 20s;
}

/*classes generiques*/
.grey_background {
    background-color: #ddd;
    transition: .6s;
}

.hide {
    display: none;
}

.bold {
    font-weight: 700;
}

.ombre {
    box-shadow: 0 0 20px #666;
}

.absolute {
    position: absolute;
}

.ajouter, .supprimer {
    position: relative;
    padding-right: 25px;
}

.ajouter:after, .supprimer:after {
    position: absolute;
    right: 0;
    font-family: fontello;
}

.ajouter:after {
    content: 'Q';
}

.supprimer:after {
    content: 'P';
}

.glyphicon-calendar.absolute {
    right: 30px;
    top: 10px;
}

.cursor {
    cursor: pointer;
}

.cursor_defaut {
    cursor: default;
}

.curve {
    position: absolute;
    padding: 25px;
    width: 580px;
    min-height: 310px;
    margin: -115px 26px 0 -290px;
    background: #fff;
    border-left: 15px solid #45ADE0;
}

.curve:before {
    top: 94%;
    left: 5px;
    transform: rotate(-5deg);
    /*box-shadow: 7px 6px 20px #333;*/
}

.curve:after {
    top: 94%;
    right: 5px;
    transform: rotate(5deg);
    /*box-shadow: -7px 6px 20px #333;*/
}

ul.scroll {
    position: relative;
    list-style-type: none;
}

.param_indicateurs {
    position: relative;
    padding-bottom: 50px;
}

.param_indicateurs h3 {
    font-family: impactregular;
    text-transform: uppercase;
}

.indicateur_choix {
    position: absolute;
    display: inline-block;
    top: 100px;
    left: -320px;
    width: 320px;
    background-color: #393939;
    z-index: 100;
}

.RAF {
    color: #fff;
}

.nav.navbar-nav.navbar-right {
    margin-right: 10px;
    margin-top: 10px;
}

.navbar-nav {
    height: 50px;
    float: none;
}

.navbar-nav li {
    float: none;
    display: inline-block;
}

.container-fluid .navbar-nav li {
    margin-top: 0;
}

.nav-principal {
    margin-top: 10px;
}

.medium_metrix .pictos-periodes {
    margin: 7.5px 5px;
}

.pictos-periodes {
    font-size: 0;
    padding: 0;
    border-left: dotted 2px #fff;
    border-right: dotted 2px #fff;
    height: 42px;
    vertical-align: middle;
}

.pictos-periodes li {
    vertical-align: middle;
    text-align: center;
    height: 20px;
    color: #fff;
    font-size: 14px;
    padding: 0 10px;
    font-family: 'Farsan', cursive;
    transition: .8s;
}

.pictos-periodes .periode-active {
    opacity: 1;
    color: #10E4B0;
}

.pictos-periodes .periode-active:hover {
    color: #10E4B0;
    transition: .8s;
}

.pictos-periodes .periode-active:before {
    transition: .7s;
}

.picto-min:before {
    content: url(/Content/img/pictos/10-min-reduction.png);
    display: block;
}

.pictos-periodes .periode-active:hover:before {
    transform: scale(.8);
    transition: .7s;
}

.picto-heure:before {
    content: url(/Content/img/pictos/1heure-reduction.png);
    display: block;
}

.picto-jour:before {
    content: url(/Content/img/pictos/1-jour-reduction.png);
    display: block;
}

.liste_indicateurs li:hover {
    transition: all ease-in .3s;
}

.tendance_dif {
    font-family: open_sansbold;
    font-size: 14px;
    margin: 0;
    text-align: right;
    padding-right: 4px;
    position: absolute;
    right: 0;
    bottom: 0;
}

.liste_indicateurs li > span {
    width: 50px;
    font-size: 14px;
    padding-left: 5px;
}

.liste_indicateurs li > span.acces_parametres {
    text-align: right;
    right: 5px;
}

.acces_parametres.gs-w:hover {
    z-index: 3;
}

.placeholder_indicateur {
    height: 242px;
    padding: 15px;
    background-color: rgba(255, 255, 255, 0.5);
}

.compteur {
    position: relative;
    height: 61px;
    color: #fff;
    font-size: 2.8em;
    font-family: open_sansbold;
    z-index: 1;
}

.survol_indicateur {
    position: absolute;
    list-style-type: none;
    background-color: rgba(255, 255, 255, .9);
    z-index: 100;
    border-radius: 5px;
    width: 197px;
}

.position-left {
    left: 100%;
}

.position-right {
    right: 100%;
}

.position-left:before {
    position: absolute;
    left: -8px;
    top: 15%;
    border-top: 8px solid transparent;
    border-right: 8px solid rgba(255, 255, 255, .9);
    border-bottom: 8px solid transparent;
    content: "";
}

.position-right:before {
    position: absolute;
    right: -8px;
    top: 15%;
    border-top: 8px solid transparent;
    border-left: 8px solid rgba(255, 255, 255, .9);
    border-bottom: 8px solid transparent;
    content: "";
}

.survol_indicateur .valeurs {
    width: auto;
    box-sizing: border-box;
    height: auto;
    line-height: 18px;
}

.valeurs .strong {
    font-size: 22px;
    color: #858484;
    margin-top: 5px;
}

.valeurs .valeurs_communes p:first-child {
    font-family: 'Anton';
    text-transform: uppercase;
    margin-top: 5px;
}

.min-max .inline {
    width: 48%;
}

.uppercase {
    text-transform: uppercase;
}

.valeurs .valeur_ref {
    font-size: 30px;
    color: #2186f7;
    margin-top: 5px;
}

.valeurs p {
    font-family: Impact;
    margin: 0;
    text-align: center;
    font-size: 18px;
}

.val_ref p:first-child {
    font-size: 20px;
}

.val_min p:first-child, .val_max p:first-child {
    font-size: 14px;
}

.pointage .interval {
    position: relative;
    margin-bottom: 15px;
    text-align: center;
    font-size: 25px;
}

.interval:before, .interval:after {
    position: absolute;
    bottom: 0;
    content: '';
    width: 33px;
    height: 1px;
    border-top: solid 2px #666;
}

.interval:before {
    left: 10px;
}

.interval:after {
    right: 10px;
}

.valeurs > div {
    margin: 10px 0;
}

.valeurs .valeur_pointage {
    line-height: 32px;
    font-size: 37px;
    font-weight: 700;
    color: #10e4b0;
}

p.lead {
    margin-top: 5px;
}

.inline {
    display: inline-block;
}

.hausse:after {
    content: "hausse";
}

.baisse:after {
    content: "baisse";
}

.neutre {
    content: "=";
}

.js-indicateur-zone {
    position: relative;
    overflow: hidden;
}

.js-indicateur-zone:hover {
    cursor: help;
}

.indic_periode_anim {
    position: absolute;
    top: 0;
    left: -300px;
    min-width: 50px;
    background-color: rgba(255, 255, 255, .8);
    font-family: 'Anton';
    font-size: 18px;
    height: 61px;
    transform-style: preserve-3d;
    animation: indic_periode_anim 4s;
    z-index: 1000;
}

.indic_periode_anim span {
    position: relative;
    max-width: 100px;
    margin-left: 20px;
    display: inline-block;
    color: #808080;
    top: 50%;
    transform: translateY(-50%);
}

.indic_periode_anim:after {
    position: absolute;
    left: 100%;
    top: 0;
    content: '';
    border-left: solid 15px rgba(255, 255, 255, .8);
    border-top: solid 31px transparent;
    border-bottom: solid 31px transparent;
}

@keyframes indic_periode_anim {
    0% {
        left: -300px;
    }

    10% {
        left: 0;
    }

    60% {
        left: 0;
    }

    100% {
        left: -300px;
    }
}

.titre {
    font-family: arial;
    font-size: 1.4em;
    color: #fff;
    margin: 0;
    margin-top: 15px;
}

.titre a {
    display: block;
    text-decoration: none;
    color: #fff;
    position: relative;
    max-height: 29px;
    top: 50%;
    transform: translateY(-50%);
}

.green {
    color: #10e4b0;
}

.orange {
    color: orange;
}

.form-indicateur-filter {
    margin-bottom: 1em;
}

.center {
    text-align: center;
}

.interval {
    font-size: .6em;
    color: #3e3939;
    text-align: right;
    display: inline-block;
    width: 100%;
}

.interval-param {
    width: 150px;
}

.taille2x {
    font-size: 2.6em;
    margin-top: 10px;
}

.neutre-alert h2 {
    color: #3e3939;
}

.neutre-alert, .good-alert, .medium-alert, .top-alert {
    position: relative;
}

.neutre-alert {
    background-color: rgba(243, 243, 243, .3);
    border-bottom: solid 1px #fff;
}

.neutre-alert:last-child {
    border-bottom: none;
}

.neutre-alert p, .good-alert p, .medium-alert p, .top-alert p {
    margin: 0;
    text-align: right;
}

.good-alert[data-ind-period="1"], .good-alert[attr-code-periode=m] {
    background-color: #10fac1;
}

.good-alert[data-ind-period="2"], .good-alert[data-sizex="2"][data-sizey="2"], .good-alert[attr-code-periode=h] {
    background-color: #10e4b0;
}

.good-alert[data-ind-period="3"], .good-alert[attr-code-periode=d] {
    background-color: #0cbe92;
}

.good-alert[data-sizex="2"][data-sizey="2"] .valeur_ref {
    color: #555;
}

.medium-alert[data-ind-period="2"], .medium-alert[data-sizex="2"][data-sizey="2"], .medium-alert[attr-code-periode=h] {
    background-color: #eda61e;
}

.top-alert[data-ind-period='2'], .top-alert[data-sizex="2"][data-sizey="2"], .top-alert[attr-code-periode=h] {
    background-color: #e11b1b;
}

.top-alert[data-ind-period="1"], .top-alert[attr-code-periode=m] {
    background-color: #fd2020;
}

.top-alert[data-ind-period="3"], .top-alert[attr-code-periode=d] {
    background-color: #c51818;
}

.medium-alert[data-sizex="2"][data-sizey="2"] h2, .good-alert[data-sizex="2"][data-sizey="2"] h2, .top-alert[data-sizex="2"][data-sizey="2"] h2 {
    color: #3e3939;
}

.medium-alert[data-ind-period="1"], .medium-alert[attr-code-periode=m] {
    background-color: #fdb222;
}

.medium-alert[data-ind-period="3"], .medium-alert[attr-code-periode=d] {
    background-color: #d7961b;
}

.liste_indicateurs li.alerte_active {
    z-index: 0;
    background-color: rgba(255, 255, 255, .7);
}

.acces_parametres .titre {
    height: 56px;
    text-align: center;
    background-image: url(/Content/img/fond-titre.png);
    background-position: -97px -100px;
    background-repeat: no-repeat;
    margin-top: 1px;
    font-size: 21px;
    font-weight: 700;
    line-height: 20px;
    border-bottom: solid 1px #fff;
    transform-style: preserve-3d;
}

/*================================================================*/
.js-msgAjaxError {
    bottom: 0;
    height: 50px;
    width: 100%;
    position: absolute;
    border: grey 2px ridge;
    background: black;
    color: lawngreen;
    z-index: 1000;
    margin: auto 0;
    font-size: 10px;
}

.indicateurs_btn {
    margin: 0;
    padding: 0;
    border-bottom: solid 1px #ddd;
}

.liste_indicateurs > li {
    position: relative;
    list-style-type: none;
    min-width: 230px;
    margin: 5px;
    padding: 0;
    box-shadow: 0 0 8px #eee;
}

.indicateurs_btn > li {
    position: relative;
    width: 48%;
    color: #777;
    transition: .6s;
}

.indicateurs_btn > li:hover {
    color: #000;
    transition: .4s;
}

.indicateurs_btn > li:hover:before {
    left: 10%;
    transition: .6s;
}

.indicateurs_btn > li:last-child:hover:before {
    right: 10%;
    transition: .6s;
}

.indicateurs_btn > li:first-child {
    text-align: left;
}

.indicateurs_btn > li:last-child {
    text-align: right;
}

.periodes {
    width: 100%;
}

.indicateur_box .periodes > ul > li > span.inline {
    font-family: Arial, Helvetica, sans-serif;
}

.filtres {
    top: 132px;
    width: 100%;
    height: 80px;
    line-height: 50px;
    background-color: rgba(255, 255, 255, .9);
    z-index: 100;
}

.filtres ul {
    display: block;
    height: 35px;
    margin: 0;
}

.filtre_key {
    text-align: center;
    padding: 0;
}

.filtre_mode {
    text-align: center;
}

.filtres li {
    display: inline-block;
    list-style-type: none;
    width: 150px;
    height: 30px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 30px;
    border: solid 1px #ddd;
    border-radius: 10px;
    cursor: pointer;
    transition: 1s
}

.filtres li:hover, .filtres li.actif {
    background-color: #45ADE0;
    transition: 1s;
    color: #fff;
}

.filtres .filtre_mode li:hover, .filtres .filtre_mode li.actif {
    background-color: #457DE0;
}

.liste_indicateurs li .periodes > ul > li {
    width: 100%;
    height: 40px;
    text-align: left;
    border-bottom: solid 1px #ccc;
    font-size: 21px;
    font-family: impactregular;
    line-height: 40px;
}

.liste_indicateurs li .periodes > ul > li[data-per-id='w'] {
    display: none;
}

.liste_indicateurs li.absolute {
    position: absolute;
}

.liste_indicateurs li.ajout {
    background-color: #fff;
}

.liste_indicateurs li .info_alertes ul {
    text-align: center;
    margin: 0;
    padding: 0;
    width: 100%
}

.liste_indicateurs li .info_alertes li {
    list-style-type: none;
    position: relative;
}

.lien_indicateur_alerte_periode > span {
    font-size: 1.25em;
    padding: 4px;
}

li div ul li {
    color: #3e3939;
}

.periodes .alertes {
    position: absolute;
    right: 10px;
}

.periodes .alertes .acces_parametres_indicateurs {
    position: absolute;
    right: 2px;
    top: 3px;
    font-size: 14px;
}

.periodes .alertes .alertes_temoins {
    max-width: 150px;
    text-align: right;
    height: 38px;
    overflow: hidden;
}

.periodes .alertes .alertes_temoins li {
    text-align: right;
    font-size: 14px;
    margin: 0;
}

.periodes .alertes .alertes_temoins li span {
    width: 10px;
    display: inline;
    margin: 0;
}

.periodes .alertes .alertes_temoins .info-bulle {
    opacity: 1;
    position: absolute;
    background-color: rgba(0, 0, 0, .4);
    border: solid 1px #ddd;
}

.liste_indicateurs li .info_alertes .configurer li .picto {
    transition: all ease-in-out .5s;
}

.liste_indicateurs li .info_alertes .configurer li:hover .picto {
    text-shadow: 0 0 8px #fff;
    transform: scale(1.2);
    z-index: 10;
}

.configurer {
    position: absolute;
    bottom: 0;
    right: 10px;
}

.configurer p {
    margin: 0;
}

.configurer li {
    width: 95%;
    list-style-type: none;
}

.info_compte_alertes {
    width: 100%;
    padding: 5px;
    margin-top: 5px;
    background-color: rgba(215, 195, 185, .1);
}

.info_compte_alertes p {
    font-family: interstateblackcondensed;
    margin: 0;
}

.info_compte_alertes p:first-child {
    font-size: 20px;
}

.info_compte_alertes p:last-child {
    color: #7f7e7e;
}

.alertes_temoins li p.fontello {
    font-family: fontello;
    color: #3e3939;
    font-size: 14px;
}

.alertes_temoins li p {
    display: block;
    font-size: 12px;
    line-height: 12px;
}

.alertes_temoins li p:last-child {
    color: #3b9cda;
    font-size: 11px;
    font-weight: 700;
}

.indicateurs_activation.green {
    /*color:#10e4b0;*/
    font-weight: 700;
}

.indicateurs_titre {
    position: relative;
    top: -15px;
    text-align: center;
    height: 80px;
    background-image: url(/Content/img/fond-param-indic.png);
    background-repeat: no-repeat;
    background-size: cover;
    transform-style: preserve-3d;
}

.indicateurs_titre h2 {
    max-height: 65px;
    overflow: hidden;
    color: #fff;
    border: none;
    background-color: transparent;
    font-size: 30px;
    font-family: impactregular;
    top: 50%;
    position: relative;
    transform: translateY(-50%);
}

/*.interval:after{
    position:absolute;
    right:5px;
    top:38px
}*/
.minute:after {
    content: url("/Content/img/pictos/time-m.png");
}

.heure:after {
    content: url("/Content/img/pictos/time-h.png");
}

.jour:after {
    content: url("/Content/img/pictos/time-d.png");
}

.semaine:after {
    content: url("/Content/img/pictos/time-w.png");
}

.alertes {
    width: 170px;
    text-align: right;
    vertical-align: top;
}

.alertes li {
    padding: 0 2px;
}

.affiche_alerte .picto.green, .acces_parametres.green {
    color: rgb(16, 228, 176);
}

.js-modifier_alerte {
    margin-left: 25px;
    font-size: 20px;
    color: #7f7f7f;
}

.picto {
    position: relative;
    font-size: 40px;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 0 5px #999;
    z-index: 1;
}

.picto:hover {
    text-shadow: 0 0 5px #333;
    transition: all ease-in-out .6s;
}

.picto:hover + p {
    opacity: 1;
    font-size: 10px;
    line-height: 60px;
    width: 60px;
    height: 60px;
    transition: all ease-in-out .6s;
    z-index: 100;
}

.picto + p {
    opacity: 0;
    font-size: 0;
    line-height: 20px;
    position: absolute;
    top: 20px;
    left: -10px;
    color: #fff;
    font-family: open_sansbold;
    width: 20px;
    height: 20px;
    transition: all ease-in-out .6s;
}

.glyphicon-flash {
    color: #aaa;
}

.glyphicon-flash.green {
    color: rgb(16, 228, 176);
}

.grid-stack > .grid-stack-item > .ui-resizable-e {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDUxMS42MjYgNTExLjYyNyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNTExLjYyNiA1MTEuNjI3OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPHBhdGggZD0iTTMyOC45MDYsNDAxLjk5NGgtMzYuNTUzVjEwOS42MzZoMzYuNTUzYzQuOTQ4LDAsOS4yMzYtMS44MDksMTIuODQ3LTUuNDI2YzMuNjEzLTMuNjE1LDUuNDIxLTcuODk4LDUuNDIxLTEyLjg0NSAgIGMwLTQuOTQ5LTEuODAxLTkuMjMxLTUuNDI4LTEyLjg1MWwtNzMuMDg3LTczLjA5QzI2NS4wNDQsMS44MDksMjYwLjc2LDAsMjU1LjgxMywwYy00Ljk0OCwwLTkuMjI5LDEuODA5LTEyLjg0Nyw1LjQyNCAgIGwtNzMuMDg4LDczLjA5Yy0zLjYxOCwzLjYxOS01LjQyNCw3LjkwMi01LjQyNCwxMi44NTFjMCw0Ljk0NiwxLjgwNyw5LjIyOSw1LjQyNCwxMi44NDVjMy42MTksMy42MTcsNy45MDEsNS40MjYsMTIuODUsNS40MjYgICBoMzYuNTQ1djI5Mi4zNThoLTM2LjU0MmMtNC45NTIsMC05LjIzNSwxLjgwOC0xMi44NSw1LjQyMWMtMy42MTcsMy42MjEtNS40MjQsNy45MDUtNS40MjQsMTIuODU0ICAgYzAsNC45NDUsMS44MDcsOS4yMjcsNS40MjQsMTIuODQ3bDczLjA4OSw3My4wODhjMy42MTcsMy42MTcsNy44OTgsNS40MjQsMTIuODQ3LDUuNDI0YzQuOTUsMCw5LjIzNC0xLjgwNywxMi44NDktNS40MjQgICBsNzMuMDg3LTczLjA4OGMzLjYxMy0zLjYyLDUuNDIxLTcuOTAxLDUuNDIxLTEyLjg0N2MwLTQuOTQ4LTEuODA4LTkuMjMyLTUuNDIxLTEyLjg1NCAgIEMzMzguMTQyLDQwMy44MDIsMzMzLjg1Nyw0MDEuOTk0LDMyOC45MDYsNDAxLjk5NHoiIGZpbGw9IiM2NjY2NjYiLz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K);
    transform: rotate(90deg);
    background-repeat: no-repeat;
    opacity: 0.3;
    width: 20px;
    height: 20px;
    right: 10px;
    top: 0;
    filter: brightness(0) invert(1);
}

.grid-stack > .grid-stack-item > .ui-resizable-e:hover {
    opacity: 1;
}

.loading_indicateur {
    height: 500px;
    display: block;
    width: 100%;
    text-align: center;
    padding: 100px;
}

.loading_indicateur img {
    margin: auto;
}

.modifier_serie .fontello {
    display: inline-block;
    transform: rotate(0deg);
    transition: .4s;
}

.modifier_serie:hover .fontello {
    transform: rotate(-360deg);
    transition: .6s;
}

.afficher_control_serie .fontello {
    display: inline-block;
    transform: scale(1);
    transition: .4s;
}

.afficher_control_serie:hover .fontello {
    transform: scale(1.3);
    transition: .6s;
}

.row.liste_indicateurs {
    position: relative;
    margin: 0;
    margin-top: 80px;
}

.indicateur_box.clone_actif.alerte_active {
    left: 10px;
    top: 250px;
    background-color: rgb(255, 255, 255);
    z-index: 10;
}

.row.liste_indicateurs .clone_actif {
    position: fixed;
    box-shadow: none;
}

.liste_indicateurs li button {
    display: block;
    position: relative;
    margin: auto;
    margin-bottom: 20px;
}

.popup_generic {
    position: fixed;
    top: 15%;
    z-index: 10;
    background-color: #fff;
}

.background_popup_generic {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .7);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
}

.popup_generic .popup_generic_fermer {
    position: absolute;
    top: 0px;
    right: 10px;
    font-size: 25px;
    color: #fdfdfd;
    transition: ease-in-out .2s;
}

.popup_generic .popup_generic_fermer:hover {
    color: #EDA61E;
    transition: ease-out .4s;
}

.creation_alerte span {
    font-size: 13px;
    vertical-align: middle;
}

.creation_alerte span:first-child {
    display: inline-block;
}

.creation_alerte + p {
    border-bottom: 1px dotted #ccc;
}

.disable > * {
    color: #aaa;
    font-style: italic;
}

.disable [data-color] {
    color: #aaa
}

.curve .masquer_popup {
    position: absolute;
    right: 5px;
    top: 5px;
    color: #383838;
    width: 21px;
    height: 24px;
    font-size: 17px;
    text-align: center;
}

.curve:after, .curve:before {
    content: " ";
    position: absolute;
    width: 50%;
    height: 5px;
    z-index: -10;
}

.curve ul {
    max-height: 270px;
    margin: 0;
    padding: 0 0 40px 0;
}

.curve ul li {
    list-style-type: none;
    position: relative;
}

/*.liste li:last-child{
        margin-bottom:30px;
    }*/
.entete_events > li, .liste_event .liste li {
    text-align: center;
}

.listes li.col-1 {
    width: 4%;
}

.listes li.col-2 {
    width: 15%;
}

.listes li.col-3, .listes li.col-4 {
    width: 8%;
}

.listes li.col-5 {
    width: 13%;
}

.listes li.col-6, .listes li.col-7 {
    width: 8%;
}

.listes li.col-8 {
    width: 10%;
}

.listes li.col-9 {
    width: 12%;
}

.listes li.col-11, .listes li.col-10 {
    width: 7%;
}

.curve li .checkbox {
    width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.form_creation_evenement {
    min-width: 600px;
    text-align: center;
}

.form_creation_evenement .form-group {
    text-align: left;
}

.form_creation_evenement .form-group .inline {
    width: 49%;
    text-align: left;
}

.form_creation_evenement .form-group label, .form_creation_evenement .form-group .text-danger {
    margin-left: 10px;
}

.form_creation_evenement .form-group .inline input {
    margin: auto;
    border: solid 1px #ddd;
    height: 34px;
    border-radius: 5px;
}

.form_creation_evenement .form-group select {
    margin: auto;
    border: solid 1px #ddd;
    border-radius: 5px;
    height: 34px
}

.form_creation_evenement .form-group button {
    display: block;
    min-width: 120px;
    margin: auto;
}

.form-datetime {
    position: relative;
}

.form-control.form_datetime {
    background-color: transparent;
}

.form-control.form_datetime + .absolute {
    z-index: -1;
    right: 15px;
}

.form_comment textarea {
    max-width: initial;
    width: 95%;
    margin: 0 10px;
    border: solid 1px #ddd;
    border-radius: 5px;
}

.liste_alertes > .entete_alertes {
    margin-left: 70px;
    height: 25px;
}

.liste_alertes > .entete_alertes li {
    color: #48B2E2;
}

.curve .entete_alertes li {
    display: inline-block;
    vertical-align: middle;
    font-size: 13px;
}

.curve .control_alertes .entete_alertes li:hover .cursor {
    text-decoration: underline;
    transition: .4s;
}

.curve .entete_alertes li:first-child {
    width: 70px
}

.curve .entete_alertes li:first-child .checkbox {
    text-overflow: initial;
    overflow: initial;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 100;
    line-height: 20px;
}

.curve .entete_alertes li:nth-child(5) {
    margin-left: 50px;
}

.indice_periode {
    width: 150px;
}

.curve:before, .popup:after {
    background: transparent;
}

.popup {
    position: fixed;
    z-index: 10;
}

.popup_modifier_compte {
    min-width: 480px;
    text-align: center;
}

.popup_modifier_compte .form-control {
    margin: auto;
}

.popup_footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font-family: impactregular;
    line-height: 100px;
    width: 100%;
    height: 30px;
    font-size: 20px;
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .8) 26%, rgba(255, 255, 255, 1) 36%, rgba(255, 255, 255, 1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .8) 26%, rgba(255, 255, 255, 1) 36%, rgba(255, 255, 255, 1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .8) 26%, rgba(255, 255, 255, 1) 36%, rgba(255, 255, 255, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0); /* IE6-9 */
}

.popup_footer .inline:first-child {
    padding-left: 20px;
}

.popup_footer span em {
    font-style: normal;
}

.form_crea_alerte input[type=text] {
    width: 100px;
}

.form_crea_alerte input[type=radio] {
    display: none;
}

.popup .form_crea_alerte button {
    display: block;
    font-family: impactregular;
    position: relative;
    margin: auto;
    width: 110px;
    font-size: 20px;
    height: 40px;
    border: solid 1px #fefefe;
    color: #4f4f4f;
    background-color: transparent;
    transition: all ease-in-out 1s;
    border-radius: 15px;
}

.popup .form_crea_alerte button:hover {
    color: #10E4B0
}

.form_periode > span.fontello {
    font-size: 30px;
}

.radio_label {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 5px;
}

[for=color_1] {
    background-color: rgb(16, 228, 176);
}

[for=color_2] {
    background-color: orange;
}

[for=color_3] {
    background-color: red;
}

.radio_label:before {
    display: block;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

.radio_label:after {
    content: "";
}

input[type="radio"]:checked + .radio_label {
    width: 20px;
    height: 20px;
    box-shadow: 0 0 8px #ddd;
    transition: all ease-in-out .7s;
    border: 1px solid #fff;
    border-radius: 5px 15px 2px 0;
}

.palier {
    position: relative;
    width: 150px;
}

.palier:after {
    position: absolute;
    right: 10px;
    content: ' :';
}

.palier.inline {
    vertical-align: middle;
}

.palier.inline + .inline {
    vertical-align: middle;
}

.form_exclusion .palier {
    width: 30px;
}

.type_palier_valeur {
    width: 50px;
    margin: 0;
}

.type_palier_valeur label {
    margin: 0;
}

.type_alertes label {
    color: #5e5e5e;
}

.popup_footer span:last-child {
    width: 430px;
    text-align: right;
}

.type_alertes label .fontello {
    color: #000;
}

.optionnel {
    font-size: 11px;
}

.module_modif {
    opacity: 0;
    width: 350px;
    display: block;
    background-color: rgba(215, 215, 215, .7);
    position: absolute;
    right: -646px;
    padding: 5px;
    top: -115px;
    transform-origin: 0% 0%;
    transform: rotate(90deg);
    z-index: -1;
}

.tendance_hausse:before,
.tendance_baisse:before,
.tendance_neutre:before {
    top: 27px;
    left: 3px;
    position: absolute;
    z-index: 0;
}

.tendance_hausse:before {
    content: url(img/pictos/tendance-hausse.png);
}

.tendance_baisse:before {
    content: url(img/pictos/tendance-baisse.png);
}

.tendance_neutre:before {
    content: url(img/pictos/tendance-neutre.png);
    top: -13px;
    left: -40px;
    opacity: .5;
}

.masque_module {
    position: absolute;
    top: 5px;
    right: 5px;
    transform: rotate(90deg);
}

.tooltips_presentation.TDB {
    position: absolute;
    width: 200px;
    height: 150px;
    margin: 20px 0;
    background: #0795be;
    border-radius: 50% / 10%;
    color: white;
    text-align: center;
    text-indent: .1em;
}

.tooltips_presentation.TDB:before {
    content: '';
    position: absolute;
    top: 10%;
    bottom: 10%;
    right: -5%;
    left: -5%;
    background: inherit;
    border-radius: 5% / 50%;
}

.row > li[class*="col-"] {
    float: none;
    display: inline-block;
    vertical-align: top;
    background-color: rgba(225, 225, 225, .4);
}

.etat_alerte {
    width: 60px;
}

.etat_alerte[data-color] {
    font-size: 20px;
    display: inline-block;
}

[data-color='medium-alert'] {
    color: #eba643;
}

[data-color='good-alert'] {
    color: #19d39c;
}

[data-color='top-alert'] {
    color: #dd0016;
}

[data-color='inactive-alert'] {
    color: #aaa;
}

.alertes_temoins [data-color]:before {
    content: "";
}

.alertes_temoins .fontello {
    display: inline-block;
    margin: 0 5px;
}

.modifier_alerte {
    position: absolute;
    right: 10px;
    top: -3px;
}

.message_succes {
    display: block;
    padding-left: 10px;
}

.message_succes.has-error {
    color: #b80002;
}

.error {
    color: #a94442;
}

/*Details*/
.indicateurs_visible .titre a {
    color: #333;
    display: initial;
}

.indicateurs_visible .titre a:after {
    position: absolute;
    left: 108%;
    margin-top: 4px;
    font-family: cursive;
    content: ">";
    font-size: 18px;
    transition: 0.4s;
}

.indicateurs_visible .titre:hover a:after {
    left: 113%;
    transition: 0.4s;
}

.contenu_details {
    overflow: hidden;
}

.large_metrix.indicateurs_details {
    background: radial-gradient(ellipse at bottom left, rgba(91, 141, 199, 1) 1%, rgba(4, 55, 112, 1) 60%, rgba(4, 55, 112, 1) 102%)
}

.large_metrix.indicateurs_details .body-content:before {
    width: 30%;
}

.indicateurs_details .body-content {
    margin-top: 10px;
}

.large_metrix.indicateurs_details h2 {
    color: #fff;
    font-family: impactregular;
}

.bloc_container_valeur_periode {
    width: 300px;
    height: 200px;
    display: inline-block;
}

.bloc_valeur_periode {
    width: 100%;
    display: inline-block;
    text-align: center;
    padding: 2px;
}

.bloc_package [class $= alert] .txt_valeur {
    color: #fff;
}

.bloc_valeur_periode .txt_valeur {
    font-size: 28px;
    display: block;
}

.bloc_valeur_periode .txt_periode {
    display: block;
    font-size: 16px;
}

.bloc_left, .bloc_right {
    display: inline-block;
    vertical-align: top;
}

.bloc_left {
    width: 250px;
}

.bloc_petit {
    display: inline-block;
    border-bottom: dotted 1px #ccc;
    width: 100%;
}

.bloc_petit .col-left p, .bloc_petit .col-left a {
    display: block;
    text-align: center;
}

.bloc_petit .col-left span:first-child {
    display: inline-block;
    width: 150px;
}

.nb_alertes {
    font-size: 25px;
}

.bloc_petit .col-left span:first-child:after {
    content: ':'
}

.bloc_moyen {
    width: 100%;
    text-align: center;
    display: inline-block;
    background-color: #f5f5f5;
}

.bloc_grand {
    width: 90%;
}

.bloc_package {
    position: relative;
    border: 1px solid #eeeeee;
    border-radius: 5px;
    margin: 20px auto;
    padding: 5px;
    background-color: #fff;
}

.tooltip_bar {
    display: inline-block;
    margin-bottom: 10px;
    padding: 2px;
}

.tooltip_bar button,
.tooltip_bar input {
    width: 150px;
    height: 25px;
    margin-left: 2px;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    background-color: transparent;
    border: solid 1px #ddd;
    padding-left: 5px;
    line-height: 35px;
    height: 35px;
    border-radius: 8px;
    cursor: pointer;
}

.tooltip_bar select {
    width: 150px;
    height: 25px;
    margin-left: 2px;
    border: none;
    background-color: transparent;
    border: solid 1px #ddd;
    padding-left: 5px;
    line-height: 35px;
    height: 35px;
    border-radius: 8px;
    cursor: pointer;
}

.tooltip_bar .datetimepicker[disabled='disabled'] {
    opacity: .4;
    cursor: auto;
}

.tooltip_bar .description_interval {
    width: 125px;
    border-bottom: solid 2px #00387f;
    margin-left: 1em;
    margin-bottom: 10px;
    display: inline-block;
    text-align: center;
}

#tooltip_compare_bar .description_interval {
    border-bottom: solid 2px #F1B149;
}

#tooltip_control_bar .description_interval::after {
    font-family: fontello;
    content: ' %';
}

#tooltip_compare_bar .description_interval::after {
    font-family: fontello;
    content: ' :';
}

#tooltip_compare_bar {
    position: absolute;
    opacity: 0;
    right: -100%;
    transition: .4s;
}

.bloc_left .indicateurs_visible {
    background-color: rgba(70, 70, 117, .4);
    height: 56px;
    text-align: center;
    background-image: url(/Content/img/fond-titre.png);
    background-position: -97px -100px;
    background-repeat: no-repeat;
    margin-top: 1px;
    font-size: 26px;
    transform-style: preserve-3d;
}

.bloc_left .indicateurs_visible .titre {
    position: relative;
    transform: translateY(-50%);
    top: 50%;
    font-size: 25px;
    margin-top: 0;
    color: #333;
}

.curve .titre._1:after {
    content: ' pour 10 minutes';
    margin-left: 2px;
}

.curve .titre._2:after {
    content: ' pour 1 heure';
    margin-left: 2px;
}

.curve .titre._3:after {
    content: ' pour 1 journée';
    margin-left: 2px;
}

/*--------------Liste utilisateurs et roles----------------*/
.module_search {
    width: 100%;
    text-align: center;
    border: none;
    background-color: rgba(255, 255, 255, .9);
    z-index: 1;
}

.element-event .fontello {
    padding-left: 3px;
}

.module_search .element-event {
    display: inline-block;
    border: solid 1px #ddd;
    border-radius: 10px;
    min-width: 90px;
}

.module_search .btn {
    border-left: solid 1px #ddd;
    transition: .4s;
}

.module_search .btn:hover {
    background-color: #45ADE0;
    color: #fff;
    transition: .4s;
}

.module_search .btn:focus, .module_search .btn:active, .module_search .btn:visited {
    outline: none;
    box-shadow: none;
    color: #19d39c;
}

.popup .listes {
    margin-top: 0;
    max-width: 900px;
}

.listes {
    position: relative;
    margin: auto;
    margin-top: 65px;
    max-width: 90%;
    z-index: 0;
}

.listes ul {
    font-size: 0;
    margin: 0;
    padding: 0;
}

.listes ul li {
    font-size: 13px;
    padding: 5px;
}

.listes .liste {
    border-top: solid 1px #10e4b0;
    padding: 5px 0;
    list-style-type: none;
}

#alert_list {
    max-height: 180px;
}

.listes .liste:nth-child(odd) {
    background-color: rgba(200, 200, 230, .1)
}

.listes .liste:hover {
    background-color: #10E4B0;
    color: #fff;
}

.listes.utilisateurs .utilisateur li:first-child, .listes .entete_utilisateurs li:first-child {
    width: 50%;
}

.listes.utilisateurs .utilisateur li:nth-child(2), .listes .entete_utilisateurs li:nth-child(2) {
    width: 20%;
}

.liste_entete {
    background-image: url(/Content/img/fond-param-indic.png)
}

.listes .liste_entete li {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 12px;
    color: #fff;
    padding: 5px;
    word-wrap: break-word;
}

.listes .utilisateur li:nth-child(n + 3), .entete_utilisateurs li:nth-child(n + 3) {
    width: 15%;
    text-align: center;
}

.listes ul li ul li {
    width: auto;
}

.listes.roles .col-1 {
    width: 50%
}

.listes.roles .col-2 {
    width: 49%;
    text-align: right;
}

.listes.roles .col-1[data-name='Admin'] + .col-2 span {
    display: none;
}

.nom_role {
    margin: auto;
}

[class*="popup_generic_supprime_"] .popup_generic_content {
    text-align: center;
    padding: 15px;
}

@media screen and (max-width: 768px) and (min-width: 560px) {
    #tooltip_compare_bar {
        position: relative;
    }

    .bloc_right {
        width: 59%;
    }

    .curve {
        margin-top: -35px;
        margin-left: -535px;
    }

    .curve h2 {
        margin: 0;
        color: darkgray;
        width: 250px;
    }

    .creation_alerte {
        text-align: right;
        font-family: impactregular;
        text-transform: uppercase;
        width: 95px;
    }

    .param_indicateurs h3.mise-en-avant {
        left: 40%;
    }

    .liste_indicateurs {
        padding: 0;
    }

    .filtres li[data-key] {
        width: 80px;
        font-size: 11px;
    }
}

@media screen and (max-width: 980px) and (min-width: 769px) {
    #tooltip_compare_bar {
        position: relative;
    }

    .bloc_right {
        width: 65%;
    }

    .curve h2 {
        margin: 0;
        color: darkgray;
        width: 360px;
    }

    .creation_alerte {
        text-align: right;
        font-family: impactregular;
        text-transform: uppercase;
        width: 95px;
    }

    .liste_indicateurs {
        padding: 0;
    }

    .navbar-right li:first-child a, .navbar-inverse .navbar-nav > li > a {
        font-size: 12px;
        padding: 10px 5px;
    }

    .pictos-periodes {
        display: none;
    }
}

@media screen and (min-width: 1200px) {
    .module_search {
    }

    .bloc_right {
        width: 79%;
    }

    .liste_indicateurs {
        padding: 0 0 0 5%;
    }

    .param_indicateurs h3.mise-en-avant {
        position: absolute;
        left: 25%;
        top: 22%;
        transform: scale(2.5);
        text-shadow: 1px 1px 20px #fff;
        transition: all ease-in-out 1s;
        z-index: 100;
    }

    .curve {
        padding: 10px 20px;
    }

    .curve h2 {
        margin: 0;
        color: darkgray;
        width: 480px;
    }

    .creation_alerte {
        text-align: right;
        width: 95px;
    }

    .large_metrix hr {
        margin: 0;
    }
}

@media screen and (min-width: 981px) and (max-width: 1199px) {
    .bloc_right {
        width: 77%;
    }

    #tooltip_compare_bar {
        position: relative;
    }

    .pictos-periodes {
        display: none;
    }
}

@media screen and (min-width: 981px) and (max-width: 1585px) {
    .module_search {
        position: relative;
        margin: auto;
        margin-bottom: 20px;
    }

    #tooltip_compare_bar {
        position: relative;
    }
}

/*======================
 Gestion Utilisateurs et roles
 ======================*/
.gestion_utilisateurs {
    position: relative;
    width: 680px;
    margin: auto;
}

.gestion_utilisateurs h3 {
    text-align: center;
}

.gestion_utilisateurs .bloc_moyen {
    margin: 10px 0 20px 0;
}

.navbar-default .nav_admin .navbar-nav > .active > .cursor,
.navbar-default .nav_admin .navbar-nav > .active > .cursor:hover,
.navbar-default .nav_admin .navbar-nav > .active > .cursor:focus {
    color: #303030;
    border-bottom: solid 6px #EDA61E;
    padding-bottom: 9px;
}

.navbar-default .nav_admin .navbar-nav > li {
    overflow: hidden;
}

.navbar-default .nav_admin .navbar-nav > li .cursor {
    position: relative;
    color: #777;
    padding: 15px;
    line-height: 20px;
    display: block;
}

.navbar-default .nav_admin .navbar-nav > li > .cursor:after,
.navbar-default .nav_admin .navbar-nav > li.active:hover > .cursor:after {
    position: absolute;
    content: '';
    top: 80%;
    left: 50%;
    width: 0px;
    height: 0px;
    border-radius: 50%;
    background-color: #ddd;
}

.navbar-default .nav_admin .navbar-nav > li:hover > .cursor:after {
    top: 78%;
    width: 8px;
    margin-left: -4px;
    height: 8px;
}

/*popup formulaire de creation utilisateur*/
.form_creation_utilisateur {
    text-align: center;
}

.form_creation_utilisateur .form-group {
    min-width: 350px;
}

.form_creation_utilisateur .form-control {
    margin: auto;
}

.popup_generic_header {
    text-align: center;
    background-image: url(/Content/img/drivemetrix-fond.png);
    background-position: center;
    background-size: cover;
}

.popup_generic_header h4 {
    font-family: impactregular;
    font-size: 35px;
    color: #3f3f3f;
    text-transform: uppercase;
}

.popup_generic button {
    -webkit-appearance: none;
    background: none;
    border: solid 1px #ddd;
    border-radius: 5px;
    line-height: 35px;
    background-color: #45ADE0;
    color: #fff;
    font-weight: 700;
}

.text-danger ul {
    margin: 0;
    padding: 0;
}

.text-danger li {
    list-style-type: none;
}

.logo_drive {
    height: 45px;
}

.logo_drive img {
    position: absolute;
    left: 50%;
    margin-left: -28px;
    margin-top: 7px;
    filter: hue-rotate(35deg);
}

.popup_generic_supprime_utilisateur {
    min-width: 350px;
    text-align: center;
}

.popup_generic_supprime_utilisateur p:first-child {
    padding: 10px;
}