.left-bg {
        background: #4e54c8;
        /* fallback for old browsers */
        background: -webkit-linear-gradient(to right, #3e48ff, #4e54c8);
        /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to right, #3e48ff, #4e54c8);
        /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    }
    
    .right-bg {
        background: #ff00cc;
        /* fallback for old browsers */
        background: -webkit-linear-gradient(to right, #e8e8ff, #f6c5ec);
        /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to right, #e8e8ff, #f6c5ec);
        /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        scroll-behavior: smooth;
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */
    }
    
    .right-bg ::-webkit-scrollbar {
        display: none;
    }
    
    .Asvin-text-color {
        color: #ceedf7;
    }
    
    .pointer {
        cursor: pointer;
    }
    
    .hide-scrollbar ::-webkit-scrollbar {
        display: none;
    }
    
    .p-name {
        transition: all ease-in-out 500ms;
        position: absolute;
        top: 85%;
        left: 10px;
        font-size: 1.3rem;
    }
    
    .p-link {
        transition: all ease-in-out 500ms;
        position: absolute;
        top: 82%;
        left: 65%;
    }
    
    .project-card {
        height: 350px;
        border-radius: 30px;
    }
    
    .gradient-bg-2 {
        background-image: linear-gradient(to right, #43e97b 0%, #38f9d7 100%);
    }
    
    .border-color-2 {
        border: 2px solid #43e97b;
    }
    
    .gradient-bg-3 {
        background-image: linear-gradient(to top, #30cfd0 0%, #330867 100%);
        color: white;
    }
    
    .border-color-3 {
        border: 2px solid #330867;
    }
    
    .gradient-bg-4 {
        background-image: linear-gradient(180deg, #2af598 0%, #009efd 100%);
    }
    
    .border-color-4 {
        border: 2px solid #2af598;
    }
    
    .gradient-bg-5 {
        background-image: linear-gradient(to right, #6a11cb 0%, #2575fc 100%);
        color: white;
    }
    
    .border-color-5 {
        border: 2px solid #6a11cb;
    }
    
    .gradient-bg-6 {
        background-image: linear-gradient(120deg, #f093fb 0%, #f5576c 100%);
        color: #000000;
    }
    
    .border-color-6 {
        border: 2px solid #f5576c;
    }
    
    .gradient-bg-7 {
        background-image: linear-gradient(to right, #fa709a 0%, #fee140 100%);
        color: #000000;
    }
    
    .border-color-7 {
        border: 2px solid #fee140;
    }
    
    .gradient-bg-8 {
        background-image: linear-gradient(120deg, #89f7fe 0%, #66a6ff 100%);
        color: #000000;
    }
    
    .border-color-8 {
        border: 2px solid #66a6ff;
    }
    
    .gradient-bg-9 {
        background-image: linear-gradient(to top, #c471f5 0%, #fa71cd 100%);
        color: #000000;
    }
    
    .border-color-9 {
        border: 2px solid #fa71cd;
    }
    
    .gradient-bg-1 {
        background-image: linear-gradient(to top, #0ba360 0%, #3cba92 100%);
        color: #000000;
    }
    
    .border-color-1 {
        border: 2px solid #0ba360;
    }
    
    .project-card-body {
        transition: all 0.5s;
        border-radius: 30px;
        top: 58%;
        left: -3px;
        height: 65%;
        width: 108%;
        transform: skew(19deg, -9deg);
    }
    
    .admin-box {
        position: absolute;
        top: 2%;
        right: 5%;
    }
    
    .admin-box span {
        position: relative;
        background-color: black;
        color: white;
        padding: 3px 7px;
        border-radius: 20px;
        border: 2px solid #FFD700;
        font-size: 0.76rem;
    }
    
    .admin-box span::after {
        position: absolute;
        content: "";
    }
    
    .project-card-initial {
        height: 55px;
        width: 55px;
        border-radius: 10px;
        background-color: #fff;
        overflow: hidden;
        box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.7);
        transform: skew(-19deg, 9deg);
        margin-top: -4%;
        margin-left: 20%;
    }
    
    .Project-card-name {
        transform: skew(-19deg, 9deg);
        margin-left: 43%;
        margin-top: -5%;
    }
    
    .project-card-name p {
        font-size: 100%;
    }
    
    .project-card-desc {
        transform: skew(-19deg, 9deg);
        margin-left: 30%;
    }
    
    .project-card-desc span {
        max-width: 80%;
    }
    
    .project-card-bottom {
        transform: skew(-19deg, 9deg);
    }
    
    .skill-round {
        background-color: white;
        width: 20px;
        height: 20px;
        /* border-radius: 10px; */
    }
    
    .project-card-go-link {
        font-size: 80%;
    }
    /* malkcdsjcoids */
    
    @media only screen and (max-width: 600px) {
        .full-height {
            height: 100%;
        }
        .section-height {
            height: 100%;
        }
        .project-lists {
            height: 100px;
        }
        .right-bg {
            background: white;
        }
        .project-card-body {
            top: 64%;
        }
        .project-card {
            height: 450px;
        }
        .Project-card-name {
            margin-top: 0%;
        }
    }
    
    @media only screen and (min-width: 600px) {
        .full-height {
            height: 100%;
        }
        .section-height {
            height: 95dvh;
        }
        .project-card {
            height: 480px;
        }
        .project-lists {
            height: 70%;
        }
        .project-card-body {
            top: 64%;
        }
        .project-card {
            height: 450px;
        }
        .Project-card-name {
            margin-top: 0%;
        }
    }
    
    @media only screen and (min-width: 768px) {
        .project-card {
            height: 350px;
        }
        .section-height {
            height: 94dvh;
        }
        .project-lists {
            height: 80%;
        }
        .project-lists::-webkit-scrollbar {
            display: none;
        }
        .project-card-body {
            top: 58%;
        }
        .Project-card-name {
            margin-top: 0%;
        }
    }
    
    @media only screen and (min-width: 992px) {
        .hi {
            height: 100px;
        }
        .Project-card-name {
            margin-top: 0%;
        }
        .project-card-body {
            top: 55%;
        }
    }
    
    @media only screen and (min-width: 1200px) {
        .hi {
            height: 100px;
        }
    }