/*@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,800,300);*/
@import url(https://fonts.googleapis.com/css?family=Exo+2:400,500,700,300,900);


/* @import 'header.css'; */

html, body { position: relative; height: 100%; min-height: 100%;}
img {
      -moz-user-select: none;
      -webkit-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-user-drag: none;
      user-drag: none;
      -webkit-touch-callout: none;
    }
iframe,object{max-width: 100%;}
a, a:visited, a:active{text-decoration: none; color: inherit;}
body{
	/* background: #fff; */
	margin: 0;
	padding:0;
	font-size: 14px;
    font-family: 'Exo 2', sans-serif;
    font-weight: 500;
	position: relative;
	background-color: white;
}
.formrequired:after { content:" *"; color: red};
#wrapper {
    width: 100%;
    /* position: absolute; */
    left: 0;
    display: inline-block;
    min-height: 68%;
        overflow: hidden;
    /* margin-top: 50px; */
}
#main-wrapper {
    height: 100%;
    padding: 0px;
}
#main {
    position: relative;
    height: 100%;
    overflow-y: auto;
    padding: 0 15px;
}
.form-group.required .control-label:after  {
  content:"*";
  color:red;
}

.requiredfield{
  color:red;
}
.rowequal {
  display: flex;
  flex-wrap: wrap; 
}
#sidebar-wrapper {
    height: 100%;
    padding: 0px;
    /* position: fixed; */
    /* border-right: 1px solid gray; */
}
#sidebar {
    position: relative;
    height: 100%;
    overflow:hidden;
}
#sidebar .list-group-item {
        border-radius: 0;
        border-left: 0;
        border-right: 0;
        border-top: 0;
}
.navbar-right{
	margin-right: 0px;
}
.navbar-right .navshoppingcart{
	color: black;
    font-size: 30px;
    line-height: 50px;
    margin-right: 20px;
    cursor: pointer;
}
form#navsearchform {
    width: 220px;
    margin-left: 15px;
    padding-top: 9px;
}

a#zoom img {
    max-height: 500px !important;
}

.navbar-default {
    background-color: white !important;
    display: flex;
    justify-content: center;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.navbar-default .navbar-nav>li>a {
    color: black !important;
    padding: 15px 0px 15px 15px;
}
.navbar-default .dropdown>a {
    color: black !important;
}

nav{font-size: 16px;}

.navbar-default .navbar-nav>li>a:hover {
    color: #3EA0E2 !important;
    background-color: transparent;
}


.bg-avtwerkplaats, .bg-werkplaats td, .bg-werkplaats th {
    background-color: #cefeba;
}
.text-center{
    text-align: center;
}


.align-middle{vertical-align: middle !important; }


.carousel-inner .item img{ margin: auto;}
.carousel-control{background: transparent !important;}

.hero-widget { text-align: center; padding-top: 20px; padding-bottom: 20px; }
.hero-widget .icon { display: block; font-size: 96px; line-height: 96px; margin-bottom: 10px; text-align: center; }
.hero-widget var { display: block; height: 64px; font-size: 64px; line-height: 64px; font-style: normal; }
.hero-widget label { font-size: 17px; }
.hero-widget .options { margin-top: 10px; }
.btn-primary{color: white;}


.productpageimage {
    max-height: 200px;
}

li .btn-group.bootstrap-select {
    margin-top: 8px;
}

#deliveryaddresses a.list-group-item {
    height:auto;
    min-height:150px;
}

.table tbody tr.success td {
  background-color: #dff0d8;
}
.table tbody tr.error td {
  background-color: #f2dede;
}
.table tbody tr.info td {
  background-color: #d9edf7;
}
.table-striped > tbody > tr > .danger,
.table-striped > tbody > .danger > td,
.table-striped > tbody > .danger > th {
  background-color: #f2dede !important;
}

.productdescbodyown{
    font-size: 10px;
}     

.badge-notify{
    background:red !important;
    position:relative !important;
    top: -15px !important;
    left: -20px !important;
    width: 20px !important;
    height: 20px !important;
    font-size: 16px !important;
    line-height: 16px !important;
    border: 0px !important;
    padding: 2px 5px !important; 
    font-weight: 400 !important;
   }

/*******************************
* MODAL AS LEFT/RIGHT SIDEBAR
* Add "left" or "right" in modal parent div, after class="modal".
* Get free snippets on bootpen.com
*******************************/
	.modal.left .modal-dialog,
	.modal.right .modal-dialog {
		position: fixed;
		margin: auto;
		/* width: 400px; */
		height: 100%;
		-webkit-transform: translate3d(0%, 0, 0);
		    -ms-transform: translate3d(0%, 0, 0);
		     -o-transform: translate3d(0%, 0, 0);
		        transform: translate3d(0%, 0, 0);
	}

	.modal.left .modal-content,
	.modal.right .modal-content {
		height: 100%;
		overflow-y: auto;
	}
	
	.modal.left .modal-body,
	.modal.right .modal-body {
		padding: 15px 15px 80px;
	}

/*Left*/
	.modal.left.fade .modal-dialog{
		left: -320px;
		-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, left 0.3s ease-out;
		        transition: opacity 0.3s linear, left 0.3s ease-out;
	}
	
	.modal.left.fade.in .modal-dialog{
		left: 0;
	}
        
