* {
font-family: 'Gentium Book Basic', serif;
margin:0;
padding:0;
color:#666;
}

html {

}

body{
background:#e0ecf1 ;
}


.page_margins{

background:#fff ;
width:960px;
position:relative;
margin:0px auto;
padding:16px 16px;
}





/*	1. H E A D E R
*/


#header{
background:url(../img/z30_1_gr.gif) right 120px no-repeat;
position:relative;
z-index:2;
}

#header .page_margins{
background:#e0ecf1
}



h1{
font-size: 20px;


}

#header h2{
font-size:10px;

position:absolute;
width:20%;
left:16px;
top:128px;
}

#header p{
width:104px;
font-size:10px;
line-height:normal;
text-indent:0;
position:absolute;
top:32px;
left:256px;
line-height:12px;
font-family:'Gentium Book Basic', serif;
}


#header p + p{
top:20px;
left:376px;
}

#header p + p + p{
top:20px;
left:496px;
}

#header p + p + p + p{
top:20px;
left:616px;
}

#header p + p + p + p + p{
top:20px;
left:736px;
}

#header p + p + p + p + p +p{
top:20px;
left:856px;
}



#header h3{
font-size:16px;
line-height:16px;
width:224px;
position:absolute;
top:16px;;
left:256px;
}



#service-nav{
width:496px;
height:55px;
position:absolute;
right:0px;
top:10px;
background-color:#0066ff;
z-index:99;
}
#service-nav ul {
 clear:left;
   float:left;
   list-style:none;
   margin:0;
   top:10px;
   padding:0;
   position:relative;
   left:50%;
   text-align:center;
   }
#service-nav li{
list-style:none;
 display:block;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   right:50%;
}
#service-nav li a{
color:#FFFFFF;
font-size:18px;
font-style:italic;
text-decoration:none;
margin:0 0 0 1px;
padding:3px 10px;
width:100px;
background-color:#0066ff;
line-height:1.3em;

}

#service-nav li a:hover, #service-nav li a:focus{
background-color:#82CAFF;
}


.article_head{
z-index:1;
position:relative;
}

.article_head .page_margins{
height:272px;
border-top:#0066ff 10px solid;
padding-bottom:0;

}

.article_head p.intro{
position:absolute;
font-size:13px;
line-height:24px;
text-align:left;
margin-left:16px;
width:224px;
top:43px;
}

p.intro, p.intro+p, div>p:first-child{
text-indent:0;
}

.article_head h2{
position:absolute;
text-transform:uppercase;
letter-spacing:4px;
font-size:4em;
line-height:1em;
font-weight:normal;
width:75%;
left:30%;
top:97px;
margin-left:16px;
}

.article_head h3{
font-size:30px;
font-style:italic;
font-weight:normal;
position:absolute;
top:34px;
width:75%;
left:30%;
margin-left:16px;
}


h2 span{
letter-spacing:0px;

}

.article_info{
color:#999;
font-size:10px;
border-top:#666 1px solid;
text-align:center;
margin:0 auto;
padding-bottom:4px;
width:480px;

}




/*
.article{

margin-bottom:32px;
background:url(../img/z30_1_gr.gif) left top no-repeat;
}
*/
.article .page_margins{
padding-bottom:32px;
padding-top:30px;


}


.col{
width:50%;
float:left;

}

.two_col{
width:50%;
float:left;
}

.two_col > .col{
width:80%;
float:left;
}


.col12{
width:12.5%;
float:left;
}

.col > *, .w50 > *{
margin:0 16px;
}


.w50{
width:100%;
margin-right:0;
float:left;
}

.two_col > .w50{
width:25%;
}

.w25{
width:25%;
margin-right:0;
float:left;
}

.img{
float:left;
margin:0px 16px 16px 0;
}
.imgtwo{
float:left;
margin:140px 16px 16px 0;
}
.img>img{
width:100%;
float:left;
}



.w50 > *, .w25 > *, .col12 > *,.no_img > * {/*								-->  12,5% coloumns		*/
font-family:'Gentium Book Basic', serif;
font-size:15px;
line-height:16px;
margin-right:16px;
}

.w50{
margin-bottom:16px;

}

.right{
float:right;
}



p.intro{
font-size:16px;
line-height:24px;
text-align:left;
margin-bottom:16px;
}

p{
font-size:16px;
line-height:25px;
}

.page_margins:first-child:first-child:first-letter{
font-size:22px;
}

p + p{
text-indent:16px;
}

p + div{
margin-top:16px;
}




blockquote{
margin:13px 0;
border-top:1px solid #000000;
border-bottom:1px solid #000000;
padding:8px 16px 12px 16px;
}

blockquote p{
font-size:16px;
line-height:16px;
font-style:italic;
text-align:center;
}


abbr, acronym{
font-variant:small-caps;
cursor:help;
font-size:12px;
text-decoration:none;
}

.article strong{
font-variant:small-caps;
font-weight:normal;
font-size:12px;

}

.article a{

}

.extra{
background:#e0ecf1;
padding:10px 10px 16px 10px;
clear:both;
margin-bottom:16px;
margin-top: 30px;
}

.extra h3{
text-align:center;
font-variant:small-caps;

font-weight:normal;
line-height:20px;
margin-bottom:8px;
letter-spacing:1px;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
background-color:#E8E8E8;
padding:10px 0 10px 0;
}

.extra p{
line-height:16px;
text-align:left;
font-size:16px;
}

div.extra h3 + p:first-letter {
font-size:34px;
height:34px;
position:relative;
display:block;
float:left;
margin-top:5px;
margin-right:5px;
}



.article_head:after, #header:after, .article:after, .page_margins:after{/*								-->  clear floats		*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}


/*	3. C A T E G O R I E S
*/

#categories{
position:fixed;
width:120px;
top:190px;
right:-120px;
z-index:120;
background-color:#82CAFF;
padding-bottom:16px;
}

#categories:hover{
right:0px;
}

#categories h4{
cursor:pointer;
background-color:#0066ff;
padding:10px;
color:#FFFFFF;
font-variant:small-caps;
text-align:center;
position:absolute;
left:-30px;
width:10px;
}

#categories ul, #categories h5{
margin:0px 16px;
}

#categories h5{
font-variant:small-caps;
color:#E0E0E0 ;
margin:16px 16px 0px 16px;
}

#categories ul li{
list-style:none;

}

#categories ul li a{
color:#999999;
text-decoration:none;
}



#categories ul li a span{
color:#999999;
width:18px;
display:block;
float:left;
text-align:left;
}



#categories ul li a:hover, #categories ul li a:hover span{
color:#F8F8F8 ;
}



@media screen {
@font-face {
  font-family: 'Gentium Book Basic';
  font-style: normal;
  font-weight: normal;
  src:  url('http://fonts.googleapis.com/css?family=Gentium+Book+Basic');
}
}