@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800&display=swap');

                * {
                    margin: 0px;
                    padding: 0px;
                    box-sizing: border-box;
                    font-family: 'Inter', sans-serif;
                }
                body {
                    width: 100%;
                    height: auto;
                }


                nav {
                    width: 100%;
                    padding: 25px 0px;
                    display: flex;
                    justify-content: center;
                    background-color: #fbf8f3;
                }
                nav .nav-main {
                    width: 80%;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    position: relative;
                }

                nav .nav-main .nav-logo a, footer .footer-main .footer-content .footer-1 .footer-1-logo  {
                    text-decoration: none;
                    font-size: 24px;
                    font-weight: 700;
                    color: #000;
                }

                nav .nav-main .nav-mobile-menu {
                    display: none;
                    cursor: pointer;
                }
                nav .nav-main .nav-mobile-menu img {
                    width: 100%;
                    display: block;
                }

                nav .nav-main ul {
                    display: flex;
                    list-style-type: none;
                    align-items: center;
                }
                nav.mobile-menu {
                    padding: 0px 15px;
                    display: none;
                }
                nav.mobile-menu.active {
                    display: block;
                }
                nav.mobile-menu ul {
                    display: flex;
                    flex-direction: column;
                    list-style: none;
                    width: 100%;
                }
                nav.mobile-menu ul:first-child {
                    padding-bottom: 10px;
                    border-bottom: 1px solid #4f4f4f42;
                }
                nav.mobile-menu ul:last-child {
                    padding-top: 10px;
                }
                nav.mobile-menu ul:last-child li:last-child {
                    margin-top: 10px;
                }
                nav .nav-main ul li, nav.mobile-menu ul li {
                    border-radius: 5px;
                }
                nav .nav-main ul li a, nav.mobile-menu ul li a {
                    text-decoration: none;
                    display: block;
                    font-size: 15px;
                    font-weight: 400;
                    color: #000;
                    padding: 12px 15px;
                    border-radius: 5px;
                    transition: .2s background ease;
                }
                nav .nav-main ul li a:hover, nav.mobile-menu ul li a:hover {
                    background: rgb(128 128 128 / 23%);
                }
                nav .nav-main ul:last-of-type li:first-child a, nav.mobile-menu ul:last-of-type li:first-child a {
                    font-weight: 600;
                }
                nav .nav-main ul:last-of-type li:last-child a, nav.mobile-menu ul:last-of-type li:last-child a {
                    color: #fff;
                    font-weight: 600;
                    background-color: rgb(202, 3, 3);
                    margin-left: 10px;
                }




                footer {
                    width: 100%;
                    padding: 50px 0px 50px 0px;
                    display: flex;
                    justify-content: center;
                    background-color: #fbf8f3;
                }
                footer .footer-main {
                    width: 80%;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center;
                    row-gap: 50px;
                }
                footer .footer-main .footer-content {
                    display: flex;
                    column-gap: 50px;
                }
                footer .footer-main .footer-content .footer-1 {
                    width: 40%;
                    display: flex;
                    flex-direction: column;
                    row-gap: 15px;
                }
                footer .footer-main .footer-content .footer-1 .footer-l-content, footer .footer-main .footer-content .footer-1 .footer-1-copyright {
                    line-height: 20px;
                    color: #212121;
                    font-size: 15px;
                }
                footer .footer-main .footer-content .footer-2 {
                    width: 60%;
                    display: flex;
                    justify-content: space-between;
                }
                footer .footer-main .footer-content .footer-2 .footer-f1, footer .footer-main .footer-content .footer-2 .footer-f2 {
                    display: flex;
                    width: 50%;
                }
                footer .footer-main .footer-content .footer-2 .footer-2-1, footer .footer-main .footer-content .footer-2 .footer-2-2, footer .footer-main .footer-content .footer-2 .footer-2-3, footer .footer-main .footer-content .footer-2 .footer-2-4 {
                    display: flex;
                    flex-direction: column;
                    row-gap: 15px;
                    width: 50%;
                }
                footer .footer-main .footer-content .footer-2 .footer-2-1 .footer-2-1-title, footer .footer-main .footer-content .footer-2 .footer-2-2 .footer-2-2-title, footer .footer-main .footer-content .footer-2 .footer-2-3 .footer-2-3-title, footer .footer-main .footer-content .footer-2 .footer-2-4 .footer-2-4-title {
                    font-size: 16px;
                    color: #000;
                }
                footer .footer-main .footer-content .footer-2 .footer-2-1 .footer-2-1-links, footer .footer-main .footer-content .footer-2 .footer-2-2 .footer-2-2-links, footer .footer-main .footer-content .footer-2 .footer-2-3 .footer-2-3-links, footer .footer-main .footer-content .footer-2 .footer-2-4 .footer-2-4-links {
                    list-style-type: none;
                    display: flex;
                    flex-direction: column;
                    row-gap: 5px;
                }
                footer .footer-main .footer-content .footer-2 .footer-2-1 .footer-2-1-links li a, footer .footer-main .footer-content .footer-2 .footer-2-2 .footer-2-2-links li a, footer .footer-main .footer-content .footer-2 .footer-2-3 .footer-2-3-links li a, footer .footer-main .footer-content .footer-2 .footer-2-4 .footer-2-4-links li a {
                    text-decoration: none;
                    color: #212121;
                    font-size: 14px;
                }
                footer .footer-main .footer-text {
                    width: 100%;
                    text-align: center;
                }
                footer .footer-main .footer-content .footer-1 .footer-1-copyright a {
                    text-decoration: none;
                    color: #212121;
                    font-weight: 600;
                }



                main section {
                    width: 100%;
                    display: flex;
                    justify-content: center;
                }
                main section.section-1 {
                    background-color: #fbf8f3;
                    padding: 75px 0px 75px 0px;
                }


                main section.section-1 .section-1-main {
                    width: 80%;
                    display: flex;
                    align-items: center;
                    position: relative;
                    column-gap: 50px;
                }
                main section.section-1 .section-1-main .section-1-content {
                    width: 400px;
                    display: flex;
                    flex-direction: column;
                    row-gap: 20px;
                    text-align: right;
                    
                }
                main section.section-1 .section-1-main .section-1-content .section-1-rating {
                    display: flex;
                    align-items: center;
                    column-gap: 15px;
                }
                main section.section-1 .section-1-main .section-1-content .section-1-title {
                    font-size: 40px;
                    line-height: 42px;
                }
                main section.section-1 .section-1-main .section-1-content .section-1-desc {
                    color: #5a5444;
                    line-height: 24px;
                }
                main section.section-1 .section-1-main .section-1-content .section-1-links {
                    display: flex;
                    align-items: center;
                    column-gap: 25px;
                    width: 100%;justify-content: flex-end;
                }
                main section.section-1 .section-1-main .section-1-content .section-1-links .section-1-link {
                    padding: 12px 18px;
                    border-radius: 5px;
                    text-decoration: none;
                    color: #fff;
                    background-color: rgb(202, 3, 3);
                }
                main section.section-1 .section-1-main .section-1-content .section-1-links .section-1-alt-link {
                    color: rgb(202, 3, 3);
                    font-weight: 600;
                    text-decoration: none;
                    padding-bottom: 1px;
                    border-bottom: 1px solid rgb(202, 3, 3);
                }
                main section.section-1 .section-1-main .section-1-content .section-1-lists {
                    list-style-type: none;
                    display: flex;
                    align-items: center;
                    column-gap: 18px;
                }
                main section.section-1 .section-1-main .section-1-content .section-1-lists li {
                    display: flex;
                    align-items: center;
                    column-gap: 5px;
                    color: #5a5444;
                    font-weight: 500;
                }
                main section.section-1 .section-1-main .section-1-content .section-1-lists li img {
                    width: 20px;
                }
                main section.section-1 .section-1-main .section-1-img {
                    width: 350px;
                    height: 350px;
                    overflow: hidden;
                    border-radius: 50%;
                }
                main section.section-1 .section-1-main .section-1-img img {
                    width: 350px;
                }


                main section.section-2 {
                    padding: 75px 0px 75px 0px;
                }
                main section.section-2 .section-2-main {
                    width: 80%;
                    display: flex;
                    flex-direction: column;
                    row-gap: 75px;
                }


                main section.section-2 .section-2-main .section-2-1 {
                    display: flex;
                    justify-content: center;
                    width: 100%;
                }
                main section.section-2 .section-2-main .section-2-1 .section-2-1-main {
                    display: flex;
                    flex-direction: column;
                    row-gap: 50px;
                    width: 100%;
                }
                main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-header {
                    width: 100%;
                    display: flex;
                    flex-direction: column;
                    row-gap: 15px;
                }
                main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-header .section-2-1-header-span {
                    color: rgb(202, 3, 3);
                    font-weight: bold;
                    font-size: 18px;
                }
                main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-header .section-2-1-header-title {
                    font-size: 30px;
                }
                main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-body .cards {
                    width: 100%;
                    display: flex;
                    column-gap: 35px;
                }
                main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-body .cards .card {
                    display: flex;
                    flex-direction: column;
                    row-gap: 15px;
                }



                main section.section-2 .section-2-main .section-2-2 {
                    display: flex;
                    align-items: center;
                    background-color: rgb(202, 3, 3);
                    border-radius: 10px;
                    padding: 50px 50px 0px 75px;
                    column-gap: 50px;
                }
                main section.section-2 .section-2-main .section-2-2 .section-2-2-content {
                    width: 50%;
                    display: flex;
                    flex-direction: column;
                    row-gap: 17px;
                }
                main section.section-2 .section-2-main .section-2-2 .section-2-2-content .section-2-2-title {
                    font-size: 40px;
                    line-height: 42px;
                    color: #fff;
                    font-weight: 600;
                }
                main section.section-2 .section-2-main .section-2-2 .section-2-2-content .section-2-2-desc {
                    color: #c3b0f1;
                    line-height: 24px;
                }
                main section.section-2 .section-2-main .section-2-2 .section-2-2-content .section-2-2-link {
                    font-weight: bold;
                    padding: 15px 20px;
                    border-radius: 5px;
                    text-decoration: none;
                    color: rgb(202, 3, 3);
                    background-color: #fff;
                    width: fit-content;
                }
                main section.section-2 .section-2-main .section-2-2 .section-2-2-img {
                    width: 50%;
                }
                main section.section-2 .section-2-main .section-2-2 .section-2-2-img img {
                    width: 100%;
                    display: block;
                }



                main section.section-2 .section-2-main .section-2-3 {
                    display: flex;
                    justify-content: center;
                    width: 100%;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main {
                    display: flex;
                    flex-direction: column;
                    row-gap: 50px;
                    width: 100%;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards {
                    width: 100%;
                    display: flex;
                    column-gap: 35px;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card {
                    display: flex;
                    flex-direction: column;
                    row-gap: 15px;
                    border: 2px solid #a1a09f38;
                    border-radius: 5px;
                    padding: 25px;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-details {
                    display: flex;
                    column-gap: 10px;
                    align-items: center;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-details .card-user-img {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-details .card-user-img img {
                    width: 50px;
                    display: block;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-details .card-user-content {
                    display: flex;
                    flex-direction: column;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-details .card-user-content h4 {
                    color: rgb(202, 3, 3);
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-details .card-user-content span {
                    font-size: 14px;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-text {
                    line-height: 24px;
                }
                main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards .card .card-footer a {
                    padding: 12px;
                    text-align: center;
                    width: 100%;
                    display: block;
                    border: 2px solid #a1a09f38;
                    border-radius: 5px;
                    text-decoration: none;
                    color: rgb(202, 3, 3);
                    font-weight: 600;
                }



                /* login page */
                main section.section-login {
                    height: 100vh;
                }
                main section.section-login .section-login-1, main section.section-login .section-login-2 {
                    width: 50%;
                    display: grid;
                    place-items: center;
                }
                main section.section-login .section-login-1 .section-login-1-main {
                    width: 70%;
                    height: 80%;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-logo a {
                    text-decoration: none;
                    font-size: 24px;
                    font-weight: 700;
                    color: #000;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-title {
                    font-size: 32px;
                    line-height: 42px;
                    margin-top: 40px;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form {
                    margin-top: 40px;
                    display: flex;
                    flex-direction: column;
                    row-gap: 20px;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-1, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-2, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-3 {    
                    display: flex;   
                    flex-direction: column;
                    row-gap: 8px;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-1 label, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-2 label, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-3 label {
                    font-weight: 500;
                    font-size: 15px;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-1 input, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-2 input, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-3 input {
                    padding: 12px 15px;
                    border: 1px solid #e9e6e6;
                    border-radius: 4px;
                    outline: none;
                    font-size: 16px;
                    width: 100%;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-4 {
                    display: flex;
                    column-gap: 7px;
                    align-items: center;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-4 p, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-5 p {
                    font-size: 14px;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-4 p a, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-5 p a {
                    font-weight: bold;
                    color: #5a1fe0;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-submit-btn button {
                    background: #5a1fe0;
                    padding: 14px;
                    width: 100%;
                    color: #fff;
                    outline: none;
                    border: 0px;
                    border-radius: 5px;
                    font-size: 14px;
                }
                main section.section-login .section-login-1 .section-login-1-main .section-login-1-form .login-form-5 p {
                    text-align: center;
                }
                main section.section-login .section-login-2 {
                    background: #5a1fe0;
                }
                main section.section-login .section-login-2 .section-login-2-main {    
                    width: 70%;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container {
                    max-width: 1000px;
                    position: relative;
                    margin: auto;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container .mySlides {
                    display: none;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container .mySlides .mySlider-main {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    row-gap: 25px;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container img {
                    width: 100%;
                    display: block;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container .caption {
                    color: #f2f2f2;
                    width: 100%;
                    text-align: center;
                    display: flex;
                    flex-direction: column;
                    row-gap: 10px;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container .caption .caption-title {
                    font-size: 30px;
                    font-weight: 700;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container .caption .caption-text {
                    font-weight: 400;
                }
                main section.section-login .section-login-2 .section-login-2-main .dot {
                    cursor: pointer;
                    height: 12px;
                    width: 12px;
                    margin: 0 2px;
                    background-color: #bbb;
                    border-radius: 50%;
                    display: inline-block;
                    transition: background-color 0.6s ease;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container .active, main section.section-login .section-login-2 .section-login-2-main .slideshow-container .dot:hover {
                    background-color: #717171;
                }
                main section.section-login .section-login-2 .section-login-2-main .slideshow-container .fade {
                    animation-name: fade;
                    animation-duration: 1.5s;
                }
                @keyframes fade {
                    from {opacity: .4} 
                    to {opacity: 1}
                }

                main .section-4 {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    padding: 75px 0px;
                    row-gap: 50px;
                }
                main .section-4 .section-4-1, main .section-4 .section-4-2 {
                    width: 60%;
                    display: flex;
                    justify-content: center;
                }
                main .section-4 .section-4-1 .section-main {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    row-gap: 10px;
                }
                main .section-4 .section-4-1 .section-main h1 {
                    font-size: 40px;
                    line-height: 42px;
                    color: #212121;
                    text-align: center;
                }
                main .section-4 .section-4-1 .section-main p {
                    color: #425466;
                    line-height: 24px;
                    text-align: center;
                }
                main .section-4 .section-4-2 .section-main div.pricing-body {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    row-gap: 30px;
                }
                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-header {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    row-gap: 15px;
                }
                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-header .pricing-checkbox {
                    display: flex;
                    column-gap: 10px;
                    align-items: center;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-header .pricing-checkbox span {
                    font-size: 14px;
                    color: #425466;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-header .pricing-checkbox>div {
                    width: 45px;
                    background: #212121;
                    height: 24px;
                    border-radius: 15px;
                    position: relative;
                    cursor: pointer;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-header .pricing-checkbox>div div {
                    position: absolute;
                    width: 18px;
                    height: 18px;
                    background-color: #fff;
                    top: 50%;
                    left: 3px;
                    transform: translateY(-50%);
                    border-radius: 50%;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-header .pricing-checkbox>div.anually div {
                    left: unset;
                    right: 3px;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div {
                    display: none;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div {
                    display: flex;
                    column-gap: 17px;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card {
                    padding: 25px;
                    border-radius: 8px;
                    width: 280px;
                    position: relative;
                    border: 1px solid #b5b6b87d;
                    box-shadow: 1px 1px #b5b6b86e;
                    height: fit-content;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-header {
                    display: flex;
                    flex-direction: column;
                    row-gap: 10px;
                    justify-content: center;
                    align-items: center;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-header .card-price {
                    font-size: 26px;
                }
                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-header .card-price span {
                    font-size: 14px;
                    color: darkgray;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-header p {
                    color: #425466;
                    line-height: 24px;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-body {
                    padding-top: 25px;
                    border-top: 1px solid lightgray;
                    margin-top: 15px;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-body ul {
                    list-style-type: none;
                    display: flex;
                    flex-direction: column;
                    row-gap: 12px;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-body ul li {
                    color: #b5b6b8;
                    position: relative;
                    font-size: 14px;
                    display: flex;
                    column-gap: 10px;
                    align-items: center;
                }
                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-body ul li img {
                    width: 20px;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-body ul li::before {
                    color: #212121;
                    font-weight: bold;
                    width: 20px;
                    margin-left: -18px;
                    font-size: 25px;
                    position: absolute;
                    top: 50%;
                    transform: translateY(-50%);
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-footer {
                    margin-top: 30px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card .card-footer a {
                    background: #212121;
                    color: #f0eeeb;
                    font-weight: 500;
                    padding: 10px 15px;
                    border-radius: 4px;
                    cursor: pointer;
                    text-decoration: none;
                    font-size: 14px;
                    width: 100%;
                    text-align: center;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card:nth-of-type(2) .card-footer button {
                    background: #212121;
                    color: #fff;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card:nth-of-type(2) .card-footer button:hover {
                    background: transparent;
                    color: #b5b6b8;
                }

                main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div.active {
                    display: block;
                }



                @media only screen and (max-width: 1200px) {
                    nav .nav-main, main section.section-1 .section-1-main, main section.section-2 .section-2-main, footer .footer-main {
                        width: 90%;
                    }

                    main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards {
                        column-gap: 20px;
                    }

                    main section.section-login .section-login-1 .section-login-1-main, main section.section-login .section-login-2 .section-login-2-main {
                        width: 85%;
                    }
                    main section.section-login .section-login-1 .section-login-1-main .section-login-1-title, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form {
                        margin-top: 35px;
                    }
                    main .section-4 {
                        padding: 65px 0px 35px 0px;
                    }
                    main .section-4 .section-4-1, main .section-4 .section-4-2 {
                        width: 90%;
                    }
                    main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div {
                        flex-wrap: wrap;
                        row-gap: 20px;
                        column-gap: 20px;
                    }
                    main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card {
                        width: calc(50% - 10px);
                        height: unset;
                    }
                    main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card:last-child {
                        width: 100%;
                    }
                }

                @media only screen and (max-width: 900px) {
                    main section.section-1 {
                        padding: 25px 0px 50px 0px;
                    }
                    main section.section-1 .section-1-main {
                        flex-direction: column-reverse;
                        row-gap: 35px;
                    }
                    main section.section-2 {
                        padding: 50px 0px;
                    }
                    main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-body .cards {
                        column-gap: 25px;
                    }
                    main section.section-2 .section-2-main .section-2-2 {
                        flex-direction: column;
                        row-gap: 35px;
                    }
                    main section.section-2 .section-2-main .section-2-2 .section-2-2-content, main section.section-2 .section-2-main .section-2-2 .section-2-2-img {
                        width: 100%;
                    }
                    main section.section-1 .section-1-main .section-1-content, main section.section-1 .section-1-main .section-1-img {
                        width: 400px;
                        height: 400px;
                        overflow: hidden;
                        border-radius: 50%;
                    }
                    main section.section-2 .section-2-main {
                        row-gap: 50px;
                    }
                    main section.section-2 .section-2-main .section-2-3 .section-2-3-main .cards {
                        flex-direction: column;
                        row-gap: 25px;
                    }
                    footer {
                        padding: 35px 0px;
                    }
                    footer .footer-main .footer-content {
                        flex-direction: column;
                        row-gap: 30px;
                    }
                    footer .footer-main .footer-content .footer-1, footer .footer-main .footer-content .footer-2 {
                        width: 100%;
                    }


                    main section.section-login .section-login-1 .section-login-1-main, main section.section-login .section-login-2 .section-login-2-main {
                        width: 90%;
                    }
                    main section.section-login .section-login-1 .section-login-1-main {
                        height: 90%;
                    }
                    main section.section-login .section-login-1 .section-login-1-main .section-login-1-title, main section.section-login .section-login-1 .section-login-1-main .section-login-1-form {
                        margin-top: 25px;
                    }

                }

                @media only screen and (max-width: 600px) {
                    nav .nav-main .nav-mobile-menu {
                        display: block;
                    }
                    nav .nav-main ul {
                        display: none;
                    }
                    nav.mobile-menu ul:last-of-type li:last-child a {
                        margin-left: unset;
                    }

                    footer .footer-main .footer-content .footer-2 {
                        flex-direction: column;
                        row-gap: 25px;
                    }
                    footer .footer-main .footer-content .footer-2 .footer-f1, footer .footer-main .footer-content .footer-2 .footer-f2 {
                        width: 100%;
                    }
                    main section.section-2 .section-2-main .section-2-2 {
                        padding: 35px 35px 0px 35px;
                    }
                    main section.section-2 .section-2-main .section-2-2 .section-2-2-content .section-2-2-link {
                        width: 100%;
                        text-align: center;
                    }
                    main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-body .cards {
                        flex-direction: column;
                        row-gap: 35px;
                    }
                    main section.section-2 .section-2-main .section-2-1 .section-2-1-main .section-2-1-body .cards .card {
                        row-gap: 10px;
                    }
                    main section.section-2 .section-2-main .section-2-1 .section-2-1-main {
                        row-gap: 40px;
                    }
                    main section.section-1 .section-1-main .section-1-content .section-1-lists {
                        flex-direction: column;
                        align-items: flex-start;
                        row-gap: 12px;
                    }


                    main section.section-login .section-login-2 {
                        display: none;
                    }
                    main section.section-login .section-login-1 {
                        width: 100%;
                    }
                    main .section-4 .section-4-2 .section-main div.pricing-body .pricing-body-plans>div>div .card {
                        width: 100%;
                        height: fit-content;
                    }
                }