@font-face {
    font-family: iransans;
    src: url(../fontawesome-free-6.6.0-web/IRANSans.ttf);
}
@font-face {
    font-family: FontAwesome;
    src: url(../fontawesome-free-6.6.0-web/webfonts/fa-solid-900.woff2);
}
:root {
    --color-1: #008FFF;
    --color-2: #2341df;
    --color-3: #e1f3ff;
    --color-low1: rgba(0, 145, 255, 0.318);
}

a {
    text-decoration: none;
}

body {
    font-family: iransans;
    background-color: #fafafa;

}

@media (max-width: 768px) {
    .p-rl-0 {

        padding-left: 0 !important;
        padding-right: 0 !important;

    }
}

/* منو */
@media (min-width: 999px) {

    .navbar>.container,
    .navbar>.container-fluid,
    .navbar>.container-sm,
    .navbar>.container-md,
    .navbar>.container-lg,
    .navbar>.container-xl,
    .navbar>.container-xxl {
        justify-content: space-between !important;
    }
}


.navbar-brand {
    color: var(--color-1);
    font-weight: bold;
    margin: 0 !important;
}

.nav-link {
    font-size: 0.9rem;
    position: relative;
    transition: color 0.2s ease-in-out;
    margin: 0 0.3rem;

    color: rgba(4, 10, 31, 0.87) !important;
}

.nav-style {
    position: fixed;
    top: 16px;
    margin: auto;
    border: 1px solid #e0e0e0 !important;
    padding: 0.6rem 2rem;
    background-color: #ffffff !important;
    z-index: 1000;
    border-radius: 16px;
    box-shadow: 0 16px 12px -10px rgba(60, 64, 67, .08);
}

.nav-link:focus {
    color: var(--color-2) !important;
}

.nav-link:hover {
    color: var(--color-1) !important;
}



.nav-icon {
    font-size: 18px;
    margin: 0 0.3rem;
    color: var(--color-1);
    transition: all 0.2s;
}



@media (min-width: 768px) {
    .p-nav {
        padding-left: 1rem !important;
        padding-right: 0.5rem !important;
    }

}

.navbar-light .mx-auto {
    margin-left: auto !important;
    margin-right: 2.5rem !important;
}


.dropdown:hover>.dropdown-menu {
    display: block;
    margin-top: 0;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}

.the-dropdown-menu {
    top: 160% !important;
    font-size: 0.9rem;
    border: none;
    background-color: #ffffff;
    padding: 0.4rem;
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.249);
    border-radius: 1rem;

}


.dropdown-menu-title {
    font-size: 17px;
    color: var(--color-2);
}

.dropdown-item {
    margin: 10px 0 !important;
}

.dropdown-item:hover {
    color: var(--color-2) !important;
    background-color: transparent !important;
}

@media (min-width: 768px) {
    /* .navbar-expand-md .navbar-nav .nav-link {
        padding-left: 0 !important;
    } */
}

.support-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(0, 143, 255, 0.5);
    color: #008FFF;
    padding: 5px 15px;
    border-radius: 32px;
    font-weight: 500;
    font-size: 13px;
    line-height: 1.71;
    transition: all 0.2s ease-in-out;
}

.support-btn:hover {
    border: 1px solid #008FFF;
    background-color: #008FFF;
    color: white;
}

.support-btn:hover .nav-icon {

    color: white;
}

.login-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #008FFF;
    background-color: #008FFF;
    color: white;
    padding: 5px 15px;
    border-radius: 32px;
    font-weight: 500;
    font-size: 13px;
    line-height: 1.71;
    transition: all 0.2s ease-in-out;
}

.login-btn:hover {
    border: 1px solid #008FFF;
    background-color: white;
    color: #008FFF;
}

/* section1 */
.section1-background {
    background-image: url(../img/Bime.png);
    background-position: center;
    background-size: 100%;
    background-position: bottom;
    padding-bottom: 20rem;
    background-repeat: no-repeat;
}

.section1-title {
    margin-bottom: 20px;
    font-weight: bold;
    font-size: 35px;
    color: #4a4a4a;
}

@media (max-width: 850px) {
    .section1-background {
        padding-bottom: 5rem;
        margin-top: 3rem;
    }

    .section1-title {
        font-size: 29px;
    }
}

.section1-subtitle {

    font-size: 1em;
    color: #717171;
}

.section1-subtitle2 {
    font-size: 0.8em;
}

.section1-cadr {
    display: flex;
    width: 120px;
    height: 120px;
    padding: 10px;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    color: #333;
    font-size: 14px;
    background: #fff;
    border: 1px solid #d1d1d1;
    border-radius: 32px;
    margin: 5px;
    text-align: center;
    transition: all 0.2s ease-in;
}

.section1-cadr:hover {
    box-shadow: 0 16px 12px -10px rgba(60, 64, 67, 0.262);
}

.section1-cadr span {
    margin-top: 8px;
}

.display-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

@media (max-width: 768px) {
    .section1-cadr {
        width: calc(33.33% - 10px);

    }

    .w-20-small {
        width: 30% !important;
    }
}

@media (max-width: 480px) {
    .section1-cadr {
        width: calc(50% - 10px);
    }
}

.border-b {
    border-bottom: 1px solid var(--color-low1);
}

.section1-cadr2 {

    display: flex;
    width: 215px;
    height: 60px;
    padding: 10px;
    align-items: center;
    justify-content: center;
    color: #333;
    cursor: pointer;
    background: #fff;
    border: 1px solid #d1d1d1;
    border-radius: 16px;
    margin: 5px;
    text-align: right;
    flex-wrap: nowrap;
    flex-direction: row;
    transition: all 0.2s ease-in;
}

.section1-cadr2:hover {
    box-shadow: 0 16px 12px -10px rgba(60, 64, 67, 0.262);
}

.section1-cadr2 img {
    width: 40px !important;
    height: auto;
    margin-left: 10px;
}

.section1-cadr2 span {
    font-size: 14px;
    color: #333;
}

@media (min-width: 1025px) {
    .w-60 {
        width: 60%;
    }
}

@media (max-width: 768px) {
    .section1-cadr2 {
        width: 150px;
    }

}

/* section2 */
.section2-cadr {
    padding: 32px 64px;
    box-shadow: 0 2px 16px rgba(4, 10, 31, .04);
    border-radius: 32px;
    border: 1px solid #f5f5f5;
    margin: 1.2rem auto;
    background: #fff;
}

@media (max-width: 768px) {
    .section2-cadr {
        padding: 32px 30px;
    }

}

.section2-cadr-container {
    display: flex;
    align-items: center;
    width: 100%;
    flex-direction: row;
}

