@font-face {
    font-family: shabnam;
    src: url(../font/shabnam/Shabnam.ttf);
}

@font-face {
    font-family: vazir;
    src: url(../font/vazir-font-v16.1.0/Vazir.ttf);
}

@font-face {
    font-family: kalameh;
    src: url(../font/Kalameh/TTF/Kalameh\(FaNum\)-Regular.ttf)
}


a {

    text-decoration: none;
    color: black;
}

.bg-color {
    background-color: #f2f2f2;
    height: 100vh;
    font-family: shabnam;
    font-weight: 700;
}

.styltext1 {
    margin: 10px;
    color: #004187;
    font-weight: bolder;
    font-family: kalameh;
    margin-top: 50px;
}

.navStyle {
    margin-top: 5px;
}

.styltext2 {
    margin: 10px;
    margin-top: 50px;
    color: #007AFF;
    font-weight: bolder;
    font-family: kalameh;
}

.styltext3 {
    font-size: 17px;
    font-weight: 700;
}

.styltext4 {
    font-size: 15px;
    margin: 10px;
    display: inline-block;
    color: white;


}

.MedumText {
    font-size: 20px;
}

.SmallTxt {
    font-size: 13px;
    color: rgba(71, 71, 71, 0.6);
}

.SmallTxtP {
    font-size: 13px
}

.iconstyle {
    background-color: rgb(100, 173, 255);
    border-radius: 4px;

}

.bgEffect {

    border-radius: 30px;
    width: 24%;
    padding: 6px;
    background-color: background:
    background: rgb(5, 75, 186);
    background: linear-gradient(90deg, rgba(5, 75, 186, 1) 15%, rgba(3, 68, 244, 1) 53%, rgba(3, 12, 255, 1) 100%);
}

.bg-color2 {
    background-color: #004187;
    color: white;
    border-radius: 15px;
}

.UlStyl {
    list-style-position: inside;
}

.IconStyle {
    padding-right: 5px;
    color: white;
    margin: 15px;
}

.TextStyl {
    color: white;
    margin: 20px 0 15px 0;
    font-size: 1rem;
    padding: 0;
}


@media only screen and (max-width: 600px) {
    .TextStyl {
        font-size: 10px;

    }
}

@media only screen and (max-width: 600px) {
    .IconStyle {
        font-size: 10px;

    }
}


.textStyl4 {
    font-family: kalameh;
    font-weight: bolder;
    font-size: 1.4rem;
}

.PicStyl {
    background-color: white;
    border-radius: 18px;
}

/* ----------------------- */
.Pstyl {
    color: black;
    font-size: 15px;
    margin: 0;

}


@media only screen and (max-width: 600px) {
    .Pstyl {
        font-size: 10px;
        color: #007AFF;
    }
}


/* ------------------- */
.imgstyl {
    margin-left: 20px;
    width: 32px;
}

.imgstyl2 {
    width: 3rem;
    margin-right: 10px;
}

.changePIC {


    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}


.cont {
    position: relative;
}

.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .3s ease;
    background-color: #007AFF;
    border-radius: 20px;

}

.cont:hover .overlay {
    opacity: 1;
}

.icon {
    color: white;
    font-size: 100px;
    position: absolute;
    top: 28%;
    left: 77%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}


.overstyle {
    margin-top: 115px;
}

.OverStylePrgph {
    color: white;
    font-size: 18px;
    font-weight: bold;
    margin: 0;
}

.MobilMenu {
    background-color: #007AFF;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    position: absolute;
    left: 44%;
    top: -25px;
    align-content: center;
}

.H3Styl {
    font-size: 40px;
    font-family: kalameh;
    color: #004087;
}

.PstylMBL {
    color: #004087;
    font-size: 20px;
    font-family: vazir;
}

.PstylMBL2 {
    padding: 5px;
    color: white;
    font-size: 10px;
    font-family: vazir;
    font-weight: lighter;
    margin: 0;
}

.bgStylMBL {
    padding: 6px 0 6px 0;
    background-color: background:
    background: rgb(5, 75, 186);
    background: linear-gradient(90deg, rgba(5, 75, 186, 1) 15%, rgba(3, 68, 244, 1) 53%, rgba(3, 12, 255, 1) 100%);

    width: 20%;
    border-radius: 20px;
}

.pstyl5 {
    margin: 0;
    color: #1943D9;
    font-size: 30px;
    font-family: vazir;
}

.pstyl6 {
    margin: 0;
    color: #004087;
    font-size: 13px;
    font-family: vazir;
}

.H3styl2 {
    font-size: 30px;
    font-weight: bolder;
    font-family: kalameh;
}

/*------------styl for tab navbar---------------*/

/* تنظیمات مخصوص تب‌ها */
.custom-tab-container {
    max-width: 600px;
    margin: 0 auto;
}

.custom-tabs {
    display: flex;
    border-bottom: 2px solid #ddd;
}

.custom-tab-button {
    flex: 1;
    padding: 10px;
    cursor: pointer;
    background-color: #f1f1f1;
    border: none;
    outline: none;
    font-size: 16px;
}

.custom-tab-button.active {
    background-color: #ddd;
}

.custom-tab-content {
    display: none;
    padding: 20px;
    background-color: #f9f9f9;
}

.custom-tab-content.active {
    display: block;
}

.postStyl {

    width: 80%;
    background-color: #dddddd;
    border-radius: 20px;
}