/* polices */
@font-face {
  font-family: "MuseoSlab-700";
  src: url("webfonts/25CCD3_2_0.eot?#iefix") format("embedded-opentype"), url("webfonts/25CCD3_2_0.woff") format("woff"), url("webfonts/25CCD3_2_0.ttf") format("truetype");
}
@font-face {
  font-family: "MuseoSlab-500";
  src: url("webfonts/25CCD3_10_0.eot?#iefix") format("embedded-opentype"), url("webfonts/25CCD3_10_0.woff") format("woff"), url("webfonts/25CCD3_10_0.ttf") format("truetype");
}
@font-face {
    font-family: "MuseoSlab-300";
    src: url("webfonts/25CCD3_4_0.eot?#iefix") format("embedded-opentype"), url("webfonts/25CCD3_4_0.woff") format("woff"), url("webfonts/25CCD3_4_0.ttf") format("truetype");
}
@font-face {
  font-family: "Gotham-Book";
  src: url("webfonts/gotham-book.eot?#iefix") format("embedded-opentype"), url("webfonts/gotham-book.woff") format("woff"), url("webfonts/gotham-book.ttf") format("truetype");
}
@font-face {
  font-family: "Archer-Book";
  src: url("webfonts/archer-book-pro.eot?#iefix") format("embedded-opentype"), url("webfonts/archer-book-pro.woff") format("woff"), url("webfonts/archer-book-pro.ttf") format("truetype");
}
@font-face {
  font-family: "Archer-Bold";
  src: url("webfonts/archer-bold-pro.eot?#iefix") format("embedded-opentype"), url("webfonts/archer-bold-pro.woff") format("woff"), url("webfonts/archer-bold-pro.ttf") format("truetype");
}
@font-face {
  font-family: "Archer-Medium";
  src: url("webfonts/archer-medium-pro.eot?#iefix") format("embedded-opentype"), url("webfonts/archer-medium-pro.woff") format("woff"), url("webfonts/archer-medium-pro.ttf") format("truetype");
}

