﻿@import url('CustomBlocks.css');
body {
    font-size: .895rem;
    padding-top:8.5rem !important;
}
.padTop {
    padding-top:2rem;
}
a {
    color: #476f32;
}
a:hover {
    text-decoration:none;
    color: #b33334;
}
header {
    color:#fff;
}
.col-half-offset {
    margin-left: 4.166666667%
}
/* ROWS ---------------------------*/
.dex-map {
    background: transparent url("/siteImgs/tomatoes.png") center bottom no-repeat;
    background-size: contain;
    min-height:350px;
    opacity:.75;
    position:relative;
    margin-top:-7%;
    z-index:-999;
}
.Col2 {
    background-color: #f1f0f0;
    padding:80px 0;
}
.noPad {
    padding:0;
}
#hdrBar {
    padding: 20px 5px 15px;
    background-color: #d3202b;
    text-transform: uppercase;
    color: #fff;
    font-weight: 900;
}
.row-Grey {
    background: linear-gradient(to bottom, #f1f0f0, #f1f0f0, #c1bdbd);
}
.row-illustrator-bg-wht {
    background: url("/siteImgs/illus-dish.png") left top no-repeat, url("/siteImgs/illus-herbs.png") right top no-repeat;
    background-size: 25%, 75%;
    padding: 80px 0;
    /*text-align: center;*/
}
.row.laIda {
    background-color: #d3202b;
    color: #fff;
    margin-right: 0;
    box-shadow: 0 12px 8px -8px rgb(0 0 0 / 25%);
}
.brandWht {
    text-align:center;
    padding:60px 0;
}
.brandDk {
    position: relative;
    padding: 6% 0;
    background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7)), url("/siteImgs/about-bg.jpg") no-repeat center top;
    background-attachment: fixed;
    background-size: cover;
    min-height: 300px;
    text-align: center;
    color: #fff;
    /*display: flex;*/
    align-items: center;
    justify-content: center;
    /*margin: 0 -15px;*/
}
    .brandDk img.fadeImg {
        filter: brightness(85%);
        max-width:185px;
    }
.notch {
    position: absolute;
    top: -4.5em;
    margin: auto;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 1020;
}
.notchHdr {
    font-family: Mistral, 'Bad Script', 'Open Sans', Arial;
    position:absolute;
    top:0;
    margin:auto;
    left:0;
    right:0;
    text-align:center;
    z-index: 1021;
}
/* IMAGES --------------------------*/
.bdr {
    border:1px solid #ccc;
    padding:1px;
}
.fill {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    padding-right: 0;
}
    .fill img {
        flex-shrink: 0;
        min-width: 100%;
        min-height: 100%;
         object-fit: cover;
    }

.logo.media {
    display: block;
    width: 210px;
}

img .logo-image {
    width: 210px;
    height: 141px;
}
/*Brand logos*/
figure {
    margin:0;
}
.row-imgs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between; /* or space-around */
    margin-top: 80px;
}

    .row-imgs img {
        border: none;
        max-width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
    }



/*ul li.gallery {
    margin: 5px;
    border: 1px solid #ccc;
    float: left;
    width:20%;
    max-width: 210px;
}
    div.gallery img {
        width: auto;
        max-height: 85px;
    }

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}*/
/*   */
.marginup {
    margin-top: -7%;
    margin-bottom:6%;
}
.marginup p {
    padding: 25px 0 30px;
}
.pad30 {
    padding:30px 0;
}
.pad60 {
    padding:60px 0;
}
.dex-card {
    position:relative;
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 30px;
    color: #6a6a6a;
    text-align: center;
    height: 100%;
}
.dex-card img.imgIcon {
    padding-bottom:25px;
    width:75px;
}
.btmRt {
    position: absolute;
    bottom: 30px;
    right: 10%;
}
.dex-card a {
    color: #000;
}
.dex-card a:hover {
    border:1px solid #ccc;
    padding:15px;
    border-radius:25px;
    background-color:#f1f0f0;
}
p.W50 {
    width:50%;
    margin: 0 auto;
    font-size:1.2em;
}
.W60 {
    width:60%;
    margin: 0 auto;
}
.ctr {
    text-align: center;
}
.row-illustrator-bg-wht [class*="col-"] {
    padding:0;
}
.dex-login {
    border-left:1px solid #ccc;
    margin-left:10px;
    padding-left:5px;
}
.dex-login a {
    color: #6a6a6a;
}
    .dex-login a:hover {
        color: #c4202e;
    }
/* Colors ---------------------*/
.gold {
    color: #fbd507;
}
.red {
    color: #c4202e;
}
.red-dk {
    color: #b33334;
}
.grn {
    color: #009758;
}
.wht {
    color: #fff;
}
h3.blk {
    color: #000;
    padding-bottom:20px;
}
h3.red-dk.sm {
    font-size:1.75em;
}
h3.grey {
    font-size:1.75em;
    color: #44403d;
}
h3.red-dk {
    margin-bottom:40px;
}
h4.red-dk {
    font-size:1.25em;
    letter-spacing:.025em;
    font-weight:600;
}
.bg-Yr {
    
}
h1.yr {
    font-family: Mistral, 'Bad Script', 'Open Sans', Arial, 'Arial Rounded MT';
    font-size:3.70em;
    color: #6a6a6a;
    margin-top:8%;
    text-align:center;
    /*position:absolute;
    top: 50%;
    left:10%;*/
    display:inline-block;
    min-width:210px;
    height:68px;
    background: transparent url("/siteImgs/bg-Yr.png") left bottom no-repeat;
}
/* Lists ---------------------------*/
ul.checkList {
   margin-top:40px;
}
ul.checkList li {
    font-size:1.25em;
    margin-bottom:15px;
}
    ul.checkList span.fa-li {
        color: #79ab3e;
    }
