@font-face {
  font-family: 'JennaSue';
  src: url('../fonts/JennaSue.ttf');
}
@font-face {
  font-family: 'HelveticaNeueLTStd-Roman';
  src: url('../fonts/HelveticaNeueLTStd-Roman.otf');
}

body{
  background-color: #fff;
  font-size: 16px;
  font-family: 'HelveticaNeueLTStd-Roman', 'arial', sans-serif;
}
main ul li{
  list-style: circle;
  margin-left: 15px;
}
footer{
  background-color: #848484;
  overflow: auto;
  padding: 50px 0;
}
.even img,
.even iframe{
  float: left;
  max-width: 309px;
}
.odd img,
.odd iframe{
  float: right;
  max-width: 309px;
}

.index footer{
  padding: 90px 0;
}
.index .homefill{
  margin-top: 40px;
}
.index .homeervaring{
  background: line 1px blue;
}
.index .homefill .order{
  float: right;
}
footer ul li{
  float: left;
  text-align: center;
  padding:0 10px;
}
footer ul li:nth-child(9){
  width: 100%;
  text-align: center;
  padding-top: 1em;
}
footer ul li a{
  color: #fff;
  text-decoration: none;
  -o-transition: color 1s ease-in-out;
  -webkit-transition: color 1s ease-in-out;
  -moz-transition: color 1s ease-in-out;
  transition: color 1s ease-in-out;
}
footer ul li a:hover, footer ul li .active{
  color: #00c1f3;
}
header .headerorder:hover,
main a:hover{
  color: #848484;
}
header nav{
  padding-top: 40px;
}
header nav li{
  float: left;
}
main{
  padding: 70px 0;
}
.index main{
  padding-top: 0px;
}
.index .border .contentdevider{
  margin-bottom: 30px;
}
.index .border .contentdevider, .index .border p{
  width: 33%;
  float: left;
}
.index .border p{
  text-align: center;
  margin-top: 40px;
}
.colored h2, .faq #faq h2{
  color: #00c1f3;
  font-weight: normal;
  margin-bottom: 10px;
}
main p, main ul, main a{
  color: #6e6e6e;
  margin-bottom: 10px;
  line-height: 1.4em;
}
main a{
  text-decoration: none;
  color: #00c1f3;
  -o-transition: color 0.3s ease-in-out;
  -webkit-transition: color 0.3s ease-in-out;
  -moz-transition: color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out;
}
main .content{
  padding-top: 70px;
}
main .order{
  background: url('../img/bottles.png') no-repeat;
  width: 228px;
  height: 73px;
  display: block;
  padding-top: 70px;
  padding-left: 89px;
  color: #fff;
}
header .headerorder{
  color: #fff;
  margin-top: 480px;
  z-index: 3;
  position: relative;
  margin-left: 70px;
}
header .headerorder,
main .order strong{
  text-align: center;
  padding-top: 1em;
  background-color: #00c1f3;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 1em;
  font-weight: normal;
  min-width: 200px;
  display: block;
}
main .circle{
  width: 100px;
  height: 100px;
  background: #00c1f3;
  display: block;
  border-radius: 50px;
  margin-right: 30px;
  float: left;
}
.aanbieding a{
  padding-top: 35px;
  display: block;
  text-decoration: none;
}

.list{
  background: #00c1f3 url('../img/bg_blue.png') repeat center center;
  height: auto;
  overflow: auto;
  padding: 45px 0;
  z-index: 3;
  position: relative;
}
.scheerbultjes .list, .ingegroeid .list, .gebruik .list, .ervaring .list, .ingredienten .list{
  overflow: visible;
  height: 120px;
}
.werking .list{
  background-image: none;
  height: 210px;
  overflow: visible;
}

.filosofie .list{
  overflow: visible;
  height: 160px;
}
.scheerbultjes footer, .ingegroeid footer{
  margin-top: -141px;
}
.ingegroeid main img, .scheerbultjes main img{
  width: 100%;
}