.section2-cadr-container .title {
    display: block !important;
    font-weight: bold;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0%;
    color: #4a4a4a;
    margin-bottom: 10px;
}

.section2-cadr-container p {
    margin-right: 30px;

    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0%;
    text-align: justify;
    color: rgba(4, 10, 31, 0.6);
}

.section2-cadr-container img {
    width: 20% !important;
    height: 100%;
}

@media (max-width: 768px) {
    .section2-cadr-container {
        flex-direction: column !important;
    }

    .section2-cadr-container img {
        width: 25% !important;
        height: 100%;
        margin-bottom: 20px;
    }

}

/* section3 */
.section3-title {
    color: #333;
    font-size: 26px;
    font-weight: bold;
    line-height: 1.8;
    text-align: center;
}

.section3-p {
    color: gray;
    margin: 20px 0 30px;
    text-align: justify;


}

.section3-step {
    background: #fff;
    padding: 10px 20px;
    border-radius: 25px;
    font-size: 14px;
    width: 90%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 10px 0;
}

.number {
    color: #fb0;
    font-size: 20px;
    margin-left: 5px;
    font-weight: bold;
}

.section3-button {
    width: fit-content;
    color: rgba(255, 255, 255, 1);
    background-color: #008FFF;

    border-radius: 8px;
    padding: 8px 22px;
    transition: all 0.3s ease-in-out;
}

.section3-button:hover {
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}

@media (max-width: 768px) {
    .section3-step {

        width: 100%;

    }
}

/* section4 */
.section4-reminder-cadr {
    display: block;
    width: 75%;
    max-width: 1020px;
    margin: 0 auto;
    border: 2px solid #494949;
    border-radius: 35px;
    z-index: 2;
    position: relative;
    background: #fff;
}

.section4-reminder {
    text-align: center;
    position: relative;
    color: #040a1f;
    background: #fff;
    padding: 45px 20px;
    margin-top: -11px;
}

.reminder-title {
    text-align: center;
    padding: 30px 20px;
    font-size: 22px;
    background: #fb0;
    position: relative;
    border-top-right-radius: 35px;
    border-top-left-radius: 35px;
}

.simi1 {
    position: absolute;
    top: -14px;
    right: 5%;
    background-image: url(../img/simi.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 50px;
    height: 50px;

}

.simi2 {
    position: absolute;
    top: -14px;
    left: 5%;
    background-image: url(../img/simi.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 50px;
    height: 50px;
}

.input-container {
    position: relative;
    width: 100%;

}
.dropdown-input{
text-align: right;
direction: rtl;
}
.dropdown-input::placeholder {
    text-align: right;
    direction: rtl;
  }
.input-container input {
    width: 100%;
    padding: 12px 10px;
    font-size: 14px;
    line-height: 1.4375em;
    color: rgba(0, 0, 0, 0.87);
    background-color: rgba(255, 255, 255, 0.38);
    border: 1px solid #ccc;
    border-radius: 8px;
    outline: none;
    transition: all 0.3s;
    cursor: pointer;

}

.input-container select {
    width: 100%;
    padding: 12px 10px;
    font-size: 14px;
    line-height: 1.4375em;
    color: rgba(0, 0, 0, 0.87);
    background-color: rgba(255, 255, 255, 0.38);
    border: 1px solid #ccc;
    border-radius: 8px;
    outline: none;
    transition: all 0.3s;
    cursor: pointer;

}

/* .input-container label {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 14px;
    color: gray;
    pointer-events: none;
    transition: all 0.3s;
    background: white;
    padding: 0 5px;
} */
.input-container label {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 14px;
    color: gray;
    pointer-events: none;
    transition: all 0.3s;
    background: white;
    padding: 0 5px;
}

/* وقتی select دارای value باشد (یعنی گزینه انتخاب شده) */
.input-container select:valid {
    border-color: #008FFF;
    /* تغییر رنگ border */
}

/* label به بالای select حرکت کند */
.input-container select:valid+label {
    top: -10px;
    font-size: 12px;
    color: #008FFF;
}

/* .input-container input:focus+label,
.input-container input:not(:placeholder-shown)+label {
    top: 0;
    font-size: 12px;
    color: #007bff;
}
.input-container select:focus+label,
.input-container select:not(:placeholder-shown)+label {
    top: 0;
    font-size: 12px;
    color: #007bff;
} */
/* استایل لیست */
.the-dropdown {
    display: none;
    position: absolute;
    top: 48px;
    left: 0;
    width: 100%;
    background: white;
    border: 1px solid #ffffff;
    border-radius: 4px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 10;
    max-height: 200px;
    overflow-y: auto;
    font-size: 14px;
}




.the-dropdown div {
    padding: 10px;
    cursor: pointer;
    transition: background 0.2s;
}

.the-dropdown div:hover {
    background: rgba(0, 0, 0, 0.1);
}

/* نمایش لیست هنگام کلیک */
.input-container.active .the-dropdown {
    display: block;
}

@media (max-width: 769px) {
    .p-reminder {
        padding: 10px;
    }

    .mt-3-small {
        margin-top: 3rem;
    }
}

@media (min-width: 769px) {
    .p-reminder {
        padding: 50px 85px;
    }
}

.section4-button {
    width: fit-content;
    color: rgba(255, 255, 255, 1);
    background-color: #008FFF;
    font-size: 14px;
    border-radius: 8px;
    padding: 8px 19px;
    transition: all 0.3s ease-in-out;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.section4-button-icon {
    margin-left: 6px;
    margin-right: 6px;
}

/* section5 */
.section5-cadr {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    flex-wrap: nowrap;
    align-items: center;
    text-align: center;
}

.section5-cadr img {
    width: 40% !important;
    opacity: 0.8;
}

.section5-cadr span {
    margin-top: 10px;
}

/* section6 */
.section6-cadr {
    position: relative;
    padding: 70px 31px 30px 31px;
    border-radius: 35px;
    display: flex;
    flex-flow: column;
    align-items: center;
    background: #fff;
    margin: 104px auto 0;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .12);
    width: 90%;
    border: 2px solid transparent;
    margin-bottom: 10px;
}

.section6-cadr-p {
    font-size: 15px;
    color: gray;
    text-align: justify;

}

.section6-cadr-img {
    position: absolute;
    top: -100px;
    width: 150px;
    height: 150px;
    border: none;
    margin: auto;
    display: block;
    border-radius: 35px;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .12);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.img1 {
    background-image: url(../img/1.jpg);
}

.img2 {
    background-image: url(../img/2.jpg);
}

.img3 {
    background-image: url(../img/3.jpg);
}

.img4 {
    background-image: url(../img/4.jpg);
}

.img5 {
    background-image: url(../img/5.jpg);
}

.img6 {
    background-image: url(../img/6.jpg);
}

.img7 {
    background-image: url(../img/7.jpg);
}

.img8 {
    background-image: url(../img/8.jpg);
}

.section6-cadr .title {
    display: flex;
    justify-content: center;
    font-weight: 600;
    color: #333;
    font-size: 16px;
    margin-bottom: 8px;
}

/* section7 */
.section7-container {
    border-radius: 32px;
    background: rgba(4, 10, 31, .87);
    padding: 64px 56px;
    margin: 0 auto;
    color: #fff;
    display: flex;
    align-items: center;
    position: relative;
}

.text-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.section7-title {
    font-size: 19px;
    line-height: 1.68;
    letter-spacing: 0.15%;
    text-align: center;
    color: rgba(255, 255, 255, 0.74);
}

.section7-subtitle {
    font-size: 33px;
    line-height: 1.7;
    letter-spacing: 0.1%;
    text-align: center;
    color: rgb(255, 255, 255);
}

.info-section {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.info-item {
    text-align: center;
    flex: 1;
}

.info-item strong {
    font-weight: 700;
    font-size: 40px;
    margin-bottom: 8px;
    text-align: center;
    color: #23B4FF;
    display: block;
}

.info-item span {
    font-weight: 500;
    font-size: 19px;
    text-align: center;
    color: rgba(255, 255, 255, 1);
}

.image-container {
    display: flex;
    justify-content: center;
}

.floating-img {
    position: absolute;
    top: -80px;
    right: 40px;
    width: 100%;
    max-width: 350px;
    animation: floating 3s ease-in-out infinite;
}

.floating-img2 {
    width: 100%;
    max-width: 350px;
    margin-top: -100px;
}

@media (max-width: 769px) {
    .section7-container {
        padding: 30px 35px;

    }

    .section7-title {
        font-size: 15px;
        font-weight: bold;
    }

    .section7-subtitle {
        font-size: 20px;
        font-weight: bold;
    }

    .info-section {
        flex-direction: column;
    }

    .info-item {
        margin: 15px 0;
    }

    .info-item strong {

        font-size: 28px;
    }

    .info-item span {
        font-weight: bold;
        font-size: 18px;

    }

    .margin-top-8 {
        margin-top: 8rem !important;
    }
}

/* section8 */
.section8-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0 90px;

}

.section7-titles {
    font-weight: bold;
    font-size: 16px;
    display: inline;
    color: #008FFF;
    color: #008FFF;
}

.section8-description {
    font-size: 14px;
    line-height: 1.71;
    color: rgba(4, 10, 31, 0.6);
}

.section8-img {
    animation: floating 3s ease-in-out infinite;
    width: 80%;
}

@keyframes floating {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0px);
    }
}

