:root {
--link-text-color: #33CCCC;
--link-hover-text-color: #259494;
--subheading-color: #003263;
--header-bg-color: #003263;
--checkout-left-bar-bg: #FFFFFF;
--left-bar-bg: #FFFFFF;
--left-bar-border-color: #F5F5F5;
--tile1-bg-color: #FF0066;
--tile2-bg-color: #5E656B;
--tile3-bg-color: #003263;
--tile4-bg-color: #33CCCC
}
[data-theme="dark"], [data-theme="dark"] .grey_background, .dark_editor {
--link-text-color: #88ffff;
--link-hover-text-color: #7ae9e9;
--subheading-color: #fff;
--checkout-left-bar-bg: #28292d;
--left-bar-bg: #28292d;
--left-bar-border-color: #3B3D44;
--tile1-bg-color: #28292d;
--tile2-bg-color: #28292d;
--tile3-bg-color: #28292d;
--tile4-bg-color: #28292d
}

/* navigation */

nav.mainNav ol > li > a, nav.mainNav .dropDown ul li a:hover, body.loginPage .loginOptions label, body.loginPage .loginOptions a {
color: #5E5F5F
}

.portal header nav.mainNav li.loginHolder a, .portal header nav.mainNav li.loginHolder a:hover {
background-color: #33CCCC
}

/* links */

a, .optionsRibbon ul li a:hover, footer a.language:hover, dt, .primaryColorText, a.secondaryColorText:hover {
color: #33CCCC; color: var(--link-text-color)
}

@media screen and (max-width: 559px) {
.floating_text a.options_btn.inverted {
color: #33CCCC; color: var(--link-text-color)
}
}

/* hover */

a:hover, h3, h5, .secondaryColorText {
color: #259494; color: var(--link-hover-text-color)
}

/* buttons, popups */

.difSignIn, input[type="submit"], input[type="button"], button, #facebox .header, #contentBody .centreBtn, .optionsRibbon ul.inverted li a, .portal #contentHeader, .jconfirm .jconfirm-box div.title, header .mobileBar, .options_btn.inverted, #fullscreen_msg_holder .header, .link_button, ul.tabnav li a.selected:after {
background: #003263
}

/* Top tab selector */

ul.tabnav li a.selected:after, .tabnav .tabnav__tab.selected > *:after, table.calendar_small .current div, table.calendar .current, .calendar-agenda-day .current, .optionsRibbon ul li.selected a:before {
background: #33CCCC
}

/* Inverted options links */

.optionsRibbon ul.inverted li a, .options_btn.inverted {
background: #33CCCC
}

/* footer and wrapper */

footer, .portal #wrapper {
background: #003263
}

/* thin strip at top */

@media screen and (min-width: 980px) {
header {
border-top: 4px solid #003263
}
}
body.loginPage {
border-color: #003263 !important
}

/* h2 */

body.portal #contentBody h2, #centreColumn h2, body.portal .customHome h2 {
color: #003263
}

/* Message box */

nav.mainNav ol > li.portalCart a .newAlert {
background-color: #33CCCC
}

/* Tinymce */

.mce-window-head, .mce-foot .mce-btn button, .mce-menu-item:hover, .mce-menu-item.mce-selected, .mce-menu-item:focus {
background: #003263 !important
}

/* Fonts */

h1:not(.customLogo), h2, h3, h4, h5, h6, #centreColumn .centerHeading, .jconfirm .title, .mce-window-head .mce-title, .heading_font {
font-family: 'Poppins', sans-serif !important;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
  html, body, button, .italics, b, strong, fieldset legend {
  font-family: 'Lato', sans-serif
  }
  b, strong, fieldset legend {font-weight: bold}
  .italics {font-style: italic}

/* Panels */

.colorBtn {
background-color: #33CCCC
}

.panel1 .clearBtn, .panel4 .clearBtn {
border-color: #33CCCC;
color: #33CCCC
}

  .panel1.stripe > div .block {
  border-top-color: #FF0066
  }
  .panel1.stripe > div .block:nth-child(4n+2) {
  border-top-color: #5E656B
  }
  .panel1.stripe > div .block:nth-child(4n+3) {
  border-top-color: #003263
  }
  .panel1.stripe > div .block:nth-child(4n+4) {
  border-top-color: #33CCCC
  }

