/* 20190204223105 - v2 */
.gui,
.gui-block-linklist li a {
  color: #5e6e66;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #008fc1;
}

.gui-block-inner strong {
  color: #9ea8a3;
}

.gui a {
  color: #008fc1;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #008fc1;
  box-shadow: 0 0 2px #008fc1;
}

.gui-select.gui-focus .gui-handle {
  border-color: #008fc1;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #babfbb;
}

.gui-block-title {
  color: #5e6e66;
  background-color: #ffffff;
}

.gui-content-title {
  color: #5e6e66;
}

.gui-form .gui-field .gui-description span {
  color: #5e6e66;
}

.gui-block-inner {
  background-color: #f4f4f4;
}

.gui-block-option {
  border-color: #f4f5f4;
  background-color: #fbfbfb;
}

.gui-block-option-block {
  border-color: #f4f5f4;
}

.gui-block-title strong {
  color: #5e6e66;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #dfe2e0;
}

.gui ul.gui-products li {
  border-color: #eaebea;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #eaebea;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #eaebea;
}

.gui-block-content .gui-table {
  border-color: #f4f5f4;
}

.gui-table thead tr th {
  border-color: #dfe2e0;
  background-color: #fbfbfb;
}

.gui-table tbody tr td {
  border-color: #f4f5f4;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #008fc1;
  color: #008fc1;
  background-color: #ffffff;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #008fc1;
  color: #008fc1;
  background-color: #ffffff;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #cccccc;
  border-color: #00729a;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #cccccc;
  border-color: #00729a;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #babfbb;
  background-color: #ffffff;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #babfbb;
}

.gui-number .gui-handle a {
  background-color: #ffffff;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #5e6e66;
}

.gui-progressbar {
  background-color: #008fc1;
}

/* custom */
/* variables

- line-height: 1.5
- margin-bottom: 1.5em

colors:
- blue: #008fc1
- gray: #5e6e66
- light gray: #babfbb

*/

/* ========================
1.0 BASIC
======================== */

body {
    font-size: 16px;
    line-height: 1.5;
    text-transform: none;
}

label {
  font-weight: 400;
}

main p { max-width: 48em; }

/* form */