@media (max-width: 769px) {
    .section8-container {
        align-items: center;

    }

    .section8-description {
        text-align: center;
    }

    .width-100-s {
        width: 100%;
        text-align: center;
    }
}

/* section9 */
.s9-bac {
    margin-top: 50px;
    padding-bottom: 105px;
    background: radial-gradient(22.05% 52.22% at 83.4% 50%, rgba(0, 251, 40, .08) 0, rgba(0, 251, 40, 0) 100%), radial-gradient(21.11% 50% at 50% 50%, rgba(0, 143, 255, .16) 0, rgba(0, 143, 255, 0) 100%), radial-gradient(21.11% 50% at 21.11% 50%, rgba(0, 251, 40, .08) 0, rgba(0, 251, 40, 0) 100%);

}

.section9-cadr {
    height: 296px;
    overflow: hidden;
    padding: 32px 40px !important;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    border-radius: 16px;
    background-color: white;
    box-shadow: 0 16px 24px rgba(0, 0, 0, .04), 0 8px 10px rgba(0, 0, 0, .08) !important;
    margin-bottom: 5rem;
}

.section9-cadr-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header-name {
    color: rgb(97, 97, 97);
    font-size: 16;
    font-weight: bold;
}

.header-stars {
    color: #ffc728;
    margin-right: 3px;
}

.header-stars-gray {
    color: rgba(128, 128, 128, 0.371);
    margin-right: 3px;
}

.header-rol {
    max-width: 70%;
    text-align: center;
    color: var(--color-1);
    background-color: #0091ff1e;
    margin: 8px 0;
    border-radius: 16px;
    padding: 2px 4px;
}

.section9-cadr-body {
    height: 100%;
    display: flex;
    align-items: center;
    font-size: 14px;
    line-height: 1.71;
    color: rgb(97, 97, 97);
}

.section9-cadr-body p {
    text-align: justify;
}

/* section10 */
.section10-title {
    margin-bottom: 20px;
    font-size: 25px;
    color: #4a4a4a;
}

.s10-bac {
    background-image: url(../img/section10-bac.png);
    background-position: center;
    background-size: cover;
    height: 40vh;
    display: flex;
    justify-content: center;
    align-items: center;

}

.company-container {
    display: flex;
    justify-content: space-evenly;
}

.company-container img {
    width: 60px;
    height: auto;
}

@media (max-width: 850px) {
    .s10-bac {

        height: auto;


    }

    .company-container {
        display: flex;
        justify-content: space-evenly;
        flex-wrap: wrap;
    }

    .company-container img {
        margin: 10px;
    }
}

/* section11 */
.section11-container {
    width: 100%;
    box-shadow: 0 97px 39px -70px rgba(4, 10, 31, .1);
    border-radius: 32px;
    padding: 56px 88px 40px 72px;
    border: 3px solid rgba(35, 65, 223, .1);
    background-color: white;
}

.section11-img {
    width: 300px;
    height: 256px !important;
    color: white;
    height: auto;
    border-radius: 32px;
    background: #008fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.section11-img p {
    font-size: 36px;
    font-weight: bold;
}

.section11-img strong {
    font-size: 25px;
}

.section11-header {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

.section11-header p {
    font-size: 33px;
    color: var(--color-1);
}

.section11-header span {
    font-weight: bold;
    font-size: 19px;
    color: rgba(4, 10, 31, 0.481);
}

@media (max-width: 850px) {
    .section11-container {

        padding: 56px 40px 40px 40px;

    }

    .section11-header {
        margin-bottom: 10px;
        justify-content: center;
        flex-direction: column;


    }

    .section11-header p {
        margin-top: 10px;
        text-align: center;
        font-size: 28px;
        color: var(--color-1);
    }

    .section11-header span {
        font-size: 17px;
        text-align: center;
    }

}

.section11-body {
    text-align: justify;
    color: rgba(4, 10, 31, 0.711);
}

.section11-caption .icon {
    font-size: 20px;
    color: var(--color-2);
    margin: 0 7px;
}

/* section12 */
.section12-cadr {
    width: 120px;
    height: 100px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-1);
    border-radius: 23px;
    margin-bottom: 1rem;
}

