#worldWrapper {
    z-index: 4;
}

#worldBackground, #worldForeground {
    position: absolute;
    top: 0;
    left: 0;
    width: 2800px;
    height: 100%;
}

#worldBackground {
    left: -60px;
}

#worldBackground.no-animation {
    left: 0;
}

#worldForeground {
    left: -420px;
}

#worldForeground.no-animation {
    left: 0;
}

#homeGrass {
    position: absolute;
    top: 0;
    left: 0;
    width: 2800px;
    height: 720px;
    background-image: url(../..//images/720p/home_grass.png);
    background-repeat: no-repeat;
}

#homeGrass.no-animation {
    background-image: url(../..//images/720p/static_home_bg_day.jpg);
}

#homeBg {
    position: absolute;
    top: 0;
    left: 0;
    width: 2800px;
    height: 720px;
}

#homeBg.bgDay {
    background-image: url(../..//images/720p/home_bg_day.jpg);
    background-repeat: no-repeat;
}

#homeBg.bgDay.no-animation {
    background-image: url(../..//images/720p/static_home_bg_day.jpg);
}

#homeBg.bgNight {
    background-image: url(../..//images/720p/home_bg_night.jpg);
    background-repeat: no-repeat;
}

#homeBg.bgNight.no-animation {
    background-image: url(../..//images/720p/static_home_bg_night.jpg);
}

#bgNight {
    position: absolute;
    top: 0;
    left: 0;
    width: 2800px;
    height: 720px;
    background-image: url(../..//images/720p/home_bg_night.png);
    background-repeat: no-repeat;
}

#cinemaForeground {
    background-image: url(../..//images/720p/home_cinema_foreground.png);
    background-repeat: no-repeat;
    height: 400px;
    left: 942px;
    position: absolute;
    top: 276px;
    width: 670px;
    z-index: 2;
}

#activateIcon {
    background-image: url(../..//images/720p/icon_activate.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: 100px;
    left: 582px;
    position: absolute;
    top: 300px;
    width: 125px;
    z-index: 4;
    pointer-events: none;
}

#activateIcon.no-animation {
    left: 272px;
}

#cinemaFocus {
    position: absolute;
    top: 29px;
    left: 893px;
    width: 513px;
    height: 530px;
    background-image: url(../..//images/720p/highlight_cinema.png);
    background-position: 0 0;
    background-repeat: no-repeat;
    opacity: 0;
    z-index: 3;
}

#cinemaFocus.no-animation {
    top: 7px;
    left: 555px;
    width: 558px;
    height: 572px;
    background-image: url(../..//images/720p/static_home_highlight_cinema.png);
}

#cinemaFocus.focus,
#cinemaFocus:hover {
    opacity: 1;
}

#loginFocus {
    position: absolute;
    top: 195px;
    background-size: contain;
    left: 593px;
    width: 275px;
    height: 328px;
    background-image: url(../..//images/720p/highlight_ticket_counter.png);
    background-position: 0 0;
    background-repeat: no-repeat;
    opacity: 0;
    z-index: 3;
}

#loginFocus.no-animation {
    top: 184px;
    background-size: auto;
    left: 258px;
    width: 315px;
    height: 355px;
    background-image: url(../..//images/720p/static_home_highlight_ticketcounter.png);
}

#loginFocus.focus,
#loginFocus:hover {
    opacity: 1;
}

#worldSubviews {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
}

#worldOverlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 720px;
    background-image: url(../../images/720p/home_bg_blurred.jpg);
    background-position: 0 0;
    display: none;
}

#accessSettingsWrapper {
    z-index: 2;
    left: 1145px;
}

/*#accessSettingsWrapper.visible {
    background: rgba(0, 0, 0, 0.3);
}*/

#settingsIconWrapper {
    position: relative;
    float: left;
    width: 135px;
    height: 100%;
}

#settingsIconCenter {
    bottom: 0;
    height: 380px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1;
    /*background: rgba(0, 0, 0, 0) linear-gradient(-90deg, #ff924b 0%, #ff328f 100%);*/
    background-image: url(../..//images/720p/button_right_half.png);
    background-repeat: no-repeat;
    background-position: 0 center;
}

#settingsIconCenter.focus,
#settingsIconCenter:hover {
    background-position: -141px center;
}

#accessSettingsWrapper.visible #settingsIcon {
    background-image: url(../..//images/720p/home_icon_close.png);
}

