body {font-family: 'latoregular', Arial, sans-serif;}
.logo {background:#191B1C url(logo-mob.png) no-repeat 0 center; position: relative; width: 177px; height: 91px;  float: left; margin-top: 0px;}
.logo:before{display: none}
.logo:after{display: none}
a {color: #906447;outline: none; text-decoration: none;-webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
a:hover {color: #4f5450; }
h1,h2,h3,h4 {font-weight: 400; color: #908e79;font-family: 'montserratregular';}
h1 {font-size: 26px;}
h2 {font-size: 20px;}
h3 {font-size: 18px;}
h4 {font-size: 16px;}
hr { 
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #9C6B4B;
    margin: 0;
    padding: 1em 0; }
.fa-check {color: #7DC417}
strong {font-weight: 700}
header {padding: 0px 0; display: block; float: left; width: 100%; position: absolute; z-index: 100}
.header {padding:0; display: block; float: left; width: 100%;background:#191B1C}
nav[role="navigation"] ul {list-style-type: none;margin: 30px 0 0 50px;
    padding: 0;
    float: left; padding: 0; }
nav[role="navigation"] li {
	float: left;
	margin: 0 4px 0 0;
	font-size: 14px;
	}
nav[role="navigation"] li a {
	float: left;
	padding: 8px 12px;
    font-family: 'montserratregular';
	text-decoration: none;
	color: #4f5450 ;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
	}
nav[role="navigation"] li a:after, nav[role="navigation"] li.active a:after{height: 2px;
    display: block;
    width: 30%;
    margin: 5px auto 0 0;
    background: #9C6B4B;
    border-right: 1px white;
    content: '';   
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
nav[role="navigation"] li a:hover,
nav[role="navigation"] li a:focus {
/*	background: #d8d3b5;*/
	}
nav[role="navigation"] li a:after{background: transparent;}
nav[role="navigation"] li a:hover:after{width: 100%; background: #9C6B4B;}
   
nav[role="navigation"] li.active a {
/*
	color: #fff;
	background: #4f5450;
*/
	}	
ul.lang {list-style-type: none; margin: 0px;padding: 0; float: right; padding: 0;}
ul.lang li {display: inline-block;margin: 11px 10px;}

ul.lang li a{font-family: 'montserratregular';text-decoration: none;color: #4f5450 ; text-transform: uppercase; font-size: 12px;}
ul.lang li a:after,
ul.lang li.current a:after{height: 1px;
    display: block;
    width: 30%;
    margin: 0;
    background: #9C6B4B;
    float: right;
    border-right: 1px white;
    content: '';   
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
ul.lang li a:after {background: transparent}
ul.lang li a:hover:after{width: 100%; background: #9C6B4B;}
nav.breadcrumb {
	font-size: 12px;
	color: #ccc;
    margin: 10px 0;
	}
nav.breadcrumb a {
	margin: 0 5px;
	text-decoration: none;
	color: #999;
	}
nav.breadcrumb a:first-child {
	margin-left: 0;
	}
nav.breadcrumb a:hover,
nav.breadcrumb a:focus {
	color: #333;
	}
nav.breadcrumb a:active {
	color: #666;
	}
nav.breadcrumb strong {
	margin-left: 5px;
	font-weight: bold;
	color: #333;
	}				

.side-nav {
	padding: 0 25px 25px; 
    background: #fcfcfc;
     border-bottom: 1px solid #f1f1f1;
	}
.side-nav ul{
	margin: 0; list-style-type: none; padding: 0

	}
.side-nav ul li a {
	display: block;
	padding: 8px 5px 8px 15px;
	font-size: 14px;
	line-height: 1;
    border-bottom: 1px solid #dadada;
    color: #4f5450;
    position: relative
	}
.side-nav ul li a:focus,
.side-nav ul li a:hover {
	background: #eee;
    color: #f3683d;
	}
.side-nav ul li a.active {
	color: #f3683d;
	}
.side-nav ul li a.active:before {
	 content: '\f104';  
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
/*--adjust as necessary--*/
    color: #f3683d;
    font-size: 16px;
    padding-right: 0.5em;
    position: absolute;
    top: 7px;
    left: 0;
	}
/*.slider-holder {position: absolute; max-width: 100vw; width: 100%; top: 0;}*/
.slider { max-height: 80vh; overflow: hidden; min-height: 60vh;}
.slider.page { max-height: 40vh; overflow: hidden; min-height: 25vh;}
.slider .slick-slide img { width: 100%; vertical-align: middle; height: 100%}
.slider div.slide {
        background-size: cover;
        height: 80vh; 
        min-height: 60vh;
        background-position: center center;
	}
.caption  {position: absolute; z-index: 10000; top: 100px; left: 100px}

.proizvodi,.welcome {padding: 30px 0; }

.welcome {background-color:  #191B1C;color: #fff;}

.proizvodi {background: #4f5450; color: #fff; }

.proizvodi .title{display: block; width: 100%; text-transform: uppercase; font-size: 28px; color: #c9c69b; text-align: center; margin-bottom: 15px; }

.intro .title {display: block; position: relative; width: 100%; text-transform: uppercase;  color: #191B1C; text-align: center; margin-bottom: 15px;font-family: 'montserratregular';}
.intro {text-align: justify; font-size: 18px; }
.intro p{margin: 35px 0;}
.welcome .intro .title, .welcome .intro {color: #fff; text-align: center}
.intro .title:after
  {height: 3px;
    display: block;
    width: 25%;
    margin: 10px auto 0 auto;
    background: #9C6B4B;
    border-right: 1px white;
    content: '';   
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}

ul.inline {padding: 0; margin: 0 0 20px 0; list-style-type: none; text-align: center}
ul.inline li{display: inline}
ul.inline li .button{margin: 0 0px 10px 0}

.button{border: 2px solid #9C6B4B; padding: 9px 14px; font-size: 14px; text-transform: uppercase; font-family: 'montserratregular';display: inline-block;  }

.button:hover {border-color: #191B1C; color: #fff; background-color: #191B1C}
.welcome .button:hover {border-color: #fff; color: #fff}
.proizvodi h2,.welcome h2{color: #4f5450; font-weight: 400; font-size: 1.5em; padding-bottom: 10px; cursor: pointer}
.proizvodi h2:after,.welcome h2:after{height: 3px;
    display: block;
    width: 30%;
    margin: 10px auto 0 auto;
    background: #f3683d;
    border-right: 1px white;
    content: '';   
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
.proizvodi .article:hover h2:after,.welcome .article:hover h2:after{width: 80%;}
.article {cursor: pointer;text-align: center;}
.lista .article {margin-top: 20px;}
.proizvodi h2 { color: #fff;}
.proizvodi img, .welcome img {border-radius: 50%}
.more {color: #f3683d; text-transform: uppercase; font-size: 0.9375em; font-weight: 700; text-decoration: none;}
.more .fa {margin-left: 5px;}
.more:hover {color: #4f5450; }
.proizvodi .more:hover {color: #c9c69b; }
.main {padding-bottom: 25px}
footer {padding: 20px 0; border-top: 1px solid #ccc}
footer ul {margin: 0; padding: 0; list-style-type: none;}
footer h3 {color: #191B1C;}
h3:after, .main h1:after, .main h2:after{height: 1px;
    display: block;
    width: 35px;
    margin: 5px 0 0;
    background: #ccc;
    border-right: 1px white;
    content: '';   
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
#map_canvas { width:100%; height:300px; margin-bottom: 25px}

#map_canvas img { max-width: none; }
#map_canvas h3 { padding:0; margin:0; }
.mg-image a {display: block;background: #191B1C; overflow: hidden; margin-bottom: 25px}
.mg-image img {
    -webkit-transition: all 0.5s ease; /* Safari and Chrome */
    -moz-transition: all 0.5s ease; /* Firefox */
    -o-transition: all 0.5s ease; /* IE 9 */
    -ms-transition: all 0.5s ease; /* Opera */
    transition: all 1s ease;
        max-width: 100%;
    
}
.mg-image:hover img {
    -webkit-transform:scale(1.05); /* Safari and Chrome */
    -moz-transform:scale(1.05); /* Firefox */
    -ms-transform:scale(1.05); /* IE 9 */
    -o-transform:scale(1.05); /* Opera */
     transform:scale(1.05);
     opacity: 0.8;
}
 
.features {background: rgba(242,242,242,0.45)}
ul.list-features {
    padding: 0;
    margin: 25px 0;
    list-style-type: none;
}
ul.list-features li {
    display: inline-block;
    width: 33%;
    padding-bottom: 13px;
    font-size: 20px;
/*    text-align: center;*/
    color:#191B1C 
}
ul.list-features.third li {width: 100%;}
ul.list-features.half li {width: 100%;}

ul.social  {
    font-size: 1.2em;
    list-style-type: none;
     margin: 0px 0 0;
}
ul.social  li {
    display: inline;
    margin-right: 8px;
}
.fa-facebook {
    color: #3b5998;
}
.fa-twitter {
    color: #55acee;
}
.fa-youtube {
    color: #e52d27;
}
ul.social  li a{padding: 3px 6px}
ul.social  li a:hover .fa{
    color: #222
}
.fa em {
    text-indent: -9999px;
    display: none;
}
[type="text"], [type="password"], [type="date"], [type="datetime"], [type="datetime-local"], [type="month"], [type="week"], [type="email"], [type="number"], [type="search"], [type="tel"], [type="time"], [type="url"], [type="color"], textarea {border: 2px solid #906447;}
  [type="text"]:focus, [type="password"]:focus, [type="date"]:focus, [type="datetime"]:focus, [type="datetime-local"]:focus, [type="month"]:focus, [type="week"]:focus, [type="email"]:focus, [type="number"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="time"]:focus, [type="url"]:focus, [type="color"]:focus,
  textarea:focus {border: 2px solid  #191B1C}
.book-box { background-color: #fcfcfc; margin-bottom: 0.625em; padding: 1em; font-size: 0.875em}
.book-box  .find{font-family: 'Slabo 13px', serif; color: #282826; font-size: 1.5em; font-weight: 400; margin-bottom: 0.875em; display: block;}

.book-box  label, label{color: #282826; font-weight: 400; margin-bottom: 0.875em; position: relative; text-align: center; border-bottom: 1px solid #ccc;}
label {border-bottom: 1px solid #f3f3f3;}
.book-box   label span,label span {
position: absolute;
top: -10px;
background: #fcfcfc;
padding: 0 8px;
left: 0;
right: 0;
width: 50%;
margin: 0 auto;
}
label span {background: #fff;}

#upit input,#upit .button, textarea {margin: 1em 0; float: left; }

#menu {display:none;}
.js .slicknav_menu {display:block;}
.mobile-nav{position: absolute; right: 0}
@media screen and (min-width: 40em) {

h1 {font-size: 36px;}
h2 {font-size: 30px;}
h3 {font-size: 24px;}
h4 {font-size: 21px;}
header {padding: 20px 0; }
.header {background: rgba(239,239,239,0.77); }
 .logo {background:#191B1C url(logo.png) no-repeat 0 center; position: relative; width: 300px; height: 91px;  float: left; margin-top: 0px;}
.logo:before{
    content: ' ';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 0 0 300px;
    border-color: transparent transparent transparent #191b1c;
    position: absolute;
    border-style: inset;
    display: block;
    top:-8px;
    -webkit-transform:rotate(360deg);
}
.logo:after{
    content: ' ';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 300px 0 0;
    border-color:  #191b1c transparent transparent transparent;
    position: absolute;
    border-style: inset;
    display: block;
    bottom:-8px;
    -webkit-transform:rotate(360deg);
}
    ul.lang li{text-align: right; display: block;margin: 0px;}
ul.inline li .button {margin: 0 20px 10px;}
.button {padding: 9px 30px;font-size: 16px;display: inline-block; }
    ul.list-features.third li {width: 33%;}
ul.list-features.half li {width: 49%;}

}

@media screen and (min-width: 64em) {
      .slicknav_menu {display:none;}
     #menu {display:block;}
}
/*fonts*/
@font-face {
    font-family: 'latoitalic';
    src: url('font/lato-italic-webfont.eot');
    src: url('font/lato-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/lato-italic-webfont.woff2') format('woff2'),
         url('font/lato-italic-webfont.woff') format('woff'),
         url('font/lato-italic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'latoregular';
    src: url('font/lato-regular-webfont.eot');
    src: url('font/lato-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/lato-regular-webfont.woff2') format('woff2'),
         url('font/lato-regular-webfont.woff') format('woff'),
         url('font/lato-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'montserratregular';
    src: url('font/montserrat-regular-webfont.eot');
    src: url('font/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/montserrat-regular-webfont.woff2') format('woff2'),
         url('font/montserrat-regular-webfont.woff') format('woff'),
         url('font/montserrat-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}