@media screen and (max-width: 768px) {

    body{
        margin: 0;
        padding: 0;
    }

    #wrapper{
        margin: 0;
        padding: 0;
    }

    #sidebar,
    #right {
        float: none;
        width: 100%;
        border-left: none;
        font-size: 1.2em;
        line-height: 1.2rem;
    }

    #right h1 {
        font-size: 1.6em;
        line-height: 3rem; 
    }

    #right p {
        font-size: 0.9em;
        line-height: 2rem; 
    }


    #footer {
        font-size: 1.2em;
        padding: 15px 0;  
        height: auto;
        background-image: none;
        background-color: #4d79bc;
    }

    #footer p, #footer a {
        font-size: 0.9em;
        line-height: 1.2em;
        padding: 0;
        margin: 0;
        display: block;
    }

    #top {
        background-image: none;
        background-color: #4d79bc;
        height: auto;
        padding-top: 15px;
        padding-bottom: 15px;
        margin: 0;
        text-align: center; 
        padding: 20px; 
    }

    .page-home h2{
        text-align: center; 
        padding: 5px 0; 
        font-size: 1.9em;
        line-height: 1.5em;
    }

    .page-home h3{
        text-align: center; 
        padding: 10px; 
        font-size: 1.5em;
        line-height: 1.5em;
    }

    #top h1, #top h2 {
        margin: 0;
        font-size: 1.2em;
        line-height: 1.4em;
    }

    #dialog-nahraj-text{
        display: none;
    }

    #predlohariadok, #predlohariadok2, #predlohariadok3, #nacvikriadok, #nacvikriadok input {
        width: 95%; 
        margin: 5px auto;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 95%;
        height: auto;
    }

    /* #panelreklamanacvik {
        width: 90%;
        margin: 0;
        padding: 0;
    } */

    #predlohariadok3{
        display: none;
    }

    .fb_frame {
        width: 95%;
        max-width: 95%;
        margin: 5px auto;
    }

    .mobile_hide {
        display: none;
    }

    .blockcontent {
        text-align: center;
        font-size: 1rem;
    }
    .blockheader {
        text-align: center;
    }
    .flagIconLink img{
        width: 50px;
    }
    .sidetags, .sidemail, .sidelinks{
        display: none;
    }
    
    .button-container {
        flex-direction: column; /* Odkazy sa zoraďujú vertikálne */
        margin-left: 0; /* Odstrániť margin na menších obrazovkách */
        align-items: center; /* Vycentrovanie obsahu na stred */
        width: 100%; /* Zabezpečí, že container zaberie celú šírku */
    }

    #infomobile {
        display: block;
    }

    #hamburger {
        display: block;
    }

    #menu ul {
        display: none;
        flex-direction: column;
        background: #e6e2d1; /* podfarbenie pozadia */
        position: absolute;
        top: 60px;
        left: 0;               /* zľava */
        right: 0;              /* sprava – plná šírka */
        width: 100%;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        padding: 0;
        z-index: 998;
    }

    #menu ul li {
        margin: 0;
        border-bottom: 1px solid #aea06b; /* oddelenie riadkov */
    }

    #menu ul li:last-child {
        border-bottom: none;
    }

    #menu ul li a {
        padding: 15px 20px;
        display: block;
        color: #333;
        background-color: #e6e2d1;
        width: 100%;
    }

    #menu ul.show {
        display: flex;
    }

    #menu ul li a:hover {
        background-color: #f0f0f0;
    }

    #footer {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        font-size: 18px;
        gap: 20px;
      }
    
      #footer p {
        width: 100%;
        margin-bottom: 10px;
        white-space: nowrap;
      }

      #footer p {
        white-space: normal; /* umožní zalomenie */
        text-align: center;
        word-break: keep-all; /* zachová slová pohromade */
      }
    
      #footer p a {
        white-space: nowrap; /* zabráni zalomeniu samotného odkazu */
      }


      #footer .footer-links {
        flex-direction: column;
        gap: 10px;
        width: 100%;
      }
    
      #footer .footer-links li {
        width: 100%;
      }
    
      #footer .footer-links li a {
        display: block;
        width: 100%;
      }

}
