body{font-family:arial;background-color:#fff; color:#000;padding:0; margin:0; font-size:12pt; margin-top:-20px}
html {margin:0; padding:0}
#hledani {float:left; width:100%;}
#logo{float:left; width:100%; height:65px; font-weight:bold; box-sizing:border-box; padding:10px 0px; font-size:18pt;}
#logo img{float:left;}
#logo span {display:none;}
.obal{margin:0 auto; max-width:1000px; padding:0 15px; }

article{float:left; width:100%}
#uvod {background-image:url('zakynthos.webp'); padding:20px 0;background-position:top right; background-repeat:no-repeat;}
.plaza {position:absolute; right:-100px; top:30px; transition: .8s ease; z-index:100}
.kierunek {position:absolute; left:0px; top:0px; transition:  .8s ease; z-index:10}
#uvod:hover .plaza {right:-150px; top:-20px;}
#uvod:hover .kierunek {top:50px;}
header {float:left; width:100%; background-color:#0056bc; }
header img {margin:30px 0; width:100%}
header p {color:#fff}
h1{margin:0; padding:10px 0; background: #FFFFFF; font-weight:bold; font-size:25pt; letter-spacing:-1px;
background: linear-gradient(to right, #FFFFFF 0%, #8db3e1 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
header h2 {color:#fff}
.leva {float:left; width:60%; padding:20px 0;}
.prava {float:left; width:40%; padding:20px 0 20px 20px; box-sizing:border-box;}

#slm {position:fixed;z-index:10000; bottom:0; left:0; width:100%; text-align:center; background-color:#fff; padding:10px; box-sizing:border-box;box-shadow: 0 0 4rem rgba(0, 27, 99, 0.11);}
	#slm a {float:left; width:100%;background-color:#ffd024; color:#000;font-size:14pt; border-radius:8px; padding:15px 0;text-decoration:none;   box-shadow: 0 0 0 0 rgba(201, 201, 201, 0.8);-webkit-animation: pulsing 2.0s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulsing 2.0s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulsing 2.0s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulsing 2.0s infinite cubic-bezier(0.66, 0, 0, 1);
  transition: all 300ms ease-in-out;}
	#slm a:hover {background-color:#05a8e6; color:#fff; -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
		animation: none}
#slm .sirka {padding:0;}
a{color:#000;}
.pulsingButton{ text-align:center; white-space:nowrap; display:block; margin:0; padding:12px; box-shadow:0 0 0 0 rgba(210,237,225,1); border-radius:3px; background-color:#ffd024; -webkit-animation:pulsing 2.0s infinite cubic-bezier(0.66,0,0,1); -moz-animation:pulsing 2.0s infinite cubic-bezier(0.66,0,0,1); -ms-animation:pulsing 2.0s infinite cubic-bezier(0.66,0,0,1); animation:pulsing 2.0s infinite cubic-bezier(0.66,0,0,1); font-size:16px; font-weight:900; text-decoration:none !important; color:#000; transition:all 300ms ease-in-out; }
a.pulsingButton:hover{-webkit-animation:none; -moz-animation:none; -ms-animation:none; animation:none; color:#ffffff; background-color:#1ca46b; }
/* Animation */
@-webkit-keyframes pulsing{to{box-shadow:0 0 0 20px rgba(210,237,225,0); }
 }
@-moz-keyframes pulsing{to{box-shadow:0 0 0 20px rgba(210,237,225,0); }
 }
@-ms-keyframes pulsing{to{box-shadow:0 0 0 20px rgba(210,237,225,0); }
 }
@keyframes pulsing{to{box-shadow:0 0 0 20px rgba(210,237,225,0); }
 }

.grid {columns: 15rem;gap: 0.7rem;counter-reset: grid;}
	.grid img {
  width: calc(100% + 22px);
  margin-top: -10px;
  margin-left: -11px;
		-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
		height:auto;
}
	
.item figure img {width:auto;}
.item + .item {
  margin-top: 1rem;
}

	
.item2 {
  break-inside: avoid;
  background: #fff;
  padding:10px;border:1px solid #dedede; font-size:11pt;-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; margin-bottom:10px;
}
	.item2 figure{text-align:center;}
	.item2 figure img {width:auto;}
	
.item::before {
  counter-increment: grid;
}

.item:nth-child(3n) {
  background: #fff;
}

.item:nth-child(3n - 1) {
  background: #fff;
} 
.full {width:100% !important}
.mobil {display:none;}
.sirka{float:left; width:100%; padding-bottom:20px;}
#faq{float:left; width:100%; padding:20px 0;} 
nav{float:left; width:100%; }
nav ul{list-style:none; margin:0; padding:0}
nav ul li a{float:left; margin:10px 10px 10px 0; padding:10px; font-weight:bold; background-color:#fff;color:rgb(0,86,188); text-decoration:none; border-radius:20px; border:1px solid #2fb383} 
details{background-color:#303030; color:#fff; }
summary{padding:.5em 1.3rem; list-style:none; display:flex; justify-content:space-between; transition:height 1s ease; }
summary h2{padding:5px 0; margin:0; font-size:12pt;}
summary::-webkit-details-marker{display:none; }
summary:after{content:"\002B"; }
details[open] summary{border-bottom:1px solid #aaa; margin-bottom:.5em; }
details[open] summary:after{content:"\00D7"; }
details[open] div{padding:.5em 1.3em; }
@media screen and (max-width:1239px){#prava{right:20px;}
 }
@media screen and (max-width:999px){#leva,#prava{width:100%; padding:0}
h1 {font-size:22pt;}
#prava{position:relative; left:0; float:left; width:100%; max-width:100%}
.foto {width:100%; height:auto;}
.leva, .prava {position:relative;float:left; width:100%; padding:0}
#uvod {padding:0; background-position:left bottom;}
#uvod img {width:70%; height:auto;}
.plaza {right:0px;}
.mobil {display:block;}
.pc {display:none;}
 }
  
