body {
			background-color: #e1f4fd;
			max-width: 1650px;
			margin-left: auto;
			margin-right: auto;
		}

		/**/
		 svg {
      display: block;
      width: 100%;
      height: 40px;
    }
    
    .wave-container {
      width: 200%;
    }

    .wave {
      fill: #00B6FF;
      animation: moveWave 50s linear infinite;
    }
    
    @keyframes moveWave {
      0%, 100% {
        transform: translateX(0);
      }
      50% {
        transform: translateX(-100%);
      }
    }
    /**/ 

		iframe {
			align-self: center;
			height: 670px;
			width: 75%;
			border: 0;
		}
		h4{
			font-size: 15px;
			line-height: 21px;
			color: #6d6e71;
			font-family: sans-serif;
		}
		h2{
			font-size: 15px;
			font-family: sans-serif;
		}
		:root {
		  --bojaPodloge: #2DA4EC;
		}

		.slika_Zaglavlje, .slika_ograda{
			display: flex;
			justify-content: space-around;
			align-self: center;
			margin-left: auto;
			margin-right: auto;
			padding-top: 15px;
			padding-bottom: 5px;
			width: 95%;
		}

		.modul_1a{
			display: flex;
			flex-wrap: wrap;
			height: auto;
			justify-content: center;
			background-color: #00B6FF;
		}


/* MODUL BOJA */

		.modul_1b{
			display: flex;
			justify-content: center;
			align-self: center;
			align-items: center;
			align-content: center;
			background-color: var(--bojaPodloge);
			padding-top: 5px;
			padding-bottom: 5px;
		}
				.panoBoja{
					background-color: var(--bojaPodloge);
				}
				.pozadina_1{ /* ispod boja ali se ne vidi) */
					height: auto;
					flex-grow: 1;
					display: flex;
					flex-wrap: wrap;
					justify-content: center;
					align-self: center;
					align-items: center;
					align-content: center;
					width: 100%;
				}

				.slimButton{
					display: flex;
					width: 250px;
					height: 25px;
					background-color: white;
					padding-left: 15px;
					padding-right: 10px;
					align-items: center;
					text-align: center;
					justify-content: center;
					border-radius: 10px;
					font-weight: bold;
					color: darkblue;
					font-size: 15px;
					font-family: sans-serif;
					border: 0px solid;
					transition: background-color 1s;
				}

/*   */


		.forma_blok_0{
			font-family: sans-serif;
			font-weight: bold;
			background-color: #00B6FF;
			font-family: sans-serif;
			font-weight: bold;
			justify-content: space-around;
			flex-wrap: wrap;
			flex-grow: 1;
			padding-left: 15px;
			padding-right: 15px;
			padding-top: 10px;
			width: 20%;
			color: white;
		}

		.inputUnos{  /* gore */
			height: 30px;
			font-size: 20px;
			text-align: center;
			width: 100%;
			margin-top: 10px;
			border-radius: 10px;
			border: 0px;
			align-self: center;
		}

/**/
		.checkboxDiv{
			margin-top: 10px;
			text-align: center;
			background-color: #E4E4E4;
			display: flex;
		  align-items: center;
		  text-align: left;
		  width: 98%;
		  margin-left: 5px;
		  border-radius: 5px;
		  color: darkblue;
		}
		.label {
		  display: inline-flex;
		  justify-content: center;
		  padding-right: 15px;
		  margin-right: 15px;
		}
		label{
			margin-left: 3px;
		}
		.inputRadio{
		  width: 23px;
		  height: 23px;
		  margin-left: 5px;
		  margin-right: 5px;
			}

