/* ------------------------------------------------
* 1.1. Primary Colors
--------------------------------------------------*/
/* ------------------------------------------------
* 1.2. Secondary Colors
--------------------------------------------------*/
/* ------------------------------------------------
* 1.3. Web-only greys
--------------------------------------------------*/
/* ------------------------------------------------
* 1.4. Colours for graphs and illustrations
--------------------------------------------------*/
/* ------------------------------------------------
* 1.5. Widget Colours
--------------------------------------------------*/
/* ------------------------------------------------
* 2.1. Blue-Grey - Primary Action - buttonType01
--------------------------------------------------*/
/* ------------------------------------------------
* 2.2. Soft-Grey - Action - buttonType02
--------------------------------------------------*/
/* ------------------------------------------------
* 2.3. Green - Call to Action - buttonType03
--------------------------------------------------*/
/* ------------------------------------------------
* 2.4. Links
--------------------------------------------------*/
/* ------------------------------------------------
* 2.5. Input
--------------------------------------------------*/
/* ------------------------------------------------
* 3.1. Definitions of content widths
--------------------------------------------------*/
/* ------------------------------------------------
* 3.2. Definitions of content gutters
--------------------------------------------------*/
/* ------------------------------------------------
* 3.3. Definition of Breakpoints for Media Queries
--------------------------------------------------*/
/* ------------------------------------------------
* 3.4. Definition of grid elements
--------------------------------------------------*/
/* ------------------------------------------------
* 4.1. Prefix for icons
--------------------------------------------------*/
/* ------------------------------------------------
* 4.2. Codes for icons
--------------------------------------------------*/
/* ==========================================================================
   @mixins
   ========================================================================== */
/*
 * Documentation about mixin with SASS: http://sass-lang.com/documentation/file.SASS_REFERENCE.html#mixins
 * 
 * ------------------------------------------------------
 * Table of Contents
 * ------------------------------------------------------
 * 
 * 1. Mixins Global
 *    1.1. (V)Align Center for element [align-center($orientation)]
 *    1.2. Text Color for the different state of a link <a>
 *    1.3. Calculation element (percent value and other value like em, pc etc...)
 *    1.4. Alignment placeholder
 *    1.5. Font-Face code generator
 * 
 * 2. Mixins for Media Queries
 *    2.1. Media Queries "min-width" [at-least($device-width)]
 *    2.2. Media Queries "max-width" [until($device-width)]
 *    2.3. Media Queries "max-width" and "min-width" [for-device($device)]
 *    2.4. Media Queries retina devices
 *    2.5. Media Queries "min-width" [from-device($device-width)]
 * 
 * 3. Mixins for Print
 *    3.1. Media Queries for Print [print($value)]
 *    3.2. Shortcut for hidde Element only for Print [no-print]
 * 
 * 4. Mixins for Grid
 * 
 * 5. Mixins for Animation
 *    5.1. Keyframes
 * 
 * 6. Mixins for Icon Font
 *    6.1. Icon After
 * 
 */
/* -------------------------------------------------------------
   * 1.1. (V)Align Center for element [align-center($orientation)]
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 1.2. Text Color for the different state of a link <a>
   ---------------------------------------------------------------*/
/* ---------------------------------------------------------------------------
   * 1.3. Calculation element (percent value and other value like em, pc etc...)
   -----------------------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 1.4. Alignment placeholder
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 1.5. Font-Face code generator
   ---------------------------------------------------------------*/
/* 
    * -------------------------------------------
    * Example the code taht we use:
    * -------------------------------------------
     
      @include font-face-belfius('BelfiusNormalLight', 
          'belfiusnormal_light.woff',
          'belfiusnormal_light.ttf',
          'belfiusnormal_light.svg', 
          'belfiusnormal_regular.eot',
         normal, normal
      );
    
    ---------------------------------------------
    */
