@import url("layout.css");
/*
Boje:
#b76f11  183,111,17  Svetlo Braon
#7d4900  125,73,0    Tamna Braon
#381a02  56,26,2     Crna-Braon
#ffcc00  255,204,0   Zuta
#ffd51a  255,213,26  Svetlo Zuta
#990000  153,0,0     Bordo Crvena
*/
body {
	background: #ffcc00 url('images/backgrid.jpg') repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.85em;
}
hr {
    border: 0;
    height: 1px;
/*	background-color: #990000;*/
    background-image: -webkit-linear-gradient(left, rgba(153,0,0,0), rgba(153,0,0,0.75), rgba(153,0,0,0));
    background-image:    -moz-linear-gradient(left, rgba(153,0,0,0), rgba(153,0,0,0.75), rgba(153,0,0,0));
    background-image:     -ms-linear-gradient(left, rgba(153,0,0,0), rgba(153,0,0,0.75), rgba(153,0,0,0));
    background-image:      -o-linear-gradient(left, rgba(153,0,0,0), rgba(153,0,0,0.75), rgba(153,0,0,0));
}
#container {
	width: auto;
	margin: 0 auto;
}
#masthead {
	text-align: center;
	width: auto;
	background-color: #ffffff;
	border-bottom: 5px solid #b76f11;
	margin-bottom: 10px;
/*	border-top: 5px solid #b76f11;*/
	-moz-box-shadow:    0px 0px 10px rgba(125,73,0,0.7);
	-webkit-box-shadow: 0px 0px 10px rgba(125,73,0,0.7);
	box-shadow:         0px 0px 10px rgba(125,73,0,0.7);
}
#wrapper {
    text-align: center;
}    
#navigation {
	position: relative; /*	float: left;*/
	width: 150px;
	margin: 0;
	display: inline-block;
	font-size: 1em;
	text-align: left;
	border-top:    2px solid #b76f11;
	border-right:  2px solid #b76f11;
	border-bottom: 2px solid #b76f11;
	border-left:   2px solid #b76f11;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background: #ffffff;
	background: rgba(255,255,255,0.5);
	vertical-align: top;
	-moz-box-shadow:    0px 0px 10px rgba(125,73,0,0.7);
	-webkit-box-shadow: 0px 0px 10px rgba(125,73,0,0.7);
	box-shadow:         0px 0px 10px rgba(125,73,0,0.7);
}
#content {
	/*    float: right;*/
	width: 780px;
	margin: 0;
	display: inline-block;
	text-align: left;
	padding: 10px;
	border-top:    2px solid #b76f11;
	border-right:  2px solid #b76f11;
	border-bottom: 2px solid #b76f11;
	border-left:   2px solid #b76f11;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background: #ffffff;
	background: rgba(255,255,255,0.5);
	vertical-align: top;
	-moz-box-shadow:    0px 0px 10px rgba(125,73,0,0.7);
	-webkit-box-shadow: 0px 0px 10px rgba(125,73,0,0.7);
	box-shadow:         0px 0px 10px rgba(125,73,0,0.7);
}
#footer {
	padding: 12px 12px 50px 12px;
	text-align: center;
	clear: both;
	width: auto;
	border-top: 5px solid #b76f11;
	margin-top: 10px;
	background-color: #7d4900;
	background-image: url('images/backgrid2.jpg');
	background-repeat: repeat;
	font-size: 0.85em;
	font-weight: bold;
	-moz-box-shadow:    0px 0px 10px rgba(125,73,0,0.7);
	-webkit-box-shadow: 0px 0px 10px rgba(125,73,0,0.7);
	box-shadow:         0px 0px 10px rgba(125,73,0,0.7);
}
/* Masthead Styles */
#masthead h1 {
	color: #7d4900;
}
#masthead a {
	text-decoration: none;
	color: #b76f11;
}
#masthead a:hover {
	text-decoration: none;
	color: #7d4900;
    -webkit-transition: all 0.2s ease-out;  /* Saf3.2+, Chrome */
    -moz-transition:    all 0.3s ease-out;  /* FF4+ */
	-ms-transition:     all 0.3s ease-out;
    -o-transition:      all 0.3s ease-out;  /* Opera 10.5+ */
    transition:         all 0.3s ease-out;
}
#masthead img {
	border-style: none;
}
/* Navigation Styles */
#navigation ul {
	list-style-type: none;
	width: 100%;
	display: block;
	margin: 0;
	padding: 0;
}
#navigation li {
	display: block;
	margin: 0;
	padding: 0;
}
#navigation a {
	color: #7d4900;
	text-decoration: none;
	display: block;
	padding: 8px;
    -webkit-border-radius: 7px;
    -moz-border-radius:    7px;
    border-radius:         7px;
}
#navigation a:hover {
/*	color: #ffffff;*/
	color: #990000;
	text-decoration: none;
