/*----------------------------------------------------------------------------------------

                FONT IKON

----------------------------------------------------------------------------------------*/

@font-face {
  font-family: 'ikoner';
  src: url('font/ikoner.eot?78304953');
  src: url('font/ikoner.eot?78304953#iefix') format('embedded-opentype'),
       url('font/ikoner.woff2?78304953') format('woff2'),
       url('font/ikoner.woff?78304953') format('woff'),
       url('font/ikoner.ttf?78304953') format('truetype'),
       url('font/ikoner.svg?78304953#ikoner') format('svg');
  font-weight: normal;
  font-style: normal;
}


/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'ikoner';
    src: url('../font/ikoner.svg?78304953#ikoner') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "ikoner";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.icon-person-minus:before { content: '\e800'; } /* '' */
.icon-person-plus:before { content: '\e801'; } /* '' */
.icon-previous:before { content: '\e802'; } /* '' */
.icon-search:before { content: '\e803'; } /* '' */
.icon-arrow:before { content: '\e804'; } /* '' */
.icon-book:before { content: '\e805'; } /* '' */
.icon-cart:before { content: '\e806'; } /* '' */
.icon-close:before { content: '\e807'; } /* '' */
.icon-document:before { content: '\e808'; } /* '' */
.icon-edit:before { content: '\e809'; } /* '' */
.icon-login:before { content: '\e80a'; } /* '' */
.icon-logout:before { content: '\e80b'; } /* '' */
.icon-menu:before { content: '\e80c'; } /* '' */
.icon-pen:before { content: '\e80d'; } /* '' */
.icon-person:before { content: '\e80e'; } /* '' */






/*----------------------------------------------------------------------------------------

                                      MOBILE FIRST

----------------------------------------------------------------------------------------*/


  /*nav.nav-extended .nav-wrapper {
  height: 77px !important;
  min-height: 64px !important;
  }*/

  /***** SHOW & HIDE ***********/

  .hide-on-small {
  display: none;
  }
  .show-on-small {
  display: block;
  }

/*----------------------------------------------------------------------------------------

                                HEADER / MAIN NAV STYLES

----------------------------------------------------------------------------------------*/

  header {
    background-color: #fff;
  }

  /*
  nav {
  height: 64px;
  line-height: 64px;
  }
  */
 #top-container {
  height: 77px;
  padding: 0px;
  width: 100%;
  border-bottom: 1px solid #ededed;
  border-width: thin;
  display: inline-flex;
  }
 .logo {
  width: 64px;
  height: 51px;
  margin: 13px 0px;
  }

  .main-menu, .invisible {
  display: none;
  }
  #container-menu-mobile {
  display: none;
  top: 77px;
  }
  #soeger {
  display: none;
  top: 77px;
  width: 100%;
  }
  #topnav {
  right: 0; 
  margin: 0px;
  display: inline-flex;
  width: auto;
  height: auto;
  padding: 0;
  float: right;
  overflow: hidden;
  list-style-type: none;
}
  #topnav li a {
  color: #ff6600;
  text-align: center;
  width: 42px;
  height: 77px;
  min-width: 42px;
  min-height: 77px;
  padding: 26px 0px;
  display: inline-table;
  /*margin: 0px 2px;*/  
  font-size: 10px;
  line-height: 12px;
  text-transform: uppercase;
  }
#topnav li a i {
  font-size: 24px;
  border: 1px solid #ededed;
  border-width: thin;
  padding: 50px 4px;
  line-height: 0px;
  vertical-align: -webkit-baseline-middle;
  }
#topnav li a:hover {
  color: #ffffff; /*#133349*/
  text-align: center;
  width: 42px;
  height: 77px;
  min-width: 42px;
  min-height: 77px;
  padding: 26px 0px;
  display: inline-table; 
  /*margin: 0px 2px;*/
  font-size: 10px;
  line-height: 12px;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  background-color: #0091d1;
  }

  /*----------------------------------------------------------------------------------------

                                      SØGEFELT

----------------------------------------------------------------------------------------*/


button.soeg {
  font-size: 28px;
  padding: 0px 3px 0px 0px;
  position: relative;
  display: inline-block;
  width: 65px;
  height: 64px;
  min-height: 64px;
  margin-top: 24px;
  color: #fff;
  background-color: #0091d1;
  border: 1px solid #0091d1;
  border-top-left-radius: 0px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 0px;
  z-index: 1;
  float: right;
}

.input-group {
  display: block;
  line-height: inherit;
  -webkit-transition: .3s background-color;
  transition: .3s background-color; 
}

.nav-wrapper .input-group {
  border: 1px solid #fff;    
  border-top-left-radius: 5px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 5px;
  height: 64px !important;
  margin-top: 24px;
  left: 0px;
  top: 0px;
  background-color: rgba(245, 245, 245, 1);
  padding-left: 4rem;
  width: calc(100% - 4rem);
  -webkit-box-shadow: none;
          box-shadow: none;
}

/*
.form-control {
  border: 1px solid #fff;    
  border-top-left-radius: 5px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 5px;
  height: 64px !important;
  margin-top: 24px;
  left: 0px;
  top: 0px;
  background-color: #ededed !important;
  padding-left: 4rem;
  width: calc(100% - 4rem);
  -webkit-box-shadow: inset 1px 1px 1px 1px #ccc;
    box-shadow: inset 1px 1px 1px 1px #ccc;
}
*/
/*
.input-group, .form-control {
  -webkit-transform: none;
          transform: none;
  right: 0;
}
*/
.img-vare-soeg {
    display: block;
    width: 18px;
    height: auto;
    margin: 0 auto;
}

.btn-laeg-soeg {
  border-radius: 0px 4px 4px 0px !important;
  -moz-border-radius: 0px 4px 4px 0px !important;
  -webkit-border-radius: 0px 4px 4px 0px !important;
  border: 0px solid #000000 !important;
  background-color: #0091d1 !important;
  width: 100% !important;
  height: 45px !important;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center !important;
  transition: none !important;
}

.btn-laeg-soeg:hover {
  border-radius: 0px 0px 4px 0px !important;
  -moz-border-radius: 0px 4px 4px 0px !important;
  -webkit-border-radius: 0px 4px 4px 0px !important;
  border: 0px solid #000000 !important;
  background-color: #d0008d !important;
  width: 100% !important;
  height: 45px !important;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center !important;
}

.bg-vare-soeg {
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 15px 10px !important;
  margin: 0 auto;
  background-color: #ffffff;
}

.felt-laeg-soeg {
  border: 0px solid #fff !important;
  border-radius: 4px 0px 0px 4px;
  -moz-border-radius: 4px 0px 0px 4px;
  -webkit-border-radius: 4px 0px 0px 4px;
  border: 0px solid #000000;
  background-color: #e6e7e8;
  width: 100%;
  height: 45px;
  padding: 0px 10px !important;
  text-align: center;
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}

#drop-down-soeg {
  display: block;
}

/*----------------------------------------------------------------------------------------

                TOGLE MENU

----------------------------------------------------------------------------------------*/

.labelClass {
  cursor: pointer; 
  width: 100%;
  height: 60px;
  max-height: 60px;
  font-size: 12px;
  font-weight: 600;
  line-height: 60px;
  background-color: #fff;
  border-top: 1px solid #f5f5f5;
  border-width: thin;
  color: #133349;
  text-align: center;  
  float: left;
  margin: 0 auto;
  letter-spacing: 1px;
}


#menu-toggle-ol, 
#menu-toggle-lesedrik,
#menu-toggle-cider,
#menu-toggle-spiritus,
#menu-toggle-barartikler,
#menu-toggle-chips,
#menu-toggle-vin,
#menu-toggle-nyheder,
#menu-toggle-tilbud,
#menu-toggle-sodavand {
  display: none;
}

#menu-toggle-ol:checked + #menu-mobile,
#menu-toggle-lesedrik:checked + #menu-mobile,
#menu-toggle-cider:checked + #menu-mobile,
#menu-toggle-spiritus:checked + #menu,
#menu-toggle-barartikler:checked + #menu-mobile,
#menu-toggle-chips:checked + #menu-mobile,
#menu-toggle-vin:checked + #menu-mobile,
#menu-toggle-nyheder:checked + #menu-mobile,
#menu-toggle-tilbud:checked + #menu-mobile {
  height: auto;
  max-height: 1000px;
}

#menu-toggle-sodavand:checked + #menu-mobile {
  max-height: 100px;
}

#menu-mobile {
  background-color: #0091d1;
  width: 100%;
  overflow: hidden;
  max-height: 0;
  padding: 0;
  margin: 0 auto;
  -webkit-transition: all 0.3s ease; 
}

ul#menu-mobile {
  width: 100%;
  height: 35px;
  line-height: 35px;
  overflow: hidden;
  margin: 0 auto; 
  display: grid;

}

ul#menu-mobile li a {
  width: 100%;
  height: 60px;
  max-height: 60px;
  line-height: 60px;
  overflow: hidden;
  display: block;
  text-align: center;
  font-size: 12px !important;
  font-weight: 400;
  margin: 0 auto;
  border-top: 1px solid #f5f5f5;
  border-width: thin;
  letter-spacing: 1px;
  color: #fff;
}

#container-menu-mobile {
  display: block;
  width: 100%;
}
nav form > .soeger {
  margin-right: 10px;
}

/*-----------------------

            BODY

------------------------*/

.lyseblaa a {
  color: #0091d1 !important;
  text-decoration: none;
  background-color: transparent;
}

.lyseblaa a:hover {
  color: #000000 !important;
  text-decoration: underline;
}

.breadcrumb {
  background-color: rgba(0,0,0,0) !important;
  border-radius: 0px !important;
  padding: 0 !important;
  /*font-size: 0.8rem;
  line-height: 2rem;*/
}

img {
    border-style: none;
    width: 100%;
    height: auto;
}

.img-vare-forside {
    background-color: #fff;
    display: block;
    width: 113px;
    height: auto;
    margin: 0 auto;
    padding: 10px 40px !important;
}

.box-content {
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  /*padding: 0px !important;
  margin: 20px;*/
  display: inline-block;
  text-align: center;
}

.felt-laeg {
  border: 0px solid #fff !important;
  border-radius: 0px 0px 0px 4px;
  -moz-border-radius: 0px 0px 0px 4px;
  -webkit-border-radius: 0px 0px 0px 4px;
  border: 0px solid #000000;
  background-color: #e6e7e8;
  width: 100%;
  height: 45px;
  padding: 0px 20px !important;
  text-align: center;
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}

.btn-laeg {
  font-size: 0.6875rem !important;
  border-radius: 0px 0px 4px 0px;
  -moz-border-radius: 0px 0px 4px 0px;
  -webkit-border-radius: 0px 0px 4px 0px;
  border: 0px solid #000000;
  background-color: #0091d1;
  width: 100%;
  height: 45px;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center;
  transition: none !important;
}

.btn-laeg:hover {
  border-radius: 0px 0px 4px 0px;
  -moz-border-radius: 0px 0px 4px 0px;
  -webkit-border-radius: 0px 0px 4px 0px;
  border: 0px solid #000000;
  background-color: #d0008d;
  width: 100%;
  height: 45px;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center;
}

#laeg-i-kurv {
  display: block;
}

/* ----------- ÅBNER KURV ---------- */

.content-img-vare-flap {
  /*border: 1px solid #ffffff;
  border-width: thin;
  border-radius: 4px;*/
  padding: 15px 10px !important;
  margin: 0 auto;
  background-color: #ffffff;
}

#aabner-kurv {
  display: none;
}

.kurv-aabnet {
  /*width: 360px !important;
  position: absolute !important;
  top: 77px;
  background-color: #0091d1;*/
  padding: 0px !important;
  /*display: inline-flex;
  overflow: hidden;
  float: right;
  text-align: left;
  border-top-left-radius: 4px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 4px;
  background-color: #ffffff;
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
  z-index: 1000;
  right: 0 !important;*/
}

.header-kurv-aabnet {
  display: inline-flex;
    position: inherit;
    color: #ffffff;
    background-color: #0091d1;
    width: auto;
    height: 60px;
    min-height: 60px;
    vertical-align: middle;
    padding: 10px;
}

.kurv-aabnet i {
  font-size: 20px;
  vertical-align: -webkit-baseline-middle;
  vertical-align: -moz-middle-with-baseline;
  line-height: 1.5rem !important;
}

.kurv-aabnet a {
  color: #fff;
  text-decoration: none;
}

.kurv-abnnet a:hover {
  color: #5a5a5a !important;
  text-decoration: none;
}

