*{
            margin:0;
            padding:0;
        }
           
           
           


            .brand {
            display: flex;
            align-items: center;   
            gap: 10px;             
             }
        



           
             .header-right {
              display: flex;
              align-items: center;
              gap: 20px;
              margin-right: 10px;     
                         }
           
           
           
           
           
            body{
            font-family: "Zalando Sans SemiExpanded", sans-serif;
            font-optical-sizing: auto;
            font-weight: 400;
            font-style: normal;
            background-color: #000;
                   }
        
        
       
        
            header {
            height: 90px;
            background-color: #000000;
            display: flex;
            justify-content: space-between;
            align-items: center;
            color: beige;
            font-size: 20px;  
                 }
        
        
        
        
        
            .hero  {
            background: linear-gradient( rgba(0, 0, 0, 0.38) ),url(img/OKOee.jpg);
            background-position: center;
            height: 90vh;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            padding-bottom: 100px;
            background-repeat: no-repeat;
            text-align: center;
            padding: 40px 20px;      
            
                }
        
        
        
        
        
            .column {
             width: 100%;
             height: 100%;
             background: black;
             display: flex;
             justify-content: center;
             align-items: center;
             padding-top: 60px;
              }
            


            .lili{
             width: 100%;
             background: black;
             display: flex;
             flex-direction: column; 
             justify-content: flex-start; 
             align-items: center; 
             padding-top: 60px; 
                  }
            
        
        
        
        
        
        
            .vise  {
            padding: 12px;
            background: transparent;
            border-radius: 23px;
            border: 2px solid #ffffff;
            margin-top: 30px;
            text-align: center;
            color: white;
            
            
            
            }
            
            
            
            
            .vise:hover{
                color: #7D7A15;
            }
            
            
           .column2 {
           display: flex; 
           gap: 20px; 
           justify-content: center;
           flex-wrap: wrap;  
           margin: 40px auto;
           max-width: 1200px;
                  } 

           
           
           
           .column2 img {
           width: 32%;  
           height: 300px;  
           object-fit: cover;  
           border-radius: 25px;
                     }
               
               
               
               
             .container  {
              display: flex;
              justify-content: space-between;
              align-items: center;
              text-align: center;
              flex-direction: column;
              width: 50%;
              margin: 20px auto;
              padding:20px;
                     }
           
        
        
        
              img{
              max-width: 100%;
              height: auto;
              border-radius:25px;
              margin-top: 20px;
            
              }
        
        
        
        
        
              ul{
              display: flex;
              gap:40px;
              list-style-type: none;
              padding:8;
              margin-right: 30px;
               }
        
        
        
        
              a{
              text-decoration: none;
              color: #ffffff;
              font-size: 18px;
              margin-right: 30px;
           }
        
        
        
        
        
              a:hover{
              color:#7D7A15;
                 }
        
        
        
    
               h1{
              margin-left: 20px;
              font-size: 38px;
              margin-top: 0px;
              color: white;
              }  
        
        
        
        
        
             h2{
             color:#ffffff;
             font-size: 60px;
             padding-bottom: 50px;
             margin-right: 10px;
               }
        
           
          

           .lili h3 {
           text-align: center;        
           margin-bottom: 20px;       
           color: white;              
           font-size: 50px;           
               }
        


                h4{
                text-align: center;
                font-size: 50px;
                color: white;
                padding-top: 50px;
                padding-bottom: 10px;
                }
        
           
           
           
           
        
            .naslovic2{
            text-align: center;
            margin: auto;
            font-size: 30px;
            display: flex;
                  }
        
        
        
        
        
            .naslovic{
            margin-top: 16px;
            text-align: center;
           
                 }
         
        
        
        
        
           .pe{
            margin-top: 10px;
            text-align: center;
            margin-bottom: 70px;
            }
        
        
        

        
        
           .koza{
            color: #F9F4EF;
            margin-right: 15px;
            padding-bottom: 40px;
             
                 }
         
        
        
        
        
            footer{
            width: 100%;
            height: 96px;
            text-align: center;
            background-color: #000000;
            display: flex;
            justify-content: center;
            align-items: center;
              }





           .hamburger {
           display: none;
           background-color: #000;
           color: #fff;
           border: none;
           font-size: 28px;
              }
       












        @media (max-width: 768px) {
           
           
           
    .nav-menu {
    display: none;
    position: absolute;
    top: 70px;
    right: 20px;
    background: #000;
    width: 200px;
    border-radius: 10px;
}

           .nav-menu ul {
    flex-direction: column;
    gap: 15px;
    padding: 20px;
}
           
         .nav-menu.open {
    display: flex;
}

         .hamburger {
          display: block;
          cursor: pointer;
          z-index: 1001;
          position: relative;  
             }

          nav {
          position: relative;
                }

            }

        



           .scroll-btn{
            padding: 11px;
            font-size: 16px;
            border-radius: 12px;
            border: 2px solid #ffffff;
            background: #000000;
            color: #ffffff;
            margin-left: 530px;
            margin-bottom: 80px;
                  }

            
           
             #dinamickiTekstContainer{
              margin: 20px auto;
              max-width: 800px;
                       }
   
         
           
              .onama{
               font-size: 16px;
               color: white;
               text-align: center;            
               margin: 0 auto 30px auto;      
               max-width: 800px;                           
               padding-left: 20px;          
               padding-right: 20px;          
             }
            
            
               .tocka{
                color: white;
                font-size: 16px;
                display: block;
                list-style-type: disc;
                padding-left: 40px;
                
            }
            
            
            
            
               .tocka li{
               display: list-item;
               align-items: center;
               padding-left: 10px;   
               }
            
                .mi{
                font-size: 16px;
                color: white;
                display: flex;
                justify-content: center;
                align-items: center;
                margin-bottom: 20px;
                }
           

              .im{
               color: #ffffff;
               display: flex;
               flex-direction: column;  
               justify-content: center;
               align-items: center;
               margin: 40px auto;  
               padding: 20px 30px;  
               border: 1px solid rgba(255, 255, 255, 0.5);  
               border-radius: 15px;   
               text-align: center;  
               width: 90%;
               max-width: 500px;
                    }
           
               .lili img {
               width: 70%;
               max-width: 500px;

                 }
           
           
           
               .usluge{
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 60px;            
                margin: 50px 0;
         
                 }
           

               .usluga-slika{
               width: 300px;
               display: block; 
               background-color: #000;              
                 }
           
                .usluge-galerija{
                display: flex;
                justify-content: center;
                gap: 30px;
                margin: 50px auto;
                max-width: 1200px;
                padding-left: 30px;
                padding-right: 30px;              
                      }


                .usluge-galerija img{
                 width: 30%;
                 height: 220px;
                 object-fit: cover;
                 border-radius: 20px;
                         }

               #contactForm{
               width: 90%; 
               max-width: 400px;
               padding: 20px;
               background-color: #111; 
               border-radius: 15px;
               color: white;
               display: flex;
               flex-direction: column;
               gap: 15px;
               margin: 60px auto;    
                     }

              .modal {
              display: none;  
              position: fixed;  
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              background: rgba(0, 0, 0, 0.7);  
              justify-content: center;
              align-items: center;
                }

               
             .modal img {
              max-width: 80%;    
              max-height: 80vh;  
              object-fit: contain; 
              border-radius: 15px;  
                   }



            .carousel-container{
            width: 90%;
            max-width: 500px;
            overflow: hidden;
            margin: 0 auto;         
                     }


           .carousel-buttons{
           text-align: center;     
           margin-top: 15px;
           padding-bottom:50px;
             }

           #carousel-track img {
           width: 150px;
           height: 200px;
           object-fit: cover;
               }



          #galerija{
           padding-bottom: 100px;
            }

          .item {
           color: white;
           margin: 10px 0;
           font-size: 18px;
              }


           button {
           padding: 10px 15px;
           margin: 5px;
           background-color: #000;
           color: white;
           border: 2px solid white;
           border-radius: 8px;
           cursor: pointer;
                   }



          .kokolo {
           background-color: #030303;   
           padding: 20px;
           margin: 60px auto;
           width: 90%;
           max-width: 400px;   
           border-radius: 20px 20px 20px 20px;
           text-align: center;
           padding-top: 30p   
                }

           #filterlista {
           color: white;
           margin-top: 20px;
                     }

           .item {
           color: white;
           margin: 8px 0;
             }


          #topBtn {
           position: fixed;
           bottom: 20px;
           right: 20px;
           padding: 10px;
           display: none;
           font-size: 20px;
   
             }



       @media (max-width: 768px) {

       .usluge {
       flex-direction: column;
       gap: 30px;
       text-align: center;
          }

       .usluge-galerija {
       flex-direction: column;
       gap: 20px;
        }

     .usluge-galerija img {
      width: 100%;
      }
      }