/*****************************************************/
/******************    Main CSS     ******************/
/*****************************************************/

/******************     General     ******************/

* {
    box-sizing: border-box;
}

html {
    font-size: 62.5%;
}

#page-wrapper {
    padding-top:45px;
}

.bodymydc{
    font-size: 1.4rem;
    margin:0 auto;
}

.hidden {
    display: none !important;
}

.select2 {
    width: 100% !important;
}

/******************     Bootstrap     ******************/

a {
    text-decoration: none !important;
    color: #337AB7;
}

.bg-primary {
    background-color: #337AB7 !important;
}

.btn-primary {
    background-color: #337AB7 !important;
    border: #337AB7 !important;
}

.bg-dark {
    background-color: #222 !important;
}

.border-primary {
    border-color: #337AB7 !important;
}

.form-group {
    margin: 0;
}

.multiselect-container>li>a>label {
    padding: 3px 10px 3px 24px !important;
}

.multiselect {
    color: white;
}

b {
    font-weight: 700 !important;
}

.card {
    border-radius: 0.5rem;
}

.card-header {
    border-radius: 0.5rem 0.5rem 0 0;
    padding: 5px;
}

.page-item.active .page-link {
    background-color: #337AB7 !important;
    border-color: #337AB7 !important;
}

.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.btn-disabled{
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAUElEQVQYV2NkYGAwBuKzQAwCIPYzIH4O4zMiSYCYMIWSQLYUiI9LAdwkkAJ0K1BMAikAGQe3E2ol3E0wK+B2orsJ2Q0oroeZhO4GmFfhVgAARKoTu2JXfwIAAAAASUVORK5CYII=) 0 0 repeat;
}

.form-control{
    border-radius: 0.5rem;
    padding: 0 !important;
    font-size: 1.4rem;
}

.input-group-text {
    border-radius: 0.5rem;
}

p {
    margin: 0 !important;
}

/******************    ToolTips     ******************/

.ttNav .tooltip-inner {
    background-color: #337AB7 !important;
    font-size: 1.4rem;
}

.tooltip > .arrow:before, .tooltip > .arrow:after {
    border-bottom-color: #337AB7 !important;
}

.ttTree .tooltip-inner {
    background-color: #337ab7 !important;
    padding: 5px;
}

.ttRack .tooltip-inner {
    background-color: #337ab7 !important;
    border-radius: 25px;
}

.ttServ {
    background-color: white;
    color: black !important;
    font-size: 1.4rem;
    border-radius: 25px;
    padding: 5px;
}

.ttServ > div{
    text-align: center;
    margin-top: 5px;
}

.ttServ > span {
    border-radius: 25px;
    padding: 5px;
    border: 2px solid #337ab7;
}

/******************     NavBar      ******************/

/*Numéro de version et flags*/
.version{
    color: white;
    font-size: 1rem;
    margin: 5px;
}

.logo {
    width: 5vw;
}

.navbar {
    max-height:40px;
}

.navbar ul {
    margin-left: 10px;
}

.navbar ul li+li {
    margin-left: 5px;
}

.dropdown-menu{
    font-size: 1.2rem;
}

.nav-pills>li>a {
    border-radius: 6px;
    margin: 4px;
}
.nav-pills>li+li{
    margin: 0px;
}

.nav>li {
    display: inline-block;
}

.nav>li>a{
    padding: 10px;
    margin: 0 2px;
}

.nav-tabs {
    margin-left: 0 !important;
    padding-left: 5px !important;
}

.nav-item .active {
    font-weight: bold;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: #337AB7 !important;
}

.dropdown-menu {
    min-width: 15rem;
}

.marquee-rtl {
    max-width: 30em;
    overflow: hidden;
}

.marquee-rtl > :first-child {
    display: inline-block;
    padding-right: 2em;
    padding-left: 100%;
    white-space: nowrap;
    animation: defilement-rtl 5s infinite linear;
}

@keyframes defilement-rtl {
    0% {
        transform: translate3d(0,0,0);
    }
    100% {
        transform: translate3d(-100%,0,0);
    }
}

/******************       Home      ******************/

.overviewScroll .card {
    margin-top: 5px;
}

.bg-vm {
    background-color: #FF7A00;
}

.border-vm {
    border-color: #FF7A00;
}

.bg-appli {
    background-color: #0d8500;
}

.border-appli {
    border-color: #0d8500;
}

.bg-set {
    background-color: #fff400;
}

.border-set {
    border-color: #fff400;
}

svg{
    max-width: 200px;
    max-height: 200px;
}

/*Style défault cercle*/
circle {
    fill: transparent;
    stroke-width: 13px;
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1s linear;
    stroke: #F5F5F5;
    stroke-linecap: round;
}

text {
    font-size: 10px;
}

text:hover{
    cursor: pointer;
}

.circle-Progress-Bar-V1{
    stroke: #849FFF;
}

.circle-Progress-Bar-V2{
    stroke: #7ACDE8;
}

.circle-Progress-Bar-V3{
    stroke: #83FFD8;
}

.circle-Progress-Bar-V4{
    stroke: #C7FF7A;
}

.circle-Progress-Bar-V5{
    stroke: #78E884;
}

.circle-Progress-Bar-V1-2{
    stroke: #FF3A2C;
}

.circle-Progress-Bar-V2-2{
    stroke: #FFA219;
}

.circle-Progress-Bar-V3-2{
    stroke: #EEDE00;
}

.circle-Progress-Bar-V4-2{
    stroke: #87D671;
}

.circle-Progress-Bar-V5-2{
    stroke: #068D26;
}

.circle-Progress-Bar-V1-3{
    stroke: #B64201;
}

.circle-Progress-Bar-V2-3{
    stroke: #DB8200;
}

.circle-Progress-Bar-V3-3{
    stroke: #F3B800;
}

.circle-Progress-Bar-V4-3{
    stroke: #9E8E01;
}

.circle-Progress-Bar-V5-3{
    stroke: #508104;
}

.circle-Progress-Bar-V1-4{
    stroke: #01326C;
}

