@charset "utf-8";
/* CSS Document */



* {
	margin: 0;
	padding: 0;
}
body {
	color: #333;
	background-color: #1E1E1E;
	font-family: "Open Sans", Montserrat, Arial;
	/*
    background-color: #FFF;
    */
}
h1, h2 {
	font-size: 20px;
}
h3 {
	font-size: 18px;
}
h4, h5, h6 {
	font-size: 16px;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	font-family: Sansita, Georgia, Arial;
}
a:link {
	/*
    color: #369;
    */
    color: #72A8C5;
	text-decoration: none;
}
a:visited {
	color: #369;
	text-decoration: underline;
}
a:hover {
    /*
	color: #EF5A28;
    */
    color: #CB563A;
	text-decoration: underline;
}
a:active {
    /*
	color: #EF5A28;
    */
    color: #CB563A;
	text-decoration: none;
}
ul {
	display: block;
}
li {
	display: list-item;
}


/* --- HEADER + FOOTER --- */
.logo {
	margin-bottom: 65px;
	margin-top: 10px;
	position: relative;
	text-align: center;
}
.logo img {
	height: auto;
	margin: 0 auto;
    width: 240px;
    /*
	width: 240px;
	width: 100%;
    */
}
.logo a {
	position: relative;
	z-index: 2;
	padding: 0 30px;
	display: inline-block;
    background-color: #1E1E1E;
	/*
	background: #FFF;
	*/
}
.logo:after {
	background-color: #cdc4c4;
	content: '';
	display: block;
	height: 1px;
	position: absolute;
	top: 50%;
	width: 100%;
	z-index: 0;
}
.footer {
	border-top: 1px solid #d2d2d2;
	margin: 80px 0 40px 0;
	font-size: 11px;
	color: #a4a4a4;
	padding-top: 15px;
	text-align: center;
}
form .btn {
    margin: 30px auto 5px auto;
    display: block;
}



/* --- COMMON --- */
h1 {
	padding: 10px 15px;
	margin: 0;
	color: #FFF;
    background-color: #5F676B;
	border-bottom: 2px solid #CB563A;
    /*
	background-color: #808080;
	background-color: #658D9C;
	border-bottom: 2px solid #EF5A28;
    border-bottom: 2px solid #98C4D5;
    */
}
h2 {
	margin: 20px 0 35px 0;
	font-weight: normal;
    color: #CCC;
}
#msg h2 {
	margin-top: 0;
}
h2:after {
	display: block;
	content: '';
	width: 45px;
	height: 2px;
	margin: 6px 0;
	background-color: #EF5A28;
}
.content {
	width: 90%;
	padding: 0;
	margin: 0 auto;
	border-radius: 5px;
    /*
	border: 4px solid #EFEFEF;
    */
	border: 4px solid #535F6F;
    background-color: #383537;
}
.content#login {
	max-width: 420px;
}
.content#register, .content#email {
	max-width: 600px; 
}
.form {
	padding: 20px 50px 40px 50px;
}
#msg {
	padding: 40px 50px;
}
.gray {
	/*
    background-color: #f5f5f5;
    */
	padding: 12px 20px;
	text-align: center;
    background-color: #535F6F;
}
.gray p {
    color: #FFF;
	margin: 0;
	font-size: 13px;
}
.gray a {
	margin-left: 5px;
}
.mention {
	/*
	margin-bottom: 40px;
	*/
	margin: -5px auto 40px auto;
	text-align: center;
	font-size: 11px;
	color: #999;
}
#msg p {
	/*
	margin-bottom: 20px;
	text-align: center;
	font-size: 16px;
	*/
    color: #CCC;
}
#msg p strong {
    color: #72A8C5;
}
.NB {
	padding: 10px 0;
}
.NB p {
	color: #a4a4a4;
	font-size: 13px;
	margin: 0 0 2px;
	text-align: center;
}
.alert {
	margin: 35px auto;
}
.alert-success {
    border-color: #4C5544;
    background-color: #87997f;
}
.alert-success strong {
    color: #3C763D !important;
}
.btn {
    outline: none !important;
    display: inline-block;
    border-radius: 3px;
    font-size: 13px;
    padding: 5px 20px;
    text-align: center;
    letter-spacing: 0.5px;
}
.btn-lg {
	font-size: 16px;
	font-family: Sansita, Georgia, Arial;
}
.btn.orange {
	color: #FFF;
	background-color: #EF5A28;
}
.btn.blanc-orange {
    background-color: #FFF;
    border: 1px solid #DD4925;
    color: #EF5A28 !important;
}
.btn.orange-blanc {
    /*
    background: #DD4925;
    color: #fff !important;
    border: 1px solid #DD4925;
    */
    color: #FFF !important;
    background-color: #CB563A;
    border: 1px solid #DD4925;
}
.btn.gris-noir {
    background: #EBEBEB;
    border: 1px solid #CCC;
    color: #293448 !important;
}
#btn-retour {
	text-align: center;
	margin-bottom: 40px;
}
.fa, .fas, .far {
	margin: 0 10px 0 5px;
}
.text-blanc, a.text-blanc:link, a.text-blanc:visited {
	color: #FFF;
}
.text-bleu, a.text-bleu:link, a.text-bleu:visited {
	color: #369;
}
.text-orange, a.text-orange:link, a.text-orange:visited {
	/*
    color: #EF5A28;
    */
    color: #CB563A;
}
.link {
	color: #999;
	font-size: 13px;
	display: inline-block;
}
#msg a.link {
	margin-top: 10px;
	text-decoration: none !important;
}

