﻿
.about-welcome {
    background-color: #fff;
    margin-top: -20px;
    padding-top: 50px;
}

    .about-welcome > div {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

        .about-welcome > div > div {
            width: 48%;
        }

.i-wel-second {
}

    .i-wel-second > * {
        padding-right: 10px;
        padding-left: 10px;
    }

    .i-wel-second > h1 {
        color: var(--yellow);
        font-family: Sarvenaz;
        display: inline-block;
        position: relative;
        margin-top: 15%;
    }

        .i-wel-second > h1 > span {
            position: absolute;
            width: 45px;
            height: 2px;
            top: 50%;
            margin-top: -1px;
            border-bottom: 2px solid var(--yellow);
            margin-right: 10px;
        }

    .i-wel-second > h2 {
        font-size: 36px;
        color: #000;
        line-height: 45px;
        font-family: 'B Nazanin';
    }

        .i-wel-second > h2 > i {
            color: var(--yellow);
        }

    .i-wel-second > h4 {
        line-height: 25px;
        text-align: justify;
    }

    .i-wel-second > div {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }

        .i-wel-second > div > div {
            width: 49%;
            display: flex;
            flex-wrap: wrap;
            margin-top: 10px;
        }

            .i-wel-second > div > div > div {
            }

.i-starter,
.i-experience {
    border-right: 5px solid var(--yellow);
    height: 50px;
}

    .i-starter > div,
    .i-experience > div {
        padding-right: 20px;
        padding-top: 13px;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
    }

.i-starparent,
.i-experparent {
    width: 55%;
}

.i-starter1,
.i-experience1 {
    font-size: 50px;
    color: var(--yellow);
    width: 20%;
}

.i-experience2 {
    font-size: 18px;
    width: 30%;
    margin-top: -10px;
}

.i-starter2 {
    font-size: 18px;
    width: 60%;
    margin-top: -10px;
}

.i-experience3 {
    color: #000;
    font-size: 18px;
    width: 85%;
    margin-top: 10px;
}

.i-starter3 {
    color: #000;
    font-size: 18px;
    width: 69%;
    margin-top: 10px;
}

@media screen and (min-width: 400px) and (max-width: 1000px) {
    .i-wel-second > div > div {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        margin-top: 10px;
    }
}

@media screen and (min-width: 400px) and (max-width: 1060px) {
    .about-welcome > div > div {
        width: 55%;
    }
}

.i-moreinfo > div > div {
    background-color: var(--yellow) !important;
    color: var(--white);
    padding: 16px 40px;
    margin-top: 20px;
}

.i-wel-first {
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    margin-right: 20px;
}

    .i-wel-first > div {
        width: 49%;
    }

        .i-wel-first > div > img {
            max-width: 95%;
            display: none;
        }

.i-wel3 {
    direction: ltr;
}

.i-a2,
.i-a3 {
    width: 75%;
    visibility: visible;
    animation-delay: 0.3s;
    animation-name: zoomIn;
}

.i-a1 {
}

.i-a2 {
    margin-top: 20%;
}

.i-a3 {
    margin-left: 15px;
    margin-top: 10px;
}

.i-a4 {
    margin-top: 10px;
}

.about-team {
    background-color: #fff;
    padding-top: 100px;
    text-align: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    display: flex;
    flex-direction: column;
    visibility: visible;
    animation-delay: 0.1s;
    animation-name: fadeInUp;
}

@keyframes moveSingleToUp {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}
