html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

a {
    color: black;
}

@media (max-width: 768px) {
    #produktsida #teknisk-info label {
        font-weight: bold;
    }

    #produktsida #teknisk-info .row {
        margin-bottom: 5px;
    }
}


#underniva .nav-link {
    font-size: 18px;
}

@media (max-width: 767px) {

    #underniva .navbar-nav {
        padding-left: 10px !important;
    }

    #underniva .navbar-nav li {
        text-align: left;
    }

    #topniva .navbar-toggler {
        display: none;
    }
}

@media (min-width: 768px) {

    #topniva .navbar {
        padding-top: 25px;
        /*margin-bottom: 1rem;*/
    }

    #topniva .navbar-brand-hallare {
        position: relative;
        min-width: 140px;
        min-height: 60px;
    }

    #topniva .navbar-brand {
        position: absolute;
        bottom: -7px;
        left: 0;
    }
}



@media (min-width: 576px) {

    #underniva {
        display: flex;
    }

}


@media (max-width: 575px) {

    #topniva .navbar-toggler {
        display: block;
    }

    #underniva {
        display: none;
    }

    #underniva .navbar-nav li .detaljmeny.show {
        width: 100% !important;
    }
}


h2, .h2 {
    font-size: 30px !important;
}

h3, .h3 {
    font-size: 20px !important;
}
h4, .h4 {
    font-size: 16px;
}

h5, .h5 {
    font-size: 14px;
}

.datepicker {
    width: 140px;
    background-color: white !important;
}

.utan-text-decoration {
    text-decoration: none;
}


@media (min-width: 768px) {
    .bild-mitten {
        display: inline-block;
        position: relative;
    }

        .bild-mitten img {
            margin: 0 auto;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate3d(-50%, -50%, 0);
            padding: 10px;
        }
}

#TopbannerKarusell {
    position: relative;
    width: 100%;
    margin: auto;
}

    #TopbannerKarusell img {
        width: 100%;
        display: none;
    }

        #TopbannerKarusell img.visaTopbannerKarusellbild {
            display: block;
        }

    #TopbannerKarusell button {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 2rem;
        padding: 10px 15px;
        border-radius: 4px;
        background-color: hsla(0, 0%, 0%, 0.2);
        color: white;
        border: none;
        cursor: pointer;
    }

    #TopbannerKarusell .prev {
        left: 0;
    }

    #TopbannerKarusell .next {
        right: 0;
    }

#filterDiv {
    background-color: #fff;
    border: 1.5px solid lightgray;
    border-radius: 10px;
    margin-right: 5px;
    margin-bottom: 15px;
    padding-top: 10px;
}

    #filterDiv .rensa-val-behallare {
        text-align: center;
    }

    #filterDiv button {
        margin: 10px 0;
        background-color: #99CC33;
        color: white;
    }

    #filterDiv a {
        text-decoration: none;
        color: black;

    }
#ProdukterSida .bildhallare {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    border: 1px solid lightgray;
    border-radius: 4px;
    margin: 5px;
}

#ProdukterSida .fargad {
    background-color: #f9f9f9;
}

#ProdukterSida hr {
    margin: 0;
}

#ProdukterSida .innehall {
    height: calc(100% - 10px);
    padding-left: 5px;
    margin: 5px;
}
/*#ProdukterSida img.fluid {
    max-width: 100%;
    max-height: 100%;
    aspect-ratio: initial;
}
*/
.artiklarna.Gom {
    display: none;
}

.antal-i-resultat-div strong {
    font-size: 1.2em;
}

.puff {
    border: 1.5px solid lightgray;
    border-radius: 10px;
}

    .puff .produkt-behallare {
        text-align: center;
        height: 175px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .puff .produkt-textbehallare {
        text-align: center;
        margin: 5px 10px 10px 10px;
        background-color: #99cc33;
        height: 55px;
        max-width: 349px;
        padding: 3px 5px 5px 5px;
        border-radius: 10px;
    }


@media (min-width: 991px) {
    #produktsida .kopknapp-hallare {
        /*position: absolute;*/
        bottom: 16px;
    }    

}

@media (max-width: 992px) {
    #produktsida .kopknapp-hallare {
        margin-bottom: 25px;
    }
}

.btn.gron {
    background-color: #9c3;
    border-color: #9c3;
    color: white;
    vertical-align: bottom;
}

.fa-shopping-cart.gron {
    color: #9c3;
}

table.autonumrering {
    counter-reset: rowNumber;
}

    table.autonumrering tbody tr {
        counter-increment: rowNumber;
    }

        table.autonumrering tbody tr td:first-child::before {
            content: counter(rowNumber);
            min-width: 1em;
            margin-right: 0.5em;
        }


.modal-header {
    background-color: #9c3;
}

    .modal-header .stang {
        border-radius: 50%;
    }


    .antal-produkter-kundvagn {
        display: inline-block;
        padding-top: 0.15em;
        /*padding-left: 0.07em;*/
        font-size: 65%;
        line-height: 1;
        color: #fff;
        text-align: center;
        white-space: nowrap;
        vertical-align: baseline;
        position: absolute;
        /*top: 10px;*/
        /*right: -9px;*/
        background-color: red;
        float: right;
        border-radius: 50%;
        width: 15px;
        height: 15px;
        text-align: center;
    }