blockquote {
	/*
	color: #369;
	font-size: 14px;
	font-style: italic;
	*/
}

/*--New--*/
.content#comment {
	max-width: 600px;
}
#comment h2{
	margin-bottom: 20px;
}
.mention-input {
	color: #a4a4a4;
	font-size: 12px;
	margin-bottom: 0px;
	padding-top: 5px;
	text-align: left;
}
.emoticons{
	margin-bottom: 35px;
}
.emoticons .item{
	text-align: center;
	padding: 0;
	width: 12.5%;
	/*
	float: left;
	width: 11.11%;
	*/
}
.emoticons img{
	margin-bottom: 5px;
	max-width: 100%;
	cursor: pointer;
}
.emoticons input{
	margin: 0 auto;
}
/*new*/
.btn.gray {
	color: #000;
	background-color: #dadada;
}
#formulaireAlertes .mention{
	padding: 0 40px;
	font-size: 13px;
}





@media (max-width: 767px) {
	.logo img {
		/*
        width: 80%;
        */
	}
	.logo a {
		padding: 0;
        width: 65%;
	}
}






@media (max-width: 414px) {
	/* iPhone 6+ ou inférieur */
	h1 {
		font-size: 20px;
	}
	h2 {
		font-size: 18px;
	}
	h3 {
		font-size: 16px;
	}
	h4, h5, h6 {
		font-size: 14px;
	}
	.logo {
		margin-bottom: 45px;
	}
	.footer p {
		font-size: 11px;
	}
	.content {
		border-radius: 4px;
		border: 2px solid #efefef;
	}
	.form {
		padding: 20px 30px 40px 30px;
	}
	h1 span {
		display: none;
	}
	.messages {
		padding: 30px 15px 40px;
	}
	.mention {
		padding: 0 20px;
	}
	#msg {
		padding: 40px 20px;
	}
	#msg p {
		font-size: 14px;
	}
	.alert {
		font-size: 14px !important;
	}
	.btn {
		padding: 5px 15px;
		/*
		font-size: 15px !important;
		*/
	}
	.gray {
		padding: 10px;
	}
	/*
	.gray p {
		font-size: 13px;
	}
	*/
	#condition .checkbox label, .radio label {
		padding: 0 5px;
		font-size: 12px;
	}
	/*new*/
	#formulaireAlertes .mention{
		padding: 0 10px;
		margin-bottom: 25px;
	}
	/* iPhone 6+ ou inférieur */
	.emoticons .item{
		padding: 5px 2px;
    	width: 25%;
	}
}