/*Right*/
	.modal.right.fade .modal-dialog {
		right: -320px;
		-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, right 0.3s ease-out;
		        transition: opacity 0.3s linear, right 0.3s ease-out;
	}
	
	.modal.right.fade.in .modal-dialog {
		right: 0;
	}

/* ----- MODAL STYLE ----- */
	.modal-content {
		border-radius: 0;
		border: none;
	}

	.modal-header {
		border-bottom-color: #EEEEEE;
		background-color: #FAFAFA;
	}

    #panelbox .modal-header {
		background-color: #eef2f5;
        color: black;

	}

    
.vcenter {
    display: inline-block;
    vertical-align: middle;
}
.vbottom {
    display: inline-block;
    vertical-align: bottom;
}

.equalrow {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}
.recycleicon img {
    height: 20px;
}
#login input{border: 1px solid lightgrey;}
select, table{max-width: 100%}
h1, h2, h3, h4{color: #1a1a1a;}
h1{font-weight: 900;}
#content h1, #content h2, #content h3{text-align: center;}
table{max-width:100%;}
.tabletrbottom td{background-color:lightgrey; border-top: 2px solid grey !important;}
.right input{text-align: right; width: 45px;};
hr{border-color: #3EA0E2;}
.title{text-align: center; font-weight: 700;}
input[type="text"], input[type="password"], input[type="email"], input[type="tel"] { padding-left: 5px; line-height: 20px;}
.priceinputdisabled{    
    width: 60px;
    background-color: white;
    border: none;
}
h4.lead{
    font-weight: 700;
}
.tdlabel{font-weight: bold;}
.bluecolor{color: #3EA0E2;}
.hidetr {    display: none;}
.formfirst{font-weight: bold}
.contactform_textarea{width: 300px; height: 200px;}
.carticon{    font-size: 20px !important;}

input{font-family: 'Exo', sans-serif;}

#contactbox{position: fixed; z-index: 200; bottom: 30px; right: 30px; width: 500px; color:white;}
#contactbox .panel-heading{cursor: pointer;}
#contactbox .panel-body{color: grey;}
#closecontactbox{ color: white; cursor: pointer; margin-right: 5px;}
#contactboxtitle{line-height: 36px;font-size: 18px;}
#stickycontactbutton {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 198;
}

.contact-fab {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #286090;
    color: #fff;
    border: none;
    font-size: 24px;
    box-shadow: 0 0 0 rgba(40, 96, 144, 0.4);
    animation: pulseblue 2s infinite;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
}

.contact-fab:hover {
    background-color: #00495d;
}

@keyframes pulseblue {
    0% {
        box-shadow: 0 0 0 0 rgba(7, 130, 245, 0.6);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(7, 130, 245, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(7, 130, 245, 0);
    }
}
.pdfthumbcontainer {
    height: 200px;
    width: 100%;
    margin-bottom:0.75rem;
    display: flex;
    justify-content: center;
    align-items: center;    
}

.horizontal-scroll {
    display: flex;
    overflow-x: auto;
    gap: 16px;
    scroll-behavior: smooth;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;

    /* Scrollbar verbergen */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
}

.horizontal-scroll::-webkit-scrollbar {
    height: 0px; /* Chrome, Safari, Opera */
}

.scroll-btn {
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
    z-index: 20;
    background-color: #fff;
    border: none;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    cursor: pointer;
    font-weight: bold;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    transition: background-color 0.3s, box-shadow 0.3s;
    color: #333;
}

.scroll-btn:hover {
    background-color: #337ab7;
    color: white;
    box-shadow: 0 4px 12px rgba(0,123,255,0.6);
}

.scroll-left {
    left: -10px; /* laat 'm iets meer uitsteken */
}

.scroll-right {
    right: -10px;
}

/* Op mobiel of small screens kan je ze verbergen */
@media (max-width: 768px) {
    .scroll-btn {
        display: none !important;
    }

    .horizontal-scroll {
        scrollbar-width: auto; /* Firefox */
        -ms-overflow-style: auto; /* IE 10+ */
    }

    .horizontal-scroll::-webkit-scrollbar {
        height: 8px; /* i.p.v. display: block/auto */
    }

    .horizontal-scroll::-webkit-scrollbar-thumb {
        background: #dbdee0;
        border-radius: 4px;
    }

    .horizontal-scroll::-webkit-scrollbar-track {
        background: transparent;
    }
}

.product-card {
    flex: 0 0 auto;
    width: 209px; /* 6 kaarten per rij binnen 1366px (ongeveer) */
}

.product-card .card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 260px; /* zorg voor voldoende hoogte */
}

.product-card .card-body {
    flex-grow: 1;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 12px;
    min-height: 60px; /* geforceerde ruimte voor titels */
    text-align: center;
}

.product-title {
    font-size: 0.95rem;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
    white-space: normal;
    text-align: center;
}

.collapse.in {
      height: auto !important;
}
.collapsing-hor {
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
    transition: all .5s ease-out;
}

.productpageitem > .thumbnail{
    border-radius: 20px !important;
}


.menuitemactive{font-weight: bold; color:#3EA0E2;}

.clearboth{clear:both}
.ulnostyle{
	list-style: none;
    margin: 0;
    padding: 0;
}

.flash-notice{
    border-radius: 25px;
    color: white;
    float: center;
    text-align: center;
    vertical-align: middle;
    background-color: #3EA0E2;
    padding: 10px !important;
    margin-top: 5px;
    margin-bottom: 10px;
}

.flash-error{
    border-radius: 25px;
    float: center;
    color: white;
    text-align: center;
    vertical-align: middle;
    background-color: #ff4f4f;
    padding: 10px !important;
    margin-top: 5px;
    margin-bottom: 10px;
}

#container{
    width: 100%;
    margin: auto auto;
    margin-top: 10px;
    display: table;
    min-height: 700px;
}
#containerrow{
    display: flex;
}

#leftpanel, #rightpanel{
    display: block;
    width: 15%;
    /* background-color: #E8E8E8; */    
    padding-top: 10px;
    padding-bottom: 10px;  
    border-radius: 20px;   
}

