/**** ESSENTIAL - DESKTOP ****/
body { font-family: 'Open Sans', sans-serif; color:#383737}
p {font-size:18px;} 
a {text-decoration:none; color: white; font-size: 23px; font-weight: bold;}
a:hover {text-decoration: underline}
img {height:auto; margin-bottom: -5px;}
.slicknav_menu {display:none;}
.desktop {display:block}
.mobile {display:none}
nav.main-menu {}
nav ul {}
nav ul li {display:inline-block;}
nav ul li a {text-decoration:none; color:#0D2135; font-size:12px; font-weight:700; text-transform:uppercase}
.circular {width: 100%;height: auto;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;background: no-repeat center center; background-size: cover;}
.circular img {opacity:0; filter: alpha(opacity=0); }
h1, h2, h3, h4, h5, h6 {font-weight:300; color:#202020; margin-bottom:15px}
/**** ESSENTIAL - DESKTOP - END ****/

h3 {text-align: center;font-weight: 700;font-size: 25px;text-transform: uppercase;}

body {font-family:'Muli',sans-serif;}
ul {margin:0; padding:0;list-style-type: disc;}
li {display:inline-block;}
ul p {display:inline-block;}
ul.c3 {text-align:right;}

ul {padding-left: 20px;}
.proizvodSlider ul {padding-left: 0;}

.top {padding-top: 20px; padding-bottom: 20px;}
.top.grid .c9 .c3 a, .top.grid .c9 .c5 a {font-size: 18px;font-weight: 300;position: absolute;top: 5px;padding-left: 10px;}
.top img {width:initial; padding:0 7px 0 10px;}

.menu img {width:initial; padding:8px}
.menu ul li {padding: 0px 12px;height:80px;}
.menu ul li a {font-size: 18px;font-weight: 700;}
.menu ul li:hover {background-color: #fff;transition: background-color 0.5s ease;}
.menu ul li:hover a {color: #d0483c;transition: color 0.5s ease;text-decoration: none;}

header {height:700px;top: 0px;position: absolute;width: 100%;}

.full {background:#d0483c;}

.logo {float:left;}

.menu ul {float:right; line-height:80px; font-size:23px;}

.welcome {padding-top:250px;}
.welcome h1 {font-size:70px;font-weight: 900;color: #fff;}
.welcome h1 strong {color:#d0483c;font-weight: 900;font-size: 78px;margin-left: 15px;}
.welcome p {font-size:22px;line-height: 26px;padding-left: 8px;font-weight: 300;text-align: justify;color: #fff;}

.bigIcons {text-align:center; margin-top:130px;height: 290px;display: block;}
.bigIcons .c4 a:hover {opacity: 0.8;}
.bigIcons img {width:initial;}
.bigIcons p {color:black;font-weight: 300;line-height: 25px;}

.c4 h2 {padding-top:18px; font-size:25px; font-weight:500;}

.reference {margin-top:50px;}
.reference h2 {font-size:30px; font-weight:500; padding:12px;}

.slider {width: 100%;height: 340px;padding-top: 70px;background-color: #d0483c;box-shadow: 0 5px 8px 0 rgba(0,0,0,0.3);}

.oNama {margin-top:50px;margin-bottom: 120px;}
.oNama p {color:black; padding: 12px; line-height: 30px;font-weight: 200; font-size: 22px;}
.oNama h2 {font-size:30px; font-weight:500; padding:12px;}

footer {background:#d0483c; margin-top:50px;box-shadow: 0 5px 8px 0 rgba(0,0,0,0.3);}

.footerMenu ul {padding-top:12px;}
.footerMenu li {display:block; padding:6px;}
.footerMenu ul li a {font-size: 18px;font-weight: 500;}

.footerInfo ul {padding-top:12px;color: #fff;}
.footerInfo li {display:block; padding:3px;font-weight: 100;}
.footerInfo ul li a {font-size: 18px;font-weight: 500;}
.footerInfo img {width: initial;margin-right: 12px;margin-bottom: -9px;}
.ikonice-m li {margin-bottom: 8px;}

.cert {margin-top: 45px;color: #fff;}
.cert img {width: 40px;margin-bottom: 10px;}
.cert p {font-size: 14px}

.gmap {margin-bottom: -4px;margin-left: 60px;}
.copy {text-align:center;height: 45px;margin-top: 15px;}
.copy p {color:black; padding:8px;font-size: 13px;}
.gmap {margin-bottom: -4px;}

.bx-wrapper {border: none;box-shadow: 0 5px 8px 0 rgba(0,0,0,0.3);}
.bx-viewport {height: 630px !important;}

.referenca {height: 200px;margin-bottom: 20px;box-shadow: 0 5px 8px 0 rgba(0,0,0,0.3);background-size: cover;}
.referenca h3 {position: absolute;bottom: 20px;left: 30px;color: #fff;font-weight: 600;font-size: 18px;text-transform: uppercase;width: 80%;}
.referenca p {position: absolute;bottom: 35px;left: 30px;color: #fff;font-size: 17px;font-weight: 200;}
.slick-slide:hover {transform: scale(1.05); transition: transform 0.5s ease;}

.single-projekti {margin-bottom: 130px;}
.single-projekti h1 {text-align:center; font-weight:700; font-size:35px;text-transform: uppercase;}
.single-projekti a, .single-projekti p {color: #383737;line-height: 23px;margin-bottom: 15px;}
.single-projekti a {margin:20px 20px 20px 0;}

.arhiva-projekti a:hover {opacity: 0.8;}

.page-h {margin-bottom: 50px;}

.content img {width: initial;margin-top: 10px;margin-bottom: 10px;}

.projekt-mapa {height: 320px;}

.single-projekt-slider {width: 100%;height: 400px;background-size: cover;background-position: center;}

.menuMobile {display: none;z-index: 1;position: relative;}

.proizvod {margin-bottom: 55px;height: auto;}
.proizvodSlider {width: 100%;display: inline-block;margin-top: 30px;}
.proizvodSlider .c6 {width: 50%;margin-left: 25%;}

.content li {display: list-item;}

.sliderBack {
    width: 100%;
    height: 630px;
    background-size: cover;
    background-position: center;
}

ul#menu-glavni {
    text-transform: uppercase;
}

/* EU prilagodba */

.muesli .c3 {
	width: 24%;
}

ul.muesli.c9 {
    margin-right: -90px;
}

.top.grid ul.c3 {
	width: 15%;
}

.eu-fond {
	width: 15%;
	text-align: center;
}

.eu-fond img {
    width: 105px;
    margin-top: -10px;
    margin-bottom: -15px;
}

.cert.eu-logos {
	margin-top: 18px;
}

.cert.eu-logos a {
	width: 100%;
    display: block;
    text-align: center;
}

.cert.eu-logos a img {
	width: 69%;
}

.spacer {
    height: 50px;
    display: block;
}










@media handheld, only screen and (max-width: 1100px), only screen and (max-device-width: 1100px) and (orientation:portrait) {

.gmap {
    margin-left: 0px;
}

.menu img {
    margin-left: 30px;
}

.oNama {
    padding: 20px;
}

.muesli .c3 {
	width: 100%;
}

.top.grid ul.c3 {
    width: 100%;
}

.eu-fond {
    width: 100%;
    margin-bottom: 25px;
}

}

@media handheld, only screen and (max-width: 1100px), only screen and (max-device-width: 1100px) and (orientation:portrait) {

.muesli li {width: 100%;margin-bottom: 20px;}
.welcome {
    padding-top: 0px;
    text-align: center;
    position: absolute;
    top: 400px;
}

}

@media handheld, only screen and (max-width: 930px), only screen and (max-device-width: 930px) and (orientation:portrait) {

.welcome p {display: none;}

}

@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}
.circular {width:60%; margin-left:auto; margin-right:auto}
.event-nav .c3{width:50%}
/**** ESSENTIAL - max768 - END ****/

/* MOBILE NAV */

nav.mobile {padding-top: 23px;height: 70px;}

.page-h {z-index: -1}

.arhiva-projekti a.c4 {z-index: -1}

.buttons {
	border: none;
	background-image: url("images/hambi.png");
	display: block;
    width: 30px;
    height: 24px;
    background-size: cover;
    margin: 0 auto;
}

.buttons:hover {
	cursor: pointer;
}

.menuMobile{background:#d0483c; text-align: center; margin-top:20px;}
.menuMobile ul {margin: 0 auto; padding: 0;}
.menuMobile li {display: block;   padding:15px 0 15px 0;}
.menuMobile ul li a { text-decoration:none;  margin: 0px; color:#fff;}
.menuMobile a{text-decoration:none; color:white;}
.menuMobile a:hover{text-decoration:none; color:white;}

.proizvodSlider .c6 {width: inherit;margin-left: inherit;}

.bx-wrapper .bx-controls-direction a {
    top: 70%;
}

/* MOBILE NAV */


}

@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}
}

@media handheld, only screen and (max-width: 540px), only screen and (max-device-width: 540px) and (orientation:portrait) {

.welcome h1 {font-size: 30px !important;}

}

@media handheld, only screen and (max-width: 430px), only screen and (max-device-width: 430px) and (orientation:portrait) {

.top ul.c3 {text-align: center;}
.content img {
    width: 100%;
}

}
