/*

 -----------------------------------------------------------------------------------------
 -------------------------------------------- ATTENTION ----------------------------------
 -----------------------------------------------------------------------------------------
J'ai modifier sur MS le menu latéral, il se replie à 1200px et non plus à 992
Pour revenir en arrière il regarder dans le fichier mycms.css tous les commentaires : MODIFIER POUR MS
Il faut également remodifier le fichier : inc/header_menu.inc.php
 -----------------------------------------------------------------------------------------
 -----------------------------------------------------------------------------------------
 -----------------------------------------------------------------------------------------

*/
@charset "utf-8";

.col-0, 
.col-xs-0, 
.col-sm-0,
.col-md-0,
.col-lg-0 {
  flex: 0 0 0;
  max-width: 0;
  padding-right: 0;
  padding-left: 0;
}

.modal-header {
    display: block;
	font-size: 20px;
    margin-right: 20px;
}
.modal .modal-dialog span.fa, .modal .modal-dialog span.icon {
    font-size: 24px;
    padding-right: 20px;
}
button.close {
    margin-left: 20px;
    margin-top: 4px;
}
.close{
	cursor: pointer;
}
#dataConfirmModal .modal-dialog{
	min-width: 320px;
}

.c-pointer{
  cursor: pointer;
}
.nav-link-profile img {
    border: 1px #ccc solid;
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(0, 0, 0, 0.05);
}

.table-hover tbody tr:hover {
  background-color: rgba(0, 0, 0, 0.085);
}

.table-purple > thead > tr > th,
.table-purple > thead > tr > td {
  background-color: #6f42c1;
	color: #fff;
}
.table-purple > tbody > tr > th,
.table-purple > tbody > tr > td {
  background-color: #e4dcf3;
  color: #432776;
}
.table-purple.table-striped tbody tr:nth-of-type(2n+1) {
  background-color: transparent;
}
.table-purple.table-striped tbody tr:nth-of-type(2n+1) > th,
.table-purple.table-striped tbody tr:nth-of-type(2n+1) > td {
  background-color: #d5c8ed;
}
.table-purple.table-striped.table-hover tbody tr:hover:nth-of-type(2n+1) > th,
.table-purple.table-striped.table-hover tbody tr:hover:nth-of-type(2n+1) > td {
	background-color: #553396;
	color:#fff;
}
.table-purple.table-striped.table-hover tbody tr:hover:nth-of-type(2n) > th,
.table-purple.table-striped.table-hover tbody tr:hover:nth-of-type(2n) > td {
	background-color: #553396;
	color:#fff;
}

.br-menu-sub .nav-link:hover, .br-menu-sub .nav-link:focus {
  color: #6F42C1;
}
.br-menu-sub .nav-link:hover::before, .br-menu-sub .nav-link:focus::before {
  width: 20px;
  left: -15px;
  opacity: 1;
  background-color: #6F42C1;
}
.br-menu-sub .nav-link.active {
  color: #6F42C1;
}
.br-menu-sub .nav-link.active::before {
    background-color: #6F42C1;
}
.select-h27{
	height: 27px;
}
.select-w130{
	width:130px;
}
.input-w230{
	width:230px;
}
.input-w210{
	width:210px;
}
.a-purple{
	color:#6f42c1;
	font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.5;	
}
.a-purple:hover{
	color:#343a40;
}
.a-white{
	color:#fff;
	font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.5;	
}
.a-white:hover{
	color:#868ba1;
	cursor: pointer;
}
.pad-go{
	padding: 1px;
	padding-left: 2px;
	padding-right: 2px;
}
.form-go {
	display: inline;
}
.br-section-wrapper {
    padding: 15px;
}
.table {
    font-size: 0.85rem;
}
/*
.table-purple > thead > tr > th, .table-purple > thead > tr > td {
    padding: 5px;
}

.table-purple.table-striped tbody tr:nth-of-type(2n+1) > th, .table-purple.table-striped tbody tr:nth-of-type(2n+1) > td {
    padding: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
}
*/
.table-purple > tbody > tr > th, .table-purple > tbody > tr > td {
	color:#432776;
    padding-top: 10px;
    padding-bottom: 10px;
}
.table-purple > tbody > tr > th, .table-purple > tbody > tr > td a{
	color:#432776;
}
.table-purple > tbody > tr > th > a, .table-purple > tbody > tr > td a:hover{
	color:#fff;
}

