body {
    margin-top: 120px;
    color: #002e5f;
}

img {
    height: auto;
	vertical-align: middle;
}

.text-center{
  text-align:center;
}

/* Menu gauche
�������������������������������������������������� */
.navbar.main {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  padding: 0 4px;

  height: 80px;
  line-height: 80px;

  background-color: #ffffff;

  -webkit-box-sizig: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  z-index: 5;

  -webkit-box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.5);
  box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.5);
}
.navbar.main::after {
  content: "";
  display: table;
  clear: both;
}

.navbar.main * {
  display: inline-block;
}

.navbar.main a {
  text-decoration: none
}

.navbar.main .icon {
  padding: 0 8px;
  cursor: pointer;
}

.sidebar {
  position: fixed;
  top: 56px;
  bottom: 0;
  width: 200px;
  background-color: #fff;
}

#sidebar-main {
  top: 56px;
  overflow-y:scroll;
}

.sidebar.right {
  right: -200px;
  text-align: right;
}

.sidebar.left {
  left: -200px;
}

.sidebar a {
  text-decoration: none;
  display: block;
  color: #fff;
  margin-right: 5px;
  font-weight: bold;
  text-align: right;
}

.sidebar .wrapper {
  position: relative;
  height: 100%;
  width: 100%;
  padding: 1em;
  padding-top: 1.5em;
  overflow-x:hidden;

  -webkit-box-sizig: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.sidebar nav {
  margin-bottom: 24px;
}

.sidebar nav ul {
  list-style-type: none;
  margin: 0;
  padding: 0px;

}

.sidebar nav ul li {
  padding: 8px 0;
  margin: 4px 0;
  background-color: #9ab2cf;
  color: #fff;
  /* transition: 0.3s ease; */
}

.sidebar nav ul li:hover{
  opacity:0.5;
}

.sidebar nav ul li.title {
  font-weight: bold;
  color: #fff;
}
/* �������������������������������������������������� */


/* ********************************
              Boutons
**********************************/

#file:hover{
  background:#eb890b;
  border-color:#eb890b;
  cursor:pointer;
}

.button{
  background:#0069D9!important;
  border-color:#0062cc !important;
  color:#fff !important;
}

.button:hover, .button:focus{
  background:#007bff !important;
  border-color:#0073C7 !important;
  color:#fff !important;
}

.button-danger{
  background:#c82333 !important;
  border:1px solid #bd2130 !important;
  color:#fff !important;
}

.button-danger:hover, .button-danger:focus{
  background:#dc3545 !important;
  border:1px solid #dc3545 !important;
  color:#fff !important;
}

.button-success{
  background:#4DC275 !important;
  border:1px solid #38A655 !important;
  color:#fff !important;
}

.button-success:hover, .button-success:focus{
  background:#05DA73 !important;
  border:1px solid #4DC275 !important;
  color:#fff !important;
}

.button-warning{
  background:#F7E800 !important;
  border:1px solid #F7F700 !important;
  color:#212529 !important;
}

.button-warning:hover, .button-warning:focus{
  background:#F7F700 !important;
  border:1px solid #F7E800 !important;
  color:#212529 !important;
}

/* ********************************
            charge_mod.php
**********************************/

.moduleTitle{
  border-bottom:none;
}

.module{
  padding-left:15px !important;
  padding-right:15px !important;
  border-bottom:none;
  border:1px solid black !important;
}

.module:hover{
  background:#eb890b !important;
}
.module a{
  text-decoration:none;
  color:black;
}

.module:hover a{
  color:white;
  text-decoration:underline;
}

/* ********************************
      piece_etat_des_lieux.php
**********************************/

#ajouterPhoto{
  display:flex;
  flex-direction:column;
  width:350px;
  align-items:start;
}

#output_image{
  margin-bottom:10px;
}

#output_image img{
  height:100px;
  object-fit: contain;
  margin:0px 5px;
  margin-bottom:10px;
}

.containerPhotosEdl{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  justify-content:center;
}

