/**** ESSENTIAL - DESKTOP ****/

body { font-family: 'Open Sans', sans-serif; color:#2C3334; font-weight:300 }
p {font-size:20px; margin-bottom:20px; line-height:1.5} 
a { text-decoration:none;color:#444444}
a:hover {text-decoration: underline}
h2 {font-weight:700}
img {width:100%; height:auto; margin-bottom: -5px;}
.slicknav_menu {display:none;}
.desktop {display:block}
.mobile {display:none}
.circular {width: 100%;height: auto;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;background: no-repeat center center; background-size: cover;}
.circular img {opacity:0; filter: alpha(opacity=0); }
/**** ESSENTIAL - DESKTOP - END ****/

nav:not(.main-menu) ul {list-style-type:none;}
nav:not(.main-menu) ul li{float:left}
nav:not(.main-menu) ul li a{text-decoration:none; color:#4C4C4C; font-size:11px; font-weight:700; padding-left:20px; padding-right:20px; display: block;}

nav:not(.main-menu) ul {border-right: 1px solid #DDDDDD; margin-bottom:0px}
header nav:not(.main-menu) ul {line-height:70px; float: right;}
header nav:not(.main-menu) ul li {border-left: 1px solid #DDDDDD;}

.container {padding: 65px 0px 65px 0px}
.container.style02 { background:rgba(46,52,54,1)}
.container.style03 { background:rgba(46,52,54,1); border-bottom:20px solid #F7263F}
.main-menu{
	transform:translateY(calc(-100% - 50px));
	min-height: 540px;
	background-color: rgba(255, 255, 255, 0.92);
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	transition:transform 200ms;
	backface-visibility: hidden;
	z-index: 100;
}

.norelative{
	position: static;
}

.top25p{
	font-family: 'DDCHardware';
	text-transform: uppercase;
	font-size: 32px;
	color:#2C3334;
	position: absolute;
	bottom: 7px;
}

.top25p span{
	color:#F7263F;
}

.maintop{
	margin-bottom: 0 !important;
	margin-top: 0px;
	font-size: 40px;
	position: relative;
	bottom: 0;
}

.main-menu ul{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.main-menu ul li{
	display: block;
	font-size: 32px;
	font-family: 'DDCHardware';
	text-align: center;
}
.main-menu ul li:not(:last-of-type){
	margin-bottom: 30px;
}

.menu-button{
	position: absolute;
	top: 20px;
	right: 30px;
	width: 20px;
	display: block;
	z-index: 200;
	cursor: pointer;
}

.menu-button.topfix{
	top: 10px;
	margin-right: 70px;
}

.menu-button p{
	font-family: 'DDCHardware';
	color:#444;
	font-size: 24px;
	position: absolute;
	left: calc(-100% - 50px);
	top: 50%;
	transform:translateY(-50%);
	transition:color 200ms;
}
.menu-button span{
	background-color: #444;
	width: 100%;
	height: 3px;
	display: block;
	transition: background-color 200ms;
}

.menu-button.white span{background-color: #fff}
.menu-button.white p{color: #fff}
.menu-button span:not(:last-of-type){
	margin-bottom: 5px;
}
#nav-check:checked + .menu-button p{color:#444;}
#nav-check:checked + .menu-button span{background-color:#444;}
#nav-check:checked + .menu-button + .main-menu{
	transform:translateY(0);
}
.filters-bar{
	margin-bottom: 70px;
	min-height: 40px;
}
#intro{position: relative;}
.logo {display: block;line-height: 70px;}
.search {position: absolute;width: 100%;margin-top: -320px;z-index: 9999;}
.search input[type="text"] {width:100%; border:none; outline:1px solid #fff; height:80px; background:rgba(255, 255, 255, 0.8); font-size:24px; padding:22px}
.search input[type="submit"] {background:url(../images/submit-icon.jpg); border:none; outline:none; width:60px; height:60px; right: 25px;top: 10px;position: absolute; cursor:pointer} 
#intro h2{ font-size:42px; font-weight:300; color:#F7263F; margin-right:40px}
.pravilnik{margin-right: 40px}
#intro h2 span{ color:#2C3334}
.btn-red {background:#F7263F; padding:18px; margin-top:35px; display:inline-block; color:#fff; margin-bottom:0px }
.btn-red:hover {text-decoration:none}
.index .news {position:relative}
.outline {outline:1px solid #6D7173; display:block} 
.news-flexslider {min-height: 505px;}
.news-flexslider .outline {height:370px; position:relative; overflow:hidden}
.news-flexslider .outline:active, .news-flexslider .outline:hover {outline:1px solid #fff;}
.news-flexslider .info {width:73%; backface-visibility:hidden; background:rgba(46,52,54,1); position: absolute;height: 100%;-webkit-transition: transform 0.5s ease-in-out;-moz-transition: transform 0.5s ease-in-out; -o-transition: transform 0.5s ease-in-out;transition: transform 0.5s ease-in-out; left:0; padding:25px}
.news-flexslider .outline:hover .info {transform:translateX(-100%);}
.news-flexslider .info h3 {top:0px; color:#FFFFFF; font-size:25px; font-weight:300}
.news-flexslider .info .short {bottom:25px; color:#FFFFFF; font-size:18px; font-weight:300; position: absolute;}
footer {border-bottom:20px solid #F7263F; background:rgba(238,238,238,1)}
.organizatori ul {line-height:80px;border-right: 1px solid #DDDDDD; float:left}
.organizatori ul li {border-left: 1px solid #DDDDDD;}
.organizatori ul li span{color:#4C4C4C; font-size:11px; font-weight:700; padding-left:20px; padding-right:20px; display: block;}
.organizatori li img {margin-bottom: 0; vertical-align: middle}
.tools ul {line-height:80px;border-right: 1px solid #DDDDDD; float:right}
.tools ul li {border-left: 1px solid #DDDDDD;}
.tools ul li span{color:#4C4C4C; font-size:11px; font-weight:700; padding-left:20px; padding-right:20px; display: block;}
.tools li img {position:relative; top:5px}
.news-mobile a {margin-bottom:20px}
.news-mobile a:hover {text-decoration:none}
.news-mobile .info {padding:25px; background-color: rgba(46,52,54,1);}
.news-mobile .info h3 {color:#FFFFFF; font-size:21px; margin-bottom:14px}
.news-mobile .info .short {color:#FFFFFF; font-size:16px; font-weight:300; }
.news-mobile .outline:active {outline:1px solid #fff;}
.fullw {width:100%}
.agency .primary {padding:40px 0px 40px 0px }
.sticker img {width:auto}
.agency .primary h2, .agency .primary h1 {font-size:46px; font-weight:300; color:#FFFFFF}
.agency .primary .website a{color:#fff;}
.agency .primary .website {margin-bottom:20px}
.agency .grid {position:relative}
.agency .primary p {color:#FFFFFF; font-size:18px; margin-bottom:0px; font-weight:300}
.agency .member {color:#FFFFFF; font-size:12px; position:absolute; right:15px; bottom:-28px}
.agency .member img {width:auto; margin:0px 2px 0px 2px }
.secondary p {font-weight:300}
.secondary .links a {display: block; text-align:center; line-height:40px; outline:1px solid #F7263F; margin-top:5px; text-decoration:none}
.secondary .links a:hover {background-color:#F7263F; color:#fff}
.radovi article {border-bottom:3px solid #F7263F; padding-bottom:15px; margin-top:30px}
.radovi h4 {color:#fff; font-size:32px; font-weight:300; margin-bottom:40px}
.radovi article span {color:#7D8082; font-size:12px}
.radovi article h3 a, .radovi article h3 {color:#fff; font-size:22px;line-height: 29px; height: 58px; overflow:hidden; margin-bottom:8px}
.radovi article h5 {color:#7D8082; font-size:17px; font-weight:400;line-height: 21px; height: 42px; overflow:hidden;}
.radovi .individual {display:inline-block; padding:5px 8px 5px 8px; text-align:center; font-size:12px; font-weight:bold; outline:1px solid #585D5E; color:#fff; text-decoration:none; margin-top:15px}
.radovi .individual:hover {background-color:#555353}
.radovi article img {max-height:208px;}
.radovi.top25 article h3 a, .radovi article h3 {color:#F7263F;}
.radovi.top25 .individual {color:#2E3436; outline:1px solid #D5D6D7}
.radovi.top25 .individual:hover {background-color:#F7263F; color:#fff}
.radovi.top25 article img {max-height:208px;}
.wp-pagenavi { padding:60px 0px 20px 0px}
.agency-navi {font-size:24px}
.filters-bar {background:rgba(46,52,54,1); line-height:40px}
.filters-bar ul {border-right: 1px solid #5A6467; margin-bottom:0px; float:left}
.filters-bar ul li a {padding-right: 15px; padding-left:15px; color:#C1C2C3; border-left: 1px solid #5A6467;}
.filters-bar ul li a.active {color:#F7263F}
.filters-bar .abc {left: none !important; margin-bottom:0px; float:left}
.filters-bar .abc li a {padding-right: 9px; padding-left:9px; color:#C1C2C3;border-left:none;}
.filters-bar .abc li a.active {color:#F7263F}
h1, h4 {color:#2C3334; font-size:32px; font-weight:300; margin-bottom:40px}
.agencije-lista img {outline:1px solid #DDDBDB}
.agencije-lista a {margin-bottom:30px}
.agency-flexslider h4 {color:#7D8082; font-size:42px; font-weight:300;}
.main {padding-left:40px}
.main h2, .main h1 {font-size:50px !important; font-weight:300; margin-bottom:50px}
.main p {font-size:16px; font-weight:400}
.main li {
	font-size: 16px;
    font-weight: 400;
    line-height: 1.5em;
    padding-left: 15px;
}

.main ol {margin-bottom: 26px;}
.main p.large {font-size:22px;}
.sidebar {padding-top:8px}
.sidebar .links a {display: block; background-color:#2E3436; margin-bottom:15px; padding:10px 5px; color:#FFFFFF; font-weight:400; text-decoration:none}
.sidebar .links a span {display:block}
.sidebar .links a.prijava {background-color:#F7263F;}
.sidebar .links a.prijava-prijavnica {background-color:#F7263F;}
.filters-bar .search {display:block; position:relative; margin-top:0px; float:right; width:40px; height:40px; right:5px}
.filters-bar .search img{ width:auto}
.mob {
	width: 25%;
	text-align: center;
	margin-top: 20px;
}

a[href^="/prijavnica/"] {
	display: none;
}




@media handheld, only screen and (max-width: 979px) {

	.filter-btn {
		display: none !important;
	}

}


@media handheld, only screen and (max-width: 768px), only screen and (max-device-width: 768px) and (orientation:portrait) {
	/**** ESSENTIAL - max768 ****/
	#menu {display:none;}
	.slicknav_menu {display:block;}
	.desktop {display:none}
	.mobile {display:block}
	.top25_badge{display: none}
	.circular {width:60%; margin-left:auto; margin-right:auto}
	.event-nav .c3{width:50%}
	/**** ESSENTIAL - max768 - END ****/
	.top25p{position: relative; bottom: 0}
	.menu-button{top: 10px; right: 10px}
	.menu-button p{font-size: 18px; left: calc(-100% - 30px)}
	#intro .c5, #intro .c7 {text-align:center}
	#intro h2 {margin-right:0px}
	.pravilnik{margin-right: 0}
	.btn-prijava-info {width:100%; text-align:center}
	.container {padding: 18px 0px 10px 0px}
	.radovi h4 {margin-bottom: 0px;}
	.main {padding-left:20px}
	.menu-button.topfix{right: auto; left: 70px;}
	.agencije-lista a {height: inherit !important;}
	.header-logo{top:-20px !important}
	.search input[type="text"]{font-size: 14px}

}

@media handheld, only screen and (max-width: 640px), only screen and (max-device-width: 640px) and (orientation:portrait) {
	
	.circular {width:72%; margin-left:auto; margin-right:auto}
	.filters .c4 { display: none; }
	
}

@media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px) and (orientation:portrait) {





	
}