/*
<!--
  Author:   Michael Daum
  Company:  webdaum webdesign
  Web Site: www.webdaum.de
  Comments: © 2005, Michael Daum
-->
*/

/* General settings: */

body {
 background:#fff;
 color:#000;
 font-family:Arial Black,Helvetica Black,LB Helvetica Black,Univers Black,Zurich Blk BT,sans-serif;
 }

img  {
 border:0;
 }

ul {
 list-style:none;
 margin:0;
 padding:0;
 }
 
/* Company Logo */

#opossum a {
 display:block;
 width:130px;
 height:71px;
 padding:0;
 margin-top:40px;
 margin-left:40px;
 background:url(../img/logo_1_5sec.gif) 0% 0% no-repeat;
 }

/* Copyright */

#copyright {
 position:absolute;
 top:440px;
 left:40px;
 }

#copyright a {
 display:block;
 width:205px;
 height:25px;
 background:url(../img/copyright.gif) 0% 0% no-repeat;
 }

/* Default Navigation Links */

#navi a {
 display:block;
 width:122px;
 height:30px;
 }

#portfolio {
 position:absolute; top:60px; left:288px;
 }
#whois {
 position:absolute; top:60px; left:410px;
 }
#clients {
 position:absolute; top:60px; left:532px;
 }
#contact {
 position:absolute; top:60px; left:654px;
 }
#portfolio {
 background:url(../img/navi/ops_portfolio_1.GIF) 0% 0% no-repeat;
 }
#portfolio a.active,
#portfolio a.active:hover {
 background:url(../img/navi/ops_portfolio_3.GIF) 0% 0% no-repeat;
 }
#portfolio a:hover {
 background:url(../img/navi/ops_portfolio_2.GIF) 0% 0% no-repeat;
 }
 
/* subnavigation portfolio */
/* position:top define in folio#.css */
#portfolio ul {
 position:absolute;
 left:-248px;
 width:800px;
 }
#portfolio ul li {
 display:block;
 float:left;
 width:80px;
 }
#portfolio ul a.active,
#portfolio ul a.active:hover,
#portfolio ul a:hover {
 background:url();
 }
#navi ul a {
 color:#ccc;
 background:#fff;
 font-size:10px;
 width:80px;
 }
#navi ul a.active {
 color:#F51E30;
 }
 
/* end subnavigation portfolio */

#whois  {
 background:url(../img/navi/ops_whois_1.GIF) 0% 0% no-repeat;
 }
#whois a.active,
#whois a.active:hover  {
 background:url(../img/navi/ops_whois_3.GIF) 0% 0% no-repeat;
 }
#whois a:hover  {
 background:url(../img/navi/ops_whois_2.GIF) 0% 0% no-repeat;
 }

#clients  {
 background:url(../img/navi/ops_clients_1.GIF) 0% 0% no-repeat; 
 }
#clients a.active,
#clients a.active:hover  {
 background:url(../img/navi/ops_clients_3.GIF) 0% 0% no-repeat;
 }
#clients a:hover  {
 background:url(../img/navi/ops_clients_2.GIF) 0% 0% no-repeat;
 }

#contact {
 background:url(../img/navi/ops_contact_1.GIF) 0% 0% no-repeat;
 }
#contact a.active,
#contact a.active:hover  {
 background:url(../img/navi/ops_contact_3.GIF) 0% 0% no-repeat;
 }
#contact a:hover  {
 background:url(../img/navi/ops_contact_2.GIF) 0% 0% no-repeat;
 }


/* Hide text for CSS-Decoration, text will be shown by non-CSS-Browsers */

#navi a span,
#copyright a span,
#opossum span,
#thumb a span,
#leftbox h1 span {
 position:absolute;
 width:120px;
 left:-2000px;
 }


/* Default Layout Layers */

#rightbox {
 position:absolute;
 top:135px;
 left:300px;
 }

#leftbox {
 position:absolute;
 top:135px;
 left:0;
 }

/* Default Layout Layers Decoration */

#leftbox h1 {
 background:url(../img/swim_mm.gif);
 margin:0;
 }

#leftbox h1 a {
 width:299px;
 height:325px; /* full height size would be 665px */
 display:block;
 }

/* bel-mij - Special Layout Layer */

#bel-mij {
 position:absolute;
 width:100%;
 height:356px;
 top:20%;
 text-align:center;
 background:#fff url(../img/swim_o_.gif) center bottom no-repeat;
 }

a.swim { /* bel-mij - extend hotlink-size (href=contact) to bg-image-size */
 display:block;
 width:100%;
 height:150px;
 color:#ccc;
 font-size:8pt;
 text-align:center;
 text-decoration:none;
 }
a.swim span {/* move text "[back]" to bottom of bg-picture */
 position:relative;
 top:150px; 
 }

#bel-mij p, #bel-mij img {
 text-align:center;
 }

/* clients - Scroller Layer */

#rightbox.scroll {
 height:325px;
 width:430px;
 overflow:auto; 
 }/* JS-Scroller-Script changes this setting to "overflow:hidden;" */
  /* if JS is disabled vertical scrollbar will be shown

/* Default Font Styling */

p, #rightbox.scroll div {
 font: normal 16px Arial Black; 
 color:#B4B4B4;
 margin-top:0;
 }

a, p, h1, h2, h3, h4, h5, h6, i, b, span {
 font-family: Arial Black,Helvetica Black,LB Helvetica Black,Univers Black,Zurich Blk BT,sans-serif;
 text-decoration:none;
 }
a.mailto {
 color:#F51E30;
 }
p.phone {
 color:#F51E30;
 text-align:center;
 }

/* bel-mij - Special Font Styling */

#bel-mij p {
 text-align:center;
 }
#bel-mij small {
 font-size:80%;
 }