.ingegroeid main p, .scheerbultjes main p{
  width:684px;
  float: right;
  padding-left: 40px;
  margin-top: 30px;
}
.media .even p:not(.img-p), .media .odd p:not(.img-p){
  width:684px;
  float: right;
  margin-top: 30px;
}
.scheerbultjes main .toptext p{
  width: 100%;
}
.scheerbultjes main .img-p, .ingegroeid main .img-p, .media .img-p{
  width: 218px;
  float: right;
  padding-left: 0px;
}
.media .img-p img{
  max-width: 100%;
}
.ingegroeid main .img-p,
.media .even .img-p{
  float: left;
}
.media .odd p:not(.img-p){
  float: left;
}
.ingredienten .prefix_4{
  margin-top: 20px;
}
.ingredienten .aloevera{
  margin-top: 20px;
}

.devider img{
  margin-top: -270px;
  float: right;
}
.bottle img{
  float: right;
  margin-top: -310px;
  margin-right: 50px;
}

.list p{
  color: #515151;
}
.colored{
  padding-top: 70px;
  background-color: #f6f5f5;
}
.devider{
  width: 100%;
  height: 4em;
  background-color: #00c1f3;
}

/*header*/
.logo img{
  z-index: 3;
  position: relative;
  float: left;
  margin-left: 0px;
  margin-top: 20px;
  margin-bottom: -60px;
}
header a{
  color: #737373;
  font-size: 16px;
  font-family: 'arial', sans-serif;
  text-decoration: none;
  margin-left: 24px;
  -o-transition: color 0.3s ease-in-out;
  -webkit-transition: color 0.3s ease-in-out;
  -moz-transition: color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out;
}
header a.active, header a:hover{
  color: #00c1f3;
}
header #navtoggle{
  display: none;
  width: 44px;
  margin-top: -43px;
  height: 33px;
  background-color: #00c1f3;
  border-radius: 5px;
  cursor: pointer;
  float: right;
  margin-right: 10px;
}
header .menuline{
  border-top: 2px solid #fff;
  top: 20%;
  height: 20%;
  width: 80%;
  left: 10%;
  position: relative;
}
header h1{
  font-size: 40px;
  color: #00c1f3;
  margin-top: 2em;
}

