/* Common CSS Start  */
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
body{
    overflow-x: hidden;
}
a{
    text-decoration: none;
    display: inline-block;
}
.container{
    width: 1370px;
    margin: 0 auto;
}
ul,ol{
    list-style: none;
}
h1,h2,h3,h4,h5,h6,p{
    padding: 0;
    margin: 0;
    line-height: 0.8;
}
/* Common CSS End  */
/* Header Part Start  */
#headerPart{
    background-color: #000000;
    top: 0%;
    left: 0%;
    width: 100%;
    position: fixed;
}
.headerFlex{
    display: flex;
    padding-top: 25px;
    align-items: center;
}
.logoHeader{
    width: 15%;
}
.menuHeader{
    width: 70%;
}
.socialHeader{
    width: 15%;
}
.menuHeader ul{
    display: flex;
}
.menuHeader ul li a{
    padding: 0 15px;
    color: #DDDDDD;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    transition: 0.4s;
}
.menuHeader ul li a:hover{
    color: #FF4655;
}
.socialHeader ul{
    display: flex;
    justify-content: end;
}
.socialHeader ul li a{
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 400;
    font-family: "Oswald", sans-serif;
    padding: 0 10px;
    transition: 0.4s;
}
.iconHeaderOne{
    font-size: 15px;
}
.iconHeaderTwo{
    font-size: 22px;
}
/* Header Part End  */
/* Banner Part Start  */
#bannerPart{
    background: url(../images/banner\ Img.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.bannerText{
    padding-top: 270px;
}
.bannerText h4{
    font-weight: 400;
    font-family: "Oswald", sans-serif;
    font-size: 27px;
    color: #FFFFFF;
    padding-bottom: 31px;
}
.bannerText h1{
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    font-size: 60px;
    color: #FFFFFF;
    position: relative;
    display: inline-block;
}
.bannerText h1::after{
    position: absolute;
    height: 4px;
    width: 90px;
    background: #FFFFFF;
    content: "";
    bottom: -3px;
    right: -120px;
}
.bannerText p{
    padding-top: 24px;
    padding-bottom: 48px;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 16px;
    width: 521px;
    font-family: "Oswald", sans-serif;
    line-height: 24px;
}
.bannerBtn a{
    padding: 13px 25px;
    background: #212121;
    color: #FFFFFF;
    font-family: "Oswald", sans-serif;
    font-size: 16px;
    font-weight: 400;
    transition: 0.4s;
}
.bannerBtn a:hover{
  background-color: #FFFFFF;
  color: #121212;
}

.bannerIcon ul{
    display: flex;
    padding-top: 300px;
    padding-bottom: 103px;
}
.bannerIcon ul li a{
    margin-right: 20px;
    margin-left: 10px;
    color: #FFFFFF;
    font-size: 30px;
}
.bannerIcon ul li a:hover{
    color: #FF4655;
}
/* Banner Part End  */
/* About Part Start  */
#aboutPart{
    background: #121212;
    padding-top: 34px;
}
.aboutHead h3{
    color: #FFFFFF;
    font-weight: 600;
    font-size: 38px;
    font-family: "Oswald", sans-serif;
    width: 518px;
    line-height: 56px;
    position: relative;
    display: inline-block;
}
.aboutHead h3::after{
    position: absolute;
    height: 3px;
    width: 120px;
    background: #FF4655;
    content: "";
    bottom: 10px;
    margin-left: 11px;
}
.aboutFlexOne{
    padding-top: 64px;
    display: flex;
    justify-content: space-between;
}
.aboutList h3{
    font-family: "Oswald", sans-serif;
    font-weight: 600;
    font-size: 27px;
    letter-spacing: 0.81px;
    color: #FFFFFF;
    padding-bottom: 20px;
}
.aboutList h6{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
    padding-bottom: 15px;
}
.aboutList p{
    width: 501px;
    padding-top: 5px;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 27px;
    color: #FFFFFF;
    padding-bottom: 27px;
}
.colorCheck{
    color: #FF4655;
}
.aboutBtn a{
    padding: 13px 25px;
    background: #212121;
    color: #FFFFFF;
    font-family: "Oswald", sans-serif;
    font-size: 16px;
    font-weight: 400;
    transition: 0.4s;
}
.aboutBtn a:hover{
  background-color: #FFFFFF;
  color: #121212;
}
.aboutFlexTwo{
    display: flex;
    justify-content: space-between;
}
.aboutItem{
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    padding: 26px 90px 27px 100px;
    background: #212121;
    margin-top: 50px;
    margin-bottom: 82px;
    border-top-right-radius: 50px; 
    border-bottom-left-radius: 50px;
    transition: 0.3s;
    box-sizing: border-box;
}
.aboutItem:hover{
    outline: 2px solid #FF4655;

}
.aboutItem h2{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 60px;
    color: #FFFFFF;
  -webkit-text-stroke: 1px black;
    letter-spacing: 3%;
    line-height: 72px;
    
}
.colorCircle{
    font-size: 12px;
    color: #FF4655;
}
.aboutItem h4{
    font-weight: 300;
    font-size: 18px;
    padding-top: 30px;
    color: #FFFFFF;
    letter-spacing: 2%;
    font-family: "Oswald", sans-serif;
}
/* About Part End  */
/* Popular Games Part Start  */
#popularPart{
    background: #191919;
    padding-top: 115px;
    padding-bottom: 90px;
}
.popularHead{
    display: flex;
    justify-content: flex-end;
    margin-right: 10px;
}
.popularHead h3{
    font-family: "Barlow Condensed", sans-serif;
    font-size: 38px;
    font-weight: 600;
    letter-spacing: 7%;
    line-height: 46px;
    width: 454px;
    color: #FFFFFF;
    text-align: end;
    position: relative;
    display: inline-block;
}
.popularHead h3::before{
    position: absolute;
    height: 3px;
    width: 105px;
    background: #FF4655;
    content: "";
    bottom: 6px;
    margin-left: 180px;
}
.popularFlex{
    display: flex;
    justify-content: space-between;
}
.imageOne{
    margin-top: -85px;
}
.imageTwo{
    padding-top: 80px;
}
.buttonSlide{
    margin-top: 360px;
    margin-right: 20px;
}
.buttonSlide ul li a:last-child{
    padding-top: 20px;
}
/* Popular Games Part End  */
/* Stream Part Start  */
#streamPart{
    padding-top: 90px;
    padding-bottom: 97px;
    background: #121212;
}
.streamHead h3{
    width: 446px;
    font-family: "Oswald", sans-serif;
    font-weight: 600;
    font-size: 38px;
    letter-spacing: 7%;
    color: #FFFFFF;
    line-height: 56px;
    position: relative;
    display: inline-block;
}
.streamHead h3::after{
    position: absolute;
    height: 3px;
    width: 120px;
    background: #FF4655;
    content: "";
    bottom: 10px;
    margin-left: 11px;
}
.streamFlex{
    display: flex;
    justify-content: space-between;
    padding-top: 68px;
}
.streamFlex img{
    filter: grayscale(100%);
    transition: filter 0.4s ease;
}
.streamFlex img:hover{
    filter: grayscale(0%);
    transform: scale(1.05);
}
.matchHead h3{
    padding-top: 61px;
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 500;
    font-size: 25px;
    line-height: 30px;
    letter-spacing: 9%;
    color: #FFFFFF;
    text-align: center;
}
.matchFlexOne{
    display: flex;
    justify-content: space-between;
    padding-top: 50px;
    padding-bottom: 59px;
    align-items: center;
    
}
.matchFlexTwo{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.matchItem{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 7px 10px 7px;
    background: #212121;
    width: 426px;

}
.matchItem h4{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 500;
    font-size: 32px;
    line-height: 38px;
    letter-spacing: 3%;
    color: #FFFFFF;
}
.score{
    font-family: "Oswald", sans-serif;
    font-size: 40px;
    line-height: 59px;
    letter-spacing: 15%;
    font-weight: 500;
    color: #FFFFFF;
}
.matchItem.Left{
    clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
}
.matchItem.Left h4{
    margin-right: 55px;
}
.matchItem.Right{
    clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%);
}
.matchItem.Right h4{
    margin-left: 59px;
}
/* Stream Part End  */
/* Top Games Part Start  */
#tgamesPart{
    padding-top: 90px;
    padding-bottom: 90px;
    background-color: #191919;
}
.tgamesHead{
    display: flex;
    justify-content: flex-end;
    margin-right: 10px;
}
.tgamesHead h3{
    font-family: "Barlow Condensed", sans-serif;
    font-size: 38px;
    font-weight: 600;
    letter-spacing: 7%;
    line-height: 46px;
    width: 449px;
    color: #FFFFFF;
    text-align: end;
    position: relative;
    display: inline-block;
}
.tgamesHead h3::before{
    position: absolute;
    height: 3px;
    width: 105px;
    background: #FF4655;
    content: "";
    bottom: 6px;
    margin-left: 200px;
}
.magazineFlex{
    display: flex;
    justify-content: space-between;
    padding-top: 47px;
}
.magazineItem{
    position: relative;
    display: inline-block;
}
.magazineItem img{
    display: block;
    transition: 0.3s ease;
}
.plusHover{
    position: absolute;
    margin-top: -415px;
    margin-left: 270px;
    font-size: 30px;
    opacity: 0;
    transition: 0.3s; 
}
.magazineItem:hover img{
    filter: brightness(70%);
    transform: scale(1.03);
}

