body {
padding-top: 150px;
overflow-y:scroll;
color-scheme:dark;
}
@media (min-width: 992px) {
body {
padding-top: 150px;
}
}
.police {
font-family: Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
}

.onlyphone{
display: none;
}
@media (max-width: 800px) {
.becomerc{
display: none;
}
.xsmall{
display: none;
}
.onlyphone{
display: block;
}
}
#divMap {
max-width: 100%;
height: 400px;
}
canvas {
opacity: 8;
}
.datamaps-legend dl, .datamaps-legend dt, .datamaps-legend dd {
float: right;
}
.datamaps-legend {
width: 100%;
text-align: right;
top: 10px;
padding-right: 40px;
color: white;
}
.datamaps-legend h2 {
font-size: 18px;
font-weight: bold;
font-style: italic;
}
.clignote {
color:green;
animation: clignote 2s linear infinite;
}
@keyframes clignote {  
50% { opacity: 0; }
}
.rcbox {
/*border: 1mm ridge black*/
border-radius:8px;
box-shadow:0 .5rem 1rem rgba(0,0,0,.35)!important;
}
.shadow {
box-shadow:0 .5rem 1rem rgba(0,0,0,.35)!important;			
}
.titrebox {
padding-top: 8px;
padding-bottom: 15px;
border-bottom: 1mm ridge orange;
margin-bottom: 10px;
}
.spanbox {
font-size: 18px;
font-weight: bold;
font-style: italic;
padding-top: 8px;
padding-bottom: 15px;
}
a {
color : orange;	
}
.spinn {
width: 5rem; 
height: 5rem; 
position: absolute; 
top:50%; 
right:40%
}

#scrolltop {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: orange;
    color: white;
    cursor: pointer;
    padding: 15px;
    border-radius: 10px;
    font-size: 18px;
}
#scrolltop:hover {
    background-color: #555;
}
#nummessages {
    position: fixed;
    bottom: 20px;
    left: 10px;
    z-index: 99;
}
#magicbox {
    position: fixed;
    bottom: 75px;
    left: 10px;
    z-index: 99;
}
#clusterbox {
    position: fixed;
    bottom: 130px;
    left: 10px;
    z-index: 99;
}
#compassbox {
    position: fixed;
    bottom: 185px;
    left: 10px;
    z-index: 99;
}
#box_clusterbox {
  position: fixed;
  left: 10px;
  z-index: 1050;
  background-color: #6C757D;
  /*border: 1mm ridge black;
  border-radius: 10px;*/
}

#box_compass {
  position: fixed;
  right: 10px;
  z-index: 1050;
  background-color: #6C757D;
  /*border: 1mm ridge black;
  border-radius: 10px;*/
}

.new-widget {
  z-index: 1050;
  position: fixed;
  left: 17px;
  bottom: 235px;
}

#box_row {
  max-height: 400px;
  overflow: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
#box_row::-webkit-scrollbar {
  display: none;
}

#box_row_compass {
  max-height: 400px;
  max-width: 350px;
  overflow: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
#box_row_compass::-webkit-scrollbar {
  display: none;
}

#box_clusterboxheader, #box_compassheader {
  padding: 10px;
  cursor: move;
  z-index: 1051;
  background-color: #343A40;
  color: #fff;
  text-align: center;
}


.compass {
	width: 300px;
	height: 300px;
	background: url('../img/compass.png') center center no-repeat;
	background-size: contain;
	position: relative;
}

.needle {
	width: 2px;
	height: 150px;
	position: absolute;
	left: 50%;
	top: 0%;
	transform-origin: center bottom;
	transform: translateX(-50%);
	transition: transform 0.5s;
}

#needleRed {
	background-color: blue;
}

#needleBlue {
	background-color: red;
}

#exposant {
    position: fixed;
	bottom: 50px;
    left: 40px;
	z-index: 100;
}

hr {
 background-color: orange;
}
.beam {
width:120px;
}
.imgA1 {
    position:absolute;
    z-index:1;
}
.imgB1 {
    position:relative;    
    z-index:2;
}

.inputCompass{
    visibility:hidden !important;
}
.hide {
	display:none !important;
}

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate {
    color: #fff;
}

table.dataTable {
	color: #000;
}

table.dataTable thead {
	color: #fff;
}
.paginate_button
{
	color: #fff !important;
	background-color: grey;
}
table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
    background-color: #ddd;
}
table.dataTable.stripe tbody tr.even, table.dataTable.display tbody tr.even {
    background-color: #ccc;
}
.modal-body {
	background-color: #343A40;
	color: #fff;
}
.modal-header {
	background-color: #343A40;
	color: #fff;
}
.modal-footer {
	background-color: #343A40;
	color: #fff;
}
/* =========================================================
   SOUS-MENUS DE NAVIGATION : DÉFILEMENT VISIBLE SUR MOBILE
   ========================================================= */

/* Le message est masqué sur ordinateur. */
.dropdown-scroll-hint {
    display: none;
}

@media (max-width: 768px) {

    /* Sous-menus blancs de la barre de navigation. */
    .navbar .dropdown-menu {
        max-height: 220px;
        overflow-y: scroll !important;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;

        /* Firefox pour Android. */
        scrollbar-width: auto;
        scrollbar-color: #6c757d #eeeeee;

        /* Réserve un peu d'espace pour la barre. */
        padding-right: 6px;
    }

    /* Chrome, Edge, Samsung Internet et certains navigateurs Android. */
    .navbar .dropdown-menu::-webkit-scrollbar {
        display: block;
        width: 10px;
        -webkit-appearance: none;
    }

    .navbar .dropdown-menu::-webkit-scrollbar-track {
        background: #eeeeee;
        border-radius: 10px;
    }

    .navbar .dropdown-menu::-webkit-scrollbar-thumb {
        min-height: 40px;
        background: #6c757d;
        border: 2px solid #eeeeee;
        border-radius: 10px;
    }

    .navbar .dropdown-menu::-webkit-scrollbar-thumb:active {
        background: #495057;
    }

    /* Indication permanente et fiable, y compris sur iPhone. */
    .navbar .dropdown-menu .dropdown-scroll-hint {
        display: block;
        position: sticky;
        top: 0;
        z-index: 5;
        margin: -8px -6px 6px 0;
        padding: 6px 10px;
        background: #f1f1f1;
        color: #555555;
        border-bottom: 1px solid #d6d6d6;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.3;
        text-align: center;
        pointer-events: none;
    }
}