.bann7{background: url(../img/pozadina-tekst.png);background-position: center center; background-repeat: no-repeat; background-size: cover; min-height: 260px; max-width: 100%;}

.bann8{background: url(../img/footer-melior171a.png);background-position: center center; background-repeat: no-repeat; background-size: cover; min-height: 260px; max-width: 100%;}

.bann9{background: url(../img/naslovna1.webp);background-position: center center;	background-repeat: no-repeat; background-size: cover; min-height: 1000px; max-width: 100%;}
.bann10{background: url(../img/mfoot1.png);background-position: center center;	background-repeat: no-repeat; background-size: cover; height: 800px; width: 100%;}
@media only screen and (max-width: 769px) {
    .bann9  {
        background: url(../img/naslovna1.webp);
        background-position: center center;
        	background-repeat: no-repeat;
             background-size: cover; 
             min-height: 810px;
              max-width: 100%;
        
   }
}
html{
    scroll-behavior: smooth;
}
:root {
	
	--prva: #00a4cc;
	--druga: #edff00;
	--treca: #80E2F9;
    --bg-treca: #9effff;
    --bg-4: #00bfa5;
  }
 
.nav-margina{
    margin-top: 90px;
}
.prva{
	 
    color: var(--prva); 
}

.druga{
  
    color: var(--druga);  

}
.treca{
	 
    color: var(--treca); 
}
.bg-treca{
    background-color: #A0FCFF;
}
.bg-4{
    background-color: #00bfa5;
}
.glass{
    background-color: rgba(255, 255, 255, .15);  
    backdrop-filter: blur(5px);
    border-radius: 9px;  
    padding: 9px 18px;
    letter-spacing: 1px;
    margin-top: 1rem;
}

.glass1{
    background-color: rgba(255, 255, 255, .15);  
    backdrop-filter: blur(5px);
    border-radius: 9px;  
    padding: 24px 36px;
  
}
.glass2{
    background: rgb(106,214,217);
    background: linear-gradient(90deg, rgba(255,253,255,.1) 0%, rgba(158,241,233,.1) 31%, rgba(255,253,190,1) 100%);
    border-radius: 9px;  
    padding: 9px 18px;  
}
.vizitka{
    list-style-type: none;
    
    font-family: 'Montserrat', sans-serif;
    margin-top: 63px;
    color: #fff;
    font-weight: 500;
  
}
.poziv{
    list-style-type: none;
    padding: 12px 6px;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #fff;
  
}

    @media only screen and (max-width: 1025px) {
        .slika-mail  {
           
                  height: 48px;
                  max-width: 290px;
                  margin-left: -9px;
       }
    }   
   
    @media only screen and (max-width: 426px) {
        .slika-mail  {
           
                  height: 48px;
                  max-width: 212px;
                  margin-left: 2px;
       }
    }   
    @media only screen and (max-width: 377px) {
        .slika-mail  {
           
                  height: 48px;
                  max-width: 201px;
            
       }
    }   
    @media only screen and (max-width: 361px) {
        .slika-mail  {
           
                  height: 48px;
                  max-width: 189px;
            
       }
    }    
    @media only screen and (max-width: 321px) {
        .slika-mail  {
           
                  height: 48px;
                  max-width: 154px;
            
       }
    }    
.razmak{
margin-top: 120px;
}
.anim{
	transition: all .3s ease-in-out;

}

.anim:hover{
	transform: scale(1.09);
  
}
.anim1{
	transition: all .3s ease-in-out;

}

.anim1:hover{
	transform: scale(1.02);
   
}
.ahov:hover{
color: #d05ce3;
font-weight: 500;
}
input.form-control{
    color:#333;
    padding-top: 24px;
    padding-bottom: 0;
}
input[type="email"].form-control::placeholder {
    color: #ccc;
    opacity: .4;
  }
  input[type="text"].form-control::placeholder {
    color: #ccc;
    opacity: .4;
  } 
 textarea.form-control{
    color:#333;
 }  

.filler3 {
    padding: 9px 39px;
    font-size: 16px;
    display: inline-block;
    position:relative;
    color: #fff;
    border-radius: 6px;
    background: url(../img/sendbtn.png);background-position: center center;	background-repeat: no-repeat; background-size: cover; min-height: auto; max-width: 100%;
    letter-spacing: 2px;
    font-family: 'Kanit', sans-serif;
    cursor: pointer;
}

