@import url(styles.css);

/* Start Fonts */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');

@font-face {
    font-family: '29LTAzer';
    src: url('../fonts/29LTAzer-Regular.otf');
}

@font-face {
    font-family: '29LTAzerLight';
    src: url('../fonts/29LTAzer-Light.otf');
}

@font-face {
    font-family: '29LTAzerMed';
    src: url('../fonts/29LTAzer-Medium.otf');
}

@font-face {
    font-family: '29LTAzerBold';
    src: url('../fonts/29LTAzer-Bold.otf');
}

/* End Fonts */

:root {
    --main-color: #215560;
    --sec-color: #ffcc00;
    --dark-color: #001E06;
    --bg-color: #ECFFF0;
    --bg-grad: linear-gradient(180deg, #DDF4E2 0%, #ECFFF0 100%);
}

* {
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: #000;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

a:hover {
    text-decoration: none;
    color: var(--sec-color);
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

a:focus {
    text-decoration: none;
    /* color: inherit; */
}

button,
button:hover {
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

body {
    direction: rtl;
    padding: 0;
    margin: 0;
    font-family: '29LTAzer';
    background: #fff;
    text-align: start;
    overflow-x: hidden;
}

section,
footer {
    overflow: hidden;
    position: relative;
}

p {
    margin: 0;
    font-size: 15px;
    line-height: 25px;
}

ul {
    padding: 0;
    margin: 0;
    display: block;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

li {
    display: block;
    list-style: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

iframe {
    width: 100%;
    height: 100%;
}

.padding {
    padding: 0 !important;
}

img {
    max-width: 100%;
}

input,
button,
input:focus,
button:focus,
input:active,
button:active,
button:hover,
textarea:active,
textarea:focus,
select,
select:active,
select:focus {
    outline: none !important;
}

textarea {
    resize: none;
    display: block;
}

main {
    /* overflow: hidden; */
    /* position: relative; */
    /* min-height: 100vh; */
}

.owl-carousel {
    direction: ltr;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: capitalize;
}

/* Start Sidebar */


.mobile-nav {
    display: none;
}

.m-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo img {
    width: 95px;
}

.main_menu {
    display: flex;
    align-items: center;
    gap: 35px;
}

.main_menu li a {
    font-size: 18px;
}

.left-header {
    max-width: 40%;
    flex: 40%;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 30px;
}

.left-header i {
    font-size: 20px;
}

.right-header {
    max-width: 40%;
    flex: 40%;
}

.logo-header {
    max-width: 10%;
    flex: 10%;
}

.logo {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btns-header {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.sub-menu {
    display: none;
}

.all-txt {
    direction: rtl;

    9;
    */ right: 0;
}

header.sticky {
    position: absolute;
    width: 100%;
    z-index: 9;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding: 20px 0px;
}

header.sticky ul li a {
    color: white;
    outline: none !important;
    !i;
    !;
}

header.sticky i {
    color: white;
}

.all-txt {
    position: absolute;
    right: 0;
    padding-inline-start: 70px;
    top: 50%;
    transform: translateY(-50%);
}

.slider-txt h3 {
    color: white;
    font-size: 57px;
    margin-bottom: 30px;
    font-weight: bold;
    line-height: 1.5;
}

.btn-slider a {
    font-weight: bold;
    color: var(--main-color);
    padding: 10px 30px;
    background: #f6c63e;
    font-size: 20px;
    display: inline-block;
    border-radius: 15px;
}

.slider-img {
    position: relative;
    height: 100vh;
    transition: 0.5s ease;
}

.slider-img::after {
    width: 100%;
    height: 100%;
    background: black;
    inset: 0;
    content: "";
    position: absolute;
    opacity: 0.5;
}

.slider-txt h3 span::before {
    content: "";
    position: absolute;
    top: -3px;
    left: -6px;
    width: 105%;
    height: 105%;
    background: var(--main-color);
    z-index: -1;
    /* clip-path: polygon(6% 0%, 91% 0%, 85% 100%, 0% 100%); */
    transform: skewX(-15deg);
}

.slider-txt h3 span {
    position: relative;
    color: var(--sec-color);
    margin: 0px 10px;
}

.btn-slider a {
    position: relative;
    overflow: hidden;
    /* height: 100%; */
}

.btn-slider a:hover::after {
    opacity: 1;
    animation: 1s fadeInUp;
}

.btn-slider a::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--main-color);
    inset: 0;
    z-index: 0;
    opacity: 0;
    transition: all 0.5s ease;
}

.btn-slider a span {
    position: relative;
    z-index: 1;
    color: var(--main-color);
}


.btn-slider a:hover span {
    color: var(--sec-color);
}

section.slider-home .owl-item.active .slider-txt h3 {
    animation: 1s fadeInUp;
}

section.slider-home .owl-item.active a {
    animation: 1s fadeInUp;
}

section.slider-home .owl-item.active .slider-txt h3 {
    animation: 1s fadeInUp;
}

section.slider-home .owl-item.active img {
    transform: scale(1.4);
    transition: all 20s ease;
}

#customDots {
    position: absolute;
    z-index: 99;
    left: 0;
    top: 65%;
    transform: translateY(-50%);
    padding-inline-end: 80px;
}

#customDots .owl-dot {
    background: transparent;
    box-shadow: none;
    border: none;
    color: white;
    font-size: 35px;
    padding: 0px 15px;
    line-height: normal;
    font-weight: bold;
    margin: 0 !important;
    transition: all 0.5s ease;
    position: relative;
}

#customDots .owl-dot.active {
    position: relative;
}

#customDots .owl-dot::after {
    content: "";
    position: absolute;
    background: var(--main-color);
    width: 100%;
    height: 105%;
    z-index: -1;
    right: 0px;
    top: -1px;
    clip-path: polygon(16% 0%, 101% 0%, 85% 100%, 0% 100%);
    transition: all 0.5s ease;
    opacity: 0;
}

#customDots .owl-dot.active::after {
    opacity: 1;
}

section.next-match {
    background: var(--main-color);
}

.team-logo-n img {
    width: 130px;
}

.all-next-match {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 80px;
}

.middle-n-match span {
    color: var(--sec-color);
    font-size: 102px;
}

span.midle-mark {
    margin: 0px 20px;
}

.team-next-block {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    height: 100% !important;
    !i;
    !;
}

section.next-match {
    padding: 80px 0px;
}

.next-match-tit h3 {
    text-align: center;
    color: var(--main-color);
    display: inline-block;
    margin: 0;
    background: var(--sec-color);
    font-weight: bold;
    padding: 5px 20px;
    border-radius: 15px;
}

.next-match-tit {
    text-align: center;
    margin-bottom: 40px;
}

.team-info-n h3 {
    color: white;
    font-size: 28px;
    font-weight: bold;
}

.team-logo-n {
    margin-bottom: 25px;
}

section.next-match::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/texture_bg.png);
    z-index: 0;
}

