@font-face {
	font-family: monserat_regular;
	src: url(../fonts/Montserrat/Montserrat-Regular.ttf);
}
@font-face {
	font-family: monserat_semi;
	src: url(../fonts/Montserrat/Montserrat-SemiBold.ttf);
}
@font-face {
	font-family: monserat_black;
	src: url(../fonts/Montserrat/Montserrat-Black.ttf);
}
@font-face {
	font-family: raleway_regular;
	src: url(../fonts/Raleway/Raleway-Regular.ttf);
}
@font-face {
	font-family: raleway_semi;
	src: url(../fonts/Raleway/Raleway-SemiBold.ttf);
}
@font-face {
	font-family: news_regular;
	src: url(../fonts/News_Cycle/NewsCycle-Regular.ttf);
}
@font-face {
	font-family: lato_regular;
	src: url(../fonts/Lato2OFL/Lato-Regular.ttf);
}
@font-face {
	font-family: titillium_regular;
	src: url(../fonts/Titillium_Web/TitilliumWeb-Regular.ttf);
}
@font-face {
	font-family: titillium_semi;
	src: url(../fonts/Titillium_Web/TitilliumWeb-SemiBold.ttf);
}
@font-face {
	font-family: titillium_bold;
	src: url(../fonts/Titillium_Web/TitilliumWeb-Bold.ttf);
}
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
ul, li {
	list-style: none;
}
#wrapper {
	/*max-width: 1366px;
	margin: 0 auto;*/
}
header {
	position: fixed;
	top: 0;
	width: 100%;
	max-width: inherit;
	z-index: 100;
}
#top_info {
	/*background: rgb(28, 33, 40);*/
	background: rgb(15,15,70);
	color: rgb(255, 255, 255);
	font-family: monserat_regular, sans-serif;
	font-size: 13px;
	width: 100%;
	position: relative;
}
.top_info_show {
	height: 60px;
	padding: 10px 0;
	transition: height 200ms, padding 200ms;
}
.top_info_hide {
	height: 0;
	padding: 0;
	transition: height 200ms, padding 200ms;
}
#top_info_drzac_info {
	width: 100%;
	max-width: 1349px;
	padding: 0 140px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#top_info div {
	display: inline-block;
}
#top_tel {
	padding-right: 15px;
	padding-left: 17px;
	background-image: url(../img/icon_phone.png);
	background-size: 12px;
	background-repeat: no-repeat;
	background-position: 0% 50%;
}
#top_mail {
	padding-right: 13px;
	padding-left: 20px;
	background-image: url(../img/envelope.png);
	background-size: 15px;
	background-repeat: no-repeat;
	background-position: 0% 50%;
}
#top_web {
	padding-left: 20px;
	background-image: url(../img/web.png);
	background-size: 15px;
	background-repeat: no-repeat;
	background-position: 0% 50%;
}
#navigacija {
	background: rgb(255, 255, 255);
	display: table;
	width: 100%;
	position: relative;
}
.navigacija_noshadow {
	border-bottom: none;
}
.navigacija_shadow {
	border-bottom: 1px solid rgb(240, 240, 240);
}
#drzac_navigacije {
	position: relative;
	display: table;
	width: 100%;
	max-width: 1349px;
	padding: 0 140px;
	margin: 0 auto;
}
#logo_img {
	width: 200px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