/* */
		.myButton {
		  background-color: #37AEE2;
		  border-radius: .5rem;
		  box-sizing: border-box;
		  color: white;
		  display: flex;
		  font-size: 16px;
		  justify-content: center;
		  padding: 1rem 1.75rem;
		  text-decoration: none;
		  width: 100%;
		  border: 0;
		  cursor: pointer;
		  user-select: none;
		  -webkit-user-select: none;
		  padding-top: 15px;
		  margin-bottom: 15px;
		  box-shadow: 2px 2px 1px #FDFDFD;
		}
		.myButton:hover {
		  background-color: #1D95C9 !important;
		}

		.myButton_OK {
		  background-color: #27ba4e;
		  border-radius: .5rem;
		  box-sizing: border-box;
		  color: white;
		  display: flex;
		  font-size: 16px;
		  font-weight: bold;
		  justify-content: center;
		  padding: 1rem 1.75rem;
		  text-decoration: none;
		  width: 30%;
		  border: 0;
		  cursor: pointer;
		  user-select: none;
		  -webkit-user-select: none;
		  padding-top: 15px;
		  margin-bottom: 15px;
		  margin-left: auto;
		  margin-right: auto;
		  margin-top: 15px;
		}
		.myButton_OK:hover {
		  box-shadow: 5px 5px 5px #FDFDa6;
		  background-color: #1D95C9 !important;
		}
 
			input[type=radio]::-webkit-outer-spin-button { 
			    -webkit-appearance: none;
			    -moz-appearance: none;
			    appearance: none;
			    margin: 0; 
			}

.ral_slicice {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-content: center;
	width: 20px;
	height: 20px;
	margin: 5px;
}

/******* GUMBI OD RAL SLICICA ****** */

