:root {
  --color-1: #FA5B4C;
  --color-2: #079393;
  --color-3: #F9F8F4
  --color-grey: #EEEEEE;
  --color-white: #ffffff;
  --color-black: #333333;
}
/*MAIN CSS Oct 2018*/
/*main font & link styles*/
body {
  font-size: 13px;
  color: #3D3935 !important;
}

select {
  height: 30px;
  border-radius: 0px;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  width: 100% !important;
  padding: 3px 52px 3px 12px;
  /*use the background svg FILL to edit arrow color*/
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='#222' width='50px' height='50px'><polyline points='46.139,15.518 25.166,36.49 4.193,15.519'/></svg>") right no-repeat !important;
  background-position: right 10px center !important;
  background-repeat: no-repeat;
  background-size: 17px !important;
  outline: none !important;
  color: inherit;
  background-color: #fff !important;
  font-size: 12px !important;
  -webkit-appearance: menulist-button;
  border: 1px solid lightgrey;
  margin-bottom: 15px;
}

::-moz-selection {
  background-color: rgba(26, 71, 152, 0.15);
  text-shadow: none;
}

::selection {
  background-color: rgba(26, 71, 152, 0.15);
  text-shadow: none;
}

a,
a:link {
  color: #fa5a4c94;
  font-weight: 500;
  cursor: pointer;
}

a:visited {
  color: #3D3935;
}

a:hover {
  color: #3D3935;
}

a:focus {
  outline: 0;
}

a:hover,
a:active {
  outline: 0;
}

.page-login .page-content {
  padding-right: 500px;
}

.page-login .page-brand-info p {
  margin-top: 245px;
  color: #333;
  text-shadow: none;
}

/*Forgot Password link*/
a#lnkForgotPassword {
  color: #256bdb !important;
}

#LoginLinkDiv a:hover,
#LoginLinkDiv a:visited,
#LoginLinkDiv a:active {
  color: #256bdb !important;
  text-decoration: none !important;
}

/*Main background image and fallbacks */
/* this shows if you do not have a background-image set*/
.layout-full {
  background: #fff !important;
  background-image: -webkit- -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dddddd)) !important;
  background-image: -webkit- linear-gradient(#fff, #dddddd) !important;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dddddd)) !important;
  background-image: linear-gradient(#fff, #dddddd) !important;
}

/* large background-image for login page*/
.layout-full:before {
  background-image: url("../../../fs-images/login-bg.jpg");
  background-position: center !important;
  background-size: cover;
}

/*Layout styles*/
.logo-left {
  background-image: url("../../../fs-images/logo.png");
  background-size: 220px !important;
}

.page-login .page-login-main {
  border-left: 8px solid var(--color-1);
  color: #fff;
  background-color: #fa5a4c70;
}

footer {
  border-top: solid 1px #e7e9ed;
  margin-top: 20px;
}

#lblLogin, #lblPassword, #lblCountry {
  color: #fff !important;
}

/*Main login Button*/
#btnLogin,
#btnLogin:visited {
  border: none !important;
  background-color: #fa5a4c94 !important;
  color: white !important;
}

#btnLogin:hover {
  background-color: #2e59a8 !important;
  border: none !important;
}

#btnLogin:active {
  -webkit-transition-delay: 0s !important;
          transition-delay: 0s !important;
  background-color: #2e59a8 !important;
}

/*Modal Window 
  container*/
.ShoppingCartLoginExistingDealerTable {
  border-top: 8px solid #fa5a4c94 !important;
}

/*Modal Window 
Main background color*/
.ShoppingCartLoginExistingDealerTable {
  background-color: #ffffff;
}

.md-content {
  font-size: 13px;
  color: #3D3935 !important;
}

/*Modal Window 
  Submit button*/
#btnGetPassword {
  background-color: #fa5a4c94 !important;
  font-size: 16px;
  color: #ffffff;
}

#btnGetPassword:visited {
  background-color: #fa5a4c94 !important;
}

#btnGetPassword:hover {
  background-color: #2e59a8 !important;
}

#btnGetPassword:active {
  background-color: #fa5a4c94 !important;
}

/*Modal Window 
  header text*/
.LostPasswordHeader {
  color: #fa5a4c94 !important;
}

/*Modal Window 
 instruction text*/
span#lblLostPasswordInstructions.LostPasswordTinyText {
  font-size: 13px !important;
}

/*close modal window link*/
.ShoppingCartLoginExistingDealerTable a#lnkClose {
  background-color: #ffffff;
  font-size: 15px;
  color: #fa5a4c94 !important;
  font-weight: 500;
  border-top: solid 1px #53565A;
}

.page-login .page-content {
  padding-right: 600px;
}

