/*
  Overlay pour la gestion des Devices
*/

#O_Devices {
    position: fixed;
    display: none;
    width: 80%;
    height: 150px;
    top: 76px;
    left: 10%;
    right: 10%;
    bottom: 0;
    //    background-color: rgba(0,0,0,0.98);
        background-color: rgba(121, 138, 146, 0.95);
    z-index: 2;
//    cursor: pointer;
}

#O_DevicesText{
    position: absolute;
//    top: 15%;
    left: 4%;
    right: 4%;
    font-size: 13px;
    color: white;
//    transform: translate(-50%,-50%);
//    -ms-transform: translate(-50%,-50%);

}
#O_DevicesClose{
    position: absolute;
    top: 11%;
    left: 97%;
    font-size: 20px;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    cursor: pointer;
}

/*
  Overlay pour la gestion du profil
*/
#O_Profil {
    position: fixed;
    display: none;
    width: 80%;
    height: 350px;
    top: 20%;
    left: 10%;
    right: 10%;
    bottom: 0;
    background-color: rgba(167, 168, 177, 0.98);
    z-index: 2;
    border-style:solid;
    border-color:#666;
    border-width:2px;

}
#O_ProfilText{
        margin-top: 30px;
    position: absolute;
    top: 10px;
    left: 4%;
    right: 4%;
    font-size: 14px;
    color: white;
}
#O_ProfilClose{
    position: absolute;
    top: 30px;
    right: 30px;
    font-size: 20px;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    cursor: pointer;
}


/*
  Overlay pour la gestion du mot de passe
*/
#O_Password {
    position: fixed;
    display: none;
    width: 450px;
    height: 420px;
    top: 20%;
    left: 38%;
    right: 10%;
    bottom: 0;
    background-color: rgba(167, 168, 177, 0.98);
    z-index: 2;
    border-style:solid;
    border-color:#666;
    border-width:2px;

}
#O_PasswordText{
        margin-top: 30px;
    position: absolute;
    top: 10px;
    left: 4%;
    right: 4%;
    font-size: 14px;
    color: white;
}
#O_PasswordClose{
    position: absolute;
    top: 30px;
    right: 30px;
    font-size: 20px;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    cursor: pointer;
}



/*
  Overlay pour la gestion du profil
*/
#O_Magiliens {
    position: fixed;
    display: none;
    width: 80%;
    height: 80%;
    top: 10%;
    left: 10%;
    right: 10%;
    bottom: 0;
    background-color: rgba(167, 168, 177, 0.98);
    z-index: 2;
    overflow-y:scroll;
    border-style:solid;
    border-color:#666;
    border-width:2px;
}
#O_MagiliensText{
        margin-top: 30px;
    position: absolute;
    top: 10px;
    left: 4%;
    right: 4%;
    font-size: 14px;
    color: white;
}
#O_MagiliensClose{
    position: absolute;
    top: 30px;
    right: 30px;
    font-size: 20px;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    cursor: pointer;
}





/* Dropdown Button */
.configurerbtn {
//    background-color: #4CAF50;
//    color: white;
//    padding: 16px;
//    font-size: 16px;
//    border: none;
    cursor: pointer;
}

/* The container <div> - needed to position the dropdown content */
.configurer_liste {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.configurer_liste-content {
    display: none;
    position: absolute;
    //    background-color: #f9f9f9;
        background-color: #EEE;
    min-width: 315px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    color: #FBB1EA;
    padding: 12px;
}

/* Links inside the dropdown */
.configurer_liste-content a {
    color: #FBB1EA;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.configurer_liste-content hover {
    background-color: #f1f1f1
    color: #888;			  
}

/* Show the dropdown menu on hover */
.configurer_liste:hover .configurer_liste-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.configurer_liste:hover .dropbtn {
    background-color: #FFF;
} 





#gabarit_cnilcookie {
    position: fixed;
    font-size: 10pt;
    border: 1px solid black;
    color: black;
    background: #ffe;
    padding: 1em;
    right: 5px;
    bottom: 5px;
    cursor: pointer;
}

