/* Fonts */
@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-Black.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-ExtraBold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-Bold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-SemiBold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-Plain.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-SemiLight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-Light.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'BahijTheSansArabic';
    src: url('../fonts/Bahij_TheSansArabic/Bahij_TheSansArabic-SemiLight.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

/* CSS Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    font-family: 'BahijTheSansArabic', sans-serif !important;
}

:root {
    --main-clr: #003B65;
    --dark-main-clr: #012844;
    --semi-dark-main-clr: #025590;
    --main-light-clr: rgba(182, 223, 252, 28%);
    --sl-main-clr: #0073C5;
    --sc-clr: #F4F6F9;
    --th-clr: #F4F3F3;
    --text-color:#2E2E2E;
    --gray-clr:#6B6B78;
    --light-clr:#FEFEFE;
    --text-clr: #43A55D;
    --dark-clr:#111111;
    --footer-text-clr:#0059B1;
    --shadow: rgba(84, 99, 122, 10%)
}

a {
    cursor: pointer !important;
}

.letter-space-1 {
    letter-spacing: 0.1px;
}

/* Additional global styles */
nav ul li {
    width: 40px;
    height: 40px;
    line-height: 40px;
}

/* colors classes */
.main-bg {
    background-color: var(--main-clr) !important;
}

.text-main {
    color: var(--main-clr) !important;
}

.sl-main-bg {
    background-color: var(--sl-main-clr) !important;
}

.text-sl-main {
    color: var(--sl-main-clr) !important;
}

.main-light-bg {
    background-color: var(--main-light-clr) !important;
}

.text-main-light {
    color: var(--main-light-clr) !important;
}

.sc-bg {
    background-color: var(--sc-clr) !important;
}

.text-sc {
    color: var(--sc-clr) !important;
}

.main-btn {
    padding: 12px 22px;
    border-radius: 13px;
}

.card {
    padding: 7px;
    border: none;
    border-radius: 10px;
    box-shadow: 1px 5px 50px 0px var(--shadow);
}

/* hero css start */
.hero-wrapper {
    position: relative;
    background-image: url("../images/hero.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
}

.hero-wrapper::after {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 50%);
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 11;
}

.hero-title {
    font-size: 80px;
    font-weight: 600;
    line-height: 107px;
    letter-spacing: 0px;
    color: white;
}

.hero-subtitle {
    font-size: 40px;
    font-weight: 600;
    line-height: 107px;
    letter-spacing: 0px;
    color: white;
}

/* hero css end */
/* statistics css start */
.statstics-wrapper {
    background-color: var(--main-clr);
    padding: 30px 0px;
}

/* statistics css end */

/* home about css start */
.home-about-title {
    font-size: 40px;
    font-weight: 600;
    line-height: 56px;
    letter-spacing: 0px;
    color: white;
    background-color: var(--main-clr);
    border-bottom-left-radius: 55px;
}

.home-about-description {
    font-size: 24px;
    font-weight: 400;
    line-height: 40px;
    color: var(--dark-main-clr);
}

/* home about css end */
/* trainers css start */
.trainers-wrapper {
    position: relative;
    background-image: url("../images/trainers-background.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 100%;
}

.trainers-content {
    position: relative;
    z-index: 11;
}

.trainers-title {
    font-size: 40;
    font-weight: 600;
    line-height: 26px;
    letter-spacing: 0px;
    color: var(--main-clr);
}

.trainers-description {
    font-size: 32px;
    font-weight: 500;
    line-height: 56px;
    letter-spacing: 0px;
    color: var(--semi-dark-main-clr);
}

.trainers-card-note {
    font-size: 14px;
    font-weight: 600;
    line-height: 23.3px;
    letter-spacing: 0.07px;
    color: var(--text-clr);
    border: 1px solid var(--text-clr);
}

.tainers-card-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: 0.1px;
    color: var(--main-clr);
}

.tainers-card-description {
    font-size: 12px;
    font-weight: 500;
    line-height: 25px;
    letter-spacing: 0.1px;
    color: var(--semi-dark-main-clr);
}

/* trainers css end */

/* courses css start */
.courses-description {
    font-size: 24px;
    font-weight: 500;
    line-height: 46px;
    letter-spacing: 0px;
    color: var(--semi-dark-main-clr);
    width: 50%;
}

.courses-btn {
    font-size: 20px;
    font-weight: 600er;
    line-height: 22px;
    color: var(--main-clr);
    background-color: white;
    border: 1.5px solid var(--main-clr) !important;
}

/* courses css end */

/* why mpl css start */

.why-mpl-wrapper {
    position: relative;
    background-image: url("../images/about-us-background.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    max-width: 100%;
}

.why-mpl-wrapper::after {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 70%);
    z-index: 1;
}

.why-mpl-content {
    position: relative;
    z-index: 11;
}

.why-mpl-header {
    font-size: 40px;
    font-weight: 600;
    line-height: 46px;
    color: white;
}

.about-us-item {
    font-size: 20px;
    font-weight: 600;
    line-height: 36px;
    letter-spacing: 0px;
}

/* why mpl css end */

/* legal translation css start */
.legal-translation-title {
    font-size: 48px;
    font-weight: 600;
    line-height: 26px;
    color: var(--main-clr);
}

.legal-translation-semi-title {
    font-size: 24px;
    font-weight: 600;
    line-height: 42px;
    letter-spacing: 0px;
    color: var(--main-clr);
}

.legal-translation-description {
    font-size: 24px;
    font-weight: 400;
    line-height: 36px;
    letter-spacing: 0px;
    color: var(--main-clr);
}

.slider-content {
    flex-grow: 1;
    flex-shrink: 1;
    min-width: 150px;
    border-radius: 30px;
    background-color: var(--th-clr);
    padding: 1rem;
    text-align: center;
}

.arrow-right,
.arrow-left {
    flex-shrink: 0;
}

.translation-slide {
    width: 100%;
    text-align: start;
    font-size: 22px;
    font-weight: 400;
    line-height: 70px;
    letter-spacing: 0px;
    color: var(--main-clr);
    list-style: none;
    border-bottom: 1.5px solid rgb(0,0,0);
}

/* legal translation css end */
/* reviews css start */
.slider-content .review-card{
    background-color: var(--light-clr);
    box-shadow: 0px 4px 12px 0px rgba(0,0,0,8%);
    border-radius: 13px;
}
.review-description{
    font-size: 16px;
    font-weight: 400;
    line-height:24px ;
    letter-spacing: 0px;
    color: var(--gray-clr);  
}
.reviewer-name{
    font-size: 14px;
    font-weight:600 ;
    line-height:20px ;
    letter-spacing: 0px;
    color: var(--text-color);
}
.reviewer-positon{
    font-size:14px ;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0px;
    color:var(--gray-clr) ;
}

/* reviews css end */
/* footer css start */
.footer-wrapper{
    background-color: var(--dark-clr);
}
.footer-header{
    font-size: 16px;
    font-weight: 600;
    line-height: 19.2px;
    letter-spacing: 0px;
    color: var(--footer-text-clr);   
}
.footer-item{
    list-style: none;
}
.footer-value{
    font-size: 16px;
    font-weight:400 ;
    line-height: 26px;
    letter-spacing: 0px;
    color:white ;  
}

.footer-bottom li a{
    padding: 4px;
    text-align: center;
}

.footer-bottom {
    border-color: rgba(255, 255, 255, 0.1);
}




/* responsive */

@media (max-width: 900px) {
    .hero-title {
        font-size: 40px;
        line-height: 50px;
    }
    .hero-subtitle {
        font-size: 24px;
        line-height: 30px;
    }
    .home-about-title {
        font-size: 30px;
        line-height: 40px;
    }
    .home-about-description {
        font-size: 20px;
        line-height: 30px;
    }
    .trainers-title {
        font-size: 30px;
        line-height: 40px;
    }
    .trainers-description {
        font-size: 20px;
        line-height: 30px;
    }
    .courses-description {
        font-size: 20px;
        line-height: 30px;
    }
    .why-mpl-header {
        font-size: 30px;
        line-height: 40px;
    }
    .about-us-item {
        font-size: 16px;
        line-height: 30px;
    }
    .legal-translation-title {
        font-size: 30px;
        line-height: 40px;
    }
    .legal-translation-semi-title {
        font-size: 20px;
        line-height: 30px;
    }
    .legal-translation-description {
        font-size: 20px;
        line-height: 30px;
    }
    .review-description {
        font-size: 14px;
        line-height: 20px;
    }
    .reviewer-name {
        font-size: 12px;
        line-height: 16px;
    }
    .reviewer-positon {
        font-size: 12px;
        line-height: 16px;
    }
    .footer-header {
        font-size: 14px;
        line-height: 16px;
    }
    .footer-value {
        font-size: 14px;
        line-height: 20px;
    }
}