

@font-face {
    font-family: "HelveticaNeueLTArabic";
    src: url("../assets/font/HelveticaNeueLTArabic-Bold.ttf") format("truetype"), url("../assets/font/HelveticaNeueLTArabic-Light.ttf") format("truetype"), url("../assets/font/HelveticaNeueLTArabic-Roman.ttf") format("truetype"),
}

body {
    font-family: "HelveticaNeueLTArabic", sans-serif !important;
}

.sme-title {
    color: var(--primary-1);
    text-align: center;
    font-family: "HelveticaNeueLTArabic", sans-serif !important;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}
.card-img-top {
    width: 46px !important;
    filter: invert(0);
    display: flex;
    height: auto;
    padding: 37px 0 0 0;
}




p.card-text-content.title {
    color: var(--primary-1);
    font-family: ;
    font-style: normal;
    font-weight: 200;
    text-align: center;
    text-wrap: balance !important;
}

.dot-sme {
    z-index: -1 !important;
    padding: 0px 341px 0 0;
}

.bd-highlight.medium {
    font-size: 10px !important;
}


/* CSS */

.sme-button {
    display: flex;
    justify-content: center;
    direction: rtl;
    list-style-type: none;
    gap: 23px;
}

/* sultan section start*/

.img-container {
    position: relative;
    text-align: center;
}

.sultan-img {
    width: 100%;
    object-fit: contain;
}

.text-overlay {
    position: absolute;
    top: 50%;
    left: 25%;
    transform: translate(-50%, -50%);
    text-align: start;
    max-width: 35%;
}

p.sultan-text {
    color: var(--primary-1);
    text-align: justify;
    font-family: "HelveticaNeueLTArabic", sans-serif !important;
    font-size: medium;
    font-style: normal;
    font-weight: 200;
    line-height: 150%;
    letter-spacing: 1px;
}

/* sultan section end*/

/* Speech of the Chairman of the Authority start */
.border-about-box {
    border-radius: 20px !important;
}

.text-speach {
    color: var(--primary-1);
    font-size: large;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    font-family: "HelveticaNeueLTArabic", sans-serif !important;
}

/* Styles for RTL text direction */
[dir="rtl"] .text-speach {
    text-align: right;
}

/* Additional adjustment if needed */
[dir="ltr"] .text-speach {
    text-align: left;
}

.img-card {
    z-index: 1 !important;
    margin-top: -65px !important;
    position: relative;
    background: #FFF;
    height: 449px;
    left: 17px;
}

.halima-pic {
    position: relative !important;
    top: 19px !important;
}

.card-box3 {
    height: 357.25px;
    width: 1088.6px;
    margin: 65px;
    padding: 0px;
}

.card-text-about {
    color: var(--Dark-Blue, var(--primary-1));
    text-align: right;
    font-family: "HelveticaNeueLTArabic", sans-serif !important;
    font-size: medium;
    font-style: normal;
    font-weight: 200;
    line-height: 190%;
    text-align: justify;
}

.text-message {
    display: flex;
    flex-direction: column;
    align-items: end;
    color: var(--Dark-Blue, var(--primary-1));
}

.card-title {
    color: var(--primary-1);
    text-align: right;
    font-family: "HelveticaNeueLTArabic", sans-serif !important;
    font-size: larger;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    border-radius: 12px;
}


.vision-title {
    color:  var(--primary-2) !important;
    font-size: large;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}
/* Styles for RTL text direction */
[dir="rtl"] .vision-title {
    text-align: right;
}

/* Additional adjustment if needed */
[dir="ltr"] .vision-title {
    text-align: left;
}


/* Styles for RTL text direction */
[dir="rtl"] .padding-card {
    padding:3rem;
}

/* Additional adjustment if needed */
[dir="ltr"] .padding-card {
    padding: 0 0px 0px 0px;
}


.vision-text {
    color: var(--primary-2);
    text-align: right;
    font-size: medium;
    font-style: normal;
    font-weight: 100;
    line-height: 150%;
}

p.halima-name {
    border-radius: 12px;
    background: #FFF;
    height: 85px;
    flex-shrink: 0;
    color: var(--primary-1);
    text-align: center;
    font-size: medium;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    position: relative;
    top: 25px;
}

span.posaition-name {
    display: block;
    color: var(--primary-1);
    text-align: center;
    font-size: small;
    font-style: normal;
    font-weight: 100;
    line-height: 0%;
}

.dot-bg {
    position: absolute;
    z-index: -1;
    background: #ffffff;
    width: auto;
    display: flex;
    top: 169px;
    height: 384px;
    display: flex;
    flex-direction: column;
    margin: 0px -35px -2px 0;
}
/* Speech of the Chairman of the Authority end */

