﻿@font-face {
    font-family: 'cairo-variablefont_slnt,wght';
    src: url('../fonts/cairo-variablefont_slnt,wght.ttf') format('truetype');
}
*:not(.fa):not(.glyphicon):not(.fab):not(.fas):not(.fa-brands){
    font-family: 'cairo-variablefont_slnt,wght' !important;
}
.TopPage {
    background-color: #1ec1c6;
}

    .TopPage .Content {
        padding: 10px;
    }

.row {
    direction: rtl;
}

.btn {
    border-radius: 10px;
}

a, a:hover {
    text-decoration: none;
    color: #350e4b;
}

.MainBtn, .MainBtn:hover {
    background-color: #350e4b;
    color: #1ec1c6;
    border-color: #350e4b;
    padding: 10px 40px;
}

.SecondBtn, .SecondBtn:hover {
    color: #350e4b;
    background-color: #1ec1c6;
    border-color: #350e4b;
    padding: 10px 40px;
}

.TopPage .Info {
    text-align: center;
    padding: 100px 0 300px 0;
}

    .TopPage .Info h2 {
        color: #350e4b;
        font-size:40px;
    }

    .TopPage .Info p {
        color: #350e4b;
    }

.MainImage {
    margin-top: -250px;
    border-radius: 15px;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
    max-width: 1500px;
}

.Body2 {
    padding: 100px 0;
}
.Body2 h2{
    font-size:40px;
}
    .Body2 h2,
    .Body2 p {
        color: #350e4b;
    }

.Body3 {
    padding: 100px 0;
    background-color: #f8f8f8;
}

    .Body3 h3 {
        text-align: center;
        color: #350e4b;
        padding: 50px 0;
        font-size:40px;
    }

.Card {
    display: grid;
    grid-template-areas:
        'CardImage CardTitle'
        'CardImage CardInfo';
    padding: 10px;
    background-color: #fff;
    border-radius: 15px;
    grid-template-rows:20px auto;
    margin:10px 0;
}

.CardImage {
    grid-area: CardImage;
}

.CardTitle {
    grid-area: CardTitle;
    color: #350e4b
}

.CardInfo {
    grid-area: CardInfo;
    color: #350e4b
}

.Body41, .Body42 {
    padding: 50px 0;
}

.Body42 {
    background-color: #f8f8f8;
}

    .Body41 img,
    .Body42 img {
        width: 100%;
    }

    .Body41 h3, .Body41 p,
    .Body42 h3, .Body42 p {
        color: #350e4b;
    }

ul li {
    color: #350e4b;
}

.FooterCard {
    padding: 100px 0;
}

    .FooterCard .row {
        background-color: #1ec1c6;
        border-radius: 15px;
        padding: 20px;
    }

    .FooterCard p, .FooterCard h2 {
        color: #350e4b;
    }

@media only screen and (max-width: 1024px) {
    .Mobile {
        text-align: center !important;
        padding:10px 0;
    }
}
.CardTitle h4{
    font-weight:bolder;
    margin-top:unset;
    margin-bottom:unset;
}
.M5{
    margin:0 15px;
}