@fonts: '../../fonts';
@font-face {
  font-family: 'noto_serifitalic';
  src: url('@{fonts}/notoserif-italic-webfont.eot');
  src: url('@{fonts}/notoserif-italic-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/notoserif-italic-webfont.woff2') format('woff2'),
  url('@{fonts}/notoserif-italic-webfont.woff') format('woff'),
  url('@{fonts}/notoserif-italic-webfont.ttf') format('truetype'),
  url('@{fonts}/notoserif-italic-webfont.svg#noto_serifitalic') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'noto_serifregular';
  src: url('@{fonts}/notoserif-regular-webfont.eot');
  src: url('@{fonts}/notoserif-regular-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/notoserif-regular-webfont.woff2') format('woff2'),
  url('@{fonts}/notoserif-regular-webfont.woff') format('woff'),
  url('@{fonts}/notoserif-regular-webfont.ttf') format('truetype'),
  url('@{fonts}/notoserif-regular-webfont.svg#noto_serifregular') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sansbold';
  src: url('@{fonts}/opensans-bold-webfont.eot');
  src: url('@{fonts}/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-bold-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-bold-webfont.woff') format('woff'),
  url('@{fonts}/opensans-bold-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-bold-webfont.svg#open_sansbold') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sansbold_italic';
  src: url('@{fonts}/opensans-bolditalic-webfont.eot');
  src: url('@{fonts}/opensans-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-bolditalic-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-bolditalic-webfont.woff') format('woff'),
  url('@{fonts}/opensans-bolditalic-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-bolditalic-webfont.svg#open_sansbold_italic') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sansextrabold';
  src: url('@{fonts}/opensans-extrabold-webfont.eot');
  src: url('@{fonts}/opensans-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-extrabold-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-extrabold-webfont.woff') format('woff'),
  url('@{fonts}/opensans-extrabold-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-extrabold-webfont.svg#open_sansextrabold') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sansextrabold_italic';
  src: url('@{fonts}/opensans-extrabolditalic-webfont.eot');
  src: url('@{fonts}/opensans-extrabolditalic-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-extrabolditalic-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-extrabolditalic-webfont.woff') format('woff'),
  url('@{fonts}/opensans-extrabolditalic-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-extrabolditalic-webfont.svg#open_sansextrabold_italic') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sansitalic';
  src: url('@{fonts}/opensans-italic-webfont.eot');
  src: url('@{fonts}/opensans-italic-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-italic-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-italic-webfont.woff') format('woff'),
  url('@{fonts}/opensans-italic-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-italic-webfont.svg#open_sansitalic') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sanslight';
  src: url('@{fonts}/opensans-light-webfont.eot');
  src: url('@{fonts}/opensans-light-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-light-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-light-webfont.woff') format('woff'),
  url('@{fonts}/opensans-light-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-light-webfont.svg#open_sanslight') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sanslight_italic';
  src: url('@{fonts}/opensans-lightitalic-webfont.eot');
  src: url('@{fonts}/opensans-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-lightitalic-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-lightitalic-webfont.woff') format('woff'),
  url('@{fonts}/opensans-lightitalic-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-lightitalic-webfont.svg#open_sanslight_italic') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sansregular';
  src: url('@{fonts}/opensans-regular-webfont.eot');
  src: url('@{fonts}/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-regular-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-regular-webfont.woff') format('woff'),
  url('@{fonts}/opensans-regular-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-regular-webfont.svg#open_sansregular') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sanssemibold';
  src: url('@{fonts}/opensans-semibold-webfont.eot');
  src: url('@{fonts}/opensans-semibold-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-semibold-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-semibold-webfont.woff') format('woff'),
  url('@{fonts}/opensans-semibold-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-semibold-webfont.svg#open_sanssemibold') format('svg');
  font-weight: normal;
  font-style: normal;

}
@font-face {
  font-family: 'open_sanssemibold_italic';
  src: url('@{fonts}/opensans-semibolditalic-webfont.eot');
  src: url('@{fonts}/opensans-semibolditalic-webfont.eot?#iefix') format('embedded-opentype'),
  url('@{fonts}/opensans-semibolditalic-webfont.woff2') format('woff2'),
  url('@{fonts}/opensans-semibolditalic-webfont.woff') format('woff'),
  url('@{fonts}/opensans-semibolditalic-webfont.ttf') format('truetype'),
  url('@{fonts}/opensans-semibolditalic-webfont.svg#open_sanssemibold_italic') format('svg');
  font-weight: normal;
  font-style: normal;

}

