
@font-face {
	font-family: MonBold;
	src: url('../font/Montserrat-Bold.otf');
}

@font-face {
	font-family: MonReg;
	src: url('../font/Montserrat-Regular.otf');
}

@import url('https://fonts.googleapis.com/css?family=Merriweather|Open+Sans|Playfair+Display');

body{ font-family: MonReg; overflow-x: hidden; }
#mainDiv{ padding: 0px 15px; }
#leftSide{font-size: 0.95em; width: 255px; padding: 30px 20px 0px 20px; height: 100vh; margin-left: -15px;    position: fixed; background-color: #FFF; z-index: 9999; box-shadow: 0px 0px 10px #efefef; overflow-y: scroll;     }



#leftSide::-webkit-scrollbar {
    width: 0.5em;
}
 
#leftSide::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
}
 
#leftSide::-webkit-scrollbar-thumb {
  background-color: #efefef;
  outline: 1px solid slategrey;
}

body::-webkit-scrollbar {
    width: 0.5em;
}
 
body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
}
 
body::-webkit-scrollbar-thumb {
  background-color: #666;
  outline: 1px solid slategrey;
}


.logotop{ text-align: center;  }
.storeAddress{ text-align: center; padding: 5% 2%; margin: 5% 0%; border-top: double 5px #24292d; border-bottom: double 5px #24292d; margin: 8% 0%;     }
.menuLinksScrol ul{ list-style: none; margin-left: -30px;  }
.menuLinksScrol ul li{ text-align: center; padding: 3% 0%;  }
.menuLinksScrol ul li a{ text-decoration: none; color: #24292d; }
.menuScrollBarOnlineOrder span a{ text-decoration: none; color: #FFF; }
.menuScrollBarOnlineOrder{ background-color: #24292d; padding: 6% 0%; border-radius: 5px;  text-align: center; }
.socialMediaScroll{ margin: 10% 0%; text-align: center;   }
.socialMediaScroll div{ display: inline-block; margin: 2.5%;  text-align: center; }
.socialMediaScroll div{  background-color: #24292d; color: #FFF; padding: 4px 4px; height: 30px;  border-radius: 50%; width: 30px; font-size: 1.2em; text-align: center; }

.hoursOfOperation{ text-align: center; }
.headingRightBar{ text-align: center; font-weight: bold; padding: 4% 0%;   }
.housrTiming{ font-size: 0.75em;line-height: 2em; color: #666;   }
#rightSide{ margin-left: 250px;  }
.sliderOne{ background-image: url(../image/slider/2.jpeg); position: center;  height: 104.5vh; background-size: cover; margin: 30px 0px 0px 0px; position: relative; }
.sliderOne::after{ background-color: rgba(0,0,0,0.25); content: ""; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  }
.sliderTwo{ background-image: url(../image/slider/1.jpeg); position: center;  height: 50vh;  background-size: cover; margin: 30px auto; position: relative; }
.sliderTwo::after{ background-color: rgba(0,0,0,0.25); content: ""; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  }


.sliderThree{ background-image: url(../image/slider/3.jpeg); position: center;  height: 50vh;  background-size: cover; margin: 0px auto; position: relative; }
.sliderThree::after{ background-color: rgba(0,0,0,0.25); content: ""; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  }


#aboutUsSection{ background-color: rgba(0,0,0,0.02); padding: 15px 25px;  }
.headingSection{ text-align: center; margin: 3% 0%;    }
.headingSection span{ text-align: center; font-weight: bold; border: 2px solid #24292d; padding: 10px 20px; font-size: 1.5em;   }

.aboutUsData{ line-height: 2em; font-size: 0.95em; padding: 5px 10%; text-align: center; }
.aboutUsImageFirst{ height: 300px; background-image: url(../image/img/5.jpeg); background-size: cover; margin: 5% 0%; position: relative; }
.aboutUsImageFirst::after{ background-color: rgba(0,0,0,0.25); content: ""; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  }

.aboutUsImageSecound{ height: 300px; background-image: url(../image/img/6.jpeg); background-size: cover; margin: 5% 0%; position: relative; }
.aboutUsImageSecound::after{ background-color: rgba(0,0,0,0.25); content: ""; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  }


.menuHeading{ text-align: center; }

.menuHeading span{ border: 2px solid #24292d; padding: 10px 20px; margin: 10px 5px;   }

.categaryName{ text-transform: uppercase; color: #24292d; font-size: 1.75em; margin-top: 10%; padding: 1% 0%; margin-bottom: 2%;   border-bottom: 2px solid #24292d; font-family: Playfair Display;  }

.productName{ font-size: 1.25em; margin-bottom: 2.5px; margin-top: 15px; text-transform: capitalize; font-family: MonBold; }
.productDes{ font-size: 0.95em; color: rgba(0,0,0,0.45);   }

.productPrice{ font-size: 1.25em; font-weight: bold; font-family: Open Sans; }

.menuCategaryFetch{ padding: 5px 5px; }

.homePageProduct{ border-bottom: 1px dashed #666; padding: 3% 1%; margin-bottom: 1%;   }
.homePageProductDes{ min-height: 40px; }
.homeImageProductImage{ height: 200px; background-size: cover; position: relative;   }
.homeImageProductImage::after{ background-color: rgba(0,0,0,0.25); content: ""; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  }

.googleMap{ position: relative; }

.googleMapInfo{ position: absolute; top: 15px; left: 15px; background-color: #FFF; padding: 5px; font-size: 1.3em;  line-height: 1.2em; text-align: center; width: 355px; padding: 15px; box-shadow: 0px 10px 10px rgba(0,0,0,0.1);    }
.mapStoreName{ font-weight: bold; margin-top: 4%; }
.mapStoreAdd{ font-size: 0.65em; color: rgba(0,0,0,0.25);    }
.maptiming{ font-size: 0.65em; color: rgba(0,0,0,0.25);  }
.mapHeading{ margin-top: 4%; }

.bighImageFirst{ background-image: url('../image/slider/3.jpeg'); height: 500px; background-size: cover; background-position: center; position: relative; }
.bighImageFirst::after{ background-color: rgba(0,0,0,0.25); content: ""; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;  }

#imageBigOne{ background-color: rgba(0,0,0,0.02); padding: 5px 25px;  }

#footerCall{ background-color: #24292d; color: #FFF; padding: 1.5%; text-align: center; font-size: 1.3em; font-family: MonReg;   }
#footerPoweredBy{ text-align: center; background-color: #efefef; color: #000; padding: 1.5%; margin-bottom: 1%; margin-top: 1%;   }

.mobileTopLogoAddress{ display: none; }

.navIcon{ position: fixed; top: 20px; background-color: #FFF; box-shadow: 0px 0px 1px #efefef;   right: 20px; z-index: 999999; border-radius: 50%; border: 1px solid #efefef; padding: 12px;  }

.mobileNavigationLinks{ position: fixed; bottom: 0px; left: 0px; right: 0px; height: 75vh; overflow-y: scroll; background-color: #FFF; z-index: 999999; display: none; }
.blackMobileScreen{ position: fixed; bottom: 0px; left: 0px; right: 0px; top: 0px; background-color: rgba(0,0,0,0.5); z-index: 9999; display: none; }

.mobileNavigationLinks::-webkit-scrollbar {
    width: 0.5em;
}
 
.mobileNavigationLinks::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
}
 
.mobileNavigationLinks::-webkit-scrollbar-thumb {
  background-color: #000;
  outline: 1px solid slategrey;
}

.mobileNavigationLinks .menuLinksScrol ul li{ padding: 5% 0%; border-bottom: 1px dashed #efefef;  }
.navIcon{ display: none; }

.mobNavMenuHeading{ color: #24292d; background-color: #efefef; padding: 5%  ; text-align: center; font-family: Merriweather; font-size: 1.5em; font-weight: bold; border-bottom: 2px solid #24292d;  }


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

.navIcon{ display: block; }
    
    
    #leftSide{ display: none; }   
    #rightSide{ margin: 0px; }
 
    .sliderOne{  height: 50vh; }
.sliderTwo{  height: 20vh;   }


.sliderThree{   height: 20vh; margin: 30px auto;   }
 .aboutUsData{ line-height: 2em; font-size: 0.95em; padding: 5px 2%; text-align: center; }
 
    .aboutUsImageFirst{ height: 200px; }
    .aboutUsImageSecound{ height: 200px; display: none; }   
.headingSection span{ text-align: center; font-weight: bold; border: 2px solid #24292d; padding: 10px 5px; font-size: 1.2em;   }

    .menuCategaryFetch{ padding: 5px 0px; }
.homeImageProductImage{ height: 125px; background-size: cover; position: relative;   }

    .googleMapInfo{ position: relative; top: 0px; left: 0px; background-color: #FFF; padding: 5px; font-size: 1.3em;  line-height: 1.2em; text-align: center; width: 100%; padding: 15px; box-shadow: 0px 10px 10px rgba(0,0,0,0.1); margin-top: 5%;    }

 #footerCall{ background-color: #24292d; color: #FFF; padding: 3% 10%; text-align: center; font-size: 1em; font-family: MonReg;   }
 
    .mapStoreAdd{ font-size: 0.65em; color: rgba(0,0,0,0.75);    }
.maptiming{ font-size: 0.65em; color: rgba(0,0,0,0.75);  }
    .locationMap{ margin-top: 5%; }
#aboutUsSection{ background-color: rgba(0,0,0,0.02); padding: 10px 10px;  }
    .mobileViewAddress{ border-top:double 1px #24292d;  border-bottom:double 1px #24292d; text-align: center; padding: 2% 4%; margin:5% 5% 3% 5%;     }
    .mobileViewTiming{ text-align: center; } 
.headingRightBar{ text-align: center; font-weight: bold; padding: 1% 0%;   }
    .mobileTopLogoAddress{ margin: 15% 0% 0% 0%; display: block; }
}