body {
	font-size:100%;
}

/* część podstawowa menu */

/* wygląd głównego elementu - ol */
ol {
  list-style-type:none;
  padding:0em;
  margin:0em;
  background-color:#36AAB9;
  font-size:0.9375em;
  height:3.25em;
  line-height:2em;
  text-align:left;
}

/* wygląd wszystkich elementów - a - znajdujących się w elemencie - ol */
ol a {
  display:block;
  text-decoration:none;
  color:#FFFF;
  padding:0em 0.3125em;
}

/* wygląd elementów - li - wszystkich dzieci elementu - ol */
ol > li {
  float:left;
  width:7.5em;
  margin-left:0.0625em;
  background-color:#36AAB9;
  height:3.25em;
}

/* wygląd elementu - li - pierwszego dziecka elementu - ol */
ol > li:first-child {
  margin-left:0em;
}

ol > li:nth-child(2){
  width:7.5em;
}

ol > li:nth-child(3){
  width:7.5em;
}

/* wygląd elementów - li - wszystkich dzieci elementu - ol - po najechaniu kursorem myszki na element - li */
ol > li:hover {
  background-color:#24737D;
}

/* wygląd elementu - a - dziecka elementu - li - będącego dzieckiem elementu - ol - po najechaniu kursorem myszki na element - li */
ol > li:hover > a {
  color:#FFFF;
}

/* wygląd elementu - ul - dziecka elementu - li - będącego dzieckiem elementu - ol - po najechaniu kursorem myszki na element - li */
ol > li:hover > ul {
  display:block;
}

/* część rozwijana menu */
/* wygląd głównych rozwijanych elementów - ul */
ol > li > ul {
  display:none;
  list-style-type:none;
  padding:0em;
  margin:0em;
  width:10em;
}

/* wygląd elementu - li - w części rozwijanej */
ol > li > ul > li {
  position:relative;
  background-color:#36AAB9;
}

/* wygląd elementu - a - w części rozwijanej */
ol > li > ul > li > a {
  border-top:0.0625em solid #FFF;
}

/* wygląd elementu - li - w części rozwijanej, po najechaniu kursorem myszki na dany element - li */
ol > li > ul > li:hover {
  background-color:#24737D;
}

/* wygląd elementu - a - w części rozwijanej, po najechaniu kursorem myszki na element - li */
ol > li > ul > li:hover > a {
  color:#FFFF;
}

/* parametry stałych elementów strony */
#menu {
  position:absolute;
  left:2%;
  top:12%;
  width:96%;
  z-index:2;
}

#main {
  position:absolute;
  left:3%;
  top:19%;
  width:95%;
  height:77%;
  overflow:auto;
  z-index:1;
}

#copyrightsBanner {
  position:absolute;
  left:2%;
  bottom:0%;
  width:96%;
  color:white;
  z-index:1;
}

#fbLogo {
  position:absolute;
  right:2%;
  top:0%;
}

#menuIcons {
  font-size:2.5em;
}

#pdfLoad {
  width:100%;
  height:86%;
  border:none;
}

#mainTitle {
  font-size:1.875em;
}

#mainText {
  font-size:1.5625em;
}

/* przeskalowanie tekstu strony do wersji mobilnej */
@media only screen and (max-width: 700px) {
  #mainTitle {
    font-size:1.5625em;
  }
}

@media only screen and (max-width: 700px) {
  #mainText {
    font-size:1.25em;
  }
}

/* ustawienia bannera z informacjami o prawach autorskich (musi być w css żeby dopasowywało się przy zoomowaniu)*/
#copyrights {
  padding:0em 1em;
  margin:0em;
  background-color:#36AAB9;
  font-size:1.2em;
  height:2em;
  line-height:2em;
  text-align:center;
}

/* ustawienia bannera z informacjami o prawach autorskich żeby dopasowywały się do wersji mobilnej*/
@media only screen and (max-width: 700px) {
  #copyrights {
    padding:0em 1em;
  	margin:0em;
  	background-color:#36AAB9;
  	font-size:0.5em;
  	height:2em;
  	line-height:2em;
  	text-align:center;
  }
}

/* ustawienia wszystkich logo nad menu (musi to odbywać się w css żeby dało się skalować do wersji mobilnej)*/
#logopk {
  position:absolute;
  top:0%;
  left:2%;
  width:6%;
}

#logokpe {
  position:absolute;
  top:0%;
  left:40%;
  width:18%;
}

#logoweii {
  position:absolute;
  top:0%;
  right:2%;
  width:4.5%;
}

/* ustawienie szerokości wszystkich logo nad menu do wersji mobilnej*/
@media only screen and (max-width: 700px) {
  #logopk {
  	position:absolute;
  	top:0%;
  	left:1.5%;
    width:20%;
  }
}

@media only screen and (max-width: 700px) {
  #logokpe {
    position:absolute;
  	top:1%;
  	left:23%;
    width:55%;
  }
}

@media only screen and (max-width: 700px) {
  #logoweii {
    position:absolute;
  	top:0%;
  	right:2%;
    width:16.5%;
  }
}


/* ustawienia galerii zdjęć*/
div.gallery {
  border: 0.0625em solid #ccc;
}

div.gallery:hover {
  border: 0.0625em solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 0.9375em;
  text-align: center;
}

* {
  box-sizing: border-box;
}

.responsive {
  padding: 0em 0.375em;
  float: left;
  width: 24.99999%;
}

@media only screen and (max-width: 700px) {
  .responsive {
    width: 49.99999%;
    margin: 0.375em 0em;
  }
}

@media only screen and (max-width: 500px) {
  .responsive {
    width: 100%;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}