.fremregnede-lyseblaa {
  color: #0091d1;
}

.img-vare-flap {
    display: block;
    width: 48px;
    height: auto;
    margin: 0 auto;
}

.box-img-vare-flap {
  background-color: #fff;
}

.box-content-vare-flap {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 0px !important;
  margin: 15px 0px;
  display: inline-block;
  text-align: center;
  background-color: #ffffff;
}

.felt-laeg-vare-flap {
    border: 1px solid #e6e7e8 !important;
    border-width: thin;
    border-radius: 4px 0px 0px 4px !important;
    -moz-border-radius: 4px 0px 0px 4px !important;
    -webkit-border-radius: 4px 0px 0px 4px !important;
    background-color: #ffffff !important;
    width: 100%;
    height: 30px;
    padding: 0px 10px !important;
    text-align: center;
    /*box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);*/
}

.btn-laeg-vare-flap {
    font-size: 0.6rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 30px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg-vare-flap:hover {
    font-size: 0.6rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #d0008d !important;
    width: 50%;
    height: 30px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

.box-text-vare-flap {
  border-left: 1px solid #e6e7e8;
    border-width: thin;
    background-color: #e6e7e8;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    padding: 20px;
}

.box-text-vare-produkter-mobile {
  border-left: 1px solid #e6e7e8;
    border-width: thin;
    background-color: #ffffff;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    padding: 20px;
}

.btn-orange {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #ff6600;
    border: #ff6600;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
    /* float: right; */
}

.btn-orange:hover {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    /* float: right; */
}

.btn-lyseraad {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #d0008d;
    border: #d0008d;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
    /* float: right; */
}

/*
.btn-lyseraad:hover {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
}
*/
.btn-lyseraad:disabled {

  /* margin-top: 24px; */
  color: #fff;
  background-color: #5a5a5a;
  border: #5a5a5a;

}
/*
.btn-graa {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #bebebe;
    border: #bebebe;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
}

.btn-graa:hover {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
}
*/
.btn-lyseblaa {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #0091d1;
    border: #0091d1;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
    /* float: right; */
}

.btn-lyseblaa:hover {
    font-size: 2rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    /* float: right; */
}

.arrow-down {
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;  
  border-top: 10px solid #0091d1;
  margin: 0 auto;
}

/*-----------*/


/*-------------------------------------

        FLASKE (Produkt åbnet)

----------------------------------------*/

.box-content-vare-flaske {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 0px !important;
}

.img-vare-flaske {
    display: block;
    width: 140px;
    height: auto;
    margin: 0 auto;
    padding: 20px !important;
    background-color: #ffffff;
}

.felt-laeg-flaske {
    border: 0px solid #fff !important;
    border-radius: 4px 0px 0px 4px !important;
    -moz-border-radius: 4px 0px 0px 4px !important;
    -webkit-border-radius: 4px 0px 0px 4px !important;
    border: 0px solid #000000 !important;
    background-color: #e6e7e8 !important;
    width: 100%;
    height: 45px;
    padding: 0px 10px !important;
    text-align: center;
    box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}

.btn-laeg-flaske {
    font-size: 0.8rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg-flaske:hover {
    font-size: 0.8rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #d0008d !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

.box-tekst-vare-flaske {
  border-top: 1px solid #e6e7e8;
  border-width: thin;
  padding: 0 20px !important;
}

.next-flaske {
  color: #000;
  font-size: 1.8rem !important;
  text-align: center;
  display: inline-table;
  vertical-align: middle;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 20px;
  /*background-color: #e6e7e8;*/
}

.previous-flaske {
  color: #000;
  font-size: 1.8rem !important;
  text-align: center;
  display: inline-table;
  vertical-align: middle;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 20px;
  /*background-color: #e6e7e8;*/
}

.flip-vertical {
  transform: scaleX(-1);
}

#previous {
  display: block;
}

#next {
  display: block;
}

#arrow-next {}


/*-----------------*/

a.over-varer-forside {
  color: #000 !important;

}

a.over-varer-forside:hover {
  color: #000 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5) !important;
}

a.side-link {
  position: relative;
  display: block;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.25;
  color: #000000;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  font-size: 1rem;
  margin: 0 5px;
}

a.side-link:hover {
  position: relative;
  display: block;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.25;
  color: #0091d1;
  background-color: #e6e7e8;
  border: 1px solid #e6e7e8;
  border-width: thin;
  text-decoration: none;
  border-radius: 4px;
  font-size: 1rem;
  margin: 0 5px;
}

.footer {
  width: 100%;
  height: auto;
  background-color: #bebebe;
  display: block;
  padding-top: 4rem;
}

.footer ul {
  list-style-type: none;
  margin-block-start: 0em !important;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 0px !important;
}

.footer ul li {
  list-style-type: none;
}

.footer ul li i {
  display: inline-flex;
  width: 2.4rem;
  height: auto;
}

.footer li a {
  color: #5a5a5a;
  line-height: 1.2rem !important;
}
.footer li a:hover {
  color: #ffffff;
  line-height: 1.2rem !important;
  text-decoration: none;
}


.footer a {
  color: #5a5a5a;
  line-height: 1.2rem !important;
}

.footer a:hover {
  color: #ffffff;
  line-height: 1.2rem !important;
  text-decoration: none;
}




/*--------------------------------------------------------------------------

            KURV MOBILE (Bestilling, levering, kvittering) 

----------------------------------------------------------------------------*/

.box-content-trin-aktiv {
  width: 100%;
  height: auto;
  /*border: 1px solid #e6e7e8;
  border-width: thin;*/
  border-radius: 4px;
  padding: 0px !important;
  /*margin: 0px 20px;*/
  display: inline-block;
  text-align: center;
  background-color: #0091d1;
  color: #ffffff;
}

.box-content-trin-passiv {
  width: 100%;
  height: auto;
  /*border: 1px solid #e6e7e8;
  border-width: thin;*/
  border-radius: 4px;
  padding: 0px !important;
  /*margin: 0px 20px;*/
  display: inline-block;
  text-align: center;
  background-color: #ededed;
  color: #bebebe;
}

.arrow-down-trin-aktiv {
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;  
  border-top: 10px solid #0091d1;
  margin: 0 auto;
}

.arrow-down-trin-passiv {
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;  
  border-top: 10px solid #ededed;
  margin: 0 auto;
}


 #base {
      background: #0091d1;
      display: inline-block;
      height: 55px;
      /*margin-left: 20px;*/
      margin-top: 55px;
      position: relative;
      width: 100%;
    }
#base:before {
      border-top: 35px solid #0091d1;
      border-left: 50px solid transparent;
      border-right: 50px solid transparent;
      content: "";
      height: 0;
      left: 0;
      position: absolute;
      top: 55px;
      width: 100%;
    }


.box-wrap-bestilling {
    display: inline-flex;
    border: 1px solid #e6e7e8;
    border-width: thin;
    border-radius: 4px 4px 0px 0px;
    padding: 20px;
  }

.border-thin {
  border: 1px solid #e6e7e8;
  border-width: thin;
  padding: 10px;
}

#royal-classic {
    width: 100%;
  }

.close-vare {
  color: #000 !important;
}

.close-vare:hover {
  color: #0091d1 !important;
}

.footer-box-wrap-bestilling {
  width: 100%;
  display: table-row;
  background-color: #d0008d;
  border-radius: 0px 0px 4px 4px;
  border: 0px solid #fff;
}

.cell-50 td, tr {
  width: 50%;
}

.remove-border-top {
  border-bottom: 0px solid #dee2e6 !important; border-top: 0px solid #dee2e6 !important;
}

#table-mobile {
  border-top: 0px solid #e6e7e8 !important;
  display: inline-table;
}

#tr {
  border-top: 1px solid #dee2e6;
}

#table-mobile-okonomi td {
  border-top: 0px solid #e6e7e8 !important;
  display: block;
}


/*------LEVERING-----*/

.box-wrap-levering {
    width: 100%;
    display: block;
    border: 1px solid #e6e7e8;
    border-width: thin;
    border-radius: 4px 4px 4px 4px;
    padding: 20px;
  }

  .form-control-kurv {
  border: 1px solid #e6e7e8;
  border-width: thin;    
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  height: 65px !important;
  /*margin-top: 24px;*/
  left: 0px;
  top: 0px;
  /*width: 600px;*/

  background-color: #fff !important;
  padding-left: 30px;
  width: 100%;
  /*-webkit-box-shadow: inset 1px 1px 1px 1px #ccc;
    box-shadow: inset 1px 1px 1px 1px #ccc;*/
}

.form-check .form-check-input {
  border: 1px solid #e6e7e8 !important;
  border-radius: 4px !important;
  
}

.form-control-kommenter {
  border: 1px solid #e6e7e8;
  border-width: thin;    
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  height: auto !important;
  /*margin-top: 24px;*/
  left: 0px;
  top: 0px;
  /*width: 600px;*/

  background-color: #fff !important;
  padding-left: 30px;
  width: 100%;
  /*-webkit-box-shadow: inset 1px 1px 1px 1px #ccc;
    box-shadow: inset 1px 1px 1px 1px #ccc;*/
}


/*----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------

                                KVITTERING                                    

-----------------------------------------------------------------------------*/

a#tak:hover {
  color: #d0008d;
  text-decoration: none;
}

ul#list-print {
  width: 100%;
  display: inline-block;
}

ul#list-print li {
  color: #bebebe;
  display: inline-block;
  padding: 0px 10px;
}

ul#list-print li a {
  color: #bebebe;
}
      
ul#list-print li a:hover {
  color: #d0008d;
}


/*---------------------------------------------------------------------------*/

/*--------------------------------------------------------

                      KONTO                               

-----------------------------------------------------------*/

#wrap-konto {
  background-color: #e6e7e8 !important;
}

.box-wrap-konto-profil {
    padding: 20px;
}

.img-profiler-thumb {
  padding: .25rem;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-radius: 100%;
  max-width: 90px;
  height: 90px;
}

.img-profil {
  padding: .25rem;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-radius: 100%;
  width: 180px;
  max-width: 180px;
  height: 180px;
}

.hvid-baggrund {
  background-color: #fff;
  width: 100%;
  height: 100%;
  display: block;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px 4px 4px 4px;
}

.border-b {
  border-bottom: 1px solid #e6e7e8;
  border-width: thin !important;
}

#profil i {
  font-size: 1rem;
  line-height: 0px;
  vertical-align: -webkit-baseline-middle;
}

#profil a {
  font-size: 1rem;
  color: #0091d1;
  line-height: 0px;
  vertical-align: -webkit-baseline-middle;
  text-decoration: none;
}

#profil a:hover {
  color: #d0008d;
  text-decoration: none;
}

/*-----------------------------------------------------------*/

.margin-top-60 {
  margin-top: 60px;
}
.margin-top-40 {
  margin-top: 40px;
}
.margin-top-30 {
  margin-top: 30px;
}
.margin-top-20 {
  margin-top: 20px;
}

.margin-bottom-60 {
  margin-bottom: 60px;
}
.margin-bottom-40 {
  margin-bottom: 40px;
}
.margin-bottom-30 {
  margin-bottom: 30px;
}
.margin-bottom-20 {
  margin-bottom: 20px;
}

p, span {
  font-size: 0.8rem; overflow-wrap: break-word; line-height: normal !important; margin-bottom: 0px !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  line-height: 1.6 !important;
}


h1 {
  font-size: 3rem !important; overflow-wrap: break-word; /*Title (bold)*/
}

h2 {
  font-size: 2.3333333333333335rem !important; overflow-wrap: break-word; /*Price product opened (Bold)*/
}

h3 {
  font-size: 1.75rem !important; overflow-wrap: break-word; /*Price (Bold)
                        Name product open 
                        Andre produkter*/
}

h4 {
  font-size: 1.6666666666666667rem !important; overflow-wrap: break-word; /*Subtitle (Medium)
                      Price i Kurv (White, bold)
                      LÆG I KURV product open (white)*/
}

h5 {
  font-size: 1.3333333333333333rem !important; overflow-wrap: break-word;/*Product name (Bold)*/
}

h6 {
  font-size: 1.0833333333333333rem !important; overflow-wrap: break-word; /*paragraph (Light)
                        fast lav pris opened product (light italic)*/
}

.cl-flasker {
  font-size: 0.9166666666666666rem !important; overflow-wrap: break-word; /*Light*/
  /*font-weight: 200;*/
}