#leftpanel{margin-right: 2%;    float: left; color: #55565A; }
#rightpanel{margin-left: 2%;    float: right; color: #55565A; }

#leftpanelstroke{ width: 94%; margin: 0 2%;}
#rightpanelstroke{ width: 94%; margin: 0 2%;}
#voorraadmodal{   z-index: 2000;}
#panelbox{margin-bottom: 20px;}
.panelboxheader, .panelboxheader a{
    background-color: #3EA0E2;
    height: 30px;
    color: white;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding:5px;
    font-weight: bold;
    font-size: 14px;
    
}
.panelboxheader{
	overflow: hidden;
    white-space: nowrap;
	
}

.panelboxcontent{
	position: relative;
    padding:5px;    
}

#panelbox .panelboxcontent{  
    border: 1px solid lightgray;
}

.panel-heading a:after {
    font-family:'Glyphicons Halflings';
    content:"\e114";
    float: right;
    color: grey;
}
.panel-heading a.collapsed:after {
    content:"\e080";
}

.boxwhite{ background-color: white;}

#containermiddle{
    float: left;
    margin: auto auto;
    margin-bottom: 20px;    
    margin-top: 0px;
    display:block;
    width: 70%;
    text-align: center;
}

#imgslider{
    margin-bottom: 10px;
}
#imgslider img{
    width: 100%;
    height: 100%;
}
.generatebarcode{
	position: absolute;
	top: 20px;
	right: 60px;
	font-size: 30px;
}

#search{
    margin-bottom: 10px;
    height: 50px;
    border-radius: 10px;
    padding: 10px 10px;
    background-color:white;
    vertical-align: middle; 
    width: 100%;
}

.searchinput{
	margin: auto auto;
    border-radius: 10px;
    padding-left: 10px;
    border-radius: 10px 0px 0px 10px;
    line-height: 36px;
    height: 36px;
    
}
.searchbutton{
    border-radius: 0px 10px 10px 0px;
    height: 36px;
    background-color: #193D54;
    color: white;
    border: none;
    line-height: 36px;
    font-size: 16px;
    cursor: pointer;

}
#content{
    background-color: white;
    color: black;
    /* padding: 5px 25px; */    
}

