﻿

.auto-adjusting-div {
    padding: 80px; /* Optional padding */
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
   /* margin: 40px;*/ /* Apply right margin */
    background-color:#f9f9f9
}

.main_header {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
    display: flex;
    flex-direction: row;
    align-items: center; /* Vertically center the content */
}

.header_left {
    padding: 20px; /* Optional padding */
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 10px
}

.header_right {
    padding: 40px;
    box-sizing: content-box;
    overflow: auto;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 70%; /* 70% of the parent height */
    align-items: flex-end; /* Horizontally center the content */
    justify-content: center; /* Vertically center content within .header_right */
    margin: 0 auto; /* Optional: center align horizontally if needed */
}

.header_right_inner {
    background-color: #7DE5AE;
    padding: 20px;
    flex: 1;
    border-radius: 35px;
    /*padding: 20px;*/ /* Optional padding */
    /*box-sizing: content-box;*/ /* Ensures padding/border is included in height */
    /*overflow: auto;*/ /* Ensures the content is visible without setting a fixed height */
    /*max-width: 100%;*/ /* Let the element shrink if needed */
    /*background-color: green;
    display: flex;
    flex-direction: column;
    border-radius:20px*/
}

.header_left_1 {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
}

.header_left_2 {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: hidden; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
}

.header_left_3 {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
}

.header_left_4 {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
}

.logo {
    width: 20%;
    height: 100%
}

.animated_text {
    font-weight: bold;
    background: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C); /* Gradient from left to right */
    color: transparent; /* Make text color transparent */
    background-clip: text; /* Clip the gradient to the text */
    -webkit-background-clip: text; /* Webkit-specific for Chrome and Safari */
    -webkit-text-fill-color: transparent; /* Webkit-specific for text transparency */
    transition: background 0.5s ease, background-position 0.5s ease; /* Smooth transition */
}

    .animated_text:hover {
        font-weight: bold;
        background: linear-gradient(to left, #84C6EC, #37D3DD, #62DA7C);
        color: transparent; /* Make text color transparent */
        background-clip: text; /* Clip the gradient to the text */
        -webkit-background-clip: text; /* Webkit-specific for Chrome and Safari */
        -webkit-text-fill-color: transparent; /* Webkit-specific for text transparency */
        transition: background 0.5s ease, background-position 0.5s ease; /* Smooth transition */
    }

.greyed_text {
    color: #b5b5b5;
    font-weight:bold
}

p{
    padding:2px !important
}

.gradient-button {
    font-weight: bold;
    color: black; /* Text color is black */
    background: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C); /* Gradient on background */
    border: none; /* Remove border */
    outline: none; /* Remove outline */
    padding: 10px 20px; /* Adjust padding as needed */
    cursor: pointer; /* Pointer cursor on hover */
    transition: background 0.5s ease, background-position 0.5s ease; /* Smooth transition for background */
    text-transform: uppercase; /* Optional: Makes the text uppercase */
    border-radius: 8px; /* Optional: Adds rounded corners */
}

    .gradient-button:hover {
        background: linear-gradient(to left, #84C6EC, #37D3DD, #62DA7C); /* Reverse gradient on hover */
    }

.header_right_top {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
    padding:20px;
    display:flex;
    flex-direction:row;
    justify-content:space-evenly
}

.header_right_top img{
    width:40%;
    height:100%
}


.header_right_bottom {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */\
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1
}

.header_right_bottom img{
    width: 80%;
}

.improvements {
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
    padding:20px;
    margin-top:30px;
    display:flex;
    flex-direction:column;
    gap:10px
}

.improvements_inner_containers {
    max-width: 100%; /* Let the element shrink if needed */
    overflow: auto;
    box-sizing: content-box;
    padding: 20px;
    display:flex;
    flex-direction:row;
    gap:20px
}

.left_feature, .right_feature{
    flex:1
}

.left_feature{
    display:flex;
    flex-direction:row;
}

.right_feature {
    display: flex;
    flex-direction: row
}


.left_feature_inner{
    flex: 0 0 30%
}

.right_feature_inner {
    flex: 0 0 70%
}

.left_feature_inner {
    padding: 10px;
    display:flex;
    align-items:center;
    justify-content:center
}

.right_feature_inner {
    padding: 30px;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    flex-direction:column;
    gap:15px
}

.right_feature_inner p{
    padding:0px !important
}

.improvements_icon{
    width:80%
}

.full_release_button{
    padding:20px;
    display:flex;
    align-items:center;
    justify-content:center
}




.datasheets {
    width: 100%;
    left: 0;
    padding: 0;
    margin: 0;
    position: absolute;
    background-color: #F1F2F3;
}
/*
 Container for the buttons */
.accordion-div {
    display: flex;
    justify-content: space-between;
    border: 0;   
    border-bottom: 2px solid;  
    border-image: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C) 1;  
}



