body,html{
    padding:0;
    margin:0;

}
header{
    position: relative;
}
.personal{
    position: absolute;
    transform:rotate(-20deg);
    color: black;
    font-size: large;
    bottom:150px;
    margin-left:20px;
}
.personal .advan{
 margin-left:30% !important;
}
.personal .main{
    position:relative;
    animation:main 5s forwards;
    transform:scale(0);
    transition:all ease-in-out;
    opacity:0;
}

@keyframes main {
     from{
        transform:scale(0);
        opacity:0;
     }
     to{
        transform: scale(1);
        opacity:1;
     }
}
.menu{
    background:url("img/R.jpeg") no-repeat center center/cover;
    height:90vh;
}
.left{
    margin-right:22% !important;
}
button.pan{
    color: grey !important;
}
.grid{
   display:flex !important;
   flex-direction: column !important;
}
button.pan:hover{
    opacity:0.5 !important;
}
.rect .card{
    border-radius:20px !important;
}
.rect img{
    border-radius:20px;
}
.divide{
    display:flex;
    gap:30px;
}
.cul{
    color:black ;
}
.cul:hover{
    color:white
}
.team .card{
    position: relative !important;
    margin-top:20px !important;
    margin-bottom:20px !important;
    width:420px !important;
    border-radius:10px !important;
}
.team .card::after{
    position:absolute;
    z-index:-1;
    width: 100%;
    height:100%;
    top:50%;
    left:50%;
    background-image:conic-gradient(blue,green,yellow);
    translate: -50% -50%;
    z-index: -1;
    content:"";
    filter: blur(10px);
}

.glow{
    position:relative !important;
    padding:2rem;
}
.glow:after{
    content: "" !important;
    z-index:-1 !important;
    position:absolute !important;
    width:100% !important;
    height:100% !important;
    top:50% !important;
    left:50% !important;
    translate:-50% -50% !important;
    background-image:conic-gradient(yellow,green,blue,pink,red,white) !important;
    filter: blur(100px);
}
.grid{
    display:grid !important;
    grid-template-columns: repeat(3,1fr);
    justify-content:center;
    align-items:center;
}
@media (max-width:1000px) {
    .personal{
        position: absolute;
        transform:rotate(-20deg);
        color: black;
        font-size: large;
        bottom:100px;
    }
    .personal .advan{
     margin-left:30% !important;
    }
    .personal .main{
        position:relative;
        animation:main 5s forwards;
        transform:scale(0);
        transition:all ease-in-out;
        opacity:0;
    }
    
    @keyframes main {
         from{
            transform:scale(0);
            opacity:0;
         }
         to{
            transform: scale(1);
            opacity:1;
         }
    }
    .left{
        margin-right:none !important;
    }  
    .frid{
        display: grid !important;
        grid-template-columns: repeat(2,4fr) !important;
        justify-content:center;
        align-content: center;
    }
    .grid{
        display:grid !important;
        grid-template-columns: repeat(1,1fr);
        justify-content:center;
        gap:20px !important;
        align-items:center;
        margin-left:20% !important;
    }
    .card-3{
        position: relative;
        padding:2rem;
        width:390px;
        margin-left:40px;
    }
    .frid .pan{
        margin-left:30% !important;
    }
    .frid .van{
        margin-left:35% !important;
    }
    .frid .lan{
        margin-left:40% !important;
    }
}