.section12-cadr2 {
    background-color: rgb(255, 199, 40);
}

.section12-container {
    display: flex;
    justify-content: space-evenly;
}

@media (max-width: 850px) {
    .section12-container {
        display: flex;
        flex-wrap: wrap;
    }
}

/* section13 */
.section13-container {
    color: #fff;
    padding: 50px 20px;
    background: #008fff;
    text-align: center;
    display: flex;
    justify-content: center;

}

.section13-title {
    margin-bottom: 20px;
    font-weight: bold;
    font-size: 35px;
    color: #ededed;
}

.section13-container div {
    text-align: center;
    width: 70%;
}

@media (max-width: 990px) {
    .section13-title {
        font-size: 26px;
    }
}

/* footer */
.the-footer {
    width: 100%;
    height: 100%;
    background-color: rgb(255, 255, 255);
    padding: 5rem 5rem 2rem 3rem;
}

.footer-col1 {
    padding: 0 1rem;
    height: max-content;
    color: rgba(4, 10, 31, 0.748);
    font-size: 14px;

}

.footer-col1 p {

    text-align: justify;
    font-size: 15px;
    line-height: 25px;
}

.footer-title {
    font-size: 15px;
    color: var(--color-2);
    font-weight: bold;
}

/* .footer-title::after {
    content: "";
    display: block;
    border-radius: 5px;
    background: var(--color-1);
    width: 55px;
    height: 4px;
    margin-top: 10px;
} */

.news-title {
    color: rgb(198, 198, 198);
    transition: all 0.1s ease-in;
}

.news-title:hover {
    color: rgb(255, 255, 255);
}

.news-date {
    color: rgb(146, 146, 146);
}

.footer-col2 ul {
    padding: 0 2px;
    width: auto;
    margin-top: 20px;
    display: grid;
    gap: 10px;
}

.footer-col2 ul li {
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-col2 ul li a {
    color: #1a1a1aba;
    font-size: 15px;
    text-decoration: none;
    transition: all 0.1s ease-in;
}

.footer-col2 ul li a:hover {
    color: #000000;
}

.footer-col2 ul li::before {
    /* content: ""; */
    display: none;
    /* width: 8px;
    height: 8px;
    background: #b8bdd7;
    border-radius: 8px; */
}

.col3-container {
    display: flex;
    gap: 14px;
}

.col3-icon-container {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 21px;
}

.col3-content {
    width: auto;
    display: grid;
    gap: 3px;
}

.col3-content span {
    color: #fff;
    font-size: 13px;
    font-weight: bold;
}

.fs-p3-content p span {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
}

.footer-cadr {
    width: 77px;
    height: 80px;
    box-shadow: 0 10px 59px -20px rgba(4, 10, 31, 0.763);
    border-radius: 10px;
    background: #ffffff;
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px 1rem;
}

.copyright {

    padding: 16px 8%;
    background: linear-gradient(90.06deg, #0052d4 .05%, #4364f7 54.75%, #6fb1fc 109.45%);
}

.copyright-display {
    justify-content: space-between;
}

@media (max-width: 990px) {
    .copyright-display {
        justify-content: center !important;
        flex-direction: column;
        align-items: center;
    }

    .the-footer {
        padding: 0rem 2rem 2rem 2rem;
    }
}

.copyright p {
    color: white;
    font-size: 14px;
}

/* nav for small screen */
@media (max-width: 990px) {
    .mt-small-3 {
        margin-top: 2rem;
    }

    .mt-small-1 {
        margin-top: 1rem;
    }

    .nav-style {
        position: relative;
        margin-top: -22px !important;
    }

    .copyright {
        padding-bottom: 4rem;
    }

    .smallnav-container {
        z-index: 1000;
        position: fixed;
        bottom: 0px;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        height: 66px;
        border-radius: 20px 20px 0 0;
        /* background: linear-gradient(90deg, rgba(0, 114, 197, 1) 0%, rgba(253, 166, 3, 1) 100%); */
        background-color: white;
        box-shadow: 0px 4px 20px 0px rgba(0, 23, 139, 0.637);
        display: grid;
        grid-template-columns: 1fr 1fr 55px 1fr 1fr;
        align-items: center;
        justify-content: center;
        padding: 6px 16px 1px 16px;
        text-align: center;

    }

    .smallnav-container-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        color: rgb(131, 131, 131);
        font-size: 20px;
    }

    .smallnav-container-item-active {
        color: var(--color-1);
    }

    .center-item {
        width: 55px;
        height: 55px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 15px;
        background: #ffffff91;
        box-shadow: 0px 15px 85px -21px rgba(68, 74, 88, 0.1);
    }

    .center-item img {
        width: 43px;
        height: 43px;
    }

    .smallnav-container-item span {
        font-size: 10px;
        margin-top: 12px;
    }

    /* .smallscreen-container {
        justify-content: center !important;
    } */

    /* استایل منوی کشویی */
    .small-dropdown-menu {
        display: none;
        position: fixed;
        bottom: 70px;
        left: 50%;
        transform: translateX(-50%);
        width: 85%;
        border-radius: 25px;
        background: #fff;
        box-shadow: 0px 15px 85px -21px rgba(68, 74, 88, 0.1);
        padding: 10px 0;
        z-index: 1000;
    }

    .small-dropdown-menu .submenu2 {
        max-height: 140px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .small-dropdown-menu .submenu2::-webkit-scrollbar {
        width: 6px;
    }

    .small-dropdown-menu .submenu2::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 3px;
    }

    .small-dropdown-menu .submenu2::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

    .menu-title {
        color: #525252;
        font-weight: bold;
        font-size: 14px;
    }

    .menu-subtitle {
        color: #656a85;
        font-weight: none;
        font-size: 13px;
    }

    .has-submenu>a::after {
        content: "▼";
        font-size: 12px;
        margin: 0 8px;
        transition: transform 0.3s ease;
    }

    .has-submenu.theactive>a::after {
        transform: rotate(180deg);
    }
}

.small-dropdown-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.small-dropdown-menu li {
    padding: 10px 15px;
    cursor: pointer;
    transition: all 0.3s;
}


.submenu {
    display: none;
    padding-left: 15px;
}

.has-submenu>a::after {
    content: "▼";
    font-size: 12px;
    margin-left: 5px;
}

.has-submenu.active>.submenu {
    display: block;
}



.small-menu {
    width: 85%;
    position: absolute;
    right: 7.5%;
    padding-inline: 20px;
    padding-block: 20px 34px;
    bottom: 83px;
    border-radius: 25px 25px 0px 0px;
    background: #ffffff47 !important;
    box-shadow: 0px 15px 85px -21px rgba(68, 74, 88, 0.1);
}

.small-menu a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #3d79fc;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
}

