@import url('https://fonts.googleapis.com/css?family=Poppins:600,500,400');

:root {
    --base: #08090a;
    --base-a90: rgba(8, 9, 10, 0.9);
    --base-a80: rgba(8, 9, 10, 0.8);
    --base-a70: rgba(8, 9, 10, 0.7);
    --base-a60: rgba(8, 9, 10, 0.6);
    --base-a50: rgba(8, 9, 10, 0.5);
    --base-a40: rgba(8, 9, 10, 0.4);
    --base-a30: rgba(8, 9, 10, 0.3);
    --base-a20: rgba(8, 9, 10, 0.2);
    --base-a10: rgba(8, 9, 10, 0.1);
    --base-a5: rgba(8, 9, 10, 0.05);
    --base-100: #08090a;
    --base-90: #202428;
    --base-80: #363d44;
    --base-70: #4d5760;
    --base-60: #64707d;
    --base-50: #7d8a97;
    --base-40: #99a3ad;
    --base-30: #b5bdc4;
    --base-20: #d2d6db;
    --base-10: #eef0f1;
    --base-0: #f9fafa;
    --blue-50: #fafdfe;
    --blue-100: #fafdfe;
    --blue-200: #d6e9fa;
    --blue-300: #a8d1f5;
    --blue-400: #71b4ef;
    --blue-500: #1f89e5;
    --blue-600: #197ed7;
    --blue-700: #1776c9;
    --blue-800: #1466ae;
    --blue-900: #125b9b;
}

html {
    font-size: 16px;
}

body {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    line-height: 1.75;
    color: #4d5760;
}

h1,
h2,
h3,
h4,
h5 {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    line-height: 1.3;
}

h1,
h2 {
    font-size: 1.067rem !important;
    margin-bottom: 1rem;
}

tr h2 {
    font-size: 13px !important;
}

h3 {
    font-size: 1.215rem;
}

h4 {
    font-size: 1.138rem;
}

h5 {
    font-size: 1.067rem !important;
}

p {
    margin-bottom: 1rem !important;
    font-size: 0.8125rem !important;
    color: #4d5760 !important;
}

.auction-text,
.auction-text *,
.vrijdagveiling-container p,
div#pnlAuctions p,
div#pnlSpotlight p {
    font-size: 0.937rem !important;
}

.common-menu-panel p,
.profile-menu-panel p {
    margin-bottom: 0.2rem !important;
}

.left-heading {
    font-size: 1.067rem !important;
}

a:hover {
    text-decoration: none;
}

a.home-link,
a.home-link *,
a.article-link,
a.article-link * {
    font-size: 1.138rem !important;
}

.small.button {
    font-size: 0.8125rem !important;
}

.small:not(.button),
.text_small {
    font-size: 0.8125rem !important;
}


.text_small {
    margin-bottom: 1rem !important;
}

p.bids,
p.currentbid,
p.location {
    margin: 10px 0 10px 0;
}

.block, .spotlight {
    border-radius: 4px !important;
}

.section-bottom-spacing {
    margin-bottom: 20px !important;
}

.button {
    box-shadow: none !important;
    text-transform: none;
    font-weight: 500;
}

.button.search {
    padding: 8px 5px;
}

.ribbon-left span {
    font-size: 12px;
    line-height: 21px;
}

time.icon {
    border: 1px solid #eef0f1;
    box-shadow: none;
    border-radius: 4px;
    height: 100px;
}

.time {
    font-size: 1px;
    letter-spacing: 0.03rem;
    color: #64707d;
}

time.icon em {
    font-size: 12px;
    font-weight: 600;
}
 
time.icon em label {
    font-weight: 400;
}

time.icon strong {
    color: #363d44;
    background-color: inherit;
    background-color: initial;
    border-bottom: 1px solid #eef0f1;
    box-shadow: none;
}

ul.tabs-content.contained > li {
    border: none;
    padding: 20px !important;
}

ul.tabs-content,
div.container-box {
    box-shadow: 
        0 0.3px 0.3px -6px rgba(0, 0, 0, 0.011), 
        0 0.8px 0.8px -6px rgba(0, 0, 0, 0.016), 
        0 1.5px 1.5px -6px rgba(0, 0, 0, 0.02), 
        0 2.7px 2.7px -6px rgba(0, 0, 0, 0.024), 
        0 5px 5px -6px rgba(0, 0, 0, 0.029), 
        0 12px 12px -6px rgba(0, 0, 0, 0.04);
}

ul.tabs-content:hover,
div.container-box:hover {
    box-shadow: 
        0 0.3px 0.3px -6px rgba(0, 0, 0, 0.028), 
        0 0.8px 0.8px -6px rgba(0, 0, 0, 0.04), 
        0 1.5px 1.5px -6px rgba(0, 0, 0, 0.05), 
        0 2.7px 2.7px -6px rgba(0, 0, 0, 0.06), 
        0 5px 5px -6px rgba(0, 0, 0, 0.072), 
        0 12px 12px -6px rgba(0, 0, 0, 0.1);
}

ul.tabs-content,
div.container-box {
    margin-bottom: 24px;
    transition: box-shadow 0.3s;
    padding: 16px !important;
}

li > div.container-box {
    padding: 12px !important;
}

.container-box {
    border-radius: 6px !important;
}

ul.tabs-content {
    border-bottom-right-radius: 6px !important;
    border-bottom-left-radius: 6px !important;
}

.article .three.mobile-two.columns.text-right {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
}

div.hasCountdown {
    font-size: 16px;
}