header p{
  font-family: 'JennaSue', 'Arial', sans-serif;
  font-size: 33px;
  color: #848484;
}
.header_top{
  height: 80px;
  box-shadow: 0px 1px 10px gray;
  margin-bottom: 5px;
}
.slidercontainer{
  background-color: #f7f7f7;
}
/*home*/
.index #homeslide .prefix_5 p{
  margin-top: 50px;
}
#homeslide{
  height: 585px;
}
.slideher{
  background: url('../img/slider_haar_home.jpg') center 0px repeat;
  height: 100%;
  opacity: 1;
  position: relative;
  z-index: 0;
  margin-bottom: -585px;
  -o-transition: opacity 2s ease-in-out;
  -webkit-transition: opacity 2s ease-in-out;
  -moz-transition: opacity 2s ease-in-out;
  transition: opacity 2s ease-in-out;
}
.slidehim{
  background: url('../img/slider_hem_home.jpg') center 0px repeat;
  height: 100%;
}
.homeproduct{
  margin-top: -100px;
}
.homeproduct img{
  margin: 0 auto;
  display: block;
}
.contentervaring{
  text-align: center;
  margin-top: 70px;
}
.contentervaring .grid_6{
  margin-top: 15px;
}
.contentervaring p{
  color: #6e6e6e;
}
.index header h2{
  color: #00c1f3;
  font-size: 20px;
  text-align: center;
}
.index #man, .index #women{
  -o-transition: opacity 2s ease-in-out;
  -webkit-transition: opacity 2s ease-in-out;
  -moz-transition: opacity 2s ease-in-out;
  transition: opacity 2s ease-in-out;
}
.index header .arrow{
  background: url(../img/arrow.png) no-repeat;
  height: 66px;
  width: 22px;
  display: block;
  float: right;
  margin-top: -20px;
  margin-right: 60px;
}
.index header .container_12 .grid_3 p{
  text-align: center;
  padding: 0 5px;
  margin-top: 20px;
  margin-bottom: 50px;
  line-height: 1.4em;
}
.index .homelargeproduct p{
  font-family: 'JennaSue';
  font-size: 28px;
  width: 140px;
  display: block;
  float: left;
}
.index .homelargeproduct img:nth-child(2){
  margin-top: -370px;
  float: left;
  margin-bottom: -60px;
}
.index .homelargeproduct img:nth-child(1){
  margin-bottom: -230px;
margin-left: 150px;
}
#man, #women{
  margin-bottom: -130px;
  margin-top: 40px;
  margin-left: 70px;
  z-index: 2;
  position: relative;
}
.index .homeproduct img:nth-child(2){
  margin-left: 70px;
  z-index: 3;
  position: relative;
}
.index .homeproduct p{
  font-size: 16px;
  font-family: 'HelveticaNeueLTStd-Roman', 'arial', sans-serif;
}
.index .homelargeproduct .prijzen{
  background: url('../img/Prijzs.png') no-repeat;
  display: block;
  width: 104px;
  height: 104px;
}
#contentslide{
  height: 412px;
}
.contentslidehim{
  background: url('../img/slider_hem_content.jpg') center no-repeat;
  height: 100%;
  display: block;
}
.contentslideher{
  background: url('../img/slider_haar_content.jpg') center no-repeat;
  height: 100%;
  z-index: 0;
  position: relative;
  display: block;
  -o-transition: opacity 2s ease-in-out;
  -webkit-transition: opacity 2s ease-in-out;
  -moz-transition: opacity 2s ease-in-out;
  transition: opacity 2s ease-in-out;
  margin-bottom: -412px;
}

#kopen, #bestellen, #detail{
  border: 1px #6e6e6e solid;
  margin-bottom: 1em;
  padding: 2em;
  overflow: auto;
}
#kopen:hover, #bestellen:hover, #detail:hover{
  cursor: pointer;
}
.contact #kopeninfo, .contact #bestelleninfo, .contact #detailinfo{
 background-color: #00c1f3;
 height: 2em;
 padding-top: 1em;
 color: #fff;
 text-align: center;
 width: 300px;
 display: block;
 float: right;
 margin-top: -33px;
 border-bottom: 8px #5ca3de solid;
}
.contact #kopeninfo:hover, .contact #bestelleninfo:hover, .contact #detailinfo:hover{
 background-color: #5ca3de;
}
#contactblok{
  margin-top: 20px;
}
.contact .space{
  margin-top: 20px;
}
.contentdevider{
  height: 2px;
  width: 100%;
  background-color: #dfdfdf;
  margin-bottom: 70px;
  margin-top: 50px;
}
/*subpagina's*/
main h1{
  font-family: 'HelveticaNeueLTStd-Roman','Arial', sans-serif;
  color: #00c1f3;
  font-size: 22px;
  margin-bottom: 20px;
}
main h2{
  margin-bottom: 20px;
  color: #616161;
  font-family: 'HelveticaNeueLTStd-Roman','Arial', sans-serif;
  font-size: 20px;
}
main p em{
  color: #00c1f3;
}

.list h1{
  color: #fff;
  font-size: 20px;
  margin-bottom: 30px;
  font-weight: normal;
}
.contentslide h1{
  margin-top: 60px;
}
.list .price{
  background: url('../img/price_white.png');
  width: 104px;
  height: 104px;
  margin-left: 50px;
  margin-top: 20px;
}
.price p{
  color: #00c1f3;
  margin-top: 9px;
  margin-left: 3px;
  font-size: 19px;
}