.table-purple > tbody > tr > th a.a-th, .table-purple > tbody > tr > th 	a.a-th:hover{
  color: #fff;
}

.table-purple.table-striped.table-hover .a-th{
	color: #fff;
}
.table-purple.table-striped.table-hover tbody tr:hover > th a, .table-purple.table-striped.table-hover tbody tr:hover > td a{
	color:#fff;
}
.ckbox span::after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}
.dropdown-item.active, .dropdown-item:active {
	background-color:#6F42C1;
}
.my-bselect{
	display: inline-block;
	min-width: 160px;
	float: none;	
}
#listingMea .my-bselect{
	min-width: 205px;
}
.success{
	color:#23BF08;
	font-size: 1.1rem;
}
.danger{
	color:#dc3545;
	font-size: 1.1rem;
}
.warning{
	color:#f0ad4e;
	font-size: 1.1rem;
}
.iconWrapper{
  display: flex;
  justify-content: center;
  align-items: center;  
  width: 15px; height: 15px; 
  background-color: #fff; 
  border-radius: 15px;
}
.fa-1 {
 font-size:1em
}
.fa-1-5 {
 font-size:1.5em
}
.fa-2 {
 font-size:2em
}
.fa-3 {
 font-size:3em
}
.fa-4 {
 font-size:4em
}
.fa-5 {
 font-size:5em
}
.fa-6 {
 font-size:6em
}
#progressModal{
	padding-top:15%;
	overflow-y:visible;
}
#progressModal h3{
	margin:0;
}
#progressModal div.active{
	margin-bottom:0;
}
h6.tx-gray-800{
	position: relative;
}
h6.tx-gray-800::before {
    content: "";
    left: 0;
    right: 0;
    height: 2px;
    background: #F0F0F0;
    position: absolute;
    top: calc(50% - 1px);
}
h6.tx-gray-800 span {
    display: inline-block;
	padding-right: 20px;
    background: white;
    position: relative;
    z-index: 1;
}
a:not([href]):not([tabindex]).tx-white{
	color: #fff;
}
#divhome{
	background-image: url(../img/homebackground.jpg);
	background-repeat: no-repeat;
}

.div_facture {
  background-color: #e9ecef;
}
.list-group-item {
    padding: 0.3rem .9rem;
}
.list-group-item.active {
    background-color: #6F42C1;
    border-color: #6F42C1;
}

.myionicon{
	font-size: 32px;
	color: #6442A0;
	margin: 15px
}
.myrotate-65{
	display: inline-block;
	transform: rotate(65deg);	
}

.myslashes-line:after {
	position: relative;
	content: "/";
	color: red;
	font-weight: 900;
	font-size: 1.9em;
	left: -12px;
	top: 2px;
}

#scroll_to_top {
	position: fixed;
	width: 35px;
	height: 35px;
	bottom: 50px;
	right: -13px;
	display: none;
	font-size: 1.2rem;
	cursor: pointer;
}
#divDevis{
    display: none
}
/******************************* MOT DE PASS *************************************/
.invalid-feedback {
	display: none;
	width: 100%;
	margin-top: .25rem;
	font-size: 80%;
	color: #dc3545;
}
.courtpass {  
	width: 100%;  
	background-color: #dc3545;  
	margin-top: 5px;  
	height: 3px;  
	color: #dc3545;  
	font-weight: 500;  
	font-size: 12px;  
}  
.faiblepass {  
	width: 100%;  
	background-color: #ffc107;  
	margin-top: 5px;  
	height: 3px;  
	color: #ffc107;  
	font-weight: 500;  
	font-size: 12px;  
}  
.bonpass {  
	width: 100%;  
	background-color: #28a745;  
	margin-top: 5px;  
	height: 3px;  
	color: #28a745;  
	font-weight: 500;  
	font-size: 12px;  
}  
.fortpass {  
	width: 100%;  
	background-color: #d39e00;  
	margin-top: 5px;  
	height: 3px;  
	color: #d39e00;  
	font-weight: 500;  
	font-size: 12px;  
}
.tresfortpass {  
	width: 100%;  
	background-color: #05DFA2;  
	margin-top: 5px;  
	height: 3px;  
	color: #05DFA2;  
	font-weight: 500;  
	font-size: 12px;  
}
/******************************* FIN MOT DE PASS *************************************/

