/* On travaille sur la balise body, donc sur TOUTE la page */

/* mixin */

.anim {-webkit-transition: all 500ms cubic-bezier(0.25, 0.1, 0.25, 1); -moz-transition: all 500ms cubic-bezier(0.25, 0.1, 0.25, 1); -o-transition: all 500ms cubic-bezier(0.25, 0.1, 0.25, 1); transition: all 500ms cubic-bezier(0.25, 0.1, 0.25, 1);}

.anim800 {-webkit-transition: all 800ms cubic-bezier(0.25, 0.1, 0.25, 1); -moz-transition: all 800ms cubic-bezier(0.25, 0.1, 0.25, 1); -o-transition: all 800ms cubic-bezier(0.25, 0.1, 0.25, 1); transition: all 800ms cubic-bezier(0.25, 0.1, 0.25, 1);}

.anim1500 {-webkit-transition: all 1500ms cubic-bezier(0.25, 0.1, 0.25, 1); -moz-transition: all 1500ms cubic-bezier(0.25, 0.1, 0.25, 1); -o-transition: all 1500ms cubic-bezier(0.25, 0.1, 0.25, 1); transition: all 1500ms cubic-bezier(0.25, 0.1, 0.25, 1);}

.anim1000 {-webkit-transition: all 1000ms cubic-bezier(0.25, 0.1, 0.25, 1); -moz-transition: all 1000ms cubic-bezier(0.25, 0.1, 0.25, 1); -o-transition: all 1000ms cubic-bezier(0.25, 0.1, 0.25, 1); transition: all 1000ms cubic-bezier(0.25, 0.1, 0.25, 1);}

 

 

/* FLEX */

.flex {display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex}

.flexRow {display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-direction: normal;-moz-box-direction: normal;-webkit-box-orient: horizontal;-moz-box-orient: horizontal;-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;}

.flexCol {display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-direction: normal;-moz-box-direction: normal;-webkit-box-orient: vertical;-moz-box-orient: vertical;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;}

.flexJustifyBetween {-webkit-box-pack: justify;-moz-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}

.flexJustifyArround {-webkit-box-pack: justify;-moz-box-pack: justify;-webkit-justify-content: space-around;-ms-flex-pack: distribute;justify-content: space-around;}

.flexJustifyStart { -webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start}

.flexJustifyCenter {-webkit-justify-content: center;-ms-flex-pack: center; justify-content: center;}

.flexWeight1 { -webkit-box-flex: 1;-moz-box-flex: 1;-webkit-flex: 1 1 auto;-ms-flex: 1 1 auto;flex: 1 1 auto;}

.flexAlignCenter{-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center}

.flexStretch {-webkit-box-align: stretch;-moz-box-align: stretch;-ms-flex-align: stretch;-webkit-align-items: stretch;align-items: stretch}

.flexWrap {-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;-moz-box-wrap: wrap;}

.flexStart {-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;}

.flexEnd {-webkit-align-items: flex-end;-ms-flex-align: end;align-items: flex-end;}

/* On travaille sur la balise body, donc sur TOUTE la page */

html {
  height: 100%;
}

body {
  height: 100%;
  align-items: center;
  background-color: rgba(181, 195, 209, 0.8);
}

.footer_login {
     position: fixed;
    bottom: 0px;
    right: calc(50% - 107px);
}

#lang{
    position: absolute;
    margin-top: 10px;
    right: 50px;
}

#langlist{
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    list-style: none;
	padding: 7px 4px;
    margin: 0;
    width: 30px;
  background-color: rgba(181, 195, 209);
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 14px rgba(0,0,0,.2);
    box-shadow: 1px 1px 14px rgba(0,0,0,.2);
    z-index: 100;
}

#langlist li{
    list-style: none;
}

#lang{
  float: right;
  margin-right: 50px;
}

#logo{
  width:350px;
  border: none;
}

#curlang {
  color: rgb(236, 51, 84);
  cursor: pointer;
}

#lang:hover > #langlist {
    display: block;
}

#curlang a, #langlist li a{
  color: rgb(236, 51, 84);
  text-decoration: none;
}

.background {
    padding: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    width: 100%;
    z-index: 100;
    height: 100%;
    min-height: 420px;
    overflow: auto;
}

.form-signin {
  width: 100%;
  max-width: 370px;
  height: 100%;
  padding: 15px;
  margin: auto;
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: rgba(181, 195, 209, 0.8);
}
.form-signin .checkbox {
  font-weight: 400;
}

input[type="search"], input {
	outline: none !important;
	box-shadow: none;
}

input[type="search"]:focus, input:focus {
	border: 2px solid rgb(236, 51, 84);
	box-shadow: none;
	border-radius: 3px;
}

