body{
        background-image: url(../img/paper.jpeg);
        background-repeat: no-repeat;
        background-size: cover;
        color:#000;
        margin:0;
        padding:0;
        overflow: hidden;
    }
    ::-webkit-scrollbar {
        width: 0px;
        height:0px;
    }
   
     
    /*@keyframes fadeInAnimation {*/
    /*    0% {*/
    /*        opacity: 0;*/
    /*    }*/
    /*    100% {*/
    /*        opacity: 1;*/
    /*     }*/
    /*}*/
    
    
    /* Track */
    ::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px grey;
        border-radius: 10px;
    }
    
    /* Handle */
    ßßßß::-webkit-scrollbar-thumb {
        background: rgb(255, 191, 0);
        border-radius: 7px;
    }
    
    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #b30000;
    }
    .item-list h2 {
        margin-bottom: 46px;
        /*font-size: 35px !important;*/
    }
    .customhtcart{
        width:166px !important;
        height:156px !important;
    }
    
    .customhtfooter{
        width:166px !important;
    }
    .mright{
        margin-right:15px !important;
        margin-top: 12px;
    }
    .headtop{
        width:100%;
        height:300px;
        background-image: url(../img/Banner.png);
        background-repeat: no-repeat;
        background-size: cover;
        text-align:center;
        padding:10px;
        padding-top: 0px;
        box-shadow: 0 10px 10px #CCC;
        position: sticky;
        top: 0;
        z-index: 1;
    }
    .handicapeheadtop{
        width:100%;
        height: 900px;
        background-image: url(../img/bannersmall.png);
        background-repeat: no-repeat;
        background-size: cover;
        text-align:center;
        padding:10px;
        padding-top: 0px;
        box-shadow: 0 10px 10px #CCC;
        position: sticky;
        top: 0;
        z-index: 1;
    }
    .contentarea{
        width: 100%;
        height: auto;
        padding: 0px;
        margin: 0px;
        position: relative;
    }
    .contentarea .row{
        padding: 0px;
        margin: 0px;
    }
    .menuhead{
        width: 65%;
        float: left;
        /*position:fixed;*/
        margin-left: 30px;
        box-shadow: 0 0 10px 1px #ccc;
        /*position: absolute;*/
        background: #f5f6f7;
        padding: 17px;
        /*margin-top: 49px;*/
        margin-bottom:16px;
        text-align: center;
        border-radius: 28px;
    }
    
    .leftsidebar ul li a{
      /*font-family:'Lexend Deca';*/
      background:#09bcdc;
      cursor:pointer;
      position:relative;
      padding:10px;
      margin:10px auto 0px auto;
      border-radius:15px;
      box-shadow:-4px -2px 4px 0px #ffffff, 4px 2px 6px 0px #DFE4EA;
      text-align:center;
      display:flex;
      flex-direction:column;
      justify-content:center;
      align-items:center;
      color:#0D3C82!important;
      font-size:14px;
      text-decoration: none;
    }
    .leftsidebar ul li span{

        position: absolute;
        left: 10px;
        right: 10px;
        bottom: 2px;
        font-size: 15px;
        height: 27px;
        line-height: 32px;

        color: #000;
        text-align: center;
        font-weight: bold;

        border-radius: 10px;
        z-index: 2;
    
      background: #f4ce15;
      /* padding: 1px; */
    }
    .leftsidebar ul li a:hover{
      background-color:#09bcdc;
      color:#474e5d!important;
      padding:auto;box-shadow:inset -2px -2px 5px white, inset 3px 3px 5px rgba(0, 0, 0, 0.1)
    }
    
    .product-image {
        width: 100%;
        height: 100%;

        display: block;

        /* object-fit: contain; */
        object-position: center;
        border-radius: 5%;
    }
    .item-caption { 
        position: absolute; 
        bottom: 17px; 
        left: 50%; 
        transform: translateX(-50%); 
        
        width: 85%; 
        padding: 2px 15px; 
        
        /* background: #123C46;     */
        background:#cccccc;
        /* color: #fff;  */
        border-radius: 8px; 
        
        text-align: center; 
        z-index: 2;
        font-weight: 600;
    }
    .item-caption span {
        font-size: 18px;
        font-weight: 600;
        line-height: 1.2;
    }
    
    .ing-caption { 
        position: absolute; 
        bottom: 15px; 
        left: 50%; 
        transform: translateX(-50%); 
        
        width: 85%; 
        text-align: center; 
        z-index: 2;
    }
   
    .item-product { 
        position: absolute; 
        bottom: 8px; 
        left: 50%; 
        transform: translateX(-50%); 
        width: 60%; 
        font-size: 20px;
        /* background: #123C46;     */
        background: #B42835;
        color: #FFF;
        border-radius: 8px; 
        border: 1px solid #B42835;
        text-align: center; 
        z-index: 2;
        cursor: pointer;
        font-weight: 600;
    }
    .item-product span {
        font-size: 18px;
        font-weight: 600;
        line-height: 1.2;
    }

    .item-product:hover{
        color: #FFF;
        text-decoration: none;
        background-color: #B42835; 
        border: 1px solid #B42835;
    }
    .itemarea{
        width: 92%;
        height: 330px;
        box-shadow: 0 0 10px 0px #bfabab;
        border-radius: 23px;
        margin-bottom: 20px;
        display: inline-block;
        background: #09bcdc;
        position: relative;
    }
     .itemareaing{
        width: 92%;
        height: 330px;
        box-shadow: 0 0 10px 0px #bfabab;
        border-radius: 23px;
        /* margin-bottom: 20px; */
        display: inline-block;
        background: #09bcdc;
        position: relative;
    }
    
    .itemareaTop{
        width: 100%;
        height: auto;
        float: left;
        padding: 0 0px;
        text-align: center;
    }
    .itemareaTop img{
        width:100%;
        height: auto;
        border-radius: 3%;
    }
    .itemareaL span{
        font-size: 14px;
        /*color: #fff;*/
        font-weight: bold;
        line-height: 20px;
        margin: 10px 10px 10px 5px;
        display: inline-block;
        padding: 5px;
        background: #cccccc;
        border-radius: 0%;
        width: 95%;
        text-align: center;
        text-transform: uppercase;
        border-radius: 10px;
    }
    
    /*product  add button*/
    .add{
        display: inline-block;
        background: #B42835;
        color: #FFF;
        padding: 6px 40px;
        font-size: 20px;
        /*margin-top: 20px;*/
        border-radius: 10px;
        border: 1px solid #B42835;
        cursor: pointer;
        width: 50%;
        text-align: center;
        /*margin-left: 58px;*/
        /*position: absolute;*/
    }
    .add:hover{
        color: #FFF;
        text-decoration: none;
        background-color: #B42835; 
        border: 1px solid #B42835;
    }
    /*end product add button*/
    
    /*ingredient layout*/
    .add-item-s-area-div {
        float: left;
        padding: 0px;
        cursor: pointer;
         border: 1px solid #ccc; 
        /*margin: 4% 1% 28%;*/
        width: 226px;
        height: 194px;
        border-radius: 15px;
        line-height: 1;
        background: #09bcdc;
        box-shadow: -1px -1px 3px 0px rgba(0,0,0,0.75);
        -webkit-box-shadow: -1px -1px 3px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: -1px -1px 3px 0px rgba(0,0,0,0.75);
    }
    
    .add-item-s-area-div-inner {
        width: 100%;
        height: auto;
        position: relative;
        text-align: center;
        margin-top: 20px;
    }
    .add-item-s-area-div img {
        /*width: 100%;*/
        height:  88px;
    }
    .i-name-div {
        text-align: center;
        font-size: 15px;
        color: #000;
    }
    .beforehide{
        display:none;
    }

    .showafter{
        display:block;
    }
    
    
    .avail-price{
        position: absolute;
        width: 90px;
        height: 38px;
        margin-top: 0px;
        /* margin-bottom: 10px; */
        background-color: rgb(180 40 54);
        padding: 4px;
        margin-left: -2px;
        border-radius: 15px 0px 6px 0px;
        color: #f5f6f7;
        font-size: 22px;
    }
    
    .add-items-check-minus {
        position: absolute;
        top: -20px;
        right: 1px;
        width: 100%;
        height: auto;
        text-align: right;
        background: #f5f6f7;
        width: 24px;
        height: 24px;
        border-radius: 50px;
        -webkit-box-shadow: -1px -1px 3px 0px rgba(0,0,0,0.75);
    }
    .add-items-check-puls {
        /* position: absolute; */
        /* bottom: -8px; */
        left: 0px;
        width: 100%;
        height: auto;
    }
    
    .add-items-check-minus img {
        width: 20%;
        height: auto;
    }
    .add-items-check-puls img {
        width: 20%;
        height: auto;
    }
    
    /*end ingredient*/
    
    /*addtocar success popup*/
    .thank-you-pop{
    	width:100%;
     	padding:20px;
    	text-align:center;
    }
    .thank-you-pop img{
    	width:76px;
    	height:auto;
    	margin:0 auto;
    	display:block;
    	margin-bottom:25px;
    }
    
    .thank-you-pop h3{
    	font-size: 42px;
        margin-bottom: 25px;
    	color:#5C5C5C;
    }
    .thank-you-pop p{
    	font-size: 20px;
        margin-bottom: 27px;
     	color:#5C5C5C;
    }
    .thank-you-pop h3.cupon-pop{
    	font-size: 25px;
        margin-bottom: 40px;
    	color:#222;
    	display:inline-block;
    	text-align:center;
    	padding:10px 20px;
    	border:2px dashed #222;
    	clear:both;
    	font-weight:normal;
    }
    .thank-you-pop h3.cupon-pop span{
    	color:#03A9F4;
    }
    .thank-you-pop a{
    	display: inline-block;
        margin: 0 auto;
        padding: 9px 20px;
        color: #fff;
        text-transform: uppercase;
        font-size: 14px;
        background-color: #8BC34A;
        border-radius: 17px;
    }
    .thank-you-pop a i{
    	margin-right:5px;
    	color:#fff;
    }
    #ignismyModal .modal-header{
        border:0px;
    }
    /*end success*/
    .leftright{
      height: 4px;
      width: 30px;
      position: absolute;
      margin-top: 24px;
      background-color: #5A141A;
      border-radius: 2px;
      transform: rotate(45deg);
      transition: all .3s ease-in;
    }
    
    .rightleft{
      height: 4px;
      width: 30px;
      position: absolute;
      margin-top: 24px;
      background-color: #5A141A;
      border-radius: 2px;
      transform: rotate(-45deg);
      transition: all .3s ease-in;
    }
    .title {
      /*display: flex;*/
      /*flex-direction: row;*/
      /*gap: 1rem;*/
      text-align:center;
    }
    
    .title p {
      font-size: 2.5rem;
    }
    .modalImg{
        text-align:center;
    }
    
    .title h1 {
      font-size: 2.7rem;
      margin-bottom: 2rem;
      background: -webkit-linear-gradient(45deg, #5A141A 0%, #0f1110 65%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    
    .close-modal:hover .leftright{
      transform: rotate(-45deg);
      background-color:  #5A141A;
    }
    .close-modal:hover .rightleft{
      transform: rotate(45deg);
      background-color:  #5A141A;
    }
     
     
     .headtags{
         margin-bottom:55px;
     }   
        
    
    /* =========================================
   FULL MODAL
========================================= */

#exampleModalCenter .modal-dialog {
    max-width: 900px;
    width: 50%;
}

#exampleModalCenter .modal-content {
    position: relative;
    min-height: 430px;
    border: none !important;
    border-radius: 15px;
    overflow: hidden;
    background: #000 !important;
    /* width: 70% !important; */
    left: 19%;
    top:20px;
}