#myAddBidBox,
#myAddAutoBidBox,
#biedenAutoBodTab > div > div:nth-child(2),
#biedenNormaalBodTab > div > div:nth-child(2) {
    text-align: right;
}

#tbSearchBox {
    padding-left: 24px;
}

a img:not(#pnlSearchLoggedIn a img):not(.tabs a img) {
    max-height: unset !important;
    border-radius: 4px;
}

img.thumbview-list,
img.thumb-home {
    border-radius: 4px;
}

.information-box {
    background-color: #f9fafa;
    border-radius: 6px;
    padding: 6px 6px 12px 6px;
    margin-top: 12px !important;
    margin-bottom: 12px !important;
    margin-left: -6px !important;
    margin-right: -4px !important;
}

.information-box p {
    color: #4d5760 !important;
}

.information-box .small,
.information-box .small *{
    font-size: 0.8125rem !important;
}

footer > div {
    background: #F5F5F5;
    margin-top: 100px;
}

.common-menu-panel, 
.profile-menu-panel {
    border-color: white !important;
    border-radius: 6px;
    box-shadow: 
        0 0.3px 0.3px -6px rgba(0, 0, 0, 0.028), 
        0 0.8px 0.8px -6px rgba(0, 0, 0, 0.04),
        0 1.5px 1.5px -6px rgba(0, 0, 0, 0.05), 
        0 2.7px 2.7px -6px rgba(0, 0, 0, 0.06), 
        0 5px 5px -6px rgba(0, 0, 0, 0.072), 
        0 12px 12px -6px rgba(0, 0, 0, 0.1);
}

.common-menu-panel li a:not(.button), 
.profile-menu-panel li a:not(.button) {
    border-bottom: 2px solid white;
    color: #1e88e5 !important;
    margin-left: 6px;
}

.common-menu-panel li a:not(.button):hover, 
.profile-menu-panel li a:not(.button):hover {
    border-bottom: 2px solid #1e88e5;
}

/* Vacature pagina - blok rechts */
.big-image-container p {
    color: white !important;
}

/* Alle pagina's  - zoekbalk */
.home-search-box,
.button.search {
    border: none !important;
    border-radius: 0px !important;
}
.home-search-box {
    border-top-left-radius: 6px !important;
    border-bottom-left-radius: 6px !important;
}
.button.search {
    border-top-right-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
}

/* Overwrite left-menu buttons to link style */
.three.mobile-four.columns.hide-for-small .button:not(.button-left) {
    padding: 0;
    background-color: inherit;
    padding: initial;
    background-color: initial;
    border-radius: 0;
    border-bottom: 2px solid transparent;
}
.three.mobile-four.columns.hide-for-small .button.success:not(.button-left) {
    color: #009600;
}
.three.mobile-four.columns.hide-for-small .button.success:hover:not(.button-left) {
    border-color: #009600;
}
.three.mobile-four.columns.hide-for-small .button.secondary:not(.button-left) {
    color: #1360a4;
}
.three.mobile-four.columns.hide-for-small .button.secondary:hover:not(.button-left) {
    border-color: #1360a4;
}

/* Overwrite left menu headings */
.three.mobile-four.columns.hide-for-small h1,
.three.mobile-four.columns.hide-for-small h2 {
    color: #363d44;
}

/* Small timer styling left menu + photo gallery */
.endtime {
    background-color: #d6e9fa;
    color: #1776c9;
    border-radius: 6px;
    padding: 6px 12px;
}
.small.endtime {
    font-size: 12px;
    padding: 6px;
    margin: 12px 12px 0px 12px;
    display: block;
}

.time-special {
    display: flex !important;
    margin: 12px 0px 0px 0px !important;
}
.time-special > div {
    display: inline-block;
    margin: auto;
    padding-right: 5px;
}
.time-special>a.button-left {
    margin-left: auto;
}

.product-counter {
    background-color: #d6e9fa;
    color: #1776c9;
    border-radius: 6px;
    padding: 6px 12px;
    margin-top: 12px;
    display: inline-block;
    width: 100%;
    max-width: 200px;
    text-align: center;
}

.product-counter:empty{
    display: none;
}

.scrollToTopContainer {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 100;
    opacity: 0;
    transform: translateY(100px);
    transition: all .5s ease
}

.showBtn {
    opacity: 1;
    transform: translateY(0)
}

.vrijdagveiling-item:not(:first-of-type) {
    display: none;
    opacity: 0;
}

.vrijdagveiling-item .bid-container .label,
.vrijdagveiling-item .bid-container span#CurrentBid {
    font-size: 1.138rem !important;
}

.vrijdagveiling-item #NumberOfBids {
    color: #4d5760 !important;
}

.bid-container {
    padding-top: 5px;
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .row {
        width: 90%;
    }
}

@media only screen and (min-width: 1024px) {
    .row {
        width: 75%;
    }
}

@media only screen and (max-width: 767px) {
    .row {
        padding: 0.5%;
    }

    html {
        font-size: 14px;
    }

    ul.tabs-content,
    div.container-box {
        margin-bottom: 12px;
        transition: box-shadow 0.3s;
        padding: 6px !important;
    }

        div.container-box.article {
            margin: 10px -15px;
        }

    .row.show-for-small {
        margin-top: 12px;
    }

    p {
        font-size: 0.937rem !important;
    }

    .small.button {
        font-size: 0.937rem !important;
    }

    .small:not(.button),
    .text_small {
        font-size: 0.937rem !important;
    }

    .ribbon-left {
        margin-left: 15px;
    }
}