@charset "utf-8";

/* ************************************************************************* *
 * NORMALIZE
 * ************************************************************************* */

div, ul, li, header, nav, main, section, footer, input, textarea {
  -webkit-box-sizing : border-box;
  -moz-box-sizing : border-box;
  -ms-box-sizing : border-box;
  -o-box-sizing : border-box;
  box-sizing : border-box;
}

html {
  background : #fff;
  color : #3b3c3a;
  margin : 0;
  padding : 0;
}

body {
  /*
  width : 1440px;
  margin : 0;
  */
  padding : 0;
  margin : 0 auto;
  font-family : 'Source Sans Pro', Sans-serif;
  font-size : 18px;
  line-height : 27px;
}

a {
  color : inherit;
}

a > i.fa {
  font-size : 50%;
  vertical-align : middle;
}

h2 > a,
h3 > a,
h4 > a {
  font-style : inherit;
  font-weight : inherit;
  text-decoration : none;
  color : inherit;
}
h2 > a:hover,
h3 > a:hover,
h4 > a:hover {
  text-decoration : underline;
}

iframe {
  border : 0 none;
  background : #fff;
}

header, nav, main, footer {
  overflow-x : hidden;
  overflow-y : visible;
  overflow : visible;
}

/* ************************************************************************* *
 * COMMON
 * ************************************************************************* */

div.wrapper {
  width : 1120px;
  margin : 0 auto;
  position : relative;
}

.bold {
  font-weight : bold;
}

.center {
  text-align : center;
}

.button {
  text-align : center;
  border : 4px solid #4887aa;
  color : #3b3c3a;
  text-decoration : none;
  border-radius : 5px;
  background : #fff;
}
.button.default {
  padding : 4px;
  padding-left : 24px;
  padding-right : 24px;
}
.button.big {
  padding : 8px;
  padding-left : 24px;
  padding-right : 24px;
  font-size : 26px;
}
.button:hover {
  background : #f0f8fb;
}
.button:active {
  border-color : #315C73;
}

.show-hidden-text {
  cursor : pointer;
}

a.blue {
  text-decoration : none;
  color : #356cba;
}

ul.grid {
  list-style-type : none;
  margin : 0;
  padding : 0;
  text-align : center;
  font-size : 0;
}
  ul.grid > li {
    margin : 0;
    padding : 0;
    display : inline-block;
    text-align : left;
    font-size : 18px;
    vertical-align : top;
    position : relative;
  }

ul.bullet {
  list-style-type : none;
  margin : 0;
  padding : 0;
  margin-left : 20px;
}
  ul.bullet > li {
    text-indent : -14px;
    line-height : 24px;
    margin-bottom : 24px;
  }
  ul.bullet > li:before {
    content : '\b7';
    font-size : 20px;
    line-height : 20px;
    padding-right : 5px;
  }
  ul.bullet > li > a {
    color : #3b3c3a;
    text-decoration : none;
  }
  ul.bullet > li > a:hover {
    text-decoration : underline;
  }
    ul.bullet > li > a > i {
      text-indent: 0px;
    }

div.compare {
  font-size : 0;
  overflow-x : auto;
  white-space : nowrap;
}
  div.compare > ul {
    display : inline-block;
    vertical-align : top;
    width : 20%;
    margin : 0;
    padding : 0;
    padding-top : 20px;
    padding-bottom : 20px;
    list-style-type : none;
    background : #fff;
    min-width : 120px;
  }
  div.compare.compare2 > ul:nth-child(2) {
    width : 40%;
  }
  div.compare.compare2 > ul:nth-child(3) {
    width : 40%;
  }
    div.compare > ul > li {
      margin : 0;
      padding : 10px;
      text-align : center;
      font-size : 18px;
      white-space : nowrap;
    }
    div.compare > ul > li:nth-child(1) {
      font-weight : bold;
    }

    div.compare > ul:nth-child(1) {
      background : #f0f8fb;
    }

    div.compare span.green {
      color : #60A960;
    }

    div.compare span.red {
      color : #8E0707;
    }