/* -------------------------------------------------------------
   * 2.1. Media Queries "min-width" [at-least($device-width)]
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 2.2. Media Queries "max-width" [until($device-width)]
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 2.3. Media Queries "max-width" and "min-width" 
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 2.4. Media Queries retina devices 
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 2.5. Media Queries "min-width" [from-device($device-width)]
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 3.1. Media Queries for Print [print($value)]
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 3.2. Shortcut for hidde Element only for Print [no-print]
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 5.1. Keyframes
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 5.2. Single-Animation
   ---------------------------------------------------------------*/
/* -------------------------------------------------------------
   * 6.1. Icon After
   ---------------------------------------------------------------*/
/* ==========================================================================
   @functions
   ========================================================================== */
/*
 * Documentation about function with SASS: http://sass-lang.com/documentation/file.SASS_REFERENCE.html#function_directives
 * 
 * ------------------------------------------------------
 * Table of Contents
 * ------------------------------------------------------
 * 
 * 1. Grid Column(s) Size
 *    
 * 
 */
/* ------------------------------------------------
 * 2.1. Container Base
 --------------------------------------------------*/
.grid, .wd_CMFM-STAR {
  width: 1152px;
  margin: 0 auto 24px auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box; }
  @media only screen and (max-width: 1199px) {
    .grid, .wd_CMFM-STAR {
      width: -webkit-calc(100% - (2 * 24px));
      width: -moz-calc(100% - (2 * 24px));
      width: -ms-calc(100% - (2 * 24px));
      width: -o-calc(100% - (2 * 24px));
      width: calc(100% - (2 * 24px)); } }
  @media only screen and (max-width: 1007px) {
    .grid, .wd_CMFM-STAR {
      width: -webkit-calc(100% - (2 * 34px));
      width: -moz-calc(100% - (2 * 34px));
      width: -ms-calc(100% - (2 * 34px));
      width: -o-calc(100% - (2 * 34px));
      width: calc(100% - (2 * 34px));
      margin: 0px auto 36px auto; } }
  @media only screen and (max-width: 767px) {
    .grid, .wd_CMFM-STAR {
      width: 100%;
      padding-left: 15px;
      padding-right: 15px; } }

/* ------------------------------------------------
 * 2.2. Container Base Spaced Mobile
 --------------------------------------------------*/
/* ------------------------------------------------
 * 3.1. Column 1on2 
 --------------------------------------------------*/
/* ------------------------------------------------
 * 3.2. Column 1on3 
 --------------------------------------------------*/
/* ------------------------------------------------
 * 3.3. Column 2on3 
 --------------------------------------------------*/
@media only screen and (max-width: 1007px) {
 }
@media only screen and (max-width: 767px) {
 }

@media only screen and (max-width: 1007px) {
 }
@media only screen and (max-width: 767px) {
 }

@media only screen and (max-width: 1007px) {
 }
@media only screen and (max-width: 767px) {
 }

@media only screen and (max-width: 1007px) {
 }
@media only screen and (max-width: 767px) {
 }

@media only screen and (max-width: 1007px) {
 }

@media only screen and (max-width: 1007px) {
 }

.grid {
  overflow: hidden;
  /*padding: {
        top: 20px;
        //right: 0;
        //left: 20px;
    }*/
  /*&::before { @include box-sizing('border-box'); }*/
  /*&::after {
        content: "";
        display: table;
        clear: both;
        @include box-sizing('border-box');
    }*/
  /*@include until($tablet){ // -------------------------- Mobile 
        display: block;
        width: auto;
        margin: {
            right: 0;
            left: 0;
        }
        padding: {
            right: 10px;  
            left: 20px;
        }
    }*/ }

