/* Beginning of Mission section */

.mission{
    width:100%;
    height:auto;
    content:'';
    background:var(--background);
    display:flex;
    justify-content: center;
    align-items: center;
    padding:20px 0px 40px 0px;
    /*background: rgb(22, 22, 251, 1);*/
    /*position: relative;*/
    /*display: none;*/



}

.mission_bond{
    width:75%;
    height:auto;
    padding:20px 0px 50px 0px;
    display:flex;
    column-gap: 50px;
    /*background:orange;*/
    justify-content: center;
    overflow-x: hidden;
    /*this was placed due to the right:-60px below to prevent*/
    /*it from pushing out before .glide is activated*/
}

.mission_left{
    width:40%;
    height:auto;
    padding:20px 0px 20px 0px;
    transform:skew(3deg, 10deg);
    position:relative;
    left:-60px;
    transition: all 0.2s ease-in-out;
    opacity: 0;


    /*border:1px solid green;*/
    /*background-image: url("images/solar_mission.jpg");*/

}

.mission_left.glide{
    transform:skew(0deg, 0deg);
    transition: all 0.8s ease-in-out;
    left:0px;
    opacity: 1;
}

.mission_left img{
    width:100%;
    height:auto;
}

.mission_right_crt{
    width:40%;
    height:auto;
    padding:20px 0px 20px 0px;
    /*border:1px solid blue;*/
    display:flex;
    flex-direction: column;
    row-gap: 20px;

    transform:skew(3deg, -10deg);
    position: relative;
    right:-60px;
    transition: all 0.2s ease-in-out;
    opacity: 0;
}

.mission_right_crt.glide{
    transform:skew(0deg, 0deg);
    transition: all 0.8s ease-in-out;
    right:0px;
    opacity:1;
}

.mission_company_name{
    width:90%;
    height:40px;
    /*background:blue;*/
    font-weight: bold;
    font-size:20px;
    color:var(--button-color);
}

.mission_title{
    width:90%;
    height:auto;
    /*background:purple;*/
    font-weight: bold;
    font-size:25px;
    color:var(--button-color);

}

.mission_content{
    width:90%;
    height:auto;
    /*background:grey;*/
    line-height: 25px;
    color:var(--text_color);
}


.sub_mission_header{
    font-weight: bold;
    font-size: 20px;
    margin-bottom:-10px;
    color:var(--button-color);
}
.sub_mission_content{

    width:90%;
    line-height: 25px;
    color:var(--text_color);

}

@media screen and (max-width:1500px){
    .mission_bond{
        width:100%;

    }
}



/*mission section mobile view */
@media screen and (max-width:900px){
    .mission_bond{

        flex-direction: column;
        align-items: center;
        row-gap: 20px;
        width:80%;

    }

    .mission_left, .mission_right_crt{
        width:100%;
    }

    .mission_left, .mission_right_crt{
        height:auto;
    }


}

@media screen and (max-width:600px){
    .mission_company_name{
        font-size:21px;
    }
    .mission_title{
        font-size:22px;
    }

    .mission_content, .sub_mission_content{
        font-size:15px;
    }

    .mission{
        /*padding:20px 0;*/
        /*background: red;*/

    }

    .mission_left{
        padding-top:0px;
    }



    .mission_bond{
        padding-top:0px;
        width:90%;


        /*margin-top:-50px;*/

        /*background: blue;*/

    }

    .about_content{
        font-size:15px;
    }
}

@media screen and (max-width:430px){
    .mission_company_name{
        font-size:19px;
    }
    .mission_title{
        font-size:20px;
    }

    .mission_content,.sub_mission_content{
        font-size:14px;
    }

    .about_content{
        font-size:13px;
    }

    .about_services_works {

        padding-top: 50px;

    }




}


/* End of Mission section */ /* End of Mission section */