.contact h1, .werking h2, .prijzen h2{
  margin-bottom: 4px;
}

.about main p{
  margin-bottom: 10px;
}
.about main img{
  float: right;
  margin-top: -150px;
  margin-bottom: 10px;
}
body.ervaring main .container_12:nth-child(1),
body.gebruik main .container_12:nth-child(3),
body.gebruik main .contentdevider + .container_12,
body.ervaring main .contentdevider + .container_12{
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
}
body.gebruik main .container_12 .grid_4,
body.ervaring main .container_12 .grid_4{
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
}
body.gebruik main .numbercontainer,
body.ervaring main .imagecontainer{
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
}

.faq ul li, .order ul li{
  list-style: none;
  margin-left: 0px;
}
.faq #faq_container{
  margin-bottom: 20px;
}
.faq table tr td:nth-child(2){
  padding-left: 10px;
}
.faq .active a{
  color: #6e6e6e;
}
.faq main .order{
  margin-top: 20px;
}

.gebruik .prefix_4{
  margin-top: 20px;
}
.gebruik .hair{
  width: 95px;
  height: 95px;
  background: url('../img/ingegroeide_haar.png');
  display: block;
  background-size: 95px;
  float: left;
  margin-left: 50px;
}
.gebruik .number{
  background: #00c1f3;
  width: 54px;
  padding-top: 20px;
  font-size: 40px;
  display: block;
  float: left;
  border-radius: 50px;
  padding-left: 34px;
  color: blue;
}
.gebruik .number p{
  color: #fff;
}
.prijzen main .order{
  margin-top: -100px;
}
.prijzen table tr td:nth-child(2){
  padding-left: 10px;
}
.prijstabel{
  border: #00c1f3 solid 1px;
  padding: 2em;
  overflow: visible;
}

.werking h1{
  margin-bottom: 20px;
}
.werking p, .prijzen p{
  margin-bottom: 20px;
}
.werking .list .werkingbottle{
  float: right;
  margin-top: -338px;
  margin-right: 50px;
}
.werking .list{
  overflow: visible;
  height: 230px;
}

.on{
  opacity: 1;
}
.off{
  opacity: 0;
}


.isvisible{
  display: block!important;
}
.ishidden{
  display: none!important;
}
.smallproduct{
  display: none;
}