.button {
	background: none;
    background-color: #4CAF50; /* Green */
    border: none;
    color: white !important;
    padding: 5px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    border-radius: 10px;
    
    width: auto;
    height: auto;
}
.buttonblue {background: none !important; background-color: #3EA0E2 !important;  padding: 5px 15px !important;  } /* Blue */
.buttonpurple{background-color: #9E20E3; padding: 5px 15px;}
.buttonred {background-color: #f44336; padding: 5px 15px;} /* Red */ 
.buttongrey {background-color: #e7e7e7; color: black;} /* Gray */ 
.buttonblack {background-color: #555555;} /* Black */

.textavtblue{color: #3EA0E2;}
.boxcontainer{
    margin-top:10px;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;             /* default value; can be omitted */
    flex-wrap: wrap;               /* default value; can be omitted */
    justify-content: space-between;    
}
.box66{
    width: 65%;
    margin-right: 1%;
    float: left;
}
.box33{
    width:33%;
    float: left;
}

.deals{height: 175px; width: 30%;}
.deals img{height: 175px; width: 100%;}
#productgroupcontainer{
    display: -webkit-flex;
    display: flex;
    flex-direction: row;             /* default value; can be omitted */
    flex-wrap: wrap;               /* default value; can be omitted */
    justify-content: space-between; /* switched from default (flex-start, see below) */
}

.filteroption{border-top: 1px solid lightgray; margin-top: 10px;}
.filteroption h3{color: #3EA0E2; font-size: 15px; width: 100%; margin-top:5px;}

.productgroupbox {
    position: relative;
    margin-top: 20px;
    margin: 10px;
    display: block;
    width: 29%;
    height: 130px;
    border: solid 2px #3EA0E2;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.productgroupboximg{
    height: 100px;
    width: 90%;
    text-align: center;
    /* background-color: #3EA0E2; */
    margin: auto;
    margin-top:5px;
}

.productgroupboximg img{ 
    height: 100%;
    width: 100%;

}

.productgroupboxtitle{
    font-size: 18px;
    line-height: 25px;
    height: 25px;
    color: white; 
    position:absolute;               
   bottom:0;
   width: 100%;
   text-align: center;
   background-color: #3EA0E2;
}

.logintext, .aanmeldennieuwsbrief, .winkelwagenafrekenen{text-align: right;}
.inputgebruikersnaam, .inputpassword, .emailnieuwsbrief, input_gebruikersnaam, input_password{
    width: 100%; 
    height: 30px;
    box-sizing: border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
}

.input_gebruikersnaam, .input_password{
    border: 1px solid #3EA0E2 !important;
}

.inputerror{border: 2px solid red;}
i#cart_delete_product {
    font-size: 16px;
    color: red;
}

.noList{
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-left: 10px;
} 
.noList a, .noList a:visited, .noList a:active, .noList a:hover{color: #55565A; text-decoration: none;}
.noList a:hover{color: #3EA0E2;}
.sidebarproductgroepen{font-size: 16px; line-height: 24px;  }

.arrowicon{
    color: #3EA0E2;
    font-size: 20px !important;
    cursor: pointer;
}


.roundicon{
    position:absolute;
    top: 40px;
    right: 40px;
    height: 30px !important;
    width: 30px !important;
    z-index: 100;
    opacity: 1 !important;
}
.zoomthumb{
    max-height: 80px;
    max-width: 80px;
}
.zoomthumbcontainer{
    width: 80px;
    height: 80px;
}
.selectedproductthumb img {
    -webkit-filter: brightness(60%);
    filter: brightness(60%);
    background-color: #ffffff;
}
.mz-thumb-selected img {
  -webkit-filter: brightness(100%) !important; 
    filter: brightness(100%)!important; 
}
#zoom img, #spin img{
    max-width: 100%;
    max-height: 100%;
}

#spin-box, #zoom-box {
    max-width: 400px;
    max-height: 500px;
    margin: auto;
}
.printbarcodeicon{
    background: transparent;
    border: 0px;
    color: black;
    right: 60px;
    top: 7px;
    font-size: 20px;
    cursor: pointer;
    position: absolute;
        z-index: 5;
}


.footer{
    width: 100%;
    background-color: #eef2f5;
    color: black;
    padding: 20px 0px 20px 0px;
    font-size: 14px;
    font-weight: 100;
}

.footer .list-unstyled b {
    font-size: 16px;
}

#footerbar{
    width: 100%;
    background-color: #dbdee0;
    color: black;
    /* height: 50px; */
    line-height: 50px;
}
#footerbar a,#footerbar a:visited,#footerbar a:active{color: black;}

.footer-socials i{
    color: white !important;
    margin-bottom: 15px; 
}
.footer-socials i:hover, .footer-socials img:hover {
    background-color: #dbdee0 !important; 
}
.footer-hr {
    height: 1px; /* of 0 als je echt geen hoogte wil */
    background: transparent;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    margin: 2rem 0;
    border: none;
  }

  .card {
    background-color: #fefefe;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform 0.2s ease, box-shadow 0.1s ease;
}

.card:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
}

.card h5,
.card h6 {
    margin: 0 0 0.75rem 0;
}

.card .btn {
    margin-top: auto;
}
.card-title {
    font-size: 2rem;
    font-weight: bold;
    color: #1a1a1a;
}

.card-subtitle {
    font-size: 1.5rem;
    font-weight: bold;
    color: #555;
}


#footerleftbox{ width: 45%; float: left;    line-height: 20px; font-size: 12px; padding-top: 20px; font-weight: 400;}
#footerrightbox{ width: 45%; float: right;  padding-top: 20px;}
.footertitle{color:#3EA0E2; font-weight: 500px; font-size: 14px;}
.footerlogo{margin-bottom: 50px;}
.socialicon{border-radius: 5px; height: 40px; width: 40px; font-size: 30px !important; text-align: center; line-height: 45px !important; margin-right: 10px; float: left; margin-top: 10px;}
.bestmanagedcompany{height: 80px;}
.footerlogo{height: 100px;}
#footermiddle, #footerbarmiddle{
    display: block;
    width: 52%;    
}
#footermiddle, #footerbarmiddle{
    margin: auto auto;
    color: white;
    height: 100%;
}

.footerbarcopyright{ width: 70%;}
.footerbarmenuitem{width: 10%;}

.fancyboxstreet{cursor: pointer;}

.registratietable{
    width: 75%;
}
.registratielabel{width: 30%;}
.registratieinput{}

.flags{
    float           : right;
    display         : inline-block;
    margin          : 14px 20px 0px 0px;
    /*background      : rgba(253, 253, 253, 1);*/
    background      : #EDEDED;
    padding         : 0px 0px 0px 0px;
    /*border          : 1px #CDCDCD solid;*/
    border-radius   : 4px;
    height          : 42px;
}

.flags ul{
    margin: 0px 0px 0px -40px;
}

.flags_lang li{
    list-style  : none;
    float       : left;
    padding     : 5px;
}

.flags img{
    width           : 32px;
    height          : 32px;
    cursor          : pointer;
    padding         : 1px;
    opacity         : 0.6;
    border-radius   : 4px;
}

.flags img:hover{
    border  : 1px #DDD solid;
    padding : 0px;
    opacity : 1;
}

.flags img.active{
    opacity : 1;
}
.btn-file {
    position: relative;
    overflow: hidden;
}
.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}

/* JS datatable css */
button.btn.btn-default.buttons-excel.buttons-html5 {
    background-color: green;
    color: white;
}

button.btn.btn-default.buttons-pdf.buttons-html5{
    background-color: #E20613;
    color: white;
}
button.btn.btn-default.buttons-print{
    background-color: grey;
    color: white;
}

.dataTables_wrapper .dt-buttons {
    float: left;
}

.jsdatatable{
	margin-bottom:20px;
}
.cursorpointer, a.cursorpointer{
    cursor: pointer;
}
.breadcrumb-exclude:before{
    content: none !important;
}
#contentboxleft{width: 45%; float: left;}
#contentboxright{width: 45%; float: right;}
.errorloginmessage{color: red;}

.kijkbinnencontent{padding: 0px;}
.kijkbinnenimg{ width: 100%;}

#groupboxcontainer{
    display: -webkit-flex;
    display: table;
    margin: auto;
    flex-direction: row;             /* default value; can be omitted */
    flex-wrap: wrap;               /* default value; can be omitted */
    justify-content: space-between; /* switched from default (flex-start, see below) */
   align-items: center;

}
.twobox{
	width: 46%;
    margin-top:10px;
    float: left;
    margin-left: 2%;	
}

