
* {
  box-sizing: border-box;
}

body {
  margin: 0;
}

.navbar {
  visibility:hidden; 
  overflow: hidden;
  background-color: green ;/*#333;*/
  font-family: Arial, Helvetica, sans-serif;
  
}

.dropdown0 {
  visibility:hidden; 
  float: left;
  overflow: hidden;
  left:  10px;
  top:   110px;
  margin:0 auto; 
  position:absolute;  
   
}

.dropdown1 {
  visibility:hidden; 
  float: left;
  overflow: hidden;
   left:  10px;
  top:   110px;
  margin:0 auto; 
  position:absolute;  
 
 
}

.dropdown2 {
  visibility:hidden; 
  float: left;
  overflow: hidden;
  left:  10px;
  top:   110px;
  margin:0 auto; 
  position:absolute;
}

/* Create three equal columns that floats next to each other */
._acolumn {
  float: left;
  width: 33.33%;
  padding: 10px;
  background-color: #ccc;
  height: 250px;
}

._acolumn a {
  float: none;
  color: black;
  padding: 6px;
  text-decoration: none;
  display: block;
  text-align: left;
}

._acolumn a:hover {
  background-color: #ddd;
}

/* Clear floats after the columns */
._arow{

}


/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */


.xBoard1
{
visibility:hidden;
text-align:left;
background:white; 
border:2px solid black; 
border-width:2px 2px 2px 2px; 
height:400px;

/* width: 900px; */
width:80ch;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
left:  0px;
top:   0px;
margin:0 auto; 
overflow: auto;
position:relative;
z-index: 1;

border: 3px solid transparent;
border-image: linear-gradient(45deg, black , white);
border-image-slice: 2;
border-radius: 3px; 

-webkit-box-shadow: 3px 3px 5px #888;
-webkit-border-bottom-right-radius: 7px;

}

/* 


-webkit-box-shadow: 5px 5px 7px #888;
-webkit-border-bottom-right-radius: 5px;
border-left: 5px solid rgba(240,240,240,0.5);
border-right: 5px solid rgba(255,255,255,0.8);
border-top: 3px solid rgba(7,7,7,0.4);
border-bottom: 25px solid rgba(100,200,200,0.4);





 border: 5px solid transparent;
  border-image: linear-gradient(45deg, red , yellow);
  border-image-slice: 1;
  border-radius: 5px; 

 border: 5px solid transparent;
  border-image: linear-gradient(45deg, red , yellow);
  border-image-slice: 1;
  border-radius: 5px; 
 */
 /*     border-radius: 5px; will have no effect */



.__TTLMN
{
text-align:center;
background:white; 
color:red;
font-size: 24px; 
}

._hdrClass
{
 style:float:left;
 color:black;
 font-size:28px;
 font-style:italic;
}
 .Z{
         background-color:red;
        color:white;
 
 }


.Z:hover {
        background-color:white;
        color:red;
      }
      

      
._topLine
{
 font-size: 7px;  


}      
      
      

.xBoard2
{
visibility:hidden;
text-align:left;
background:white; 
border:2px solid black; 
border-width:2px 2px 2px 2px; 
height:400px;

/* width: 900px;       10ch;  */
width:100px;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
left:  0px;
top:   0px;
margin:0 auto; 
overflow: auto;
position:relative;
z-index: 1;

}
   
   


._MB
{
  font-size: 24px;  
  border: none;
  outline: none;
  color: black;
  background-color: white;
  font: bold;
  margin: 0;
  cursor:pointer;

}

._MB:hover {
        background-color:black;
        color:white;
}
    
.__RCLOCK      
{
  visibility:hidden;
  position:absolute;  
  left:0;
  top:0;
  z-index: 1;  

}

.R
{
  font-size: 16px;  
  border: none;
  outline: none;
  color: black;
  background-color: white;
  font: bold;
  margin: 0;
  cursor:pointer;

}       


._imgfullScreen
{
background:white;
visibility:hidden;
max-width:100%;
height:auto;
size: cover;  
z-index: 9;
position:relative;
border:2px solid black; 
border-width:2px 2px 2px 2px; 

border: 3px solid transparent;
border-image: linear-gradient(45deg, black , white);
border-image-slice: 2;
border-radius: 3px; 

-webkit-box-shadow: 3px 3px 5px #888;
-webkit-border-bottom-right-radius: 7px;


}