input,
footer .block input {
  height: 2.1em;
  margin-top: 0.5em;
  padding: 0;
  text-indent: 0.67em;
  color: #575E56;
  text-transform: normal;
  line-height: 1.5;
  font-size: 16px;
  text-transform: none;
  border: 1px solid #babfbb !important;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}  

button,
.button,
footer .block button {
  height: 2.1em;
  width: auto;
  padding: 0 1em;
  margin: 0.5em 0 0 0;
  float: left !important;
  color: #008fc1;
  text-transform: none;
  letter-spacing: 0;
  font-size: 16px;
  font-weight: normal;
  background: white;
  border: 1px solid #008fc1;
    -moz-border-radius: 1.1em;
  -webkit-border-radius: 1.1em;
  -khtml-border-radius: 1.1em;
  border-radius: 1.1em;
  cursor: pointer !important;
}  

.button:hover,
.button:active,
button:hover,
footer button:hover,
button:active,
footer button:active,
footer .block button:hover,
footer .block button:active {
  color: white !important; 
  background: #008fc1 !important;
}


/* ========================
1.1 TYPOGRAFIE
======================== */

h1, h2, h3, h4, h5, h6 {
  margin: 0.67em 0 0.33em 0;
  color: #008fc1;
  font-weight: 300;
  line-height: 1.2;
  text-transform: none;
}

h1 { font-size: 36px; }
h2 { font-size: 28px; }
h3 { font-size: 21px; }
h4 { 
  font-size: 16px; 
  font-weight: 400;
}

h5 { 
  font-size: 16px; 
  font-weight: 600;
  color: #575E56;
}

h6 { 
  font-size: 16px; 
  font-weight: 300;
  color: #575E56;
  text-transform: uppercase;
}

p { margin: 0.5em 0 }

ul, ol { padding-left: 1.5em; }

h2 strong,
header strong {
  color: #008fc1;
  font-weight: 300 !important;
}

/* ========================
2.0 HEADER
======================== */


header .top { background: #e2e6e4 !important; }
header .toplinks { margin: 0; }
header ul.toplinks { 
  float: right;
  width: auto;
  text-align: right; 
}
header ul.toplinks li { background: white; }
header .toplinks li a { color: #008fc1; }
header .toplinks li a:hover,
header .toplinks li a:active { text-decoration: underline; }

.language,
.language ul { background: white !important; }
.language span { border-color: white; }

.header-main-bar { padding-top: 0.67em; }

header .minicart-button {
  float: right;
  background: #575E56;
}

header .minicart-button,
header .toplinks li a {
  font-weight: 400;
  font-size: 14px;
  text-transform: none;
}  

header .minicart-button a { 
  color: white; 
}
header .button-buy {
  line-height: 32px;
  color: white !important;
  background-color: #008fc1 !important;
}

header .minicart-button.hover a,
header .minicart-button.hover .quanti { 
  color: #008fc1; 
}

header .minicart-button .quanti {
  color: white;
  font-size: 14px;
  line-height: 1.5;
  margin-left: 1em;
}  

/* logo */

header .logo img {
  margin: 1em 0;
}

/* search */
.search {
  padding: 1em 0 3em 0;
}

.search-form .search input {
  text-transform: none;
}

.search-form .btn.search {
  color: #008fc1;
  line-height: 48px;
}

/* -navbar */

.navbar-nav > li {
  position: relative;
}

header .navbar .nav .item a { font-weight: 300; }    

header .navbar .nav .item a:hover,
header .navbar .nav .item a:active,
header .navbar .nav .item a.active {
  background-color: #008fc1;
  color: #ffffff !important;
}

/* - subnav */

header .navbar .nav .item:hover .dropdown-menu {
  border-top: 1px solid #0087b7;
  border-bottom: 1px solid #0087b7;
}

header .navbar .nav .subnav li:nth-last-child(1) {
  float: left;
}

header .navbar .nav .subnav li a {
  color: #0087b7;
  line-height: 1.5;
}

header .navbar .nav .item .subnav a:hover,
header .navbar .nav .item .subnav a:active,
header .navbar .nav .item .subnav a:hover strong,
header .navbar .nav .item .subnav a:active strong {
  background-color: white !important;
  color: #0087b7 !important;
  text-decoration: underline;
}

.subnav {
  position: absolute;
  min-width: 144px;
  padding: 0.33em 0.5em !important;
}

header .navbar .nav .item:hover .dropdown-menu {
  min-height: auto;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 6px 0px;
}

header .navbar .nav .subnav li:nth-last-child(1) {
  padding-right: 0;
}

.subnav li a {
  padding-bottom: 0.5em !important;
}

/* - usp */

header .usp li {
  color: #babfbb;
  font-weight: 400;
  text-align: left;
  text-transform: none;
}

.usp-item {
  margin-right: 2em;
}

/* - breadcrumb */

.breadcrumbs {
    margin: 1.5em 0;
    color: #575E56;
    font-size: 14px;
    line-height: 1.5;
}



/* ========================
2.X HOMEPAGE
======================== */

/* headlines */

.slideshowContainer .slideshow {
  clear: both;
  max-width: 100%;
  width: 100%;
}


/* tekst */
.homepagetekst {
  padding: 0;
}

.homepagetekst-title {
  display: none;
}

.homepagetekst h1,
.homepagetekst h2 {
  color: #008fc1;
  font-weight: 300;
  text-transform: none;
  line-height: 1.2;
  border-bottom: none;
}

.homepagetekst h1 {
  font-size: 36px; 
}

.homepagetekst h2 {
  font-size: 24px; 
}

.homepagetekst p {
  max-width: 100%;
  color: #575E56;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
}

/* kiyoh */

.kiyoh iframe {
  width: 100%;
}

/* products */

.home-products {
  margin-bottom: 1.5em;
}

.productsGrid { margin-top: 1em; }

.product-block-inner {
    text-align: left;
}

.product-block-inner .product-info a {
    color: #008fc1;
}

.product-block-inner .product-info.show {
    padding: 0;
}

.product-info.show h4 {
    margin: 0.33em 0 0 0;
}

.product-block-inner .product-info .price .price-new {
    
}

.visible-title.product-block .product-block-inner .product-info .price .price-new,
.visible-title.product-block .product-block-inner .product-info .price .price-old,
.unitprice {
    color: #5e6e66;
    font-size: 14px;
    font-weight: 400;
}


/* ========================
X.X NEWSLETTER
======================== */

.newsletter {
  display: block;
  margin-bottom: 1.5em;
  overflow: hidden;
}

#newsletter button {
  color: #008fc1;
  background: white;
  border-color: #008fc1;
}

#newsletter-email {
  width: 100%;
}
  
  
  
/* ========================
3.0 CATALOG
======================== */

.categories h3 {
  padding: 0.33em 1em;
  text-align: left;
  line-height: 1.2;
  
}

.categories h3 a {
  text-align: left;
  color: white;
  font-size: 21px;
  font-weight: 400;
  width: 100%;
  text-shadow: none;
}


/* ========================
4.0 COLLECTION (AND PRODUCT PAGE (WZ))
======================== */

#collection h1 {
  margin: 0.67em 0 0.33em 0;
  color: #008fc1;
  font-size: 36px;
  font-weight: 300;
}