.form-signin .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
  margin-bottom: 30px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.form-signin input {
  margin-bottom: 10px;
}

.btn-primary {
  color: rgb(247, 247, 247);
  background-color: rgb(236, 51, 84);
  border : none;
  margin-bottom: 34px;
}

.btn-secondary {
  background-color: rgb(227, 178, 73);
  border: 2px solid rgb(227, 178, 73);
  color: #ffffff;
  margin: 0 10px;
  border-radius: 6px !important;
}

.btn-secondary:hover {
  /* background-color: rgb(236, 51, 84); */
  background-color: rgb(227, 178, 73);
  color: #ffffff;
  border: 2px solid #ffffff;
}

.btn-secondary[data-dismiss="modal"] {
  border: 1px solid rgb(236, 51, 84);
  background-color: transparent;
  color: rgb(236, 51, 84);
}

.btn-secondary[data-dismiss="modal"]:hover {

  background-color:  rgb(236, 51, 84);
  color: #ffffff;
}

.margin-bottom {
  margin-bottom: 10px;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}


.align-left {
  text-align: left !important;
}
.align-center {
  text-align: center !important;
}

@media (min-width: 768px) {
  .bd-placeholder-img-lg {
    font-size: 3.5rem;
  }
}

.btn_modifier, .btn_supprimer, .btn_editer {
    font-size: initial;
     margin: 0px;
    padding: 0.225rem .45rem;
    width : 36px;
}

.btn_supprimer , .btn_supprimer_icn{
      border: 1px solid rgb(236, 51, 84);
      color: rgb(236, 51, 84);
}


.btn_supprimer:hover, .btn_supprimer_icn:hover {
    color: #fff;
    background-color: rgb(236, 51, 84);
      border: 1px solid rgb(236, 51, 84);
}

.btn_modifier_icn, .btn_supprimer_icn, .btn_editer_icn {
    font-size: initial;
     margin: .375rem;
    padding: 0.225rem .45rem;
    width : 36px;
}



.contact {
  max-width: 500px;
  padding: 15px;
  margin: auto;
  padding-top: 60px;
  padding-bottom: 60px;
}



.listing {
  padding: 15px;
  margin: auto;
  padding-top: 20px;
  padding-bottom: 20px;
  text-align: left !important;
  font-size: 0.85rem;
}
.actionsButtons {
  width : 96px;
}
.actionsButtonsMin {
  width : 53px;
}
.acenter {
	text-align: center !important;
}
.aleft {
	text-align: left !important;
}
.aright {
	text-align: right !important;
}

.hidden {
  display: none;
}

fieldset{
    background-color: #f8f9fa!important;
    margin-bottom: 10px !important;	;
    text-align: initial;
}

legend{
  font-size: 1.2rem;
	margin: 0px 16px;
  color: #FFF;
  background-color: rgb(81, 168, 153) !important;
  border-radius: 6px;
  padding: 4px 20px;
    width: fit-content;
}

.iconnav {
    background-color: white;
	border-radius: 50%;
	margin: 0 10px 0 0;
}

/*   Datatables */
.dt-buttons, .dataTables_paginate{
  float: right;
}

.dataTables_length, .dataTables_info{
  float: left;
  width : 250px;
}


table.dataTable th, .table th { 
	vertical-align:middle !important;
	text-align:center;
    padding: .5rem;
}
table.dataTable td, .table td {
	text-align:left;
    padding: .5rem;
	vertical-align:middle !important;
}


table.dataTable tfoot {
    display: table-header-group;
}

table.dataTable tfoot th {
    border-top : none;
}

div.dataTables_wrapper div.dataTables_filter {
    text-align: inherit;
}

div.dataTables_wrapper {
  margin-top:10px;
}

table.dataTable tfoot input {
  width: 100%;
}

#tablecontacts tr td,
#tableadhesions tr td {
  border: 1px solid #dee2e6 !important;
}

#tablecontacts tr th,
#tableadhesions tr th{
  border: 1px solid #dee2e6 !important;
}


@media (max-width: 575px) {
  .modal-dialog {
      max-width: 500px;
  }
  
    .modal-content {
      text-align: left;
  }
}

@media (min-width: 576px) {
  .modal-dialog {
    min-width: 820px;
  }
  
  
  .modal-content label {
      text-align: right;
  }
}

@media (min-width: 576px) {
  .modal-dialog {
    min-width: 1020px;
    max-width: 70%;
  }
  
 
}


@media (max-width: 767px) {
  .dt-buttons,
  div.dataTables_filter{
         display: flex;
  }
  

}

.modal .form-control,
.modal-dialog,
.modal .custom-select,
.modal .input-group-text
{
  font-size: 0.8rem;
  height: inherit;
  /*line-height: 1.3;*/
}

