/*
 Copyright: www.kristjan-ortego.eu 2013 | All rights reserved
 Author: www.kristjan-ortego.eu
*/
@import url('font-awesome.css');

/* glavne nastavitve */
* { margin: 0; padding: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
body { font-size: 100%; font-family: Verdana, Arial, Helvetica, sans-serif; background-color: #808080; color: #000000; }
body.login { background: none; }
a { color: #333; text-decoration: none !important; }
a:hover { color:#DDDDDD; text-decoration: none; }
a:hover,a:focus,a:active { outline: 0; }
img { border:0; }
.cl { clear: both; }
.cl-right { clear: right; }
.cl-left { clear: left; }
.hidden { display: none !important; }
.errorBox { margin: 20px 0; padding: 10px; border: 1px solid #990000; font-size: 14px; }
.text-error { color: #990000; }
.successBox { margin: 20px 0; padding: 10px; border: 1px solid #009900; font-size: 14px; }
.text-success { color: #009900; }

/* login screen */
.loginContainer { display: table; width:100%; height: 100%; text-align: center; vertical-align: middle; }
.loginBox { display: table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle; }
.contentBox { display: block; width: 400px; margin: 0 auto; }
.boxHead { background-color: #444444; padding: 10px 5px; color: #FFFFFF; text-align: left; }
.boxHead i { margin: 0 5px 0 10px;}.boxContent { padding: 0; }
#loginForm { margin-top: 30px; }
#loginForm input,#loginForm button { position: relative; border: 1px solid #CCCCCC; color: #878787; padding: 10px 15px; width: 100%; outline: none; box-shadow: none; font-size: 15px; line-height: 18px; margin-bottom: 20px; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
#loginForm button { width: 120px; margin: 0 0 0 auto; cursor: pointer; }
#loginForm input:hover, #loginForm input:focus { color: #000000; }
@media (max-width: 480px) {
	.loginContainer { display: block; vertical-align: top; }
	.loginBox { display: block; text-align: center; vertical-align: top; }
	.contentBox { display: block; width: 100%; margin: 0 auto; }
}

/* top navigational bar */
.navbarTop { position: relative; padding: 0 10px 5px; }
.logo { display: inline-block; padding: 10px; font-size: 14px; color: #FFFFFF; }
.logo:hover { color: #FFFFFF; }
.logo strong { font-size: 22px; }
.logout { float: right; color: #FFFFFF; font-size: 14px; padding: 12px; }
.logout span { font-size: 14px; }
.menuTrigger { display: none; float: left; padding: 8px; margin-right: 10px; color: #FFFFFF; font-size: 22px; }
@media (max-width: 959px) {
	.logout span { display: none; }
}
@media (max-width: 480px) {
	.logo { font-size: 0px; padding: 10px 5px; }
	.logo strong { font-size: 18px; }
	.menuTrigger { display: inline-block; }
}

/* left navigational bar */
.navbarSide { display: block; position: relative; float:left; width: 230px; padding-top: 30px; }
.navbarSide ul { padding: 0px; margin: 0px; list-style-type: none; }
.navbarSide ul li { list-style-type: none; }
.navbarSide ul li i { margin-right: 5px; }
.navbarSide ul li span i { margin: 0px; }
.navbarSide ul > li > a { display: block; padding: 15px 20px; font-size: 15px; line-height: 25px; color: #FFFFFF; text-decoration: none; }
.navbarSide ul > li.active { background-color: #E3E3E3; }
.navbarSide ul > li.active a { color: #000000; }
.navbarSide ul > li.open > a, .navbarSide ul > li.active > a:hover, .navbarSide ul li ul li.active a { background-color: #E3E3E3; color: #FFFFFF; }
.navbarSide ul li ul { display: none; }
.navbarSide ul li.open ul { display: block; }
.navbarSide ul li ul li a { display: block; background: none; padding: 10px 0px; padding-left: 30px; text-decoration: none; color: #FFFFFF; }
.navbarSide ul li ul li a:hover,.navbarSide ul > li > a:hover,.navbarSide ul > li.open > a,.navbarSide ul > li.current > a { background: #555555; color: #FFFFFF; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
@media (max-width: 959px) {
	.navbarSide { width: 180px; }
	.navbarSide ul > li > a { padding: 10px 15px; font-size: 13px; line-height: 20px; }
}
@media (max-width: 480px) {
	.navbarSide { display:none; float:none; position: absolute; left: auto; top: auto; bottom: auto; width: 100%; z-index:100; padding-top:0; background-color: #808080; }
}
/* content */
.contentHolder { background-color: #FFFFFF; position: relative; margin-left: 230px; -webkit-border-radius: 10px 0px 0px 0px; border-radius: 10px 0px 0px 0px; -moz-box-shadow: -2px -2px 5px 1px #000000; -webkit-box-shadow: -2px -2px 5px 1px #000000; box-shadow: -1px -1px 10px 1px #000000; padding: 30px 40px; }
.breadcrumb { padding: 8px 15px; margin: 0 0 20px 0; list-style: none; background-color: #F5F5F5; }
#vsebinaContainer { display: block; width: 100%; height: 100%; }
.btn { margin-left: 5px; padding: 8px 10px; font-size: 15px; cursor: pointer; background-color: #F0F0F0; background-image: -moz-linear-gradient(top,#FFFFFF,#D9D9D9); background-image: -webkit-gradient(linear,0 0,0 100%,from(#FFFFFF),to(#D9D9D9)); background-image: -webkit-linear-gradient(top,#FFFFFF,#D9D9D9); background-image: -o-linear-gradient(top,#FFFFFF,#D9D9D9); background-image: linear-gradient(to bottom,#FFFFFF,#D9D9D9); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF',endColorstr='#D9D9D9',GradientType=0); border: 1px solid #C5C5C5; display: inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; vertical-align: top; }
.btn-mini { padding: 2px 5px !important; font-size: 13px !important; }
.btn:hover { background-color: #e3e3e3; color: #000000; background-image: -moz-linear-gradient(top,#F2F2F2,#CCCCCC); background-image: -webkit-gradient(linear,0 0,0 100%,from(#F2F2F2),to(#CCCCCC)); background-image: -webkit-linear-gradient(top,#F2F2F2,#CCCCCC); background-image: -o-linear-gradient(top,#F2F2F2,#CCCCCC); background-image: linear-gradient(to bottom,#F2F2F2,#CCCCCC); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2',endColorstr='#CCCCCC',GradientType=0); }
.btn:active { background-color: #e3e3e3; color: #000000; background-image: -moz-linear-gradient(top,#CCCCCC,#F2F2F2); background-image: -webkit-gradient(linear,0 0,0 100%,from(#CCCCCC),to(#F2F2F2)); background-image: -webkit-linear-gradient(top,#CCCCCC,#F2F2F2); background-image: -o-linear-gradient(top,#CCCCCC,#F2F2F2); background-image: linear-gradient(to bottom,#CCCCCC,#f2f2f2); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC',endColorstr='#F2F2F2',GradientType=0); }
.in-progress { background: none; background-color: #e3e3e3; }
.disabled,.disabled:hover { background: none; background-color: #e3e3e3; cursor: default; }
.opcije { display: inline-block; float: right; }
.progress { display: block; height: 15px; margin: 10px 0; border: 1px solid #ddd; }
.progress .filler { width: 0%; height: 100%; background-color: #4bb1cf; background-image: -moz-linear-gradient(top, #5BC0DE, #339BB9); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5BC0DE), to(#339BB9)); background-image: -webkit-linear-gradient(top, #5BC0DE, #339BB9); background-image: -o-linear-gradient(top, #5BC0DE, #339BB9); background-image: linear-gradient(to bottom, #5BC0DE, #339BB9); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5BC0DE', endColorstr='#339BB9', GradientType=0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: width 0.2s ease; -moz-transition: width 0.2s ease; -o-transition: width 0.2s ease; transition: width 0.2s ease; }
.slikaPredogled { max-width: 800px; max-height: 600px; width: 100%; text-align: center; margin: 10px 0; }
.slikaPredogled img { max-width: 100%; max-height: 100%; -webkit-transition: opacity 0.2s ease; -moz-transition: opacity 0.2s ease; -o-transition: opacity 0.2s ease; transition: opacity 0.2s ease; }
.slikaPredogledMala { max-width: 200px; height: 150px; overflow:hidden; float: right; margin-bottom: 10px; text-align: center; }
.slikaPredogledMala img { max-width: 100%; max-height: 100%; }
input { width: 400px; font-size: 15px; padding: 5px 10px; background-color: #FFFFFF; border: 1px solid #C5C5C5; display: inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.qq-upload-button-hover { cursor: pointer; }
.galerijaNaslov { display: block; margin: 10px 0; }
input, select { display: block; width: 100%; font-size: 20px; padding: 10px 15px; margin-bottom: 10px; background-color: #FFFFFF; border: 1px solid #C5C5C5; display: inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

table { width: 100%; margin-top: 10px; font-size: 14px; border: 1px dotted #DDDDDD; border-collapse: collapse; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
table a { color: #000000; }
th, td { padding: 3px 5px; border-right: 1px dotted #DDDDDD; border-bottom: 1px dotted #DDDDDD; }
.table td.cmd { font-size: 0; width: 107px; padding:3px 0; }
tbody tr:hover { background-color: #EEE; }
.komentarji .btn { padding: 2px 5px; font-size: 11px; }
.komentarji h3 span { font-size: 12px; }
.komentarji .objavljeno { display: inline-block; }
.omogocen { color: #00FF00; background: #FFFFFF !important; cursor: default !important; }
.omogocen:hover { color: #00ff00; }
.boxContainer { display: block; margin-top: 20px; border: 1px solid #AAAAAA; }
.boxHeader { background-color: #E3E3E3; padding: 10px 15px; font-size: 18px; font-weight: bold; color: #FFFFFF; border-bottom: 1px solid #AAAAAA; }
.boxBody { padding: 10px 5px; }
.boxBody p { font-size: 15px; line-height: 20px; }
.space-bottom { margin-bottom: 10px; }
@media (max-width: 959px) {
	.contentHolder { margin-left: 180px; position: relative; padding: 0; }
	.content { padding: 10px; }
	.breadcrumb { font-size: 14px; margin: 0; -webkit-morder-radius: 10px 0 0 0; -moz-border-radius: 10px 0 0 0; border-radius: 10px 0 0 0; }
	.btn { padding: 5px 8px; font-size: 13px; margin-left: 5px; }
	.galerijaSlika { width: 180px; height: 112px; }
	.dogodek h1 { font-size: 18px; margin-left: 10px;}
	.dogodek h2 { font-size: 14px; margin: 5px 0 5px 10px; }
	.dogodek p { margin-left: 10px; font-size: 12px; }
}
@media (max-width: 480px) {
	.contentHolder { margin: 0; -webkit-morder-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; }
	.content { padding: 0; }
	.breadcrumb { font-size: 12px; padding: 5px 10px; }
	.btn { padding: 8px 10px; margin: 10px 0 0; font-size: 15px; cursor: pointer; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
	.btn { display: block; }
	.komentarji .btn { display: inline-block; }
    .galerijaSlika { width: 47%; display: inline-block; vertical-align: top; height: 150px; text-align: center; margin: 0 5px 5px 0; overflow: hidden; border:1px solid #FFFFFF; }
	.slikaPredogledMala { width: 100%; overflow:hidden; margin: 10px 5px; text-align: center; float:none; max-width: 100%; }
	input, select { padding: 3px 5px; font-size: 13px; }

	.dogodek td:nth-child(2n+1) { width: 100px; }
	.dogodek img { display: block; max-width: 100px; max-height: 60px; }
	.dogodek h1 { font-size: 16px; margin-left: 10px;}
	.dogodek h2 { font-size: 13px; margin: 5px 0 5px 10px; }
	.dogodek p { margin-left: 10px; font-size: 11px; }
}