/******************************* RESET *******************************/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video 
{margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
html {overflow-y: scroll;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
nav ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:''; content:none;}
a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}
ins {background-color:#ff9; color:#000; text-decoration:none;}
mark {background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;}
table {border-collapse:collapse; border-spacing:0;}
hr {display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
input, select {vertical-align:middle;}



/******************************* CSS3 FANCY EFFECTS *******************************/


@font-face {
    font-family: 'OpenSans-Light';
    src: url('http://pisarna.novisplet.com/islandlastovo/fonts/OpenSans-Light.ttf');
    src: url('http://pisarna.novisplet.com/islandlastovo/fonts/OpenSans') format('embedded-opentype'),
         url('http://pisarna.novisplet.com/islandlastovo/fonts/OpenSans-Light.ttf') format('truetype'),
    font-weight: light;
    font-style: light;
}

@font-face {
    font-family: 'OpenSans-Regular';
    src: url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Regular.ttf');
    src: url('http://pisarna.novisplet.com/torkar/fonts/OpenSans') format('embedded-opentype'),
         url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Regular.ttf') format('truetype'),
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Semibold';
    src: url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Semibold.ttf');
    src: url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Semibold.ttf') format('embedded-opentype'),
    url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Semibold.ttf') format('truetype'),
    font-weight: semibold;
    font-style: semibold;
}

@font-face {
    font-family: 'OpenSans-Bold';
    src: url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Bold.ttf');
    src: url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Bold.ttf') format('embedded-opentype'),
         url('http://pisarna.novisplet.com/torkar/fonts/OpenSans-Bold.ttf') format('truetype'),
    font-weight: bold;
    font-style: bold;
}

::selection      {background: #003865;color:#fff;}
::-moz-selection {background:#003865;color:#fff;}

.roundy {-webkit-border-radius:0 0 14px 14px; -moz-border-radius: 0 0 14px 14px; border-radius: 0 0 14px 14px;}

.botleftroundy {-webkit-border-radius:0 0 0 14px; -moz-border-radius: 0 0 0 14px; border-radius: 0 0 0 14px;}

a {  
  outline:none;
 -webkit-transition: color .25s ease-out, text-shadow .25s ease-out;
  -moz-transition: color .25s ease-out, text-shadow .25s ease-out;
  -o-transition: color .25s ease-out, text-shadow .25s ease-out;
  transition: color .25s ease-out, text-shadow .25s ease-out;
}  



/******************************* INDEX, HEADER, FOOTER *******************************/

html {overflow-y:scroll;}

body {
    line-height:18px;
	font-family:Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	font-size:14px;
	background:#0c5ea0 url('../images/bgrep.jpg') repeat-x center 150px;
}

.wrap {width:960px; margin:0 auto; position:relative;}
header {height:81px; float:left; width:960px; position:relative;}
header h1, header h2 { background: url(../images/logo.png) no-repeat;left:0; top:29px; width:274px; height:33px; text-indent:-5000px; position:absolute; }
header div {font-family: Century Gothic, Arial, sans-serif; height:12px; text-align:right; right:0; top:8px; font-size:13px; padding:4px 0 0 0; text-align:center; color:#fff;  position:absolute;}
header div a {  color:#8fc7f6; font-weight:normal;text-decoration:none;}
header div a:hover {text-decoration:none; color:#fff; }
header div a.active {text-decoration:underline;}

a.logo {float:left;}

nav {right:0; bottom:10px; position:absolute; font-size:16px; width:700px; font-family: Century Gothic, Arial, sans-serif;}
nav ul { list-style:none; padding:0; text-align:right;}
nav ul li {background:none; display:inline; padding: 0;}
nav ul li a { color:#ffffff; font-size: 16px; text-decoration:none; padding:15px 13px; font-family: Century Gothic, Arial, sans-serif; font-weight: bold;  }
nav ul li a.active { color:#FFF; background: #002645; text-decoration: none; text-shadow: none; }
nav ul li a:hover { color:#FFF; background: #002645; text-shadow: none; text-decoration: none;}

footer {  float:left; border-top:1px solid #2089dd; margin-top:20px; padding:5px 0 30px 0; width:960px; font-size:12px;}
footer p.left { color:#2089dd; width:450px; float:left; font-size:12px;}
footer p.right { float:right; width:216px; background: url('../images/novisplet.png') no-repeat right 11px;}
footer p.right img { float:left; margin:0px 0 0 10px;}
footer a { color:#2089dd;text-decoration:none; float:left;}
footer a:hover { text-decoration:underline;}

.mainmenu {position:absolute; top:116px; width: 960px;}
.mainmenu ul {padding:0px; margin: 0px; width: 960px; text-align: left;}
.mainmenu nav ul {text-align: left;}

input.polje, textarea.tpolje {width: 578px!important;}

/******************************* BODY OZADJA za INDEX in SUB *******************************/

#bgindex { background: url(../images/header.gif) top repeat-x; min-height:500px;}
#bgsub { background:#06F; min-height:500px;}

/******************************* INDEX MIDDLE *******************************/

#middle { background: url('../images/slider-bg.png') no-repeat; margin-top:110px; float:left; width:960px; position:relative;  height:381px; }
#middle a { color:#e71d25;}
#middle a:hover { color:#000; text-decoration:underline;}

.tekst h1, .tekst h2 { font-weight:700; font-size:30px; padding: 7px 0 15px 0; color: #FFF; line-height:24px; font-family: Century Gothic, Arial, sans-serif;}
.tekst { color: #FFF; right:40px; top:21px; width:263px;  z-index:24; position:absolute;}
.tekst p {padding: 0 0 8px 0;}

#middle .image {  width: 608px; height:304px; position:absolute; top:21px; left:21px;}
#middle .image img { height:304px !important; width: 608px !important;}

#boksi { float:left; width:960px; margin-top:0; font-size:13px; color: #FFF;}
#boksi p {color: #FFF;}

.box { float:left; color:#FFF; padding:0 0 15px 0; width:310px; margin:0 15px 0 0; display:inline;}
.box3 { color:#FFF;  margin:0 15px 0 0; display:inline;}

.last { margin-right:0;}

.box div { float:left; width:311px; padding:5px 5px 0 5px;}
.box3 div { float:right; width:300px; padding:0; font-size: 15px; margin-top: 10px;}

#boksi h3 { font-weight:bold; padding:0 0 10px 0; color:#e71d25; background: #E6E6E6}

#boksi a {color:#FFF; text-decoration:underline;}

#boksi a:hover {color:#FFF; text-decoration:none;}

.last a {color:#FFF!important; text-decoration:underline;}

.last a:hover {color:#FFF !important; text-decoration:none;}

#nav {position: absolute; top: 488px; right: 168px; z-index: 16;}
#nav a {background: #FFF; color: transparent; font-size: 1px; display: inline-block; width: 13px; height: 13px; border: 3px #FFF solid; margin-left: 10px; ;-webkit-border-radius: 50px;-moz-border-radius: 50px;border-radius: 50px;}
#nav a.activeSlide {background: #dc1e1e; color: transparent;}

.icon a {display: block; font-family: Century Gothic, Arial, sans-serif; width: 242px; height: 44px; padding: 22px 0 0 69px; font-size: 22px; font-weight: bold; text-decoration: none!important;}
.icon a:hover {text-decoration: underline!important;}

.icon-1 a {background: url('../images/btn-1.gif') no-repeat;}
.icon-2 a {background: url('../images/btn-2.gif') no-repeat;}
.icon-3 a {background: url('../images/btn-3.gif') no-repeat;}
.icon-4 a {background: url('../images/btn-4.gif') no-repeat;}
.icon-5 a {background: url('../images/btn-5.gif') no-repeat;}
.icon-6 a {background: url('../images/btn-6.gif') no-repeat;}
.icon-7 a {background: url('../images/btn-7.gif') no-repeat;}
.icon2 a {display: block; color: #0c5ea0!important; font-family: Century Gothic, Arial, sans-serif; margin-top: 20px; width: 224px; height: 54px; padding: 12px 0 0 75px; font-size: 22px; font-weight: bold; text-decoration: none!important;}
.icon2 a:hover {color: #0c5ea0!important; text-decoration: underline!important;}

/******************************* SUB MIDDLE *******************************/

#submiddle {float:left; width:960px;background:#ffffff;margin-top:95px;}
#submiddle h1.title {font-family: Century Gothic, Arial, sans-serif; font-weight:bold; padding:10px 10px 10px 20px; background:#003865; color:#ffffff; float:left; width:930px;}

.title2 h3 {font-size: 25px; color: #004781; margin-top: 15px;}
.red {color: #df0024;}

.image {width:946px; height:350px; position:absolute; top:0; left:0; }
.image img {width:946px; height:350px;}

.subimage {width:946px; height:190px; float:left;border:7px solid #ffffff;}
.subimage img {width:946px; height:190px;}

.stasaimage {width:946px; height:350px; float:left;border:7px solid #33322B;}
.stasaimage img {width:946px; height:350px;}

#left { float:left; padding:25px 5px 20px 20px; width:175px; font-size:13px; line-height:18px;}

#left ul { padding:0 0 0 0;font-size:15px;}

#left ul li { padding:0 0 0 0; background:none; float:left; margin:2px 0;}

#left ul li a { background:url(../images/ulli.gif) left 9px no-repeat; text-decoration:none; color:#000; float:left; padding:4px 10px 4px 18px;}

#left ul li a:hover { color:#df0024;}

#left ul li a.active { color:#df0024;}

#left h3 { border-bottom:1px dotted #33322B; margin-bottom:10px; padding-bottom:10px;}

#left a {color:#e71d25;}

#left a:hover { color:#000; }

#content { float:left;padding:0 19px 20px 29px; line-height:20px; border-left:1px dotted #33322B; width:690px; margin:20px 10px; display:inline; min-height:300px; }

#content a { color:#e71d25;}

#content a:hover { color:#999}

#content h1 { padding-bottom:10px;}

#content ul li { padding-bottom:6px;}

#content h3 {font-size:20px;padding-bottom:5px; padding-top:20px;}

/******************************* COMMON STYLES *******************************/

h1 {font-size:20px;}

h2 {font-size:18px; padding: 8px 0 8px 0;}
h2 a {color: #000!important; text-decoration: none;}
h3 { font-size:16px; font-weight:normal;}

p { padding:8px 0;}

ul { list-style:none; padding:0 0 0 0;}
ul li { padding:0 0 3px 16px; background:url(../images/ulli.gif) left 5px no-repeat;}

.alterfontlight {font-family:  'OpenSans-Light', Arial, sans-serif; font-weight:normal;}
.alterfontregular {font-family:   'OpenSans-Regular', Arial, sans-serif; font-weight:normal;}
.alterfontbold {font-family:  'OpenSans-Semibold', Arial, sans-serif; font-weight:normal;}
.alterfontbook {font-family:   'OpenSans-Bold', Arial, sans-serif; font-weight:normal;}

.scrollable {
    /* required settings */
    position:relative;
    overflow:hidden;
    width: 620px;
    height:120px;    
}

.scrollable .items {
    /* this cannot be too large */
    width:20000em;
    position:absolute;
    clear:both;
}

.items div {
    float:left;
    width:680px;
}

/* single scrollable item */
.scrollable img {
    float:left;
    margin:0 2px 0 2px;
	width:120px;
}

/* active item */
.scrollable .active {
    position:relative;
    cursor:default;
}

/* this makes it possible to add next button beside scrollable */
.scrollable {
    float:left;
}

/* prev, next, prevPage and nextPage buttons */

a.browse {
    display:block;
    width:25px;
    height:60px;
    float:left;
    margin:0px 2px;
    cursor:pointer;
    font-size:1px;
}

/* right */

a.right { clear:right; margin-right: 0px; margin-top:15px;}
a.right:hover {  }
a.right:active { }

/* left */

a.left { margin-left: 0px; margin-top:20px; }
a.left:hover  {  }
a.left:active { }

/* disabled navigational button 

a.disabled {
    visibility:hidden !important;

}*/

/* clearfix za content */



.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;}

/* Hides from IE-mac \*/

* html .clearfix {height: 1%;}

/* End hide from IE-mac */

.povp a {float: right; margin-top: 20px; padding: 10px 20px; font-weight: bold; color: #FFF!important; background: #003865; text-decoration: none;}

table {margin-top: 20px;}
table td {vertical-align: top; padding-bottom: 20px;}
.trgovina td img {margin: 5px 20px 0 0; min-width: 215px!important;}
.spacer{width:100%;height:0;clear:both}
.povp1 a {float: right;
padding: 3px 10px;
font-weight: normal;
color: #FFF!important;
background: #003865;
text-decoration: none;}