html, body{
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	width: 100%;
	height: 100hv;
	margin: 0;
	padding: 0;
	background-color: #ededed;
}

input[type="text"], input[type="password"], input[type="date"], input[type="time"], input[type="email"], input[type="tel"], input[type="number"], select, textarea{
	color: #263949;
	font-size: 14px;
	padding: 10px 6px;
	border: 1px solid rgba(0, 0, 0, 0.33);
	background-color: #fff;
}

#cena_paketa{
  font-weight: bold;
  margin-left: 30px;
  font-size: 1.5em;
}

.hide, .hidden{
	display: none !important;
}

.inline-block{
	display: inline-block;
}

.float-left{
	float: left;
}

.float-right{
	float: right;
}

.full-width{
	display: inline-block;
	width: 100%;
	margin-top: 20px;
}

.full-width-popup{
	display: inline-block;
	width: 100%;
}

.container{
	margin-top: 10px;
	width: 100%;
	margin: auto;
	min-height: 86vh;
}


.wrapper{
	width: calc(100% - 275px);
	padding: 15px;
	position: absolute;
	top: 0;
	left: 245px;
	min-height: 100vh;
	background-color: #ededed;
}

h3{
	font-size: 24px;
	line-height: 29px;
	margin-bottom: 8px;
}

p{
	font-size: 14px;
	line-height: 17px;
/*	margin: 0; */
}

a, a:visited{
	transition: color .3s;
	color: #2E4150;
	text-decoration: none;
}

a:hover{
	color: #4AA5D9;
}

.center-text{
	text-align: center;
}

.center-v-h{
	padding: 10% 0 0 0;

}

/*LOGIN*/
.center-logo{
	width: 113px;
	margin: 0px calc(50% - 57px) 0px;
}

.label-center{
	width: 180px;
	margin: auto;
}

.login{
	position: absolute;
	top:150px;
	left: calc(50% - 120px - 323px);
	width: 446px;
	height: 490px;
	padding: 35px 90px;
	margin: auto;
	background-color: #2E4150;
	color: #fff;
	border-radius: 24px;
}

.login-form{
	width: 300px;
	margin: auto;
}

.login-form input[type="text"], .login-form input[type="password"]{
	width: calc(100% - 12px);
}

.submit-btn{
	width: 142px;
	height: 46px;
	background-color: #34AC55;
	color: #fff;
	text-align: center;
	font-size: 16px;
	margin: 6px calc(50% - 71px);
	border: 1px solid #34AC55;
	cursor: pointer;
}

.search-btn{
	background-color: #34AC55;
	color: #fff;
	text-align: center;
	font-size: 14px;
	padding: 10px;
	cursor: pointer;
	border: 1px solid #34AC55;
}


.errorMSG{
	text-align: center;
	color: #fc5603;
}
/*END Login*/



/*HEADER*/
.header{
	position: fixed;
	top: 0;
	padding:10px;
	width: 225px;
	background-color: #2E4150;
	color: #fff;
}

.header .logo{
	margin: 30px calc(50% - 57px);
}

.header-menu{
	min-height: calc(100vh - 285px);
}

.header-menu ul{
	list-style-type: none;
}


.header-menu ul li{
	margin-top: 20px;
	margin-bottom: 20px;
}

.header-menu ul li ul{
	padding: 0;
}