.small-text {
  font-size: 0.8333333333333334rem !important; overflow-wrap: break-word; /*DKK ink.moms i kurv (white + light)
                        description opened product (black)*/
}

.extra-small-text {
  font-size: 0.875rem !important; overflow-wrap: break-word; /*DKK ink.moms i kurv (white + light)
                        description opened product (black)*/
}

.xx-small-text {
  font-size: 0.625rem !important; overflow-wrap: break-word; /*DKK ink.moms i kurv (white + light)
                        description opened product (black)*/
}

.price {
  font-size: 1.5rem !important; /*Subtitle (Medium)
                      Price i Kurv (White, bold)
                      LÆG I KURV product open (white)*/
}

.break-word {
  overflow-wrap: break-word;
}

/*
h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.3;
  font-family: Roboto, sans-serif;
  //font-family: 'Gudea', sans-serif;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-weight: inherit;
  font-family: Roboto, sans-serif;
  //font-family: 'Gudea', sans-serif;
}
*/

.medium {
  font-weight: 400 !important;
}

.bold {
  font-weight: 500 !important;
  font-weight: bold !important;
}

.extra-black {
  font-weight: 700 !important;
  font-weight: bolder !important;
}

.lyseblaa {
  color: #0091d1; /* #ff6600; orange */
}





































/* ---------------------------------------------------------------------------------

                Medium devices (tablets, 768px and up)                              

-----------------------------------------------------------------------------------*/


@media (min-width: 768px) {
    
    .hide-on-medium {
  display: none;
  }
  .show-on-medium {
  display: block;
  }
  .sticky {
  position: fixed;
  top: 0;
  width: 100%
  }
  .sticky + .all {
  padding-top: 60px;
  }


nav {
  color: #fff;
  background-color: rgb (0, 142, 209);
  width: 100%;
  /*height: 220px;*/
  min-height: 36px;
  line-height: 36px;
  }

#wrap {
  overflow: hidden;
  }

.color-bg {
  background-color: rgba(245, 245, 245, 1);
  padding-top: -20px;
  }

#top-container {
  width: 100%;
  height: 150px;
  /*margin: 20px auto;*/
  padding: 20px 0;
  border-bottom: 1px solid #ededed;
  border-width: thin;
  display: inline-flex;
  }

.logo {
  width: 139px; height:110px; margin: 0px 20px 0px 0px;
  }
.logo img {
  width: 100%; height:90%;
  }

.wrap-header-mobile {
  height: 64px;
  }

.padding-40 {
  padding: 0 40px !important;
  }


/*----------------------------------------------------------------------------------------

                                      SØGEFELT

----------------------------------------------------------------------------------------*/


button.soeg {
  font-size: 28px;
  padding: 0px 3px 0px 0px;
  position: relative;
  display: inline-block;
  width: 65px;
  height: 64px;
  min-height: 64px;
  margin-top: 24px;
  color: #fff;
  background-color: #0091d1;
  /*border: 1px solid #0091d1;*/
  border: 1px solid #0091d1;
  border-top-left-radius: 0px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 0px;
  z-index: 1;
  float: right;
}

.input-group {
  display: block;
  line-height: inherit;
  -webkit-transition: .3s background-color;
  transition: .3s background-color; 
}

.nav-wrapper .input-group {
  border: 1px solid #fff;    
  border-top-left-radius: 5px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 5px;
  height: 64px !important;
  margin-top: 24px;
  left: 0px;
  top: 0px;
  /*width: 600px;*/
  background-color: rgba(245, 245, 245, 1);
  padding-left: 4rem;
  width: calc(100% - 4rem);
  -webkit-box-shadow: none;
          box-shadow: none;
}

/*
.input-group, .form-control {
  -webkit-transform: none;
          transform: none;
  right: 0;
}
*/

.img-vare-soeg {
    display: block;
    width: 18px;
    height: auto;
    margin: 0 auto;
}

.btn-laeg-soeg {
  border-radius: 0px 4px 4px 0px !important;
  -moz-border-radius: 0px 4px 4px 0px !important;
  -webkit-border-radius: 0px 4px 4px 0px !important;
  border: 0px solid #000000 !important;
  background-color: #0091d1 !important;
  width: 100% !important;
  height: 25px !important;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center !important;
  transition: none !important;
}

.btn-laeg-soeg:hover {
  border-radius: 0px 0px 4px 0px !important;
  -moz-border-radius: 0px 4px 4px 0px !important;
  -webkit-border-radius: 0px 4px 4px 0px !important;
  border: 0px solid #000000 !important;
  background-color: #d0008d !important;
  width: 100% !important;
  height: 25px !important;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center !important;
}

.bg-vare-soeg {
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 15px 10px !important;
  margin: 0 auto;
  background-color: #ffffff;
}

.felt-laeg-soeg {
  border: 0px solid #fff !important;
  border-radius: 4px 0px 0px 4px;
  -moz-border-radius: 4px 0px 0px 4px;
  -webkit-border-radius: 4px 0px 0px 4px;
  border: 0px solid #000000;
  background-color: #e6e7e8;
  width: 100%;
  height: 25px;
  padding: 0px 10px !important;
  text-align: center;
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}


/*----------------------------------------------------------------------------------------

                             TOP NAV IKONER

----------------------------------------------------------------------------------------*/

#topnav {
  width: auto;
  height: auto;
  margin: 22px 0px 0px 0px;
  padding: 0;
  float: right;
  overflow: hidden;
  display: inline-flex;
  list-style-type: none;
  
}

#topnav li a {
  color: #ff6600; /* color: #133349; blå logo - color: #ff6600; orange -- color: #0091d1; lyseblå -- color: #d0008d; lyseråd */
  font-size: 10px;
  line-height: 12px;
  text-transform: uppercase;
  text-align: center;
  width: 64px;
  height: 64px;
  min-width: 64px;
  min-height: 64px;
  padding: 0px 10px;
  display: inline-table;
  margin: 3px 5px; 
  
}

#topnav li a i {
  font-size: 28px;
  line-height: 43px;
  vertical-align: top;
  border: 0px solid #ededed !important;
}

#topnav li a:hover {
  color: #5a5a5a;
  font-size: 10px;
  line-height: 12px;
  text-transform: uppercase;
  text-align: center;
  width: 64px;
  height: 64px;
  min-width: 64px;
  min-height: 64px;
  padding: 0px 10px;
  display: inline-table;
  margin: 3px 5px; 
  text-decoration: none;
  background-color: #fff;
  
}

.main-menu {
  display: inline-flex;
}

.menu-collapse {
  display: none;
  margin: 64px 0 0 0;
  padding: 0;
}

ul#menu {
  overflow: hidden; 
  margin: 0;
  list-style: none;
  text-decoration: none;
  padding-left: 1px;
}
  
ul#menu li a {
  width: auto;
  min-width: 100px;
    height: 60px;
    color: #133349;
    float: left;
    list-style: none;
    padding: 10px;
    background-color: #fff;
    line-height: 40px;
    font-size: 10px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 1px;
    /*border-top: 0px solid #ededed;*/
    border-right: 1px solid #ededed;
    border-left: 1px solid #ededed;
    /*border-bottom: 1px solid #ededed;*/
    border-width: thin;
    list-style: none;
    text-decoration: none;
    margin-left: -1px;
}
  
ul#menu li a:hover{
  color: #ffffff;
  cursor:pointer;
  background-color: #0091d1;
  list-style: none;
  text-decoration: none;
}

/*ul#menu li a {
  text-decoration: none;
  color: #000;
}

ul#menu li a:hover {
  text-decoration: none;
  color:#ffffff;
}*/
  
ul#menu ul {
    display: none;
    position: absolute;
    color: #fff;
    margin: 60px -139px;
    width: 430px;
    list-style: none;
    text-decoration: none;
}

ul#menu ul.ul-et {
    display: none;
    position: absolute !important;
    color: #fff !important;
    padding: 0px;
    margin: 60px 0px !important;
    width: 130px !important;
}
  
ul#menu ul li a {
    font-size: 10px;
    float: left;
    color: #000;
    width: auto;
    height: 35px;
    line-height: normal;
    margin: 0;
    border-bottom: 1px solid #ededed;
    border-width: thin;
    letter-spacing: normal;
    margin-left: -1px;
}


/*----------------------------------------------------------------------------------------

                          SUB - SUB - MENU

----------------------------------------------------------------------------------------*/


ul#menu ul ul {
    display: none;
    position: absolute;
    color: #fff;
    padding: 0px;
    margin: 0px 130px;
    width: 130px;
}

  
ul#menu ul li li a {
    font-size: 10px;
    float: left;
    color: #000;
    width: 130px;
    height: 35px;
    line-height: normal;
    margin: 0;
    border-bottom: 1px solid #ededed;
    border-width: thin;
    background-color: #f5f5f5;
}


 
/*------------------------  SUB MENU LINKS   ----------------------------------*/

ul#menu ul li a {
  color: #000;
  text-decoration: none;
}
  
ul#menu ul li a:hover{
  color: #fff;
  text-decoration: none;
  cursor:pointer;
}
  
ul#menu li:hover ul ul,ul#menu li:hover ul ul ul,ul#menu li.iehover ul ul,ul#menu li.iehover ul ul ul {
  display: none;
  cursor:pointer;
}
  
ul#menu li:hover ul,ul#menu ul li:hover ul,ul#menu ul ul li:hover ul,ul#menu li.iehover ul,ul#menu ul li.iehover ul,ul#menu ul ul li.iehover ul {
  display: block;
  cursor:pointer;
}

 /*----------------------------------------------------------------------------------------

                                TOGLE MENU

----------------------------------------------------------------------------------------*/

.labelClass {
  cursor: pointer; 
  width: 100%;
  height: 60px;
  max-height: 60px;
  font-size: 12px;
  font-weight: 600;
  line-height: 60px;
  background-color: #fff;
  border-top: 1px solid #f5f5f5;
  border-width: thin;
  color: #133349;
  text-align: center;  
  float: left;
  margin: 0 auto;
  letter-spacing: 1px;
}


#menu-toggle-ol, 
#menu-toggle-lesedrik,
#menu-toggle-cider,
#menu-toggle-spiritus,
#menu-toggle-barartikler,
#menu-toggle-chips,
#menu-toggle-vin,
#menu-toggle-nyheder,
#menu-toggle-tilbud,
#menu-toggle-sodavand {
  display: none;
}

#menu-toggle-ol:checked + #menu-mobile,
#menu-toggle-lesedrik:checked + #menu-mobile,
#menu-toggle-cider:checked + #menu-mobile,
#menu-toggle-spiritus:checked + #menu,
#menu-toggle-barartikler:checked + #menu-mobile,
#menu-toggle-chips:checked + #menu-mobile,
#menu-toggle-vin:checked + #menu-mobile,
#menu-toggle-nyheder:checked + #menu-mobile,
#menu-toggle-tilbud:checked + #menu-mobile {
  height: auto;
  max-height: 1000px;
}

#menu-toggle-sodavand:checked + #menu-mobile {
  max-height: 100px;
}

#menu-mobile {
  background-color: #0091d1;
  width: 100%;
  overflow: hidden;
  max-height: 0;
  padding: 0;
  margin: 0 auto;
  -webkit-transition: all 0.3s ease; 
}

ul#menu-mobile {
  width: 100%;
  height: 35px;
  line-height: 35px;
  overflow: hidden;
  margin: 0 auto; 
  display: grid;

}

ul#menu-mobile li a {
  width: 100%;
  height: 60px;
  max-height: 60px;
  line-height: 60px;
  overflow: hidden;
  display: block;
  text-align: center;
  font-size: 12px !important;
  font-weight: 400;
  margin: 0 auto;
  border-top: 1px solid #f5f5f5;
  border-width: thin;
  letter-spacing: 1px;
  color: #fff;
}

#container-menu-mobile {
  display: none;
  width: 100%;
}
#soeger {
  display: none !important;
}
nav form > .soeger {
  margin-right: 10px;
}


/*----------------------------------------------------------------------------------------

                                    Body

----------------------------------------------------------------------------------------*/

.z100 {
  z-index: 100;
}

.z90 {
  z-index: 90;
}

.z80 {
  z-index: 80;
}

.z70 {
  z-index: 70;
}

.z60 {
  z-index: 60;
}

.z50 {
  z-index: 50;
}

.z40 {
  z-index: 40;
}

.z30 {
  z-index: 30;
}

.z20 {
  z-index: 20;
}

.z10 {
  z-index: 10;
}

.z0 {
  z-index: 0;
}

