/**
 * Project style sheet.
 *
 * @package    vanilla
 * @subpackage css
 * @author     Loops <evrard at h2a dot lu>
 * @version    SVN: $Id: styles.css 95 2017-08-21 13:29:47Z julienGhome $
 */

/*** BASICS -------------------- ***/

/** these styles should be available in CKEditor too **/

.font0 { font-family: avenir,sans-serif; } /* default font family */
.font1 { font-family: cormorant, serif; font-weight: normal; } /* secondary font family */
.font2 {} /* ... */

/* special titlz size */
.h1\,5 { font-size: 32px; }

.cl0 { color: #191E31; } /* default color */
.cl1 { color: #F2543A; } /* secondary color */
.cl2 { color: #474B5A; } /* ... */

/** images **/
img.left { margin: 0 20px 20px 0; }
img.right { margin: 0 0 20px 20px; }

/* undo lowercase for german * / html[lang="de"] .lc { text-transform: none !important; } /**/



/*** ELEMENTS ------------------ ***/

/** buttons **/
button, .btn { font-size: 15px; line-height: 1.231; color: #fff; padding: 12px 20px 14px; border-radius: 64px; border: 0; background-color: #F2543A; display: inline-block; text-align: center; text-decoration: none !important; transition: background-color 100ms ease-in-out; }
html.mac button, html.mac .btn { padding-top: 14px; padding-bottom: 12px; } /* Chrome/Safari MAC */
x:-moz-any-link, html.mac button, html.mac .btn { padding-top: 13px; padding-bottom: 13px; } /* Firefox MAC */
html.android button, html.android .btn { padding-top: 14px; padding-bottom: 12px; } /* Chrome Android */
html.safari_ios button, html.safari_ios .btn { padding-top: 14px; } /* Safari iOs */

button:hover, .btn:hover, button:focus, .btn:focus { background-color: #D84B33; }
button:active, .btn:active { background-color: #C0422E; }
  /* separator in button */
  .btn_sep { display: inline-block; margin: 0 12px; position: relative; }
  .btn_sep:before { content: ""; background-color: currentColor; position: absolute; top: -3px; bottom: -5px; width: 1px; left: 50%; opacity: 0.3; }
  html.android .btn_sep:before { top: -4px; } /* Chrome Android */
  html.safari_ios .btn_sep:before { top: -5px; } /* Safari iOs */

.btn2 { font-size: 15px; line-height: 1.231; color: inherit; padding: 11px 19px 13px; border-radius: 64px; border: 1px #D1D2D5 solid; background-color: transparent; display: inline-block; text-align: center; text-decoration: none !important; }
html.chrome .btn2 { padding-top: 12px; padding-bottom: 12px; } /* Chrome PC */
html.mac .btn2 { padding-top: 13px; padding-bottom: 11px; } /* Chrome/Safari MAC */
x:-moz-any-link, html.mac .btn2 { padding-top: 12px; padding-bottom: 12px; } /* Firefox MAC */
html.android .btn2 { padding-top: 13px; padding-bottom: 11px; } /* Chrome Android */
html.safari_ios .btn2 { padding-top: 13px; } /* Safari iOs */
.btn2:hover, .btn2:focus { background-color: #F2543A; color: #fff; border-color: #F2543A; }
.btn2:active { background-color: #C0422E; border-color: #C0422E; }

.btn3 { font-size: 12px; line-height: 1.231; color: inherit; padding: 5px 19px; border-radius: 64px; border: 1px #D1D2D5 solid; background-color: transparent; display: inline-block; text-align: center; text-decoration: none !important; }
/* html.mac .btn3 { padding-top: 5px; padding-bottom: 5px; } /* Chrome/Safari MAC */
/* x:-moz-any-link, html.mac .btn3 { padding-top: 5px; padding-bottom: 5px; } /* Firefox MAC */
html.android .btn3 { padding-bottom: 6px; } /* Chrome Android */
.btn3:hover, .btn3:focus { background-color: #F2543A; color: #fff; border-color: #F2543A; }
.btn3:active { background-color: #C0422E; color: #fff; border-color: #C0422E; }

.btn4 { font-size: 12px; line-height: 1.231; color: #fff; padding: 5px 19px; border-radius: 64px; border: 1px #474B5A solid; background-color: transparent; display: inline-block; text-align: center; text-decoration: none !important; transition: background-color 100ms ease-in-out, border-color 100ms ease-in-out; }
/* html.mac .btn4 { padding-top: 5px; padding-bottom: 5px; } */
/* x:-moz-any-link, html.mac .btn4 { padding-top: 5px; padding-bottom: 5px; } /* Firefox MAC */
html.android .btn4 { padding-bottom: 6px; } /* Chrome Android */
.btn4:hover, .btn4:focus { background-color: #F2543A; border-color: #F2543A; }
.btn4:active { background-color: #C0422E; border-color: #C0422E; }

.btn5 { font-size: 16px; line-height: 1.231; color: #fff; padding: 11px 20px 13px; border-radius: 64px; border: 1px #474B5A solid; background-color: transparent; display: inline-block; text-align: center; text-decoration: none !important; cursor: pointer; }
html.chrome .btn5 { padding-top: 12px; padding-bottom: 12px; } /* Chrome PC */
html.mac .btn5 { padding-top: 13px; padding-bottom: 11px; } /* Safari MAC */
html.mac.chrome .btn5 { padding-top: 14px; } /* Chrome MAC */
x:-moz-any-link, html.mac .btn5 { padding-top: 12px; padding-bottom: 12px; } /* Firefox MAC */
html.android .btn5 { padding-top: 13px; padding-bottom: 11px; } /* Chrome Android */
html.safari_ios .btn5 { padding-top: 13px; } /* Safari iOs */
.btn5:hover, .btn5:focus { background-color: #F2543A; border-color: #F2543A; }
.btn5:active { background-color: #C0422E; border-color: #C0422E; }


/** pagination **/
.pagenav {}
  /* list */
  .pagenav_list {}
    /* item */
    .pagenav_item {}
      /* link */
      .pagenav_link {}
      /* hover */
      .pagenav_link:hover {}
      /* active/focus */
      .pagenav_link:active, .pagenav_link:focus {}
      /* current, not <a> */
      .pagenav_link.\:current {}
      /* special links */
      .pagenav_linkfirst {} /* go to first page */
      .pagenav_linkprev {}  /* go to previous page */
      .pagenav_linknext {}  /* go to next page */
      .pagenav_linklast {}  /* go to last page */



/*** LISTS --------------------- ***/

/** list1, used for products on homepage section 3 **/
/* title above the list */
.list1 { margin: 12px -8px;
  display: -ms-flexbox; display: -webkit-flex; display: flex;
  -ms-flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;
  -ms-align-items: stretch; -webkit-align-items: stretch; align-items: stretch;
}
  /* item */
  .list1_item { margin: 8px; display: inline-block; vertical-align: top; -ms-flex: 1; -webkit-flex: 1; flex: 1; }
    /* box around item data */
    .list1_itembox { height: 100%; border: 1px #d1d2d5 solid; padding: 40px 10px 115px 10px; position: relative; box-sizing: border-box; box-shadow: 0 5px 20px rgba(0,0,0,0); transition: box-shadow 250ms ease-in-out, background-color 100ms ease-in-out; }
      /* item content */
      .list1_itemhead {}
        .list1_itemtitle { color: inherit; margin: 0; font-weight: normal; }
        .list1_itemprice { font-size: 40px; display: inline-block; margin: 8px 0 0; }
      .list1_itemtext { font-size: 13px; line-height: 1.763; margin: 36px 0 0; }
      .list1_itembtn { position: absolute; bottom: 40px; z-index: 1; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap; }
    /* effect */
    .list1_itembox:hover { background-color: #fff; border-color: #fff; box-shadow: 0 10px 20px rgba(0,0,0,.1); }
      .list1_itembox:hover > .list1_itembtn { background-color: #F2543A; border-color: #F2543A; color: #fff; }

  /* flex degradation */
  html.ie_lt10 .list1_item { width: calc( 20% - 16px ); }
      html.ie_lt10 .list1_itemtext { min-height: 115px; }
  /* height 100% fails for itembox on Safari MAC */
    html.mac .list1_itemtext { min-height: 115px; }


/** list2, used for press list on standard footer **/
.list2 { margin: 16px -16px -16px; }
  .list2_item { display: inline-block; vertical-align: middle; width: calc( 16.6666% - 32px ); margin: 16px; }
    .list2_itemimg { max-width: none; width: 100%; }


/** list3, used for method steps on homepage section 1 **/
.list3 {
  margin: 45px 0 0; counter-reset: list3;
  display: -ms-flexbox; display: -webkit-flex; display: flex;
  -ms-flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;
  -ms-align-items: stretch; -webkit-align-items: stretch; align-items: stretch;
}
  .list3_item { display: inline-block; vertical-align: top; position: relative; -ms-flex: 1; -webkit-flex:1; flex: 1; counter-increment: list3; margin-bottom: 20px; }
    .list3_itemlink { position: relative; padding: 46px 16px 0; }
    /* .list3_itemlink:before { content: counter(list3); width: 32px; height: 32px; text-align: center; line-height: 30px; text-indent: 1px; position: absolute; z-index: 2; top: 0; left: 50%; border-radius: 100%; border: 1px #E8E9EA solid; background-color: #fff; transform: translateX(-50%) scale(1); transition: transform 250ms ease-in-out; } */
    /* indicator */
    .list3_itemlink:before {
      content: counter(list3); width: 35px; height: 35px; margin-left: -17.5px; text-align: center; line-height: 32px; text-indent: 1.5px;
      position: absolute; z-index: 2; top: 0; left: 50%; border-radius: 100%; font-size: 16px; font-weight: bold; border: 1px #E8E9EA solid; background-color: #fff; box-sizing: border-box;
      -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);
      transition: -webkit-transform 250ms ease-in-out; -ms-transition: transform 250ms ease-in-out; transition: transform 250ms ease-in-out;
    }
    html.chrome .list3_itemlink:before { line-height: 34px; text-indent: 1px !important; } /* Chrome PC+MAC */
    html.mac .list3_itemlink:before { line-height: 36px; text-indent: 2px; } /* Chrome/Safari MAC */
    x:-moz-any-link, html.mac .list3_itemlink:before { line-height: 34px; text-indent: 1.5px; } /* Firefox MAC */
    html.android .list3_itemlink:before { line-height: 36px; } /* Chrome Android */
    html.safari_ios .list3_itemlink:before { text-indent: 1.5px; line-height: 34px; } /* Safari iOs */

    .list3_item + .list3_item > .list3_itemlink:after { content: ""; background-color: #E8E9EA; height: 1px; position: absolute; z-index: 1; top: 17px; left: -50%; right: 50%; }
      .list3_itemtitle { font-size: 23px; }
      .list3_itembtn {
        display: inline-block; margin-top: 8px; opacity: 0;
        -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px);
        -webkit-transition: -webkit-transform 250ms ease-in-out, opacity 250ms ease-in-out; -ms-transition: transform 250ms ease-in-out, opacity 250ms ease-in-out; transition: transform 250ms ease-in-out, opacity 250ms ease-in-out;
      }
      .list3_itemimgwrapper {
        width: 40px; height: 40px; margin: auto; border-radius: 100%; border: 2px #F2543A solid; background-color: #fff; position: absolute; left: 50%; top: -5px; margin-left: -20px; z-index: 2;
        display: -ms-flexbox; display: -webkit-flex; display: flex;
        -webkit-transform: scale(0) rotate(10deg); -ms-transform: scale(0) rotate(10deg); transform: scale(0) rotate(10deg);
        -webkit-transition: -webkit-transform 250ms ease-in-out 100ms; -ms-transition: transform 250ms ease-in-out 100ms; transition: transform 250ms ease-in-out 100ms;
      }
        .list3_itemimg { width: 32px; height: 32px; margin: auto; }

    /* effect */
  .list3_itemlink:hover, .list3_itemlink:focus, .list3_itemlink:active { color: #F2543A !important; }
  .list3_itemlink:hover:before, .list3_itemlink:focus:before, .list3_itemlink:active:before { -webkit-transform: none; -ms-transform: none; transform: none; }
    .list3_itemlink:hover > .list3_itembtn, .list3_itemlink:focus > .list3_itembtn, .list3_itemlink:active > .list3_itembtn { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; }
    .list3_itemlink:hover > .list3_itemimgwrapper {
      -webkit-transform: none; -ms-transform: none; transform: none;
      -webkit-transition: -webkit-transform 250ms ease-in-out; -ms-transition: transform 250ms ease-in-out; transition: transform 250ms ease-in-out;
    }


/** list4, used for texts on homepage section 2 **/
.list4 { margin: 29px -32px; }
  .list4_item { display: inline-block; vertical-align: top; width: calc( 25% - 64px ); margin: 16px 32px; }
    .list4_itemtitle { margin: 0; }
    .list4_itemtext { margin: 5px 0 0; }


/** list5, used for testimonies on homepage section 4 **/
/* title above list */
.list5_title { margin-bottom: 0; }
/* scrollable container */
.list5_out { overflow: auto; margin: auto; max-width: 640px; display: inline-block; width: 100%; position: relative; }
/* gradient mask */
.list5_out:before, .list5_out:after { content: ""; position: absolute; top: 0; bottom: 0; width: 9999px; z-index: 2; }
.list5_out:before { right: 100%;
  /* fails /** / background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 100% 50% no-repeat; /**/
  background-color: rgba(255,255,255,0.75);
  background: -moz-linear-gradient(right, rgba(255,255,255,0) 0, rgba(255,255,255,1) 320px); /* FF3.6-15 */
  background: -webkit-linear-gradient(right, rgba(255,255,255,0) 0,rgba(255,255,255,1) 320px); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to left, rgba(255,255,255,0) 0,rgba(255,255,255,1) 320px); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.list5_out:after { left: 100%;
  /* fails /** / background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 0 50% no-repeat; /**/
  background-color: rgba(255,255,255,0.75);
  background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 320px); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 320px); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 320px); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
  /* next/prev */
  .list5_prev, .list5_next { position: absolute; top: 0; bottom: 0; width: 100%; z-index: 3; cursor: pointer; }
  .list5_prev { right: 50%; } .list5_next { left: 50%; }
  /* icon */
  .list5_prev:before, .list5_next:before { position: absolute; top: 50%; margin-top: -22px; z-index: 4; }
  .list5_prev:before { right: 50%; margin-right: 1px; } .list5_next:before { left: 50%; margin-left: 1px; }
  /* effect */
  .list5_prev:hover:before { background-position: -132px 0; } /* use arrleft_clf */
  .list5_next:hover:before { background-position: -132px -44px; } /* use arrright_clf */
  /* disc */
  .list5_prev:after, .list5_next:after { content: ""; position: absolute; top: 50%; margin-top: -23px; width: 46px; height: 46px; z-index: 3; box-sizing: border-box; border: 1px #E8E9EA solid; border-radius: 100%; background-color: #fff; background-image: none !important; }
  .list5_prev:after { right: 50%; } .list5_next:after { left: 50%; }
  /* effect */
  .list5_prev:hover:after, .list5_next:hover:after { background-color: #F2543A; border-color: #F2543A; color: #fff; }
  /* list */
  .list5 { white-space: nowrap; margin: 60px 0; }
    .list5_item { display: inline-block; vertical-align: middle; width: 100%; white-space: normal; box-sizing: border-box; padding: 0 128px; }
      .list5_itemtitle { margin: 0; }
      .list5_itemtext { color: #474B5A; margin: 15px 0 0; }


/** list6, used for texts on product section 1 **/
.list6 { margin: 40px -40px 60px; }
  .list6_item { display: inline-block; vertical-align: top; width: 33.3333%; box-sizing: border-box; padding: 0 40px; text-align: left; }
    .list6_itemtitle { margin: 0; }
    .list6_itemtext { margin: 10px 0 0; }


/** list7, used for texts on product section 2 **/
.list7 { margin: 0; }
  /* by default, even */
  .list7_item { margin: 65px 0;
    display: -ms-flexbox; display: -webkit-flex; display: flex;
    -ms-justify-content: space-between; -webkit-justify-content: space-between; justify-content: space-between;
    -ms-align-items: center; -webkit-align-items: center; align-items: center;
  }
    .list7_itemcontent { display: inline-block; vertical-align: middle; width: calc( 50% - 32px ); }
      .list7_itemtitle { margin: 0; }
      .list7_itemtext { margin: 10px 0 0; }
    .list7_itemimg { display: inline-block; vertical-align: middle; width: calc( 50% - 32px ); margin-left: 64px; }
  /* odd */
  .list7_item:nth-child(odd) > .list7_itemimg { -ms-order: -1; -webkit-order: -1; order: -1; margin-left: 0; margin-right: 64px; }
  /* flex degradation */
  html.ie_lt10 .list7_item:nth-child(odd) > .list7_itemimg { margin-right: 0; margin-left: 64px; }


/** list8, used for texts on product section 2 **/
.list8 { margin: 45px 0; }
  .list8_item { padding: 15px 0 15px 350px; position: relative; border-top: 1px #E8E9EA solid; min-height: 50px; }
    .list8_itemtitle { margin: 0; position: absolute; z-index: 1; top: 30px; left: 0; max-width: 300px; }
    .list8_itemintro { padding: 15px 0; cursor: pointer; }
      .list8_itemtext { margin: 0; }
      .list8_itembtn { margin-top: 20px; }
    .list8_itemintro + .list8_itemcontent { display: none;  }
    .list8_itemcontent { padding: 30px 0; /* border-top: 1px #E8E9EA solid; */ }
      .list8_itemcontent > *:first-child { margin-top: 0; }
      .list8_itemcontent > *:last-child { margin-bottom: 0; }


/** list9, used for steps on method page **/
.list9 { margin: 0; counter-reset: list9; overflow: hidden; position: relative; }
.list9:after { content: ""; display: block; width: 1px; background-color: #E8E9EA; position: absolute; left: 50%; top: 230px /* calculé à la main */; bottom: 0; }
  /* by default, even */
  .list9_item { counter-increment: list9; padding: 100px 0; position: relative; min-height: 245px;
    display: -ms-flexbox; display: -webkit-flex; display: flex;
    -ms-justify-content: space-between; -webkit-justify-content: space-between; justify-content: space-between;
    -ms-align-items: center; -webkit-align-items: center; align-items: center;
  }
    .list9_itemindicator {
      width: 35px; height: 35px; margin-top: -17.5px; margin-left: -17.5px; text-align: center; line-height: 32px; text-indent: 1.5px;
      position: absolute; z-index: 2; top: 50%; left: 50%; border-radius: 100%; font-size: 16px; font-weight: bold; border: 1px #E8E9EA solid; background-color: #fff; box-sizing: border-box;
    }

    html.chrome .list9_itemindicator { line-height: 34px; text-indent: 1px !important; } /* Chrome PC+MAC */
    html.mac .list9_itemindicator { line-height: 36px; text-indent: 2px; } /* Chrome/Safari MAC */
    x:-moz-any-link, html.mac .list9_itemindicator { line-height: 34px; text-indent: 1.5px; } /* Firefox MAC */
    html.android .list9_itemindicator { line-height: 36px; } /* Chrome Android */
    html.safari_ios .list9_itemindicator { text-indent: 1.5px; line-height: 34px; } /* Safari iOs */

    /* html.js .list9_itemindicator { visibility: hidden; } */
    /* html.js li:first-child > .list9_itemindicator { visibility: visible; } */
    /* cloned */
    .list9_itemindicator.\:cloned { position: fixed; visibility: visible !important;
      -webkit-transition: color 400ms ease, background-color 400ms ease, border-color 400ms ease;
      -ms-transition: color 400ms ease, background-color 400ms ease, border-color 400ms ease;
      transition: color 400ms ease, background-color 400ms ease, border-color 400ms ease;
    }
    /* .list9_itemindicator:before { content: counter(list9); } */
    .list9_itemcontent { margin: 20px 0; display: inline-block; vertical-align: middle; width: calc( 50% - 95px ); text-align: left; margin-left: 190px; }
      .list9_itemtitle { margin: 0; }
    .list9_itemimgout { display: inline-block; vertical-align: middle; width: calc( 50% - 95px ); text-align: center; }
  /* odd */
  .list9_item:nth-child(even) > .list9_itemcontent { text-align: right; -ms-order: -1; -webkit-order: -1; order: -1; margin-right: 190px; margin-left: 0; }
  /* effect */
  /* .list9_item:hover > .list9_itemindicator, */ .list9_itemindicator.\:active { color: #fff; background-color: #F2543A; border-color: #F2543A; }
  /* button below list */
  .list9_btn { position: relative; z-index: 2; }
  /* flex degradation */
  html.ie_lt10 .list9_item:nth-child(even) > .list9_itemcontent { text-align: left; margin-left: 190px; margin-right: 0; }

/** list 10, used for product on order/step1 **/
  .list10 { margin: -25px 0; padding-left: 1px;
    display: -ms-flexbox; display: -webkit-flex; display: flex;
    -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;
    -ms-justify-content: flex-start; -webkit-justify-content: flex-start; justify-content: flex-start;
    -ms-align-items: stretch; -webkit-align-items: stretch; align-items: stretch;
  }
    /* fix items width for nice display */
    .list10_item { display: inline-block; vertical-align: top; border-right: 1px #474B5A solid; border-left: 1px #474B5A solid; padding: 0 16px; margin: 25px 0 25px -1px; width: 195px; }
      .list10_itembox { height: 100%; padding-bottom: 43px; box-sizing: border-box; position: relative; }
        .list10_itemtitle { font-size: 16px; margin: 0; font-weight: normal; }
        .list10_itemtext { font-size: 12px; margin: 10px 0 0; }
        .list10_itembtn { position: absolute; z-index: 1; bottom: 0; left: 0; }
       /* effect */
      .list10_itembox:hover,
      .list10_itembox:focus,
      .list10_itembox:active,
      .list10_itembox.\:current { color: #fff !important; }
        .list10_itembox:hover > .list10_itembtn,
        .list10_itembox:focus > .list10_itembtn,
        .list10_itembox:active > .list10_itembtn,
        .list10_itembox.\:current > .list10_itembtn { background-color: #F2543A; border-color: #F2543A; }
    /* flex degradation */
    .list10_itemtext { min-height: 53px; }


/** list11, used for steps display on order **/
.list11 { color: #474B5A; font-size: 16px; counter-reset: list11; margin: -10px 0; }
  .list11_item { counter-increment: list11; margin: 10px 0; }
  .list11_item:before { content: counter(list11)".\00A0"; }
  .list11_item:after { content: ""; display: block; clear: both; }
    .list11_itemprice { float: right; color: #F2543A; opacity: 0.3; margin-top: 1px; }
  /* active */
  .list11_item.\:active { color: #fff; }
    .list11_item.\:active > .list11_itemprice { opacity: 1; }
  /* total */
  .list11_itemtotal { margin-top: 20px; padding-top: 20px; text-transform: uppercase; }
  .list11_itemtotal:before { display: none; }


/** list12, used for staff **/
.list12 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .list12_item { width: 50%; -webkit-box-flex: 1 1 auto; -ms-flex-positive: 1 1 auto; flex-grow: 1 1 auto; vertical-align: top; padding: 48px; text-align: center; box-sizing: border-box; border-bottom:  1px solid #E8E9EA; }
    .list12_itemimg { display: block; width: 96px; margin: 0 auto 15px auto; border-radius: 96px; }
    .list12_itemtitle { margin: 0; }
    .list12_itemtext { margin: 10px 0 0; }



/*** LAYOUT -------------------- ***/

/** container **/
/* set default background-color */
body { background-color: #191E31; }
#mainwrap { overflow: hidden; background-color: #fff; }
  .wrap { max-width: 1120px; margin: 0 auto; padding: 0 80px; position: relative; height: 100%; }


/** header **/
#mainheader { height: 120px; background-color: #191E31; color: #fff; position: relative; }
  #mainheader_wrap { position: static; }

  /* logo */
  #mainheaderlogo { position: absolute; top: 50%; left: auto; margin-top: -19px; z-index: 6; }
    #mainheaderlogo_img { max-width: none; }

  /* nav */
  #mainheadernav { float: right; font-size: 16px;  white-space: nowrap; }
    .mainheadernav_list { display: inline-block; }
      .mainheadernav_item { display: inline-block; vertical-align: middle; padding: 34px 0; white-space: normal; }
      #mainheadernav01_list > .mainheadernav_item { margin-right: 46px; }
      #mainheadernav02_list > .mainheadernav_item + .mainheadernav_item { margin-left: 16px; }
      .mainheadernav_item + .mainheadernav_item:before {}
        .mainheadernav_link { color: inherit; text-decoration: none !important; position: relative; z-index: 4; }
        /* hover/active/focus/current */
        .mainheadernav_link:hover, .mainheadernav_link:focus, .mainheadernav_link:active, .mainheadernav_link.\:current { color: #F2543A }

        /* icon */
        .mainheadernav_link[data-icon="arrdown_cl2"]:before { position: absolute; top: 50%; margin-top: -20px; left: 100%; margin-left: -6px; z-index: 1; -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); }
        html.mac .mainheadernav_link[data-icon="arrdown_cl2"]:before { margin-top: -24px; } /* Chrome/Safari MAC */
        x:-moz-any-link, html.mac .mainheadernav_link[data-icon="arrdown_cl2"]:before { margin-top: -22px; } /* Firefox MAC */
        /* hover/active/focus/current */
        .mainheadernav_link[data-icon="arrdown_cl2"]:hover:before,
        .mainheadernav_link[data-icon="arrdown_cl2"]:focus:before,
        .mainheadernav_link[data-icon="arrdown_cl2"]:active:before,
        .mainheadernav_link[data-icon="arrdown_cl2"].\:current:before,
        .mainheadernav_link[data-icon="arrdown_cl2"].\:open:before,
        .mainheadernav_item:hover > .mainheadernav_link[data-icon="arrdown_cl2"]:before { background-position: -44px -132px; } /* use arrdown_cl1 */

        /* button */
        .mainheadernav_btn1 { position: relative; z-index: 4; top: 1px; height: 46px; box-sizing: border-box; white-space: nowrap; }
        html.android .mainheadernav_btn1 { padding-top: 14px; }
        /* icon */
        .mainheadernav_btn1[data-icon] { top: 3px; width: 46px; overflow: hidden; text-indent: 46px; }
        .mainheadernav_btn1[data-icon]:before { position: absolute; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; z-index: 1; }

      /* responsive purpose */
      #mainheadernav_itemmenu { display: none; }

      /* subnav */
      .mainheadersubnav {
        opacity: 0; position: absolute; z-index: 2; top: 0; left: 0; right: 0; margin-top: -18px; padding: 190px 0 65px; background-color: #191E31 /* #131727 */; color: #D1D2D5;
        pointer-events: none; -webkit-transition: opacity 200ms ease 100ms; -ms-transition: opacity 200ms ease 100ms; transition: opacity 200ms ease 100ms; /* smooth */
        /** / -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16); box-shadow: 0 3px 6px rgba(0,0,0,0.16); /**/
      }
      /* display */
      .mainheadernav_item:hover > .mainheadersubnav, .mainheadernav_link:focus + .mainheadersubnav, .mainheadernav_link:active + .mainheadersubnav, .mainheadersubnav:hover, .\:opened1 + .mainheadersubnav {
        -webkit-transition: opacity 200ms ease; -ms-transition: opacity 200ms ease; transition: opacity 200ms ease;
        opacity: 1; pointer-events: initial; z-index: 3;
      }
      .mainheadernav_item.\:subnav:hover > .mainheadernav_link, .mainheadernav_link.\:opened1 { color: #F2543A; }

      /* subnav 1 */
      .mainheadersubnav1 {}
        .mainheadersubnav1_wrap { }
          .mainheadersubnav1_list {
            display: -ms-flexbox; display: -webkit-flex; display: flex;
            -ms-align-items: stretch; -webkit-align-items: stretch; align-items: stretch;
            border-left: 1px #474B5A solid;
          }
            .mainheadersubnav1_item { display: inline-block; vertical-align: top; border-right: 1px #474B5A solid; box-sizing: border-box; -ms-flex: 1; -webkit-flex: 1; flex: 1; }
              .mainheadersubnav1_itembox { height: 100%; padding: 0 16px 43px; box-sizing: border-box; position: relative; }
                .mainheadersubnav1_itemtitle { font-size: 16px; margin: 0; font-weight: normal; }
                .mainheadersubnav1_itemtext { font-size: 12px; margin: 10px 0 0; }
                .mainheadersubnav1_itembtn { position: absolute; z-index: 1; bottom: 0; left: auto; white-space: nowrap; }
               /* effect */
              .mainheadersubnav1_itembox:hover,
              .mainheadersubnav1_itembox:focus,
              .mainheadersubnav1_itembox:active,
              .mainheadersubnav1_itembox.\:current { color: #fff !important; }
                .mainheadersubnav1_itembox:hover > .mainheadersubnav1_itembtn,
                .mainheadersubnav1_itembox:focus > .mainheadersubnav1_itembtn,
                .mainheadersubnav1_itembox:active > .mainheadersubnav1_itembtn,
                .mainheadersubnav1_itembox.\:current > .mainheadersubnav1_itembtn { background-color: #F2543A; border-color: #F2543A; }
            /* flex degradation */
            html.ie_lt10 .mainheadersubnav1_item { width: 20%; }
              html.ie_lt10 .mainheadersubnav1_itembox { min-height: 125px; }
          /* harmonize border */
          html.ie_lt10 .mainheadersubnav1_list { position: relative; z-index: 0; border-left: 0; border-right: 1px #474B5A solid; }
            html.ie_lt10 .mainheadersubnav1_item { border-right: 0; }
            html.ie_lt10 .mainheadersubnav1_item:before { content: ''; position: absolute; top: 0; bottom: 0; left: auto; width: 1px; z-index: -1; background-color: #474B5A; }
            /* height: 100% for itembox fails on Safari MAC/iOs */
            html.safari .mainheadersubnav1_item { position: relative; }
              html.safari .mainheadersubnav1_itembox { position: static; }

      /* subnav 2 */
      .mainheadersubnav2 {}
        .mainheadersubnav2_wrap { position: relative; }
        .mainheadersubnav2_wrap:before { content: ""; position: absolute; z-index: 1; top: 0; bottom: 0; left: 50%; background-color: #474B5A; width: 1px; }
        .mainheadersubnav2_wrap:after { content: ""; clear: both; display: block; }
          .mainheadersubnav2_content { float: left; width: calc( 50% - 32px ); margin-right: 64px; }
            .mainheadersubnav2_title { font-size: 16px; margin: 0 0 10px; font-weight: normal; }
            .mainheadersubnav2_text { font-size: 25px; margin: 0; color: #fff; line-height: 1.231; }
          .mainheadersubnav2_list { float: left; max-width: calc( 50% - 32px ); margin: -8px 0; }
            .mainheadersubnav2_item { margin: 8px 0; }
              .mainheadersubnav2_link { font-size: 13px; color: inherit; text-decoration: none !important;  }
              /* effect */
              .mainheadersubnav2_link:hover,
              .mainheadersubnav2_link:focus,
              .mainheadersubnav2_link:active { color: #F2543A !important; }
              .mainheadersubnav2_link.\:current { color: #F2543A !important; font-weight: bold; }


  /* lang */
  #mainheaderlang {}
    #mainheaderlang_list {}
      .mainheaderlang_item {}
        .mainheaderlang_link {}
          .mainheaderlang_link > abbr { cursor: pointer; }
        /* hover */
        .mainheaderlang_link:hover {}
        /* active/focus */
        .mainheaderlang_link:focus, .mainheaderlang_link:active {}
        /* current */
        .mainheaderlang_link.\:current {}


/** content **/
#maincontent { display: inline-block; width: 100%; } /* avoid margin merge on content */


/** footer **/
#mainfooter { background-color: #191E31; color: #fff; font-size: 13px; padding-bottom: 25px; }

  .mainfooter_section + .mainfooter_section { border-top: 1px #474B5A solid; }
    .mainfooter_sectiontitle { color: inherit; margin: 0; }
    .mainfooter_sectiontitle + .mainfooter_sectionbtn { margin-top: 30px; }

  #mainfootersection01 { padding: 60px 0 65px; }

  #mainfootersection02 { /*padding: 65px 0;*/ }
  #mainfootersection02:after { content: ""; clear: both; display: block; }
    #mainfootersection02_content { float: left; width: 28%; margin-right: 12%; margin: 65px 12% 65px 0; }
      #mainfootersection02_logoimg { max-width: 112px; }
      #mainfootersection02_text { margin: 30px 0 0; }
    #mainfootersection02_nav { float: left; width: 60%; margin: 65px 0; }
      #mainfooternav1_list {}
        .mainfooternav1_item { display: inline-block; vertical-align: top; }
        .mainfooternav1_item + .mainfooternav1_item { margin-left: 80px; }
          .mainfooternav1_link { color: #F2543A; }
          .mainfooternav1_link.\:current { color: #F2543A; }
            .mainfootersubnav1_item { margin: 8px 0; }
              .mainfootersubnav1_link { color: inherit; }
              .mainfootersubnav1_link.\:current { color: #F2543A; }

  #mainfootersection03 { padding: 8px 0; color: #6E717D; }
      #mainfooternav2_list { }
        .mainfooternav2_item { display: inline-block; vertical-align: top; margin-right: 20px; }
          .mainfooternav2_link { color: inherit; }
          .mainfooternav2_link.\:current { text-decoration: underline; }
        #mainfooternav2_itemsignature { float: right; margin-right: 0; }

/** cookie shit **/
/* default display */
#maincookie { position: fixed; z-index: 20; bottom: 0; left: 0; width: 100%; background-color: #fff; box-shadow: 0 -1px 0 rgba(0,0,0,.08); }
  #maincookie_text { position: relative; margin: 15px 50px; padding-right: 30px; text-align: center; font-size: 13px; }
/* with JS */
html.js #maincookie { display: none; } /* by default hide */
/* added in JS */
#maincookie_trigger { position: absolute; top: 50%; right: 0; font-size: 28px; margin-top: -22px; cursor: pointer; }
#maincookie_trigger:before { font-family: arial, sans-serif; content: "\00D7"; }


/** standard layout **/
#standardlayout {}
  .standardheader { background-color: #191E31; color: #fff; padding: 30px 0 70px; position: relative; }
    .standardheader_title { margin: 0 auto; max-width: 640px; color: inherit; }
    .standardheader_text { font-size: 18px; max-width: 640px; margin: 45px auto 0; }
    .standardheader_price { white-space: nowrap; }
    .standardheader_btn { margin-top: 60px; position: relative; z-index: 4; }
    .standardheader_imgout { margin: -22px -50px -70px; position: relative; z-index: 3; }
    .standardheader_imgout:before { content: ""; position: absolute; z-index: 1; left: -9999px; right: -9999px; bottom: -1px; top: 30%; background-color: #fff; }
      .standardheader_img { position: relative; z-index: 2; }

  /* type 1 section (standard) */
  .standardsection1 {}
    .standardsection1_wrap { max-width: 640px; margin-top: 60px; margin-bottom: 60px; }
    .standardsection1_wrap > hr { margin-left: -240px; margin-right: -240px; }
    .standardsection1_wrap > *:last-child { margin-bottom: 0; } /* margins collapse fails on Chrome*/

  /* type 2 section (larger) */
  .standardsection2 {}
    .standardsection2_wrap { margin-top: 60px; margin-bottom: 60px; }
    .standardsection2_title { color: inherit; max-width: 480px; margin-left: auto; margin-right: auto; text-align: center; }
    /* icon */
    .standardsection2_title[data-icon]:before { display: block; margin: 0 auto 20px; }

  .standardfooter {}
    .standardfooter_wrap { margin-top: 60px; margin-bottom: 60px; }
    .standardfooter_wrap:before { content: ""; height: 1px; display: block; background-color: #E8E9EA; margin-bottom: 60px; }
      .standardfooter_title { margin: 0; color: inherit; }

/* homepage */

/* special section box */
.standardsection2_box01 { background-color: #191E31; color: #fff; padding: 50px 50px 55px; }
  .standardsection2_box01title { margin: 0 auto; max-width: 450px; }
  .standardsection2_box01list { margin-bottom: 0; }
    .standardsection2_box01list .list4_item { width: calc( 50% - 64px ); }
      .standardsection2_box01list .list4_itemtitle { color: inherit; font-size: 14px; }
      .standardsection2_box01list .list4_itemtext { color: #D1D2D5; font-size: 14px; }

#standardsection_home02 { position: relative; z-index: 2; }
#standardsection_home02:after { content: ""; position: absolute; left: -9999px; right: -9999px; top: 50%; bottom: -60px; z-index: 1; background-color: #F2F2F2; }
  #standardsection_home02 > .wrap { margin-top: 140px; margin-bottom: 0; }
    #standardsection_home02_box { width: 50%; position: relative; z-index: 3; margin-left: -50px; }
    #standardsection_home02_img { position: absolute; z-index: 2; top: -80px; right: 30px; max-width: 50%; }

#standardsection_home03 { background-color: #F2F2F2; display: inline-block; width: 100%; }

#standardsection_home04 > .standardsection2_wrap { margin-bottom: 0; }
#standardsection_home04 > * > .standardsection2_title { max-width: none; margin-bottom: 0; }

/* product */
#standardsection_product02 { background-color: #F2F2F2; display: inline-block; width: 100%; }
  #standardsection_product03 .standardsection2_title { max-width: none; }

  .list6:last-child { margin-bottom: 0; } /* margins collapse fails on Chrome */
  .list7:last-child .list7_item:last-child { margin-bottom: 0; } /* margins collapse fails on Chrome */
  .list8:last-child { margin-bottom: 0; } /* margins collapse fails on Chrome */

#standardtopbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 10; height: 64px; background-color: #191E31; color: #fff; -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16); box-shadow: 0 3px 6px rgba(0,0,0,0.16);
  -webkit-transition: -webkit-transform 200ms ease; -ms-transition: transform 200ms ease; transition: transform 200ms ease;
  -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%);
}
#standardtopbar.\:fixed { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

  #standardtopbar_wrap { height: 100%;
    display: -ms-flexbox; display: -webkit-flex; display: flex;
    -ms-flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;
    -ms-justify-content: space-between; -webkit-justify-content: space-between; justify-content: space-between;
    -ms-align-items: center; -webkit-align-items: center; align-items: center;
  }
    #standardtopbar_title { font-size: 25px; color: inherit; }

    /* flex degradation */
    html.ie_lt10 #standardtopbar_title { margin-top: 16px; display: inline-block; }
    html.ie_lt10 #standardtopbar_btn { float: right; margin-top: 9px; }


/* method */
#standardsection_method02 > .wrap {} /* seems to do the job */
#standardsection_method03 > .wrap:before { content: ""; height: 1px; display: block; background-color: #E8E9EA; margin-bottom: 60px; }

/* contact */
#standardsection_contact02 > .wrap:before ,
#standardsection_contact03 > .wrap:before { content: ""; height: 1px; display: block; background-color: #E8E9EA; margin-bottom: 60px; margin-left: -240px; margin-right: -240px; }


/*** SIMPLE LAYOUT -------------------- ***/

/** container **/
#simplewrap { overflow: hidden; background-color: #191E31; color: #fff; }

/** header **/
#simpleheader { height: 120px; position: absolute; top: 0; left: 0; right: 0; z-index: 2; }

  /* logo */
  #simpleheaderlogo { position: absolute; top: 50%; left: auto; margin-top: -19px; z-index: 2; }
    #simpleheaderlogo_img { max-width: none; }

  /* close */
  #simpleheaderclose { position: absolute; z-index: 1; top: 50%; right: 80px; margin-top: -23px; height: 46px; box-sizing: border-box; width: 46px; overflow: hidden; text-indent: 46px; white-space: nowrap; }
  #simpleheaderclose:before { position: absolute; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; z-index: 1; }

/* content */
#simplecontent { min-height: 100vh; position: relative; padding-top: 160px; padding-bottom: 140px; box-sizing: border-box; }

/* standard section */
.simplesection1 { display: table; height: 100vh; width: 100%; margin-top: -160px; margin-bottom: -140px; min-height: 620px; }
  .simplesection1_wrap { position: static; display: table-cell; vertical-align: middle; box-sizing: border-box; padding-top: 100px; padding-bottom: 100px; }
    .simplesection1_title { color: inherit; margin-top: 0; }
    .simplesection1_form {}

.simplesection2 {}
  .simplesection2_wrap:after { content: ""; display: block; clear: both; }
  .simplesection2_col1 { float: left; width: calc( 100% - 280px ); box-sizing: border-box; padding: 45px 30px 0 0; border-right: 1px #474B5A solid; }
    .simplesection2_intro { margin: 0 0 20px; max-width: 680px; }
    .simplesection2_title { margin: 0 0 60px 0; color: inherit; }
    .simplesection2_list { margin-bottom: 0; }
    .simplesection2_subcol1 { display: inline-block; width: calc( 50% - 30px ); padding-right: 30px; vertical-align: top; border-right: 1px #474B5A solid; }
    .simplesection2_subcol2 { display: inline-block; width: calc( 50% - 30px - 1px); padding-left: 30px; vertical-align: top; border-left: 1px #474B5A solid; margin-left: -1px; }
    .simplesection2_outro { margin: 10px 0 0; max-width: 680px; }
  .simplesection2_col2 { float: right; width: 280px; box-sizing: border-box; padding: 45px 0 0 30px; }

.simplefooter2 { position: fixed; bottom: 0; left: 0; right: 0; z-index: 1; background-color: #191E31; min-height: 97px; }
  .simplefooter2_wrap:before { content: ""; height: 1px; display: block; background-color: #474B5A; margin-bottom: 15px; }

    /* button */
    .simplefooter2_btn { height: 46px; box-sizing: border-box; vertical-align: top; margin-right: 16px; }
    /* icon */
    .simplefooter2_btn[data-icon] { position: relative; width: 46px; overflow: hidden; text-indent: 46px; white-space: nowrap; }
    .simplefooter2_btn[data-icon]:before { position: absolute; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; z-index: 1; }

/* login */
#simplesection_login01 { max-width: 520px; margin-left: auto; margin-right: auto; }

/* order */
#simplefooter_progressbar { position: fixed; top: 0; left: 0; right: 0; z-index: 9; height: 8px; background-color: #fff; -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16); box-shadow: 0 3px 6px rgba(0,0,0,0.16); min-height: 0; }
  #simplefooter_progressvalue { height: 100%; overflow: hidden; white-space: nowrap; color: transparent; background-color: #F2543A; min-width: 110px; }

/* responsive purpose */
#simplefooter_order01 { display: none; }

#simplesection_order05 .simplesection2_col1 { padding-right: 30px; }
  #simplesection_order05 .simplesection2_title { margin-right: 0; }

#simplesection_order06_list { max-width: 465px; margin-left: auto; margin-right: auto; }
  #simplesection_order06_list > .list11_itemtotal { border-top: 1px #474B5A solid; }
#simplesection_order06_btn { position: fixed; bottom: 35px; left: 50%; z-index: 2; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }


/*** MEDIA QUERIES ------------- ***/

/* for screen smaller than 1160px */
@media screen and (max-width: 1160px)
{
  /* reduce padding to 32px */
  .wrap { padding-left: 32px; padding-right: 32px; }

  /* image on full width */
  .standardheader_imgout { margin-left: -32px; margin-right: -32px; }

  /* box fit on left */
  #standardsection_home02 > .wrap { /* margin-top: 94px; */ }
    #standardsection_home02_box { margin-left: -32px; width: 75%; }
    #standardsection_home02_img { top: -62px; -webit-transform: translateX(25%); -ms-transform: translateX(25%); transform: translateX(25%); }
      .standardsection2_box01 { padding: 32px 32px 37px; }

  /* move close button */
  #simpleheaderclose { right: 32px; }

  /* crop */
  .standardsection1 { margin-left: 32px; margin-right: 32px; padding-left: 0; padding-right: 0; overflow: hidden; }
    .standardsection1_wrap { padding-left: 0 !important; padding-right: 0 !important; }
    #standardsection_contact02 > .wrap:before, #standardsection_contact03 > .wrap:before { margin-bottom: 32px; }
    #standardsection_contact02 > .wrap, #standardsection_contact03 > .wrap { margin-top: 0; }

  /* adjust controller position */
  .list5_prev, .list5_next { width: 50vw; }
  .list5_prev:before, .list5_prev:after { right: auto; left: 32px; }
  .list5_next:before, .list5_next:after { left: auto; right: 32px; }


  /* one item by line */
  .list1 {
    -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
  }
    .list1_item { min-height: 150px; }
      .list1_itembox {
        padding: 16px 32px 16px 32px; position: relative; height: 100%;
        display: -ms-flexbox; display: -webkit-flex; display: flex;
        -ms-flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;
        -ms-align-items: center; -webkit-align-items: center; align-items: center;
        -ms-align-items: center; -webkit-align-items: center; align-items: center;
      }
        .list1_itemhead { min-width: 27.5%; margin: auto; white-space: nowrap; box-sizing: border-box; }
        .list1_itemtext { text-align: left; flex: 1; margin: auto 32px; }
        .list1_itembtn { position: static; -webkit-transform: none; -ms-transform: none; transform: none; white-space: nowrap; }
    /* flex degradation */
    html.ie_lt10 .list1_item { width: calc( 100% - 16px ); }
        html.ie_lt10 .list1_itemhead, html.ie_lt10 .list1_itemtext, html.ie_lt10 .list1_itembtn { display: inline-block; vertical-align: middle; }
        html.ie_lt10 .list1_itemtext { min-height: 0; margin: auto 42px; }
    /* height 100% fails for itembox on Safari MAC technique switch */
    html.mac .list1_item { position: relative; }
      html.mac .list1_itembox { position: absolute; z-index: 0; top: 0; bottom: 0; left: 0; right: 0; }
        html.mac .list1_itemtext { min-height: 0; }

  /* three items by row */
  .list2_item { width: calc( 33.3333% - 32px ); }

  /* two items by row, with a separator on center */
  .list3 { -webit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; margin-bottom: -20px; }
  .list3:after { content: ""; background-color: #E8E9EA; width: 1px; position: absolute; z-index: 1; top: 0; left: 50%; bottom: 20px; }
    .list3_item { width: 50%; -ms-flex: none; -webkit-flex: none; flex: none; }
      .list3_itemlink:after { display: none; }

  /* two items by row */
  /* .list4 { margin-left: -20px; margin-right: -20px; } */
  /*   .list4_item { width: calc( 50% - 40px ); margin-left: 20px; margin-right: 20px; } */
    .list4_item { width: calc( 50% - 64px ); }

  /* footer text on full width, nav on 3 cols */
  #mainfootersection02_content { float: none; width: auto; text-align: center; margin-right: 0; }
  #mainfootersection02_nav { float: none; width: auto; }
    .mainfooternav1_item { min-width: 33.3333%; margin-left: 0 !important; }

  /* navigatiopn with trigger */
  #mainheader { height: 112px; }
    #mainheadernav01_list {
      opacity: 0; pointer-events: none;
      position: absolute; z-index: 5; top: 0; left: 0; right: 0; padding: 112px 32px 65px; background-color: #191E31;
      -webkit-transition: opacity 200ms ease 100ms; -ms-transition: opacity 200ms ease 100ms; transition: opacity 200ms ease 100ms;
      box-shadow: 0 0 0 9999px rgba(25, 30, 49, .8);
    }
    .\:opened2 > #mainheadernav01_list {
      /*-webkit-transition: opacity 200ms ease; -ms-transition: opacity 200ms ease; transition: opacity 200ms ease;*/
      opacity: 1; pointer-events: initial;
    }
      #mainheadernav01_list > .mainheadernav_item { border-bottom: 1px #474B5A solid; display: block; padding: 0; margin-right: 0 !important; position: relative; overflow: hidden; }
      #mainheadernav01_list > .mainheadernav_item:first-child { border-top: 1px #474B5A solid; }
        .mainheadernav_link { display: block; padding: 14px 44px 14px 0; }
        html.android .mainheadernav_link { padding-top: 15px; } /* Chrome Android */
        .mainheadernav_link[data-icon]:before { left: auto; margin-left: 0; right: 0; margin-top: 0; top: 1px; }

        .mainheadersubnav {
          position: relative; margin-top: 0; padding: 0; height: 0; overflow: hidden;
          -webkit-transition: opacity 200ms ease; -ms-transition: opacity 200ms ease; transition: opacity 200ms ease;
        }
          .mainheadersubnav1_wrap { padding-top: 0; padding-bottom: 0; padding-left: 0 !important; padding-right: 0 !important; overflow: hidden; }
            .mainheadersubnav1_list { margin: 20px -17px 48px; }
              /* display */
              /* not so userfriendly */ .mainheadernav_item:hover > .mainheadersubnav, .mainheadernav_link:focus + .mainheadersubnav, .mainheadernav_link:active + .mainheadersubnav, .mainheadersubnav:hover { opacity: 0; }
              .\:opened1 + .mainheadersubnav { height: 100%; opacity: 1 !important; }
          .mainheadersubnav2_wrap { margin-top: 20px; margin-bottom: 48px; padding-left: 0 !important; padding-right: 0 !important;}
          .mainheadersubnav2_wrap:before { top: 0; bottom: 0; }
            .mainheadersubnav2_title { display: none; }

      /* responsive purpose */
      #mainheadernav_itemmenu { display: inline-block; position: absolute; top: 50%; margin-top: -23px; right: 32px; z-index: 6; }
      .\:opened2 + #mainheadernav_itemmenu:before { background-position: -132px -308px; } /* use "cross_clf" */

    #mainheadernav02_list { position: relative; z-index: 6; margin-right: 61px; }
      #mainheadernav02_list > .mainheadernav_item { padding: 30px 0; }

  /* first column on full width */
  .simplesection2_col1 { width: 100%; padding-right: 0; float: none; border-right: 0; padding: 0; margin: 45px 0; }
  /* second col is now empty */
  .simplesection2_col2 { width: 100%; float: none; padding: 0; margin: 0; }

    /* unfix adjust items width */
    .list10_item { width: calc( 33.3333% - 33px ); }

  /* move cart over footer */
  #simpleaside_cart01 { position: fixed; right: 32px; bottom: 35px; z-index: 2; margin: 0; }
    #simpleaside_cart01 .list11_item { display: inline-block; margin: 0 13px 0 0; vertical-align: top; white-space: nowrap; line-height: 46px; }
    #simpleaside_cart01 .list11_item:not(.list11_itemtotal) { width: 10px; text-align: center; text-indent: 10px; overflow: hidden; position: relative; }
    #simpleaside_cart01 .list11_item:not(.list11_itemtotal):before { content: counter(list11); text-indent: 0; width: 10px; text-align: center; display: inline-block; margin-left: -10px; }
      #simpleaside_cart01 .list11_item:not(.list11_itemtotal) > .list11_itemprice { display: none; }
    #simpleaside_cart01 .list11_itemtotal { padding: 0; margin: 0 0 0 29px /* 32 - 13 */; }
      #simpleaside_cart01 .list11_itemtotal > .list11_itemprice { float: none; display: inline-block; margin: 0 0 0 26px; }

  /* restore this footer (hidden for larger screen) */
  #simplefooter_order01 { display: block; }

  /* remove padding */
  #simplesection_order05 .simplesection2_col1 { padding-right: 0; }
}

/* for screen smaller than 810px */
@media screen and (max-width: 810px)
{
  /* reduce space */
  .standardheader_text { margin-top: 15px; }

  /* no more icon */
  .standardsection2_title[data-icon]:before { display: none; }

  /* one column, no more picture */
  #standardsection_home02 { margin-top: 0; }
    #standardsection_home02_box { width: auto; margin-right: -32px; }
    #standardsection_home02_img, #standardsection_home02::after { display: none; }

  /* three items by row */
  .mainheadersubnav1_list { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 0; }
    .mainheadersubnav1_item { box-sizing: border-box; width: 33.3333%; -ms-flex: none; -webkit-flex: none; flex: none; margin-bottom: 48px; }
    /* flex degradation recover */
    html.ie_lt10 .mainheadersubnav1_item { width: 33.3333%; border-left: 1px #474B5A solid; }
    html.ie_lt10 .mainheadersubnav1_item:before { content: none; }

  /* fixed width */
    .mainheadersubnav2_wrap:before { left: auto; right: 192px; }
      .mainheadersubnav2_content { float: left; width: calc( 100% - 224px ); margin-right: 64px; }
      .mainheadersubnav2_list { float: left; width: 160px; }

  /* one item by row */
    .list6_item { width: 100%; text-align: center; }
      .list6_item + .list6_item { margin-top: 20px; }

  /* all centered */
    .list7_item { text-align: center; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
      .list7_itemcontent { width: 100%; }
      .list7_itemimg { -ms-order: -1; -webkit-order: -1; order: -1; margin: 0 auto 20px !important; max-width: 420px; width: 100%; }
      /* flex degradation */
      html.ie_lt10 .list7_itemimg { margin: 20px auto 0 !important; }

  /* all centered */
    .list8_item { text-align: center; padding-left: 0; }
      .list8_itemtitle { position: static; max-width: none; margin-top: 15px; }

  /* one item by row, all centered */
  .list12 { -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .list12_item { width: 100%; text-align: center; }

  /* one item by row, all centered */
  .list9 { margin-bottom: -34px; }
  .list9:after { display: none; }
    .list9_item { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; text-align: center; padding: 0; margin-bottom: 80px; background-color: #fff; }
    .list9_item:before { content: ""; display: block; width: 1px; height: 32px; background-color: #E8E9EA; position: absolute; left: 50%; bottom: -40px; }
    .list9_item:last-child:before { display: none; }
      .list9_itemimgout { margin: 0 auto !important; width: 100%; display: block; }
        .list9_itemimg { max-width: 420px; }
      .list9_itemcontent { -ms-order: 3 !important; -webkit-order: 3 !important; order: 3 !important; text-align: center !important; margin: 0 !important; width: 100%; }
      .list9_itemindicator { position: static; display: block; margin: 40px auto 20px; }
    .list9_item:after { top: 100%; height: 32px; margin-top: 14px; }

  /* orange top bar */
  #standardtopbar { height: 44px; }
    #standardtopbar_btn { position: absolute; z-index: 1; left: 0; top: 0; bottom: 0; right: 0; border-radius: 0; }

  /* reduce section margin to 40px */
  h2, .h2 { margin-top: 40px; }

  .list5, .list6,
  .standardsection1_wrap, .standardsection2_wrap,
  .standardfooter_wrap { margin-top: 40px; margin-bottom: 40px; }

  .list5:last-child, .list6:last-child { margin-bottom: 0; } /* margins collapse fails on Chrome */

  .standardfooter_wrap:before, #standardsection_method03 > .wrap:before { margin-bottom: 40px; }

  #standardsection_home02 > .wrap { margin-top: 32px; }
  #mainfootersection01 { padding-top: 40px; padding-bottom: 45px; }

    #mainfootersection02_content, #mainfootersection02_nav { margin-top: 40px; margin-bottom: 40px; }

    .list7 { margin-top: -20px; }
    .list8 { margin-bottom: -30px; }

  /* also reduce font-size */
  h1, .h1 { font-size: 32px; }
}

/* for screen smaller than 600px x 680px */
@media screen and (max-height: 680px) and (max-width: 1160px), screen and (max-width: 600px)
{
  #simpleheader { /*position: relative;*/ }
  /* and give some space to fixed footer */
  #simplecontent { padding: 72px 0 76px; }

  /* recduce footer height */
  .simplefooter2 { min-height: 76px; }
  /* cart position */
  #simpleaside_cart01 { bottom: 16px; }
  /* button position */
  #simplesection_order06_btn { bottom: 15px; }


  /* reduce padding to 16px */
  .wrap { padding-left: 16px; padding-right: 16px; }

  /* image on full width */
  .standardheader_imgout { margin-left: -16px; margin-right: -16px; }

  /* box fit on left */
  #standardsection_home02 { margin-top: 0; }
    #standardsection_home02_box { width: auto; margin-left: -16px; margin-right: -16px; }
    #standardsection_home02_img, #standardsection_home02::after { display: none; }
      .standardsection2_box01 { padding: 32px 16px 37px; }

  /* move close button */
  #simpleheaderclose { right: 16px; }

  /* crop */
  .standardsection1 { margin-left: 16px; margin-right: 16px; }

  /* adjust */
  #simpleaside_cart01, #mainheadernav_itemmenu { right: 16px; }



  /* reduce section margin to 32px */
  h2, .h2 { margin-top: 32px; }

  .list5, .list6,
  .standardsection1_wrap, .standardsection2_wrap,
  .standardfooter_wrap { margin-top: 32px; margin-bottom: 32px; }

  .standardfooter_wrap:before, #standardsection_method03 > .wrap:before { margin-bottom: 32px; }

  #standardsection_home02 > .wrap { margin-top: 32px; }
  #mainfootersection01 { padding-top: 32px; padding-bottom: 37px; }

    #mainfootersection02_content, #mainfootersection02_nav { margin-top: 32px; margin-bottom: 32px; }

    .list7 { margin-top: -20px; }
    .list8 { margin-bottom: -30px; }

  #standardsection_contact02 > .wrap:before, #standardsection_contact03 > .wrap:before { margin-bottom: 32px; }

  /* also reduce font-size */
  h1, .h1, .h1\,5 { font-size: 25px; }
  .standardheader_text { font-size: 15px; }
  h2, .h2, .list3_itemtitle { font-size: 20px; }


  /* new header */
  #mainheader { height: 72px; }
  /* move effect to nav */
  #mainheadernav {
    opacity: 0; pointer-events: none; padding: 80px 16px 32px; box-shadow: 0 0 0 9999px rgba(25, 30, 49, .8);
    position: absolute; z-index: 5; top: 0; left: 0; right: 0; background-color: #191E31;
    -webkit-transition: opacity 200ms ease 100ms; -ms-transition: opacity 200ms ease 100ms; transition: opacity 200ms ease 100ms;
  }
  #mainheadernav.\:opened2 {
    /*-webkit-transition: opacity 200ms ease; -ms-transition: opacity 200ms ease; transition: opacity 200ms ease;*/
    opacity: 1; pointer-events: initial;
  }
    #mainheadernav01_list { /*opacity: 1; pointer-events: initial;*/ padding: 0; position: static; display: block; box-shadow: none; }
    #mainheadernav02_list {
      margin-right: 0; display: -ms-flexbox; display: -webkit-flex; display: flex;
      -webkit-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between;
    }
      #mainheadernav02_list > .mainheadernav_item { padding-top: 32px; padding-bottom: 0; }
        .mainheadernav_btn1[data-icon] { top: 0; }
          .mainheadersubnav2_text { font-size: 18px; }
      /* flex degradation */
      html.ie_lt10 #mainheadernav02_list { width: 100%; }
        html.ie_lt10 #mainheadernav02_list > .mainheadernav_item:last-child { float: right; }


  /* reduce spacing */
  .standardheader { padding-top: 16px; padding-bottom: 32px; }
    .standardheader_imgout { margin-bottom: -32px; }
    .standardheader_btn { margin-top: 32px; }

  /* change this header too */
  #simpleheader { height: 72px; }

  /* remove this bar */
  #simplefooter_progressbar { display: none; }


  /* item on full width */
  .list5_item { padding: 0 16px; }
  /* controller on bottom */
  .list5_out { margin-bottom: 60px }
  .list5_prev { left: auto; right: 50%; bottom: -4px; top: auto; }
  .list5_next { right: auto; left: 50%; bottom: -4px; top: auto; }
  .list5_prev:before, .list5_prev:after { left: auto; right: 16px; }
  .list5_next:before, .list5_next:after { right: auto; left: 16px; }

  /* one item by row */
  .standardsection2_box01list { margin-top: 16px; }
    .list4_item { width: calc( 100% - 64px ) !important; text-align: center; }

  /* two items by row */
  .mainfooternav1_item { width: 50%; }
  .mainfooternav1_item + .mainfooternav1_item + .mainfooternav1_item { margin-top: 32px; }

  /* reduce margin */
  .list10 { margin-top: -16px; margin-bottom: -16px; }
    .list10_item { margin-top: 16px; margin-bottom: 16px; }

  /* simple layout smaller */
  .simplesection2_col1 { margin: 0 0 25px; }
    .simplesection2_title { margin: 0 0 25px; }

  .simplesection1 { margin-top: 0; margin-bottom: 0; min-height: 0; height: auto; }
    .simplesection1_wrap { padding-top: 0; padding-bottom: 0; }
      .simplesection1_title { margin-bottom: 25px; }

    /* smaller */
    .formchoice2_list { margin: 25px 0; }
    .formrow2_submit { margin-top: 16px; }

    /* smaller */
    .formchoice2_list { position: relative; top: 2px; }
      .formchoice2_label { font-size: 25px !important; }
      .formchoice2_label:before, .formchoice2_label:after { top: -2px !important; }

      html.mac .formchoice2_label:before, html.mac .formchoice2_label:after { padding-top: 2px !important; } /* Chrome/Safari MAC */
      x:-moz-any-link,  html.mac .formchoice2_label:before, html.mac .formchoice2_label:after { padding-top: 0 !important; } /* Firefox MAC */

  /* no more column */
  .simplesection2_col1 { overflow: hidden; }
    .simplesection2_subcol1 { display: block; width: 100%; max-width: 520px; margin-left: auto; margin-right: auto; padding-right: 0; border-right: 0; }
    .simplesection2_subcol2 { display: block; width: 100%; max-width: 520px; margin-left: auto; margin-right: auto; padding-left: 0; border-left: 0; margin-top: 32px; }
    .simplesection2_subcol2:before { content: ""; display: block; width: 200%; height: 1px; background-color: #474B5A; -webkit-transform: translateX(-25%); -ms-transform: translateX(-25%); transform: translateX(-25%); margin-bottom: 32px;  }
      .simplesection2_subcol1 .simplesection2_title, .simplesection2_subcol2 .simplesection2_title,
      .simplesection2_subcol1 .formrow2_submit, .simplesection2_subcol2 .formrow2_submit { text-align: center; }

  #simplesection_login01 { margin-bottom: -70px; }
  #simplesection_order06_list { margin-top: 25px; margin-bottom: 25px; }
  #simplesection_order06_btn { -webkit-transform: none; -ms-transform: none; transform: none; left: auto; right: 16px; white-space: nowrap; }

}

/* for screen smaller than 600px x 680px */
@media screen and (max-width: 600px)
{
  /* upgrade display to minimal info */
  .list1_item { min-height: 80px; } /* IE 10 need a height */
    .list1_itembox { padding: 15px 16px; -webkit-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; text-align: left; position: relative; }
    /* display icon */
    .list1_itembox:after { content: ""; background-position: 0 -44px; }
      /* hide this */
      .list1_itemtext, .list1_itembtn { display: none !important; }
      /* change head */
      .list1_itemhead { text-align: left; margin: 0; }
      .list1_itemprice { font-size: 16px; }
    /* flex degradation */
    html.ie_lt10 .list1_itembox:after { position: absolute; top: 50%; right: 16px; z-index: 1; -ms-transform: translateY(-50%); }

}

/* for screen smaller than 470px */
@media screen and (max-width: 470px)
{
  /* hide steps */
  #simpleaside_cart01 { bottom: 18px; }
    #simpleaside_cart01 .list11_item:not(.list11_itemtotal) { display: none; }
    #simpleaside_cart01 .list11_itemtotal { line-height: 1.231; text-align: right; }
      #simpleaside_cart01 .list11_itemtotal > .list11_itemprice { display: block; margin-left: 0; }

  /* one item by row */
  .mainfooternav1_item { width: 100%; }
  .mainfooternav1_item + .mainfooternav1_item { margin-top: 32px; }

  /* review navigation */
  #mainfooternav2_list { margin: 32px 0 0; }
    .mainfooternav2_item { display: block; margin: 8px 0; }
    #mainfooternav2_itemsignature { float: none; }

    /* label above field */
    .formrow { padding-left: 0; }
      .formlabel { position: static; display: inline-block; margin-bottom: 6px; }

    /* non-floating link */
    .formlink1_br { display: inline; }
    .formlink1 { float: none; display: inline-block; margin: 8px 0; }

  /* review subnav */
  .list10, .mainheadersubnav1_list { margin: 0 0 20px; border: 0 !important; }
    .list10_item, .mainheadersubnav1_item { width: 100%; margin: 0; border: 0 !important; padding: 0; }
    .list10_item + .list10_item, .mainheadersubnav1_item + .mainheadersubnav1_item { border-top: 1px #474B5A solid !important; }
      .list10_itembox, .mainheadersubnav1_itembox { padding: 18px 0; }
        .list10_itemtitle, .mainheadersubnav1_itemtitle { color: inherit; }
        .list10_itemtext, .mainheadersubnav1_itemtext { display: none; }
        .list10_itembtn, .mainheadersubnav1_itembtn { left: auto; right: 0; bottom: 50%; -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%); }
  /* flex degradation */
  html.ie_lt10 .mainheadersubnav1_list { border-left: 0; }
    html.ie_lt10 .mainheadersubnav1_item { width: 100%; }
      html.ie_lt10 .mainheadersubnav1_itembox { min-height: 0; }


  /* review subnav */
  .mainheadersubnav2_wrap { margin-top: 0; margin-bottom: 20px; }
  .mainheadersubnav2_wrap:before { display: none; }
    .mainheadersubnav2_content { display: none; }
    .mainheadersubnav2_list { margin: 0; width: auto; max-width: none; float: none; }
      .mainheadersubnav2_item { width: 100%; margin: 0; }
      .mainheadersubnav2_item + .mainheadersubnav2_item { border-top: 1px #474B5A solid; }
        .mainheadersubnav2_link { padding: 18px 0; color: inherit; font-size: inherit; display: block; }

    /* smaller */
    .formchoice2_list { top: 4px; }
      .formchoice2_label { font-size: 21px !important; }
      .formchoice2_label:before, .formchoice2_label:after { top: -4px !important; }
      .formchoice2_price { vertical-align: 3px; }
}


/*** High resolution device ---- ***/

/** resolution x2 **/
/* remove the space to test x2 icons on normal resolution */
@media /** / screen, /**/ (-webkit-min-device-pixel-ratio: 2), ( min-resolution: 192dpi), ( min-resolution: 2dppx)
{

}



/*** CSS HACKS ----------------- ***/
/* last update 2015-05-01 */

/**

/* Firefox 2+ * /
x:-moz-any-link, .selector { property: value; }

/* Opera 14+, Safari, Chrome, Android * /
.selector:not(*:root) { property: value; }

/* Safari 7+ * /
@media \\0 screen { .selector { property: value; } }

/* Chrome 29+, Opera 16+ * /
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { .selector { property: value; } }

/* Chrome, Safari 3+ * /
@media screen and (-webkit-min-device-pixel-ratio:0) { .selector { property: value; } }

/* Safari 5+/6-, Chrome 24- * /
::x, .selector { property: value; }

/* Opera 9.5+/14- * /
x:-o-prefocus, .selector { property: value; }

/* IE 11/10 * /
@media all and (-ms-high-contrast:none) { .selector { property: value; } }

/* IE 11 * /
*::-ms-backdrop, .selector { property: value; }

/* IE 9 (html specific) * /
html.ie9 .selector { property: value; }

/* IE 6-10 * /
.selector { property: value\9; }

/* more hacks at http://browserhacks.com **/
