body {
    margin: 0 auto;
    min-width: 960px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(180deg, #8A38C8, #101010, #101010, #101010, #101010);
    color: #fff;
    font-family: Arial, sans-serif;
}
.container {
    align-items: center;
    width: 50%;
    margin-left: 5%;
}
.header {
    padding: 25px;
}
.box1 {
    padding-bottom: 5%;
}
.box2 {
    padding-bottom: 3%;
}
img {
  height: auto; /* Ensures the image maintains its aspect ratio */
  width: auto; /* Ensures the image maintains its aspect ratio */
  transition: all 0.2s ease-in-out;
}
.footer {
    padding-bottom: 5%;
}
.positions {
    padding-left: 25px;
    padding-right: 25px;
    padding-bottom: 25px;
    margin-left: -10%;
}
.posmanager {
    padding-bottom: 3%;
    padding-top: 3%;
}
.posdev {
    padding-left: 35%;
    padding-bottom: 3%;
    padding-top: 3%;
}
.posadmin {
    padding-bottom: 3%;
    padding-top: 3%;
}
.posartist {
    padding-left: 35%;
    padding-bottom: 3%;
    padding-top: 3%;
}
.pospr {
    padding-bottom: 3%;
    padding-top: 3%;
}
.posbuilder {
    padding-left: 35%;
    padding-bottom: 3%;
    padding-top: 3%;
}
.postester {
    padding-bottom: 3%;
    padding-top: 3%;
}
.logo {
    height: 275px;
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
    transition: all 0.3s ease;
    text-align: center;
    padding: 1rem;
    position: relative;
    overflow: hidden;
    margin-left: -8%;
}
.logo:hover {
    transform: scale(1.1);    
}
img .logo {
    max-height: 200px;
}
.hovbox{

}
.hovbox:hover {
    transform: scale(1.15);
    border-radius: 30px;
    color: rgb(142, 56, 212);
    box-shadow: 0 0 20px rgb(142, 56, 212);
}
.hovmanager{

}
.hovmanager:hover {
    transform: scale(1.15);
    border-radius: 30px;
    color: rgb(28, 126, 255);
    box-shadow: 0 0 20px rgb(28, 126, 255);
}
.hovdev{

}
.hovdev:hover {
    transform: scale(1.15);
    border-radius: 30px;
    color: rgb(0, 218, 170);
    box-shadow: 0 0 20px rgb(0, 218, 170);
}
.hovadmin {

}
.hovadmin:hover {
    transform: scale(1.15);
    border-radius: 30px;
    color: rgb(219, 0, 0);
    box-shadow: 0 0 20px rgb(219, 0, 0);
}
.hovart{

}
.hovart:hover {
    transform: scale(1.15);
    border-radius: 30px;
    color: rgb(0, 245, 245);
    box-shadow: 0 0 20px rgb(0, 245, 245);
}
.hovpr{

}
.hovpr:hover {
    transform: scale(1.15);
    border-radius: 30px;
    color: rgb(219, 0, 208);
    box-shadow: 0 0 20px rgb(219, 0, 208);
}
.hovbuilder{

}
.hovbuilder:hover {
    transform: scale(1.15);
    border-radius: 30px;
    color: rgb(33, 0, 219);
    box-shadow: 0 0 35px rgb(33, 0, 219);
}
.hov7{
    cursor: zoom-in;
}
.hov7:hover {
    transform: scale(1.15);
}
.cursor-box::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;

    top: -100%;
    left: -100%;
    transition: all 0.5s ease;
}

.cursor-box:hover::before {
    top: 100%;
    left: 100%;
}
.zoom-in {

}
.zoom-in:hover {
    transform: scale(1.15);
}