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


/*///////////////////////////////////////////////////////////////////////////////////////////////
//                                                                                             //
//  CORPS DE PAGE                                                                              //
//                                                                                             //
///////////////////////////////////////////////////////////////////////////////////////////////*/


/*-------------------------------------------------------------------------------+
+ Chapo                                                                          +
+-------------------------------------------------------------------------------*/

#chapo {
	background-color: #e73089;
}


/* Fil d'Ariane ********************************************************/

#chapo #fil-ariane li.passe {
	background-image: url(../img/divers/fil-ariane/separateur-blanc-passe.png);
	color: #fff;
}

#chapo #fil-ariane li.passe a, #chapo #fil-ariane li.passe a:hover, #chapo #fil-ariane li.passe a:active, #chapo #fil-ariane li.passe a:visited, #chapo #fil-ariane li.passe a:focus {
	color: #fff;
}

#chapo #fil-ariane li.present {
	background-image: url(../img/divers/fil-ariane/separateur-blanc-present-avenir.png);
}

#chapo #fil-ariane li.present strong {
	background-image: url(../img/divers/fil-ariane/repere-cartes.png);
}

#chapo #fil-ariane li.avenir {
	background-image: url(../img/divers/fil-ariane/separateur-blanc-present-avenir.png);
	color: rgba(255, 255, 255, 0.7);
}



/*-------------------------------------------------------------------------------+
+ Barre laterale                                                                 +
+-------------------------------------------------------------------------------*/

@media screen and (min-width: 1221px) { /* Bureau */
	
	#barre-laterale ul li a .label {
		border-color: #7fc405;
	}

	#barre-laterale ul li a .puce {
		border-color: #7fc405;
	}
	
	#barre-laterale ul li a.actif .puce {
		background: #7fc405;
	}

}



/*-------------------------------------------------------------------------------+
+ Ajustements DCC                                                                +
+-------------------------------------------------------------------------------*/

#mentions-exemple p strong, p.mentions-legales strong, #mentions-legales p strong {
	font-size: 1.3em;
}



/*-------------------------------------------------------------------------------+
+ Et aussi                                                                       +
+-------------------------------------------------------------------------------*/

#et-aussi {
	background-color: #ebebeb;
	color: #727272;
}

#et-aussi .conteneur {
	padding: 30px 0 20px 0;
}

@media screen and (max-width: 767px) { /* Mobile */

	#et-aussi {
		padding: 0 10px;
	}

	#et-aussi .conteneur {
		max-width: 750px;
	}

	#et-aussi h4 {
		font-size: 1.6em;
	}

	#et-aussi h4 .cartouche-titre {
		margin-bottom: 10px;
		font-size: 0.8em;
	}

}

@media screen and (min-width: 768px) { /* Tablette + Bureau */

	#et-aussi h4 {
		position: relative;
		height: 30px;
		font-size: 2.5em;
	}

	#et-aussi h4 .cartouche-titre {
		position: absolute;
		top: -40px;
		left: 10px;
		font-size: 0.7em;
	}

}

@media screen and (min-width: 768px) and (max-width: 1220px) { /* Tablette */

	#et-aussi {
		padding: 0 10px;
	}

	#et-aussi .conteneur {
		max-width: 960px;
	}

}

@media screen and (min-width: 1221px) { /* Bureau */

	#et-aussi .conteneur {
		width: 960px;
	}

}


/* Styles communs ******************************************************/

#et-aussi .focus {
	position: relative;
}

#et-aussi .focus h2 {
	font-weight: normal;
	line-height: 1.2em;
}

#et-aussi .focus h2 span {
	display: block;
	font-weight: bold;
	text-transform: uppercase;
}

#et-aussi .focus img {
	position: absolute;
}

