*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
}


body{

    overflow:hidden;
    background:#000;

}


/* TŁO */

.background{

    position:fixed;

    top:-5%;
    left:-5%;

    width:110%;
    height:110%;

    background:url("background.jpg") center/cover;

    filter:blur(12px);

    z-index:-2;

    transition:.25s ease-out;

}



.overlay{

    position:fixed;

    inset:0;

    background:
    rgba(0,0,0,.55);

    z-index:-1;

}



/* GŁÓWNY KONTENER */


.container{

    height:100vh;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

}



/* NAPIS */


.title{

    font-size:95px;

    font-weight:800;

    color:white;

    letter-spacing:6px;

    margin-bottom:45px;


    text-shadow:

    0 0 20px #FF265D,

    0 0 45px rgba(173,0,48,.7);

}



/* GLASS */


.glass{

    width:700px;

    max-width:90%;


    padding:45px;


    border-radius:30px;


    background:

    linear-gradient(

    145deg,

    rgba(255,255,255,.13),

    rgba(255,255,255,.05)

    );


    backdrop-filter:blur(25px);

    -webkit-backdrop-filter:blur(25px);



    border:

    1px solid rgba(255,255,255,.18);



    box-shadow:


    0 30px 80px rgba(0,0,0,.5),


    inset 0 1px rgba(255,255,255,.25),


    0 0 60px rgba(61,141,255,.2);



    text-align:center;

}




.text{

    color:white;

    font-size:18px;

    line-height:1.7;

    margin-bottom:35px;

}



/* PASEK */


.progress{


    width:100%;

    height:18px;


    background:

    rgba(255,255,255,.1);


    border-radius:100px;


    overflow:hidden;


    margin-bottom:35px;


}



.bar {

    position: relative;

    width: 55%;
    height: 100%;

    border-radius: 100px;


    background:
    linear-gradient(
        90deg,
        #FA1B70,
        #FF3D87
    );


    box-shadow:

    0 0 20px #FA1B70,
    0 0 40px rgba(194,0,80,.7);


    animation:
    moveLoading 2.5s linear infinite;



}

@keyframes moveLoading {

    0% {

        transform: translateX(-120%);

    }


    100% {

        transform: translateX(220%);

    }

}


/* DISCORD */


.discord{


    display:flex;

    align-items:center;

    justify-content:center;


    gap:12px;


    width:max-content;


    margin:auto;



    padding:

    16px 45px;



    border-radius:16px;


    color:white;

    text-decoration:none;


    font-size:18px;

    font-weight:600;



    background:

    linear-gradient(

    135deg,

    #5865F2,

    #3a9dff

    );



    box-shadow:

    0 0 30px rgba(88,101,242,.6);



    transition:.25s;

}



.discord i{

    font-size:25px;

}



.discord:hover{


    transform:

    translateY(-4px)

    scale(1.04);


    box-shadow:

    0 0 50px rgba(88,101,242,.9);


}



/* MOBILE */


@media(max-width:700px){


.title{

    font-size:55px;

}


.glass{

    padding:30px;

}


}