.containerPhotosEdl h3, .containerPhotosEdl h4, .containerPhotosEdl h5{
  width:100%;
  text-align:left;
}

.containerPhotosEdl figure{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:75%;
  height:100%;
  position:relative;
  margin:5px 0;
}

.containerPhotosEdl figure img{
  border:1px solid #EDEDED;
  /* margin-top:-1px; */
}

#vignettesPhotos{
  display:flex;
  flex-wrap:wrap;
}

#vignettesPhotos .vignettePhoto{
  position:relative;
}

.containerPhotosEdl figure input[type=checkbox], .vignettePhoto input[type=checkbox]{
  position:absolute;
  top:25px;
  right:25px;
  transform: scale(1.5);
}

.containerPhotosEdl figure figcaption{
  /* margin-top:-1px; */
  padding:10px 0px;
  padding-left:1.5%;
  /* background:#FAFAFA; */
  background:#F4F6F8;
  width:98.5%;
  overflow-wrap:break-word;
  word-wrap: break-word;
}

.containerPhotosEdl .photoContainer{
  width:100%;
  max-height:450px;
  background:#FAFAFA;
  overflow:hidden;
}

#vignettesPhotos img{
max-height:150px;
margin:0 5px;
margin-bottom:15px;
}

.photoContainer .photoOverlay{
  position:absolute;
  top:0;
  right:-1px;
  bottom:10px;
  left:0;
}

.photoOverlay:hover{
  background:rgba(0,46,95,0.1);
}

.containerPhotosEdl figure figcaption p{
  /* border:1px solid lightgrey; */
  /* margin-top:10px;
  padding:10px 0px; */
  margin-bottom:0px !important;
  /* color:#757575; */
  
}

.photoEdl{
  /* height:500px;
  width:500px; */
  height:100%;
  width:100%;
  /* object-fit: contain; */
  
}

/* .photoEdl:hover{
  cursor:pointer;
} */

hr{
  /* background:#E56710; */
  margin:10px 0;
}

.nb_photos{
  color:#BEBEBE;
}

#pieces{
  margin-top:-15px !important;
  margin-bottom:10px;
}

#titreSuivisTechniques{
  width:100%;
  text-align:left;
}

#suivisTechniquesContainer{
  display:flex;
  flex-direction:column;
}

#listeSuivisTechniques{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
}

#liste_st th:nth-child(4)
{
  width:50px;
}


#liste_st th:nth-child(1), #liste_st th:nth-child(9)
{
  width:200px;
}

#liste_st th .sort{
  display:inline-block;
  width:15px;
  padding-left:5px;
  height:100%;
}

/* .singleSuiviTechnique{
  width:50%;
  height:250px;
  margin-bottom:15px;
  position:relative;
  border:1px solid #EDEDED;
  border-left:2px solid #00BCD5;
  padding:5px 0px;
} */

.singleSuiviTechnique:hover{
  cursor:pointer;
}

.singleSuiviTechnique .headerSingleSuiviTechnique{
  font-weight:bold;
  text-align:center;
}

.singleSuiviTechnique .footerSingleSuiviTechnique{
  /* background:#F4F6F8; */
  background:#FAFAFA;
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  padding:5px;
}

.pagination{
  display:flex;
  list-style-type: none;
}

.pagination .page-link{
  position:relative;
  height:30px;
  width:50px;
  display:flex;
  align-items:center;
}

.pagination .page-item{
  color: black;
  /* padding: 8px 16px; */
  text-decoration: none;
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  margin:0 !important;
  display:flex;
  justify-content:center;
  align-items:center;
}

.pagination .active {
  background-color: dodgerblue;
  color: white;
}

.pagination .page-link{
  transition: background-color .3s;
}

.pagination .page-link:hover:not(.active) {
  background-color: #ddd;
}

.pagination button{
  height:30px;
  width:50px;
}

.disabled {
  /* This makes it not clickable */
  pointer-events:none; 
  /* This grays it out to look disabled */
  opacity:0.6;         
}

