/* =========================
   COCA CSS OVERRIDES
   CLEAN VERSION
   ========================= */


/* -------------------------
   BRAND BASICS
   ------------------------- */
:root {
  --site-primary: #231717;
  --site-accent: #D81F27;
  --site-secondary: #97999B;
  --site-bg: #FFFFFF;
  --site-text: #231717;
}

body {
  background: var(--site-bg);
  color: var(--site-text);
  font-family: Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--site-primary);
}

/* regular content links only */
#idContentHolder a,
#idFooter a {
  color: var(--site-accent) !important;
}

#idContentHolder a:hover,
#idFooter a:hover {
  color: var(--site-primary) !important;
}


/* =========================
   WIDER LAYOUT
   ========================= */

#mLayout .container_12 {
  width: calc(100% - 40px) !important;
  max-width: 1500px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

#mLayout .s1_grid_12,
#mLayout .s2_grid_12,
#mLayout .s3_grid_12 {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  box-sizing: border-box !important;
}

#mLayout .WaPlaceHolder {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

#mLayout .WaPlaceHolder > div {
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}


/* =========================
   HEADER
   LET WA CONTROL HEADER BACKGROUND
   ========================= */

#idHeaderContentHolder,
#idHeaderContentHolder .WaPlaceHolder,
#idHeaderContentHolder .WaPlaceHolder > div,
#idHeaderContentHolder .WaContentHolder,
#idHeaderContentHolder .inner,
#idHeaderContentHolder .zoneContentHolder,
#idHeaderContentHolder .siteOuterContainer,
#idHeaderContentHolder table,
#idHeaderContentHolder tbody,
#idHeaderContentHolder tr,
#idHeaderContentHolder td,
#idHeaderContentHolder .WaGadgetContent,
#idHeaderContentHolder .WaGadgetContent > div,
#idHeaderContentHolder .gadgetStyleBody,
#idHeaderContentHolder .gadgetStyleBodyOuterContainer,
#idHeaderContentHolder .gadgetStyleBodyInnerContainer {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

#idHeaderContentHolder {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#idHeaderContentHolder::before,
#idHeaderContentHolder::after {
  display: none !important;
  content: none !important;
}

/* header links */
#idHeaderContentHolder a {
  color: #D81F27 !important;
}

/* search field text */
#idHeaderContentHolder input,
#idHeaderContentHolder input[type="text"] {
  color: #231717 !important;
}


/* =========================
   WHITE BREAK ABOVE MENU
   ========================= */

.WaGadgetMenuHorizontal {
  margin-top: 16px !important;
  border-top: 6px solid #FFFFFF !important;
  box-sizing: border-box !important;
}


/* =========================
   KEEP MAIN NAV WHITE
   ========================= */

.WaGadgetMenuHorizontal a,
.WaGadgetMenuHorizontal a:link,
.WaGadgetMenuHorizontal a:visited {
  color: #FFFFFF !important;
}


/* =========================
   PILLS
   ========================= */

a.stylizedButton.buttonStyle001,
a.stylizedButton.buttonStyle002,
a.stylizedButton.buttonStyle003 {
  border-radius: 999px !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  overflow: hidden !important;
}


/* =========================
   IMAGE CONTROL
   ========================= */

#idContentHolder img:not(.coca-video-logo) {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
}

.coca-video-logo {
  width: auto !important;
  object-fit: contain !important;
}


/* =========================
   WIDGET SAFETY
   ========================= */

#idContentHolder iframe,
#idContentHolder object,
#idContentHolder embed {
  max-width: 100%;
  overflow: visible !important;
}


/* =========================
   FOOTER FIX
   ========================= */

#idFooterContentHolder,
#idFooterContentHolder .WaPlaceHolder,
#idFooterContentHolder .WaPlaceHolder > div,
#idFooter {
  background: #231717 !important;
  color: #FFFFFF !important;
}

#idFooter a {
  color: #D81F27 !important;
}


/* =========================
   MOBILE
   ========================= */

@media screen and (max-width: 991px) {
  #mLayout .container_12 {
    width: calc(100% - 24px) !important;
    max-width: 100% !important;
  }

  #mLayout .WaPlaceHolder > div {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}