/* responsive */
@media (max-width: 768px) {
    .copyright p {
        white-space: normal;
        margin-bottom: 5px;
    }
}

@media (min-width: 992px) {

    .mt-7 {
        margin-top: 7rem !important;
    }

}

/* car-insurance */
.car-insurance-link {
    font-size: 12px;
    display: flex;
    align-items: center;
    padding: 0 10px;
}

.car-insurance-link p {
    color: rgba(4, 10, 31, 0.38);
    margin: 0 8px !important;

}

.car-insurance-link a {
    color: rgba(4, 10, 31, 0.38);
    margin: 0 8px !important;

}

.car-insurance-link .des {
    color: rgba(0, 0, 0, 0.705);
    margin: 0 8px !important;

}

.car-insurance-link-icon {
    font-size: 10px;
    color: rgba(4, 10, 31, 0.315);

}

.car-insurance-container {
    padding: 36px 68px;
    border: 1px solid #e0e0e0;
    border-radius: 50px;
    box-shadow: 0 40px 22px -29px rgba(4, 10, 31, .08);
}

@media (max-width:768px) {
    .car-insurance-container {
        padding: 36px 40px;
    }
}

.car-insurance-container h2 {
    font-size: 26px !important;
    font-weight: bold;
}

.car-insurance-container p {
    font-size: 16px;
    line-height: 1.5;
    color: rgba(4, 10, 31, 0.6);
}

.car-insurance-container .link {
    font-size: 13px;
    display: block;
    color: rgb(117, 117, 117);
}

.link a {
    color: var(--color-2);
    font-weight: bold;
}

.car-insurance-body {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-flow: column;
}

.carplate {
    background-image: url(/Media/img//car-plate-default.svg);
    background-size: 100% 100%;
    width: 100%;
    height: 46px;
    background-repeat: no-repeat;
    display: inline-flex;
    box-sizing: content-box;
    border-radius: 5px;
    max-width: 230px;
    min-width: 230px;
    position: relative;
}

.carplate-input1 {
    position: absolute;
    border: none;
    left: 22px;
    top: 2px;
    bottom: 0;
    width: 39px;
    height: 100%;

}

.carplate-input1 input {
    margin-top: 1px;
    border: none;
    width: 100%;
    height: 90%;
    border-radius: 4px;
    background-color: #ffffff;
    /* border: 1px solid #d0d0d0; */
    text-align: center;
}

.carplate-input2 {
    position: absolute;
    border: none;
    left: 65px;
    top: 2px;
    bottom: 0;
    width: 51px;
    height: 100%;

}

.carplate-input2 input {
    margin-top: 1px;
    border: none;
    width: 100%;
    height: 90%;
    border-radius: 4px;
    background-color: #e3e3e3;
    text-align: center;

}

.carplate-input3 {
    position: absolute;
    border: none;
    left: 120px;
    top: 2px;
    bottom: 0;
    width: 55px;
    height: 100%;

}

.carplate-input3 input {
    margin-top: 1px;
    border: none;
    width: 100%;
    height: 90%;
    border-radius: 4px;
    background-color: #ffffff;
    border: 1px solid #f2f2f2;
    text-align: center;
}

.carplate-input4 {
    position: absolute;
    border: none;
    right: 2px;
    bottom: 3px;
    width: 50px;
    height: 65%;

}

.carplate-input4 input {
    margin-top: 1px;
    border: none;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background-color: #ffffff;
    border: 1px solid #f2f2f2;
    text-align: center;
}


.input-1 {
    color: currentcolor;
    box-sizing: content-box;
    margin: 0px;
    display: block;
    min-width: 0px;
    width: 100%;
    height: 20px;
    padding: 14px 16px !important;
}

.the-input-container {
    margin-left: 32px;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.38);
    font-size: 14px;
    border-radius: 8px;
    height: auto;
    max-width: 230px;
    min-width: 230px;
    padding: 13px;
}

.the-input-container p {
    margin-top: 4px;
    margin-right: 2px;
    font-size: 12px;
    color: rgb(109, 109, 109);

}

.the-input-container input {
    border-radius: 7px;
    border: 1px solid #ccc;
    padding: 10px;
    width: 100%;
    text-align: center;
}

input::placeholder {
    color: rgb(196, 196, 196);
    text-align: center;
}

input {
    outline: none;
    border: 1px solid #ccc;
    padding: 10px;

}

.hr1 {
    width: 40%;
    border-color: rgb(56, 56, 56) !important;
}

.circle-exclamation-icon {
    color: #646464;
    margin-left: 5px;
    font-size: 14px;
}

.collapse-btn {
    background-color: white !important;
    color: #292929;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    text-align: right;
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
    padding-right: 1.7rem;
    padding-left: 1.7rem;
    box-shadow: 0px 15px 85px -21px rgba(0, 0, 0, 0.366) !important;
    font-size: 15px;
}

.card-header {
    padding: 0 !important;
}

.collapse-btn:focus {
    outline: none;
}

.collapse-icon {
    color: var(--color-1);
    font-size: 30px;
    transition: transform 0.3s ease;
}

.card-body {
    padding-right: 1.4rem;
    padding-left: 1.4rem;
    color: #959595;
    background-color: white !important;
    border-radius: 0 0 1rem 1rem !important;
}

.accordion {
    background-color: transparent !important;
}

.card {
    --bs-card-bg: transparent !important;
    --bs-card-bg: #ffffff00 !important;
    --bs-card-border-color: rgb(0 0 0 / 0%) !important;
}

.card-header,
.collapse-btn {
    background-color: transparent !important;
    box-shadow: none;
}

.car-insurance-img {
    width: 75%;
}

@media (max-width: 768px) {
    .mt-small-2 {
        margin-top: 2rem;
    }
}

/* car-insurance2 */
.dropdown-header {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    background: #ffffff;
    font-weight: bold;
    cursor: pointer;
}

.dropdown-header div {
    flex: 1;
    text-align: center;
    padding: 5px;
}

.dropdown-header div.active {
    background: #007bff;
    color: white;
    border-radius: 4px;
}

.next-pre-container {
    display: flex;
    justify-content: space-between;
}