/*Media Queries */
@media (min-width: 768px) and (max-width: 1200px) {
  .page-login .page-brand-info > p {
    display: none !important;
  }

  .logo-right {
    background-image: url("../../../fs-images/logo.png") !important;
    background-position: center !important;
    background-size: contain !important;
    height: 200px !important;
  }

  .logo-left {
    background-image: none !important;
  }
}
@media (max-width: 767px) {
  .page-login .page-brand-info > p {
    display: none !important;
  }

  .logo-left {
    background-image: none !important;
  }

  .page-login .page-login-main {
    border-top: 8px solid var(--color-1);
    border-left: none !important;
  }

  .logo-right {
    background-image: url("../../../fs-images/logo.png") !important;
    background-position: center !important;
    background-size: contain !important;
    height: 200px !important;
  }

  .layout-full::before {
    background-position: center center !important;
  }
}
@media (max-width: 480px) {
  .page-login .page-brand-info > p {
    display: none !important;
  }

  .logo-right {
    background-image: url("../../../fs-images/logo.png") !important;
    background-size: contain !important;
    height: 190px !important;
  }

  .layout-full::before {
    background-position: center center !important;
  }

  .logo-left {
    background-image: none !important;
  }
}
.page-login .page-content {
  padding-right: 0px;
}

.page-login .page-brand-info p {
  max-width: 450px;
}

/*special changes CSS below*/
.layout-full:before {
  background-position: center !important;
}

.logo-left {
  background-size: 320px !important;
}

.page-login .page-login-main .brand {
  margin-top: 120px;
}

@media (max-width: 770px) {
  .page-login .page-login-main .brand {
    margin-top: 50px;
  }
}
 /*
WHITE TEXT ON RIGHT
*/
.page-login .page-login-main {
  color: #fff;
}

#lblLogin, #lblPassword, #lblCountry {
  font-weight: 500 !important;
  color: #fff !important;
}

#txtDealerURL,
#txtLostEmailAddress,
#txtDealerID,
#txtRPDealerID,
#txtRPDealerURL,
#Password,
#cboCountry {
  border: rgba(0, 0, 0, 0.27) 0px solid !important;
  background-color: rgba(255, 255, 255, 0.33) !important;
}

.login-TextBox,
#txtDealerID,
#Password,
#cboCountry,
.login-DropDown {
  color: #000;
}

/*Forgot Password link*/
a#lnkForgotPassword {
  color: #fff !important;
}

#LoginLinkDiv a:hover,
#LoginLinkDiv a:visited,
#LoginLinkDiv a:active {
  color: #fff !important;
  text-decoration: none !important;
}

.welcome-header.font-thin,
.welcome-subheader.font-thin {
  font-weight: 300 !important;
  color: #fff;
}

/*
END WHITE TEXT ON RIGHT
*/
footer {
  border-top: solid 1px rgba(255, 255, 255, 0.27);
}

/* make text contrast in select options dropdown and inputs on 
password recovery popup on IE */
.login-TextBox,
#txtDealerID,
#Password,
#cboCountry,
.login-DropDown {
  color: #000;
}

#txtRPDealerID,
#txtRPDealerURL,
#txtLostEmailAddress {
  border: rgba(0, 0, 0, 0.47) 1px solid !important;
}

#lblLogoTag {
  margin-top: 350px;
  color: #666;
  display: block;
}

#btnLogin, #btnLogin:visited {
  border: 1px solid white !important;
  background-color: transparent !important;
}

#btnLogin:hover {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid white !important;
}

#btnLogin:active {
  background-color: rgba(255, 255, 255, 0.1) !important;
}

.md-content {
  /* background: #fff; */
  background: #ffffff80;
}

.ShoppingCartLoginExistingDealerTable {
  /* background-color: #ffffff; */
  background-color: rgba(255, 255, 255, 0.47);
}

.ShoppingCartLoginExistingDealerTable {
  /* border-top: 8px solid #008080 !important; */
  border-top: 0px solid transparent !important;
}

.ShoppingCartLoginExistingDealerTable a#lnkClose {
  /* background-color: #ffffff; */
  /* border-top: solid 1px #53565A; */
  background-color: transparent;
  border-top: solid 1px rgba(85, 85, 85, 0.45);
}

#btnGetPassword {
  /* background-color: #008080 !important; */
  /* color: #ffffff; */
  background-color: transparent !important;
  color: #666;
}

#btnGetPassword:hover {
  /* background-color: #029595 !important; */
  background-color: rgba(255, 255, 255, 0.24) !important;
}

#btnGetPassword, #btnGetPassword:visited {
  /* border: none !important; */
  /* box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); */
  border: 1px solid #333 !important;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0);
}

#btnGetPassword:hover {
  /* box-shadow: 0 9px 17px 0 rgba(0, 0, 0, 0.3); */
  /* border: none !important; */
  -webkit-box-shadow: 0 9px 17px 0 rgba(0, 0, 0, 0);
          box-shadow: 0 9px 17px 0 rgba(0, 0, 0, 0);
  border: 1px solid #333 !important;
}