html.ac_active p.brand_copy {
  font-weight: 500;
  font-size: 17px;
  text-align: center;
}

@font-face {
  font-family: 'ITCAvantGardeGothicStdBook';
  src: url("../../lib/fonts/avantgardeitc/itcavantgardestd-bk-webfont.eot");
  src: url("../../lib/fonts/avantgardeitc/itcavantgardestd-bk-webfont.eot?#iefix") format("embedded-opentype"), url("../../lib/fonts/avantgardeitc/itcavantgardestd-bk-webfont.woff") format("woff"), url("../../lib/fonts/avantgardeitc/itcavantgardestd-bk-webfont.ttf") format("truetype"), url("../../lib/fonts/avantgardeitc/itcavantgardestd-bk-webfont.svg#ITCAvantGardeGothicStdBook") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'ITCAvantGardeProBold';
  src: url("../../lib/fonts/avantgardeitc/ITCAvantGardePro-Bold.otf");
  font-weight: normal;
  font-style: normal; }
  
html.ac_active {
  background-color: #000;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%; }
  html.ac_active body {
    margin: 0;
    /*padding: 0;*/
    width: 100%;
    height: 100%;
    background-size: cover;
    line-height: 1.75;
    color: #fff;
    position:relative;
    overflow: hidden;
  }


html.ac_active .ac_zone{
  position:fixed;
  left: 0;
  top: 0;
  bottom:0;
  width:100%;
  min-height:100%;
  background-color: #1f1f1f;
  z-index: 10501;
}

html.ac_active .ac_zone #wrap{
    height:100%;
    width:100%;
    overflow-y: scroll;
    margin: 0 auto;
    position: relative;
}


html.ac_active #wrap .block {
  font-weight: 500;
  z-index: 10011;
  top: 0;
  width: 350px;
  margin:0 auto;
  padding-top: 50px;
  text-transform: uppercase; }

html.ac_active #logo {
      margin: 0 auto 30px;
    }
html.ac_active #thetext {
  z-index: 10005;
  font-weight: 500;
  padding: 15px;
  font-size: 20px;
  display: none;
  margin: 0 auto 80px;
  text-align: center; }

  html.ac_active #thetext h3 {
    padding-bottom: 0;
    margin: 0 auto;
    font-size: 20px;
    line-height: 24px;
    font-weight: 500;
    text-transform: uppercase;
  }

/*
html.ac_active img.splash {
  position: absolute;
  max-width: 90%; }
  html.ac_active img.splash:empty {
    top: 54%;
    left: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
html.ac_active img.splash1 {
  position: absolute;
  max-width: 90%; }
  html.ac_active img.splash1:empty {
    top: 54%;
    left: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
html.ac_active img.splash2 {
  position: absolute;
  max-width: 90%; }
  html.ac_active img.splash2:empty {
    top: 54%;
    left: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }

html.ac_active .fadepopup .wrapper {
  width: 100%;
  padding: 0 10%;
  text-align: center;
  position: relative;
  top: 50%; }

*/

#age_submit:focus {outline:0;}
html.ac_active #age_submit {
      -moz-appearance: none;
      -webkit-appearance: none;
      appearance: none;
  border-radius: 15px;
  padding: 10px 20px;
  display: block;
  min-height: 60px;
  font-family: arial;
  font-weight: bold;

  text-decoration: none;
  text-shadow: 0px 1px 0px #fff;
  border: 1px solid #a7a7a7;
  width: 200px;
  margin: 0px auto;
  margin-top: 25px;
  -moz-box-shadow: 0px 2px 1px white inset, 0px -2px 8px white, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 2px 1px white inset, 0px -2px 8px white, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 1px white inset, 0px -2px 8px white, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1);
  -moz-transition: box-shadow 0.5s;
  -o-transition: box-shadow 0.5s;
  -webkit-transition: box-shadow 0.5s;
  transition: box-shadow 0.5s;
  font-size: 17px;
  text-transform: uppercase; }

html.ac_active #age_submit i {
  float: right;
  margin-top: 2px; }

html.ac_active #age_submit:hover {
cursor:pointer;
  -moz-box-shadow: 0px 2px 1px white inset, 0px -2px 20px white, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 2px 1px white inset, 0px -2px 20px white, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 1px white inset, 0px -2px 20px white, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1); }

