body{
   user-select: none; /* supported by Chrome and Opera */
   -webkit-user-select: none; /* Safari */
   -khtml-user-select: none; /* Konqueror HTML */
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* Internet Explorer/Edge */   
}

* { outline:none !important; }

a{
   outline:none !important;
    text-decoration:none!important; 
}


.coolBackground{

    width: 100%;
    height: 287px;
    color: #fff;    

    background: linear-gradient(315deg, #ec008c, #6723d5);

    box-shadow: 0 8px 6px -6px #00000073;
    -webkit-box-shadow: 0 8px 6px -6px #00000073;
    -moz-box-shadow: 0 8px 6px -6px #00000073;
    
}

.fetchColor{
     color: #ec008c;   
}


@-webkit-keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

@-moz-keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

@keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

.titleDiv{
     width:100%;
     margin: 0 0%;
     text-align:center;
}

.title{
    font-family: 'Hurme';   
    font-style: normal;
    font-weight: 600;
    font-size: 62px;
    line-height: 84px;

    font-size: 62px;
}

.viewStoresTitle{
    font-size: 48px;
}


.townSelect{
    
    width: 262px;
         font-family: "EuclidesCircularARegular";
        font-style: normal;
      font-weight: 300;

         
       border:none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -ms-appearance: none; 


    background: none;
      background-image: url('../../images/shop/white-arrow.svg');
      color:#FFF;
    background-repeat: no-repeat, repeat;
    background-position: right 3px top 28px, 0 0;
    background-size: .65em auto, 100%;
    
    outline:none;
    font-size: 22px;
    
    border: none;
    cursor:pointer;
    color:white;
        border-bottom: 1px solid black;
}


.townSelect option{
     color:black !important;   
     font-size:32px !important;
     padding:12px;
}


.townSelectSticky{

    font-family: "EuclidesCircularARegular";
    font-style: normal;
    font-weight: 300;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -ms-appearance: none;
    color: #FFF;
    
      background: none;
      background-image: url('../../images/shop/pink-arrow.svg');
    background-repeat: no-repeat, repeat;
    background-position: right 0px top 19px, 0 0;
    background-size: .9em auto, 100%;
    

    outline: none;
    font-size: 22px;
    border: none;
    cursor: pointer;
    color: black;
    width: 111px;
}


.townSelectSticky option{
     color:black !important;   
     font-size:32px !important;
     padding:12px;
}

.subtitle{
    font-size: 26px;  
}

.dropDownStickyDiv{
    
   width: 140px;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    position: absolute;
    top: -1px;
    left: -2px;
    height: 49px;
    padding-left: 23px;
    background:#f4f4f463;
    line-height: 50px;
}

@font-face {
  font-family: 'Hurme';
  src: url('../../fonts/Hurme.woff2');
  font-weight: 200;
  font-style: normal;
  unicode-range: U+02-7F;
}

@font-face {
  font-family: 'HurmeBold';
  src: url('../../fonts/HurmeBold.woff2');
  font-weight: 800;
  font-style: normal;
  	unicode-range: U+02-7F;
}


@font-face {
	font-family: 'Euclides';
	 src: url('../../fonts/EuclidCircularB-Regular.otf');
  	/* unicode range for greek alphabet */
	 unicode-range: U+02-7F;
}

@font-face {
	font-family: 'EuclidesCircularARegular';
	 src: url('../../fonts/EuclidCircularA-Regular.woff');
  	/* unicode range for greek alphabet */
	 unicode-range: U+02-7F;
}


@font-face {
	font-family: 'EuclidLight';
	 src: url('../../fonts/EuclidCircularA-Light.ttf');
  	/* unicode range for greek alphabet */
	 unicode-range: U+02-7F;
}

body{
     background: #f1f1f1;   
}

.hurmeFont{
        font-family: 'HurmeBold';
}

.link{
     font-family: 'Euclides';
    color:#fff; 
    font-weight:600;
}

.customContainer{
     width: 90%;
     margin: 0 5%;
}

.navbar{
     background-color: rgba(255,255,255,1);
     color: #000000;
     
}

.scroll-content{
  padding: 0px;
}



.hurmeFont{
  font-family: "Hurme" !important;
}




.topDiv{

}

.topRow{
    width: 100%;
    background-color:#ec008c;
    position: fixed;
    z-index: 1000;
    border-bottom: 1px solid white;
}

.backArrow{
    font-size: 35px;
      position: absolute;
      color: white;
      line-height: 50px;
      padding: 35px 0 0px 10px;
  }

  
.bottomRow{
    margin-top: 81px;
    margin-bottom: 0px;
    padding-top: 1px;
  }

  .catCard{
    width:48%;
    height:166px;
    margin: 2%;

    margin-left: unset;
    margin-right: unset;
    -webkit-margin-start: 10px;
    margin-inline-start: 10px;
    -webkit-margin-end: 10px;
    margin-inline-end: 10px;

    background: var(--ion-item-background,transparent);
    color: var(--ion-color-step-550,#737373);
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 4px;
    font-size: 14px;
    -webkit-box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
  }


  .catImage{
    width:100%;
    height: 166px;
    display: block;
  }

  
.overlay{
  z-index: 9910000;
  background-color:#ec008e;
  width: 100%;
  height: 100%;
  padding: 16% 0;
  position: fixed;
  top: 0;
  text-align: center;
}


  .cardOverwrite{
    margin:6px;
    text-align: center;
  }

  .backArrowPostcode{
    font-size: 44px;
      line-height: 50px;
      color: white;
      z-index: 9999;
      position: fixed;
      bottom: 35px;
      left: calc(50% - 22px);
  }
  
  .item-has-focus .label-floating.sc-ion-label-md-h{  
    color: #ec008e;
  }
  
  .card2{   
      cursor:pointer;
      border: 1px solid #80808029;
  }
  
  
   .scrolling-wrapper-flexbox {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  

  
     .scrolling-wrapper-flexbox .card2 {
      flex: 0 0 auto;
      text-align: center;
         min-width: 180px;
      max-width: 180px; width:100px; padding:5px;
    }


  .scrolling-wrapper-flexboxItems {
 

   width: 100%;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 4px 2px 4px 2px;
    
    width:4px;
     /* -ms-overflow-style: none; */  /* IE and Edge */
     /* scrollbar-width: none; */  /* Firefox */

  }
  
    .scrolling-wrapper-flexboxItems::-webkit-scrollbar {
     
      width:4px;
    }
  
  .scrolling-wrapper-flexboxItems .card2 {
      flex: 0 0 auto;
      text-align: center;
         min-width: 180px;
      max-width: 180px; padding:6px;
      background: #fff;
        border-radius: 6px;
        margin: 0 4px;
        -webkit-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
        -moz-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);

      box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
    } 
    
    
    .leftArrow{
        display: none;
    }
    
    .scrolling-wrapper-flexboxItems+leftArrow{
         display:block;   
    }
    
    
    .browseByCategory .flickity-viewport{
            height: 200px !important;
    }
    
      .storePromoDiv .flickity-viewport{
            height: 152px !important;
    }
 
     .itemPromoDiv .flickity-viewport{
            height: 266px !important;
    } 

        .itemLargePromoDiv .flickity-viewport{
            height: 387px !important;
    } 

    .brandPromo .flickity-viewport{
            height: 169px !important;
    } 

     .bannerPromo .flickity-viewport{
            height: 400px !important;
    } 

    
      .carousel .card2 {
      flex: 0 0 auto;
      text-align: center;
      height:133px;
         min-width: 180px;
      max-width: 180px; padding:6px;
      background: #fff;
        border-radius: 6px;
        margin: 0 4px;
        -webkit-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
        -moz-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);

      box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
    } 
    
    
          .carousel .categoryCard2 {
      flex: 0 0 auto;
      text-align: center;
      height:193px;
         min-width: 180px;
      max-width: 180px;
      background: #fff;
        border-radius: 8px;
        margin: 0 6px;
        -webkit-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
        -moz-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);

      box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
      
     transition: all .2s ease-in-out;
    } 
    
    .carousel .categoryCard2:hover{
        
    transform: scale(1.03);
    }
    
    
   .carousel .storeCard2 {
      flex: 0 0 auto;
      text-align: center;
      height:146px;
         min-width: 220px;
      max-width: 220px;
      background: #fff;
        border-radius: 8px;
        margin: 0 6px;
        -webkit-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
        -moz-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);

      box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
      
     transition: all .2s ease-in-out;
     
    } 
    
    .carousel .storeCard2:hover{
        
    transform: scale(1.03);
    }
    
       .carousel .itemCard2 {
      flex: 0 0 auto;
      text-align: center;
      height:260px;
         min-width: 190px;
      max-width: 190px;
      background: #fff;
        border-radius: 8px;
        margin: 0 6px;
        -webkit-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
        -moz-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);

      box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
      
      
     transition: all .2s ease-in-out;
    } 
    
      .carousel .itemCard2:hover{
        
    transform: scale(1.03);
    }
        
    .carousel .categoryCard2:hover{
        
    transform: scale(1.03);
    }
    
    .storeCardBig {
      flex: 0 0 auto;
      text-align: center;
      height:193px;
      width:100%;
      background: #fff;
        border-radius: 8px;
        margin: 0 6px;
        -webkit-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
        -moz-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);

      box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
      
     transition: all .2s ease-in-out;
    } 
    

    .storeCardBig:hover{
        
        transform: scale(1.03);
    }
    
    .storeCardBigImage{
         vertical-align: middle;
        border-style: none;
        width: 100%;
        height: 132px;
        
        border-radius:8px;
        object-fit: cover;   
    }
    
    .storeCardBigTxt{
        font-family: "EuclidesCircularARegular";
        font-style: normal;
        font-weight: 300;
        text-align: left;
        /* height: 44px; */
        line-height: 20px;
        margin: 12px 22px 12px 22px;
        font-size: 18px;
    }


    
    .storePromoImage{
     vertical-align: middle;
    border-style: none;
    width: 100%;
    height: 90px;
    
    border-top-left-radius:8px;
    border-top-right-radius:8px;
    object-fit: cover;   
}

