/* text for top part */
.textTopPart{
    margin-top: 10dvh;
    /* text-align: center; */
    display: flex;
    justify-content:center;
    /* gap: 1dvh; */
    align-items: center;
}

.textTopPart h3{
    font-size: 32px;
    font-family: vazir;
}

.textTopPart img{
    align-items: center;
    scale: 0.8;
}


/* containerServices////////////////////////////////////////////////////// */

.containerServices .leftCS .leftCS1 h1{
    font-size: 43px;
}

.containerServices{
    width: 80%;
    display: flex;
    flex-direction: row-reverse;
    margin: 2vh auto;
    direction: rtl;

}

.containerServices .rightCS{
    width: 50%;
    text-align: center;
    direction: rtl;
    padding: 2vh;
    box-sizing: border-box;
    justify-content: center;
    margin: 0 auto;
    align-self: center;

}

.containerServices .rightCS .imgContainer{
    width: 80%;
    display: inline;
}

.containerServices .leftCS{
    display: flex;
    flex-direction: column;
    justify-content: center;
    direction: rtl;
    padding: 1vh;
    box-sizing: border-box;
    align-items: center;
    width: 50%;


}

.containerServices .leftCS .leftCS1{
    width: 80%;
    box-sizing: border-box;
    text-align: justify;
    margin-top: 5%;
    
}

.leftCS .leftCS1 h3{
    font-family: vazir;
    margin-bottom: 5%;
}

.containerServices .leftCS .btnCS{
    display:flex;
    width: 80%;
    justify-content: center;
    margin-top: 2%;

}

.containerServices .leftCS .btnCS .btnLCS{
    margin-right: 2%;
    background-color: rgb(255 181 52);
    padding: 2%;
    box-sizing: border-box;
    flex-grow: 0.3;
    border-radius: 20px;
    text-align: center;
    border: none;
    font-weight:bolder;
    box-sizing: border-box;
}

/* containerAnswers////////////////////////////////////////////////////// */

.containerAnswers .leftCS .leftCS1 h1{
    font-size: 43px;
}

.containerAnswers{
    width: 80%;
    display: flex;
    flex-direction: row-reverse;
    margin: 2vh auto;
    margin-bottom: 20vh;


}

.containerAnswers .rightCS{
    width: 50%;
    text-align: center;
    direction: rtl;
    padding: 2vh;
    box-sizing: border-box;
    margin: 0 auto;
    /* background-color: antiquewhite; */
    justify-self: center;
    align-self: center;

}

.containerAnswers .rightCS .imgContainer{
    width: 80%;
    display: inline;
}

.containerAnswers .leftCS{
    display: flex;
    flex-direction: column;
    justify-content: center;
    direction: rtl;
    padding: 1vh;
    box-sizing: border-box;
    align-items: center;
    width: 50%;

}

.containerAnswers .leftCS .leftCS1{
    width: 80%;
    box-sizing: border-box;
    text-align: justify;
    margin-top: 5%;
    
}
.containerAnswers .leftCS .btnCS{
    display:flex;
    width: 80%;
    justify-content: center;
    margin-top: 2%;

}

.containerAnswers .leftCS .btnCS .btnLCS{
    margin-right: 2%;
    background-color: rgb(255 181 52);
    padding: 2%;
    box-sizing: border-box;
    flex-grow: 0.3;
    border-radius: 20px;
    text-align: center;
    border: none;
    font-weight:bolder;
    box-sizing: border-box;
}
.btncontainer1 .btnRcontainer1:hover ,
.btnPhone .btnRPhone:hover {
    background-color: rgb(251, 205, 127);
    border: solid rgb(255 181 52);
}

.btncontainer1 .btnLcontainer1:hover ,
.btnPhone .btnLPhone:hover , .btnLCS:hover {
    background-color: rgb(251, 205, 127) !important;
    border: solid rgb(255 181 52);
}

/* containerAnswers////////////////////////////////////////////////////// */

.rightBotton , .leftBottom{
    width: 10%;
    padding: 5px;
    box-sizing: border-box;
    margin: auto;
    align-items: center;
    text-align: center;
}

.btnPhone{
    display: none;
}

