/* topnav.less/topnav.css - amerimark
 *
 * Req1400002.2.0 10/28/14 mjw - style to match live after conversion
 * REQ1430077 12/18/14 - mjw - fix IE11 topnav being center aligned.
 * REQ1810001 10/01/18 jlg - Move top nav code to topnav CSS files
 * REQ1840080 10/04/18 jlg - AMK taxonomy changes
 * REQ1990001 06/20/19 jlg - Rewrite CSS rules
 * REQ1940061 07/22/19 jlg - Redesign AMK/AR top nav
 * REQ1940061 08/14/19 jlg - Fix for overlapping categories on AMK sale
 * REQ2040010 01/22/20 jlg - Remove 9 digit top nav categories
 * REQ2040024 01/27/20 jlg - Change final call clearance color
 * REQ2040010 02/04/20 jlg - Account for new column on AMK for sale & beauty
 * REQ2040010 02/05/20 jlg - Fix spacing on hlt
 * Req2001000 01/19/21 jlg - responsive design
 * REQ2140014 03/14/21 rlk - new image sizes
 * REQ2140021 04/07/21 rlk - subheader height increase (w/filter-sort update)
 * REQ2140083 10/12/21 rlk - site cleanup
 */
.subHeader {
  min-height: 100px;
}
.mobileNav nav #topnav .topNavLevel1 a {
  color: #052B33;
}
.mobileNav nav #topnav .topNavLevel1 .secondLevel .beautyWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .appWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .newWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .shoeWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .healthWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .sexualWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .homeWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .clearanceWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .tvWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .saleWrapper,
.mobileNav nav #topnav .topNavLevel1 .secondLevel .jewelryWrapper {
  display: none;
}
.mobileNav nav #topnav .topNavPlus {
  background-image: url(/images/empreview/responsive/mobileMenuPlus.svg);
  -webkit-filter: brightness(0) saturate(100%) invert(100%) sepia(15%) saturate(7263%) hue-rotate(310deg) brightness(105%) contrast(84%);
  filter: brightness(0) saturate(100%) invert(100%) sepia(15%) saturate(7263%) hue-rotate(310deg) brightness(105%) contrast(84%);
}
.mobileNav nav #topnav .topNavX {
  background-image: url(/images/empreview/responsive/mobileMenuX.svg);
  -webkit-filter: brightness(0) saturate(100%) invert(100%) sepia(15%) saturate(7263%) hue-rotate(310deg) brightness(105%) contrast(84%);
  filter: brightness(0) saturate(100%) invert(100%) sepia(15%) saturate(7263%) hue-rotate(310deg) brightness(105%) contrast(84%);
}
/* Tablet-landscape (and larger) 
 * Laptops (and larger)
 */