.storePromoTxt{
    font-family: "EuclidesCircularARegular";
    font-style: normal;
    font-weight: 300;
    text-align: left;
    /* height: 44px; */
    line-height: 17px;
    margin: 12px 22px 12px 22px;
    font-size: 14px;
}

.itemPromoTxt{
    font-family: "EuclidesCircularARegular";
    font-style: normal;
    font-weight: 300;
    text-align: left;
    /* height: 44px; */
    height:30px;
    margin: 12px 22px;
    font-size: 10px;
}

.itemProductPromoTxt{
    font-family: "EuclidesCircularARegular";
    font-style: normal;
    font-weight: 300;
    text-align: left;
     height: 60px; 
    margin-left: 22px;
    margin-right: 22px;
    font-size: 14px;
}
    
    
    .carousel-cell {
  width: 28%;
  height: 200px;
  margin-right: 10px;
  background: #8C8;
  border-radius: 5px;
}

/* cell number */
.carousel-cell:before {
  display: block;
  text-align: center;
  line-height: 200px;
  font-size: 80px;
  color: white;
}

.carousel-cell-banner {
  width: 100%; /* full width */
  height: 400px; /* height of carousel */
  margin-right: 10px;
}

.allCatBulletBtn{
     font-size: 14px;
    width: 124px;
    background: #FF5D7D;
    padding: 4px;
    border-radius: 22px;
    text-align: center;
    color: white;
    position: absolute;
    right: 0;
    top: 13px;   
}