.order form{
  margin-bottom: 30px;
}
.order ul{
  margin-bottom: 0px;
}
#boxone, #boxtwo, #boxthree{
  border: #00c1f3 1px solid;
  margin-bottom: 22px;
  padding: 2rem 3%;
}
#boxfour, #boxfive {
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: #6e6e6e;
}
#boxfour{
  border: #00c1f3 1px solid;
  border-bottom: none;
  padding: 2rem 3% 0 3%;
}
#boxfive{
  border: #00c1f3 1px solid;
  border-top: none;
  padding: 0 3% 2rem 3%;
}
#boxone .header, #boxtwo .header, #boxthree .header, #boxfour .header{
  font-size: 20px;
  font-weight: bold;
  color: #00c1f3;
  margin: 0.5rem 0;
}
#boxfive .header{
  display: block;
}
#boxone .header{
  margin-left: 3%;
}
#boxone .product_header{
  display: block;
}
#boxone .euro_prices, #boxone .product_header {
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #6e6e6e;
    width: 250px;
}
#boxone .product_header {
  padding-top: 1rem;
}
#boxone .product_description {
    font-family: Arial, sans-serif;
    font-size: 13px;
    color: #6e6e6e;
}
#boxone{
  padding: 2rem 0;
}
#boxone table{
  width: 100%;
}
#boxone .productrow_one {
    background-color: #f2f2f2;
    padding: 0.5rem 0;
}
#boxone .product_descriptions{
  width: 80%!important;
  margin-left: 15%;
  float: left;
}
#boxone .product_images{
  width: 20%!important;
  float: left;
  margin-left: -95%;
}
#boxone .product_images > div{
  width: 100%!important;
}
#boxone .product_images img{
  height: 65px;
}
#boxone .euro_prices{
  width: 30%;
  text-align: right;
  padding-right: 3%;
}
#boxtwo li label{
  width: 150px;
  text-align: right;
  float: left;
  padding-right: 10px;
}
#boxtwo input[type="text"]{
  width:100px;
}
#boxtwo select{
  width: 200px;
}
#boxtwo li:nth-last-child(2) label{
  width: 95%!important;
}
#boxthree{
  overflow: auto;
}
#boxthree img{
  float: right;
}
#boxthree label{
  display: block;
  margin-left: 40px;
  margin-top: -1rem;
}
#boxfive #orderbutton{
  background: #00c1f3;
  color: #fff;
  width: 120px;
  height: 33px;
  border: none;
  margin-top: 1rem;
  -o-transition: background-color 0.3s ease-in-out;
  -webkit-transition: background-color 0.3s ease-in-out;
  -moz-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out;
}
#boxfive #orderbutton:hover{
  background-color: #6e6e6e;
  cursor: pointer;
}
#boxfive #printbutton{
  background-color: #00c1f3;
  color: #fff;
  width: 120px;
  height: 33px;
  border: none!important;
  margin-top: 1rem;
  -o-transition: background-color 0.3s ease-in-out;
  -webkit-transition: background-color 0.3s ease-in-out;
  -moz-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out;
}
#boxfive #printbutton:hover{
  background-color: #6e6e6e;
  cursor: pointer;
}

.media main h1, .media main h2{
  margin-top: 1rem;
}

form.rushcommerce article .product_radio {
    width: 2em!important;
}

form.rushcommerce article .product_price {
    top: -2em!important;
    right: 4em;
}

form.rushcommerce .paymentselection label {
    width: 94%!important;
}

@media (max-width: 980px){
  body{
    min-width: 0;
  }
  .mediumhidden{
    display: none;
  }
  .logo img{
    margin-top: 20px;
  }
  header #navtoggle{
    display: block;
  }
  header h1{
    width: 70%;
  }
  header #nav{
    margin-top: 2em;
  }
  header nav li{
    width: 100%;
  }
  header #nav a{
    line-height: 2em;
    width: 100%;
    margin-left: 0;
    display: block;
    text-align: center;
  }
  .bottle img{
    float: none;
  }
  .list{
    text-align: center;
    background-image: none;
  }

  .contentervaring{
    padding: 0px;
  }
  .ingegroeid .list, .scheerbultjes .list, .gebruik .list, .ervaring .list{
    height: auto;
    overflow: auto;
  }
  .container_12{
    width: 100%;
  }
  .container_12 .grid_1,.container_12 .grid_2, .container_12 .grid_3, .container_12 .grid_4, .container_12 .grid_5, .container_12 .grid_6, .container_12 .grid_7, .container_12 .grid_8, .container_12 .grid_9, .container_12 .grid_10, .container_12 .grid_11, .container_12 .grid_12{
    width: 94%;
    padding: 0 3%!important;
    margin: 0;
  }
  .werking main .container_12 .grid_3{
    width: 19%;
    padding: 0 3%;
  }
  .werking main .container_12 .grid_9{
    width: 69%;
    padding: 0 3%;
  }
  .media .even p:not(.img-p), .media .odd p:not(.img-p){
    width: 100%;
  }
  .media .img-p{
    float: left;
  }
  .index .container_12 .prefix_5{
    padding: 0px;
  }
  main .order{
    margin: 0 auto;
  }
  .index .homelargeproduct{
    display: none;
  }
  .index .homefill .order{
    margin-top: 0px;
  }
  .prijzen main .order{
    margin-top: 0;
  }
  .ervaring .testimonial1, .ervaring .testimonial2, .ervaring .testimonial3, .ervaring .testimonial4{
    margin-top: 0px;
    margin-bottom: 30px;
  }
  .about main img{
    float: none;
    margin: 0 auto;
  }
  .hide{
    display: none;
  }
  .contact #kopeninfo, .contact #bestelleninfo, .contact #detailinfo{
    margin: 0 auto;
    float: none;
  }
  .ingredienten .list, .filosofie .list{
    height: auto;
    overflow: auto;
  }
  footer{
    padding: 2rem 0;
  }
  footer ul li{
    float: none;
    line-height: 1.4em;
  }
  footer ul li:nth-child(9){
    width: auto;
  }
  .prijzen table{
    margin: 0 auto;
  }
  #boxone, #boxtwo, #boxthree{
    padding: 1rem 0;
    border-left: none;
    border-right: none;
    border-bottom: none;
  }
  #boxtwo li label{
    text-align: left;
    margin-top: 0.5rem
  }
  #boxtwo li input[type="text"]{
    width: 94%;
    padding: 0.5em 3%;
    font-size: 16px;
  }
  #boxtwo li:nth-last-child(2) label{
    width: auto!important;
  }
  #boxtwo li select{
    width: 100%;
  }
  #boxthree{
    margin-left: 5px;
  }
  #boxfour, #boxfive{
    border-left: none;
    border-right: none;
  }
  #boxone .product_images{
    right: 250px;
  }
  .contentdevider{
    margin: 1rem 0;
  }
  .index .homefill .order{
    float: left;
  }
  .index footer{
    padding: 1rem 0;
  }
  .prijzen .grid_4 img{
    display: none;
  }
  
  form.rushcommerce article .product_price {
	right: 0.5em!important;
	font-size:0.8em!important;
	top:-1.4em!important;
	}
