@charset "UTF-8";

@font-face {
    font-family: 'QuestrialRegular';
    src: url('../fonts/Questrial/questrial-regular-webfont.eot');
    src:url('../fonts/Questrial/questrial-regular-webfont.woff') format('woff'),
		url('../fonts/Questrial/questrial-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Questrial/questrial-regular-webfont.ttf') format('truetype'),
        url('../fonts/Questrial/questrial-regular-webfont.svg#QuestrialRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* ###########################################################
######################## RESET CSS - DEBUT ###################
########################################################### */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
audio { height: 0; width: 0; }
a, a:link, a:visited, a:hover, a:focus, a:active, img { border:0; outline:none; } /* Pour éviter le outline sur IE7 et IE8 sur le active, et le focus */
strong { font-weight: bold; }
em { font-style: italic; }
sup { vertical-align: super; }
sub { vertical-align: sub; }


body {
	background: #666666;
    font-family: 'QuestrialRegular';
	font-size: 0.8em; /* Soit 80% de la taille de la police par défaut du navigateur (par défaut 16px) - Voir http://riddle.pl/emcalc/ pour calculer la taille des polices en cascade */
	color: #10110e; /* Couleur des texte dans Speedsales */
	margin: 0;
	padding: 0;
	text-align: justify;
	overflow: hidden;
}

* a, .selected {
	color: #a67340;
	text-decoration: none;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}


* a:hover, .selected:hover {
	color: #a67340;
	text-decoration: underline;
}
h1 {
	font-size: 2em;
	color: black;
	text-align: left;
	margin-bottom: 15px;
	padding: 25px 0 20px 0;
	border-bottom: 1px solid black;
}

h2 {
	font-size: 1.4em;
	color: black;
	text-align: left;
	padding: 20px 0;
	clear: both;
}

h2.h2ColonneDroite {
	font-size: 2em;
	text-align: left;
	color: black;
	margin-bottom: 15px;
	padding: 0 0 20px 0;
	border-bottom: 1px solid black;
}

h2.h2ColonneDroite img {
	padding-right: 10px;
}


p{
	padding: 10px 0;
	line-height: 1.3em;
}

.tableauContenu ul {
	margin: 5px 0 20px 20px;
	list-style: none;
}

.tableauContenu ul li {
	padding: 4px 0;
	list-style-image: url("../images/content/bullet.png");
	line-height: 1.1em;
}



.app-wrapper {
	position: relative;
}
.app-loader {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 100000;
}
.app-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	z-index: 10000;
}


.popChoix {
	width: 100%;
	height: 100%;
	background: url("../images/accueil/backgroundNuage.jpg");
	position: relative;
	z-index: 1001;

    -webkit-background-size: cover; /* pour Chrome et Safari */
    -moz-background-size: cover; /* pour Firefox */
    -o-background-size: cover; /* pour Opera */
    background-size: cover; /* version standardisée */
 
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='../images/content/bkg-contenu.jpg',
    sizingMethod='scale');

    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='../images/content/bkg-contenu.jpg',
    sizingMethod='scale')";


}


.popChoix2 {
	width: 100%;
	height: 100%;
	/*background: url("../images/accueil/backgroundNuage.jpg");*/
	position: absolute;
	z-index: 0;
 	/*background: #00ff00;*/
  	-webkit-background-size: cover; /* pour Chrome et Safari */
    -moz-background-size: cover; /* pour Firefox */
    -o-background-size: cover; /* pour Opera */
    background-size: cover; /* version standardisée */
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='../images/content/bkg-contenu.jpg',
    sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='../images/content/bkg-contenu.jpg',
    sizingMethod='scale')";
}

.parallax-viewport {
    position: relative;     /* relative, absolute, fixed */
    overflow: hidden;
}
.parallax-layer {
    position: absolute;
}

#port{
	top: 50%;
    height: 200px;
    left: 0;
    position: fixed;
    right: 0;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ###########################################################
###################### SPEEDNEWS POPUP #######################
########################################################### */
.QESizePhoto {}
#backgroundImagesAdministration .QESizePhoto {}

#fancybox-overlay { position:fixed !important; }

