body,td {
    font-family: 'Montserrat', sans-serif; color: #4d4d4d; font-size: 16px; background: #f1f1f1 url("") repeat ; padding: 0;
}



a:link{color: #4d4d4d; text-decoration: underline; font-weight: 700;}
a:visited{color: #4d4d4d; text-decoration: underline; font-weight: 700;}
a:hover{color: #87695c;}
a:active{text-decoration: none;}


/* FONTS & lOGO */

h1 {
    font-family: 'Montserrat', sans-serif; color: #4d4d4d;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 1.5px;
    text-transform: ;
}



h2 {
    font-family: 'Montserrat', sans-serif; color: #4d4d4d;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 1.5px;
    margin: 0;
    padding: 0;
}


h3 {
    font-family: 'Montserrat', sans-serif; color: #4d4d4d;
    font-size: 18px;
    font-weight: 400;
      letter-spacing: 1px;
      line-height: 30px;
}


h4 {
    font-family: 'Montserrat', sans-serif; color: #4d4d4d;
    font-size: 20px;
    font-weight: 500;
    padding: 10px 0 10px 0;
  letter-spacing: 1.5px;
}

h5 {
    font-family: 'Montserrat', sans-serif; color: #4d4d4d;
    font-size: 16px;
    font-weight: 700;
    padding: 10px 0 0 0;
    letter-spacing: 1px;
    line-height: 30px;

}



p {
  font-family: 'Montserrat', sans-serif; color: #4d4d4d;
  font-size: 16px;
  font-weight: 400;
    letter-spacing: 1px;
    line-height: 30px;
}

.logo {
  width: 150px;
  margin-top: 10px;
}

/* OVER ALL SPACES & MORE*/


hr {
  border: 2px solid #dbd5ca;
  padding: 0px;
  margin: 0px;
  opacity: 100%;
}

.space50px {
  padding: 50px;
}

.space40px {
  padding: 40px;
}

.space35px {
  padding: 35px;
}

.space30px {
  padding: 30px;
}

.space20px {
  padding: 20px;
}

.space25px {
  padding: 25px;
}

.space10px {
  padding: 10px;
}

.space5px {
  padding: 5px;
}

.center {
  text-align: center;
}

.round {
  border-radius: 100%;
}

.round300px {
  width: 300px;
  height: 300px;
  object-fit: cover;
  border-radius: 50%;
}

.round250px {
  width: 250px;
  height: 250px;
  object-fit: cover;
  border-radius: 50%;
}



/* BOX COLORS, BOX FONTS & PADDINGS */



.link-aktuellt a:link{color: #4d4d4d; text-decoration: underline; font-weight: 700;}
.link-aktuellt a:visited{color: #4d4d4d; text-decoration: underline; font-weight: 700;}
.link-aktuellt a:hover{color: #87695c;}
.link-aktuellt a:active{text-decoration: none;}


.start-search {
  padding: 30px;
  background-color: #4d4d4d;
}

.start-search h2 {
  font-family: 'Montserrat', sans-serif; color: #ffffff;
  text-transform: ;
  text-align: left;
}


.start-aktuellt {
  padding: 30px;
}


.start-aktuellt .col-md-4 {

}

.container {
  padding: 0 30px 0 30px;
}

.kategorier .col-sm-3 {
  padding-bottom: 40px;
}

.kategorier .col-md-3 {
  padding-bottom: 40px;
}

.kategorier .col-md-6 {
  padding-bottom: 40px;
}




.cover {
  object-fit: cover;
  width: 100%;
  height: 800px;
  padding: 0px;
}


.cover-300px {
  object-fit: cover;
  width: 100%;
  height: 300px;
}

.cover-400px {
  object-fit: cover;
  width: 100%;
  height: 400px;
}

.cover-500px {
  object-fit: cover;
  width: 100%;
  height: 500px;
}

.box-start .col-sm-6 {
  max-height: 800px;
  padding: 0px;
}
.box-start .col-sm-12 {
  max-height: 800px;
  padding: 0px;
}


.white-right-h2 h2 {
  font-family: 'Montserrat', sans-serif; color: #ffffff;
  font-size: 35px;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: ;
  text-align: center;
  padding: 30px;
  line-height: 40px;
}



.box-start p {
  text-align: center;
}

.col-sm-6 .brown {
  padding: 20px;
  height: 400px;
  width: 100%;
}

.col-sm-6 .grey {
  padding: 20px;
  height: 400px;
  width: 100%;
}

.col-sm-6 .warmgrey {
  padding: 20px;
  height: 400px;
  width: 100%;
}

.col-sm-6 .darkbrown {
  padding: 20px;
  height: 400px;
  width: 100%;
}




.img-width-300px {
  max-width: 300px;
}

.img-height-200px {
  max-height: 200px;
}

.brown    {background-color: #87695c;}
.brown p  {font-family: 'Montserrat', sans-serif; color: #dbd5ca;}
.brown h2  {color: #dbd5ca;}
.brown h3  {color: #dbd5ca;}

.brown a:link{color: #dbd5ca; text-decoration: underline; font-weight: 700;}
.brown a:visited{color: #dbd5ca; text-decoration: underline; font-weight: 700;}
.brown a:hover{color: #bca99b;}

.grey     {background-color: #4d4d4d;}
.grey p   {font-family: 'Montserrat', sans-serif; color: #cecece;}
.grey h2  {
  font-family: 'Montserrat', sans-serif; color: #cecece;
  font-size: 25px;
}


.grey-search     {background-color: #4d4d4d;}
.grey-search p   {font-family: 'Montserrat', sans-serif; color: #cecece;}
.grey-search h2  {
  font-family: 'Montserrat', sans-serif; color: #cecece;
  font-size: 25px;
  text-align: center;
}


.lightbrown {background-color: #ccbdb2;}
.lightbrown h2 {
  font-family: 'Montserrat', sans-serif; color: #4d4d4d;
  font-size: 25px;
}



.darkbrown    {background-color: #87695c;}
.darkbrown p  {font-family: 'Montserrat', sans-serif; color: #ffffff;}

.warmgrey     {background-color: #dbd5ca;}

.warmgrey a:link{color: #4d4d4d; text-decoration: underline; font-weight: 700;}
.warmgrey a:visited{color: #4d4d4d; text-decoration: underline; font-weight: 700;}
.warmgrey a:hover{color: #87695c;}



.white     {background-color: #ffffff;}




/* CHRISTMAS THEME STARTS HERE */


.prevox-button {
  background-color: #d6ba8a;
  border: none;
  color: #61242e;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

.prevox-button:hover {
  background-color: #ae9786;
}


.winered .prevox-button a:link{color: #61242e; text-decoration: underline; font-weight: 700;}
.winered .prevox-button a:visited{color: #61242e; text-decoration: underline; font-weight: 700;}
.winered .prevox-button a:hover{color: #61242e;}
.winered .prevox-button a:active{text-decoration: none;}


.start-left-box {
  padding: 50px;
}


.winered .container-fluid {
  padding: 0px;
}


.winered     {background-color: #61242e;}
.winered p  {font-family: 'Montserrat', sans-serif; color: #dbd5ca;}
.winered h2  {color: #dbd5ca;}
.winered h3  {color: #dbd5ca;}


.winered a:link{color: #dbd5ca; text-decoration: underline; font-weight: 700;}
.winered a:visited{color: #dbd5ca; text-decoration: underline; font-weight: 700;}
.winered a:hover{color: #dbd5ca;}
.winered a:active{text-decoration: none;}

/* CHRISTMAS THEME ENDS HERE */



/* SUMMER THEME STARTS HERE  */

.summer-button {
  background-color: #d6ba8a;
  border: none;
  color: #61242e;
  padding: 10px 20px 10px 20px;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  max-width: 280px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 25px 25px 25px 25px;
}

.summer-button:hover {
  background-color: #ae9786;
}

.summer-button a:link{color: #ede7db!important; text-decoration: none!important; font-weight: 700; text-align: center;}
.summer-button a:visited{color: #ede7db!important; text-decoration: none!important; font-weight: 700;}
.summer-button a:hover{color: #ede7db!important;}
.summer-button a:active{text-decoration: none;}




.start-left-box {
  margin: 70px 50px 50px 50px;
  padding: 50px;
  background-color: #ede7db;
  background-image: url('bilder/_backgrounds_/summer-lemon.png');
  background-position: left top;
  background-repeat: no-repeat;
  background-size: contain;
}


.season-wrap-600px {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.summercolor .container-fluid {
  padding: 0px;
}


.summercolor     {
  background-image: url('bilder/_backgrounds_/summer-bg-dark.png');
  background-position: center;
  background-repeat: repeat;
  background-size: 300px 300px;
  background-color: #e2d3be;
}
.summercolor p  {font-family: 'Montserrat', sans-serif; color: #4d4d4d; text-align: center;}
.summercolor h2  {color: #4d4d4d; text-align: center;}
.summercolor h3  {color: #4d4d4d; text-align: center;}


.summercolor a:link{color: #4d4d4d; text-decoration: underline; font-weight: 700; text-align: center;}
.summercolor a:visited{color: #4d4d4d; text-decoration: underline; font-weight: 700;}
.summercolor a:hover{color: #4d4d4d;}
.summercolor a:active{text-decoration: none;}





/* SUMMER THEME ENDS HERE  */


/* AUTUMN THEME STARTS HERE  */

.autumn-button {
  background-color: #d6ba8a;
  border: none;
  color: #61242e;
  padding: 10px 20px 10px 20px;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  max-width: 280px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 25px 25px 25px 25px;
}

.autumn-button:hover {
  background-color: #ae9786;
}

.autumn-button a:link{color: #ede7db!important; text-decoration: none!important; font-weight: 700; text-align: center;}
.autumn-button a:visited{color: #ede7db!important; text-decoration: none!important; font-weight: 700;}
.autumn-button a:hover{color: #ede7db!important;}
.autumn-button a:active{text-decoration: none;}




.autumn-left-box {
  margin: 70px 30px 30px 30px;
  padding: 50px;
}


.autumn-wrap-800px {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.autumn-wrap-600px-mobile {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  height: 400px;
}

.autumncolor .container-fluid {
  padding: 0px;
}


.autumncolor     {
  background-image: url('bilder/_backgrounds_/julkatalogen-2025.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #bca99b;
}

.autumncolor-mobile     {
  background-image: url('bilder/_backgrounds_/julkatalogen-2025.jpg');
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
  background-color: #bca99b;
}

.autumncolor p  {font-family: 'Montserrat', sans-serif; color: #ffffff; text-align: center;}
.autumncolor h2  {color: #ffffff; text-align: center;}
.autumncolor h3  {color: #ffffff; text-align: center;}


.autumncolor a:link{color: #ffffff; text-decoration: underline; font-weight: 700; text-align: center;}
.autumncolor a:visited{color: #ffffff; text-decoration: underline; font-weight: 700;}
.autumncolor a:hover{color: #ffffff;}
.autumncolor a:active{text-decoration: none;}

.autumncolor-mobile p  {font-family: 'Montserrat', sans-serif; color: #ffffff; text-align: center;}
.autumncolor-mobile h2  {color: #ffffff; text-align: center;}
.autumncolor-mobile h3  {color: #ffffff; text-align: center;}


.autumncolor-mobile a:link{color: #ffffff; text-decoration: underline; font-weight: 700; text-align: center;}
.autumncolor-mobile a:visited{color: #ffffff; text-decoration: underline; font-weight: 700;}
.autumncolor-mobile a:hover{color: #ffffff;}
.autumncolor-mobile a:active{text-decoration: none;}





/* AUTUMN THEME ENDS HERE  */









.info-box-600px {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
}

.info-box-400px {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
}

.info-box-800px {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
}

.info-box2-800px {
    max-width: 800px;

}

.info-box-700px {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;

}

.info-box-900px {
    max-width: 900px;

}



.gif {
  width: 100%;
  max-height: 525px;
  object-fit: cover;
}



.big-icon {
  font-size: 100px;
  padding: 0px;
  margin: 0px;
}

.big-icon a{
  color: #4d4d4d;
}

.big-icon a:hover{
  color: #87695c;
}


.carousel-indicators li {
  width: 10px!important;
  height: 10px!important;
  border-radius: 50%;
  padding: 0px;
}



.gallery .col-sm-3 {
  padding: 5px;
}
.gallery .col-sm-6 {
  padding: 5px;
}

.gallery .col-sm-4 {
  padding: 5px;
}

.gallery .row {
  padding: 0px 20px 0px 20px;
  margin: 0px;
}



.two-columns-info .col-sm-6 {
  padding: 0 50px 0 50px;
}

.two-columns-info .col-md-6 {
  padding: 0 50px 30px 50px;
}


/* CAROUSEL */

.carousel-300px {
  /* max-height: 300px; */
}

.carousel-control-prev {
  left: -100px;
}

.carousel-control-next {
  right: -100px;
}


.carousel-indicators {
  bottom: -50px;
}



.carousel-300px .carousel-indicators button {
  width: 10px;  /* Bredd av punkten */
  height: 10px; /* Höjd av punkten, samma som bredden för att skapa en cirkel */
  border-radius: 50%;  /* Gör kanterna helt runda */
  margin: 0 5px; /* Lägg till lite utrymme mellan varje punkt */
  background-color: #fff; /* Vit färg för indikatorpunkter */
  border: none; /* Ta bort eventuell border som kan påverka utseendet */
  box-shadow: none; /* Ta bort eventuell skugga */
}
.carousel-300px .carousel-indicators .active {
  background-color: #000; /* Svart färg för den aktiva punkten */
}




/* 404 */

.style404 {
  width: 500px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.style404 h1 {
  text-align: center;
}

.style404 h3 {
  line-height: 30px;
}



/* BOXES WITH PADDING */


/* AKTUELLT */

.aktuellt .col-lg-6 {
  padding: 40px;
}

.aktuellt .col-md-4 {
  padding: 40px;
}

.aktuellt a {
  text-decoration: none;
}




/* MENY */

.navbar {
  padding: 15px;
  font-family: 'Montserrat', sans-serif; color: #4f5656;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  text-decoration: none;
      font-weight: normal;
}

.navbar ul ul li {
font-family: 'Montserrat', sans-serif; color: #4f5656;
font-size: 14px;
    font-weight: normal;
text-transform: uppercase;
letter-spacing: 1.5px;
  text-decoration: none;
}

.navbar li {
padding: 5px;
}


.navbar a {
    font-weight: 500;
  text-decoration: none;
}


.offcanvas {
  background-color: #bca99b;
}



.navbar-brand {
  margin-top: -10px;
}

.inforand {
    margin: 0;
    padding: 5px;
    text-align: center;
}

.inforand p {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}


/* IMAGE OVERLAY */

.container-img-overlay-hover, .container-img-overlay-visible {
    position: relative;
}

.img-overlay-visible {
  position: absolute;
  bottom: 0px;
  right: 0px;
  border: 0px solid #000000;
  color: white;
  z-index: 2; /* Se till att detta lager är över bilden */
  padding: 10px;
}

.img-overlay-visible h2 {padding: 0px; font-size: 25px;}

.img-overlay-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(135,105,92, 0.5); /* Halvtransparent svart bakgrund */
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    opacity: 0; /* Göm overlay som standard */
    transition: opacity 0.5s ease; /* Animation för övergången */
}

.img-overlay-hover h2 {color: white; font-size: 25px;}

.container-img-overlay-hover:hover .img-overlay-hover {
    opacity: 1; /* Visa overlay vid hover */
}

.cover-400testpx {
    object-fit: cover;
    width: 100%;
    height: 400px;
}

.cover-440px {
    object-fit: cover;
    width: 100%;
    height: 440px;
}


/* BUTTON  + FORM */

.btn {
  font-family: 'Source Sans Pro', sans-serif; color: #ffffff!important;
  font-size: 13px;
  font-weight: 400;
  background-color: #87695c!important;
  text-transform: uppercase!important;
  max-width: 300px!important;
  /*box-shadow: 0px 5px #87695c!important;*/
  border: none!important;
  letter-spacing: 2px!important;
  border-radius: 25px;
  padding: 5px 20px 5px 20px;
}

.btn:hover{
  background: #dbd5ca!important;
  text-transform: uppercase!important;
  font-family: 'Source Sans Pro', sans-serif; color: #4d4d4d!important;
  /*box-shadow: 0px 5px #000000!important;*/
  border: none!important;
}



form {
  padding: 0px;
  margin: 0px;
}

.info-box-brown form {
  background-color: #bca99b!important;
  padding: 0px;
  margin: 0px;

}

form .container {
  background-color: #f1f1f1;
}

.form-group {
  background-color: none!important;



}

.form-control {
  border-radius: 25px;
  border: 0px;
  text-align: left;
  padding-left: 20px;
  max-width: 100%;
margin-left: auto;
  margin-right: auto;
}

.form-control:focus {
  border-color: #87695c!important;

}





/* FOOTER */

footer {
  background-color: #4d4d4d;
  padding: 40px;
}

footer h1 {
  color: #dbd5ca;
}

footer h2 {
  font-size: 30px;
  color: #dbd5ca;
}

footer p {
  color: #dbd5ca;
}

footer a:link{color: #dbd5ca; text-decoration: underline; font-weight: 700;}
footer a:visited{color: #dbd5ca; text-decoration: underline; font-weight: 700;}
footer a:hover{color: #bca99b;}
footer a:active{text-decoration: none;}

footer .col-md-3 {
  padding-bottom: 20px;
}

footer .col-md-5 {
  padding-bottom: 20px;
}

footer .col-md-4 {
  padding-bottom: 20px;
}


/* Cookie */

.dataTables_filter, .dataTables_length, .dataTables_info, .dataTables_paginate {
    display: none !important;
}

#eucookielaw {
    display:none
}

#eucookielaw #more {
    text-decoration: underline;
    color: white;
}

.cookie {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #bca99b;
    padding: 15px 15px 15px;
    color: white;
    z-index: 5000;

    -webkit-transition: bottom 500ms ease-out 1s;
    -moz-transition: bottom 500ms ease-out 1s;
    -o-transition: bottom 500ms ease-out 1s;
    transition: bottom 500ms ease-out 1s;
}

.cookie p {
    color: white;
}

.cookie.closed {
    bottom: -200px;
}

#removecookie {
    background-color: white;
    color: black;
    padding: 5px 10px;
    cursor: pointer;
    display: inline-block;
}

.cookie .container {
    background-color: transparent;
}

@media( max-width: 768px ) {
    #datatables ul li {
        color: black !important;
    }
}



/* RESPONSIVE */

@media only screen and (min-width:0px) and (max-width:767px) {

    .affix {
      position: static;
    }

    #meny {
      text-align: center;
    }

    #meny .pull-right {
      text-align: center;
    }

    ul {
      padding: 10px 0px 0px 0px;
      margin: 0px;
    }

    #meny .container {
      padding: 0px;
    }

    .not-visible-xs {
      display: none;
    }

    .is-visible-xs {
      display: block;
    }




}


@media only screen and (min-width:0px) and (max-width:767px) {



  .carousel-300px {
    /* max-height: 300px; */
  }

  .carousel-control-prev {
    left: -50px;
  }

  .carousel-control-next {
    right: -50px;
  }

  h1 {
      font-size: 25px;
  }

  h2 {
      font-size: 25px;
  }

  .aktuellt .col-lg-6 {
    padding: 10px;
  }

  .aktuellt .col-md-4 {
    padding: 10px;
  }



}

@media only screen and (min-width:768px) and (max-width:959px) {

  h1 {
      font-size: 25px;
  }

  h2 {
      font-size: 25px;
  }

}


@media only screen and (min-width:960px) and (max-width: 1024px) {

  h1 {
      font-size: 30px;
  }

  h2 {
      font-size: 30px;
  }


}

@media only screen and (min-width: 1025px) and (max-width: 1279px) {



}


@media only screen and (min-width: 1280px) and (max-width: 1399px){



}

@media only screen and (min-width: 1400px) and (max-width: 1599px){



}


@media only screen and (min-width: 1800px) {



}



@media only screen and (min-width: 1600px) {

  .cover-400testpx {
      object-fit: cover;
      width: 100%;
      height: 550px;
  }

  .cover-440px {
      object-fit: cover;
      width: 100%;
      height: 550px;
  }


  .cover {
    object-fit: cover;
    width: 100%;
    height: 1200px;
    padding: 0px;
  }


    .start-left-box {
      padding: 100px;
    }

    .start-search {
      padding: 100px;
    }

    .autumn-left-box {
      margin: 40px 30px 30px 30px;
      padding: 50px;
    }

      .autumncolor h2  {color: #ffffff; font-size: 50px;}


    .autumn-wrap-800px {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto;
    }

}