.threebox{ 
    width: 31%;
    color:white;
    margin-top:10px;
    float: left;
    margin-left: 2%;
}
.threebox_header{
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background-color: #55565A;
    height: 22px;
    padding-left: 10px;
    line-height: 22px;    
    font-size: 16px;
}
.threebox_content{
    background-color: #3EA0E2;
    min-height: 100px;
    line-height: 20px;
    min-height: 75px;
    color: white;
    vertical-align: middle;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 150px;
    border-radius: 15px;
}
.threebox_content_alt{
    min-height: 100px;
    line-height: 20px;
    min-height: 75px;
    vertical-align: middle;
    border: 1px solid lightgrey;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
}
.alternative-product {
    border-top: 1px solid #3EA0E2;
    margin-top: 50px;
    text-align: center;
}

.lightgrey_inactive{
	background-color: lightgrey;
}

.bandendeal{
    margin-top: 10px;
    height: 175px;
    text-align: center;    
}
.bandendeal img{
    height: 175px;
    margin: auto;
    width: 100%;
 }
 
.productprice, .producttotal, .subtotal,.kortingtotal, .vouchertotal, .subtotal2, .verzendkostentotal, .btwtotal, .alltotal{
    border: none;
    background-color: white;
}

.alltotal, .subtotal, .subtotal2{ font-weight: bold;}

.productlistitem{
    width: 100%;
    border: 1px solid black;
    height: 75px;
}

.productlistimg {
    width: 20%;
    float: left;
}
.productlistdescription{
    width: 50%;
    float:left;
}
.productlistcart{
    width: 30%;
    float:right;
}
table .button{
	font-size: 12px;	
}

#alternatieven{
	margin-top: 100px;
	border-top: 5px solid #213E54;
    padding-bottom: 43px;
}

#alternatieven .list-group-item {
    position: relative;
    display: block;
    /* padding: 10px 15px; */
    margin-bottom: 0px;

    /* border: 1px solid #ddd; */
}

#alternatieven .products{
	background-color: white;
}

#alternatieven .thumbnail, .products .thumbnail {
	border: none;

}


.producttableimg{
	max-height: 150px;
}
.producttable-artnr{
    color:#4398db;
}
.oneproductviewbtn{
    cursor: pointer;
    color: #193D54;
    margin-top: 5px;
}

.meerinformatietext {
    margin-top: 10px;
    font-weight: bold;
}

h4.oneproductviewbtn {
    cursor: pointer;
}
h4.oneproductviewbtn:hover {
    text-decoration: underline;
}

	.avtrefproductinfo{
		position:absolute;
		color: grey;
		z-index: 15;
	}
	.avtrefproductinfogrid{
			
		bottom: 40px;
    	right: 30px;
	}
	.avtrefproductinfolist{
		bottom: 10px;
		right: 10px;
	}

/* tableview */

