html {
min-height:100%;
background:#c5ccd2;
}

body {
    text-align: center;
    font: 12px Georgia, Serif;
}

.menuXXXXX {
    display: inline-flex;
    color: #fff;
    text-decoration: none;
    padding: 6px;
    font-size: 14px;
    border-radius: 4px;
    border: .5px solid #fff9;
}



table{
margin:20px auto;
border-collapse: collapse;

}

.menuDiv{
text-align:left;
position:fixed;
padding:4px;
background: #00000087 !important;
border-radius:4px;
width:30px;
height:30px;
transition:width 0.2s;
transition:height 0.2s;
-webkit-transition:width 0.1s;
overflow:hidden;
z-index:9;
}

.menuDiv:hover{
width:200px;
height:auto;
}

.menuDiv a{
border-bottom:1px solid #333;
display:block;
width:95%;
color:#fff;
padding:10px;
font-size:20px;
text-decoration:none;
line-height: 80%;
}

.menuDiv .ico{
width:30px;
height:30px;
border-radius:4px;
}

.menuDiv:hover .ico {visibility: hidden;}

.kl{
    background: #333;
    color: #fff;
    padding: 10px;
    margin: 4px;
    display: inline-block;
    text-decoration: none;
    border-radius: 4px;
    font-weight: bold;
}

.menu img{
    background: #fff;
    border-radius: 4px;
    height: 15px;
padding: 2px;
margin: 0px 6px;
}


#page-wrap{ 
width: 90%; 
max-width: 1000px;  
margin: 10px auto;
padding-bottom: 30px;
//background: #fff5;
padding-bottom: 100px;
padding: 10 10 400;
border-radius: 15px; 
}

hr { 
display: block; 
height: 1px;
border: 0; 
border-top: 3px solid #D5D5D5;
border-top: 1px solid #7B7B7B14;
margin: 7px; 
padding: 0; }

.logoimg{
	width: 50%; 
	padding: 0px;
	margin:0px;
	border-radius: 10px 10px 0 0;
	}


.menuimg{
border-radius:5px;
max-width: 60px; 
width: 80%
}

.menu{
display: inline-flex;
}
.menu a{
	width: 80%;
}


h1, h2, h3 { 
font-family: 'Lemon';
border-bottom: 0px solid #efefef;
margin: 0 0 10px 0;
color: #2a4c56;
}

#klasat a{
font-family: 'Lemon';
}

h4 { 
font: 22px Georgia, Serif;
border-bottom: 0px solid #efefef;
margin: 0 0 10px 0;
color: #2a4c56;
}

h4 span { 
font: 18px Georgia, Serif;
border-bottom: 0px solid #efefef;
margin: 0 0 10px 0;
color: #2a4c56;
}



.clear { clear: both; }



input[type="text"], input[type="button"], textarea {
    padding: 6px;
    border: 0px solid #666;
    width: 100%;
    max-width: 100%;
    max-width: 700px;
    margin: 4px;
    border-radius: 4px;
}


 
input[type="button"],
input[type="submit"]{ 
padding: 3px; 
border: 1px solid #666; 
max-width:100%; 
margin: 0; }



input[type="button"], input[type="submit"] {
    padding: 3px;
    border: 0px solid #666;
    max-width: 100%;
    margin: 0;
    background: #10508f;
    color: white;
    font-weight: bold;
    font-size: 25px;
}



.but{
color:  #fff;	
padding: 2px 8px;
margin: 1px;
font-weight:bold;
text-decoration: none;
width:auto;
display:inline-block;
}



.greenB{
background:rgb(22, 129, 22);
}

.yellowB{
background:rgb(255, 165, 0);
}

.redB{
background:rgb(186,0,0);	
}

.blueB{
background: rgb(76, 138, 175);
}



lable {
    background: #0003;
    color: #fff7;
    max-width:400px ;
    width:100% ;
    display: inline-block;
    padding: 4px 0px;    
    background: linear-gradient(to left, rgba(0,0,0,.2) , rgba(0,0,0,0));
    text-align: right;
    margin-top: 8px;
    font-size:15px;
    margin-bottom:-4px;
}



#lendet {
  margin:5px auto;
  border-collapse: collapse;
  max-width: 100%;
}

#lendet td {
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

#lendet tr:nth-child(even){background-color: #f0ece4;}
#lendet tr:nth-child(odd){background-color: #f9f9f9;}

#lendet tr:hover {background-color: #ddd;}

#lendet th {
  border: 0px solid #ddd;
  border-right: 1px solid #2D76A1;
  padding-top: 8px;
  padding-bottom: 8px;
  text-align: center;
  background-color: #4C8AAF;
  color: white;
}







#lessonsTable {
  margin:5px auto;
  border-collapse: collapse;
  max-width: 100%;
}

#lessonsTable td {
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

#lessonsTable tr:nth-child(even){background-color: #f0ece4;}
#lessonsTable tr:nth-child(odd){background-color: #f9f9f9;}

#lessonsTable tr:hover {background-color: #ddd;}

#lessonsTable th {
  border: 0px solid #ddd;
  border-right: 1px solid #2D76A1;
  padding-top: 8px;
  padding-bottom: 8px;
  text-align: center;
  background-color: #4C8AAF;
  color: white;
}







#klasat {
  margin:5px auto;
  border-collapse: collapse;
  max-width: 100%;
}

#klasat td {
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

#klasat tr:nth-child(even){background-color: #f0ece4;}
#klasat tr:nth-child(odd){background-color: #f9f9f9;}

#klasat tr:hover {background-color: #ddd;}

#klasat th {
  border: 0px solid #ddd;
  border-right: 1px solid #2D76A1;
  padding-top: 8px;
  padding-bottom: 8px;
  text-align: center;
  background-color: #4C8AAF;
  color: white;
}