@charset "utf-8";

/* -- INLOGFORM ------------------------------------ */

#sidebarinlogform form
{
  margin: 5px 0px 0px 0px;
}

#sidebarinlogform .label
{
  display: block;
  font-size: 11px;
  padding: 4px 0px 2px 0px;
}

#sidebarinlogform .inputfield
{
  font-size: 11px;
  border: 1px solid black;
  margin: 0px;
  padding: 2px 0px 2px 0px;
  width: 178px;
}

#sidebarinlogform .button
{
/*  font-size: 11px; */
  border: 1px solid black;
  padding: 0px;
  margin: 5px 0px ;
  width: 180px;
}

#sidebarinlogform P
{
  font-size: 10px;
  text-align: right;
  padding: 0px;
  margin: 5px 0px 0px 0px;
}

#sidebarinlogform P A
{
  color: #E7368E;
  text-decoration: none;
}

#sidebarinlogform P A:hover
{
  text-decoration: underline;
}


/* -- INHOUD --------------------------------------- */

.inhoud {
        min-height: 300px;       
        font-size: 12px;
        margin-bottom: 25px;
}

.inhoud HR {
        display:none;
}

.inhoud H4 {
   color: #E7368E;
   margin: 0px 0px 5px 0px;
   font-size: 20px;
   font-weight: normal;
}

.inhoud P {
  line-height: 17px;
}


.inhoud H5 {
   font-size: 16px;
   font-weight: bold;
   margin: 0px 0px 5px 0px;
  color: #000000;
}

.inhoud H6 {
   font-size: 14px;
   font-weight: bold;
   margin: 0px 0px 5px 0px;
  color: #000000;
}

.inhoud EM
{
  font-style: normal;
  font-weight: bold;
}

.inhoud H5 A {
  color: black;
  text-decoration:none;
}

.inhoud H5 A:hover {
  text-decoration:none;
}

.inhoud A {
  color: #E7368E;
}

.inhoud A.pdflink
{
  padding: 3px 0px 3px 25px;
  line-height: 22px;
  background: transparent url(../images/pdf-logo.gif) no-repeat center left;
}


/* -- LENS --------------------------------------- */




.product {
  margin-top: 30px;
  margin-bottom: 40px;
}


.product .foto
{
  width: 165px;
  float: right;
  margin: 10px 0px 20px 20px;
  text-align: center;
}

.product .pijlke
{
  float: right;
  width: 165px;
  text-align: center;
  margin-bottom: 3px;
}

.product .meerinfo
{
  float: left;
  background: #000000;
  color: #ffffff;
  width: 145px;
    font: 12px Arial, Helvetica, sans-serif;
    text-align: center;
    font-weight: bold;
    margin-bottom: 5px;
    padding: 5px 10px 5px 10px;
}

.product .meerinfo A
{
  color: #ffffff;
  text-decoration: none;
}

.product .normaleprijs
{
  float: left;
  background: #ffffff;
  color: #000000;
  width: 145px;
    font: 12px Arial, Helvetica, sans-serif;
    text-align: center;
    font-weight: bold;
    margin-bottom: 5px;
    padding: 5px 10px 5px 10px;
}

.product .normaleprijs A
{
  color: #000000;
  text-decoration: none;
}

.product .internetprijs
{
  float: left;
  background: #e7368e;
  width: 145px;
    font: 12px Arial, Helvetica, sans-serif;
    text-align: center;
    font-weight: bold;
    margin-bottom: 5px;
    padding: 5px 10px 5px 10px;
  color: #FFFFFF;
  }

.product .internetprijs A
{
  color: #FFFFFF;
  text-decoration: none;
}

#producten H4
{
  margin-bottom: 20px;
}

.categorie {
  padding: 15px 200px 15px 18px;
  margin-bottom: 20px;
  color: black;
  width: 275px;
  height: 70px;
  overflow: hidden;
}

.categorie P
{
  margin-top: 5px;
  line-height: 15px;
}

.categorie A, .categorie H5 A 
{
  color: black;
  text-decoration: none;
}

.categorie A:hover, .categorie H5 A:hover 
{
  text-decoration: none;
}