/*	background-color: #b76f11;*/
background:    -moz-linear-gradient(top,  rgba(183,111,17,1) 0%, rgba(183,111,17,0) 50%, rgba(183,111,17,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(183,111,17,1)), color-stop(50%,rgba(183,111,17,0)), color-stop(100%,rgba(183,111,17,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(183,111,17,1) 0%,rgba(183,111,17,0) 50%,rgba(183,111,17,1) 100%); /* Chrome10+,Safari5.1+ */
background:      -o-linear-gradient(top,  rgba(183,111,17,1) 0%,rgba(183,111,17,0) 50%,rgba(183,111,17,1) 100%); /* Opera 11.10+ */
background:     -ms-linear-gradient(top,  rgba(183,111,17,1) 0%,rgba(183,111,17,0) 50%,rgba(183,111,17,1) 100%); /* IE10+ */
background:   linear-gradient(to bottom,  rgba(183,111,17,1) 0%,rgba(183,111,17,0) 50%,rgba(183,111,17,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b76f11', endColorstr='#b76f11',GradientType=0 ); /* IE6-9 */
}
#navigation li ul {
}
#navigation li ul a {
	color: #b76f11;
	text-decoration: none;
	display: block;
	padding: 4px;
	text-indent: 15px;
    -webkit-border-radius: 0px;
    -moz-border-radius:    0px;
    border-radius:         0px;
}
#navigation li ul a:hover {
/*	color: #ffffff;*/
	color: #990000;
	text-decoration: none;
/*	background-color: #b76f11;*/
}
/* Content Styles */
#content h1 {
	color: #381a02;
/*	background: white;
	background: rgba(255,255,255,0.5);*/
	font-size: 3em;
	margin-bottom: 20px;
	font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
	text-shadow: 0 0.05em 0.1em rgba(183,111,17,0.7), 0.1em 0.1em 0.4em rgba(56,26,2,0.15), 0.2em 0.4em 0.1em rgba(56,26,2,0.1), 0.3em 0.5em 0.5em rgba(56,26,2,0.15);
/*background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.02) 1%, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%); /* FF3.6+ */
/*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(1%,rgba(255,255,255,0.02)), color-stop(50%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
/*background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.02) 1%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
/*background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.02) 1%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
/*background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.02) 1%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* IE10+ */
/*background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.02) 1%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* W3C */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
}
#content h1 img{
	padding-right: 20px;
	border: none;
	vertical-align: middle;
}
#content h2 {
	color: #7d4900;
	font-size: 2em;
/*	margin-top: 20px;*/
	margin-bottom: 20px;
	font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
	text-shadow: 0 0.05em 0.1em rgba(183,111,17,0.7), 0.1em 0.1em 0.4em rgba(56,26,2,0.15), 0.2em 0.4em 0.1em rgba(56,26,2,0.1), 0.3em 0.5em 0.5em rgba(56,26,2,0.15);
}
#content h3,h4,h5,h6 {
	color: #b76f11;
	font-size: 1.5em;
	letter-spacing: 0.15em;