.lyseblaa a {
  color: #0091d1 !important;
  text-decoration: none;
  background-color: transparent;
}

.lyseblaa a:hover {
  color: #000000 !important;
  text-decoration: underline;
}

.breadcrumb {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 0 !important;
  margin-bottom: 1rem;
  list-style: none;
  background-color: rgba(0,0,0,0) !important;
  border-radius: 0px !important;
}

.box-container {
   display: inline-block;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
}

.box-content {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  /*padding: 0px !important;
  margin: 15px;*/
  display: inline-block;
  text-align: center;
}

img {
    border-style: none;
    width: 100%;
    height: auto;
}

/*
.img-vare-forside {
    display: block;
    width: 60px;
    height: auto;
    margin: 0 auto;
    padding: 10px !important;
    background-color: #ffffff;
}
*/
.felt-laeg {
    border: 0px solid #fff !important;
    border-radius: 0px 0px 0px 4px !important;
    -moz-border-radius: 0px 0px 0px 4px !important;
    -webkit-border-radius: 0px 0px 0px 4px !important;
    border: 0px solid #000000 !important;
    background-color: #e6e7e8 !important;
    width: 100%;
    height: 45px;
    padding: 0px 10px !important;
    text-align: center;
    box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}

.btn-laeg {
    font-size: 0.8rem !important;
    border-radius: 0px 0px 4px 0px !important;
    -moz-border-radius: 0px 0px 4px 0px !important;
    -webkit-border-radius: 0px 0px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg:hover {
    font-size: 0.8rem !important;
    border-radius: 0px 0px 4px 0px !important;
    -moz-border-radius: 0px 0px 4px 0px !important;
    -webkit-border-radius: 0px 0px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #5a5a5a !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

#laeg{
  position: inherit;
  /*margin-top: -45px;*/
  display: block;
}


a.box-produkt {
  color: #000000;
  display: inline-block;
  background-color: #ffffff;
  text-decoration: none;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  padding: 0px !important;
  margin: 0px;
  text-align: center;
  width: 100%;
}

a.box-produkt:hover {
  color: #bebebe;
  display: inline-block;
  background-color: #ffffff;
  text-decoration: none;
  width: 100%;
}


.kurv {
  width: 200px !important;
  /*margin: 0 auto;*/
  /*position: absolute;*/
  /*background-color: #0091d1;*/
      padding: 10px 0px;
  display: inline-flex;
  overflow: hidden;
  float: right;
  text-align: left;
  border-top-left-radius: 4px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 4px;
}

.kurv i {
  font-size: 29px !important;
    margin: 0 10px 0px -10px;
}

#arrow {
  font-size: 10px !important;
      margin: 0 10px 0px -10px;
}

a.kurv {
  color: #fff;
  display: inline-flex;
  background-color: #0091d1;
  text-decoration: none;
}

a.kurv:hover {
  color: #ffffff;
  background-color: #d0008d; /*#ff6600*/
  text-decoration: none;
}

#aabner-kurv {
  display: none;
}

.kurv-aabnet {
  width: 360px !important;
  position: absolute !important;
  top: 258px;
  /*background-color: #0091d1;*/
  padding: 0px !important;
  display: inline-flex;
  overflow: hidden;
  float: right;
  text-align: left;
  border-top-left-radius: 4px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 4px;
  background-color: #ffffff;
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
  z-index: 1000;
  right: 0 !important;
}

.header-kurv-aabnet {
  display: inline-flex;
    position: inherit;
    color: #ffffff;
    background-color: #0091d1;
    width: auto;
    height: 60px;
    min-height: 60px;
    vertical-align: middle;
    padding: 10px;
}

.kurv-aabnet i {
  font-size: 20px;
  vertical-align: -webkit-baseline-middle;
  vertical-align: -moz-middle-with-baseline;
  line-height: 1.5rem !important;
}

.kurv-aabnet a {
  color: #fff;
  text-decoration: none;
}

.kurv-abnnet a:hover {
  color: #5a5a5a !important;
  text-decoration: none;
}

.fremregnede-lyseblaa {
  color: #0091d1;
}

.img-vare-flap {
    display: block;
    width: 48px;
    height: auto;
    margin: 0 auto;
}

.box-img-vare-flap {
  background-color: #fff;
}

.box-content-vare-flap {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 0px !important;
  margin: 15px 0px;
  display: inline-block;
  text-align: center;
  background-color: #ffffff;
}

.felt-laeg-vare-flap {
    border: 1px solid #e6e7e8 !important;
    border-width: thin;
    border-radius: 4px 0px 0px 4px !important;
    -moz-border-radius: 4px 0px 0px 4px !important;
    -webkit-border-radius: 4px 0px 0px 4px !important;
    background-color: #ffffff !important;
    width: 100%;
    height: 30px;
    padding: 0px 10px !important;
    text-align: center;
    /*box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);*/
}

.btn-laeg-vare-flap {
    font-size: 0.6rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 30px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg-vare-flap:hover {
    font-size: 0.6rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #d0008d !important;
    width: 50%;
    height: 30px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

.box-text-vare-flap {
  border-left: 1px solid #e6e7e8;
    border-width: thin;
    background-color: #e6e7e8;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    padding: 20px;
    height: 100%;
}

.btn-orange {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #ff6600;
    border: #ff6600;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
    /* float: right; */
}

.btn-orange:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    /* float: right; */
}
/*
.btn-lyseraad {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #d0008d;
    border: #d0008d;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
}


.btn-lyseraad:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
}

.btn-graa {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #bebebe;
    border: #bebebe;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
}

.btn-graa:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
}
*/
.btn-lyseblaa {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #0091d1;
    border: #0091d1;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
    /* float: right; */
}

.btn-lyseblaa:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #d0008d;
    border: #d0008d;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    /* float: right; */
}

.arrow-down {
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;  
  border-top: 10px solid #0091d1;
  margin: 0 auto;
}

/*-------------------------------------

        FLASKE (Produkt åbnet)

----------------------------------------*/

.box-content-vare-flaske {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 0px !important;
}

.img-vare-flaske {
    display: block;
    width: 140px;
    height: auto;
    margin: 0 auto;
    padding: 20px !important;
    background-color: #ffffff;
}

.felt-laeg-flaske {
    border: 0px solid #fff !important;
    border-radius: 4px 0px 0px 4px !important;
    -moz-border-radius: 4px 0px 0px 4px !important;
    -webkit-border-radius: 4px 0px 0px 4px !important;
    border: 0px solid #000000 !important;
    background-color: #e6e7e8 !important;
    width: 100%;
    height: 45px;
    padding: 0px 10px !important;
    text-align: center;
    box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}

.btn-laeg-flaske {
    font-size: 0.8rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg-flaske:hover {
    font-size: 0.8rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #d0008d !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

.box-tekst-vare-flaske {
  border-top: 0px solid #e6e7e8 !important;
  border-left: 1px solid #e6e7e8;
  border-width: thin;
  padding: 0 20px !important;
}

.next-flaske {
  color: #000;
  font-size: 1.8rem !important;
  text-align: center;
  display: inline-table;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 20px;
  background-color: #ffffff;
  cursor: pointer;

}

.previous-flaske {
  color: #000;
  font-size: 1.8rem !important;
  text-align: center;
  display: inline-table;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 20px;
  background-color: #ffffff;
  cursor: pointer;
}

a.next-flaske {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;

}

a.previous-flaske {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;
}

a.next-flaske:hover {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;

}

a.previous-flaske:hover {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;
}

.flip-vertical {
  transform: scaleX(-1);
}

#previous {
  display: block;
}

#next {
  display: block;
}

#arrow-next {}



/*--------------------------------------

            HOVER EFFECT PRODUCT

---------------------------------------*/

.hovereffect a {
  color: #000;
  text-decoration: none;
}
.hovereffect a:hover {
  color: #000;
  text-decoration: none;
}

.hovereffect {
    width: 100%;
    height: auto;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;

    border: 1px solid #e6e7e8;
    border-width: thin;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;

}
.hovereffect .overlay {
    width: 100%;
    position: absolute;
    overflow: hidden;
    left: 0;
    top: auto;
    bottom: 0;
    padding: 1rem 0 0 0;
    height: 138px;
    background: #ffffff;
    color: #3c4a50;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    visibility: visible;
    border-top: 1px solid #e6e7e8;
    border-width: thin;


}

.hovereffect img {
    display: block;
    position: relative;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
}

.hovereffect:hover img {
-webkit-transform: translate3d(0,-10%,0);
  transform: translate3d(0,-10%,0);
}

/*.hovereffect h2 {
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  position: relative;
  font-size: 17px;
  padding: 10px;
  background: rgba(0, 0, 0, 0.6);
  float: left;
  margin: 0px;
  display: inline-block;
}

.hovereffect a.info {
  display: inline-block;
  text-decoration: none;
  padding: 7px 14px;
  text-transform: uppercase;
  color: #fff;
  border: 1px solid #fff;
  margin: 50px 0 0 0;
  background-color: transparent;
}
.hovereffect a.info:hover {
    box-shadow: 0 0 5px #fff;
}


.hovereffect p.icon-links a {
  float: right;
  color: #3c4a50;
  font-size: 1.4em;
}

.hovereffect:hover p.icon-links a:hover,
.hovereffect:hover p.icon-links a:focus {
  color: #252d31;
}

.hovereffect h2,
.hovereffect p.icon-links a {
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  -webkit-transform: translate3d(0,200%,0);
  transform: translate3d(0,200%,0);
  visibility: visible;
}

.hovereffect p.icon-links a span:before {
  display: inline-block;
  padding: 8px 10px;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}*/


.hovereffect:hover .overlay,
.hovereffect:hover h2,
.hovereffect:hover p.icon-links a {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
/*
.hovereffect:hover h2 {
  -webkit-transition-delay: 0.05s;
  transition-delay: 0.05s;
}

.hovereffect:hover p.icon-links a:nth-child(3) {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

.hovereffect:hover p.icon-links a:nth-child(2) {
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}

.hovereffect:hover p.icon-links a:first-child {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

*/
/*----------- END HOVER EFFECT PRODUCT ------------*/



a.side-link {
  position: relative;
  display: block;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.25;
  color: #000000;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  font-size: 1rem;
  margin: 0 5px;
}

a.side-link:hover {
  position: relative;
  display: block;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.25;
  color: #0091d1;
  background-color: #e6e7e8;
  border: 1px solid #e6e7e8;
  border-width: thin;
  text-decoration: none;
  border-radius: 4px;
  font-size: 1rem;
  margin: 0 5px;
}

.footer {
  width: 100%;
  height: auto;
  background-color: #bebebe;
  display: block;
  padding-top: 4rem;
}

.footer ul {
  list-style-type: none;
  margin-block-start: 0em !important;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 0px !important;
}

.footer ul li {
  list-style-type: none;
}

.footer ul li i {
  display: inline-flex;
  width: 2.4rem;
  height: auto;
}

.footer li a {
  color: #5a5a5a;
  line-height: 1.2rem !important;
}

.footer li a:hover {
  color: #ffffff;
  line-height: 1.2rem !important;
  text-decoration: none;
}

.dropdown-divider {
    height: 0;
    margin: 0 !important;
    overflow: hidden;
    border-top: 1px solid #bebebe;
    border-width: thin !important;
}


/*-------------------------------------------------------------------------

                      KURV (Bestilling - Levering - Kvittering)                          

--------------------------------------------------------------------------*/




    #trin-aktiv {
      width: 200px;
      height: 100px;
      position: relative;
      background: #0091d1;
      color: #fff;
    }
    #trin-aktiv:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid white;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }
    #trin-aktiv:before {
      content: "";
      position: absolute;
      right: -50px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid #0091d1;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }


    #trin-passiv {
      width: 200px;
      height: 100px;
      position: relative;
      background: #ededed;
      color: #bebebe;
    }
    #trin-passiv:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid white;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }
    #trin-passiv:before {
      content: "";
      position: absolute;
      right: -50px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid #ededed;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }


  .box-wrap-bestilling {
    width: 100%;
    display: inline-flex;
    border: 1px solid #e6e7e8;
    border-width: thin;
    border-radius: 4px 4px 0px 0px;
    padding: 20px;
  }

  #royal-classic {
    width: 100%;
  }

.close-vare {
  color: #000 !important;
}

.close-vare:hover {
  color: #0091d1 !important;
}

.footer-box-wrap-bestilling {
  width: 100%;
  display: table-row;
  background-color: #d0008d;
  border-radius: 0px 0px 4px 4px;
  border: 0px solid #fff;
}