.categoryPromoImage{
     vertical-align: middle;
    border-style: none;
    width: 100%;
    height: 149px;
    
    border-top-left-radius:8px;
    border-top-right-radius:8px;
    object-fit: cover;   
}

.categoryPromoTxt{
    font-size:14px;
     font-family: "EuclidesCircularARegular";
    font-style: normal;
    font-weight: 300;
    text-align:left;
    height: 44px;
    line-height: 44px;
    margin-left: 22px;
    font-size: 16px;
}


.allCategoriesContainer{
    padding-top:82px;
}


@media(max-width:767px) {
    /*slider arrows hide*/
    .flickity-prev-next-button {
        display: none;
    }
    
    .flickity-page-dots{
         display: none;
    }
    
    .allCategoriesContainer{
        padding-top:164px;
    }
}


  
@media (min-width: 1001px){
  /* .scrolling-wrapper-flexbox {


    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;

  }
  
     .scrolling-wrapper-flexbox .card2 {
      flex: 0 0 auto;
      text-align: center;
      max-width: 180px; width:180px; padding:5px;
    }


  .scrolling-wrapper-flexboxItems {
 

width: 100%;
    float: left;
    display: block;
    -webkit-overflow-scrolling: touch;
    padding: 4px 2px 4px 2px;
  
    


  }
  
  .scrolling-wrapper-flexboxItems .card2 {
      flex: 0 0 auto;
      text-align: center;
      min-width: 176px;
      max-width: 176px;
      padding:6px;
      background: #fff;
        border-radius: 6px;
        margin: 4px;
        float:left;
        -webkit-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
        -moz-box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);

      box-shadow: 0 2px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
    } 
    */
} 
  
