table.center {
  margin-left: auto; 
  margin-right: auto;
}
.toggle-on-img {
    background-image: url(images/toggle-on.svg);
    display: block;
    width: 40px;
}
.toggle-off-img {
    background-image: url(images/toggle-on.svg);
    display: block;
    width:40px;
}
.container {
    position: relative;
    text-align: center;    
}
.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: green;
    font-size: 20px;
}
.w3-border-bottom-purple {
border-bottom:6px solid;
border-bottom-color:#9f00c5!important
}
.w3-border-top-purple {
border-top:6px solid;
border-top-color:#9f00c5!important
}
.w3-border-bottom-red {
border-bottom:6px solid;
border-bottom-color:#f44336!important
}
.w3-border-top-red {
border-top:6px solid;
border-top-color:#f44336!important
}
@media only screen 
and (min-device-width : 640px)
and (max-device-width : 1440px)  {
     /* STYLES GO HERE */
   #menuButtons {
    margin: auto;
    width: 70%;
   }  
}

@media only screen 
and (min-device-width : 1445px)  {
     /* STYLES GO HERE */
   #menuButtons {
    margin: auto;
    width: 40%;
   }  
}

@media only screen 
and (min-device-width : 640px)
and (max-device-width : 1440px)  {
     /* STYLES GO HERE */
   #anySizeWordDiv {
    margin-left: auto;
    margin-right: auto;
    width: 70%;
   }  
}

@media only screen 
and (min-device-width : 1445px)  {
     /* STYLES GO HERE */
   #anySizeWordDiv {
    margin-left: auto;
    margin-right: auto;
    width: 50%;
   }  
}

@media only screen 
and (min-device-width : 640px)
and (max-device-width : 1440px)  {
     /* STYLES GO HERE */
   #keyBoardHelp {
    margin: auto;
    width: 45%;
   }  
}

@media only screen 
and (min-device-width : 1445px)  {
     /* STYLES GO HERE */
   #keyBoardHelp {
    margin: auto;
    width: 40%;
   }  
}

@media only screen 
and (min-device-width : 1445px)  {
     /* STYLES GO HERE */
   #keyBoardHelp {
    margin: auto;
    width: 40%;
   }  
}

.example {
  height: 385px;
  overflow-y: scroll; /* Add the ability to scroll */
}

/* Hide scrollbar for Chrome, Safari and Opera */
.example::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.example {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.ltr-btn-style {
    width:50px; 
    height:50px;
    margin-left: 5px;
}

.ltr-btn-style-lean {
    width:35px; 
    height:45px;
    margin-left: 2px;
}

.button-text-style {
    padding: 0%;
    font-family: 'Times New Roman', serif, sans-serif;
    font-size: medium;
    text-align: center;
}

.button-text-style-lean {
    padding: 0%;
    font-family: 'Times New Roman', serif, sans-serif;
    font-size: small;
    text-align: center;
}

.kb-ltr-btn-style {
    width:30px; 
    height:30px; 
    padding: 3px;
}

.kb-ltr-btn-style-lean {
    width:27px; 
    height:30px; 
    padding: 3px;
}

.w3-padding-lean {
  padding: 2px 2px 2px 2px;
}

.statBtn {
    width:75px;
    height:25px;
    color: white;
    font-size: xx-small;
    padding:0%;
}

.statBtnShadow {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}

.btn-level-green {
	width:75px; 
	padding:5px;
	font-size:12px;
	font-weight:900;
	background-color:rgba(0,192,0,0.9);
	color: white;	
}

.btn-level-gray {	
	width:75px; 
	padding:5px;
	font-size:12px;
	background-color:rgba(192,192,192,0.6);	
}