@font-face {
	font-family: 'Rubik';
	font-display: auto;
	font-style: normal;
	font-weight: 300;
	src: url('fonts/Rubik-Light.ttf') format('truetype');
}

@font-face {
	font-family: 'Rubik';
	font-display: auto;
	font-style: normal;
	font-weight: 900;
	src: url('fonts/Rubik-ExtraBold.ttf') format('truetype');
}



html, body	{-webkit-text-size-adjust: 100%; }
body		{ margin: 0; padding: 0; font-family: 'Rubik'; font-weight: 300; font-size:14px; line-height:16px; background-color: white; color: black; text-align: center; }
A:link      	{ text-decoration: none; color: black; }
A:visited   	{ text-decoration: none; color: black; }
A:hover     	{ text-decoration: none; color: black; }
A:active    	{ text-decoration: none; color: black; }

.d1 { width: 1200px; display: inline-block; margin: 20px 0 0 0; background-color: white; }
.meni1 { font-weight: bold; font-size: 16px; width: 90px; height: 87px; display: inline-block; border: 0; background-color: white; cursor: pointer; }
.meni2 { font-weight: bold; font-size: 16px; background-color: #fa3aab; color: white; display: inline-block; padding: 13px 17px 13px 17px; float: right; margin: 25px 0 0 20px; }
.meni3 { font-weight: bold; font-size: 16px; background-color: #fa3aab; color: white; display: inline-block; padding: 13px 17px 13px 17px; }

.dropbtn {
  padding: 16px;
  font-size: 16px;
  border: none;
}

.dropdown {
	position: relative;
	display: inline-block;
	vertical-align: top;
}

.dropdown-content {
	background-color: white;
	border: 1px #f0f0f0 solid;
	color: black;
	display: none;
	position: absolute;
	min-width: 200px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
	margin: -25px 0 0 0;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
	border-bottom: 1px silver solid;
}

.dropdown-content a:hover {background-color: #ddd;}
.dropdown:hover .dropdown-content {display: block;}
.dropdown:hover .dropbtn {background-color: red;}


.d2 { width: 49px; margin: 0 40px 0 0; display: inline-block; }
.d3 { width: 437px; margin: 0 0 0 40px; display: inline-block; }

.slika1x5 { width: 1200px; animation-name: ss5; animation-duration: 5s; margin: 0; }
.slika1x5male { width: 120px; margin: 5px; }
.slika1x5male:hover { border: 5px #fa3aab solid; margin: 0; }

@keyframes aa5 {
	  0% { margin: 0 0 0 0; }
	 19% { margin: 0 0 0 0; }
	 20% { margin: -400px 0 0 0; }
	 39% { margin: -400px 0 0 0; }
	 40% { margin: -800px 0 0 0; }
	 59% { margin: -800px 0 0 0; }
	 60% { margin: -1200px 0 0 0; }
	 79% { margin: -1200px 0 0 0; }
	 80% { margin: -1600px 0 0 0; }
	 99% { margin: -1600px 0 0 0; }
	100% { margin: -2000px 0 0 0; }
}

@-webkit-keyframes aa5 {
	  0% { margin: 0 0 0 0; }
	 19% { margin: 0 0 0 0; }
	 20% { margin: -400px 0 0 0; }
	 39% { margin: -400px 0 0 0; }
	 40% { margin: -800px 0 0 0; }
	 59% { margin: -800px 0 0 0; }
	 60% { margin: -1200px 0 0 0; }
	 79% { margin: -1200px 0 0 0; }
	 80% { margin: -1600px 0 0 0; }
	 99% { margin: -1600px 0 0 0; }
	100% { margin: -2000px 0 0 0; }
}


.pasica1 { text-align: center; font-size: 32px; font-weight: 900; margin: 30px 0 30px 0; }
.vec1 { text-align: right; font-size: 16px; font-weight: bold; margin: 30px 0 30px 0; }
.vec2 { text-align: right; font-size: 16px; margin: 20px 0 30px 0; width: 100%; }

.novice1 { text-align: center; width: 100%; max-width: 1200px; padding: 30px 0 0 0; }

.cl1 { width: 380px; display: inline-block; margin: 5px 5px 30px 5px; text-align: left; vertical-align: top; }
.cl1pag { background-color: #fa3aab; color: white; font-weight: bold; padding: 5px; margin: 0; }
.cl1datum { font-weight: bold; font-size: 12px; }
.cl1nasl { font-size: 24px; color: #fa3aab; font-weight: bold; line-height: 110%; margin: 0 0 10px 0; }

.cl2 { width: 100%; max-width: 600px; display: inline-block; margin: 30px 5px 30px 5px; text-align: left; vertical-align: top; }
.cl2pag { background-color: #fa3aab; color: white; font-weight: bold; padding: 5px; margin: 0 0 30px 0; }
.cl2datum { font-weight: bold; font-size: 16px; margin: 10px 0 0 0; }
.cl2nasl { font-size: 64px; color: #fa3aab; font-weight: bold; line-height: 110%; margin: 10px 0 30px 0; }
.cl2podnasl { font-size: 20px; line-height: 150%; font-weight: bold; margin: 0 0 30px 0; }
.cl2txt { font-size: 16px; color: black; line-height: 170%; margin: 0 0 30px 0; }
.cl2avtor { font-size: 18px; color: black; font-weight: bold; line-height: 110%; margin: 0 0 30px 0; text-align: right; border-top: 1px silver solid; padding: 30px 30px 0 30px; display: inline-block; float: right; }

.cl3 { margin: 5px 5px 30px 5px; text-align: left; vertical-align: top; width: 100%; max-width: 600px; }
.cl3sl { width: 280px; display: inline-block; margin: 0 10px 0 0; }
.cl3pag { background-color: #fa3aab; color: white; font-weight: bold; padding: 5px; margin: 0; display: inline-block;}
.cl3datum { font-weight: bold; font-size: 12px; margin: 5px 0 0 0;}
.cl3nasl { font-size: 24px; color: #fa3aab; font-weight: bold; line-height: 110%; margin: 0 0 10px 0; }
.cl3podnasl { font-size: 18px; line-height: 130%; }

.cl4 { width: 100%; max-width: 640px; display: inline-block; margin: 30px 5px 30px 5px; text-align: left; vertical-align: top; font-size: 18px; line-height: 160%; }
.cl4nasl { font-size: 48px; color: #fa3aab; font-weight: bold; line-height: 110%; margin: 10px 0 30px 0; }

.konec2 { width: 100%; max-width: 280px; text-align: left; display: inline-block; font-size: 18px; vertical-align: top; line-height: 150%; }

label { font-size: 16px; background-color: #e2e2e2; width: 100%; padding: 5px; }
.frm1 { font-size: 16px; font-weight: bold; padding: 10px; width: 400px; }
.frm2 { padding: 15px 35px 15px 35px; font-size: 20px; font-weight: bold; background-color: #fa3aab; color: white; border:0; }

select { padding: 7px; font-size: 16px; line-height: 150%; }




@media only screen and (max-width: 500px) {

	.d2 { width: 49px; margin: 0 20px 0 0; display: inline-block; }


}