@media (max-width: 1000px){
  
}


  .itemCategoryTitle{
    font-family: "Euclides";
    margin: 52px 5px 10px 5px;
    padding-top: 0px;
    font-size: 28px;
    color: #000;
    text-align:left;
    position:relative;
  }

  .productImg{
    object-fit: contain;  
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:100%;
  }

  .currentPostcodeBtn{
    position: absolute;
    width: 80%;
    margin: 15px 10%;
    background: #ec008e;
    bottom: 0;
    height: 52px;
    font-size: 16px;
    color: white;
    line-height: 32px;
    border-radius: 25px;
    padding:0px 8px;
    -webkit-box-shadow: 0 8px 6px -6px black;
    -moz-box-shadow: 0 8px 6px -6px black;
         box-shadow: 0 8px 6px -6px black;
  }

  .zipCode{
    position: absolute;
    width: 70px;
    background: #ffffff;
    right: 18px;
    top: 43px;
    padding:0 4px;
    height: 29px;
    font-size: 14px;
    color: #ec008c;
    z-index: 999999;
    line-height: 29px;
    border-radius: 25px;
  }

  .viewAllButton{
   
    font-size: 14px;
    background: #ec008c;
    max-width: 80px;
    width:100%;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 22px;
    color: white;
    margin: 0 auto 22px auto;
  }

  .miniCatTitle{
    font-size: 16px;
    font-weight: 400;
    text-align: left; 
  }

  .itemTitle{
         font-size:16px;
     font-family: "EuclidesCircularARegular";
    font-style: normal;
    
    padding:4px 0px; height:44px; max-height: 44px; overflow: hidden;
    text-align: left;
    font-weight: 200;
    line-height: 19px;
    overflow: hidden;
  }



  .itemDetails{
    text-align: left; max-width:250px; height: 36px; font-size:11px; padding:4px 0px; color: #525252;
    
     font-family: "EuclidesCircularARegular";
    font-style: normal;
  }

  .miniCategory{
    object-fit: cover; border-radius: 50%;   
    /*display: block;
    
                  margin-left: auto;
                  margin-right: auto;
    */
                  margin:12px auto;


    -webkit-box-shadow: 0px 0px 6px #a2a2a2c2;
    -moz-box-shadow:  0px 0px 6px #a2a2a2c2;
     box-shadow: 0px 0px 6px #a2a2a2c2;
  }

  .even { background: #f8f8f8 ; }
.odd { background: #f8f8f8 ; }

.categoriesBullets{
  padding: 12px 0 5px 8px; 
  -webkit-box-shadow: 0 0px 0px -2px rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 0px 9px 0 rgba(0, 0, 0, 0.12);
  -moz-box-shadow: 0 0px 0px -2px rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 0px 9px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 0px 0px -2px rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 0px 9px 0 rgba(0, 0, 0, 0.12);
}

.priceTxt{
  color:#ec008c; 
  padding: 0px 0 0 0; 
  text-align:left; 
  font-weight: 700;
  
  font-size:16px;
}



/* width */
::-webkit-scrollbar {
  width: 4px;
  height: 6px;
}

/* Track */
::-webkit-scrollbar-track {
  background: transparent;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #d6dee1;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #b6bcbe;
}



.options{ 
    font-family: 'Hurme';
    width:100%;
    min-width: 183px;
    height: 116px;
  background-color: #FFF;
  text-align: center;
  font-size: 28px;
  color: black;
  margin:0px;
  cursor:pointer;
}

.options img{
  filter: brightness(74%);
  --webkit-filter: brightness(74%);
  width:100%;
  height:100%;
  object-fit: cover;
}




.card-title{
  position: absolute;
  font-size: 20px;
  color: #FFF;
  width: 90%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


.btn-fetch{
     background:#ec008c;   
     color:white;
         margin: 0 auto;
    border-radius: 22px;
        width: 140px;
}

.btn-fetch:hover{
    font-weight: 900;
    color:white;
}

.zipCodeModal{
        width: 50%;
    text-align: center;
    margin: 0 auto;
}

.modalClose{
        position: absolute !important;
    right: 30px !important;
    background: #ec008c !important;
    border-radius: 50% !important;
    color: #fff !important;
    width: 38px !important;
    height: 38px !important;
    top: 30px !important;
    opacity: 1 !important;
    line-height: 36px !important;
    text-align: center !important;    
}

.modalXBtn{
    position: absolute;
    top: -4px;
    margin: 0 auto;
    right: 7px;
    font-size: 35px;
}

.modalXBtn:hover{
}

.modalClose:hover{
        background: #fff !important;
    color: #ec008c !important;
    border:1px solid #ec008c;
}

 
/*remove outline from btn*/
button:focus { outline:0 !important; }

.zipCodeSelector{
 min-width: 74px;
 height:28px;
 padding:0 6px;
 background-color:white;
 color:#ec008c;
 font-weight:600;
 cursor: pointer;
 
 border-top-left-radius: 22px;
 border-bottom-left-radius: 22px;
}


.cartItemsSelector{
  min-width: 74px;
  height:28px;
  padding:0 6px;
  background-color:white;
  color:#ec008c;
  font-weight:600;
  cursor: pointer;
  
  border-top-left-radius: 22px;
  border-bottom-left-radius: 22px;
 }


.selectedItem{
    width:100%;
    background:white;
    border-radius:22px;
    padding:5%;
}

.selectedItemThumbDiv{
    width:80px; height:80px; float:left;
     margin:4px;
}

.selectedItemThumbImage{
     width:80px;
     height: 80px;
     object-fit: contain;
}

.itemSelectedTitle{
    font-size:18px;
    font-weight: 700;
}

  
  .itemDetailsAddToCartBtn{
     position: relative;
    width: 300px;
    height: 60px;
    margin: 22px auto;
    background-color: #ec008c;
    color: white;
    
    border-radius: 30px; font-size:22px; font-weight:900;
    cursor:pointer;
  }
  
  .itemDetailsAddToCartBtnDisabled{
    position: relative;
    width: 100%;
    min-height: 60px;
    margin: 22px 0%;
    color: white;
    
    border-radius: 6px; font-size:22px; font-weight:900;
    background-color: grey;
    cursor:not-allowed;

  }

  .itemDetailsAddToQuickCartBtn{
    width: 436px;
    height: 60px;
    margin: 22px auto;
    background-color: #ec008c;
    color: white;
    border-radius: 6px;
    font-size: 22px;
    font-weight: 900;
    cursor: pointer;
    position: fixed;
    bottom: 48px;
    z-index: 998;
 }

 .itemDetailsAddToQuickCartBtnDisabled{
  position: relative;
  width: 100%;
  min-height: 60px;
  margin: 22px 0%;
  color: white;
  
  border-radius: 6px; font-size:22px; font-weight:900;
  background-color: grey;
  cursor:not-allowed;

  position: fixed;
  bottom: 48px;
  z-index: 998;
}

.itemDetailsAddToQuickCartMobileBtn{
  width: 436px;
  height: 60px;
  margin: 22px auto;
  background-color: #ec008c;
  color: white;
  border-radius: 6px;
  font-size: 22px;
  font-weight: 900;
  cursor: pointer;
  position: fixed;
  bottom: 48px;
  z-index: 998;
}

.itemDetailsAddToQuickCartMobileBtnDisabled{
position: relative;
width: 100%;
min-height: 60px;
margin: 22px 0%;
color: white;

border-radius: 6px; font-size:22px; font-weight:900;
background-color: grey;
cursor:not-allowed;

position: fixed;
bottom: 48px;
z-index: 998;
}
  
 .backToStoreFromItems{
     position: relative;
    height: 60px;
    margin: 22px 0% 0px 0;
    background-color: white;
    color: #ec008c;
    border:1px solid #a9a9a9;
    border-radius: 30px; font-size:22px; font-weight:900;
    cursor:pointer;
  }
  
    .itemDetailsPrice{      
        text-align: center;
          line-height: 3;
    }
  
  .itemDetailsPlus{
    font-size: 37px;
    position: absolute;
    right: 12px;
    top: 11px;
  }

.outOfStock{
  padding: 4px;
  background: grey;
  color: white;
  border-radius: 4px;
  text-align: center;
  margin: 0 auto;
  min-width: 120px;   
}


  .optionsStoreDetails{

  font-family: 'Hurme';

  margin:0 auto;
  text-align: center;
  font-size: 28px;
  color: black;
}


.discountTag{
    position: absolute;
    left: 0;
    color: #ec008c;
    font-size: 32px;
}

.headerDiscoverTxt{
    position: relative;
    padding: 10px;
    font-size: 42px;
}

    .searchbar{
        position:relative;
        margin-bottom: auto;
        margin-top: auto;
        height: 50px;
        background-color: #fff;
        
  border: 2px solid #b6b6b66b;
        border-radius: 30px;
        padding: 10px;
        width:50%;
    }

    .search_input{
    color: white;
    border: 0;
    outline: 0;
    background: none;
    width: 0;
    caret-color:transparent;
    line-height: 20px;
    transition: width 0.4s linear;
      width: calc(100% - 41px);
    text-align:center;

      
    caret-color:red;
    }
    
   .search_input::placeholder {
  color: white;
}


.search_inputGlobal{
    color: black;
    border: 0;
    outline: 0;
    background: transparent;
    border-radius:22px;
    width: 0;
    line-height: 20px;
    transition: width 0.4s linear;
    width:100%;
    text-align: center;
    height: 45px;
    top: 0;
    caret-color: red;
    position: absolute;
    left: 0;
    z-index: -1;
    }
    
   .search_inputGlobal::placeholder {
       font-size: 14px;
       color: #838383;
}


 



    .search_icon{
        position: absolute;
        top: 4px;
        right: 8px;
        height: 40px;
        width: 40px;
        float: right;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        color:black;
        text-decoration:none;
            background: white;
        color: #fff;
        background:black;
    }
    
    .search_icon_store{
               position: absolute;
        top: 4px;
        right: 8px;
        height: 40px;
        width: 40px;
        float: right;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        color:black;
        text-decoration:none;
            background: white;
        color: #e74c3c; 
    }
    
    
 .search_inStore{
     color: black;
    border: 0;
    outline: 0;
    background: #fff;
    line-height: 20px;
    transition: width 0.4s linear;
    width: 90%;
    margin: 0 5% 14px 5%;
    text-align: center;
    height: 45px;
    border-radius:6px;
    caret-color: red;
}
    
   .search_inStore::placeholder {
       font-size: 14px;
       color: #838383;
}

    .search_iconInStore{
position: absolute;
    top: 9px;
    right: 7%;
    height: 30px;
    width: 30px;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color: black;
    text-decoration: none;
    background: white;
    color: #fff;
    background: black;
    }

    
.fakebtn{
     width: 50%;
     margin:42px auto 12px auto;
     background:#fff;
     color: #ec008c;
     border:1px solid #ec008c;
     text-align:center;
     border-radius: 22px;
     font-size:22px;
         height: 50px;
    line-height: 50px;
    cursor:pointer;
}

.changeCartStore{
    width: 50%;
    margin:12px auto 0px auto;
    background:green;
    color: white;
    text-align:center;
    border-radius: 22px;
    font-size:22px;
    height: 50px;
    line-height: 50px;
    cursor:pointer;
}

.cancelChangeCartStore{
     width: 50%;
     margin:22px auto 12px auto;
     background:red;
     color: white;
     text-align:center;
     border-radius: 22px;
     font-size:22px;
         height: 50px;
    line-height: 50px;
    cursor:pointer;
}

.backToStore{
    min-width: 74px;
    height: 28px;
    padding: 0 6px;
    background-color: white;
    color: #ec008c;
    font-weight: 600;
    cursor: pointer;
    border-radius: 22px;
}

.historyCards{
    width:100%;
    padding:12px;
    background:white;
        margin: 12px;
    border-radius: 12px;
        min-width: 300px;
    min-height: 80px;
    cursor:pointer;
}

.historyArrow{
    color:#ec008c;
       position: absolute;
right: 17px;
    top: 51px;
    font-size: 38px;
}

.linkNoStyle{
    color:black;
    text-decoration:none;
    display:contents;
}

.linkNoStyle:hover{
    color: black;
    text-decoration:none;
}


.historyDetailsTableTitle{
    text-align:right;
}

.historyDetailsTableDetails{
    text-align:left;
}

.paymentsDiv{
 background:white;
 padding:12px;
 border-radius:22px;
}


#pendingRidesDropDown .select2-selection__rendered {
    line-height: 55px !important;
}
#pendingRidesDropDown .select2-container .select2-selection--single {
    height: 55px !important;
}
#pendingRidesDropDown .select2-selection__arrow {
    height: 55px !important;
}

