*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family:Arial, Helvetica, sans-serif
}
body{
    height: 100vh;
    background: rgb(63, 63, 63);
    background-image: url(images/back_pozadi_basic.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
}

li{
    list-style: none;
}
a{
    text-decoration: none;
    color: white;
    font-size: 1rem;
}
a:hover{
    color:red;
}

/* HEADER */
header{
    position: relative;
    padding: 0 2rem;
    background: rgba(100, 100, 100, 0.5);
  backdrop-filter: blur(5px);
}
.logo_vardar{
    padding-top: 5px;
    width: 100%;
    display: flex;
object-fit: contain;
}

.navbar{
    width: 100%;
    height: 60px;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.navbar .logo a{
width: 100%;
height: 80px;
display: flex;
margin-top: 20px;
position: relative;
}

.navbar .links {
    display: flex;
    gap: 1.2rem;
}

.navbar .toggle_btn{
color: white;
font-size: 1.5rem;
cursor: pointer;
display: none;
}

.action_btn{
    background-color: red;
    color: white;
    padding: 0.5rem 1rem;
    border: none;
    outline: none;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: bold;
    cursor: pointer;
    transition: scale 0.2 ease;
}

.action_btn:hover{
    scale:1.05;
    color: white;
}

.action_btn:active{
    scale:0.95;
}

/* DROPDOWN MENU */

.dropdown_menu{
    display: none;
    position: relative;
    left: 280px;
    margin-bottom: 30px;
    top: 30px;
    height: 0;
    width: 300px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    border-radius: 10px;
    overflow:hidden;
    transition: heigh 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.dropdown_menu.open{
    height: 240px;
}

.dropdown_menu li{
    padding: 0.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dropdown_menu .action_btn{
    width: 100%;
    display: flex;
    justify-content: center;
}

.logo_vardar{ 
    display: flex;
  justify-content: flex-start;
}


    /* RESPONSIVE RULES */

    @media (max-width:767px) {
        .navbar .links,
        .navbar .action_btn{
            display: none;
        }

        .navbar .toggle_btn{
            display: block;
        }

        .dropdown_menu{
            display: block;
        }
    }

    @media (max-width:576px){
        .dropdown_menu{
            left:0rem;
            margin-bottom: 50px;
            width: unset;
        }
    }

   

/* SOC_MEDIA */

.soc_media{
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
    width: 100%;
max-width: 1300px;
margin: 0 auto;
}

.soc_buttons{
    display: flex;
    justify-content:center;
    align-items: center;
    align-content: center;
    text-align: center;
    margin-top: 10px;
    
}

.soc_text{
    color:white;
    font-size: 12px;
    text-align: center;
    letter-spacing:2px;
}

.za_twitter{
    position: relative;
    cursor: pointer;
}

.img_x{
 width: 40%;
 height: auto;
 position: relative;
}

/* RESPONSIVE RULES */

@media (max-width:767px){
    .soc_media{
        display: block;
        justify-items: center;
        align-items: center;
    align-content: center;
    text-align: center;
        position: relative;
        margin-top: -15px;
    }

}


    /* SCROLL TEXT */

 .roll_text{
        width: 100%;
        height: 30px;
        max-width: 1300px;
        margin: 0 auto;
        margin-top: 10px;
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(15px);
        overflow: hidden;
        white-space: nowrap;
        padding: 0.4rem;            /* Намален padding за пониска висина */
        line-height: 1.2;             /* Компактен текст */
    }

    .scrolling-text {
        color:white;
        font-size: clamp(14px, 2.5vw, 18px); /* Responsive фонт */
        display: inline-block;
        padding-left: 100%;
        animation: scroll-left 20s linear infinite;
    }

    @keyframes scroll-left {
        0% {
          transform: translateX(0%);
        }
        100% {
          transform: translateX(-100%);
        }
      }

      /* RESPONSIVE RULES */

@media (max-width:767px){

    .roll_text{
        height: 4%;
        padding: 0.2rem;
    }

}



   
  
/* NASLOVNA */

.naslovnica{
    display: flex;
    justify-content: center;
    width: 100%;
max-width: 1300px;
margin: 0 auto;
align-items: center;
margin-top: 10px;
}

.nalovna_strana{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.slika_naslovna{
    width: 100%;
}

@media (max-width:767px){
    .naslovnica{
        display: block;
        justify-content: center;
        align-items: center;
        align-content: center;
        text-align: center;
        position: relative;
        margin-bottom: -20px;
    }
}


/* BILETI VARDAR LOZANO */

.bileti_vardar_lozano{
    display: flex;
    width: 100%;
max-width: 1300px;
margin: 0 auto;
justify-content: center;
align-items: center;
text-align: center;
}

.baner_biletiVardar{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    margin-top: 20px;
}

.banerVardar{
    width: 100%;  
    position: relative;
}

.pogledni{
    position: absolute;
    background-color: #4f4f4f;
              color: white;
              font-size: 15px;
              margin:0;
              padding: 2px 8px;
              text-align: center;
              border: 2px;
              border-color: white;
              cursor: pointer;
              border-radius: 2px;
              bottom: 22%;
            right: 2%;
            opacity: 0;
      transition: opacity .35s ease;
}

.baner_biletiVardar:hover .pogledni{
    opacity: 1;
}


/* RESPONSIVE RULES */

@media (max-width:767px){

.bileti_vardar_lozano{
    display: block;
    justify-content: center;
}

.baner_biletiVardar{
    display: block;
    justify-content: center;
}

.pogledni{
    display: block;
    width: 15%;
    font-size: 10px;
}
}



    
/* VESTI1 */


.vesti1{
padding: 20px;
display: flex;
width: 100%;
max-width: 1300px;
margin: 0 auto;
justify-content: center;
align-items: center;
}

.vesti_home{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.vesti234{
    margin-left: 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.vesti2,
.vesti3,
.vesti4{   
 position: relative;
}

.vesti_images_all,
.vesti_images_all2,
.vesti_images_all3,
.vesti_images_all4{
    width: 100%;
}

.more{
position: absolute;
  top: 10%;
  left: 10%;
  background-color: #4f4f4f;
  color: white;
  font-size: 15px;
  margin:0;
  padding: 2px 8px;
  text-align: center;
  border: 2px;
  border-color: white;
  cursor: pointer;
  border-radius: 2px;
  opacity: 0;
  transition: opacity .35s ease;
}

.more a{
    z-index: 1;
}

.vesti_home:hover .more{
    opacity:1;
    
}

.more2{
    position: absolute;
      bottom: 11%;
      right: 11%;
      background-color: #4f4f4f;
      color: white;
      font-size: 15px;
      margin:0;
      padding: 2px 8px;
      text-align: center;
      border: 2px;
      border-color: white;
      cursor: pointer;
      border-radius: 2px;
      opacity: 0;
      transition: opacity .35s ease;
    }

    .more2 a{
        z-index: 1;
    }

    .vesti2:hover .more2{
        opacity: 1;
    }

    .more3{
    position: absolute;
    bottom: 11%;
    right: 11%;
    background-color: #4f4f4f;
      color: white;
      font-size: 15px;
      margin:0;
      padding: 2px 8px;
      text-align: center;
      border: 2px;
      border-color: white;
      cursor: pointer;
      border-radius: 2px;
      opacity: 0;
      transition: opacity .35s ease;;
        }
    
        .more3 a{
            z-index: 1;
        }
    
        .vesti3:hover .more3{
            opacity: 1;
        }

        .more4{
            position: absolute;
            bottom: 11%;
            right: 11%;
              background-color: #4f4f4f;
              color: white;
              font-size: 15px;
              margin:0;
              padding: 2px 8px;
              text-align: center;
              border: 2px;
              border-color: white;
              cursor: pointer;
              border-radius: 2px;
              opacity: 0;
              transition: opacity .35s ease;
            }
        
            .more4 a{
                z-index: 1;
            }
        
            .vesti4:hover .more4{
                opacity: 1;
            }

            /* RESPONSIVE RULES */

            
 @media (max-width:767px){

.vesti1{
    display:block;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: -10px;
}

.vesti_home{
    display: block;
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
    width: 96%;
    margin-left: auto;
    margin-right: auto;
}


.vesti234{
    display: block;
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.vesti2{
    padding-bottom: 2px;
}
.vesti3{
    padding-bottom: 2px;
}
.vesti4{
    padding-bottom: 0px;
}
 } 
 


/* SPONZORI */

.sponzori{
    background: rgba(100, 100, 100, 0.5);
    backdrop-filter: blur(5px);
    width: 100%;
max-width: 1300px;
margin: 0 auto;
height: 10px;
display: flex;
justify-content: center;
align-items: center;
align-content: center;
text-align: center;
gap: 6px;
margin-top: 50px;
margin-bottom: 80px;
}

.sponzori_1, .sponzor_2, .sponzor_3, .sponzor_4, .sponzor_5{
    display: flex;
    position: relative;
    justify-content: center;
}

.sponzor_11, .sponzor_22, .sponzor_33, .sponzor_44, .sponzor_55{
    width: 100%;
    cursor: pointer;
}


/* RESPONSIVE RULES */

@media (max-width:767px){

    .sponzori{
margin-bottom: 30px;

    }
  
    .sponzori_1, .sponzor_2, .sponzor_3, .sponzor_4, .sponzor_5{
        display: block;
        justify-content: center;
    }
}



/*PRAZNA*/

.crvena_linija{
    width: 100%;
    height: 2px;
    background:rgb(255, 0, 0);   
}

/* MATCHES */

.matches{ 
display: flex;
width: 100%;
max-width: 1300px;
margin: 0 auto;
align-content: center;
align-items: center;
justify-content:center;
margin-top: 20px;
margin-bottom: 20px;
}

.prva_liga{
    display:flex;
    align-content: center;
    align-items: center;
    justify-content:center;
    text-align: center;  
    position: relative;
    gap: 4px;
}

.pred_tab{
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    text-align: center;     
}

.sirok_tab{
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;   
    text-align: center;  
}

.posle_tab{
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;   
    text-align: center;  
}

.prvi_natab{
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center; 
    text-align: center;  
    margin-top: 10px;
}

.za_kolo1,
.za_kolo2,
.za_kolo3
.za_razlika{
    width: 100%;
}

/* RESPONSIVE RULES */

@media (max-width:767px){
    .matches{
        display: block;
        justify-content: center;
        margin-top: -10px;
    }

    .prva_liga{
        display: block;
        justify-content: center;
        text-align: center;
    }
.sirok_tab{
        margin-top: 20px;
}

.za_razlika{
    width: 98%;
}

    .prvi_natab{
        margin-top: 20px;
    }
}


/* ZBORUVA MILENKO */

.zboruva_milenko{
    display: flex;
    width: 100%;
max-width: 1300px;
margin: 0 auto;
justify-content: center;
align-items: center;
}

.baner_milenko{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
}

.banerM{
    width: 100%;  
    position: relative;
}

.pogledni{
    position: absolute;
    background-color: #4f4f4f;
              color: white;
              font-size: 15px;
              margin:0;
              padding: 2px 8px;
              text-align: center;
              border: 2px;
              border-color: white;
              cursor: pointer;
              border-radius: 2px;
              bottom: 22%;
            right: 2%;
            opacity: 0;
      transition: opacity .35s ease;
}

.baner_milenko:hover .pogledni{
    opacity: 1;
}


/* RESPONSIVE RULES */

@media (max-width:767px){

.zboruva_milenko{
    display: block;
    justify-content: center;
}

.baner_milenko{
    display: block;
    justify-content: center;
}

.pogledni{
    display: block;
    width: 15%;
    font-size: 10px;
}
}



/* TICKETS */

.tickets{
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    display: flex;
    width: 100%;
max-width: 1300px;
margin: 0 auto;
justify-content: center;
align-items: center;
}

.tickets1{
    display: flex;
    width: 100%;
max-width: 1300px;
margin: 0 auto;
justify-content: center;
align-items: center; 
}

.samo_tikets{
    display:flex;
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 40px;
    margin-left: 10px;
    margin-right: 10px;
    gap:10px;
}
.samo_tikets1{
    display:flex;
    justify-content: center;
  margin-top: 100px;
}

.karta1{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.karta2{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center; 
}

.tiket_karta {
    width: 100%;
}

.tiket_karta2{
    width: 100%;  
}

.tiket_karta2 a{
    width: 100%;
    cursor: pointer;
}



/* RESPONSIVE RULES */

@media only screen and (max-width:767px){
    .tickets, .tickets1{
        display: block;
        justify-content: center; 
        align-content: center;
        align-items: center;
        text-align: center;
        margin-top: 0px;
    }

    .samo_tikets{
        display: block;
        justify-content: center; 
        align-content: center;
        align-items: center;
        text-align: center;
        margin-top: 0px;
    }

    .samo_tikets1{
        display: block;
        justify-content: center; 
        align-content: center;
        align-items: center;
        text-align: center;
        margin-top: 20px;
    }
}


/* CLENOVI */

.clenovi{
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    width: 100%;
max-width: 1300px;
margin: 0 auto;
    display: flex;
justify-content: center;
align-items: center;
}

.clena2{
    display:flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    gap:10px;
}

.clen_prvi{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;
}

.clen_vtori{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
    margin-top: 0px;
}

.podrzi1{
    width: 100%;
}

.podrzi2{
width: 100%;
}


/* RESPONSIVE RULES */

@media (max-width:767px){
    .clenovi{
        display: block;
        justify-content: center; 
        text-align: center;
    }

    .clena2{
        display: block;
        justify-content: center; 
        text-align: center;
    }
}

/* POVEKE RED */

.poveke_red{
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    width: 100%;
max-width: 1300px;
margin: 0 auto;
    display: flex;
justify-content:end;
}

.clen_treti{
    display: flex;
    justify-content:center;
    text-align: end;
    margin-bottom: 20px;
    margin-top: 0px;
    margin-left: 10px;
    margin-right: 10px;
}

.clen{
    width: 100px;
    height: 30px;
    font-weight: bold;
    position: relative;
    background:  transparent;
    border:  2px solid white;
    border-radius: 5px;
    float:  none;
    text-align:  center;
    letter-spacing: 1px;
    font-size:  16px;
    color: white;
    justify-items: center;
    cursor: pointer;
    }
    
    .clen:hover{
        transition-duration: 0.4s;
        background-color: red;
        transform: scale(1.05);
    }

    /* RESPONSIVE RULES */

@media (max-width:767px){
    .poveke_red{
        background: none;
        display: block;
        justify-items: center;
        
    }
}

/* TTIGRACI */

.ttigraci{
   
    width: 100%;
max-width: 1300px;
margin: 0 auto;
    display: flex;
justify-content: center;
}

.tekst_igraci{
    display: flex;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
    margin-top: 10px;
    margin-left: 20px;
    margin-right: 20px;
    scale:90%;
}

.text_web{
    width: 100%;
}

/* RESPONSIVE RULES */

@media (max-width:767px){
    .ttigraci{
        display: block;
        justify-content: center;
        text-align: center;  
    } 
}

/* IGRACI 1 red */

.igraci1{
    width: 100%;
max-width: 1300px;
margin: 0 auto;
    display: flex;
justify-content: center;

}

.sliki_igraci1{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
    gap:8px;
}

.igra_red1_1, .igra_red1_2, .igra_red1_3, .igra_red1_4, .igra_red1_5, .igra_red1_6{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.igra1, .igra2, .igra3, .igra4, .igra5, .igra6{
    width: 100%;
}

.igra1:hover, .igra2:hover, .igra3:hover, .igra4:hover, .igra5:hover, .igra6:hover{
box-shadow: 1px 1px 15px white;
transition-duration: 0.4s;
transform:scale(1.03)
}

/* RESPONSIVE RULES */

@media (max-width:767px){
    .igraci1{
        display: none;
    }
}


/* IGARCI 2 red */

.igraci2{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
justify-content: center;
}

.sliki_igraci2{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
    gap:8px;
}

.igra_red2_1, .igra_red2_2, .igra_red2_3, .igra_red2_4, .igra_red2_5, .igra_red2_6{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.igra7, .igra8, .igra9, .igra10, .igra11, .igra12{
    width: 100%;
}

.igra7:hover, .igra8:hover, .igra9:hover, .igra10:hover, .igra11:hover, .igra12:hover{
    box-shadow: 1px 1px 15px white;
    transition-duration: 0.4s;
    transform:scale(1.03)
    }

/* RESPONSIVE RULES */
@media (max-width:767px){
    .igraci2{
        display: none;
    }
}


/* IGARCI3 */

.igraci3{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
justify-content: center;
}

.sliki_igraci3{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
    gap:8px;
}

.igra_red3_1, .igra_red3_2, .igra_red3_3, .igra_red3_4, .igra_red3_5, .igra_red3_6{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.igra13, .igra14, .igra15, .igra16, .igra17, .igra18{
    width: 100%;
}

.igra13:hover, .igra14:hover, .igra15:hover, .igra16:hover, .igra17:hover, .igra18:hover{
    box-shadow: 1px 1px 15px white;
    transition-duration: 0.4s;
    transform:scale(1.03)
    }

/* RESPONSIVE RULES */
@media (max-width:767px){
    .igraci3{
        display: none;
    }
  
}


/* IGRACI4 */

.igraci4{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
justify-content: center;
}

.sliki_igraci4{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
    gap:8px;
}

.igra_red4_1, .igra_red4_2, .igra_red4_3, .igra_red4_4, .igra_red4_5, .igra_red4_6{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
}
.igra19, .igra20, .igra21, .igra22, .igra23, .igra24{
    width: 100%;
}

.igra19:hover, .igra20:hover, .igra21:hover, .igra22:hover, .igra23:hover, .igra24:hover{
    box-shadow: 1px 1px 15px white;
    transition-duration: 0.4s;
    transform:scale(1.03)
    }

/* RESPONSIVE RULES */
@media (max-width:767px){
    .igraci4{
        display: none;
    }
}


/* IGRACI5 */

.igraci5{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
justify-content: center;

}

.sliki_igraci5{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
    gap:8px;
}

.igra_red5_1, .igra_red5_2, .igra_red5_3, .igra_red5_4, .igra_red5_5, .igra_red5_6{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.igra25, .igra20, .igra27, .igra28, .igra29, .igra30{
    width: 100%;
}

.igra30{
    opacity: 0;
}

.igra25:hover, .igra26:hover, .igra27:hover, .igra28:hover, .igra29:hover, .igra30:hover{
    box-shadow: 1px 1px 15px white;
    transition-duration: 0.4s;
    transform:scale(1.03)
    }


/* RESPONSIVE RULES */
@media (max-width:767px){
    .igraci5{
        display: none;
}
}

/* IGRACI ZA GRESOVI */

.za_dresovi{
    
    display: flex;
justify-content: center;
display: none;
}

.igraci_dresovi{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
}

.dress_show{
    width: 100%;
}

/* RESPONSIVE RULES */

@media (max-width:767px){
    .za_dresovi{
        display: block;
    }
    .igraci_dresovi{
        display: block;
    }
}

/* NARACAJ TUKA */

.poveke_red_1{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
justify-content:end;
}

.poveke_naracaj{
    display: flex;
    text-align: end;
    margin-bottom: 20px;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.pov_na{
    width: 100px;
    height: 30px;
    font-weight: bold;
    position: relative;
    background:  transparent;
    border:  2px solid white;
    border-radius: 5px;
    float:  none;
    text-align:  center;
    letter-spacing: 1px;
    font-size:  16px;
    color: white;
    justify-items: center;
    cursor: pointer;
    }
    
    .pov_na:hover{
        transition-duration: 0.4s;
        background-color: red;
        transform: scale(1.05);
    }

    /* RESPONSIVE RULES */

@media (max-width:767px){
    .poveke_red_1{
        text-align: center;
        justify-content: center;
    }
}
@media (max-width:480px){
    .poveke_red_1{
        text-align: center;
        justify-content: center;
    }
}



/* AKADEMIJA */

.akademija{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    display: flex;
justify-content: center;
}

.akademija_nova{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
    gap:8px;
}
.tekst_akademija_1{
    display: inline-block;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.text_akd_dole{
    width: 100%;
}


 /* RESPONSIVE RULES */

 @media (max-width:767px){
    .akademija{
        display: block;
    }
 }


 /* POVEKE AKADEMIJA */
 .poveke_akd{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
justify-content:end;
opacity: 0;
}

.clen_treti_akd{
    display: flex;
    justify-content:center;
    text-align: end;
    margin-bottom: 20px;
    margin-top: 0px;
    margin-left: 10px;
    margin-right: 10px;
}

.clen_akd{
    width: 100px;
    height: 30px;
    font-weight: bold;
    position: relative;
    background:  transparent;
    border:  2px solid white;
    border-radius: 5px;
    float:  none;
    text-align:  center;
    letter-spacing: 1px;
    font-size:  16px;
    color: white;
    justify-items: center;
    cursor: pointer;
    }
    
    .clen_akd:hover{
        transition-duration: 0.4s;
        background-color: red;
        transform: scale(1.05);
    }

    /* RESPONSIVE RULES */

@media (max-width:767px){
    .poveke_akd{
        background: none;
        display: block;
        justify-items: center;
        margin-top: -20px;
        opacity: 0;
        
    }
}

/* REVIZIJA */
.revizija{
    display: flex;
width: 100%;
max-width: 1300px;
margin: 0 auto;
justify-content: center;
}

.revizija_tekst{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color:white;
    font-size: 12px;
    letter-spacing:2px;
    position: relative;
    cursor: pointer;
}
.revizija_tekst:hover{
transition-duration: 0.4s;
  transform: scale(1.05);
}

/* responsive rules */

@media (max-width:767px){
    .revizija{
      display: block;
      justify-content: center;
      align-items: center;
      text-align: center;
    }
  
  }


/* FUTER */

footer{
    display: flex;
  text-align: center;
  justify-content: center;
  position: relative;
  
  }
  
  .footer_image{
    width: 100%;
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    align-content: center;
  }
  
  /* RESPONSIVE RULES */
  
  @media (max-width:767px){
  .footer{
    display: block;
  }
    
  }


