/* Nove vytvorena sablona: */

/* Sticky up-arrow = Floating up-arrow: */
div.sticky {
  position: -webkit-sticky;  /* for Safari */
  position: sticky;
/* top: 0;     THIS WAS HERE ORIGINALLY, WORKS WELL */
  bottom: 52px;  /* Uz CHODI: Pro tu SIPKU 50x50px , TOP or BOTTOM REQUIRED */
  padding: 1px;
  /* align-self: flex-end;    DOES NOT WORK */
  z-index: 3000;  /* Ja: Added: Keep above ALL other elements */
}


/*-- ========== --*/
/* ZACATEK - Pro vysouvaci pochvalne texty pres fotky: */

/* Image Panel or Container - Ja: Fotky: 373x253px */
/* We used 400x350px image. You can use any dimensions and replace the same in CSS
   just by replacing all occurrences of 400px/350px with your image’s HxW. */

.panel {
width: 373px;
height: 253px;
overflow: hidden;
margin: 5px;
border: 1px solid #000;
box-shadow: 0px 0px 15px 0px #666, 0px 5px 15px 0px #000;
margin-bottom: 20px;
}

/* Image Overlay */
.overlaying {
width: 100%;
height: 100%;
background: rgba(0,0,0,0.7);
position: relative;
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
padding: 1em;
color: #fff;
overflow: hidden;
text-shadow: 1px 1px 5px #673AB7;
}

/* Overlay Heading or Title */
.overlaying .heading{
font-size: 14px;
/* font-style: italic; */   /* PUVODNE BYLO: Italic */
text-align: left;
color: #ffffff;
padding: 10px;
}

/* Overlay Description */
.panel .overlaying .desc {
line-height: 18px;
position: relative;
font-size: 12px;  /* Pismo pochvalneho textu pres fotografii. (Puvodne 14px) */
overflow: hidden;
}

/* Overlay Button */
.overlaying .btn {
padding: 10px;
margin: 10px;
background: #CCFFCC;
float: right;
border-radius: 3px;
}

.btn a {
color: #333333;
text-decoration: none;
}

/* Overlay Styles - Ensure to use panel class dimensions */
.left {
left: -373px;
}
.right {
right: -373px;
}
.top {
top: -253px;
}
.bottom {
bottom: -253px;
}
.top-left {
top: -253px;
left: -373px;
}
.top-right {
top: -253px;
right: -373px;
}
.bottom-left {
bottom: -253px;
left: -373px;
}
.bottom-right {
bottom: -253px;
right: -373px;
}

/* Overlay Hover Styles */
.panel:hover .left {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
left: 0px;
}
.panel:hover .right {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
right: 0px;
}
.panel:hover .top {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
top: 0px;
}
.panel:hover .bottom {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
bottom: 0px;
}
.panel:hover .top-left {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
top: 0px;
left: 0px;
}
.panel:hover .top-right {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
top: 0px;
right: 0px;
}
.panel:hover .bottom-left {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
bottom: 0px;
left: 0px;
}
.panel:hover .bottom-right {
-webkit-transition: all 0.4s cubic-bezier(.99,.99,0,.61);
bottom: 0px;
right: 0px;
}

/* KONEC - Pro vysouvaci pochvalne texty pres fotky: */