#status-report {
}

  #status-report > p {
    font-size : 80%;
  }

  #status-report > ul {
    list-style-type : none;
    margin : 0;
    padding : 0;
  }

    #status-report > ul > li {
      margin : 0;
      padding : 0;
      margin-top : 20px;
    }

    #status-report > ul > li > a {
      color : #5295d1;
    }
    #status-report > ul > li > * {
      display : inline-block;
    }

    #status-report > ul > li > span:nth-child(1) {
      width : 140px;
    }

    #status-report > ul > li > span:nth-child(2) {
      color : #73ab6f;
    }
    #status-report > ul > li > span.warning {
      color : #ea4215;
    }

/* ************************************************************************* *
 * LAYOUT
 * ************************************************************************* */

header {
  height : 110px;
}
  header > .wrapper {
    height : 110px;
    background : transparent url('../images/logo-host1-header.png') no-repeat 0px center;
  }
  header h1 {
    margin : 0;
    padding : 0;
    position : absolute;
    top : 10px;
    left : 290px;

    font-family: 'Raleway', sans-serif;
    font-size : 18px;
    font-weight : 300;
    color : #101314;
  }

  header a#logo {
    display : block;
    position : absolute;
    top : 10px;
    left : 0px;
    bottom : 10px;
    width : 265px;
  }

  header div#right {
    position : absolute;
    top : 0px;
    right : -20px;
  }

  header #right ul {
    list-style-type : none;
    margin : 0;
    padding : 0;
    font-size : 0;
    height : 40px;
  }
    header #right ul > li {
      height : 40px;
      text-align : center;
      display : inline-block;
      margin-right : 15px;
      vertical-align : top;
      line-height : 40px;
    }
    header #right ul > li.flag {
    }
      header #right ul > li.flag > a {
        display : inline-block;
        vertical-align : middle;
        font-size : 0;
      }
        header #right ul > li.flag > a > img {
          vertical-align : middle;
        }
    header #right ul > li.menu {
      width : 170px;
      background-color : #4887aa;
      text-transform : uppercase;
      margin-right : 20px;
    }
      header #right ul > li > a {
        color : #fafaf7;
        font-size : 18px;
        text-decoration : none;
      }

    header div#status {
      width : 360px;
      height : 40px;
      line-height : 20px;
      padding : 10px;
      margin-top : 15px;
      /*
      background-color : #ffe9cf;
      */
      background-color : #fbf2e9;
      border : 1px solid #c1c1c1;
      font-weight : 500;
      font-size : 16px;
    }
      header div#status span:nth-child(1) {
        font-weight : 300;
      }

nav {
  height : 40px;
  background-color : #3b3c3a;
  color : #fff;
}
  nav > .wrapper {
    height : 40px;
  }
  nav > .wrapper > ul {
    list-style-type : none;
    padding : 0;
    margin : 0;
    margin-left : -10px;
    margin-right : -10px;
  }
    nav > .wrapper > ul > li {
      display : inline-block;
      margin-left : 10px;
      margin-right : 10px;
      height : 40px;
      line-height : 40px;
    }
      nav > .wrapper > ul > li.right {
        float : right;
      }
      nav > .wrapper > ul > li > a {
        color : #fff;
        text-decoration : none;
        font-weight : normal;
        text-transform : uppercase;
      }
      nav > .wrapper > ul > li > a:hover {
        color : #ffe9cf;
      }

#hamburger {
  display : none;
}
  #hamburger > span {
    position : absolute;
    top : 50%;
    right : 10px;
    margin-top : -20px;
    height : 40px;
    width : 40px;
    font-size : 40px;
    z-index : 10;
    cursor : pointer;
  }

  #hamburger > ul {
    position : absolute;
    margin : 0;
    padding : 0;
    top : 110px;
    left : 0px;
    right : 0px;
    z-index : 999999;
    display : none;

    background-color : #3b3c3a;
    color : #fff;
  }
    #hamburger > ul > li {
      width : 100%;
      padding : 10px;
      margin : 0;
      display : block;
      text-align : center;
      font-size : 14px;
    }
    #hamburger > ul > li > a {
      text-decoration : none;
    }