section.next-match .container {
    position: relative;
    z-index: 1;
}

.marqee-data {
    display: flex;
    align-items: center;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    width: 100%;
    padding: 17.4px 19.5px 14.7px;
    box-shadow: 0px 0px 30px 0px #00000026;
    /* border-radius: 8px; */
    margin: 20px 0px;
}

.marqee-data .maq-title {
    background: var(--sec-color);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    color: white;
    position: relative;
    font-weight: 600;
    font-size: 17px;
    line-height: 29px;
    width: 72.54px;
    height: 42.82px;
    margin-inline-end: 15px;
    border-radius: 0;
}

.marquee-inner {
    width: calc(100% - 99px);
    overflow: hidden;
}

.marquee {
    overflow: hidden;
    direction: ltr;
}

.marquee .js-marquee-wrapper {
    display: flex;
}

.js-marquee {
    display: flex;
    height: 100%;
    align-items: center;
    margin-inline: 4px !important;
}

.marquee p {
    padding-inline-end: 35px;
    padding-inline-start: 12px;
}

.marquee p {
    margin-bottom: 0;
    font-weight: 300;
    font-size: 16px;
    line-height: 34px;
    color: #6D6D6D;
    direction: rtl;
    position: relative;
}

.marquee p::before {
    position: absolute;
    content: '';
    width: 35px;
    height: 35px;
    background-image: url('../images/logo-madina.png');
    background-size: contain;
    right: -26.6px;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.4s;
}