i.fa-regular {
    color:#6a6a6a;
}
/* Buttons -------------------------*/
.btnDiv {
    margin: 60px 0 30px;
}
a.grnBtn {
    position: relative;
    display: inline-block;
    background-color: #053c25;
    text-align: center;
    padding: 12px 18px;
    border: 1px solid #053c20;
    border-radius: 25px;
    text-decoration:none;
    width: auto;
    color: #fff;
}
a.grnBtn:hover {
    background-color:#000;
    border-color:#000;
}
/*    ----------------------------------*/
.img800 {
    position: absolute;
    bottom: 100px;
    right: 0px;
    min-width: 800px;
    max-width: 100%;
    height: auto;
}
.boxPadRt {
    max-width:480px;
    margin:13% 5%;
}
.barRt p, .barLt p {
    padding:3% 10%;
}
.barRt p {
    border-right:1px solid #ccc;
}
.barLt p {
    border-left:1px solid #ccc;
}
/*   PRODUCTS/CATEGORIES   */
.html-brandDesc h2 {
    font-size:1.5em;
}
.catGrid {
    display: inline-block !important;
    border: solid 1px #d3d1d1;
    padding: 20px 20px 30px;
    margin: 15px;
    border-radius: 3px;
    /*box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;*/
    /*box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;*/
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    text-align: center;
    font-family: 'Open Sans';
}

.prod-bg {
    padding:40px 0 60px;
    background-color:#f1f0f0;
    margin: 0 auto;
}
/*.intro {
    position:relative;
    height: auto;
}*/
.intro img {
    /*display:block;*/
    /*position:absolute;
    bottom:0;
    right:10px;*/
}
.html-brandDesc {
    border-left:1px solid rgba(0,0,0,.25);
    margin:40px 0 0 40px;
    padding-left:40px;
}
    .html-brandDesc h2 {
        color: #b33334;
        font-weight:bold;
        padding: 0;
        font-size: 1.75em;
        text-transform:uppercase;
    }
a.catBtn {
    padding: 5px 12px 5px;
    border: 1px solid green;
    border-radius: 6px;
    background-color: #009858;
    color: #fff;
}
a.catBtn:hover {
    background-color:darkgreen;
}
/*  FOOTER ----------------------------------------*/
.fas.fa-chevron-right {
    color:#6a6a6a;
}
footer.dex {
    color: #e7e7e7;
    padding: 40px 0 20px;
    background: #000 url("/siteImgs/footer-bg.jpg") no-repeat center center;
    background-size: cover;
}
footer .dexquote {
    max-width:160px;
    font-style: italic;
}
footer h5 {
    font-family: 'Open Sans';
    padding: 40px 0 30px;
}
footer hr {
    border-top: 1px solid #585757;
    margin-top: 60px;
}
footer span.ltgrey {
    color: #999;
}
footer ul li {
    border-bottom: 1px solid #3c3c3c;
}

footer a {
    color: #e62228 !important;
}
footer a:hover, footer a.nav-link:hover {
    color:#ccc !important;
}

/* Navigation -------------------------------*/
.navbar-brand {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}
.navbar.fixed-top {
    background-image: url("/siteImgs/nav-bg.gif");
    background-repeat: repeat-x;
    background-position: left bottom;
}
a.nav-link:hover {
    color: #000 !important;
}
ul li.nav-item.dropdown:hover > .dropdown-menu {
    display:block;
}
ul li.nav-item.dropdown > .dropdown-menu {
    box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.2);
    margin-top:0;
    border-color:#c1bdbd;
}
ul li.nav-item.dropdown > .dropdown-menu ul {
   padding:8px 0;
}
ul li.nav-item.dropdown > .dropdown-menu li {
    list-style: none;
    margin:6px 15px;
}
    ul li.nav-item.dropdown > .dropdown-menu li a:hover {
        color:#000;
    }
    /* Media Queries ------------------------------------------*/
    @media screen and (max-width: 400px) {
        .logo.media {
        display:none;
    }
    a.navbar-brand {
        width: 210px;
        height: auto;
        margin: 0 auto;
        display:block;
    }
   
}
@media screen and (max-width: 764px) {
 .media-none {
        display:none;
    }
 .pad60, .pad30 {
     padding:5px;
 }
 .brandDk {
     padding-top:60px;
 }
}
@media screen and (max-width:800px) {
    body {
        font-size:75%;
    }
    .boxPadRt h1 {
        font-size:1.5rem !important;
    }
    .img800 {
        min-width: 600px !important;
        max-width: 600px !important;
    }
    .boxPadRt h3.blk {
        font-size: 1.25rem;
    }
}
@media screen and (min-width:912px)
{
    .row-illustrator-bg-wht
    {
        background-size:auto, auto;
    }
}
@media screen and (min-width:768px)
{
    .row-illustrator-bg-wht [class*="imgRt"] {
        text-align: right;
        padding-right: 50px;
    }

    .row-illustrator-bg-wht [class*="imgLt"] {
        text-align: left;
        padding-left: 70px;
    }
}
@media screen and (max-width:540px) {
    .dex-map {
       display:none;
    }
}
@media screen and (max-width:1024px) {
    .dex-map {
 min-height: 200px;
        margin-top: -10%;
    }
}