body{ margin:0;
      background:#fdd3e3;
      height: auto;}

.container{ margin:0 auto;
            margin-top: 6em;
            width:90%;
            display: flex; 
            justify-content: space-evenly;
            padding:0.5em; }


.form { width:50%;
        height: 400px;
        background-color: white;
        border-radius: 15px 50px;
        text-align: center;}


.form h1{ font-family: 'Festive', cursive;
          font-size: 2.5rem;
          padding:.5em; 
          padding-top: 0;
          margin-bottom: 1.5em;
          border-bottom: 10px solid #fdd3e3 ;}

.username {  font-size: 1rem;
             font-weight: 600;
             font-family: 'Oswald', sans-serif;}

.introduction {  border-top: 10px solid #fdd3e3 ;
                padding:1em;
                margin-top: 4em;
                font-size: 1rem;
                font-weight: 600;
                font-family: 'Oswald', sans-serif;}

input[type=submit]{
    width:10%;
    background-color: rgb(214, 214, 214);
    padding:.5em;
    border:none;
    margin-left: .5em;
    border-radius: 4px;
    cursor: pointer;
    color:#000 }
    
input[type=text]{border-radius: 4px; 
                 border:1px solid #ccc;
                 outline: none;
                 padding:.5em;
                 margin-left: .5em;}

@media (max-width:740px){

    .form { width:100%;
            height: auto;
            background-color: white;
            border-radius: 15px 50px;
            text-align: center;}

    form{display:flex; 
         flex-direction: column;
         align-items: center;}

    input[type=submit]{ width:20%; }

    input[type=text]{margin-bottom: 2em;}

}