*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    font-family: Roboto
}

html{
    /*background-color: #324376; */
    font-family: Roboto;
    
}

.main{
    display: flex;
    align-items: flex-end;
}

.stop{
    color:aliceblue
}

.logo{
    width:70px;
    padding-right: 1rem;
}


body{
    padding: 1rem 0rem 0rem 0rem;
    margin: 2rem 0rem 0rem 0rem;
    background: linear-gradient(157deg, rgba(255,255,255,1) 0%, rgba(193,193,193,1) 100%);
    height:100%;
}

.header{
    margin-right: 1rem;
    display: flex;
    margin-bottom: 2rem;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    padding: 0 1rem;
}

.header button{
    color:black;
    font-size: 1rem;
    padding: .75rem 1rem;
    border-radius: 10px;
}

.header h1{
    font-size: 32px;
    color: #f5dd90;
    text-wrap: nowrap;
    margin-left: 1rem;
    font-weight: 800;
}
.header h1 span{
    font-size: 32px;
    color: #324376;
    font-weight: 300;
}
.header ul{
    display:flex;
    list-style: none;
}

.header ul li a{
    color:black;
    cursor: pointer;
    margin-left: 1rem;
    text-decoration: none;
}


.contact-left{
    height:100%;
    margin:0 1rem;
    width:50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

h1{
    font-weight: 800;
    font-size: 38px;
    color:black;
}
.contact-left form{
    margin:2rem 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

form input,textarea {
    border: none;
    padding:20px;
    border-radius: 20px;
    height:50px;

}

textarea{
    height:200px;
}

button{
    padding:20px;
    border-radius: 20px;
    border:none;
    background: #f5dd90;
    font-weight: 500;
    font-size: 24px;
    cursor: pointer;
}

button:hover{
    color:aliceblue
}

.contactdetails{
    margin: 1rem 0rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.contactdetails div{
    margin:1rem 0;
}

.contact ul{
    list-style: none;
}
.contact span{
    font-weight: 700;
}
.contact{
    padding: .5rem;
    background-color: #324376;
    color:aliceblue;
}

.contact h1{
    color: aliceblue;
}
.contactdetails{
    justify-content: flex-start;
    display: flex;
    flex-direction: column;
}
.consent{
    display: flex;
    align-items: center;
    justify-content: center;
}

.consent input{
    margin: 0.5rem;
}
.consent label{
    font-weight: 300;
    font-size: .75rem;
}
.copyright{
    display: flex;
    font-weight: 200;
    justify-content: center;
}

@media screen and (max-width: 750px){
    body{
        margin-top: 2rem;
    }
    .consent input{
        width:35px;
    }
    .main{
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .header{
        flex-direction: column;
        margin: 1rem 1rem;
    }
    .header h1{
        font-size: 25px;
        padding-top:1rem;
        padding-bottom: 2rem;
    }
    .header h1 span{
        font-size: 25px;
    }
    .header{
        flex-direction: column;
    }
    .contact-left{
        width:90vw;
    }
    .contact-right{
        display: none;
    }
}