/*--- definice pisma ---*/
 @import url(http://fonts.googleapis.com/css?family=Open+Sans);
/*--- definice telo+scroll ---*/
BODY {
text-align: center;

padding-left: 0px;
padding-right: 0px;
font-family: "Open Sans", "Open Sans", Arial;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f9f9f9+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #f9f9f9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#f9f9f9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#f9f9f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */

}


* {
margin: 0;
padding: 0;
border: 0;
}


.bile{
  background-color: #FFFFFF;
}


a{
  text-decoration: none;
}
.clear{
clear: both;
}

.uvnitr{
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}


h1.seo-nadpis span, a.logo2 span {
    position: absolute;
    text-indent: -9999px;
}

.info{

width: 100%;
height: 50px;
text-align: left;
position: relative;
margin-left: auto;
margin-right: auto;
z-index: 1;
background-color: #efefef;
color: rgba(255, 255, 255, 1);
line-height: 30px;
}

 .info p{

  margin-top: 5px;

  float: left;
  white-space: nowrap;
  font-size: 14px;
  font-weight: lighter;
  font-family: "Open Sans", Arial;
}

/*---
zmena jazyka
---*/
#zmena{

	float: right;
	margin-top: 6px;
	margin-right: 0px;
	height: 27px;
	list-style: none;
	position: relative;

}

 @media all and (max-width: 1024px) {
#zmena{
/*    display: none;     */
}

}

#zmena span{
	display: none;
}
#zmena li{
	margin-left: 0px;
	float: left;
	height: 15px;

}

#zmena li a{
	opacity: 0.5;
	filter: alpha(opacity=60);
	-moz-opacity: 0.5;
	-khtml-opacity: 0.5;
  -webkit-transition:all 0.25s ease-in;
 -moz-transition: all 0.25s ease-in;
 -o-transition: all 0.25s ease-in;
 transition: all 0.25s ease-in;
}
#zmena li a:hover{
  	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
  -webkit-transition:all 0.25s ease-in;
 -moz-transition: all 0.25s ease-in;
 -o-transition: all 0.25s ease-in;
 transition: all 0.25s ease-in;
}

#zmena li a.cz{
	margin-right: 5px;
	margin-left: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-cz.png);
}
#zmena li a.cz:hover{
	background: url(https://skola.prosenice.cz/css/flag-cz.png);
}
#zmena li.aktivni a.cz{
	margin-right: 5px;
	margin-left: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-cz.png);
      	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}

#zmena li a.en{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-en.png);
}
#zmena li a.en:hover{
	background: url(https://skola.prosenice.cz/css/flag-en.png);
}

#zmena li.aktivni a.en{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-en.png);
      	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}


#zmena li a.sk{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-sk.png);
}
#zmena li a.sk:hover{
	background: url(https://skola.prosenice.cz/css/flag-sk.png);
}
#zmena li.aktivni a.sk{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-sk.png);
      	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}

#zmena li a.de{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-de.png);
}
#zmena li a.de:hover{
	background: url(https://skola.prosenice.cz/css/flag-de.png);
}
#zmena li.aktivni a.de{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-de.png);
      	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}
#zmena li a.ru{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-ru.png);
}
#zmena li a.ru:hover{
	background: url(https://skola.prosenice.cz/css/flag-ru.png);
}
#zmena li.aktivni a.ru{
	margin-left: 0px;
	margin-right: 5px;
	float: left;
	width: 22px;
	height: 15px;
	display: block;
	background: url(https://skola.prosenice.cz/css/flag-ru.png);
      	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}



.info .mail, .info .tel{

float: right;
margin-right: 20px;
margin-left: 10px;
color: rgba(102,102,102, 1);
}


.info a{
  margin-top: 5px;
float: right;
margin-right: 20px;
color: rgba(102,102,102, 1);
  font-size: 14px;
  font-weight: lighter;
 font-family: "Open Sans", Arial;
}