.magazineItem:hover .plusHover{
    opacity: 1;
}
.magazineItem h5{
    padding-top: 20px;
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 22px;
    line-height: 26px;
    color: #FFFFFF;
}
.magazineItem h6{
    padding-top: 20px;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 10%;
    color: #666666;
}
.numberFlex{
    display: flex;
    padding-top: 20px;
    align-items: center;
}

.discount{
    padding: 3px 5px;
    background: #FF4655;
    color: #FFFFFF;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-right: 10px;

}
.priceOriginal{
    color: #666666;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 6%;
    margin-right: 10px;
    text-decoration: line-through;
}
.priceDiscount{
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
}
.tgamesHeadSecond h3{
    padding-top: 60px;
    padding-bottom: 30px;
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #FFFFFF;
}
.catalogFlex{
    display: flex;
    justify-content: space-between;
    background: #212121;
    padding-left: 44px;
 
}
.catalogLeft h5{
    font-family: "Oswald", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 10%;
    color: #FF4655;
    padding-top: 45px;
    padding-bottom: 31px;
}
.catalogLeft h2{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 38px;
    line-height: 46px;
    width: 580px;
    color: #FFFFFF;
    
}
.catalogLeft p{
    padding-top: 16px;
    padding-bottom: 25px;
    font-family: "Oswald", sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #666666;
    width: 603px;
}
.catalogBtn a{
    padding: 13px 31px;
    background: #121212;
    color: #FFFFFF;
    font-family: "Oswald", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    transition: 0.4s;
}
.catalogBtn a:hover{
    background: #FFFFFF;
    color: #121212;
}
.catalogRight{
    padding-right: 111px;
    padding-bottom: 42px;
    padding-top: 42px;
}
.catalogRight:hover img{
    transform: scale(1.03);
}
/* Top Games Part End  */
/* Purchase Part Start  */
#purchasePart{
    padding-top: 90px;
    padding-bottom: 90px;
    background: #121212;
}
.purchaseHead h3{
    width: 446px;
    font-family: "Oswald", sans-serif;
    font-weight: 600;
    font-size: 38px;
    letter-spacing: 7%;
    color: #FFFFFF;
    line-height: 56px;
    position: relative;
    display: inline-block;
}
.purchaseHead h3::after{
    position: absolute;
    height: 3px;
    width: 120px;
    background: #FF4655;
    content: "";
    bottom: 10px;
    margin-left: 11px;
}
.purchaseFlex{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.purchaseItem{
    padding: 23px 37px;
    background: #212121;
    margin-top: 102px;
    position: relative;
    
}
.purchaseItem:hover{
    transform: scale(1.03);
}
.leftSlide{
    position: absolute;
    margin-top: 110px;
    margin-left: -30px;
    z-index: 2;
}
.rightSlide{
    position: absolute;
    margin-top: 110px;
    z-index: 2;
    margin-left: 1350px;
}
.leftSlide:hover svg{
    fill: #FF4655;
}
.rightSlide a:hover{
    color: #FF4655;
    
}
.purchaseItem h4{
    font-family: "Oswald", sans-serif;
    font-weight: 500;
    font-size: 40px;
    line-height: 59px;
    letter-spacing: 1%;
    color: #FFFFFF;
    text-align: center;
    padding-bottom: 7px;
}
.purchaseItem h5{
    font-family: "Oswald", sans-serif;
    font-weight: 600;
    font-size: 25px;
    line-height: 37px;
    color: #FFFFFF;
    text-align: center;
    padding-top: 45px;
}
.purchaseItem h6{
    font-family: "Oswald", sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #FF4655;
    padding-top: 7px;
    text-align: center;
}
/* Purchase Part End  */
/* Team Part Start  */
#teamPart{
    padding-top: 100px;
    padding-bottom: 100px;
    background: #191919;
}
.teamHead{
    display: flex;
    justify-content: flex-end;
    margin-right: 10px;
}
.teamHead h3{
    font-family: "Barlow Condensed", sans-serif;
    font-size: 38px;
    font-weight: 600;
    letter-spacing: 7%;
    line-height: 46px;
    width: 449px;
    color: #FFFFFF;
    text-align: end;
    position: relative;
    display: inline-block;
}
.teamHead h3::before{
    position: absolute;
    height: 3px;
    width: 105px;
    background: #FF4655;
    content: "";
    bottom: 6px;
    margin-left: 230px;
}
.teamFlexOne{
    display: flex;
    justify-content: space-between;
    padding-top: 50px;
    padding-bottom: 30px;
    position: relative;
}
.teamFlexTwo{
    display: flex;
    justify-content: space-between;
    position: relative;
}
.teamFlexOne img{
    filter: grayscale(100%);
    transition: filter 0.4s ease;
}
.teamFlexOne img:hover{
    filter: grayscale(0%);
    transform: scale(1.05);
}
.teamFlexTwo img{
    filter: grayscale(100%);
    transition: filter 0.4s ease;
}
.teamFlexTwo img:hover{
    filter: grayscale(0%);
    transform: scale(1.05);
}
.teamItemHead h3{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 30px;
    color: #FFFFFF;
    position: absolute;
    margin-top: -45px;
    margin-left: 20px;
    transition: opacity 0.3s ease;
}
.teamItem:hover .teamItemHead h3{
    opacity: 0;

}
.teamItemHover{
    position: absolute;
    padding: 40px 58px;
    background: transparent;
    margin-top: -204px;
    margin-left: -16px;
    width: 683px;
    opacity: 0;
    pointer-events: none;  /* Prevents interaction when hidden */
    transition: opacity 0.3s ease;
}
.teamItem:hover .teamItemHover {
    opacity: 1;
    pointer-events: auto;  /* Allows interaction when shown */
}
.teamItemHover h4{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 30px;
    color: #FFFFFF;
}
.teamItemHover p{
    width: 300px;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
    margin-top: 6px;
    margin-bottom: 20px;
}
.teamBtn a{
    padding: 4px 20px;
    background: #FF4655;
    color: #FFFFFF;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
}
.teamSocialFlex{
    display: flex;
    justify-content: space-between;
}
.teamSocial a{
    margin-left: 20px;
    font-size: 25px;
}
.facebook{
    color: #FF4655;
}
.linkedin{
    color: #FF4655;
}
.twitter{
    color: #FF4655;
}
/* Team Part End  */
/* FAQ Part Start  */
#faqPart{
    padding-top: 55px;
    background: #121212;
    position: relative;
}
.faqNum a{
    padding: 15px 30px;
    background: #FF4655;
    color: #FFFFFF;
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 38px;
}
.faqHead h3{
    width: 493px;
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 38px;
    letter-spacing: 10%;
    color: #FFFFFF;
    line-height: 46px;
    position: relative;
    display: inline-block;
}
.faqHead h3::after{
    position: absolute;
    height: 3px;
    width: 120px;
    background: #FF4655;
    content: "";
    bottom: 10px;
    margin-left: 11px;
}
.faqFlexOne{
    display: flex;
    justify-content: space-between;
    padding-top: 92px;
    padding-bottom: 76px;
}
.faqFlexTwo{
    display: flex;
    justify-content: space-between;
    padding-top: 76px;
    padding-bottom: 170px;
}
.faqItem{
    display: flex;
    justify-content: space-between;
    position: relative

}
.faqItem img{
    height: 70px;
    width: 70px;
}
.faqText{
    padding-left: 42px;
}
.faqText h6{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 22px;
    color: #FFFFFF;
    transition: 0.4s;
}
.faqText h6:hover{
    color: #FF4655;
}
.faqText p{
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    line-height: 24px;
    width: 427px;
    padding-top: 11px;
}
.rowTop{
    width: 1px;
    background: #666666;
    height: 369px;
    position: absolute;
    margin-left: 675px;
    margin-top: -16px;
}
.column{
    width: 1370px;
    background: #666666;
    height: 1px;
    position: absolute;
    margin-top: 172px;
}
/* FAQ Part End  */
/* Footer Part Start  */
#footerPart{
    padding-top: 112px;
    background: #191919;
    padding-bottom: 70px;
    position: relative;
}
.footerFlex{
    display: flex;
    justify-content: space-between;
    padding-top: 50px;
}
.footerItem p{
    padding-top: 30px;
    padding-bottom: 60px;
    width: 451px;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #666666;
    text-transform: uppercase;
}
.footerSocial a{
    margin-left: 10px;
    color: #FFFFFF;
    font-size: 30px;
    
}
.footerSocial a:hover{
    color: #FF4655;
}
.footerItem h4{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 25px;
    letter-spacing: 7%;
    color: #FFFFFF;
}
.footerItem ul li a{
    display: block;
    padding-top: 30px;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    transition: 0.4s;
}
.footerItem ul li a:hover{
    color: #FF4655;
}
.galleryHead{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 25px;
    letter-spacing: 7%;
    color: #FFFFFF;
    padding-bottom: 30px;
    margin-right: 227px;
}
.galleryFlexOne{
    display: flex;
    justify-content: space-between;
    margin-right: 4px;
}
.galleryFlexOne img{
    width: 102px;
    height: 102px;
}
.galleryFlexTwo img{
    width: 102px;
    height: 102px;
}
.galleryFlexTwo{
    display: flex;
    justify-content: space-between;
    padding-top: 5px;
}
.footerTopF{
    padding: 35px 30px;
    background: #FF4655;
    position: absolute;
    display: flex;
    justify-content: space-between;
    margin-top: -197px;
    align-items: center;
    width: 1370px;
}
.footerTopF h3{
    text-transform: uppercase;
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    font-size: 40px;
    color: #FFFFFF;
    line-height: 48px;
    width: 720px;
}
.form input{
    border: none;
    border-radius: 30px;
    padding: 15px 0px;
    width: 410px;
    color: #666666;
    font-size: 16px;
    font-weight: 500;
    font-family: "Barlow Condensed", sans-serif;

}
.form button{
    position: absolute;
    border: none;
    border-radius: 30px;
    padding: 15px 40px;
    background: #121212;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 500;
    font-family: "Barlow Condensed", sans-serif;
    left: 87.55%;
}
/* Footer Part End  */
/* END Part Start  */
#endPart{
    padding-top: 25px;
    background: #191919;
    position: relative;

}
.endColumn{
    width: 1370px;
    background: #666666;
    height: 1px;
    position: absolute;
}
.endText{
    display: inline-block;
    padding-top: 50px;
}
.endText{
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 400;
    font-size: 20px;
    margin-left: 523px;
}
/* END Part End  */