/* =========================================

  preparing the document

========================================= */



html {height: 100%} 



body { 

  min-height: 101%;  

  font-size: 100.01%; 

  position: relative; 

  color: #000;        

  background-color: #fff;

  text-align: left; 

} 



* {

  margin: 0; 

  padding: 0; 

  border: 0; 

  font-size: 1em;

}



body { 

  font-family: Verdana, 'Trebuchet MS', Helvetica, Arial, sans-serif;

  background-color: white;

}



body * { 

  font-size: 100.01%; /* zoom bug IE */

}



/* =========================================

  defining html elements

========================================= */



strong,b {font-weight: bold;}

em,i { font-style:italic; }





acronym, abbr {

  letter-spacing: .07em;

  border:0;

  cursor: help;

}



a:link,

a:hover {

  color: #0B4DA2;

}



a:visited {

  color: #333;

}



a:focus {

  text-decoration: underline !important;

}



/* =========================================

  defining special classes

========================================= */



.hide {

  position: absolute;

  left: -1000em; 

  width: 20em;

}





/* =========================================

  header first

========================================= */



#header {

  background: url(../img/bg_header.jpg) right top  no-repeat;

  position: relative;

  text-align: right;

}



#header-wrapper {

  background: url(../img/bg_header-wrapper.png) right top no-repeat;

}



#main-wrapper,

#header {

  max-width: 1100px;

  margin: auto;  

}



#header h1 {

  background-color: #caeaf9;

  position: absolute;

  top: 0;

  left: 0;

  height: 147px;

  border-right: 1px dashed #acd7f9;

  padding: 0 15px 0 68px;

  float: left;

}



#header h1 img {

  margin-top: 42px;

}



/* =========================================

  search form

========================================= */



#suche {

  padding: 95px 85px 0 0;

  height: 52px;

  font-size: 0.8em;

}



#suche label {

  font-weight: bold;

  color: #0b4da2;

}



label.inputlabel {

  display: block;

}



#search {

  width: 120px;

  margin-top: 3px;

  border-top: 1px solid #666;

  border-left: 1px solid #666;

  border-right: 1px solid #bbb;

  border-bottom: 1px solid #bbb;

}



#inlinesearch,

input.inputform {

  width: 200px;

  padding: 1px 2px;

  border-top: 1px solid #666;

  border-left: 1px solid #666;

  border-right: 1px solid #bbb;

  border-bottom: 1px solid #bbb;

}



#suche button {

  background: url(../img/button_go.png) center center no-repeat;

  padding: 3px;

  text-transform: uppercase;

  font-size: 0.8em;

  cursor: pointer;

}



#inlinesearchbutton,

input.inputbutton,

button.inputbutton {

  border-top: 1px solid #666;

  border-left: 1px solid #666;

  border-right: 1px solid #bbb;

  border-bottom: 1px solid #bbb;

  padding: 1px 10px;

}



/* =========================================

  service navigation

========================================= */



#servicenav {

  position: absolute;

  top: 0;

  right: 0;

}



#servicenav ul {

  clear: left;

  text-align: right;

  list-style: none;

  padding: 12px 0;

}



#servicenav li {

  display: inline;

}



#servicenav li a:link,

#servicenav li a:visited {

  padding: 0 1em;

  border-right: 1px solid #3c85a8;

  text-decoration: none;

  color: #3C85A8;

  font-size: 0.8em;

}



#servicenav li.lastitem a:link,

#servicenav li.lastitem a:visited {

  border-right: none;

}



/* =========================================

  main screen area

========================================= */



#main {

  position: relative;

  padding: 55px 0 0 0;

  margin: 0 80px 15px 0px;

  min-height: 500px;

}



#content,

#intro-i {

  position: relative;

  border-left: 1px dashed #acd7f9;

  border-right: 1px dashed #acd7f9;

  margin-left: 262px;

  padding: 0 50px;

  line-height: 1.5;

}



#content {

  min-height: 450px;

}



/* =========================================

  special classes for HOME / intro

========================================= */