/******************************* HIGHLIGHT TEXTAREA *************************************/
.hwt-container {
	background-color: #f8f9fa;
	width: 100%
}
.hwt-content {
	width: 100%;
	height: 100px;
	padding: 20px;
	border: 1px solid #adb5bd;
	color: inherit;
	font: 16px/25px 'Droid Sans Mono', sans-serif;
}
.hwt-input:focus {
	outline-color: #495057;
}
.hwt-content mark {
	border-radius: 3px;
	background-color: #d0bfff;
}
.hwt-content mark.red {
	background-color: #ffc9c9;
}
.hwt-content mark.blue {
	background-color: #a3daff;
}
.hwt-content mark.yellow {
	background-color: #ffec99;
}
.hwt-content mark.purple {
	background-color: #ccbde7;
}
.hwt-content mark.light-gray {
	background-color: #E4E7EA;
}
.hwt-content mark.gray {
	background-color: #D0D0D7;
}
/******************************* FIN HIGHLIGHT TEXTAREA *************************************/


/******************************* UPLOAD IMAGE *************************************/
.file-upload {
  background-color: #ffffff;
  width: 100%;
  margin: 0 auto;
}

.file-upload-content {
  display: none;
  text-align: center;
}

.file-upload-input {
    position: absolute;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 50px;
    outline: none;
    opacity: 0;
    cursor: pointer;
}
.file-upload-input:before, .file-upload-input:after {
    cursor: pointer;
}
input[type='file']{
    cursor: pointer;
}
.div-upload-btn{
	width: 20%;
	display: inline-flex;	
}
.file-upload-btn{
	position: absolute;
	top: 0;
}
.image-upload-wrap {
	display: inline-flex;
	border: 2px dashed #5E37A6;
    max-width: 100%;
    width: 100%;
	height: 50px;	
}

.image-dropping,
.image-upload-wrap:hover {
  background-color: #5E37A6;
  border: 2px dashed #ffffff;
	cursor: pointer;
}

.image-upload-wrap:hover .drag-text strong{
	color: #fff;
	cursor: pointer;
}


.image-title-wrap {
  padding: 0 15px 15px 15px;
  color: #222;
}

.drag-text {
	text-align: center;
	width: 100%;
    cursor: pointer;
}

.drag-text strong {
	font-weight: 100;
	text-transform: uppercase;
	color: #898E94;
	text-align: center;
	width: 100%;
	line-height: 36px;
	height: 40px;
	cursor: pointer;
    font-size: 1rem;
}
.drag-text strong:hover {
	cursor: pointer
}

.file-upload-image {	
	max-height: 195px;
	max-width: 195px;
	margin: auto;
	padding-right: 15px;
	padding-bottom: 10px;	
}

.remove-image {
	width: 30px;
	margin: 0;
	color:#fff;
	background:#cd4535;
	border: none;
	padding: 5px;
	border-radius: 2px;
	transition: all .2s ease;
	outline: none;
	text-transform: uppercase;
	font-weight: 700;
}

.remove-image:hover {
  background: #c13b2a;
  color: #ffffff;
  transition: all .2s ease;
  cursor: pointer;
}