.cardPhone{
    display: none;
}

    /* slide Show */
    /* TODO */
    .section-four{
        width: 95%;
        margin-top: 5vh;
        margin: auto;
    }

    .section-four .section-body{
        box-sizing: border-box;
        display: flex;
        flex-wrap: wrap;
    }

    .section-four .section-body .section-card{
        flex-grow: 1;
        background-color: #444;
        padding: 2vh;
        border: 3px double #222 ;
        text-align: center;
        align-self: center;
        color: white;
    }


    .section-four .section-body .section-card img{
        width: 1%;
    }

    .title {
        margin-top: 50px;
    }
    .title h1 {
        text-align: center;
        margin: 0;
        padding: 0;
        font-family: Arial;
        text-transform: uppercase;
        color: #d63031;
    }
    .title h1 span {
        display: block;
        color: #300a0a;
        font-size: 20px;
        margin-bottom: 10px;
    }
    
    /*Carousel Gallery*/
    .carousel-gallery {
        width: 100%;
        direction: ltr;
        margin: 50px auto;
        padding: 0 30px;
    }
    .carousel-gallery .swiper-slide a {
        display: block;
        width: 100%;
        height: 150px;
        border-radius: 4px;
        overflow: hidden;
        position: relative;
        /* background-color: #0b151d; */
        -webkit-box-shadow: 3px 2px 20px 0px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 3px 2px 20px 0px rgba(0, 0, 0, 0.2);
        box-shadow: 3px 2px 20px 0px rgba(0, 0, 0, 0.2);
        padding: 1vh;
        box-sizing: border-box;
    }
    .carousel-gallery .swiper-slide a:hover .image .overlay {
        opacity: 1;
    }
    .carousel-gallery .swiper-slide a .image {
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center center;
    }
    .carousel-gallery .swiper-slide a .image .overlay {
        width: 100%;
        height: 100%;
        background-color: rgba(20, 20, 20, 0.8);
        text-align: center;
        opacity: 0;
        -webkit-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        transition: all 0.2s linear;
    }
    .carousel-gallery .swiper-slide a .image .overlay em {
        color: #fff;
        font-size: 26px;
        position: relative;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        display: inline-block;
    }
    .carousel-gallery .swiper-pagination {
        position: relative;
        bottom: auto;
        text-align: center;
        margin-top: 25px;
    }
    .carousel-gallery .swiper-pagination .swiper-pagination-bullet {
        -webkit-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        transition: all 0.2s linear;
    }
    .carousel-gallery .swiper-pagination .swiper-pagination-bullet:hover {
        opacity: 0.7;
    }
    .carousel-gallery .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background-color: #d63031;
        transform: scale(1.1, 1.1);
    }
    
    /*# Carousel Gallery*/
    .plugins {
        text-align: center;
    }
    .plugins h3 {
        text-align: center;
        margin: 0;
        padding: 0;
        font-family: Arial;
        text-transform: uppercase;
        color: #111;
    }
    .plugins a {
        display: inline-block;
        font-family: Arial;
        color: #777;
        font-size: 14px;
        margin: 10px;
        transition: all 0.2s linear;
    }
    .plugins a:hover {
        color: #d63031;
    }

    /* end of slide show */
    
@media screen and (max-width: 1208px) {
    .leftContainer1 h3{
        font-size: 32px !important;
    }
}

/* @media screen and (max-width: 1051px) {
    .containerServices .leftCS .leftCS1 h3, .containerAnswers .leftCS .leftCS1 h3{
        font-size: 30px;
    }
} */

@media screen and (max-width: 914px) {
    .leftContainer1 h3{
        font-size: 25px !important;
    }
}


