body{font-family: "Arial"; font-size: 16px; color: #222222;}
.off-canvas-wrapper{overflow: visible;}
.button, .button.disabled, .button.disabled:focus, .button.disabled:hover, .button[disabled], .button[disabled]:focus, .button[disabled]:hover{background-color: #0069b4;}
.button:focus, .button:hover{background-color: #E71F69;}
h1{font-size: 1.5em ;}
h2{font-size: 1.25em ;}
h3{font-size: 1.15em ;}
table thead tr th{background-color: #0069b4; color: white;}
.closeTop{cursor: pointer; color: grey;}
.edit, .preview, .clone, .relance, .export, .print, .delete, .attachment, .paiement, .managerimport, .hideinscription{cursor: pointer; margin: 20px;}
.paiement.ok{margin: 20px;}
.callout{border-radius: 10px;}
.callout.alert{background-color: #e5a9bf;}
.callout.success{background-color: #a9e5b2;}
ul.errors{color: #E71F69;}
i.has-tip{border-bottom: none;}
iframe{border: none;}
.ok{color: green;}

.tablesorter-header{background-color: #0069b4 !important; color: white !important;}
.tablesorter-default{font-size:  1em !important;}
.tablesorter-default tr.odd>td{background-color: #fbf5f5;}
.tablesorter-default tr > td{padding-top: 20px;}

.item{margin: 5px; border-bottom: dotted 1px grey; padding-bottom: 5px;}
.silcTooltip{z-index: 100;}
.clear{clear: both;}

/*** Volets ***/
.off-canvas, .off-canvas-absolute{background-color: #fefefe !important;}
.position-right.is-transition-push {
    -webkit-box-shadow: inset 13px 0 20px -13px rgb(0 105 180 / 20%) !important;
    box-shadow: inset 13px 0 20px -13px rgb(0 105 180 / 20%) !important;
    border-left: solid 3px #0069b4;
    z-index: 9999;
}
.position-top.is-transition-push {
    -webkit-box-shadow: inset 0 -13px 20px -13px rgb(0 105 180 / 20%) !important;
    box-shadow: inset 0 -13px 20px -13px rgb(0 105 180 / 20%) !important;
    border-bottom: solid 3px #0069b4;
    z-index: 9999;
}

/*** FORMS ***/
label.required:after{content: "(*)"; color: #E71F69;padding-left: 10px;}
.legendeForm{color: #E71F69; font-size: 0.9em;}
form dt label{font-weight: bold;}
form p{font-size: 0.85em; margin-bottom: 0.5em;}
form p.description{font-weight: normal; font-style: italic;}

/*** Login page ***/
body#home{
	background: url("/skin/default/image/graduation.jpg") no-repeat;
	background-position: center;
	background-size: cover;
	min-height: 1024px;
}
body#home #loginForm{margin-top: 5%;}
body#home #loginForm #blocForm{background-color: white; padding: 20px; border-radius: 20px;}
body#home #loginForm #blocForm h1{display: inline-block; margin-top: 25px; margin-right: 20px; color: #E71F69; float: right; }
body#home #loginForm #blocForm img{margin-bottom: 20px;}
body#home #loginForm #blocForm form{padding: 20px; border-top: solid 1px #E71F69; clear: both;}
body#home #loginForm #blocForm form input[type="text"]{max-width: 500px;}
body#home #loginForm #blocForm form input[type="password"]{max-width: 500px;}

/*** Manager page ***/
header a i{color: black;}
header .collaborateur{background-color: #E71F69; padding: 10px; display: inline-block; border-radius: 20px; color: white;}
header .collaborateur a{display: inline-block; margin-left: 20px;}
header .collaborateur a i{color: white;}
header #logo{cursor: pointer;}

section#main #centralScreen{padding: 10px;}

@media screen and (min-width: 768px){
	header .collaborateur{margin: 20px; padding: 10px 20px;}	
	section#main #centralScreen{padding: 30px;}
}

/*** Menus ***/
#mainTaskMenu{margin: 30px 10px;}
#mainTaskMenu a{font-weight: bold; color: #e71f69;}
#mainTaskMenu h3{color: #0069b4; padding:10px; }

#menuProduitsBloc{margin: 10px 30px;}
#menuProduitsBloc #advancedSearchProduct{border-bottom: solid 1px #E71F69;}
#menuProduitsBloc #advancedSearchProduct dd,#menuProduitsBloc #advancedSearchProduct dt{float: left;}
#menuProduitsBloc #advancedSearchProduct label{font-weight: bold; margin-right: 10px;}
#menuProduitsBloc #advancedSearchProduct dd{margin-right: 20px;}
#menuProduitsBloc #nbResultProducts{margin-bottom: 30px; display: inline-block; color:  white; background-color: #E71F69; padding: 10px 20px; border-radius: 0px 0px 10px 10px; cursor: pointer;}
#menuProduitsBloc #nbResultProducts span{font-weight: bold;}
@media screen and (max-width: 767px){
	#advancedSearchProduct dl dt{clear: both;}
}
@media screen and (min-width: 768px) and (max-width: 1023px){
	#advancedSearchProduct dl dt:nth-child(4n+1){clear: both;}	
}
@media screen and (min-width: 1024px) and (max-width: 1439px){
	#advancedSearchProduct dl dt:nth-child(6n+1){clear: both;}	
}

/*** Loader ***/
#loaderModal {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.25);
    padding-top: 15%;
    display: none;
}
.loaderInside {
  width: 60px;
  height: 60px;
  background-image: url('/skin/default/image/logo_loader.png');
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center;
  margin: 5px auto;
}
.loader {
  border: 5px dotted #f3f3f3; /* Light grey */
  border-top: 5px solid #0069B4; /* Blue */
  border-bottom: 5px solid #E71F69; /* Magenta */
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 2s linear infinite; 
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*** Accueil ***/
#blocNotifs, #blocAlerts{display: none;}
#listeInsAAffecter{font-size: 0.85em;}

/*** Datatable surcharge ****/
ul.pagination{display: inline-block;}
ul.pagination li{padding: 5px; background-color: #0069B4;}
ul.pagination li.active{background-color: #DDDDDD !important;}
ul.pagination li a{color: white;}
ul.pagination a:hover, ul.pagination button:hover{background: none !important;}

/*** Formulaire lien inscription ***/
.chosenDoc{background-color: #E71F69 !important; color: white; padding: 1px 5px; display: inline-block; border-radius: 15px; font-size: 0.85em; margin-right:10px;}
.removeDoc{cursor: pointer;}

/*** Liste inscription ***/
#inscriptionList .waiting{color: orange;}
#inscriptionList .waiting.insstatus{cursor: pointer !important;}
#inscriptionList .ok, #inscriptionList a .ok{color: green;}
#inscriptionList tbody tr td.collabManquant{cursor: pointer;}

/*** Inscription par lot ***/
#code_cse-label, #code_cse-element, #num_centre-label, #num_centre-element, #lotInscriptionSearch-label, #lotInscriptionSearch-element{display: inline-block; margin-right: 10px;}
#lotInscriptionSearch{margin-top:15px;}

/*** Filter Multi Select surcharge ***/
.filter-multi-select > .viewbar > .selected-items > .item{ background-color: #E71F69 !important; color: white !important; }
.filter-multi-select > .viewbar > .selected-items > .item > button{margin:0px 5px;}
.filter-multi-select .dropdown-item .custom-checkbox:checked ~ .custom-control-label::before, .filter-multi-select .dropdown-item .custom-checkbox:indeterminate ~ .custom-control-label::before{background-color: #E71F69 !important; color: white !important;}

/*** Bibliotheque de documents ***/
#zonePreviewContainer{height:550px; width:98%;}

/*** Import inscription dans Manager ***/
#ciblesFiche{display: flex;}
.donneesPerso{margin: 20px; padding: 20px; background-color: #E71F6950; border: solid 1px #E71F69;}
.donneesPerso hr{border: solid 1px white;}
.donneesPerso#freresoeur span{display: block; margin-left: 40px; float: right;}

.donneesFoyer{display: flex;}
.donneesCibles{margin: 20px; padding: 20px; background-color: #14C6FD50; border: solid 1px #14C6FD;}
.radioCentre{margin-bottom: 10px;}
.savebutton {margin-right: 20px !important; margin-bottom: 1rem !important; background-color: white; border: none; color: grey; font-weight: bold; text-decoration: underline; cursor: pointer; margin: 0 auto; padding: 10px; min-height: 40px;}
#affecterCentre span{font-size: 0.85em;}
#affecterCentre input[type="radio"]{margin-bottom: 0px;}

/*** Suivi des inscriptions ***/
#suiviList thead tr th{white-space: nowrap; padding: 20px;}
#suiviList thead tr th:first-child{left:0; position: sticky; z-index: 1004;}

#suiviList tbody tr{ cursor: pointer;}
#suiviList tbody tr:hover{background-color: #e71f6952 !important;}
#suiviList tbody tr td:first-child{left:0; position: sticky; z-index: 1004; background-color: #f1f1f1;}
#suiviList tbody tr td span.checkbox{display: block; text-align: center;}

.nosuivi{ background-color:#e5a9bf !important; font-style: italic;}
#suiviList tbody tr.nosuivi td:first-child{background-color:#e5a9bf;}

#suiviinscriptionform input[type="checkbox"]{margin-bottom:38px;}
#suiviinscriptionform h3{background-color: #0069b4; color: white; padding: 5px; margin-top: 20px;}
#suiviinscriptionform dd, #suiviinscriptionform dt{float: left; }
#suiviinscriptionform dd{margin-right: 2%; width:24%;}
#suiviinscriptionform dt{width:20%;}
#suiviinscriptionform dt.checkboxlabel{width: unset; margin-right: 5px;}
#suiviinscriptionform #info_participant-element, #suiviinscriptionform #infos_sejour-element, #suiviinscriptionform #entretien-element, #suiviinscriptionform #suivi_administratif-element{width:100%;}
#suiviinscriptionform #sui_partenaire-element, #suiviinscriptionform #sui_voyage_aller-element, #suiviinscriptionform #sui_voyage_retour-element, #suiviinscriptionform #sui_famille_accueil-element, #suiviinscriptionform #sui_ecole-element, #suiviinscriptionform #sui_commentaires-element, #suiviinscriptionform #sui_jours_fermeture-element{ width: 72%; }
/*#suiviinscriptionform #sui_fiche_recue-element, #suiviinscriptionform #sui_acompte_recu-element, #suiviinscriptionform #sui_dossier_inscr_partenaire-element, #suiviinscriptionform #sui_contrat_signe-element, #suiviinscriptionform #sui_dossier_partenaire_client-element, #suiviinscriptionform #sui_info_voyage_recue-element, #suiviinscriptionform #sui_info_voyage_transmise-element, #suiviinscriptionform #sui_facture_partenaire_compta-element{width: 2%;}
#suiviinscriptionform #sui_dossier_solde-element, #suiviinscriptionform #sui_envoi_infos_client-element, #suiviinscriptionform #sui_rappel_avant_depart-element{width: 2%;}*/
#suiviinscriptionform dd.checkboxelt{width: 2%;}
#sui_date_depart-label, #sui_voyage_aller-label, #sui_voyage_retour-label, #sui_dossier_solde-label, #sui_reception_ds2019-label, #suiviinscriptionform #btnSubmit-label, #suiviinscriptionform #sui_civilite-label, #suiviinscriptionform #sui_facture_contrat_envoyes-label, #suiviinscriptionform #sui_dossier_suivi-label{clear: both;}
#sui_civilite-element label, #sui_publicprive-element label{display :inline-block; margin-right: 15px;}

#suiviinscriptionsearch dd, #suiviinscriptionsearch dt{float: left; margin-right: 15px; }
.ui-datepicker{z-index:1005 !important;}