
/* General ------------------------- */
body {
  font-family: "Open Sans", sans-serif, Helvetica Neue, Arial, sans-serif;
    color:#595959;
    min-width:320px;
}


/* Fonts ------------------------- */

@font-face {
  font-family: 'Open sans';
  src: url("../fonts/OpenSans-Light-webfont.eot");
  src: url("../fonts/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Light-webfont.woff") format("woff");
  font-weight: 300;
  font-style: normal; }
@font-face {
  font-family: 'Open sans';
  src: url("../fonts/OpenSans-Regular-webfont.eot");
  src: url("../fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Regular-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal; }
@font-face {
  font-family: 'Open sans';
  src: url("../fonts/OpenSans-Bold-webfont.eot");
  src: url("../fonts/OpenSans-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Bold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal; }
@font-face {
  font-family: 'Titillium Web';
  src: url("../fonts/TitilliumWeb-Light.ttf");
  font-weight: 300;
  font-style: normal; }
@font-face {
  font-family: 'Titillium Web';
  src: url("../fonts/TitilliumWeb-Regular.ttf");
  font-weight: 400;
  font-style: normal; }
@font-face {
  font-family: 'Titillium Web';
  src: url("../fonts/TitilliumWeb-Bold.ttf");
  font-weight: 700;
  font-style: normal; }


/* Texts titles ------------------- */

p {
  font-family: "Open Sans", sans-serif; }

.text-mini {
  font-size: 0.75rem; }

.text-color-1 {
  color: #1cb1e7; }

.text-color-2 {
  color: #595959; }

.text-color-3 {
  color: #174573; }

.text-white{
    color:#fff;
}

.styleLink{
    color:#1cb1e7;
}
.styleLink:hover{
    color:#0056b3;
    cursor:pointer;
    text-decoration: underline;
}

a{
    color:#1cb1e7;
}

.title-1 {
  font-family: 'Titillium Web', sans-serif;
  font-weight: 700;
  font-size: 2rem; }
  @media (min-width: 768px) {
    .title-1 {
      font-size: 3rem; } }

.title-2 {
  font-family: 'Titillium Web', sans-serif;
  font-weight: 700;
  font-size: 2.5rem; }

.title-3 {
  font-family: 'Titillium Web', sans-serif;
  font-weight: 700;
  font-size: 2rem; }

.title-4 {
  font-family: 'Titillium Web', sans-serif;
  font-weight: 700;
  font-size: 1.5rem; }

.subtitle {
  font-family: 'Titillium Web', sans-serif;
  font-size: 1.5rem; }

.title-handwrite {
  font-family: "Trendsetter", sans-serif;
  font-size: 3rem;
  display: block;
  transform: rotate(-6deg);
  line-height: 3rem; }
  @media (min-width: 1200px) {
    .title-handwrite {
      line-height: 5rem;
      font-size: 4rem; } }

.separatorSmall::after {
    content: "";
    border-bottom: 2px solid #1cb1e7;
    width: 50px;
    display: inherit;
    margin-bottom: 30px;
    padding-top: 15px;
}
.separatorLarge::after {
    content: "";
    border-bottom: 2px solid #1cb1e7;
    width: 100px;
    display: inherit;
    margin-bottom: 30px;
    padding-top: 15px;
}

/* Background ---------------------- */

.bg-color-1 {
  background-color: #1cb1e7; }

.bg-color-2 {
  background-color: #595959; }

.bg-cta {
  background-color: #ee8f10; }

.bg-gray {
  background-color: #343a40; }

.bg-light {
  background-color: #e6e6e6; }


/* Buttons ---------------------- */

.btn{
    border-radius:0px;
}

.btn-cta{
    background-color:#ee8f10;
    color:#fff;
}
.btn-cta:hover{
    background-color:#6cb520;
    color:#fff;
}

.btn-primary{
    background-color: #1cb1e7;
    border:#1cb1e7;
}

/* Back to top */
#scroll {
  position: fixed;
  right: 20px;
  bottom: 20px;
  cursor: pointer;
  width: 50px;
  height: 50px;
  background-color: #ed8f11;
  text-indent: -9999px;
  display: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  z-index: 10; }

#scroll span {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -8px;
  margin-top: -12px;
  height: 0;
  width: 0;
  border: 8px solid transparent;
  border-bottom-color: #ffffff; }

#scroll:hover {
  transition: all 0.5s ease-out;
  background-color: #6cb520;
  opacity: 1;
  filter: "alpha(opacity=100)";
  -ms-filter: "alpha(opacity=100)"; }

/* 


/* 
Extra small devices (portrait phones, less than 544px) 
No media query since this is the default in Bootstrap because it is "mobile first"
*/
 
.background-header {
    position: absolute;
    width: 100%;
    height: 100%;
}

.heroBackground {
    background-image: url('../img/background-header-nice-XL.jpg');
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-position:-365px;

}

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    padding: 0px 0 0 0;
}

.navbar.scrolled {
    background-color: #fff;
    border-bottom: 1px solid #f7f7f7;
    -webkit-transition: background-color 0.3s ease-out;
    -moz-transition: background-color 0.3s ease-out;
    -o-transition: background-color 0.3s ease-out;
    transition: background-color 0.3s ease-out;
}

.blockHeaderWrapper{
    background: rgba(255, 255, 255, 0.75);
    visibility: visible;
    padding: 40px 20px;
    margin-left:-15px;
    margin-right:-15px;
    position:relative;
}
 
.blockHeaderPrice{
    font-family: 'Titillium Web', sans-serif;
    font-size:4rem;
    font-weight:700;
    text-align: center;
    margin-top: -10px;
}

.svgTriangle{
    position:absolute;
    top: 50%;
    right: -49px;
    color:#fff;
    display:none;
}

.blockHeaderAsterisk{
    margin-top: 10px;
}

.blueBanner{
    color:#fff;
    font-size:1.5em;
}

.textCircle{
    font-family:'Titillium Web';
    font-weight: 700;

    font-size:2em;
    height: 75px;
    width: 75px;
    background-color:#ed8f11;
    text-align: center;
    display:flex;
    align-items: center;
    justify-content: center;
    color:#fff;
    
}

.colPriceIco{
    width:150px;
    display:flex;
    justify-content: center;
}

.colPriceTableWrapper img{
    margin:0 auto;
}


.priceTableText{
    font-family:'Titillium Web';
}

.priceTableText span:first-child{
    color:#1cb1e7;
    font-weight:700;
    font-size:5rem;
    line-height: 75px;
}

.priceTableText span:nth-child(2){
    color:#595959;
    font-weight:700;

    letter-spacing: 2.5px;
}

.priceTableText span:nth-child(3){
    color:#1cb1e7;
    font-weight:700;
    font-size:1.5rem;
}

.priceTableText span:nth-child(4){
    color:#595959;
    font-size:1rem;
}

.hiwMainTitleWrapper{
    position:relative;
    display:flex;
    justify-content: center;
}

.hiwMainTitleText{
    color:#fff;
    font-weight:700;
    font-family:'Titillium Web';
    font-size:1.5rem;
    position:absolute;
    top: 20%;

}

.hiwMainTitleTextSmall{
    color:#fff;
    font-weight:700;
    font-family:'Titillium Web';
    font-size:1.5rem;
    position:absolute;
    top: 30%;

}

.hiwImgWrapper{
    overflow:hidden;
    height:250px;
}

.hiwImgWrapper img{
    vertical-align:middle;
}

.hiwNumber{
    color:#1cb1e7;
    font-weight:700;
    font-size:3rem;
    margin-right:20px;
}

.hiwTitle{
    color:#595959;
    font-weight:bold;
    font-size:1.5rem;
    font-family:'Titillium Web';
    line-height: 1.5rem;
}

.sectionInvitation{
    background-image: url('../img/whispering.jpg');
    background-size: cover;
    background-position: center;
}

.priceTableWrapper .separatorSmall::after{
    margin:0 auto;
    margin-bottom: 40px;
}

.chiller_cb label{
    position:static!important;
}

.checkboxRules .form-group:first-child{
    padding-bottom: 5px;
}

.textLegal{
    font-weight:300;
}

footer ul li:hover {
    cursor:pointer;
    text-decoration: underline;

}

footer ul li a{
    color:#fff!important;
}

footer ul li:first-child:hover {
    cursor:auto;
    text-decoration: none;
}

.error .form-control {
    border-bottom: 1px solid #e74c3c!important;
    color: #e74c3c;
}

.error.float-label, .error label {
    color: #e74c3c!important;
}

.error.chiller_cb input:checked ~ span {
    background: #e74c3c;
    border-color: #e74c3c;
}
.material-form .error .form-control:focus ~ .form-bar:before, .material-form .error .form-control:focus ~ .form-bar:after {
    background: #e74c3c;
    height:2px;
}

.firstTitle{
    font-family: 'Asap', sans-serif;
    font-weight: 700;
    font-size: 1.5rem; 
}

/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) { 

    .heroBackground {
        background-position:-400px;
    }
    .blockHeaderWrapper{
        margin-left:15px;
        margin-right:15px;
        background-color: #fff;
        margin-top:75px;
        margin-bottom: 75px;;
    }
    .blockHeaderPrice{
        font-size:6rem;
    }

    .blockHeaderAsterisk{
        margin-top: 30px;
    }
    
    .hiwMainTitleText{
        font-size:1.9rem;
        top: 27%;
    }
    
    .hiwMainTitleTextSmall{
        font-size:1.9rem;
        top: 27%;
    }

    .hiwImgWrapper{
        overflow:hidden;
        height:350px;
    }

    .checkboxRules .form-group{
        margin-bottom: 0!important;
    }

    .checkboxRules .form-group:nth-child(2){
        margin-top: 0!important;
    }

    .checkboxRules .form-group:first-child{
        padding-bottom: 20px;
    }
    .firstTitle{
        font-family: 'Asap', sans-serif;
        font-weight: 700;
        font-size: 1.5rem; 
    }
}
 
/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {  
     .heroBackground {
        background-position:-430px;
    } 
    
    .hiwMainTitleWrapper{

    }    
    .hiwImgWrapper{
        overflow:hidden;
        height:auto;
    }
    
    .hiwMainTitleText{   

    }
     
    .hiwNumber{
        font-size:5rem;
    }
    
    .checkboxRules .form-group:first-child{
        padding-bottom: 5px;
    }

    .firstTitle{
        font-family: 'Asap', sans-serif;
        font-weight: 700;
        font-size: 2rem; 
    }
}
 
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    
    .svgTriangle{
        display:block;
    }
    
    .heroBackground {
        background-position:-300px;
    }
    
    .hiwSection{
        margin-top:-50px;
    }
    
    .hiwMainTitleWrapper{
        justify-content: flex-start;
    }   
    
    .hiwMainTitleText{        
        top: 22%;
        left: 18%;
    }
    
    .hiwMainTitleTextSmall{  
        left: 13%;
    }
}
 
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
    .heroBackground {
        background-position:-0px;
    }
    
    .hiwMainTitleText{        

    }
    
    .hiwSection{
        margin-top:-90px;
    }
    
    .hiwMainTitleTextSmall{  
        left:11%;
    }

}
 
 
 
/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Custom media queries
*/
 
/* Set width to make card deck cards 100% width */
@media (max-width: 950px) { 
 
}

/* CSS snippet https://codepen.io/zavoloklom/pen/yaozl?editors=1000 */
/* -- Body style ------------------------------------ */
.material-form {
  /* -- Input styles ---------------------------------- */
  /* -- label styles ---------------------------------- */
  /* active state */
  /* input colors ---- */
  /* help-block */
  /* input addon ---*/
  /* ------  inline ----*/
  /* -- bar styles -------------------------------------- */
  /* active state */
  /* -- highlighter styles ------------------------------ */
  /* active state */
  /* -- highlighter animation --------------------------- */
  /*-- Checkbox --------------------------- */
  /* 
   * Core styles required for the checkboxes.
   * @author Jason Mayes 2014, www.jasonmayes.com
  */ }
  .material-form .form-group {
      position: relative;
      margin-top: 20px;
      margin-bottom: 20px;
  }

  .material-form .input-group {
      position: relative;
  }

  .material-form .form-control {
      display: block;
      height: 36px;
      width: 100%;
      border: none;
      border-radius: 0 !important;
      font-size: 16px;
      font-weight: 300;
      padding: 0;
      background-color: transparent;
      box-shadow: none;
      border-bottom: 1px solid #1cb1e7;
  }

  @media (min-width: 576px) {
      .material-form .form-control {
          font-size: 14px;
      }
  }

  @media (min-width: 992px) {
      .material-form .form-control {
          font-size: 16px;
      }
  }

  .material-form .input-group .form-control {
      position: relative;
      z-index: inherit;
      float: inherit;
      width: 100%;
      margin-bottom: 0;
  }

  .material-form .form-control:focus {
      border-color: #1cb1e7;
      outline: none;
      box-shadow: none;
  }

  .material-form label {
      position: absolute;
      top: -18px;
      color: #174573;
      font-size: 12px;
      font-weight: 300;
      transition: 0.2s ease all;
      -moz-transition: 0.2s ease all;
      -webkit-transition: 0.2s ease all;
  }

  .material-form .form-horizontal .control-label {
      position: relative;
      top: 0;
      margin-bottom: 0;
  }

  @media (min-width: 768px) {
      .material-form .form-horizontal .control-label {
          font-size: 16px;
      }
  }

  .material-form .float-label {
      left: 13px;
      top: 7px;
      font-size: 16px;
      pointer-events: none;
  }

  .material-form .form-control:focus ~ .float-label

  , .material-form .form-control:valid ~ .float-label 
      {
      top: -18px;
      font-size: 12px;
  }

  .material-form .form-control:focus ~ label {
      color: #1cb1e7;
  }

  .material-form .form-control:focus ~ .form-bar:before,
  .material-form .form-control:focus ~ .form-bar:after {
      background: #1cb1e7;
      height: 2px;
  }

  .material-form .form-group .help-block {
      position: absolute;
  }

  .material-form .help-block {
      color: #bdbdbd;
      font-size: 12px;
      font-weight: 300;
  }

  .material-form .input-group-addon {
      border: none;
      background: transparent;
  }

  .material-form .input-group-addon,
  .material-form .form-inline .input-group {
      display: table-cell;
  }

  .material-form .input-group-addon,
  .material-form .input-group-btn {
      width: inherit;
  }

  .material-form .input-group {
      width: 100%;
  }

  @media (min-width: 768px) {
      .material-form .form-inline .form-group {
          margin-top: 16px;
      }

      .material-form .input-group-btn,
      .material-form .input-group .form-control,
      .material-form .input-group-addon,
      .material-form .form-inline .input-group {
          display: inline-block;
      }

      .material-form .input-group {
          width: auto;
      }
  }

  .material-form .form-bar {
      position: relative;
      display: block;
      width: 100%;
  }

  .material-form .form-bar:before,
  .material-form .form-bar:after {
      content: '';
      height: 1px;
      width: 0;
      bottom: 0;
      position: absolute;
      transition: 0.3s ease all;
      -moz-transition: 0.3s ease all;
      -webkit-transition: 0.3s ease all;
  }

  .material-form .form-bar:before {
      left: 50%;
  }

  .material-form .form-bar:after {
      right: 50%;
  }

  .material-form .form-control:focus ~ .form-bar:before,
  .material-form .form-control:focus ~ .form-bar:after {
      width: 50%;
  }

  .material-form .form-highlight {
      position: absolute;
      height: 60%;
      width: 60px;
      top: 25%;
      left: 0;
      pointer-events: none;
      opacity: 0.4;
  }

  .material-form .form-control:focus ~ .form-highlight {
      -webkit-animation: inputHighlighter 0.3s ease;
      -moz-animation: inputHighlighter 0.3s ease;
      animation: inputHighlighter 0.3s ease;
  }

  @-webkit-keyframes inputHighlighter {
      from {
          background: #5264AE;
      }

      to {
          width: 0;
          background: transparent;
      }
  }

  @-moz-keyframes inputHighlighter {
      from {
          background: #5264AE;
      }

      to {
          width: 0;
          background: transparent;
      }
  }

  @keyframes inputHighlighter {
      from {
          background: #5264AE;
      }

      to {
          width: 0;
          background: transparent;
      }
  }

  .material-form .form-group.checkbox {
      margin-top: 20px;
  }

  .material-form .checkbox input[type='checkbox'] {
      height: 0;
      width: 0;
      opacity: 0;
  }

  .material-form .checkbox label {
      font-size: 14px;
      font-weight: 300;
      line-height: 1;
      display: inline-block;
      overflow: hidden;
      position: relative;
      top: 10px;
      padding-left: 0;
  }

  .material-form .checkbox .chk-span {
      top: 0;
      border: 1px solid #5a5a5a;
      color: #1d1d1d;
      cursor: pointer;
      display: inline-block;
      float: left;
      height: 14px;
      margin: 0 14px 14px 1px;
      outline-color: #eaeaea;
      padding: 0;
      position: relative;
      width: 14px;
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out;
      z-index: 1;
  }

  .material-form .checkbox .chk-span.checked {
      top: -2px;
      border-left: 2px solid #6cb520;
      border-bottom: 4px solid #6cb520;
      border-top: 1px solid transparent;
      border-right: 1px solid transparent;
      -webkit-transform: rotate(-45deg) scaleY(0.5);
      -moz-transform: rotate(-45deg) scaleY(0.5);
      -ms-transform: rotate(-45deg) scaleY(0.5);
      -o-transform: rotate(-45deg) scaleY(0.5);
      transform: rotate(-45deg) scaleY(0.5);
  }

  .material-form .checkbox .chk-span.checked {
      border-left-color: #6cb520;
      border-bottom-color: #6cb520;
  }

  .material-form .checkbox input[type='checkbox']:focus ~ label {
      color: #6cb520;
  }

  .material-form .checkbox input[type='checkbox']:focus ~ label .chk-span {
      border-color: #6cb520;
  }

  .material-form .checkbox input[type='checkbox']:focus ~ label .chk-span.checked {
      border-left-color: #6cb520;
      border-bottom-color: #6cb520;
      border-top: 1px solid transparent;
      border-right: 1px solid transparent;
  }

  @media (min-width: 768px) {

      .material-form .form-inline .radio label,
      .material-form .form-inline .checkbox label {
          padding-left: 5px;
      }
  }

  .material-form .form-control-static {
      font-size: 16px;
  }

  .material-form .form-control[disabled],
  .material-form .form-control[readonly],
  .material-form fieldset[disabled] .form-control {
      background-color: transparent;
      border-bottom-style: dashed;
  }

  .material-form #focusedInput {
      border-color: #ccc;
      border-color: rgba(82, 168, 236, 0.8);
      outline: 0;
      box-shadow: none;
  }