.accordion-div button {
    flex: 1;
    padding: 20px;
    border: none;
    background-color: #F1F2F3;
    color: #000;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    transition: background 0.3s ease;
}

    .accordion-div button:hover {
        background: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C);
        color: #000;
    }

    .accordion-div button.active {
        background: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C);
        /*color: #000;*/
        color:red
    }

.accordion-content {
    background-color:#f9f9f9;
    padding: 15px;
    margin-top: 10px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px
}

.accordion {
    margin-top: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

.accordion-content p{
    font-weight:400;
}

.product_images{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:20px;
    flex-direction:row
}

.product_features{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:20px;
    gap:20px;
    width:100%
}

.pf {
    width: 80%;
    background-color: #f1f2f3; /* Background color for the content */
    border-radius: 10px; /* Apply rounded corners to the content */
    padding: 2px;
    display: flex;
    flex-direction: row;
    position: relative; /* Required for positioning pseudo-element */
    z-index: 1; /* Ensure the content is above the pseudo-element */
    overflow: hidden; /* Prevent content from overflowing the border */
}

    /* Pseudo-element for the gradient border */
    .pf::before {
        content: ''; /* Creates an empty element */
        position: absolute; /* Position the pseudo-element */
        top: -5px;
        left: -5px; /* Extend the pseudo-element slightly outside the content */
        right: -5px;
        bottom: -5px; /* Extend the pseudo-element slightly outside the content */
        background: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C); /* Apply gradient */
        border-radius: 10px; /* Apply rounded corners to the pseudo-element */
        z-index: -1; /* Place it behind the content */
    }


.pf_inner {
    background-color: #f1f2f3;
    border-radius: 5px;
    padding: 30px;
    display: flex;
    flex-direction: row;
    width:100%
}


.pf_left{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px;
    text-align:center
}

.pf_right {
    display:flex;
    align-items: center;
    justify-content:flex-start;
    flex: 1;
}

.pf_right p{
    line-height:20px
}


.explore_animated {
    font-weight: bold;
    color: black; /* Text color is black */
    background: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C); /* Gradient on background */
    border: none; /* Remove border */
    outline: none; /* Remove outline */
    padding: 10px 20px; /* Adjust padding as needed */
    cursor: pointer; /* Pointer cursor on hover */
    transition: background 0.5s ease, background-position 0.5s ease; /* Smooth transition for background */
    text-transform: uppercase; /* Optional: Makes the text uppercase */
    border-radius: 8px; /* Optional: Adds rounded corners */
}