#settingsIcon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-image: url(../..//images/720p/home_icon_settings.png);
    background-position: 72px center;
}

#accessSettings {
    position: relative;
    float: left;
    width: 700px;
    height: 100%;
    z-index: 1;
}

#accessSettings.error {
    -webkit-animation: wrongCode 0.5s;
       -moz-animation: wrongCode 0.5s;
        -ms-animation: wrongCode 0.5s;
         -o-animation: wrongCode 0.5s;
            animation: wrongCode 0.5s;
}

@-webkit-keyframes wrongCode {
   0% {
      margin-top: -50px;
   }

   25% {
      margin-top: 50px;
   }

   50% {
      margin-top: -25px;
   }

   75% {
      margin-top: 25px;
   }
   
   100% {
      margin-top: 0;
   }
}

@-moz-keyframes wrongCode {
   0% {
      margin-top: -50px;
   }

   25% {
      margin-top: 50px;
   }

   50% {
      margin-top: -25px;
   }

   75% {
      margin-top: 25px;
   }
   
   100% {
      margin-top: 0;
   }
}

@-ms-keyframes wrongCode {
   0% {
      margin-top: -50px;
   }

   25% {
      margin-top: 50px;
   }

   50% {
      margin-top: -25px;
   }

   75% {
      margin-top: 25px;
   }
   
   100% {
      margin-top: 0;
   }
}

@-o-keyframes wrongCode {
   0% {
      margin-top: -50px;
   }

   25% {
      margin-top: 50px;
   }

   50% {
      margin-top: -25px;
   }

   75% {
      margin-top: 25px;
   }
   
   100% {
      margin-top: 0;
   }
}

@keyframes wrongCode {
   0% {
      margin-top: -50px;
   }

   25% {
      margin-top: 50px;
   }

   50% {
      margin-top: -25px;
   }

   75% {
      margin-top: 25px;
   }
   
   100% {
      margin-top: 0;
   }
}

#accessSettingsOverlay {
    position: absolute;
    top: 0;
    left: -77px;
    width: 125%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 0px 115px;
    pointer-events: none;
}

#accessSettingsCenter {
    background: linear-gradient(135deg, #ffca01 0%,#ff5e3a 100%);
    border: 4px solid #fff;
    border-radius: 20px;
    bottom: 0;
    height: 367px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    padding-left: 40px;
    padding-right: 40px;
}

#accessSettingsWrapper.visible #accessSettingsOverlay {
    background-image: url(../..//images/720p/shadow_settings.png);
}

#accessSettingsLeft {
    position: relative;
    float: left;
    width: 54%;
    height: 100%;
}

#settingsCharacter {
    position: absolute;
    top: -40px;
    left: 0;
    width: 100%;
    height: 100%;
}

#settingsCharacterBg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../..//images/720p/home_background_character.png);
    background-repeat: no-repeat;
    background-position: 0 0;
}

#settingsCharacterImg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../..//images/720p/home_settings_character.png);
    background-repeat: no-repeat;
    background-position: center 0;
}

#accessSettingsLeft p {
    bottom: 53px;
    color: #fff;
    font-size: 21px;
    left: 0;
    line-height: 23px;
    padding-left: 53px;
    padding-right: 33px;
    position: absolute;
    text-align: center;
    width: 100%;
}

#accessSettingsRight {
    float: left;
    height: 100%;
    padding-bottom: 67px;
    padding-top: 67px;
    position: relative;
    width: 46%;
}

#accessSettingsRight .buttonsRow:first-child {
    margin-top: 0;
}

#accessSettingsRight .buttonsRow {
    position: relative;
    float: left;
    width: 100%;
    height: 67px;
    margin-top: 23px;
}

#accessSettingsRight .buttonsRow .button {
    position: relative;
    float: left;
    width: 67px;
    height: 100%;
    border-radius: 100px;
    background: #fff;
    color: #ab5533;
    display: table;
    text-align: center;
    margin-left: 23px;
}

#accessSettingsRight .buttonsRow .button.checked {
    background: #701400;
    color: #fff;
}

#accessSettingsRight .buttonsRow .button.focus,
#accessSettingsRight .buttonsRow .button:hover {
    border: 5px solid #701400;
    color: #ff5e3a;
}

#accessSettingsRight .buttonsRow .button p {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    font-size: 30px;
}