/*.grid-row {
    width: auto;
    margin-bottom: 15px;
    clear: both;
    overflow: hidden;
}*/
/*.hide-on-mobile {
    @include until($tablet){ // -------------------------- Mobile 
      display: none;
      width: 0;
      height: 0;
    }
}*/
/*.push-right {
    float: right;
}*/
.col-12-12 {
  float: left;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 0;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-12-12:first-child, .col-12-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-12-12, .col-offset-12-12:first-child {
  margin-left: 100%; }

.col-11-12 {
  float: left;
  width: 91.66667%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-11-12:first-child, .col-11-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-11-12, .col-offset-11-12:first-child {
  margin-left: 91.66667%; }

.col-10-12 {
  float: left;
  width: 83.33333%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-10-12:first-child, .col-10-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-10-12, .col-offset-10-12:first-child {
  margin-left: 83.33333%; }

.col-9-12 {
  float: left;
  width: 75%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-9-12:first-child, .col-9-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-9-12, .col-offset-9-12:first-child {
  margin-left: 75%; }

.col-8-12 {
  float: left;
  width: 66.66667%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-8-12:first-child, .col-8-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-8-12, .col-offset-8-12:first-child {
  margin-left: 66.66667%; }

.col-7-12 {
  float: left;
  width: 58.33333%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-7-12:first-child, .col-7-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-7-12, .col-offset-7-12:first-child {
  margin-left: 58.33333%; }

.col-6-12 {
  float: left;
  width: 50%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-6-12:first-child, .col-6-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-6-12, .col-offset-6-12:first-child {
  margin-left: 50%; }

.col-5-12 {
  float: left;
  width: 41.66667%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-5-12:first-child, .col-5-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-5-12, .col-offset-5-12:first-child {
  margin-left: 41.66667%; }

.col-4-12 {
  float: left;
  width: 33.33333%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-4-12:first-child, .col-4-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-4-12, .col-offset-4-12:first-child {
  margin-left: 33.33333%; }

.col-3-12 {
  float: left;
  width: 25%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-3-12:first-child, .col-3-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-3-12, .col-offset-3-12:first-child {
  margin-left: 25%; }

.col-2-12 {
  float: left;
  width: 16.66667%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-2-12:first-child, .col-2-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-2-12, .col-offset-2-12:first-child {
  margin-left: 16.66667%; }

.col-1-12 {
  float: left;
  width: 8.33333%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 15px;
  padding-left: 20px;
  /*&::before { @include box-sizing('border-box'); }
        &::after { @include box-sizing('border-box'); }*/ }
  .col-1-12:first-child, .col-1-12.firstChild {
    clear: left;
    padding-left: 0; }

.col-offset-1-12, .col-offset-1-12:first-child {
  margin-left: 8.33333%; }

@media only screen and (max-width: 767px) {
  .col-12-12, .col-offset-12-12, .col-offset-12-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-11-12, .col-offset-11-12, .col-offset-11-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-10-12, .col-offset-10-12, .col-offset-10-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-9-12, .col-offset-9-12, .col-offset-9-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-8-12, .col-offset-8-12, .col-offset-8-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-7-12, .col-offset-7-12, .col-offset-7-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-6-12, .col-offset-6-12, .col-offset-6-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-5-12, .col-offset-5-12, .col-offset-5-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-4-12, .col-offset-4-12, .col-offset-4-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-3-12, .col-offset-3-12, .col-offset-3-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-2-12, .col-offset-2-12, .col-offset-2-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }

  .col-1-12, .col-offset-1-12, .col-offset-1-12:first-child {
    width: auto;
    float: none;
    padding-left: 0; }
 }

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); } }

@-moz-keyframes fadeOutLeft {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); } }

@-o-keyframes fadeOutLeft {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); } }

@-ms-keyframes fadeOutLeft {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); } }

@keyframes fadeOutLeft {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); } }

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); } }

@-moz-keyframes fadeOutRight {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); } }

@-o-keyframes fadeOutRight {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); } }

@-ms-keyframes fadeOutRight {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); } }

@keyframes fadeOutRight {
  0% {
    opacity: 1; }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); } }

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@-o-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@-ms-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@-moz-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@-o-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@-ms-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0); }

  100% {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none; } }

