body {
    min-height: 100vh;
    background-image: linear-gradient(to bottom, #dddddd, #eeeeee, #f7f7f7, #f7f7f7, #f7f7f7);

}

.container {
    background: #fff;
    padding: 8vw 30px;
}

h1, h2, h3, h4 {
    font-family: 'Alfa Slab One', cursive;
    color: #375057;
}

h5 {
    font-weight: bold;
    color: #375057;
}

h5 em {
    font-style: normal;
    text-transform: none;
    font-weight: normal;
    font-size: 15px;
}

dd, dt {
    margin-bottom: 5px;
}
a {
    color: #069;
}

a:hover {
    color: #17a;
}

.header-container, footer.container {
    color: #fff;
    background: #375057;
}

.header-container {
    background: #1e2d34 url(/img/top_bg_fade.jpg) no-repeat top center;
    background-size: cover;

}

.header-row {
    width: 100%
}

.header-row.first {
    padding: 3vw 0;
}

img.logo {
    height: 70px;
    margin-bottom: 20px
}

footer .logo {
    max-width: 160px;
    height: auto;
}


.basket {
    width: 24px;
    height: 24px;
}

.navbar.navbar-expand-md {
    align-items: flex-start;
    justify-content: flex-start;
    padding-bottom: 0rem;
    flex-direction: column;
    margin-right: -20px;
}


.nav-tabs {
    border-bottom: none;
}


.btn-secondary {

    background: #375057dd;

}

.btn-secondary:hover {

    background: #375057;

}


.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    background: #182025dd;
    color: #fff;
}

.nav-tabs .nav-link {
    margin-bottom: 0px;
    margin-right: 1px;
    background: #18202599;
    border: none;
    color: #eee;
}

.navbar-expand-md .navbar-nav .nav-link {
    padding-right: 0.9rem;
    padding-left: 0.9rem;
}


.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .show > .nav-link,
.navbar-dark .navbar-nav .nav-link.active:hover,
.navbar-dark .navbar-nav .show > .nav-link:hover {
    color: #375057;
    background: #fff
}


.referens {
    padding: 3vw calc(var(--bs-gutter-x) / 2);
    border-top: 1px solid #eee;
}


.farger a {
    display: inline-block;
    width: 50px;
    height: 50px;
    margin: 0 5px 8px 0;
    box-shadow: 0px 2px 4px #ccc;
    transition: all 0.5s ease;
    border-radius: .25rem!important;
}

.farger a:hover {
    box-shadow: 0px 5px 10px #666;
}

.thumb {
    display: inline-block;
    margin: 0 10px 10px 0;
    box-shadow: 0px 2px 4px #fff;
    transition: all 0.5s ease;
}

.thumb img {max-width:100%; height: auto; }

.thumb:hover {
    box-shadow: 0px 10px 20px #37505799;
}


.farger a img {
    width: 100%;
    height: auto;
}

.price {
    white-space: nowrap;
}

.card.product-card {
    cursor: pointer;
     box-shadow: 0px 2px 4px #fff;
    transition: all 0.5s ease;
}

.card.product-card:hover {
     box-shadow: 0px 5px 10px #aaa;
    
}

.card.team {width: 45%;}
.relative {position: relative;}
.deleteItem {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 120px;
    border: 0;
    text-align: right;
    text-decoration: none;}

.card {
    width: 100%;
}

.cards.row > .col {
    display: flex;
}

.card-header {
    background-color: #fff
}

a.more {
    display: inline-block;
    float: right;
}

img.checkout-img {
    width: 100%;
}


@media (max-width: 768px) {
    
    .deleteItem {
    position: relative;
    padding-bottom: 20px;
    display: block;
    text-align: left;
}

    .thumb {width: 45%;}
    
    .header-container {padding: 20px 0;
    background-position: top center;
    background-size: 150%;
        
    }
    .header-container .header-row,
    .header-container .header-row.first{
    padding: 3vw 20px;
}
    
    .card.team {width: 100%;}
    svg.bi.flex-shrink-0.me-1 {display: none;}
    
    .navbar-expand-md .navbar-nav .nav-link,
    .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .show > .nav-link,
    .navbar-dark .navbar-nav .nav-link.active:hover, .navbar-dark .navbar-nav .show > .nav-link:hover {
    padding: 7px 0;
    background: transparent;
    margin: 0;
}
     .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .show > .nav-link,
    .navbar-dark .navbar-nav .nav-link.active:hover, .navbar-dark .navbar-nav .show > .nav-link:hover
    {color: #fff;}
    
    dt.col-2.half, dd.col-4.half {width: 50%; }