/* Authority’s powers */
.royal-decree-title {
    color: var(--primary-1);
    text-align: center;
    font-family: "" HelveticaNeueLTArabic ", sans-serif !important;";
    font-size: large;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.card-text-contant {
    display: flex;
    flex-direction: column;
    align-items: end;
    color: var(--Dark-Blue, #004876);
    text-align: center;
    font-family:;
    font-size: large;
    font-style: normal;
    font-weight: 100;
    line-height: 137%;
}

.card-sme {
    background: rgba(61, 193, 211, 0.1) !important;
    border: 1px !important;
    border-radius: 2.25rem !important;
    max-width: 17rem !important;
    min-height: 320px !important;
    max-height: 400px !important;
}


.carousel-control-next-icon, .carousel-control-prev-icon {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 100% 100%;
    background: var(--primary-1);
    border-radius: 50px;
    position: relative;
    right: 0;
}





.clamp-3-lines {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form-pic {
    border-radius: 20px;
    height: 119px;
    width: 100px;
}

.card-ourvision {
    width: 1047.6px;
    margin: -43px;
    padding: 0px;
    border-width: 2px;
    margin-left: 187px;
}

.card-text-vision {
    color: var(--primary-2);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.vision-message {
    width: 73%;
    gap: 37px;
    position: relative;
    left: 10%;
}

.vision {
    position: relative;
    top: -110px;
    left: 103%;
}
/* Authority’s powers end */

/* our vision */

.card-top-img {
    width: fit-content;
    height: 62px;
    position: relative;
    margin-top: 6px;
    margin-left: 34px !important;
}

.card-top-img2 {
    width: fit-content;
    height: 62px;
    position: relative;
    margin-top: 12px;
    margin-left: 34px !important;
}

.card-img {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    border-radius: 12px !important;
    background: #FFF;
    border: 1px solid var(--primary-2);
}

.card-img-vision {
    width: 9rem !important;
    height: 7rem !important;
}

.card-title3 {
    color: #AA9767;
    text-align: right;
    font-family:;
    font-size: 27px;
    font-style: normal;
    font-weight: 100;
    line-height: 150%;
}

.card-text-2 {
    font-size: medium;
}

.card-img-vision {
    width: 9rem !important;
    height: 7rem !important;
}

.card-img-bg {
    background: #FFF;
    border: 1px solid var(--primary-2);
    border-radius: 12px !important;
}

.sme-border-box {
    border: 1px solid #EDEDEE !important;
    border-radius: 20px !important;
    padding: 25px 16px 24px 0px !important;
}

.sme-border-box1 {
    border: 1px solid #EDEDEE !important;
    border-radius: 20px !important;
    padding: 25px 29px 24px 36px !important;
}
.card2-sme {
    background: rgba(61, 193, 211, 0.1) !important;
    height: 93px !important;
    display: flex;
    justify-content: center;
    border: none !important;
}


.carousel-control-next-sme, .carousel-control-prev-sme {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4% !important;
    padding: 0;
    color: #fff;
    text-align: center;
    background: 0 0;
    border: 0;
    opacity: 1 !important;
    transition: opacity .15s ease;
}

.img-form {
    height: fit-content;
}

.img-form2 {
    height: 50% !important;
    width: 57% !important;
}

.card-img {
    width: 88px !important;
    height: 88px !important;
}
.img-top-padding {
    padding:16px 0 0 0;
}

.text-justify {
    text-align: justify;
}
/* Tablet styles */
@media screen and (max-width: 992px) {

    .card-ourvision {
        width: max-content;
        margin-left: -43px;
    }

    .vision-message {
        width: auto;
        position: relative;
        left: -5%;
    }

    /* community */
    .title-community {
        font-size: 40px;
        width: auto;
    }

    .dot-pic2 {
        display: none;
    }

    .dot-bg {
        display: none;
    }
}


/* Phone styles */
@media screen and (max-width: 768px) {
    .card-ourvision {
        width: 100%;
        margin-left: 0;
    }

    .form-pic {
        width: 80px;
    }

    .test3 {
        flex-direction: column;
    }

    p.halima-name {
        border-radius: 12px;
        background: #FFF;
        height: 85px;
        flex-shrink: 0;
        color: var(--primary-1);
        text-align: center;
        font-size: small;
        font-style: normal;
        line-height: 150%;
    }

    .card-text-about {
        display: flex;
        flex-direction: column;
        padding: 0 0 21px 1px
    }

    .text-overlay {
        position: absolute;
        top: 55%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: start;
        max-width: fit-content;
    }

    .dot-sme {
        display: none !important;
    }

    .header-icon {
        margin-top: 20px;
        margin-right: -128px !important;
        display: block;
        position: absolute;
    }

    .electronic-services {
        margin-right: 16px !important;
    }
    /* community */
    .title-community {
        font-size: 30px;
        padding: 11px 2px 0px 10px;
    }

    .dot-pic2 {
        display: none;
    }

    .dot-bg {
        display: none;
    }

    .bg-light,
    .bg-lightbeige,
    .about-community {
        font-size: 16px;
        width: 100%;
        text-align: center;
    }
}

@media (min-width: 768px) {
    .button-60 {
        padding: 4px 13px;
        width: auto;
        min-width: 150px;
    }

    .button-66 {
        padding: 4px 13px;
        width: auto;
        min-width: 150px;
    }


    .title-community2 {
        font-size: 33px;
    }

    .col-md-3 {
        flex: 0 0 auto;
        width: 31%;
    }

    .button-61 {
        padding: 4px 13px;
        width: auto;
        min-width: 118px;
    }

    .about-your {
        font-size: 20px;
    }

    .know-more {
        margin-right: -157px;
        width: 601px;
    }
}

@media screen and (max-width: 576px) {
    /*  .sultan-img {
        width: 106.3%;
        height: 394px;
        object-fit: cover;
        margin: 0px -11px 0px 3px;
    }*/
    .sultan-img {
        width: 100%;
        height: 394px;
        object-fit: cover;
    }

    p.sultan-text {
        font-size: medium;
        width: 305px;
        background: #ffffff5c;
        color: #004876;
        text-align: justify;
    }

    .text-overlay {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: start;
        width: max-content;
    }

    .sm-flex-revers {
        display: flex;
        flex-direction: column-reverse;
    }
    /*.carousel-inner {*/
    /*    margin-bottom: 47px !important;*/
    /*}*/
    .test3 {
        flex-direction: column;
    }

    .test4 {
        gap: 2px;
        flex-direction: column;
        margin-right: 67%;
    }

    .card-visin {
        width: 100%;
        margin-right: 0;
    }

    .form-pic {
        width: 100%;
        max-width: 300px;
    }

    .dot-bg {
        display: none;
    }

    .dot-sme {
        display: none !important;
    }

    .vision {
        position: relative;
        top: -2px;
        left: -25%;
    }

    .vision-message {
        width: 73%;
        gap: 6px;
        position: relative;
        left: 18%;
        display: flex;
        flex-direction: column-reverse;
        margin-bottom: 39px;
    }

    .vision-img {
        position: relative;
        top: 93px;
    }

    .gap-space {
        gap: 4px;
    }

    .header-icon {
        margin-top: 20px;
        margin-right: -116px !important;
        display: block;
        position: absolute;
    }

    .electronic-services {
        margin-right: 16px !important;
    }

    a.electronic-services-a {
        color: #238DC1 !important;
    }

    .card-img-vision {
        display: none !important;
    }

    .text-message {
        font-size: medium;
    }

    .sme-button {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 3px;
        direction: rtl;
    }

    .button-66 {
        padding: 15px;
    }

    /* community */
    .dot-pic2 {
        display: none !important;
    }

    .bg-light,
    .bg-lightbeige,
    .about-community {
        font-size: 16px;
        width: 100%;
        text-align: center;
    }

    /* classification */
    .about-your {
        font-size: 16px;
    }

    .know-more {
        margin-right: -168px;
        width: max-content;
    }

    .cursor {
        cursor: pointer;
        width: 85%;
        position: relative;
        right: 19px;
    }

    .button-61 {
        font-size: 14px;
        min-height: 32px;
        min-width: 83px;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .sultan-img {
        width: 100%;
        height: 394px;
        object-fit: cover;
    }
}

@media screen and (min-width: 1024px) and (max-height: 600px) {
    p.halima-name {
        border-radius: 12px;
        background: #FFF;
        height: auto;
        flex-shrink: 0;
        color: var(--primary-1);
        text-align: center;
        font-family:;
        font-size: medium;
        font-style: normal;
        font-weight: 100;
        line-height: 289%;
        position: relative;
        top: 118px;
        left: 6px;
    }

    .halima-pic {
        position: relative !important;
        top: 119px !important;
        left: 21px;
    }

    .dot-bg {
        position: absolute;
        /* z-index: -1; */
        background: #ffffff;
        width: auto;
        display: flex;
        top: 206px;
        height: 362px;
        display: flex;
        flex-direction: column;
        margin: 0px -35px -2px 0;
    }

    .row.d-flex.justify-content-center.gap-space {
        gap: 52px;
    }
}

@media screen and (min-width: 1280px) and (min-height: 800px) {
    .dot-bg {
        position: absolute;
        z-index: -1;
        background: #ffffff;
        width: auto;
        display: flex;
        top: 205px;
        height: 467px;
        display: flex;
        flex-direction: column;
        margin: 0px -35px -2px 0;
    }
}

@media screen and (min-width: 768px) and (min-height: 1024px) {
    p.sultan-text {
        text-align: justify;
        font-family: "HelveticaNeueLTArabic", sans-serif !important;
        font-size: medium;
        font-style: normal;
        font-weight: 100;
        line-height: 150%;
        letter-spacing: 1px;
        background: #ffffff5c;
        color: #004876;
    }
}

@media screen and (min-width: 1024px) and (min-height: 1366px) {
    .card-sme {
        background: #e7eef83b !important;
        border: 1px solid #e7eef83b !important;
        border-radius: 2.25rem !important;
        width: auto !important;
        min-height: 283px !important;
        max-height: 800px !important;
    }
}