@media only screen and (min-width: 750px), (min-width: 992px), (min-width: 1200px) {
  html body header .subHeader {
    min-height: 0;
  }
  html body header nav {
    background-image: url(/images/empreview/responsive/background-TFM.png);
    background-color: #fff;
  }
  html body header nav ul#topnav {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 1%;
  }
  html body header nav ul#topnav a {
    color: #052B33;
    font-weight: normal;
  }
  html body header nav ul#topnav a.topLevelCatLink {
    font-size: 63%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 10px;
    font-family: "ralewaybold", Arial, Helvetica, sans-serif;
  }
  html body header nav ul#topnav a.topLevelCatLink .mainTag {
    font-weight: 900;
  }
  html body header nav ul#topnav a.topLevelCatLink .secondaryTag {
    font-family: "ralewayregular", Arial, Helvetica, sans-serif;
  }
  html body header nav ul#topnav > li:hover > .topArrow:after {
    top: 100%;
  }
  html body header nav ul#topnav > li[data-categoryid="hlt"]:hover > .topArrow:after,
  html body header nav ul#topnav > li[data-categoryid="lin"]:hover > .topArrow:after,
  html body header nav ul#topnav > li[data-categoryid="sho"]:hover > .topArrow:after,
  html body header nav ul#topnav > li[data-categoryid="bty"]:hover > .topArrow:after,
  html body header nav ul#topnav > li[data-categoryid="jry"]:hover > .topArrow:after {
    top: 140%;
  }
  html body header nav ul#topnav div[level="2"].secondLevel {
    height: 390px;
  }
  html body header nav ul#topnav div[level="2"].secondLevel a {
    color: #052B33;
    text-transform: none;
  }
  html body header nav ul#topnav div[level="2"].secondLevel img {
    width: 100%;
  }
  html body header nav ul#topnav div[level="2"].secondLevel div[level="3"] {
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  html body header nav ul#topnav div[level="2"].secondLevel div[level="3"] ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  html body header nav ul#topnav div[level="2"].secondLevel div[level="3"] ul li {
    margin-bottom: 3%;
    margin-left: 5%;
  }
  html body header nav ul#topnav .beautyWrapper,
  html body header nav ul#topnav .skinWrapper,
  html body header nav ul#topnav .appWrapper,
  html body header nav ul#topnav .newWrapper,
  html body header nav ul#topnav .plusWrapper,
  html body header nav ul#topnav .shoeWrapper,
  html body header nav ul#topnav .hairWrapper,
  html body header nav ul#topnav .accessoryWrapper,
  html body header nav ul#topnav .healthWrapper,
  html body header nav ul#topnav .giftWrapper,
  html body header nav ul#topnav .homeWrapper,
  html body header nav ul#topnav .sexualWrapper,
  html body header nav ul#topnav .clearanceWrapper,
  html body header nav ul#topnav .tvWrapper,
  html body header nav ul#topnav .saleWrapper,
  html body header nav ul#topnav .jewelryWrapper,
  html body header nav ul#topnav .hairCareFeatureImage,
  html body header nav ul#topnav .accessoryFeatureImage,
  html body header nav ul#topnav .giftFeatureImage,
  html body header nav ul#topnav .homeFeatureImage,
  html body header nav ul#topnav .newImage2,
  html body header nav ul#topnav .newImage3,
  html body header nav ul#topnav .clearanceImage2,
  html body header nav ul#topnav .clearanceImage3 {
    position: absolute;
  }
  html body header nav ul#topnav .beautyWrapper,
  html body header nav ul#topnav .skinWrapper,
  html body header nav ul#topnav .appWrapper,
  html body header nav ul#topnav .newWrapper,
  html body header nav ul#topnav .plusWrapper,
  html body header nav ul#topnav .shoeWrapper,
  html body header nav ul#topnav .hairWrapper,
  html body header nav ul#topnav .accessoryWrapper,
  html body header nav ul#topnav .healthWrapper,
  html body header nav ul#topnav .giftWrapper,
  html body header nav ul#topnav .homeWrapper,
  html body header nav ul#topnav .sexualWrapper,
  html body header nav ul#topnav .clearanceWrapper,
  html body header nav ul#topnav .tvWrapper,
  html body header nav ul#topnav .saleWrapper,
  html body header nav ul#topnav .jewelryWrapper {
    top: 2.5%;
  }
  html body header nav ul#topnav .skinWrapper,
  html body header nav ul#topnav .hairWrapper,
  html body header nav ul#topnav .giftWrapper,
  html body header nav ul#topnav .clearanceWrapper,
  html body header nav ul#topnav .newWrapper,
  html body header nav ul#topnav .appWrapper,
  html body header nav ul#topnav .plusWrapper,
  html body header nav ul#topnav .shoeWrapper,
  html body header nav ul#topnav .accessoryWrapper,
  html body header nav ul#topnav .homeWrapper,
  html body header nav ul#topnav .sexualWrapper,
  html body header nav ul#topnav .healthWrapper,
  html body header nav ul#topnav .beautyWrapper,
  html body header nav ul#topnav .tvWrapper,
  html body header nav ul#topnav .saleWrapper,
  html body header nav ul#topnav .jewelryWrapper {
    right: 0.8%;
  }
  html body header nav ul#topnav .beautyLink,
  html body header nav ul#topnav .skinLink,
  html body header nav ul#topnav .appLink,
  html body header nav ul#topnav .newLink,
  html body header nav ul#topnav .plusLink,
  html body header nav ul#topnav .shoeLink,
  html body header nav ul#topnav .hairLink,
  html body header nav ul#topnav .jewelryLink,
  html body header nav ul#topnav .healthLink,
  html body header nav ul#topnav .saleLink,
  html body header nav ul#topnav .homeLink,
  html body header nav ul#topnav .tvLink,
  html body header nav ul#topnav .clearanceLink {
    border-radius: 3%;
    padding: 5px 10px;
    display: inline-block;
    color: #fff;
  }
  html body header nav ul#topnav .tvLink {
    margin-top: 18px;
  }
  html body header nav ul#topnav .hairCareFeatureImage,
  html body header nav ul#topnav .accessoryFeatureImage,
  html body header nav ul#topnav .giftFeatureImage {
    top: 25px;
  }
  html body header nav ul#topnav .hairCareFeatureText,
  html body header nav ul#topnav .accessoryFeatureText,
  html body header nav ul#topnav .giftFeatureText,
  html body header nav ul#topnav .hairCareFeatureImage,
  html body header nav ul#topnav .accessoryFeatureImage,
  html body header nav ul#topnav .giftFeatureImage {
    left: 250px;
  }
  html body header nav ul#topnav .giftFeatureImage img {
    width: 500px;
    height: 100px;
  }
  html body header nav ul#topnav .hairCareFeatureText,
  html body header nav ul#topnav .accessoryFeatureText,
  html body header nav ul#topnav .giftFeatureText {
    font-size: 16px;
    color: #8A8A8A;
    font-weight: bold;
    top: 125px;
    width: 500px;
    text-align: left;
  }
  html body header nav ul#topnav .newImage2,
  html body header nav ul#topnav .newImage3,
  html body header nav ul#topnav .clearanceImage2,
  html body header nav ul#topnav .clearanceImage3 {
    top: 0px;
  }
  html body header nav ul#topnav .newImage2,
  html body header nav ul#topnav .clearanceImage2 {
    right: 268px;
  }
  html body header nav ul#topnav .newImage3,
  html body header nav ul#topnav .clearanceImage3 {
    right: 525px;
  }
}