.header-menu ul li ul li{
	padding: 10px 10px 10px 40px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.header-menu ul li ul li a{
	display: inline-block;
	height: 30px;
	width: 100%;
}

.header-menu ul li span{
	float: right;
}

.header-menu img{
	margin-bottom: -5px;
}

.header a{
	text-decoration: none;
	color: #fff;
}

.underline-separator{
	height: 10px;
	border-bottom: 1px solid #fff;
	margin-bottom: 15px;
}

.header-bottom{
	min-height: 105px;
}

.menu ul li, .menulist ul li {
	cursor: pointer;
}

/*END Header*/


/*Search ugovori*/
.inline-input{
	width: calc(100% - 20px);
	padding: 0 3px;
	display: inline-block;
	margin:0 5px 15px 0;
	font-size: 12px;
}

.inline-input input, .inline-input select{
	width: calc(100% - 10px);
}

.datum_search input{
	font-size: 12px;
	width: calc(100% - 40px);
}
/*END Search ugovori*/


.heading{
	padding: 30px;
}



/*TABLE*/
table{
	width: 100%;
	font-size: 14px;
}

.korisnici{
	width: 100%;
}

tr:nth-child(even) {
	background: #F3F3F3;
}

tr:nth-child(odd) {
	background: #FFF;
}

td{
	padding: 8px;
	max-width: 200px;
}

th{
	padding: 20px 10px;
}

th div{
	font-size: 18px !important;
}

.korisnici th{
	max-width: 200px;
	padding:8px; 
}

th select{
	max-width: 180px;
	font-size: 12px;
}

td.action{
	min-width: 95px;
}

.row300{
	max-width: 300px;
}

.row260{
	max-width: 260px;
}

.row240{
	max-width: 240px;
}

.row200{
	max-width: 200px;
}

.row160{
	max-width: 160px;
}

.row135{
	max-width: 135px;
}

.row110{
	max-width: 110px;
}

.row100{
	max-width: 100px;
}

.row80{
	max-width: 100px;
}

.row65{
	max-width: 65px;
}


.proc4{
	width: 4%;
}

.proc4-5{
	width: 4.5%;
}

.proc5{
	width: 5%;
}

.proc5-5{
	width: 5.5%;
}

.proc8{
	width: 8%;
}

.proc10{
	width: 10%;
}

.proc12{
	width: 12%;
}

.proc12-5{
	width: 12.5%;
}

.proc15{
	width: 15%;
}

.proc16{
	width: 16%;
}














.circle{
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 12px;
	margin-right: 10px;
}

.btn-img{
	transition: transform .3s;

}

.btn-img:hover {
  transform: scale(1.2);
  cursor: pointer;
}

	/*popup description*/
.tooltip {
	padding:0 3px;
  position: relative;
  display: inline-block;
  margin: auto;
/*  min-width: 20px; */
}

table tr td:nth-child(1) .tooltip, table tr td:nth-child(2) .tooltip{
	float: right;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 70px;
  background-color: rgba(0, 0, 0, 0.7);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  top: -30px;
  left: -30px;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.tooltip .tooltiptext1 {
  visibility: hidden;
  min-width: 200px;
  background-color: rgba(0, 0, 0, 0.7);
  color: #fff;
  text-align: left;
  border-radius: 6px;
  padding: 10px;

  /* Position the tooltip */
  position: absolute;
  top: -30px;
  left: -30px;
  z-index: 1;
  transition: visibility .3s;
}

.tooltip:hover .tooltiptext1 {
  visibility: visible;
}
/*End popup describe*/
/*END TABLE*/



/*Novi ugovor*/
.large-box{
	float: left;
	width: 55%;
	margin: 0 20px 20px 0;
}

.small-box{
	width: 40%;
	margin: 0 20px 20px 0;
}

.white-box{
	padding: 20px;
	margin-top: 7px;
	background-color: #fff;
}

.white-box-popup{
	padding: 15px;
	margin-top: 7px;
	background-color: #fff;
}

.white-box .inline-block, .white-box-popup .inline-block{
	margin: 10px 15px 10px 0;
}

.white-box .inline-block input, .white-box .inline-block select, .white-box .inline-block textarea, .white-box-popup .inline-block input, .white-box-popup .inline-block select, .white-box-popup .inline-block textarea{
	border: #ededed solid 1px;
	background-color: #f6f6f6;
}

.large-input{
	width: 330px;
}

.medium-input{
	width: 200px;
}

.small-input{
	width: 150px;
}

.very-small-input{
	width: 100px;
}

.mini-input{
	width: 60px;
}

.left-box{
	width: 400px;
}

.right-box{
	border-left: 1px solid #000;
	padding-left: 20px;
}

.buttons-right{
	margin: 0px 30px;
}

.blue-button{
	min-width: 141px;
	height: 46px;
	border: 0;
	margin: 10px;
	background-color: #263949;
	color: #f5f5f5;
	cursor: pointer;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 16px;
}

.green-button{
	min-width: 141px;
	height: 46px;
	border: 0;
	margin: 10px;
	background-color: #34AC55;
	color: #f5f5f5;
	cursor: pointer;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 16px;
}

.grey-button{
	min-width: 141px;
	height: 46px;
	border: 0;
	margin: 10px;
	background-color: #ededed;
	cursor: pointer;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 16px;
}
/*END Novi ugovor*/


/*STATISTIKA*/
.rezultati_statistike{
	width: 50%;
	min-width: 500px;
	font-size: 24px;
	padding: 25px;
	margin-top: 40px;
	background-color: #F2F2F2;
}

.rezultati_statistike h2{
	margin:0;
	padding:  0px;
	font-size: 26px;
}

.statistika{
/*	margin-top: 50px;  */
}

.statistika_tabele{
	border:1px solid #000;
/*	max-width: 550px;  */
}

.statistika_tabele td:nth-child(2), .statistika_tabele td:nth-child(3), .statistika_tabele td:nth-child(4){
	text-align: right;
}

.row_div{
	display: flex;
  flex-wrap: nowrap;
}

.proc60{
	width: 60%;
	margin: 1.5%;
}

.row_div  .proc30 {
  width: 30%;
  margin: 1.5%;
}

.text_right{
	text-align: right;
}


.statistika_sub_rows .row_div:nth-child(1), 
.statistika_sub_rows .row_div:nth-child(2){
	width: calc(100% - 60px);
	margin-left: 40px;

}

.statistika_sub_rows .row_div:nth-child(3), 
.statistika_sub_rows .row_div:nth-child(4),
.statistika_sub_rows .row_div:nth-child(5){
	border-top: 1px solid #000;
	width: calc(100% - 60px);
	margin-left: 40px;
}




.statistika_paketi{
	border:1px solid #000;
	width: 100%;
	font-size: 18px;
}

.statistika_paketi th, .statistika_tabele th{
	padding: 20px 0px;
}

.statistika_paketi td:nth-child(3){
	text-align: center;
}

.statistika_paketi td:nth-child(4){
	text-align: right;
}


.rezultati_sum{
	vertical-align: top;
	padding: 40px;
}

.vertical_bottom{
	vertical-align: bottom;
}

.green_box{
	background-color: #2D4F48;
	color: #F2F2F2 ;
	width: 300px;
	height: 120px;
	padding: 20px;
	text-align: center;
	font-size: 32px;
	margin-bottom: 40px;
}

.blue_box{
	background-color: #2D364F;
	color: #F2F2F2;
	width: 300px;
	height: 120px;
	padding: 20px;
	text-align: center;
	font-size: 32px;
}

.blue_box div, .green_box div{
	font-size: 24px;
	margin-bottom: 20px !important;
}
/*END Statistika*/





h2#popup_h{
	padding: 0 0 20px 0;
	margin: 0;
	line-height: 1;
}


/*Korisnici*/
#password_error, #username_error, #email_error{
	color: red;
}
/*END Korisnici*/