section.centered > .wrapper > h2,
body.en_index section > .wrapper > h2,
body.no_index section > .wrapper > h2 {
  text-align : center;
}
section > .wrapper > h2 {
  font-family: 'Raleway', sans-serif;
  font-size : 36px;
  font-weight : bold;
}
section > .wrapper > h2.big {
  font-size : 64px;
  font-weight : normal;
  line-height : 1em;
}
section > .wrapper > h2.small {
  text-transform : uppercase;
  font-size : 32px;
  font-weight : 200;
}

section > .wrapper h3 {
  font-family: 'Raleway', sans-serif;
  font-size : 24px;
  font-weight : 600;
}

section.yellow {
  background-color : #faf9f5;
  padding-top : 20px;
  padding-bottom : 20px;
}

section.blue {
  background-color : #4887aa;
  color : #fff;
  padding : 30px;
  padding-top : 55px;
  padding-bottom : 43px;

  -moz-box-shadow: inset 0 0 5px #3b6e8b;
  -webkit-box-shadow: inset 0 0 5px #3b6e8b;
  box-shadow: inset 0 0 5px #3b6e8b;
}
  section.blue p {
    font-family: 'Raleway', sans-serif;
    padding-top : 0;
  }

section.white {
  background-color : #faf9f5;
  padding-top : 22px;
  padding-bottom : 22px;

  -moz-box-shadow: inset 0 0 5px #ccccc8;
  -webkit-box-shadow: inset 0 0 5px #ccccc8;
  box-shadow: inset 0 0 5px #ccccc8;
}

section.whiter {
  background-color : #fff;
}

footer {
  padding-top : 26px;
  padding-bottom : 26px;
  background-color : #143548;
  color : #fff;
}

ul.grid-footer {
  margin-left : -10px;
  margin-right : -10px;
}
  ul.grid-footer > li {
    margin : 10px;
  }
  ul.grid-footer li.contact {
    width : 265px;
    background : transparent url('../images/logo-host1-footer.png') no-repeat;
    padding-top : 42px;
    line-height : 36px;
  }
    ul.grid-footer li.contact p {
      padding : 0;
    }
    ul.grid-footer li.contact a {
      text-decoration : underline;
    }
  ul.grid-footer li.follow {
    width : 265px;
    line-height : 36px;
  }
    ul.grid-footer li.follow p {
      padding : 0;
    }
    ul.grid-footer li.follow a {
      position : relative;
      padding-left : 22px;
    }
    ul.grid-footer li.follow a:hover {
      text-decoration : underline;
    }
      ul.grid-footer li.follow a > i{
        position : absolute;
        left : 0px;
        top : 5px;
        font-size : inherit;
        color : #fff;
      }
  ul.grid-footer li.about {
    width : 550px;
  }

  ul.grid-footer a {
    color : #fff;
    font-weight : normal;
    text-decoration : none;
  }

  ul.grid-footer .bold {
    font-size : 20px;
    line-height : 20px;
    font-weight : 600;
  }

/* ************************************************************************* *
 * Page: /
 * ************************************************************************* */

/* Banners */
ul.grid-banners {
  margin-left : -10px;
  margin-right : -10px;
  margin-bottom : 20px;
}
  ul.grid-banners > li {
    margin : 10px;
    height : 302px;
  }
    ul.grid-banners > li#banner {
      font-size : 0;
      border : 1px solid #dfdfdc;
    }
    ul.grid-banners > li#banner > img {
      display : block;
      max-width : 100%;
      width : 100%;
    }
/*
    ul.grid-banners > li#banner > h2 {
      text-align : center;
      padding : 20px;
      font-weight : 100;
    }
      ul.grid-banners > li#banner > h2 > b {
        font-weight : 600;
        text-shadow : rgba(0, 0, 0, .2) 0px 0px 4px;
      }
  ul.grid-banners > li:nth-child(1) {
    background-color : #fff;
    border : 1px solid #ededea;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(240,239,235,.5);
    -moz-box-shadow: 0px 0px 5px 1px rgba(240,239,235,.5);
    box-shadow: 0px 0px 5px 1px rgba(240,239,235,.5);
  }
  ul.grid-banners > li:nth-child(2) {
  }
*/

