body {
    margin: 0;
    display: flex;
    height: 100vh;  
    flex-direction: column;
 }
 main {
   flex-basis: 0%;
   flex-shrink: 1;
   flex-grow: 1;
    margin: 0;
 }
     h2 {
    text-align: center;
    color: #B3B3B3;
 }
 .ppspb {
     display: flex;
     justify-content: center;
     height: auto;
     margin: 20px;
     width: 90%;
     border:2px solid #006400;
     border-radius: 15px;
     padding: 10px;
     color: #006400;
     text-align: center;
     font-size: 24pt;
 }
      a {
        color: inherit;
        cursor: pointer;
        text-align: center;
        text-decoration: none; 
        }
    
    .logo2   {
           display: inline-flex;
           height: 70px; width: 250px;
           align-items: center;
           background: url(img/logofa.png);
           background-repeat: no-repeat;
           background-position: center;
           background-size: contain;
           padding:  8px 2px 0 0;
        }
    h3 {
             overflow: hidden; 
             text-overflow: ellipsis;
             white-space: nowrap;
             font: 1.8em 'Raleway';
        }
        
     @media screen and (min-width: 220px) and (max-width:520px) {   
    footer>p {color: #FFFFFF;}
    h2 {
          text-align: center;
          font: 1.8em 'Raleway';
          color: #191970;
        }
   
    .menu1 {
          background: #2E8B57;
          border-radius: 5px;
          font: 1.2em;}
    .menu1 a {color: #FFFFFF ;}      
    .name {font: 6px; margin: 10px;}
    footer>p { color: red;}
    .conteiner3 {padding: 0;}
    .block1 {flex-wrap: wrap; flex-wrap: -ms- wrap;}
    .shpon {height: 90px;}
    .menu1 {background: #2E8B57; border-radius: 5px; font: 1.2em; border-bottom:  none;}
    .menu1 a {color: #FFFFFF ;}
    .conteiner1 {flex-direction: column;}}