div#hlavicka{
  width:100%;
/*max-width: 1200px; */

height: 90px;
text-align: center;
position: relative;
margin-left: auto;
margin-right: auto;
top: -10px;

border-left: none;
border-right: none;
z-index: 100;
background-color: rgba(255, 255, 255, 1);
-webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;


}


div#hlavicka.posun{
width: 100%;
max-width: 100%;
height: 45px;
text-align: center;
position: fixed;
margin-left: auto;
margin-right: auto;
top: 0px;
left: 0px;
z-index: 100;
-webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
      -moz-box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
-webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
box-shadow: 0px 3px 5px rgba(0,0,0,0.1);



}


div#hlavicka .uvnitr{
max-width: 1200px;
margin-left: auto;
margin-right: auto;



}



div#hlavicka .logo2{

  background: url(logo2.png);
    background-size: 320px;
    height: 80px;
  width: 320px;
  display: block;
  position: absolute;
  z-index: 10000000;
  margin-top: 5px;
  margin-left: 10px;
  -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}
div#hlavicka.posun .logo2{

  background: url(logo2.png);
    background-size: 140px;
    height: 35px;
  width: 140px;
  display: block;
  position: absolute;
  z-index: 10000000;
  margin-top: 4px;
  margin-left: 10px;
  -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}

 @media all and (max-width: 1024px) {






div#hlavicka{
width: 100%;
border: none;
height: 0px;
text-align: left;
position: relative;
margin-left: auto;
margin-right: auto;
top: 0px;
left: 0px;
z-index: 100;

-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
-ms-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;

}


div#hlavicka.posun{
width: 100%;
border: none;
height: 0px;
text-align: left;
position: relative;
margin-left: auto;
margin-right: auto;
top: 0px;
left: 0px;
z-index: 100;
-webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;



}

div#hlavicka.posun .logo2, div#hlavicka .logo2{
  background: url(logo2.png);
    background-size: 160px;
    height: 40px;
  width: 160px;
  display: block;
  position: absolute;
  z-index: 10000000;
  margin-top: -30px;
  margin-left: 10px;
  -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
}


.info{

width: 100%;
height: 80px;
text-align: left;
position: relative;
margin-left: auto;
margin-right: auto;
z-index: 1;
background-color: #efefef;
color: rgba(255, 255, 255, 1);
line-height: 30px;
}


 .info p{

  margin-top: 10px;

  float: left;
  white-space: nowrap;

}


.info .mail, .info .tel{

float: right;
margin-right: 20px;
margin-left: 15px;
color: rgba(102,102,102, 1);
}


.info a{
  margin-top: 10px;
float: right;
margin-right: 20px;
color: rgba(102,102,102, 1);


}
.info a.vyhledavani{
  display: none;
}
.info p.tel{

}


 #zmena{
   margin-right: 15px;
}




}


 @media all and (max-width: 611px) {
 .info p{
    display: none;
}
.info .mail, .info .tel{
 /*
    display: none;*/
}


.info a{
   /* display: none;   */
}

}








 /* nadpisy */
div#pruh-nadpis {
    width: 100%;
    min-height: 130px;

    margin-top: -92px;
    text-align: center;
    border-bottom: solid 1px #e6e6e6
}

@media all and (max-width: 1024px) {
 div#pruh-nadpis{
   width: 100%;
   min-height: 80px;

   margin-top: 0px;
    border-bottom: solid 1px #e6e6e6

}

}
@media all and (max-width: 866px) {


 div#pruh-nadpis{
   width: 100%;
   min-height: 80px;

      margin-top: 0px;
         -webkit-transition: all 0.3s;
          border-bottom: solid 1px #e6e6e6

}

}


/* nabidka */
div.pruh-bily{
  background-color: rgba(255, 255, 255, 1);
  padding-top: 0px;
  padding-bottom: 30px;
  text-align: center;
  width: 100%

}