.filler3:before {
    content:'';
    background: url(../img/sendbtn1.png);background-position: center center;	background-repeat: no-repeat; background-size: cover; min-height: auto; max-width: 100%;
    position:absolute;
    width:0%;
    top:0;
    left:0;
    height:100%;
    transition: 0.3s linear;
    z-index:-1;
    border-radius: 6px;
   
   
}
.filler3:hover:before {
    width:100%;

    
} 


.bottom-center {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
   
   }
   .bottom-center1 {
    position: absolute;
    bottom: -24px;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 9px;
    
   }   
.shad {
    box-shadow: -12px -12px 12px 0 rgba(18,18,18,1),
    1px 1px 1px 0 rgba(102, 102, 102, 0.2);
    border-radius: 6px;
    padding: 6px 18px;
}
.shad1 {
    box-shadow: -12px -12px 12px 0 rgba(18, 18, 18, 1),
    12px 12px 12px 0 rgba(18, 18, 18, 0.23);
    border-radius: 12px;
    padding: 6px 18px;
    
}
.shad2 {
    box-shadow: -1px -1px 1px 0 rgba(150, 150, 150, 0.3),
    5px 5px 5px 0 rgba(150, 150, 150, 0.15);
    border-radius: 6px;
    padding: 6px 18px;
}
.shad3 {
    box-shadow: -1px -1px 1px 0 rgba(0, 0, 0, .1),
    5px 5px 5px 0 rgba(0, 0, 0, .3);
    border-radius: 6px;
}
.rOptionsMobile { display: none;}
.rOptions { display: none;}

/* mobile menu */
/*.gumbek{ width: 39px; height: 39px; margin: 3px 0 0 auto; position: relative; display: block; }*/

.gumbek.active  span:nth-child(1){ top: 7px; transform: rotate(135deg); }
.gumbek.active  span:nth-child(2){ opacity: 0; transform: translateX(-30px); }
.gumbek.active  span:nth-child(3){ top: -6px; transform: rotate(-135deg); }
/*.gumbek.active  span:nth-child(4){ opacity: 0; transform: translateX(30px); }*/