/* Tile backgrounds */

.catalog_boxes .tile_color_1, html:not([dir=rtl]) .catalog_class.tile_color_1 #contentWrap:before, [dir=rtl] .catalog_class.tile_color_1 #contentWrap:after, .catalog_class.tile_color_1 #leftColumn, .modern_module_list > table:nth-of-type(4n+1) .modern_module_row td {
background-color: #FF0066; background-color: var(--tile1-bg-color)
}
.catalog_boxes .tile_color_2, html:not([dir=rtl]) .catalog_class.tile_color_2 #contentWrap:before, [dir=rtl] .catalog_class.tile_color_2 #contentWrap:after, .catalog_class.tile_color_2 #leftColumn, .modern_module_list > table:nth-of-type(4n+2) .modern_module_row td {
background-color: #5E656B; background-color: var(--tile2-bg-color)
}
.catalog_boxes .tile_color_3, html:not([dir=rtl]) .catalog_class.tile_color_3 #contentWrap:before, [dir=rtl] .catalog_class.tile_color_3 #contentWrap:after, .catalog_class.tile_color_3 #leftColumn, .modern_module_list > table:nth-of-type(4n+3) .modern_module_row td {
background-color: #003263; background-color: var(--tile3-bg-color)
}
.catalog_boxes .tile_color_4, html:not([dir=rtl]) .catalog_class.tile_color_4 #contentWrap:before, [dir=rtl] .catalog_class.tile_color_4 #contentWrap:after, .catalog_class.tile_color_4 #leftColumn, .modern_module_list > table:nth-of-type(4n+4) .modern_module_row td {
background-color: #33CCCC; background-color: var(--tile4-bg-color)
}
[data-theme="dark"] .catalog_boxes *[class*='tile_color_'], [data-theme="dark"] .catalog_boxes *[style*='background-color'], [data-theme="dark"] .modern_module_list > table .modern_module_row td {
background-color: var(--tile1-bg-color) !important
}
[data-theme="dark"] body.evo [data-tile-color-bar="true"]::before {
background-color: var(--tile1-bg-color) !important; display: block !important
}


  /* Checkout page side bar - Background */

  .catalog_class #leftColumn, html:not([dir=rtl]) .catalog_class #contentWrap:before, [dir=rtl] .catalog_class #contentWrap:after {
    background-color: #FFFFFF !important; background-color: var(--checkout-left-bar-bg) !important
  }

  /* Checkout page side bar - Border */

  @media screen and (min-width: 768px) {
  html:not([dir=rtl]) .catalog_class #contentWrap:before, [dir=rtl] .catalog_class #contentWrap:after {
    border: 1px solid #e2e0e0 !important;
  border-width: 0 1px 0 0 !important
  }
  [dir=rtl] #contentWrap.hasLeftColumn:after {
  border-width: 0 0 0 1px !important;
  }
  }

  /* Checkout page side bar - Text */

  .catalog_class #leftColumn > div, .catalog_class #leftColumn > div td, .catalog_class #leftColumn > div p, .catalog_class #leftColumn > div span, .catalog_class #leftColumn table a, #leftColumn #checkout_summary h2 {
  color: #333; color: var(--main-text-color)
  }
  .catalog_class #leftColumn .info li span, .catalog_class #leftColumn .info a:not(.normalLink), .catalog_class #leftColumn .label.box a, .catalog_class #leftColumn a.access_code {
  color: #707070; color: var(--dark-grey-text-color)
  }
  #leftColumn #checkout_summary hr, .catalog_class #leftColumn table td {
  border-color: #e0e0e0
  }

  /* Checkout page side bar - Icons */

  .catalog_class #leftColumn .infoHolder i:after, .catalog_class #leftColumn .infoHolder a:hover i:after, .checkout_order i:after {
  left: 0 !important
  }

  /* Checkout page side bar - Button bg */

  .catalog_class #leftColumn .center a.button, .catalog_class #leftColumn .center button {
  background-color: #33CCCC
  }



/* Profile_header - Background */

.profile_header .profile_background {
background-color: #33CCCC
}

/* Catalog call to action - Background */

.catalog_item .profile_header .profile_info .alignR .link_button {
background-color: #FF0066
}

