/*---------------------------------------------
[Main CSS Stylesheet]

Project:          Tomislav
Primary Use:      Screen
Version:          1.0
Date:             30.11.2009.
Last Change:      17.12.2009.
Author:           Dimedia
---------------------------------------------*/
@import url("reset.css");

/*----------- GENERAL -----------------------*/
body { background: #e0e0e0; font-family: arial, sans-serif; }

/*----------- HEADER ------------------------*/
#top-wrapper  { background: #bbbfc1 url(../images/top-wrapper-bkg.jpg) bottom left repeat-x; }
#header { background: url(../images/header-bkg.jpg) bottom center no-repeat; }
#header-wrapper { width: 902px; height: 386px; position: relative; margin: 0px auto; padding: 17px 25px 0 25px; }

  #header-wrapper .logo { width: 324px; height: 36px; text-indent: -9999px; display: block; background: url(../images/logo.gif); float: left; margin-bottom: 16px; }
  
  #header-wrapper .side { float: right; padding-top: 13px; }
  #header-wrapper .side li  { float: left; background: url(../images/separator-01.gif) right 3px no-repeat; padding:0 3px; }
  #header-wrapper .side li.last { background: none; padding-right: 0; }
  #header-wrapper .side a { display:block; padding:0 8px; font-size: 12px; line-height: 21px; color: #33383b; text-decoration: none; }
  #header-wrapper .side .active a { background:url(../images/side-nav.gif) no-repeat 0 0; color:#5b97b1; }
  
  #header-wrapper .main { float: left; width: 902px; background: red url(../images/main-bkg.jpg) top left repeat-x;  }
  #header-wrapper .main li  { float: left; }
  #header-wrapper .main li.first { background: url(../images/main-bkg-left.jpg) top left no-repeat; }
  #header-wrapper .main li.last { background: url(../images/main-bkg-right.jpg) top right no-repeat; float: right; }
  #header-wrapper .main a { font-size: 13px; line-height: 38px; display: block; background: url(../images/separator-02.gif) right center no-repeat; font-weight: bold; color: #33383b; text-decoration: none; width: 150px; text-align: center; }
  #header-wrapper .main .active a,
  #header-wrapper .main a:hover { color: #5b97b1; }
  #header-wrapper .main li.last a { background: none; }
  #header-wrapper .main a span  { display: block; height: 38px; cursor:pointer; }
  #header-wrapper .main .active a span  { background: url(../images/main-bkg-active.jpg) center center no-repeat; }

  #header-flash div { height: 253px; width: 952px; position: absolute; bottom: -9px; left: 2px;  z-index:1; }

/*----------- CONTAINER ---------------------*/
#container  { width: 952px; margin: 9px auto 0; padding: 45px 0 60px 0; background: #e9e9e9; zoom: 1; }
#container:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }
#container { *min-height:0; _height:1%; }

/*----------- TEXT --------------------------*/
h2  { font-size: 18px; line-height: 20px; color: #333; margin-bottom: 12px; font-weight:normal; }

.text { font-size: 12px; line-height: 18px; color: #333; overflow: hidden; zoom: 1; }
  .text p { margin-bottom: 13px; }
  .text ul { margin:15px 0 15px 45px; }
  .text ul li { padding-left:10px; background:url(../images/bullet-01.gif) no-repeat 0 7px; }
.alt-text-01 { margin-top:25px; }
.alt-text-02 { margin-top:23px; }

.more { float: right; background: url(../images/list-01-bkg.gif) right 3px no-repeat; padding-right: 25px; font-size: 12px; line-height: 20px; color: #333; font-weight: bold; text-decoration: none; }
.more:hover { opacity: 0.6; filter: alpha(opacity=60); }

/*----------- COLUMNS -----------------------*/
.home #column-1  { width: 327px; float: left; margin-right: 50px; }
.home #column-2  { width: 300px; float: left; }
.home #column-3  { width: 232px; float: right; }

.home #column-1 h2  { margin-left: 60px; }
.home #column-2 .text { margin-bottom: 30px; text-align: justify; }

#container.type-02,
#container.type-03 { padding-top:20px; }
.type-01 #column-2 h1,
.type-02 #column-1 h1,
.type-03 #column-1 h1 { font-size:30px; color:#707276; font-weight:normal; }
.type-01 #column-2 .desc,
.type-02 #column-1 .desc { margin:7px 0 25px; font-size:15px; line-height:1.3; }
.type-02 #column-1 .desc p { margin-bottom:25px; }

.type-01 #column-1 { width:237px; float:left; margin-right:38px; }
.type-01 #column-2 { width:415px; float:left; margin-right:29px; }
.type-01 #column-3 { width:208px; float:right; }
.type-01 #column-2 h1 span { color:#333; }
 
.type-02 #column-1        { width:646px; float:left; padding-left:26px; margin-right:47px; }
.type-02 #column-2        { width:208px; float:left; }

.type-03 #column-1 { width:249px; float:left; padding-left:26px; margin-right:40px; }
.type-03 #column-1 .list-03     { margin-top:33px; }
.type-03 #column-1 .list-03 p   { font-size:11px; line-height:1.5; }
.type-03 #column-1 .list-03 li  { padding-bottom:0; }
.type-03 #column-1 a            { color:#333; }
.type-03 #column-1 a:hover      { text-decoration:none; }
.type-03 #column-1 p.first      { font-size:12px; }
.type-03 #column-2        { width:612px; float:left; margin-top:65px; }
.type-03 #column-2 #gmap  { width:608px; height:386px; border:2px solid #fff; }
.type-03 #column-2 #gmap .g-info-window  { font-size:11px; line-height:1.3; }

#container.type-04 { padding:0 0 40px 0; }
.type-04 #column-1 { zoom:1; overflow:hidden; padding-top:40px; background:url(../images/separator-06.gif) repeat-y 50% 0; }
.type-04 h1 { position:absolute; left:-9999px; top:-9999px; }

/*----------- LISTS -------------------------*/
.list-01  { }
  .list-01 li { padding: 7px 0 8px 60px; line-height: 12px; border-top: 1px solid #fafafa; }
  .list-01 li .date { display: block; color: #999; font-size: 10px; }
  .list-01 li h3 { font-weight:normal; font-size: 11px; line-height:1.2; color: #333; text-decoration: none; }
  .list-01 li.link  { padding: 0; background: none; border: none; }
  .list-01 li.link a  { display: block; font-size: 12px; color: #fff; font-weight: bold; text-decoration: none; padding: 7px 0 8px 60px; background: #c9cacb url(../images/list-01-bkg-2.gif) 31px 4px no-repeat; }
  .list-01 li.link a:hover  { background-image: url(../images/list-01-bkg.gif); color: #333; }

.list-02 { position:relative; zoom:1; margin-left:-10px; }
  .list-02 li         { padding-bottom:2px; background:url(../images/separator-04.gif) repeat-x 0 100%; }
  .list-02 a          { zoom:1; display:block; margin-left:10px; padding-left:17px; color:#707276; text-decoration:none; font-weight:bold; font-size:13px; line-height:26px; background:url(../images/list-01-bkg-3.gif) no-repeat 100% 50%; }
  .list-02 a:hover,
  .list-02 .active a  { color:#010000; background-image:url(../images/list-01-bkg-4.gif); }
  
.list-03            { overflow:hidden; margin-top:25px; }
  .list-03 li         { overflow:hidden; zoom:1; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #fff; }
  .list-03 .img-block { float: left; margin-right: 16px; text-align: center; width: 150px; }
  .list-03 .img-block img { display: inline; margin: 0; float: none; }
  .list-03 h2 a       { text-decoration:none; color:#333; }
  .list-03 h2 a:hover { text-decoration:underline; }
  .list-03 img        { float:left; margin-right:16px; }
  .list-03 div        { zoom:1; overflow:hidden; }
  .list-03 p          { font-size:12px; line-height:1.5; }
  .list-03 .date      { float:left; font-size:10px; line-height:20px; color:#999; margin-top:20px; }
  .list-03 .more      { margin-top:20px; }
.list-03-alt p      { padding-bottom:20px; }
  
.list-04 {}
  .list-04 li          { position:relative; width:300px; min-height:232px; _height:232px; padding:0 150px 30px 26px; margin-bottom:25px; float:left; line-height:1.5; background:url(../images/separator-04.gif) repeat-x 0 100%; }
  .list-04 .last-row   { background:none; }
  .list-04 h2          { margin:0 0 23px; }
  .list-04 h2 a        { font-size:18px; color:#707276; text-decoration:none; }
  .list-04 h2 a:hover  { text-decoration:underline; }
  .list-04 h2 span     { color:#333; }
  .list-04 img         { position:absolute; right:26px; top:0; }
  .list-04 p           { font-size:12px; }
  .list-04 .desc       { margin-bottom:23px; font-size:15px; }
  .list-04 .more       { position:absolute; right:26px; bottom:30px; float:none; }

.list-banners li { margin-bottom: 18px; }
.list-banners li.last { margin: 0; }
.list-banners a,
.list-banners img { display: block; }
.list-banners .ip-address span { color:#f00; font-weight:bold; }

.list-sshots li    { vertical-align:top; zoom:1; }
.list-sshots span    { zoom:1; display:block; background:#fff; text-decoration:none; cursor:default; }
.list-sshots img  { margin:23px 34px 30px; padding:0 4px 4px 0; background:url(../images/shadow-01.gif) no-repeat 100% 100%; }

.sitemap { margin-top:25px; font-size:12px; }
.sitemap li { margin:15px 0; }
.sitemap a { color:#707276; }
.sitemap ul { margin-left:20px; }

/*----------- BOX'es ------------------------*/
.box-contact  { zoom:1; min-height:282px; _height:282px; background: url(../images/pattern-01.gif); padding: 10px; position: relative; font-size: 11px; line-height: 18px; color: #333; }
  .box-contact a { display: block; position: absolute; right: 10px; bottom: 10px; width: 148px; height: 144px; background: url(../images/where-bkg.gif); overflow:hidden; text-indent: -9999px; }

.home .box-contact  { min-height:1%; _height:1%; padding: 10px 125px 10px 10px; }
.home .box-contact a { right: -26px; bottom: -10px; }  
/*----------- CONTROLS ------------------------*/
.pagination { zoom:1; padding:5px 10px 5px 2px; margin:20px 0; background:#fff; overflow:hidden; font-size:12px; color:#343434; text-transform:lowercase; }
  .pagination a    { float:left; text-decoration:none; color:#343434; }
  .pagination ul   { float:left; }
  .pagination li   { float:left; padding:0 3px; background:url(../images/separator-05.gif) no-repeat 100% 0; }
  .pagination li * { float:none; padding:0 5px; line-height:15px; }
  .pagination .prev,
  .pagination .next { padding:0 8px; }
  .pagination .next { padding-right:25px; }
  .pagination .prev a { padding:0 0 0 9px; background:url(../images/arrow-left-normal-01.gif) no-repeat 0 50%; }
  .pagination .next a { padding:0 9px 0 0; background:url(../images/arrow-right-normal-01.gif) no-repeat 100% 50%; }
  .pagination .prev.disabled a { color:#999; background-image:url(../images/arrow-left-disabled-01.gif); }
  .pagination .next.disabled a { color:#999; background-image:url(../images/arrow-right-disabled-01.gif); }
  .pagination .active a { font-weight:bold; color:#fff; background:#343434; }
  
/*----------- FOOTER ------------------------*/
#footer  { width: 952px; margin: 0 auto; background: #7b858a; padding: 18px 0 10px 0; position: relative; }
  #footer ul  { text-align: center; margin-bottom: 11px; }
  #footer ul li { display: inline; background: url(../images/separator-03.gif) right 3px no-repeat; padding: 0 11px 0 11px; }
  #footer ul li.last  { background: none; }
  #footer ul a  { font-size: 13px; line-height: 16px; color: #fff; text-decoration: none; }
  #footer p  { text-align: center; font-size: 10px; line-height: 12px; color: #c9cacb; }
  #footer .sign { display: block; position: absolute; bottom: 13px; left: 42px; text-decoration: none; color: black; font-size: 10px; }
  #footer .sign:hover,
  #footer .sign span { color: red; }