/* - Product Page */

.review-score { 
  margin-bottom: 1.5em !important;
}

.productcodes { padding: 0; }
.product-sidebar .product-stock { margin: 0; }
.product-sidebar .product-option { margin: 0; }

.product-sidebar .price {
  color: #575E56;
  display: inline-block;
  font-size: 21px;
  font-weight: 400;
}  

.product-sidebar .price-tax {
  font-size: 14px;
}

.product-sidebar .cartbutton {
  height: 2.1em;
  padding: 0 1em;
  color: white;
  text-transform: none;
  font-size: 16px;
  font-weight: normal;
  background: #008fc1;
  border: 1px solid #008fc1;
    -moz-border-radius: 1.1em;
  -webkit-border-radius: 1.1em;
  -khtml-border-radius: 1.1em;
  border-radius: 1.1em;
  cursor: pointer !important;
}

.product-sidebar .cartbutton span {
  display: block;
  margin-top: -2px;
}

.tabsPages {
  font-size: 16px;
}

.product-sidebar .cartbtnContainer {
  padding-bottom: 3em;
}

.product-sidebar .cartbtnContainer input {
  margin-top: 0;
}

.links.mobile ul { padding-left: 1.5em; }
.links.mobile ul li { text-align: left; }
.links ul li a { font-size: 14px; }


/* ========================
X.X GUI
======================== */

/* general */

.gui-faq, 
.gui-login, 
.gui-password, 
.gui-register, 
.gui-review, 
.gui-sitemap, 
.gui-block-linklist li, 
.gui-table {
  border: none;
}

.gui-block, 
.gui-block-title, 
.gui-buttons.gui-border, 
.gui-block-inner, 
.gui-image {
  border: none;
}

.gui a.gui-button-facebook, 
.gui-login .gui-content-title, 
.gui-block-title span, 
.gui-block-subtitle, 
.gui-content-subtitle, 
.gui-block-linklist li.gui-active a, 
.gui-form .gui-radio span, 
.gui-popover-title, 
.gui-popover-title a, 
.gui-progressbar ul li.gui-active a, 
.gui-progressbar ul li.gui-done a, 
.gui-blog-commentlist header cite, 
.gui-banner, 
.gui a.gui-bold, 
.gui-page-title, 
.gui h1, .gui h2, .gui h3, .gui h4, .gui h5, .gui h6, 
.gui-table thead tr th, 
.gui strong {
  font-weight: 400;
}

.gui-block-subcontent {
  line-height: 1.5;
}

/* gui table */

.gui-table {
  padding-bottom: 1.5em;
}

.gui-table tbody tr td,
.gui-block-content {
  padding: 0.67em 0;
}