.glyphicon { margin-right:5px; }
.thumbnail
{
    margin-bottom: 20px;
    padding: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.row.addtocartrow.col-md-6, .listleftdiv.col-md-6 {
    padding-top: 20px;
}
.listleftdiv.col-md-6{
	text-align:left;
}
/* .listleftdiv h4.group.inner.list-group-item-heading.lead{
	text-align:left !important;
} */

.aanbevolendooravt img {
    width: 65px;
}
.aanbevolendooravt {
    position: absolute;
    top: 0px;
    right: 15px;
    z-index: 2;
}

.actieproduct img {
    width: 45px;
}
.actieproduct {
    position: absolute;
    top: 0px;
    left: 15px;
    z-index: 2;
}
.shoppingcartactieproduct{
    max-height: 20px;
}

h4.group.inner.list-group-item-heading.lead{
	/* text-align:left; */
}
.list-group > .item {
    border: 2px solid lightgray;
    border-radius: 10px;
    margin-bottom: 20px;
}


.item.list-group-item
{
    float: none;
    width: 100%;
    margin-bottom: 0px;
    border: none;
    /* background-color: #fff; */
}

.products .list-group-item{
    border: none;
    border-radius: 0px;
	border-top: 1px solid lightgrey;
}


.products .grid-group-item{
    border: none;
	border: 1px solid lightgrey;
}
.list-group-item{
	border: 0px;
}
.item.list-group-item:nth-of-type(odd):hover,.item.list-group-item:hover
{
    /* background: #428bca; */
}

/* .item.list-group-item .list-group-image
{
    margin-right: 10px;
} */
.item.list-group-item .thumbnail
{
    margin-bottom: 0px;
}
.item.list-group-item .caption
{
    padding: 9px 9px 0px 9px;
}
.item.list-group-item:nth-of-type(odd)
{
    /* background: #eeeeee; */
}

.item.list-group-item:before, .item.list-group-item:after
{
    display: table;
    content: " ";
}

/* .item.list-group-item img
{
    float: left;
} */
.item.list-group-item:after
{
    clear: both;
}
.list-group-item-text
{
    margin: 0 0 11px;
}

.bestelmogelijkheidcontainer{
    background-color:#f5f5f5; margin-bottom:20px; padding:20px; border-radius: 20px;  flex: 1;
}
.bestelmogelijkheidcontainer:hover{
    cursor: pointer;
    
}
.bestelmogelijkheidcontainer i{
    font-size: 40px;
    color: black;
}
.bestelmogelijkheidcontainer i:hover{
    cursor: pointer;
    color:#1386C2
}
.bestelmogelijkheidcontainer label{
    line-height: 20px;   color: #193D54; font-size: 18px;
}
.bestelmogelijkheidcontainer label:hover{
    cursor: pointer;
    color:#1386C2
}

.loadingscreen img {
    margin: auto auto;
    width: 100px;
}
.loadingscreen {
    width: 100%;
    text-align: center;
}

#fullpageloading ,#fullpageloadinghydrotek{
    color: white;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    display: block;
    opacity: 0.9;
    background-color: #aaa;
    z-index: 100000;
    text-align: center;
}
#fullpageloading img, #fullpageloadinghydrotek img{
    margin-top: 100px;
    
}

#fullpageloadinghydrotek img{
        margin-top: 200px;
}

.orderoptions li {
    list-style: none;
    margin-left: -40px;
    font-size: 16px;
}
.infotext{
	width:80%;
	margin: auto auto;
	padding-top: 10px;
	padding-bottom: 10px;
}


.zoom-eff {
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
}
 
.transition {
    -webkit-transform: scale(1.1,1.1); 
    -moz-transform: scale(1.1,1.1);
    -o-transform: scale(1.1,1.1);
    transform: scale(1.1,1.1);
}


.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
    z-index: 10000;
}

.shoppingcartoptions{
	    margin-bottom: 10px;
    height: 20px;
    float: right;
    width: 100%;
}

.actieveshoppingcart {
    text-decoration: underline !important;
}

/* vertical tabs css */

/* .ui-tabs-vertical { width: 55em; }
  .ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 12em; }
  .ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; }
  .ui-tabs-vertical .ui-tabs-nav li a { display:block; }
  .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; }
  .ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; width: 40em;}
 */
/*  end tabs css */

.orderverzendmethode, .orderdetails {border:1px solid lightgrey; min-height:540px;} 

.orderdetails_textarea{}
 
.littlecircle {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  font-size: 16px;
  color: white;
  line-height: 20px;
  text-align: center;
  background: red;
  float: right;
  margin-left:5px;
}

.info-button{
    color:#1386C2;
    float: right;
    cursor: pointer;
}

.repeatpass-wrong{
	color: red;
	display:none;
	font-size: 18px !important;
   	padding-left: 10px;	
}
.repeatpass-ok{
	color: green;
	display:none;
	font-size: 14px;
   	padding-left: 10px;
}

div#shopping-as {
    position: absolute;
    color: red;
    width: 100%;
    text-align: center;
    font-size: 24px;
}

.list-group .favouritebutton {
    /* background: transparent;
    border: 0px;
    color: #3ea0e2;
    font-size: 20px;
    float: right;
    cursor: pointer;
    line-height: 80px; */
    position: absolute;  right: 20px; z-index: 5;
    background-color: #f0B500;
}

button.addtocart_submit.btn.btn-primary {
    margin-top: -5px;
}

.meerinformatiecontainer{
    position: relative;
}

td .favouritebutton{
    position: absolute;
    top:0px;
    right: 5px;
}
form#addfavourite {
    position: absolute;
    right: 20px;
    z-index: 5;
}
.changepencil{
	margin-left: 10px;
	cursor: pointer;
	color: #3ea0e2;
}
.changename{
	margin: auto auto;
	text-align: center;
	background-color: rgba(62, 160, 226, 0.26);
	border-radius: 10px;
	color: black;
	width: 50%;
	padding: 10px 0px;
}

.actietitel {
    position: absolute;
    text-align: center;
    width: 100%;
    color: #3ea0e2;
    font-size: 30px;
    top: 0px;
}

.actievan {
    position: absolute;
    color: #3ea0e2;
    font-size: 30px;
    bottom: 50px;
    right: 20px;
    text-decoration: line-through;

}
.actievoor {
    position: absolute;
    color: red;
    font-size: 30px;
    bottom: 20px;
    right: 20px;

}

productgroupuitgelicht_content h2{
	color: white;
}

.loginlabel{
	width: 100%;
	line-height: 30px;
}

.stepwizard-step p {
    margin-top: 10px;    
}

.stepwizard-row {
    display: table-row;
}

.stepwizard {
    display: table;     
    width: 100%;
    position: relative;
}

.stepwizard-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    z-order: 0;
    
}
.stepwizard-first {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: red;
    z-order: 0;
    
}