.modal .form-control,
.modal .custom-select{
      padding: .375rem .375rem;
}

.modal-body {
    padding-top: 0px;
}



.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: rgb(227, 178, 73);
    border-color: rgb(227, 178, 73);
}

.navbar-nav li:hover .dropdown-menu {
    display: block;
}

/* rotate caret on hover */
.dropdown-menu > li > a:hover:after {
    text-decoration: underline;
    transform: rotate(-90deg);
}

.dropdown-item:focus, .dropdown-item:hover,
.dropdown-item.active, .dropdown-item:active{
    color: #fff !important;
    text-decoration: none;
    background-color: rgb(236, 51, 84);
}

  
.navbar-collapse {
	text-align: right;
	padding: 5px 0;
}

.nav-item .nav-link {
	color: rgba(255, 255, 255, 1);
}

.nav-item a:hover {
	color: rgb(236, 51, 84) !important;
}

.dropdown-menu .dropdown-item:hover {
	color: #ffffff !important;
}

.contour {
    padding: 0.5rem;
    border: solid #f8f9fa;
    border-radius: 10px;
    margin: 5px;
}

.pinline {
    display: inline-flex;
    min-width: 200px !important;
    max-width: 250px;
}

button.btn.btn-outline-secondary {
  padding :4px;
}

button.btn.btn-outline-secondary img {
  width: 18px;
  fill: grey;
}

button.btn-left {
    left: 0px;
    margin-right: auto !important;
}

button.btn-middle {
    left: calc(100% - 50%);
    margin: auto !important;
}

.nav-pills .nav-link {
    border-radius: .25rem;
    border: 1px solid;
    border-color: #6c757d;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #fff;
    background-color: #6c757d;
}

.nav-item a {
    color: #6c757d;
}

.nav-item a:hover {
    color: #495057;
}






/* Jquery ui*/
.ui-autocomplete-input {
  z-index: 1511;
}
.ui-autocomplete {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1510 !important;
  float: left;
  display: none;
  min-width: 160px;
  width: 160px;
  padding: 4px 0;
  margin: 2px 0 0 0;
  list-style: none;
  text-align: left;
  background-color: #ffffff;
  border-color: #ccc;
  border-color: rgba(0, 0, 0, 0.2);
  border-style: solid;
  border-width: 1px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  *border-right-width: 2px;
  *border-bottom-width: 2px;
}

.ui-state-hover,
.ui-state-active,
.ui-state-focus  {
      color: #ffffff !important;
      text-decoration: none !important;
      background-color: #6c757d !important;
      border-color: #ffffff !important;
      border-radius: .25rem !important;
      -webkit-border-radius: .25rem !important;
      -moz-border-radius: .25rem !important;
}

.ui-helper-hidden-accessible { display:none; }

.form-group.border {
  background-color: rgba(237, 237, 237, .85) !important;
  border: 0 !important;
} 

.modal-content {
  background-color: rgba(237, 237, 237, .9) !important;
}

table, th, td, tr {
  border: 0 !important;
}

.btn-logout {
  color: rgb(236, 51, 84);
  border-color: rgb(236, 51, 84); 
}

.btn-logout:hover {
  color: #ffffff;
  background-color: rgb(236, 51, 84);
  border: 1px solid rgb(236, 51, 84);
}

table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
    content: "\2228"; /*2193*/
    color: rgb(236, 51, 84);
    opacity: 1;
    font-size: 17px;
    font-weight: 900;
    right: 11px;
}

table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
    content: "\2227"; /*2191*/
    color: rgb(236, 51, 84);
    opacity: 1;
    font-size: 17px;
    font-weight: 900;
    top: 15px;
	  right: 11px;
}



table.dataTable thead .sorting_desc:after, .sorting_desc_disabled:after{
    color: #28a745;
}

table.dataTable thead .sorting_asc:before, .sorting_asc_disabled:before{
    color: #28a745;
}

table.dataTable thead tr th{
    height : 50px;
}




.custom-select:focus {
    border: 2px solid rgb(236, 51, 84);
	box-shadow: none;
}

.form-control:focus {
	box-shadow: none;
	border: 2px solid rgb(236, 51, 84);
}

#identification-tab, #contacts-tab, #historique-tab, #jurade-tab {
  color: #ffffff;
  background-color: rgb(227, 178, 73);
  border: 2px solid rgb(227, 178, 73);
  margin: 0 5px;
}

#identification-tab:hover, #contacts-tab:hover, #historique-tab:hover, #jurade-tab:hover {
  color: #ffffff !important;
  background-color: rgb(227, 178, 73);
  border: 2px solid #ffffff;
}

