/* e 48 */
/* bootstrap overrulen */
.h1large{font-size: 28px;font-weight: 700;margin-bottom: 40px;}

.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
    color: #fff;
    background-color: navy;
}


.nav-pills > li.live > a {
    color: #fff;
    background-color: green;
}

.nav-pills > li.nietlive > a {
    color: #fff;
    background-color: red;
}

.nav > li > a:focus, .nav > li > a:hover {
    text-decoration: none;
    background: navy;
}

.product-tabs > ul {
    display: flex;
    margin-bottom: 15px
}
.product-tabs > ul li {
    /* background-color: transparent; */
    background-color: #F0EDF0;
    border: 1px solid navy;
    border-radius: 5px;
    display: flex;
    margin: 0 3px;
    position: relative
}
.product-tabs > ul li a {
    align-items: center;
    color: navy;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    justify-content: center;
    min-height: 32px;
    padding: 0 10px;
    text-align: center
}

 .product-tabs > ul li.active,  .product-tabs > ul li:hover {
    background: navy;
    box-shadow: none
}

 .product-tabs > ul li.active a,  .product-tabs > ul li:hover a {
    color: #fff;
    text-decoration: none
}

 .product-tabs > ul li.active::after,  .product-tabs > ul li:hover::after {
    border: solid transparent;
    border-top-color: navy;
    border-width: 8px;
    content: ' ';
    height: 0;
    left: 50%;
    margin-left: -8px;
    pointer-events: none;
    position: absolute;
    top: 100%;
    width: 0
}

 .product-tabs > ul li:first-child {
    margin-left: 0
}


