HTML, bODY { background: #00426f !important; font: 9pt Roboto, Helvetica, Arial, sans-serif; color: #333;}
#hdr {background: #1574bb; height: 44px;}
#logo, #logo_yahoo { text-indent: -9999px; height: 100%; }
#logo { background: transparent url('/en-us/landing/images/logo/368x50.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; }
.matchEventsLogo {
    background: url('/en-us/match/registration/images/MatchEvents_Logo.png') no-repeat center center;
    display: none;
    background-size: 85%;
    height: 55px;
    margin-bottom: 5px;
}

.prestine div.matchEventsLogo{ display: block;}

.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: 10px 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;}    
    
    .form-registration label { display: block;    font-family: arial;    font-size: 16px;}
    .form-registration input { font-size: 13pt !important; font-family:arial !important;font-weight:normal !important ;width: 99.2%; margin: 3px 0 10px 0 !important;outline: none;height:41px;line-height:41px;text-indent: 10px; 
                               border: 1px solid #1574bb !important;
    box-shadow:none !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
    select { font-size: 17px !important;color :#1574bb; width: 100%; margin: 3px 0 10px 0 !important;font-weight:normal !important ; padding:9px 3px 8px 10px !important;-webkit-border-radius: 5px; font-family:arial !important;}
    select.birthMonth { width: 31%; margin-right: 2.1% !important;color :#1574bb; padding:9px 10px 8px 10px !important;}
    select.birthDay { width:31%; margin-right: 2.1% !important;color :#1574bb; padding:9px 10px 8px 10px !important;}
    select.birthYear { width: 31%; color :#1574bb;padding:9px 10px 8px 10px !important;}
    .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;display: block; }
    .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: 8px 0 15px; font-weight: bold; font-size: 10pt; text-align: center; }
    .action-link a { color: #20558a !important; text-decoration: underline; }

    .info { font-size: 10pt; 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: #1574bb;   width: 100%; height: 47px;line-height: 47px;text-align: center; margin: 0 auto; cursor: pointer; border: solid 1px #fff; -webkit-border-radius: 25px !important; -moz-border-radius: 25px !important; border-radius: 25px !important;  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: 767px) {
       #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%;
      }
  }

  /*to remove unwanted border on click button*/
:focus {outline:none;} ::-moz-focus-inner {border:0;}