/* =========================================
   IMAGE FULL BACKGROUND
========================================= */

#exampleModalCenter .modalImg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

#exampleModalCenter .modalImg img {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    /* object-fit: cover; */
    object-position: center;
    display: block;
}



/* =========================================
   MODAL BODY
========================================= */

#exampleModalCenter .modal-body {
    position: relative;
    z-index: 2;
    min-height: 430px;

    padding: 30px;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    color: #fff;
}

/* =========================================
   CLOSE / RETOUR BUTTON
========================================= */

#exampleModalCenter .close {
    position: absolute;
    top: 20px;
    right: 20px;

    z-index: 10;

    background-color: rgb(180 40 54) !important;
    color: #fff !important;

    opacity: 1 !important;

    padding: 8px 18px;

    border-radius: 5px;

    text-decoration: none;
}

/* =========================================
   TITLE
========================================= */

#exampleModalCenter .title {
    position: relative;
    z-index: 3;

    margin-bottom: -10px;
}

#exampleModalCenter #p_name {
    margin: 0;

    padding: 12px 20px;

    display: inline-block;

    font-size: 35px;
    font-weight: bold;

    border-radius: 8px;

    text-transform: uppercase;
}

/* =========================================
   DESCRIPTION
========================================= */

#exampleModalCenter #show-desc {
    position: relative;
    z-index: 3;

    margin: 0;

    padding: 4px 0px 0px 36px;
    font-width: bold;
    font-size: 15px;
    line-height: 20px;

    color: #000;
}