/* Algemeen */
input[type='text'],
input[type='number'],
input[type='tel'],
input[type='email'],
textarea {
    -webkit-appearance: none !important;
    border-radius: 0 !important;
    line-height: 32px !important;
    min-height: 32px !important;
    padding: 3px !important;
    color: #000 !important;
}
textarea {
    resize: none;
    height: 150px;
}
input:focus,
textarea:focus {
    outline:none;
    border: 1px solid #fbba00;
}
select {
    padding: 3px !important;
}
label span {
    line-height: 35px;
    color: #fff;
}
section, footer {
  padding: 30px 0 !important;
}
section.hugepadding {
  padding: 120px 0 !important;
}
section.gray {
  background: #f2f2f2;
}
body {
    background: #fff;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 100;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 17px;
    line-height: 24px;
    overflow-x: hidden;
}
p, quote {
    font-size: 17px;
    color: #3d3d3c;
    margin-bottom: 15px;
    line-height: 27px;
}
quote {
  color: #009fe3;
  font-style: italic;
  display: block;
}
p.small {
    font-size: 16px;
}

a,
a:hover,
a:active,
a.active {
    color: #ff7800;
    outline: 0;
    text-decoration: none;
}

h1,
.h1-title,
h2,
.h2-title,
h3,
.h3-title,
h4,
h5,
h6 {
    font-size: 36px;
    line-height: 37px;
    color: #94c11f;
    margin: 0 0 5px 0;
    font-weight: 300;
}
h2,
.h2-title {
    font-size: 28px;
    line-height: 29px;
}
h3,
.h3-title {
    font-size: 24px;
    line-height: 25px;
/*
    color: #3d3d3c;
    font-weight: bold;
*/
}
h5 {
    color: #fff;
}
h4 {
    font-size: 24px;
    line-height: 25px;;
}
h6 {
    font-size: 16px;
    line-height: 17px;
}
@media (max-width: 767px) {
    h1,
    .h1-title {
        text-align: left !important;
    }
    section {
      padding: 30px 0 !important;
    }
    p {
      font-size: 14px;
      line-height: 18px;
    }
    .xs-text-left {
      text-align: left;
    }
}
@media (max-width: 990px) {
  p, body {
    font-size: 14px;
    line-height: 25px;
  }
}
.img-centered {
    margin: 0 auto;
}
a {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.left {
    float: left !important;
}
.right {
    float: right !important;
}
.absolute {
    position: absolute !important;
}
.relative {
    position: relative !important;
}
.fixed {
    position: fixed !important;
}
.nopadding {
    padding: 0;
}
.nopaddingleft {
    padding-left: 0;
}
.nopaddingright {
    padding-right: 0;
}
.nopaddingbottom {
    padding-bottom: 0 !important;
}
.nowrap {
    white-space: nowrap;
}
.bottommargin {
    margin-bottom: 30px;
}
.largebottommargin {
    margin-bottom: 60px;
}
.hugebottommargin {
    margin-bottom: 60px;
}
.topmargin {
    margin-top: 30px;
}
.nomargin {
    margin: 0;
}
.border {
    border: 1px solid #58585a;
}
.inside {
    padding-top: 15px;
    padding-bottom: 15px;
}
.insidesmall {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 5px;
    padding-left: 5px;
}
.smalltopmargin {
    margin-top: 15px;
}
.smallbottommargin {
    margin-bottom: 15px;
}

.youtube {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.youtube iframe,
.youtube object,
.youtube embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.white {
  background: #fff;
}
.gray {
  background: #f2f2f2;
}
.green {
  background: #95c102;
}
.overflow {
  overflow: hidden;
}


@media (max-width: 767px) {
    .smallnopaddingleft {
        padding-left: 0;
    }
    .smallnopaddingright {
        padding-right: 0;
    }
    .smallpadding {
        padding-left: 15px;
        padding-right: 15px;
    }
    .smallmarginbottom {
        margin-bottom: 15px;
    }
    .smallnopadding {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .smallbottommarginonly {
        margin-bottom: 15px;
    }
    .xs-text-center {
        text-align: center;
    }
    .largebottommargin {
      margin-bottom: 30px;
    }
    section.hugepadding {
      padding: 30px 0 !important;
    }
    .smallnomargin {
      margin: 0;
    }
}
@media (min-width: 768px) {
    .col-sm-20 {
      width: 20%;
    }
}
@media (min-width: 768px) and (max-width: 990px) {
    .middlepadding {
        padding-left: 15px;
        padding-right: 15px;
    }
    .middlenopadding {
        padding-left: 0;
        padding-right: 0;
    }
}
@media (min-width: 991px) {
    .col-md-20 {
      width: 20%;
    }
}
@media (max-width: 1199px) {
    .marginbottomnotlarge {
        margin-bottom: 15px;
    }
    .nopaddingrightnotlarge {
        padding-right: 0;
    }
    .nopaddingleftnotlarge {
        padding-left: 0;
    }
}


/* Header */
nav {
  border-bottom: 2px solid #759701;
}
nav .contact-link {
  font-weight: 700;
  color: #95c102;
  font-size: 20px;
  line-height: 25px;
  right: 15px;
  top: 50%;
  -ms-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
header {
  height: 520px;
  overflow: hidden;
}
header .gradient {
  height: 1040px;
  width: 150%;
  left: 0;
  top: 0;
  background: rgba(255,255,255,1);
  background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(148,193,2,1) 100%);
  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(148,193,2,1)));
  background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(148,193,2,1) 100%);
  background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(148,193,2,1) 100%);
  background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(148,193,2,1) 100%);
  background: radial-gradient(ellipse at center, rgba(255,255,255,1) 0%, rgba(148,193,2,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#94c102', GradientType=1 );
}
header .placeholder {
  height: 520px;
  background-image: url(../img/header.png);
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: contain;
}
.question-balloon {
  background: #ff7800;
  border-right: 3px solid #759701;
  border-bottom: 3px solid #759701;
  border-radius: 20px;
  font-size: 41px;
  line-height: 42px;
  color: #fff;
  font-weight: 900;
  margin-top: 60px;
}

@media (max-width: 767px) {
  .question-balloon span {
    width: auto;
    float: none;
  }
}

@media (min-width: 768px) {
  .question-balloon span.little {
    font-size: 20px;
    font-weight: 100;
    line-height: 21px;
  }
}

.question-balloon .balloon-end {
  left: 0;
  bottom: -39px;
}
.input-holder {
  border-radius: 0 15px 15px 0;
  border-right: 3px solid #759701;
  border-bottom: 3px solid #759701;
  padding: 3px 60px 3px 3px;
  background: #ff7800;
  margin-top: 60px;
  overflow: hidden;
}
.input-holder input {
  color: #000 !important;
  font-size: 20px;
  font-weight: 100;
  background: #fff;
  border: none;
}
.input-holder button {
  width: 67px;
  height: 100%;
  border: none;
  background: #ff7800;
  border-radius: 15px 0 0 15px;
  right: 0;
  top: 0;
}
.input-holder button:hover img,
.input-holder button:active img {
  -ms-transform: scale(0.85); /* IE 9 */
  -webkit-transform: scale(0.85); /* Safari */
  transform: scale(0.85);
}
@media (max-width: 767px) {
  nav .contact-link {
    font-size: 15px;
  }
}





@media (max-width: 1199px) {
  header {
    height: 365px;
  }
  header .gradient {
    height: 730px;
  }
  header .placeholder {
    height: 365px;
  }
}
@media (max-width: 767px) {
  header .placeholder {
    background: none;
    height: 225px;
  }
  .question-balloon {
    margin-top: 15px;
  }
  .input-holder {
    margin-top: 50px;
  }
  header {
    height: auto;
  }
  header .gradient {
    height: 450px;
  }
}






/* Items */
.item {
  background: #95c102;
  border: 1px solid #759701;
  -webkit-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  -o-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
}
.item:hover,
.item:active {
  -ms-transform: scale(.85);
  -webkit-transform: scale(.85);
  -o-transform: scale(.85);
  transform: scale(.85);
}
.item.offer {
  border-radius: 15px;
  overflow: hidden;
  background: #ff7800;
  border: 1px solid #8c3503;
}
.item .head {
  background: #759701;
  line-height: 50px;
  color: #fff;
  font-size: 20px;
  font-weight: 900;
}
.item.offer .head {
  background: #8c3503;
}
.item ul {
  padding-left: 35px;
  border-bottom: 1px solid #fff;
  margin: 0;
}
.item.offer ul {
  padding-bottom: 30px;
}
.item ul li {
  color: #fff;
}
.item .price {
  border-bottom: 1px solid #fff;
  color: #759701;
}
.item.offer .price {
  color: #8c3503;
}
.item .price .main {
  font-size: 80px;
  height: 82px;
  line-height: 82px;
  font-weight: 900;
}
.item .price .decimal {
  font-size: 40px;
  height: 41px;
  line-height: 41px;
  font-weight: 900;
  margin-top: 7px;
}
.item .price .month {
  font-size: 20px;
  height: 41px;
  line-height: 41px;
  font-weight: 100;
  margin-top: -7px;
}
.item .bestellen {
  background: #fff;
  padding: 10px 30px 10px 10px;
  border-radius: 0 0 15px 0;
  color: #95c102;
  font-size: 20px;
  line-height: 21px;
  font-weight: 900;
  position: relative;
}
.item.offer .bestellen {
  color: #8c3503;
}
.item .bestellen .fa {
  right: 1px;
  top: 12px;
}
.guy {
  left: -282px;
  top: -60px;
  z-index: 1;
}
@media (max-width: 767px) {
  .item.offer {
    border-radius: 0;
  }
}

/* Content */
.modal-body ul {
  color: #3d3d3c;
}

ul {
  color: #ff7800;
}

.item {
  background: #95c102;
  border: 1px solid #759701;
  -webkit-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  -o-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
}
.item:hover,
.item:active {
  -ms-transform: scale(.95);
  -webkit-transform: scale(.95);
  -o-transform: scale(.95);
  transform: scale(.95);
}

/* Footer */
footer {
  background: #95c102;
}
footer .question-balloon {
  margin: 0;
  cursor: pointer;
}
footer .question-balloon.first {
  padding-top: 115px;
  -webkit-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  -o-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
}
footer .question-balloon.first:hover,
footer .question-balloon.first:active,
footer .question-balloon.second:hover,
footer .question-balloon.second:active {
  -ms-transform: scale(.95);
  -webkit-transform: scale(.95);
  -o-transform: scale(.95);
  transform: scale(.95);
}
footer .question-balloon.first img {
  right: 0;
  bottom: 0;
}
footer .question-balloon.second {
  padding-bottom: 115px;
  -webkit-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  -o-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
}
footer .question-balloon.second img {
  right: -30px;
  bottom: -18px;
}
.bottom-footer p {
  margin: 0;
  line-height: 50px;
}
@media (max-width: 990px) {
  footer .question-balloon.third {
    margin-top: 15px;
  }
}
@media (max-width: 767px) {
  footer .question-balloon.first {
    margin-bottom: 15px;
    padding-top: 15px;
  }
  footer .question-balloon.second {
    padding-bottom: 15px;
  }
  footer .question-balloon.first img,
  footer .question-balloon.second img {
    display: none;
  }
}

/* Sale template */
.sale-template header {
  height: 380px;
}
@media (max-width: 767px) {
  .sale-template header {
    height: auto;
  }
}

/* Cookiebar */
.cookie {
  background: rgba(0,0,0,0.85);
  left: 0;
  bottom: 0;
  z-index: 400;
  padding: 30px 0;
  display: none;
  width: 100%;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.cookie p,
.read-more-cookies {
  font-size: 15px;
  line-height: 20px;
  font-weight: 300;
  color: #fff;
  margin: 0;
  padding-left: 20%;
  padding-right: 18%;
}
.cookie .cookie-title {
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: #fff;
  width: calc(20% - 10px);
}
.cookie .close-cookie:before {
  position: absolute;
  left: 50%;
  top: 50%;
  font-size: 25px;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.cookie .close-cookie,
.cookie .close-cookie:hover,
.cookie .close-cookie:focus,
.cookie .close-cookie:active {
  width: 35px;
  height: 35px;
  left: 0;
  top: 0;
  background: #ff7800;
  color: #fff;
  text-decoration: none;
  -ms-transform: translateY(-100%);
  -webkit-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.cookie .close-cookie:hover,
.cookie .agree-cookies:hover {
  opacity: 0.65;
}
.cookie .buttons-holder {
  right: 15px;
  top: 50%;
  text-decoration: none;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.cookie .agree-cookies:before {
  color: #fff;
}
.cookie .agree-cookies,
.cookie .agree-cookies:hover,
.cookie .agree-cookies:active,
.cookie .agree-cookies:focus {
  height: 40px;
  padding: 0 10px;
  background: #ff7800;
  border-radius: 5px;
  margin-bottom: 10px;
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.cookie .agree-cookies span {
  font-size: 15px;
  font-weight: 300;
  color: #fff;
  text-decoration: none;
  line-height: 40px;
  font-family: 'Titillium Web', sans-serif;
}
.only-mobile {
  display: none;
  margin-top: -15px;
  margin-bottom: 15px;
}
.read-more-cookies,
.read-more-cookies:hover,
.read-more-cookies:focus,
.read-more-cookies:active {
  padding-left: 0;
  padding-right: 0;
  text-decoration: none;
  display: block;
  width: 100%;
  color: #ff7800;
}
.read-more-cookies:hover {
  text-decoration: underline;
}
@media (max-width: 1199px) {
  .cookie p {
    padding-right: 20%;
  }
}
@media (max-width: 990px) {
  .cookie p {
    padding-left: 0;
  }
  .cookie .cookie-title {
    width: 100%;
    position: relative !important;
  }
  .cookie .cookie-title br {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 990px) {
  .cookie p {
    padding-right: 27%;
  }
}
@media (max-width: 767px) {
  .cookie {
    padding: 15px 0;
  }
 .cookie p {
   margin-bottom: 15px;
   height: 60px;
   display: block;
   display: -webkit-box;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 .cookie p.open {
   margin-bottom: 15px;
   height: auto;
   display: block;
   -webkit-line-clamp: auto;
   -webkit-box-orient: vertical;
   overflow: visible;
   text-overflow: none;
 }
 .cookie p {
   padding-right: 0;
 }
 .cookie .buttons-holder {
   position: relative !important;
   right: auto;
   top: auto;
   float: left;
   -ms-transform: translateY(0);
   -webkit-transform: translateY(0);
   -o-transform: translateY(0);
   transform: translateY(0);
 }
 .cookie .agree-cookies {
   float: left !important;
 }
 .only-mobile {
    display: block;
    width: 100%;
    text-align: right;
 }
}

/* Privacy policy */
.privacy-section .gray ul {
  list-style-position: inside;
}
.privacy-section .mid li a {
  color: #ff7800;
  text-decoration: underline;
}
@media (max-width: 990px) {
  .privacy-section table,
  .privacy-section thead,
  .privacy-section tbody,
  .privacy-section th,
  .privacy-section td,
  .privacy-section tr {
    display: block;
  }
  .privacy-section a {
    word-break: break-all;
  }
  .privacy-section thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .privacy-section tr {
    border: 1px solid #ccc;
  }
  .privacy-section td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50% !important;
  }
  .privacy-section td:nth-of-type(1) {
    word-break: break-all;
  }
  .privacy-section td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
  }
  .privacy-section td:nth-of-type(1):before {
    content: "Cookienaam";
  }
  .privacy-section td:nth-of-type(2):before {
    content: "Geplaatst door";
  }
  .privacy-section td:nth-of-type(3):before {
    content: "Verloopt na";
  }
  .privacy-section td:nth-of-type(4):before {
    content: "Doel";
  }
}