.js-form {
  width: 100%;
}
.game-card {
    padding: 3em 0;
    background-image: url(https://user67902.clients-cdnnow.ru/localStorage/news/d4/50/6e/3./d4506e3.jpg);
    background-size: cover;
    margin-bottom: 1rem;
    position: relative;    
background-attachment: fixed;
    min-height: calc(80vh);
}
.game-card-shd {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, .6);
    _background-color: rgba(30,8,1, .7);

}
.news-content .game-card h2 {
margin-top: 0 !important;
}
.news-content .game-card h4 {
    margin: 0 auto;
    max-width: 80%;
    position: relative;
    z-index: 1;
    padding: 0 2rem 1rem 2rem;
font-size: 1.8em;
}
.game-card .news-grid__elem__label {
left: 2rem;
}
.game-card-item {
    margin: 0 auto;
    flex-direction: column;
    max-width: 80%;
position: relative;
z-index: 1;
background-color: rgba(255,255,255,.6);    
overflow: hidden;
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
}
.game-card ._news-grid__elem_3x {
}
.game-card-start {
    padding: 1rem 2rem;
    transition: .2s ease-out;
}
.game-results {
    padding: 1rem 2rem 2rem 2rem;
    margin: 0;
}
.game-card-start p {
    width: 100%;
}
.game-results p {
    width: 100%;
}
.game-card-form {
    transition: .2s ease-in-out;
    position: relative;
    overflow: hidden;
}
.game-card .btn {
    background-color: #6a920f;
    color: #fff !important;
    margin-top: 20px;
}
.game-card .forms__steps {
    display: flex;
    width: calc(100% * 20);
    flex-direction: row;
    position: relative;
    transition: left .1s linear;
    overflow: hidden;
    transition-delay: .1s;
}
.game-card form>.row {
    padding: 0 1rem 1rem 1rem;
}
.game-card-step {
    transition: .2s ease-in-out;    
}
.forms__step {
    opacity: 0;
    transition: .2s cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transform: translateY(100%);
    transition-delay: .02s;
}
.forms__step_state_active {
    opacity: 1;
    z-index: 2;
}
.forms__steps .forms__step {
    flex-grow: 1;
    flex-basis: 0;
}
.forms__steps .forms__step_state_active {
    transform: translateY(0%);
}
.forms__steps .forms__step_state_inactive {
    transform: translateY(0%) scale(.9);
    opacity: 0;
    transition-delay: 0;
    transition: .1s linear;
}
.game-card-step-title {
    padding: 1rem;
    font-size: 1em;    
}
.game-card-step-img {
    position: relative;
    background-color: rgba(232, 230, 225, 1);
    text-align: center;
    height: auto;
    padding-top: calc(100% * 9 / 16);
}
.game-card-step-img video {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    outline: none !important;
}
.game-card-step-img:after {
    border-top: 1px solid rgba(0,0,0,.1);
    border-bottom: 1px solid rgba(0,0,0,.1);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: "";
}
.game-card-step-img img {
    _max-width: 100%;
    _max-height: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0;
    bottom: 0;
    max-height: 100%;
}
.game-card-step-opts {
    margin: 0;
    border: 0;
}
.game-card .collection .game-card-step-opt {
    color: #999;
    transition: .2s ease-out;
    cursor: default;
}
.game-card .collection .game-card-step-opt.chosen {
    color: #000;
}
.game-card .collection .game-card-step-opt.checked {
    background-color: #eee;
}
.game-card .collection .game-card-step-opt.success {
    border-left: 5px solid #4caf50;
    font-weight: bold;
    color: #4caf50;
}
.game-card .collection .game-card-step-opt.success p {
    font-size: .8em;
    font-weight: normal;
    color: #000;
}
.game-card .collection .game-card-step-opt.error {
    border-left: 5px solid #ee6e73;
    color: #ee6e73;
    font-weight: bold;
}
.game-card-step-opts.active .game-card-step-opt {
    color: #000;
    cursor: pointer;
}
.game-card-step-opts.active .game-card-step-opt:hover {
    background-color: #eee;
}
.game-card-quiz .forms__step {
_background-color: #fff;
}
.game-card .collection .game-card-step-opt-comment {
    display: none;
    padding-left: 2rem;
    transition: .2s ease-in-out;
    transition-delay: .1s;
    transform: translate(20%);
    opacity: 0;
}
.game-card .collection .game-card-step-opt.chosen .game-card-step-opt-comment {
    display: block;
    opacity: 1;
    transform: translateY(0%);    
}
.game-card input[type=text]:focus:not([readonly]), .game-card input[type=tel]:focus:not([readonly]), .game-card input[type=email]:focus:not([readonly]), .game-card textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #6a920f;
    box-shadow: 0 1px 0 0 #6a920f;
}
.game-card input[type=text], .game-card textarea.materialize-textarea {
border-bottom: 1px solid #9e9e9e;
}
.game-card .input-field label {
}
.game-card .input-field:after {
    color: #F44336;
display: block;
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    opacity: 0;
    -webkit-transition: .2s opacity ease-out, .2s color ease-out;
    transition: .2s opacity ease-out, .2s color ease-out;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
font-size: .8em;
}
.game-card .input-field.invalid:after {
    opacity: 1;
    content: attr(data-error);
}
.game-card  .input-field label.active {
    font-size: .8rem;
    -webkit-transform: translateY(-140%);
    transform: translateY(-180%);
color: #666 !important;
}
.panel-success {
padding: 1em 2em;
}
.panel-success .panel-heading {
    font-size: 2em;
}
.transp_0 {
    opacity: 0;
}
.game-card-share {
    position: absolute;
    bottom: .5rem;
    height: 2rem;
    width: 100%;
    text-align: center;
}
.game-card .t-social-button {
    border: none !important;
}

@media screen and (max-width: 1000px) {
.game-card {
position: relative;
}
.game-card-item {
position: relative;
    margin: 0;
    flex-direction: column;
    max-width: 75%;
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
}
.game-card h5 {
font-size: 14px;
color: #fff;
}
.game-card .btn.forms__button_state_active {
display: block !important;
}
.game-card-quiz .forms__step {
    max-height: 85vh;
    overflow-y: scroll;
}
}