body {
  background:#461 url("pozadi.jpg") no-repeat top center;
  text-align:center;
	font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
}
.obsah { width:990px;width:1050px; background-color:transparent; margin:0px auto; }

.hlavicka {
  width:100%;
  height:70px;
  background-color:transparent;
  position:relative;
  float:left;
  margin:0 0 30px 0;
	color: #a42;
}
.hlavicka h1 {
	color: #a42;
  font-size:40px;
  font-weight: bold;
  margin:0;
  text-shadow: 1px 2px 3px #102000;
	filter: glow(color=304010, strength=3);
}
.uzky {
  width:270px;
  background-color:transparent;
  position:relative;
  float:left;
  text-align:left;
  padding:75px 0 0 20px;
}
.siroky {
  width:760px;
  background-color:transparent;
  position:relative;
  float:left;
  text-align:left;
  border: 0px solid #00f;
}
.ctvrtka {
  width:370px;
  height:300px;
  background-color:transparent;
  position:relative;
  float:left;
  text-align:center;
  border: 0px solid #0f0;
}

a { text-decoration: none; border: 0px solid #ccc; color: #ffc;}
a img { border: 0px solid #000;}
.ctvrtka .napis { color: #ff9; font-size:20px; font-weight: bold; }
.ctvrtka .napis h2 { xmargin-top:-5px;text-shadow: 1px 2px 8px #000; }
.ctvrtka h6 {
  color: #ff9; 
  font-size:25px; 
  font-weight: bold; 
  margin:0;display:inline;
  text-shadow: 1px 2px 3px #102000;
	filter: glow(color=405000, strength=2);
}

.vitejte {
  width:100%;
  margin-top:10px;
  margin-top:55px;
  text-align:left;
  color:#ff9;
  font-size:70px;
  font-weight: bold;
  text-shadow: 3px 5px 10px #102000;
	filter: glow(color=405000, strength=5);
}

.upgrade{
  width:100%;
  margin-top:10px;
  margin-top:55px;
  text-align:left;
  color:#ff9;
  font-size:40px;
  font-weight: bold;
  text-shadow: 3px 5px 10px #102000;
	filter: glow(color=405000, strength=5);
}

.soutez {
  width:990px;
  width:740px;
  width:720px;
  height:250px;
  background-color:transparent;
  position:relative;
  float:left;
  text-align:center;
  color: #ff9; 
  font-size:25px; 
  font-weight: bold; 
  text-shadow: 1px 2px 3px #102000;
  margin:20px 0 0 20px;
  border: 0px solid #0f0;
}

.paticka {
  width:90%;
  height:80px;
  background-color:transparent;
  position:relative;
  float:left;
  clear:both;
  text-align:center;
  font-size:18px;
  font-weight: bold;
  text-shadow: 1px 2px 3px #102000;
  padding:0;
}
.celasirka { width:100%;float:left;}
.w150 { width:150px;}
.w200 { width:200px;}
.w250 { width:250px;}
.ms { margin:0;position: relative; width: 370px; height: 261px; top: 4px;top: -23px;
     background-image: url('ms2.jpg');
     background-repeat: no-repeat;
     background-position:center bottom;
     background-size: contain;
      display:none;}
.ms img { margin:0;position: absolute; top: 10px; left: -25px;
          opacity:0; transition: opacity 1s ease 300ms;}

.ms:hover img {
    opacity:1;
}

.zs { margin:0;position: relative; width: 370px; height: 261px; top: 4px; top: -23px;
     background-image: url('zs2.jpg');
     background-repeat: no-repeat;
     background-position:center bottom;
     background-size: contain;
      display:none;}
.zs img { margin:0;position: absolute; top: 85px; left: 260px;
          opacity:0; transition: opacity 1s ease 300ms;}

#vstup { width:100%;float:left;
  height:330px;
   background-image: url('skola_cela.jpg');
   background-repeat: no-repeat;
   background-position:center bottom;}

.rychlyodkaz { position:relative; float:left; text-align:left;margin:0 15px 12px 0; }
.rychlyodkaz.pozn .info { margin-bottom:5px; font-size:13px;font-family: Tahoma, Arial, Sans-Serif; }
.rychlyodkaz a { color:#ff9; color: #ffc;font-size:20px; font-weight: bold; text-decoration: none;
      text-shadow: 1px 2px 10px #000; filter: glow(color=405000, strength=2);display:block;width:100%;
      }
.rychlyodkaz.pozn a { font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif; }
.rychlyodkaz.skolaonline {background: transparent url("poz_so.png") no-repeat center top; text-align:center;padding:2px 0 2px 0px;}
.rychlyodkaz.skolaonline a {padding:15px 0;}
.rychlyodkaz.prvni {height:114px;}



#vstup a { display:block;width:50%;height:100%;float:left;}

a:hover,
a .ctvrtka .napis:hover,
a .ctvrtka .napis h6:hover { color: #ff3;}

#vstup a h6 { color: #ff9; text-shadow: 1px 2px 3px #102000;}
#vstup a:hover h6 { color: #ff1; text-shadow: 1px 2px 15px #000;}  
#vstup a:hover .zs {display:block;} 
#vstup a:hover .ms {display:block;}
.ms:hover img,
.zs:hover img {
    opacity:1;
}

.uzky a:hover
 { xtext-decoration:underline;}

@media (max-width: 1000px) {
    .vitejte { font-size:50px; }
    .obsah { width:96%; }
    .siroky { width:100%; }
    .ctvrtka { width:100%; }
    .ms,.zs { width:100%;background-size:cover;background-size:contain;background-position:center 50%; }
    .zs img { left:50%; }
    .uzky { width:93%;padding:20px;margin:10px 5px 60px 0px;background-color:#461; background-color: rgba(60, 100, 15, 0.6); }
    .soutez {width:98%;height:60px;font-size:22px; }
    .rychlyodkaz.prvni {display:none;}
    .rychlyodkaz.w250 {width:30%;min-width:170px;}
    .rychlyodkaz a {font-size:18px;}
}

@media (max-width: 700px) {
    .vitejte { display:none; }
    .soutez { font-size:20px; }
}
@media (max-width: 600px) {
    .hlavicka h1 { font-size:25px; }
    .soutez { font-size:18px; }
    .ctvrtka .napis { font-size:18px; }
}

@media (max-width: 500px) {
    .hlavicka h1 { font-size:18px; }
    .ctvrtka .napis { font-size:15px; }
    .ctvrtka .napis h2 { margin:10px 0; }
}