.cell-50 td, tr {
  width: 50%;
}

.remove-border-top {
  border-bottom: 0px solid #dee2e6 !important; border-top: 0px solid #dee2e6 !important;
}

#table-mobile {
  border-top: 0px solid #e6e7e8 !important;
  display: inline-table;
  padding: 0.75rem;
}

#tr {
  border-top: 1px solid #dee2e6;
}

table#table-bestillinger {
  display: inline; 
}

/*-----------------------------------------

              LEVERING                      

-------------------------------------------*/

.box-wrap-levering {
    width: 100%;
    display: block;
    border: 1px solid #e6e7e8;
    border-width: thin;
    border-radius: 4px 4px 4px 4px;
    padding: 20px;
  }

  /*
  .form-control-kurv {
  border: 1px solid #e6e7e8;
  border-width: thin;    
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  height: 65px !important;
  left: 0px;
  top: 0px;

  background-color: #fff !important;
  padding-left: 10px;
  width: 100%;
}
*/

.form-check .form-check-input {
  border: 1px solid #e6e7e8 !important;
  border-radius: 4px !important;
  
}

.form-control-kommenter {
  border: 1px solid #e6e7e8;
  border-width: thin;    
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  height: auto !important;
  /*margin-top: 24px;*/
  left: 0px;
  top: 0px;
  /*width: 600px;*/

  background-color: #fff !important;
  padding-left: 30px;
  width: 100%;
  /*-webkit-box-shadow: inset 1px 1px 1px 1px #ccc;
    box-shadow: inset 1px 1px 1px 1px #ccc;*/
}

/*--------------------------------------------------*/




/*-----------------------------------------------------

                    KVITTERING                        

------------------------------------------------------*/

ul#list-print {
  width: 100%;
  display: flex;
}

ul#list-print li {
  color: #bebebe;
  display: inline-block;
  padding: 0px 10px;
}

ul#list-print li a {
  color: #bebebe;
}
      
ul#list-print li a:hover {
  color: #d0008d;
}

/*------------------------------------------------------*/



/*--------------------------------------------------------

                      KONTO                               

-----------------------------------------------------------*/

#wrap-konto {
  background-color: #e6e7e8 !important;
}

.box-wrap-konto-profil {
    padding: 20px;
}

.img-profiler-thumb {
  padding: .25rem;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-radius: 100%;
  max-width: 90px;
  height: 90px;
}

.img-profil {
  padding: .25rem;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-radius: 100%;
  width: 180px;
  max-width: 180px;
  height: 180px;
  margin: 0 1rem;
}

.hvid-baggrund {
  background-color: #fff;
  width: 100%;
  height: 100%;
  display: block;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px 4px 4px 4px;
}

.border-b {
  border-bottom: 1px solid #e6e7e8;
  border-width: thin !important;
}

#profil i {
  font-size: 1rem;
  line-height: 0px;
  vertical-align: -webkit-baseline-middle;
}

#profil a {
  font-size: 1rem;
  color: #0091d1;
  line-height: 0px;
  vertical-align: -webkit-baseline-middle;
  text-decoration: none;
}

#profil a:hover {
  color: #d0008d;
  text-decoration: none;
}

/*-----------------------------------------------------------*/




/* -----------------------------------------------------------------------

                            STEPS BY BOOSTRAP                             

--------------------------------------------------------------------------*/



/*--------------------------------------------------------*/




.margin-top-60 {
  margin-top: 60px;
}
.margin-top-40 {
  margin-top: 40px;
}
.margin-top-30 {
  margin-top: 30px;
}
.margin-top-20 {
  margin-top: 20px;
}

.margin-bottom-60 {
  margin-bottom: 60px;
}
.margin-bottom-40 {
  margin-bottom: 40px;
}
.margin-bottom-30 {
  margin-bottom: 30px;
}
.margin-bottom-20 {
  margin-bottom: 20px;
}

p, span {
  font-size: 0.8rem; overflow-wrap: break-word; line-height: normal !important; margin-bottom: 0px !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  line-height: 1.6 !important;
}


h1 {
  font-size: 3rem !important; overflow-wrap: break-word; /*Title (bold)*/
}

h2 {
  font-size: 2.4rem !important; overflow-wrap: break-word; /*Price product opened (Bold)*/
}

h3 {
  font-size: 1.75rem !important; overflow-wrap: break-word; /*Price (Bold)
                        Name product open 
                        Andre produkter*/
}

h4 {
  font-size: 1.6rem !important; overflow-wrap: break-word; /*Subtitle (Medium)
                      Price i Kurv (White, bold)
                      LÆG I KURV product open (white)*/
}

h5 {
  font-size: 1.2rem !important; overflow-wrap: break-word;/*Product name (Bold)*/
}

h6 {
  font-size: 1rem !important; overflow-wrap: break-word; /*paragraph (Light)
                        fast lav pris opened product (light italic)*/
}

.cl-flasker {
  font-size: 0.8rem !important; overflow-wrap: break-word; /*Light*/
  /*font-weight: 200;*/
}

.small-text {
  font-size: 0.7rem !important; overflow-wrap: break-word; /*DKK ink.moms i kurv (white + light)
                        description opened product (black)*/
}

.extra-small-text {
  font-size: 0.875rem !important; overflow-wrap: break-word; /*DKK ink.moms i kurv (white + light)
                        description opened product (black)*/
}

.price {
  font-size: 1.2rem !important; /*Subtitle (Medium)
                      Price i Kurv (White, bold)
                      LÆG I KURV product open (white)*/
}

.break-word {
  overflow-wrap: break-word;
}

.medium {
  font-weight: 400 !important;
}

.bold {
  font-weight: 500 !important;
  font-weight: bold !important;
}

.bolder {
  font-weight: 700 !important;
  font-weight: bolder !important;
}

.extra-black {
  font-weight: 900 !important;
}

.lyseblaa {
  color: #0091d1; /* #ff6600; orange */
}


}

































/*----------------------------------------------------------------------------------------

                @Media Queries // Extra large devices (large desktops, 1200px and up)

----------------------------------------------------------------------------------------*/

@media (min-width: 1200px) {

  .hide-on-large {
  display: none;
  }
  .show-on-large {
  display: block;
  }
  .sticky {
  position: fixed;
  top: 0;
  width: 100%
  }
  .sticky + .all {
  padding-top: 60px;
  }


nav {
  color: #fff;
  background-color: rgb (0, 142, 209);
  width: 100%;
  /*height: 220px;*/
  min-height: 56px;
  line-height: 56px;
  }

#wrap {
  overflow: hidden;
  }

.color-bg {
  background-color: rgba(245, 245, 245, 1);
  padding-top: -20px;
  }

#top-container {
  width: 100%;
  height: 150px;
  /*margin: 20px auto;*/
  padding: 20px 0;
  border-bottom: 1px solid #ededed;
  border-width: thin;
  display: inline-flex;
  }

.logo {
  width: 139px; height:110px; margin-left: 20px;
  }
.logo img {
  width: 100%; height:90%;
  }

.wrap-header-mobile {
  height: 64px;
  }

.padding-40 {
  padding: 0 40px !important;
  }


/*----------------------------------------------------------------------------------------

                                      SØGEFELT

----------------------------------------------------------------------------------------*/


button.soeg {
  font-size: 28px;
  padding: 0px 3px 0px 0px;
  position: relative;
  display: inline-block;
  width: 65px;
  height: 64px;
  min-height: 64px;
  margin-top: 24px;
  color: #fff;
  background-color: #0091d1;
  /*border: 1px solid #0091d1;*/
  border: 1px solid #0091d1;
  border-top-left-radius: 0px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 0px;
  z-index: 1;
  float: right;
}

.input-group {
  display: block;
  line-height: inherit;
  -webkit-transition: .3s background-color;
  transition: .3s background-color; 
}

.nav-wrapper .input-group {
  border: 1px solid #fff;    
  border-top-left-radius: 5px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 5px;
  height: 64px !important;
  margin-top: 24px;
  left: 0px;
  top: 0px;
  /*width: 600px;*/
  background-color: rgba(245, 245, 245, 1);
  padding-left: 4rem;
  width: calc(100% - 4rem);
  -webkit-box-shadow: none;
          box-shadow: none;
}

/*
.form-control {
  border: 1px solid #fff;    
  border-top-left-radius: 5px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 5px;
  height: 64px !important;
  margin-top: 24px;
  left: 0px;
  top: 0px;

  background-color: #ededed !important;
  padding-left: 4rem;
  width: calc(100% - 4rem);
  -webkit-box-shadow: inset 1px 1px 1px 1px #ccc;
    box-shadow: inset 1px 1px 1px 1px #ccc;
}
*/

.input-group, .form-control {
  -webkit-transform: none;
          transform: none;
  right: 0;
}

.img-vare-soeg {
    display: block;
    width: 18px;
    height: auto;
    margin: 0 auto;
}

.btn-laeg-soeg {
  border-radius: 0px 4px 4px 0px !important;
  -moz-border-radius: 0px 4px 4px 0px !important;
  -webkit-border-radius: 0px 4px 4px 0px !important;
  border: 0px solid #000000 !important;
  background-color: #0091d1 !important;
  width: 100% !important;
  height: 25px !important;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center !important;
  transition: none !important;
}

.btn-laeg-soeg:hover {
  border-radius: 0px 0px 4px 0px !important;
  -moz-border-radius: 0px 4px 4px 0px !important;
  -webkit-border-radius: 0px 4px 4px 0px !important;
  border: 0px solid #000000 !important;
  background-color: #d0008d !important;
  width: 100% !important;
  height: 25px !important;
  display: table-cell !important;
  color: #fff !important;
  text-align: -webkit-center !important;
}

.bg-vare-soeg {
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 15px 10px !important;
  margin: 0 auto;
  background-color: #ffffff;
}

.felt-laeg-soeg {
  border: 0px solid #fff !important;
  border-radius: 4px 0px 0px 4px;
  -moz-border-radius: 4px 0px 0px 4px;
  -webkit-border-radius: 4px 0px 0px 4px;
  border: 0px solid #000000;
  background-color: #e6e7e8;
  width: 100%;
  height: 25px;
  padding: 0px 10px !important;
  text-align: center;
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}



/*----------------------------------------------------------------------------------------

                             TOP NAV IKONER

----------------------------------------------------------------------------------------*/

#topnav {
  width: auto;
  height: auto;
  margin: 22px 0px 0px 0px;
  padding: 0;
  float: right;
  overflow: hidden;
  display: inline-flex;
  list-style-type: none;
  
}

#topnav li a {
  color: #ff6600; /* color: #133349; blå logo - color: #ff6600; orange -- color: #0091d1; lyseblå -- color: #d0008d; lyseråd */
  font-size: 10px;
  line-height: 12px;
  text-transform: uppercase;
  text-align: center;
  width: 64px;
  height: 64px;
  min-width: 64px;
  min-height: 64px;
  padding: 0px 10px;
  display: inline-table;
  margin: 3px 15px; 
  
}

#topnav li a i {
  font-size: 38px;
  line-height: 53px;
  vertical-align: top;
  border: 0px solid #ededed !important;
}

#topnav li a:hover {
  color: #5a5a5a;
  font-size: 10px;
  line-height: 12px;
  text-transform: uppercase;
  text-align: center;
  width: 64px;
  height: 64px;
  min-width: 64px;
  min-height: 64px;
  padding: 0px 10px;
  display: inline-table;
  margin: 3px 15px; 
  text-decoration: none;
  background-color: #fff;
  
}

.main-menu {
  display: inline-flex;
}

.menu-collapse {
  display: none;
  margin: 64px 0 0 0;
  padding: 0;
}

ul#menu {
  overflow: hidden; 
  margin: 0;
  list-style: none;
  text-decoration: none;
  padding-left: 1px;
}
  
ul#menu li a {
  width: 130px;
    height: 60px;
    color: #133349;
    float: left;
    list-style: none;
    padding: 10px;
    background-color: #fff;
    line-height: 40px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 1px;
    /*border-top: 0px solid #ededed;*/
    border-right: 1px solid #ededed;
    border-left: 1px solid #ededed;
    /*border-bottom: 1px solid #ededed;*/
    border-width: thin;
    list-style: none;
    text-decoration: none;
    margin-left: -1px;
}
  
ul#menu li a:hover{
  color: #ffffff;
  cursor:pointer;
  background-color: #0091d1;
  list-style: none;
  text-decoration: none;
}

/*ul#menu li a {
  text-decoration: none;
  color: #000;
}

ul#menu li a:hover {
  text-decoration: none;
  color:#ffffff;
}*/
  