.gumbek{ position: absolute; right: 6px; top: 36px; left: auto; transform: translate(-50%, -50%);z-index: 999; }
.gumbek span{ width: 39px; height: 4px; background-color: #fff; border: 1px solid #000;  margin: 6px 0; display: block; -webkit-transition: all 0.3s ease;transition: all 0.3s ease; position: relative; }
.gumbek .lmenu{color: #fff; position: absolute; font-size: 11px; letter-spacing: 1px; top:33px; font-weight: bold; color: #000;}

.mainMenu{
display: flex;
justify-content: flex-end;
padding: 6px;
background: transparent;

}
.mainMenu ul{
display: inline-block;
padding: 0;
}
.mainMenu a{
display: inline-block; 
position: relative;

}
.subMenu{
color: #fff;
}
.subMenu li{
display: inline-block;
padding-top: 12px;

/*font-weight: 600;
letter-spacing: 1px;*/
}
.subMenu li a{
color: #000;
text-decoration: none;
position: relative;
font-size: 18px;
padding: 12px 18px;
font-weight: 600;
font-family: 'Montserrat' , sans-serif;
letter-spacing: 1px;
}
.subMenu li a span {
    background-color: rgba(255, 255, 255, .69);  
    backdrop-filter: blur(5px);
    border-radius: 12px;  

}
.subMenu li a span:hover {
    background-color: rgba(255, 255, 255, .15);  
    backdrop-filter: blur(5px);
    transition: all ease-in-out .33s;
    color: #A0FCFF;
    

}


@media only screen and (min-width : 991px) {
.gumbek {
display: none;
}
.tipka{
    display: none;
}
.meny {
display: none;
}
.rOptionsMobile {
display: none;

}
.rOptions {
display: block;

}

}

/*mobilna verzija*/
.mobileMainMenu{
width: 100%;
z-index: 2;
background: transparent;

/*transform: translateX(-100%);*/

}
.mobileSubmenu{
    padding-top: 45px;
    display: block;
    padding-left: 0;
}
.mobileSubMenu li{
    display: block;
    text-decoration: none;
    position: relative;
    text-align: center;
    padding: 18px 0;
    top: 21px;
}

.mobileSubMenu li a{ 
color: #000;
font-size: 16px; 
font-family: 'Kanit', sans-serif;
letter-spacing: 1px;
text-decoration: none;
}

.mobileSubMenu li a:hover {

color: #000;

}

@media only screen and (max-width: 426px) {
    .mob-margina  {
        margin-top: 5rem;
        
   }
}
@media only screen and (max-width: 321px) {
    .mob-margina  {
        margin-top: 6rem;
        
   }
}
h1{
    position: relative;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    font-size: 36px;
    font-weight: 800;
    line-height: 50%;
    letter-spacing: 1px;
    padding: 6px 12px;
    text-shadow: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
    color:#80E2F9;
}

@media only screen and (min-width: 1024px) {
    h1 {
        margin-top: 3.6rem;
        font-size: 36px;
   }
}
@media only screen and (max-width: 1024px) {
    h1 {
        margin-top: 7.5rem;
        font-size: 36px;
   }
}
@media only screen and (max-width: 376px) {
    h1 {
        margin-top: 4.5rem;
        font-size: 27px;
        line-height: 70%;
   }
}
.cook{
    position: relative;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    font-weight: 800;
    letter-spacing: 1px;
    text-shadow: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
    color:#80E2F9;
    line-height: 1.5;
}
@media only screen and (min-width: 1024px) {
    .cook {
        margin-top: 3.6rem;
        font-size: 45px;
   }
}
@media only screen and (max-width: 1024px) {
    .cook {
        margin-top: 7.5rem;
        font-size: 36px;
   }
}
@media only screen and (max-width: 376px) {
    .cook{
        margin-top: 7.5rem;
        font-size: 27px;
   }
}
.opis{
    font-size: 45px;
    
}
@media only screen and (max-width: 426px) {
    .opis  {
        font-size: 36px;
        
   }
}
@media only screen and (max-width: 376px) {
    .opis  {
        font-size: 30px;
        
   }
}
@media only screen and (max-width: 321px) {
    .opis  {
        font-size: 24px;
        
   }
}
.opis1{
    font-size: 13px;
    line-height: 60%;
    font-weight: 500;
    color: #fff;
    text-shadow: none;
}

body {
    color: #000;
	margin: 0 auto;
	overflow-x: hidden;
}
h2{
    font-family: 'Kanit', sans-serif;
    font-size: 30px;
    font-weight: 700;
}
p{
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    line-height: 1.6;
    
}
h3{
    font-family: 'Montserrat', sans-serif;
    font-size: 21px;
    line-height: 1.6;
    
}
@media only screen and (max-width: 1000px) {
    body {
        padding: 0;
   }
}
.okvir{
    box-shadow: -6px -6px 6px 0 rgba(94, 189, 207, 0.8),
    6px 6px 6px 0 rgba(94, 189, 207, 0.8);
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    letter-spacing: 2px;
    font-size: 14px;
    border-radius: 9px;
   
    

}
.pott{
    position: absolute;
    margin-top: 87px;
    left: 36px;
}
.pott1{
    position: absolute;
   
   
}
.pott2{
    position: absolute;
    margin-top: 21px;
    left: 16px;
}
.slajs{
    position: absolute;
    margin-top: 1px;
   
}
.slajs1{
    position: absolute;
   
   
}
.margina{
    margin-top: 72px;
}



.cont {
    position: relative;
    overflow: hidden;

   /* border-radius: 5rem;*/
  
}
@media only screen and (max-width: 1000px) {
    .cont {
        border-radius: 0;
   }
}


.cookie-alert {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: auto;
    margin: 0 !important;
    z-index: 999;
    opacity: 0;
    transform: translateY(100%);
    transition: all 0.5s ease-out;
}
.cookie-alert.show {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 1s;

}
.kuki{
    float: right;
    
}
.kuki span:hover{
    color: #9effff;
}
.kuki1{
    font-size: 13px;
    display: block;
}
.slikica{
    list-style-type: none;
    padding: 12px 6px;
    font-family: 'Montserrat', sans-serif;
    font-size: 21px;
    color: #fff;
    text-align: center;
   
  
}
.tipka{
    background: rgb(106,214,217);
    background: linear-gradient(90deg, rgba(255,253,255,.1) 0%, rgba(158,241,233,.1) 31%, rgba(255,253,190,1) 100%);
margin: 0 -20px;
padding: 6px 0;
}