/* Products */
ul.grid-products {
  margin-left : -10px;
  margin-right : -10px;
}
  ul.grid-products > li {
    margin : 10px;
    padding : 20px;
    background-color : #fff;
    border-radius : 5px;
    border : 1px solid #ededea;
    position : relative;
  }
    ul.grid-products > li > ul {
      list-style-type : none;
      text-align : center;
      margin : -4px;
      padding : 0;
    }
      ul.grid-products > li > ul > li {
        height : 36px;
        line-height : 36px;
        background-color : #f0f8fb;
        margin : 4px;
        font-family: 'Raleway', sans-serif;
        font-size : 16px;
        font-weight : 300;
      }

  ul.grid-products li h2 {
    font-family: 'Raleway', sans-serif;
    font-size : 24px;
    text-transform : uppercase;
    margin : 0;
    padding : 0;
    margin-bottom : 20px;
  }
  ul.grid-products li p.description {
  }

  ul.grid-products li div.price {
  }

    ul.grid-products li p.price {
      color : #ea4215;
      text-align : center;
      font-size : 0;
      height : 70px;
      margin-top : 20px;
      margin-left : -5px;
      margin-right : -5px;
      display : block;
    }
    ul.grid-products li p.price span {
      display : inline-block;
      vertical-align : top;
    }
    ul.grid-products li p.price span.total {
      font-size : 40px;
      padding-left : 5px;
      padding-right : 5px;
      font-weight : bold;
      vertical-align : middle;
      text-transform : uppercase;
    }
    ul.grid-products li p.price span.total.smaller {
      font-size : 24px;
    }
    ul.grid-products li p.price span.super {
      font-size : 12px;
      line-height : 12px;
      text-align : left;
    }
      ul.grid-products li p.price span.super > span {
        vertical-align : super;
      }

  ul.grid-products li a.button {
    position : absolute;
    bottom : 20px;
    left : 20px;
    right : 20px;
    height : 50px;
    line-height : 50px;
    font-size : 26px;
  }

  ul.grid-products form {
    background-color : #6cbed3;
    height : 32px;
    position : relative;

    border-top-right-radius : 5px;
    border-bottom-right-radius : 5px;
  }
    ul.grid-products form input[type=text] {
      position : absolute;
      left : 1px;
      top : 1px;
      width : calc(100% - 33px);
      height : 30px;
      margin : 0;
      padding : 2px;
      border : 0 none;
      background : #fff;
      font-family : 'Source Sans Pro', Sans-serif;
      font-size : 16px;
      font-style : italic;
      color : #1A1C1D;
    }
    ul.grid-products form input[type=submit] {
      position : absolute;
      right : 1px;
      top : 1px;
      width : 33px;
      height : 30px;
      margin : 0;
      padding : 0;
      border : 0 none;
      background : transparent;

      color : #fff;
      font: normal normal normal 14px/1 FontAwesome;
      font-size: inherit;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }



/* Reasons */
ul.grid-reasons {
  margin-left : -40px;
  margin-right : -40px;
}
  ul.grid-reasons > li {
    width : 490px;
    margin : 40px;
  }

/* Info */
ul.grid-info {
  margin-left : -10px;
  margin-right : -10px;
}
  ul.grid-info > li {
    width : 265px;
    margin : 10px;
  }

/* 3x1 */
ul.grid3 {
}
  ul.grid3 > li {
    width : 33.33%;
  }

