/* CSS za oblikovanje in odzivnost */
        body {
            font-family: sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
            font-family: sans-serif;
            max-width: 1200px;
            line-height: 1.6;
        }

        h1 {
            text-align: center;
            margin-top: 40px;
			font-size: clamp(1.1rem, 1.3vw, 1.3rem);
        }

        h2 {
            border-top: 1px solid #ccc;
            padding-top: 20px;
			text-align: center;
			font-size: clamp(1rem, 1.2vw, 1.2rem);
        }

        p {
            text-align: justify;
			text-indent: 20px;
            margin-top: 20px;
			font-size: clamp(.9rem, 1.0vw, 1.0rem);
        }
        
        .img-large {
            display: block;
            max-width: 100%;
            height: auto;
            margin: 20px auto;
        }

        .img-small {
            display: block;
            max-width: 60%;
            height: auto;
            margin: 20px auto;
        }

        .summary {
            text-align: right;
            font-style: italic;
            margin-top: 40px;
        }

        .center-text {
            text-align: center;
        }

        /* Glavna postavitev s tremi stolpci */
        .container {
            display: flex;
            min-height: 100vh;
        }

        /* --- Desktop postavitev (trije stolpci) --- */
@media (min-width: 768px) {
    .container {
        flex-direction: row;
        max-width: 800px; /* Določa maksimalno širino vsebine */
        margin: 0 auto;
        background-color: #fff;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }
    .left-column, .right-column {
        display: none;
    }
    .main-content {
        width: 100%;
    }
}

        /* --- Mobilna postavitev (en stolpec) --- */
        @media (max-width: 767px) {
            .container {
                display: block; /* Stolpci se zložijo eden pod drugega */
            }

            .main-content {
                width: 100%;
                background-color: #fff;
            }

            .left-column, .right-column {
                display: none; /* Prazna stolpca skrijemo */
            }
        }

        /* Glava: vrstica s statusom */
        .top-bar {
            background-color: #4B8EFA;
            color: #000;
            padding: 10px 20px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .user-status {
            font-size: 14px;
        }

        .user-status a {
            color: #fff;
            text-decoration: none;
            margin-left: 10px;
        }
        
        /* Meni z dropdownom */
        .menu-bar {
            background-color: #0368FF;
            padding: 0px;	/* prej 5px */
            text-align: right;
            position: relative;
        }

        .dropdown-menu {
            display: none;
            position: absolute;
            background-color: #0368FF;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
            z-index: 1;
            right: 10px;
            top: 100%; /* Postavi meni pod gumb */
        }

        .dropdown-menu a {
            color: white;
            padding: 4px 16px;
            text-decoration: none;
            display: block;
        }

        .dropdown-menu a:hover {
            background-color: #4B8EFA;
	   }
        .menu-btn {
            background-color: #0368FF;
            color: white;
            padding: 10px 15px;
            border: none;
            cursor: pointer;
            font-size: 16px;
        }
        
        .show {
            display: block;
        }
        
        /* Vsebina v sredinskem stolpcu */
        .page-content {
            padding: 10px;
        }

        .full-width-media {
            width: 100%;
            height: auto;
            display: block;
            margin: 10px 0;
        }