/*
|--------------------------------------------------------------------------
| Styles généraux de l'application
|--------------------------------------------------------------------------
*/
*{
  @extend .absara-regular;
}

html, body {
  height: 100%;
  position:relative;
  font-size: 16px;
}


#front{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.container, .container-home{
  margin-top: $header-height;
  width:100%;
  padding: 45px 20px 0 20px;
  max-width: $global-max-width;
  overflow: auto;
  flex:1;
}

.container-home{
  max-width: 100%;
  padding: 0;
}



// /*
// |--------------------------------------------------------------------------
// | Styles généraux 
// |--------------------------------------------------------------------------
// */
// .no-margin-right{
//  margin-right:0;
//  padding-right: 0;
// }

// .no-margin-left{
//  margin-left:0;
//  padding-left: 0;
// }

// .vertical-align-middle{
//   display: inline-block;
//   vertical-align: middle;
// }

// // .vertical-align-middle-parent{
// //   &:before {
// //     content: '';
// //     height: 100%;
// //     @extend .vertical-align-middle;
// //     width:0%;
// //     opacity: 0;
// //     visibility: hidden;
// //     background-color: transparent;
// //   }
// // }

// // .row.fullWidth {
// //  width: 100%;
// //  margin: 0;
// //  max-width: initial;
// //  overflow: auto;
// //  position: relative;
// //  overflow-x:hidden; 
// // }

// .row{
//  max-width: none;
// }

// .rightSide{
//  text-align: right;
//  @extend .regular;
//  @extend .size-xl;
//  overflow: hidden;
// }

// ul{
//  margin: 0;
//  padding:0;
//  li{
//    @extend .din-regular;
//    @extend .size-m;
//    list-style-type: none;
//  }
// }

// label.buttonLabel{
//  display:inline-block;
//  color:#000;
//  vertical-align: middle;

//  &.on-right{margin-left: 10px!important;}
//  &.on-left{margin-right: 10px!important;}
// }


// .leftSide{
//  // max-width: 1000px;
//  margin:0 auto;
// }

// /*
// |--------------------------------------------------------------------------
// | Style pour les fake radioButton
// |--------------------------------------------------------------------------
// */
// .radioButton{
//  display: inline-block!important;
//  background-color: #fff;
//  border:1px solid black;
//  height:15px;
//  width:15px;
//  cursor: pointer;
//  overflow: hidden;
//  vertical-align: sub;
//    margin: 0;
//    padding: 0;

//  &.selected{
//    background-color: #000;
//  }
  
//  input[type="radio"]{
//    display: inline-block!important;
//    margin-right: -30px!important;
//    opacity: 0;
//    visibility: hidden;
//  }
// }

// /*
// |--------------------------------------------------------------------------
// | Style pour les fake checkBox
// |--------------------------------------------------------------------------
// */
// .checkBox{
//  display: inline-block!important;
//  background-color: #fff;
//  border:1px solid black;
//  height:15px;
//  width:15px;
//  cursor: pointer;
//  overflow: hidden;
//  vertical-align: sub;
//    margin: 0;
//    padding: 0;

//  &.selected{
//    background-color: #000;
//  }
  
//  input[type="checkbox"]{
//    display: inline-block!important;
//    margin-right: -30px!important;
//    opacity: 0;
//    visibility: hidden;
//  }
// }

// /*
// |--------------------------------------------------------------------------
// | Conteneur et contenu pour centrer une image dans son parent, même si elle
// | est plus grande que son parent. On cache ce qui dépasserait cas échéant.
// |--------------------------------------------------------------------------
// */
// //.containerImageForCentering{
// // position: relative;
// //  height: 0;
// // overflow: hidden;
// //}

// // .imgCentered{
// //   position: absolute;
// //   left:50%;
// //   top: 50%;
// //   transform: translate(-50%, -50%);
// //   -webkit-transform: translate(-50%, -50%);
// //   -ms-transform: translate(-50%, -50%);
// // }

// /*img[src$=".svg"] {
//  max-width:auto;
//  width:100%;
//  height:auto;
// }*/

// // .row.titre_page .wrapper{
// //   height:40px;
// //   line-height:40px;
// //   margin-top: 20px;
// //   border-top : 2px solid black;
// //   border-bottom : 2px solid black;
// //   padding: 0 25px;
// // }

// /*
// |--------------------------------------------------------------------------
// | Couleur des états des silhouettes
// |--------------------------------------------------------------------------
// |
// */
// // $hover-color : #914743;
// // $disabled-color : #BBBBBB;

// /*
// |--------------------------------------------------------------------------
// | Style des svg
// |--------------------------------------------------------------------------
// */
// // .svg_bloc{
// //   text-align: left;
// //   display: inline-block;
// //   position: relative;
// //   background-color: transparent;
// //   z-index:1;
// //   display: none;
// // }

// // svg{
// //   path,rect,circle, polygon,text{
// //     cursor : pointer;
// //     transition : fill 0.3s;
// //   }

// //   &.hover{
// //     path,rect,circle, polygon,text{
// //       fill:$hover-color;        
// //     }
// //   }

// //   &.disabled{
// //     pointer-events : none;
// //     path,rect,circle, polygon,text{
// //       fill:$disabled-color;
// //     }
// //   }
// // }