/*	margin-top: 20px;*/;
	margin-bottom: 20px;
	font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
	text-shadow: 0 0.05em 0.1em rgba(183,111,17,0.7), 0.1em 0.1em 0.4em rgba(56,26,2,0.15), 0.2em 0.4em 0.1em rgba(56,26,2,0.1), 0.3em 0.5em 0.5em rgba(56,26,2,0.15);
}
#content p {
	margin-top: 15px;
	margin-bottom: 15px;
	text-align: justify;
}
#content ul {
	list-style-type: disc;
	list-style-position: inside;
	text-indent: 2em;
	margin-bottom: 15px;
}
#content img {
	padding: 0px;
	vertical-align: middle;
/*	float: left;*/
/*	display: block;*/
}
#content a {
}
#content a img {
/*	border: none;*/
	padding: 0px;
	vertical-align: middle;
/*	margin-right: 10px;*/
}
/* Footer Styles */
#footer p {
	color: #000000;
	margin-top: 5px;
}
#footer a {
	color: #ffd51a;
	text-decoration: underline;
}
#footer a:hover {
	color: #ffffff;
	text-decoration: none;
    -webkit-transition: all 0.2s ease-out;  /* Saf3.2+, Chrome */
    -moz-transition:    all 0.3s ease-out;  /* FF4+ */
    -ms-transition:     all 0.3s ease-out;
    -o-transition:      all 0.3s ease-out;  /* Opera 10.5+ */
    transition:         all 0.3s ease-out;
}
.gallery {
/*	width: 100%;*/
/*	padding: 0px;*/
}
.gallery img {
	max-width: 128px;
	max-height: 128px;
	display: inline-block;
/*	position: relative; */
/*	z-index: 0;*/;
	filter: alpha(opacity=100);
	-moz-opacity:   1.0;
	opacity:        1.0;
	-khtml-opacity: 1.0;
/*	background-color: #eae9d4; /*frame colour*/;
/*	padding: 6px; /*frame size*/
	-webkit-box-shadow: 2px 2px 6px rgba(132, 132, 132, .75);
	-moz-box-shadow:    2px 2px 6px rgba(132, 132, 132, .75);
	box-shadow:         2px 2px 6px rgba(132, 132, 132, .75);
	-webkit-border-radius: 4px;
	-moz-border-radius:    4px;
	border-radius:         4px;
	margin-bottom: 10px;
	margin-right: 5px;
}
.gallery img:hover {
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	-khtml-opacity: 0.6;
}
.gallery a {
	text-decoration: none;
}
.gallery a:hover {
	text-decoration: none;
}
#mail a {
	text-decoration: none;
}
#mail a:hover {
	text-decoration: none;
}
a {
	color: #ff0000;
	text-decoration: none;
}
a:hover {
	color: #990000;
	text-decoration: underline;
}
p strong {
	font-weight: bold;
}
.style_bold {
	font-weight: bold;
}
.style_italic {
	font-style: italic;
}
.style_justify {
	text-align: justify;
}
.style_block {
	display: inline-block;
	vertical-align: middle;
}
.style_rfloat {
	float: right;
	clear: right;
/*	padding: 30px;*/
/*	margin-bottom: 10px;*/
	margin-left: 10px;
}
.style_lfloat {
	float: left;
	clear: left;
/*	padding: 30px;*/
/*	margin-bottom: 10px;*/
	margin-right: 10px;
}
.block {
	display: inline-block;
	vertical-align: middle;
/*	margin-bottom: 10px;*/
	width: 100%;
}
#gmap {
	float: right;
}
#nav{
	font-size: 1.2em;
	list-style: none;
	width: 100%;
/*	position: relative;*/
/*	float: left;*/
/*	margin-bottom: 10px; /* Clear floats */;
	z-index: 5;
	background-color: #7d4900;
	background-image: url('images/backgrid2.jpg');
	background-repeat: repeat;
	text-align: center;
}
#nav li{
/*	float: left;*/
/*	margin-right: 1px;*/
	position: relative;
	display: inline;
}
#nav a{
	background-position: center center;
