html,body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,a,img,small,sub,b,dl,dd,dt,ul,li,label,article,details,footer,header,menu,nav,input,textarea,select{ background:transparent; border:0; 	outline:0; padding:0; margin:0; }
html,body{ font-family: 'Open Sans', sans-serif; font-size:1em; width:100%; height:100%; color:#1a1a1a; }
	
img, div, input, textarea {
	-webkit-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
	   -moz-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
		-ms-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
		 -o-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
			transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
}
body {overflow-x:hidden; }
.clearfix:after{ clear: both; content: " "; display: block; font-size: 0; height: 0; line-height: 0; visibility: hidden; width: 0; }
div.myhr{ clear:both; visibility:hidden; height:0px; }


/*###################################################### OVERALL ########################################################################*/
div.container{ width:980px; margin:0px auto 0px auto; }
div#header-wrap{ height:152px; }
div#header div#logo{ width:174px; height:58px; margin-top:52px; float:left; background:url(../images/vulli.jpg) top left no-repeat; }
div#accroche{ float:left; color:#6886a0; font-weight:300; font-size:1.3em; margin-top:86px; }
div#menu-wrap{ background:#b5cbde; height:102px; text-align:center; }
ul#langues{ float:right; list-style:none; font-size:0.7em; }
ul#langues li{ display:inline; }
ul#langues li a:link, ul#langues li a:visited{ color:#000; text-decoration:none; }
ul#langues li a:hover, ul#langues li a.actif:link, ul#langues li a.actif:visited{ color:#7ccfed; }
div#menu ul{ margin:0px; padding:0px; list-style:none; }
div#menu ul li{ display:inline-block; }
div#menu ul li a:link, div#menu ul li a:visited{ display:inline-block; color:#fff; height:57px; text-decoration:none; padding:45px 27px 0px 27px; }
div#menu ul li a:hover, div#menu ul li a.actif:link, div#menu ul li a.actif:visited, div#menu ul li:hover a{ background:#d0d0d0; }
div#menu ul li ul{ display:none; position:absolute; background:#d0d0d0; }
div#menu ul li:hover > ul{ display:block; left:auto; }
div#menu ul li ul li{ display:inherit; }
div#menu ul li ul li a:link, div#menu ul li ul li a:visited{ padding:10px 27px 10px 27px; text-align:left; height:auto; display:block; }
div#menu ul li ul li a:hover{ color:#000000; }

div#intro-wrap{ }
div#liens-wrap{ background:#f0f0f0; padding:42px 0px 42px 0px; }

div#footer{ text-align:center; background:#b5cbde; padding:56px 0px 30px 0px; color:#fff; }
div#footer-txt{ padding-top:40px; font-size:0.7em; }
div#footer-txt a:link, div#footer-txt a:visited{ color:#fff; text-decoration:none; }
div#footer-txt a:hover{ color:#000; }
div#footer-social{ padding-top:15px; }
div#footer-social a:link, div#footer-social a:visited{ color: #fafafa; text-decoration: none; font-size:2.2em; margin-left:5px; text-shadow: 0 1px 2px rgba(0,16,13,.36); }
div#footer-social a:hover{ color:#719abd; text-shadow: none; }

div#fjp{ border-top:solid 1px #9bb5cb; margin-top:35px; padding-top:20px; }
div#fjp a{ display:inline-block; width:101px; padding-right:30px; }

div#footer a#serviceconso:link, div#footer a#serviceconso:visited, div#footer a#espacepresse:link, div#footer a#espacepresse:visited{ display:inline-block; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; text-decoration:none; color:#000; font-weight:300; padding:20px; }
div#footer a#serviceconso:link, div#footer a#serviceconso:visited{ margin-right:40px; background:#fff url(../images/b_serviceconso.gif) right no-repeat; padding-right:87px; }
div#footer a#espacepresse:link, div#footer a#espacepresse:visited{ background:#fff url(../images/b_presse.gif) left no-repeat; padding-left:80px; }
div#footer a#serviceconso:hover, div#footer a#espacepresse:hover{ color:#719abd; }

/******** *********/
div.contenu{ text-align:justify; padding-bottom:70px; }
div.contenu h1, div#intro h2{ font-weight:300; font-size:2.6em; padding-top:80px; padding-bottom:40px; color:#000; }
div.contenu h2{ font-size:1.1em; padding-top:40px; font-weight:bold; color:#6a92b5; }
div.contenu h2.notop{ padding-top:0px; }
div.contenu strong{ font-weight:normal; color:#4294b1; }
div.contenu p{ padding-bottom:25px; line-height:1.5em; }
div.contenu .image-a-droite{ float:right; margin:0px 0px 40px 45px; }
div.contenu .image-a-gauche{ float:left; margin:0px 45px 40px 0px; }
div.cadre{ border:solid 1px #7ccfed; line-height:0; }
div.cadre img{ border:solid 2px #fff; }
div.contenu a:link, div.contenu a:visited{ color:#999999; }
div.contenu a:hover{ color:#333; }


/*###################################################### HOME ########################################################################*/
div#header div#logo h1{ font-size:0.1em; text-indent:-99998px; }

div#signature{ text-align:right; }
div#signature strong{ font-size:1.1em; }
div#signature em{ color:#ababab; }

div#liens h2{ font-weight:300; font-size:2.2em; padding-bottom:40px; color:#000; text-align:center; }
div.marque{ float:left; width:305px; margin-right:32px; background-size:100%; background-repeat:no-repeat; background-position:top center; }
div.marque a:link, div.marque a:visited{ color:#fff; text-decoration:none; font-weight:300; display:block; height:252px; width:100%; position:relative; }
div.marque strong{ position:absolute; bottom:0px; left:0px; width:100%; text-align:center; padding:10px 0px 9px 0px; }
div#slg{ background:url(../images/slg.jpg); }
div#kloro{ background:url(../images/klorofil.jpg); margin-right:0px;}
div#althir{ background:url(../images/althir.jpg); margin-right:0px; }
div#slg strong{ background:#796d6d; border-bottom:solid 7px #baafa9; }
div#kloro strong{ background:#007336; border-bottom:solid 7px #078542; }
div#althir strong{ background:#886a9c; border-bottom:solid 7px #a183b5; }

div.container#liens
{
	width: 645px;
}

/*###################################################### INTERIEUR ########################################################################*/
div#header div#logo a:link, div#header div#logo a:visited, div#header div#logo a:hover{ display:block; width:174px; height:58px; text-decoration:none; }
div#header div#logo a:link span, div#header div#logo a:visited span, div#header div#logo a:hover span{ visibility:hidden; }

div.lien{ text-align:center; }
div.lien a:link, div.lien a:visited{ text-decoration:none; background:#b5cbde; color:#fff; display:inline-block; padding:11px 30px 11px 30px; }
div.lien a:hover{ background:#d0d0d0; }

/***** Presse ******/
div.cp{ border:solid 2px #b5cbde; width:280px; float:left; margin:0px 4% 30px 0px; padding:0px; }
div.extramargin{ margin-bottom:88px; }
div.actif{ border:solid 2px #d0d0d0; }
div.cp div.vignette{ }
div.cp div.chapeau{ text-align:center; }
div.cp div.chapeau h3{ font-size:0.8em; padding:5px 0px 5px 0px; height:40px; }
div.reglements div.chapeau h3{ height:20px; }
div.reglements div.chapeau small{ display:block; padding-bottom:20px; }
div.cp div.chapeau h3 a:link, div.cp div.chapeau h3 a:visited{ text-decoration:none; }
div.cp div.chapeau h3 a.actif:link, div.cp div.chapeau h3 a.actif:visited{ color:#000; }
div.cp div.chapeau div.lien a:link, div.cp div.chapeau div.lien a:visited{ display:block; font-size:0.9em; }
div.cp div.chapeau div.lien a.actif:link, div.cp div.chapeau div.lien a.actif:visited{ background:#d0d0d0; }
div.cp div.chapeau div.lien a.url:link, div.cp div.chapeau div.lien a.url:visited{ margin-top:1px; }

div.noreglements{ padding:15px 20px; color:#fff; background:#ccc; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }

/****** Histoire *****/
div#timeline{ background:url(../images/timeline.gif) top center repeat-y; }

div.event{ padding-top:19px; clear:both; background:url(../images/event.png) top center no-repeat; min-height:46px; }
div.event strong.date{ font-weight:bold; padding-top:14px; }
div.droite strong.date{ color:#dcb151; float:left; margin-left:43%; }
div.gauche strong.date{ color:#e64e38; float:right; margin-right:43%; }
div.centre strong.date{ float:left; margin-left:53%; }
div.event div.bloc{ padding:21px 12px 15px 12px; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; font-size:0.8em; width:44%; position:relative; }
div.droite div.bloc{ border:solid 2px #ecd49f; background:#FFFFFF; float:right; }
div.gauche div.bloc{ border:solid 2px #f19e92; background:#FFFFFF; float:left; }
div.centre div.bloc{ border:solid 2px #d6e2ed; background:#FFFFFF; margin:50px auto 0px auto; width:75%; text-align:center; }
div.droite div.bloc strong{ color:#dcb151; }
div.gauche div.bloc strong{ color:#e64e38; }
div.droite div.fleche{ width:7px; height:12px; position:absolute; top:18px; left:-7px; background:url(../images/droite.png) top left no-repeat; }
div.gauche div.fleche{ width:7px; height:12px; position:absolute; top:18px; right:-7px; background:url(../images/gauche.png) top left no-repeat; }
div.centre div.fleche{ width:12px; height:7px; position:absolute; top:-7px; left:49.3%; background:url(../images/centre.png) top left no-repeat; }
div.event p{ padding:0px; }
div.event div.images{ text-align:center; padding-top:15px; }
div.event div.image{ display:inline-block; margin-right:5px; }

/********** contact *********/
div.formulaire{ width:60%; margin:18px auto 0px auto; clear:both; min-height:40px; }
div.formCourt{ width:49%; }
div.formulaire input, div.formulaire textarea, div.formulaire select{ background:#c6c7c9; padding:10px 2% 10px 2%; font-size:1em; font-family:'Open Sans', sans-serif; font-weight:normal; }
div.formulaire input.error, div.formulaire textarea.error, div.formulaire select.error{ background:url(../images/error.png); }
div.error{ background:url(../images/error.png); color:#fff; }

div.formLong select, div.formLong textarea{ width:100%; }
div.formLong textarea, div.formLong input{ width:96%; }
div.formCourt input, div.formCourt textarea, div.formCourt select{ width:96%; }
div.formLong input#politique{ width:auto; margin-right:10px; }

div.formGauche{ float:left; }
div.formDroite{ float:right; }
select option{ color:black; }
select option:first-child{ color:#fff; }
*::-webkit-input-placeholder { color:#fff; }
*:-moz-placeholder { /* FF 4-18 */ color:#fff; opacity:  1; }
*::-moz-placeholder { /* FF 19+ */ color:#fff; opacity:  1; }
*:-ms-input-placeholder { /* IE 10+ */ color:#fff; }
div#submit{ margin:40px auto 40px auto; text-align:center; }
div#submit input#sendContact{ background:#b5cbde; display:inline-block; padding:10px 50px 10px 50px; color:#fff; cursor:pointer; font-size:1em; font-family:'Open Sans', sans-serif; font-weight:normal; }
div#submit input#sendContact:hover{ background:#c6c7c9; color:#666; }
div.mentions{ color:#818181; text-align:center; font-size:0.7em; width:60%; margin:0px auto 0px auto; }

div.sav, div.rh, div.presse, div.blog{ display:none; }
div.affiche{ display:block; }
div.loader{ background:url(../images/loader.gif) center center no-repeat; width:100%; height:100%; min-height:350px; }
div#reponse{ padding-top:150px; padding-bottom:150px; font-size:1.2em; text-align:center; color:#4294b1; display:none; }

input#email{ text-transform:lowercase; }

/************ FAQ **********/
div#faq dl dt{ background:#b5cbde; color:#fff; padding:11px 0px 11px 20px; margin-top:2px; position:relative; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; }
div#faq dl dt:after{ content:"\f13a"; font-family:FontAwesome; color:#719abd; font-size:22px; position:absolute; top:10px; right:10px; }
div#faq dl dt.ouvert{ color:#333; background:#ccc; }
div#faq dl dt.ouvert:after{ content:"\f139"; color:#fff; }
div#faq dl dt:hover{ color:#333; background:#ccc; cursor:pointer; }
div#faq dl dd{ padding:30px 50px 10px 60px; background:#f9f9f9; font-size:0.9em; display:none; }

/************ SAV WETRANSFER **********/

div.sav-info
{
	background-image: url(../images/sav-icon.png);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 100px 100px;
	width: 45%;
	padding: 25px 0;
	padding-left: 115px;
	
	color: #4294b1;
	display: none;
}

div.sav-lien
{
	margin-top: 20px;
}

div.sav-lien a
{
	color: #4294b1;
	font-weight: bold;
	text-decoration: none;
}

div#reponse
{
	padding-top: 0;
}

/*###################################################### RESPONSIVE ########################################################################*/
@media only screen and (max-width: 959px) {
	div.container{ width:98%; }
	div#menu-wrap{ height:62px; }
	div#menu ul li a:link, div#menu ul li a:visited{ height:37px; padding:25px 12px 0px 12px; }
	
	div.marque{ float:none; width:230px; margin-right:10px; display:inline-block; }
	div.marque a:link, div.marque a:visited{ height:220px; }
	div.marque strong{ font-size:0.9em; }
	
	div.cp{ width:45%; text-align:center; }
}

@media only screen and (max-width: 767px) {
	div#header div#logo{ margin-top:30px; }
	div#accroche{ margin-top:10px; width:100%; }

	div#menu-wrap{ display:none; }
	
	div.marque{ float:none; width:230px; margin:0px auto 10px auto !important; display:block; }
	
	div.event{ padding-top:12px; }
	div.event strong.date{ padding-top:20px; }
	div.droite strong.date{ margin-left:53%; }
	div.gauche strong.date{ float:left; margin-left:53%; margin-right:auto; }
	div.droite div.bloc, div.gauche div.bloc, div.centre div.bloc{ float:none; margin:50px auto 0px auto; width:90%; text-align:center; }
	div.event div.fleche{ display:none; }
	
	div#footer a#serviceconso:link, div#footer a#serviceconso:visited, div#footer a#espacepresse:link, div#footer a#espacepresse:visited{ display:block; margin:0px auto 5px auto; width:65%; float:none; }
}

@media only screen and (max-width: 479px) {
	div#header div#logo{ margin-top:20px; }
	div#accroche{ font-size:1.1em; margin-top:10px; }
	
	div.formulaire{ width:90%; }
	div.formCourt{ width:100%; margin-bottom:18px; }
	
}