@font-face {
    font-family: 'Metropolis';
    src: url('/css/fonts/Metropolis/Metropolis-Regular.eot');
    src: local('/css/fonts/Metropolis/Metropolis-Regular'),
        url('Metropolis-Regular.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/Metropolis/Metropolis-Regular.otf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Metropolis';
    src: url('/css/fonts/Metropolis/Metropolis-Bold.eot');
    src: local('/css/fonts/Metropolis/Metropolis-Bold'),
        url('/css/fonts/Metropolis/Metropolis-Bold.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/Metropolis/Metropolis-Bold.otf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Metropolis';
    src: url('/css/fonts/Metropolis/Metropolis-Light.eot');
    src: local('/css/fonts/Metropolis/Metropolis-Light'),
        url('/css/fonts/Metropolis/Metropolis-Light.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/Metropolis/Metropolis-Light.otf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Metropolis';
    src: url('/css/fonts/Metropolis/Metropolis-ExtraBold.eot');
    src: local('/css/fonts/Metropolis/Metropolis-ExtraBold'),
        url('/css/fonts/Metropolis/Metropolis-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/Metropolis/Metropolis-ExtraBold.otf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

:root {
    --teknosa-main-color: #F58220;
    --teknosa-main-color-hover: #e7740f;
    --teknosa-background-light: #EBEBEB;
}
.center-screen {
    display: flex!important;
    justify-content: center!important;
    align-items: center!important;
    min-height: 100vh!important;
}
.center-horizontal-mobile { }
.teknosa-bg-light{ background-color: var(--teknosa-background-light)!important; }
.teknosa-button{
    color: #FFF!important;
    font-family: Metropolis!important;
    font-size: 18px!important;
    font-style: normal!important;
    font-weight: 400!important;
    line-height: normal!important;
    border-radius: 4px!important;
    background: var(--teknosa-main-color)!important;
    width: 160px;
    height: 48px;
    flex-shrink: 0;
}
.teknosa-button:hover{ background: var(--teknosa-main-color-hover)!important; }
.teknosa-button.play-now{ 
    height: 50px;
    color: #FFF!important;
    font-family: Metropolis!important;
    font-size: 20px!important;
    font-style: normal!important;
    font-weight: 400!important;
    line-height: normal!important;
    border-radius: 50px!important;
    width: 160px;
}
.teknosa-button.start-now{ 
    width: 408px;
    height: 60px;
    color: #FFF!important;
    font-family: Metropolis!important;
    font-size: 26px!important;
    font-style: normal!important;
    font-weight: 400!important;
    line-height: normal!important;
}
.game-card{
    padding: 0!important;
    width: 400px;
    height: 468px!important;
    border: 1px solid #E3E3E3;
    border-radius: 8px;
    background: #FFF;
}

 /* the slides */
.slick-slide {
    margin: 0 27px;
}
/* the parent */
.slick-list {
    margin: 0 -27px;
}




@media only screen and (max-width: 768px) {
    .game-card{
        width: 100%!important;
    }
    .teknosa-button.start-now{
        width: 80%!important;
    }
    .center-horizontal-mobile{
        margin: 0 auto!important;
    }
}