.categorie#contactlenzen
{
  background: url("../images/inhoud/bg-contactlenzen.jpg") no-repeat left top;
}

.categorie#contactlensforlife
{
  background: url("../images/inhoud/bg-cfl.jpg") no-repeat left top;
}

.categorie#vloeistoffen
{
  background: url("../images/inhoud/bg-vloeistoffen.jpg") no-repeat left top;
}

.categorie#eyecare
{
  background: url("../images/inhoud/bg-eyecare.jpg") no-repeat left top;
}

.categorie.contactlenzen, .categorie.vloeistoffen
{
  padding: 15px 150px 15px 18px;
  width: 325px;
}

#producten .categorie, #producten .categorie A, #producten .categorie H5 A
{
  color: white;
}




.productdetail .prijsvak
{
  float: right;
  text-align: center;
  margin: 00px 0px 10px 10px;
}

.productdetail .prijsvak .label
{
  font: 10px Arial, Helvetica, sans-serif;
  font-weight: bold;
}

.productdetail .internetprijs
{
  color: #e7368e;
  font-size: 20px;
}

.productdetail .normaleprijs
{
  color: #000000;
  font-size: 15px;
}

.productdetail .normaleprijs .prijs
{
   text-decoration: line-through;
}

.productdetail .internetprijs .prijs
{
   font-weight: bold;
}

.productdetail .illustratie
{
  float: right;
  margin: 10px 0px 15px 15px;
}

.productdetail .merklogo
{
  margin: 0px 10px 10px 0px;
}

.productdetail .tabel
{
  border: none;
  padding: 0px;
  border-spacing: 5px;
  width:100%;
  margin: 0px 0px 30px 0px;
}


.productdetail .tabel td
{
  padding: 10px 3px;
  font-size: 11px;
  border: 1px solid #d0d0d0;
  color: #000000;
  font-weight: normal;
  text-align: center;
  width:25%;
}

.productdetail .tabel .label
{
  color:#e7368e;
  margin: 0px 0px 5px 0px;
}

.productdetail #totaal
{ 
  width: 210px;
  padding: 6px 16px 6px 14px;
  font-weight: bold;
  margin-bottom: 10px;
  border: 1px solid #000000;
  float: left;
  min-height: 15px;
}

.productdetail #totaal label
{ 
  padding: 0px;
  float: left;
}

.productdetail #totaal #totaalbedrag
{ 
  display: block;
  padding: 0px;
  float: right;
}

.productdetail #verstuurknop
{
  float: right;
  width: 242px;
  height: 28px;
}

/* -- ORDERFORM------------------------------------ */

.bestelformulier 
{
  float: left;
  width: 220px;
  margin: 0px 0px 0px 0px;
}

.bestelformulier .fieldlabel
{
  padding:4px;
  margin: 0px 5px 3px 0px; 
  width: 100px; 
  float: left;
}

.bestelformulier .labelboxlabel label
{
  display: inline;
} 

.bestelformulier .value
{
  line-height: 23px;
  font-size: 11px;
}

.bestelformulier.disabled .value
{
  line-height: 23px;
  font-size: 11px;
  color: #999999;
}

.bestelformulier select
{
  font-size: 11px;
  color: black;
  background-color: white;
  border: 1px solid #d0d0d0;
  padding: 0px;
  margin: 0px;
  width: 100px;
}

.bestelformulier.disabled select
{
  color: #999999;
}

.bestelformulier option.voorkeur
{
  
}

.bestelformulier.disabled label
{
  color: #999999;
}

.bestelformulier#lensrechts
{
  margin-right: 10px;
}

/* -- Groot WINKELMANDJE ------------------------------------ */


#grootwinkelmandje 
{
  margin: 0px;
}

#grootwinkelmandje H5
{
  margin-top: 20px;
}

#grootwinkelmandje .labelbox
{
  margin-top: 20px;
}

#grootwinkelmandje table
{
  width: 100%;
}

#grootwinkelmandje td, #grootwinkelmandje th
{
/*  border: 1px solid black;*/
  vertical-align: top;
  text-align: center;
  padding: 0px 5px 0px 5px;
  margin: 0px;
}

