@charset "utf-8";
/* CSS Document */

#parts
{
  width: 64.3%;
  min-height: 240px;
  float: left;
  margin-bottom: 2px;
  background-image: url(../s4s_images/BGSRood.jpg);
  background-position: top left;
  background-repeat: no-repeat;
}

#parts h1
{
  width: 90%;
  margin-left: 5%;
  margin-top: 10px;
  color: #fff;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 24px;
  text-align: center;
  text-transform: uppercase;
}

.part
{
  width: 24.796%;
  min-height: 300px;
  float: left;
  margin-bottom: 2px;
  margin-right: 0.204%;
  background-image: url(../s4s_images/BGSZwart.jpg);
  background-position: center center;
  background-repeat: no-repeat;
}

.objectHomeContainer
{
  width: 88%;
  margin-left: 6%;
  float: left;
  margin-top: 15px;
  text-align: center;
}

.objectHomeContainer h3
{
  margin-top: 10px;
  color: #d11311;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

}

.objectHomeContainer p
{
  color: #fff;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

}

.objectHomeContainer img
{
  max-width: 100%;
  max-height: 127px;
  border: #FFFFFF solid 2px;
}

.red
{
  width: 100%;
  min-height: 26px;
  padding-top: 4px;
  background-color: #d11311;
  margin-top: 15px;
}

.red a
{
  color: #fff;
  text-decoration: none;
  display: block;
  min-height: 26px;
  width: 100%;
}

.grey
{
  width: auto;
  min-height: 24px;
  padding-top: 5px;
  padding-left: 10px;
  padding-right: 5px;
  background-color: #1e1e1e;
  margin-top: 3px;
  margin-bottom: 3px;
  margin-right: 3px;
  text-align: center;
  float: right;
}

.grey a
{
  color: #fff;
  text-decoration: none;
  min-height: 26px;
  width: 120px;
}



/* webshop pagina */




#content
{
  width: 100%;
  max-width: 980px;
  min-height: 500px;
  float: left;
  background-color: #fff;
}

#verfijnen
{
  width: 22%;
  padding-left: 0.5%;
  padding-right: 0.5%;
  min-height: 1008px;
  float: left;
  background-image: url(../s4s_images/BGSZwart.jpg);
  background-position: top center;
  background-repeat: repeat-y;
  color: #fff;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  text-align: left;
}

#verfijnen h2
{
  width: 90%;
  margin-left: 5%;
  margin-top: 10px;
  margin-bottom: 10px;
  color: #d11311;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 24px;
  text-align: center;
  text-transform: uppercase;
}

