@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500&display=swap');

html, body{
    padding: 0;
    margin: 0;
    scroll-behavior: smooth;
}


*{
    padding: 0;
    margin: 0;
    
    font-family: 'Poppins', sans-serif;
}

section{
    height: auto;
    width: 100%;
}


.row #about{
    height: auto;
    width: 100%;
    padding: 0px 20px;
}

.row > .head{
    display: flex;
    padding: 0px 20px;
    background: black;
}

.row > .head > p{
    font-size: 30px;
    padding-left: 5px;
    color: white;
}

.head > .store{
    font-weight: bold;
}

.row > #about{
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 20px 0px 100px 0px;
}

.contents > .text{
    width: 50%;
    padding: 0px 0px 0px 20px;
}

.contents > .text > p{
    text-align: justify;
    padding: 10px 0px;
}

.contents > .logo{
    width: 40%;
    display: flex;
}

.contents > .logo > img{
    height: 300px;
    width: 80%;
}

.contents > form{
    width: 100%;
    display: flexbox;
    padding: 20px;
}

form > #name{
    width: 100%;
    display: flex;
    justify-content: flex-start;
}

form > #name > #subname{
    width: 100%;
}

form > #name > #subname > input{
    width: 50%;
    display: flex;
}

form > #email{
    width: 50%;
}

form > #email > input{
    width: 100%;
    display: flex;
}

form > #email > textarea{
    width: 100%;
    height: 300px;
    display: flex;
}

form > button{
    width: 10%;
    margin: 10px 0px;
    padding: 2px;
    font-size: 15px;
    font-weight: bold;
    background: white;
    border: 1px solid black;
}

form > button:hover{
    cursor: pointer;
    background: red;
}