* { padding: 0; margin: 0; -webkit-box-sizing: border-box; box-sizing: border-box; }

body { font-family: 'Arial', sans-serif; background: #000; overflow-x: hidden; padding: 0; margin: 0; }

.video { width: 100%; height: 900px; overflow: hidden; position: absolute; }
.video video { position: absolute; top: 0; left: 50%; margin-left: -960px; }

.overlay { width: 100%; height: 100%; background: url(../images/overlay.png) repeat; position: fixed; top: 0; left: 0; opacity: 1; }

.container { position: relative; width: 1200px; margin: 0 auto; }

.wrapper .logo { text-align: center; padding-top: 15px; }
.wrapper .versions { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: nowrap; /*justify-content: space-between;*/ height: 480px; margin-bottom: 78px; }
.wrapper .versions li { width: 50%; position: relative; }
.wrapper .versions li:hover .version { transform: scale(0.9); }
.wrapper .versions li:hover .version:after { opacity: 1; }
.wrapper .versions li:hover .light { transform: scale(1, 1); transition: all 0.5s cubic-bezier(0.2, 0.26, 0.42, 1.57); }
.wrapper .versions .version { width: 299px; height: 399px; position: absolute; top: calc(50% - 399px/2); left: calc(50% - 299px/2); transition: transform .3s ease-in-out; }
.wrapper .versions .version:before { position: absolute; top: 4px; left: 8px; content: ' '; width: 284px; height: 397px; background: url(../images/game-1.png) no-repeat center; opacity: 1; transition: all .3s ease-in-out; }
.wrapper .versions .version:after { position: absolute; top: 0; left: 0; content: ' '; width: 299px; height: 411px; background: url(../images/game-2.png) no-repeat center; opacity: 0; transition: all .15s ease-in-out; }
.wrapper .versions .ss-logo { width: 239px; height: 291px; position: absolute; top: 88px; left: 30px; z-index: 1; }
.wrapper .versions .season { position: absolute; top: 0; left: 0; width: 100%; text-align: center; z-index: 1; }
.wrapper .versions .season img { position: relative; }
.wrapper .versions .light { width: 300px; height: 654px; background: url(../images/light-active.png) no-repeat; position: absolute; top: -90px; left: calc(50% - 300px/2); transform: scale(0.8, 0.5); transition: all .3s ease-out; }

.wrapper .versions { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: nowrap; /*justify-content: space-between;*/ height: 480px; margin-bottom: 78px; }
.wrapper .versions li { width: 50%; position: relative; }
.wrapper .versions li:hover .versions6 { transform: scale(0.9); }
.wrapper .versions li:hover .versions6:after { opacity: 1; }
.wrapper .versions li:hover .light { transform: scale(1, 1); transition: all 0.5s cubic-bezier(0.2, 0.26, 0.42, 1.57); }
.wrapper .versions .versions6 { width: 299px; height: 399px; position: absolute; top: calc(50% - 399px/2); left: calc(50% - 299px/2); transition: transform .3s ease-in-out; }
.wrapper .versions .versions6:before { position: absolute; top: 4px; left: 8px; content: ' '; width: 284px; height: 397px; background: url(../images/game-3.png) no-repeat center; opacity: 1; transition: all .3s ease-in-out; }
.wrapper .versions .versions6:after { position: absolute; top: 0; left: 0; content: ' '; width: 299px; height: 411px; background: url(../images/game-4.png) no-repeat center; opacity: 0; transition: all .15s ease-in-out; }
.wrapper .versions .ss-logo { width: 239px; height: 291px; position: absolute; top: 88px; left: 30px; z-index: 1; }
.wrapper .versions .seasons6 { position: absolute; top: 0; left: 0; width: 100%; text-align: center; z-index: 1; }
.wrapper .versions .seasons6 img { position: relative; }
.wrapper .versions .light { width: 300px; height: 654px; background: url(../images/light-active.png) no-repeat; position: absolute; top: -90px; left: calc(50% - 300px/2); transform: scale(0.8, 0.5); transition: all .3s ease-out; }

.wrapper .versions { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: nowrap; /*justify-content: space-between;*/ height: 480px; margin-bottom: 78px; }
.wrapper .versions li { width: 50%; position: relative; }
.wrapper .versions li:hover .versions1 { transform: scale(0.9); }
.wrapper .versions li:hover .versions1:after { opacity: 1; }
.wrapper .versions li:hover .light { transform: scale(1, 1); transition: all 0.5s cubic-bezier(0.2, 0.26, 0.42, 1.57); }
.wrapper .versions .versions1 { width: 299px; height: 399px; position: absolute; top: calc(50% - 399px/2); left: calc(50% - 299px/2); transition: transform .3s ease-in-out; }
.wrapper .versions .versions1:before { position: absolute; top: 4px; left: 8px; content: ' '; width: 284px; height: 397px; background: url(../images/game-5.png) no-repeat center; opacity: 1; transition: all .3s ease-in-out; }
.wrapper .versions .versions1:after { position: absolute; top: 0; left: 0; content: ' '; width: 299px; height: 411px; background: url(../images/game-6.png) no-repeat center; opacity: 0; transition: all .15s ease-in-out; }
.wrapper .versions .ss-logo { width: 239px; height: 291px; position: absolute; top: 88px; left: 30px; z-index: 1; }
.wrapper .versions .seasons1 { position: absolute; top: 0; left: 0; width: 100%; text-align: center; z-index: 1; }
.wrapper .versions .seasons1 img { position: relative; }
.wrapper .versions .light { width: 300px; height: 654px; background: url(../images/light-active.png) no-repeat; position: absolute; top: -90px; left: calc(50% - 300px/2); transform: scale(0.8, 0.5); transition: all .3s ease-out; }

.footer { background: #000; position: relative; }
.footer .container { display: flex; flex-wrap: wrap; }
.footer .container .copyright { padding-top: 35px; font-weight: 600; flex: 1; color: #b3b7b8; }
.footer .container .copyright strong { color: #ff0; }
.footer .container .copyright .d { color: #4a4c52; padding-top: 10px; }