/* ********************************
      DOSSIERS SUIVIS TECHNIQUES
**********************************/

.folderHeader{
  position:absolute;
  top:-20px;
  right:0px;
  z-index:1;
  width:150px;
}

.folderFooter{
  position:absolute;
  bottom:0;
  right:0;
  z-index:1;
}

#case-folders .folder#wallop:before {
  content: " "
}

/* #case-folders .folder#customer:before {
  content: "Testing"
} */

#case-folders .folder{
  margin: auto;
  margin-top: 50px;
  margin-bottom: 50px;
  position: relative;
  top: 0;
  left: 0;
  background: #fce2a7;
  width: 300px;
  height: 240px;
  box-sizing: border-box;
  border: 24px solid #f7d87c;
  border-top-width: 64px;
  border-radius: 5px;
  transition: border-top-width 0.3s, transform 0.2s;
  transform-origin: 0% 100%;
  cursor: pointer;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

#case-folders .folder:before,
#case-folders .folder:after{
  content: '';
  background: #f7d87c;
}

#case-folders .folder:before,
#case-folders .folder:after,
#case-folders .folder span {
  position: absolute;
}

#case-folders .folder:before {
  font-style: italic;
  color: #8a6d3b;
  width: 150px;
  height: 23px;
  bottom: 213px;
  border-radius: 4px 4px 0 0;
}

#case-folders .folder span,
#case-folders .folder:after {
  width: 300px;
  height: 216px;
  line-height: 216px;
  text-align: center;
  bottom: -24px;
  left: -24px;
  transition: transform 0.2s, background 0.2s;
  transform-origin: 0% 100%;
}

#case-folders .folder:after {
  /* background: #fce2a7;
  background: -moz-linear-gradient(top, #fce2a7 0%, #ffd885 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, #fce2a7), color-stop(100%, #ffd885, ));
  background: -webkit-linear-gradient(top, #fce2a7 0%, #ffd885 100%);
  background: -o-linear-gradient(top, #fce2a7 0%, #ffd885 100%);
  background: -ms-linear-gradient(top, #fce2a7 0%, #ffd885 100%);
  background: linear-gradient(to bottom, #fce2a7 0%, #ffd885 100%); */
  background: #f7d87c;
  border-radius: 6.5px;
}

#case-folders .folder span {
  bottom: 50px;
  padding: 10px;
  background-color: rgba(255, 255, 255, .3);
  border-radius: 5px;
  left: -11px;
  line-height: 28px;
  font-weight: 600;
  width: 100%;
  height: 80px;
  z-index: 2;
  font-size: 28px;
  color: #8a6d3b;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
}


#case-folders .folderArchived{
	border-color:#C2C2C2;
	background:#D4D4D4;
}

#case-folders .folderArchived:before,
#case-folders .folderArchived:after{
	background:#C2C2C2;
}

#case-folders .folderArchived::after{
	background:#C2C2C2;
}

#case-folders .folderArchived span {
	color: grey;
}

.iconFolder{
	color:#f7d87c;
}

.iconArchivedFolder{
	color:grey;
}

#case-folders .folder:hover,
#case-folders .folder.hover,
#case-folders .folder.open {
  border-top-width: 6px;
}

#case-folders .folder:hover span,
#case-folders .folder.hover span,
#case-folders .folder:active span {
  margin-left: 25px;
  -webkit-transition: all .15s ease-in-out;
  -moz-transition: all .15s ease-in-out;
  -o-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
}

#case-folders .folder:hover:after,
#case-folders .folder:hover span,
#case-folders .folder.hover:after,
#case-folders .folder.hover span,
#case-folders .folder.open:after,
#case-folders .folder.open span {
  transform: scaleY(0.85) skewX(-15deg);
}

#case-folders .folder:hover .page1, #case-folders .folder:hover .page2, #case-folders .folder:hover .page3,
#case-folders .folder.hover .page1, #case-folders .folder.hover .page2, #case-folders .folder.hover .page3{
  -webkit-transition: all .15s ease-in-out;
  -moz-transition: all .15s ease-in-out;
  -o-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
  width:110%;
}

