/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 26 août 2019, 07:36:22
    Author     : rouge hexa
*/

html{ background-color: var(--vert-fonce); min-height:  100vh}
body{height: calc(100vh - 48px)}
h2{padding-top: 25px; text-transform: uppercase;}
.principale_container{ background: #014231; /*url('/kassets/cssimg/site/back-login.png') center right no-repeat fixed; background-size:  contain*/  max-width: none !important; width: 100%}
#header-wrapper, .row.row_footer{display: none}
.container.container-connexion{max-width: 1080px ;width: 100%; margin: auto}
.logo-connexion{ margin: auto 0 60px 0 }
.title-connexion{margin: auto 0 35px 0; color: #CAD847; text-transform: uppercase; font: 30px "futura-bold"; }
.container-connexion p{ text-transform: uppercase; font-size: 22px; color: #FFFFFF}
#identicationForm input{ border-radius:0; border: none; height: 58px; width: 100%; color: #A0A0A0; font-size: 18px; font-family: Arial," sans-serif"; }
#identicationForm label{ color: #FFFFFF; font-size: 20px; font-weight: bold; font-family: Arial," sans-serif"; display:  block; margin: 0 auto 19px 0; text-align: left; width: 100%}
.btn-connect{margin-top:23px}
.btn-connect a{font-family: Arial," sans-serif"; font-size: 16px; color: #FFFFFF; text-decoration:  underline}
.btn-connect button{ width: 205px; height:  46px; background-color: #014231; font-size:18px; color: #FFFFFF; border: none; border-radius: 0;}
.baspage, .principale_container{padding: 0}
.baspage{position: absolute; z-index: 5; bottom: 0; left: 0; right: 0}
html, body, .principale_container{height: 100%}
.principale_container{/*display:  flex; */align-items:  center; max-width: 1080px ;width: 100%; margin: auto}
#footer2, footer#footer{border: none}
footer#footer{ background-color: #76B126; color: #FFFFFF; font-size: 14px; }
#footer2 p, #footer2 a{ text-align: left; color: #FFFFFF; font-size: 14px; }
#footer2{padding: 13px 15px}
#centre-wrapper{width: 100%}
#identicationForm .input-group{margin: 0 0 15px 0}
.btn-success:hover{background-color: #CAD847}
#js_mdplost{
	position: fixed; top:0;  left: 0; right: 0; bottom:0;  display: flex; align-items:  center; justify-content: center; z-index: 1; backdrop-filter: blur(8px); max-width:  560px;margin: auto;  flex-direction:  column
}

.in-lost-mdp2{background-color: #FFFFFF; position: relative; padding:  25px}

#js_mdplost .label-input{ font: bold 20px Arial," sans-serif"; color: #555555; max-width:  526px; margin:  auto auto 20px auto}

/*#js_mdplost:after{content:""; background: url('/kassets/cssimg/site/bg-lost.png') repeat; top: 0; bottom:0; left: 0; right: 0; position: absolute}*/

.in-lost-mdp{max-width: 853px; margin: auto; width: 100%; border-radius: 8px; text-align: center; padding: 70px 8rem; position:  relative; z-index: 3; background: #FFFFFF url('/kassets/cssimg/site/arc.png') no-repeat center right; background-size: contain}
.title-lost-pass{text-align: center; font: 30px "futura-bold"; text-transform: uppercase; color: #80BA25; margin: auto auto 14px auto}
.in-lost-mdp p{font: 18px Arial," sans-serif"; color: #555555; margin: auto auto 75px auto}
.in-lost-mdp input{ width: 100%; max-width: 526px; height: 58px; background-color: #FFFFFF; padding: 0 15px; color: #A0A0A0; font: 18px Arial," sans-serif"; border: 1px solid #E0E0E0; margin: auto auto 45px auto}
.btn-lost{max-width: 526px; width: 100%}
.in-lost-mdp button{max-width: 263px; width: 100%; height:  46px; background-color: #014231; font-size:18px; color: #FFFFFF; border: none; border-radius: 0;}
.in-lost-mdp a{ color: #80BA25; font-size: 18px; text-decoration: underline}
.is-blurred {
  filter: blur(7px);
  -webkit-filter: blur(7px);
}
.ModalOpen { overflow: hidden; }

.is-hidden, .mean-bar { display: none; }

.is-visuallyHidden { opacity: 0; }

#myContainer .img-connexion{position: fixed; left: 0; top:0; right: 0; bottom:0; width: 100%;  background: url('/kassets/cssimg/site/img-connexion.jpg') no-repeat center right; background-size: cover}

.MainContainer.is-blurred, #centre-wrapper, .ModalOpen, #main-1, #myContainer, .container-connexion{height: 100%}

.container-connexion{display: flex; align-items:  center; justify-content: center}

.blur-class{filter:blur(8px)}

.close-pop{position: absolute; top: 0; right: -46px}

.close-pop:hover{text-decoration: none}

#js_mdplost{padding: 25px}

#js_mdplost input{width: 100%; margin:  auto auto 25px auto}

#js_mdplost button{ background-color: var(--vert-clair); max-width:  225px; margin: auto; text-align: center; border: 1px solid var(--vert-clair)}

#js_retourlost{background-color: var(--vert-fonce); margin: 25px auto; color: #FFFFFF}

@media(max-width: 965px){
	.baspage{display: none}
	.title-connexion{font-size: 20px}
	.logo-connexion, .container-connexion p{margin-bottom: 30px}
	.title-connexion{margin-bottom: 24px}
	.container-connexion p{font-size: 18px}
	.container-connexion{display: inherit; padding-top: 80px}
	.in-lost-mdp{padding: 70px 25px}
	#js_mdplost{padding: 0 15px; position: absolute; top: 188px}
	.title-lost-pass{font-size: 28px; line-height:  28px; margin-bottom: 75px}
	.in-lost-mdp p{font-size: 16px}
	.close-pop{right: 0; top: -65px}
	.ModalOpen {overflow: inherit}
	#centre-wrapper, .ModalOpen{height: auto}
}

@media(max-width: 768px){
	.btn-connect{flex-direction: column; justify-content: flex-end !important; align-items:  flex-end !important; margin-top: 0}
	.btn-connect a{margin-bottom: 32px}
	.btn-connect button{width: 100%}
	.in-lost-mdp button{max-width: inherit; margin-bottom: 53px; border-radius: 5px }
	.btn-lost{justify-content:center !important; flex-wrap: wrap}
	#identicationForm .input-group{margin: 0 0 10px 0}
	#myContainer .img-connexion{ background: #014231 url('/kassets/cssimg/site/img-connexion-mobile.png') no-repeat bottom right; background-size:cover; background-attachment: initial}
	html, body{min-height: 992px}
}