/*	display: block;*/
	padding: 15px 30px 15px 30px;
	color: #ffffff;
	text-decoration: none;
	display: inline-block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	background: #381a02; /* Old browsers */
	background:    -moz-linear-gradient(top,  #b67116 0%, #3c1c07 33%, #3d1d06 67%, #010000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b67116), color-stop(33%,#3c1c07), color-stop(67%,#3d1d06), color-stop(100%,#010000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* Chrome10+,Safari5.1+ */
	background:      -o-linear-gradient(top,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* Opera 11.10+ */
	background:     -ms-linear-gradient(top,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* IE10+ */
	background:   linear-gradient(to bottom,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b67116', endColorstr='#010000',GradientType=0 ); /* IE6-9 */
}
#nav a:hover{
	background-position: center center;
	color: #ffffff;
	text-decoration: none;
    -webkit-transition: all 0.2s ease-out;  /* Saf3.2+, Chrome */
    -moz-transition:    all 0.3s ease-out;  /* FF4+ */
    -ms-transition:     all 0.3s ease-out;
    -o-transition:      all 0.3s ease-out;  /* Opera 10.5+ */
    transition:         all 0.3s ease-out;
/*	background: #990000; /* Old browsers */
/*	background: -moz-linear-gradient(top,  #9a0000 0%, #330100 33%, #330001 71%, #040000 100%); /* FF3.6+ */
/*	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9a0000), color-stop(33%,#330100), color-stop(71%,#330001), color-stop(100%,#040000)); /* Chrome,Safari4+ */
/*	background: -webkit-linear-gradient(top,  #9a0000 0%,#330100 33%,#330001 71%,#040000 100%); /* Chrome10+,Safari5.1+ */
/*	background: -o-linear-gradient(top,  #9a0000 0%,#330100 33%,#330001 71%,#040000 100%); /* Opera 11.10+ */
/*	background: -ms-linear-gradient(top,  #9a0000 0%,#330100 33%,#330001 71%,#040000 100%); /* IE10+ */
/*	background: linear-gradient(to bottom,  #9a0000 0%,#330100 33%,#330001 71%,#040000 100%); /* W3C */
/*	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9a0000', endColorstr='#040000',GradientType=0 ); /* IE6-9 */
}

/*--- DROPDOWN ---*/
#nav ul{
	background: #ffffff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background: rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style: none;
	position: absolute;
	text-align: left;
	left: -9999px; /* Hide off-screen when not needed (this is more accessible than display: none;) */
}
#nav ul li{
	display: block;
	padding-top: 1px; /* Introducing a padding between the li and the a give the illusion spaced items */
/*	float: none;*/
}
#nav ul a{
	display: block;
	padding: 10px 30px 10px 30px;
	white-space: nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{ /* Display the dropdown on hover */
	left: 0; /* Bring back on-screen when needed */
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background-position: center center;
	color: #ffffff;
	text-decoration: none;
	background: #990000; /* Old browsers */
	background:    -moz-linear-gradient(top,  #9a0000 0%, #330100 33%, #330001 67%, #040000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9a0000), color-stop(33%,#330100), color-stop(67%,#330001), color-stop(100%,#040000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #9a0000 0%,#330100 33%,#330001 67%,#040000 100%); /* Chrome10+,Safari5.1+ */
	background:      -o-linear-gradient(top,  #9a0000 0%,#330100 33%,#330001 67%,#040000 100%); /* Opera 11.10+ */
	background:     -ms-linear-gradient(top,  #9a0000 0%,#330100 33%,#330001 67%,#040000 100%); /* IE10+ */
	background:  linear-gradient(to bottom,  #9a0000 0%,#330100 33%,#330001 67%,#040000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9a0000', endColorstr='#040000',GradientType=0 ); /* IE6-9 */
}
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration: none;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background: #381a02; /* Old browsers */
	background:    -moz-linear-gradient(top,  #b67116 0%, #3c1c07 33%, #3d1d06 67%, #010000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b67116), color-stop(33%,#3c1c07), color-stop(67%,#3d1d06), color-stop(100%,#010000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* Chrome10+,Safari5.1+ */
	background:      -o-linear-gradient(top,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* Opera 11.10+ */
	background:     -ms-linear-gradient(top,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* IE10+ */
	background:   linear-gradient(to bottom,  #b67116 0%,#3c1c07 33%,#3d1d06 67%,#010000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b67116', endColorstr='#010000',GradientType=0 ); /* IE6-9 */
}