/* HIDE RADIO */
[type=radio] { 
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* IMAGE STYLES */
[type=radio] + img {
  cursor: pointer;
}

/* CHECKED STYLES */
.radio-1:checked + img {
    border-radius: 10px;
  	zoom: 70%;
  	border: 3px solid yellow !important;
}

input[type=text] {;
	background-color: #fade92;
  border: 0px solid;
	font-family: sans-serif;
	font-size: 16px;
	font-weight: bold;
}


/* FORMA */

.blueMask, .blueMask-kontakt_podaci{
		background-color: #3399FF;
		width: auto;
		margin-left: auto;
		margin-right: auto;
		opacity:  1;
		display: flex;
		justify-content: center;
		text-align: center;
		position: relative;
		padding-top: 35px;
		padding-bottom: 55px;
 }

 .box-forma{ 	
	 	background-color: #F0F3F4;
	 	display: inline-block;
	 	flex-wrap: wrap;
	 	align-self: center;
	 	border-radius: 15px;
	 	box-shadow: 5px 10px 18px #888888;
	 	text-align: center;
		flex-wrap: wrap;
		margin-left: auto;
		margin-right: auto;
		width: 90%;
 }
  .box-forma_finish{ 	
	 	background-color: #F0F3F4;
	 	display: inline-block;
	 	flex-wrap: wrap;
	 	align-self: center;
	 	border-radius: 15px;
	 	box-shadow: 5px 10px 18px #888888;
	 	text-align: center;
		flex-wrap: wrap;
		margin-left: auto;
		margin-right: auto;
 }
   .box-forma_finish_slanje{ 	
	 	background-color: #F0F3F4;
	 	display: inline-block;
	 	flex-wrap: wrap;
	 	align-self: center;
	 	border-radius: 15px;
	 	box-shadow: 5px 10px 18px #888888;
	 	text-align: center;
		flex-wrap: wrap;
		margin-left: auto;
		margin-right: auto;
		width: 50%;
		margin-top: 60px;
		margin-bottom: 60px;
 }
 .siva_traka_gumba_korisnik{
 	margin-top: 15px;
 	margin-bottom: 30px;
 	font-family: sans-serif;
 }
 .siva_trakica_umetak{
 	margin-bottom: 5px;
 }
			.naziv_inputa_korisnik{
				font-family: sans-serif;
				font-size: 18px;
				font-weight: bold;
				text-align: left;
				margin-left: 30px;
			}
			.naziv_inputa_korisnik_slanje{
				font-family: sans-serif;
				font-size: 18px;
				font-weight: bold;
				text-align: center;
				margin-left: 30px;
				margin-top: 50px;
				margin-bottom: 50px;
				color: darkblue;
			}
			.input_korisnik{
				background-color: white;
				height: 30px;
				width: 90%;
				text-align: left;
				color: blue;
				font-family: sans-serif;
				font-size: 50px;
				padding-left: 10px;

			}
			.input_napomena{
				background-color: white;
				min-height: 50px;
				width: 90%;
				text-align: left;
				color: blue;
				font-family: sans-serif;
				font-size: 18px;
				font-style: italic;
				resize:none;
			}

.naziv_forme{
	display: flex;
	font-family: sans-serif;
	font-weight: bold;
	font-size: 18px;
	margin-top: 15px;
	margin-bottom: 15px;
	text-align: center;
	justify-content: center;
}

/* a4 */

.naziv_specifikacija{
	background-color: lightgrey;
	color: darkblue;
	height: 40px;
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 15px;
	padding-left: 10px;
	padding-right: 10px;
	font-family: sans-serif;
	font-size: 18px;
	font-weight: bold;
	text-align: left;
	width: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.blok_F{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	background-color: var(--bojaPodloge);
}

.div_to_PDF {
	width: 780px;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
	margin-top: 10px;
	display: inline-block;
	height: 1090px;
}

.red_POZICIJA{
	display: flex;
	justify-content: space-between;
	width: 350px;
	align-content: center;
	flex-wrap: wrap;
	text-align: center;
	height: 32px;
	padding-left: 10px;
	color: darkblue;
}

.red_POZICIJA_NASLOV{
	display: flex;
	justify-content: space-between;
	width: 465px;
	align-content: center;
	flex-wrap: wrap;
	text-align: center;
	height: 33px;
	background-color: lightgrey;
	margin-left: 10px;
	color: black;
}

.tabl_poz {   /* imena plavih stavki u specifikaciji */
	height: auto;
	border: 0px solid;
	font-size: 13px;
	font-weight: bold;
	font-family: sans-serif;
	padding-left: 15px;
	padding-right: 15px;
	text-align: left;
	margin-top: 15px;
	margin-bottom: 15px;
	align-self: left;
}

.SIVA_ZONA{
	display: flex;
  justify-content: space-between;
  width: 480px;
	align-items: center;
}


.odabrano {  /*input*/
	color: darkblue;
	background-color: #DADADA;
	width: 130px;
	border: 0px solid;
	text-align: center;
	font-size: 13px;
	font-weight: bold;
	font-family: sans-serif;
	margin-top: 15px;
	margin-bottom: 15px;
}	
.modul_3{
	display: flex;
	flex-wrap: wrap;
	height: 580px;
}
				.lijeviMenu{
					width: 325px;
					flex: 1;
				}
				.lijeviMenu_parametri{
					flex: 1;
					width: 180px;
					text-align: center;
				}
				.desniMenu{
					width: 280px;
					display: flow;
					flex-wrap: wrap;
					text-align: left;
				}
				.forma_blok{
					font-family: sans-serif;
					font-weight: bold;
					background-color: #e1f4fd;
					padding-top: 5px;
					padding-bottom: 5px;
					padding-left: 15px;
					height: auto;
				}

.red_POZICIJA_ime {
					margin-left: 15px;
					margin-right: 15px;
					padding-bottom: 15px;
					min-height: 30px;
					width: 100%;
					display: flex;
					flex-wrap: wrap;
				}
.imeIPrezime_tvrtka {   /* IME I PREZIME ili IME TVRTKE, email-adresa */
					color: darkblue;
					font-family: sans-serif;
					font-weight: bold;
					font-size: 13px;
					width: auto;
					height: 30px;
					display: flex;
					justify-content: center;
					align-items: center;
					background-color: #c2ebff;
					padding-left: 15px;
					padding-right: 15px;
					margin-bottom: 5px;
					margin-top: 5px;
				}
				.odabrano_tvrtka { 
					color: darkblue;
					font-family: sans-serif;
					font-weight: bold;
					font-size: 12px;
					width: auto;
					height: 20px;
					display: flex;
				  justify-content: center;
				  align-items: center;
				  padding-left: 15px;
					padding-right: 15px; 
					align-self: center;
				}
				.odabrano_napomena {
					color: darkblue;  /* boja texta u tablicama */
					font-family: sans-serif;
					font-weight: bold;
					height: auto;
					width: 80%;
					font-size: 12px;
					margin-left: 10px;
					margin-right: 10px;
					margin-top: 4px;
					padding-right: 15px;
					display: flex;
					resize:none;
					word-break:break-word;
				}


.polje_screen{
	display: flex;
	align-self: center;
	justify-content: space-around;
	padding-top: 10px;
	padding-bottom: 10px;
	width: 60%;
	height: 220px;
	background-color: #c2ebff;
	background-repeat: no-repeat;
	background-size: contain;
	margin-left: auto;
	margin-right: auto;
}
.red_polje_screen {
				display: inline-flex;
				flex-wrap: wrap;			
				font-family: sans-serif;
				font-weight: bold;
				width: auto;
				height: auto;
				font-size: 10px;
				align-items: center;
				text-align: center;
				padding-top: 2px;
				padding-bottom: 2px;
				justify-content: center;
			}	


.blok_zavrsi {
	width: 100%;
	height: auto;
	background-color: var(--bojaPodloge);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	margin-left: auto;
	margin-right: auto;
}

/* */ 

@media (max-width:800px){
				.lijeviMenu{
					width: 100%;
					align-items: center;
					justify-content: center;
				} .desniMenu{
					width: 100%;
				} .forma_blok_0 {
					flex-direction: column;
					align-items: center;
					width: 100%;
					margin-left: -10px;
					padding-right: 25px;
					width: 100%;
					padding-left: 25px;
				} iframe{
					width: 100%;
					zoom: 35%;
				} .myButton_OK{
					width: 90%;
				} .box-forma_finish_slanje{
					width: 95%;
				} .polje_screen{
					width: 95%;
					height: 300px;
				} .red_POZICIJA{
					width: auto;
					display: flex;
					justify-content: center;
				} .forma_blok{ /* izracun */
					text-align: center;
					margin-top: -15px;
				} .tabl_poz{
					width: 100%;
					text-align: center;
					justify-content: center;
					font-size: 18px;
				} .odabrano{
					align-items: center;
					font-size: 21px;
					width: 250px;
				} .div_to_PDF{
					height: 2300px;
				}
		}

@media (max-width: 600px) {
    .tabl_poz {
        width: 100%;  /* Puno šira za manje ekrane */
        font-size: 12px;  /* Manji font za manji prostor */
    }
}

@media (min-width: 601px) {
    .tabl_poz {
        width: 300px;  /* Fiksna širina za veće ekrane */
    }
}		


/* button x */

.close {
  position: absolute;
  right: 40px;
  top: 40px;
  width: 40px;
  height: 40px;
  opacity: 0.5;
  cursor: pointer;
  background-color: white;
  border-radius: 5px;
}
.close:hover {
  opacity: 1;
}
.close:before, .close:after {
  position: absolute;
  left: 20px;
  content: '';
  height: 42px;
  width: 2px;
  background-color: #333;
}
.close:before {
  transform: rotate(45deg);
}
.close:after {
  transform: rotate(-45deg);
}

/**/

.napomena{
	font-family: sans-serif;
	text-align: center;
	color: darkblue;
	font-size: 12px;
	font-weight: bold;
	margin-top: 15px;
	margin-bottom: 10px;
	display: block;
	position: relative;
}