#grootwinkelmandje th
{
  font-size: 10px;
  padding-bottom: 10px;
}

#grootwinkelmandje td
{
  padding-bottom: 20px;
}

#grootwinkelmandje .titel
{
  font-size: 14px;
  margin-bottom: 5px;
  font-weight: bold;
}

#grootwinkelmandje .titel A
{
  color: black;
}

#grootwinkelmandje .titel A:hover
{
  text-decoration: none;
}



#grootwinkelmandje .producttotaal, #grootwinkelmandje .winkelmandjetotaal
{ 
  font-size: 14px;
  font-weight: bold;
}

#grootwinkelmandje .aantalkolom
{
  min-width: 100px;
  padding-left: 0px;
}

#grootwinkelmandje .aantalkolom .illustratie
{
  margin-top: 20px;
}


#grootwinkelmandje .productkolom
{
  text-align: left;
}

#grootwinkelmandje .prijskolom
{
  text-align: right;
}

#grootwinkelmandje .verwijderkolom
{
  padding-right: 0px;
}

#grootwinkelmandje td.aantalkolom
{
  font-size: 14px;
  font-weight: bold;
}

#grootwinkelmandje td.productkolom
{
  font-size: 10px;
}

#grootwinkelmandje td.productkolom .subtitel
{
  margin-bottom: 5px;
  font-size: 12px;
  font-weight: bold;
  font-style: italic;
}

#grootwinkelmandje td.productkolom .label
{
  float: left;
  font-size: 12px;
  padding-right: 10px;
}

#grootwinkelmandje td.prijskolom .producttotaal
{ 
  margin-bottom: 10px; 
}


#grootwinkelmandje .subtotaal
{
  text-align: left;
  border-top: 1px solid #d0d0d0;
  padding-top: 20px;
}

#grootwinkelmandje .subtotaal.bedrag
{
  text-align: right;
}

#grootwinkelmandje .winkelmandjetotaal
{
  text-align: left;
  border-top: 1px solid #d0d0d0;
  padding-top: 20px;
}

#grootwinkelmandje .winkelmandjetotaal.bedrag
{
  text-align: right;
}

#grootwinkelmandje .korting
{
  text-align: left;
  color: #0292DB;
  padding-bottom: 10px;
}

#grootwinkelmandje .korting.bedrag
{
  text-align: right;
  vertical-align: top;
  font-weight: bold;
}


#leveringenbetaling, #extramededeling
{
  margin-top: 20px;
}


#leveringenbetaling 
{
  line-height: 20px;
}

#extramededeling 
{
  margin-bottom: 5px;
}

#extramededeling #extrainfoveld
{
  width: 470px;
  height: 100px;
  font: 12px Arial, Helvetica, sans-serif;
  border: 1px solid #d0d0d0;
  margin: 0px;
  padding: 2px 0px 2px 0px;
}

#bestelbutton
{
  float: right;
}

.bestelstappen
{ 
  float:left;
  margin: 15px 0px 15px 0px;
  background-color: black;
  width:100%
}

.bestelstappen .stap
{
  margin: 0px;
  float: left;
  color: white;
  font-size: 10px;
  line-height:21px;
  padding:5px 5px 5px 12px;
  height: 21px;
/*  width: 142px; */
}

.bestelstappen .nextstep
{
  cursor:pointer;
}

.bestelstappen .pijl
{
  margin: 0px;
  float: left;
  height: 31px;
  width: 18px;
}

.bestelstappen .actief
{
  background-color: #e7368e;
}

.bestelstappen.laatsteactief
{
  background-color: #e7368e;
}

.bestelstappen .nonactief
{
  background-color: black;
}

.bestelstappen .actiefnaarnonactief
{
  background-color: #e7368e;
}

.bestelstappen .nonactiefnaarnonactief
{
  background-color: black;
}

.bestelstappen .nonactiefnaaractief
{
  background-color: black;
}

.bestelknop
{
  width: 240px;
  margin-top: 15px;
}

.bestelknop.links
{
  float: left;
}

.bestelknop.rechts
{
  float: right;
}

/* -- laatstebestelling ------------------------------------ */

.bestelling
{
}