html.ac_active #age_submit:active {
  -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5) inset, 0px -2px 20px white, 0px 1px 5px rgba(0, 0, 0, 0.1), 0px 2px 10px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5) inset, 0px -2px 20px white, 0px 1px 5px rgba(0, 0, 0, 0.1), 0px 2px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5) inset, 0px -2px 20px white, 0px 1px 5px rgba(0, 0, 0, 0.1), 0px 2px 10px rgba(0, 0, 0, 0.1);
  background: -webkit-linear-gradient(top, #d1d1d1 0%, #ECECEC 100%); }

@media only screen and (min-width: 320px) and (max-width: 568px) {
  html.ac_active #wrap,
  html.ac_active #wrap .block {
    max-width: 300px !important;
    min-width: 300px !important;
 }
  html.ac_active #wrap .block #logo,
  html.ac_active #wrap .block #thetext{
    max-width:100%;
    background-size: 90% auto;
  }
  html.ac_active #wrap .block #thetext{
    padding: 0 !important;
  }

  html.ac_active p.brand_copy {
    font-size: 14px; } }
@media screen and (orientation: portrait) {
  html.ac_active img.splash {
    max-width: 90%; } }
@media screen and (orientation: landscape) {
  html.ac_active img.splash {
    max-height: 90%; } }
@media screen and (max-width: 555px), screen and (max-height: 400px) {
  html.ac_active img.splash:empty {
    display: none; }
  html.ac_active img.splash1:empty {
    display: none; }
  html.ac_active img.splash2:empty {
    display: none; } }
@media screen and (max-height: 750px) {
  html.ac_active img.splash:empty {
    width: 55% !important; }
  html.ac_active img.splash1:empty {
    width: 55% !important; }
  html.ac_active img.splash2:empty {
    width: 55% !important; } }
@media screen and (max-height: 600px) {
  html.ac_active img.splash:empty {
    width: 40% !important; }
  html.ac_active img.splash1:empty {
    width: 40% !important; }
  html.ac_active img.splash2:empty {
    width: 40% !important; } }



  @media only screen and ( max-width: 480px ), only screen and (max-device-width: 480px) {
    html.ac_active #error_message{
      font-size: 30px;
      width: 400px;
      margin: 0 auto;
      font-weight: bold;
    }
    html.ac_active .text,
    html.ac_active .logo
    {
      left:10px;
      position: relative;
    }
    html.ac_active .field_container
    {
      left:5px !important;
      position:relative;
    }
    html.ac_active #bYear,#bDay,#bMonth
    {
      font-size: 55px !important;
    }
    html.ac_active #submit
    {
      padding-top:20px;
      zoom:150%;
      left:15px;
      position:relative;
      background-repeat:no-repeat;
    }
  }
      ::-webkit-input-placeholder {
        color:#ccc !important;
      }
      ::-moz-placeholder {
        color:#ccc !important;
      }
      .placeholder {
        color:#ccc !important;
      }
      html.ac_active body {
              background-image:url(../..//view//images/agegate/agegate_bg.jpg);
              background-repeat:repeat;
        background-position:center top;
        background-size:cover;
        color:#fff;
        width:100%;
      }
      html.ac_active .page {
        width:640px !important;
        width:900px;
        margin:75px auto;
        @media only screen and (min-width: 320px) and (max-width: 568px) {
          max-width: 100%;
        }
      }


      html.ac_active .logo {
                  background-image:url(../..//view//images/agegate/logo.png);
                margin:auto;
      }
      html.ac_active .text {
                  background-image:url(../..//view//images/agegate/birthday.png);
                background-repeat:no-repeat;
        margin:auto;
        margin-top:50px;
      }
      html.ac_active .guide {
                  background-image:url(../..//view//images/agegate/month_day_year.png);
                background-repeat: no-repeat;
        margin: 30px auto;
        background-position: center top;
      }
      html.ac_active .field_container {
        width: 670px;
        height:151px;
        margin:auto;
        margin-top:30px;
        margin-bottom:40px;
        clear:both;
      }
      html.ac_active .field_1,html.ac_active  .field_2,html.ac_active .field_3  {
                  background-image:url(../..//view//images/agegate/field.png);
                width:201px;
        height:151px;
        float:left;
        margin-right:20px;
      }
    html.ac_active .form_field {
      padding:10px;
      width:181px;
      height:131px;
      color:#fff;
      font-size: 45pt;
      text-align:center;
      background-color:transparent;
      outline:none;
      border:none;
    }
    html.ac_active #submit {
              background-image:url(../..//view//images/agegate/button_enter_1.png);
          }
    html.ac_active #submit {
      background-position:center;
      width:310px;
      height:60px;
      margin:auto;
      background-color:transparent;
      border:none;
    }

    html.ac_active .error{background:#ff0000;}
    html.ac_active #submit:hover {
                background-image:url(../..//view//images/agegate/button_enter_2.png);
            }
    html.ac_active #ageForm INPUT
    {
      font-size: 45pt;
    }