div.pruh-bily.prechod{
      border-top: solid 1px #eeeeee;
      border-bottom: solid 1px #eeeeee;
    padding-top: 0px;
  padding-bottom: 20px;
  text-align: center;
  width: 100%
       /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feffff+0,f5f5f5+100 */
background: #ffffff; /* Old browsers */


}

div.pruh-bily .uvnitr{

  width: 100%

}




div.pruh-sedy{

    padding-bottom: 30px;
    margin-bottom: 30px;
    padding-top: 30px;
  width: 100%

}

div.pruh-obrazek{
  background: url(https://skola.prosenice.cz/css/sedy.jpg);

    background-color:  #f4f4f4;
    padding-bottom: 30px;
    margin-bottom: 0px;
    padding-top: 30px;
    background-attachment: fixed;

      background-size: 50% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  width: 100%

}













div.pruh-bily .uvnitr{
  text-align: center;
}
/*div.pruh-bily .uvnitr img{
  display: inline-block;
  text-align: center;
}*/

/* klienti */
div.pruh-loga{
  background-color: #f7f5f2;
  padding-top: 0px;
  padding-bottom: 80px;
  width: 100%
}

div.pruh-loga .uvnitr{
  text-align: center;
}
div.pruh-loga .uvnitr img{
  display: inline-block;
  text-align: center;
}


@media all and (max-width: 600px) {
h2.nadpis.reference{
    color: #cdc4b4;
    font: 40px Titillium Web, TitilliumWeb, "Open Sans", Arial;
    padding-top: 60px;
    margin-bottom: 10px;
    text-align: center;
    line-height: 50px;
}

div#hlavicka.fixed .logo2{

  background: url(logo2.png) no-repeat left;
    background-size: 90px;
    height: 50px;
  width: 90px;
  display: block;
  position: absolute;
  z-index: 10000000;
  margin-top: 60px;
  left: 0px;
  -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;

}









}
@media all and (max-width: 400px) {
h2.nadpis.reference{
  margin-left: 40px;
  margin-right: 40px;
    color: #cdc4b4;
    font: 40px Titillium Web, TitilliumWeb, "Open Sans", Arial;
    padding-top: 60px;
    margin-bottom: 10px;
    text-align: center;
    line-height: 50px;
}
}
/* sluzby na uvodu */





/*
paticka
 */




div.paticka-cara{
  width: 100%;
  height: 5px;

  background: url(https://skola.prosenice.cz/css/paticka-obracene.png) ;
     background-size: 100% 100%;
  margin-bottom: 0px;

}
div#paticka{
  width: 100%;
  min-height: 500px;

  background: url(https://skola.prosenice.cz/css/paticka.png);
  background-size: 100% 100%;


  margin-bottom: 0px;
  text-align: center;
}

div#podpaticka{
  width: 100%;
  height: 50px;
  margin-top: 30px;

  margin-bottom: -25px;
  text-align: center;
}

div#paticka .uvnitr{
  text-align:left;
}




div#paticka .uvnitr .bily{
  text-align: left;
  background-color: rgba(255, 255, 255, 1.0);
}


div.tip{
  clear: both;
  margin-top: 20px;

  padding: 20px;
  text-align: left;
  padding-top: 5px;
/*  background: rgba(0, 0, 0, 0.1) */
    border-top: solid 1px rgba(255, 255, 255, 0.5);
}




div.tip p{
  color: rgba(255, 255, 255, 1);
  font-size: 13px;
  margin-bottom: 15px;
  padding-top: 20px;
  margin-left: 0px;
  display: inline-block;
  text-align: left;
  width: 280px;
}
div.tip a{
  color: rgba(255, 255, 255, 1);
  text-decoration: underline
}
div.vyrobci{
  clear: both;
  margin-top: 0px;

  text-align: left;

  background: rgba(255, 255, 255, 1)
}

