#top_img_desktop {
        display: none;
    }
#top_img_mobile {
          display: block;
        }
    
@media (min-width: 1024px) {
        #top_img_mobile {
          display: none;
        }
#top_img_desktop {
        display: block;
    }
      }

      #bildDesktop {
        display: none;
    }
#bildMobil {
          display: block;
        }
    
@media (min-width: 1024px) {
        #bildMobil {
          display: none;
        }
#bildDesktop {
        display: block;
    }
      }
  
   .topBanner {
      width:100%;
      float: left;
    }
  
  .desktop {
      display: block;
    }
  
  .mobile {
      display: none;
    }
   
  .topTextArea {
      clear: both;
      width: 98%;
      display: inline-block;
      margin: 2% 1% 1% 1%;
      box-sizing: border-box;
      background-color: #fff;
      text-align: center;
      border-radius: 5px;
      padding: 25px 6% 30px 6%;
      box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
  }
  

  
  .topTextArea h1 {
      font-weight: bold;
      font-size: 30px;
      line-height: 30px;
      max-width: 100%;
      margin-top: 20px;
      margin-bottom: 20px;
    }
  
    .topTextArea p {
      max-width: 100%;
      font-family: var(--font-family-ica-text-ny);
      font-size: 16px;
    }

  .adsWrapper {
    display: flex;
      flex-direction: row;
      flex-flow: wrap;
      justify-content: start;
      align-items: stretch;
margin: 0 5px;
  }
  
  .adsWrapper article {
  position: relative;
        width: 23%;
      margin: 1% 1%;
      background: #fff;
      border-radius: 5px;
      box-sizing: border-box;
      padding: 1%;
  text-align: center;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }
  
  .adsWrapper article h2 {
      font-family: var(--font-family-ica-rubrik);
    font-size: 19px;
    font-weight: bold;
    margin-top: 15px;
    margin-bottom: 0;
    display: inline-block;
  }

    .adsWrapper article h3 {
    font-size: 19px;
    font-weight: 500;
    margin-top: 0px;
    margin-bottom: 0;
    display: block;
  }
  
  .adsWrapper article p {
  font-family: var(--font-family-ica-text-ny);
  font-size: 13px;
  line-height: 18px;
  margin-bottom: 5px;
margin-top: 5px;
  }
  
  .adsWrapper article .orgPrice {
      font-family: var(--font-family-ica-rubrik);
      font-weight: 700;
      font-size: 20px;
      margin: 7px 0 5px 0;
  }
  
  .imageWrapper {
  width: 100%;
  position: relative;
  display: inline-block;
  float: left;
  }
  
  .imageWrapper img {
  width: 100%;
  float: left;
  }

    .kravDiv {
    width: 100%;
    position: absolute;
    top: 0px;
    font-family: 'ICA Text';
    font-size: 15px;
    line-height: 18px;
    color: white;
    background-color: #E3000B;
    box-sizing: border-box;
    padding: 5px;
    border-radius: 5px;
  }

  .kravText {
    font-size: 11px!important;
    line-height: 11px!important;
  }
  
  .prisSplash {
position: absolute;
    bottom: -15px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: clamp(100px, 65%, 150px);
    aspect-ratio: 15 / 10;
    background-size: cover;
  } 
  
.splashNaraGul {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-nara-gul);
}

.splashNaraStammis {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-nara-stammis-v2);
}

.splashSupermarketGul {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-supermarket-gul);
}

.splashSupermarketStammis {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-supermarket-stammis-v2);
}

.splashKvantumGul {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-kvantum-gul);
}

.splashKvantumStammis {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-kvantum-stammis-v2);
}

.splashMaxiGul {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-maxi-gul);
}

.splashMaxiStammis {
background-image: url(https://assets.icanet.se/w_200,q_auto:eco,f_auto/splash-dig-erbj-maxi-stammis-v2);
}
  
  .splashPrice {
  width: 100%;
      position: absolute;
      top: 55%;
      transform: translateY(-55%);
      -webkit-transform: translateY(-55%);
      font-family: var(--font-family-ica-rubrik);
font-weight: 900;
      font-size: clamp(29px,3vw,40px);
      color: #E3000B;
  }
  
  .splashPriceDec {
font-size: clamp(2px, 2vw, 27px);
    bottom: clamp(2px, 0.7vw, 9px);
    position: relative;
    margin-left: 1px;
  }
  
  /*
  .splashPriceText {
  font-size: 3vw!important;
      font-family: var(--font-family-ica-rubrik)!important;
      font-weight: 900!important;
  }*/

  .splashPriceText {
  font-size: clamp(19px, 2.4vw, 29px)!important;
  top: 50%!important;
  }
  
  .spalshPrefix {
      width: 100%;
    position: absolute;
    bottom: 60%;
    font-size: clamp(11px, 1vw, 13px);
    font-family: var(--font-family-ica-text-ny);
    font-weight: 700;
    color: #E3000B;
  }
  
  .spalshSuffix {
  width: 100%;
      position: absolute;
      bottom: 12%;
    font-size: clamp(11px, 1vw, 12px);
      font-family: var(--font-family-ica-text-ny);
  font-weight: 700;
      color: #E3000B;
  }
 
  
.recipeTitle {
    font-size: 17px;
}

.recipeBtn {
    background-color: #E13205;
    color: white;
    border-radius: 40px;
    font-weight: 700;
    padding: 5px 20px;
    text-decoration: none;
    display: inline-block;
    margin: 10px 0;
    font-size: 15px;
    font-family: var(--font-family-ica-text-ny);
}

.recipeBtn:hover {
    color: white !important;
    text-decoration: none !important;
    background-color: #b41b04 !important;
}
  

  
@media (max-width: 1124px) {
.spalshPrefix {
    bottom: 57%;
  }
.spalshSuffix {
    bottom: 8%;
}
 }
  
  
 @media (max-width: 768px) {
  .adsWrapper {
    margin-bottom: 30px;
  }
  .adsWrapper article {
        width: 31.33%;
  padding: 2%;
  }
  .splashPrice {
      font-size: clamp(2px,4vw,40px);
  }
.splashPrice {
      top: 53%;
  }
  .splashPriceDec {
font-size: clamp(2px, 3vw, 27px);
    bottom: clamp(2px, 0.7vw, 9px);
  }
.spalshPrefix {
    bottom: 57%;
  }
.spalshSuffix {
    bottom: 12%;
}
}
  
 
  
  @media (max-width: 600px) {
  .adsWrapper article {
        width: 48%;
  padding: 2%;
  }
  .splashPrice {
      font-size: clamp(2px,6.5vw,40px);
top: 55%;
  }

  .splashPriceDec {
font-size: clamp(2px, 4.3vw, 27px);
    bottom: clamp(2px, 1.5vw, 9px);
  }
.spalshPrefix {
    bottom: 10vw;
    font-size: clamp(11px, 3vw, 12px);
  }
.spalshSuffix {
    bottom: 13%;
}
.splashPriceText {
    font-size: clamp(19px, 4.5vw, 27px) !important;
}
}


  
  @media (max-width: 550px) {
      .desktop {
        display: none;
      }
  
      .mobile {
        display: block;
      }
.spalshPrefix {
    bottom: 10.5vw;
    font-size: clamp(11px, 3vw, 12px);
  }
.spalshSuffix {
    bottom: 12%;
}
.kravDiv {
    font-size: 12px;
    line-height: 14px;
  }
  }
  
@media (max-width: 400px) {
.spalshPrefix {
    bottom: 10vw;
  }
.spalshSuffix {
    bottom: 9%;
}
}