.remove-image:active {
  border: 0;
  transition: all .2s ease;
}
.col-upload{
	min-height: 50px;
}
.myPopover{
	padding-left: 10px;
	font-size: 1.2rem;
	margin-top: -0.3rem;
	color:#5E37A6;
	padding-right: 5px;	
}
.myPopover:hover{
	color:#3D3383;
}
.bas-upload{
	border-bottom: 1px #ccc solid;
	padding-bottom: 5px;
}


/************************************************** FIN UPLOAD IMAGE ************************/

/************************************************ UPLOAD IMAGE 2 *****************************/

.image-preview-input {
    position: relative;
    overflow: hidden;
    margin: 0px;    
    color: #333;
    background-color: #fff;
    border-color: #ccc;    
}
.image-preview-input input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 0;
	font-size: 20px;
	cursor: pointer;
	opacity: 0;
	filter: alpha(opacity=0);
}
.image-preview-input-title {
    margin-left:2px;
}
.align-upload {
	text-align: right !important;
}
/************************************* FIN UPLOAD IMAGE 2 ****************************/
.mfp-iframe-scaler iframe {
	background:#fff;
}
.mfp-iframe-holder .mfp-content {
    line-height: 0;
    width: 100%;
    max-width: 100%;
    height: 100%;
}
.mw-95{
	max-width: 95%;
}
.mwi-75{
	max-width: 75%!important;
}
.switch-wrapper{
	margin-left: -11px;
}
/************************************** RANGER SLIDE ****************************************/
.irs-bar {
    background-color: #6F42C1;
	background-image: none;
}
.irs-bar-edge{
    background-color: #6F42C1;
	background-image: none;	
}
.irs-slider {
    cursor: pointer;
}
.irs-slider::before {
    background-color: #6F42C1;
    cursor: pointer;
}
.irs-from::after, .irs-to::after, .irs-single::after {
	border-top-color: #6F42C1;
	cursor: pointer;
}
.irs-from, .irs-to, .irs-single {
	background: #6F42C1;
	cursor: pointer;
}
/*
.irs-line-mid, .irs-line-left, .irs-line-right, .irs-bar, .irs-bar-edge, .irs-slider {
    background: none;
    background-color: #6F42C1;
}
*/
/*********************************** FIN RANGER SLIDE **************************************/

/********************************************* OPEN STREET MAP *****************************/
#map{ /* la carte DOIT avoir une hauteur sinon elle n'apparaît pas */
	height:400px;
	width: 100%;
	margin: 0;
	border-radius: 5px;
}
.leaflet-touch .leaflet-control-attribution a{
	display: none;
}
/******************************************* FIN OPEN STREET MAP ****************************/
iframe{
	max-width: 100%
}
body > iframe:nth-child(1n+3){
	max-height: 370px
}
/*
@media (min-width: 1200px) {
  .br-sideleft {
    left: 0;
  }
  .br-logo {
    left: 0;
  }
}

@media (min-width: 992px) {
  .br-sideleft {
    left: ;
  }
  .br-logo {
    left: ;
  }
}
*/
@media screen and (max-width: 1024px) {
	.bloc-1024{
		display: block;
	}
}
@media screen and (max-width: 767px) {
	.align-upload {
		text-align: left !important;
	}
}

@media screen and (max-width: 480px) {
  .tx-xs-8 {
    font-size: 8px;
  }

  .tx-xs-8-force {
    font-size: 8px !important;
  }

  .tx-xs-9 {
    font-size: 9px;
  }

  .tx-xs-9-force {
    font-size: 9px !important;
  }

  .tx-xs-10 {
    font-size: 10px;
  }

  .tx-xs-10-force {
    font-size: 10px !important;
  }
  .tx-xs-11 {
    font-size: 11px;
  }

  .tx-xs-11-force {
    font-size: 11px !important;
  }

  .tx-xs-12 {
    font-size: 12px;
  }

  .tx-xs-12-force {
    font-size: 12px !important;
  }

  .tx-xs-13 {
    font-size: 13px;
  }

  .tx-xs-13-force {
    font-size: 13px !important;
  }

  .tx-xs-14 {
    font-size: 14px;
  }

  .tx-xs-14-force {
    font-size: 14px !important;
  }

  .tx-xs-15 {
    font-size: 15px;
  }

  .tx-xs-15-force {
    font-size: 15px !important;
  }

}
/********************************************* BLINK *****************************/
.blink {
  -webkit-animation: 2s linear infinite condemed_blink_effect; // pour Safari 4.0-8.0
  animation: 2s linear infinite condemed_blink_effect;
}
@-webkit-keyframes condemed_blink_effect { // pour Safari 4.0-8.0
  0% {
    visibility: hidden;
  }
  50% {
    visibility: hidden;
  }
  100% {
    visibility: visible;
  }
}
@keyframes condemed_blink_effect {
  0% {
    visibility: hidden;
  }
  50% {
    visibility: hidden;
  }
  100% {
    visibility: visible;
  }
}
/********************************************* FIN BLINK *****************************/