.bestelling .productkolom
{
}


.bestelling .productkolom .titel
{
  font-size: 14px;
  margin-bottom: 5px;
  font-weight: bold;
}

.bestelling .productkolom .titel A
{
  color: black;
}

.bestelling .productkolom .titel A:hover
{
  text-decoration: none;
}

.bestelling .productkolom .subtitel
{
  margin-bottom: 5px;
  font-size: 12px;
  font-weight: bold;
  font-style: italic;
}

.bestelling .productkolom .label
{
  float: left;
  font-size: 12px;
  padding-right: 10px;
}

.bestelling .productinformatie
{
  margin-top: 10px;
}

.bestelling .knoppen
{
  margin-top: 10px;
  margin-bottom: 25px;
}

.bestelling .foto
{
  width: 100px;
  float: right;
  text-align: center;
  margin-bottom: 5px;
}

.bestelling .voegtoeknop
{
  width:190px;
}

.bestelling .voegtoeknop A
{
  color: #ffffff;
}

.bestelling .prijs
{
  width: 80px;
  float: right;
  text-align: center;
  background: #e7368e;
  font: 12px Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  font-weight: bold;
  padding: 5px 10px 5px 10px;
}

#laatstebestelling
{
  width: 295px; 
  float:left;

}

#allebestellingen
{
  margin-top: 20px;
}


/* -- home ---------------------------------------- */

#nieuws
{
  width: 100%;
  margin-top: 15px;
  margin-bottom: 15px;
}

#nieuws H4
{

  font-size: 14px;
  font-weight: bold;
  color: black;
}

#nieuws .nieuwsitem
{
  border: 1px solid #d0d0d0;
  padding: 15px 15px 10px 15px; 
  margin-bottom: 15px;
}


#nieuws .nieuwsitem P
{
  font-size: 11px;  
  line-height: 15px;
  text-align: justify;
}

#nieuws .nieuwsitem .illustratie
{
  margin-left: 20px;
  float: right;
}

#nieuws .nieuwsitem H5
{
  font-size: 14px;
  font-weight: bold;
  color: #e7368e;
}


#contactlensforlifereclame
{
  float: left;
  margin-bottom: 25px;
}

/* -- ons advies ------------------------------------ */


#onsadvies
{
  float: right;
  width: 150px;
}

#onsadvies .advieslijn
{
  padding: 5px;
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}

#onsadvies .advieslijn A
{
  color: black;
  text-decoration: none;
}

#onsadvies .advieslijn .illustratie
{
  margin-bottom: 20px;
}

/* -- MIJN GEGEVENS ------------------------------------ */


/*
.mijngegevensformulier label
{
  display: block;
  width: 130px;
  background: #bfbfbf;
  padding:4px;
  float: left;
  margin: 0px 5px 3px 0px;
}

.mijngegevensformulier .field
{
  padding:4px;
  min-height: 15px;
}

.mijngegevensformulier .field:hover
{
  cursor: text;
}
*/

#mijngegevensformulier input
{
  margin: 0px 0px 0px 0px;
  
}

#mijngegevensformulier label
{
  height: 16px;
}

#mijngegevensformulier .field
{
  height: 22px;
  line-height: 22px;
}


#mijngegevensformulier .oogprofiel
{
  width: 220px;
}

#mijngegevensformulier .oogprofiel#oogprofielrechts
{
  float: left;
}

#mijngegevensformulier .oogprofiel#oogprofiellinks
{
  float: right;
}

#mijngegevensformulier .oogprofiel input
{
  width: 100px;
}

/* -- Bestelbon ------------------------------------ */


.bestelbon
{
  border: 1px solid black;
  padding: 15px;
  min-height: 400px;
  margin-top: 20px;
  margin-bottom: 5px;
}

.bestelbon #bestelbonlogo
{
  float: right;
}

.bestelbon .bestelbonheader H4
{
  font-size: 16px;
  font-weight: bold;
}

.bestelbon .bestelbonheader P
{
  font-size: 11px;
  line-height: 14px;
}

/*.bestelbon .bestelbonheader P EM
{
  font-style: normal;
  font-weight: normal;
  font-size: 11px;
  color: #672E4A;
}*/