#list_menu_icon {
	display: none;
}
nav {
	display: table-cell;
	text-align: right;
}
nav::after {
	content: "";
	display: table;
	clear: both;
}
nav #main_ul {
	float: right;
}
nav #main_ul::after {
	content: "";
	display: table;
	clear: both;
}
nav #main_ul li {
	float: left;
	display: block;
}
#main_ul a {
	color: rgb(1, 1, 1);
	font-family: raleway_semi, sans-serif;
	text-decoration: none;
	padding: 30px 20px 20px;
	font-size: 13px;
	line-height: 1em;
	display: table-cell;
	vertical-align: middle;
	border-bottom: 5px solid rgb(255, 255, 255);
}
#main_ul a:hover {
	border-bottom: 5px solid rgb(0, 181, 239);
}
.submenu {
	display: none;
}
#menu_proizvodi {
	position: relative;
}
#menu_proizvodi:hover .submenu {
	display: block;
	position: absolute;
	left: 0;
	top: 68px;
	box-shadow: 0 0 4px 0 rgba(50, 50, 50, 0.3);
}
.submenu li {
	background: rgb(255, 255, 255);
	display: block;
	float: none;
}
.submenu a {
	padding: 10px 20px 10px;
	display: block !important;
	width: 200px;
	text-align: left;
	border-bottom: 1px solid rgb(180, 180, 180) !important;
}
.submenu a:hover {
	background: rgb(245, 245, 245);
}


#fill1 {
	width: 100%;
	height: 60px;
}
#fill2 {
	width: 100%;
	height: 68px;
}


/* ############################################# PROMO ################################################*/

#promo {
	width: 100%;
	height: 300px;
	position: relative;
	overflow: hidden;
}
#promo_after {
	height: 5px;
	background: rgb(50, 50, 50);
}
#promo_img {
	position: absolute;
	left: 0;
	/*top: -280px;*/
	top: -150px;
	width: 71%;
}
#logout {
	position: absolute;
	left: 140px;
	bottom: 50px;
	padding: 15px;
	z-index: 2;
	background: rgb(245, 245, 245);
	text-decoration: none;
	color: rgb(30, 30, 30);
	font-family: raleway_regular, sans-serif;
	letter-spacing: 1px;
	box-shadow: 0 0 4px 0 rgba(50, 50, 50, 0.5);
	border-radius: 2px;
}
#logout:hover {
	background: rgb(250, 250, 250);
	box-shadow: 0 0 6px 0 rgba(50, 50, 50, 0.8);
}
#promo_gradient {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 400px;
	background: linear-gradient(to right, rgba(240, 240, 240, 0), rgba(240, 240, 240, 0) 38%, rgba(240, 240, 240, 0.7) 47%, rgba(248, 248, 248, 1) 71%);
}

#promo_aplikacije {
	text-align: right;
	position: absolute;
	z-index: 2;
	right: 100px;
	bottom: 70px;
}
#promo_aplikacija_naslov {
	display: inline-block;
	vertical-align: top;
	padding-top: 10px;
}
#promo_aplikacija_naslov h2 {
	font-family: titillium_regular, sans-serif;
	font-size: 34px;
	color: rgb(110, 110, 110);
	line-height: 1em;
	letter-spacing: 2px;
}
#promo_aplikacija_naslov h3 {
	font-family: titillium_bold, sans-serif;
	font-size: 22px;
	color: rgb(45, 45, 45);
	line-height: 1em;
	letter-spacing: 1px;
	padding-top: 7px;
}
#promo_aplikacija_img {
	width: 80px;
	margin-right: 30px;
	margin-bottom: 10px;
}
#promo_aplikacija_text {
	width: 640px;
}
#promo_aplikacija_text p {
	font-family: titillium_regular, sans-serif;
	font-size: 15px;
	color: rgb(0, 0, 0);
	line-height: 1.3em;
}
#semi_naslov {
	font-family: titillium_semi !important, sans-serif;
	padding-bottom: 3px;
}
#promo_aplikacija_text span {
	font-family: titillium_semi, sans-serif;
}



/* ################################################ KP ##########################################*/

