            * 
            {
                margin:02%;
                padding: 0%;
                
                margin-top: 0.1rem;
                box-sizing: border-box;
            }
            
            body {
                background-color:#ffba93;
                background-image: linear-gradient(310deg, rgb(41, 18, 18) 1%);
                display: inline-flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                font-family: "Poppins", sans-serif;
                padding-left: 3px;
                max-width: 570px;
                min-height: 100px;
            }

            .repo {
                font-weight: bold;
                margin-left: -1.9rem;
                margin-top: +3rem;
                width: 329px;
                background-color: #8f384d;
                text-align: center;
                display:inline-block;
                color: #ffba93;
                font-size: 1rem;
                padding: 0.25rem 1.9rem;
                text-decoration: none;
            }
            
            input {
                background-color: #8f384d;
                border-radius: 10px;
                border: none;
                box-shadow: 0 5px 10px rgba(154, 160, 185, 0.05),
                    0 15px 40px rgba(0, 0, 0, 0.1);
                color: white;
                font-family: inherit;
                font-size: 1rem;
                padding: 1rem;
                margin-bottom: 6rem;
                margin-left: -0.7rem;
            }

            input::placeholder {
                color: rgb(15, 6, 6);
            }

            input:focus {
                outline: coral;
            }
            .container{
                background-color: #4c2885;
                background-image: linear-gradient(315deg, #4c2885 0%, #4c11ac 100%);
                border-radius: 20px;
                box-shadow: 0 5px 10px rgba(154, 160, 185, 0.05),
                    0 15px 40px rgba(0, 0, 0, 0.1);
                display: block;
                padding: 3rem;
                margin-left: -0.7rem;
                margin-top: -6rem;
                max-width: 369px;
                box-shadow: 1px 1px 10px 2px rgba(1, 1, 1, 1);
                
            }

            .user-info {
                color: #eee;
                margin-left: -0.5rem;
                margin-top: -5rem;
                width: 200px;
                height: 200px;
                font-size: 100%;
            }
            .avatar {
                border: 10px solid #2a2a72;
                border-radius: 50%;
                position: relative;
                height: 150px;
                width: 150px;
                margin-top: -2.5rem;
                margin-left: -2.2rem;
            }

            .user-info h2 {
                font-size: 25px;
                position: absolute;
                width: 150px;
                margin-top: -2.5rem;
                margin-left: +9.0rem;
                text-align: center;
            }
            .user-info p {
                position: absolute;
                margin-top: +7rem;
                margin-left: +1rem;
                width: 250px;
                height: 40px;
                text-align: center;
            }

            .user-info ul {
                display: flex;
                justify-content: space-between;
                list-style-type: none;
                padding: 0;
                max-width: 400px;
            }

            .user-info ul p {
                display: flex;
                align-items: center;
                position: absolute;
                margin-top: +4rem;
                margin-left: -1.5rem;
            }

            