body {
//	background: #DCDDDF;
//	color: #000;
//	font: 14px Arial;
//	margin: 0 auto;
//	padding: 0;
//	position: relative;
}

h1{ font-size:28px;}
h2{ font-size:26px;}
h3{ font-size:18px;}
h4{ font-size:16px;}
h5{ font-size:14px;}
h6{ font-size:12px;}
h1,h2,h3,h4,h5,h6{ color:#563D64;}
small{ font-size:10px;}
b, strong{ font-weight:bold;}
a{ text-decoration: none; }
a:hover{ text-decoration: underline; }
.left { float:left; }
.right { float:right; }
.alignleft { float: left; margin-right: 15px; }
.alignright { float: right; margin-left: 15px; }
.clearfix:after,
form:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.login_container { margin: 25px auto; position: relative;  }

#login_content {
	background: linear-gradient(45deg,  #888888, #dcdee2 100%);
	border: 1px solid #c4c6ca;
	margin: 0 auto;
	padding: 25px 0 0;
	position: relative;
	text-align: center;
/*	text-shadow: 0 1px 0 #fff;*/
	width: 400px;
}
#login_content h1 {
	color: #666666;
	font: 18px Helvetica, Arial, sans-serif;
	letter-spacing: -0.05em;
	line-height: 20px;
	margin: 10px 0 10px;
}
#login_content h1:before,
#login_content h1:after {
	content: "";
	height: 1px;
	position: absolute;
	top: 10px;
	width: 27%;
}

#login_content .fenetre_envoyer  h1:before,
#login_content .fenetre_envoyer h1:after {
	content: "";
	height: 1px;
	position: absolute;
	top: 45px;
	width: 27%;
}



#login_content h1:after {
	background: rgb(126,126,126);
	background: -moz-linear-gradient(left,  rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    right: 0;
}
#login_content h1:before {
	background: rgb(126,126,126);
	background: -moz-linear-gradient(right,  rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    left: 0;
}
#login_content form 
{ margin: 0 20px; position: relative }

#login_content form input[type="text"],
#login_content form input[type="password"],
#login_content .fenetre_envoyer input[type="text"],
#login_content .fenetre_envoyer  input[type="password"] {
/*	-webkit-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;*/
	-moz-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-ms-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-o-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
/*	-webkit-transition: all 0.5s ease;*/
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
/*	background: #eae7e7 url("/Common/Images/Public/login-icos.png") no-repeat;
 */
	background: #eae7e7 url("/Common/Images/Prive/profil.png") no-repeat;
	background-size: 20px 20px;
	background-position: 3px; 
	border: 1px solid #c8c8c8;
	color: #777;
	font: 13px Helvetica, Arial, sans-serif;
	margin: 0 0 10px;
	padding: 0px 0px 0px 27px;
	width: 80%;
	height: 30px;
}



#login_content form input[type="text"]:focus,
#login_content form input[type="password"]:focus,
#login_content .fenetre_envoyer input[type="text"]:focus,
#login_content .fenetre_envoyer  input[type="password"]:focus{
	-webkit-box-shadow: 0 0 2px #ed1c24 inset;
	-moz-box-shadow: 0 0 2px #ed1c24 inset;
	-ms-box-shadow: 0 0 2px #ed1c24 inset;
	-o-box-shadow: 0 0 2px #ed1c24 inset;
	box-shadow: 0 0 2px #ed1c24 inset;
	background-color: #FFF;
	color : #888;

	//	border: 1px solid #ed1c24;
//		border: 1px solid #FF81E2;
	outline: none;
}

#username { background-position: 6px 6px !important }
#password { background-position: 6px -58px !important }


#login_content form input[type="submit"] {
    background: #f96475;
    color : #FFF;
    border : 0px;;
	cursor: pointer;
	font: bold 15px Helvetica, Arial, sans-serif;
	height: 35px;
	margin: 20px 0 35px 0px;
	position: relative;
	width: 80%;
}

#login_content form input[type="submit"]:hover {
    background: #f96475;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fec151', endColorstr='#fee79a',GradientType=0 );
}


