body{
    background-image: url("../Summer_In_The_City_Artwork_8.webp");
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0%;

}

.content{
    background-color: rgb(29, 29, 29);
    width: 900px;
    margin-top: 125px;
    height: 790px;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    position: relative;
}

.avatar{
    margin-top: 25px;
    margin-left: 25px;
    transform: translate(-172px, 0px);
}

.main{
    font-family: sans-serif;
    font-weight: 600;
    color: white;
    margin-top: 45px;
    font-size: 25px;
    transform: translateX(-41px);
}

.avtr{
    border-radius: 150px;
    width: 150px;
    height: 150px;
    transform: translate(346px, -102px);
    background-color: rgb(29, 29, 29);
}

.main-top{
    display: flex;
    align-items: center;
}

.description{
    transform: translateX(75px);
    color: gray;
    font-weight: 500;
    font-size: 20px;
}

.play{
    transform: scale(0.12);
    margin-left: 7px;
}

.hide{
    display: none;
    transform: scale(0.12);
}

.description-2{
    transform: translateX(-119px);
    color: rgb(170, 170, 170);
    font-weight: 500;
    font-size: 20px;
    text-align: center;
    margin-top: 15px;
}

.main-text{
    margin-top: 75px;
}

.button{
    background-color: white;
    border-radius: 50px;
    border: none;
    cursor: pointer;
    width: 65px;
    height: 65px;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 517px;
    left: 1125px;
    z-index: 9999;
    filter: drop-shadow(0px 0px 50px rgba(0, 0, 0, 0.5));
    position: absolute;
}

.main-two{
    font-family: sans-serif;
    font-weight: 600;
    color: white;
    margin-top: 45px;
    font-size: 25px;
    transform: translateX(15px);
    text-align: center;
}

.main-text1{
    font-size: 20px;
}

.telegram{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    height: 35px;
    fill: rgba(104, 104, 104, 255);
}

.telegram:hover{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    fill: rgba(120, 120, 120, 255);
    cursor: pointer;
}

.discord{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    opacity: 0.75;
    fill: rgba(104, 104, 104, 255);
}

.discord:hover{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    opacity: 1;
    fill: rgba(120, 120, 120, 255);
    cursor: pointer;
}

.social{
    display: flex;
    align-items: center;
    transform: translate(17px, -87px);
}

.steam{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    opacity: 0.75;
    fill: rgba(104, 104, 104, 255);
}

.steam:hover{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    opacity: 1;
    fill: rgba(120, 120, 120, 255);
    cursor: pointer;
}

.github{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    opacity: 0.75;
    fill: rgba(104, 104, 104, 255);
}

.github:hover{
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    opacity: 1;
    fill: rgba(120, 120, 120, 255);
    cursor: pointer;
}

.border{
    display: flex;
    text-align: center;
    font-size: 20px;
    border-radius: 32px;
    border-color: rgba(106, 106, 106, 0.5);
    border-width: 2px;
    align-items: center;
    white-space: nowrap;
    border-style: solid;
    padding: 7px;
    width: 250px;
}

.borderzov{
    display: flex;
    background-color: rgba(204, 173, 19, 0.268);
    text-align: center;
    font-size: 20px;
    border-radius: 32px;
    border-color: rgb(205, 215, 18);
    border-width: 2px;
    align-items: center;
    white-space: nowrap;
    border-style: solid;
    padding: 7px;
    width: 250px;
}

.margin{
    margin-top: 15px;
}

.text{
    margin-left: 15px;
    margin-bottom: 15px;
}

.textzov{
    transform: translateX(15px);
    margin-bottom: 15px;
}

.owner{
    transform: translate(-83px, -30px);
    color: rgb(179, 179, 179);
    font-weight: 600;
    font-size: 15px;
}

.zovmemb{
    transform: translate(-172px, 23px);
    margin-left: 15px;
    margin-bottom: 15px;
    color: rgb(179, 179, 179);
    font-weight: 600;
    font-size: 15px;
}

.members{
    margin-left: 15px;
    margin-bottom: 15px;
    color: rgb(179, 179, 179);
    transform: translate(0px, 0px);
    font-weight: 600;
    font-size: 15px;
}

.members-left{
    transform: translate(-227px, 23px)
}

.members-right{
    transform: translate(-187px, 23px)
}

.servers{
    transform: translate(-158px, 23px)
}

.project-image{
    width: 100px;
    height: 100px;
    border-radius: 25px;
}

.current-role{
    color: rgb(179, 179, 179);
    transform: translate(0px, 0px);
    font-weight: 600;
    font-size: 15px;
}

.moderator{
    transform: translate(-130px, -31px);
    font-weight: 600;
    font-size: 15px;
}

.creator{
    transform: translate(-52px, -30px);
}

.curator{
    transform: translate(-116px, -30px)
}

.project-top{
    display: flex;
    align-items: center;
}

.project-bottom{
    display: flex;
    align-items: center;
}

.left{
    margin-left: 25px;
}

.projects{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.guild-archive{
    margin-top: 15px;
}