@font-face{
  font-family:'helveticaneueltpro';
  src: url('../font/helveticaneueltpro-lt_0.eot'); /* here you go, IE */
}
@font-face {
  font-family: 'helveticaneueltpro';
  src: url('../font/helveticaneueltpro-lt_0.otf') format('opentype'); /* IE no comprende format()! */
}


html, body {
	width:100%;
	height: 100%;
  padding: 0;
  margin: 0;
font-family: "helveticaneueltpro", sans-serif;
  font-size: 13.5px;
  line-height: 130%;
  color: #262626;
  font-weight: normal;
  text-align:center;}


.naslovna{padding: 2% !important;max-width: 300px; margin: 100px 0 0 0 !important;}

.centrirano{text-align: center !important;}

.naslovni-baner{max-height: 97px;}
	
.dvideo {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
	background-color: white;
  }
 .dvideo iframe{position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;}
.video-embed-field-responsive-video:after {
    content: '';
    display: none;
    padding-bottom: 0;
}

.strana {
position:relative;
display:inline-block;
width: 100%;
z-index:1;
text-align:center;
}

.bxslider{vertical-align:top;text-align:center;width:100%;height:auto;padding:0;margin:0;z-index:0;}
.bxslider li img{width:100% !important; height:auto;}


/* heder */

.layout-footer{position:inline-block; margin:60px 0 0 0; padding:0;
	display: inline-block; width:100%; height:240px;
	color:#0a5a92;
background-image: url(../images/trava.png);
  background-repeat: repeat-x;
  	}

/** sirina strane **/


.layout-container{display: inline-block;
	width:80%;
	max-width:1000px;
  min-height: calc(100vh - 407px);
	color: black;
	margin: 0;
}

.layout-sijenka{display: inline-block;
  width:80%;
  max-width:1000px;
  min-height: calc(100vh - 407px);
  color: black;
  margin: 2.5%;
  padding: 4%;
-webkit-box-shadow: 0px 0px 29px -6px rgba(0,0,0,0.54);
-moz-box-shadow: 0px 0px 29px -6px rgba(0,0,0,0.54);
box-shadow: 0px 0px 29px -6px rgba(0,0,0,0.54);
}


.centriran{
	width:100%;
	text-align:center;}
.justify{
  width:100%;
  text-align:justify !important;}

.event{margin: 10px 0 0 10px !important; width: 53% !important;}
.eventmargin{margin: 6px 0 6px 0 !important;}


