@font-face {
  font-family: 'Roboto-BoldItalic';
  src: url('fonts/Roboto-BoldItalic.eot');
  src: url('fonts/Roboto-BoldItalic.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-BoldItalic.woff2') format('woff2'),url('fonts/Roboto-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Light';
  src: url('fonts/Roboto-Light.eot');
  src: url('fonts/Roboto-Light.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-Light.woff2') format('woff2'),url('fonts/Roboto-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Bold';
  src: url('fonts/Roboto-Bold.eot');
  src: url('fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-Bold.woff2') format('woff2'),url('fonts/Roboto-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Italic';
  src: url('fonts/Roboto-Italic.eot');
  src: url('fonts/Roboto-Italic.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-Italic.woff2') format('woff2'),url('fonts/Roboto-Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Black';
  src: url('fonts/Roboto-Black.eot');
  src: url('fonts/Roboto-Black.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-Black.woff2') format('woff2'),url('fonts/Roboto-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-BlackItalic';
  src: url('fonts/Roboto-BlackItalic.eot');
  src: url('fonts/Roboto-BlackItalic.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-BlackItalic.woff2') format('woff2'),url('fonts/Roboto-BlackItalic.woff') format('woff');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-LightItalic';
  src: url('fonts/Roboto-LightItalic.eot');
  src: url('fonts/Roboto-LightItalic.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-LightItalic.woff2') format('woff2'),url('fonts/Roboto-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Medium';
  src: url('fonts/Roboto-Medium.eot');
  src: url('fonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-Medium.woff2') format('woff2'),url('fonts/Roboto-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Thin';
  src: url('fonts/Roboto-Thin.eot');
  src: url('fonts/Roboto-Thin.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-Thin.woff2') format('woff2'),url('fonts/Roboto-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-ThinItalic';
  src: url('fonts/Roboto-ThinItalic.eot');
  src: url('fonts/Roboto-ThinItalic.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-ThinItalic.woff2') format('woff2'),url('fonts/Roboto-ThinItalic.woff') format('woff');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Regular';
  src: url('fonts/Roboto-Regular.eot');
  src: url('fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-Regular.woff2') format('woff2'),url('fonts/Roboto-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-MediumItalic';
  src: url('fonts/Roboto-MediumItalic.eot');
  src: url('fonts/Roboto-MediumItalic.eot?#iefix') format('embedded-opentype'),url('fonts/Roboto-MediumItalic.woff2') format('woff2'),url('fonts/Roboto-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Condensed';
  src: url('fonts/RobotoCondensed-Regular.ttf');
  font-display: swap;
}
h1,h2,h3,h4,h5{
  font-family: 'Roboto-Medium';
}
h4{
  font-size: 20px;
}
body{
    font-family: "Roboto-Regular", serif;
    font-weight: 
    color: #2D2D2D;
    background-color: #F8F6F0 !important;
}
p{
  white-space: pre-line !important;
}
.btn-primary{
	background-color: #0B1F3A;
	border-color: #0B1F3A;
	border-radius: 8px;
  cursor: pointer;
  margin: 10px 5px;
  font-family: "Roboto-Medium";
  color: white;
  border: 0 none;
  width: auto;
  font-size: 14px;
  padding: 10px 25px;
}
.btn-primary:hover,.btn-primary:focus{
	background-color: #CFAF70;
	border-color: #CFAF70;
	box-shadow: 0 0 0 2px white, 0 0 0 3px #CFAF70;
}
.btn-secondary{
  background-color: #ced4da;
  border-color: #ced4da;
  border-radius: 8px;
  cursor: pointer;
  margin: 10px 5px;
  font-family: "Roboto-Regular";
  color: #fff !important;
  border: 0 none;
  width: auto;
  font-size: 14px;
  padding: 10px 25px;
}
.btn-secondary:hover,.btn-secondary:focus{
  background-color: #ced4da;
  border-color: #ced4da;
  box-shadow: 0 0 0 2px white, 0 0 0 3px #ced4da;
}

.connectPage,.registerPage{
	height: 100vh;
}
.connectPageSideSaisonnier{
	height: 100vh;
	background-image: linear-gradient(to bottom, rgba(11,31,58,0.8), rgba(11,31,58,0.8)),url('../img/Tasaison-connect-saisonnier.jpg');
	background-size: cover;
}
.connectPageSideEntreprise{
	height: 100vh;
	background-image: linear-gradient(to bottom, rgba(11,31,58,0.8), rgba(11,31,58,0.8)),url('../img/Tasaison-connect-entreprise.jpg');
	background-size: cover;
}
.connectPageSideLostPassword{
  height: 100vh;
  background-image: linear-gradient(to bottom, rgba(11,31,58,0.8), rgba(11,31,58,0.8)),url('../img/Tasaison-lost-password.jpg');
  background-size: cover;
}
.connectPageSideSaisonnier h1,.connectPageSideEntreprise h1,.connectPageSideLostPassword h1{
	padding-top: 45vh;
	font-size: 4rem;
	color: #fff;
}
.connectPageSideSaisonnier h1 > span:before,.connectPageSideEntreprise h1 > span:before{
  content:'réceptionniste';
  animation: animate infinite 7s;
  color:#CFAF70;
}
@keyframes animate{
  10%{
    content:'réceptionniste';
    color:#CFAF70;
  }
  20%{
    content:'chef de rang';
    color:#CFAF70;
  }
  40%{
    content:'plongeur';
    color:#CFAF70;
  }
  60%{
    content:'gouvernant';
    color:#CFAF70;
  }
  80%{
    content:'runner';
    color:#CFAF70;
  }
  100%{
    content:'barman';
    color:#CFAF70;
  }
}
#loginForm{
  margin-top: 3vh;
}
#loginForm>.mb-3>label{
	font-family: 'Roboto-Light';
}
#loginForm>.mb-3>span{
	font-family: 'Roboto-Light';
	font-size: 14px;
}
#loginForm>.mb-3>a{
	font-family: 'Roboto-Medium';
	color: #CFAF70;
	text-decoration: none;
	font-size: 14px;
}
#loginForm>.mb-3>a:hover{
	color: #CFAF70;
}
.sideRegister{
	height: 100vh;
	background-image: linear-gradient(to bottom, rgba(11,31,58,0.8), rgba(11,31,58,0.8)),url('../img/Tasaison-register.jpg');
	background-size: cover;
}
.form-check-input:checked {
    background-color: #0B1F3A;
    border-color: #0B1F3A;
}
.select2-container{
    width: 100% !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple{
  border: 1px solid #ced4da !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
    background-color: #0B1F3A !important;
    color: #fff !important;
    border: none !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
  background-color: #0B1F3A !important;
  color: #fff !important;
  border: none !important;
}
.select2-container--default .select2-selection--single{
  border: 1px solid #ced4da !important;
  min-height: 38px;
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529; 
}
.select2-container--default.select2-container--focus .select2-selection--single{
  border: 1px solid #ced4da !important;
  min-height: 38px;
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
  min-height: 38px;
}
@include media-breakpoint-between(sm, md) {
  #registerForm fieldset{
    width: 90%;
  }
}
.modal-header{
  background-color: #F8F6F0 !important;
}