ul#menu ul {
    display: none;
    position: absolute;
    color: #fff;
    margin: 60px -169px;
    width: 430px;
    list-style: none;
    text-decoration: none;
}

ul#menu ul.ul-et {
    display: none;
    position: absolute !important;
    color: #fff !important;
    padding: 0px;
    margin: 60px 0px !important;
    width: 130px !important;
}
  
ul#menu ul li a {
    font-size: 10px;
    float: left;
    color: #000;
    width: 130px;
    height: 35px;
    line-height: normal;
    margin: 0;
    border-bottom: 1px solid #ededed;
    border-width: thin;
    letter-spacing: normal;
    margin-left: -1px;
}


/*----------------------------------------------------------------------------------------

                          SUB - SUB - MENU

----------------------------------------------------------------------------------------*/


ul#menu ul ul {
    display: none;
    position: absolute;
    color: #fff;
    padding: 0px;
    margin: 0px 130px;
    width: 130px;
}

  
ul#menu ul li li a {
    font-size: 10px;
    float: left;
    color: #000;
    width: 130px;
    height: 35px;
    line-height: normal;
    margin: 0;
    border-bottom: 1px solid #ededed;
    border-width: thin;
    background-color: #f5f5f5;
}


 
/*------------------------  SUB MENU LINKS   ----------------------------------*/

ul#menu ul li a {
  color: #000;
  text-decoration: none;
}
  
ul#menu ul li a:hover{
  color: #fff;
  text-decoration: none;
  cursor:pointer;
}
  
ul#menu li:hover ul ul,ul#menu li:hover ul ul ul,ul#menu li.iehover ul ul,ul#menu li.iehover ul ul ul {
  display: none;
  cursor:pointer;
}
  
ul#menu li:hover ul,ul#menu ul li:hover ul,ul#menu ul ul li:hover ul,ul#menu li.iehover ul,ul#menu ul li.iehover ul,ul#menu ul ul li.iehover ul {
  display: block;
  cursor:pointer;
}

 /*----------------------------------------------------------------------------------------

                                TOGLE MENU

----------------------------------------------------------------------------------------*/

.labelClass {
  cursor: pointer; 
  width: 100%;
  height: 60px;
  max-height: 60px;
  font-size: 12px;
  font-weight: 600;
  line-height: 60px;
  background-color: #fff;
  border-top: 1px solid #f5f5f5;
  border-width: thin;
  color: #133349;
  text-align: center;  
  float: left;
  margin: 0 auto;
  letter-spacing: 1px;
}


#menu-toggle-ol, 
#menu-toggle-lesedrik,
#menu-toggle-cider,
#menu-toggle-spiritus,
#menu-toggle-barartikler,
#menu-toggle-chips,
#menu-toggle-vin,
#menu-toggle-nyheder,
#menu-toggle-tilbud,
#menu-toggle-sodavand {
  display: none;
}

#menu-toggle-ol:checked + #menu-mobile,
#menu-toggle-lesedrik:checked + #menu-mobile,
#menu-toggle-cider:checked + #menu-mobile,
#menu-toggle-spiritus:checked + #menu,
#menu-toggle-barartikler:checked + #menu-mobile,
#menu-toggle-chips:checked + #menu-mobile,
#menu-toggle-vin:checked + #menu-mobile,
#menu-toggle-nyheder:checked + #menu-mobile,
#menu-toggle-tilbud:checked + #menu-mobile {
  height: auto;
  max-height: 1000px;
}

#menu-toggle-sodavand:checked + #menu-mobile {
  max-height: 100px;
}

#menu-mobile {
  background-color: #0091d1;
  width: 100%;
  overflow: hidden;
  max-height: 0;
  padding: 0;
  margin: 0 auto;
  -webkit-transition: all 0.3s ease; 
}

ul#menu-mobile {
  width: 100%;
  height: 35px;
  line-height: 35px;
  overflow: hidden;
  margin: 0 auto; 
  display: grid;

}

ul#menu-mobile li a {
  width: 100%;
  height: 60px;
  max-height: 60px;
  line-height: 60px;
  overflow: hidden;
  display: block;
  text-align: center;
  font-size: 12px !important;
  font-weight: 400;
  margin: 0 auto;
  border-top: 1px solid #f5f5f5;
  border-width: thin;
  letter-spacing: 1px;
  color: #fff;
}

#container-menu-mobile {
  display: none;
  width: 100%;
}
#soeger {
  display: none !important;
}
nav form > .soeger {
  margin-right: 10px;
}



/*----------------------------------------------------------------------------------------

                                    Body

----------------------------------------------------------------------------------------*/

.z100 {
  z-index: 100;
}

.z90 {
  z-index: 90;
}

.z80 {
  z-index: 80;
}

.z70 {
  z-index: 70;
}

.z60 {
  z-index: 60;
}

.z50 {
  z-index: 50;
}

.z40 {
  z-index: 40;
}

.z30 {
  z-index: 30;
}

.z20 {
  z-index: 20;
}

.z10 {
  z-index: 10;
}

.z0 {
  z-index: 0;
}

.lyseblaa a {
  color: #0091d1 !important;
  text-decoration: none;
  background-color: transparent;
}

.lyseblaa a:hover {
  color: #000000 !important;
  text-decoration: underline;
}

.breadcrumb {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 0 !important;
  margin-bottom: 1rem;
  list-style: none;
  background-color: rgba(0,0,0,0) !important;
  border-radius: 0px !important;
}

.box-container {
   display: inline-block;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
}

.box-content {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  /*padding: 0px !important;
  margin: 15px;*/
  display: inline-block;
  text-align: center;
}

img {
    border-style: none;
    width: 100%;
    height: auto;
}

/*
.img-vare-forside {
    display: block;
    width: 70px;
    height: auto;
    margin: 0 auto;
    padding: 10px !important;
    background-color: #ffffff;
}
*/
.felt-laeg {
    border: 0px solid #fff !important;
    border-radius: 0px 0px 0px 4px !important;
    -moz-border-radius: 0px 0px 0px 4px !important;
    -webkit-border-radius: 0px 0px 0px 4px !important;
    border: 0px solid #000000 !important;
    background-color: #e6e7e8 !important;
    width: 100%;
    height: 45px;
    padding: 0px 10px !important;
    text-align: center;
    box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}

.btn-laeg {
    font-size: 0.8rem !important;
    border-radius: 0px 0px 4px 0px !important;
    -moz-border-radius: 0px 0px 4px 0px !important;
    -webkit-border-radius: 0px 0px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg:hover {
    font-size: 0.8rem !important;
    border-radius: 0px 0px 4px 0px !important;
    -moz-border-radius: 0px 0px 4px 0px !important;
    -webkit-border-radius: 0px 0px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #d0008d !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

#laeg{
  position: inherit;
  /*margin-top: -45px;*/
  display: block;
}


a.box-produkt {
  color: #000000;
  display: inline-block;
  background-color: #ffffff;
  text-decoration: none;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  padding: 0px !important;
  margin: 0px;
  text-align: center;
  width: 100%;
}

a.box-produkt:hover {
  color: #bebebe;
  display: inline-block;
  background-color: #ffffff;
  text-decoration: none;
  width: 100%;
}


.kurv {
  width: 200px !important;
  /*margin: 0 auto;*/
  /*position: absolute;*/
  /*background-color: #0091d1;*/
      padding: 10px 0px;
  display: inline-flex;
  overflow: hidden;
  float: right;
  text-align: left;
  border-top-left-radius: 4px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 4px;
}

.kurv i {
  font-size: 29px !important;
    margin: 0 10px 0px -10px;
}

#arrow {
  font-size: 10px !important;
      margin: 0 10px 0px -10px;
}

a.kurv {
  color: #fff;
  display: inline-flex;
  background-color: #0091d1;
  text-decoration: none;
}

a.kurv:hover {
  color: #ffffff;
  background-color: #d0008d; /*#ff6600*/
  text-decoration: none;
}

#aabner-kurv {
  display: none;
}

.kurv-aabnet {
  width: 360px !important;
  position: absolute !important;
  top: 258px;
  /*background-color: #0091d1;*/
  padding: 0px !important;
  display: inline-flex;
  overflow: hidden;
  float: right;
  text-align: left;
  border-top-left-radius: 4px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 4px;
  background-color: #ffffff;
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
  z-index: 1000;
  right: 0 !important;
}

.header-kurv-aabnet {
  display: inline-flex;
    position: inherit;
    color: #ffffff;
    background-color: #0091d1;
    width: auto;
    height: 60px;
    min-height: 60px;
    vertical-align: middle;
    padding: 10px;
}

.kurv-aabnet i {
  font-size: 20px;
  vertical-align: -webkit-baseline-middle;
  vertical-align: -moz-middle-with-baseline;
  line-height: 1.5rem !important;
}

.kurv-aabnet a {
  color: #fff;
  text-decoration: none;
}

.kurv-abnnet a:hover {
  color: #5a5a5a !important;
  text-decoration: none;
}

.fremregnede-lyseblaa {
  color: #0091d1;
}

.img-vare-flap {
    display: block;
    width: 48px;
    height: auto;
    margin: 0 auto;
}

.box-img-vare-flap {
  background-color: #fff;
}

.box-content-vare-flap {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 0px !important;
  margin: 15px 0px;
  display: inline-block;
  text-align: center;
  background-color: #ffffff;
}

.felt-laeg-vare-flap {
    border: 1px solid #e6e7e8 !important;
    border-width: thin;
    border-radius: 4px 0px 0px 4px !important;
    -moz-border-radius: 4px 0px 0px 4px !important;
    -webkit-border-radius: 4px 0px 0px 4px !important;
    background-color: #ffffff !important;
    width: 100%;
    height: 30px;
    padding: 0px 10px !important;
    text-align: center;
    /*box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);*/
}

.btn-laeg-vare-flap {
    font-size: 0.6rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 30px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg-vare-flap:hover {
    font-size: 0.6rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #d0008d !important;
    width: 50%;
    height: 30px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

.box-text-vare-flap {
  border-left: 1px solid #e6e7e8;
    border-width: thin;
    background-color: #e6e7e8;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    padding: 20px;
    height: 100%;
}

.btn-orange {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #ff6600;
    border: #d0008d;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
    /* float: right; */
}

.btn-orange:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    /* float: right; */
}

/*
.btn-lyseraad {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #d0008d;
    border: #d0008d;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
}

.btn-lyseraad:hover {

  color: #fff;
  background-color: #5a5a5a;
  border: #5a5a5a;
}
*/

/*
.btn-lyseraad:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
}

.btn-graa {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #bebebe;
    border: #bebebe;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
}

.btn-graa:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    color: #fff;
    background-color: #5a5a5a;
    border: #5a5a5a;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
}
*/
.btn-lyseblaa {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #0091d1;
    border: #0091d1;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    transition: none !important;
    /* float: right; */
}

.btn-lyseblaa:hover {
    font-size: 0.8rem !important;
    padding: 10px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: 35px;
    /* margin-top: 24px; */
    color: #fff;
    background-color: #d0008d;
    border: #d0008d;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 1;
    /* float: right; */
}

.arrow-down {
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;  
  border-top: 10px solid #0091d1;
  margin: 0 auto;
}

/*-------------------------------------

        FLASKE (Produkt åbnet)

----------------------------------------*/

.box-content-vare-flaske {
  width: 100%;
  height: auto;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 0px !important;
}

.img-vare-flaske {
    display: block;
    width: 140px;
    height: auto;
    margin: 0 auto;
    padding: 20px !important;
    background-color: #ffffff;
}

.felt-laeg-flaske {
    border: 0px solid #fff !important;
    border-radius: 4px 0px 0px 4px !important;
    -moz-border-radius: 4px 0px 0px 4px !important;
    -webkit-border-radius: 4px 0px 0px 4px !important;
    border: 0px solid #000000 !important;
    background-color: #e6e7e8 !important;
    width: 100%;
    height: 45px;
    padding: 0px 10px !important;
    text-align: center;
    box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
}

.btn-laeg-flaske {
    font-size: 0.8rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #0091d1 !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
    transition: none !important;
}

.btn-laeg-flaske:hover {
    font-size: 0.8rem !important;
    border-radius: 0px 4px 4px 0px !important;
    -moz-border-radius: 0px 4px 4px 0px !important;
    -webkit-border-radius: 0px 4px 4px 0px !important;
    border: 0px solid #000000 !important;
    background-color: #d0008d !important;
    width: 50%;
    height: 45px;
    display: table-cell !important;
    color: #fff !important;
    padding: 0px 2px !important;
    text-align: -webkit-center;
}

.box-tekst-vare-flaske {
  border-top: 0px solid #e6e7e8 !important;
  border-left: 1px solid #e6e7e8;
  border-width: thin;
  padding: 0 20px !important;
}

.next-flaske {
  color: #000;
  font-size: 1.8rem !important;
  text-align: center;
  display: inline-table;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 20px;
  background-color: #ffffff;
  cursor: pointer;

}

.previous-flaske {
  color: #000;
  font-size: 1.8rem !important;
  text-align: center;
  display: inline-table;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  padding: 20px;
  background-color: #ffffff;
  cursor: pointer;
}

a.next-flaske {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;

}

a.previous-flaske {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;
}

a.next-flaske:hover {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;

}

a.previous-flaske:hover {
  color: #000;
  text-decoration: none;
  background-color: #ffffff;
}

.flip-vertical {
  transform: scaleX(-1);
}

#previous {
  display: block;
}