a:link {color: #262626; text-decoration:none;}
a:visited {color: #262626; text-decoration:none;}
a:hover {color: red; text-decoration:none;}
a:active {color: #262626; text-decoration:none;}
			
			
hr {
	background-color: gray;
	opacity: 0.5;
	height: 1px;
	border: none;
	width: 100%;
    }


p, h2, h3 {	text-align: justify;
    display:inline-block;
    margin: 0;
}			

h1{font-family: "helveticaneueltpro", sans-serif; color: #262626; text-align: left;
	font-size: 19pt; line-height: 130%; margin:0 0 15px 0;font-weight: normal; width:auto;}



h2 {
	font-family: "helveticaneueltpro", sans-serif;
	font-size: 16pt;
  line-height: 130%;
	color: #262626;
	font-weight: normal;
	text-align: left;
	margin:5px 0 15px 0;	
}

h3 {
	font-family: "helveticaneueltpro", sans-serif;
	font-size: 14pt; line-height: 100%; text-align: left;
	color: #262626; margin: 0; padding: 0;
    font-weight: normal;
    margin: 0;

    }

    

.strana100 {display: inline-block;vertical-align: top;padding: 0px;	margin: 0px;
			width: 100%;max-width:1100px;text-align: center;}

.cijela100 {position:relative;display: inline-block;vertical-align: middle;
			width: 100%;text-align: center;}



.node100-3 {display: inline-block; vertical-align: top; text-align: justify !important;width: 92%; 
	       border-radius: 9px;background: rgba(255, 255, 255, 0); padding: 2%;  margin: 1%;
           column-count: 3;column-gap: 20px;}

.node100-2 {display: inline-block; vertical-align: top; text-align: justify !important;width: 92%; 
	       border-radius: 9px;background: rgba(255, 255, 255, 0); padding: 2%;  margin: 1%;
           column-count: 2;column-gap: 40px;}

.node100 {display: inline-block; vertical-align: top; text-align: left; width: 99.5%; padding: 0%; margin: 0;}

.node80 {display: inline-block; vertical-align: top; text-align: left; width: 79.5%; padding: 0; margin: 0;}
.node60 {display: inline-block; vertical-align: top; text-align: left; width: 59.5%; padding: 0; margin: 0;}
.node50 {display: inline-block; vertical-align: top; text-align: left; width: 49.5%; padding: 0; margin: 0;}
.node33 {display: inline-block; vertical-align: top; text-align: left; width: 32.5%; padding: 0; margin: 0;}
.node20 {display: inline-block; vertical-align: top; text-align: left; width: 19.5%; padding: 0; margin: 0;}
.node10 {display: inline-block; vertical-align: top; text-align: left; width: 9.5%; padding: 0; margin: 0;}


.okvir100 {display: inline-block; vertical-align: top; text-align: justify;width: 73%; 
         border-radius: 6px; padding: 8% 2% 8% 15%;  margin: 1%;
           border: 1px solid #d0d0d0;}
.okvir40 {display: inline-block; vertical-align: top; text-align: justify;width: 32%; 
         border-radius: 6px; padding: 2%;  margin: 1%;
           border: 1px solid #d0d0d0;}
.okvir20 {display: inline-block; vertical-align: top; text-align: justify;width: 12%; 
         border-radius: 6px; padding: 2%;  margin: 1%;
           border: 1px solid #d0d0d0;}
.okvir13 {display: inline-block; vertical-align: top; text-align: justify; width: 11%; height: auto; 
         border-radius: 3px; padding: 5px;  margin: 5px;border: 1px solid #d0d0d0;}


.is-active {color:red;}
.stavka{display: inline-block; text-align: left; 
  padding:0; width:100%; 
  margin:-7px 0 0 0;}
.stavka-podmeni {display: inline-block; text-align: left; 
	padding:0 0 0 20px; width:100%; 
	margin:0;}

a:hover .okvir100 img{
    filter: none;
      -webkit-filter: saturate(1.2);
      -webkit-transform: scale(1.2);
    } 

.colorbox, .cboxElement {outline : none;}

#edit-field-kontakt-your-email-0-value, #edit-field-kontakt-subject-0-value, #edit-field-kontakt-body-0-value{
	display: inline; font-family: "helveticaneueltpro", sans-serif; font-size: 12pt; width:100%; margin:0 0 5px 0;}


 #edit-submit{
 	cursor: pointer;
 	border:0;
 	font-family: "helveticaneueltpro", sans-serif;
	font-size: 13pt;
	font-weight: normal;
	color: #4b7b13;
 	width: 100%;
	line-height: 30px;
	text-align:center;
	}
#edit-submit:hover{color: #4b7b13;}

  
.footer33, .footer33-l, .footer33-r {position:relative; display: inline-block;
	font-family: "helveticaneueltpro", sans-serif; 	font-size: 10pt;
	color:#043a64;
	
	text-align: center;
	width:43%;
  }
 .footer33 a {color:#043a64;}

 .footer33-l {width:26%;text-align: left;padding:0 0 0 10px;}
 .footer33-r {width:26%;text-align: right;padding: 0 10px 0 0;}

#block-webatelje-content{
display: inline;
text-align: left;	
}

 
#edit-preview{display:none;}

#desk{display:inline-block;}
#mob{display:none;}


/* JMenu 1.0 RC1 | MIT License | https://github.com/jamesjohnson280/JMenu */

section {margin-bottom: 50px;}
  

#menu_icon, #menu_icon a{display:none; width:100%; margin:15px 0 5px 0;}


#nav {position: relative;width: 100%; margin:-2px 0 0 0; padding:0; z-index: 900;text-align:center; vertical-align: bottom;}
#nav a {display: none;}

ul{list-style-type: none;}

#nav ul{margin: 0; padding:0;}
#nav ul li {display: inline-block; margin: 0; vertical-align: bottom;
	font-size:11pt; font-family: "helveticaneueltpro", sans-serif;text-transform: uppercase; text-align: center;}
#nav ul li {width: auto; max-width: 110px; height:auto; min-height: 40px; padding:6px; border-radius: 0 0 10px 10px; border: 3px solid black; 
	color: #4b7b13; background-color:white;}
#nav ul li a{display: inline-block; width: 100%;height:auto; min-height: 40px; color: #4b7b13;
text-transform: uppercase; text-align: center;}
#nav ul li:hover a, #nav ul li a.is-active {width: auto%;color:black;background-color:#ffdf00;}
#nav ul li:hover a, #nav ul li a.is-active{
    filter: none;
      -webkit-filter: saturate(1.2);
      -webkit-transform: scale(1.1);
    } 

#drvo, #drvo2{background: rgba(255, 255, 255, 0);padding: 0 0 0 2%;  margin: 0;border-radius: 0;}
#drvo2{padding: 0 2% 0 0;}


@media only screen and (max-width: 700px){

html, body {width:100%;height: 100%;padding: 0;margin: 0;
font-family: "helveticaneueltpro", sans-serif;font-size: 17px;}


.layout-container{width:95%;}


.layout-header-meni{width: 99%; height:auto;}
.layout-header-slider{width: 99%;}


.naslovni-baner{max-height: 97px; width: 95% !important;}

.node20, .node33, .node80 {width: 98%; padding: 0;  margin: 0;}
.okvir13 {width: 23%;}

#footer {height: auto; padding: 20px 0 0 0;}

.footer33-l {display:none;}

.footer33, .footer33-r {width:95%; text-align:center;}




.node100-2, .node100-3 {width: 90%;column-count: 1;}



.galerija33 {width: 39%;}

.contact_strana, .contact50, .contact50-2 {width: 100%;}


#menu_icon, #menu_icon a{display:block; width:100%;}

#nav {position: relative;width: 100%; margin:20px 0 0 0; padding:0; z-index: 900;background-color: white; text-align:center; border-radius: 10px 10px 0 0;border-bottom: 5px solid white;}/* position relative da bi bio iznad pinterest grid */
#nav a {display: none;}
ul{list-style-type: none;}


#nav ul,#nav ul li {margin:0;padding:0;border-radius:0; border:0; border-bottom: 3px solid gray;}
#nav ul li, #nav ul li a {display: inline-block; width: 100%; max-width: 100%; height:auto; max-height: 100%;min-height: 25px; 
text-transform: uppercase;font-size: 15pt; padding:5px 0 5px 0; text-align: center;}
#nav ul li:hover a, #nav ul li a.is-active {width: 100%; color:black;}

#nav {display:none;}
#nav:target {display: block; top:-75px;}


#desk{display:none;}
#mob{display:inline-block;}

}