.explore_animated {
    background: linear-gradient(to left,  #62DA7C, #37D3DD,#84C6EC); /* Reverse gradient on hover */
}

.resources {
    padding: 30px; /* Optional padding */
    box-sizing: content-box; /* Ensures padding/border is included in height */
    overflow: auto; /* Ensures the content is visible without setting a fixed height */
    max-width: 100%; /* Let the element shrink if needed */
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px
}

.resources_sections{
    width:100%;
    padding:20px;
    display:flex;
    flex-direction:row;
    gap:20px
}

.resources_section_content{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    flex:1;
    padding:10px
}

.text-arrow {
    display: flex;
    align-items: center;
    gap: 8px; /* Space between text and arrow */
    cursor: pointer;
    transition: transform 0.3s ease; /* Smooth transition for movement */
    font-size:16px
}

    .text-arrow .arrow {
        transition: transform 0.3s ease; /* Smooth transition for arrow rotation */
    }

    .text-arrow:hover {
        transform: translateX(10px); /* Move the entire element to the right */
    }

        .text-arrow:hover .arrow {
            transform: rotate(-45deg); /* Rotate the arrow by 45 degrees */
        }


.bottom_link {
    width: 100%;
    left: 0;
    padding: 0;
    margin-bottom:20px;
    margin: 0;
    position: absolute;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight: bold;
    color: white; /* Text color is black */
    background: linear-gradient(to right, #84C6EC, #37D3DD, #62DA7C); /* Gradient on background */
    border: none; /* Remove border */
    outline: none; /* Remove outline */
    padding: 20px 20px; /* Adjust padding as needed */
    cursor: pointer; /* Pointer cursor on hover */
    transition: background 0.5s ease, background-position 0.5s ease; /* Smooth transition for background */
    text-transform: uppercase; /* Optional: Makes the text uppercase */
}

.bottom_link:hover {
    background: linear-gradient(to left, #84C6EC, #37D3DD, #62DA7C); /* Reverse gradient on hover */
}



.whats_new {
    padding: 20px;
    box-sizing: content-box;
    overflow: auto;
    max-width: 100%;
    position: relative;
    overflow: hidden
}

.hover_div {
    padding: 30px;
    box-sizing: content-box;
    overflow: auto;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    background: linear-gradient(to bottom, #84C6EC, #37D3DD, #62DA7C);
    border-radius: 30px 30px 0px 0px;
    align-items: center;
    justify-content: center;
    gap: 30px;
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: opacity 0.3s ease;
}


.after_hover_div {
    opacity: 0; /* Initially hidden */
    visibility: hidden; /* Initially hidden */
    transition: opacity 0.3s ease, visibility 0.3s ease; /* Smooth transition */
}


.hover_div:hover .after_hover_div,
.hover_div:hover .after_hover_div .text_white {
    opacity: 1; /* Make visible on hover */
    visibility: visible; /* Make visible on hover */
    pointer-events: all; /* Enable interaction */
}

.hover_div:hover .whats_new_img_1,
.hover_div:hover .side_img_div,
.hover_div:hover .text_white {
    opacity: 0; /* Hide these elements on hover */
    visibility: hidden; /* Hide these elements on hover */
}

.hover_div:hover .after_hover_div .content_after_hover_div {
    margin-top: -286px;
}

    .text_white {
    color: white;
}

.whats_new_img_1 {
    width: 80%; 
    border-radius: 8px;
    position: relative;
    z-index: 1;
}

.side_img_div {
    position: absolute;
    top: 75%;
    left: 50%; 
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: row;
    gap: 20px;
    z-index: 2;
}

.whats_new_img_2,
.whats_new_img_3 {
    width: auto;
    height: auto;
    align-self: flex-end; 
}

.content_after_hover_div {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    z-index: 2; /* Ensure this stays above other content */
}


.image-container1 {
    position: absolute;
    top: 4%;
    left: 4%;
}

.image-container2 {
    position: absolute;
    top: 12%;
    right: 45%;
}

.image-container3 {
    position: absolute;
    top: 8%;
    right: 30%;
}

.image-container4 {
    position: absolute;
    top: 20%;
    left: 79%;
}

.image-container5 {
    position: absolute;
    top: 50%;
    left: 9%;
}

.image-container6 {
    position: absolute;
    top: 72%;
    left: 7%;
}

.image-container7 {
    position: absolute;
    top: 68%;
    left: 34%;
}

.image-container8 {
    position: absolute;
    top: 83%;
    left: 80%;
}

.image-container9 {
    position: absolute;
    top: 62%;
    left: 61%;
}

/* Transition for smooth fade-in of images */
.whats_new_img_1,
.side_img_div img,
.content_after_hover_div img {
    transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out; /* Ease-in-out for smooth fade and movement */
}

/* Apply slight zoom-in effect and opacity change on hover */
.hover_div:hover .whats_new_img_1,
.hover_div:hover .side_img_div img,
.hover_div:hover .content_after_hover_div img {
    transform: scale(1.05); /* Slight zoom effect */
    opacity: 0.8; /* Slight opacity change */
}



/* Zoom effect on hover for image containers */
.image-container1,
.image-container2,
.image-container3,
.image-container4,
.image-container5,
.image-container6,
.image-container7,
.image-container8,
.image-container9 {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; /* Added ease-in-out for smooth transition */
}

/* Apply zoom-in effect to the image containers */
.hover_div:hover .image-container1,
.hover_div:hover .image-container2,
.hover_div:hover .image-container3,
.hover_div:hover .image-container4,
.hover_div:hover .image-container5,
.hover_div:hover .image-container6,
.hover_div:hover .image-container7,
.hover_div:hover .image-container8,
.hover_div:hover .image-container9 {
    transform: scale(1.05); /* Slight zoom effect */
    opacity: 0.9; /* Slight opacity change */
}

/* Reset zoom and opacity for image containers when not hovered */
.image-container1,
.image-container2,
.image-container3,
.image-container4,
.image-container5,
.image-container6,
.image-container7,
.image-container8,
.image-container9 {
    opacity: 1;
    transform: scale(1); /* Reset scaling */
}

/* Content after hover styles */
.content_after_hover_div {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    z-index: 2;
    opacity: 0; /* Start off hidden */
    transform: translateY(20px); /* Start with a slight offset */
    transition: opacity 0.5s ease-in, transform 0.5s ease-out; /* Smooth transition */
}

/* On hover, the content becomes visible with smooth fade-in */
.hover_div:hover .content_after_hover_div {
    opacity: 1;
    transform: translateY(0); /* Reset offset and make visible */
}





@media (max-width:2500px) and (min-width:1900px) {
    .side_img_div {
        top: 84%;
        gap: 55px;
    }

    .hover_div:hover .after_hover_div .content_after_hover_div {
        margin-top: -452px;
    }

    .after_hover_div img {
        width: 160%;
    }

    h3, .h3 {
        font-size: 35.36px !important;
    }

    p {
        font-size: 20px !important;
        line-height: 25px;
    }

    .gradient-button {
        padding: 15px 30px;
        border-radius: 8px;
    }

    .improvements_icon {
        width: 60%;
    }

    h4, .h4 {
        font-size: 30.52px !important;
    }

    .right_feature_inner p {
        padding: 0px !important;
        font-size: 28px !important;
        line-height: 40px;
    }

    .accordion-div button {
        font-size: 22px;
    }

    h2, .h2 {
        font-size: 45.48px;
    }

    .accordion-content p {
        font-weight: 400;
        font-size: 25px !IMPORTANT;
    }

    .pf_inner {
        padding: 60px;
    }

    .pf_right p {
        line-height: 34px;
    }

    .explore_animated {
        padding: 16px 35px;
    }

    h5, .h5 {
        font-size: 25.96px;
    }

    h6, .h6 {
        font-size: 25.68px !important;
    }

    .bottom_link {
        padding: 28px 20px;
    }
    .accordion-div button {
        padding: 28px !important
    }
}

@media (min-width:1500px) and (max-width:1899px) {
    .side_img_div {
        top: 80%;
        gap: 10px;
    }

    .after_hover_div img {
        width: 127%
    }

    .hover_div:hover .after_hover_div .content_after_hover_div {
        margin-top: -326px;
    }

    .improvements_icon {
        width: 70%;
    }

    p {
        font-size: 20px !important;
        line-height: 26px !important;
    }

    h4, .h4 {
        font-size: 22.52px !important;
    }

    .accordion-div button {
        font-size: 18px;
    }
    .explore_animated {
        padding: 15px 20px;
    }

    h6, .h6 {
        font-size: 18.68px !important;
    }
}

@media (min-width:700px) and (max-width:1100px) {
    .main_header {
        flex-direction: column;
    }

    h3, .h3 {
        font-size: 22.36px !important;
    }

    .whats_new_img_1 {
        width: 100%;
    }

    .whats_new_img_3 {
        width: 70%;
    }

    .whats_new_img_2 {
        width: 54%;
    }
    .side_img_div {
        position: absolute;
        top: 83%;
        left: 0;
    }
    .side_img_div {
        position: absolute;
        top: 75%;
        left: 229px;
    }

    .after_hover_div img{
    width: 64%;
    }

    .hover_div:hover .after_hover_div .content_after_hover_div {
        margin-top: -190px;
    }

    h3.text_white {
        font-size: 20px !important;
    }

    .left_feature {
        display: flex;
        flex-direction: column;
    }

    .right_feature {
        display: flex;
        flex-direction: column;
    }

    .improvements_icon {
        width: 40%;
    }

    .right_feature_inner {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .right_feature_inner p {
            font-size:15px !important
        }

    .improvements_inner_containers{
        overflow:hidden
    }

    .accordion-div button {
        padding: 15px;
        font-size: 13px;
    }

    h2, .h2 {
        font-size: 28.48px !important;
    }

    .product_images img{
        width:63%
    }

    .product_features {
        width: 155%;
    }

    .explore_animated {
        padding: 15px 20px !important;
    }

    .resources_sections {
        flex-direction: column;
    }

    .resources_section_content img{
        width:20% !important
    }

    p {
        font-size: 18px !important;
        line-height: 23px !important;
    }

    h6, .h6 {
        font-size: 16.68px !important;
    }

    .auto-adjusting-div {
        overflow-x: hidden;
    }
}

@media (min-width:300px) and (max-width:699px) {
    .main_header {
        flex-direction: column;
    }

    .last_Section {
        margin-top: -13rem !important;
        flex-direction: column !important;
    }

    h3, .h3 {
        font-size: 22.36px !important;
    }

    .whats_new_img_1 {
        width: 100%;
    }

    .whats_new_img_3 {
        width: 70%;
    }

    .whats_new_img_2 {
        width: 54%;
    }

    .side_img_div {
        position: absolute;
        top: 83%;
        left: 0;
    }

    .side_img_div {
        position: absolute;
        top: 75%;
        left: 229px;
    }

    .after_hover_div img {
        width: 64%;
    }

    .hover_div:hover .after_hover_div .content_after_hover_div {
        margin-top: -190px;
    }

    h3.text_white {
        font-size: 20px !important;
    }

    .left_feature {
        display: flex;
        flex-direction: column;
    }

    .right_feature {
        display: flex;
        flex-direction: column;
    }

    .improvements_icon {
        width: 40%;
    }

    .right_feature_inner {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .right_feature_inner p {
            font-size: 15px !important
        }

    .improvements_inner_containers {
        overflow: hidden
    }

    .accordion-div button {
        padding: 15px;
        font-size: 13px;
    }

    h2, .h2 {
        font-size: 28.48px !important;
    }

    .product_images img {
        width: 63%
    }

    .product_features {
        width: 155%;
    }

    .explore_animated {
        padding: 15px 20px !important;
    }

    .resources_sections {
        flex-direction: column;
    }

    .resources_section_content img {
        width: 20% !important
    }

    p {
        font-size: 14px !important;
        line-height: 22px !important;
    }

    h6, .h6 {
        font-size: 16.68px !important;
    }

    .auto-adjusting-div {
        overflow-x: hidden;
        padding: 0px !important
    }

    .header_right {
        padding: 20px;
    }

    .header_right_top {
        padding: 10px;
    }

    .hover_div {
        margin: 20px;
        padding: 15px;
    }

    h3.text_white {
        font-size: 12px !important;
    }

    .side_img_div {
        position: absolute;
        top: 73%;
        left: 119px;
    }

    .improvements {
        padding: 0px !important
    }

    .improvements_inner_containers {
        padding: 0px !important
    }

    h4, .h4 {
        font-size: 14px !important;
    }

    .after_hover_div img {
        width: 46%;
    }

    .hover_div:hover .after_hover_div .content_after_hover_div {
        margin-top: -114px;
    }

    .image-container5 {
        position: absolute;
        top: 50%;
        left: 4%;
    }

    .image-container3 {
        position: absolute;
        top: 8%;
        right: 8%;
    }

    .image-container9 {
        position: absolute;
        top: 62%;
        left: 65%;
    }

    .accordion-container {
        display: flex;
        flex-wrap: wrap; /* Allow items to wrap to the next row */
        gap: 10px; /* Add spacing between items */
    }

    .accordion-item {
        flex: 1 1 calc(50% - 10px); /* Take 50% width of the container minus the gap */
        border: 1px solid #ccc;
        padding: 10px;
        background: #f9f9f9;
        text-align: center;
        box-sizing: border-box;
    }

    .accordion-div {
        display: flex;
        flex-wrap: wrap;
    }

    .accordion {
        margin-top: 148px;
    }

    h2, .h2 {
        font-size: 14.48px !important;
    }

    .product_images img {
        width: 47%;
    }

    .product_features {
        width: 135%;
    }

    .pf_inner {
        padding: 10px;
    }

    .pf_right p {
        font-size: 12px !important
    }

    .explore_animated {
        padding: 15px 20px !important;
        font-size: 10px;
    }

    h6, .h6 {
        font-size: 12.68px !important;
    }
    .resources {
        margin-bottom: 108px;
    }

    .bottom_link {
        margin-top: -121px;
    }
}


@media (max-width:700px){
    .last_Section {
        margin-top: -13rem !important;
        flex-direction: column !important;
    }

    .multiple_buttons{
        flex-direction:column !important;
        gap:10px !important;
        display:flex
    }
}