/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/css.css to edit this template
*/
/* 
    Created on : 14. 4. 2024, 21:38:02
    Author     : netprogres
*/

.photobank-page {
    text-align: center;
    max-width: 1000px;
    
    margin: 0px auto 50px auto;
    
}


.photobank-page h1 {
    margin-top: 0px;
}


.category-buttons button {
    padding: 10px 20px;
    margin: 5px;
    border: none;
    background-color: var(--ast-global-color-0);
    color: white;
    cursor: pointer;
}



#category-buttons button.focus,
#category-buttons button.hover, 
#category-buttons button.active {
    background-color: var(--ast-global-color-1);
    color: #000000;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); 
}

.photo-grid {
    margin-top: 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}


/*.photo-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}*/


/*.photo-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; 
}

@media (max-width: 544px){
    .photo-grid div {
        width: 100%; 
        margin: 0px; 
        height: auto;   
    }
}

@media (min-width: 545px) AND (max-width: 800px){
    .photo-grid div {
        width: 48%; 
        margin: 1%; 
        height: auto;   
    }
}


@media (min-width: 801px) AND (max-width: 1000px){
    .photo-grid div {
        width: 31%; 
        margin: 1%; 
        height: auto;   
    }
}

@media (min-width: 1001px){
    .photo-grid div {
        width: 23%; 
        margin: 1%; 
        height: auto;   
    }
}*/




.pdf-nahled{
        padding: 0.6em;
}

.pdf-nahled:hover,
.pdf-nahled:focus {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}




.pagination {
    margin-top: 20px;
}

.pagination-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    background-color: #ccc;
    border-radius: 50%;
    cursor: pointer;
}

.pagination-dot.active {
    background-color: #333;
}

.navigation-arrows button {
    padding: 10px 20px;
    margin: 5px;
    border: none;
    background-color: #333;
    color: white;
    cursor: pointer;
}



.photo-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px; /* Můžete upravit mezeru mezi sloupci podle potřeby */
}




   .video-entry {
    display: flex;
    align-items: flex-start; /* Zarovnání obsahu vlevo */
   
/*    width: 47% ;    */
    height: auto;
    text-align: left;
    
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
    
}

.video-thumbnail {
    margin-right: 0.3rem; /* Odstup mezi náhledovým obrázkem a obsahem */
}

.video-content {
    flex: 1; /* Obsah se bude roztahovat až do konce řádku */
        
        padding: 0.3rem 0.3rem 0rem 0.3rem ;
        
}

.video-content h2 {
    margin-top: 0; /* Odstranění výchozího odsazení u názvu */
    font-size: 1.2rem;
    margin-bottom: 0.6em;
}

.video-content p {
    margin-bottom: 0; /* Odstranění výchozího odsazení u perexu */
}

div.video-entry img{
    max-width: 125px;
}



@media (max-width: 1000px){
    div.video-entry img {
         max-width: 160px;
    }
    
    .video-content h2 {
    margin-top: 0;
    font-size: 1.1rem;
    margin-bottom: 0.6em;
    }
    
}


@media (max-width: 768px){
    
    .photo-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
    }
    
    
    div.video-entry img {
         max-width: 160px;
    }
    
    .video-content h2 {
    margin-top: 0;
    font-size: 1.1rem;
    margin-bottom: 0.6em;
    }
    
    
        .photobank-page{
        margin-bottom: 0px;
    }
    
    
}



@media (max-width: 400px){
    
    
    
    
    div.video-entry img {
         max-width: 150px;
    }
    
    .video-content h2 {
    margin-top: 0;
    font-size: 1rem;
    margin-bottom: 0.3em;
    }
    
}


.post-2713 #hp-event-list.photo-grid.events,
.post-49884 #hp-event-list.photo-grid.events{
        grid-template-columns: repeat(1, 1fr);
}


body.page-id-2713 #primary.content-area.primary{
    padding-top: 50px;
    padding-bottom: 50px;
}


#hp-event-list.photo-grid.events{
        margin-top: 0px;
}