html {
	margin: auto;
	height: 100%;
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
}

/* sranje za telefon */
@media (max-width: 1080px) {
  #frontpage {
    background-size: cover;
  }
}

#frontpage {
  background-image: url("../img/main.jpg"); 
  background-repeat: no-repeat;
}

body {
  margin: 0;
}

a:hover, a:link , a:visited, a:active {
  color: black;
  text-decoration: none;
}

a:hover, .active {
  color: #cccccc !important;
}

#menubar {
  background-color: white;
  display: inline-flex;
  margin-top: 2vh;
  padding: 1vh 0vw 1vh 1.5vw;
}

#menubar a {
  margin: 0vh 1.5vw 0vh 1.5vw;
}

.cover {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.contain {
/*
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
*/
  background-size: contain;
/*
  -webkit-background-repeat: no-repeat;;
  -moz-background-repeat: no-repeat;;
  -o-background-repeat: no-repeat;;
*/
  background-repeat: no-repeat;;
}

.text { font-family : "Verdana"; }
.h10 { font-size : 1.4vh; }
.h11 { font-size : 1.6vh; }
.h12 { font-size : 1.8vh; }
.arrows { font-size : 3vh; }
.bold { font-weight : bold; }
.title { padding: 1vh 0vw; }
.center { text-align: center; }
.hidden { display: none; }

/* sranje za telefon */
@media (max-width: 1080px) {
  .besedilo span {
    display: block !important;
  }
  .spacer { display: none; }
}

.besedilo span {
  display: flex;
  margin: 1.4vh 3vw;	
}

#projects, #video {
  display: flex;
  flex-wrap: wrap;
  gap: 10vh 2vw;
  margin: auto;
  padding: 5vh 0vw;
  width: 82vw;
}

.projects-title {
  padding: 2vh 0vw;
}

/* sranje za telefon */
@media (max-width: 1080px) {
  .projects-image {
    height: 50vw !important;
    width: 80vw !important;
  }	
}

.projects-image {
  height: 50vh;
  width: 40vw;
}

/* sranje za telefon */
@media (max-width: 1080px) {
  .video-frame {
    width: 90vw !important;
    height: 50vw !important;
  }
}

.video-frame {
  width: 40vw;
  height: 22.5vw;
}

#project {
  padding: 2vh 3vw;
}

#slika-frame {
  height: 80vh;
  width: 70vw;
  display: inline-flex;
  flex-wrap: wrap;
}

#slika {
  width: 94%;
  background-position: center;
}

.gnav {
  width: 3%;
  height: 100%;
}

.gnav span {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* sranje za telefon */
@media (max-width: 1080px) {
  #slikice {
	float: none !important;
	display: flex !important;
    width: 86vw !important;
    gap: 2vw !important;
	padding: 4vw !important;
  }
  #slika-frame {
    height: 58vw !important;
    width: 94vw !important;
  }
  .slikica {
    width: 20vw !important;
	height: 12.5vw !important;
  }
}

#slikice {
  float: right;
  flex-wrap: wrap;
  display: inline-flex;
  width: 13vw;
  gap: 1vw;
}

.slikica {
  height: 3.75vw;
  width: 6vw;
  opacity: 0.5;
}

.slikica:hover, .active .slikica { opacity: 1 !important; }