.next-match-date {
    text-align: center;
    margin-top: 40px;
}

.next-match-date span {
    color: white;
    font-size: 18px;
    font-weight: bold;
}

.next-match-date h3 {
    color: white;
    margin-top: 20px;
    font-size: 50px;
    font-weight: bold;
}

section.about-sec {
    padding: 80px 0px;
}

p.small-tit {
    display: inline-block;
    background: var(--sec-color);
    color: var(--main-color);
    font-size: 18px !important;
    !i;
    !;
    padding: 5px 10px;
    font-weight: bold;
    margin-bottom: 25px;
}

.about-txt h3 {
    font-size: 30px;
    font-weight: bold;
}

.about-txt p {
    font-size: 16px;
    margin-bottom: 15px;
    border-radius: 15px;
}

.about-img {
    height: 600px;
}

.about-img img {
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.about-txt .btn-slider {
    margin-top: 30px;
}

.news-block {
    /*! margin: 0px 10px; */
    margin: 0px 10px;
    direction: rtl;
    box-shadow: 0px 10px 10px 0px rgba(100, 100, 100, 0.25);
    margin-bottom: 20px;
    padding-bottom: 20px;
    overflow: visible;
}

.news-img {
    height: 300px;
}

.news-img img {
    height: 100%;
}

.news-tit {
    margin: 20px 0px;
}

.news-tit h3 {
    font-size: 32px;
    font-weight: bold;
}

.news-desc p {
    font-size: 16px;
    margin-bottom: 20px;
}

.news-btn a {
    font-size: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: bold;
}

.news-btn a i {
    color: var(--sec-color);
}

.news-btn a:hover {
    color: var(--main-color);
}

.news-btn a:hover i {
    animation: 1s heartBeat;
}

.news-text {
    padding: 0px 20px;
}

.news-btn {
    padding: 0px 20px;
}

.news-tit-sec {
    display: flex;
    justify-content: space-between;
    padding: 0px 20px;
    align-items: center;
}

.news-tit-sec h3 {
    font-size: 42px;
    font-weight: bold;
    margin: 0;
}

.news-tit-sec {
    margin-bottom: 30px;
}

section.news-sec {
    margin: 80px 0px;
    overflow: visible;
}

.news-slider .owl-nav {
    color: var(--sec-color);
}

.news-slider .owl-nav button i {
    background: var(--main-color) !important;
    padding: 15px !important;
    border-radius: 50%;
    font-size: 20px;
}

.news-slider .owl-nav {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-inline-start: 10px;
}

.news-date {
    padding-inline-start: 20px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 6px;
    line-height: normal;
}

.news-date span {
    /* line-height: normal; */
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a7a7aa;
    margin: 0;
    padding: 0;
}

.news-date i {
    font-size: 16px;
    color: var(--sec-color);
}

section.clients-sec {
    padding: 80px 0px;
}

.clients-all {
    display: flex;
    flex-wrap: wrap;
}

.clients-all {}

.clients-all .client-block {
    max-width: 25%;
    flex: 25%;
    display: flex;
    justify-content: center;
    border: 1px solid #d2d2d2;
    padding: 10px;
}

.clients-all .client-block img {
    width: 150px;
}

.team-slider {
    position: relative;
    background: var(--main-color);
}

.team-slider::before {
    content: "";
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/texture_bg.png);
    z-index: 0;
}

section.team-section {
    padding: 80px 0px;
}

.team-block {
    position: relative;
}

.member-name {
    position: absolute;
    z-index: 1;
    bottom: 0;
    bottom: 55px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--sec-color);
    text-align: center;
    padding: 5px 46px;
    opacity: 0;
    transition: all 1s ease;
    border-radius: 15px;
}

.member-name h3 {
    margin: 5px;
    font-size: 26px;
    font-weight: bold;
    color: var(--main-color);
}

.member-name p {
    font-size: 16px;
}