.stepwizard-step {    
    display: table-cell;
    text-align: center;
    position: relative;
}

.btn-active{ 
	background-color: #3ea0e2;
	color: white;
	cursor: pointer;
}
.btn-notactive{
	background-color: white;
	border: 1px solid #3ea0e2 !important;
	color: #3ea0e2;
	cursor: pointer; 
	
}


.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
  border: 0px;
  cursor: pointer;
}

#productdetailstable{width: 100%; border-spacing:0;     line-height: 30px; font-size: 12px; }
.productdetailslabel{font-weight: bold;}
.producttr td{border-bottom: 1px solid lightgrey;}
.producttr:last-child td{border-bottom: 0px;}


#productdetailstable tr:nth-child(odd) {
   /* background-color: lightgrey; */
}
table#productdetailstable td {
    /* padding: 5px; */
}

.backlink{
	color: #3ea0e2;
	font-size: 14px;
}
.productdescheader{
	font-size: 16px;
	color: #3EA0E2;
	font-weight: bold;
	line-height: 30px;
}
.productdescbody{
	font-size: 14px;
	color: black;
	font-weight: bold;
	line-height: 18px;
	
}

.productmoreinfo{
	border-left: 1px solid lightgrey;
    color: #3ea0e2;
    font-size: 20px;
    line-height: 80px;
    padding-left: 5px;
    padding-right: 5px;
    cursor: pointer;
}
.productmoreinfo:hover{
	background-color: #3ea0e2;
	color: white;
}

td.productpageright {
    line-height: 80px;
}


.ui-widget-content {
    border: 1px solid tranparent !important;
}

#orderpickingdiv{
	background-image: url('../images/bg_orderpicking.png');
	background-repeat: no-repeat;
	background-size: 400px 400px;
	width: 400px;
	height: 400px;
	margin: auto auto;
	text-align: center;
	vertical-align: middle;
	display:table-cell;
	border-radius: 20px;
}
#orderpickingtext{
	width: 200px;
	padding: 10px;
	margin: auto auto;
	border-spacing: 20px;
	background-color: white;
	color: #3ea0e2;
	font-size: 20px;
	font-weight: bold;
	border-radius: 20px;
}

.loader {
	position: relative;
/* 	left: 0px;
	top: 0px; */
	width: 100%;
	height: 400px;
	z-index: 9999;
	background-color: lightblue;
	background: url('../images/loading.gif') 50% 50% no-repeat white;
}
.csvloader{
	position: absolute;
 	left: 0px;
	top: 0px; 
	width: 100%;
	height: 100%;
	padding-top: 200px;
	z-index: 9999;
	background: url('../images/loading.gif') 50% 50% no-repeat lightgrey;
	display:none;	
}
.shoppingcart_productdesc {
    color: #3EA0E2;
}
.shoppingcart_productbrnd, .shoppingcart_productartnr {
    font-size: 10px;
}

.borderbottomlightgrey td{
	padding: 5px 0px;
	border-bottom: 1px solid lightgrey;
}

.threebox_content_alt h3 {
    max-width: 100%;
    font-size: 26px;
}

.pagination {
    display: inline-block;
}

.pagination span {
	cursor: pointer;
    color: black;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
}

.pagination_active {
    background-color: #3EA0E2;
    color: white !important;
    border-radius: 10px;
}

.pagination a:hover:not(.active) {background-color: #ddd; color: white !important; border-radius: 10px;}
.mobileshoppingcartbutton{
            display:none;
        }

        .autocompleteimage{
            max-height: 50px;
            max-width: 50px;
        }
.bigcheckbox
{
    /* Double-sized Checkboxes */
    -ms-transform: scale(1.5); /* IE */
    -moz-transform: scale(1.5); /* FF */
    -webkit-transform: scale(1.5); /* Safari and Chrome */
    -o-transform: scale(1.5); /* Opera */
    padding: 10px;
}

.flipbook-side-menu, .flipbook-sub-menu-content {
    background-color: #193D54 !important;
}


.newsletterthumbnail {
    box-shadow: 0px 8px 15px 5px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 8px 15px 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 8px 15px 5px rgba(0, 0, 0, 0.5);

    transition: all 0.4s ease-in-out;
    max-height: 250px;
    width: 175px;

    transform: perspective(600px) rotateX(20deg);
    border-radius: 6px;
}

.newsletterthumbnail:hover {
    box-shadow: 1px 0px 15px 5px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 1px 0px 15px 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 1px 0px 15px 5px rgba(0, 0, 0, 0.5);

    transform: scale(1.05);
    transition: all 0.4s ease-in-out;
}

.flipbook-btn-active {
    background-color: #3EA0E2 !important;
}

.columncenter {
    float: none;
    margin: auto;
}

/* =Media Queries
-------------------------------------------------------------- */
/* laptops */
    @media all and (max-width: 1366px) and (min-width: 1064px) {
		.container-fluid, .container{    padding-top: 60px !important;}
        ul.topnav li a { font-size: 14px; }
		ul#slider li img {height: 250px;}
			nav {
			    font-size: 14px !important;
			}
			div#main-content {  min-height: 500px; }
	    .loader { min-height: 300px }
        
	}

    
    

/* =Media Queries
-------------------------------------------------------------- */
/* bigscreen */
    @media all and (min-width: 1400px){
		#leftpanel, #rightpanel { width: 15%; }
		
	}

@media (max-width: 992px) {
    body {
        padding-top: 0px;
    }
}
@media (min-width: 992px) {
    #main-wrapper {
        float:right;
    }
}
@media (max-width: 992px) {
    #main-wrapper {
        padding-top: 0px;
    }
    
}
@media (max-width: 992px) {
    #sidebar-wrapper {
        position: relative;
        height:auto;
  		border-right:0;
	}
	#bestelmogelijkheden{
		display:none;
	}
}