.nav-item .active {
  border: 2px solid #ffffff !important;
}

.form-control:disabled, .form-control[readonly] {
  border: none !important;
}

.form-control:disabled, .form-control[readonly]:focus {
  border: none !important;
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(81, 168, 153, 0.25);
}

.export.sorting, .export.sorting_disabled,.export.sorting_asc, .export.sorting_desc {
  font-size: 1.1rem;
}

.input-group.pinline.cprofil,.input-group.pinline.sprofil,.input-group.pinline.sfonction {
  margin-left: 5px;
}
  
.input-group-append {
  margin-left: 0 !important;
}

.form-checkbox {
  margin: 0 10px;
}

.checkbox-list {
  list-style: none;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 50%;
  margin: 20px auto 20px 140px;
}

.etablissement--item, .etablissement--value, .media--item, .media--value {
  color: orangered;
  font-size: 18px;
  font-weight: bold;
  text-align: left;
}

.form-control {
    color: #000;
}

input:invalid {
  border: #FFA500 solid 1px;
}

.searchFormCom {
  background-color: #FFF;
  border-radius : 6px;
  border:2px solid rgb(227, 178, 73);
}

.archive,
.membre,
.demandeadhesion{
  width : 80px;
  text-align: center;
}

.datepicker { 
    z-index: 1960 !important;
}

.date-notro {
  background-color: #fff !important;
}


/* PHOTO */
#file-selector {
	opacity: 0;
	height: 230px;
  cursor: pointer;
  z-index: 2;
  position: relative;
  width: 190px;
}

#file-selector:focus {
	border: 2px solid rgb(236, 51, 84);
	box-shadow: none;
	outline: none;
}

.photo-container {
  margin:auto;
	margin-top: 15px;
	position: relative;
	padding: 0;
	background-color: rgb(255, 255, 255);
  border-radius: 6px;
	height: 230px;
  width: 190px;
}

.signup-form__col .account_field--photo {
	margin-bottom: 0;
}

.photo-desc {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: rgb(53, 53, 53);
  opacity: .6;
  width: 90%;
  text-align: center;
  z-index: 1;
}

.img-container {
  position: absolute;
  top: 0;
  left: 0;
	height: 230px;
  width: 190px;
  z-index: -1;
}

.avatar-loaded .photo-desc {
  bottom: 0;
  top: inherit;
  opacity: 1;
  z-index: 2;
  color: white;
  background: rgb(236, 51, 84);
  border-radius: 4px;
  transform: translate(-50%, 0);
}

.avatar-loaded .img-container {
  z-index: 1;
}

.img-output {
	height: 230px;
  width: 190px;
  display: block;
  object-fit: cover;
}

.dropdown-menu {
    margin: 0 0;
}

.export.sorting, .export.sorting_disabled, .export.sorting_asc, .export.sorting_desc {
    font-size: 1.02rem;
}

.form-control:focus,
.custom-select:focus {
    border: 1px solid rgb(236, 51, 84);
}
.btn_td {
    padding: 0px !important;
    text-align: center !important;
    width: 150px !important;
}

.modal-backdrop.show {
    opacity: .95;
}

.idate {
      margin-left: 2px;
}

.ui-autocomplete {
     max-height: 200px;
     overflow-y: auto;
     /* prevent horizontal scrollbar */
     overflow-x: hidden;
     /* add padding to account for vertical scrollbar */
     padding-right: 20px;
 }
 
 #nomcomplet {
  font-weight: bold;
    background-color: rgba(81, 168, 153, 0.25);
 }
 
#profils>.cprofil>input,
#nom_etab,
#fct_etab,
#nom_media,
#fct_media{
    background-color: rgba(81, 168, 153, 0.25);
 }
 
.titre_media_etab {
    padding-top: 5px;
}

.etabplace_hide, .mediaplace_hide {
  display: none;
}

.form-check-label {
  margin-top:5px;
}

/* Loader */
.loader{
	background: url('../images/ajax-loader.gif') 50% 50% no-repeat rgba(255, 255, 255, 0.95);
	cursor: wait;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
}
	.loader h1{
		background: none;
		border: none;
		color: #458976;
		font-size: 22px;
		font-family: "Open Sans",sans-serif;
		font-variant: small-caps;
		font-weight: 700;
		height: 700px;
		line-height: 700px;
		margin: 0 0 10px;
		padding: 0;
		text-align: center;
	}

#exportModal {
    background-color: transparent;

}

.content-export {
    width: 400px;
    margin-left: 37%;
}

.export-body {
    margin-top: auto;
    height: 75px;
}

.export-body button {
    position: relative;
    margin-top: 20px;
    left: 35px;
}