@import url('https://fonts.googleapis.com/css2?family=Pacifico&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lobster&family=Pacifico&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');

/*-------------------NAVBAR------------------*/
.sticky {
  position: fixed;
  top: 0;
  height: 80px;
  width: 100%;
  z-index: 100;

}

.sticky+.content {
  padding-top: 60px;
}

.content {
  padding: 16px;
}

nav ul a,
nav .brand-logo {
  color: #444;
}

.sidenav-trigger {
  color: #4f2421;
}

#nav-mobile:hover {
  color: red;
}

p {
  line-height: 2rem;
}

/*---------------------DIV------------------------*/

.parallax-container {
  min-height: 380px;
  line-height: 0;
  color: rgba(255, 255, 255, .9);
}

.parallax-container .section {
  width: 100%;
}

@media only screen and (max-width : 992px) {
  .parallax-container .section {
    position: absolute;
    top: 40%;
  }

  #index-banner .section {
    top: 10%;
  }
}

@media only screen and (max-width : 600px) {
  #index-banner .section {
    top: 0;
  }
}

/*----------------------------Icons------------------------------------------*/
.icon-block {
  padding: 0 15px;
}

.icon-block .material-icons {
  font-size: inherit;
}

footer.page-footer {
  margin: 0;
}



.material-symbols-outlined {
  font-variation-settings:
    'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 48
}

#download-button {
  padding: 20px;
  font-size: 50px;
  height: auto;
}

#o-nama {
  height: 100vh;
}

.glavni-naslov {

  font-size: 6vw;
}

/* video background */
#backgroundVideo {
  max-height: 100vh;
  width: 100vw;
  object-fit: cover;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: -1
}

#header-text {
  background-color: rgba(70, 70, 70, 0.5);

}

#three-sections,
.contact-us,
.jelovnik,
.contact {
  background-color: rgb(255, 255, 255, 0.8);
}

.menu-banner {
  padding-top: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
}

body>div.parallax-container.menu-banner>div.section.no-pad-bot>div,
#index-banner>div>div,
body>div:nth-child(4)>div.section.no-pad-bot>div>div>h5,
body>div:nth-child(6)>div.section.no-pad-bot>div>div>h5 {
  background-color: rgb(55, 47, 47, 0.5);
  padding: 20px;

}

#index-banner {
  padding-top: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("../images/bgBanner.jpg");
  background-size: cover;
  height: 100vh;
  width: 100vw;

}





.rounded-image {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  border: 10px solid #d6cbba;
}
#first-sect,
#second-sect,
#third-sect,
.meso,
#biftek,
#riba {

  background-size: cover;
}
.center-div {
  display: flex;
  justify-content: center;
  align-items: center;
}



#first-sect{
  background-image: url("../images/johnny.jpg");
}

#second-sect {
  background-image: url("../images/kotlet12.jpg");
}

#third-sect {
  background-image: url("../images/ulaz5.jpg");
}

.meso {
  background-image: url("../images/kotlet14.jpg");
}

#riba {
  background-image: url("../images/riba.jpg");
}

#biftek {
  background-image: url("../images/kotlet13.jpg");
}

.vino {
  background-image: url("../images/wines.jpg");
}

h4 a {
  font-size: 0.5em;
}

.page-footer {
  font-size: 1em;
}

/*-------------------Gallery---------------*/



.gallery img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
  border: 10px solid white;
  max-height: 300px;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
  }

}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */

@media screen and (max-width: 600px) {
  .column {
    flex: 100%;
    max-width: 100%;
  }

  #index-banner{
    width:100vw;
    background-image: url("../images/banner-small.jpg");
    background-size: cover;
    display:flex;
    align-items: flex-end;

  }

  .gallery img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
    border: 10px solid rgb(55, 47, 47, 0.5);
    max-height: 400px;
  }
}


/*-----------------------JELOVNIK------------------------------*/
.menu li {
  font-size: 1.5em;
  color: #4f1212;
  text-align: left;
}

.menu li p:nth-child(2) {
  font-style: italic;
  color: #492c2c;
}

.icons img {
  width: 50px;
  height: auto;
}



#arrow {
  position: fixed;
  bottom: 50px;
  right: 0;
  display: none;
}

#logo-container {
  padding-top: 10px;
}

iframe {
  width: 100%;
  height: auto;
}

/*--------------------------------Tipografija--------------------------------*/
p {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.quote {
  font-family: 'Dancing Script', cursive;
}

.quote,
h1 {
  background-color: rgb(55, 47, 47, 0.5);
  padding: 20px;
  font-size: 6vw;
  font-family: 'Dancing Script', cursive;
}

.video-gallery video {
  border: 10px solid rgb(55, 47, 47, 0.5);
  ;
  width: 100%;
}
#nav-mobile > li:nth-child(2) {
    margin:20px;
    padding:20px;
   
}
iframe {
  display: block;
  width: 100%;
  height: 300px;

}