@import url(//fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,600,600italic,700,700italic,800,800italic&subset=latin,latin-ext); /* Generated by Font Squirrel (https://www.fontsquirrel.com) on May 13, 2016 */ html { width: 100%; height: 100%; overflow-y: scroll; overflow-x: hidden; } body { position: relative; font-size: 14px; color: #222222; font-family: "Open Sans", sans-serif; background: #F9F9F9; } a { text-decoration: none; color: #222222; transition: all 0.5s ease-in-out; } a:hover { text-decoration: none; color: #999; transition: all 0.5s ease-in-out; } .header-h1 { font-family: "Open Sans", sans-serif; font-size: 40px; font-weight: 300; } .header-h2 { font-family: "Open Sans", sans-serif; font-size: 30px; font-weight: 300; } .header-h3 { font-family: "Open Sans", sans-serif; font-size: 20px; font-weight: 700; } .header-h3.slim { font-weight: 300; } .font-size14 { font-size: 14px; font-style: italic; } .font-size16 { font-size: 16px; } .font-size20 { font-size: 20px; } .blue { color: #0066cc; } .blue2 { color: #99ccff !important; } .bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-image: url(/images/bg.jpg); } .bg-blue { background: #0066cc; } .bg-blue-light { background: #e4e7ee; } .hr { height: 1px; background: #0066cc; } .hr2 { height: 2px; background: #0066cc; } .hr3 { height: 1px; background: #99ccff; } .desktop-hide { display: none; } .false-href { cursor: default; display: inline-block !important; } .show-more { display: inline-block; min-width: 250px; height: 50px; line-height: 50px; background-color: #ffc600; border: none; color: #0d1f43; text-align: center; font-size: 16px; z-index: 10; cursor: pointer; } .show-more.hvr-underline-from-center::before { background: #fff; } .obavijesti-uprave { background: #0066cc; } .eu-obavijesti { background: #8B9DC3; } .sport { background: #E52D27; } .manifestacije { background: #559900; } .razno { background: #E67E22; } header { width: 100%; height: 125px; z-index: 101; background: #0066cc; box-shadow: 3px 4px 5px rgba(0, 0, 0, 0.1); } header .header-logo { position: absolute; top: 0; left: 0; } header .header-logo img { width: 90px; } header .header-logo-mob { display: none; position: absolute; top: 7px; left: 5px; } header .header-logo-mob img { width: 55px; } header .header-title { position: absolute; top: 25px; left: 125px; font-size: 24px; font-weight: 700; text-transform: uppercase; color: #fff; } header .header-widgets { float: right; } header .header-widgets .header-weather { float: left; top: 5px; color: #fff; font-size: 18px; font-weight: 700; } header .header-widgets .header-weather img { top: 3px; height: 60px; } header .header-widgets .header-weather span { top: 5px; left: -10px; } header .hr3 { top: 75px; margin-left: 125px; } .list-social { top: 20px; float: left; margin-right: 305px; } .list-social li { float: left; width: 35px; height: 35px; line-height: 35px; margin-left: 10px; border-radius: 50%; text-align: center; transition: all 0.5s ease-in-out; } .list-social li a { color: #fff; font-size: 16px; } .list-social .fb { background: #8b9dc3; } .list-social .yt { background: #e52d27; } .list-social .mail { background: #559900; } .sb-search { position: absolute; top: 20px; right: 0; width: 290px; min-width: 35px; height: 35px; overflow: hidden; transition: width 0.3s; -webkit-backface-visibility: hidden; } .sb-search-input { position: absolute; top: 0; right: 0; border: none; outline: none; background: #fff; width: 100%; max-width: 300px; height: 35px; margin: 0; z-index: 10; padding: 0 40px 0 10px; font-family: "Open Sans", sans-serif; font-size: 14px; color: #2c3e50; } .sb-search-input::-webkit-input-placeholder { color: #0066cc; } .sb-search-input:-moz-placeholder { color: #0066cc; } .sb-search-input::-moz-placeholder { color: #0066cc; } .sb-search-input:-ms-input-placeholder { color: #0066cc; } .sb-icon-search, .sb-search-submit { width: 35px; height: 35px; display: block; position: absolute; right: 0; top: 0; padding: 0; margin: 0; line-height: 35px; text-align: center; cursor: pointer; } .sb-search-submit { background: #fff; /* IE needs this */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */ filter: alpha(opacity=0); /* IE 5-7 */ opacity: 0; color: transparent; border: none; outline: none; z-index: -1; } .sb-icon-search { color: #fff; background: #e67e22; z-index: 90; font-size: 18px; font-family: "fontello"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; } .sb-icon-search:before { content: "\e81c"; } .sb-search.sb-search-open, .no-js .sb-search { width: 100%; } .sb-search.sb-search-open .sb-icon-search, .no-js .sb-search .sb-icon-search { background: #da6d0d; color: #fff; z-index: 11; } .sb-search.sb-search-open .sb-search-submit, .no-js .sb-search .sb-search-submit { z-index: 90; } .nav-menu-box { position: absolute; top: 90px; left: 125px; } .nav-menu-box .nav-menu ul { text-align: left; } .nav-menu-box .nav-menu ul li { float: left; font-size: 14px; font-weight: 700; text-transform: uppercase; transition: all 0.5s ease-in-out; } .nav-menu-box .nav-menu ul li a { color: #fff; margin-right: 20px; padding-bottom: 5px; display: block; } .nav-menu-box .nav-menu .hvr-underline-from-center::before { background: #fff; height: 2px; } .nav-menu-box .nav-menu ul li a:hover { color: #B8B8B8; } .nav-menu-box .nav-menu ul .drop-down-list { left: 35px; position: absolute; top: 100%; display: block; margin-top: 40px; min-width: 200px; max-height: 0; max-width: 0; opacity: 0; overflow: hidden; transition: all 0.3s ease-in-out 0s; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); } .nav-menu-box .nav-menu ul .drop-down-list li { float: none; margin: 0; padding: 10px 15px; background: #fff; font-size: 13px; font-weight: 600; border: none; border-bottom: 1px solid #0066cc; } .nav-menu-box .nav-menu ul .drop-down-list li a { margin-left: 10px; color: #1a1a1a; } .nav-menu-box .nav-menu ul .drop-down-list li a:hover { color: #313131; } .nav-menu-box .nav-menu ul .drop-down-list li:last-child { border-bottom: 0 solid #0066cc; } .nav-menu-box .nav-menu ul .drop-down { cursor: default; } .nav-menu-box .nav-menu ul .drop-down:hover > .drop-down-list { margin-top: 10px; opacity: 1; max-width: 900px; max-height: 500px; } .nav-menu-box .nav-menu .mobile-show { display: none; } .home-news { margin: 75px 0 0 0; } .home-news .container { padding: 50px 40px; background: #fff; border-bottom: 1px solid #C1BFBD; } .home-news h4 { margin-bottom: 15px; padding-bottom: 5px; border-bottom: 1px solid #C1BFBD; font-weight: 400 !important; } .big-news { width: 100%; height: 500px; overflow: hidden; border: 1px solid #fff; } .big-news figure { float: left; width: 100%; height: 100%; overflow: hidden; z-index: 2; } .big-news figure img { position: absolute; left: 50%; top: 50%; height: 100%; width: auto; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .big-news figure .overlay-07 { width: 0; background: #0066cc url(/images/zoom.png) no-repeat center center; z-index: 2; } .big-news figure:hover .overlay-07 { width: 100%; } .big-news h3 { position: absolute; top: 20px; left: 20px; color: #fff; font-size: 14px; font-weight: bold; text-transform: capitalize; padding: 8px 15px; z-index: 99999; } .big-news .description { position: absolute; bottom: 15px; z-index: 99999; padding: 0px 25px 0px 25px; } .big-news .description h4 { display: inline-block; color: #fff; text-transform: uppercase; font-weight: bold; font-size: 20px; margin-bottom: 8px; line-height: 25px; } .big-news .description ul { float: left; width: 100%; } .big-news .description ul li { float: left; position: relative; color: #fff; } .big-news figure:before { content: ""; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); background: linear-gradient(transparent, rgba(0, 0, 0, 0.8)); z-index: 1; } .medium-news { height: 250px; } .medium-news h3 { top: 10px; left: 10px; font-size: 14px; padding: 5px 10px; } .medium-news .description { left: -10px; bottom: 10px; } .medium-news .description h4 { margin-bottom: 2px; font-size: 14px; line-height: 18px; } .medium-news .description ul li { font-size: 12px; } .home-banners .container { padding: 50px 25px; background: #fff; border-bottom: 1px solid #C1BFBD; } .home-boxes { margin-bottom: 100px; } .home-boxes .container { padding: 50px 25px; background: #fff; } .weather-widget { width: 100%; height: 250px; } .news-archive { margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px dashed #C1BFBD; } .news-archive .thumbnail { position: relative; float: left; width: 80px; height: 80px; margin-right: 10px; overflow: hidden; z-index: 2; } .news-archive .thumbnail img { position: absolute; left: 50%; top: 50%; height: 100%; width: auto; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .news-archive .thumbnail .overlay-07 { width: 0; background: #0066cc url(/images/zoom-small.png) no-repeat center center; } .news-archive .thumbnail:hover .overlay-07 { width: 100%; } .news-archive .description { z-index: 1; } .news-archive .description .title { font-size: 15px; color: #222222; } .news-archive .description .date { font-size: 12px; color: #999; } .content-inside { padding: 100px 0; } .content-inside .container { padding-top: 50px; background: #fff; } .content-inside .container .row-mobile { margin: 0; } .news-box { margin: 25px 0; } .news-box figure { width: 100%; display: inline-block; overflow: hidden; z-index: 2; } .news-box figure a { position: absolute; width: 100%; height: 100%; display: block; } .news-box figure a img { position: absolute; left: 50%; top: 50%; height: 120%; width: auto; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .news-box figure .overlay-07 { width: 0; background: #0066cc url(/images/zoom.png) no-repeat center center; } .news-box figure:hover .overlay-07 { width: 100%; } .news-box figure:after { padding-top: 66.66%; display: block; content: ""; } .news-box .news-text { top: -5px; padding: 25px 15px 50px 15px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); background: #E4E7EE; z-index: 2; } .news-box .news-text .img-circle { position: absolute; top: -20px; left: 5px; padding: 10px; color: #fff; } .news-box .news-text span { position: absolute; top: -30px; right: 0; height: 30px; line-height: 30px; padding: 0 10px; color: #fff; font-size: 12px; font-weight: 600; } .news-box .news-text .header-h3 { font-size: 15px !important; height: 75px; line-height: 1.2; margin-bottom: 10px; overflow: hidden; } .news-box .news-text p { height: 77px; padding: 15px 0; margin-bottom: 25px; overflow: hidden; } .news-box .news-more { position: absolute; left: 0; bottom: 5px; display: block; width: 100%; height: 40px; line-height: 40px; border: none; color: #fff; font-size: 14px; z-index: 10; } .news-box .hvr-overline-from-center::before { background: #FFFF00; } .news-presentation figure { width: 100%; display: inline-block; overflow: hidden; z-index: 2; } .news-presentation figure img { position: absolute; left: 50%; top: 50%; width: 120%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .news-presentation figure:after { padding-top: 50%; display: block; content: ""; } .news-presentation .news-gallery { position: absolute; bottom: 0; left: 0; width: 100%; padding: 25px 0; text-align: center; color: #fff; font-size: 20px; background-color: rgba(0, 102, 204, 0.5); cursor: pointer; } .news-presentation em { font-size: 15px; } .news-presentation p { font-size: 14px; } .news-presentation .show-more-box { text-align: center; } .contact-form fieldset { margin-bottom: 15px; } .contact-form label { display: block; } .contact-form .text { width: 100%; height: 40px; padding: 0 15px; background: #fff; border: 1px dashed #C1BFBD; color: #000; font-size: 13px; font-family: "Open Sans", sans-serif; font-style: italic; outline: none; } .contact-form .text-area { width: 100%; padding: 10px 15px; height: 125px; resize: none; overflow: auto; } .contact-form .send { position: absolute; margin-top: -70px; right: 0; width: 205px; height: 60px; background-color: #0066cc; border: none; color: #fff; font-family: "Open Sans", sans-serif; font-size: 16px; cursor: pointer; } .contact-form .send-book { position: relative; margin-top: 5px; right: inherit; } .contact-form .hvr-underline-from-center::before { background: #FFFF00; } .search-result { margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px dashed #C1BFBD; } .search-result h2 { font-size: 18px; font-weight: 400; } .search-result h2 a { color: #0066cc; } .search-result .link { color: #559900; } .search-result .description { font-style: italic; } .footer-contact { background: #0066cc; color: #fff; } .footer-contact .contact-text { margin: 0 25px; padding: 50px 0; } .footer-contact .contact-text h2 { font-size: 24px; font-weight: 700; text-transform: uppercase; } .footer-contact .contact-text h3 { font-size: 20px; font-weight: 400; } .footer-contact .contact-text span { font-weight: 600; } .footer-contact .contact-text a { color: #fff; } .footer-contact .contact-text a:hover { color: #e6e6e6; } .list-social-footer li { float: left; width: 40px; height: 40px; line-height: 40px; margin-right: 10px; background: #fff; text-align: center; } .list-social-footer li a { color: #0066cc !important; font-size: 18px; } .list-social-footer li a:hover { color: #99ccff !important; } .contact-map { height: 525px; } .footer-logos { padding: 50px 0; background: #f9fafa; text-align: center; } .footer-logos img { height: 50px; margin: 0 10px; } footer { width: 100%; padding: 20px 0; background: #fff; color: #444444; font-size: 12px; font-weight: 600; } footer a { color: #444444; } @media screen and (min-width: 1081px) { /* Effects */ .hvr-underline-from-center { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; overflow: hidden; } .hvr-underline-from-center:before { content: ""; position: absolute; z-index: -1; left: 50%; right: 50%; bottom: 0; background: #2098d1; height: 4px; transition-property: left, right; transition-duration: 0.3s; transition-timing-function: ease-out; } .hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before { left: 0; right: 0; } .hvr-overline-from-center { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; overflow: hidden; } .hvr-overline-from-center:before { content: ""; position: absolute; z-index: -1; left: 50%; right: 50%; top: 0; background: #2098d1; height: 4px; transition-property: left, right; transition-duration: 0.3s; transition-timing-function: ease-out; } .hvr-overline-from-center:hover:before, .hvr-overline-from-center:focus:before, .hvr-overline-from-center:active:before { left: 0; right: 0; } } @media screen and (max-width: 1080px) { .hide1080 { display: none !important; } .desktop-hide { display: block; } .mobile-padding50 { padding: 50px 0; } .bg { display: none; } header { position: relative; height: 80px; } header .header-logo { display: none; } header .header-logo-mob { display: block; } header .header-title { top: 40px; left: 80px; } header .header-widgets { width: 100%; } header .header-widgets .header-weather { position: absolute; float: none; top: -10px; left: 70px; } header .hr3 { display: none; } .list-social { position: absolute; top: 7px; right: 60px; float: none; margin-right: 0; } .sb-search { top: 7px; right: 10px; width: 0%; } .nav-menu-box { width: 100%; top: 30px; right: 0; left: inherit; } .nav-menu-box .new-box { position: relative; top: inherit; left: inherit; } .home-news { margin: 50px 0 25px 0; } .home-news .container { padding: 0 25px 25px 25px; background: transparent; } .home-banners .container { padding: 0 15px 0 15px; background: transparent; } .home-banners .container img { margin-bottom: 25px; } .home-boxes { margin-bottom: 50px; } .home-boxes .container { padding: 0 15px; background: transparent; } .content-inside { padding: 50px 0; } .content-inside .container { padding-top: 0; background: transparent; } .content-inside .container .row-mobile { margin: 0 -15px; } footer { height: auto; } } @media screen and (max-width: 966px) { body { font-size: 13px; } h1 { font-size: 20px !important; } h2 { font-size: 18px !important; } h3 { font-size: 16px !important; } .hidden-mobile { display: none; } .font-size16 { font-size: 14px; font-style: italic; } .home-boxes { padding-bottom: 25px; } .news-presentation .news-gallery { padding: 10px 0; font-size: 15px; } .news-presentation em { font-size: 14px; } .news-presentation p { font-size: 13px; } .search-result { margin-bottom: 10px; padding-bottom: 10px; } .search-result h2 { font-size: 15px; } .footer-contact .contact-text { padding: 25px 0; } .footer-contact .contact-text h2 { font-size: 18px; } .footer-contact .contact-text p { margin: 0; } .list-social-footer li { float: left; width: 35px; height: 35px; line-height: 35px; } .contact-map { height: 250px; } .footer-logos { padding: 25px 0; } .footer-logos img { height: 40px; margin: 5px 15px; } } @media screen and (max-width: 667px) { .big-news { height: auto; } .big-news figure img { position: relative; left: 0; top: 0; width: 100%; height: auto; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .big-news h3 { top: 10px; left: 10px; font-size: 14px; padding: 5px 10px; } .big-news .description { left: -10px; bottom: 10px; } .big-news .description h4 { margin-bottom: 2px; font-size: 14px; line-height: 18px; } .big-news .description ul li { font-size: 12px; } header .header-title { top: 45px; left: 70px; font-size: 18px; } header .header-widgets .header-weather { top: 0; left: 60px; } header .header-widgets .header-weather img { height: 50px; } header .header-widgets .header-weather span { font-size: 16px; } .contact-form .text { height: 30px; } .contact-form .text-area { height: 100px; } .contact-form .send { position: relative; margin-top: 10px; right: inherit; height: 40px; font-size: 14px; } footer span { display: block; height: 0; overflow: hidden; } } @media screen and (max-width: 414px) { header .header-logo-mob img { width: 35px; } header .header-title { top: 55px; left: 5px; font-size: 14px; } header .header-widgets .header-weather { left: 40px; } header .header-widgets .header-weather img { height: 45px; } header .header-widgets .header-weather span { font-size: 14px; } .sb-search { top: 5px; right: 5px; } .sb-search-input { max-width: 280px; } .list-social li { width: 30px; height: 30px; line-height: 30px; margin-left: 5px; } .list-social li a { font-size: 14px; } .home-news h4 .pull-left { display: none; } }