div.vyrobci p{
  font: lighter 14px "Open Sans", Arial;
  color:   #1ea1dc;
  margin-left: 20px;
  margin-top: 20px;
  margin-bottom: 10px;
  display: inline-block;

  text-align: left;
  vertical-align: top;

}

div.vyrobci img{

  margin-top: 15px;
  float: left;
  max-height: 60px;
  width: auto;
  margin-left: 20px;

}

  @media all and (max-width: 921px) {
    div.vyrobci{

  text-align: center;

}
div.vyrobci p{
  font: lighter 12px "Open Sans", Arial;
  color:   #1ea1dc;
  margin-left: 20px;
  margin-top: 20px;
  margin-bottom: 10px;
  display: inline-block;
  max-width: 90%;
  text-align: left;




}

div.vyrobci img{


}

}
div#paticka .patlogo{
    background: url(logo2.png);
    background-size: 200px;
    height: 50px;
    width: 200px;
  display: block;
  float: right;
  z-index: 1000;
  margin-top: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
}

div#paticka ul.patmenu {

    display: inline-block;
    vertical-align: top;

width: 100%;
 /*   border-top: solid 1px rgba(255, 255, 255, 0.5);   */
    border-bottom: solid 1px rgba(255, 255, 255, 0.5);
}

div#paticka ul.patmenu li{
    text-align: center;
  display: inline-block;


  list-style: none
}


div#paticka ul.patmenu li a{
 font: lighter 15px  "Open Sans", Arial;
 color: rgba(255,255,255,1);
 padding: 20px;
 display: block;

   -webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;


}

div#paticka ul.patmenu li a:hover{
 color: #000000;

   -webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
background-color: rgba(255, 255, 255, 1);
}















  @media all and (max-width: 790px) {



div#paticka  {
     padding-bottom: 70px;


}

div#paticka ul.patmenu {
    text-align: center;
    width: 100%;
        padding: 0px;
    padding-top: 0px;
    border-top: none;
    border-bottom: none

}

div#paticka ul.patmenu li{
    text-align: left;
  display: block;
  border-right: none;

  border-bottom: solid 1px rgba(255, 255, 255, 0.4);

  list-style: none
}
div#paticka ul.patmenu .posledni{
  border-right: none;
}


div#paticka ul.patmenu li a{
 font: lighter 15px  "Open Sans", Arial;

 padding-left: 20px;
 padding-right: 10px;
 padding-bottom: 15px;
 padding-top: 10px;
 display: block;

   -webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

div#paticka ul.patmenu li a:hover{

 padding-left: 20px;
 padding-right: 10px;

   -webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

}










  @media all and (max-width: 600px) {



}


  div.fb-like{

 text-align: center;
 display: inline-block;
 width: 100%;
 margin-top: 20px;
}



 p.copy{
 font: 13px  "Open Sans", Arial;
 color: #ffffff;
 margin-top: 15px;
 text-align: center;
 display: inline-block;
 width: 100%;
}



 p.copy a{
 font: bold 13px  "Open Sans", Arial;
 color: #ffffff;
}


 @media all and (max-width: 480px) {
div.podpaticka{
  text-align: center;
}
 p.copy{
 font: 11px "Open Sans", Arial;
 color: #ffffff;
 margin-top: 15px;
 width: 200px;
 display: inline-block;

}
 p.copy a{
 font: bold 11px "Open Sans", Arial;
 color: #ffffff;
}
}

/* lista socialni site, kontakt tel */
div#paticka .socialni{

    min-height: 50px;
    width: 100%;
    margin-top: 30px;
}
div#paticka .socialni a, div#paticka .socialni p{

  font: bold 18px  "Open Sans", Arial;
 color: #ffffff;
 line-height: 24px;
 margin-top: 20px;
      text-align: left;
      margin: 10px

}
div#paticka .socialni a.mail{


 display: inline-block;

}
div#paticka .socialni p.tel{

 display: inline-block;

}

div#paticka .socialni a.fcb{

 display: inline-block;

}

