/*Create all functions in here*/

.flex-center{
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-column{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
} 
.flex-column-mobile{
    display: flex;
    flex-direction: column;
    align-items: center;
} 
.flex-spaced{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.flex-column-end{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
}

.grid-half{
    display: grid;
    grid-template-columns: 50% 50%;
}

.section{
    padding:5rem 4%;
}

.hero-container{
    min-height:100vh;
    width: 100%;
    overflow: hidden;
}




/*mobile responsive*/
@media screen and (max-width: 768px ){
    .hero-container{
        min-height:auto;
        width: 100%;
        overflow: hidden;
    }
       
}

@media screen and (max-width: 425px ){
    .section{
        padding:3rem 5%;
    }    
}