@media screen and (max-width: 767px) { /* Mobile */

	#et-aussi .focus {
		padding: 20px 80px 10px 0;
	}

	#et-aussi .focus h2 {
		margin-bottom: 10px;
		font-size: 1.2em;
	}
	
	#et-aussi .focus p {
		font-size: 1.1em;
	}

	#et-aussi .focus img {
		top: 20px;
		right: 0;
		width: 80px;
	}

	#et-aussi .focus .lien-puce {
		margin-top: 15px;
	}

}

@media screen and (min-width: 768px) { /* Tablette + Bureau */

	#et-aussi .conteneur:after {
		content:" ";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden
	}
	
	#et-aussi .focus {
		float: left;
		padding-bottom: 50px;
	}
	
	#et-aussi .focus h2 {
		margin-bottom: 20px;
	}

	#et-aussi .focus img {
		right: -10px;
	}

	#et-aussi .focus .lien-puce {
		margin-top: 20px;
	}

}

@media screen and (min-width: 768px) and (max-width: 1220px) { /* Tablette */
	
	#et-aussi .focus {
		width: 38%;
		min-height: 250px;
		margin: 0 3% 0 3%;
		padding-right: 6%;
	}
	
	#et-aussi .focus h2 {
		font-size: 1.6em;
	}
	
	#et-aussi .focus p {
		font-size: 1.4em;
	}

}

@media screen and (min-width: 1221px) { /* Bureau */
	
	#et-aussi .focus {
		width: 350px;
		margin: 0 30px;
		padding-right: 70px;
	}
	
	#et-aussi .focus h2 {
		font-size: 1.5em;
	}
	
	#et-aussi .focus p {
		font-size: 1.3em;
	}

}


/* Focus « Assurance Securite » */

#et-aussi #focus-assurance-securite h2 {
	color: #00abe6;
}

#et-aussi #focus-assurance-securite .lien-puce {
	background-position: left -400px;
	color: #00abe6;
}

@media screen and (min-width: 768px) { /* Tablette + Bureau */

	#et-aussi #focus-assurance-securite {
		padding-top: 40px;
	}

	#et-aussi #focus-assurance-securite img {
		top: -10px;
	}

}


/* Focus « Virement + » */

#et-aussi #focus-virement-plus h2 {
	color: #f08a00;
}

#et-aussi #focus-virement-plus .lien-puce {
	background-position: left -300px;
	color: #f08a00;
}

@media screen and (max-width: 767px) { /* Mobile */

	#et-aussi #focus-virement-plus {
		border-top: 1px solid #cfcfcf;
	}

}

@media screen and (min-width: 768px) { /* Tablette + Bureau */

	#et-aussi #focus-virement-plus {
		padding-top: 40px;
	}

	#et-aussi #focus-virement-plus img {
		top: -10px;
	}

}


/* Focus « Transfert Comptant / Credit » */

#et-aussi #focus-transfert-comptant-credit {
	border-top: 1px solid #cfcfcf;
}

#et-aussi #focus-transfert-comptant-credit h2 {
	color: #f08a00;
}

#et-aussi #focus-transfert-comptant-credit .lien-puce {
	background-position: left -300px;
	color: #f08a00;
}

@media screen and (min-width: 768px) { /* Tablette + Bureau */

	#et-aussi #focus-transfert-comptant-credit {
		padding-top: 70px;
	}

	#et-aussi #focus-transfert-comptant-credit img {
		top: 20px;
	}

}


/* Focus « Avance d'Argent » */

#et-aussi #focus-avance-argent {
	border-top: 1px solid #cfcfcf;
}

#et-aussi #focus-avance-argent h2 {
	color: #f08a00;
}

#et-aussi #focus-avance-argent .lien-puce {
	background-position: left -300px;
	color: #f08a00;
}

@media screen and (min-width: 768px) { /* Tablette + Bureau */

	#et-aussi #focus-avance-argent {
		padding-top: 70px;
	}

	#et-aussi #focus-avance-argent img {
		top: 20px;
	}

}