#next {
  display: block;
}

#arrow-next {}



/*--------------------------------------

            HOVER EFFECT PRODUCT

---------------------------------------*/

.hovereffect a {
  color: #000;
  text-decoration: none;
}
.hovereffect a:hover {
  color: #000;
  text-decoration: none;
}

.hovereffect {
    width: 100%;
    height: auto;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;

    border: 1px solid #e6e7e8;
    border-width: thin;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;

}
.hovereffect .overlay {
    width: 100%;
    position: absolute;
    overflow: hidden;
    left: 0;
    top: auto;
    bottom: 0;
    padding: 1rem 0 0 0;
    height: 138px;
    background: #ffffff;
    color: #3c4a50;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    visibility: visible;
    border-top: 1px solid #e6e7e8;
    border-width: thin;


}

.hovereffect img {
    display: block;
    position: relative;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
}

.hovereffect:hover img {
-webkit-transform: translate3d(0,-10%,0);
  transform: translate3d(0,-10%,0);
}

/*.hovereffect h2 {
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  position: relative;
  font-size: 17px;
  padding: 10px;
  background: rgba(0, 0, 0, 0.6);
  float: left;
  margin: 0px;
  display: inline-block;
}

.hovereffect a.info {
  display: inline-block;
  text-decoration: none;
  padding: 7px 14px;
  text-transform: uppercase;
  color: #fff;
  border: 1px solid #fff;
  margin: 50px 0 0 0;
  background-color: transparent;
}
.hovereffect a.info:hover {
    box-shadow: 0 0 5px #fff;
}


.hovereffect p.icon-links a {
  float: right;
  color: #3c4a50;
  font-size: 1.4em;
}

.hovereffect:hover p.icon-links a:hover,
.hovereffect:hover p.icon-links a:focus {
  color: #252d31;
}

.hovereffect h2,
.hovereffect p.icon-links a {
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  -webkit-transform: translate3d(0,200%,0);
  transform: translate3d(0,200%,0);
  visibility: visible;
}

.hovereffect p.icon-links a span:before {
  display: inline-block;
  padding: 8px 10px;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}*/


.hovereffect:hover .overlay,
.hovereffect:hover h2,
.hovereffect:hover p.icon-links a {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
/*
.hovereffect:hover h2 {
  -webkit-transition-delay: 0.05s;
  transition-delay: 0.05s;
}

.hovereffect:hover p.icon-links a:nth-child(3) {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

.hovereffect:hover p.icon-links a:nth-child(2) {
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}

.hovereffect:hover p.icon-links a:first-child {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

*/
/*----------- END HOVER EFFECT PRODUCT ------------*/



a.side-link {
  position: relative;
  display: block;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.25;
  color: #000000;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px;
  font-size: 1rem;
  margin: 0 5px;
}

a.side-link:hover {
  position: relative;
  display: block;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.25;
  color: #0091d1;
  background-color: #e6e7e8;
  border: 1px solid #e6e7e8;
  border-width: thin;
  text-decoration: none;
  border-radius: 4px;
  font-size: 1rem;
  margin: 0 5px;
}

.footer {
  width: 100%;
  height: auto;
  background-color: #bebebe;
  display: block;
  padding-top: 4rem;
}

.footer ul {
  list-style-type: none;
  margin-block-start: 0em !important;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 0px !important;
}

.footer ul li {
  list-style-type: none;
}

.footer ul li i {
  display: inline-flex;
  width: 2.4rem;
  height: auto;
}

.footer li a {
  color: #5a5a5a;
  line-height: 1.2rem !important;
}

.footer li a:hover {
  color: #ffffff;
  line-height: 1.2rem !important;
  text-decoration: none;
}

.dropdown-divider {
    height: 0;
    margin: 0 !important;
    overflow: hidden;
    border-top: 1px solid #bebebe;
    border-width: thin !important;
}


/*-------------------------------------------------------------------------

                      KURV (Bestilling - Levering - Kvittering)                          

--------------------------------------------------------------------------*/




    #trin-aktiv {
      width: 200px;
      height: 100px;
      position: relative;
      background: #0091d1;
      color: #fff;
    }
    #trin-aktiv:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid white;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }
    #trin-aktiv:before {
      content: "";
      position: absolute;
      right: -50px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid #0091d1;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }


    #trin-passiv {
      width: 200px;
      height: 100px;
      position: relative;
      background: #ededed;
      color: #bebebe;
    }
    #trin-passiv:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid white;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }
    #trin-passiv:before {
      content: "";
      position: absolute;
      right: -50px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid #ededed;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
      color: #fff;
    }


  .box-wrap-bestilling {
    width: 100%;
    display: inline-flex;
    border: 1px solid #e6e7e8;
    border-width: thin;
    border-radius: 4px 4px 0px 0px;
    padding: 20px;
  }

  #royal-classic {
    width: 100%;
  }

.close-vare {
  color: #000 !important;
}

.close-vare:hover {
  color: #0091d1 !important;
}

.footer-box-wrap-bestilling {
  width: 100%;
  display: table-row;
  background-color: #d0008d;
  border-radius: 0px 0px 4px 4px;
  border: 0px solid #fff;
}

.cell-50 td, tr {
  width: 50%;
}

.remove-border-top {
  border-bottom: 0px solid #dee2e6 !important; border-top: 0px solid #dee2e6 !important;
}

#table-mobile {
  border-top: 0px solid #e6e7e8 !important;
  display: inline-table;
  padding: 0.75rem;
}

#tr {
  border-top: 1px solid #dee2e6;
}

table#table-bestillinger {
  display: inline; 
}

/*-----------------------------------------

              LEVERING                      

-------------------------------------------*/



.box-wrap-levering {
    width: 100%;
    display: block;
    border: 1px solid #e6e7e8;
    border-width: thin;
    border-radius: 4px 4px 4px 4px;
    padding: 20px;
  }

  /*
  .form-control-kurv {
  border: 1px solid #e6e7e8;
  border-width: thin;    
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  height: 65px !important;
  left: 0px;
  top: 0px;

  background-color: #fff !important;
  padding-left: 30px;
  width: 100%;
}
*/

.form-check .form-check-input {
  border: 1px solid #e6e7e8 !important;
  border-radius: 4px !important;
  
}

.form-control-kommenter {
  border: 1px solid #e6e7e8;
  border-width: thin;    
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  height: auto !important;
  /*margin-top: 24px;*/
  left: 0px;
  top: 0px;
  /*width: 600px;*/

  background-color: #fff !important;
  padding-left: 30px;
  width: 100%;
  /*-webkit-box-shadow: inset 1px 1px 1px 1px #ccc;
    box-shadow: inset 1px 1px 1px 1px #ccc;*/
}


/*--------------------------------------------------*/




/*-----------------------------------------------------

                    KVITTERING                        

------------------------------------------------------*/

ul#list-print {
  width: 100%;
  display: flex;
}

ul#list-print li {
  color: #bebebe;
  display: inline-block;
  padding: 0px 10px;
}

ul#list-print li a {
  color: #bebebe;
}
      
ul#list-print li a:hover {
  color: #d0008d;
}

/*------------------------------------------------------*/



/*--------------------------------------------------------

                      KONTO                               

-----------------------------------------------------------*/

#wrap-konto {
  background-color: #e6e7e8 !important;
}

.box-wrap-konto-profil {
    padding: 20px;
}

.img-profiler-thumb {
  padding: .25rem;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-radius: 100%;
  max-width: 90px;
  height: 90px;
}

.img-profil {
  padding: .25rem;
  background-color: #fff;
  border: 1px solid #e6e7e8;
  border-radius: 100%;
  width: 180px;
  max-width: 180px;
  height: 180px;
  margin: 0 1rem;
}

.hvid-baggrund {
  background-color: #fff;
  width: 100%;
  height: 100%;
  display: block;
  border: 1px solid #e6e7e8;
  border-width: thin;
  border-radius: 4px 4px 4px 4px;
}

.border-b {
  border-bottom: 1px solid #e6e7e8;
  border-width: thin !important;
}

#profil i {
  font-size: 1rem;
  line-height: 0px;
  vertical-align: -webkit-baseline-middle;
}

#profil a {
  font-size: 1rem;
  color: #0091d1;
  line-height: 0px;
  vertical-align: -webkit-baseline-middle;
  text-decoration: none;
}

#profil a:hover {
  color: #d0008d;
  text-decoration: none;
}

/*-----------------------------------------------------------*/




/* -----------------------------------------------------------------------

                            STEPS BY BOOSTRAP                             

--------------------------------------------------------------------------*/



/*--------------------------------------------------------*/




.margin-top-60 {
  margin-top: 60px;
}
.margin-top-40 {
  margin-top: 40px;
}
.margin-top-30 {
  margin-top: 30px;
}
.margin-top-20 {
  margin-top: 20px;
}

.margin-bottom-60 {
  margin-bottom: 60px;
}
.margin-bottom-40 {
  margin-bottom: 40px;
}
.margin-bottom-30 {
  margin-bottom: 30px;
}
.margin-bottom-20 {
  margin-bottom: 20px;
}

p, span {
  font-size: 0.8rem; overflow-wrap: break-word; line-height: normal !important; margin-bottom: 0px !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  line-height: 1.6 !important;
}


h1 {
  font-size: 3rem !important; overflow-wrap: break-word; /*Title (bold)*/
}

h2 {
  font-size: 2.4rem !important; overflow-wrap: break-word; /*Price product opened (Bold)*/
}

h3 {
  font-size: 1.75rem !important; overflow-wrap: break-word; /*Price (Bold)
                        Name product open 
                        Andre produkter*/
}

h4 {
  font-size: 1.6rem !important; overflow-wrap: break-word; /*Subtitle (Medium)
                      Price i Kurv (White, bold)
                      LÆG I KURV product open (white)*/
}

h5 {
  font-size: 1.2rem !important; overflow-wrap: break-word;/*Product name (Bold)*/
}

h6 {
  font-size: 1rem !important; overflow-wrap: break-word; /*paragraph (Light)
                        fast lav pris opened product (light italic)*/
}

.cl-flasker {
  font-size: 0.8rem !important; overflow-wrap: break-word; /*Light*/
  /*font-weight: 200;*/
}

.small-text {
  font-size: 0.7rem !important; overflow-wrap: break-word; /*DKK ink.moms i kurv (white + light)
                        description opened product (black)*/
}

.extra-small-text {
  font-size: 0.875rem !important; overflow-wrap: break-word; /*DKK ink.moms i kurv (white + light)
                        description opened product (black)*/
}

.price {
  font-size: 1.2rem !important; /*Subtitle (Medium)
                      Price i Kurv (White, bold)
                      LÆG I KURV product open (white)*/
}

.break-word {
  overflow-wrap: break-word;
}

/*
h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.3;
  font-family: Roboto, sans-serif;
  //font-family: 'Gudea', sans-serif;
}
*/

/*
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-weight: inherit;
  //font-family: Roboto, sans-serif;
}
*/

.medium {
  font-weight: 400 !important;
}

.bold {
  font-weight: 500 !important;
  font-weight: bold !important;
}

.bolder {
  font-weight: 700 !important;
  font-weight: bolder !important;
}

.extra-black {
  font-weight: 900 !important;
}

.lyseblaa {
  color: #0091d1; /* #ff6600; orange */
}


}

/* NEW DESIGN 2023 */


@font-face {
  font-family: "calibri";
  src: url("/new/2023/calibri.ttf") format('truetype');
}

