
.design, .dpMenu-disc, .fixed-bottom-mobile, .mobile-menu { display: none;} .home-page .design { display:block; }
.spices-title h3 { padding-top: 15px;} .header-wrapp .container { position: relative; z-index: 1000; }
.footer-address p { line-height: 19pt;}

.bannerslider { position: absolute; width: 100%; top: 0; left: 0;}


@media (max-width: 1600px) {  
.brand-logo-block figure {width: 200px;}  .brand-logo-block article {padding-left: 230px; } .brand-logo-block h2 {    font-size: 19pt; } .brand-logo-block h3 {    font-size: 16pt; } 
.hme-benef-align {    padding: 80px 90px 0 90px; }
.hme-benef-itms {    padding: 100px 40px 0 40px; }
.hme-benef-itms h4 br { display: none; }
.hme-benef-itms h4 {     font-size: 20pt; }
}
@media (max-width: 1500px) { 
.hme-benef-align {    padding: 80px 50px 0 50px; }
.hme-benef-itms {    padding: 100px 30px 0 30px;  }
.hme-benef-itms h4 br { display: none;    font-size: 20pt; }
.brand-caption h2 {    font-size: 38pt; line-height: 38pt; } 
.brand-caption h3, .brand-caption h4 {    font-size: 28pt; line-height: 28pt; }
}
@media (max-width: 1400px) { 
.container-large, .container { padding: 0 50px;}
#page { font-size: 13pt; } .site-logo { width: 130px;} .banner-cap-2 {    padding-bottom: 0px; }
.hme-benef-align { padding: 50px 50px 0 50px; }
.hme-benef-itms-invert { padding: 70px 30px 100px 30px; }
.page-menu { padding-bottom: 100px;}
.footer-menu-address { margin: 0 60px; width: calc(100% - 120px);}
.footer-menu-address .align { padding: 0 30px;}
.footer-logo { padding: 0 60px;} .page-menu { padding-bottom: 73px; }.banner-cap-1 { font-size: 40pt;} .banner-cap-2 h4 { font-size: 34pt;}
.banner-cap-2 h5 {    font-size: 21pt;    line-height: 30pt; }
.welcome-title h1, .spices-title h3 {    font-size: 26pt;} .welcome-title h1 span {    font-size: 40pt; }
.welcome-imp-text { font-size: 22pt; }
.welcome-imp-text span {    display: block;    font-size: 26pt;} 
.widget-title {    font-size: 16pt; }    .widget-title span {    display: block;    font-size: 63pt;    line-height: 64pt;} .widget-title span {    display: block;    font-size: 51pt;    line-height: 64pt;   }
.widget-title {    font-size: 14pt; }
.spices-title h2, .page-caption h3, .hme-sos-title h2 span, .widget-title-second h3 {    font-size: 30pt; }
.hme-sos-title h2 {     font-size: 28pt; }
.welcome-title h2, .hme-story-block h3, .story-title {    font-size: 20pt; }
.hme-benef-itms h4 {    font-size: 20pt; }
.primary-menu ul li a:link, .primary-menu ul li a:visited { font-size: 11pt; }
.page-title h1 {    font-size: 44pt; }
.know-spices-slider-wrapp .widget-title span { font-size: 40pt; line-height: 40pt; }
 .spices-title h3 {        font-size: 20pt;    }
.header-fix .site-logo { width: 100px; }
.readmore-btn a:link, .readmore-btn a:visited { font-size: 11pt;}
.spice-block h4 { font-size: 16pt;}
.top-call a:link, .top-call a:visited { width: 25px; height: 25px;  }
.top-call {    padding-left: 11px; }
.hme-story-blocks, .hme-gift-box { gap: 30px;}
.hme-story-block {    width: calc(50% - 30px);    text-align: center; }
.brand-caption h2 {    font-size: 32pt; line-height: 32pt; }
.brand-caption h3, .brand-caption h4 {    font-size: 22pt; line-height: 22pt; }
}
@media (max-width: 1300px) { 
:root {    --gutter60: 50px 0; }
#page { font-size: 14pt; }
p { line-height: 22pt; font-weight: 300;}
.banner-cap-1 { padding-top: 80px; }
.hme-story-blocks, .hme-gift-box { gap: 40px;}
.hme-story-block {    width: calc(50% - 20px);    text-align: center; }
.hme-story-block {    background-color: #23472e;    position: relative;   padding:50px 30px; }
.hme-benef-itms {    padding: 100px 30px 0 30px; }
.hme-benef-align {        padding: 50px 30px 0 30px;    }
.brand-logo-block figure {width: 180px;}  .brand-logo-block article {padding-left: 200px; }
.img-right {    padding-left: 30px; width: 400px;}
.img-left {    float: left;    padding-right: 30px;  width: 400px;}
.storyblock .story-image { margin-right: 30px;}
.storyblock:nth-child(odd) .story-image { margin-left: 30px;}
.essence-wrapp {    height: 427px;}
.about-top { padding-top: 30px; }
.footer-logo img { width: 150px;}
.footer-logo { height: 100%; display: flex; align-items: center; flex-wrap: wrap;}
.banner-cap-1, .banner-cap-2 h4 { font-size: 26pt; line-height: 28pt;}
.banner-cap-2 { bottom: 97px;} 
.banner-cap-2 h5 {    font-size: 16pt;    line-height: 30pt; }
.welcome-title h1, .spices-title h3 {    font-size: 24pt;}
.welcome-title h1 span {    font-size: 30pt;}
.welcome-imp-text { font-size: 18pt; }
.welcome-imp-text span {    display: block;    font-size: 20pt; padding-bottom: 5px;}
.widget-title {    font-size: 16pt; }    .widget-title span {    display: block;    font-size: 40pt;    line-height: 44pt;}
.widget-title span {    display: block;    font-size: 31pt;    line-height: 34pt; }
.widget-title {    font-size: 13pt; }
.spices-title h2, .page-caption h3, .hme-sos-title h2 span, .widget-title-second h3 {    font-size: 24pt; }
.hme-sos-title h2 {    font-size: 22pt; }
.welcome-title h2, .hme-story-block h3, .story-title {    font-size: 16pt; }
.hme-benef-itms h4 {    font-size: 18pt; }
.primary-menu ul li a:link, .primary-menu ul li a:visited { font-size: 12pt;}
.page-title h1 {    font-size: 30pt; }
 .spices-title h3 {        font-size: 16pt;    }
.hme-sos-title h2 {    text-align: center;    line-height: 31pt; }
.welcome-imp-text { line-height: 22pt; }
.spice-block h5, .spice-block h5 {    font-size: 11pt; }
.spice-block h4 { font-size: 14pt;}
.large-text {    font-size: 14pt;    line-height: 22pt; }
.menu-links a:link, .menu-links a:visited {     padding: 10px 0 10px 25px; }
.spice-descr {    padding-left: 40px;}
}
@media (max-width: 1200px) { 
    .container-large, .container {        padding: 0 30px;    }
    .page-menu.container {        padding-bottom: 73px;    }
    .footer-logo {        padding: 0 30px;    }
    .footer-logo img {        width: 120px;    }
    .footer-menu-address .align { padding: 0; position: relative; z-index: 1500;}
.hme-benef-itms {  background-image: none; border-radius: 40px;  height: auto;
padding: 30px 30px 30px 30px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0.89+0,0+93 */
background: linear-gradient(to bottom,  rgba(255,255,255,0.89) 0%,rgba(255,255,255,0) 93%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev { left: 0;}
.owl-carousel .owl-nav button.owl-next { right: 0;}
.brand-logo-block figure {width: 160px;} 
.brand-logo-block article {padding-left: 180px; }
.brand-logo-block h2 {    font-size: 16pt; }
.brand-logo-block h3 {    font-size: 14pt; }
.page-title h1 { width: calc(100% - 0px);}
.hme-benef-itms { min-height: 20px;}
.essence-blk {    width: calc(200px - 0px);}
.essence-wrapp .container { justify-content: center;}
.essence-wrapp { height: auto; padding: 45px 0;}
.gallery-block li {    width: calc(33.33% - 15px); } 
}
@media (max-width: 1024px) { 
.welcome-title { width: auto; } .hme-benef-itms-wrapp { justify-content: center;} 
.banner-wrapp .container-large { padding: 0 20px;} .hme-benef-itms { width: calc(50% - 15px);}
.home-why-navamani ul { gap: 15px;} .home-why-navamani li { width: calc(18% - 15px);}
.hme-spices-list, .spices-list-land { gap: 20px;}
.spice-block, .spice-block {     width: calc(33.333% - 20px); } .hme-benef-itms { height: auto; }
.brand-logo-block figure {width: 100px;} .brand-logo-block article {padding-left: 130px; }.brand-logo-block h2 {    font-size: 14pt; line-height: 14pt; }.brand-logo-block h3 {    font-size: 13pt; line-height: 13pt; }
.brand-block {    padding: 42px;    border-radius: 40px;    background-color: #fff; }
.contact-address {    padding: 50px 0px;    width: calc(100% - 0px); }    .contact-map {    position: relative;    width: calc(100% - 0px);    height: 400px; }
}
@media (max-width: 990px) { 

#page { 
  text-align: left;

}

.large-text { text-align: center;}
 .hme-story-block p { display: none;}
.header-left, .header-right .primary-menu, .footer-logo { display: none;}
.banner-wrapp .container-large {padding: 0;}
.mobile-menu { display: block; padding: 15px 0;}
.header-wrapp .container { padding: 0 20px;}
.banner-wrapp {    padding-top: 56px;    position: relative;    z-index: 1500;}
    .site-logo {        width: 103px;    }
    .banner-cap-1, .banner-cap-2 h4 {        font-size: 21pt; }    .banner-cap-2 h5 {        font-size: 11pt;        line-height: 30pt;    }
    .banner-cap-2 {        bottom: 70px;    }
    .bannerslider .owl-dots {    bottom: 20px;    }
    .brand-caption h2 {        font-size: 23pt;        line-height: 23pt;    }
    .brand-caption h3, .brand-caption h4 {        font-size: 17pt;        line-height: 17pt;    }
.page-menu { background-image: none;}    .page-menu.container {        padding-bottom: 0;    }
    .about-top .spice-box-prof { padding-bottom: 40px;}
    .page-menu { padding-bottom: 40px; border-bottom:1px solid rgba(209, 189, 165, 0); background-image: none;}
    .page-menu a:link, .page-menu a:visited{ font-size: 13pt;}
    
}
@media (max-width: 880px) { 
:root {    --gutter: 50px 0;}
.footer-top, .foot-menu-block { display: none;}
.hme-story-block, .hme-benef-itms, .footer-address  { width: calc(100% - 0px);}
.readmore-btn {    padding-top: 25px;      }
    .site-logo {        width: 109px;    }
    .banner-cap-1 {        padding-top: 56px; } .brand-logo-block {    flex-direction: column; justify-content: center; } 
.brand-logo-block article { position:relative; left: 0; padding: 20px 0 0 0; }
.footer-address { text-align: center; } .banner-cap-1 { top: auto; bottom: 180px;}
.cpr-wrapp .align { flex-direction: column; justify-content: center; text-align: center;}
.home-page .smo { position: static; transform: translate(0,0);}
.footer-menu-address { height: auto; padding: 45px 0;}
.essence-blk {        width: calc(164px - 0px);    }
}
@media (max-width: 800px) { 
  .banner-wrapp .container-large { padding: 0;}      .site-logo {        width: 110px;    }
       .header-fix .site-logo {        width: 60px;    }
    .spice-descr-box .spice-image, .spice-descr { width: calc(100% - 0px);}
    .spice-descr {        padding:20px 0 0 0;    } 
    .brand-caption h4 {    padding: 0 0 34px 0; }

        .header-fix .site-logo {        width: 47px;    }
}
@media (max-width: 768px) { 
    .spice-block, .spice-block {        width: calc(50% - 20px);    }
.home-why-navamani ul { justify-content: center; }
    .home-why-navamani li {        width: calc(28% - 15px);    }
.brand-caption h2, .brand-caption h3, .brand-caption h4 { text-align: center;}
    .brand-caption h3, .brand-caption h4 {        font-size: 13pt;        line-height: 12pt;     }
  .banner-cap-1, .banner-cap-2 h4 {        font-size: 14pt;    }
        .banner-cap-2 h5 {        font-size: 11pt;        line-height: 18pt;     }
        .welcome-title h1 {        font-size: 20pt;     }
        .spices-title h3 { font-size: 16pt;}        
            .welcome-imp-text {        font-size: 15pt; text-align: center;    } 
        .welcome-imp-text span {        display: block;        font-size: 16pt; }
    .primary-menu-overlay {        width:calc(100% - 0px); margin: 0 auto; margin-top: 180px;    }
    .spices-title h2, .page-caption h3, .hme-sos-title h2 span, .widget-title-second h3 {        font-size: 18pt;    }
.hme-benef-bg:before { display: none;} .hme-benef-bg:before, .hme-benef-bg {     border-top-left-radius: 30px;    border-top-right-radius: 30px;}
    .hme-benef-align {        padding: 30px 30px 0 30px;    } 
.hme-story-block { padding-left: 30px; padding-right: 30px;}    
.brand-logos-two-column:after, .hme-benef-wrapp, .footer-menu-address::before, .footer-menu-address::after { display: none;}
.footer-menu-address { width: calc(100% - 0px); margin: 0;}
.footer-wrapp .container { padding: 0;}
    .page-title h1 {        font-size: 20pt;    }
        .essence-blk {        width: calc(156px - 0px);    }
.know-spices-slider-wrapp .container { padding: 0;}
    .know-spices-slider-wrapp .widget-title span {        font-size: 30pt;        line-height: 30pt;    }
.hme-story-block h4, .know-spices-slider-wrapp .widget-title {    font-size: 10pt;}
.storyblock .story-image { width: calc(50% - 0px);}

.page-menu { padding-bottom: 30px;} .spices-single-wrapp { padding-top:30px; border-top:1px solid #b08a60}
}
@media (max-width: 628px) { 
    .welcome-title h1, .spices-title h3 { text-align: center;}
.brand-logo-block, .img-right, .img-left  { width: calc(100% - 0px);}
.img-right, .img-left  { padding: 10px 0;}
.brand-logo-block:nth-child(odd), .brand-logo-block:nth-child(even) {padding: 0;}
.brand-logo-block:nth-child(even)  { margin-top: 40px;} 
.brand-caption h2, .hme-benef-itms h4, .small-head h4  {         font-size: 16pt;        line-height: 19pt;     }
.hme-sos-title h2 {        font-size: 22pt; line-height: 28pt;    }
.hme-sos-title h2 span { font-size: 22pt;}
.story-title span { font-size: 14pt; line-height: 20pt;}
    .welcome-imp-text span, .welcome-imp-text { font-size: 15pt; line-height: 22pt; letter-spacing: 2px;}
    .brand-block {        padding: 40px 20px;        border-radius: 0px; }
    .hme-benef-align {        padding: 20px 20px 0 20px;    } 
    .hme-story-block figure { margin-bottom: 0;} .page-caption h3 { padding-bottom: 20px;}
.hme-story-block { padding-left: 20px; padding-right: 20px;} .hme-benef-itms { border-radius: 20px; padding: 20px;}
.readmore-btn a:link, .readmore-btn a:visited { width: 170px; }
.home-why-navamani { padding: 40px 0;}
.seperator-top { margin-bottom: 40px;}
.hme-story-blocks, .hme-gift-box { padding-top: 40px;}
.hme-story-blocks { gap: 40px;}
.hme-story-block-bottom {    position: absolute;    width: 100%;    left: 0;    background-position: center bottom;    bottom: 0;    height: 97px; }
.page-menu a:link, .page-menu a:visited {    padding: 0 14px; font-size: 13pt;}
.storyblock { padding-top: 0;} .know-spices-slider-wrapp { padding: 30px 0 40px 0;}
  .know-spices-slider-wrapp   .readmore-btn {         padding-top: 0px;    }
.gift-img-1, .page-caption br {  display: none;}
    .spice-block, .spice-block {        width: calc(100% - 0px);    }
.nutrition-table th { font-size: 9.5pt; line-height: 16pt;} .nutrition-table { width: 100%; overflow-x: auto;} .table-nonres { width: 380px;}
  .nutrition-table table.table-responsive   thead {    border: none; width: 100%;    clip: rect(0 0 0 0);    height: 1px;    margin: -1px;    overflow: hidden;    padding: 0;    position: absolute;    width: 1px;   }
     table.table-responsive  tr {    border-bottom: 3px solid #ddd;    display: block;    margin-bottom: .625em;  }  
    table.table-responsive  td {    border-bottom: 1px solid #ddd;    display: block;    font-size: .8em;    text-align: right;  }
     table.table-responsive  td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);    float: left;    font-weight: bold;    text-transform: uppercase;  }  
   table.table-responsive  td:last-child {    border-bottom: 0;  }
  table.table-responsive tr td:first-child { background-color: var(--primaryColor); color: #fff;}

  .hme-spice-box-wrapp { text-align-last: center ;}
.page-caption h3, .story-title, .benefit-title h4 { text-align: center;}
  
}
@media (max-width: 480px) { 
.essence-blk {        width: calc(33.33% - 0px);   }
.banner-cap-1 { top: auto; bottom: 160px;} .home-why-navamani ul { justify-content: center; }     .home-why-navamani li {        width: calc(50% - 15px);    }
   .hme-spices-list .spice-block, .storyblock .story-image {        width: calc(100% - 0px);    }
    .hme-spices-list  .spice-block:nth-last-of-type(-n+3) {  display: none;}
.welcome-title h1 span { display: block; padding: 8px 0;}
.menu-links { width: calc(100% - 0px); padding: 0;}
.menu-links-villas { padding: 0; }
.menu-links a:link, .menu-links a:visited {      padding: 6px 0 6px 30px; margin: 3px 0; font-size: 13pt; }
.menu-links li a::before { top: 17px;}
.menu-links-villas {       padding: 15px 0 0 0px;    margin-top: 15px;    border-left: none;    border-top: 1px solid rgba(255, 255, 255, 0.2);}
.menu-heading { text-align: center;} 
    .primary-menu-overlay {        margin-top: 130px;   }
.gallery-block li {    width: calc(50% - 15px); }
}
/* --------------------------------- */
/* --------------------------------- */
/* -------- Metex Creations -------- */
/* --------  2025 Gadhafi  -------- */
/* -------------------------------- */
/* -------------------------------- */
/* ------------------------------- */