div#paticka .socialni a.fcb span, div#paticka .socialni p.tel span, div#paticka .socialni a.mail span{
  display: inline-block;

  vertical-align: top;

}
div#paticka .socialni a.fcb span strong, div#paticka .socialni p.tel span strong, div#paticka .socialni a.mail span strong{

   font: lighter 14px  "Open Sans", Arial;
}


div#paticka .socialni a.fcb i, div#paticka .socialni p.tel i, div#paticka .socialni a.mail i{
  font-size: 30px;
  display: inline-block;
  margin-right: 20px;


  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 40px;
  border: solid 1px rgba(255, 255, 255, 1);
    text-align: center; 
}

  @media all and (max-width: 790px) {

div#paticka .socialni {

text-align: center;
}

div#paticka .socialni a, div#paticka .socialni p{

  font: bold 14px  "Open Sans", Arial;
 color: #ffffff;
 line-height: 20px;
 margin-top: 20px;
      text-align: left;

}
div#paticka .socialni a.mail{


 display: inline-block;
 margin-left: 0px;
}
div#paticka .socialni p.tel{

 display: inline-block;
 margin-left: 0px;
}

div#paticka .socialni a.fcb{

 display: inline-block;
 margin-left: 0px;
}


div#paticka .socialni a.fcb i, div#paticka .socialni p.tel i, div#paticka .socialni a.mail i{
  font-size: 20px;
  display: inline-block;
  margin-right: 10px;


  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 40px;
  border: solid 1px rgba(255, 255, 255, 1);

}

div#paticka .vyrobci{
  text-align: center;
}
div#paticka .vyrobci .loga{
display: inline-block;
    margin-top: 10px;
    vertical-align: top;
    float: none;
    width: auto;
    max-width: 80%;

}
div#paticka .vyrobci .patlogo{
  display: inline-block;
  float: none;

}


}

  @media all and (max-width: 600px) {


  div#paticka .socialni a, div#paticka .socialni p{

width: 90%;
}




}
/*
---------------------
Pro všechny stránky
---------------------
 */


/* reklama */
.dialog-background {width: 100%; height: 100%; background: #000; opacity: .85; position: fixed; z-index: 1000000; left: 0; top: 0; display: none}
.dialog {width: 40%; max-width: 550px;  position: fixed; left: 55%; top: 5%; min-height: 200px; margin-top: -10px; margin-left: -25%; background: #fff; color: #000; display: none; z-index: 1000000;
    -moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
}
.dialog img {
  width: 100%;
}

@media all and (max-width: 640px) {
.dialog {width: 85%; position: fixed; left: 10%; top: 10%; min-height: 200px; margin-top: -10px; margin-left: -5%; background: #fff; color: #000; display: none; z-index: 1000000;
    -moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
}
}


.show .dialog, .show .dialog-background {display: block;}
.dialog .zavri{ background: url(https://skola.prosenice.cz/css/zavri.png); width: 30px; height: 30px; position: absolute; right: -40px; top: 0px; text-indent: -99999px; cursor: pointer; border-radius: 30px}

/*
 tlacitko nahoru
  */
#back-top {
    position: fixed;
    bottom: 15px;
    right: 10px;
    z-index: 10000;
}

#back-top a {
    width: 40px;
    display: block;
    text-align: center;
    font: 11px/100% Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;

    /* spomalování */
    -webkit-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
     -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
}
#back-top a:hover {
    color: #fff;
}

/* obrázek s šikou (tég span) */
#back-top span {
    width: 40px;
    height: 40px;
    display: block;
    margin-bottom: 7px;
    background: url(https://skola.prosenice.cz/css/top.png) no-repeat center center;

    /* zaokrouhlení úhlu */
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;

    /* spomalování */
    -webkit-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
}



/* panel razeni v kategorii */
div.panel {
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  border-top: dotted 3px rgba(0, 0, 0, .1);

}

