﻿/*------------------------------------------------------------
  
  Slaters

 ------------------------------------------------------------*/

#header .mainLogo
{
    margin-bottom: 20px;
    margin-top: 21px;
}

#headerWrapper
{
    background: #FFF;
}

.obInfoBlocks .obInfoBlock p.linkWrap a span, .sideContentInfo .detailsWrapper .textArea p.linkItem a span
{
    background-image: url(/Content/CorporateGroup/Slaters/brand-arrow.png);
}

.obInfoBlocks .obInfoBlock p.linkWrap a span, .textArea p a, .textArea li a, .obInfoBlocks .obInfoBlock p.linkWrap a span
{
    color: #0081A0;
}

.outfitProcess div.stepAction a, .button, .buttonPanel a, .button, .buttonPanel input, .outfitProcess div.stepAction a:visited, .buttonPanel a:visited, .button:visited, .buttonPanel input:visited, .obOfferArea .obOfferAction .buttonPanel a, .obOfferArea .obOfferAction .buttonPanel a:visited
{
    background-color: #0081A0;
}

    .outfitProcess div.stepAction a:hover, .buttonPanel a:hover, .button:hover, .buttonPanel input:hover, .outfitProcess div.stepAction a:active, .buttonPanel a:active, .button:active, .buttonPanel input:active, .obOfferArea .obOfferAction .buttonPanel a:hover, .obOfferArea .obOfferAction .buttonPanel a:active
    {
        background-color: #198da9;
    }

.sideImagePanel a:hover p, .featureHireType a:hover p
{
    background-color: #0081A0;
    background-color: rgba(0, 129, 160, 0.5);
}

.utilitiyLinks ul li a, .utilitiyLinks ul li.greyedout
{
    color: #000;
}



/*---	CSS Badge overrides	*/
.badge-middle-row {
    background: #0081A0;
}

    .left-triangle {
        border-right: 5px solid #004657; 
        border-top: 5px solid #004657;
    }

	.right-triangle {
        border-left: 5px solid #004657; 
        border-top: 5px solid #004657;
    }

 .bannerText {
    text-shadow: none;
    color: #3F3E3E;
}

.bannerImage a.greenButton.slaters {
    top: 70%;
}
.bannerImage .bannerText.tryon {
    font-size: 48px;
}

@media (max-width: 600px) {
  .hireTypeImg {
      display: none !important;
   }
  .oneBannerDisplayed {
      display: inline-block;
      background: url("banner-top-mobile.jpg") no-repeat 50% 0%;
      width: 100%;
      height: 274px;
  }

     .bannerText {
        color: #FFFFFF;
    }

    .bannerText.formalwear.slaters, .bannerText.tryon.slaters, .bannerImage a.greenButton.slaters, .tryOnButton.slaters {
        background: #0081A0 !important;
    }

    .bannerText, .bannerText.tryon {
        position: relative !important;
        left: 0 !important;
        width: 100% !important;
        font-size: 1.5rem !important;
        font-size: 15px !important;
        display: block !important;
        text-align: center !important;
        padding: 1.0rem 0.5rem !important;
        padding: 10px 0.5px !important;
        top: 0 !important;

    }
    .bannerText .first-line {
        display: inline !important;
    }
    .top-line, .second-line, .last-line {
        display: inline !important;
        width: auto !important;
    }
}

