*{
	margin:0;
	padding:0;
}
html,body{
    height:100%;
    width:100%; 
	  
}
#glava{
	background-color:white;
	position:sticky;
	top:0;
	display: flex;
	height:80px;
	justify-content: center;   
	align-items: center; 
}
#foot{
	background-color:white;
	position:sticky;
	bottom:0;
	display: flex;
	justify-content: center;   
	align-items: center; 
}
#main{
	background-color:grey;
	background-repeat:no-repeat;
	background-size: cover;
	display: flex;
	flex-direction:column;
	min-height:100vh;
	justify-content: center;   
	align-items: center; 	
}
#head{
	margin-top:-30px;
	width:100px;
	height:100px;
	margin-left:100px;
}
#nas{
	width:300px;
	height:60px;
	margin-top:-50px;
	margin-bottom:-20px;
}
#pol{
	width:900px;
	height:800px;
	background-color: #8B0000;
	border:solid 2px #1c0000;
	border-radius:7px;
	box-shadow: 0 10px 70px black;
}
#pol:hover{
	 box-shadow: 0 10px 70px red;
}
#nas h1{
	margin-left:-40px;
	font-family: Impact, fantasy;
	color: black;
}
.vnos{
	padding-top:20px;
	background-color:#69010c;
	border:solid 2px;
	width:500px;
	height:150px;
	margin-left:50px;
	padding-left:20px;
	border-radius:7px;
	display:inline-block;
}
.vnos:hover{
	box-shadow: 0 10px 70px red;
}
.user{
	color:white;
	margin-left:20px;
	width:200px;
	background-color:#0d0d0d;
	height:30px;
	margin-bottom:20px;
	border-radius: 7px;
}
.user:hover{
	border:solid 1px red;
}
.long{
	color:white;
	margin-left:20px;
	width:430px;
	background-color:#0d0d0d;
	height:30px;
	margin-bottom:20px;
	border-radius: 7px;
}
.long:hover{
	border:solid 1px red;
}
.button{
	margin-left:47px;
	margin-top:30px;
	width:150px;
	background-color:#0d0d0d;
	height:50px;
	color:grey;
	border-radius: 7px;
	font-size:20px;
}
.button:hover{
	border:dotted 2px red;
	color:white;
	box-shadow: 0 10px 70px red;
}

#fill{
	margin-top:10px;
	margin-left:30px;
	margin-bottom:20px;
}
#fill h3{
	font-family: Impact, fantasy;
	color: white;
    text-shadow: 8px 8px 12px #000000;
}
.polj{}
.vnosi{
	padding-top:20px;
	background-color:#69010c;
	border:solid 2px;
	width:500px;
	height:190px;
	margin-top:30px;
	margin-left:50px;
	padding-left:20px;
	border-radius:7px;
}
.vnosi:hover{
	box-shadow: 0 10px 70px red;
}
.area{
	color:white;
	margin-left:20px;
	width:430px;
	background-color:#0d0d0d;
	height:70px;
	margin-bottom:20px;
	border-radius: 7px;
}
.area:hover{
	border:solid 1px red;
}
.ocene{
	padding-top:20px;
	background-color:#69010c;
	border:solid black 2px;
	width:500px;
	height:170px;
	margin-top:30px;
	margin-left:50px;
	padding-left:20px;
	border-radius:7px;
	color:white;
}
.ocene:hover{
	box-shadow: 0 10px 70px red;
}
.ocene {
	font-weight:bold;
}
.ocene  label:hover{
	color:red;
}
.nasl{
	font-weight:bold;
	color:white;
	margin-bottom:10px;
}
.marto{
	margin-top:40px;
	font-weight:bold;
	color:white;
	margin-bottom:10px;
}
#side{
	background-color:#69010c;
	border:solid 2px;
	width:250px;
	height:190px;
	border-radius:7px;
	position:relative;
	left:600px;
	top:86px;
}
.side{
	padding-top:20px;
	background-color:#69010c;
	border:solid black 2px;
	width:250px;
	height:616px;
	margin-right:30px;
	padding-left:20px;
	border-radius:7px;
	float:right;
	color:white;
}
.side a{
	text-decoration:none;
	color:white;
}
.side a:hover{
	box-shadow: 0 10px 70px yellow;
	border-radius:10px;
	border:solid 2px ;
	background:black;
}
.side:hover{
	box-shadow: 0 10px 70px red;
}
.side label{
	font-weight:bold;
}
.side  label:hover{
	color:red;
}
.sn{
	margin-top:20px;
	margin-bottom:60px;
}
.side img{
	margin-top:30px;
	margin-left:20px;

}
input{
	padding-left:10px;
}
textarea{
	padding:5px;
  	resize: none;
}
.swal2-popup {
    background: black !important;
    border-radius: 20px !important;
	color:white;
}
.vnos, .vnosi, .ocene, .side, .button, .swal2-popup, input , textarea{
	  font-family: "Science Gothic", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "wdth" 100,
    "CTRS" 0;
}