.btn_envoyer {
    background: #f96475;
    color : #FFF;
    border : 0px;;
	cursor: pointer;
	font: bold 15px Helvetica, Arial, sans-serif;
	height: 35px;
	margin: 20px 0 35px 0px;
	position: relative;
	width: 80%;
	text-align: center;
}

.btn_envoyer:hover {
    background: #f96475;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fec151', endColorstr='#fee79a',GradientType=0 );
}





.header-login-btn {
	border: 1px solid rgba(185, 187, 188, 0.5);
	font-weight: 600;
	color: #DDD;
	display: block;
	font-size: 0.8em;
	padding: 0.25em 1.25em;
	transition: all 0.20s linear 0s;
	-o-transition: all 0.20s linear 0s;
	-ms-transition: all 0.20s linear 0s;
	-moz-transition: all 0.20s linear 0s;
	background-color: rgba(24, 25, 26, 0.5);
	text-align:center;
	font-style: normal;
	display: inline-block;
}
.header_login-btn:hover {
    //	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.1);
    	color: #AAA;
}

.login_souvenir {
    display: flex;
    padding-left: 2.8em;
}


#login_content form div a,
#login_content .fenetre_envoyer div a
{
//    color: #004a80;
    float: right;
    font-size: 12px;
    margin: -113px 35px 0 0;
    text-decoration: underline;
}
.login_button {
	background: rgb(247,249,250);
	background: -moz-linear-gradient(top,  rgba(247,249,250,1) 0%, rgba(240,240,240,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	background: -o-linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	background: -ms-linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	background: linear-gradient(top,  rgba(247,249,250,1) 0%,rgba(240,240,240,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f9fa', endColorstr='#f0f0f0',GradientType=0 );
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	-ms-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	-o-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset;
	border-top: 1px solid #CFD5D9;
	padding: 15px 0;
	font-size: small;
}
.login_button a {
	color: #f96475;
	font-size: 17px;
//	padding: 2px 0 2px 40px;
	text-decoration: none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	font-size: small;
	padding-left: 10px
}
.button a:hover {
	background-position: 0 -135px;
	color: #00aeef;
}

 /* Full-width input fields */

input[type=text], input[type=password] {
    width: 100%;
    padding: 1px 5px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
    height : 30px;
}

/* Set a style for all buttons */

/* Add padding to container elements */
.login_container {
    padding: 16px;
}

/* The Modal (background) */
.login_modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 100; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    padding-top: 60px;
}

/* Modal Content/Box */
.login_modal-content {
    background-color: #fefefe;
    margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button (x) */
.login_close {
    position: absolute;
    right: 35px;
    top: 15px;
    color: #000;
    font-size: 20px;
    font-weight: bold;
}

.login_close:hover,
.login_close:focus {
    color: red;
    cursor: pointer;
}

/* Change styles for cancel button and signup button on extra small screens */
@media screen and (max-width: 450px) {
    .cancelbtn, .signupbtn {
	width: 100%;
    }
    #login_content {

	width:100%;
    }
}


.login_erreur {
    margin: 10px 0 10px;
    color : #C22C2C;
    font-size: 14px;
}
.login_message {
    margin: 10px 0 10px;
    color : #ffffff;
    font-size: 14px;
    font-weight: bold;
}



.login_ok {
    margin: 35px 0 10px;
    color: #CCC;
}

.logo_ref {
    padding-top: 5px;
}

.tab-content {
    overflow : hidden;
}

/*    Pouir le menu deconnexion de  utilisateur dans espace prive */
.dropbtn {
    background-color: #FFF;
    color: #888;
//    padding: 16px;
//    font-size: 16px;
    border: none;

    cursor: pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    left: 0;
    background-color: #2e3842;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    font-size: small;
    align : left;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: #191f26;
			   color : #d152b0;}

.dropdown:hover .dropdown-content {
    display: block;
}

input:-webkit-autofill{
    -webkit-box-shadow: 0 0 0 1000px white inset;
    background-color: #FFFFFF;
}

.dropdown:hover .dropbtn {
    background-color: #2e3842;
}>