/*FOOTER*/
.footer{
	clear: both;
	margin: 80px auto 0 auto;
	height: 40px;
	width: 100%;
	font-size: 16px;
	color: #D3F8B4;
}

.footer-text{
	position: absolute;
	left: calc(50% - 130px - 325px);
	width: 650px;
	text-align: center;
	color: #3A3A3A;
	clear: both;
	margin: 10px 10px;
}

.footer a:link, .footer a:visited {
	color: #005496;
	font-size: 16px;
	text-decoration: none;
	transition: 0.5s color;
}

.footer a:hover, .footer a:active {
	color:  #4AA5D9;
	font-size: 16px;
	text-decoration: none;
	transition: 0.5s color;
}
/*END Footer*/




/*PAGINATION*/
.pagination-potrazivanja{
	width: 300px;
	color: #1A0000;
	position: absolute;
	right: 250px;
	margin-top: 20px; 
}

.pagination-potrazivanja a{
	color: #1A0000;
}

div.pagination {
	clear:both;
	padding: 3px;
	margin: 3px;
	text-align:center;
}

div.pagination a {
	padding: 2px 5px 2px 5px;
	margin: 2px;
	border: 1px solid #494949;
	
	text-decoration: none; /* no underline */
	color: #494949;
}

div.pagination a:hover, div.pagination a:active {
	border: 1px solid #000;
	box-shadow: 1px 1px #95A885;
	color: #000;
}