.bestelbon .bestelbonheader #adres1
{
  float:left;
  width: 49%;
}

.bestelbon .bestelbonheader #adres2
{
  float:right;
  text-align:right;
}

.bestelbon #tabel
{
  width: 100%;
  height:100%;
  padding: 0px;
  border-spacing: 0px;
  margin: 0px 0px 20px 0px;  
}

.bestelbon #tabel #headerrij th
{
  border-bottom: 1px solid black;
  text-align: left;
  padding: 0px 10px 5px 10px;
}

.bestelbon #tabel #headerrij th#prijs
{
  text-align: right;
}

.bestelbon #tabel #headerrij #aantal
{
  width: 10%;
}

.bestelbon #tabel #headerrij #artikel
{
  width: 60%;
}

.bestelbon #tabel #headerrij #prijs
{
  width: 20%;
}
.bestelbon #tabel td
{
  padding: 10px;
    vertical-align: top;

}

.bestelbon #tabel .aantal, .bestelbon #tabel .artikel
{
  border-right: 1px solid black;
}

.bestelbon #tabel .aantal 
{
  font-size: 12px;
  
}

.bestelbon #tabel .artikel 
{
  font-size: 10px;
}

.bestelbon #tabel .artikel .titel
{
  margin-bottom: 5px;
  color: #000000;
  font-size: 14px;
  font-weight: bold;
  font-style: normal;
}

.bestelbon #tabel .artikel .titel A
{
  color: #000000;
}


.bestelbon #tabel .artikel  .subtitel
{
  margin-bottom: 5px;
  font-size: 12px;
  font-weight: bold;
  font-style: italic;
}

.bestelbon #tabel .artikel  .label
{
  float: left;
  font-size: 12px;
  padding-right: 10px;
}


.bestelbon #tabel .prijs .producttotaal
{
  text-align: right;
  font-size: 14px;
  font-weight: bold;
}

.bestelbon #tabel .prijs.tussentotaal
{
  border-top: 1px solid black;
}

.bestelbon #tabel .prijs.tussentotaal .producttotaal
{
  font-size: 14px;
  font-weight: bold;
}

.bestelbon #tabel .artikel#subtotaallabel, .bestelbon #tabel .artikel#totaallabel
{
  font-size: 14px;
  font-weight: bold;
  text-align: right;
}

.bestelbon #tabel .cfl, .bestelbon #tabel .titel.cfl
{
  color:#0093DB
}


/* -- overschrijvingsformulier ----------------------- */

#overschrijvingsformulier
{
  background: url("../images/inhoud/overschrijving.gif") white no-repeat left top;
  position: relative;
  width: 504px;
  height: 328px;
  margin-bottom: 20px;
  border: 1px solid #d0d0d0;
  font-size: 12px;
}

#overschrijvingsformulier #bedrag
{
  padding-top: 2px;
  top: 105px;
  left: 257px;
  width: 181px;
  height: 17px;
  text-align: right;
  line-height: 17px;
}

#overschrijvingsformulier #opdrachtgever1
{
  top: 163px;
  left: 21px;
  width: 219px;
  height: 15px;
}

#overschrijvingsformulier #opdrachtgever2
{
  top: 192px;
  left: 21px;
  width: 219px;
  height: 15px;
}

#overschrijvingsformulier #opdrachtgever3
{
  top: 221px;
  left: 21px;
  width: 219px;
  height: 15px;
}

#overschrijvingsformulier #mededeling
{
  top: 250px;
  left: 21px;
  width: 455px;
  height: 17px;
}

.overschrijvingsformulierveld
{
  position: absolute;
  padding: 3px 4px;
  font-weight: bold;
  text-align: left;
}



/* -- mijnbestelling --------------------------------- */

#mijnbestelling .labelbox
{
  margin-top: 30px;
}


/* -- messagebox --------------------------------- */

.messagebox
{
  margin-bottom: 10px;
}

.messagebox .top, .messagebox .bottom
{
  margin: 0px;
  padding: 0px;
  height: 6px;
}

.messagebox .topright, .messagebox .bottomright
{
  float:right;
  width: 6px;
  height: 6px;
}