a#showBackgroundImagesAdministration { 
    z-index: 100000; 
    position: fixed; 
    top: 30px; 
    right: 30px; 
    
    background-color : #ff8500; 
    color: #fff; 
    text-decoration: none; 
    
    padding: 10px 20px;
    font-family: Verdana;
    font-size: 15px;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6),
                inset 1px 1px 1px rgba(255, 255, 255, 0.6),
                inset 3px 6px 6px rgba(255, 255, 255, 0.5),
                inset -3px -6px 6px rgba(0, 0, 0, 0.2);
}
a#showBackgroundImagesAdministration:hover {
    background-color : #f00;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0),
                1px 1px 1px rgba(0, 0, 0, 0.6),
                inset 1px 1px 1px rgba(255, 255, 255, 0.6),
                inset 3px 6px 6px rgba(255, 255, 255, 0.5),
                inset -3px -6px 6px rgba(0, 0, 0, 0.2);
}

#backgroundImagesAdministration {
    width: 500px;
}
#backgroundImagesAdministration img {
    max-width: 500px;
    width: 500px;
    height: auto;
}

div#backgroundImagesAdministration p {
    font-family: Verdana;
    font-size: 40px;
    margin: 15px 0;
}

/*header ici*/




/* ###########################################################
###################### CONTENT ################################
########################################################### */
#content {}
.tableauGlobal {}
.tableauContenu {
	width: 100%;
	padding-top: 97px;
	overflow: auto;
}
.colonneGauche {
	overflow: hidden;
	float: left;
	position: absolute;
	width: 340px;
	background: white;
	height: 100%;
	-webkit-box-shadow:  0px 5px 5px 0px rgba(0, 0, 0, 1);
	/*box-shadow:  0px 5px 5px 0px rgba(0, 0, 0, 1);*/
	box-shadow: -1px 1px 15px 1px rgba(0, 0, 0, 1);
}

.containerWrapperContenu {
	left: 340px;
	right: 0;
	-webkit-box-shadow:  0px 5px 5px 0px rgba(0, 0, 0, 1);
	box-shadow:  0px 5px 5px 0px rgba(0, 0, 0, 1);
    z-index: 0;
    top: 110px;
    bottom: 35px;
    background: white;
    position: absolute;
}

.wrapperContenu {
	width: 10000px;
}

.blocTxtGauche {
	margin: 0 15px 30px 5px;
	width: 310px;
	overflow: hidden;
	position: relative;
}

.blocTxtGaucheBas {
	margin: 0px 15px 30px 15px;
	width: 310px;
	overflow: hidden;
	position: fixed;
	bottom: 30px;
}

.bkgWhite {
	background: url("../images/content/bkg-bloc-col-gauche.png") repeat center top;
	padding: 10px;
}

.photoBlocGauche {
	height: 235px;
	width: 130px;
	background-color: #d1a267;
	margin-right: 10px;
	float: left;
}

.photoBlocGauche span {
	padding: 0 0 5px 5px;
	display: block;
}

.photoBlocGauche p {
	padding: 10px 5px 5px 5px;
	height: 35px;
	font-size: 11px;
}

.bkgPhotoColGauche {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	height: 100%;
	width: 100%;
}

.bkgPhotoColGauche img {
	height: 100%;
	width: auto;
}

.txtBlocGauche {
	float: left;
	width: 165px;
	text-align: center;
}

.txtBlocGauche p {
	padding-top: 10px;
	font-size: 14px;
	line-height: 16px;
}

.txtBlocGauche img {
	float: left;
}

img.guillemetsBottom {
	float: right;
}

.contenu {
	/*padding-top: 100px;*/

	bottom: 50px;
    position: absolute;
    top: 60px!important;
    width: 100%;

    background: #FFF;
}

.gauche {
	width: 610px;
	margin: 0 75px;
	float: left;
}

.droite {
	width: 410px;
	/*margin: 0 75px 0 0;*/
	float: left;
}

.motPresident {
	background: #ceaf6c;
	padding: 20px;
	margin-bottom: 10px;
	overflow: hidden;
}


.motPresident ul li {
	list-style: disc;
}

.motPresident a {
	color: white;
	text-decoration: none;
}

.motPresident a:hover {
	color: black;
	text-decoration: underline;
}