.circle-Progress-Bar-V2-4{
    stroke: #0066CB;
}

.circle-Progress-Bar-V3-4{
    stroke: #47A1F7;
}

.circle-Progress-Bar-V4-4{
    stroke: #8CD3FF;
}

.circle-Progress-Bar-V5-4{
    stroke: #248C35;
}

/*Valeur Vérif*/
.verifval {
    visibility: hidden;
    font-size: 14px;
    font-weight: bold;
}

/*Couleur texte des valeur des vérifs*/
.verifvaltext {
    fill: white;
}

/*Couleur du background des valeurs des vérifs*/
.verifvalrect {
    fill: rgba(46, 111, 167, 0.8);
}

/*Visibilitée des badges pour les valeurs des vérifs et des icones de la nav des salles*/
.hoverVisibility:hover .verifval{
    visibility: visible;
}

.containerOverView {
    padding-right: 0px !important;
}

.scrolly {
    overflow-y: scroll;
}

.pillsHomepage>a {
    color: white;
}

/*Couleur du texte en non active au hover*/
.pillsHomepage:not(.active)>.pillsActive:hover{
    color: #4B92CF;
}

/*Changement nav pills active*/
.active>.pillsActive {
    background-color: #4B92CF !important;
    color: white;
}

/*Tableau des sallles*/
.tableHomepage {
    padding-left: 10px;
    padding-right: 10px;
}

/*Synthèse des salles*/
.syntheseHomePage{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

/*Connexions des salles*/
.connexionHomepage + .connexionHomepage {
    margin-top: 3px;
}

.buttonToggle {

    padding: 5px;
    border-radius: 15px;
    margin-bottom: 2px;

}

.buttonToggleOn {

    background-color: white;
    border: 2px solid #337AB7;

}

.buttonToggleOff {

    background-color: #337AB7;
    border: 2px solid white;

}

/*Couleur du lien pour se rendre à la salle*/
#goToDcSource, #goToDcDestination {
    background-color: #57A3E5;
    margin-bottom: 5px;
}

.foottotal{
    background-color: #d9edf7;
    font-weight: bold;
}

label {
    margin-bottom: 2px;
}
/* ==================================================
 * Table
 * ================================================== */

.table{
    padding: 6px 4px
}

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 2px;
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc:after{
    bottom: 0 !important;
}

th span.select2 {
    width: 100% !important;
}

.pagination {
    margin: 6px 0;
}

.thRight{
    text-align: right !important;
}

.fontInput {
    font-size:10px;
}

.table-hover>tbody>tr:hover{
    background-color: #d2d2d2!important;
}

tfoot {
    background-color: #d9edf7;
}

.cnxTableOption {

    display: flex;
    flex-direction: row;
    justify-content: space-around;
    background-color: white;
    border: 1px solid black;
    border-radius: 15px;
    position: absolute;
    top: 0;
    right: 0;
    width: 70px;
    z-index: 15;

}

#loading {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.8);
    position: absolute;
    height: 50px;
    width: 250px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100;
}

/*Popup cnx*/

.dataTables_scrollBody {
    position: unset !important;
}

.cnxCard {
    width: 180px;
}

.cnxCard .card-body {
    padding: 5px;
}

.cnxDiagram {
    display: flex;
    flex-direction: row;
    background-color: lightgrey;
    padding: 15px;
    border-radius: 15px;
    position: absolute;
    right: -15vw;
    top: -5vh;
}

.cnxPPDiagram {
    display: flex;
    flex-direction: column;
    background-color: lightgrey;
    padding: 15px;
    border-radius: 15px;
    position: absolute;
    z-index: 1000;
    font-size: 0.9rem;
    color: black !important;
}

.cnxHover {
    border: 3px solid yellowgreen;
}