.gui-table thead tr th {
  height: 3em;
  padding-left: 0;
  padding-right: 1em;
  font-size: 14px !important;
  line-height: 3em;
  background: none;
  border-color: #babfbb;
}

.gui-table thead tr th:last-child {
  padding-right: 0;
}

.gui-table tbody tr:first-of-type { border-top: 1px solid #babfbb; }
.gui-table tbody tr { border-bottom: 1px solid #babfbb; }
.gui-table td { border: none; }
.gui-table tbody tr td {
  font-size: 16px !important;
  padding-right: 1em;
}
.gui-table tbody tr td:last-child { padding-right: 0; }

/* gui form */

.gui-form {
  margin-bottom: 1.5em;
}

.gui-input input { padding: 0; }
.gui-text textarea { padding: 0.33em; }

a.gui-button-large,
.gui a.gui-button-large,
a.gui-button-small,
.gui a.gui-button-small,
.gui .gui-table a.gui-button-small {
  color: #008fc1;
  background: white;
  border-color: #008fc1 !important;
  border-radius: 999px;
}

/*.gui-button-small,*/
/*.gui-button-action,*/
/*.gui-button-small.gui-button-action {*/
  
/*}*/

.gui-form .gui-field > label{
  margin-bottom: 0.33em;
  font-size: 100%;
}

.gui-form .gui-checkbox label, 
.gui-form .gui-radio label {
  padding-bottom: 0;
  line-height: 2;
}

.gui a.gui-button-large:hover, 
.gui a.gui-button-large:active,
.gui a.gui-button-small:hover,
.gui a.gui-button-small:active,
.gui .gui-table a.gui-button-small:hover,
.gui .gui-table a.gui-button-small:active {
 color: white;
 background-color: #008fc1;
}

.gui a.gui-button-large.gui-button-action {
  width: auto;
}

.gui-col2-equal .gui-col2-equal-col1 {
  margin-bottom: 1.5em;
}

.gui-cart-sum .gui-item .gui-desc {
  text-align: left;
}

/* cart */

.gui-block-productlist li .gui-block-productlist-text a {
  white-space: normal;
}


/* checkout */

.gui-confirm .gui-field .gui-checkbox label {
  line-height: 1.5;
}

input[type="radio"], 
input[type="checkbox"] {
  height: 1.5em;
  margin: 0 0.67em 0 0;
}


/* ========================
X.X NEWS
======================== */

/* - NEWS INDEX PAGE */

.gui-blog .gui-col2-right-col1 > .gui-page-title {
  margin-top: 0 !important;
}

.gui-page-title {
  position: static !important;
  margin: 0.67em 0 0.33em 0;
  font-size: 36px;
  font-weight: 300;
  line-height: 1.2;
}

.gui-blog .gui-col2-right-col1 > .gui-blog-article {
  margin-top: 0;
}

/* - news item */

.gui-blog .gui-blog-article {
  overflow: visible;
  padding: 0;
  margin-bottom: 3em;
  border: none;
}

.gui-blog .gui-blog-article header {
  padding: 0;
  margin-bottom: 1.5em;
}

.gui-blog-article header h1 {
  clear: both;
  margin: 0;
}

.gui-blog-article h1 {
  margin: 0.67em 0 0.33em 0 !important;
  font-size: 28px;
  font-weight: 300;
  line-height: 1.2;
  text-transform: none;
}

.gui-blog-article h1 a {
  color: #008fc1;
}

.gui-blog-article ul {
  margin-left: 0;
  padding-left: 0;
  list-style: none;
}

.gui-blog-article header ul li {
  clear: both;
  padding: 0;
  margin: 0px;
  border-right: none;
}

.gui-blog .gui-blog-article footer {
  margin-top: 0;
}

.gui-blog .gui-blog-article-more a {
  margin-top: 0;
}

.gui-blog .gui-blog-article-summary {
  margin: 0;
  padding: 0;
}

.gui-blog .gui-blog-article-more a {
  float: left;
  height: 1.8em;
  width: auto;
  padding: 0 1em;
  margin: 0.5em 0 0 0;
  color: #008fc1;
  font-size: 14px;
  font-weight: 300;
  text-transform: none;
  background: white;
  border: 1px solid #008fc1;
    -moz-border-radius: 0.9em;
  -webkit-border-radius: 0.9em;
  -khtml-border-radius: 0.9em;
  border-radius: 0.9em;
  cursor: pointer !important;
}

/* - sidebar: recent */

.gui-blog .gui-block {
  padding: 0;
  border: none;
}

.gui-blog .gui-block-title {
  text-transform: none;
  margin-bottom: 1.5em;
}

.gui-block-title {
  margin: 0.67em 0 0.33em 0;
  padding: 0;
  line-height: 1.2;
}

.gui-block-title strong {
  color: #008fc1;
  font-size: 28px;
  font-weight: 300;
}

.gui-blog .gui-block .gui-block-content .gui-block-linklist li {
  padding-left: 0;
}

.gui-block-linklist li a {
  color: #008fc1;
  text-decoration: underline;
}

  .gui-block-linklist li a:hover,
  .gui-block-linklist li a:active { text-decoration: none; }
  
/* - NEWS SINGLE PAGE */

.gui h2 {
  margin: 0.67em 0 0.33em 0;
  color: #008fc1;
  font-size: 28px;
  font-weight: 300;
  line-height: 1.2;
  text-transform: none;
}


/* ========================
5.0 FOOTER
======================== */

footer { 
  background: white !important; 
}

footer .block {
  font-size: 16px;
  line-height: 1.5;
  text-align: left;
}  

footer h2,
footer h3 {
  color: #008fc1 !important;
}

footer .block h3 {
  margin: 0.67em 0 1.33em 0;
  font-size: 21px;
  font-weight: 300;
  text-align: left;
  line-height: 1.5;
  letter-spacing: 0px;
  text-transform: none;
  color: #008fc1 !important;
}

footer .block a {
  padding-left: 0;
  color: #008fc1 !important;
}

footer .block a:hover,
footer .block a:active { text-decoration: underline; }

footer .block ul li { margin-bottom: 0.67em; }

footer .klantenservice {
  text-align: left;
}

footer .klantenservice .text {
  font-family: "Roboto", Helvetica, sans-serif !important;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}  

.copyrightcontainer-fluid.hidden-print {
  margin-top: 3em;
}

footer .copyrightcontainer-fluid .container-fluid .col-xs-12 .copyright {
  font-size: 14px !important;
}

/* - newsletter form */

footer form:after {
  clear: both;
}

footer #newsletter label {
  text-align: left;
}


/* ========================
7.0 MEDIA QUERIES
======================== */

@media (max-width: 767px) {

  h1 { font-size: 24px; }
  h2 { font-size: 21px; }
  h3 { font-size: 18px; }

  .navbar .nav .item.first { display: block; }
  .navbar .nav .item a { text-align: left; }

  .search { padding: 0 15px; }
  
  .homepagetekst h1 { font-size: 24px; }
  .homepagetekst h2 { font-size: 21px; }
  
  #collection h1{ 
    font-size: 24px;
  }
  
  .product-sidebar .price, 
  .product-sidebar .price-tax {
    text-align: left;
  }
  
  .gui-page-title { font-size: 24px; }
  .gui-blog-article h1 { font-size: 21px; }
  .gui-block-title strong { font-size: 21px; }
  .gui-blog .gui-col2-right .gui-col2-right-col2 { padding-top: 3em; }
  .gui h2 { font-size: 21px; }
  
  /* on mobile, give enough bottom margin */
  footer .row > div:last-of-type { margin-bottom: 2em; }
  
  footer .block h3 { font-size: 18px; }
  

}

@media (min-width: 768px) {

  .homepagetekst p {
    margin-bottom: 1.5em;
    margin-right: 1.5em;
  } 
  
  .newsletter { margin-top: 1em; }
  
  .gui-blog .gui-col2-right .gui-col2-right-col2 {
    margin-top: 0;
  }
  
  footer .block,
  footer .block input,
  footer .block button { font-size: 14px; }
  footer .block h3 { font-size: 18px; }
  
}  