div.pagination span.current {
	padding: 5px;
	margin: 2px;
	border: 1px solid #494949;
	
	font-weight: bold;
	background-color: #494949;
	color: #FFF;
}
div.pagination span.disabled {
	padding: 2px 5px 2px 5px;
	margin: 2px;
	border: 1px solid #EEE;

	color: #c8c8c8;
}
/*END Pagination*/

/*Popup*/
#popup-div{
	display: none;
	z-index: 10;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(150,150,150,0.5);
}

#popup-box{
	z-index: 15;
	min-width: 350px;
	max-width: 1150px;
	min-height: 350px;
	max-height: 85%;
  overflow: auto;
/*	margin: 50px auto 100px;
*/
	margin: 3% auto;	
	background-color: #fff;
	border: 1px solid #000;
	border-radius: 4px;
	padding: 15px;
	background-color: #F6F6F6;
}

.popup-header{
	background-color: #f5f5f5;
}

#popup-h{
	margin: 0;
	padding: 0;
	text-align: center;
}

#popup_content{
	clear: both;
}

#kill{
	background-color: red;
	color: #fff;
	font-weight: 900;
	border-radius: 4px;
	padding:5px 8px;
	cursor: pointer;
}

.send_sms{
	margin-right: 120px;
}
/*END Popup*/


@media print{

	.non-printable, input, select, button{ 
		display: none !important; 
	}

	 @page {
	 	size: auto;
/*		size: A4;  */
		margin: 25mm 25mm 25mm 25mm;  
	}

	.pagebreak{
      clear: both;
      page-break-after: always;
  }



	html, body {
    height: 99%;    
  	width: 210mm;  
  }

  .wrapper{
  	width: 210mm !important;
  	position: relative !important;
  	background-color: green !important;
  	left: 0px;
  }

  .container{
  	width: 210mm !important;
  	background-color: red !important;
  }

  .rezultati_statistike{
  	display: block !important;
  	width: 85%;
		font-size: 24px;
		padding: 10px;
		margin-top: 0px;
  }

  .rezultati_statistike h2{
  	padding: 0px;
  	margin: 0px;
  	font-size: 1em;
	}

  .rezultati_statistike th, .rezultati_statistike td{
  	padding: 0px;
  }

  .rezultati_sum{
  	margin-top: 50px;
  	display: block !important;
  	float: left;
  }

  .green_box, .blue_box{
  	width: 200px;
  	height: 100px;
  	display: inline-block;
  }

  .green_box div, .blue_box div{
  	height: 20px;
  }

  .green_box, .blue_box, .green_box div, .blue_box div{
  	padding: 0px;
  	margin:  0px;
  	font-size: 20px !important;
  	line-height: 1;
  	text-align: left;
  	color: #000;
  	
  }

  .full-with-form{
  	width: 210mm !important;
  	background-color: red !important;
  }

  .row100{
  	width: 8.2% !important;
  }

  .row200{
  	width: 16.4% !important;
  }

  .row300{
  	width: 26.6% !important;
  }

  table {
	  border-collapse: collapse;
	}

	tr {
	  border-bottom: 1pt solid black;
	}
 
}





@media only screen and (max-width: 1400px){
	table{
		font-size: 12px;
	}

	.header{
		width: 210px;
	}


	.wrapper{
		left: 230px;
		width: calc(100% - 250px);
	}




	/*STATISTIKA*/
	.rezultati_statistike{
		width: 550px !important;
		font-size: 16px !important;
	}

	.green_box, .blue_box{
    width: 200px;
    height: 100px;
    padding: 10px;
    text-align: center;
    font-size: 26px;
    margin-bottom: 30px;
	}

	.green_box div, .blue_box div{
		font-size: 16px;
	}

}

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

	/*STATISTIKA*/
	.rezultati_statistike{
		font-size: 14px;
	}

	.rezultati_statistike td{
		font-size: 14px;
	}

}