#pendingRidesDropDown .select2-container--default .select2-selection--single .select2-selection__rendered {
    text-align: center;
    height: 55px;
    line-height: 55px !important;
}


.itemsDivContainer{
    padding:0 15% 0 15%; display: grid;
    margin:0px;
}

.shopNavBar{
    padding: 15px 4%; margin-bottom: 0px;    background: linear-gradient(315deg, #ec008c, #6723d5);    margin-bottom: 40px;     position: fixed;
    width: 100%;
    z-index: 999;
}

.shopNavBarFixedHidden{
  /*  padding: 15px 4%; margin-bottom: 0px;    background: linear-gradient(315deg, #ec008c, #6723d5);    margin-bottom: 40px;     position: fixed;
    width: 100%;
    z-index: 999;*/
    display:none;
}

.shopNavBarFixed{
   /* padding: 15px 4%; margin-bottom: 0px;    background: linear-gradient(315deg, #ec008c, #6723d5);    margin-bottom: 40px;     position: fixed;
    width: 100%;
    z-index: 999;*/
}

.cartNavBar{
 padding: 15px 15%; margin-bottom: 0px;    
 background: linear-gradient(315deg, #ec008c, #6723d5);    
 margin-bottom: 40px;     
 position: fixed;
    width: 100%; height:70px; 
    z-index: 999;   
}

.orderSummary{
 width:100%; 
    /* max-width: 454px;*/

 background: white; 
 text-align:center; 
 border-radius: 8px;   
     padding: 33px 0;
    font-size: 18px;
}

.selectTownInCoolbackground{
    margin-top:34px;
}


@media (max-width: 575px) { 

    
    
   .search_inputGlobal::placeholder {
       font-size: 12px;
       color: #838383;
}
 

        .searchbar{

        width:100%;
    }
    
    
        .itemsDivContainer{
            display: grid;
            padding:165px 0 0 0;
            margin:0px;
        }
        
        .searchbarNavBar{
                max-width: 500px;
                position: relative !important;
            top: -4px;
             margin-top:12px;
        }
        
        #navbarSupportedContent{
            flex: auto;
          /*  position: absolute;
            right: 14px;
            */
            top: 22px;
                position: absolute;
            right: 5%;

        }
        
        .cartNavBar{
         padding: 15px 5%; 
        }
        
        .orderSummary{
            width:100%; 
        }

        .itemDetailsAddToCartBtnDisabled{
          position: relative;
          width: 100%;

          margin: 22px 0%;
          display: inline-table;
        }
        
        
       .headerDiscoverTxt{
            position: relative;
            padding: 10px;
            font-size: 32px;
        }
    
    
    .townSelect{
          font-size:40px !important;    
    }
    
    .selectTownInCoolbackground{
    margin-top:0px;
}

    
    .allCatBulletBtn{
         display:none;   
    }
    
           .scrollColumnsCart{
         height: auto;   
         padding:0 4px 0 4px;
         width:100%;
         display: contents;
    }

    
}

@media (min-width: 576px) { 
      .townSelect{
        font-size: 52px;
        line-height: 66px;
    }
    
        .searchbar{

        width:100%;
    }
    
  .searchbarNavBar{
              max-width: 500px;
                position: relative !important;
            top: -4px;
            
    }
    

    
        
            .itemsDivContainer{
        display: grid;
        padding:124px 0 0 2%;
        margin:0px;
    }
    .cartNavBar{
     padding: 15px 5%; 
    }
    
    .orderSummary{
            width:100%; 
    }
    
           .scrollColumnsCart{
         height: auto;   
         width:100%;
         display: contents;
    }
    


    
}

@media (min-width: 576px) and (max-width: 767px) { 
          #navbarSupportedContent{
            flex: auto;
          /*  position: absolute;
            right: 14px;
            */
            top: 22px;
                position: absolute;
            right: 5%;

        }
        
        .headerDiscoverTxt{
            position: relative;
            padding: 10px;
            font-size: 32px;
        }
        
        .townSelect{
    
        width: 180px;
    
        font-size: 36px;
        
    
    }
    
      .searchbarNavBar{
        
             margin-top:12px;
            
    }
    
        .scrollColumnsCart{
         height: auto;   
         padding:0 4px 0 4px;
         width:100%;
         display: contents;
    }
    

    


}