section.clients-sec .news-tit-sec {
    padding: 0;
}

section.team-section .news-tit-sec {
    padding: 0;
}

.member-img {
    margin: 0 auto;
    width: 500px;
    transition: all0.5s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.center .member-img {
    width: 500px;
    transition: all 2s ease;
}


.team-slider .owl-carousel .owl-stage {
    display: flex;
}

.team-slider .owl-stage {
    display: flex;
    justify-content: center;
    align-items: end;
    min-height: 750px;
}

.team-slider .owl-stage .owl-item .item {
    height: 100%;
}

.team-slider .owl-stage .owl-item {
    height: 100%;
}

.member-img img {
    width: 320px !important;
    transition: all 2s ease;
}

.center .member-img img {
    width: 100% !important;
    transition: all 2s ease;
}

.center .member-name {
    opacity: 1;
}

.team-slider .owl-nav {
    position: absolute;
    left: 50%;
    bottom: -10%;
    transform: translate(-50%, 0);
    display: flex;
    align-items: center;
    gap: 20px;
}

.team-slider .owl-nav button i {
    background: var(--main-color) !important;
    padding: 15px !important;
    border-radius: 50%;
    font-size: 20px;
    color: var(--sec-color);
}

section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to right, transparent, var(--main-color), transparent);
    border-radius: 10px;
    padding: 3px;
    -webkit-mask: linear-gradient(to bottom, transparent, black, transparent);
    mask: linear-gradient(to bottom, transparent, black, transparent);
    z-index: -1;
    opacity: 0.2;
}

.stat-counter {}

.stat-counter .counter-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.counter-item {}

.stat-counter .counter-item .odometer {
    font-size: 45px;
    font-weight: bold;
}

.conter-s-txt {
    font-size: 34px;
    /*! max-width: 64%; */
    text-align: start;
}

.conter-s-txt h3 {
    font-size: 15px;
    font-weight: bold;
}

.conter-i {
    width: 60px;
}

.stat-counter {
    box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.1);
    padding: 25px;
    border-radius: 15px;
}

section.statistics {
    padding: 150px 0px 80px 0px;
}

.sec-title-center {
    text-align: center;
    margin-bottom: 40px;
}

.sec-title-center h3 {
    font-size: 42px;
    font-weight: bold;
}

.footer-inner {
    /* background: var(--main-color); */
    padding: 80px 0px 10px 0px;
    color: white;
    position: relative;
    z-index: 1;
}

.footer-col ul li a {
    color: white;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.5s ease;
}

.footer-col p {
    color: #C0C0C0;
    font-size: 16px;
    font-weight: 400;
}

.logo-footer img {
    width: 200px;
}

.footer-col h3 {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 20px;
}

footer {
    padding: 0;
    position: relative;
    background: var(--main-color);
}

ul.footer-list li i {
    font-size: 12px;
    margin-inline-end: 10px;
    color: var(--sec-color);
}

ul.footer-list li {
    display: flex;
    justify-content: start;
    align-items: center;
    margin-bottom: 20px;
}

.footer-inner .row {
    justify-content: space-between;
}

.num-footer {
    justify-content: start;
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
}

.num-footer i {
    background: var(--sec-color);
    padding: 10px;
    font-size: 22px;
    color: white;
    border-radius: 10px;
}

.footer-col ul li a:hover {
    color: var(--sec-color);
}

.num-footer.social-footer i {
    padding: 10px 15px;
    font-size: 18px;
    border-radius: 10px;
}

.copy-rights p {
    color: #C0C0C0;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #A0AABA2B;
    margin-top: 20px;
}

.logo-footer {
    margin-bottom: 30px;
}

footer::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/texture_bg.png);
    z-index: 0;
    opacity: 0.3;
}

.over-sec {
    width: 100%;
    height: 520px;
}

.over-sec img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.over-sec {
    position: relative;
}

.over-sec::after {
    content: "";
    position: absolute;
    inset: 0;
    background: black;
    opacity: 0.5;
}