#kp {
	padding: 50px 140px;
}
#kp h1 {
	font-family: raleway_semi, sans-serif;
	font-size: 32px;
	color: rgb(50, 50, 50);
	padding-bottom: 4px;
}
#kp p, #kp td, #kp th {
	font-family: titillium_regular, sans-serif;
	font-size: 16px;
	color: rgb(80, 80, 80);
}
#uvod ul {
	color: rgb(80, 80, 80);
	padding: 10px 0 25px;
}
#uvod ul li {
	font-family: titillium_regular, sans-serif;
}
#uvod > p:nth-of-type(1) {
	padding: 30px 0 25px;
}
#uvod > p:nth-of-type(1), #uvod > p:nth-of-type(2), #uvod > p:nth-of-type(3), #uvod li span {
	font-family: titillium_semi, sans-serif;
	font-size: 16px;
	width: 70%;
	text-align: justify;
}
#kp h3 {
	font-family: raleway_semi, sans-serif;
	font-size: 22px;
	color: rgb(70, 70, 70);
	padding: 10px 0 10px 7px;
	margin-bottom: 36px;
	/*background: rgb(200, 216, 222);*/
	background: rgb(209, 228, 235);
	/*background: rgb(27, 186, 225);*/
}
#prvi_opis {
	width: 70%;
	padding-top: 40px;
}
#prvi_opis p {
	padding: 7px 0 7px 30px;
	background-image: url(../img/ok.png);
	background-repeat: no-repeat;
	background-size: 20px;
	background-position: left center;
}
#prvi_opis p span  {
	font-family: titillium_semi, sans-serif;
}
#prvi_opis p a  {
	font-family: titillium_semi, sans-serif;
}
#prvi_opis p a:hover {
	color: rgb(30, 30, 30);
}




#kome {
	padding-top: 40px;
	width: 70%;
}
#kome p {
	padding: 7px 0 7px 30px;
	background-image: url(../img/ok.png);
	background-repeat: no-repeat;
	background-size: 20px;
	background-position: left center;
}





#tehnicki_opis {
	padding-top: 40px;
	width: 70%;
}
#tehnicki_opis p {
	padding: 4px 0 4px 30px;
	background-image: url(../img/arrow.png);
	background-repeat: no-repeat;
	background-size: 15px;
	background-position: left center;
}
#tehnicki_opis span {
	font-family: raleway_semi, sans-serif;
}