@font-face {
  font-family: "vastagogrotesk";
  src: url("/2023/fonts/VastagoGrotesk-Regular.otf") format("opentype");
  font-weight: normal;
}

@font-face {
  font-family: "vastagogrotesk";
  src: url("/2023/fonts/VastagoGrotesk-SemiBold.otf") format("opentype");
  font-weight: 600;
}

@font-face {
  font-family: "vastagogrotesk";
  src: url("/2023/fonts/VastagoGrotesk-Bold.otf") format("opentype");
  font-weight: 700;
}

@font-face {
  font-family: "vastagogrotesk";
  src: url("/2023/fonts/VastagoGrotesk-Light.otf") format("opentype");
  font-weight: light;
}

body,.footer {
  font-family: 'vastagogrotesk',serif !important;
  font-weight:normal;
  font-size: 1.2rem;
}

input {
  border:1px solid #1a2b4c;
}

.grotesk {
  font-family: 'vastagogrotesk',serif !important;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-family: 'Ultra', serif !important ;
}

h1 {
  font-family: 'Ultra', serif !important ;
}

h2 {
  font-family: 'Ultra', serif !important ;
}

h3 {
  font-family: 'Ultra', serif !important ;
}

h4 {
  font-family: 'Ultra', serif !important ;
  font-size:0.5rem;

}

h5 {
  /*font-family: 'Ultra', serif !important ;*/
  font-size:1rem;
}

.bold {
  color:#1a2b4c !important
}

.sbh1 {
  font-family: 'Ultra', serif !important ;
  color:#1a2b4c !important
}

.headline {
  font-family: 'Ultra', serif !important ;
}

.sb-btn {
  background-color:#b9e15d !important;
  color:#1a2b4c !important;
  padding: 10px;
  position: relative;
  display: inline-block;
  height: auto;
  min-height: 35px;
  /* margin-top: 24px; */
  /* color: #fff; */
  /* background-color: #d0008d; */
  border: #d0008d;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  z-index: 1;
  transition: none !important;
  text-align: center;
  text-transform: uppercase;
  font-size:0.8rem;
}

.sb-btn:disabled {

  /* margin-top: 24px; */
  color: #fff !important;
  background-color: #5a5a5a !important;
  border: #5a5a5a !important;
  pointer-events: none;
  cursor: default;

}

.sb-btn:hover {
  background-color:#1a2b4c !important;
  color:#fff !important;
  text-decoration: none;
}

.sb-btn-round-blue {
  border:0;
  background-color:#1a2b4c;
  color:#b9e15d;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
  font-weight:bold;
  padding:2px;
  padding-left:25px;
  padding-right:25px;
  text-decoration: none;
}

.sb-btn-round {
  border:0;
  background-color:#b9e15d;
  color:#1a2b4c;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
  font-weight:bold;
  padding:2px;
  padding-left:25px;
  padding-right:25px;
  text-decoration: none;
}

.sb-btn-round-lg {
  border:0;
  background-color:#b9e15d;
  color:#1a2b4c;
  border-top-left-radius: 12px;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
  font-weight:bold;
  line-height:1.4rem;
  font-size:1.4rem;
  padding:8px;
  padding-left:25px;
  padding-right:25px;
  text-decoration: none;
}

.sb-btn-light {
  border:0;
  background-color:#b9e15d;
  color:#1a2b4c;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
  padding:2px;
  padding-left:25px;
  padding-right:25px;
  text-decoration: none;
}

.sb-btn-round:hover,.sb-btn-round-lg:hover {
  background-color:#1a2b4c !important;
  color:#fff !important;
  text-decoration: none;

}

.sb-btn-round-blue:hover {
  background-color:#04a9aa !important;
  color:#fff !important;
  text-decoration: none;

}

.sb-cart-btn {
  background-color:#b9e15d !important;
  color:#1a2b4c !important;
  font-size: 0.6875rem !important;
  border-radius: 0px 0px 4px 0px;
  -moz-border-radius: 0px 0px 4px 0px;
  -webkit-border-radius: 0px 0px 4px 0px;
  width: 100%;
  height: 45px;
  display: table-cell !important;
  text-align: -webkit-center;
  transition: none !important;
  
}

.sb-cart-btn:hover {
  background-color:#1a2b4c !important;
  color:#fff !important;
  border-radius: 0px 0px 4px 0px;
  -moz-border-radius: 0px 0px 4px 0px;
  -webkit-border-radius: 0px 0px 4px 0px;
  width: 100%;
  height: 45px;
  display: table-cell !important;
  text-align: -webkit-center;
}

.sb-input {
  height: 64px !important;
  left: 0px;
  top: 0px;
  margin-top:24px;
  padding-left: 4rem;
  width: calc(100% - 4rem);
}

.sb-input-23 {
  height: 32px !important;
}

.sb-input-round {
  border-radius: 25%;
  border: 1px solid #b9e15d !important;
  background-clip:unset !important;
}

.sb-bg-blue {
  background-color:#1a2b4c !important
}

.sb-bg-green {
  background-color:#b9e15d !important
}

.sb-btn-green {
  background-color:#b9e15d !important
}

.sb-bg-turq {
  background-color:#04a9aa !important
}

.sb-green-text {
  color:#b9e15d !important
}

.sb-blue-text {
  color:#1a2b4c !important
}

.sb-turq-text {
  color:#04a9aa !important
}

/* NAVIGATION */

.dropdown-menu {
    background-color:#1a2b4c;
    padding: 0px !important;
    margin:0 !important;
    border:0px !important;
}
.nav-item a {
  font-size: 1rem;
  font-weight: 400;
}

.nav-product-menu li {
  min-width:unset !important;
}


.nav-link {
  outline : none !important;
}
.dropdown-menu a {
    color:#b9e15d;
    font-size: 1rem;
}

/* LANDING PAGE */

.logo2023 {
  margin-top:15px;
  margin-left:10px;
  width: 139.5px;
  height: 139.5px;
}

/*
.new2023 h1,h2,h3 {
  font-family: 'Ultra', serif;
  font-family: 'vastagogrotesk',serif !important;
}
*/

/*
.new2023 h1 {
  font-family: 'vastagogrotesk',sans-serif !important;
}
*/


.new2023 h1, .new2023 h1 span  {
  font-size:3rem !important;
  line-height:3rem !important;
}

.new2023 p {
  font-size: 1.4rem;
  font-weight: 400;
  line-height:1.5em;
}

.img-dude {
    min-height:640px;
}

.dude-text h1 {
  color:#1a2b4c;
}

.dude-text h2 {
    color:#fff;
}

.dude-text p {
  color:#fff;
  font-size:2rem;
  font-weight:400;

}

.product-twisted {
  background-image: url('/2023/palmleafs.jpeg');
  background-repeat:no-repeat;
  background-size:cover;
}

/* Landing page explainer */

.sb-ul {
  list-style: none;
  color:#1a2b4c;
  padding-left: 0;
  margin-top:20px;
}

.sb-ul li {
  position: relative;
  padding-left: 40px;
  line-height: 2rem;
}
.sb-ul li:before {
  content: '';
  width: 40px;
  height: 40px;
  position: absolute;
  background-image: url('/2023/Studenterbolaget_stjerne.svg');
  background-size: cover;
  background-position: center;
  left: 0;
  top: 15px;
  transform: translateY(-50%);
}

.hero h1.party {
  font-size:2rem !important;
}

.hero-btn {
  position:relative;
}

/* What is said */
.about-us img.logo-aboutus {
  width:193px;
  height:auto;
  position:absolute;
  bottom:-90px;
}

/* LADY IN DARK */
.ladyinthedark {
  background-image: url('/2023/ladyinthedark.jpg');
  background-repeat:no-repeat;
  background-size:cover;
  min-height:320px;
}

/* Footer */

.footer {
  background-color:#1a2b4c !important;
  color:#b9e15d !important;
}

.footer ul li  {
  padding-top:2px;
  padding-bottom:2px;
}

.footer ul li a,.footer a {
  color:#b9e15d !important;
}

@media (min-width: 768px) { 
  .hero-btn {
    position:absolute;
    bottom:15%;
    right:8%;
    font-size:1rem;
  }

  .logo2023 {
    padding:0;
    width: 139.5px;
    height: 139.5px;
    margin-left:20px;
    margin-top:10px;
  }

  .new2023 h1, .new2023 h1 span  {
    font-size:4rem !important;
    line-height:4rem !important;
  }
  
  .img-hero-heineken {
    background-image:url('https://productimages.ams3.cdn.digitaloceanspaces.com/hero_heinekensilver_cropped.png');
    background-repeat:no-repeat;
    object-fit: cover;
    min-height:940px;
  }

  .img-hero {
    background-image:url('/2024/hero.jpeg');
    background-repeat:no-repeat;
    object-fit: cover;
    min-height:940px;
  }

  .logo-footer {
    width: 123px;
    position:absolute;
    bottom:40px;
    left:40px;
  }

}

@media (min-width:1025px) {
  .nav-item a {
    font-size: 1.2rem;
  }
}

span.sb-offer-section {
  font-size:3.5rem !important;

}

@media (max-width: 992px) { 

  span.sb-offer-section {
    font-size:2rem !important;

  }

  h1.sb-offer-section {
    font-size:2rem !important;
  }

  .logo2023 {
    padding:0;
    width: 80.5px;
    height: 80.5px;
    margin-left:20px;
    margin-top:10px;
    margin-bottom:10px;
  }

  .sbh1 {
    font-size:2.1rem !important;
  }
  .img-dude {
    background-image:none;
    min-height:auto;
  }

  .img-hero {
    background-image:none;
    min-height:auto;
  }

  .carousel-item p {
    font-size: 1rem;
  }
  .ladyinthedark {
    min-height:420px;
  }
}

/*
@media (max-width: 1300px) { 
  .img-hero {
    background-image:none;
    min-height:auto;
  }
}
*/

.logo-footer {
  width: 139px;
  max-width:100%;
  height: auto;
  margin-bottom:20px;
}

/* CAROUSEL */

.carousel-control-prev .svg-triangle {
  margin: 0 auto;
  width: 46px;
  height: 46px;
  position:absolute;
  bottom:20px;
  left:20px;
}

.carousel-control-next .svg-triangle {

  margin: 0 auto;
  width: 46px;
  height: 46px;
  position:absolute;
  bottom:20px;
  right:20px;
}


.svg-triangle polygon {
  fill:#04a9aa;
}

.container-fluid{
  overflow: hidden;
}

/* TERMS */
.terms p, .terms i {
  font-size:1rem;
  line-height: 1.5rem !important;
}

.terms .headline {
  font-size:1.2rem;
}

.terms a {
  text-decoration: underline;
  color:#1a2b4c;
}

.terms a:hover {
  text-decoration: none;
  color:#b9e15d;
}


/* SHOP ORDER */
.trin-aktiv {
  background-color:#b9e15d !important;
  color:#1a2b4c !important;
  padding-left:10px;
}

.trin-passiv {
  padding-left:10px;
}

.trin-aktiv:before {
  border-left: 50px solid #b9e15d !important;
}

.trin-aktiv h2 {
  font-size:1.8rem !important;
}

.trin-passiv h2 {
  font-size:1.8rem !important;
}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) { 


  .hero-btn {
    position:absolute;
    bottom:5%;
    right:5%;
    font-size:1rem;
  }

  .trin-aktiv h2 {
    font-size:1.2rem !important;
  }

  .trin-passiv h2 {
    font-size:1.2rem !important;
  }

}

.box-content-trin-aktiv {
  background-color:#b9e15d !important;
  color:#1a2b4c !important;
}

.arrow-down-trin-aktiv {
  border-top: 10px solid #b9e15d;

}

/* Post xmax 2024 */

.sb-bg-boost {
  background-image:url('/2024/boosterbg.jpg');
  background-repeat:no-repeat;
  background-position:center;
  object-fit: scale-down;
  background-size:cover;
}


@media (min-width: 768px) { 

  .fp-mixmatch img {
    width:60%;
  }

  .fp-mixmatch img.capsule {
    width:80%;
  }

}


/* September 2024 FP design */

.sept-24-redbull-stack {
  display:none;
}

@media (min-width: 768px) { 

  
  .sept-24-redbull-stack {
    display:inline-block;
    width:18% !important;
  }

  .sept-24-bold {

    width:25% !important;
  }  
}

/* Xmas 24 */

.img-xmas-24 {
  background-image:url('/2024/xmas/juledaase_cropped.png');
  background-repeat:no-repeat;
  width:100%;
  height:940px;

}