*{
    padding:0;
    margin:0;
    box-sizing: border-box;
}

body{
    font-family: 'Arial';
    height: 100%;
    width:100%;
    background-color: #cfc5c5;
    display:flex;
    align-items:center;
    align-vertical:center;
    justify-content:center;
    margin-top: 20px;
    margin-left: 0px;
}

.container{
    width:98%;
    max-width:500px;
    margin:0 auto;
    padding: 15px;
    border-radius:  8px;
    margin-bottom: 20px;
    flex-direction: column;
}

.form-group {
   width:100%;
   margin-top: 20px;
   font-size: 17px;
}

.form-group input,
.form-group textarea
{
   width:100%;
   padding: 10px;
   font-size: 16px;
   border: 3px solid rgba(128, 128, 128, 0.199);
   margin-top: 5px; 
}

section {
    width:100%;
    background-color: #cfc5c5;
    display:flex;
    align-items:center;
    justify-content:center;
}

textarea{
   resize: vertical;
}

.button {
   width: 100%;
   border: none;                         
   outline: none;                        
   padding: 10px;                        
   font-size: 22px;                      
   border-radius: 18px;                    
   font-familly: 'Arial';                
   color: black;             
   text-align: center;                   
   cursor: pointer;                      
   margin-top: 10px;                      
   transition: .3s ease background-color; 
   background-color: #cfc5c5;
}

.button:hover {background-color: #3e8e41}

.button:active {
  background-color: #3e8e41;
  color:white;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
 
#status {
   width: 90%;
   max-width: 500px;
   text-align: center;
   padding: 10px;
   margin: 0 auto;
   border-radius: 8px;
}
 
#status.success{
   background-color: rgb (211, 250, 153);
   animation: status 4s ease forwards;
} 
 
#status.error{
   background-color: rgb (250, 129, 92);
   color: white;
   animation: status 4s ease forwards;
} 
 
@keyframes status{

   0%{
   opacity: 1;
   pointer-events: all;
   }
   
   90%{
   opacity: 1;
   pointer-events: all;
   }
   
   100%{
   opacity: 0;
   pointer-events: none;
   }
}