.messagebox .content
{ 
  padding: 9px 15px;
}


.messagebox.black .top
{
  background: url("../images/inhoud/hoek-links-boven-zwart.gif") black no-repeat left top;
}

.messagebox.black .topright
{
  background: url("../images/inhoud/hoek-rechts-boven-zwart.gif") black no-repeat right top;
}

.messagebox.black .bottom
{
  background: url("../images/inhoud/hoek-links-onder-zwart.gif") black no-repeat left bottom;
}

.messagebox.black .bottomright
{
  background: url("../images/inhoud/hoek-rechts-onder-zwart.gif") black no-repeat right bottom;
}

.messagebox.black .content
{
  background-color: black;
  color: white;
}

.messagebox.magenta .top
{
  background: url("../images/inhoud/hoek-links-boven-magenta.gif") #e7368e no-repeat left top;
}

.messagebox.magenta .topright
{
  background: url("../images/inhoud/hoek-rechts-boven-magenta.gif") #e7368e no-repeat right top;
}

.messagebox.magenta .bottom
{
  background: url("../images/inhoud/hoek-links-onder-magenta.gif") #e7368e no-repeat left bottom;
}

.messagebox.magenta .bottomright
{
  background: url("../images/inhoud/hoek-rechts-onder-magenta.gif") #e7368e no-repeat right bottom;
}

.messagebox.magenta .content
{
  background-color: #e7368e;
  color: white;
}

/* -- Registreren  ------------------------------------ */

#messageboxes
{ 
  float:right;
}

#messageboxemail
{ 
  width: 250px;
  line-height: 16px;
}

#messageboxprivacy
{ 
  width: 250px;
  line-height: 16px;
}

#sterretje
{
  width: 220px;
  padding: 15px;
}

.formulier
{
  margin: 20px 0px;
}

.formulier H5
{
  margin-bottom: 20px;
}

.formulier label
{
  float:left;
  width: 115px;
  display: block;
  font-size: 11px;
  padding: 4px 0px 2px 0px;
}

.formulier input
{
  font-size: 11px;
  border: 1px solid black;
  margin: 3px 0px;
  padding: 2px 0px 2px 0px;
  width: 300px;
}

.formulier select
{
  font-size: 11px;
  color: black;
  background-color: white;
  border: 1px solid #d0d0d0;
  padding: 0px;
  margin: 0px;
  width: 100px;
}


#registratieforms
{
  float: left;
  width:420px;
}

#registratieforms #verstuurknop
{
  margin-top: 10px;
}


/* -- Contactformulier ------------------------------------ */


#contactformulier #field_bericht
{
  width: 375px;
  height: 100px;
  font: 12px Arial, Helvetica, sans-serif;
  border: 1px solid black;
  margin: 4px 0px 10px 0px;
  padding: 2px 0px 2px 0px;
}

#contactformulier label
{
  width: 85px;
}

#contactformulier input
{
  width: 375px;
}

#contactformulier #verstuurknop
{
  margin-left: 85px;
}


#wachtwoordvergetenformulier #verstuurknop
{
  margin-top: 20px;
}

/* -- Labelbox ------------------------------------ */

.labelbox
{
  position: relative;
  border: 1px solid #d0d0d0;
  padding: 15px 10px 10px 10px;
  margin: 10px 0px 5px 0px;
  }


.labelbox .labelboxlabel
{
  position: absolute;
  display: inline;
  background-color: white;
  font-weight: bold;
  top: -11px;
  left: 8px;
  line-height: 20px;
  padding: 0px 5px 0px 5px;
  margin: 0px;
  
}


#cfl H4
{
  margin-bottom: 15px;
}

#cfl H5
{
  color: #E7368E;
  margin-bottom: 20px;
}

#cfl P
{
  margin-bottom: 20px;
}

.cflillustratie
{
  float:right;
  margin-left: 20px;
  margin-bottom: 20px;
}


#voorwaarden H4
{
  margin-bottom: 15px;
}

#voorwaarden H5
{
  color: #E7368E;
  margin-bottom: 20px;
}

#voorwaarden P
{
  margin-bottom: 20px;
}

