@charset "utf-8";

#mrgTopHdr {margin-top: -42px;}

#brandPage #fancybox-outer {display: flex; align-items: center;}

.brandLandingPage .brd-btm { border-bottom: 1px solid #dfdfdf;}
.brandLandingPage .brd-btm:empty { display: none; }
.brandLandingPage .maxInner {max-width: 90vw;}
.brandLandingPage .videoWrapper {max-height: 100%;}

.mgr-btm-32.mgr-btm-32 {margin-bottom: 32px;}
.mrg-mast {margin-top: var(--mast-height);}

.fs1-2x {font-size: 1.2em;}
.fs1-5x {font-size: 1.5em;}
.fs1-7x {font-size: 1.7em;}
.fs2x {font-size: 2em;}

.bg1 {background: #000;}

div[class*="brandRow"] > div {display: grid;grid-gap: 1em;}
div[class*="brandRow"] > div > a {position: relative;width: 100%;height: 100%;}
.brandRow1 > div { grid-template-columns: repeat(1, 1fr); -ms-grid-columns: 1fr; }
.brandRow2 > div { grid-template-columns: repeat(2, 1fr); -ms-grid-columns: 1fr 1fr; }
.brandRow3 > div { grid-template-columns: repeat(3, 1fr); -ms-grid-columns: 1fr 1fr 1fr; }
.brandRow4 > div { grid-template-columns: repeat(4, 1fr); -ms-grid-columns: 1fr 1fr 1fr 1fr; }
.brandRow5 > div { grid-template-columns: repeat(5, 1fr); -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr; }
.brandRow6 > div { grid-template-columns: repeat(6, 1fr); -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr; }

div[class*="brandRow"] .photo div:after {padding-bottom: 100%; content: "";display: block;width: 100%; background: #00000000; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; height: 100%;}
div[class*="brandRow"] a.brandCTA {display: block;text-align: center;padding: 16px 32px;text-transform: uppercase;font-family: 'citrfontbold';letter-spacing: 1px;font-size: 1.2em;color: #00421b;border: 3px solid;backdrop-filter: blur(2px);margin: 32px auto 0 auto;height: auto;max-width: 452px;}
div[class*="brandRow"] a.brandCTA:hover {background: #00421B33;border-color: #00421B;}

.brandRowTopPick .photo > div {background-size: contain !important;background-color: #f4f4f4 !important;}

/* text overlay --------------------------------------------------------------- */
div[class*="brandRow"] .bannerTxtCtr{position: absolute;display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;text-align: center;z-index: 2;width: 100%;height: 100%;flex-direction: column;-ms-flex-direction: column;color: white;}
div[class*="brandRow"] > div > a.col-2,
div[class*="brandRow"] .bannerTxtCtr.col-2 {width: 50%;}
div[class*="brandRow"] .bannerTxtCtr.col-2 > span {background: none;}
div[class*="brandRow"] .bannerDesc{margin: 0.5em 0;text-transform: none;letter-spacing: normal;}
div[class*="brandRow"] .bannerTitle, .brandRowTopPick .bannerTitle, .brandLand .header h2 {font-size: calc(18px + (28 - 18) * ((100vw - 300px) / (1920 - 300)));overflow: visible;}
div[class*="brandRow"] .bannerView{margin: 0;padding: 16px 32px;text-transform: uppercase;font-family: 'citrfontbold';letter-spacing: 1px;background: #fff0;font-size: 1.2em;color: #00421b;position: relative;bottom: -4px;left: 2px;border: 3px solid;backdrop-filter: blur(2px);}

.brandRowTopPick > div {justify-content: center;-webkit-justify-content: center;-moz-justify-content: center;-ms-justify-content: center;align-content: center;align-items: center;-webkit-align-items: center;-moz-align-items: center;-ms-align-items: center;flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;-moz-flex-wrap: wrap;display: -webkit-box !important;display: -moz-box !important;display: -ms-flexbox !important;display: -webkit-flex !important;display: flex !important;flex-direction: row;grid-gap: 32px 0!important;padding-top: 32px;}
.brandRowTopPick > div .bannerVideo {padding: 5em;background: #f4f4f4;}

.brandRowTopPick .bannerTxtCtr { position: initial !important; padding: 2em;}
.brandRowTopPick .bannerTitle { color: #000; white-space: normal; }
.brandRowTopPick .bannerDesc { color: #333; }
.brandRowTopPick .bannerView {color: #000;border: #000 2px solid;margin: 0;background: transparent;}
.brandRowTopPick .bannerView:hover { background: #00421B33; border-color: #00421B;}


.brandBlog .container {padding: 3em;}
.brandBlog {color: #000000;}
.brandBlog .large-article-content {position: relative;}
.brandBlog .large-article-content > h3:first-of-type {font-size: 5em;}
.brandBlog .large-article-content > h3:first-of-type::after {content: ""; width: 25%; height: 8px; background: #00421B; display: block; margin: 1rem 0 5rem 0;}
.brandBlog .large-article-content::after {content: "";width: 50px;height: 50px;background: #00421B;display: block;position: relative;bottom: 0;right: 0;float: right;border-radius: 50%;}
.brandBlog .columnFlow { -moz-column-count: 3; -moz-column-gap: 64px;  -webkit-column-count: 3; -webkit-column-gap: 64px; column-gap: 64px; column-count: 3;}
.brandBlog blockquote {font-size: 2.25em;line-height: 1.5em;padding: 0 0 0 1em;margin: 1em 0;border-left: 4px solid #00421B;}
.brandBlog blockquote > p {display: block;width: 100%;color: #909090;font-size: 0.33em;line-height: 2em;}
.brandBlog blockquote > p::before {content: "- ";}
.brandBlog blockquote {overflow: hidden;}
.brandBlog a {cursor: -webkit-zoom-in;width: 100%;float: left;margin-bottom: 1em;display: inline-block;display: -webkit-inline-box;}

.brandLand > div {max-width: 90vw; margin: 0 auto;}
.brandLand .header {text-align: center; max-width: 50%; padding: 0 0 32px 0; margin: 0 auto;}
.brandLand .header h2 { text-transform: uppercase;}
.brandLand .flexslider li .item-repeater-info {text-align: center;min-height: auto;}
.brandLand .flexslider li .item-repeater-info-name {color: #777;min-height: 0;text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.brandLand .flexslider li:hover .item-repeater-info-name {color: #00421B;}
.brandLand .flexslider li .item-repeater-info-desc {font-size: 12px;line-height: 2em;color: #000; font-style: italic;}
.brandLand .flexslider li  {max-width: 500px;}



/* Large Mobile Phones --------------------------------------------------------------- */
@media screen and (max-width:767.9px)
{
    .brandBlog .container { padding: 2em;}
    .brandRow4 > div { grid-template-columns: repeat(1, 1fr); -ms-grid-columns: 1fr; }
    .brandRowTopPick > div { grid-template-columns: repeat(1, 1fr); -ms-grid-columns: 1fr; }
    .brandRowTopPick > div .bannerVideo {grid-column: auto; padding: 0;}
    .brandRowTopPick .photo {padding: 0;}

    [class*="hmBanner"] > div{padding:0 0 0.5em 0;grid-gap:0.5em;}
    .bannerTxtCtr{padding:8px }
    .bannerTitle{font-size:large;text-transform:uppercase;}
    .bannerTxtCtr > span{padding:4px 8px; }
    .brandRowTopPick .bannerDesc { display: block !important; max-width: 100% !important; }
    .brandRowTopPick a.Banner { order: -1; padding: 2em; }

    .brandLand .header { max-width: 100%; }

    .brandBlog .large-article-content::after { width: 25px; height: 25px; }
    .brandBlog .large-article-content > h3:first-of-type {color: #FFF; font-size: 3em !important;}
	
	div[class*="brandRow"] > div > a.col-2,
	div[class*="brandRow"] .bannerTxtCtr.col-2 {width: 100%;}
	
}

/* iPads (portrait and landscape) --------------------------------------------------------------- */
@media screen and (min-width:768px) and (max-width:1023.9px)
{
    .brandRow4 > div { grid-template-columns: repeat(2, 1fr); -ms-grid-columns: 1fr 1fr; }

    .bannerTitle{font-size:large;}
    .bannerTxtCtr{padding:16px;}
    .bannerTxtCtr > span{padding:4px 8px;}

    .brandRowTopPick .bannerDesc { display: block !important; max-width: 100% !important; }
    .brandRowTopPick a.Banner {order: -1; }
    .brandRowTopPick .col-2 {width: 100% !important; }

    .brandLand .header { max-width: 100%; }

    .brandBlog .container { padding: 2em;}
    .brandBlog .large-article-content::after { width: 25px; height: 25px; }

    .brandBlog .columnFlow { -moz-column-count: 1!important; -webkit-column-count: 1 !important; column-count: 1!important; }
}

/* laptops Large ------------------------------------------------------------------------------------- */
@media screen and (min-width:1024px) and (max-width:1439.9px)
{
    .brandRow4 > div { grid-template-columns: repeat(2, 1fr); -ms-grid-columns: 1fr 1fr; }
    .bannerTxtCtr{padding:16px }

    .brandLand .header { max-width: 100%; }

    .brandBlog .columnFlow { -moz-column-count: 2 !important; -webkit-column-count: 2 !important; column-count: 2!important; }

    .brandRowTopPick .bannerDesc { display: block !important; max-width: 100% !important; }
}

/* Desktops ------------------------------------------------------------------------------------ */
@media screen and (min-width:1440px) and (max-width:1913.9px)
{

}

/* 4K ------------------------------------------------------------------------------------------ */
@media screen and (min-width:1914px)
{

}