
html{
    scroll-behavior: smooth;
}

.all_content{
    width: 100%;
    /* height: 100vh; */
    /* background-color: yellowgreen; */

}




.header_container{
    width: 100%;
    height: 100vh;
    /* background-color: turquoise; */

    background-image: url(/Assets/Image/Header.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 35%;

    position: fixed;
}





.menu_container{
    width: calc(100% - 80px );
    height: 80px;
    /* background-color: violet; */
    
    

    margin: 30px auto 0 auto;
    


    display: flex;
    flex-flow: row-reverse nowrap;
    justify-content: space-between;
    align-items: center;

    z-index: 500;
}


.logo_container{
    width:100px ;
    height:50%;
    /* margin-bottom: 15px; */

    background-image: url(/Assets/Image/logo.svg);
    background-repeat: no-repeat;
    background-size: contain;

}



.option_container{
    width: 420px;
    height:10px ;
    background-color: #F0F0F0;
    border-radius: 30px;
    /* margin-bottom: 10px; */
    padding: 20px;

    font-family: lato;
    font-size: 16px;
    font-weight: 600;
    line-height: 8px;
    text-align: center;

    z-index: 1000;
    position: relative;


}

.option_text_contaner{
    width: 415px;
    margin-right: 15px;
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    align-items: center; 
}


.option_text_contaner li {

    list-style-type: none;

}


.option_text_contaner li a{

    text-decoration: none;
    color: #222222;
}



.header_text{
    width: 1300px;
    height:206px ;
    /* background-color: yellow; */
    background-image: url(/Assets/Image/sazeGostaran.png);
    margin: 50px auto 0 auto;

    background-size: contain;
    background-repeat: no-repeat;

}

.header_desc{

    width: 400px ;
    height:20px ;
    /* background-color: yellow; */
    background-image: url(/Assets/Image/BULDINGDesc.png);
    margin: 25px auto 0 auto;

    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

    background-size: contain;
    background-repeat: no-repeat;


}





.content_container{
    width:100% ;
    /* height:3580px ; */
    background-color: white;
    z-index: 100;
    position: relative;
    top: 100vh;
    border-radius: 50px 50px 0 0 ;

    display: flex;
    flex-flow: column;
    align-items: center;
}





.project_container{
    width:1120px ;
    /* height: 100px; */
    /* background-color: yellowgreen; */
    margin-top: 50px;
    
}


.project_title{
    font-family: lato;
    font-size: 62px;
    font-weight: bold;
    color: #222222;
}



.project_content_container{
    width: 100%;
    margin-top: 50px;
    /* background-color: violet; */
    
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
}



.project_content{
    width: 350px;
    height: 570px;
    /* background-color: blue; */

    font-family: lato;
    font-size: 28px;
    font-weight: bold;
    text-align: left;
    color: #222222;

}



.project_pic{
    width: 100%;
    height: 500px;
    background-color: #F0F0F0;
    border-radius: 20px;

    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    
    filter: grayscale(1);
    transition: .2s;
}

.project_pic:hover{
    filter: unset;
}


.project_name{
    margin-top: 10px;
}



.line_Between{
    width:1120px ;
    height: 2px;
    background-color: #222222;
    border-radius: 2px;
    margin-top: 50px;
}





.about_container{
    width:1120px ;
    /* height: 100px; */
    /* background-color: yellowgreen; */
    margin-top: 50px;
    
}


.about_title{
    font-family: lato;
    font-size: 62px;
    font-weight: bold;
    color: #222222;
}



.about_desc{

    width: 100%;
    margin-top: 50px;

    font-family: lato;
    font-size: 18px;
    font-weight: 500;
    text-align: left;
    color: #222222;
    line-height: 2;

}



.founder_container{
    width: 360px;
    height: 450px;
    background-color: #F0F0F0;
    border-radius: 20px;
    margin: 50px auto 0 auto;

    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
}

.founder_content{
    width: 320px;
    height: 410px;
    /* background-color: yellowgreen; */
    
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-end;

}


.founder_pic{
    width: 100%;
    height: 340px;
    background-color: rgb(104, 104, 104);
    border-radius: 15px;

    background-image: url(/Assets/Image/Founder.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(0);
    transition: .3s;
}


.founder_pic:hover{
    filter: saturate(.5);
}



.founder_content_container{
    width: 100%;
    height: 50px;
    /* background-color: tomato; */
}


.founder_name{

    font-family: lato;
    font-size: 26px;
    font-weight: bold;
    text-align: left;
    color: #222222;

}


.founder_position{

    font-family: lato;
    font-size: 16px;
    font-weight: 200;
    text-align: left;
    color: #222222;
}



.contact_content{
    width: 100%;   
    /* height: 100px; */
    /* background-color: thistle; */
    margin-top: 50px;

    display: flex;
    flex-flow: row;
    justify-content: space-between;
}



.email_container{
    /* width: 350px; */
    height: 50px;
    /* background-color: teal; */

    margin-bottom: 20px;
    
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
}

.email_icon{
    width: 50px;
    height: 50px;

    background-image: url(/Assets/Image/mail.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


.email_container a{
    text-decoration: none;

    font-family: lato;
    font-size: 16px;
    font-weight: 600;
    line-height: 8px;
    color: #222222;

    margin-left: 30px;
}



.phone_container{

    /* width: 350px; */
    height: 50px;
    /* background-color: teal; */
   
    
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;

}

.phone_icon{
    width: 50px;
    height: 50px;

    background-image: url(/Assets/Image/phone.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}


.phone_container a{
    text-decoration: none;

    font-family: lato;
    font-size: 16px;
    font-weight: 600;
    line-height: 8px;
    color: #222222;

    margin-left: 30px;
}







.loaction_container{

    /* width: 350px; */
    height: 50px;
    /* background-color: teal; */
   
    
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;

}

.locaion_icon{
    width: 50px;
    height: 50px;

    background-image: url(/Assets/Image/location.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}


.loaction_container p{

    font-family: lato;
    font-size: 16px;
    font-weight: 600;
    line-height: 8px;
    color: #222222;

    margin-left: 30px;
}







.footer{
    width: 320px;
    /* height: 200px; */
    margin-top: 100px;
    /* background-color: blueviolet; */

    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 50px;

}



.footer_logo{
    width: 128px;
    height: 131px;
    background-image: url(/Assets/Image/footerLogo.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    z-index: 900;
}


.footer> .option_text_contaner{
    font-family: lato;
    font-size: 14px;
    font-weight: 600;
    line-height: 8px;
    text-align: center;
    margin-top: 20px;
    color: #222222;
    
}





/* -------------- Responsive -------------- */

/* .content_container{
    display: none;
} */


/* .about_container{
    display: none;
} */

/* .footer{
    display: none;
} */


/* .line_Between{
    display: none;
} */







@media (max-width: 1440px ){

    .header_text{
        width:990px ;
        height:155px; 
    }



    .header_desc{
        width:295px ;
        height:25px ;
        margin-top: 10px;
    }

}

@media (max-width: 1440px ){

    .header_text{
        width:990px ;
        height:155px; 
    }



    .header_desc{
        width:295px ;
        height:25px ;
        margin-top: 10px;
    }

}


@media (max-width: 480px ){


    .header_container{
        height: 80vh;
    }



    .option_container{

        width: 10px;
        height: 10px;
        border-radius: 8px;
    
    }

    .option_text_contaner{
        width: 10px;
        flex-flow: row;
        justify-content: center;
        align-items: center;
        line-height: 10px;
    }

    .option_text_contaner>.div{
        display: none;
        
    }

    .header_text {
        width: 330px;
        height: 69.8px;
    }

    .header_desc {
        width: 220px;
        height: 10px;
        margin-top: 0px;
    }


    .project_content_container {
 

        flex-flow: column nowrap;

    }

    .project_title{
        font-size: 42px;
    }

    .project_container{
        width: 95%;
    
        display: flex;
        flex-flow: column nowrap;
        align-items: center;
    }


    .line_Between{
        width: 75%;
    }

    .about_container{
        width: 80%;

        display: flex;
        flex-flow: column;
        align-items: center;
        
    }


    .founder_container{
        margin: unset;
        margin-top: 50px;
    }

    .about_title{
        font-size: 42px;
        text-align: center;
    }


    .about_desc{
        text-align: justify;
        margin-top: 20px;
    }

    .contact_content{
        flex-flow: column nowrap;
    }



    .phone_container , .loaction_container{
        margin-bottom: 20px;
    }

    .footer > .option_text_contaner{
        display: none;
    }

    .email_container a{
        margin-left: unset;
        font-size: 15px;
    }
    
    .footer_logo{
        transform: scale(.6);
    }

    .content_container{
        
        border-radius: 20px 20px 0 0 ;
        top: 78vh;
        
    }


}




    




    
