:root {
  --active: lightgray;
  --inactive: gray;
  --pagebg: black;
}


body {
  background-color: var(--pagebg);
  font-family: "Calibri", sans-serif;
}

.center {
  margin-right: auto;
  margin-left: auto;
}

table, td {
  padding: 0px;
  margin: 0px;
  border: 0px;
  border-collapse: collapse;
}


.tabs td {
  background-color: var(--inactive);
  text-transform: uppercase;
  padding: 5px 10px 5px 10px;
  border-top: 2px solid var(--pagebg);
  margin: 0px;	
  font-weight: bold;
}

.tabs a {
  text-decoration: none;
  color: white;
}

.tabs a:hover {
  color: lightgray;
}

.tabs .active {
  background-color: var(--active);
  border-top: 2px solid var(--active);
}

.tabs .active a {
  color: black;
  text-decoration: none; 
}

.content {
  background-color: var(--active);
  width: 1800px;
  height: 100px;
  padding: 5px 10px 5px 10px;
}

table.plan_lekcji {
}

.plan_lekcji th, .plan_lekcji td {
  padding: 5px 10px 5px 10px;
}

.plan_lekcji th {
  background-color: red;
  text-transform: uppercase;
}

.plan_lekcji .lekcja {
  background-color: gold;
}

.plan_lekcji .przerwa {
  background-color: green;
}

.plan_lekcji a {
  text-decoration: none;
  color: var(--inactive);
}

.plan_lekcji a:hover {
  color: lightgray;
}

.content a table { 
    display: inline;
}

.content a table td {
    border-radius: 10px; 
    width: 75px; 
    height: 75px; 
    background-color: white; 
    text-align: center; 
    vertical-align: middle;
}   

.content a img {
    border-radius: 10px; 
    height: 75px; 
}

.content a table td img {
    border-radius: 0px; 
    height: 55px; 
}    
}