.photoPadding {
	padding-bottom: 10px;
}

.photoPadding img {
	width: 100%;
	height: auto;
}


.bloc100 {
	width: 90%;
	margin: 0 4%;
}



.scrollTxt {
    height: 545px;
    overflow: hidden;
}


/* ###########################################################
###################### FOOTER ################################
########################################################### */
footer, .conteneurStaff {
	background-color:#fff;
	position: fixed; 
	bottom: 30px;
	width:100%;
	display:block;
	-webkit-box-shadow: 5px 0px 0px 0px rgba(0, 0, 0, 1);
	box-shadow: 5px 0px 5px 0px rgba(0, 0, 0, 1);
}

#contentFooter {
	width:980px;
	margin:0 auto;
	line-height: 1.8em;
	font-size: 0.9em;
	padding: 20px 0 0 0;
	display: none;
}

.titresFooter {
	padding:0 0 15px 0;
	font-size: 1.2em;
	color:black;
}

.titresFooterLangue, .titresFooterNewsletter {
	padding:0;
	font-size: 1.2em;
	color:black;
}

.langues {
	padding: 0 0 15px 0;
}

.blocAdresse {  
	background-color:#d1a267;
	padding:20px; 
	width:220px; 
	height: 195px;
	float:left;
	margin-right: 20px;
}



.blocAdresse p {  
	padding: 5px 0;
}

.blocAdresse a { 
	color:#000; 
	text-decoration:none;
}
.blocAdresse a:hover { color:#fff;}

.blocNavigationHTML { 
	background-color:#d1a267;
	padding:20px; 
	width:190px; 
	height: 195px;
	float:left;
	margin-right: 20px;
}
.blocNavigationHTML a { 
	color:#000; 
	text-decoration:none;
}
.blocNavigationHTML a:hover { color:#fff; text-decoration:none;}
.blocNavigationHTML ul { list-style:none; padding:0; margin:0;}

.blocServices {
	background-color:#d1a267;
	padding:20px; 
	width:410px; 
	height: 195px;
	float:left;
}


.blocLiensUtiles { width:195px; float:left;}
.blocLiensUtiles a { 
	color:#000; 
	text-decoration:none;
}
.blocLiensUtiles a:hover { color:#C03;}



.blocLanguesNewsletter {
	background-color:#d1a267;
	width:195px; 
	float:left;
}

.blocServices a {
	color: black;
	text-decoration: none;
}


.blocServices a:hover {
	color: white;
	text-decoration: none;
}
.blocNewsletter { 
	width:220px; 
	float:left; 
	height:auto; 
}

.txtSearch {
	float: left;
	height: 30px;
	line-height: 30px;
	color:white;
	font-size: 1.2em;
	padding-left: 30px;
}

.search-form .champsTexte {
	width: 840px;
	height: 20px;
	border: none;
	margin: 5px 0 0 10px;
	padding-left: 5px;
	color: #fff;
	border-bottom: 1px solid white;
	background: none!important;
}

.search-form .iconLoupe {
	background: url(../images/footer/loupe2.png) no-repeat center top;
	height: 28px;
	width: 28px;
	border: none;
	cursor: pointer;
	padding: 0 0 10px 0;
	margin-left: 10px;
	text-indent: -9999px;
   
	webkit-transition-duration: 300ms;
	-moz-transition-duration: 300ms;
	-o-transition-duration: 300ms;
	-ms-transition-duration: 300ms;
	transition-duration: 300ms;
}

@-moz-document url-prefix()
{
    .search-form .iconLoupe {
         padding-top: 3px;
    }
}


.loupe {
	width: 20px;
	height: 35px;
	line-height: 35px;
	padding-top: 8px!important;
}



.loupe a img.rotateLoupe {
	webkit-transition-duration: 300ms;
	-moz-transition-duration: 300ms;
	-o-transition-duration: 300ms;
	-ms-transition-duration: 300ms;
	transition-duration: 300ms;
}

.loupe:hover a img.rotateLoupe {
	-webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    transform: rotateY(360deg);
}

.search-form .iconLoupe:hover {
	background: url(../images/footer/loupe2.png) no-repeat center top;
}


.btnOuvrirSearch { 
	color: #FFF;
	width: 50px;
	height: 36px;
	font-size: 2em;
	display: block;
	line-height: 36px;
	float: right;
	text-align: center;
	text-decoration: none;
	webkit-transition-duration: 300ms;
	-moz-transition-duration: 300ms;
	-o-transition-duration: 300ms;
	-ms-transition-duration: 300ms;
	transition-duration: 300ms;
}


.btnOuvrirSearch:hover { 
	background-color: white;
	color: #41454a;
}

.tableauCredits { font-size: 1em; float:left; width:100%; margin:10px 0;}
.tableauCredits a { color:#000; text-decoration:none;}
.tableauCredits a:hover { color:#C03;}

#btnFermerFooter, #btnFermerStaff { 
	background:#d1a267; 
	color:#000; 
	width:100px; 
	height:30px; 
	display:block; 
	line-height:2.5em; 
	float:right; 
	margin-top:-50px; 
	text-align:center; 
	text-decoration:none;
}
#btnFermerFooter:hover, #btnFermerStaff:hover { color:#fff;}


#footerFixed { 
	position:fixed; 
	bottom:0; 
	width:100%; 
	height: 36px;
	line-height: 36px;
	-webkit-box-shadow: 5px 0px 0px 0px rgba(0, 0, 0, 1);
	box-shadow: 5px 0px 5px 0px rgba(0, 0, 0, 1);
	background: #d1a267;

}
#contentFooterFixed {width:980px; margin:0 auto;}

#contentFooterFixed ul li {
	float: left;
	margin-right: 1px;
	padding: 0;
	list-style: none;
	font-weight: bold;
}

#contentFooterFixed ul li a, #contentFooterFixed ul li a:visited {
	display: block;
	color: #000;
	font-size: 1em;
	text-decoration: none;
	padding: 0 6px;
}

#contentFooterFixed ul li a:hover,  #contentFooterFixed ul li a.current{
	color: #fff;
}