#case-folders{
  position:relative;
}

#case-folders input[type="checkbox"]
{
  position:absolute;
  right:0;
}


#case-folders .page1{
  top:-17.5px;
  transform: scaleY(0.85) skewX(-10deg);
  font-size:13px;
  
}

#case-folders .page2{
  top:0px;
  transform: scaleY(0.85) skewX(-12.5deg);
  font-size:13px;
}

#case-folders .page3{
  top:17.5px;
  transform: scaleY(0.85) skewX(-15deg);
  font-size:13px;
}




.page1{
  background:white;
  border: 1px solid #E2E5EB;
  background:#F4F6F8;
}

.page2{
  background:white;
  border: 1px solid #E2E5EB;
  background:#F4F6F8;
}

.page3{
  background:white;
  border: 1px solid #E2E5EB;
  background:#F4F6F8;
}

.folder .alert {
  margin: 10px;
  padding: 7.5px;
}

#case-folders.well {
  margin: 30px;
}


.page1, .page2, .page3{
  position:absolute;
  height:100%;
  width:100%;
}

.folderContainer{
	position:relative;
}

.folderContainer .fa-folder-open{
	position:absolute;
	top:0;
	right:0;
}

.folderContainer .fa-folder-open:hover{
	cursor:pointer;
}

/********************************************* 
				AUTRE
*********************************************/

.alert {
	position: relative;
	padding: .75rem 1.25rem;
	margin-bottom: 1rem;
	border: 1px solid transparent;
	border-radius: .25rem;
}

.alert-primary {
	color: #004085;
	background-color: #cce5ff;
	border-color: #b8daff;
}

.alert-secondary {
	color: #383d41;
	background-color: #e2e3e5;
	border-color: #d6d8db;
}

.alert-success {
	color: #155724;
	background-color: #d4edda;
	border-color: #c3e6cb;
}

.alert-danger {
	color: #721c24;
	background-color: #f8d7da;
	border-color: #f5c6cb;
}

.alert-warning {
	color: #856404;
	background-color: #fff3cd;
	border-color: #ffeeba;
}

.alert-info {
	color: #0c5460;
	background-color: #d1ecf1;
	border-color: #bee5eb;
}

.alert-light {
	color: #818182;
	background-color: #fefefe;
	border-color: #fdfdfe;
}

.alert-dark {
	color: #1b1e21;
	background-color: #d6d8d9;
	border-color: #c6c8ca;
}

.infoCharacter{
  display:flex;
  justify-content:center;
  height:20px;
  width:20px;
  padding:1px 1px;
  margin-right:10px;
  border:1px solid black;
  border-radius:50%;
}

.badge{
  padding-right:.6em;
  padding-left:.6em;
  border-radius:3px;
  color:#fff;
  font-weight:bold;
  margin-right:10px;
}

.badge-yellow{
  background:#FFF3CD;
}

.badge-primary{
  background:#007bff;
}

.badge-success{
  background:#28a745;
}

.badge-danger{
  background:#dc3545;
}

.badge-warning{
  background:#fd7e14;
}

#droits_utilisateurs th, #droits_utilisateurs td, #utilisateurs th, #utilisateurs td, .table th, .table td{
  border:1px solid #E1E1E1 !important;
  padding:15px !important;
}

#utilisateurs th:nth-child(5), #utilisateurs td:nth-child(5){
  text-align:center;
}

.editButton{
  color:#0069D9 !important;
}

.editButton:hover{
  color:#007bff !important;
}

.editButton{
  font-size:25px;
}

.editButton:hover{
  text-align:center;
  cursor:pointer !important;
}

.full-width-container{
  width:100%;
  display:flex;
  justify-content:center;
}

.trashDeleteButton{
	color:#dc3545 !important;
}

.trashDeleteButton:hover{
	cursor:pointer;
}

/* .table-fournitures{
	overflow-x: scroll; 
} */