@media (min-width: 768px) { 
            .searchbar{

        width:80%;
    }
    
      .searchbarNavBar{
               display:block;
               position:absolute !important;
          width: 54%;
              max-width: 500px;
              
            top: -4px;
    }
    
      #navbarSupportedContent{
            flex: auto;

        }
    

    
    
        .itemsDivContainer{
    margin:0 2%; display: grid;
}

 .scrollColumnsCart{
    height: calc(100vh - 216px);   
    overflow-y: scroll;
    display: block;
      -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}





}

@media (min-width: 768px) and (max-width: 992px) {
             .container{
         max-width:100% !important;   
    }
   
}


@media (min-width: 992px) { 
            .searchbar{

        width:50%;
    }
    
      .searchbarNavBar{
          display:block;
    }
    
    
        .itemsDivContainer{
    margin:0 15%; display: grid;
}

 .zipCartFontSize{
         font-size:18px !important;   
    }
    
     .scrollColumnsCart{
    height: calc(100vh - 216px);   
    overflow-y: scroll;
    display: block;
      -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

    
}


@media (min-width: 1200px) { 
            .searchbar{

        width:50%;
    }
    
      .searchbarNavBar{
          display:block;
    }
    
            .itemsDivContainer{
    margin:0 15%; display: grid;
}

    .zipCartFontSize{
         font-size:18px !important;   
    }
    
     .scrollColumnsCart{
    height: calc(100vh - 216px);   
    overflow-y: scroll;
    display: block;
      -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

        
}


.getApp{

background-color: #ec008c;
color: white;
border-radius: 22px;
/* padding: 4px; */
height: 30px;
margin-top: 26px;
margin-right: 11px;
font-size: 16px;
line-height: 30px;
cursor: pointer;
width: 111px;
position: absolute;
right: 0;
}





.getApp:hover{
    color:#6723d5;
    background:white;
         border:1px solid #6723d5;
}


.menuBar{

background:white;
text-align:center;  

    color: #000;
}


.menuBarFixed{
    position:fixed;
    top:0;
    background:white;
    text-align:center;   
    
    color: #fff;    

    background: linear-gradient(315deg, #ec008c, #6723d5);
    
    width: 100%;
color: white;
z-index: 999;
}

.overwriteColorToWhite{
     color:white !important;   
}


.addMarginToCat{
 margin-top:82px !important;   
}


.footer{
       display: inline-table;
    margin: 2% 25%;
    width: 50%;
}

.facadeTitle{
    font-size: 18px;    
    margin:10px 0;
    font-weight:500;
}

.facadeList{
 list-style-type:none;
 padding: 0px;
}

.facadeList a{
     color:#ec008c;   
}

.goToTop{
 position: fixed; 
 cursor:pointer;
 bottom:0;
  left: 0; 
  right: 0; 
  margin-left: auto; 
  margin-right: auto; 


    z-index:9;
    width:320px;
    font-size:22px;
    font-weight:600;
    height: 42px;
    line-height: 42px;
    margin:10px auto;
    border-radius:22px;
    background:#ec008c;
    color:white;
    text-align:center;
    
}


.goToTopIcon{
        line-height: 10px;
    position: absolute;
    left: 11px;
    top: 4px;
    font-size: 36px;
}

.orderComments{
     color: black;
    border: 0;
    outline: 0;
    background: #fff;
    line-height: 20px;
    transition: width 0.4s linear;
    background: #f8f8f8;
    width: 90%;
    margin: 0 5% 14px 5%;
    text-align: center;
    height: 45px;
    caret-color: red;   
}


textarea:focus {
    background: #f8f8f8 !important;
    text-align:left;
}


/*
textarea:hover, 
input:hover, 
textarea:active, 
input:active, 
input:focus,
button:focus,
button:active,
button:hover,
label:focus
{
    outline:0px !important;
    -webkit-appearance:none;
    box-shadow: none !important;
}
*/




.collapsible {
  background-color: #fff;
  color: black;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

.active, .collapsible:hover {
  background-color: #fff;
}

.collapsible:after {
  content: '\002B';
  color: black;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}

.checkoutContent {
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  background-color: #fff;
}

.checkoutContentAddress{
    padding:18px;
  background-color: #fff; 
}



.scrollColumnsCart::-webkit-scrollbar {
  width:4px;
}

.modal{
         z-index: 99999 !important;   
}

.select2-dropdown {
    z-index:99999 !important;
}