#filler
{
  width: 35.5%;
  min-height: 240px;
  float: left;
  margin-bottom: 2px;
  margin-right: 0.2%;
  background-image: url(../s4s_images/fotoVervolg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
}

.parts
{
  width: 76.7%;
  min-height: 240px;
  float: right;
  margin-left: 2px;
}

.buttonbar
{
  width: 100%;
  min-height: 30px;
  float: right;
  margin-bottom: 2px;
  background-image: url(../s4s_images/BGSRood.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  color: #fff;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  text-align: right;
}

.pages
{
  width: 76.7%;
  min-height: 30px;
  float: right;;
  margin-left: 2px;
  margin-bottom: 2px;
  background-image: url(../s4s_images/BGSRood.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  color: #fff;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  text-align: right;
}

.pages a
{
  text-decoration: none;
  margin-right: 5px;
}

.pages a: hover
{
  color: #fff;
  text-decoration: underline;
}

/* object pagina */

#crumbs
{
  width: 100%;
  min-height: 25px;
  text-align: left;
  color: #d11311;
}

#crumbs a
{
  color: #d11311;
}

#crumbs a: hover
{
  text-decoration: none;
}

#product
{
  width: 100%;
  min-height: 500px;
  background-image: url(../s4s_images/BGSZwart.jpg);
  background-position: center top;
  background-repeat: repeat;
  float: left;
  margin-bottom: 2px;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  text-align: left;
  color: #fff;
}

#productFotos
{
  width: 46%;
  min-height: 350px;
  margin-top: 25px;
  margin-bottom: 25px;
  margin-left: 2%;
  margin-right: 2%;
  float: left;
}

#productFotos img
{
    max-width: 100%;
    max-height: 100%;
}

#productFotos .thumb
{
  border: none;
  width: 110px;
  height: 85px;
  margin-right: 5px;
}

#productInfo
{
  width: 46%;
  min-height: 350px;
  margin-top: 25px;
  margin-bottom: 25px;
  margin-left: 2%;
  margin-right: 2%;
  float: right;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-size: 16px;

}

#productInfo h1
{
  margin-bottom: 10px;
}

#productInfo h2
{
  margin-top: 20px;
}

.objectCategorie
{
  font-weight: bold;
  width: 40%;
}

#actions
{
  width: 96%;
  min-height: 41px;
  margin-left: 2%;
  float: left;
}

#actions .red
{
  max-width: 214px;
  min-height: 26px;
  padding-top: 4px;
  background-color: #d11311;
  margin-top: 15px;
  margin-bottom: 15px;
  margin-right: 20px;
  float: left;
  text-align: center;
}

#actions .red a
{
  color: #fff;
  text-decoration: none;
  display: block;
  min-height: 26px;
  width: 100%;
  cursor: pointer;
}


/* aanpassingen webshop pagina's */



.formRow
{
  float: left;
  width: 100%;
}

.labelZoeken
{
  width: 20%;
  padding-left: 3%;
  padding-right: 2%;
  display: inline-block;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #fff;
}

.selectZoeken
{
  width: 65%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: none;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.p_ssyskey_mke
{
  width: 65%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: none;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.p_ssyskey_mdl
{
  width: 65%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: none;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.p_ssyskey_odd
{
  width: 65%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: none;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

#P_SNUMMER_VRD
{
  width: 65%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: none;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.grijs
{
  width: 40%;
  min-height: 25px;
  margin-top: 15px;
  margin-left: 30%;
  margin-right: 30%;
  float: left;
  color: white;
  background: #1e1e1e;
  border: none;
  }

#priceRequest
{
  width: 100%;
  float: left;
}

#priceRequest p
{
  color: #1e1e1e;
  margin-bottom: 15px;
  margin-left: 3%;
  margin-right: 2%;
}

#priceRequest h1
{
  color: #d11311;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  text-transform: uppercase;
  margin-top: 15px;
  margin-bottom: 10px;
  margin-left: 3%;
  margin-right: 2%;
}

.labelAanvraag
{
  width: 20%;
  padding-left: 3%;
  padding-right: 2%;
  display: inline-block;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #1e1e1e;
}

.selectAanvraag
{
  width: 70%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: solid 1px #1e1e1e;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.selectAanvraagHalf1
{
  width: 34%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  margin-right: 1%;
  border: solid 1px #1e1e1e;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.selectAanvraagHalf2
{
  width: 34%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: solid 1px #1e1e1e;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.selectAanvraagHoog
{
  width: 70%;
  padding-left: 2%;
  padding-right: 3%;
  vertical-align: bottom;
  margin-top: 5px;
  border: solid 1px #1e1e1e;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

#tekens
{
  padding-right: 3%;
  margin-top: 5px;
  margin-bottom: 15px;
  color: #1e1e1e;
  margin-left: 25%;
}

#tekensSelect
{
  width: 20%;
  padding-left: 2%;
  padding-right: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border:  solid 1px #1e1e1e;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.knopAanvraag
{
  width: 25%;
  max-width: 250px;
  min-height: 25px;
  margin-top: 15px;
  float: left;
  color: white;
  background: #1e1e1e;
  border: none;
  margin-left: 3%;
}

.cartTable
{
  width: 98%;
  border: none;
  padding: 0px;
  border-spacing: 0;
  border-collapse: collapse;
}

#upperLeft
{
  width: 95%;
  margin-left: 2.5%;
  margin-right: 2.5%;
  float: left;
  border: none;
}

#upperRight
{
  width: 95%;
  margin-left: 2.5%;
  margin-right: 2.5%;
  float: left;
  border: none;
}

#lowerLeft
{
  width: 95%;
  margin-left: 2.5%;
  margin-right: 2.5%;
  float: left;
  border: none;
}

#lowerRight
{
  width: 95%;
  margin-left: 2.5%;
  margin-right: 2.5%;
  float: left;
  border: none;
}

.accountH
{
  color: #d11311;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  text-transform: uppercase;
  margin-top: 15px;
  margin-bottom: 10px;
}

.labelGroep
{
  width: 20%;
  min-width: 100px;
  margin-left: 5%;
  display: inline-block;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #1e1e1e;
}

.labelOdrText
{
  width: 450px;
  min-width: 450px;
  margin-left: 5%;
  display: inline-block;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #1e1e1e;
}

.labelOdrPrice
{
  width: 150px;
  min-width: 150px;
  margin-left: 5%;
  display: inline-block;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #1e1e1e;
  text-align: right;
}

.labelInformatie
{
  width: 65%;
  padding-left: 3%;
  padding-right: 2%;
  margin-right;
  display: inline-block;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  letter-spacing: 0.5px;
  color: #1e1e1e;
}

.labelCheckbox
{
  width: 80%;
  padding-left: 3%;
  padding-right: 2%;
  margin-right;
  display: inline-block;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 0.5px;
  color: #1e1e1e;
}

.accountField
{
  width: 30%;
  padding-left: 2%;
  padding-right: 3%;
  margin-left: 3%;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: solid 1px #1e1e1e;
  text-transform: uppercase;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.accountLink
{
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #d11311;
  text-decoration: underline;
  margin-left: 6%;
}

.cartH
{
  color: #d11311;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-size: 18px;
  text-transform: uppercase;
  margin-top: 15px;
  margin-bottom: 10px;
  padding-left: 20px;
}

#top
{
  height: 30px;
}

.cartCategorie
{
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #1e1e1e;
  padding-left: 20px;
}

.rowPart
{
  outline: 1px solid #1e1e1e;
  height: 50px;
}

.rowPart p
{
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #1e1e1e;
  margin-bottom: 15px;
  margin-left: 20px;
  vertical-align: top;
}

.cartPrice
{
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #1e1e1e;
  margin-bottom: 15px;
  padding-left: 20px;
  vertical-align: top;
}

.knopCartGrijs
{
  width: calc(100% - 5px);
  min-height: 25px;
  margin-top: 15px;
  float: left;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: white;
  background: #1e1e1e;
  border: none;
  }

.knopCartRood
{
  width: 200px;
  min-height: 22px;
  padding-top: 3px;
  margin-top: 15px;
  margin-right: 3px;
  float: right;
  text-align: center;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: white;
  background: #d11311;
  border: none;
}

.cartSubtotaal
{
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #1e1e1e;
}

#subtotaalRow
{
  height: 50px;
}


fieldset
{
  border: none;
}

.orderTable
{
  color: #000000;
  vertical-align: top;
}

.orderTable tr
{
  color: #000000;
  vertical-align: top;
}

.orderTable td
{
  color: #000000;
  vertical-align: top;
  font-size: 12px;
}

.orderCheck
{
  color: #000000;
}

.orderText
{
  color: #000000;
  width: 350px;
}

.orderBlok
{
  width: 850px;
  padding-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 10px;
  float: left;
  border: solid 1px #1e1e1e;
}

.orderBlok h3
{
  color: #000000;
}

.orderBlok .labelGroep
{
  min-width: 580px;
}

h3
{
  color: #000000;
}

.registerBlok
{
  width: 47%;
  padding-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 10px;
  float: left;
  border: solid 1px #1e1e1e;
}

.registerBlok h3
{
  color: #000000;
}

.registerBlok .labelGroep
{
  min-width: 180px;
}

.registerField
{
  width: 50%;
  padding-left: 5px;
  padding-right: 5px;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: solid 1px #1e1e1e;
/*  text-transform: uppercase; */
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}
.registerField.error
{
  background-color: #fdd;
}
.registerField[readonly]{
  background-color: #ddd;
}
.p_ssyskey_ctr
{
  width: 52.7%;
  padding-left: 5px;
  padding-right: 5px;
  height: 25px;
  vertical-align: bottom;
  margin-top: 5px;
  border: solid 1px #1e1e1e;
/*  text-transform: uppercase; */
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.knopRegistrerenRood
{
  width: 30%;
  max-width: 300px;
  min-height: 22px;
  padding-top: 3px;
  margin-left: 5%;
  margin-top: 15px;
  float: left;
  text-align: center;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: white;
  background: #d11311;
  border: none;
  text-decoration: none;
}

.knopRegistrerenRood a
{
  text-decoration: none;
}

a .button .knopRegistrerenRood a:hover
{
		cursor:pointer;
    text-decoration: none;
		color:#133759;
}

.option
{
  background-image: url(../s4s_images/kruis.jpg);
  background-position: right;
  background-repeat: no-repeat;
  margin-top: 25px;
  margin-bottom: 25px;
  text-transform: uppercase;
  font-size: 18px;
  text-decoration: underline;
}

.dropdown
{
    margin-left: 3%;
}

.dropdown ul
{
  list-style-type: none;
  padding-left: 0;
  margin-left: 0;
}

.first
{
  color: #d11311;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  text-transform: uppercase;
  margin-top: 15px;
}

.dropdown a
{
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #fff;
  text-decoration: none;
}

.dropdown a: hover
{
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #d11311;
  text-decoration: underline;
}
span.required{
  padding-left: 4px;
  font-weight: 900;
  color: #d11311;
}

.default-remarks{
  position: relative;
  padding-left: 30px;
  margin-top: 15px;
}
.default-remarks::before{
  content: '✔';
  color: green;
  font-size: 175%;
  font-weight: bold;
  position: absolute;
  width: 26px;
  height: 26px;
  left: 0;
  top: -12px;
}

@media screen and (max-width: 640px){
  #parts{
    width: 100%;
  }
  #filler{
    display: none;
  }
  #productFotos,
  #productInfo{
    width: 96%;
    min-height: 0;
    margin: 2%;
  }
  #subMenuContainer{
    display: none;
  }
  #content div.registerBlok{
    width: 100%;
    padding: 0;
    border: none;
  }
  #verfijnen,
  div.parts,
  div.pages{
    width: 100%;
    min-height: 0;
  }
  #verfijnen div.dropdown{
    float: left;
    width: 22%;
  }
  .registerField{
    width: calc(100% - 25px);
  }
  .labelGroep{
    margin-left: 0;
  }
  #actions .red{
    width: calc(50% - 20px);
    margin-top: 0;
  }
  table.cartTable td.pic img{
    max-width: 20vw;
  }
  table.cartTable td.cartPrice,
  table.cartTable td.cartPrice .cartH,
  table.cartTable td.cartPrice p{
    padding-left: 5px;
    margin: 5px 0;
    font-size: 13px;
  }
  .grijs{
    width: 80%;
    margin: 5px 10%;
  }
  .knopCartGrijs{
    margin: 5px 0;
    min-height: 34px;
  }
}
@media screen and (max-width: 480px){
  .part{
    width: 49.796%;
  }
  #verfijnen div.dropdown{
    width: 47%;
  }
}
@media screen and (max-width: 400px){
  .labelZoeken{
    font-size: 12px;
  }
}