div.panel .nazev{
      background: #f5f5f5;
    width: 230px;
    display: inline-block;
    height: 44px;
    line-height: 44px;
    padding-left: 10px;
    vertical-align: top;
    border: solid 1px #E3E3E3;
    -moz-border-radius: 15px;
    -webkit-border: 15px;
   border-radius: 15px;
   text-align: left;
   text-transform: uppercase;
       margin-left: 10px;
    margin-right: 10px;
}

div.panel .nazev a{
  margin-right: 5px;
color: #fa1f23;
    height: 30px;
    font-size: 30px;
    line-height: 44px;
        -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    float: right;

}


div.panel .nazev a:hover{
color: #02a64f;

        -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;

}



/*

kosik

 */

#kroky{
  padding-top: 30px;
  padding-bottom: 30px;
}

#kroky a{
  color: #999999;
  display: inline-block;
  text-align: center;
  font-size: 14px;
  width: 50px;
  height: 50px;
  border-radius: 30px;
  border: solid 2px #999999;
}
#kroky a i{
  font-size: 30px;
  line-height: 50px;

}


#kroky a.hotovo{
  color: #02a64f;
  border: solid 2px #02a64f;
}
#kroky a.aktivni{
  color: #e30a1d;
  border: solid 2px #e30a1d;
}




/*
drobeckova navigace
 */

#nadpisy-kat
{


    margin-top: 24px;
    height: 50px;
    line-height: 20px;
    list-style: none;
    z-index: 10;
    text-align: right;
    margin-left: 20px;
    margin-bottom: 0px;
    margin-right: 10px;
    float: right;


}


#nadpisy-kat i
{


	color: #999999;

}


@media all and (max-width: 1024px) {


#nadpisy-kat
{


    margin-top: 40px;
    height: 50px;
    line-height: 20px;
    list-style: none;
    z-index: 10;
    text-align: right;
    margin-left: 20px;
    margin-bottom: 0px;
    margin-right: 10px;
    float: right;


}

}

@media all and (max-width: 640px) {


#nadpisy-kat
{


    margin-top: 40px;
    height: 50px;
    line-height: 20px;
    list-style: none;
    z-index: 10;
    text-align: left;
    margin-left: 20px;
    margin-bottom: 0px;
    margin-right: 0px;
    float: left;


}

}

 #nadpisy-kat li
{
  display: inline-block;
	margin-right: 10px;
    vertical-align: top;

}
 #nadpisy-kat li a
{
	font: lighter 12px "Open Sans", Arial;
	color: #999999;

	padding-left: 20px;

}
 #nadpisy-kat li a.prvni
{
	font: lighter 12px  "Open Sans", Arial;
	color: #999999;
	padding-left: 0px;


}
#nadpisy-kat li a:hover, #nadpisy-kat li a.prvni:hover
{
	text-decoration: none;
}
#nadpisy-kat li a.aktivni
{
	font: bold 12px "Open Sans", Arial;
	text-decoration: none;
	color: #999999;

	padding-left: 20px;
}





/* sluzby na uvodu */


#menu2{
  top: 30%;
  left: 5px;
  z-index: -1000;
  position: fixed;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
}

#menu2.ukaz{
  top: 30%;
  left: 5px;
  position: fixed;
  z-index: 20;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;


}





#menu2 li{
  position: relative;
  height: 40px;
  min-width: 40px;
  margin-bottom: 1px;


}

#menu2 li.tlac1{
  position: relative;
  z-index: 4;

  background-size: 30px;
}



#menu2 li a{
    position: relative;
   font: lighter 13px "Open Sans", Arial;
  color: rgba(255,255,255, 1);
  height: 40px;
  line-height: 40px;
  display: block;
     -moz-text-shadow: -1px 1px 1px rgba(0,0,0,0.2);
    -webkit-text-shadow: -1px 1px 1px rgba(0,0,0,0.2);
    text-shadow: -1px 1px 1px rgba(0,0,0,0.2);


}
#menu2 li.tlac span{


  background-color: #000000
}