#privacy-conscious {
  font-family: 'Raleway', sans-serif;
  color : #101314;
  padding-left : 68px;
}
  #privacy-conscious h2 {
    font-size : 30px;
    font-weight : bold;
    margin-top : 0;
    padding-top : 0;
    margin-top : 10px;
  }

  #privacy-conscious .privacy-box {
    margin-bottom : 20px;
    padding-left : 40px;
    /*
    margin-left : 40px;
    */
    position : relative;
  }

  #privacy-conscious .privacy-box span {
    text-transform : uppercase;
    display : block;
    font-weight : 200;
  }

  #privacy-conscious .privacy-box span.head {
    font-size : 12px;
    line-height : 14px;
  }

  #privacy-conscious .privacy-box span.label {
    font-size : 24px;
  }

  #privacy-conscious .privacy-box img,
  #privacy-conscious .privacy-box i {
    font-size : 34px;
    position : absolute;
    left : 0px;
    bottom : 4px;
  }
  #privacy-conscious .privacy-box i.fa-check {
    color : #629c22;
  }
  #privacy-conscious .privacy-box i.fa-btc {
    color : #eb8b2d;
  }

/* ************************************************************************* *
 * Page: /about
 * ************************************************************************* */

body.en_about section.yellow,
body.no_about section.yellow {
  min-height : 600px;
}
  body.en_about section.yellow > .wrapper,
  body.no_about section.yellow > .wrapper {
    padding-right : 380px;
  }

div.references {
  text-align : center;
}
  div.references > .reference {
    width : 400px;
    height : 580px;
    margin : 20px;
    padding : 40px;
    display : inline-block;
    vertical-align : top;
    background : #fff;
  }
  div.references > .reference > img {
    max-width : 100%;
  }
  div.references > .reference > p {
    font-style : italic;
  }

#contact-box {
  position : absolute;
  top : 0px;
  right : 0px;
  width : 360px;
  background : #fff;
  padding : 20px;
}
  #contact-box h3,
  #contact-box h4 {
    margin : 0;
    padding : 0;
  }
  #contact-box h4 {
    margin-top : 20px;
  }
  #contact-box p {
    padding : 0;
    margin : 0;
  }

/* ************************************************************************* *
 * Page: /feedback
 * ************************************************************************* */

#feedbacks {
}
  #feedbacks > .feedback {
    background-color : #fff;
    padding : 20px;
    margin-bottom : 20px;
  }

#feedback-form {
  max-width : 600px;
}
  #feedback-form input[type=text],
  #feedback-form textarea,
  #feedback-form label {
    display : block;
    width : 100%;
  }
  #feedback-form textarea {
    resize : none;
  }
  #feedback-form > div {
    margin-bottom : 20px;
  }

/* ************************************************************************* *
 * Page: /partners
 * ************************************************************************* */

p.partner {
  margin-top : 80px;
  padding : 10px;
}

/* ************************************************************************* *
 * PAD / SMALL SCREEN
 * ************************************************************************* */

@media (min-width: 1161px) {
/*
  ul.grid-banners > li#banner > h2 {
    text-align : center;
    font-size : 44px;
    line-height : 60px;
  }
    ul.grid-banners > li#banner > h2 > b {
      font-size : 60px;
    }
*/
  ul.grid-banners > li:nth-child(1) {
    width : 740px;
  }
  ul.grid-banners > li:nth-child(2) {
    width : 360px;
  }
  ul.grid-products > li {
    width : 265px;
    height : 540px;
  }
    ul.grid-products > li > ul {
      position : absolute;
      bottom : 115px;
      left : 0px;
      right : 0px;
    }
      ul.grid-products > li > ul > li {
        width : 225px;
        display : inline-block;
      }
  ul.grid-products li div.price {
    position : absolute;
    top : 162px;
    left : 20px;
    right : 20px;
  }
  ul.grid-products li p.description {
    height : 100px;
  }
  ul.grid-products form {
    width : 225px;
    margin-top : -40px;
    margin-bottom : -5px;
    margin-top : -80px;
  }
}

