/*
Theme Name: mama aktuality
Theme URI: 
Author: hybs
Author URI:
Description: hybs
Version: 

*/
    .return {
        z-index: 999;
        position: relative;
        background-color: #eee;
        color: black;
        text-decoration: none;
        font-size: 150%;
        padding: 1vh;
        border-radius: 12.5%;
        border: solid;
        border-width:1px;
        border-color: #bbb;
        margin:29px;
    }
    
    
   .post_image {
      object-fit: cover;
      clip-path: inset(10% 0 10% 0);
      cursor: pointer;
      transition: filter 0.3s ease;
     width: 200px;
    height: 180px;
    padding-left: 0.5vw;
    }

    .post_image:hover {
      filter: brightness(70%);
    }
    
    #facebook{
        width:6vw;
        fill: black;
  stroke: white;
  position: absolute;
  right: 2vw;
  top: 5vh;
    }
    
    .post h2 a {
        color: black;
        font-weight:bold;
        text-decoration:none;
    }
    
    ul#top_list {
        color:white;
        position: relative;
            left: 43vw;
            top: 1vh;
    }
    
    body {
        height: 100%;
        margin: 0vw;
        padding: 0vw;
        font-family: Arial, sans-serif;
        background-color: white;
        font-size: 1vw;
    }
    
    #top {
        padding: 1.5vw; 
    	height: 25vw;
        font-size: 1vw;
    	display: flex;
        /*width: 97%;*/
        background-image: url(images/wide.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center -30vh;
    }
    
    
    
    .open {
        color: white;
        list-style-type: none;
        display: inline-block;
        list-style: none;
        margin: 0;
        padding: 0;
      }
    
    .open a {
        color: black;
        text-decoration: none;
        padding-left: 1vw;
        font-size: 2vw;
        transition: color 0.3s ease;
        font-weight: bolder;
        /*text-shadow: -0.5px -0.5px 0 #fff, 0.5px -0.5px 0 #fff, -0.5px 0.5px 0 #fff, 0.5px 0.5px 0 #fff;*/
    }
    
    .open a:hover {
        text-decoration: underline black 2px;
        text-underline-offset: 2.5px;
    }
    
    
    #wave {
        position: absolute;
        left: 0;
        top: 18.5vw;
    }
    
    
    
    #bottom {
        background-color: #5a8ad2;
        color: #fff;
        padding: 4vw; 
        text-align: center;
        position: relative;
        bottom: 0;
        width: 91.75%;
        font-size: 1vw;
        border-color: black;
        border-width: 1px;
        border-style: solid;
        border-bottom: 1px;
        margin: 0;
        height: 4vw;
    }
    
    #jedna {
        display: flex;
        justify-content: center;
    }
    
    .jedna-jedna {
        text-align: center; /* Center the text within jedna-jedna */
        max-width: 33.33vw; /* Optional: Set a maximum width for better readability */
        margin: 0 auto; /* Optional: Center jedna-jedna within the .jedna container */
        width: 33%;
        display: inline-block;
        padding-top: 25px;
        padding-bottom: 50px;
    }
    
    #jedna div a {
        color:black;
        text-decoration: none;
    }
    
    .icon {
        width: 10vw;
        aspect-ratio: 1 / 1; 
        
    }
    #beach {
        border-radius: 50%;
    }
    
   #dva {
        width: 100%;
        background-color: #c9a78c;
        display: flex;
    }
    
    #dva-text {
        width: 30%;
        position: relative;
        height: 100%;
        left: 9vw;
        padding-top: 5vh;
padding-bottom: 5vh;
    }
    #dva-text p {
        position: relative;
        font-size: 1vw;
    }
    
    #dva-image img {
        position: relative;
    }
    #dva-image {
        width: 30%;
        height: 100%;
        position: absolute;
        left: 30vw;
    }
    #img-jedna{
        top: 7.5%;
        left: 141%;
        z-index: 0;
        height: 30vh;
    }
    #img-dva{
        top: -11.5%;
        height: 52vh;
        left: 80%;
    }
    
    #img-tri{
        top: -41.5%;
        left: 125%;
        z-index: 2;
        height: 39vh;
    }
    
    #tri {
        height: 30vw;
        width: 100%;
        background-color: white;
        display: flex;
        justify-content: center;
        align-content: center;
        padding-top: 2vh;
        padding-bottom: 5vh;
        position: relative;
    }
    #tri h1{position:absolute;}
    .entry {
        font-size: 1vw;
    }
    
    .post {
        height: 75%;
        width: 20%;
        border: 1px;
        border-style: solid;
        border-radius: 1%;
        border-color: black;
        position: relative;
        top: 18%;
        margin: 5px;
        text-align: center;
        word-wrap: break-word;
        background-color:#c9a78c5c;
        left: -0.65vw;
    }
    
    .arrows {
        font-size: 18px;
        color: gray; 
        text-decoration: none;
        display: block;
        margin: 0 auto;
        text-align: center; 
        -webkit-user-select: none; 
        -moz-user-select: none; 
        -ms-user-select: none;
        user-select: none;
    }
    
    .container{
            display: flex;
            justify-content: center;
            align-items: center;
            padding-left: 10px;
            padding-right: 10px;
    }
    
    .full-post {
        height: 75%;
        width: 75%;
        position: relative;
        top: 13%;
        left: 10%;
        margin: 5px;
        min-height: 50vw;
        margin-top: 4vh;
    }
    
    .full-post h2 {
        text-align: center;
    }
    .datum {
        text-align: center;
    }
    
