@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}
.btn a,h2{font-weight:700}
.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;
    line-height:1.3;
}

.btn a,p{
    text-transform:inherit;
    line-height:1.5;
}

p{
    font-weight:500;
    font-size:15px;
}

/* ===== РОЖЕВІ КНОПКИ ===== */
.btn a{
    background:#ff66b3; /* рожевий */
    color:#322e2f;
    padding:15px 55px;
    border-radius:30px;
    transition:.3s;
}

.btn a:hover{
    background:#ff3399; /* темніший рожевий */
    color:#fff;
}

/* кнопки у hero та registration */
.first-registration .btn a,
.hs-hero-right-text .btn a{
    background:#ff66b3;
    color:#fff;
}

.first-registration .btn a:hover,
.hs-hero-right-text .btn a:hover{
    background:#ff3399;
    color:#fff;
}
/* ========================= */

.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 0px}

.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:-webkit-box;
    display:-ms-flexbox;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
}

.all-p-humber{
    width:40px;
    height:40px;
    -webkit-transform:rotate(0);
    -ms-transform:rotate(0);
    transform:rotate(0);
    -webkit-transition:.5s ease-in-out;
    -o-transition:.5s ease-in-out;
    transition:.5s ease-in-out;
    cursor:pointer;
    background:#010304;
    border-radius:50%;
    text-align:center;
    z-index:9;
}

.all-p-humber span{
    display:block;
    position:absolute;
    height:2px;
    width:22px;
    background:#fff;
    border-radius:9px;
    opacity:1;
    left:10px;
    -webkit-transform:rotate(0);
    -ms-transform:rotate(0);
    transform:rotate(0);
    -webkit-transition:.25s ease-in-out;
    -o-transition:.25s ease-in-out;
    transition:.25s ease-in-out;
    top:12px;
}

.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){
    -webkit-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg);
}

.all-p-humber.open span:nth-child(3){
    -webkit-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
}

.hs-header-area{
    background:#18152c;
    padding:10px 0;
    z-index:99;
}

.hs-header-content{
    display:flex;
    -ms-flex-direction:row;
    flex-direction:row;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
}

.hs-header-logo img{width:160px;height:auto}

.hs-header-nav ul,.single-child-hs-overview-list{
    display:flex;
    -ms-flex-direction:row;
    flex-direction:row;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
}

.hs-header-nav ul li a{
    font-weight:500;
    color:#fff;
    margin:0 16px;
    transition:.3s;
}

.footer-nav ul li a:hover,.hs-header-nav ul li a:hover{color:#04c000}

.hs-hero-area{
    background:url("../images/bg.png") no-repeat;
    background-size:cover;
    background-position:right;
}

.hs-hero-content .row,.hs-registration-content .row{
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
}

.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;
}

.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}

.hs-registration-content{
    display:flex;
    flex-direction:row;
    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;
}

.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 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-title-content{
    display:flex;
    flex-direction:row;
    align-items:center;
    flex-wrap:wrap;
}

.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-area{
    background:#18152c;
    padding:30px 0 40px;
}

.footer-logo img{
    width:225px;
    height:auto;
}

.footer-nav ul{
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
}

.footer-nav ul li a{
    font-weight:500;
    font-size:16px;
    color:#fff;
    margin:0 15px;
    transition:.3s;
}