HTML, bODY { background: #454849 !important; font: 9pt Roboto, Helvetica, Arial, sans-serif; color: #333;}
#hdr {background: #1574bb; height: 30px;padding: 10px; }
#logo, #logo_yahoo { text-indent: -9999px; height: 100%; }
#logo { background: transparent url('/en-us/landing/images/logo/heart/400x117.png') no-repeat center center; background-size: contain; }
#logo_yahoo { background: transparent url('/en-us/landing/images/logo/yahoo/449x46.png') no-repeat center center; background-size: 195px; }
.icon{ font-family: "MatchIconFont-Regular"; display: inline-block;zoom: 1;*display: inline;-webkit-text-stroke: 0.3px;font-weight: 100;
       color: #fff;font-size: 20px; text-align: center; width: 100%; padding: 5px 0 0;}

#spotlight { width: 100%; margin: 0 auto;text-align: center;}
#spotlight span { display: inline-block; width: 12.5%; margin: -3px 0 0 0; padding: 0;}
#spotlight span img { width: 100%;height: 100%;}

.errorMessageSummary { display: none; color: #c00; font-weight: normal; padding: 5px 0; }
.errorMessageSummary ul { list-style: none; }

.form { position: absolute; margin: 0 auto; z-index: 5;width: 100%;top: 100px;}
.form .registerView, .form .loginView,.no-cookies {width: 80%; z-index: 2; position: relative; padding: 10px 20px; background: #fff;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0 0 5px 5px rgba(0,0,0,0.5); -moz-box-shadow: 0 0 5px 5px rgba(0,0,0,0.5); box-shadow: 0 0 5px 5px rgba(0,0,0,0.5); max-width: 430px;margin: 0 auto;}
    fieldset, .success{ display: none;background: white;}
    fieldset.active{ display: block;}    
    label { display: block; font-weight: bold; }
    input { font-size: 14pt !important; width: 98%; margin: 10px 0 !important;outline: none; padding: 3px !important;text-indent: 5px; border: solid 1px rgba(0,0,0,0.3);  -moz-box-shadow:inset -2px 1px 3px 1px rgba(0,0,0,0.2); box-shadow:inset -2px 1px 3px 1px rgba(0,0,0,0.2); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
    select { font-size: 12pt !important; width: 100%; margin: 10px 0 !important; padding-left: 3px; }
    select.birthMonth { width: 35%; margin-right: 3% !important; }
    select.birthDay { width: 26%; margin-right: 3% !important; }
    select.birthYear { width: 30%; }
    .title { font-weight: bold; text-align: center; padding-bottom: 10px; font-size: 19pt; line-height: 20pt; color: #333; }
    h1.title { font-weight: normal;display: none;}
    .title b { font-weight: bold; font-size: 20pt; }
    .prestine h1.title{ display: block;}
    .facebook-cnt p{margin:8px 0 0 0}
    .facebook-cnt .loginOption{ position: relative;border-top: 1px solid #00548d; margin:40px 0 30px 0}
    .facebook-cnt .loginOption span{ display: block;position: absolute;border-radius: 50%;width: 30px;height: 30px;margin: -15px 45% 0 45%;background: #00548d;color: white;line-height: 30px;text-align: center;}

    .action-link { padding: 25px 0 15px; font-weight: bold; font-size: 10pt; text-align: center; }
    .action-link a { color: #20558a !important; text-decoration: underline; }

    .info { font-size: 9pt; color: #444; padding: 0 0 10px; }
    .info a { color: #555; text-decoration: underline; }
    .tou { padding: 10px 0 0; }

    .success p.title { font-size: 14pt; padding-bottom: 20px; font-weight: normal; }
    .success p.title b { font-size: 16pt; }
    .success p.title b SpAN { font-size: 20pt; display: block; }
    .success p.cta { font-size: 10pt; padding: 0 20px 20px; text-align: center; }
    .success p.cta STRONG { font-size: 11pt; }

.member-view p.title { font-size: 18pt; padding-bottom: 20px; }
.member-view p.title b { font-size: 22pt; }

.button.button-m-facebook{background:#3d6199 ;font-size: 18px;color: white;line-height: 48px;font-weight: normal;display: block;text-align: center; padding:0 10px}
.button-m-facebook:visited,
.button-m-facebook:active,
.button-m-facebook:hover{color:white}
.button-m-facebook span{vertical-align: middle;background: url('/en-us/landing/images/logo/facebook/fb-icon.png') 0 0 no-repeat;width: 28px;height: 28px;display: inline-block;*display: inline;*zoom: 1;padding: 0 3px 0 0;}
.button-download{margin:15px 0 0 0}
.button-progressive,
.button-download{background: #076e0b; background: -moz-linear-gradient(top, #5acc90 0%, #076e0b 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5acc90), color-stop(100%,#076e0b));  background: -webkit-linear-gradient(top, #5acc90 0%,#076e0b 100%);  background: -o-linear-gradient(top, #5acc90 0%,#076e0b 100%);  background: -ms-linear-gradient(top, #5acc90 0%,#076e0b 100%);  background: linear-gradient(to bottom, #5acc90 0%,#076e0b 100%);  width: 100%; height: 47px;line-height: 47px;text-align: center; margin: 0 auto; cursor: pointer; border: solid 1px #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 0 0 1px #2a9643; -moz-box-shadow: 0 0 0 1px #2a9643; box-shadow: 0 0 0 1px #2a9643; text-shadow: #939598 -1px -1px 0; text-transform: uppercase; font-size: 12pt; font-weight: bold; color: #fff; display: block;}

.ui-loading{ display: none;text-align: center;min-height: 100px;line-height: 100px;}
.cp_working fieldset,
.cp_working fieldset.active,
.cp_working h1.title{ display: none;}
.cp_working .ui-loading{ display:block;}

.no-cookies{ display: none;}

  /*==========  Non-Mobile First Method  ==========*/
  @media only screen and (max-width: 936px) {
       #spotlight span {
           width: 16.66%;
       }
  }
  @media only screen and (max-width: 827px) {
       #footer {
          display: none;
      }
  }
  @media only screen and (max-width: 600px) {
       #spotlight span {
          width: 25%;
      }
  }
  @media only screen and (max-width : 480px) {
      #spotlight span {
          width: 25%;
      }
  }