#intro {

  padding-bottom: 10px;

  background: url(../img/bg_intro.png) 80% 100% no-repeat;

  margin: 0;

  position: relative;

}



#separator {

  border-bottom: 1px dashed #acd7f9;

  margin: 0 10px 10px 270px;

  position: relative;

}



#intro p {

  margin-top: 0.5em;

}



#intro p.readmore {

  text-align: right;

  font-size: 0.8em;

  margin: 1em 0 0 0;

}



#intro h3 {

  margin: 0.5em 0.5em 0 0;

  float: left;

  color: #0b4da2;

}



#intro p.note,

#intro h3 {

  font-size: 0.8em;

}







/* =========================================

  navigation

========================================= */



#navigation {

  clear: right;

  float: left;

  margin: 0;

  padding: 0 5px 20px 0;

  width: 260px;

}



#navigation ul {

  list-style: none;

  padding-left: 70px;

  position: relative;

}



#navigation ul li {

  padding-top: 7px;

}



#navigation ul li.active {

  font-size: 1em;

  font-weight: bold;

}



#navigation ul li.active li {

  font-weight: normal;

}



#navigation ul li a {

  padding-left: 25px;

  font-size: 0.8em;

}



#navigation ul ul {

  margin-left: -55px;

}



#navigation ul li a:link,

#navigation ul li a:visited,

#circa a:link,

#circa a:visited {

  text-decoration: none;

  color: #3C85A8;

}



#navigation ul li.active a:link,

#navigation ul li.active a:visited,

#navigation ul li a:hover,

#navigation ul li a:focus {

  background: url(../img/menu_pfeil_blau.png) left center no-repeat;

  color: #0B4DA2;

}



#navigation ul li.active li a:link,

#navigation ul li.active li a:visited {

  background: none;

  color: #3C85A8;

}



#navigation ul li li.active a:link,

#navigation ul li li.active a:visited,

#navigation ul li li a:hover,

#navigation ul li li a:focus,

#navigation ul li.active li a:hover,

#navigation ul li.active li a:focus {

  background: url(../img/menu_pfeil_orange.png) left center no-repeat;

  color: #F58500;

}



#circa {

  padding-left: 95px;

  margin-top: 60px;

  position: relative;

}



#circa a {

  padding-right: 25px;

  font-size: 0.8em;

  background: url(../img/schluessel.png) right center no-repeat;

}



#circa a:hover,

#servicenav li a:hover,

#top a:hover {

  color: #0B4DA2;

}



/* =========================================

  jump to top of page

========================================= */



#top {

  margin: 2em 0 0 0;

  padding: 3px 0 3px 20px;

  background: url(../img/top_pfeil_blau.png) left center no-repeat;

}



#top a:link,

#top a:visited {

  color: #3C85A8;

  text-decoration: none;

  font-size: 0.8em;

}





/* =========================================

  footer

========================================= */



#footer {

  max-width: 1045px; /* 1100px - 55px */

  margin: auto;

  padding: 10px 0 10px 55px;

}



#footer-wrapper {

  background: url(../img/bg_footer.jpg) 40px 100% repeat-x;

}



#footer p {

  margin: 0;

  padding: 10px 0 10px 130px;

  position: relative;

  background: url(../img/logo_eu_fp6.gif) left center no-repeat;

}



#footer p a:link,

#footer p a:visited {

  color: Black;

  text-decoration: none;

  font-size: 0.7em;

}



#footer p a:hover {

  text-decoration: underline;

}



/* =========================================

  HOME / news

========================================= */



#content ul#news {

  list-style: none;

  margin: 0;

  padding: 0;

}



#content ul#news a:link,

#content ul#news a:visited {

  color: black;

  text-decoration: none;

}



#content ul#news li.pseudohover a,

#content ul#news li:hover a,

#content ul#news li a:hover,

#content ul#news li a:focus {

  color: #0B4DA2;

  text-decoration: underline;

}



#content ul#news li h3,

#content ul#news li p {

  margin: 0;

  padding: 0;

}



