/******************************************************************
 * Metastudio CSS
 * @author	Ivan Maros
 * @since	16.04.2009
 ******************************************************************/

/******************************************************************
 * General
 ******************************************************************/
* {padding: 0; margin: 0;}
body, td {font: normal 12px/1.6em "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif; color: #333;}
body {margin: 15px 0; padding: 0; text-align: center; background-color: #FFF;}
a, a:link, a:visited, a:active, a:focus {color: #8FB300; text-decoration: none;}
a:hover {color: #5B7200;}
img {border-width: 0;}
p {margin: 0 0 1.2em;}
hr {border: 0; height: 1px; color: #666; background-color: #666; margin: 0 0 5px;}
ul, ol, li {list-style: none; margin: 0; padding: 0;}
form, table, td {vertical-align: top; margin: 0; padding: 0; border: 0;}
form select option {padding-right: 7px;}
h1, h2, h3, h4, h5, h6, h7 {font-family: "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif; margin-bottom: 0.8em; line-height: 1.2em;}
abbr {cursor: help;}
.input-box {font: normal 11px "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif; border: 1px solid #D7D7D7; color: #333; padding: 1px 3px;}
.warn-color {font-size: 11px; color: #F60; display: block;}
.left {float: left;}
.right {float: right;}
.clear {clear: both;}
.block {display: block;}
.noborder {border: 0 ! important;}
.bold {font-weight: bold;}

/******************************************************************
 * Structure
 ******************************************************************/
#container {position: relative; width: 784px; margin: 0 auto; padding: 0; text-align: left; background-color: #FFF;}
#header, #content, #footer {clear: left; float: left; position: relative; width: 784px;}
#main-content {float: left; width: 456px; w\idth: 446px; padding-left: 10px;}
#extras {float: right; width: 294px; w\idth: 284px; padding-right: 10px;}

/******************************************************************
 * Header
 ******************************************************************/
#header {background: #A4C424 url(images/ms_bg_header.jpg) no-repeat 0% 0%; height: 320px; overflow: hidden;}
#header h1 {position: absolute; top: 22px; left: 35px; width: 376px; height: 94px; background: url(images/ms_logo.gif) no-repeat;}
#header h1 a {display: block; width: 376px; height: 94px; text-indent: -9999px;}

#header ul#main-nav {position: absolute; top: 155px; left: 17px; height: 20px; line-height: 20px;}
#header ul#main-nav li {padding-bottom: 5px; width: 142px; font-size: 13px; font-weight: bold;}
#header ul#main-nav li a {display: block; color: #666; height: 20px; line-height: 20px; padding-left: 16px; background: url(images/ms_bg_mainmenu.jpg) no-repeat 0% 0%; overflow: hidden;}
#header ul#main-nav li.current a,
#header ul#main-nav li.current a:hover {color: #333; background-position: 0px -40px;}
#header ul#main-nav li a:hover {color: #333; background-position: 0px -20px;}

#header ul#sub-nav {display: none; position: absolute; right: 55px; top: 5px; height: 200px; overflow: hidden;}
#header ul#sub-nav li {position: relative; float: left; font-size: 12px; height: 200px; padding-right: 10px;}
#header ul#sub-nav li a {float: left; display: block; color: #666; width: 28px; height: 200px; text-indent: -9999px; background: url(images/ms_bg_contact_hr.jpg) no-repeat 0% 0%; overflow: hidden;}
#header ul#sub-nav.sublang-en li a {background-image: url(images/ms_bg_contact_en.jpg);}

#header ul#sub-nav li#sub-sendlink a {height: 180px; background-image: url(images/ms_bg_sendlink_hr.jpg);}
#header ul#sub-nav.sublang-en li#sub-sendlink a {background-image: url(images/ms_bg_sendlink_en.jpg);}

#header ul#sub-nav li#sub-rss a {height: 160px; background-image: url(images/ms_bg_rss_hr.jpg);}

#header ul#sub-nav li.current a,
#header ul#sub-nav li.current a:hover,
#header ul#sub-nav li a:hover {background-position: -28px 0px;}

#header ul#lang-nav {position: absolute; right: 17px; bottom: 25px; height: 20px; line-height: 20px; color: #5B7200; background-color: #CDDF71; padding-left: 7px; overflow: hidden;}
#header ul#lang-nav li {position: relative; float: left; font-size: 12px; height: 20px;}
#header ul#lang-nav li#lang-desc {padding: 0 12px; background-image: url(images/ms_bg_lang_separator.gif); background-repeat: no-repeat; background-position: 0% 50%;}
#header ul#lang-nav li a {float: left; display: block; color: #8FB300; height: 20px; line-height: 20px; padding-right: 12px; font-weight: bold; overflow: hidden;}
#header ul#lang-nav li.current a,
#header ul#lang-nav li.current a:hover {color: #5B7200;}
#header ul#lang-nav li a:hover {color: #5B7200;}

/******************************************************************
 * Content
 ******************************************************************/
#content {w\idth: 770px; padding: 7px; background: #FFF url(images/ms_bg_content.gif) repeat-y 100% 0%;}
#content #breadcrumbs {position: absolute; top: -12px; right: 12px; font-size: 10px; text-align: right;}
#content h2 {color: #B34700; font-size: 32px; font-weight: normal; margin-bottom: 0.4em;}
#content h3 {font-size: 18px; font-weight: normal;}

#content #main-content div.big-pic {position: relative; float: left; padding: 7px 10px 10px 6px; background: url(images/ms_bg_pic344x258.jpg) no-repeat 0% 0%;}
#content #main-content div.big-pic a {float: left; display: block; width: 344px; height: 258px; overflow: hidden;}
#content #main-content ul.thumbnails {float: left; width: 360px; padding: 12px 0;}
#content #main-content ul.thumbnails li {display: block; float: left; width: 90px; w\idth: 79px; height: 69px; he\ight: 58px; padding: 5px 6px 6px 5px; background: url(images/ms_bg_pic74x53.jpg) no-repeat 0% 0%;}
#content #main-content ul.thumbnails li a {display: block; float: left; width: 74px; height: 53px; overflow: hidden;}
#content #main-content div.description {clear: left;}
#content #main-content ul.info {float: left; width: 446px; margin: 12px 0; padding-top: 3px; background: #FFFCF2 url(images/ms_bg_projects_grid.jpg) no-repeat 0% 0%;}
#content #main-content ul.info li {clear: both; float: left; width: 100%; line-height: 20px;}
#content #main-content ul.info strong {font-weight: normal; float: left; width: 110px;}
#content #main-content ul.info em {font-weight: normal; font-style: normal; float: right; width: 330px;}
#content #main-content div.paging-info {text-align: center; font-weight: bold;}
#content #main-content div.paging-info a,       #content #main-content div.paging-info span {color: #999; padding: 3px 6px; border: 1px solid #FFF;}
#content #main-content div.paging-info a:hover, #content #main-content div.paging-info span {color: #666; border-color: #333;}
img#spinner {display: block; position: absolute; top: 10px; right: 20px;}

#content #subnav {float: left; margin-left: 10px;}
#content #subnav ol li {padding-bottom: 1px;}
#content #subnav ol li a {display: block; width: 175px; w\idth: 163px; line-height: 26px; font-weight: bold; background-color: #F5F5F5; padding: 0 4px; border-left: 4px solid #D7D7D7;}
#content #subnav ol li a:visited {color: #AAA; background-color: #F5F5F5; border-left-color: #E7E7E7;}
#content #subnav ol li a:hover, #content #subnav ol li.current a {color: #333 !important; background-color: #E7E7E7 !important; border-left-color: #EDBE1C !important;}

#content #extras ol li {padding-bottom: 5px;}
#content #extras ol li a {display: block; line-height: 30px; padding-left: 22px; font-size: 14px; color: #8FB300; background: #E5F1B7 url(images/ms_bg_projects.jpg) no-repeat 0% 0%;}
#content #extras ol li a:hover {color: #5B7200; background-position: 0px -30px;}
#content #extras ol li.current a {color: #5B7200; background-position: 0px -60px;}
#content #extras fieldset {margin: 0; padding: 0; border: 0;}
#content #extras fieldset ol {padding-top: 5px;}
#content #extras fieldset ol li {padding-bottom: 12px;}
#content #extras fieldset label {display: block; font-weight: bold; padding-bottom: 2px;}
#content #extras fieldset label strong {display: block; font-weight: normal; color: #F60;}
#content #extras fieldset label em {font-style: normal; font-weight: normal;/* color: #F60;*/}
#content #extras fieldset .input-box {width: 165px;}
div.confirmation, div.notice {padding: 12px 7px; color: #F60; background-color: #F5F5F5; border: 1px solid #CCC; font-weight: bold;}

#content #extras ul li {padding-bottom: 10px;}
#content #extras ul li a {display: block; padding-bottom: 74px; background: url(images/ms_bg_hp_usporedi.jpg) no-repeat -284px 24px;}
#content #extras ul li a:hover {background-position: 0px 24px;}
#content #extras ul li a span.title {float: left; width: 218px; line-height: 24px; font-size: 14px;}
#content #extras ul li a span.more {float: right; width: 66px; line-height: 24px; font-size: 12px; text-align: center;}
#content #extras #hp-usporedi a {background-image: url(images/ms_bg_hp_usporedi.jpg);}
#content #extras #hp-charter a {background-image: url(images/ms_bg_hp_charter.jpg);}
#content #extras #hp-project6 a {background-image: url(images/ms_bg_hp_project6.jpg);}
#content #extras #hp-edomaajka a {background-image: url(images/ms_bg_hp_edomaajka.jpg);}

/******************************************************************
 * Footer
 ******************************************************************/
#footer {height: 230px; background: url(images/ms_bg_footer.jpg) no-repeat 0% 0%;}
#footer #contact {position: absolute; top: 25px; left: 17px; width: 750px; height: 160px; color: #F2FFBF; overflow: hidden;}
#footer #contact h3 {color: #5B7200; font-size: 18px; font-weight: normal; text-align: center;}
#footer #contact div.confirmation,
#footer #contact div.notice {position: absolute; top: 0; right: 0; padding: 0; line-height: 24px; width: 750px; color: #F60; background-color: #5B7200; border: 0; font-weight: bold; text-align: center;}
#footer #contact fieldset {margin: 0; padding: 0; border: 0;}
#footer #contact label {display: block; color: #F2FFBF; font-size: 13px;}
#footer #contact label strong {font-size: 11px; font-weight: normal; padding-left: 4px; color: #FF0;}
#footer #contact label em {font-style: normal; font-weight: normal;}
#footer #contact #lbl_name {position: absolute; top: 24px; left: 0px;}
#footer #contact #lbl_email {position: absolute; top: 74px; left: 0px;}
#footer #contact #lbl_required {position: absolute; top: 120px; left: 0px;}
#footer #contact #lbl_message {position: absolute; top: 24px; left: 180px;}
#footer #contact #lbl_submit {position: absolute; top: 74px; right: 10px;}
#footer #contact input.input-box {width: 140px;}
#footer #contact textarea.input-box {width: 480px;}
#footer #contact #lbl_submit input {border: 0; color: #FFF2BF; font-family: "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif; font-size: 13px; text-transform: lowercase; background: transparent url(images/ms_bg_submit.png) no-repeat 0% 0%; width: 47px; padding-top: 50px; text-align: center; cursor: pointer;}
#footer #contact #lbl_submit input:hover {background-position: -47px 0;}
#footer ul {position: absolute; top: 185px; left: 7px; width: 770px; line-height: 30px; text-align: center;}
#footer ul li {display: inline; color: #FFF2BF; font-size: 13px;}
#footer ul li a {color: #FFF2BF; padding: 0 12px;}
#footer ul li a:hover, #footer ul li.current a {color: #FC0;}
#footer #disclaimer {position: absolute; top: 215px; right: 45px; color: #666; font-size: 11px; line-height: 30px;}

/******************************************************************
 * Slimbox
 ******************************************************************/
#lbOverlay {position: absolute; left: 0; width: 100%; background-color: #000; cursor: pointer; z-index: 90;}
#lbCenter, #lbBottomContainer {position: absolute; left: 50%; overflow: hidden; background-color: #fff; z-index: 91;}
.lbLoading {background: #fff url(images/loading.gif) no-repeat center;}
#lbImage {border: 10px solid #fff;}
#lbPrevLink, #lbNextLink {display: block; position: absolute; top: 0; width: 50%; outline: none; z-index: 92;}
#lbPrevLink {left: 0;}
#lbPrevLink:hover {background: transparent url(images/prevlabel.gif) no-repeat 0% 15%;}
#lbNextLink {right: 0;}
#lbNextLink:hover {background: transparent url(images/nextlabel.gif) no-repeat 100% 15%;}
#lbBottom {font-family: Verdana, Helvetica, sans-serif; font-size: 10px; color: #666; line-height: 1.4em; text-align: left; border: 10px solid #fff; border-top-style: none;}
#lbCloseLink {display: block; float: right; width: 66px; height: 22px; background: transparent url(images/closelabel.gif) no-repeat center; margin: 5px 0;}
#lbCaption, #lbNumber {margin-right: 71px;}
#lbCaption {font-weight: bold;}
#lbCaption #lbDesc {font-weight: normal; color: #777;}