@charset "utf-8";
/* CSS Document */
@import 'https://fonts.googleapis.com/css?family=Lato:300,400|Signika:300,400,600';


#_BULLE { background:#111; color:#FFF; font-size:12px; position:absolute; border-radius:3px; z-index:99999999; max-width:300px; font-weight:700;  line-height:16px;  text-transform:uppercase;  font-family:"Signika", Arial, Helvetica, sans-serif; }
#_BULLE_ARROW { position:absolute; z-index:9999999; background:url(../images/pictos/losange.svg) no-repeat; margin:1px;}
#_BULLE_ARROW.UP { height:7px; width:13px; background-position:0 -6px; transform:scale(1.3,2)}
#_BULLE_ARROW.DOWN { height:7px; width:13px; background-position:0 0; transform:scale(1.3,2)}
#_BULLE_ARROW.RIGHT { height:13px; width:7px; background-position:0 0; transform:scale(2,1.3)}
#_BULLE_ARROW.LEFT { height:13px; width:7px; background-position:-6px 0; transform:scale(2,1.3)}

#_BULLE.UP {  text-align:center;}
#_BULLE.DOWN {   text-align:center;}
#_BULLE.RIGHT { }
#_BULLE.LEFT {}

.encart { padding:15px 50px 15px 15px; font-family:"Signika", Arial, Helvetica, sans-serif; background:#FFF url(../images/pictos/warning.png) no-repeat right center; border:1px solid #D2D4D6; font-size:15px;}

body { margin:170px 20px 50px 20px; padding:0; background:#D0D2D4; font-family:'Lato', Arial, Helvetica, sans-serif; font-size:17px; font-weight:300;}
#background { position:fixed; z-index:0; top:0; left:0; width:100%; height:100%;  background:#D0D2D4 url(../video/home.jpg) no-repeat center center; background-size:cover;  }
#background video { position: absolute;     right: 0;    bottom: 0;min-width: 100.5%;min-height: 100.5%; width: auto;height: auto;top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);transform: translate(-50%,-50%);  opacity:0.95;  }
a { cursor:pointer; text-decoration:none; color:#e20d17; }
a:hover { text-decoration:underline;}
.center { margin:29px auto; max-width:1300px;}
.center.small {  max-width:360px;}

.clear { clear:both;}


#no_page_logo { background:url(../images/logo.png) no-repeat center 0; height:60px; width:100%; position:relative; z-index:5; padding-bottom:30px; margin-bottom:25px; border-bottom:1px solid #E2E4E6;}

ul , p { line-height:115%;}
ul { margin:15px 0; padding:0; list-style:none;}
ul li { margin:3px 0; padding-left:22px; background:no-repeat 0 4px url(../images/arrow.png);}


#overlayTH {position:fixed; z-index:120; top:81px; left:0; width:100%; display:none;}
#overlayTH .box { background:#FAFAFA;  background:rgb(252,252,252); padding:8px 30px 0 30px; border-top:1px solid #EEE;}
#overlayTH .wrap { margin:0 20px;}

#header {position:fixed; z-index:10; top:0; left:0; width:100%;}
#header .wrap {  height:60px; padding:25px 30px; background:#FFF; }
#header h1 { float:left; height:60px; width:160px; margin:0;}
#header h1 a { display:block; height:60px; background:url(../images/logo.png?v=3) no-repeat center center;}
#header .menu { float:right; line-height:110px; height:110px; margin:-25px 25px -25px 0;  border-right:1px solid #EAECEF;}
#header .menu a , #header .menu span { float:left; border-left:1px solid #EAECEF; padding:0 20px; color:#000; font-family:"Signika", Arial, Helvetica, sans-serif; text-decoration:none; font-weight:300; font-size:16px; transition:background-color 0.15s; position:relative;}
#header .menu span {  height:110px; font-weight:300 !important; font-family:'Lato', Arial, Helvetica, sans-serif;}
#header .menu span a { float:none; display:inline; padding:0; position:absolute; top:50%; margin-top:2px; border:none; line-height:30px;  color:#e20d17;  font-size:13px;}
#header .menu span a:hover { background-color:transparent; text-decoration:underline;}
#header .menu a:hover { background-color:#F8FAFC; }

#header h1.partner { float:right; height:60px; margin:0; padding:0; text-align:right; font-size:0; line-height:60px; width:auto;}
#header h1.partner a { background:#EEE; display:inline; padding:0; margin:0;}
#header h1.partner a img { border:none; vertical-align:middle; margin:0; padding:0; width:auto;  height:auto; max-width:100px; max-height:60px;}

#header  h2 { color:#AAA; float:left; margin:-25px 25px; padding:35px 20px; border:1px solid #EAECEF; border-width:0 0 0 1px; line-height:20px; font-weight:400; font-size:18px;}

.al-c { text-align:center;}
p.footer { color:#FFF; margin:50px 0; font-size:14px; text-shadow:0 0 3px rgba(0,0,0,0.9);}

#header .center { margin:0 auto; padding:0 20px }
h1,h2,h3,h4,h5,h6 { font-family:"Signika", Arial, Helvetica, sans-serif; font-weight:600; }

strong { font-weight:400;}

.box { padding:30px; background:#FAFAFA;  background:rgba(252,252,252,0.95);   margin:20px 0;}

.box h1 { color:#000; text-align:center; margin:-30px -30px 30px -30px !important; padding:25px 60px; position:relative; border-bottom:1px solid #E0E2E4; line-height:110%; font-weight:400; font-size:22px; background:#FFF;}

.box h2 { font-size:24px;}
.box h3 { font-size:20px;}

.box h1 .closer { position:absolute; opacity:0.6; transition:opacity 0.1s; width:50px; margin:0; right:0; top:0; height:100%; text-indent:-500px; overflow:hidden; background:url(../images/pictos/close.png) no-repeat center center;}
.box h1 .closer:hover { opacity:1;}

.box.split { position:relative;}
.box.split:before { content:""; height:100%; top:0; left:50%; width:1px; background:#D0D2D4; background-color:rgba(0,0,0,0.12); position:absolute;}
.box.split-50:before { left:50%;}
.box.split-60:before { left:60%; margin-left:-5px;}
.box.split-35:before { left:35%; margin-left:8px;}

#content { position:relative; z-index:5;}

h1,h2,h3,h4,h5,h6, .signika  { font-family:"Signika", Arial, Helvetica, sans-serif; font-weight:400; }

textarea.champ { min-height:100px; max-height:200px; min-width:100%; max-width:100%;  resize: none; line-height:120%; padding:10px;} 

.champ { margin:5px 0; box-sizing:border-box; height:48px; line-height:48px; background:#FFF no-repeat right center; border-radius:0 !important;  font-family:"Lato", Arial, Helvetica, sans-serif; font-weight:300; font-size:16px; width:100%; border:1px solid #CCC;  padding:0 10px; display:inline;}
.champ.login { background-image:url(../images/pictos/account.png);}
.champ.password { background-image:url(../images/pictos/password.png);}

.champ.small { width:49%; width:calc(50% - 5px); margin-right:10px;}
.champ.right { margin-right:0;}

select.champ { background-image:url(../images/arrow-list.png); cursor:pointer;  padding-right:40px; -webkit-appearance: none; -ms-appearance: none;  -moz-appearance: none; appearance: none /*menulist*/;  border-radius:0 !important; }

.champ:focus { border-color:#666; transition:border-color 0.1s; }

.champ.error { border-color:#F66; color:#E02; background-color:#FEE;}

span.formError { color:#FFF; background:#E02; padding:1px 3px; font-size:11px; margin:-2px 0 0 0px; font-weight:400; position:absolute; border-radius:2px;}
h3.formError { color:#E02; font-size:18px;  font-weight:400; margin:5px 0; }
div.formError { color:#E02; font-size:18px;  font-weight:400; margin:5px 0; }

.col { float:left;}
.col.right { float:right;}
.col-65 { width:65%;}
.col-35 { width:35%;}
.col-50 { width:50%;}
.col-60 { width:60%;}
.col-40 { width:40%;}

.col .box { margin-top:0;}

.box > :first-child { margin-top:0;}
.box > :last-child { margin-bottom:0;}

.box .col > :first-child { margin-top:0 ;}
.box .col > :last-child { margin-bottom:0;}

.box .col form > :first-child { margin-top:0;}
.box .col form > :last-child { margin-bottom:0;}

.col.left .box { margin-right:10px;}
.col.right  .box { margin-left:10px;}

.split .col.left { padding-right:30px; box-sizing:border-box;}
.split .col.right { padding-left:30px; box-sizing:border-box;}

hr { margin:30px 0; border:none; broder-top:1px solid #FFF; border-bottom:1px solid #D8DADC;}

.headerClient { display:table; width:100%; vertical-align:middle;}
.headerClient .td { display:table-cell; vertical-align:middle; }
.headerClient .td.logo { padding-right:20px; width:40px;}
.headerClient .td.logo img { vertical-align:middle; height:auto; width:auto; max-height:90px; max-width:140px;}
.headerClient h2 { margin:15px 0 0 0; font-weight:400; font-size:20px; line-height:110%;}
.headerClient h3 { margin:0 0 15px 0; font-size:26px; line-height:110%; color:#E30613;}

.col.right form { position:relative; margin:0;}

p.buttons { margin:10px 0 0 0;}
.buttons a { display:inline-block; padding:12px 12px; font-size:16px;  font-weight:400; background:#e20d17 no-repeat right center; line-height:18px; text-decoration:none; transition:background 0.2s, color 0.2s; margin:0; border-radius:2px; color:#FFF; font-family:"Signika", Arial, Helvetica, sans-serif; border:1px solid rgba(0,0,0,0.1);}
.buttons a:hover {background-color:#222 !important;}

.loading .buttons a , .loading .buttons a:hover { background:no-repeat center center #FFF url(../images/load-white.gif) !important; color:#FFF; color:rgba(255,255,255,0); transition:none;}

.buttons a.grey { color:#777; background-color:#;}
.buttons a.grey:hover { background-color:#E8EAEC !important;}



.buttons a.invert , .buttons.arrow a.invert { color:#e20d17; background:none !important; transition: all 0.2s;}
.buttons a.invert:hover { border-color:#e20d17 ; background:#FFF !important;}




.buttons.arrow a { padding-right:24px; background-image:url(../images/pictos/arrow-small-right.png);}

div.table { display:table;overflow:hidden; position:relative;  margin:0 0; width:100%; font-family:"Signika", Arial, Helvetica, sans-serif; }
.cells {  margin:0; display:block; text-decoration:none; position:relative; color:#000; transition:background-color 0.15s; display:table-row; font-weight:300; min-height:30px; column-count: 7; }

.cells.entry.hide { display:none;}

a.cells:hover { text-decoration:none; background:#FBEEEE;}
a .cell.hover { color:#E02;}
.cells span {  display:table-cell;  margin:0; padding:20px 2px;  border-bottom:1px solid #333;vertical-align:top; font-size:12px; }
.cells.legend {  background:none; font-weight:400;}
.cells.legend span , .cells.legend span.cell-stage {vertical-align:bottom; border-bottom:none; font-size:12px; line-height:110%; padding:12px 2px;}
.cells.legend.border span {border-bottom:2px solid #E30613;}
.cells.legend.sub span { padding:12px 2px;}
.cells.legend span.bordered { border-bottom:1px dashed #333;}

.cells.cell-all { height:61px; position:relative; overflow:hidden; text-align:center; z-index:5; }
.cells.cell-all span { text-indent:3px; font-size:18px; line-height:20px; padding:20px 0; font-weight:600; display:table-cell; border-bottom:1px solid #333; border-top:2px solid #E30613; position:absolute; width:100%; margin-top:-2px;}
.cells span.cell-inscrit { width:15px; vertical-align:top; text-align:center;}
.cells span.cell-stage { font-size:13px; min-width:220px; font-weight:700;}
.cells span.cell-lieu { width:100px;}
.cells span.cell-session { width:85px;}
.cells span.cell-code { width:60px;}
.cells span.cell-large { width:auto; white-space: nowrap;}
.cells span.cell-duree-totale { width:60px; text-align:center;}
.cells span.cell-date { width:80px; text-align:center;}
.cells span.cell-duree span , .cells.legend.border span.cell-duree span { display:inline-block; border:none; padding:0; margin:0; width:33%;  text-align:center; box-sizing:border-box; position:relative;}
.cells span.cell-duree { text-align:center; width:400px;}
.cells span.cell-places { width:35px; text-align:right; }
.cells span.cell-places strong { font-size:15px; font-weight:300;}
.cells span.cell-places em { font-style:normal; font-size:10px; padding-left:2px;  font-weight:400;}
.cells span.cell-status { width:25px; text-align:right; vertical-align:top; padding-left:10px; }
.cells.annule { cursor:default; color:#AAA; color:rgba(0,0,0,0.3);}
.cells.annule:hover { background-color:transparent;}


.cells span.cell-duree span em { position:absolute; left:0; width:100%; font-style:normal; font-size:11px; margin-top:20px; opacity:0.6;} 
.annule .statusStage.check { opacity:0.3;}
.statusStage { display:inline-block; height:14px; width:14px; border:3px solid #333; border-radius:100%;}
.statusStage.planifie { border-color:rgb(244, 165, 0); background-color:rgba(244, 165, 0,0.2);}
.statusStage.confirme { border-color:rgb(30, 209, 147); background-color:rgba(30, 209, 147,0.2);}
.statusStage.complet { border-color:rgb(244, 73, 97); background-color:rgba(244, 73, 97,0.2);}
.statusStage.annule { border:none; width:20px; height:20px; background:url(../images/pictos/annule.png) no-repeat center center;}
.statusStage.check { border:none; width:20px; height:20px; background:url(../images/pictos/checkOff.png) no-repeat center center; position:absolute; margin:-2px -10px;}
.statusStage.check.on { background:url(../images/pictos/checkOn.png) no-repeat center center;}


.legendeTable { line-height:20px; vertical-align:middle; font-size:14px; margin-top:30px;}
.legendeTable span { display:inline-block; margin:5px;}
.legendeTable .statusStage { position:absolute;}
.legendeTable em { display:inline-block;  padding-left:24px; font-style:normal;}


#overAllCache { position:fixed; top:0; left:0; width:100%; height:100%; background:#000 no-repeat center center; z-index:50;}
#overAllCache.loading { background-image:url(../images/load-black.gif);}
#overAllContent { position:fixed; top:50%; left:5%; width:90%; z-index:51;}

#overAllContent .box { background:#FFF; max-width:1100px; max-width:820px; margin:0 auto;}
#overAllContent .box .wrap { position:relative; }

#overAllContent .wrapTable { }
#overAllContent .box  table {  border-collapse:collapse; width:100%; }
#overAllContent .box  table th, #overAllContent .box  table td { vertical-align:middle; padding:18px 2px;border:1px solid #E2E4E6; cursor:default;}
#overAllContent .box  table th { font-family:"Signika",Arial, Helvetica, sans-serif; font-weight:400; font-size:15px; }
#overAllContent .box  table th span { font-weight:300; font-size:15px; }
#overAllContent .box  table td {  font-size:13px; color:#444; text-align:center; font-weight:400; border-top-width:0; }
/*#overAllContent .box  table td.legende , #overAllContent .box  table th.legende {  font-size:13px; background:#FFF;  padding:14px 5px; text-align:right; color:#999; font-weight:300;border:none;}
*/

#overAllContent .box  table td.legende  { border:none; height:0; padding:0; position:relative;}
#overAllContent .box  table td.legende span { position:absolute; width:100%; text-align:center; left:0; height:18px; line-height:18px; margin-top:-10px; font-size:11px;}
#overAllContent .box  table td.legende span strong { display:inline-block; padding:0 4px; background:#FFF; border-radius:3px; font-weight:400;border:1px solid #E6E8EA; color:#A4A6A8;} 

/*#overAllContent .box  table tr:hover td { background-color:#FBFBFB;}*/

/*#overAllContent .box  table td:first-child {  border-width:1px 1px 1px 0; padding-right:14px; padding-left:14px;}*/
#overAllContent .box  table th.picto , #overAllContent .box  table td.picto { padding:0;}
#overAllContent .box  table th.nothing , #overAllContent .box  table td.nothing { color:#CCC;}

#overAllContent h4 { color:#B0B2B4; font-weight:300; margin:-5px 0 15px 0; font-size:16px;}

p.counter { font-size:14px; color:#777; font-weight:300;}
p.counter strong { font-weight:400; color:#444;}

.infosBox { font-size:0; margin:0 -30px 30px -30px;}
#overAllContent .col.left.col-35 { margin-top:-30px;}
/*.infosBox span { display:inline-block; padding:12px 10px 12px 38px; border:1px solid #E5E7E9; background:#F9FBFD no-repeat 6px center;  margin:3px; font-size:16px; font-weight:400;  font-family:"Signika",Arial, Helvetica, sans-serif; border-radius:3px;}*/
.infosBox span , .infosBox a { display:block; padding:14px 20px 14px 68px; border-bottom:1px solid #E6E8EA; margin:0; background:no-repeat 36px center;  font-size:16px; font-weight:400;  font-family:"Signika",Arial, Helvetica, sans-serif; line-height:110%;}
.infosBox span.places { background-image:url(../images/pictos/places.png);}
.infosBox span.lieu { background-image:url(../images/pictos/lieu.png);}
.infosBox span.time { background-image:url(../images/pictos/time.png);}
#overAllContent p.buttons { margin-top:30px;}
#overAllContent p.buttons a { display:block; text-align:left; padding-top:16px; padding-bottom:16px; margin:0;}
a.download {  background:url(../images/pdf.png) no-repeat 32px center; }
a.download:hover { background-color:#F8FAFC; text-decoration:none;}

h3.ok { padding:10px 8px; border-radius:3px; text-align:center; line-height:110%; color:#1ED193; border:2px solid #1ED193; margin:30px 0 0 0; font-size:16px; }
h3.error { padding:10px 8px; border-radius:3px; text-align:center; line-height:110%; color:#E02; border:2px solid #E02; margin:30px 0 0 0; font-size:16px; }


.datePicker { display:inline; width:120px;}


a.smallListing { padding:10px 0 10px 30px; margin:-1px 0; display:block; border:1px solid #DDD; border-width:1px 0; font-size:14px; color:#888; text-decoration:none; position:relative;}
a.smallListing:hover { background:#FFF;}
a.smallListing strong { display:block; font-size:16px; color:#000;}
a.smallListing span {  color:#1ED193; position:absolute; left:2px; font-size:20px; height:24px; line-height:22px; top:50%; margin:-12px 0; font-weight:400; }
a.smallListing em { position:absolute; right:2px; bottom:10px; line-height:13px; font-size:12px; font-style:normal; width:50%; text-align:right; color:#E02;}
@media screen and (max-width: 1200px) {
	span.cell-duree em { display:none;}	
	#header  h2 { font-size:15px; }
}

@media screen and (max-width: 1100px) {
	#header  h2 { font-size:0; width:0; overflow:hidden;}
}

@media screen and (max-width: 900px) {
	span.cell-duree { display:none;}	
	
}


input[type=checkbox].check + label {
  display : inline-block;
  position:relative;
  padding-left:24px;
  cursor:pointer;
}

.disable input[type=checkbox].check + label {
  cursor:default;
}

.disable input[type=checkbox].check + label:before {
	border:1px solid #EEE !important; 
}

input[type=checkbox].check + label:before {
  content:"";
  position:absolute; top:50%; left:0;
  background:#FFF; 
  width:16px; height:16px; margin:-9px 0;border:1px solid #AAA;  transition:border-color 0.1s; box-shadow:0 0 3px rgba(0,0,0,0.1) inset;
}

input[type=checkbox].check:checked + label:before {
 
  color:#FF4C65 !important; 
  content:"✔";
  line-height:15px;
  font-size:22px;
  text-indent:1px;
}

input[type=checkbox].check:hover + label:before {
  border-color:#666; 
}

input[type=checkbox].check  {
	left:-5000px;
	position:absolute; margin:13px 0 0 3px; padding:0;
	z-index:0
}