@media only screen and (min-height: 600px) and (max-height: 1280px) {
	div#main-content {  min-height: 61vh; }
	.loader { min-height: 300px }
}
	
@media only screen and (min-height: 1200px) {
	div#main-content {  min-height: 900px; }
	.loader{ min-height: 800px;}
}

.container-fluid{    padding-top: 120px;}


/* =Media Queries
-------------------------------------------------------------- */
/* tablet and mobiles */
    @media all and (max-width: 992px) {
    	h4.group.inner.list-group-item-heading.lead{
    		text-align: center;
    	}

        h1.super-heading {
            font-size: 30px;
        }
    	.caption .listleftdiv.col-md-6{
    		text-align: center;
    	}
    	.voorrraadrow .text-left{
    		text-align: center;
    	}
        td.tablerowcounter {
            font-size: 14px;
            color: lightgray;
        }
        
        .searchicontext{
            display: none;
        }
       
        /* .mobileshoppingcartbutton{
            display:block;
        } */
        .btn-group.bootstrap-select {
                        width: 100% !important;
                        padding: 10px;
                }

                ul.dropdown-menu.inner {
                        z-index: 1000;
                        background: white;
                }
                
                
        .bestelmogelijkheidcontainer{
            background-color:#f5f5f5; margin-bottom:20px; padding:20px; border-radius: 20px; 
        }
        .bestelmogelijkheidcontainer i{
            font-size: 40px;
            
        }
        .bestelmogelijkheidcontainer label{
            line-height: 20px;   color: #193D54; font-size: 16px;
        }
        .autocompleteimage{
            max-height: 30px;
            max-width: 30px;
        }

        .avtsnelbestelinformatie{
            margin-top: 50px;
            padding-top:50px;
            border-top:2px solid lightgray;
        }

        .radio-inline-snelbestellen{
            width: 100%;
            margin-left: 0px !important;
            margin-top: 10px !important;
        }
        
            
		
/*         header{width: 100%;}
        nav{width: 100%;}
        #headerright{display:none;}
        table, select, option, textarea, .orderdetails_textarea{ max-width: 100%;}
        .orderdetails_textarea{width: 90%;}
        #shopping-as{top: 80px;}
        
        #leftpanel{
            display:none;
        }
        #containermiddle, #footermiddle, #footerbarmiddle, #footerleftbox, #footerrightbox, .footerlogo{width: 100%;}
        #rightpanel{width: 100%;}
        #logocontainer, #logo{width: 100%;}
        footer{min-height: 300px; height: 100%;}
        
        #containerrow {
            display: flex;
           display: block;
        }
        #searchcontainer{width: 100%;}
        #search{padding:0px;}
        .searchinput{ width: 80%;}
        .searchbutton{ width: 15%;}
        .productgroupbox{width: 46%; margin:0px; margin-top: 20px;}
        .productgroupboxtitle{font-size: 14px;}
        #content{padding:0px;}
        .title{text-align: center;}
        ul.topnav{padding-top:0px;}
        #contentboxleft, #contentboxright{width: 100%}
        
        .registratietable{ margin: auto; width: 90%;}
        form h1, form h2, form, h3{text-align: center;}
        .caption{display: none !important;}
        a.callbacks_nav.callbacks1_nav.prev, a.callbacks_nav.callbacks1_nav.next {
           display: none;
           }
           
      .callbacks img{height: 75px;}
      #rightpanelstroke{ width: 90%;}    
      .box66, .box33{width: 100%}
      #content{min-height: 0px;}
      #productstable tr{ display: block; width: 100%; border-bottom:1px solid grey;}
      #productstable td{ display: block; width: 100% !important; text-align: center !important; border: none; margin-top: 5px;}
      .producttableprice{ border-bottom: none !important; width: 100%; text-align: center; margin:}
      .producttableprice tr{ border-bottom: none !important; }
      .producttableprice td{ margin-top: 0px !important; }
      table.stacktable.small-only, table.stacktable.small-only tr{ display:table; width: 100%;}
      .producttableroweven{background-color: lightgrey;}
      textarea.contactform_textarea { max-width: 57%;}
      .orderverzendmethode, .orderdetails{width: 100%; }
      
      table.stacktable.large-only{display:none;}
      .callbacks_container{display: none;}
      .productgroupuitgelicht{ width: 45%;}
      .twobox {width: 100% !important; text-align: center;}
      .threebox_content_alt h3 {
		    font-size: 12px;
		} */
          
  }

    @media all and (max-width: 850px) {
        form#navsearchform {
            width: 200px;
        }
    }

    @media all and (max-width: 810px) {
        form#navsearchform {
            width: 180px;
        }
    }

    @media all and (max-width: 790px) {
        form#navsearchform {
            width: 160px;
        }
    }
  
    @media all and (max-width: 767px) {
        .mobileshoppingcartbutton{
            display:block;
        }
    }