* {
     box-sizing:border-box;
     margin:0;
     padding:0;
     }
     
      .mycaption {
          border: 1px #000 solid;
          padding: 2px;
          text-align: center;
          background-color: cornflowerblue;
          color: #fff;
          width:100%;
        }
                a {
          color: yellow;
            }
            
        a:visited {
          color: orange;
            }  
        .change {color:#fff;}

     @media all and (max-width: 500px) {
          
          body { 
            display:flex;
            flex-direction:column;
            justify-content:center;
            background: cornflowerblue;
            
               } 
       
       #logo {background:rgb(55, 81, 95);
            color:#fff;
            padding:10px;
            font-size: 1.7em;
             }
       
          nav #arrange{display:flex;
            flex-direction:column;
            list-style: none;
            }
       
            #arrange li {flex:1;
             background:#157145;
               }
       
           #arrange li a{
            display:flex;
            justify-content:center;
            text-decoration: none; 
           border:1px #000 solid;
           padding:10px;
           color:#fff; } 
       
         #myvideo{display:flex;
            justify-content:center;
            }
          
           video {height:260px; 
           width:auto;}
           
           p {padding:0.5em;
            line-height: 1.5em;
            }
       
           footer {display:flex;
            justify-content:center;
            background:rgb(55, 81, 95);
            color:#fff;
            padding:10px;
            font-size:0.6em;
           } 
           
           
       }
       
        @media all and (min-width: 600px) {
        body { 
        display:flex;
        flex-direction:column;
        justify-content:center;
        background: cornflowerblue;
     
        } 

    #logo {background:rgb(55, 81, 95);
         color:#fff;
         padding:10px;
         font-size: 1.7em;
       }

       nav #arrange{display:flex;
         flex-direction:row;
         list-style: none;}

     #arrange li {flex:1;
           background:#157145;
       }

    #arrange li a{ display:flex;
     justify-content:center;
     text-decoration: none; 
    border:1px #000 solid;
    padding:10px;  color:#fff;} 
    
  #myvideo{display:flex;
     justify-content:center;}
     

   
    video {height:260px; 
    width:auto;}
    
    p {padding:0.5em;
     line-height: 1.5em;
     }
     
   .mydiv{display:flex; 
   flex-direction:row;
  }
  
  iframe {height:270px;}
  
  .formpic{height:300px;}

    footer {display:flex;
     justify-content:center;
     background:rgb(55, 81, 95);
     color:#fff;
     padding:10px;
    } 
}