#menu2 li span{
  text-align: left;
  position: absolute;
  height: 40px;
  width: 120px;
  left: -100px;

     -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;

}
#menu2 li span::after{
  text-align: left;
  position: absolute;
  height: 12px;
  width: 12px;
  left: -5px;
  top: 15px;

   content: "";
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
  background: #000000


}
#menu2 li:hover span{

  height: 40px;

  left: 40px;
  padding-left: 10px;
     -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
    background: rgba(0, 0, 0, 1)

}
#menu2 li:hover{
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    left: 0px;
}



 @media all and (max-width: 700px) {


#menu2.ukaz{
  top: 3px;
  left: 0px;
  position: fixed;
  width: 100%;
  z-index: 20;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;


}

#menu2 li{
  position: relative;
  height: 40px;
  min-width: 40px;
  margin-bottom: 1px;
  display: inline-block;

}
#menu2 li.tlac{

  background-size: 40px;

}


#menu2 li:hover span, #menu2 li span{


    display: none;

}



}



@keyframes moveFromTop {
  from {
    -moz-transform: translateY(-10%);
    -ms-transform: translateY(-10%);
    -o-transform: translateY(-10%);
    -webkit-transform: translateY(-10%);
    transform: translateY(-10%); }

  to {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0); } }
@-webkit-keyframes preloader_rotate {
  from {
    transform: rotate(0deg); }

  to {
    transform: rotate(360deg); } }
@-moz-keyframes preloader_rotate {
  from {
    transform: rotate(0deg); }

  to {
    transform: rotate(360deg); } }
@-o-keyframes preloader_rotate {
  from {
    transform: rotate(0deg); }

  to {
    transform: rotate(360deg); } }
@keyframes preloader_rotate {
  from {
    transform: rotate(0deg); }

  to {
    transform: rotate(360deg); } }
#page_preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
   background-color: #f5f5f5; }
  #page_preloader.fade .preloader_img {
    -moz-animation: scaleAnimTo 0.3s ease;
    -webkit-animation: scaleAnimTo 0.3s ease;
    animation: scaleAnimTo 0.3s ease; }
  #page_preloader .preloader_img {
    z-index: 3;
    display: block;
    width: 220px;
    height: 220px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -moz-animation: scaleAnim 0.3s ease;
    -webkit-animation: scaleAnim 0.3s ease;
    animation: scaleAnim 0.3s ease; }
    @media (min-width: 768px) {
      #page_preloader .preloader_img {
        -moz-box-shadow: 0 10px 40px rgba(53, 57, 64, 0.3);
        -webkit-box-shadow: 0 10px 40px rgba(53, 57, 64, 0.3);
        box-shadow: 0 10px 40px rgba(53, 57, 64, 0.3); } }
    #page_preloader .preloader_img .img_end {
      -moz-transition: 0.3s;
      -o-transition: 0.3s;
      -webkit-transition: 0.3s;
      transition: 0.3s;
      position: absolute;
      left: 0px;
      bottom: 0;
      top: 0;
      right: 0;
     /* background: #f7f7f7;   */
       background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #f9f9f9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#f9f9f9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#f9f9f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */
      z-index: -1;
    border: 5px solid #ffffff;
    border-bottom-color: #d90387;
    border-right-color: #f86a17;
    border-top-color: #eabe0d;
    border-left-color: #65b95f;

      border-radius: 100%;
      -moz-transition: 0.3s;
      -o-transition: 0.3s;
      -webkit-transition: 0.3s;
      transition: 0.3s;
      -moz-animation: preloader_rotate 1s steps(100) infinite;
      -webkit-animation: preloader_rotate 1s steps(100) infinite;
      animation: preloader_rotate 1s steps(100) infinite;
      z-index: 3; }
    #page_preloader .preloader_img img {
      max-width: 86%;
      height: auto;
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      z-index: 5; }