.bread-txt {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.bread-txt h3 {
    color: var(--sec-color);
    font-size: 52px;
    font-weight: bold;
    margin-bottom: 20px;
}

ul.bread-list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

ul.bread-list a {
    color: white;
}

ul.bread-list li {
    color: white;
}

ul.bread-list li span {
    color: var(--sec-color);
}

section.about-sec-inner {
    padding: 100px 0px;
}

ul#myTab-about button {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
    /* border-bottom: 1px solid var(--sec-color); */
    padding: 10px;
    margin: 0;
    gap: 10px;
}

ul#myTab-about button img {
    width: 50px;
}

ul#myTab-about {
    border: none;
}

ul#myTab-about button span {
    font-size: 20px;
    font-weight: bold;
    color: var(--main-color);
}

ul#myTab-about li {
    width: 100%;
    border-bottom: 1px solid var(--sec-color);
}

section.about-sec.inner-about {
    padding: 0;
    margin-bottom: 80px;
}

.about-sec-inner {
    padding: 100px 50px;
}

section.about-sec.inner-about .about-img {
    height: auto;
    width: 420px;
    margin: 0 auto;
}

ul#myTab-about {
    background: transparent;
    border-radius: 15px;
    border: none;
    outline: none;
    box-shadow: none;
    border: 1px solid var(--main-color);
}

ul#myTab-about button.active {
    background: transparent;
    border: none !important;
    /* border-bottom: 1px solid black; */
    background: var(--main-color);
    border-radius: 15px !important;

}

ul#myTab-about button.active span {
    color: var(--sec-color);
}

.nav-tabs .nav-item:last-child {
    border: none !important;
}


ul#myTab-about button:hover {
    border-radius: 0px;
    background: var(--main-color);
    border-radius: 15px;
}

ul#myTab-about button:hover span {
    color: var(--sec-color);
}

section.about-blocks-sec {
    margin: 0px 0px 80px 0px;
    /* box-shadow: 1px 5px 11px #e8e8e8; */
    /* border-top: 10px solid var(--main-color); */
    overflow: visible;
}

.block-about-tit h3 {
    display: inline-block;
    background: var(--main-color);
    border-right: 15px solid var(--sec-color);
    padding: 10px 40px;
    font-size: 32px;
    font-weight: bold;
    color: var(--sec-color);
    border-radius: 15px;
}

.block-about-tit {
    margin-bottom: 20px;
}

.block-about-txt p {
    font-size: 16px;
    margin-bottom: 10px;
}

.block-about {
    box-shadow: 1px 5px 11px #e8e8e8;
    border-top: 10px solid var(--main-color);
    padding: 20px;
    margin-bottom: 50px;
}

section.about-blocks-sec::before {
    opacity: 0;
}

.blocks-tit {
    text-align: center;
    margin-bottom: 40px;
}

.blocks-tit h3 {
    font-size: 42px;
    font-weight: bold;
}


.about-sec-inner .block-about:last-child {
    margin-bottom: 0px !important;
}

section.about-sec.inner-about .row {
    align-items: center;
}

.team-board-block {
    overflow: visible;
    margin-bottom: 20px;
}

.board-img {
    height: 335px;
}

.board-img img {
    height: 100%;
}

.board-txt {
    background: white;
    box-shadow: 1px 5px 11px #e8e8e8;
    text-align: center;
    padding: 20px;
}

.board-txt h4 {
    font-size: 32px;
    font-weight: bold;
    color: var(--main-color);
}

.board-txt p {
    font-size: 16px;
    color: var(--sec-color);
}

section.boards-sec {
    overflow: visible;
}

section.clients-sec {
    padding: 0px;
}

.form-about-wrap {
    border: 1px solid #ddd;
    padding: 40px;
    border-radius: 15px;
}

.form-group {
    margin-bottom: 40px;
}

.form-group input {
    display: block;
    width: 100%;
    height: 60px;
    padding: 1rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #fff;
    border: 1px solid #e4e5e6;
    border-radius: 0;
    border-radius: 10px;
}

.form-group label {
    font-size: 20px;
    margin-bottom: 10px;
    font-weight: bold;
}

.form-about-wrap {
    border: 1px solid #ddd;
    padding: 40px;
    border-radius: 15px;
}