.wd_CMFM-STAR {
  /* ---------------------------------------------
     * Progress Bar Statut
     * --------------------------------------------- */
  /* ---------------------------------------------
     * Questions
     * --------------------------------------------- */ }
  .wd_CMFM-STAR > header {
    margin-top: 25px;
    margin-bottom: 25px; }
  .wd_CMFM-STAR .progress-statut {
    counter-reset: step-counter;
    margin-top: 25px; }
    @media only screen and (max-width: 767px) {
      .wd_CMFM-STAR .progress-statut {
        display: none; } }
    .wd_CMFM-STAR .progress-statut::after {
      visibility: hidden;
      display: block;
      font-size: 0;
      content: " ";
      clear: both;
      height: 0; }
    .wd_CMFM-STAR .progress-statut ol {
      width: 50%;
      margin-left: 25%; }
      .wd_CMFM-STAR .progress-statut ol li {
        float: left;
        display: inline-block;
        width: 9.09091%; }
        .wd_CMFM-STAR .progress-statut ol li::before {
          content: "";
          display: inline-block;
          float: left;
          width: -webkit-calc(100% - 26px);
          width: -moz-calc(100% - 26px);
          width: -ms-calc(100% - 26px);
          width: -o-calc(100% - 26px);
          width: calc(100% - 26px);
          height: 14px;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          -ms-box-sizing: border-box;
          -o-box-sizing: border-box;
          box-sizing: border-box;
          border-bottom: 2px solid #e3dcd3; }
        .wd_CMFM-STAR .progress-statut ol li::after {
          content: counter(step-counter);
          counter-increment: step-counter;
          float: left;
          display: inline-block;
          width: 26px;
          height: 26px;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          -ms-box-sizing: border-box;
          -o-box-sizing: border-box;
          box-sizing: border-box;
          -webkit-border-radius: 50%;
          -moz-border-radius: 50%;
          -ms-border-radius: 50%;
          -o-border-radius: 50%;
          border-radius: 50%;
          border: 2px solid #e3dcd3;
          background-color: #fff;
          color: #e3dcd3;
          text-align: center;
          line-height: 22px;
          font-size: 12px;
          font-weight: 700;
          color: #e3dcd3; }
        .wd_CMFM-STAR .progress-statut ol li:nth-of-type(1)::before {
          opacity: 0; }
        .wd_CMFM-STAR .progress-statut ol li:nth-last-of-type(1)::after {
          font-family: 'FontAwesome';
          content: '\f129'; }
        .wd_CMFM-STAR .progress-statut ol li.isActive::before {
          border-color: #93bf3e;
          -webkit-transition: all 0.25s;
          -webkit-transition-delay: ease;
          -moz-transition: all 0.25s ease;
          -o-transition: all 0.25s ease;
          transition: all 0.25s ease; }
        .wd_CMFM-STAR .progress-statut ol li.isActive::after, .wd_CMFM-STAR .progress-statut ol li.isActive.isDone::after {
          background-color: #7b736d;
          border-color: #7b736d;
          color: #fff;
          -webkit-transition: all 0.25s;
          -webkit-transition-delay: ease;
          -moz-transition: all 0.25s ease;
          -o-transition: all 0.25s ease;
          transition: all 0.25s ease; }
        .wd_CMFM-STAR .progress-statut ol li.isDone::before {
          border-color: #93bf3e;
          -webkit-transition: all 0.25s;
          -webkit-transition-delay: ease;
          -moz-transition: all 0.25s ease;
          -o-transition: all 0.25s ease;
          transition: all 0.25s ease; }
        .wd_CMFM-STAR .progress-statut ol li.isDone::after {
          background-color: #93bf3e;
          border-color: #93bf3e;
          color: #fff;
          -webkit-transition: all 0.25s;
          -webkit-transition-delay: ease;
          -moz-transition: all 0.25s ease;
          -o-transition: all 0.25s ease;
          transition: all 0.25s ease; }
  .wd_CMFM-STAR .steps-tooltip {
    display: none;
    position: absolute;
    width: 220px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.8);
    text-align: left;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px; }
    .wd_CMFM-STAR .steps-tooltip:before {
      content: "";
      display: block;
      position: absolute;
      top: -5px;
      left: 10px;
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 0 5px 5px 5px;
      border-color: transparent transparent rgba(0, 0, 0, 0.8) transparent; }
    .wd_CMFM-STAR .steps-tooltip .tooltip-step {
      font-weight: bold; }
      .wd_CMFM-STAR .steps-tooltip .tooltip-step:after {
        display: inline-block;
        content: "(uncompleted)";
        margin-left: 5px;
        color: orange; }
    .wd_CMFM-STAR .steps-tooltip .tooltip-title {
      font-weight: bold;
      margin-bottom: 5px; }
  .wd_CMFM-STAR form {
    overflow: visible; }
  .wd_CMFM-STAR fieldset {
    opacity: 0;
    display: none; }
    .wd_CMFM-STAR fieldset.isActive {
      opacity: 1;
      display: block; }
    .wd_CMFM-STAR fieldset > footer {
      overflow: hidden;
      margin-top: 25px; }
      .wd_CMFM-STAR fieldset > footer .button.previous {
        float: left; }
      .wd_CMFM-STAR fieldset > footer .button.next {
        float: right; }
  .wd_CMFM-STAR .result-simulator {
    opacity: 0; }
    .wd_CMFM-STAR .result-simulator.isActive {
      opacity: 1; }
    .wd_CMFM-STAR .result-simulator a {
      color: #fff; }
  .wd_CMFM-STAR .Result-Answer1, .wd_CMFM-STAR .Result-Answer2, .wd_CMFM-STAR .Result-Answer3, .wd_CMFM-STAR .Result-Answer4 {
    margin: 25px auto;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    padding: 15px;
    color: #fff; }
    .wd_CMFM-STAR .Result-Answer1 h3, .wd_CMFM-STAR .Result-Answer2 h3, .wd_CMFM-STAR .Result-Answer3 h3, .wd_CMFM-STAR .Result-Answer4 h3 {
      color: #fff;
      margin-bottom: 15px; }
    .wd_CMFM-STAR .Result-Answer1 footer, .wd_CMFM-STAR .Result-Answer2 footer, .wd_CMFM-STAR .Result-Answer3 footer, .wd_CMFM-STAR .Result-Answer4 footer {
      margin-top: 30px;
      text-align: center; }
  .wd_CMFM-STAR #button-simulate {
    float: right; }
  .wd_CMFM-STAR .Result-Answer1 {
    background-color: #7a8d9b; }
  .wd_CMFM-STAR .Result-Answer2 {
    background-color: #00a7a6; }
  .wd_CMFM-STAR .Result-Answer3 {
    background-color: #e7803f; }
  .wd_CMFM-STAR .Result-Answer4 {
    background-color: #006764; }
  .wd_CMFM-STAR .fadeOutLeft {
    -moz-animation: fadeOutLeft 0.5s 0s 1;
    -webkit-animation: fadeOutLeft 0.5s 0s 1;
    -o-animation: fadeOutLeft 0.5s 0s 1;
    -ms-animation: fadeOutLeft 0.5s 0s 1;
    animation: fadeOutLeft 0.5s 0s 1; }
  .wd_CMFM-STAR .fadeOutRight {
    -moz-animation: fadeOutRight 0.5s 0s 1;
    -webkit-animation: fadeOutRight 0.5s 0s 1;
    -o-animation: fadeOutRight 0.5s 0s 1;
    -ms-animation: fadeOutRight 0.5s 0s 1;
    animation: fadeOutRight 0.5s 0s 1; }
  .wd_CMFM-STAR .fadeInLeft {
    -moz-animation: fadeInLeft 1s 0s 1;
    -webkit-animation: fadeInLeft 1s 0s 1;
    -o-animation: fadeInLeft 1s 0s 1;
    -ms-animation: fadeInLeft 1s 0s 1;
    animation: fadeInLeft 1s 0s 1; }
  .wd_CMFM-STAR .fadeInRight {
    -moz-animation: fadeInRight 1s 0s 1;
    -webkit-animation: fadeInRight 1s 0s 1;
    -o-animation: fadeInRight 1s 0s 1;
    -ms-animation: fadeInRight 1s 0s 1;
    animation: fadeInRight 1s 0s 1; }

/*# sourceMappingURL=StartersTest.css.map */