.body-rimord {
    background-color: #F9F5DF;
}

.h1-rimord {
  font-family: 'Rubik', sans-serif;
  font-size: calc(1.25rem + 1vw);
  font-weight: 400;
  color: #633617;
  font-style: normal;
}

.h2-rimord {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.75rem + 1vw);
  font-weight: 400;
  color: #633617;
  font-style: normal;
}

.h2-rimord-lank {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.75rem + 1vw);
  font-weight: 400;
  color: #F8F3D8;
  font-style: normal;
}

.h2-jumbotron {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.75rem + 1vw);
  font-weight: 400;
  color: #ffffff;
  font-style: normal;
}
  
.h3-rimord {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.6rem + 0.9vw);
  font-weight: 300;
  color: #633617;
  font-style: normal;
}

.h4-rimord {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.7rem + 0.9vw);
  font-weight: 400;
  color: #ffffff;
  font-style: normal;
}
.p-text {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.8rem + 0.3vw);
  font-weight: 300;
  color: #633617;
  font-style: normal;
}

.p-container {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.8rem + 0.3vw);
  font-weight: 300;
  color: white; /* Se till att textfärgen är vit för allt i p-container */
  font-style: normal;
}

.adress-rimord {
  font-family: 'Rubik', sans-serif;
  font-weight: 300;
  color: #633617;
  font-size: calc(0.8rem + 0.3vw);
}
  
.btn-outline-rimord {
  color: #ffffff; /* Ljusbrun */
  background-color: #633617; /* Brun bakgrund */
  border-color: #DD712E; /* Ljusbrun kant */
}

.btn-outline-rimord:hover {
  color: #ffffff; /* Brun text */
  background-color: #DD712E; /* Ljusbrun bakgrund */
  border-color: #633617; /* Brun kant */
}

.background-container {
    background-color: rgba(138, 72, 31, 1);
    padding: 50px 0;
    border-radius: 10px;
    width: 70%;
    margin: 0 auto;
}

#result {
    margin-top: 20px;
}

ul.result-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    list-style-type: none;
    padding: 0;
}

@media (min-width: 768px) {
    ul.result-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 992px) {
    ul.result-grid {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

    /* Justera bredden på olika inputfält */
    .search-field {
    width: 40%; /* Full bredd */
}

    .small-field {
    width: 30%; /* Mindre bredd */
}

    .wide-field {
    width: 50%; /* Bredare fält */
}

    /* Justera bredden på knappen */
    .custom-button-rimord {
    width: 20%; /* Sätt önskad bredd för knappen */
    margin: 0 auto; /* Centrerar knappen */
}

    #result {
    position: relative;
    padding-bottom: 40px; /* Gör plats för räknaren */
    display: none;
}

    #resultCount {
    position: absolute;
    right: 10px;
    bottom: 10px;
    font-size: 1rem; /* Anpassa storlek om du vill */
    color: #ffffff; /* Ändra färg om det behövs */
}

    .custom-list-item {
        background-color: #8A481F !important; /* Tvingar bakgrundsfärgen */
        border: none; /* Tar bort kantlinjen från list-group-item */
    }
    
    .custom-list-item a {
    font-family: 'Rubik', sans-serif;
    font-size: calc(0.6rem + 0.9vw);
    font-weight: 300;
    color: #FFFFFF;
    text-decoration: none; /* Tar bort understrykning */
    }

    .custom-list-item a:hover {
    font-family: 'Rubik', sans-serif;
    font-size: calc(0.6rem + 0.9vw);
    font-weight: 300;
    color: #FFFFFF;
    text-decoration: underline; /* Understrykning på hover för bättre användarupplevelse */
    }
    
.custom-link-item {
    color: #633617; /* Brun färg */
    border: none; /* Tar bort kantlinjen från list-group-item */
}

.custom-link-item a {
    font-family: 'Rubik', sans-serif;
    font-size: calc(0.6rem + 0.9vw);
    font-weight: 300;
    color: #633617 !important; /* Brun färg med viktig prioritering */
    text-decoration: none; /* Tar bort understrykning */
}

.custom-link-item a:hover {
    font-family: 'Rubik', sans-serif;
    font-size: calc(0.6rem + 0.9vw);
    font-weight: 300;
    color: #DD712E !important; /* Ljus brun färg med viktig prioritering vid hover */
    text-decoration: underline; /* Understrykning på hover */
}
.btn-close {
    display: inline-block;
    width: 1em;
    height: 1em;
    padding: 0.25em;
    color: inherit;
    background: transparent;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.rimord {
    color: #438D48; /* Grön färg */
}
    #cookieConsent {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(118, 55, 24, 0.65);
    color: white;
    text-align: center;
    padding: 15px;
    z-index: 1000;
    display: none;
}

/* Cookie consent container */
.cookie-consent-container {
    max-width: 800px;
    color: white; /* Textfärg */
    margin: 0 auto;
    background-color: #B15F2A; /* Brun bakgrundsfärg */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px; /* Skapar utrymme från kanten */
    border-radius: 8px; /* Rundade hörn (valfritt) */
    gap: 10px; /* Avstånd mellan knapparna */
}

/* CSS för knappen "Acceptera alla" */
#acceptCookies {
    background-color: #4CAF50; /* Grön bakgrundsfärg */
    color: white; /* Textfärg */
    border: none; /* Ingen gräns */
    padding: 10px 20px; /* Justera storleken */
    font-size: 16px; /* Textstorlek */
    cursor: pointer; /* Visar att knappen är klickbar */
    border-radius: 5px; /* Rundade hörn */
    transition: background-color 0.3s ease; /* Smooth övergång för bakgrundsfärg */
}

#acceptCookies:hover {
    background-color: #45a049; /* Färgen vid hover */
}

/* CSS för knappen "Neka icke-nödvändiga" */
#rejectCookies {
    background-color: #C8000E; /* Röd bakgrundsfärg */
    color: white; /* Textfärg */
    border: none; /* Ingen gräns */
    padding: 10px 20px; /* Justera storleken */
    font-size: 16px; /* Textstorlek */
    cursor: pointer; /* Visar att knappen är klickbar */
    border-radius: 5px; /* Rundade hörn */
    transition: background-color 0.3s ease; /* Smooth övergång för bakgrundsfärg */
}

#rejectCookies:hover {
    background-color: #FF0012; /* Färgen vid hover */
}

@media (max-width: 768px) {
    .cookie-consent-container {
        flex-direction: column; /* Ändrar layouten till en vertikal stack */
        text-align: center; /* Säkerställer att texten centreras */
        gap: 15px; /* Ökar avståndet mellan elementen */
        padding: 15px; /* Mindre padding för att passa små skärmar */
    }

    .p-cookie {
        margin-bottom: 10px; /* Lägger till utrymme mellan text och knappar */
    }

    #acceptCookies, #rejectCookies {
        width: 100%; /* Gör knapparna lika breda som containern */
        max-width: 300px; /* Begränsar bredden för bättre utseende */
    }
}

.p-cookie {
  font-family: 'Rubik', sans-serif;
  font-size: calc(0.8rem + 0.3vw);
  font-weight: 300;
  color: #ffffff;
  font-style: normal;
}

#scroll-up {
    position: fixed;    /* Fixar pilen på en specifik plats */
    bottom: 40px;       /* Justerar hur långt från botten pilen är */
    right: 40px;        /* Justerar hur långt från högerkanten pilen är */
    display: none;      /* Pilen visas bara när du scrollar, som styrs av JavaScript */
    z-index: 1000;      /* Säkerställer att pilen alltid ligger över annat innehåll */
}