/******************************************************************
 * Cyclops CSS
 * @author	Ivan Maros
 * @since	25.11.2010
 ******************************************************************/

/******************************************************************
 * General
 ******************************************************************/
* {padding: 0; margin: 0;}
body, td {font: normal 12px/18px "Trebuchet MS", Trebuchet, Tahoma, Arial, Helvetica, sans-serif; color: #FFF;}
body {background-color: #808285; margin: 20px 0 0px; padding: 0; text-align: center;}
a, a:link, a:visited, a:active, a:focus {color: #F9A01B;}
a:hover {color: #FFF;}
img {border-width: 0;}
p {margin: 0 0 1.2em;}
hr {border: 0; height: 1px; color: #FFF; background-color: #FFF; margin: 0 0 5px;}
ul, li {list-style: none; margin: 0; padding: 0;}
table, td {vertical-align: top; margin: 0; padding: 0; border: 0;}
form select option {padding-right: 7px;}
.input-box {background-color: #808285; font: normal 12px "Trebuchet MS", Trebuchet, Tahoma, Arial, Helvetica, sans-serif; border: 1px solid #BABBBC; color: #FFF; padding: 1px 3px;}
.warn_color {font-size: 12px; color: #F00; display: block;}
.left {float: left;}
.right {float: right;}
.clear {clear: both;}
.clearleft {clear: left;}
.clearleft {clear: right;}
.block {display: block;}
.noborder {border: 0 ! important;}
.bold {font-weight: bold;}
h1, h2, h3, h4, h5 {margin: 0 0 .6em;}
input[type=submit] {color: #FFF; background-color: #939598; border: none; font-size: 12px; padding: 1px 12px;}

/******************************************************************
 * Structure
 ******************************************************************/
#container {position: relative; width: 764px; margin: 0 auto; padding: 0; text-align: left;}
#header, #content, #footer {clear: left; position: relative; width: 764px;}
#main-content {float: left; width: 362px; margin-right: 10px;}
#subnav {float: left; width: 176px; margin-right: 10px; overflow: hidden;}
#extras {float: left; width: 176px; overflow: hidden;}

/******************************************************************
 * Header
 ******************************************************************/
#header {height: 164px;}
#header h1 {position: absolute; left: 28px; top: 0px;}
#header ul#nav {position: absolute; right: 5px; top: 97px;}
#header ul#nav li {float: left;}
#header ul#nav li a {float: left; display: block; padding: 5px 10px 5px 1px; color: #FFF; font-size: 18px; font-weight: bold; text-transform: uppercase; text-decoration: none; border-top: 4px solid #F9A01B; margin-left: 20px;}
#header ul#nav li a:hover {color: #F9A01B;}
#header ul#nav li.current a {color: #B2B3B7;}

#header ul#lang-menu {position: absolute; right: 0px; top: 0px; line-height: 18px; font-size: 11px;}
#header ul#lang-menu li {float: left; padding: 0 4px;}
#header ul#lang-menu li a {color: #FFF; text-decoration: none;}
#header ul#lang-menu li a:hover {color: #F9A01B;}
#header ul#lang-menu li.current a {color: #B2B3B7; font-weight: bold;}

/******************************************************************
 * Content
 ******************************************************************/
#content {w\idth: 734px; padding: 0px 15px 20px;}
#content #breadcrumbs {position: absolute; right: 15px; top: 2px; font-size: 10px; text-align: right;}
#content h2#section-name {color: #B2B3B7; margin: 0; padding: 0; padding-left: 190px; font-size: 14px; font-weight: normal;}

div.side-content {}
div.side-content dl dt {margin: 0; padding: 0; font: bold 12px/18px "Trebuchet MS", Tahoma, Arial, Helvetica, sans-serif; border-top: 4px solid #F9A01B;}
div.side-content dl dd {margin-bottom: 38px;}
div.side-content ol {padding-top: 1px; border-bottom: 1px dashed #B2B3B7;}
div.side-content ol li {padding: 4px 0 7px; border-top: 1px dashed #B2B3B7;}
div.side-content ol li a {display: block; line-height: 18px; color: #FFF; font-weight: bold; font-size: 13px; text-decoration: none;}
div.side-content ol li a:hover, div.side-content ol li.current a {color: #B2B3B7;}
body#cat_portfolio div.side-content ol li a:visited {}
div.side-content ol#login-box {background: none; padding: 0;}
div.side-content ol#login-box li {padding-bottom: 7px; background: none;}
div.side-content dl#login ol {border: none;}
div.side-content dl#login ol li {padding: 4px 0 4px; border: none;}

#main-content {border-top: 1px dashed #B2B3B7;}

#content h2 {font-size: 24px; line-height: 30px; font-weight: normal; margin-bottom: 12px;}
#content h3 {font-size: 22px; line-height: 24px; font-weight: normal; margin: 7px 0 12px;}
#content div.side-content h3 {margin: 7px 0;}
#content #main-content div.static-box img,
#content #main-content div.text img {padding: 4px; border: 1px solid #B3D7EF; border-color: #F5F5F5 #CCC #CCC #F5F5F5;}
#content div.side-content h3 {font-size: 18px; line-height: 20px; margin-top: 4px; padding-left: 2px; text-transform: uppercase;}
#content h4 {font-size: 12px; line-height: 14px; font-weight: normal; margin-bottom: 15px; padding-left: 2px;}
#content #main-content div.big-pic {position: relative; margin-left: -3px; float: left; padding: 7px 10px 10px 6px;}
#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; margin-left: -3px; 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;}
#content #main-content ul.thumbnails li a {display: block; float: left; width: 74px; height: 53px; overflow: hidden;}
#content #main-content div.description {}
#content #main-content ul.info {float: left; width: 100%; w\idth: 348px; margin: 12px 0; padding-top: 2px;}
#content #main-content ul.info li {clear: both; float: left; width: 100%; line-height: 18px;}
#content #main-content ul.info strong {font-weight: bold; float: left; width: 100px; w\idth: 93px; padding: 2px 0 4px 7px;}
#content #main-content ul.info em {font-weight: normal; font-style: normal; float: right; width: 249px; w\idth: 234px; padding: 2px 7px 4px 0;}
#content #main-content ul.info.aboutus {background: none;}
#content #main-content ul.info.aboutus li {}
#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 {padding: 3px 6px; border: 1px solid #FFF;}
#content #main-content div.paging-info a:hover, #content #main-content div.paging-info span {border-color: #888;}
img#spinner {display: block; position: absolute; top: 10px; right: 20px;}

#content #main-content div.content-box {clear: left; padding-bottom: 10px; margin-bottom: 12px;}
body#cat_about_us #content #main-content div.content-box {padding-bottom: 0;}
#content #main-content div.lead-pic {position: relative; float: left; margin-top: 3px; margin-right: 4px; padding: 4px; border: 1px solid #B3D7EF; border-color: #F5F5F5 #CCC #CCC #F5F5F5;}
#content #main-content div.lead-pic a, #content #main-content div.lead-pic img {display: block; float: left;}
#content #main-content div.lead-pic div {font-size: 10px;}
#content #main-content span.date {font-weight: normal;}

div.confirmation, div.notice {padding: 12px 7px; color: #F00; background-color: #F5F5F5; border: 1px solid #CCC; font-weight: bold;}

div#poll ul.control li {padding-bottom: 4px;}

/******************************************************************
 * Footer
 ******************************************************************/
#footer {clear: both; font-size: 13px; text-align: center; border-top: 1px dashed #B2B3B7;}
#footer ul {padding: 7px 0 12px;}
#footer ul li {display: inline; padding: 0 12px;}
#footer ul li a {font-weight: bold; text-transform: lowercase; color: #FFF; text-decoration: none;}
#footer ul li a:hover {color: #B2B3B7;}
#footer ul li.current a {color: #B2B3B7;}
#footer #disclaimer {font-size: 10px; line-height: 40px;}
#footer a#metastudio {position: absolute; display: none; width: 33px; height: 26px; right: 10px; bottom: 12px; text-indent: -9999px; background: url(images/metastudio_.gif) no-repeat 0% -26px;}
#footer a#metastudio:hover {background-position: 0% 0%;}
#footer a#jurica {position: absolute; display: none; width: 21px; height: 26px; left: 15px; bottom: 12px; text-indent: -9999px; background: url(images/cy_jurica.gif) no-repeat 0% 0%;}
#footer a#jurica:hover {background-position: 0% -26px;}

/******************************************************************
 * 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;}