.tableauCredits, .tableauCredits a { text-align:center; color: #000;}

.tableauCredits a:hover { text-align:center; color: #a67340;}



#blocSearch {
	width: 100%;
	display: none;
	position: fixed;
	bottom: 33px;
}

#contentSearch {
	width: 470px;
	margin: 0 auto;
	height: 40px;
	line-height: 40px;
	background: #16255b;
}

.de #contentSearch {
	width: 530px;
	margin: 0 auto;
	height: 40px;
	line-height: 40px;
	background: #16255b;
}








.conteneurStaff {
	height: 240px;
	display: none;
}


.conteneurStaff .conteneur{
	width: 980px;
	margin : 0 auto; 
}


.conteneurStaff .conteneur table {
}


.conteneurStaff .conteneur #btnFermerStaff { 
	margin-top:-30px; 
}

/* ###########################################################
######################## SPEEDMAILING ########################
########################################################### */


#module_emailing_auto { 
	z-index: 1000; 
	padding:0 ;
 }

#contentSearch p {
	float: left;
	padding-left: 20px;
	padding-right: 20px;
	color: white;
}


.moduleSpeedMailing3 {

	width: 500px;
}

 .emailing {
 	float: left;
 	width: 230px;
 }

/* BOUTON INFO + CLOSE */

.emailingauto_img_infos { width:24px; float:left; margin-left:14px; margin-top:6px;}

.tooltip_close {display:block;float:right;}

.radio { margin:0; padding:0;}

#emailingauto_button {
	width: 30px;
	height: 30px;
	background: url("../images/footer/ok-emailing.png") no-repeat center bottom;
	margin-left: 10px;
	border: none;
	display:block;
	cursor:pointer;
	float:left;
	margin-top: 2px;
	text-indent: -9999999px;
}

#emailingauto_button:hover {
	background: url("../images/footer/ok-emailing.png") no-repeat center bottom;
	color:#000000;
	text-indent: -9999999px;
}

/* BOUTON SE DESINSCRIRE */
#emailingauto_button_desinscrire {
	height:24px;
	color:#000;
	background-color: #fff;
	margin-top:5px;
	border: none;
	display:block;
	cursor:pointer;
	width:150px;
	float:left;
	font-size: 1.0em;
	border: 1px solid #000;
}

