.container{ display: grid;
          
                 grid-template-columns: 170px auto 170px;
                 grid-template-rows: 45px 27px auto 2px; 
                 grid-gap: 0px;
                 }

     .title{    grid-column-start:1;
                 grid-column-end:4;
             
     }



     .header{    grid-column-start:1;
                 grid-column-end:4;
             
     }
     
     
       
          .footer{    grid-column-start:1;
                 grid-column-end:4;
             
     }



















body {background-color: gainsboro;}

body {width: 85%;
       margin-right: auto;
       margin-left: auto;}

.title {
    background-color: #0F9CE3;	
    border-radius:  8px 8px 0px 0px;	
    padding: 8px 5px 0px 8px;
    border: 1px solid lightskyblue;
    color:white;
     font-size: 23px;
     font-weight: bold;
}

h1{

color: #0F9CE3;
font-size: 25px;
padding: 10px 0px 0px 0px;
}


h2{

color: #0F9CE3;
font-size: 18px;
padding: 10px 0px 0px 0px;
}


.header {
    background-color: #0F9CE3;
    padding: 2px 0px 0px 8px;
    border: 1px solid lightskyblue;
    color:white;
  
}

 .header  a { color:white;  }
 .header  a:hover {color: red;}


 .menu  a { color:blue;  }
 .menu  a:hover {color: red;}

.menu {
    background-color: white;
    border-left: 2px solid lightskyblue; 
    border-right: 2px solid lightskyblue; 
    padding: 8px;
   font-size: 12px;
}

.content {
    background-color: white;
    padding: 0px 15px 10px 15px;
}

.footer {
    background-color: lightskyblue;
    border-radius:  0px 0px 8px 8px;
 	
}

 



html {
    padding: 0 10px;
    margin: 0 10px;
}

 

body {background-color: gainsboro;
    
       }


    .red
    {
        color: red;
        font-weight: bold;
    }


    .yellow
    {
        color: yellow;
        font-weight: bold;
    }


.search{ float: right;  }










html, body{
  font-family: Arial, Helvetica, sans-serif;}
  
  
    pre{color: white;
      background-color: black;  
      padding:10px;
      white-space: pre-wrap;
      font-size: 14px;
      border-radius:  5px 5px 5px 5px;
  }
  

pre.terminal
     {color: white;
      background-color: black;  
      padding:10px;
      white-space: pre-wrap;
      font-size: 14px;
      border-radius:  5px 5px 5px 5px;
  }  
  
pre.feedback-top{color: black;
      background-color: silver;  
      padding:10px;
      font-weight: bold;
  }  
 
pre.feedback{color: black;
      background-color: lightgray;  
      padding:10px;
 
  }
  
  
  
  
textarea{  
      padding:10px;
      white-space: pre-wrap;
      font-size: 14px;
      border-radius:  5px 5px 5px 5px;
      width: 100%;
  }


img{


   margin-right: auto;
       margin-left: auto;
border-radius: 8px;
}


.imageContainer {
     transition:transform 0.25s ease;

}


.imageContainer > img:hover {
-webkit-transform:scale(1.5);
    transform:scale(1.5);
  border-radius: 8px;

}