* {
   color: #fff;
   font-family: "Lucida Sans", "Lucida Unicode", Arial, Sans-Serif;
   font-size: 12pt;
   margin: auto;
   padding: 0;
   text-align: center;
}

body {
   background: #b3b3a3 url(gradient.png);
   background-repeat: repeat-x;
   margin: 0;
   padding: 0;
}

#main {
   background: #fff;
   border: 1px solid #b0b0a6;
   margin: auto;
   margin-top: 70px;
   padding: 10px;
   width: 300px;
}

#header, #subtitle, #mehr {
   padding-left: 20px;
   padding-right: 20px;
}

#header, #subtitle {
   margin-bottom: 10px;
}

#header {
   background: #a02a40;
   border: 1px dotted #880a20;
   padding-top: 30px;
   padding-bottom: 30px;
}

#title {
   font-size: 22pt;
   font-weight: bold;
}

#zusatz {
   font-size: 10pt;
}

#subtitle {
   background: #0080ea;
   border: 1px solid #00609a;
   padding-top: 5px;
   padding-bottom: 5px;
}

#content-short {
   background: #fff;   
}

.letter {
   background: #006633;
   border: 1px solid #003319;
   color: #fff;
   font-size: 30px;
   float: left;
   height: 50px;
   line-height: 50px;
   text-align: center;
   width: 75px;
}
#java {
   background-image: url(java.png);
}
#ruby {
   background-image: url(ruby.png);
}
#xml {
   background-image: url(xml.png);
}
.text {
   border: 1px solid #006633;
   border-left: 1px none black;
   color: #006633;
   float: left;
   line-height: 50px;
   padding-left: 20px;
   text-align: left;
   width: 201px;
}
.clear {
   clear: both;
   height: 10px;
}
#mehr {
   background: #004020;
   border: 1px dotted #003319;
   color: #fff;
   display: block;
   padding: 10px;
   text-align: center;
}
#impressum {
   background: #fff;
   border: 1px solid #b0b0a6;
   display: block;
   margin: auto;
   margin-top: 10px;
   padding: 10px;
   width: 300px;
}
#impressum, #impressum * {
   color: #330;
   font-size: 10pt;
}