#content ul#news li {

  padding: 20px 0 12px 137px;

  list-style: none;

  margin: 0 0 8px 0;

  cursor: pointer;

  position: relative;

  background: url(../img/pfeil_orange_blau.png) 137px 100% no-repeat;

}



#content ul#news li h3 span {

  float: left;

  padding: 0;

  margin: -13px 0 0 -137px;

  font-size: 0.7em;

  font-weight: normal;

}



#content ul#news li img {

  position: absolute;

  top: 27px;

  left: 0;

}



/* =========================================

  special treatment of images

========================================= */



.csi-image img,

.preview-img img, 

.standard-img img {

  border-left: 4px solid #f58500;

  border-right: 1px dashed #ACD7F9;

  padding-right: 5px;

  margin: 0 10px 0 40px;

}



.csi-image,

.preview-img,

.standard-img {

  overflow: hidden;

  clear: both;

  margin-bottom: 1em;

  position: relative;

}



.csi-imagewrap, 

.csi-image {

  width: 100% !important;

  position: relative;

}



.csi-image .csi-caption,

.preview-img .img-caption,

.standard-img .img-caption {

  position: absolute;

  bottom: 0;

  left: 360px;

}



#content .csi-image .csi-caption p,

#content .preview-img .img-caption p,

#content .standard-img .img-caption p {

  font-size: 0.8em;

  font-style: italic;

  margin-bottom: 0.2em;

}



#content .csi-image .csi-caption p.img-source,

#content .preview-img .img-caption p.img-source,

#content .standard-img .img-caption p.img-source {

  font-size: 0.7em;

  font-style: normal;

}



.csi-image .img-popup,

.preview-img .img-popup {

  position: absolute;

  bottom: 5px;

  left: 55px;

  width: 29px;

  height: 44px;

  text-align: center;

  background: url(../img/popup_pfeil_orange.png) no-repeat;

}



.csi-image .img-popup span,

.preview-img .img-popup span {

  display: block;

  font-size: 0.6em;

  font-weight: bold;

  text-transform: uppercase;

  line-height: 0.9;

  padding-top: 13px;

  text-decoration: none;

}



/* =========================================

  content

========================================= */



#intro a:focus,

#content a:focus {

  background-color: #FCD76C;

}



#content p,

#content ul,

#content ol {

  margin-bottom: 1em;

  font-size: 0.9em;

}



#intro h2,

#content h2 {

  font-size: 1.05em;

  margin-bottom: 1em;

  color: #0b4da2;

}



#content h3 {

  font-size: 1em;

  margin: 1.5em 0 0.7em 0;

  color: #0b4da2;

}



#content h4 {

  font-size: 0.9em;

  margin-bottom: 0.7em;

}



#content ol,

#content ul {

  margin-left: 40px 

}



#content ul li {

  list-style: none;

  background: url(../img/li_pfeil_orange.png) 0px 0.6em no-repeat;

  margin-left: -20px;

  padding-left: 20px;

}



p.xls,

p.pdf,

p.doc,

p.zip {

  line-height: 1.2;

}



p.xls a,

p.pdf a,

p.doc a,

p.zip a {

  display: block;

  padding: 5px 0 5px 20px;

}



p.xls a {

  background: url(../img/fileicons/xls16.gif) left center no-repeat;

}



p.pdf a {

  background: url(../img/fileicons/pdf16.gif) left center no-repeat;

}



p.doc a {

  background: url(../img/fileicons/doc16.gif) left center no-repeat;

}



p.zip a {

  background: url(../img/fileicons/zip16.gif) left center no-repeat;

}



p.xls span.size,

p.pdf span.size,

p.doc span.size,

p.zip span.size {

  font-size: 0.8em;

  display: block;

  padding-left: 20px;

}



#content p.readmore {

  text-align: right;

  margin-bottom: 2em;

  font-size: 0.8em;

}



div.infoBox {

  border-left: 1px dashed lightblue;

  border-bottom: 1px dashed lightblue;

  float: right;

  font-size: 0.75em;

  margin: 0pt -50px 1em 1em;

  max-width: 18em; 

  padding: 0pt 1em 0.5em;

}





