@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@200;300;400;500;600;700;800;900&display=swap rel="stylesheet');
@import url(../fonts/fonts.css);

a,a:hover,span{text-decoration:none}
body,h1,h2,h3,h4,h5,h6,li,ol,p,ul{margin:0}
h1,h2,h3,p{color:#fff}
.btn,body,li,ol,ul{padding:0}
.after-bg,.hs-header-area{position:relative}

.btn a,.hs-header-nav ul li a{
    font-size:16px;
    -webkit-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
}

/* --- GREEN BUTTONS HERE --- */
.btn a{
    background:#039400;
    color:#fff;
    padding:15px 55px;
    border-radius:30px;
    transition:.3s;
    font-weight:700;
}

.btn a:hover{
    background:#02b300;
    color:#fff;
}
/* --- END GREEN BUTTONS --- */

.footer-nav ul li a,.hs-header-nav ul li a,h1{text-transform:capitalize}
body{
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    background:#05071a;
    font-family:"Work Sans",sans-serif;
}
html{overflow-x:hidden!important;scroll-behavior:smooth}
button,input,select,textarea{outline:0}
a,span{display:inline-block}
li,ol,ul{list-style:none}
h1{font-family:Metropolis;font-size:48px;line-height:1.35}
h2{
    font-size:35px;
    text-transform:inherit;
    font-weight:700;
    line-height:1.3;
}
p{font-weight:500;font-size:15px;text-transform:inherit;line-height:1.5}

.after-bg::after{
    content:'';
    position:absolute;
    background:url('../images/after-bg.png') 0 0/100% 100% no-repeat;
    left:0;
    bottom:0;
    width:100%;
    height:380px;
    z-index:-1;
}

.hs-same-design{
    background:#18152c;
    padding:48px;
    border-radius:20px;
    margin-bottom:40px;
}
.hs-same-design h2{margin-bottom:20px}
.hs-same-design h3{margin:16px 0}

.hs-header-register-btn.mobile,.mobile-menu-icon,.mobile-version{display:none}

.hs-header-content,.hs-header-nav ul,.single-child-hs-overview-list{
    display:flex;
    flex-direction:row;
}

.all-p-humber{
    width:40px;height:40px;transition:.5s ease-in-out;
    cursor:pointer;background:#010304;border-radius:50%;
    text-align:center;z-index:9;position:relative;
}

.all-p-humber span{
    display:block;position:absolute;height:2px;width:22px;
    background:#fff;border-radius:9px;opacity:1;left:10px;
    transition:.25s ease-in-out;
}

.all-p-humber span:first-child{top:10px}
.all-p-humber span:nth-child(2),.all-p-humber span:nth-child(3){top:19px}
.all-p-humber span:nth-child(4){top:26px}

.all-p-humber.open span:first-child,.all-p-humber.open span:nth-child(4){
    top:18px;width:0%;left:50%;
}
.all-p-humber.open span:nth-child(2){
    transform:rotate(45deg);
}
.all-p-humber.open span:nth-child(3){
    transform:rotate(-45deg);
}

.hs-header-area{
    background:#18152c;
    padding:10px 0;
    z-index:99;
}
.hs-header-content{
    justify-content:space-between;
    align-items:center;
}
.hs-header-logo img{width:160px;height:auto}

.hs-header-nav ul{
    align-items:center;
}
.hs-header-nav ul li a{
    font-weight:500;color:#fff;margin:0 16px;
}
.footer-nav ul li a:hover,.hs-header-nav ul li a:hover{
    color:#02b300;
}

/* HERO */
.hs-hero-area{
    background:url("../images/bg.png") no-repeat;
    background-size:cover;
    background-position:right;
}
.hs-hero-content .row,.hs-registration-content .row{
    align-items:center;
}

.first-registration .btn a,
.hs-hero-right-text .btn a{
    background:#039400;
    color:#fff;
    margin-top:20px;
}

/* PROS/CONS BLOCKS */
.hs-overview-content.hs-same-design .single-hs-overview-content{margin-top:40px}
.hs-overview-content.hs-same-design .single-hs-overview-content:first-child{margin-top:0}

.singles-child-hs-overview-content{
    margin-top:25px;border-radius:20px;
    background:#133629;min-height:470px;
    margin-bottom:25px;
}

.cons{background:#42242c}
.cons .single-child-hs-overview-title{background:#dc3545}
.hs-overview-pros-content{padding:25px}

.single-child-hs-overview-title{
    background:#039400;text-align:center;
    padding:12px 0;
    border-top-left-radius:20px;
    border-top-right-radius:20px;
}

.single-child-hs-overview-list li,
.single-child-hs-overview-list p,
.single-child-hs-overview-title p{
    font-weight:700;font-size:20px;
}

.single-child-hs-overview-content{margin-bottom:15px}
.hs-overview-pros-content .single-child-hs-overview-content:last-child{margin-bottom:0}

.single-child-hs-overview-list li{
    background:#fff;width:40px;height:40px;
    text-align:center;line-height:40px;
    border-radius:50%;border:1px solid #00982b;
}

.single-child-hs-overview-content p{
    font-weight:400;margin-top:12px;
}

.single-child-hs-overview-list p{
    font-weight:700;margin-left:15px;margin-top:0;
}

/* IMAGE GRID */
.game-variety-image{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:center;
    margin-top:25px;
}

.single-game-variety-image{flex:0 0 18.5%}
.single-game-variety-image img{width:100%;height:auto}

/* REGISTRATION */
.hs-registration-content{
    display:flex;justify-content:space-between;
    border-radius:30px;padding:60px 80px;
    margin-bottom:40px;
}
.hs-registration-content .btn{
    display:flex;justify-content:flex-end;
}

.first-registration{
    background:url('../images/ZeusvsHadesGods.png') 0 0/cover no-repeat;
}
.second-registration{
    background:url('../images/ZeusvsHadesGodsofWar.png') 0 0/cover no-repeat;
}
.third-registration{
    background:url('../images/maxresdefault.png') 0 0/cover no-repeat;
    margin-top:32px;margin-bottom:100px;
}

/* FAQ */
.footer-logo img,.sh-faq-heading{margin-bottom:25px}
.single-sh-faq-content{
    background:#18152c;
    padding:15px 30px;
    max-width:950px;width:100%;
    margin:0 auto 8px;
}

.single-sh-faq-title-content{
    display:flex;flex-direction:row;
    align-items:center;flex-wrap:wrap;
}

.single-sh-faq-title-content li{
    font-weight:900;font-size:20px;
    color:#fff;background:#00982b;
    width:45px;height:45px;
    border-radius:50%;text-align:center;
    line-height:43px;
}

.single-sh-faq-title-content p{
    font-weight:700;font-size:16px;margin-left:15px;
}

.single-sh-faq-text-content p{margin-top:15px}

.sh-faq-content .single-sh-faq-content:first-child{
    padding-top:30px;border-radius:20px 20px 0 0;
}
.sh-faq-content .single-sh-faq-content:last-child{
    padding-bottom:30px;border-radius:0 0 20px 20px;
}

/* FOOTER */
.footer-area{
    background:#18152c;
    padding:30px 0 40px;
}
.footer-logo img{width:225px;height:auto}
.footer-nav ul{
    display:flex;justify-content:center;align-items:center;
}
.footer-nav ul li a{
    font-weight:500;font-size:16px;
    color:#fff;margin:0 15px;
    transition:.3s;
}
.footer-nav ul li a:hover{color:#02b300}