@media screen and (max-width: 768px) {

    .container1{
        width: 100%;
        display: flex;
        flex-direction: row-reverse;
        margin: 3vh auto;
    }
    .container1 .rightContainer1{
        width: 50%;
        direction: rtl;
        box-sizing: border-box;
        padding: 0;
    }
    .container1 .rightContainer1 .imgContainer{
        width: 100%;
    }
    .container1 .leftblank .leftContainer1 h1{
        font-size: 14px;
    }
    .container1 .leftblank .leftContainer1 p{
        font-size: 12px;
    }
    .btnLcontainer1 , .btncontainer1 , .btnRcontainer1{
        display: none;
    }
    .btnPhone{
        display:flex;
        flex-direction: row;
        width: 60%;
        justify-content: space-around;
        margin: 0 auto;

        
    }

    .btnPhone .btnRPhone{
        padding: 2%;
        box-sizing: border-box;
        border-radius: 20px;
        flex-grow: 1;
        text-align: center;
        border: solid;
        border-color: rgb(255 181 52);
        font-weight: 200;
        box-sizing: border-box;
        flex-direction: column;
        margin-right: 25px;
    }

    .btnPhone .btnLPhone{
        padding: 2%;
        box-sizing: border-box;
        border-radius: 20px;
        flex-grow: 1;
        font-weight: 200;
        text-align: center;
        border: solid;
        border-color: rgb(255 181 52);
        box-sizing: border-box;
        flex-direction: column;
        background-color: rgb(255 181 52);

    }

/* /////////////////////////////////////////////// */
    .cardContainer{
        display: none;
    }

    .cardPhone{
        display: flex;
        flex-direction: row;
        margin: 2vh auto;
        width: 80%;
        direction: rtl;
        justify-content: center;
    }
    
    .rightBotton , .leftBottom{
        width: 10%;
        padding: 5px;
        box-sizing: border-box;
        margin: auto;
        align-items: center;
        text-align: center;
    }

    .cardPhone h3{
        font-size: 14px;
    }

    .cardPhone p{
        font-size: 11px;
    }

    .cardPhone .middleBox{
        padding: 1vh;
        box-sizing: border-box;
        margin: 0 auto;
        background-color: #99C67A;
    }
    
    .cardPhone .middleBox .inerCardImg{
        width: 70%;
        margin: 0 auto;
    
    }
    
    .cardPhone .middleBox .inerCardImg .imgRealInerCard{
        width: 100%;
    
    }
    
    .cardPhone .middleBox .inerTextCard{
        width: 70%;
        margin: 0 auto;
    }
/* /////////////////////////////////////////////// */


    .containerServices .leftCS .leftCS1 h1{
        font-size: 14px;
    }
    .containerServices .leftCS .leftCS1 p{
        font-size: 14px;
    }
    

    .containerServices .rightCS{
        width: 50%;
        text-align: center;
        direction: rtl;
        padding: 0%;
        box-sizing: border-box;
        justify-content: center;
        margin: 5vh auto;
    }

    .containerServices .rightCS .imgContainer{
        width: 100%;

    }

    .containerServices .leftCS .btnCS{
        display:flex;
        width: 80%;
        justify-content: center;
        margin-top: 2%;
        font-size: 10px;
    }
/* /////////////////////////////////////////////// */

    .containerAnswers .leftCS .leftCS1 h1{
        font-size: 13px;
    }
    .containerAnswers .leftCS .leftCS1 p{
        font-size: 14px;
    }
    

    .containerAnswers .rightCS{
        width: 50%;
        text-align: center;
        direction: rtl;
        padding: 0%;
        box-sizing: border-box;
        justify-content: center;
        margin: 5vh auto;
    }

    .containerAnswers .rightCS .imgContainer{
        width: 100%;

    }

    .containerAnswers .leftCS .btnCS{
        display:flex;
        width: 80%;
        justify-content: center;
        margin-top: 2%;
        font-size: 10px;

    }

}

@media screen and (max-width: 755px) {
    .containerServices ,  .containerAnswers{
        width: 100%;
    }
    .imgContainer{
        width: 80% !important;
    }
    .plate{
        width: 100% !important;
    }
    
}

@media screen and (max-width: 600px) {
    .containerServices,
    .containerAnswers{
        flex-direction: column;
    }
    .containerServices .leftCS,
    .containerAnswers .leftCS{
        margin: auto;
        text-align: center;
    }
    .containerServices .rightCS,
    .containerAnswers .rightCS,
    .containerServices .leftCS,
    .containerAnswers .leftCS{
        width: 80%;
    }
    .containerServices .leftCS .leftCS1,
    .containerAnswers .leftCS .leftCS1{
        text-align: center;
    }
    .containerServices .leftCS .leftCS1,
    .containerAnswers .leftCS .leftCS1{
        width: 100%;
    }
    .textTopPart{
        margin-top: 3dvh;
    }
}

@media screen and (max-width: 542px) {
    .container1 .leftblank .leftContainer1 h3{
        font-size: 18px !important;
    }
}

@media screen and (max-width: 524px) {
    .containerServices .leftCS .leftCS1 h3, .containerAnswers .leftCS .leftCS1 h3{
        font-size: 18px;
    }
}

@media screen and (max-width: 395px) {
    .container1 .leftblank .leftContainer1 h3{
        font-size: 15px !important;
    }
    .containerServices .leftCS .leftCS1 h3, .containerAnswers .leftCS .leftCS1 h3{
        font-size: 15px;
    }
    .containerAnswers .leftCS .leftCS1 p , .containerServices .leftCS .leftCS1 p{
        font-size: 13px;
    }
}

/* 
@media screen and (max-width: 300px) {
    body{
        display: none;
    }
} */