/*** compiled css - make changes scss file and recompile for updates */
/*** full bg layout styles */
.background-image {
  display: none !important; }

img.custom-branding {
  position: relative;
  top: 0px; }

/*** custom backgrounds*/
body {
  background: url("/media/prod/assets/c63720c2-f7dd-11e8-a903-22000b4c83e3.jpg") no-repeat center;
  background-size: cover; }

.container-fluid.spot .fade-out-graphic {
  background: transparent; }

.container-fluid.spot .signin {
  background: transparent !important; }

.container-fluid.spot-email {
  background: url("") no-repeat center;
  background-size: cover; }

.multiple-card-layout {
  background: url("/media/prod/assets/c63720c2-f7dd-11e8-a903-22000b4c83e3.jpg") no-repeat center;
  background-size: cover; }

/*** body: top level container */
body {
  background-color: #ffffff !important; }

/*** global text style 
 * will effect all text
 * in this location  */

p, h1, h2, h3, h4, button, a {
  color: #353535;
    font: 100% "Open Sans", "Lucida Grande", Helvetica, Arial, sans-serif; }

#email_suggestion {
  color: #353535; }

a.suggestion {
  color: #353535; }

/*** global link hover style */
a:hover {
  color: #293551; }

/*** headline text
 * (Connect with SocialSign.in  */
h3 {
  font-size: 24px !important;
  font-weight: 600; }

h4 { 
  font-size: 16px !important;
  font-weight: 600 !important;
  padding: 0px 10px 0px 10px; }
  
/*** button styles */
/*** cta green button */
button.btn.btn-green, a.btn.btn-green {
  border: 2px solid #293551;
  color: #ffffff;
  background: #293551; }

button.btn-green:hover, a.btn-green:hover,
button.btn-green:active, a.btn-green:active,
button.btn-green:focus, a.btn-green:focus {
  border-color: #293551 !important;
  color: #ffffff !important;
  background: #293551 !important;
  box-shadow: none; }

/*** btn-acid */
button.btn-acid, a.btn-acid {
  font: 100% "Open Sans", "Lucida Grande", Helvetica, Arial, sans-serif;
  padding: 12px !important;
  font-size: 16px !important;
  height: 50px !important;
  font-weight: 600 !important; }  

button.btn-fb, a.btn-fb  {
  font: 100% "Open Sans", "Lucida Grande", Helvetica, Arial, sans-serif;
  padding: 10px !important;
  font-size: 16px !important;
  height: 50px !important;
  line-height: 30px !important;
  font-weight: 600 !important;
  margin-top: 10px !important; }   

.button.btn-fb img, a.btn-fb img {
  width: 30px !important;
  height: 30px !important;
  margin: 0px -30px 0px 0px !important; }

/*** (email connect button  */
button.btn-acid, a.btn-acid {
  border: 2px solid #293551 !important;
  color: #ffffff !important;
  background: #293551 !important;
  box-shadow: none !important; }

button.btn-acid:hover, a.btn-acid:hover,
button.btn-acid:active, a.btn-acid:active,
button.btn-acid:focus, a.btn-acid:focus {
  border-color: #293551 !important;
  color: #ffffff !important;
  background: #293551 !important;
  box-shadow: none !important; }

/*** fb buttons */
.container-fluid.spot-email .btn-fb:active,
.container-fluid.spot .signin .signinbody .btn.fb:active,
.container-fluid.spot-email .btn-fb:focus,
.container-fluid.spot .signin .signinbody .btn.fb:focus {
  box-shadow: inset 0px 0px 0px 2px #5887d3; }

/*** skip and access the web link */
button.access-the-web, a.access-the-web {
  color: #fff; }

/*** wave gradient background
 * small layout only  */
.container-fluid.spot .fade-out-graphic {
  background: transparent; }

/*** sign in body text */
.container-fluid.spot .signin {
  background: transparent !important; }

.signinbody h3, .signinbody h4 {
  color: #353535;
  font-weight: 400;
  font-size: 24px;  }

.emailsignup h3, .emailsignup p {
  color: #353535; }

/*** terms style */
.container-fluid.spot .signin .signinbody .terms {
  color: #353535;
  opacity: 1 !important; }

.container-fluid.spot-email p {
  color: #353535;
  opacity: 1 !important; }

/*** terms link style */
.container-fluid.spot .signin .signinbody .terms a, .container-fluid.spot-email .footerp a {
  color: #353535 !important; }

.container-fluid.spot .signin .signinbody .terms a:hover, .container-fluid.spot-email .footerp a:hover {
  color: #293551 !important; }

/*** branding image (profile image */
/*img.custom-branding {
  display: none; }*/

/*** help and business link styles */
.container-fluid.spot .signin .footer .footerp a {
  color: #353535; }

.container-fluid.spot .signin .footer .footerp a:hover {
  color: #293551; }

/*** help and business container styles */
.container-fluid.spot .signin .footer .footerp {
  opacity: 1; }

/*** Sign up and sign in page */
/*** background */
.container-fluid.spot-email {
  background-color: #ffffff !important; }

.container-fluid.spot-email a.back-button {
  color: #353535 !important;  }

.container-fluid.spot-email form input {
  color: #353535; }

.container-fluid.spot-email form input:focus {
  border-color: #293551;
  color: #353535; }

input, textarea {
  border: 1px solid #353535 !important;
  color: #353535 !important;
  font-weight: bold; }

input::placeholder, textarea::placeholder {
  color: #9e9e9e !important; }

input:hover, textarea:hover,
input:active, textarea:active,
input:focus, textarea:focus {
  border: 1px solid #353535 !important; }

.container-fluid.spot .signin .signinbody #email_signup input {
  background: #ffffff; }

.container-fluid.spot-email .darkbg {
  background: transparent; }

.container-fluid.spot-email form button.btn-dark {
  border: 2px solid #293551;
  color: #ffffff !important;
  background: #293551; }

.container-fluid.spot-email form button.btn-dark:hover,
.container-fluid.spot-email form button.btn-dark:active,
.container-fluid.spot-email form button.btn-dark:focus {
  border-color: #293551;
  color: #ffffff !important;
  background: #293551;
  box-shadow: none; }

.container-fluid.spot-email .or p {
  color: #353535; }

.container-fluid.spot-email .or .col-xs-5 {
  border-bottom: 1px solid #353535;
  opacity: 1; }

.need-help a {
  color: #353535; }

/*** mobile tabs */
.container-fluid.spot-email-header a#email-sign-up-button.active {
  color: #fff;
  background: #222222;
  box-shadow: none; }

.container-fluid.spot-email-header {
  background: #000; }

.container-fluid.spot-email-header a {
  color: #FFF;
  background: #4d4d4d; }

.container-fluid.spot-email-header a.active {
  background: #fff;
  color: #ff2344;
  box-shadow: none; }

.container-fluid.spot-email-header .col-xs-2 {
  background: #000; }

.parsley-error-list li {
  text-align: left;
  color: #c00030; }

/** * terms text */
.container-fluid.spot-email .footerp {
  opacity: 1; }

.container-fluid.spot-email .footer .footerp .terms {
  opacity: 1; }

.container-fluid.spot-email .footerp a {
  color: #fff; }

.container-fluid.spot-email .footerp a:hover {
  color: #faff00; }

.container-fluid.spot-email .footerp a:active,
.container-fluid.spot-email .footerp a:focus {
  color: #faff00;
  text-decoration: none; }

/*** Cards */
/*** main container
 * includes the wave background */
.multiple-card-layout {
  background-color: #ffffff !important; }

/*** green card button
 * NOTE: !importants are added because if an stylesheet placement
 *       they should not be normally used and will not be required
 *       after the next push (05/21/15) */
.multiple-card-layout h4.message {
  color: #353535 !important; }

.ssi-card {
  border: 1px solid #293551 !important;
  -webkit-box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.2);
  background: #ffffff !important; }

.ssi-card .ssi-card-content-container a {
  background: transparent !important;
  border: 1px solid #ffffff !important;
  color: #293551 !important;
  font-weight: bold;
  text-decoration: underline; }

.ssi-card .ssi-card-content-container a:hover,
.ssi-card .ssi-card-content-container a:active,
.ssi-card .ssi-card-content-container a:focus {
  background: #293551 !important;
  border: 1px solid #293551 !important;
  color: #ffffff !important;
  text-decoration: none; }

.ssi-card .ssi-card-content-container h2 {
  color: #353535 !important;
  text-align: center;
  text-transform: uppercase; }

.ssi-card .ssi-card-content-container p {
  color: #293551 !important;
  text-align: center; }

/*** survey */
.ssi-card .ssi-card-content-container .card-form {
  text-align: center; }

.ssi-card.survey.without-image {
  height: 270px; }

.ssi-card.survey.without-image .ssi-card-content-container {
  justify-content: space-between;
  display: flex;
  flex-direction: column;
  height: 100%; }

.ssi-card.survey.without-image h2 {
  font-size: 37px !important;
  line-height: 1.15em;
  font-weight: normal;
  flex-grow: 1;
  height: auto;
  text-align: center;
  padding: 0px 20px 0px; }

.ssi-card.survey.without-image p {
  font-size: 14px !important;
  line-height: 14px;
  margin: 0 0 10px 10px;
  height: auto !important; }

.survey-button {
  background: #40748e !important;
  border: none !important;
  color: #ffffff !important;
  border-radius: 2px !important;
  font-size: 12px !important;
  transition: all 0.4s; }

/*** survey - 4 buttons */
.survey-button {
  width: calc(50% - 5px) !important;
  display: inline-block !important;
  height: 44px !important;  }

.survey-button:hover,
.survey-button:active,
.survey-button:focus {
  background: #40748e !important; }

.ssi-card .ssi-card-content-container a,
.ssi-card .ssi-card-content-container button {
  border-radius: 0px !important;
  line-height: 15px !important; }

.ssi-card.survey.without-image {
    height: 270px;}

.ssi-card.survey.without-image .ssi-card-content-container .card-form {
    bottom: 14px;}

.ssi-card.survey.without-image .ssi-card-content-container {
    justify-content: space-between;
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #293551;}

.ssi-card.survey.without-image h2 {
    font-size: 28px !important;
    line-height: 37px;
    font-weight: bold;
    flex-grow: 1;
    height: auto;
    color: #ffffff !important;
    font-weight: 500 !important;
    margin: 0px 20px 6px;}

.ssi-card.survey.without-image p {
    font-size: 12px !important;
    line-height: 14px;
    margin: 0 0 10px;
    height: auto !important;
    visibility: hidden;}

.survey-button {
    background: #fff !important;
    border: none !important;
    color: #293551 !important;
    width: calc(44%) !important;
    display: inline-block !important;
    border-radius: 2px !important;
    font-weight: 700 !important;
    margin: 4px 2px !important;}

/*** checkbox */
#custom_checkbox_container label {
  color: #000; }

/*** loading screen */
.loading-screen {
  background: #FFF; }

.loading-screen .loading-icon {
  filter: invert(100%);
  -webkit-filter: invert(100%); }

/*** skip and access the web button */
button.access-the-web, a.access-the-web {
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff; }

button.access-the-web:hover,
a.access-the-web:hover,
button.access-the-web:active,
button.access-the-web:focus,
a.access-the-web:active,
a.access-the-web:focus {
  border-color: rgba(255, 255, 255, 0.5);
  color: #fff;
  background: rgba(0, 0, 0, 0.6); }

/*** footer bar */
.footer {
  background: #293551;
  }

.footer p, .footerp p {
  color: #ffffff; }

.footer .footerp a {
  color: #ffffff; }

.footer .footerp a:hover {
  color: #293551; }

.footer .footerp a:active, .footer .footerp a:focus {
  color: #293551; }

.footer .footerp a .icon-circle-question {
  color: #ffffff; }

.footer .footerp a .icon-circle-question:hover,
.footer .footerp a .icon-circle-question:active,
.footer .footerp a .icon-circle-question:focus {
  color: #ffffff; }

/*** on off switch */
.onoffswitch-label p {
  line-height: 19px; }

.onoffswitch-switch-on {
  border: 2px solid rgba(51, 51, 51, 0);
  color: #ffffff; }

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch-on {
  border-color: #ffffff;
  color: #ffffff; }

.onoffswitch-switch-off {
  border-color: #ffffff;
  color: #ffffff; }

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch-off {
  border: 2px solid rgba(51, 51, 51, 0);
  color: #ffffff; }

.ssi-card .card-overlay {
  background-color: #00385f; }

/*** desktop / tablet layout only */
@media (min-width: 769px) {
.background-image {
  display: none; }

.container-fluid.spot .background-image {
  width: 100%;
  background-size: cover; }

.container-fluid.spot .signin {
  height: 50%;   }

img.custom-branding {
  top: 60px; }

 .container-fluid.spot .top-branding .brand .branding {
  margin-left: 0px;
  margin-top: 0px;
  bottom: 0%;
  top: auto !important; }

.container-fluid.spot .top-branding {
  height: 50%;
  position: relative;
  width: 100%;
  float: none; }

.col-sm-6 {
  width: 100%; }

.container-fluid.spot .signin .signinbody {
  margin-top: -80px;
  top: 0%; } 

.container-fluid.spot-email .emailsignup {
  margin-top: -40px;
  top: 0%; }

.container-fluid.spot .signin .signinbody .content-container {
  padding-bottom: 50px !important; }

.main-custom-container {
  overflow: auto; }}

/*** QUICK LOGIN ***/

:root {
--shapes-color: #293551;
--header-text-color: #293551;
--paragraph-text-color: #293551;
--button-color: #002D72;
--button-text-color: #FFF;
--link-text-color: #293551;
--skip-text-color: #293551; }
  
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container input {
border: 1px solid var(--shapes-color) !important;
font-weight: bold; }
  
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container label {
color: var(--header-text-color);
font-size: 17px;
font-weight: 500; }
      
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container label span {
 border: 2px solid var(--shapes-color); }
  
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container p small {
  color: var(--paragraph-text-color); }
  
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container p small a {
color: var( --link-text-color); 
text-decoration: underline; }

.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container a.btn.btn-primary,    
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container button.btn.btn-primary {
color: var(--button-text-color);
background:  var(--button-color); }
   
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container .private_address_quick_step #skip_quick_login_button {
color: var(--skip-text-color);
font-weight: normal;
opacity: .8;
font-size: 12px; }
 
.container-fluid.spot .signin .signinbody #email_signup
.private_address_flow_container .private_address_quick_step .steps_connecting_bar {
background: var(--shapes-color); }

/*** Connect Button - Display on Static ***/
button.access-the-web, a.access-the-web {
  display: inline-block !important;
  background-color: #293551;
  border: 1px solid #3a3a3a; }

/*** END ***/