/* ===============================================

Events

=============================================== */



#content ul.events h4,

#content ul.events p {

  margin-bottom: 0.3em;

}



#content ul.events li {

  margin-bottom: 1em;

}



#content p.registration {

  text-align: right;

}



#content p.registration a:link,

#content p.registration a:visited {

background: url(../img/menu_pfeil_blau.png) left center no-repeat;

padding-left: 18px;

}



#content p.error {

  margin-bottom: 0;

  padding-top: 0.6em;

  color: red;

  font-weight: bold;

  clear:both;

}





/* ===============================================

Forms

=============================================== */

fieldset {

  border:0;

  margin: 0 0 1.5em 0;

   padding: 0 0 0.5em 0;

  border-bottom:1px solid white;

}



/* Clearfix-Methode zum Clearen der Float-Umgebungen */

fieldset:after {

   content: ".";

   display: block;

   height: 0;

   clear: both;

   visibility: hidden;

}



/* Diese Angabe benötigt der Safari-Browser zwingend !! */

fieldset { display: block; }



fieldset legend {

  background-color: #fff;

  padding: 0;

  margin: 0;

  font-weight: bold;

}



fieldset fieldset {

  padding: 0px;

  margin: 0px;

}



div.eingabe textarea {

  font-family: Verdana, Arial, Helvetica, sans-serif;

  border-color:#666666 rgb(187, 187, 187) rgb(187, 187, 187) rgb(102, 102, 102);

  border-style:solid;

  border-width:1px;

  padding:1px 2px;

}



div.eingabe input,

div.eingabe p.input,

div.eingabe label,

div.eingabe span.label,

div.eingabe select,

div.eingabe textarea,

div.option label {

  float: left;

  display: block;

}



div.eingabe input,

div.eingabe select,

div.eingabe p.input,

div.eingabe textarea {

  width: 250px;

}



div.eingabe {

  clear: both;

  padding: 0.5em 0;

  margin: 0;

  position: relative;

}



div.option {

  clear: both;

  padding-left: 165px;

  padding-top: 0.4em;

  position: relative;

}



div.option {

  zoom: 1; /* IE incl ie 7 */

}



div.eingabe label,

div.eingabe span.label {

  margin-left: 0;

  vertical-align: middle;

  width: 150px;

  float: left;

  text-align: right;

  padding-right: 1em;

  padding-top: 1px;

  position: relative;

  font-size: 0.85em;

}



div.eingabe p {

  clear: left;

  margin: 0 0 0 165px;

  padding: 0;

}



div.eingabe p.input {

  clear: none;

  margin: 0;

}



div.option label {

  text-align: left;

  padding-top: 0;

}



div.eingabe input {

  border-color:#666666 rgb(187, 187, 187) rgb(187, 187, 187) rgb(102, 102, 102);

  border-style:solid;

  border-width:1px;

  padding:1px 2px;

}



div.option input {

  padding: 0;

  position: absolute;

  left: 130px;

  float: left;

  margin-top: 0.25em;

}



div.eingabe button {

  width:250px;

  padding-left: 0;

  padding-right: 0;

  margin:5px 0 5px 165px;

  border-right: 1px solid #666;

  border-bottom: 1px solid #666;

  border-top: 1px solid #bbb;

  border-left: 1px solid #bbb;



}



.required {

  font-weight: bold;

  font-style: normal;

  color: Red;

}



div.explode-container legend,

div.explode-container {

  background-color: #dddddd;

}

div.explode-container {

  margin: 0px 0px 15px 0px;

}

div.explode-box {

  padding: 10px;

}

a.explode-header {

  display: block;

  background-color: #dd8888;

  padding: 4px 10px 4px 10px;

}

div.explode-container fieldset {

  border: 0px;

}





/* --- clearfix ------------------------------------------------------------ */

 

.clearfix:after {

  content: ".";

  display: block;

  height: 0;

  clear: both;

  visibility: hidden;

}



.clearfix {

  display:inline-block;

}



/* for safari */

/* Hide from IE Mac \*/

.clearfix { display: block }

/* End hide from IE Mac */