@media (max-width: 990px) {
    .next-pre-container {
        display: block;

    }
}

.pre-button {
    background-color: transparent;
    color: #008FFF;
    border: 1px solid #008FFF !important;
}



/* car-insurance5-2 */
.radio-container {
    background-color: rgb(255, 255, 255);
    border: 1px solid rgb(189, 189, 189);
    padding: 20px 16px;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.radio-container input {
    display: none;
}

.custom-radio {
    width: 18px;
    height: 18px;
    border: 2px solid rgb(189, 189, 189);
    border-radius: 50%;
    display: inline-block;
    position: relative;
}

.radio-container input:checked+.custom-radio {
    border-color: #007bff;
    background-color: #007bff;
}

.radio-container input:checked+.custom-radio::after {
    content: "";
    width: 8px;
    height: 8px;
    background: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
}

.radio-container input:checked~span,
.radio-container input:checked {
    color: white;
}

.radio-container input:checked~span,
.radio-container input:checked~* {
    color: #007bff;
}

.radio-container.selected {
    border-color: #007bff;
}

/* Motorcycle-insurance */
.Motorcycle-insurance-body {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-flow: column;
}

.Motorcycleplate {
    background-image: url(../img/motor-plate-default.svg);
    background-size: 100% 100%;
    width: 100%;
    height: 46px;
    background-repeat: no-repeat;
    display: inline-flex;
    box-sizing: content-box;
    border-radius: 5px;
    max-width: 230px;
    min-width: 230px;
    position: relative;
}

.Motorcycleplate-input1 {
    position: absolute;
    border: none;
    left: 70px;
    top: 2px;
    bottom: 0;
    width: 60px;
    height: 100%;

}

.Motorcycleplate-input1 input {
    margin-top: 1px;
    border: none;
    width: 100%;
    height: 90%;
    border-radius: 4px;
    background-color: #ffffff;
    /* border: 1px solid #d0d0d0; */
    text-align: center;
}

.Motorcycleplate-input2 {
    position: absolute;
    border: none;
    right: 7px;
    top: 2px;
    bottom: 0;
    width: 78px;
    height: 100%;

}

.Motorcycleplate-input2 input {
    margin-top: 1px;
    border: none;
    width: 100%;
    height: 90%;
    border-radius: 4px;
    background-color: #fdfdfd;
    text-align: center;

}

.adout-Motorcycle-insurance {
    padding: 30px 35px;
    border: 1px solid #e0e0e0;
    border-radius: 50px;
    box-shadow: 0 40px 22px -29px rgba(4, 10, 31, .08);
    background-color: #fff;
    text-align: justify;
}

.adout-Motorcycle-insurance .title {
    font-weight: bold;
    font-size: 24px;
    color: var(--color-1);
}

.adout-Motorcycle-insurance .subtitle {
    margin-top: 3rem;
    font-weight: bold;
    font-size: 17px;
    color: var(--color-1);
}

.adout-Motorcycle-insurance .subtitle2 {
    font-weight: bold;
    font-size: 15px;
}

.adout-Motorcycle-insurance p {
    font-size: 14px;
    color: #494949;
    line-height: 33px;
}

.adout-Motorcycle-insurance ul li {
    font-size: 14px;
    color: #494949;
    line-height: 33px;
}

/* health-insurance */
.health-insurance-body {
    display: flex !important;
    justify-content: center !important;
    flex-flow: column;
}

.health-insurance-type {
    border: 1px solid #bdbdbd;
    cursor: pointer;
    border-radius: 16px;
    padding: 20px 16px !important;
    background-color: transparent;
    width: 90%;
    transition: all 0.2s ease-in-out;

}

.health-insurance-type:hover {

    background-color: #fff;

}

.health-insurance-type .icon {
    font-size: 36px;
    margin-left: 21px;
    margin-right: 12px;
    color: var(--color-1);
}

.health-insurance-type p {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 3px !important;
    color: rgba(4, 10, 31, 0.87);
}

.health-insurance-type span {
    font-size: 12px;
    color: #333;
}

@media (max-width: 992px) {
    .health-insurance-type {
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }
}

/* health-insurance(op1-1) */
.quantity-container {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

input[type="number"] {
    width: 50px;
    text-align: center;
    border-radius: 5px;
}

.display-none {
    display: none;
}

.radio-container.selected2 {
    border: 1px solid var(--color-1);
    color: var(--color-1) !important;
}

.person-container {
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius: 5px;
    min-height: 144px;
    border: 2px solid #3333331b !important;
    flex-direction: column;
    cursor: pointer;
    transition: 0.3s;
}

.person-container.selected {
    border: 2px solid var(--color-low1) !important;
    background-color: rgba(0, 123, 255, 0.1);
}

.person-container .icon {
    font-size: 27px;
    color: #33333381;
}


.person-container.selected .icon {
    color: var(--color-1);
}

.person-container p {
    font-size: 14px;
    color: #3333339d;
}


.person-container.selected p {
    color: #333;
}

/* travel */
.travel-input-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

.travel-dropdown-input {
    width: 100%;
    padding: 10px;
    cursor: pointer;
    position: relative;
    direction: rtl;
    border-radius: 7px;
    border: 1px solid #ccc;
    
}

.select-travel-dropdown-input {
    border: 1px solid var(--color-1);
}

.travel-input-container .label-input {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: white;
    padding: 0 5px;
    transition: 0.3s;
    color: gray;
}

.travel-input-container.active .label-input,
.travel-dropdown-input:not(:placeholder-shown)+.label-input {
    top: 0;
    font-size: 12px;
    color: #007bff;
}

.country-dropdown {
    direction: rtl;
    display: none;
    position: absolute;
    width: 100%;
    background: white;
    border: 1px solid #ccc;
    height: 200px;
    overflow-x: auto;
    z-index: 10;
    flex-direction: column;
    padding: 10px 12px;
}

.travel-input-container.active .country-dropdown {
    display: flex;
}

.label-checkbox {
    position: relative !important;
    margin-top: 12px;
}

.label-checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 15px;
    margin: 5px 0;
}

.label-checkbox input {
    appearance: none;
    padding: 8px;
    border: 2px solid var(--color-1);
    border-radius: 4px;
    margin-left: 8px;
    position: relative;
    cursor: pointer;
    transition: 0.3s;
}

.label-checkbox input:checked {
    background-color: #007bff;
}

.label-checkbox input:checked::after {
    content: "✔";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 12px;
    font-weight: bold;
}

/* medical */
.medical-type {
    background: #f9f9f9;
    color: #333;
    width: 45%;
    margin: 0 auto;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 8px 3px;
    cursor: pointer;
    border: 1px solid #dedede;
    border-radius: 17px;
    font-weight: 400;
    font-size: 15px;
    outline: 0 !important;
    transition: all 0.3s ease-in-out !important;
}

.medical-type:hover {
    border-color: var(--color-1);

}

/*insurance-company*/
.insurance-company-section1 {
    padding-bottom: 4rem;
    /* padding-top: 6rem; */

}

.about-company-title {
    font-weight: 500;
    font-size: 33px;
    line-height: 1.7;
    color: #040A1F;
}

.about-company-description {
    text-align: justify;
    font-size: 14px;
    line-height: 1.71;
    letter-spacing: 0%;
    color: rgba(4, 10, 31, 0.87);
}

.circle-container {
    position: relative;
    width: 100%;
    max-width: 500px;
    height: auto;
    aspect-ratio: 1/1;
    /* برای حفظ نسبت دایره */
    margin: 0 auto;
    overflow: hidden;
}

/* دایره‌ها */
.circel-img3 {
    width: 80vw;
    height: 80vw;
    max-width: 416px;
    max-height: 416px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.2;
}

.circel-img2 {
    width: 65vw;
    height: 65vw;
    max-width: 330px;
    max-height: 330px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.5;
}

.circel-img1 {
    width: 50vw;
    height: 50vw;
    max-width: 251px;
    max-height: 251px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.circel-img4 {
    width: 10vw;
    height: 10vw;
    max-width: 251px;
    max-height: 251px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* بقیه عناصر */
.bime-img-container {
    width: 10vw;
    height: 10vw;
    max-width: 50px;
    max-height: 50px;
    background-color: rgb(255, 255, 255);
    border-radius: 50%;
    padding: 2px;
    position: absolute;

}

.bime-img-container1 {
    top: 30%;
    left: 25%;
}

.bime-img-container2 {
    top: 6%;
    left: 60%;
}

.bime-img-container3 {
    top: 50%;
    left: 78%;
}

.bime-img-container4 {
    bottom: 17%;
    right: 75%;
}

@media (max-width: 992px) {

    .about-company-title {
        font-size: 25px;

    }

    .circle-container {
        max-width: 300px;
    }

    .circel-img1 {
        width: 50%;
        height: auto;
    }

    .circel-img2 {
        width: 70%;
        height: auto;
    }

    .circel-img3 {
        width: 90%;
        height: auto;
    }

    .circel-img4 {
        width: 30%;
        height: auto;
    }

    /* .bime-img-container {
        width: 8vw;
        height: 8vw;
        max-width: 40px;
        max-height: 40px;
    } */

    .mt-10 {
        margin-top: 3rem;
    }
}

@media (max-width: 576px) {
    .insurance-company-section1 {
        padding-bottom: 5rem;
        padding-top: 3rem;

    }

    .circle-container {
        max-width: 100%;
    }

    /* .bime-img-container {
        width: 6vw;
        height: 6vw;
        max-width: 30px;
        max-height: 30px;
    } */
}

.insurance-company-section2 {
    padding: 48px 80px;
    max-width: 1064px;
    margin: auto;
    border-radius: 30px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 97px 39px -70px rgba(4, 10, 31, .1);
}

@media (max-width: 992px) {
    .insurance-company-section2 {
        padding: 48px 40px;
    }
}

.insurance-company-section2 .title {
    font-size: 23px;
    line-height: 1.74;
    letter-spacing: 0%;
    color: rgba(4, 10, 31, 0.87);
}

.insurance-company-section2 .description {
    line-height: 28px;
    text-align: justify;
    color: rgba(0, 0, 0, 0.768);
    font-size: 14px;
}

.insurance-company-section3-back {
    background: radial-gradient(46.9% 46.1% at 100% 51.56%, rgba(0, 143, 255, .08) 0, rgba(0, 143, 255, 0) 91.4%), radial-gradient(31.53% 36.84% at 51.11% 36.15%, rgba(67, 111, 255, 0.22) 0, rgba(255, 206, 67, 0) 100%), radial-gradient(39.83% 34.56% at 0 55.33%, rgba(0, 143, 255, .08) 0, rgba(0, 143, 255, 0) 100%);

}

.insurance-company-section3 {
    max-width: 1064px;
    margin: auto;
}

/* @media (max-width: 992px) {
    .insurance-company-section3{
        padding: 48px 40px;
    }
} */
.insurance-company-section3 .title {
    text-align: center;
    font-size: 45px;
    color: rgba(0, 0, 0, 0.926);
}

@media (max-width: 992px) {
    .insurance-company-section3 .title {
        font-size: 23px;

    }
}

.insurance-company-section3 .description-title {
    font-size: 23px;
}

.insurance-company-section3 .description {
    line-height: 28px;
    text-align: justify;
    color: rgba(47, 47, 47, 0.768);
    font-size: 16px;
}

.bime-company-type-container {
    display: flex;
    box-shadow: 0 16px 24px rgba(0, 0, 0, .04), 0 8px 10px rgba(0, 0, 0, .08);
    padding: 32px;
    background-color: white;
    border-radius: 8px;
    gap: 18px;
    margin-bottom: 2rem;
}

@media (max-width: 992px) {
    .bime-company-type-container {
        justify-content: center;
        flex-wrap: wrap;
    }
}

.bime-company-type-container .img-container {
    padding: 12px;
    min-width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 24px;
    border: 1px solid #e0e0e0;

}

.bime-company-type-container .description {
    font-size: 15px;
    line-height: 24px;
    text-align: justify;
    color: rgba(47, 47, 47, 0.768);
}

.bime-company-type-container-title {
    font-size: 16px;
    line-height: 1.5;
    font-weight: bold;
    color: #040A1F;
}

@media (max-width: 992px) {
    .insurance-company-section3 .description-title {
        font-size: 20px;
    }
}

.insurance-company-section4-title {
    font-size: 21px;
    text-align: center;
}

.insurance-company-section4-subtitle {
    font-size: 16px;
    text-align: center;
    color: rgba(4, 10, 31, 0.6);
}

.section4-all-company {
    flex-wrap: wrap;
    display: flex;
    justify-content: center;
}

.all-company-container {
    margin: 40px 16px 0;
}

.all-company-img-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 88px;
    height: 88px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 16px 24px rgba(0, 0, 0, .04), 0 8px 10px rgba(0, 0, 0, .08);
    background-color: white;
    border-radius: 8px;
}

.all-company-img-container img {
    width: 70%;
}

.all-company-container p {
    font-size: 14px;
    text-align: center;
    display: block;
    color: rgba(4, 10, 31, 0.6);
}

/* contact */
.contact-container {
    padding: 30px 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(4, 10, 31, .08);
    background-color: white;
}

.contact-container .title {
    color: #383838;
    font-weight: bold;
    font-size: 21px;
}

.contact-container hr {
    border-width: 0;
    border-style: solid;
    border-color: rgb(0 0 0 / 23%);
    border-bottom-width: thin;
}

.contact-container p {
    color: #6b6b6b !important;
    margin-top: 12px;
    font-size: 14px;
}

.contact-container h4 {
    color: #383838 !important;
    font-size: 16px;
    font-weight: bold;
}

.social-medial-container {
    display: flex;
    align-items: center;
}

.social-medial-container .thecontainer {
    display: flex;
    gap: 20px;
}

.social-medial-container .circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--color-1);
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.social-medial-container .circle:hover {
    transform: scale(1.1);
}

.social-medial-container .circle img {
    width: 50%;
    height: 50%;
}

.sm-icon {
    color: white;
    font-size: 24px;
}

/* other */
.other-insurance-body {
    display: flex !important;
    flex-flow: column;
    flex-direction: row;
    flex-wrap: wrap;
}

.other-insurance-type {
    border: 1px solid #fff;
    cursor: pointer;
    padding: 20px 16px !important;
    background-color: transparent;
    width: 45%;
    border-radius: 9px;
    box-shadow: 0 0 6px hsla(0, 0%, 70%, .51);
    transition: all 0.2s ease-in-out;
    margin: 0 8px;

}

.other-insurance-type:hover {
    border: 1px solid var(--color-1);
}

.other-insurance-type-p {
    font-size: 12px !important;
    margin: 0 !important;
    color: rgba(55, 55, 55, 0.87) !important;
}

.other-insurance-type:hover .other-insurance-type-p {
    color: var(--color-1) !important;
}

/* blog */
.sidebar {
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.sidebar h5{
   color: var(--color-1);
   font-size: 16px;
  
}
.main-content {
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.main-content h4{
    font-size: 21px; 
    color: rgb(48, 48, 48);
}
.main-content h2{
    font-size: 28px; 
   
}
.main-content p{
    color: rgb(93, 93, 93);
    text-align: justify;
    line-height: 35px;
}
@media(max-width:768px){
    .main-content p{
        line-height: 33px;
    }
}
.image-banner {
    border-radius: 8px;
    overflow: hidden;
}

.image-banner img {
    width: 100%;
    height: auto;
}

.popular-item {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 8px 0;
}

.popular-item h6 {
    display: -webkit-box;
    color: rgba(4, 10, 31, 0.87);
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 15px;
}

.popular-item p {
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.popular-item img {
    width: 80px;
    height: 70px;
    border-radius: 8px;
    margin-left: 15px;
    object-fit: cover;
}

.popular-item:hover {
    background-color: #e9ecef58;
    border-radius: 8px;
   
}
.sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
    
}

.sidebar ul li {
    position: relative;
    padding-right: 20px; 
    margin-bottom: 8px;
    font-size: 13px;
    color: gray;
}
.sidebar ul li a{color: gray ;}
.sidebar ul li::before {
    font-family: FontAwesome;
    content: "\f104"; 
    font-weight: 900; 
    position: absolute;
    right: 0; 
    top: 0;
    
}
.sidebar ul li:hover{
    color: var(--color-1);
}
.sidebar ul li a:hover{
    color: var(--color-1);
}
.share-icon{
    width:40px; height:40px;
    transition: all 0.2s ease-in-out;
}
.share-icon:hover{
    transform: scale(1.2);
}
/* blogs */
.card-body .title-container{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;

}
.card-body .title-container .card-title{
    width: 68%;
 font-size: 16px;
 color: rgba(4, 10, 31, 0.87) !important;
}
.card-body .title-container .card-text{
    font-size: 11px;
   }
.navbar-custom {
    background-color: #0d6efd;
}
.navbar-custom .nav-link, .navbar-custom .navbar-brand {
    color: white !important;
}
.card-custom {
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
}
.card-custom .card-title{
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.card-custom .card-text{
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-custom:hover {
    transform: translateY(-5px);
}
.card-img-top {
    height: 180px;
    object-fit: cover;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.card-custom-btn{
    width: 120px;
    height: 40px;
    color: rgba(255, 255, 255, 1);
    background-color: #008FFF;
    font-size: 14px;
    border-radius: 8px;
    padding: 8px 19px;
    transition: all 0.3s ease-in-out;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    cursor: pointer;
}
.section2-blog {
    border-radius: .5rem;
    background-color: #ffffff;
    /* overflow: hidden; */
    position: relative;
    display: flex;
    justify-content: start;
    align-items: center;
    color: #008fff;
    width: 100%;
    padding: 20px 10px;
    box-shadow: 0 4px 6px #00000021;
}

.section2-blog a {
    font-size: 16px;
    margin: 0 10px;
    color: #008fff;
}
.animation-floating2 {
    animation: floating2 1s ease-in-out infinite;
}
@keyframes floating2{
    0% {
        transform: translatex(0px);
    }
    50% {
        transform: translatex(-10px);
    }
    100% {
        transform: translatex(0px);
    }
}
.section2-blog  img {
    position: absolute;
    bottom: -13px;
    left: 10px;
    transform: rotate(335deg);
}
.flex-w-wrap{
    flex-wrap: wrap;
}
.custom-pagination .page-link {
    color: #008FFF;
    border: 1px solid #008FFF;
    margin: 0 10px;
    border-radius: 8px;
    /* box-shadow: 0 2px 5px rgba(0,0,0,0.1); */
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
}

.custom-pagination .page-link:hover {
    background-color: #008FFF;
    color: #fff;
   
}

.custom-pagination .page-item.active .page-link {
    background-color: #008FFF;
    color: #fff;
    border-color: #008FFF;
}

.custom-pagination .page-item.disabled .page-link {
    opacity: 0.5;
    cursor: not-allowed;
}
.no-border{
    border: none !important;
}
.loading {
    display: none;
    text-align: center;
    margin: 20px 0;
}

.spinner {
    border: 4px solid rgba(0, 0, 0, 0.1);
    border-left: 4px solid #008FFF;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 1s linear infinite;
    margin: 0 auto;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.success-message {
    display: none;
    background-color: #d4edda;
    color: #155724;
    padding: 15px;
    border-radius: 8px;
    margin-top: 20px;
    text-align: center;
}

.error-message {
    display: none;
    background-color: #f8d7da;
    color: #721c24;
    padding: 15px;
    border-radius: 8px;
    margin-top: 20px;
    text-align: center;
}