@font-face {font-family: 'Play-Regular';src: url('/CSS/Play-Regular.ttf')  format('truetype');font-weight: normal;font-style: normal;font-display: swap;}
@font-face {font-family: 'Play-Bold';src: url('/CSS/Play-Bold.ttf')  format('truetype');font-weight: normal;font-style: normal;font-display: swap;}
@font-face {font-family: 'OpenSans';src: url('/CSS/OpenSans.ttf')  format('truetype');font-weight: normal;font-style: normal;font-display: swap;}

body{padding:0px;margin:0px; width:100%;}

/* Page Not Found */
.PageNotFound{font-family:OpenSans; }
.PageNotFound .Image{width:400px; margin-left:auto;margin-right:auto; margin-top:40px; padding-bottom:20px;}
.PageNotFound .Image img{width:400px;}
.PageNotFound .Title{color:#333333; font-size:34px; width:600px; margin-left:auto;margin-right:auto;  text-align:center;}
.PageNotFound .Description{color:#333333; font-size:22px; width:600px; margin-left:auto;margin-right:auto; text-align:center;}
.PageNotFound .Description a{color:red;}
.PageNotFound .Description a:visited{color:#4182C3;}


.tooltiptext {visibility: hidden; font-family: OpenSans; font-size:13px;line-height:14px;width:auto;padding:8px;background-color: black;color: #fff;text-align:center; border-radius: 5px; position: absolute; z-index: 1000;}
.tooltiptext a {text-decoration: underline !important;color:#FFBE00 !important;}
.tooltiptext a:visited {text-decoration: underline !important;color:#FFBE00 !important;}

.AlignToCenterContainer{text-align: center;}

.CallToActionButton {vertical-align: middle; font-family:OpenSans; font-weight:bold; font-size:18px; color:#333333; line-height:40px;border-radius:3px;border:1px #333333 solid; display:inline-block; cursor:pointer; padding:4px 10px 4px 10px;  text-decoration:none;}
.CallToActionButton img{width:40px;vertical-align: middle;}
.CallToActionButton:hover {background-color:#FFA600;}
.CallToActionButton:active {position:relative;top:1px;}

.MainImageSliderItem{color: #333333; width:1000px; height:480px;}
.MainImageSliderItem img{width:100%;filter: blur(0);}
.MainImageSliderItem .SliderTitle{float:left; font-family:Play-Bold; font-weight: bold; font-size:52px; line-height:56px; padding-bottom: 12px; top: 8px;left: 16px; width:100%;}
.MainImageSliderItem .SliderDescription{float: left; font-family:OpenSans; font-weight: bold; font-size:26px;top: 8px;left: 10px;width:100%;}
.MainImageSliderItem .SliderDescription  li {
    margin: 0;
    padding: 4px 0px 6px 40px;
    list-style: none;
    background-image: url('/Images/check-48x48.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 26px;
}

.MainImageSliderItem .CallToAction {width:100%;}
.MainImageSliderItem .CallToAction a{font-family:Play-Bold; font-size:22px; margin-left: 40px; margin-top:15px;  background-color:#FFBE00;vertical-align: middle; font-weight:bold;  color:#333333; line-height:40px;border-radius:3px;border:1px #333333 solid; display:inline-block ; cursor:pointer; padding:4px 10px 4px 10px; text-decoration:none;}
.MainImageSliderItem .CallToAction img{width:40px;vertical-align: middle;}
.MainImageSliderItem .CallToAction a:hover {background-color:#FFA600;}
.MainImageSliderItem .CallToAction a:active {position:relative;top:1px;}

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*GENERIC POPUP*/
.GenericPopUp {font-family:OpenSans;background-color: rgba(0, 0, 0, 0.5);position: fixed;top: 0;left: 0;width: 100%;height: 100%;}
.GenericPopUp .Content {background-color: #fff;border:1px #333333 solid;width: 500px;height: auto;margin: 15% auto;}
.GenericPopUp .Content h2 {padding:8px; margin:0px;background-color: #F8F9F9;border-bottom:1px silver solid; font-size:16px;}
.GenericPopUp .Content .Message {padding:8px; width:90%; display:inline-block;margin-top:5px;}
.GenericPopUp .Content .Options {background-color: #F8F9F9;height:50px; padding-left:10px;display:block; padding-top: 10px; border-top: 1px silver solid;}
.GenericPopUp .Content .Options .OptionButton {font-family:OpenSans; font-size:14px; color:#333333; border-radius:3px; border:1px solid #942911; cursor:pointer; padding:7px 24px; text-decoration:none; background-color:#FFBE00;}
.GenericPopUp .Content .Options .OptionButton:hover {background-color:#FFA600;}
.GenericPopUp .Content .Options .OptionButton:active {top:1px;}
/*----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.SmallNotice{font-family: OpenSans;font-size:13px;}

#Header {width:100%;background-color:white; display: inline-block;}
#Header .TopBarv2 {width:100%; height:30px; line-height: 30px; background-color: white; display: inline-block;}
#Header .TopBarv2 .TopBarContainer {width:100%;max-width:1000px; margin-left:auto; margin-right:auto; font-family:OpenSans; color:black;}
#Header .TopBarv2 .TopBarContainer .WelcomeMessage {width:80%;height:30px;float:left;font-size:13px;margin:0px;}
#Header .TopBarv2 .TopBarContainer .WelcomeMessage a{text-decoration: none; color:#333333;}
#Header .TopBarv2 .TopBarContainer .WelcomeMessage a:hover{text-decoration: underline; color:#333333;}
#Header .TopBarv2 .TopBarContainer .LanguageSelection {max-width:110px;width:20%;height:30px;float:right;padding-left:5px; font-size:13px;}
#Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageIcon {width:25px;  height:30px; float:right; }
#Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageIcon img{width:22px; height:22px; vertical-align: middle; }
#Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageTitle{height:30px; line-height: 30px; float:right; }
#Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageTitle a{color:#333333;text-decoration:none;}
#Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageTitle a:visited{color:#333333;text-decoration:none;}

#Header .LogoBar {width:100%;height:100px;}
#Header .LogoBar .LogoBarContainer {height:100px;width:100%;max-width:1000px; margin-left: auto; margin-right: auto; font-family:OpenSans; font-size:14px; color:black;}
#Header .LogoBar .LogoBarContainer .LogoImage {float:left; height:90px; line-height: 90px; vertical-align: middle; }
#Header .LogoBar .LogoBarContainer .LogoImage img {width:250px; vertical-align: middle; }

#Header .LogoBar .LogoBarContainer .RightPart {float:right; height:90px; margin-top:20px;}
#Header .LogoBar .LogoBarContainer .RightPart .Item {height:90px;float:right;margin-left:40px; font-family:Play-Regular;}
#Header .LogoBar .LogoBarContainer .RightPart .Item a,a:visited{text-decoration:none;color:#333333;}
#Header .LogoBar .LogoBarContainer .RightPart .Item a:hover{text-decoration: underline;}
#Header .LogoBar .LogoBarContainer .RightPart .Item .Icon {height:40px; text-align: center; position:relative;}
#Header .LogoBar .LogoBarContainer .RightPart .Item .Icon .BasketCountLabel{color:white;position:absolute;top:-8px;right:1px;padding:5px; width:18px; height:18px;border-radius:50%;text-align:center;vertical-align:middle;background-color:#FFBE00; font-size:12px; font-family:OpenSans; }
#Header .LogoBar .LogoBarContainer .RightPart .Item img {width:40px; }
#Header .LogoBar .LogoBarContainer .RightPart .Item .Title {height:20px; text-align: center; margin-top:2px;}

#Header .MainMenu {background-color: #ECECEC; height:80px; width:100%;}
#Header .MainMenu .MainMenuContainer {width:100%;max-width:1000px;height:80px;line-height:80px; margin-left:auto;margin-right:auto;}
#Header .MainMenu .MainMenuContainer .MenuItem{float:left; height:80px; line-height:80px; vertical-align: middle; text-align: center; font-family: Play-Bold; font-weight: bold; font-size: 19px; margin-left:10px; margin-right:10px; }
#Header .MainMenu .MainMenuContainer .MenuItem:first-child{margin-left:0px;}
#Header .MainMenu .MainMenuContainer .MenuItem a,a:visited{text-decoration: none; color:black}
#Header .MainMenu .MainMenuContainer .MenuItem a:hover{color:#FFBE00;}
#Header .MainMenu .MainMenuContainer .Selected {text-decoration: underline;text-decoration-thickness: 4px;text-underline-offset: 8px;text-decoration-color: #FFBE00;}

#Header .MainMenu .MainMenuContainer .DropDown {-webkit-user-select: none; user-select: none;float: left;overflow: hidden;height:100%; vertical-align: middle;}
#Header .MainMenu .MainMenuContainer .DropDownTitle {cursor:pointer;height:100%; line-height: 80px; vertical-align: middle; font-family: Play-Bold; font-weight: bold; font-size: 19px;margin-left:10px; margin-right:10px;}
#Header .MainMenu .MainMenuContainer .DropDownTitle a{text-decoration: none; color:#333333;}
#Header .MainMenu .MainMenuContainer .DropDownTitle img{width:18px; vertical-align: middle;}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu{display:block; opacity: 0; visibility: hidden; width:100%; left:0px;  position: absolute; background-color: #ECECEC;}
#Header .MainMenu .MainMenuContainer .DropDown:hover .DropDownTitle {color:#FFBE00;}
/*#Header .MainMenu .MainMenuContainer .DropDown:hover .MegaMenu{visibility: visible; z-index: 1000; opacity: 1; transition: opacity 0.6s, visibility 0.6s;}*/

#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent{border-radius: 10px; font-family: Open Sans; font-size:14px; line-height: 16px; width:98%; max-width: 1000px; border:0px #333333 solid; overflow:auto; margin-left:auto; margin-right:auto; background-color:white; margin-bottom: 24px; }
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section{float:left;display: inline-block; overflow: hidden; padding-top:10px; padding-left:25px; padding-right:25px; padding-bottom:25px; width:calc(26% - 50px);}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section h2{font-size:19px; padding:0px;font-family: Play-Regular;}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section .Image img{width:100%; padding-left: 4px;}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section .SectionItems{padding-left:2px;}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section .SectionItems .Item{font-family: Play-Regular; font-size: 16px; line-height: 23px; width:100%;}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section .SectionItems .Item:before {content:"• ";}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section .SectionItems .Item a{color:#333333; text-decoration: none;}
#Header .MainMenu .MainMenuContainer .DropDown .MegaMenu .MegaMenuContent .Section .SectionItems .Item a:hover{color:orange;}

/* On screens that are 599px or less*/
@media screen and (max-width: 599px) {
    #Header .TopBarv2 .TopBarContainer .WelcomeMessage{float:none; font-size:10px; width:90%; line-height: 30px;vertical-align: middle; margin-left: 8px; }
    #Header .TopBarv2 .TopBarContainer .LanguageSelection{float:none;font-size:10px; width:90%; max-width: 10000px; padding:0px; margin:0px; margin-left: 8px;display: inline-block;}
    #Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageIcon {width:20px; height:20px; float:left; }
    #Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageIcon img{width:16px; height:16px; vertical-align: middle;}
    #Header .TopBarv2 .TopBarContainer .LanguageSelection .LanguageTitle{font-size:10px; text-align: left; float:left;}
    
    #Header .LogoBar {zoom: 60%; font-size:16px; width:95%; margin-left:8px;}
    #Header .LogoBar .LogoBarContainer .RightPart{margin:0px;}
    #Header .LogoBar .Item{padding:0px; margin:0px;}
    #Header .MainMenu {zoom: 60%; font-size:17px;}
    #Header .MainMenu .MainMenuContainer{width: 90%}
}
/* On screens that are 600 - 959px*/
@media screen and (min-width: 600px)  {
    #Header .LogoBar {width:95%;height:100px; margin-left: auto;margin-right: auto; padding-top:5px;}
    #Header .TopBarv2 {width:95%; margin-left:auto; margin-right:auto; display: block; margin-bottom: 15px;}
    #Header .MainMenu .MainMenuContainer{width: 90%}
    #Header .LogoBar .LogoBarContainer .RightPart{margin:0px;}
    #Header .LogoBar .LogoBarContainer .LogoImage img{padding-left:15px;}
}
/* On screens >=960px*/
@media screen and (min-width: 960px)  {
    #Header .LogoBar {width:100%;height:100px;padding-top:10px;padding-bottom:5px;}
    #Header .TopBarv2 {width:100%;margin-bottom: 0px;}
    #Header .LogoBar .LogoBarContainer .RightPart{margin-top:20px;}
    #Header .LogoBar .LogoBarContainer .LogoImage img{padding-left:0px;}
}

/* On screens that are 599px or less*/
@media screen and (max-width: 599px) {
    #mainContainer{width:95%; margin-left:auto;margin-right:auto;margin-top:20px; }
    #mainContainer h1{font-family: Play-Bold; font-size:20px;}
    #mainContainer h2{font-family: Play-Bold;}
}
/* On screens that are 600 - 959px*/
@media screen and (min-width: 600px)  {
    #mainContainer{width:95%; margin-left:auto;margin-right:auto;margin-top:20px; }
    #mainContainer h1{font-family: Play-Bold;}
    #mainContainer h2{font-family: Play-Bold;}
}

/* On screens >=960px*/
@media screen and (min-width: 960px)  {
    #mainContainer{width:100%; max-width:1000px; margin-left:auto;margin-right:auto;margin-top:20px; }
    #mainContainer h1{font-family: Play-Bold;}
    #mainContainer h2{font-family: Play-Bold;}
}

.RandomProductsShow {width:100%;max-width:1000px;margin-left:auto;margin-right:auto;}
.RandomProductsShow .ProductTile{}

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*TEXT PAGE*/
.TextPageContainer{font-family:OpenSans; font-size:16px;}
.TextPageContainer table{}
.TextPageContainer table th {padding:10px;text-align: left;background-color: #FFBE00;color: #333333;}
.TextPageContainer table tr{border-bottom:1px silver solid;} 
.TextPageContainer table td {padding:10px;text-align: left;color: #333333;border-bottom:1px silver solid;}

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#Footer {width:100%;background:#333333;height:200px;color:white;padding-bottom:150px; font-family: OpenSans;}
#Footer .Connect {}
#Footer .Connect img{width:32px;border:0px;padding-left:12px}
#FooterPlaceHolder{width:95%; max-width:1000px; margin-left:auto;margin-right:auto;padding-top:4px;}
#FooterPlaceHolder .Top{width:100%; float:left; padding-top:16px; border-bottom:1px #E2E2E2 solid; padding-bottom:20px; }
#FooterPlaceHolder .Top .Item{display:block;float:left; width:333px;}
#FooterPlaceHolder .Top .Item .Image{float:left;width:55px;}
#FooterPlaceHolder .Top .Item .Image img{width:48px; margin-top:8px;}
#FooterPlaceHolder .Top .Item .Header{font-size:18px; padding-bottom:5px; padding-top:8px; font-weight:bold; letter-spacing:1px; text-transform:uppercase;}
#FooterPlaceHolder .Top .Item .Text{font-size:16px;}
#FooterPlaceHolder .Middle {width:100%; float:left; padding-top:16px; border-bottom:1px #E2E2E2 solid;  padding-bottom:20px; }
#FooterPlaceHolder .Middle .Item{display:block;float:left; width:320px;}
#FooterPlaceHolder .Middle .Item .Text{font-size:16px; padding-left:5px; margin-top:5px;}
#FooterPlaceHolder .Middle .Item .Text a{color:#DFDFDF;text-decoration:none;}
#FooterPlaceHolder .Middle .Item .Text a:hover{color:white;}
#FooterPlaceHolder .Middle .Item .Header{font-size:18px; padding-bottom:5px; padding-top:8px; font-weight:bold; letter-spacing:1px; text-transform:uppercase;}
#FooterPlaceHolder .Middle .Item .Icons{margin-left:10px;margin-top:10px;}
#FooterPlaceHolder .Middle .Item .Icons .Icon{width:48px; float:left;}
#FooterPlaceHolder .Middle .Item .Icons .Icon img{width:42px;}
#FooterPlaceHolder .Copyright{width:100%;font-size:14px;height:30px;line-height:30px; margin-top:10px;float:left;}
#FooterPlaceHolder .Copyright a{color:white;}
#FooterPlaceHolder .Copyright a:visited{color:white;}

@media screen and (max-width: 960px) {
    #Footer {height:auto;padding-bottom:0px; overflow:hidden;}
    #FooterPlaceHolder{width:95%;}
    #FooterPlaceHolder .Top{width:100%; margin-left: auto; margin-right: auto; float:none;display:inline-block;}
    #FooterPlaceHolder .Middle{width:100%;margin-left: auto; margin-right: auto; float:none;display:inline-block}
}

/*---------------------------------------------------------------------------------------------------------------------------*/
/* TopBar DropDown Menu */
#UserAccountDropDown {margin-top:0px;padding-top:0px;list-style:none;float:left;z-index:100;height:40px;}
#UserAccountDropDown li {float:left;margin-left:25px;position:relative;height:40px;}
#UserAccountDropDown li .DropDown {height: 40px;display:block;color:black;text-decoration:none;background-image:url('/Images/DropDownMenu/down-12x12.png');background-repeat:no-repeat;background-position:right;padding-right:16px;}
#UserAccountDropDown li ul {padding-top:8px;width:inherit; background-color:#333333; }
#UserAccountDropDown li ul li {float:left;left:-52px; border-bottom:1px #FFBE00 dashed;}
#UserAccountDropDown li ul li:last-child{border-bottom:none;}
#UserAccountDropDown li ul li a {margin-left:0px;}
#UserAccountDropDown li ul li .bullet {background-image:url('/Images/right-16x16.png');background-repeat:no-repeat;background-position:left;padding-left:18px;padding-bottom:2px; text-align:left;}

#UserAccountDropDown ul a {display:block;color:black;text-decoration:none; vertical-align: middle;}
#UserAccountDropDown ul a:hover {text-decoration:none;}
#UserAccountDropDown ul {background:#E6E6E8;list-style:none;position:absolute;left:-9999px; }
#UserAccountDropDown ul li {padding-left:0px;width:100%;}
#UserAccountDropDown ul a {white-space:nowrap; color:white;}
#UserAccountDropDown li:hover ul {left:0; }
#UserAccountDropDown li:hover a {text-decoration:none;}
#UserAccountDropDown li:hover ul a {text-decoration:none;}
#UserAccountDropDown li:hover ul li a:hover {text-decoration:underline;}

.UserAccountDropdown {position: relative; display: inline-block;}
.UserAccountDropdown .UserAccountDropdown-Content {display: block; visibility: hidden; opacity: 0; position:absolute; background-color: #f9f9f9; min-width:180px; text-align: left; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);padding: 10px;z-index: 100; -webkit-transition: opacity 0.3s ease-in; -moz-transition: opacity 0.3s ease-in; -o-transition: opacity 0.3s ease-in; transition: opacity 0.3s ease-in;}
.UserAccountDropdown:hover .UserAccountDropdown-Content {display: block; visibility: visible; opacity: 1;}

/*---------------------------------------------------------------------------------------------------------------------------*/

.ActionButton {font-family:OpenSans; font-size:14px;  color:#333333; border-radius:3px; border:1px solid #942911; cursor:pointer; padding:7px 24px; text-decoration:none; background-color:#FFBE00;}
.ActionButton:hover {background-color:#FFA600;}
.ActionButton:active {top:1px;}