@media (max-width: 1160px) {

  div.wrapper {
    width : 95%;
  }

  header {
    height : 110px;
  }

  header > .wrapper {
    background-size : 200px;
  }

  header h1 {
    top : auto;
    left : 0px;
    bottom : -20px;
  }
  ul.grid-banners > li#banner {
    height : auto;
  }

  ul.grid-banners > li:nth-child(1) {
    width : calc(100% - 410px);
  }
  ul.grid-banners > li:nth-child(2) {
  }
  ul.grid-products > li {
    width : calc(50% - 20px);
    padding-bottom : 120px;
    min-height : 520px;
  }
    ul.grid-products > li > ul {
    }
  ul.grid-products li p.description {
    margin-bottom : 20px;
  }

  ul.grid-reasons {
    margin : 0;
  }
    ul.grid-reasons > li {
      width : 33.33%;
      margin : 0;
      padding : 40px;
    }

  ul.grid-info {
    margin : 0;
  }
    ul.grid-info > li {
      width : 25%;
      margin : 0;
      padding : 40px;
    }

  ul.grid-footer {
    margin : 0;
  }
    ul.grid-footer > li:nth-child(1) {
      width : 30%;
      margin : 0;
    }
    ul.grid-footer > li:nth-child(2) {
      width : 20%;
      margin : 0;
    }
    ul.grid-footer > li:nth-child(3) {
      width : 50%;
      margin : 0;
    }

  section {
    padding : 10px !important;
  }
}

@media (max-width: 1000px) {

  ul.grid.grid3 > li {
    width : 100%;
  }

  body.en_about section.yellow > .wrapper,
  body.no_about section.yellow > .wrapper {
    padding-right : 0;
  }

  ul.grid-reasons > li {
    padding : 0;
  }

  ul.grid-info > li {
    padding : 10px;
  }

  #privacy-conscious {
    padding-left : 0;
  }

  body {
    font-size : 14px;
  }
  ul.grid > li {
    font-size : 14px;
  }

  div.compare > ul > li {
    font-size : 14px;
  }

  .button.big {
    font-size : 14px;
  }

  header h1 {
    font-size : 14px;
  }

  section > .wrapper > h2 {
    font-size : 30px;
  }
  section > .wrapper > h2.small {
    font-size : 28px;
  }
  section > .wrapper > h2.big {
    font-size : 52px;
  }
  section > .wrapper h3 {
    font-size : 18px;
  }

  #contact-box {
    position : static;
    top : auto;
    left : auto;
    right : auto;
    width : auto;
  }
}

/* ************************************************************************* *
 * MOBILE
 * ************************************************************************* */

@media (max-width: 1000px) {
  ul.grid-banners > li {
    margin : 0;
  }
  ul.grid-banners > li:nth-child(1) {
    width : 100%;
  }
  ul.grid-banners > li:nth-child(2) {
    width : 100%;
  }
  #privacy-conscious {
    height : auto;
    padding : 10px;
  }
    #privacy-conscious .privacy-box {
      display : inline-block;
      margin : 10px;
    }
    #privacy-conscious .more {
      margin-top : 20px;
    }

}

@media (max-width: 700px) {
  header div#right {
    display : none;
  }

  nav {
    display : none;
  }

  #hamburger {
    display : block;
  }

  ul.bullet > li {
    margin-bottom : 0;
  }

  ul.grid-reasons > li {
    width : 100%;
  }
  ul.grid-info > li {
    width : 100%;
  }
  ul.grid-footer > li:nth-child(1) {
    width : 70%;
  }
  ul.grid-footer > li:nth-child(2) {
    width : 30%;
  }
  ul.grid-footer > li:nth-child(3) {
    width : 100%;
  }

  body {
    font-size : 12px;
  }
  ul.grid > li {
    font-size : 12px;
  }

  div.compare > ul > li {
    font-size : 12px;
  }

  .button.big {
    font-size : 12px;
  }

  header h1 {
    font-size : 12px;
  }

  section > .wrapper > h2 {
    font-size : 30px;
  }
  section > .wrapper > h2.small {
    font-size : 22px;
  }
  section > .wrapper > h2.big {
    font-size : 32px;
  }
  section > .wrapper h3 {
    font-size : 16px;
  }
}

@media (max-width: 560px) {
  ul.grid-products > li {
    width : calc(100% - 20px);
  }
  ul.grid-products > li {
    min-height : auto;
  }
}