#emailingauto_button_desinscrire:hover {
	background-color: #c5c8cc;
	color:#000000;
}

/* TOOLTIP */
.emailingauto_tooltip {
	border: 5px solid #fff;
	padding: 10px;
	line-height: 1.5em;
	font-size: 0.9em;
	text-align:left;
	background-color: #a67340;

	-webkit-box-shadow:0 -2px 4px rgba(0,0,0,0.4);
	-o-box-shadow:0 -2px 4px rgba(0,0,0,0.4);
	-moz-box-shadow:0 -2px 4px rgba(0,0,0,0.4);
	box-shadow:0 -2px 4px rgba(0,0,0,0.4);

}

.emailingauto_tooltip a {color:red; text-decoration:underline; cursor: pointer;}
.emailingauto_tooltip a:hover {color:#000000;text-decoration: underline;}
.emailingauto_tooltip_unsubscribe input {width: 120px;padding-bottom:0;}

/* MESSAGES */
.emailing_auto_message_success, .emailing_auto_confirm_text .success {color:#000000;}
.emailing_auto_message_error, .emailing_auto_confirm_text .error {color:#000000;}
.emailing_auto_confirm_title {color:black;font-size: 1em;padding-top: 100px;}
.emailing_auto_confirm_text {padding-bottom: 50px;}

/* CHAMPS EMAIL */
#emailingauto_email {width:140px; padding:5px; color:#000; border:none; background-color:#fff; margin:5px 0; float:left; border:1px solid black;}
#emailingauto_email_unsubscribe {width:160px; padding:5px; color:#000; border:none; background-color:#fff; margin:5px 0;
	border: 1px solid #000;}

#emailingauto_email:hover, #emailingauto_email_unsubscribe:hover { background-color:#c5c8cc; color: black;}

/* NE PAS TOUCHER LES CLASSES CI-DESSOUS */
#emailingauto_tooltip {position: absolute;display: none;z-index:20000; width:225px;}
#emailingauto_tooltip_unsubscribe {position: absolute;display: none;z-index:20000 ; width: 220px!important; padding-bottom:10px;  font-size: 0.9em; overflow: hidden;}
#emailingauto_tooltip_unsubscribe div { float:left; margin: 0; }
#emailingauto_tooltip_unsubscribe div.moduleSpeedMailingTooltipUnsubscribe1 { float:right;}
#emailingauto_tooltip_unsubscribe div.moduleSpeedMailingTooltipUnsubscribe2,
#emailingauto_tooltip_unsubscribe div.moduleSpeedMailingTooltipUnsubscribe3,
#emailingauto_tooltip_unsubscribe div.moduleSpeedMailingTooltipUnsubscribe5

 { clear:both; float: left; }
 
#emailingauto_tooltip_unsubscribe div.moduleSpeedMailingTooltipUnsubscribe7, #emailingauto_tooltip_unsubscribe div.moduleSpeedMailingTooltipUnsubscribe8
 { float: left; }

.ModuleSMHide {  }

#emailing_auto_trad_erreur {
	clear:both;
}

/* ###########################################################
######################## SPEEDSEARCH #########################
########################################################### */

#divSpeedSearch {
	float:left;
	width:180px;
	margin:5px 0 0 0;
}

.rechercheSpeedsearch {
	cursor: pointer;
	width: 150px;
	height: 20px;
	padding: 0 5px;
	margin: 0;
	border:none;
	background-color: #eee;
	float:left;
}

.boutonSpeedsearch { width:20px; height:20px; display:block; background: #fff url(../images/speed-search-loupe.png) no-repeat center top; float:left;}
.boutonSpeedsearch:hover { background-color:#09F;}





.tableau{
	width: 100%;
	border: none;
	border-collapse:collapse;
	padding:0px;
	border-spacing: 0px;
}

.tableau img {
	border:0;
}

.centreLinguisitque iframe{
	width: 100%;
}





/* ###########################################################
#################### Pour  accessibilite #####################
########################################################### */
span.ital{
	font-style: italic;
}
span.signature{
	font-weight: bold;
}

#fancybox-left-ico, #fancybox-right-ico {
	text-indent: -999px;
}