/******************************************************* TOOLTIP ****************************************************/
.ui-tooltip, .arrow:after {
    background: #fffdc2;
	border:1px solid #e1e0aa;}
	
  .ui-tooltip {
	z-index:10;
	width:250px;
	max-width:100%;
    font-size:0.875em;
	text-align:center;
    border-radius: 20px;
	color:#707070;
	background:#fff;
	font-family: 'Droid Sans', sans-serif;
	text-shadow: 1px 1px #ffffff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #ccc;
}
/*
.myTooltip{
	margin-bottom: 50px;
}
.myTooltip:hover:after{
	margin-bottom: 50px;
}
.myTooltip:hover:before{
	margin-bottom: 50px;
}
*/
.myOptionTooltip{
	height: 20px;
	font-size: 14px;
}
.ui-helper-hidden-accessible{
	display: none;
}
	
  .arrow {
    width: 50px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
	*display:none;}
	
  .arrow.top {
    top: -16px;
    bottom: auto;}
	
  .arrow.left {
    left: 20%;}
	
  .arrow:after {
    content: "";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    tranform: rotate(45deg);}
	
  .arrow.top:after {
    bottom: -20px;
    top: auto;}
/******************************************************* FIN TOOLTIP ***********************************************/

/*********************************************** CHARTIST *********************************************************/

.br-chartist .ct-series-a .ct-point, .br-chartist .ct-series-a .ct-line, .br-chartist .ct-series-a .ct-bar, .br-chartist .ct-series-a .ct-slice-donut {
  stroke: #5E37A6;
}      
.ct-series-a .ct-point, .ct-series-a .ct-line, .ct-series-a .ct-bar, .ct-series-a .ct-slice-donut {
  stroke: #5E37A6;
	cursor: pointer;
}
.ct-series-a .ct-slice-pie, .ct-series-a .ct-slice-donut-solid, .ct-series-a .ct-area {
	fill: #5E37A6;
}
.ct-label.ct-vertical.ct-start {
	margin-left: 6px
}
.ct-line {
  stroke-width: 2px;
}
.chartist-tooltip {
  opacity: 0;
  position: absolute;
  margin: 20px 0 0 10px;
  background: rgba(0, 0, 0, 0.8);
  color: #FFF;
  padding: 5px 10px;
  border-radius: 4px;
}

.chartist-tooltip.tooltip-show {
  opacity: 1;
}

.my-cool-point{
  fill-opacity: 1!important;
  stroke-width: 0px;
  stroke: red;
  transition: all 0.2s linear;
}
.my-cool-point:hover{
  r: 7;
  stroke-opacity: 0.2;
  stroke-width: 20px;
}
.ct-axis-title{
    /*
    Pour exeplication du Filter voir :
    https://stackoverflow.com/questions/22252472/how-can-i-change-the-color-of-an-svg-element
    https://codepen.io/sosuke/pen/Pjoqqp
    */
    filter: invert(22%) sepia(18%) saturate(6690%) hue-rotate(244deg) brightness(98%) contrast(92%);
    font-size: 0.75rem;
}
/******************************************** FIN CHARTIST ********************************************************/