@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

body {
	background: linear-gradient(-45deg, #ced108, #23d5d5, #07526d,#012c31);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
	height: 100vh;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
            .content-4-1 .btn:focus,
            .content-4-1 .btn:active {
                outline: none !important;
            }

            .content-4-1 .width-left {
                width: 0%;
            }

            .content-4-1 .width-right {
                width: 100%;
                height: 100%;
                padding: 8rem 2rem;
                background-color: #fcfdff;
            }

            .content-4-1 .centered {
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
            }

            .content-4-1 .right {
                width: 100%;
            }

            .content-4-1 .title-text {
                font: 600 1.875rem/2.25rem Poppins, sans-serif;
                margin-bottom: 0.75rem;
            }

            .content-4-1 .caption-text {
                font: 400 0.875rem/1.75rem Poppins, sans-serif;
                color: #a8adb7;
            }

            .content-4-1 .input-label {
                font: 500 1.125rem/1.75rem Poppins, sans-serif;
                color: #39465b;
            }

            .content-4-1 .div-input {
                font: 300 1rem/1.5rem Poppins, sans-serif;
                padding: 1rem 1.25rem;
                margin-top: 0.75rem;
                border-radius: 0.75rem;
                border: 1px solid #cacbce;
                color: #2a3240;
                transition: 0.3s;
            }

            .content-4-1 .div-input:focus-within {
                border: 1px solid #2ec49c;
                color: #2a3240;
                transition: 0.3s;
            }

            .content-4-1 .div-input input::placeholder {
                color: #cacbce;
                transition: 0.3s;
            }

            .content-4-1 .div-input:focus-within input::placeholder {
                color: #2a3240;
                outline: none;
                transition: 0.3s;
            }

            .content-4-1 .div-input .icon-toggle-empty-4-1 path,
            .content-4-1 .div-input:focus-within .icon path {
                transition: 0.3;
                fill: #2ec49c;
                transition: 0.3s;
            }

            .content-4-1 .input-field {
                font: 300 1rem/1.5rem Poppins, sans-serif;
                width: 100%;
                background-color: #fcfdff;
                transition: 0.3s;
            }

            .content-4-1 .input-field:focus {
                outline: none;
                transition: 0.3s;
            }

            .content-4-1 .forgot-password {
                font: 400 0.875rem/1.25rem Poppins, sans-serif;
                color: #abaec3;
                transition: 0.3s;
                text-decoration: none;
            }

            .content-4-1 .forgot-password:hover {
                color: #2a3240;
            }

            .content-4-1 .btn-fill {
                font: 500 1.25rem/1.75rem Poppins, sans-serif;
                background-image: linear-gradient(rgba(91, 203, 173, 1),
                        rgba(39, 194, 153, 1));
                padding: 0.75rem 1rem;
                margin-top: 2.25rem;
                border-radius: 0.75rem;
                transition: 0.5s;
            }

            .content-4-1 .btn-fill:hover {
                background-image: linear-gradient(#2ec49c, #2ec49c);
                transition: 0.5s;
            }

            .content-4-1 .bottom-caption {
                font: 400 0.875rem/1.25rem Poppins, sans-serif;
                margin-top: 2rem;
                color: #2a3240;
            }

            .content-4-1 .green-bottom-caption {
                color: #2ec49c;
                font-weight: 500;
            }

            .content-4-1 .green-bottom-caption:hover {
                color: #2ec49c;
                cursor: pointer;
                text-decoration: underline;
            }

            @media (min-width: 576px) {
                .content-4-1 .width-right {
                    padding: 8rem 4rem;
                }

                .content-4-1 .right {
                    width: 58.333333%;
                }
            }

            @media (min-width: 768px) {
                .content-4-1 .right {
                    width: 66.666667%;
                }
            }

            @media (min-width: 992px) {
                .content-4-1 .width-left {
                    width: 48%;
                }

                .content-4-1 .width-right {
                    width: 52%;
                }

                .content-4-1 .right {
                    width: 75%;
                }
            }

            .py-6 {
                padding-top: 6rem !important;
                padding-bottom: 6rem !important;
            }

            @media (min-width: 1200px) {
                .content-4-1 .right {
                    width: 58.333333%;
                }
            }

            .clock {
                color: #333;
                /*text-align: center;
                padding: 20px;
                margin-top: 20%;*/
            }