form.rushcommerce section.paymentselection h3
{
    left: 2em!important;
}
select#country { width:150px!important;}

}
@media (max-width: 690px){
  .hide{
    display: none!important;
  }
  .werking main .container_12 .grid_3,
  .werking main .container_12 .grid_9{
    width: 94%;
  }
  iframe{
    width: 100%!important;
    height: auto!important;
  }
  .logo img{
    width:70%;
    max-width: 255px;
  }
  .logo{
    float: left;
  }
  footer{
    padding: 1rem 0;
  }
  header #navtoggle{
    margin-top: 0;
  }
  header h1{
    margin-top: 1em;
    text-shadow: 2px 2px white;
    width: 100%;
  }
  header a{
    margin-left: 0;
  }
  header p br{
    display: none;
  }
  .werking .list{
    height: auto;
    padding: 1rem 0;
  }
  body.prijzen main .order{
    margin-left: -25px;
  }
  #boxone .product_images{
    display: none;
  }
  #boxone .product_descriptions{
    margin-left: 3%;
  }
  #boxthree .paylist img{
    margin-right: 20px;
  }
  #boxone .euro_prices, #boxone .product_header{
    width: auto;
  }
  #boxone .product_descriptions{
    left: 30px;
  }
  #boxone .product_images{
    display: none;
  }
  #boxtwo label{
    width: 100%;
    text-align: center;
  }
  #boxthree label{
    margin-left:30px;
  }
  #boxtwo select{
    width: 100%;
    display: block;
  }
  body.order #boxtwo li:nth-last-child(2){
    width: auto;
  }
  body.ervaring main .container_12 .grid_4{
    display: none;
  }
  main{
    padding: 1rem 0;
  }
  main .order{
    background-image: none;
    padding-left: 0;
    padding-top: 0;
    float: left!important;
  }
  .contentervaring{
    margin-top: 0;
  }
  footer ul li,
  footer ul li:nth-child(9){
    text-align: left;
    padding: 0;
  }
  .smallproduct{
    display: block;
    clear: both;
  }
}