* {
    font-family: 'Merriweather', serif;
}
body {
    max-width: 100%;
}

label, p {
    color: rgb(134, 134, 134);
}

header {
    background-color: rgb(44,59,71);
    padding: 15px;
    text-align: center;
    font-family: 'Roboto Slab', serif;
}

header h1 {
    color: white;
}

legend {
padding: 20px;
font-weight: bold;

}
.container {
    padding: 5%;
}

.section-1 {
text-align: center;
margin-bottom: 25px;


}

.border {
    height: auto;
    width: 100%;
    border-top: 3px solid rgb(44,59,71);;
    border-bottom:  1px solid rgb(44,59,71);;
    padding: 2px;
}

.top-form-part label {
display: block;
margin-bottom:5px;
margin-top: 10px;

}

.top-form-part input,
.top-form-part select {
    width: 92%;
    padding:  15px;
    border: none;
    border-radius:  5px;
    background: rgb(229, 233, 233);
    line-height: 1px;

}
.top-form-part select {
    max-width: 100%;
    width: 100%;

}

input {
    text-align: left;
    transition-duration: .5s;
}

::-webkit-input-placeholder {
    text-align: right;
    font-style: italic;
    padding-right: 3px;
 }
 :-moz-placeholder {
    text-align: right;
    font-style: italic;
    padding-right: 3px;  
 }
 ::-moz-placeholder {
    text-align: right;
    font-style: italic; 
    padding-right: 3px; 
 }
 :-ms-input-placeholder {
    text-align: right;  
    font-style: italic;
    padding-right: 3px; 
 }

 input:focus, select:focus, .txt-area:focus {
    
    color: rgb(201, 25, 127);
    border-color: rgb(231, 13, 78);
    transition: 1.5s;
    transform: scale(1.1);
    
     
    }
 

.top-form-part input {
    text-align: right;
}

hr {
    border: solid black 1px;
}

.bottom-form-part label {
    margin-left: 10px;
    margin-bottom:  10px;
    display:  inline-block;
}
.bottom-form-part label:last-child {
    margin-left: 0 ;
}

.txt-area {
    margin-top: 10px;
    margin-bottom: 25px;
    }

textarea {
    max-width: 100%;
    border: none;
    border-radius:  5px;
    background: rgb(229, 233, 233);
    width: 100%;
    margin-top: 10px;
    margin-bottom: 17px
}


button {
    width: 100%;
    background: rgb(50, 203, 171);
    border: none;
    border-radius:  5px;
    color: white;
    padding: 25px 0;
    font-size: 24px;
    }
    button:hover{
        background-color: #2e67f8;
        color: black;
    }

.copy {
text-align: center;
}

.container {
background: whitesmoke;
}

fieldset {
border: none;
}

#zip {
width: 50%;
}
.brand-logo {
    width: 75px;
    height: 75px;
    margin-left: 2rem;
    padding-top: 1rem;
  }








@media screen and (min-width:768px) {

    .top-form-part label {
        display: inline-block;
        
        }

        .container {
            width: 50%;
            margin: auto;
            padding-top: 50px;
        }

        #zip {
            flex-basis: 25%;
            margin-right: 45%;
           
        }
  
    .input-section {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    .top-form-part input, .top-form-part select {
    width: 70%;
      }
      
    

      .top-form-part select {
          box-sizing: content-box;
      }
}