@import url('https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed');
/*font-family: 'Roboto', sans-serif;
font-family: 'Roboto Condensed', sans-serif;*/
* {
	outline: none;
	margin: 0;
	padding: 0; 
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

body {
    min-width: 1208px;
    /*min-height: 1030px;*/
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    background: url(../img/bg.jpg) no-repeat center top, #000;
    background-size: 1960px;
    color: #fff;
}
a, a:hover {
    text-decoration: none;
    color: #fff;
}
.clear {clear: both;}
p {
    line-height: 24px;
    color: #5c7dad;
}
.fl {float: left;}
.fr {float: right;}

/*Позиционирование по центру блока*/ 
{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    
    -webkit-align-items: center;
       -moz-align-items: center;
        -ms-align-items: center;
         -o-align-items: center;
            align-items: center;
    justify-content: center;
}

.center {
    position: relative;
    width: 1208px;
    margin: 0 auto;
    padding: 110px 0 0 0;
    text-align: center;
}
.bonus-contain {
    position: absolute;
    top: 277px;
    left: 0;
}
.logo {
    
}
.game-contain {
    position: relative;
    width: 790px;
    height: 496px;
    margin: 0 auto;
    padding: 60px 0 0 0;
    background: url(../img/game-contain-bg.png);
    transform: translateY(-50px);
}
.game-box {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    justify-content: space-between;
    width: 674px;
    height: 375px;
    margin: 0 auto;
    overflow: hidden;
}
.line-slot {
    position: relative;
    width: 127px;
    height: auto;
}
.line-slot img {
    width: 100%;
    position: absolute;
    left: 0;
    animation: line-slot 3000ms ease 0ms infinite;
    /*animation-iteration-count: 3;*/
}
.line-slot:nth-child(2) img {
    width: 100%;
    position: absolute;
    left: 0;
    animation: line-slot 3000ms ease 0ms infinite;
    animation-delay: 0.2s;
    /*animation-iteration-count: 3;*/
}
.line-slot:nth-child(3) img {
    width: 100%;
    position: absolute;
    left: 0;
    -webkit-animation: line-slot 3000ms ease 0ms infinite;
    -moz-animation: line-slot 3000ms ease 0ms infinite;
    -o-animation: line-slot 3000ms ease 0ms infinite;
    animation: line-slot 3000ms ease 0ms infinite;
    animation-delay: 0.4s;
    -webkit-animation-delay:0.4s;
    -o-animation-delay:0.4s;
    animation-delay:0.4s;
    /*animation-iteration-count: 3;*/
}
.line-slot:nth-child(4) img {
    width: 100%;
    position: absolute;
    left: 0;
    animation: line-slot 3000ms ease 0ms infinite;
    -webkit-animation: line-slot 3000ms ease 0ms infinite;
    -moz-animation: line-slot 3000ms ease 0ms infinite;
    -o-animation: line-slot 3000ms ease 0ms infinite;
    -webkit-animation-delay: 0.7s;
    -moz-animation-delay: 0.7s;
    -o-animation-delay: 0.7s;
    animation-delay: 0.7s;
    /*animation-iteration-count: 3;*/
}
.line-slot:nth-child(5) img {
    width: 100%;
    position: absolute;
    left: 0;
    animation: line-slot 3000ms ease 0ms infinite;
    -webkit-animation: line-slot 3000ms ease 0ms infinite;
    -moz-animation: line-slot 3000ms ease 0ms infinite;
    -o-animation: line-slot 3000ms ease 0ms infinite;
    -webkit-animation-delay:0.9s;
    -moz-animation-delay:0.9s;
    -o-animation-delay:0.9s;
    animation-delay: 0.9s;
    /*animation-iteration-count: 3;*/
}

@-webkit-keyframes line-slot {
    0% { top: -751px; }
    70% { top: 20px; }
    90% { 
        top: -5px;
        -webkit-transition: 0.9s;
        -o-transition: 0.9s;
        transition: 0.9s; }
    100% { top: 0; }
}
@-moz-keyframes line-slot {
    0% { top: -751px; }
    70% { top: 20px; }
    90% { 
        top: -5px;
        -webkit-transition: 0.9s;
        -o-transition: 0.9s;
        transition: 0.9s; }
    100% { top: 0; }
}
@keyframes line-slot {
    0% { top: -751px; }
    70% { top: 20px; }
    90% { 
        top: -5px;
        -webkit-transition: 0.9s;
        -o-transition: 0.9s;
        transition: 0.9s; }
    100% { top: 0; }
}
.coll-try-now {
    position: absolute;
    top: 200px;
    left: 50%;
    transform: translateX(-50%);
    width: 601px;
    height: 250px;
    background: url(../img/take-it-now.png) center top no-repeat;
}
.coll-try-now:after {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 601px;
    height: 250px;
    background: url(../img/take-it-now.png) center bottom no-repeat;
    animation: take-it-now 500ms linear 0ms infinite both;
}
@keyframes take-it-now {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; transition: 0.2s;}
}
@-webkit-keyframes take-it-now {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; transition: 0.2s;}
}
@-moz-keyframes take-it-now {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; transition: 0.2s;}
}
.btn {
    display: block;
    width: 298px;
    height: 132px;
    margin: 0 auto;
    background: url(../img/btn.png) no-repeat center top;
    transform: translateY(-80px);
}
.btn:hover {
    background-position: center -132px;
}


#footer {
    width: 100%;
    text-align: center;
}


@media (max-width: 1320px) {
    /*body {
        background-size: auto;
        background-position: center top;
    }
    #section.center {background: url(../img/bg.jpg) no-repeat center top;    }*/
}