/* -- RESET */

@charset "utf-8";
tml, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    vertical-align:baseline;
    background:transparent;
}

body {
     font-size:10px; font-family:'Open Sans', Arial, Helvetica, sans-serif;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#000;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#000;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/* perso */
.left{ margin:0; padding:0; float:left}
.right{ margin:0; padding:0; float:right}
.spacer{ margin:0!important; padding:0!important; clear:both!important; font-size:0!important; line-height:0!important; height:0px!important; float:none!important; display:block!important}
ul li.spacer{ margin:0!important; padding:0!important; clear:both!important; font-size:0!important; line-height:0!important; height:0px!important; float:none!important; display:block!important}
a img{ border:none; margin:0; padding:0;}
img{ margin:0; height:auto;
    padding:0;
    border:0;
    outline:0;}
a{ text-decoration:none; outline:none;}
a:hover{ color:#99ccff}
textarea{ font-size:13px; color:#999999}

/* -- CSS Document */

/* web integration */
body {background:white;}
/*html {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	overflow-y: hidden;
	border: 0 none;
}*/
/* */

.color2{ color:#a21d2d}
.color1{ color:#00b0ea}

/* etape 1 */
.etape1{ margin:0 auto; width:810px; background:url(/E55G4sz/images/steps/step1_2.jpg) top center no-repeat; height:673px; padding:0; position:relative}
.etape1 .fourBtt{ position:absolute}
.etape1 .btn-participate{ display:block; width:231px; height:53px; background:url(/E55G4sz/images/steps/btn-participate.png) top left no-repeat; left:290px; top:295px}
.etape1 .btn-participate:hover{ background-position:bottom left;}

/* etape 2 */
.etape2{ margin:0 auto; width:810px; background:url(/E55G4sz/images/steps/step3.jpg) top center no-repeat; height:634px; padding:0; position:relative}
.etape2 .blocTexte1{ text-transform:uppercase; color:#00b0ea; font-size:15pt; text-align:center; margin-top:35px; }
.etape2 .blocTexte2{ color:#5b5b5b; margin:30px 0 0 0; padding:0 11px; font-size:14pt; text-align: center; }
.etape2 .blocTexte3{ color:#5b5b5b; margin:20px 0 0 0; padding:0 11px; font-size:12pt; text-align: center; }
.etape2 .btn-participate{ display:block; width:231px; height:53px; background:url(/E55G4sz/images/steps/btn-participate.png) top left no-repeat; margin:auto; margin-top:35px; }
.etape2 .fbLike { width:140px; height:140px; background:#e8e4e1; border-radius:140px; margin-left:auto; margin-right:auto; margin-top:30px; line-height:140px; position:relative; 
  -webkit-animation: pulse 1s ease infinite;
  -moz-animation: pulse 1s ease infinite;
  -ms-animation: pulse 1s ease infinite;
  -o-animation: pulse 1s ease infinite;
  animation: pulse 1s ease infinite;
}
.etape2 .fbLikeButton { left:50%; margin-left:-35px; margin-top:-14px; position:absolute; top:50%; line-height:28px; }

/* etape 3 */
.etape3{ margin:0 auto; width:810px; background:url(/E55G4sz/images/steps/step3.jpg) top center no-repeat; height:634px; padding:0; position:relative}
.formOffre{ width:349px; background-color:white; border-radius: 15px; min-height:480px; margin-top:33px; margin-right: 20px; }
.formOffre p.titreForm{ text-align:center; margin-top:14px;}
.formOffre>form{ }
.formOffre p.titreInForm{ text-align:center; margin:25px 0 30px; color:#00b0ea; font-size:20px; display:block; font-weight:700; text-transform:uppercase}
.formOffre fieldset{ width:330px; margin:15px auto 0;}
.formOffre fieldset p{ margin-bottom:9px;}
.formOffre fieldset p.field {float:left; display:block; width:330px;}
.formOffre fieldset p.field label{ font-size:11pt; color:#00b0ea; display:block; width: 80px; float: left; padding-right:13px; text-align:right; line-height: 31px;}
.formOffre fieldset p.field input{ margin:0; width:200px; font-size:10pt; display:block; float:left; height:31px;}
.formOffre fieldset p.field input[type="text"] { background-color: rgba(0, 0, 0, 0.1); border: none; padding:0 6px; color: #5b5b5b; }
.formOffre fieldset p.field.date label{ line-height: normal;}
.formOffre fieldset p.field select { border: 0; background-color: rgba(0,0,0,0.1); color: #5b5b5b; height: 31px; padding: 0 1px; } 
.formOffre fieldset p.field.date select { margin-top:3px; } 
.formOffre fieldset p.field select.date{ /*width:57px*/}
.formOffre fieldset p.field select.mois{ /*width:94px*/}
.formOffre fieldset p.field select.annee{ /*width:66px;*/ margin-right:0}
.formOffre fieldset p.field.department select { width: 212px; }
.formOffre fieldset input.submit{ display:block; padding:0; background:none; border:none; width:232px; height:53px; background:url(/E55G4sz/images/steps/btn-participate.png) top left no-repeat; margin:2px auto 0; cursor:pointer;}
.formOffre fieldset input.submit:hover{ background-position:bottom left;}
.formOffre fieldset p.form-submit { margin-top: 20px; }

.formOffre fieldset p.terms{ padding-left:14px; width:316px; float:left; display:block; }
.formOffre fieldset p.terms label { font-size:10pt; display: block; padding-left: 15px; text-indent: -15px; float: left; width: 280px; color: #5b5b5b;}
.formOffre fieldset p.terms label a { color: #00b0ea; text-decoration: underline; }
.formOffre fieldset p.terms label input[type="checkbox"] { width: 13px; height: 13px; padding: 0; margin:0; vertical-align: bottom; position: relative; top: -1px; *overflow: hidden; }

/* - form validatation */
.formOffre p p.error
{
	padding: 5px;
	color: white;
	background-color: #E4685A;
	text-align: center;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
}

.formOffre p span.error,
.formOffre p span.no-error,
.formOffre p span.empty
{
	display: block;
	float: right;
	width: 19px;
	height: 19px;
	margin-top: 3px;
	vertical-align: middle;
}

.formOffre p.date span.error,
.formOffre p.date span.no-error,
.formOffre p.date span.empty
{ margin-top: 9px; }

.formOffre p span.error{ background-image: url('/E55G4sz/images/icon-error.png'); }

.formOffre p span.no-error{ background-image: url('/E55G4sz/images/icon-check.png'); }

.formOffre p span.empty{ background-image: url('/E55G4sz/images/icon-empty.png'); }

.formOffre p span.error span.info,
.formOffre p span.no-error span.info,
.formOffre p span.empty span.info
{
	font-size: 10pt;
	display: none;
	text-align: center;
	color: white;
	padding: 5px;
	background-color: #E4685A;
	width: 120px;
	position: relative;
	top: 22px;
	left: -135px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
}

.formOffre p span.error:hover span.info,
.formOffre p span.no-error:hover span.info,
.formOffre p span.empty:hover span.info { display: inline-block; }

/* etape 4 */
.etape4{ margin:0 auto; width:810px; background:url(../images/steps/step3.jpg) top center no-repeat; padding:0; height:634px; position:relative}
.etape4 .contentEtap4{ height:528px; position:relative; padding:1px 0; overflow:hidden}
.etape4 .blocTitre{ text-transform:uppercase; color:#00b0ea; font-size:30pt; text-align:center; margin-top:15px; }
.etape4 .blocTexte1{ color:#5b5b5b; font-size:15pt; text-align:center; margin-top:15px; }
.etape4 .blocTexte2{ color:#5b5b5b; margin:15px 0 0 0; padding:0 11px; font-size:14pt; text-align: center; }
.etape4 .blocTexte2 strong { color:#00b0ea; }
.etape4 .voirHotel { margin:15px auto 0 auto; width:314px; text-align:center}
.etape4 .voirHotel a{ display:block; width:231px; height:53px; margin:0 auto; background:url(../images/steps/btn-voir-hotel.png) top left no-repeat}
.etape4 .voirHotel a:hover{ background-position:bottom left;}
.etape4 .shareTitle{ margin:340px 0 20px 0; color: white; font-size:16pt; width: 396px; margin-left: auto; margin-right: auto; padding: 10px 0; background-color: rgba(13, 92, 172, 0.5);}
.etape4 .linkToSMO{ margin:15px auto 0 auto; padding:0; width: 330px;}
.etape4 .linkToSMO img{ margin:0 2px;}

/* error page */
.errorpage{ margin:0 auto; width:810px; background:url(/E55G4sz/images/steps/step3.jpg) top center no-repeat; height:634px; padding:0; position:relative;}
.errorpage .blocTexte1{ text-transform:uppercase; color:00b0ea; font-size:15pt; text-align:center; margin-top:35px; }
.errorpage .blocTexte2{ color:#5b5b5b; margin:40px 0 0 0; padding:0 11px; font-size:12pt; text-align: center; }

/* footer */
/*.partenaire{ font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:19px; text-transform:uppercase; padding-bottom:30px; border-bottom:1px dotted #CCC}
.partenaire img{ margin:0 40px; position:relative; top:15px;}*/

.titrePartenaire{ font-size:13px; color:#333; font-weight:bold; text-transform:uppercase; padding:0; text-align:center; margin-top:15px;}
.titrePartenaire span.tiretPartenaire{ display:block; margin:0; padding:0; height:1px; background-color:#CCC;}
.partenaire{ padding:5px 15px; position:relative; top:-8px; background-color:#FFF}
.listePartenaire{ padding-bottom:25px; border-bottom:1px dotted #CCC}
.listePartenaire img{ margin:0 40px; position:relative; top:10px;}

.footer{ width:810px; margin:0 auto}
.linkFooter{ padding:20px 0 0 0; font-size:11px; color:#999; text-align:center;}
.linkFooter a{ font-size:16px; color:#00b0ea;}
.linkFooter a:hover{ color:#666;}

.social{ font-size:13px; margin-bottom:10px; color:#333}
.social .socialElement{ vertical-align: middle; }
.social .socialLeft{ margin-left: 20px; }
.social .socialLeftShare{ margin-left: 35px; }

/* popup style*/

body.contentPopup{ width:625px; margin:auto; background-color:#FFFFFF; text-align:justify; font-size:14px; }
.contentPopup ul { margin-left:16px; }
.contentPopup h1{ font-size:14pt; margin-bottom:25px; margin-top:10px; text-transform:uppercase; text-align: center; }
.contentPopup h2{ font-size:11pt; }
.contentPopup h1, h2{ color:#0070C7; font-weight:lighter; font-family:Helvetica, Arial, sans-serif; }
.contentPopup .content{ padding: 0 20px; color:#505050; }
.contentPopup header{ background: url('/E55G4sz/images/popup/header-popup.jpg') no-repeat; text-align:center; height:178px;}
.contentPopup p{ margin: 14px 0; font-size: 11pt; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; }

/* dotation */
.contentDotation p{margin:0px 0; font-size:15px; padding:45px 0}
.contentDotation p.teto{ padding:0; margin:10px 0 28px 0; text-align:center; font-size:12pt;}

.contentDotation .lot1{ background:url(/E55G4sz/images/popup/lots/garmin.jpg) right center no-repeat;}
.contentDotation .lot2{ background:url(/E55G4sz/images/popup/lots/cgr.jpg) right center no-repeat;}
.contentDotation .lot3{ background:url(/E55G4sz/images/popup/lots/automobile-magazine.jpg) right center no-repeat;}
.contentDotation .lot4{ background:url(/E55G4sz/images/popup/lots/vinci.jpg) right center no-repeat;}

.formDn {
	display:none;
}

/* finished */

.finished {
	width:331px; background:url(/E55G4sz/images/bg_form.png) top left no-repeat; height:403px; margin-top:93px; padding:20px;
	font-size:16px;
	text-align:center;
}
.finished h2 {
	font-size:20px;
}

.finished .trouverStage{ width:337px; text-align:center}
.finished .trouverStage a{ display:block; width:337px; height:70px; margin:0 auto; background:url(../images/btt-7.png) top left no-repeat}
.finished .trouverStage a:hover{ background-position:bottom left;}

.finished .listeGagnants{ width:337px; text-align:center}
.finished .listeGagnants a{ display:block; width:337px; height:70px; margin:0 auto; background:url(../images/btt-7-gagnants.png) top left no-repeat}
.finished .listeGagnants a:hover{ background-position:bottom left;}


/* CCS animations */

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
  }

  25% {
    -webkit-transform: scale(1.1);
  }

  50% {
    -webkit-transform: scale(1);
  }

  100% {
    -webkit-transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -moz-transform: scale(1);
  }

  25% {
    -moz-transform: scale(1.1);
  }

  50% {
    -moz-transform: scale(1);
  }

  100% {
    -moz-transform: scale(1);
  }
}

@-ms-keyframes pulse {
  0% {
    -ms-transform: scale(1);
  }

  25% {
    -ms-transform: scale(1.1);
  }

  50% {
    -ms-transform: scale(1);
  }

  100% {
    -ms-transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -o-transform: scale(1);
  }

  25% {
    -o-transform: scale(1.1);
  }

  50% {
    -o-transform: scale(1);
  }

  100% {
    -o-transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.1);
  }

  100% {
    transform: scale(1);
  }
}