/* mise en form par defaut */
* { box-sizing: border-box; }
body, ul, li, ol, dl, dt, dd, p, form, div, h1, h2, h3, h4, h5, h6, label, a, fieldset, header, nav, section, footer, aside, article, figure, hgroup { margin:0; padding:0 }
img, fieldset { border:0 }
ul, ol { list-style:none }
body { font-size: 15px; font-family: Verdana, Helvetica, sans-serif; color: #5d5d5d }
a { text-decoration: none; outline: none; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-family: "MuseoSlab-700", arial, sans-serif; }

body{background: url(../images/bgd-body.jpg) 0 0 repeat;}
  #global, #header, #breadcrumb, #main{overflow: hidden; margin: 0 auto; width: 100%;}
    .cont{margin: 0 auto; width: 960px;}
  #header{background: url(../images/bgd-header-repeat.png) top left repeat-x; height: 154px; padding: 13px 0 26px; position: relative;}
  #header:after{content: ''; position: absolute; top: 0; right: 0; background: url(../images/bgd-header.png) 0 0 no-repeat; width: 233px; height: 154px;}
    h1{margin: 7px 0 0; float: left;}
      h1 a{color: #868786; font-size: 15px; line-height: 20px; display: inline-block; width: 255px; font-family: "MuseoSlab-300", arial, sans-serif;}
      h1 a:before{content: ''; margin: 0 20px 0 0; float: left; background: url(../images/logo-cfc.png) 0 0 no-repeat; width: 96px; height: 63px;}
        h1 a span{color: #2b4154;}
    .user{float: right; text-align: right; min-width: 210px; height: 100%; background: url(../images/bgd-shadow-user.png) 0 0 no-repeat; padding: 0 0 1% 10px; font-family: "MuseoSlab-500", arial, sans-serif; font-size: 17px; position: relative; z-index: 1;}
      .user dt{font-weight: normal;}
      .user dd{color: #d6374a;}
  #breadcrumb{color: #7b7b7b; font-size: 12px;}
    #breadcrumb li{float: left; margin: 0 6px 0 0;}
    #breadcrumb li:before{content: '>'; float: left; margin: 0 6px 0 0;}
    #breadcrumb li:first-child:before{display: none;}
      #breadcrumb a{color: #7b7b7b; text-decoration: underline;}
  #global{background: url(../images/bgd-main-repeat.png) top center repeat-y;}
    #main{background: url(../images/bgd-main.png) top center no-repeat; padding: 71px 0 0; min-height: 738px;}
      .sidebar{float: left; width: 312px; font-family: "MuseoSlab-500", arial, sans-serif;}
        .sidebar h2{font-size: 28px; color: #fff; line-height: 1; margin: 0 0 20px 40px; text-transform: uppercase;}
        .menu{line-height: 1;}
          .menu li{padding: 13px 40px 10px; background: url(../images/bgd-shadow-menu.png) top center no-repeat;}
          .menu li:first-child{background: none;}
            .menu a{color: #fff; display: block;}
            .menu .active a, .menu a:hover{color: #003e4e;}
      .mainCont{float: left; width: 100%; padding: 0 0 90px 32px; position: relative; width: 648px; font-family: "Archer-Book", arial, sans-serif;}
        .mainCont h3{color: #e23b4f; font-size: 24px; margin: 0 0 34px 8px;}
        .mainCont h4{color: #ca3547; font-size: 14px; font-family: "Archer-Bold", arial, sans-serif; margin: 0 0 20px;}
        .mainCont p{margin: 0 0 20px;}
        .btn{font-size: 11px; color: #fff; font-family: Verdana, Helvetica, sans-serif; line-height: 1; padding: 6px 18px 0 8px; height: 25px; position: relative; float: left; -moz-box-shadow: 5px 5px 7px rgba(1,1,2,0.08); -webkit-box-shadow: 5px 5px 7px rgba(1,1,2,0.08); box-shadow: 5px 5px 7px rgba(1,1,2,0.08);
background: rgb(211,54,73);
background: -moz-linear-gradient(top, rgba(211,54,73,1) 0%, rgba(196,50,67,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(211,54,73,1)), color-stop(100%,rgba(196,50,67,1)));
background: -webkit-linear-gradient(top, rgba(211,54,73,1) 0%,rgba(196,50,67,1) 100%);
background: -o-linear-gradient(top, rgba(211,54,73,1) 0%,rgba(196,50,67,1) 100%);
background: -ms-linear-gradient(top, rgba(211,54,73,1) 0%,rgba(196,50,67,1) 100%);
background: linear-gradient(to bottom, rgba(211,54,73,1) 0%,rgba(196,50,67,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d33649', endColorstr='#c43243',GradientType=0 );}
        .btn:after{content: ''; width: 27px; height: 32px; background: url(../images/bgd-btn.png) 0 0 no-repeat; position: absolute; top: 2px; right: -8px;}
        .btnRight{float: right; margin: 0 8px 0 0;}
#footer{float: left; width: 100%; background: url("../images/bgd_top_footer.png") no-repeat left top; padding: 27px 0;
    line-height: 1; font-size: 11px; color: #8d8d8d; font-family: "Gotham-Book"; text-align: center; position:fixed; left:0;
    bottom:0; height:auto;}
      #footer a{color: #8d8d8d;}
      
      /* login */
      .login{padding: 40px 0;}
        .login h2{font-size: 24px; margin: 0 0 25px; text-align:left;}
        form{width: 100%; display: inline-block; font-size: 12px; font-family: Verdana, Helvetica, sans-serif; max-width: 382px;}
          .cont .fieldTitle{color:#d6374a; font-size: 18px; margin: 0 0 20px; line-height: 100%; background: rgba(255,255,255,0.47); padding: 10px 12px; position: relative; font-family: "MuseoSlab-700", arial, sans-serif; clear: both;}
          .fieldTitle:after{content: ''; background: url(../images/bgd-shadow-frmTitle.png) top center no-repeat; height: 16px; width: 100%; position: absolute; bottom: -16px; left: 0;}
          .frmItem{display: inline-block; width: 100%; margin: 0 0 20px; position: relative;}
            .frmItem > input{font-family: arial, helvetica, sans-serif; font-size: 11px; padding: 5px 6px; border:1px solid #cfd2d4; background: none; color: #323232; width: 261px;}
            .frmItem > label{float: left; width: 121px; padding: 5px 10px;}
          .frmSubmit{text-align: center; margin: 15px 0 0;}
            button.btn{padding: 4px 18px 13px 8px; border: none; cursor: pointer;}
            .frmSubmit .btn{margin: 0; float: none;}
            form .btnRight{margin: 0;}
        .login form{width: 40%; margin: 0 auto; display: block;}
        #footer.login{position: fixed; bottom: 0; left: 0;}
        .errorMsg{float: right; color: #054ea8; font-size: 11px;}
 
        .errorMsg:before, .ValidationErrors:before, .validationErrors:before, .validationError:before, .formErrorStep1:before{content: ''; float: left; width: 9px; height: 8px; background: url(../images/ico-error.png) 0 0 no-repeat; margin: 4px 5px 0 0;}
        .ValidationErrors, .validationErrors{float:right; color: #054ea8; font-size: 11px; margin: -15px 0 0;}
        .forgetPasswd .validationErrors{float: left;}
        .ValidationErrors{position: absolute; top: 20px; left: 102%; width: 300px; z-index: 1;}
        .validationErrors{display: none;}
        .frmItem .ErrorField, .frmItem .errorField{border-color: #054ea8;}
        .validationError, .formErrorStep1{  float: left;
            padding: 0 0 0 12px;
            color: #054ea8;
            font-family: Verdana, Helvetica, sans-serif;
            font-size: 11px;
            margin: 20px 0 0; }
        .formErrorStep1{position: absolute; top: -38px; left: 0; width: 500px;}
    
      /* accueil */
      .mainCont.accueil{padding: 0 0 90px 42px;}
      .mainCont.accueil .infoTitle{width:340px; margin:0 auto 25px;}
      .mainCont.accueil:before{content: ''; position: absolute; top: 30px; left: 27px; background: url(../images/bgd-shadow-banner.png) 0 0 no-repeat; width: 28px; height: 318px;}
        .mainCont.accueil h3{margin-left: 0;}
        .mainCont .banner{margin: 0 0 20px -14px;}
        .mainCont .userInfo{color: #ca3547; font-size: 16px; font-family: "MuseoSlab-700", arial, sans-serif; margin: 0 0 27px;}
          .mainCont .userInfo .id{text-transform: uppercase;}
        .mainCont.accueil .btn{margin-top: 25px;}
      
      /* steps */
      .steps{font-family: "MuseoSlab-700", arial, sans-serif; font-size: 18px; text-align: center; width: 80%; margin: 0 0 50px; display: inline-block; position: relative;}
      .steps:after{content: ''; width: 692px; position: absolute; bottom: -40px; left: -18%; background: url(../images/bgd-shadow-steps.png) top center no-repeat; height: 21px;}
        .steps li{float: left; width: 30%;}
        .steps li:first-child{margin: 0 5px 0 -5px;}
          .steps i{width: 55px; height: 54px; margin: 0 auto; font-style: normal; display: inline-block; background-image: url(../images/steps.png); background-repeat: no-repeat; text-indent: -9999px; -moz-border-radius:27px; -webkit-border-radius:27px; border-radius:27px; -moz-box-shadow: 4px 4px 5px rgba(1,1,2,0.15); -webkit-box-shadow: 4px 4px 5px rgba(1,1,2,0.15); box-shadow: 4px 4px 5px rgba(1,1,2,0.15); opacity: 0.6;}
          .steps .done i{opacity: 1;}
          .steps .active i{box-shadow: none; opacity: 1;}
          .step1 .one{background-position:0 0}
          .step1 .two{background-position:-149px 0}
          .step1 .three{background-position:-297px 0}
          .step2 .one{background-position:0 -61px}
          .step2 .two{background-position:-149px -61px}
          .step2 .three{background-position:-297px -61px}
          .step3 .one{background-position:0 -122px}
          .step3 .two{background-position:-149px -122px}
          .step3 .three{background-position:-297px -122px}          
          .steps span{display: block; margin: 15px 0 0; color: #7b7b7b;}
          .steps .active span{color: #dd3a4e;}
      
      /* step1 */
      form fieldset{display: inline-block; width: 100%; margin: 0 0 25px;}
      #delpe_primaire_step1_civilite{margin: 5px 0 0;}
        .frmItem input[type="radio"]{margin: 2px; float: left;}
        .frmItem input[type="radio"] + label {float: left; margin: 0 25px 0 0;}
      
      /* step2 */
      .info{width: 100%; max-width: 382px; display: inline-block;}
        .infoCont{margin: 0 0 20px; display: inline-block; width: 100%; font-size: 12px;}
          .mainCont .infoTitle{text-align: center; color: #fff; background: #d53649; padding: 13px; margin: 0 0 25px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold;}
          .infoCont p{padding: 0 10px;}
        form.step2 .frmItem{margin:0 0 19px;}
          form.step2 label{width: 268px;}
          form.step2 .frmItem input{background: #fff; width: 114px; border-color:#000;}
      .helpBox{float: right; background: #f1f1f1; width: 205px; font-size: 11px; font-family: Verdana, Helvetica, sans-serif; color: #5d5d5d; padding: 0 0 5px; -moz-box-shadow: 4px 4px 5px rgba(1,1,2,0.07); -webkit-box-shadow: 4px 4px 5px rgba(1,1,2,0.07); box-shadow: 4px 4px 5px rgba(1,1,2,0.07); position: relative;}
      .helpBox:after{content: ''; position: absolute; bottom: -7px; right: -7px; width: 68px; height: 41px; background: url(../images/bgd-help-box.png) 0 0 no-repeat;}
        .helpBox .fieldTitle{background: none; font-family: "Archer-Bold"; margin: 0; color: #d53649; font-size: 20px; padding: 11px 23px; margin: 0 0 18px;}
        .helpBox .fieldTitle:after{background-image: url(../images/bgd-shadow-help.png); height: 20px; bottom: -20px;}
        .helpBox p{padding: 0 17px 0 23px; line-height: 1.2;}
        
        /* recap */
        .recapCont p em{font-weight: bold; font-style: normal;}
        .recapCont p strong{font-family: "Archer-Bold", arial, sans-serif; font-weight: normal;}
        .frmRecap > .btnCont{float: left; width: 100%; margin: 0 0 25px;}
          .frmRecap .infoCont{margin: 0 0 25px;}
            .frmRecap .infoCont p{margin: 0;}
            .frmItem .fieldCP{width: 52px;}
        .btnPrint{float: right;}
          .icoPrint{width: 16px; height: 16px; background: none; background-image: url(../images/ico-print.png); float: left; margin: 6px 10px 0 0;}
          .btnPrint .btnRight{margin: 0;}

        /** Contact **/
        .frmItem textarea{background:rgba(0, 0, 0, 0) none repeat scroll 0 0; border:1px solid #cfd2d4; width:261px; color:#323232;
            font-family:arial,helvetica,sans-serif; font-size:11px; padding:5px 6px;}
        .formWide{max-width:412px;}
        .formWide .frmItem > label{width:150px;}
		
		/* Retour Ticket 10315 */
.mainCont .obligatoire{float:left; font-family:"verdana",arial,Helvetica,sans-serif; font-size:11px;text-align:right; width: 62%; margin: 0 0 10px; color:#e23b4f;}
.contactForm .frmItem > input, .contactForm .frmItem textarea{background:#fff; border-color:#000; color:#838383;}

	/* Retour Ticket 10314 */
.mainCont.accueil .infoTitle{width:340px;}
.accueil p a{text-decoration:underline; color:#5d5d5d;}

/*10310*/
.helpBox strong{text-decoration:underline;}
.helpBox .scolaire{text-decoration:none;}

/*10312*/
.contactForm .ValidationErrors{bottom:-15px; left:150px; top:auto;}

/*10309*/
.step1.contactForm .ValidationErrors{left:122px;}
.contactForm .firstInfo input{background:none; color:#323232; border-color:#cfd2d4;}
.mainCont .obligatoireContact { width: 67% !important; }

/*10305*/
.login .fieldTitle{color:#5d5d5d;}
.login form{background:url("../images/bgd_bloc.gif") repeat-y left top; display:block; margin:0 auto; max-width:none; padding:0 0 12px; width:42%; position:relative;}
.cornerPage{width:45px; height:54px; float:right; position:absolute; bottom:0; right:0; background:url(../images/cornerImg3-login.png) no-repeat left top;}
.login .btn{background: rgb(76,105,130);
background: -moz-linear-gradient(top, rgba(76,105,130,1) 0%, rgba(52,76,96,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(76,105,130,1)), color-stop(100%,rgba(52,76,96)));
background: -webkit-linear-gradient(top, rgba(76,105,130,1) 0%,rgba(52,76,96,1) 100%);
background: -o-linear-gradient(top, rgba(76,105,130,1) 0%,rgba(52,76,96,1) 100%);
background: -ms-linear-gradient(top, rgba(76,105,130,1) 0%,rgba(52,76,96,1) 100%);
background: linear-gradient(to bottom, rgba(76,105,130,1) 0%,rgba(52,76,96,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4a6881', endColorstr='#334b5f',GradientType=0 );}
.login .btn::after{background:url(../images/btn-neutral-login-2.png) 0 0 no-repeat; position: absolute; top: 0px; right: -1px; height:25px; width:13px;}
.login .mentions{font-size:11px; padding:0 10px;}
.login .mentions a{font-weight:bold; text-decoration:underline; color:#5d5d5d;}
.login .oubli{ margin:12px 0 26px;}

.frmItem .infoText{width:75px;}
.frmItem .postal{width:45px;}
form .firstInfo{margin:0 0 10px;}

/*ticket 10305 login*/
.login .frmItem{padding:0 15px 0 6px;}
.login .frmItem.frmSubmit{margin:0; padding:0 18px 0 6px; text-align:right;}

/*forget password*/
.retour{float:left; margin:-46px 0 0; position:relative; text-align:right; width:76%;}
.retour a{color: #e23b4f; text-decoration: underline;}
.contactForm .frmItem select{border:1px solid #000 ;color:#838383; padding:5px 6px; width:261px;}
.noPadd label{padding:0 10px 5px;}
.contactForm.forgetPasswd .frmItem label {width: 160px;}
.contactForm.forgetPasswd .frmItem input, .contactForm.forgetPasswd .frmItem select {width: 250px;}
.contactForm.forgetPasswd .frmItem .postal {width: 46px;}
.contactForm.forgetPasswd .frmItem .telephone, .contactForm .frmItem .telephone  {width: 90px;}
.forgetPasswd .validationErrors { float: left; margin: -15px 0 8px 160px;}
.forgetPasswd .ValidationErrors {left: 160px;}

/*login*/
.loginForm .ValidationErrors {
    bottom: -18px;
    left: 126px;
    top: auto;
}

.btnError{position: relative; width: 100%; float: left;}

.frmItem .telNum{width: 88px;}

/*Error Page*/
.pageError p{margin: 10px 0;}
.pageError .btn{margin-top: 25px;}

/*Print Content Recap Page*/
.printpreview {position: absolute; top: 0; left: 0;}
.printpreview form fieldset { margin: 0; }
.printpreview .frmItem { margin: 0 0 10px; }
.printpreview h3, .printpreview h4 { color: #e23b4f; margin: 10px 0; font-size: 18px; }
.printpreview .btnCont, .printpreview p:first-child { display: none; }