.tab-pane {
border: 1px solid navy;
padding:10px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.25, #FFFFFF),color-stop(1, #F0EDF0));
background:-o-linear-gradient(top, #FFFFFF 25%, #F0EDF0 100%);
background:-moz-linear-gradient(top, #FFFFFF 25%, #F0EDF0 100%);
background:-webkit-linear-gradient(top, #FFFFFF 25%, #F0EDF0 100%);
background:-ms-linear-gradient(top, #FFFFFF 25%, #F0EDF0 100%);
background:linear-gradient(to top, #FFFFFF 25%, #F0EDF0 100%);
}


 .product-tabs .tab-content {
    margin-bottom: 10px;
    line-height: 21px;
    font-size: 13px;
    color: #666;
    display: none
}

 .product-tabs .tab-content:first-of-type {
    display: block
}

.pill-pane{
margin-left:30px;
margin-right:30px;
padding: 15px;
}

/* ex 261 */
.faq .faq-text h1 {
    margin-bottom: 0;
    line-height: 30px;
 color:var(--h1-koppenthema);
}

.faq .faq-text h2 {
    font-size: 16px;
    color: #949494;
    color:navy;
}

.faq .faq-wrapper {
    background-color: #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px
}

.faq .faq-wrapper .questions-wrapper {
    padding: 20px 0 10px
}

.faq .faq-wrapper .questions-wrapper .category {
    position: relative;
    margin-bottom: 30px
}

.faq .faq-wrapper .questions-wrapper .category .open-more-questions {
    position: absolute;
    top: 10px;
    right: 20px;
    color: #626262;
    text-decoration: none;
    cursor: pointer
}

.faq .faq-wrapper .questions-wrapper .category .open-more-questions:active,
.faq .faq-wrapper .questions-wrapper .category .open-more-questions:focus,
.faq .faq-wrapper .questions-wrapper .category .open-more-questions:visited {
    color: #626262
}

.faq .faq-wrapper .questions-wrapper .category .open-more-questions .questions-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 5px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    background-color: navy;;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%
}

.faq .faq-wrapper .questions-wrapper .category .open-more-questions .questions-icon.red {
    background-color: #F58220
}

.faq .faq-wrapper .questions-wrapper .category h2 {
    background-color: #f9f9f9;
    font-size: 15px;
    line-height: 20px;
    padding: 10px 10px 10px 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px
    color:navy;
}

.faq .faq-wrapper .questions-wrapper .category h2 img {
    float: left;
    margin-right: 15px
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view {
    margin-bottom: 0
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view.more-questions {
    display: none
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view.more-questions.opened {
    display: block
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item {
    margin-bottom: 6px
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .question-head {
    display: block;
    font-size: 13px;
    line-height: 20px;
    font-weight: 400;
    margin-bottom: 0;
    padding-left: 55px;
    color: #626262
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .question-head .li-status {
    float: left;
    width: 10px;
    margin-right: 8px;
    text-align: center
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .question-head .open-close-question {
    color: #626262;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    -ms-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .question-head .open-close-question:active,
.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .question-head .open-close-question:focus,
.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .question-head .open-close-question:visited {
    color: #626262
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .question-head .open-close-question:hover {
    text-decoration: underline
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .content {
    position: relative;
    display: none;
    padding-left: 15px
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item .content .close-current-question {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 12px;
    color: #fff;
    background-color: #FF8c00;
    padding: 1px 2px;
    cursor: pointer;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item.opened .question-head {
    font-weight: bold
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item.opened .content {
    display: block;
    background-color: #f9f9f9;
    margin: 10px 0;
    padding: 15px 40px 1px 55px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border:solid 1px navy;
}

.faq .faq-wrapper .questions-wrapper .category ul.questions-view li.questions-item.opened .content h3 {
    font-size: 15px;
    margin-bottom: 4px;
}

.closing {
    padding: 10px
}

.closing .list-group li a {
    color: #999
}





/* ex 499 */
.h1large{
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 40px;
}

img {
    max-width: 100% !important;
}



.spec.spec-row-prices p:nth-child(3), .attribute.spec-row-prices p:nth-child(3) {
    margin-bottom: -5px
}

.spec .spec-header, .attribute .spec-header {
    background-color: #f8f8f8;
    margin: 0 0 15px;
    padding: 10px;
    border: solid #CCC;
    border-width: 0;
    font-size: 15px;
    font-weight: 600;
    border-radius: 4px 4px 4px 4px;
    -webkit-border-radius: 4px 4px 4px 4px;
    -moz-border-radius: 4px 4px 4px 4px
}

.spec .spec-header .spec-number, .attribute .spec-header .spec-number {
    background-color:var(--selectorkoppen);
    display: inline-block;
    margin: -10px 15px -10px -10px;
    padding: 10px 7px;
    width: 40px;
    font-size: 15px;
    text-align: center;
    color: #FFF;
    border-radius: 4px 0 0 4px;
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px
}




.spec .spec-content, .attribute .spec-content {
    display: block;
    width: 100%;
    margin-bottom: 20px;
    padding: 0
}

.spec .spec-label, .attribute .spec-label {
    font-weight: 400
}


.spec .spec-header-reset{
float: right;
}

.spec .spec-values, .attribute .spec-values {
    list-style: none;
    padding: 0;
    margin: 0
}

.spec .spec-values .spec-value, .attribute .spec-values .spec-value {
   /*width: 50%;*/
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: top;
    position: relative
}



.spec-values .spec-value2 {
    /*width: 50%;*/
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: top;
    position: relative
}

.spec .spec-values .spec-value .spec-label, .attribute .spec-values .spec-value .spec-label {
    position: relative;
   width: 100%;
    cursor: pointer;
    line-height: 20px
}

.spec .spec-values .spec-value .spec-label.tag-present .spec-text,
.attribute .spec-values .spec-value .spec-label.tag-present .spec-text {
    margin-right: 6px
}

.spec .spec-values .spec-value label, .attribute .spec-values .spec-value label {
    line-height: 20px
}

.spec .spec-values .spec-value.spec-selected .spec-subtext, .spec .spec-values .spec-value.spec-selected .spec-sublabel,
.spec .spec-values .spec-value.spec-selected .spec-text, .spec .spec-values .spec-value.spec-selected .spec-text-alt,
.attribute .spec-values .spec-value.spec-selected .spec-subtext,
.attribute .spec-values .spec-value.spec-selected .spec-sublabel,
.attribute .spec-values .spec-value.spec-selected .spec-text, .attribute .spec-values .spec-value.spec-selected .spec-text-alt {
    color: #00b900;
    font-weight: 600;
}



.spec.spec-grid .spec-content, .attribute.spec-grid .spec-content {
    padding: 0
}
/*
.spec.spec-grid .spec-value, .attribute.spec-grid .spec-value {
    width: 25%
}
*/
.spec.spec-grid .spec-value.spec-selected .spec-label, .attribute.spec-grid .spec-value.spec-selected .spec-label {
    border-color: #00b900;
    background-color: #fafefa;
    color: #444
}



.spec.spec-grid .spec-value .spec-label, .attribute.spec-grid .spec-value .spec-label {
    margin-bottom: 15px;
    padding: 0 0 10px;
    text-align: center;
    border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px
}

.spec.spec-grid .spec-value .spec-label .spec-text, .attribute.spec-grid .spec-value .spec-label .spec-text {
    display: block;
    padding: 0 5px
}


.spec.spec-grid .spec-value:hover .spec-label, .attribute.spec-grid .spec-value:hover .spec-label {
    border-color: #CCC
}

.spec.spec-grid .spec-radio, .attribute.spec-grid .spec-radio {
    display: none
}

.spec.spec-grid .spec-label, .attribute.spec-grid .spec-label {
    border: 1px solid transparent
}

.spec.spec-grid .spec-label:hover, .attribute.spec-grid .spec-label:hover {
    border-color: #CCC
}

.spec.spec-grid .spec-info, .attribute.spec-grid .spec-info {
    position: absolute;
    top: 5px;
    right: 5px;
    padding: 5px;
    font-size: 15px;
    line-height: 15px;
    color: #8863A8
}

.spec .spec-radio, .attribute .spec-radio {
    pointer-events: none;
    vertical-align: middle
}

.spec.spec-labels .spec-values .spec-value, .attribute.spec-labels .spec-values .spec-value {
    margin: 0;
    padding: 0 10px;
    border-radius: 5px 0 5px 5px;
    -webkit-border-radius: 5px 0 5px 5px;
    -moz-border-radius: 5px 0 5px 5px
}

.spec.spec-labels .spec-values .spec-value .spec-label, .attribute.spec-labels .spec-values .spec-value .spec-label {
    padding: 5px 10px 5px 20px
}

.spec.spec-labels .spec-values .spec-value:hover, .attribute.spec-labels .spec-values .spec-value:hover {
    background-color: #f8f8f8
}


.spec.spec-labels.spec-filled + .spec-labels, .attribute.spec-labels.spec-filled + .spec-labels {
    opacity: 1
}

.spec .spec-disabled, .attribute .spec-disabled {
cursor: not-allowed;
}

.spec .spec-disabled .spec-label, .attribute .spec-disabled .spec-label {
    cursor: not-allowed !important
}

.spec .spec-value .spec-label, .attribute .spec-value .spec-label {
    padding: 0 20px
}

.spec .spec-value.spec-selected .spec-radio:before, .spec .spec-value.spec-selected .spec-checkbox:before,
.attribute .spec-value.spec-selected .spec-radio:before, .attribute .spec-value.spec-selected .spec-checkbox:before {
    background-color: #00b900;
    border-color: #00b900
}

.spec .spec-value .spec-radio input[type="radio"], .spec .spec-value .spec-radio input[type="checkbox"],
.spec .spec-value .spec-checkbox input[type="radio"], .spec .spec-value .spec-checkbox input[type="checkbox"],
.attribute .spec-value .spec-radio input[type="radio"], .attribute .spec-value .spec-radio input[type="checkbox"],
.attribute .spec-value .spec-checkbox input[type="radio"], .attribute .spec-value .spec-checkbox input[type="checkbox"] {
    display: none
}

.spec .spec-value .spec-radio:before, .spec .spec-value .spec-checkbox:before,
.attribute .spec-value .spec-radio:before, .attribute .spec-value .spec-checkbox:before {
    display: inline-block;
    font: normal normal normal 14px / 1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f00c";
    display: block;
    position: absolute;
    left: 0;
    top: 15px;
    width: 14px;
    height: 14px;
    background-color: #FFF;
    border: 1px solid #8b8b8b;
    color: #fff;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s
}

.spec .spec-value .spec-checkbox:before, .attribute .spec-value .spec-checkbox:before {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0
}



/* prijstabel overzicht */

.prijsoverzicht {
    width: 100%;
    background-color: #FFF;
    margin: 0;
    border-collapse: separate;
    margin-bottom: 20px !important
}

.prijsoverzicht .date-content {
    font-size: 12px;
    font-weight: normal
}

.prijsoverzicht a {
    text-decoration: none
}

.prijsoverzicht td, .prijsoverzicht th {
    text-align: center;
    padding: 0
}

.prijsoverzicht td:first-child, .prijsoverzicht th:first-child {
    border-left: none
}

.prijsoverzicht td:last-child, .prijsoverzicht th:last-child {
    border-right: none
}

.prijsoverzicht thead th {
    position: relative;
    padding: 14px 5px;
    border-bottom: 1px solid #eaeaea;
    background-color: #eaeaea;
    color: #333;
    line-height: 16px;
    font-weight: 400
}

.prijsoverzicht thead th:first-child {
    font-weight: 600;
    border-radius: 5px 0 0;
    -webkit-border-radius: 5px 0 0;
    -moz-border-radius: 5px 0 0
}

.prijsoverzicht thead th .fa {
    display: inline-block;
    position: relative;
    font-size: 16px;
    color: #F58220;
    vertical-align: bottom
}

.prijsoverzicht thead th .date-content {
    font-size: 13px;
    font-weight: 600
}

.prijsoverzicht thead th .date-label {
    font-size: 13px
}

.prijsoverzicht thead th .date-time {
    position: relative;
    display: inline-block;
    margin: 2px 0 0 5px;
    padding: 2px 6px 1px;
    background-color: #F58220;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    cursor: default;
    border-radius: 5px 0 5px 5px;
    -webkit-border-radius: 5px 0 5px 5px;
    -moz-border-radius: 5px 0 5px 5px
}

.prijsoverzicht tbody tr td {
    position: relative
}

.prijsoverzicht tbody tr td:before, .prijsoverzicht tbody tr td:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #eaeaea
}

.prijsoverzicht tbody tr td:before {
    top: -1px;
    z-index: 2
}

.prijsoverzicht tbody tr td:after {
    bottom: 0;
    z-index: 3
}

.prijsoverzicht tbody tr:hover td {
    position: relative;
    background-color: #e5f8e5
}

.prijsoverzicht tbody tr:hover td a.event-offer {
    background-color: #e5f8e5
}

.prijsoverzicht tbody tr:hover td.current {
    background-color: #a3dda3
}

.prijsoverzicht tbody tr:hover td:before, .prijsoverzicht tbody tr:hover td:after {
    background-color: #99e399
}

.prijsoverzicht tbody tr:hover td:before {
    z-index: 3
}

.prijsoverzicht tbody tr a {
    color: #333;
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    -ms-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s
}

.prijsoverzicht .amount {
    font-weight: bold;
    background-color: #f8f8f8;
    width: 150px
}

.prijsoverzicht tbody td.current {
    background-color: #00b900
}


.prijsoverzicht tbody td.currentaantal {
    background-color: #99e399;
    color: #fff
}

.prijsoverzicht tbody td.currentalternatief {
    border: 2px solid #99e399;
    background-color: #f8f8f8;
    /*color: #fff*/
}

.prijsoverzicht tbody td.current a {
    color: #fff;
    font-weight: 600
}

.prijsoverzicht tbody td.current:hover {
    background-color: #00b900 !important
}

.prijsoverzicht tbody td.current:hover a {
    color: #fff;
    font-weight: 600
}

.prijsoverzicht tbody td:not(.amount):hover {
    background-color: #00b900;
    color: #fff
}

.prijsoverzicht tbody td:not(.amount):hover a {
    color: #fff;
    font-weight: 600
}

.prijsoverzicht tbody td:not(.amount):hover a.event-offer {
    font-weight: 400;
    text-decoration: underline
}

.prijsoverzicht tbody td a.event-offer {
    background-color: #fff;
    color: #F58220 !important
}

.prijsoverzicht tbody td a, .prijsoverzicht tbody td.amount span {
    padding: 8px 0;
    display: block;
    font-weight: 400
}

.prijsoverzicht tbody td.amount:first-child span {
    font-weight: 600
}

.prijsoverzicht tfoot td {
    padding: 0;
    background-color: #f8f8f8
}

.prijsoverzicht tfoot td.steps-added .steps-limit {
    margin: -12px 0 0 0
}

.prijsoverzicht tfoot td.steps-added .quantity-limit {
    margin: 7px 0 8px
}

.prijsoverzicht tfoot .quantity-limit {
    margin: 15px 0;
    color: #888
}

.prijsoverzicht tfoot .steps-limit {
    margin: 10px 0;
    color: #888
}

.prijsoverzicht caption {
    position: relative;
    border-top: 1px solid #ccc;
    border-radius: 5px 0 0;
    -webkit-border-radius: 5px 0 0;
    -moz-border-radius: 5px 0 0;
    border-bottom: 0;
    padding: 7px;
    background-color: #FFF;
    font-weight: bold
}

.prijsoverzicht caption .fa {
    font-size: 16px;
    color: #000;
    margin-left: 10px !important;
    margin-right: 10px !important;
    position: relative
}

.prijsoverzicht:last-child {
    margin-bottom: 0 !important
}

.prijsoverzicht .discount-price {
    padding: 0 10px;
    text-decoration: line-through;
    color: #bebebe;
    font-size: 12px
}

.prijsoverzicht .piece-price {
    padding: 0 10px;
    color: #444;
    font-size: 12px
}

.prijsoverzicht .noticeManual {
    display: none;
    line-height: 38px;
    font-size: 11px;
    color: #8863A8
}

.prijsoverzicht .calc-button {
    display: block;
    float: left;
    width: 35px;
    height: 51px;
    margin-left: -53px;
    padding: 20px 1px;
    line-height: 1px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    background-color: transparent;
    border: 0;
    outline: none
}

.bg_lichtgoen{border:1px solid #00b900;background-color:#e5f8e5;}
.navy-ruler{border-top: 1px solid navy;}


/* product keuze controle */

.product-summary-wrapper {
    margin-top: 30px
}

#summary .btn-block {
    width: 100%;
    font-size: 16px;
    padding: 14px 10px
}

#summary .btn-block .fa {
    font-size: 20px;
    margin-right: 5px
}

.product-summary {
    display: block;
    background-color: #fff;
    width: 100%;
    margin-bottom: 30px
}

.product-summary .specs label {
    font-weight: 600
}

.product-summary .specs .btn-block {
    width: 100%;
    padding: 10px 15px
}

.product-summary .specs .btn.large {
    padding: 14px 15px
}

.product-summary .specs .btn.large .fa {
    margin-left: 5px
}

.product-summary .specs .remove-last-bottom > * :last-child {
    margin-top: 15px
}

.product-summary .specs .strike-through {
    text-decoration: line-through
}

.product-summary .overview-actions .disable-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 10;
    -moz-opacity: .75;
    -khtml-opacity: .75;
    -webkit-opacity: .75;
    opacity: .75;
    -ms-filter: progid: DXImageTransform.Microsoft.Alpha(opacity=75);
    filter: alpha(opacity=75)
}

.product-summary .overview-actions .explanation {
    display: none;
    width: 330px !important;
    margin-left: -165px !important;
    display: block;
    opacity: 1;
    top: -100px;
    bottom: auto;
    left: 105px;
    text-align: center
}

.product-summary .overview-alt > span {
    display: table
}


/* btw aan uit switch */
.change-tax-view {
    position: absolute;
    top: 2px;
    right: 10px;
    font-size: 13px;
    line-height: 38px
    color:#fff;
}

.label-lhn label, .label-lhn span {
    line-height: 21px
}

.action-notice {
    position: relative;
    float: left;
    width: 100%;
    margin: 20px 0 10px;
    padding: 10px;
    background-color: #fbffbf;
    color: #767c1e;
    line-height: 22px;
    font-size: 13px;
    text-align: center;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px
}

.action-notice strong {
    font-weight: 600
}

.highlight {
    color: #00b900;
    font-weight: bold
}

.keuze_gemaakt{
color:#00b900;
margin-right:30px;
/*float:right;*/
}

/* loader css start */
/*
.loader{
 position:fixed; top:100;
 left:100; right:100; bottom:100;     
 background:rgba(255,255,255,.8);
 padding-top:150px;
 padding-top:20px;
 z-index:99999;
}


.spinner {
    margin: 0 auto;
    height: 64px;
    width: 64px;
    animation: rotate 0.8s infinite linear;
    border: 5px solid #FF8c00;
    border-right-color: transparent;
    border-radius: 50%;
}
*/
/* loader css einde */

.loader {
    width: 64px;
    height: 64px;
     margin: 0 auto; /* hor centreren */
    display: block;
    -webkit-animation: spin .6s linear infinite;
    animation: gh-spin .6s linear infinite;
    background: url('/cache/images/spinner30x30.svg');
 margin-top:150px;

}

@keyframes gh-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}


.witruimte{min-width:20px;}



label.explanation, span.explanation {
    display: none;
    position: absolute;
    bottom: 30px;
    left: 50%;
    font-family: 'Open Sans', sans-serif;
    background-color: #000;
    color: #fff;
    font-weight: 400;
    padding: 10px;
    width: auto;
    max-width: 440px;
    z-index: 79;
    line-height: 21px !important;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid: DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    box-shadow: 0 1px 10px #545454;
    -webkit-box-shadow: 0 1px 10px #545454;
    -moz-box-shadow: 0 1px 10px #545454
}

label.explanation img, span.explanation img {
    border-radius: 9px 9px 0 0;
    -webkit-border-radius: 9px 9px 0 0;
    -moz-border-radius: 9px 9px 0 0
}

label.explanation:after, label.explanation:before, span.explanation:after,
span.explanation:before {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
}

label.explanation:after, span.explanation:after {
    border-color: rgba(0, 0, 0, 0);
    border-top-color: #000;
    border-width: 8px;
    margin-left: -8px
}

label.explanation:before, span.explanation:before {
    border-color: rgba(150, 150, 150, 0);
    border-top-color: #000;
    border-width: 9px;
    margin-left: -9px
}

label.explanation.white-bg, span.explanation.white-bg {
    background-color: #fff;
    color: #000;
    padding: 10px !important;
    box-shadow: 0 0 0 #545454;
    -webkit-box-shadow: 0 0 0 #545454;
    -moz-box-shadow: 0 0 0 #545454;
    border: 1px solid #CCC
}

label.explanation.white-bg img, span.explanation.white-bg img {
    position: relative;
    width: 438px;
    max-width: 438px;
    margin-left: -10px;
    margin-top: -10px;
    margin-bottom: 5px
}

label.explanation.white-bg:after, label.explanation.white-bg:before,
span.explanation.white-bg:after, span.explanation.white-bg:before {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
}

label.explanation.white-bg:after, span.explanation.white-bg:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-color: #fff;
    border-width: 8px;
    margin-left: -8px
}

label.explanation.white-bg:before, span.explanation.white-bg:before {
    border-color: rgba(150, 150, 150, 0);
    border-top-color: #CCC;
    border-width: 9px;
    margin-left: -9px
}

label.explanation.explanation-date-time, span.explanation.explanation-date-time {
    width: 300px;
    background-color: #444;
    border:solid 4px #FF8c00;
    background-image:url('../images/bokeh_background.png');
    line-height: 18px !important;
    box-shadow: 0 0 0 #545454;
    -webkit-box-shadow: 0 0 0 #545454;
    -moz-box-shadow: 0 0 0 #545454
}

label.explanation.explanation-date-time:after, span.explanation.explanation-date-time:after {
    border-top-color: #444
}

label.explanation.explanation-date-time:before, span.explanation.explanation-date-time:before {
    border-top-color: #444
}


.card>.badge{position:absolute;top:6px;left:6px}
.card>.badge-underlay .badge{display:block}
.card-badge .badge:nth-child(n+2){margin-top:6px}
.card-badge{position:absolute;top:6px;left:6px}
.card-badge-text{top:6px;left:6px;margin-left:4px;}

/* einde badges */