.form-group {
    margin-bottom: 16px;
}

.form-group input {
    display: block;
    width: 100%;
    height: 60px;
    padding: 1rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #fff;
    border: 1px solid #e4e5e6;
    border-radius: 0;
    border-radius: 10px;
}

.form-group label {
    font-size: 20px;
    margin-bottom: 10px;
    font-weight: bold;
}

.form-group input:focus {
    box-shadow: 0 0 0 .25rem #ffcc0052;
    border-color: var(--main-color);
}

.form-group button {
    border: none;
    background: transparent;
    color: white;
    font-size: 23px;
    width: 100%;
    padding: 5px;
    font-weight: bold;
    border-radius: 10px;
    border: 1px solid var(--sec-color);
    );
}

.news-inner .news-img {
    width: 100%;
}

.news-inner .news-img img {
    width: 100%;
}

.body-inner {
    padding: 100px 0px;
}

section.news-inner .news-block {
    margin: 0px;
    margin-bottom: 25px;
}

section.news-inner .news-block .news-img {
    height: 400px;
}

section.contact-us-sec .row {}

section.contact-us-sec .form-group {
    margin-bottom: 16px;
}

.map-if {
    height: 570px;
}

.map-if iframe {
    border-radius: 15px;
    height: 100%;
    width: 100%;
}

.form-group textarea {
    display: block;
    width: 100%;
    height: 150px;
    padding: 1rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #fff;
    border: 1px solid #e4e5e6;
    border-radius: 0;
    border-radius: 10px;
}

section.contact-us-sec .form-group input {
    height: 50px;
}

.contact-form h3 {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 25px;
}

section.contact-us-sec.body-inner .row {}

.form-group button span {
    background: var(--main-color);
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 10px;
    padding: 5px 10px;
}

.about-sec-inner .tab-pane {
    animation: 1s fadeIn;
}

.contact-form {
    box-shadow: 0px 4px 36px 0px #D3D3D340;
    padding: 30px;
    border-radius: 15px;
}

section.contact-us-sec.body-inner::before {
    opacity: 0;
}

.contact-info-bl {
    position: relative;
    padding: 76px 42px;
    border: 1px solid var(--sec-color, #B7CAD8);
    box-shadow: 0px 4px 36px 0px #D3D3D340;
    border-radius: 16px;
    overflow: hidden;
    height: 100%;
    background: var(--main-color);
}

.contact-info-bl h3 {
    color: var(--sec-color);
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 25px;
    border-bottom: 1px solid var(--sec-color);
    padding-bottom: 10px;
}

.item-con a {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 15px;
}

.item-con {
    margin-bottom: 32px;
}

.item-con a i {
    color: var(--sec-color);
    font-size: 22px;
}

.item-con a span {
    color: white;
    font-size: 22px;
}

.social-ico-wrap {
    display: inline-flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
    background: #003d4a;
    padding: 20px;
    border-radius: 15px;
    position: relative;
    z-index: 1;
}

.social-ico-wrap p {
    font-size: 22px;
    color: white;
}

.social-ico {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 15px;
}

.social-ico i {
    font-size: 24px;
    color: var(--sec-color);
}

.contact-info-bl::after {
    content: "";
    position: absolute;
    background-image: url('../images/logo-madina.png');
    background-size: contain;
    width: 450px;
    height: 450px;
    left: -13px;
    bottom: 0;
    opacity: 0.5;
    z-index: 0;
}

.info-items {
    position: relative;
    z-index: 1;
}

.single-job-con.single-serv .row {
    box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
}

.serv-img {
    height: 500px;
    width: 100%;
    padding: 0;
    margin-bottom: 25px;
}

.serv-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.serv-desc {
    padding: 0px 20px 30px 20px;
}

.serv-desc h3 {
    margin-bottom: 25px;
    font-size: 40px;
    color: var(--main-color);
    font-weight: bold;
}

.serv-desc p {
    color: black;
    font-size: 16px;
    margin-bottom: 20px;
}

section.single-job-con.single-serv {
    padding: 100px 0px;
}