html{overflow-x: hidden;overflow-y: auto; -ms-overflow-style: scrollbar}

//Level size text
.level2{font-size: 16px;font-family: 'open_sansbold';text-transform: uppercase}
.level3{font-size: 21px;font-family: 'open_sansbold';text-transform: uppercase}

h1, .h1, h2, .h2, h3, .h3 {margin-top: 25px;margin-bottom: 25px; font-family: 'noto_serifregular'; color: @black33;
  i, em{font-family: 'noto_serifitalic';
    strong, b{font-weight: bold;}
  }
  strong, b{font-weight: bold;
    i, em{font-family: 'noto_serifitalic';font-weight: bold;}
  }
}
h1{
  @media(max-width: @screen-xs-max){font-size: 3.3rem}
}
b, strong{font-weight: normal; font-family: 'open_sansbold';
  i,em{font-family: 'open_sansbold_italic'}
}
i, em{font-style: normal; font-family: 'open_sansitalic';
  b, strong{font-family: 'open_sansbold_italic'}
}


.widget-video{position: relative; display: block;
  &-play{position: absolute; left: 50%; top: 50%; width: 68px; height: 48px; margin-left: -34px; margin-top: -24px;}
  &:hover{
    .ytp-large-play-button-bg{fill: #f00; fill-opacity: 1}
  }
}
.content-page{
  a{color: @brand-primary;
    &:hover,&:focus,&:active{background-color: transparent; color: @link-color;
      &.readMore, &.btn-primary, &.btn-revert{color: @white; background-color: @btn-hover-bg; border-color: @btn-hover-bg;}
    }
  }
}

.btn{font-family: 'open_sansbold'; font-size: 14px;
  &-primary{
    &, .content-page &{color: @white; margin-top: 25px; margin-bottom: 25px; white-space: normal; line-height: 24px; padding: 8px 30px; .border-radius(2px); text-transform: uppercase; .box-shadow2(0 1px 4px 0 rgba(0,0,0,0.13), 0 1px 3px 0 rgba(0,0,0,0.22));
      &:hover, &:focus{.box-shadow2(0 4px 5px 0 rgba(0,0,0,0.15), 0 1px 3px 0 rgba(0,0,0,0.2));
        &, .content-page &, .page &{color: @white}
      }
      &.btn-pdf{padding: 8px 15px}
    }
  }
  &.btn-liseret{background: url('@{img}/liseret/liseret_mobile.png') no-repeat 50% 100% transparent;padding-bottom: 15px;width: 100%;display: block;text-transform: uppercase;font-family: 'open_sansbold';.border-radius(0px); color: @text-color; white-space: normal;}
  &.btn-plus{
    &.collapsed .ico{background-image: url('@{img}/btn_bonus_18.png');}
    .ico{background-image: url('@{img}/btn_minus_18.png');width: 18px;height: 18px}
  }
  &.btn-big{
    padding:8px 10px;font-size: 16px;display: block;
    @media (min-width: 768px){padding:8px 40px;display: inline-block}
  }
  &-link{color: @text-color; font-family: 'open_sansregular';  padding: 0; text-decoration: none;
    &:hover,&:focus{color: @link-hover-color;}
  }
  &-formules, &-formules:hover, &-formules:focus, &-formules:active{
    background: url('@{img}/btn_minus_24.png') no-repeat 100% 50% transparent;padding: 0 30px 0 0;min-height: 24px;color: @black33;
    &.collapsed{background: url('@{img}/btn_bonus_24.png') no-repeat 100% 50% transparent;margin-bottom: 0;}
  }
  &:active, &.active{.box-shadow(none);}
  &-revert{border: 1px solid @brand-primary; color: @brand-primary;white-space: normal; line-height: 24px; padding: 8px 30px; .border-radius(2px); text-transform: uppercase; background: transparent;
    &:hover, &:focus{color: @white; background-color: @btn-hover-bg; border-color: @btn-hover-bg;}
  }
  &-info{white-space: normal;padding: 8px 12px; font-family: 'open_sansregular';
    &:hover, &:focus{background-color: @black33; color: @white; border-color: @black33}
  }
}
.readMore {font-size: 14px;}
.btn-default{
  &:hover, &:focus{background-color: @btn-hover-bg;color: @white;}
}

.retour{text-transform: uppercase;line-height: 1em;margin-bottom: 10px;text-align: left;width: auto;
  @media(max-width: @screen-md-max){padding: 0}
  &-ico{display: inline-block; vertical-align: middle; background: @brand-primary; width: 28px; height: 28px; line-height: 23px; text-align: center;
    @media(min-width: @screen-lg){margin-right: 10px;}
  }
  span{vertical-align: middle; display: inline-block}
}

.bgWhite{background: @white;color: @black1d;}
.bgLightGrey{background: @greyeb;color: @black1d;}

.borderContentNav{margin: 25px auto 14px;position: relative;float: left;width: 100%;min-height: 1px;}

//Reseaux sociaux / partager sur la scroll bar
.scroll-bar {
  //etat OFF
  .ico{
    overflow: hidden;
    &.top{background-position:        -166px  -36px;}
    &.share{background-position:      -332px  -36px;}

    &.mail{background-position:       -277px  -36px;}
    &.fb{background-position:         -55px   -36px;}
    &.twitter{background-position:    -221px  -36px;}
    &.viadeo{background-position:     0px     -36px;}
    &.google{background-position:     -111px  -36px;}
    &.linkedin{background-position:   -391px  -36px}
  }
  //etat ON
  .btn:hover .ico, .btn:focus .ico, .btn:active .ico, a:hover .ico, a:focus .ico{
    &.top{background-position:        -166px  -99px;}
    &.share{background-position:      -332px  -99px;}

    &.mail{background-position:       -277px  -99px;}
    &.fb{background-position:         -55px   -99px;}
    &.twitter{background-position:    -221px  -99px;}
    &.viadeo{background-position:     0px     -99px;}
    &.google{background-position:     -111px  -99px;}
    &.linkedin{background-position:     -391px -99px;}
  }
}
@media (min-width: 768px){
  //Reseaux sociaux / partager sur la scroll bar
  .scroll-bar {
    //etat OFF
    .ico{
      &.top{background-position:        -166px    -154px;}
      &.share{background-position:      -332px    -154px;}

      &.mail{background-position:       -277px    -154px;}
      &.fb{background-position:         -55px     -154px;}
      &.twitter{background-position:    -221px    -154px;}
      &.viadeo{background-position:     0px       -153px;}
      &.google{background-position:     -111px    -154px;}
      &.linkedin{background-position:   -391px    -154px;}
    }
    //etat ON
    .btn:hover .ico, .btn:focus .ico, .btn:active .ico, a:hover .ico, a:focus .ico{
      &.top{background-position:        -166px  -216px;}
      &.share{background-position:      -332px  -216px;}

      &.mail{background-position:       -277px  -216px;}
      &.fb{background-position:         -55px   -216px;}
      &.twitter{background-position:    -221px  -216px;}
      &.viadeo{background-position:     0px     -216px;}
      &.google{background-position:     -111px  -216px;}
      &.linkedin{background-position:   -390px  -216px;}
    }
  }
}


.no{
  &-margin-top{margin-top:0}
  &-margin-bottom{margin-bottom :0}
  &-margin{margin-top:0;margin-bottom :0}
}

.bloc{
  text-align: center;margin-bottom: 10px;
  img{margin-bottom: 10px;}

  @media(min-width: 768px){
    .bloc .img {
      display: block;position: relative;
      &:after{content: " ";position: absolute;width: 95%;height: 20px;z-index: -10;}
    }
  }
}

input{
  .box-shadow(none);
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active{
  -webkit-box-shadow: 0 0 0px 1000px white inset;
}

a{text-decoration: none;}
.ico.ico-macro{.opacity(1)}

.link-plus{background: url('@{img}/s_site.svg') no-repeat -1174px -600px transparent;padding-left: 22px;height: 25px;display: block;line-height: 25px;}


@-moz-document url-prefix() {
  fieldset { display: table-cell; }
}

.btn-formules{white-space: normal;}

a, a:focus, a:active:focus, a.active:focus, button, button:active, button:focus, button.active:focus,.btn, .btn:focus, .btn:active:focus, .btn.active:focus{outline: none;outline-offset: 0;}

h3{margin-top: 0;
  &.title3{text-align: center;}
}
h4{font-size: @font-size-base; font-family: 'open_sansbold'}
p{
  &.noM{margin: 0}
  &.mtb25{margin-top: 25px;margin-bottom: 25px}
  &.mt25{margin-top: 25px;}
  &.mb25{margin-bottom: 25px}
}

.mb25{margin-bottom: 25px}
.mb40{padding-bottom: 40px;}


.object{
  &-left {float: left;clear: left;}
  &-right {float: right;clear: right;}
  &-center {margin-left: auto;margin-right: auto;text-align: center;}
}

.bloc-shadow img{.box-shadow(0px 8px 6px -6px, @grey66);}

svg{display: block; height: auto; max-width: 100%;}
.image-svg{display: block;
  .text-center &, .align-center &{margin-left: auto; margin-right: auto}
  .text-left &, .align-left &{margin-left: unset}
  .text-right &{float: right}
  @media(max-width: @screen-xs-max){
    .align-left &{margin-left: auto; margin-right: auto;}
  }
}
.ezxmltext-field{
  a{text-decoration: underline; color: @link-color;
    &:hover, &:focus, &:active{color: @link-hover-color}
    &.btn-primary, &.readMore{
      &, &:hover, &:focus{color: @white; text-decoration: none}
    }
  }
  .btn{text-decoration: none}
  .bg-border{background: @brand-primary;
    &-content{background: rgba(255,255,255,0.93); border-left: 3px solid @brand-primary; padding: 30px;
      p, div, a, &{
        .night &{color: @text-color}
      }
      *:last-child{margin-bottom: 0}
    }
  }
}

sup{top: -0.15em;}

.form{clear: both;}

.grabbing {cursor: pointer;}
.logo-page{margin-bottom: 10px;
  @media(min-width: 768px){
    img{float: right}
  }
}

.alert{
  padding: 5px 0;margin: 0;text-align: center;clear: both;
  &.alert-error{color: @brand-primary;}
  &.alert-success{background: none;border: none;color: @brand-primary;}
}

.modal-content{
  .border-radius(0);.box-shadow(0px 5px 10px,rgba(0, 0, 0, 0.25));
}

.embed-responsive{
  position: relative;display: block;padding: 0;overflow: hidden;
  &.embed-responsive-16by9 {padding-bottom: 56.25%;}
  &.border{border:2px solid white}
  .embed-responsive-item{position: absolute;top: 0; bottom: 0; left: 0; width: 100%;height: 100%;border: 0;}
}

.content-page{
  overflow: hidden;clear: both;
  &.locate-page{margin-top: 0}
  &.noMargin{margin: 0}
}

.title2{text-transform: uppercase; font-family:'noto_serifregular'; font-size: 16px}

.title3{font-family:'noto_serifregular';text-transform: uppercase;font-size: 22px}

.panel-group{
  .panel{
    overflow: hidden;
    .box-shadow(none);
    .panel-heading{
      p{
        a{
          text-decoration: none;
          display: block;
        }
      }
    }
    &+.panel{margin: 0}
  }
}

.list-group-form{
  margin: 0;padding: 0;min-height: 40px;background-color: @white;
  .list-group-item{background: url('@{img}/arrow_left_h.png') no-repeat 93% 50% @white;margin:0;border-left:none;border-right: none;border-top: none;border-color: @greycf;text-transform: uppercase;color: @black00;padding: 0 40px 0 10px;.border-radius(0px);height: 40px;line-height: 40px;width: 40%;margin: 0 auto;}
}


//Alert Green or Red
.confirmation .alert{
  background-color: @white;text-align: center;border:1px solid;line-height: 1;margin:0 0 25px 0;padding: 1em 0;font-size: 16px;.border-radius(0px);
  &.alert-success{color:@green66;border-color:@green66;}
  &.alert-success, &.alert-danger{padding-left: 50px;padding-right: 15px; position: relative}
  &.alert-danger{color:@brand-warning;border-color:@brand-warning;}

  .checked{
    background: url('@{img}/s_site.svg') no-repeat -65px -360px transparent;width: 32px;height: 32px; display: block; position: absolute;left:10px;margin: 0 auto;
    .no-svg & {background-image: url('@{img}/s_site.png')}
  }
  .unchecked{
    background: url('@{img}/s_site.svg') no-repeat -116px -360px transparent;width: 32px;height: 32px; display: block; position: absolute;left:10px;margin: 0 auto;
    .no-svg & {background-image: url('@{img}/s_site.png')}
  }
}


@media (min-width: 768px){
  .mb40{padding-bottom: 0px;}
  .confirmation .alert{
    .checked{top: 8px;} //13361
    &.alert-success, &.alert-danger{padding-right: 50px;}
  }
}

li.bullet_1{list-style: outside none none;padding-left: 10px;background: url('@{img}/list/puce-01.png') no-repeat scroll left 8px transparent;}
li.bullet_2{list-style: outside none none;padding-left: 10px;background: url('@{img}/list/puce-02.png') no-repeat scroll left 8px transparent;}
li.bullet_3{list-style: outside none none;padding-left: 10px;background: url('@{img}/list/puce-03.png') no-repeat scroll left 8px transparent;}

.list{
  &-check, &-number{list-style: none;
    &, li{position: relative;
      .widget-content .ezxmltext-field &{
        @media(max-width: @screen-xs-max){padding-left: 0}
      }
      .widget-content.align-center .ezxmltext-field &{padding-left: 0}
      .widget-content.align-right .ezxmltext-field &{padding-left: 0;}
      &:before{position: absolute; left: 0;
        .widget .ezxmltext-field &{margin-left: 0; position: absolute; margin-right: 0;
          @media(max-width: @screen-xs-max){display: inline-block; vertical-align: middle; margin-right: 10px; position: static}
        }
        .widget-content.align-center .ezxmltext-field &{display: inline-block; vertical-align: middle; margin-right: 10px; position: static}
        .widget-content.align-right .ezxmltext-field &{left: inherit; right: 0}
      }
    }
  }
  &-check{
    &, li{padding-left: 22px;
      .widget-content.align-right .ezxmltext-field &{padding-right: 22px}
      &:before{content: ''; width: 12px; height: 8px; background: url('@{img}/list/check-list.svg') no-repeat left center;top: 8px;
        .widget .ezxmltext-field &{content: '';}
      }
      .no-svg &{background-image: url('@{img}/list/check-list.png')}
    }
  }
  &-number{
    &, li{counter-increment: step-counter; padding-left: 42px; margin-bottom: 20px;
      .widget-content.align-right .ezxmltext-field &{padding-right: 42px}
      &:before{content: counter(step-counter); width: 32px; height: 32px; border: 1px solid @brand-primary; text-align: center; line-height: 32px; .border-radius(100%); top: -4px; font-size: 14px; color: @brand-primary;
        .widget .ezxmltext-field &{content: counter(step-counter); font-size: @font-size-small}
      }
    }
  }
}
ul, ol{
  &.list-check, &.list-number{padding: 0;
    .widget-content.align-right .ezxmltext-field &{padding: 0}
    &:before{
      .widget .ezxmltext-field &{
        @media(max-width: @screen-xs-max){display: none;}
      }
      &, .widget-content.align-center .ezxmltext-field &{display: none;}
    }
  }
  &.list-check{background: none;}
  &.list-number{counter-increment: none}
  &.noPadding{padding-left: 15px;list-style-position: outside;}
  &.bullet_1 li{
    list-style: outside none none;padding-left: 10px;background: url('@{img}/list/puce-01.png') no-repeat scroll left 8px transparent;
    ul li{
      background-image: url('@{img}/list/puce-02.png');
      ul li{background-image: url('@{img}/list/puce-03.png')}
    }
  }
  &.bullet_2 li{
    list-style: outside none none;padding-left: 10px;background: url('@{img}/list/puce-02.png') no-repeat scroll left 8px transparent;
    ul li{background-image: url('@{img}/list/puce-03.png')}
  }
  &.bullet_3 li{list-style: outside none none;padding-left: 10px;background: url('@{img}/list/puce-03.png') no-repeat scroll left 8px transparent;}
}


.transition-property2(@transition-property, @transition-property2) {
  -webkit-transition-property: @transition-property, @transition-property2;
  transition-property: @transition-property, @transition-property2;
}