.cnxDiagramVBlock {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.cnxDiagramDestBlock {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.cnxDiagramSourceBlock {
    display: flex;
    flex-direction: row;
}

.cnxPP {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 60px;
    text-align: center;
}

.cnxPP div:first-of-type {
    border-bottom: 1px solid forestgreen;
    width: 60px;
}

.cnxPP div:last-of-type {
    border-top: 1px solid forestgreen;
    width: 60px;
}

.cnxV {
    display: flex;
    align-items: center;
    height: 30px;
}

.cnxV div:first-of-type {
    border-right: 1px solid deepskyblue;
    height: 30px;
    width: 90px;
    text-align: center;
    position: relative;
}

.cnxV div:last-of-type {
    border-left: 1px solid deepskyblue;
    height: 30px;
    width: 90px;
    text-align: center;
}

.cnxV div:first-of-type p:first-of-type {
    position: absolute;
    top: 5px;
    width: 180px;
    z-index: 40;
}

.cnxV div:first-of-type p:last-of-type {
    position: absolute;
    top: 15px;
    width: 180px;
    z-index: 40;
}

.cnxH {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 50px;
    text-align: center;
}

.cnxH div:first-of-type {

    border-bottom: 1px solid deepskyblue;
    height: 15px;
    width: 50px;

}

.cnxH div:last-of-type {

    border-top: 1px solid deepskyblue;
    height: 15px;
    width: 50px;

}

div .dataTables_wrapper{
    width: 100%;
    margin: 0 auto;
}

/* ==================================================
 * Progress
 * ================================================== */
.progress {
    position: relative;
	height: 10px;
	margin: 2px;
    border-radius: 0.5rem;
}

.progress > .progress-type {
	position: absolute;
	left: 0px;
    font-size:7px;
	padding: 0px 5px 0px 5px;
	color: #FFF;
	background-color: rgba(0, 0, 0, 0.2);
}

.progress > .progress-completed {
	position: absolute;
	right: 0px;
    color: #000;
	padding: 0px 10px 1px;
}

.progress-type { top: 1px }
.progress-completed { font-size: 8px }
.progress-bar-v1 { background-color:#849FFF }
.progress-bar-v2 { background-color:#7ACDE8 }
.progress-bar-v3 { background-color:#83FFD8 }
.progress-bar-v4 { background-color:#C7FF7A }
.progress-bar-v5 { background-color:#78E884 }
.progress-bar-ready {
    background-color:#228b22;
    border-radius: 15px;
}
.progress-bar-tested {
    background-color:#228b22;
    border-radius: 15px;
}
.progress-bar-connected {
    background-color:#228b22;
    border-radius: 15px;
}
.progress-bar-connected2 {
    background-color:#228b22;
    border-radius: 15px;
}
.progress-bar-halfconnected {
    background-color:#FF9900;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}
.progress-bar-notconnected {
    background-color:#FF0000;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.progress-bar-phase{
    background: #80ccff;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.progress-bar-phase1 {
    background: khaki;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.progress-bar-phase2 {
    background: black;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.progress-bar-phase3 {
    background: Gainsboro ;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.progress-bar-phase-global {
    padding: 18px;
    margin-bottom: 5px;
}

.legendPhase {
    padding-top: 8px;
    padding-right: 20px;
}

.legendPhase> small+small {
    padding-left: 6px;
}

.thPhase {
    margin-bottom: 6px;
}

#phaseSource, #phaseDestination {
    width: 20vw;
}
/*/* ==================================================
 * x) Form
 * ================================================== */
.form{
	padding:0;
}
.fieldset div{
border: 1px solid #b7c4d1;
    border-radius: 3px 3px 3px 3px;
    padding: 0px 5px 5px 5px;
    margin-bottom: 5px;
    margin-top: 5px;
}
.fieldset fieldset{
    margin:0 20px;

}
legend{
	font-size: 18px;
}
.fieldset legend {
    padding: 5px 10px;
    line-height: 10px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
    border: 3px solid #fff;
    border-radius: 5px 5px 5px 5px;
    width:fit-content;
}
.searchNav {
	background: url("../images/icons/general/search.png") no-repeat scroll 8px 6px #fff;
	padding-top: 4px;
	padding-left: 25px;
	padding-right: 10px;
	padding-bottom: 4px;
	border: 1px solid #b3b3b3;
	border-radius: 15px;
	margin: 0 auto;
    height: 25px;
}

label {
    font-weight: 700;
}

/*/* ==================================================
 * ) Browse
 * ================================================== */
 .browse_cb{
	 margin-bottom:0px;
 }
/*/* ==================================================
 * ) Breadccrumb
 * ================================================== */

 .breadcrumb-arrow {
 	margin-bottom: 0px;
     height: 36px;
     padding: 0;
     line-height: 36px;
     list-style: none;
     background-color: #e6e9ed;
 }
 .breadcrumb-arrow li:first-child a {
     border-radius: 4px 0 0 4px;
     -webkit-border-radius: 4px 0 0 4px;
     -moz-border-radius: 4px 0 0 4px
 }
 .breadcrumb-arrow li, .breadcrumb-arrow li a, .breadcrumb-arrow li span {
     display: inline-block;
     vertical-align: top
 }
 .breadcrumb-arrow li+li:before {
     padding: 0;
     content: ""
 }
 .breadcrumb-arrow li span {
     padding: 0 10px
 }
 .breadcrumb-arrow li a, .breadcrumb-arrow li:not(:first-child) span {
     height: 36px;
     padding: 0 10px 0 25px;
     line-height: 36px
 }
 .breadcrumb-arrow li:first-child a {
     padding: 0 10px
 }
 .breadcrumb-arrow li a {
     position: relative;
     color: #fff;
     text-decoration: none;
     background-color: #337ab7;
     border: 1px solid #337ab7
 }
 .breadcrumb-arrow li:first-child a {
     padding-left: 10px
 }
 .breadcrumb-arrow li a:after, .breadcrumb-arrow li a:before {
     position: absolute;
     top: -1px;
     width: 0;
     height: 0;
     content: '';
     border-top: 18px solid transparent;
     border-bottom: 18px solid transparent
 }
 .breadcrumb-arrow li a:before {
     right: -10px;
     z-index: 3;
     border-left-color: #337ab7;
     border-left-style: solid;
     border-left-width: 11px
 }
 .breadcrumb-arrow li a:after {
     right: -11px;
     z-index: 2;
     border-left: 11px solid #2494be
 }
 .breadcrumb-arrow li a:focus, .breadcrumb-arrow li a:hover {
     background-color: #4fc1e9;
     border: 1px solid #4fc1e9;
 }
 .breadcrumb-arrow li a:focus:before, .breadcrumb-arrow li a:hover:before {
     border-left-color: #4fc1e9;
 }
 .breadcrumb-arrow li a:active {
     background-color: #2494be;
     border: 1px solid #2494be;
 }
 .breadcrumb-arrow li a:active:after, .breadcrumb-arrow li a:active:before {
     border-left-color: #2494be;
 }
 .breadcrumb-arrow li span {
     color: #434a54;
}
/* ==================================================
 * 13) Blocks
 * ================================================== */

.block-content.dark-bg {
	background: url("../img/container/block/dark-bg.png") repeat-x scroll top left transparent;
	background-size: 100% 100%;
	border: 1px solid #111a22;
	box-shadow: none !important;
	min-height: 123px;
	padding-right: 4px;
	padding-left: 4px;
}
.block-content.dark-bg p{
	color: #f5f5f5;
}
.block-border .block-content + .block-content {
	margin-top: 10px;
}

.block-border .block-content {
	box-shadow: 0 0 6px rgba(255, 255, 255, 0.3);
}

.block-header.small {
	min-height: 27px;
}

.block-actions {
	margin: 0 -9px 0px -9px;
	background: url("../img/container/block/block-actions-bg.png") repeat-x scroll bottom left transparent;
	border-radius: 0px 0px 1px 1px;
	height: 44px;
	overflow: inherit;
}

/*.dataTables_wrapper .block-actions {
	margin-left: -9px;
	margin-right: -9px;
}*/

.block-header span {
	background: url("../images/rack/minus.png") no-repeat scroll 0 0 transparent;
	cursor: pointer;
}

.block-header span.closed {
	background: url("../img/icons/plus.png") no-repeat scroll 0 0 transparent;
}

.block-header h1 {
	float: left;
}
a.panel-heading {
	color:white;
	text-decoration:none;
}
ul.overview-list {
    list-style: none;
    list-style-image: none;
    padding: 0;
}
ul.overview-list li span {
    font-weight: 700;
    font-size: 14px;
    display: inline-block;
    text-align: right;
}
ul.overview-list li a {
    display: block;
}
ul.shortcut-list {
    list-style: none;
    list-style-image: none;
    padding: 0;
    margin: 0;
    display: block;
    overflow: hidden;
}
ul.shortcut-list li {
    background: url(../img/misc/lists/shortcut-list-bg.png) repeat-x scroll top left #d3d3d3;
    border: 1px solid #bcbcbc;
    float: left;
    overflow: hidden;
    margin: 10px 5px;
    cursor: pointer;
    border-radius: 5px 5px 5px 5px;
}
/* ==================================================
 * 15) Salle et Rack
 * ================================================== */
/*.salle {
	background: rgba(76,76,76,0.2);
}*/
.salle h2 {
	font-size: 16px;
	line-height: 18px;
	background: rgba(76,76,76,0.1);
	margin: 0;
	padding-left: 5px;
}
.table-rack td {
	display: table-cell;
	vertical-align: bottom;
	/* border: 1px solid #25333c; */
}

td.mark.serveur.verif5.chassis-lames {}
.salle .block-border {
	margin-right: 5px;
	margin-bottom: 5px;
}
.table-rack .block-header h1{
	text-align: center;
	float: none;
}
.table-rack .block-border  {
	margin-top: 0 !important;
}
a.rack  {
	font-size: 10px;
}
table.rack {
	background-color: #edeeef;
}
.u52 {
	height: 1110px !important;
	width: 100%;
}
.u50 {
	height: 1030px !important;
	width: 100%;
}
.u48 {
	height: 990px !important;
	width: 100%;
}
.u47 {
	height: 950px !important;
	width: 100%;
}
.u46 {
	height: 930px !important;
	width: 100%;
}
.u45 {
	height: 910px !important;
	width: 100%;
}
.u42 {
	height: 850px !important;
	width: 100%;
}
.u41 {
	height: 830px !important;
	width: 100%;
}
.u36 {
	height: 750px !important;
	width: 100%;
}
.u24 {
	height: 500px !important;
	width: 100%;
}
.grid_4_fixe {
	width: 300px !important;
	vertical-align: bottom !important;
	display: table-cell !important;
}
.grid_4_fixe3D {
	width: 594px !important;
	vertical-align: bottom !important;
	display: table-cell !important;
}

#rackFlex{
    display: flex;
    flex-direction: row;
}

.out-of-rack {
	vertical-align: baseline !important;
	background: rgba(199, 199, 199, 0.5);
	width: 100%;
	#border: 2px solid #000;
	padding: 0;
}

.top-of-rack {
	position: relative;
	top: 12px;
}

.bottom-of-rack {
	position: relative;
	bottom: 5px;
}

.ru {width: 9px; height:16px;font-size:7px;border-bottom: 1px solid #000;}
.ruz {/*width: 9px;font-size: 7px;*/ background-color: rgba(5, 255, 242, 0.39)!important;}
.ruzz {/*width: 9px;font-size: 7px;*/ background-color: rgba(255, 156, 0, 0.93)!important;}
.ruzzz {/*width: 9px;font-size: 7px;*/ background-color: rgba(255, 5, 5, 0.7)!important;}
.profondeur{width:50;background: #90CDC2;}
.libre{background:#EA6F4B;}

td.tipped img {
	display: none;
}
td.tipped:hover img {
	position: absolute;
	display: block;
	margin: 10px 0 0 10px;
    z-index: 1000;
}
.rack td:first-child, .rack td:last-child, .out-of-rack td {
  	vertical-align:middle;
  	/* border-bottom: 1px solid #000; */
  	white-space: nowrap;
  	overflow: hidden;
}
.rack td {
	vertical-align: middle;
	text-align: center;
	text-overflow: ellipsis;
	line-height:1;
}
.rack {
	text-align: center;
	border-collapse: separate !important;
	-webkit-border-horizontal-spacing: 2px !important;
	-webkit-border-vertical-spacing: 4px !important;
}
.rack img, .out-of-rack img {
	float: left;
	padding: 2px 0 0 2px;
}
.rack-img {
	min-width:180px;
	max-width:180px;
	background-size:100% 100%;
	opacity:1;
}
.rack-imgz {
	min-width:180px;
	max-width:180px;
	background-size:100% 100%;
	opacity:0.5;
}
.mark {
	background-color: transparent;
	padding:0;
}
/*.verif0{background: #ccf5ff;}*/
.verif0{background-color: #80ccff !important;}
.verif1{background-color: #849fff !important;}
.verif2{background-color: #ffc299 !important;}
.verif3{background-color: #83FFD8 !important;}
.verif4{background-color: #C7FF7A !important;}
.verif5{background-color: #78e884 !important;}
.poids0{background-color: #B8E8B1;}
.poids1{background-color: orange;}
.poids2{background-color: red;}
.connected{background-color: yellow;opacity:1;}
.vague0{background-color: lightskyblue;}
.vague1{background-color: lightgreen;}
.vague2{background-color: lightsalmon;}
.vague3{background-color: lightyellow;}
.vague4{background-color: lightpink;}
.vague5{background-color: lightcoral;}
.vague6{background-color: lavender;}
.vague7{background-color: honeydew;}
.vague8{background-color: greenyellow;}
.vague9{background-color: goldenrod;}
.vide{background-color: #FFFFFF;}
.img{background-size:100% 100%;opacity:0.9;}
.imgz{background-size:100% 100%;opacity:0.3;}
.serveur{min-width:230px;max-width:230px;width:230px;}
.serveurv{width:15px;font-size:10px;}
.enclosure{#height:100%;#width:100%; align-content:center;border: 1px ridge gray;}
.enclosurez{#height:100%;#width:100%; align-content:center;}
/* Nouveau style v2*/
.enclosureXY{
	height:100%;
	width:100%;
	align-content:center;
	#border:  1px solid gray;
	}
.enclosureXY th{
	height:12px;
	font-size: 6px;
}
.enclosureXY td{
	max-width:6px;
	min-width:3px;
    #border: 1px solid gray !important;
	#white-space:nowrap;
    #text-overflow:ellipsis;
    #overflow:hidden;
    #vertical-align: bottom !important;
}
.enclosureXY td> div{
	#text-indent: 2px;
	font-size: 8px;
	#white-space:nowrap;
    #text-overflow:ellipsis;
    #overflow:hidden;
    #vertical-align: bottom !important;
}
.lame {
    border: 1px solid gray !important;
    vertical-align:bottom !important
}
.horizontal{
	#max-height:14px;
	#max-height:8px;
	padding:0;
	font-size: 9px;
	}
.vertical{
	-moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg) !important;
    transform: rotate(-90deg);
    padding-left: 10px;
	}
.nppcm{
	height:1px;
	border-style:none;}
/* Fin Nouveau style v2*/

.chassis-lames {
	#padding: 1px;

}
.lames {
	background: #FFF;
}
.lames td{
	/**/
	width: 20px;
    #v2height: 70px !important;
    border: 1px solid gray !important;
	white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    vertical-align: bottom !important;
}
.lames td > div {
	width: 20px;
	text-indent: 5px;
	font-size: 10px;
	-moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg) !important;
    transform: rotate(-90deg);
}
.rack-srvv {
	width:12px;
	background: #90CDC2;
}
.rack-librev {
	width:12px;
}
.alim table {
	width: 100%;
	margin-top: 5px;
}
.alim td {
	border-bottom: 1px solid #3c5364;
}
.alim thead {
	font-weight: bold;
}
.alim p {
	font-size: 90%;
}
.alim-bg {
	background: transparent;
    color: #f5f5f5 !important;
    width: 150px;
}
.phase{

        background: #80ccff;
        color:black;

}
.phase1{

        background: khaki;
        color:black;

}
.phase2{

        background: black;
        color: #f5f5f5;

}
.phase3{

        background: Gainsboro ;
        color:black;

}
.phase12 {
  background: #80ccff; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left,khaki,black);	/* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(left,khaki,black);		/* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(left,khaki,black);		/* For Fx 3.6 to 15 */
  background: linear-gradient(to right,khaki,black); 		/* Standard syntax en dernier*/
}
.phase13 {
  background: #80ccff; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left,khaki,Gainsboro );	/* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(left,khaki,Gainsboro );		/* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(left,khaki,Gainsboro );		/* For Fx 3.6 to 15 */
  background: linear-gradient(to right,khaki,Gainsboro ); 		/* Standard syntax en dernier*/
}
.phase23 {
  background: #80ccff; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left,black,Gainsboro );	/* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(left,black,Gainsboro );		/* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(left,black,Gainsboro );		/* For Fx 3.6 to 15 */
  background: linear-gradient(to right,black,Gainsboro ); 		/* Standard syntax en dernier*/
}
.phase123 {
  background: #80ccff; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left,khaki,black,Gainsboro );	/* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(left,khaki,black,Gainsboro );		/* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(left,khaki,black,Gainsboro );		/* For Fx 3.6 to 15 */
  background: linear-gradient(to right,khaki,black,Gainsboro ); 		/* Standard syntax en dernier*/
}
.turquoise {
	background-image: url(../img/turquoise.png)!important;
}
.orange {
	background-image: url(../img/orange.png)!important;
}
.stop {
	background-image: url(../img/icn_xs_stop.png)!important;
}
#combo-action {
	width: 102%;
	border: 1px solid #fff;
	float: left;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-bottom: 2px;
	padding-top: 2px;
	background: rgba(76,76,76,0.1);
}
#combo-action label {
	padding-right: 5px;
	display:inline;
}
#combo-action select {
	width: 90%;
}
#rackaction {
	margin: 5px 0;
	width:100%;
	padding:4px 10px;
	border-radius:4px;
}
.rack-side {/* pour lesequipements verticaux*/
	width: 15px;
	-moz-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg) !important;
	transform: rotate(-90deg);
	display: inline-block;
	position: relative;
	bottom: 35px;
	white-space: nowrap;
}
.table .icones{
	width: 56px;
}
.out-of-rack {
	margin: 10px 0 10px 0;
	width: 308px;
}

th.heatmap{
    background-color: #337ab7;
    border: 1px solid #FFFFFF;
    color:white;
    width:50px;
}

td.heatmap{
    border: 1px solid #FFFFFF;
    width:50px;
}
td.firstcol{
    background-color: #337ab7;
    border: 1px solid #FFFFFF;
    color:white;
    width:150px;
}
#modalHeatmap {width:900px}

#returnedHeatmap {
    margin-right: auto;
    margin-left: auto;
}

/* ==================================================
 * 17) Upload RvTools
 * ================================================== */
#loading {
    border: 1px solid #337AB7;
    border-radius: 15px;
    width: 50vw;
    padding: 10px;
    margin: 10px;
    text-align: center;
}

.step, .finalBar {
    stroke: #17C438;
}

#loadingText {
    font-size: 15px;
}

.update {
    stroke: #17C438;
}

.notFind {
    stroke: red;
}

.find {
    stroke: #3888BF;
}

.rvToolsCircle {
    stroke: grey;
}

.myDcCircle {
    stroke: black;
}

.find , .notFind, .update, .myDcCircle, .rvToolsCircle{
    stroke-linecap : butt
}

.backPath, .finalBar {
    stroke-linecap: butt;
    stroke-width: 50px;
}

#rvToolsDashBoard, #equipBars{
    border: 1px solid #1388DA;
    border-radius: 15px;
    margin: 0 auto;
    text-align: center;
    margin-top: 10px;
}

.dlButton {
    border: 2px solid #35ACFF;
    border-radius: 15px;
    background-color: #1388DA;
    padding: 6px;
    color: white;
    margin-left: 10px;
}

.caption ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    list-style-type: none;
}

.caption ul li:nth-of-type(1){
    color: grey;
}

.caption ul li:nth-of-type(2){
    color: black;
}

.caption ul li:nth-of-type(3){
    color: red;
}

.caption ul li:nth-of-type(4){
    color: #3888BF;
}

.caption ul li:nth-of-type(5){
    color: #17C438;
}

.caption ul li+li {
    margin-left: 10px;
}

/* ==================================================
 * 18) Utilities
 * ================================================== */

/*Button du Serv Form Edit Localisation*/
.linkGoToRack {
    border: 1px solid #2E6FA7;
    border-radius: 5px;
    padding: 4px;
    margin-bottom: 5px;
    font-size: 12px;
}

/*Input du miss_edit n°de projet*/
.inputProjet {
    padding: 2px;
    margin-bottom: 5px;
    border: 1px solid #2E6FA7;
    border-radius: 5px;
}

/*Bouton Nouveau Tables-list*/
.btnnew {
    color: #3DBF15;
    font-size: 14px;
}

/*Bouton pour Ensemble Apps et Vm dans la vue du rack*/
.btnRack {
    border: 1px solid black;
    background-color: rgba(0, 0, 0, 0);
    color: black !important;
    margin-left: 5px;
    border-radius: 10px;
}

/*Checkbox des header panel*/
.align{

    padding-right: 15px;

}

/*Info Bulles*/
[data-tip] {

    position: relative;

}

[data-tip]:before {

    content:'';
    display:none;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #3074AE;
    position: absolute;
    top:25px;
    left:8px;
    z-index:8;
    font-size:0;
    line-height:0;
    width:0;
    height:0;

}

[data-tip]:after {

    display: none;
    content: attr(data-tip);
    position: absolute;
    top: 30px;
    left: -22px;
    padding: 4px;
    background: #3074AE;
    color: white;
    z-index: 9;
    font-size: 14px;
    height: 22px;
    line-height: 14px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    white-space:nowrap;
    word-wrap:normal;

}

[data-tip]:hover:before, [data-tip]:hover:after {

    display:block;

}

/*Panel sans marge*/

.panelNoMargin{

    margin: 0 !important;

}

.panel-body{

    padding: 5px;

}

.modalSearch{

    margin-bottom: 1vh;
    padding-left: 4vw;

}

#SearchDualList {

    height: 28px;

}

/*Scroll Form Edit*/
.formEditScroll {

    overflow: auto;
    max-height: 65vh;

}

/*Scroll Homepage*/
.overviewScroll{

    overflow: auto;

}

.heightScrollBar{

    max-height: 93vh;

}

.heightScrollTable {

    max-height: 93vh;

}


/*Style de la ScrollBar*/
.formEditScroll::-webkit-scrollbar,  .overviewScroll::-webkit-scrollbar{

    width: 8px;
    height: 8px;

}

.formEditScroll::-webkit-scrollbar-track, .overviewScroll::-webkit-scrollbar-track {

    border-radius: 15px;
    background-color: #74ABDB;

}

.formEditScroll::-webkit-scrollbar-thumb, .overviewScroll::-webkit-scrollbar-thumb {

    background-color: #3175B0;
    border-radius: 15px;
    margin: 5px;

}

.containerUploadDoc {

    margin-top: 15px;

}

.containerDoc {

    max-height: 31vh;
    border: 1px solid #337ab7;
    border-radius: 10px;

}

.containerDoc>p {

    color: #337ab7;
    border-bottom: 1px dashed #337ab7;
    text-align: center;


}

.containerDocThumb {

    overflow: auto;
    max-height: 26vh;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    flex-grow: 0;

}

.docThumb a p {

    text-align: center;

}

.docThumb a img {

    width: 8vw;
    height: 8vw;
    padding: 5px;

}
/* ==================================================
 *  Univers
 * ================================================== */

.divUnivers {

    border: solid 1px grey;
    background-color: grey;
    width: 100%;
    height: 44px;
    border-radius: 0.5rem 0.5rem 0 0;

}

.navUnivers #zoomPrint {

    margin-top: 12px;
    margin-right: -40px;

}

.navUnivers #actionPrint {

    padding: 5px !important;
    color: white !important;
    margin-top: 6px !important;
    border-radius: 8px;

}

.navUnivers {

    display: flex;
    flex-direction: row;
    justify-content: space-between;

}


.divUnivers .checkbox+.checkbox, .divUnivers .radio+.radio{

    margin-left: 50px;

}

/* IMPRESSIONS */
@media screen {
 /* img {
    border: 1px solid rgba(255,0,0,.4);
  }*/
      #myImages  * {
    display: block;
  }
}

/* @media print specifies CSS rules that only apply when printing */
@media print {
  /* CSS reset to clear styles for printing */
  html, body, div {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
  }

  /* Hide everything on the page */
  body * {
    display: none;
  }

  #container, #content, #myImages, #myImages  * {
    /* Only display the images we want printed */
    /* all of the image's parent divs
       leading up to the body must be un-hidden (displayed) too
    */
    display: block;
    /* CSS reset to clear the specific visible divs for printing */
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
  }

  /* We have line breaks in the DIV
     to separate the images in the browser,
     but do not want those line breaks when printing
  */
  #myImages br {
    display: none;
  }

  #manyImgCode {
    display: none;
  }

  #mycss {
    display: none;
  }

  img {
    /* Only some browsers respect this rule: */
    page-break-inside: avoid;
    /* Almost all browsers respect this rule: */
    page-break-after:always;
  }
}

/* The @page rules specify additional printing directives that browsers may respect
   Here we suggest printing in landscape (instead of portrait) with a small margin.
   Browsers, however, are free to ignore or override these suggestions.
   See also:
    https://developer.mozilla.org/en-US/docs/CSS/@page
    https://dev.w3.org/csswg/css3-page/#at-page-rule
*/
@page {
  /* Some browsers respect rules such as size: landscape */
  margin: 1cm;
}

#myConceptDiv {

        border: 1px solid black;
        background-color: white;
        width: 100%;

}

/*=== Checkbox ===*/
.checkbox-power input[type="checkbox"]:checked + label::before,
.checkbox-power input[type="radio"]:checked + label::before {background-color: #FFFF00;border-color: #FFFF00; }
.checkbox-power input[type="checkbox"]:checked + label::after,
.checkbox-power input[type="radio"]:checked + label::after {color: #00fff; }
.checkbox-power input[type="checkbox"]:indeterminate + label::before,
.checkbox-power input[type="radio"]:indeterminate + label::before {background-color: #FFFF00;border-color: #FFFF00;}
.checkbox-power input[type="checkbox"]:indeterminate + label::after,
.checkbox-power input[type="radio"]:indeterminate + label::after {background-color: #00fff;}

.checkbox-server input[type="checkbox"]:checked + label::before,
.checkbox-server input[type="radio"]:checked + label::before {background-color: #707ED7;border-color: #707ED7; }
.checkbox-server input[type="checkbox"]:checked + label::after,
.checkbox-server input[type="radio"]:checked + label::after {color: #fff; }
.checkbox-server input[type="checkbox"]:indeterminate + label::before,
.checkbox-server input[type="radio"]:indeterminate + label::before {background-color: #707ED7;border-color: #707ED7;}
.checkbox-server input[type="checkbox"]:indeterminate + label::after,
.checkbox-server input[type="radio"]:indeterminate + label::after {background-color: #fff;}

.checkbox-vm input[type="checkbox"]:checked + label::before,
.checkbox-vm input[type="radio"]:checked + label::before {background-color: #FF5F00;border-color: #FF5F00; }
.checkbox-vm input[type="checkbox"]:checked + label::after,
.checkbox-vm input[type="radio"]:checked + label::after {color: #fff; }
.checkbox-vm input[type="checkbox"]:indeterminate + label::before,
.checkbox-vm input[type="radio"]:indeterminate + label::before {background-color: #FF5F00;border-color: #FF5F00;}
.checkbox-vm input[type="checkbox"]:indeterminate + label::after,
.checkbox-vm input[type="radio"]:indeterminate + label::after {background-color: #fff;}

.checkbox-apps input[type="checkbox"]:checked + label::before,
.checkbox-apps input[type="radio"]:checked + label::before {background-color: #61D8A2;border-color: #61D8A2; }
.checkbox-apps input[type="checkbox"]:checked + label::after,
.checkbox-apps input[type="radio"]:checked + label::after {color: #fff; }
.checkbox-apps input[type="checkbox"]:indeterminate + label::before,
.checkbox-apps input[type="radio"]:indeterminate + label::before {background-color: #61D8A2;border-color: #61D8A2;}
.checkbox-apps input[type="checkbox"]:indeterminate + label::after,
.checkbox-apps input[type="radio"]:indeterminate + label::after {background-color: #fff;}

.checkbox-set input[type="checkbox"]:checked + label::before,
.checkbox-set input[type="radio"]:checked + label::before {background-color: #FFD773;border-color: #FFD773; }
.checkbox-set input[type="checkbox"]:checked + label::after,
.checkbox-set input[type="radio"]:checked + label::after {color: #fff; }
.checkbox-set input[type="checkbox"]:indeterminate + label::before,
.checkbox-set input[type="radio"]:indeterminate + label::before {background-color: #FFD773;border-color: #FFD773;}
.checkbox-set input[type="checkbox"]:indeterminate + label::after,
.checkbox-set input[type="radio"]:indeterminate + label::after {background-color: #fff;}

.checkbox-cnx input[type="checkbox"]:checked + label::before,
.checkbox-cnx input[type="radio"]:checked + label::before {background-color: #FF99FF;border-color: #FF99FF; }
.checkbox-cnx input[type="checkbox"]:checked + label::after,
.checkbox-cnx input[type="radio"]:checked + label::after {color: #fff; }
.checkbox-cnx input[type="checkbox"]:indeterminate + label::before,
.checkbox-cnx input[type="radio"]:indeterminate + label::before {background-color: #FF99FF;border-color: #FF99FF;}
.checkbox-cnx input[type="checkbox"]:indeterminate + label::after,
.checkbox-cnx input[type="radio"]:indeterminate + label::after {background-color: #fff;}


@media screen and (max-width: 1200px) {

        .divUnivers .checkbox+.checkbox, .divUnivers .radio+.radio{

                margin-left: 18px;

        }

}

@media screen and (max-width: 992px) {

        .divUnivers {

                height: 80px;

        }

        .divUnivers .checkbox+.checkbox, .divUnivers .radio+.radio{

                margin-left: 0;

        }

}

/* ==================================================
 *  Uploader Avatar
 * ================================================== */

 .kv-avatar .krajee-default.file-preview-frame,.kv-avatar .krajee-default.file-preview-frame:hover {

    margin: 0;
    padding: 0;
    border: none;
    box-shadow: none;
    text-align: center;

}
.kv-avatar {

    display: inline-block;

}
.kv-avatar .file-input {

    display: table-cell;
    width: 213px;

}
.kv-reqd {

    color: red;
    font-family: monospace;
    font-weight: normal;

}

#deleteLogo {

    border-radius: 6px;
    padding: 6px;
    width: 35px;
    background-color: #C9302C;
    color: white

}

/* ==================================================
 *  Panel Fancytree
 * ================================================== */

#openPanel {

    text-align: center;
    padding: 5px;
    position: absolute;
    left: -5px;
    top: 45px;
    z-index: 10;
    height: 35px

}

#closePanel {

    text-align: center;
    padding: 5px;
    position: absolute;
    left: -5px;
    top: 45px;
    z-index: 10;
    height: 35px

}

#panelFancytree {

    padding: 0 10px;
    height: 89vh;
    width: 15vw;
    min-width: 5vw;
    max-width: 39vw;
    border-right: 4px solid #337AB7;

}

.pageOffsetDoc {
    padding-left: 10px;
    width: 84vw;
    min-width: 60vw;
    max-width: 84vw;
}

#panelDoc {
    padding: 0 10px;
    width: 15vw;
    min-width: 5vw;
    max-width: 39vw;
    border-right: 4px solid #337AB7;
}

.pageOffset {
    padding-left: 15px;
    width: 100vw;
    min-width: 60vw;
    max-width: 100vw;
}

.ui-helper-hidden-accessible {
    overflow: hidden !important;
}

#cisource ul.fancytree-container, #panelDoc ul.fancytree-container, #ciFrom ul.fancytree-container, #ciTo ul.fancytree-container {
	height: 85vh !important;
	overflow: auto;
	position: inherit;
}

#treeDocuments ul.fancytree-container {
    height: 44vh;
    overflow: auto;
    position: inherit;
}

.checkboxTip {
    position: absolute;
    left: 25px;
    font-size: 12px;
    background-color: #337AB7 !important;
    color: white !important;
    width: 90px;
    border-radius: 5px;
    z-index: 10;
    text-align: center;
}

.rackCircle {

    stroke: #0A6BA5;
    stroke-width: 3px;

}

.backRackCircle {
    stroke-width: 3px;
    stroke: #BFBFBF;
}

/* ==================================================
 *  Help Pannel
 * ================================================== */

.helpContainer {

    position: absolute;
    width: 35vw;
    height: 90vh;
    background-color: white;
    right: 10px;

}

.helpContainer > .card-body {
    overflow: scroll;
    height: 100%;
}

/* ==================================================
 *  Visuel des document équipement
 * ================================================== */

#messageError {

    border: 1px solid red;
    background-color: rgba(255, 0, 0, 0.4);
    padding: 5px;
    text-align: center;
    margin-top: 10px;

}

.kv-fileinput-error{

    display: none !important;

}

.input-file-container {
    display: flex;
    flex-direction: row;
}

.input-file-selected{
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    width: 200px;
}

.input-file-trigger {

    display: block;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 5px 10px;
    background: #337AB7;
    color: #fff;
    font-size: 1em;
    transition: all .4s;
    cursor: pointer;

}

.input-file {

    position: absolute;
    top: 0; left: 0;
    opacity: 0;
    padding: 14px 0;
    cursor: pointer;

}

.input-file:hover + .input-file-trigger,
.input-file:focus + .input-file-trigger,
.input-file-trigger:hover,
.input-file-trigger:focus {

  background: #337AB7;
  color: #fff;

}

.file-return {
  margin: 0;
}

.file-return:not(:empty) {
  margin: 1em 0;
}

.file-return {
  font-style: italic;
  font-size: .9em;
  font-weight: bold;
}

.file-return:not(:empty):before {
  content: "";
  font-style: normal;
  font-weight: normal;
}

.img-zoom-container  {
    position: relative;
}

/*Zoom Lens properties*/
.img-zoom-lens  {
    position: absolute;
    border: 1px solid #3589c6;
    background-color: rgb(53,137,198);
    width: 100px;
    height: 100px;
}

/* Result zoom container */
.img-zoom-result  {
    border: 1px solid #d4d4d4;
    width: 100%;
    height: 500px;
}

/* ==================================================
 * Manuel
 * ================================================== */



/* ==================================================
 * Customize Checkbox
 * ================================================== */

/* Container */
.checkboxContainer {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Masque de la checkbox */
.checkboxContainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Style custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    border-radius: 5px;
    background-color: white;
    border: 1px solid;
}

.checkSrv {
    border-color: #707ED7 !important;
}

.checkVm {
    border-color: #FF5F00 !important;
}

.checkAppli {
    border-color: #61D8A2 !important;
}

.checkSet {
    border-color: #FFD773 !important;
}

.checkCnx {
    border-color: #FF99FF !important;
}

.checkPower {
    border-color: #ffe575 !important;
}

/* Au hover de la checkbox */
.checkboxContainer:hover input ~ .checkmark {
    background-color: #ccc;
}

/* Couleur de fond onChecked */
/*Serveur*/
.checkboxContainer input:checked ~ .checkmark.checkSrv {
    background-color: #707ED7;
}
/*VM*/
.checkboxContainer input:checked ~ .checkmark.checkVm {
    background-color: #FF5F00;
}
/*Application*/
.checkboxContainer input:checked ~ .checkmark.checkAppli {
    background-color: #61D8A2;
}
/*Ensembles*/
.checkboxContainer input:checked ~ .checkmark.checkSet {
    background-color: #FFD773;
}
/*Connexions*/
.checkboxContainer input:checked ~ .checkmark.checkCnx {
    background-color: #FF99FF;
}

.checkboxContainer input:checked ~ .checkmark.checkPower {
    background-color: #ffe575;
}

/* Non checked */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Checked */
.checkboxContainer input:checked ~ .checkmark:after {
    display: block;
}

/* Style de l'icone check */
.checkboxContainer .checkmark:after {
    left: 7px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* ==================================================
 * Responsive
 * ================================================== */

@media screen and (min-width: 3000px) {

    .col-lg-10{

        width: 82.3333%

    }

}

@media screen and (max-width: 1500px){

    .rack-edit {

        width: 100vw;

    }

}

@media screen and (max-width: 1370px){

    .searchTableList {

        width: 30vw;

    }

}

@media screen and (max-width: 1025px) {

    #navScrollSpy {

        font-size: 11px;

    }

}

@media screen and (max-width: 767px){

    #page-wrapper {

        padding-top: 90px;

    }

    .nav>li>a {

        padding: 10px;
        margin: 0px;

    }

    .navbar-form {

        margin: 0px;
        border: none;

    }

}

@media screen and (max-width: 425px){

    #page-wrapper {

        padding-top: 150px;

    }

    .nav>li>a {

        padding: 4px;
        margin: 0px;

    }

    .align {

        text-align: left;
        padding-right: 15px;

    }

}