#booking_form {
    position: relative;
          left: 5vw;
          max-width: 85vw;
}
#gallery_content{
    position: relative;
        top: 13%;
        left: 10%;
        width: 80%;
        display: flex;
    flex-wrap: wrap;
        
}
.media-item{
    flex: 0 0 auto; /* This makes sure the items do not grow or shrink */
    margin-right: 10px; /* Adjust as needed */
}

#trhy_content {
    width: 50%;
  position: relative;
  top: 3.5vh;
  left: 25vw;
  padding-bottom: 2vh;
}

#cenik_list li{
    position:relative;
        left:4vw;
}
#cenik_list p{
    position:relative;
        left:2vw;
}

.trip_post{
    display: flex;
  align-items: center;
  border: 1px solid #66bb6a;
  background-color: #f1f8e9;
  padding: 20px;
  margin: 20px auto;
  max-width: 95vw;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Add a subtle shadow */
  border-radius: 4px;
}


.trip_post img {
  border-radius: 5px;
}

.trip_post h2 {
  font-size: 3vh;
  margin-top: 10px;
  margin-bottom: 5px;
}

.trip_post h2 a {
  color: #333; 
  text-decoration: none;
}

.trip_post h2 a:hover {
  color: #555;
}

.trip_post .entry {
  margin-top: 10px;
}

.trip_post p, .trip_post .entry {
  font-size: 14px;
  line-height: 1.5;
  color: #666;
}
.post-content {
    padding-left: 1vw;
    padding-bottom: 3vw;
}






#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 999;
  display: none;
}

#overlay img {
  max-width: 90%;
  max-height: 90%;
  margin: auto;
  display: block;
}

#closeBtn {
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
  color: white;
  font-size: 24px;
}

#prevBtn, #nextBtn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  color: white;
  font-size: 24px;
    -webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none;
    user-select: none;
}

#prevBtn {
  left: 20px;
}

#nextBtn {
  right: 20px;
}


#scroll {
  text-align: center;
  background-color: #eee;
  overflow: auto;
  white-space: nowrap;
  padding: 10px;
  width: 75%;
  position: relative;
  left: 10%;
}

#more {
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
    color: white;
    background-color: #a67258; /* A color that complements #c9a78c */
    border-radius: 5px;
    font-size: 16px;
    transition: background-color 0.3s;
    margin-bottom: 25px;
    position: relative;
left: 47%;
order: -1;
max-height: 1.75vh;
position: absolute;
  bottom: 0;
}

#more:hover {
    background-color: #895d48; /* Slightly darker shade for hover effect */
}


.post a img {
    max-width:80%;
    max-height:50%;
    padding-top: 10px;
}

.post a {
    color:black;
    text-decoration:none;
}

#logo {
    height: 33%;
  position: relative;
  left: 55vw;
}

@media only screen and (max-width: 1024px) {
    .return{
        position: absolute;
        left: 0;
    }
    #facebook{
        display:none;
    }
    #jedna,.jedna-jedna,#tri{
        display: block;
    }
    body{
        font-size:15px;
    }
    .jedna-jedna{
        height: 100%;
        width:100%;
        max-width:100%;
    }
    .icon{
        width: 25%;
    }
    #wave{
        bottom: -39px;
    }
    #top{
        background-position: center -14vh;
        z-index: 5;
        position:relative;
    }
    #content{
        z-index: 1;
    }
    
    .entry {
        font-size:15px;
    }
    .post{
        width: 75%;
        height: 100%;
        padding-bottom: 50px;
    }
    #tri{
        height: 85vw;
    }

    ul#top_list{
        position:absolute;
        left: -10px;
    }
    .open a {
        color: white;
        font-size: 17px;
        text-shadow: -0.5px -0.5px 0 #000, 0.5px -0.5px 0 #000, -0.5px 0.5px 0 #000, 0.5px 0.5px 0 #000;
    }
    #dva {
        display:block;
        
        margin-top: 4vh;
        background-color: #c9a78c;
    }
   #dva-text {
        width: 90%;
        left: 0;
        position: relative;
        left: 5%;
    }
    #dva-text p{
        font-size: 2.5vh;
        text-align: left;
    }
    #tri h1 {
        position:relative;
        left: 27%;
        width: 50%;
    }
    .post{left: 12.5%;top:0;}
    .container{
        width: 18px;
        position: relative;
            left: 45%;
        transform: rotate(90deg);
    }
    #dva-image{
        width:100%;
        display: none;
    }
    #img-jedna{
        top: 1vh;
        left: 45.5vw;
        z-index: 3;
        height: 18.5vh;
    }
    #img-dva{
        top: 21.5vw;
        height: 25vh;
        left: -52vw;
    }
    #img-tri{
        top: -4vh;
        left: 21vw;margin-bottom: 2vh;
        height: 18.5vh;
    }
    .full-post {
        height: 75%;
        width: 90%;
        position: relative;
        top: 0%;
        left: 5%;
        margin: 5px;
        min-height: 50vw;
        margin-top: 4vh;
    }
    #scroll {
      text-align: center;
      background-color: #eee;
      overflow: auto;
      white-space: nowrap;
      padding: 10px;
      width: 100%;
      position: relative;  
      left: 0;
      margin-bottom: 2vh;
    }

    #overlay {
      position: fixed;
      top: 0;
      left: -11px;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.9);
      z-index: 999;
      display: none;
    }
    #overlay img {
      max-width: 80%;
      max-height: 80%;
      margin: auto;
      display: block;
    }
    .arrows {
        display: none;
    }
    #more{
        left: 42%;
        top: 1vh;
        position:relative;
    }
    #logo {
        position:absolute;
        filter:invert(1);
        height: 55%;
left: 40vw;
    }
    
}