#pregled_opcija {
	padding-top: 40px;
	width: 70%;
}
#pregled_opcija h3 {
	margin-bottom: 30px;
}
.opcija {
	margin-top: 15px;
}
.opcija > div img {
	width: 250px;
	padding: 5px 0 20px 20px;
}
.opcija > div p {
	padding: 20px;
	text-align: justify;
	line-height: 1.3em;
}
.klik_opcija {
	font-family: raleway_semi, sans-serif !important;
	font-size: 16px;
	padding: 10px;
	border: 1px solid rgb(150, 150, 150);
	border-radius: 2px;
	cursor: pointer;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.klik_opcija:hover {
	background: rgb(242, 242, 242);
	text-decoration: underline;
}
.klik_opcija span {
	display: none;
	position: absolute;
	top: 50%;
	right: 45px;
	transform: translateY(-50%);
	font-family: monserat_semi, sans-serif;
	font-size: 17px;
	color: rgb(130, 130, 130);
}
.klik_opcija:hover span {
	display: inline-block;
}
.klik_opcija img {
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	width: 15px;
}
.zatvorena_opcija {
	max-height: 0;
	width: 100%;
	overflow: hidden;
	border: 0 solid rgb(255, 255, 255);
	background: rgb(254, 254, 254);
	transition: max-height 600ms ease-out, border 600ms ease-in;
}
.otvorena_opcija {
	max-height: 1000px;
	overflow: hidden;
	border: 1px solid rgb(200, 200, 200);
	background: rgb(254, 254, 254);
	transition: max-height 600ms ease-in, border 100ms ease-in;
}




#download_section {
	padding-top: 80px;
}
#download_section h2 {
	font-family: raleway_semi, sans-serif;
	font-size: 36px;
	margin-bottom: 40px;
	color: rgb(50, 50, 50);
}
#download_section h3 {
	padding-left: 60px;
	background-image: url(../img/zip.png);
	background-repeat: no-repeat;
	background-size: 30px;
	background-position: 10px center;
}
.kp_sirina {
	width: 80%;
}
#download_section p {
	padding-bottom: 10px;
	/*font-family: titillium_regular, sans-serif !important;*/
	font-size: 15px !important;
}
#download_section > p:nth-of-type(1), #download_section > p:nth-of-type(2), #download_section > p:nth-of-type(3), #download_section > p:nth-of-type(4) {
	font-family: monserat_black !important;
	font-size: 18px !important;
	letter-spacing: 1px !important;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4) !important;
	color: rgb(230, 175, 0);
	padding: 4px 0 !important;
}
#download_section > p:nth-of-type(2), #download_section > p:nth-of-type(3), #download_section > p:nth-of-type(4) {
	color: rgb(127, 140, 163);
}
#download_section > p:nth-of-type(2) span {
	font-family: monserat_black !important;
	font-size: 18px !important;
	letter-spacing: 1px !important;
	color: rgb(230, 175, 0);
}
.kp_kategorija {
	font-family: titillium_semi, sans-serif;
	font-size: 20px;
	padding-bottom: 15px;
}
#download_section ul {
	padding-bottom: 10px;
}
#download_section li, #download_section h4 {
	font-family: titillium_regular, sans-serif;
	color: rgb(80, 80, 80);
}
#download_section h4 {
	font-size: 18px;
	padding-bottom: 10px;
}
#download_section li {
	font-size: 15px;
	padding-left: 30px;
	background-image: url(../img/arrow.png);
	background-repeat: no-repeat;
	background-size: 15px;
	background-position: left center;
}
#download_section span {
	font-family: titillium_semi, sans-serif;
}
.naziv_link {
	text-decoration: none;
}
.naziv_link:hover h3 {
	background-color: rgb(247, 218, 47) !important;
	color: rgb(255, 20, 10) !important;
}
.napomena {
	font-family: titillium_semi, sans-serif !important;
	color: rgb(255, 0, 0) !important;
}
.napomena + p {
	font-family: titillium_semi, sans-serif !important;
}

#kp_singl {
	margin-top: 30px;
}
#kp_singl, #kp_mreza {
	padding-bottom: 40px;
}
#kp_singl, #kp_mreza, #kp_net {
	position: relative;
}
.download_ikona {
	position: absolute;
	top: 82px;
	right: 0;
	width: 200px;
}
#download_section hr {
	margin: 13px 0;
}



.cena_cena {
	font-family: monserat_black !important;
	font-size: 44px !important;
	letter-spacing: 10px;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.7) !important;
	color: rgb(230, 175, 0) !important;
	padding: 20px 0 10px !important;
}
#cena_tabele {
	padding: 20px 0 40px;
}
#cena_tabele::after {
	content: "";
	display: table;
	clear: both;
}
#pojedinacne_licence {
	float: left;
	border-collapse: collapse;
}
#paketi {
	float: right;
	border-collapse: collapse;
}
#pojedinacne_licence th {
	text-align: center;
	background: rgb(200, 210, 255);
	padding: 5px;
}
#pojedinacne_licence tr {
	background: rgb(247, 247, 247);
}
#pojedinacne_licence tr:nth-of-type(2) {
	background: rgb(220, 230, 255);
}
#pojedinacne_licence td {
	padding: 5px;
}
#pojedinacne_licence tr:nth-of-type(2) td {
	width: 200px;
}
#paketi th {
	text-align: center;
	background: rgb(200, 210, 255);
	padding: 5px;
}
#paketi td {
	background: rgb(247, 247, 247);
	padding: 5px;
}
#paketi tr td:first-of-type {
	font-family: titillium_semi, sans-serif;
}
#paketi tr td:nth-of-type(2) {
	padding-left: 30px;
	padding-right: 30px;
}
#net_cena > p:first-of-type {
	padding-top: 10px;
}
