body {
     width:100%;
     height:100%;
     margin:0;
     padding:0;
     background:#ebebeb url(../images/ddc_body_background_complete.jpg) no-repeat top center;
     font-family:arial,helvetica,sans-serif;
     background-attachment:fixed;

}

.clearer {
      clear:both;
      font-size:0%;
      height:0;
      width:0;
}

h1 {
     color:#eb6a29;
     font-size:16px;
}

h2 {
     font-size:14px;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    border: 1px solid green;
}

/* Hide from IE-mac \*/
* html .clearfix { height: 1%; }
/* End hide from IE-mac */


#wrapper {
     position:relative;
     padding:0;
     margin:0 auto;
     background:#fff;
     width:852px;
     height:auto;
}

#wrapper #logowrapper {
     position:absolute;
     padding:0;
     margin:0;
     width:234px;
     height:33px;
     top:23px;
     left:48px;
     z-index:502;
}

#wrapper #noriswrapper {
     position:absolute;
     padding:0;
     margin:0;
     width:183px;
     height:31px;
     top:199px;
     left:47px;
     z-index:499;
}
#cntleft {
     float:left;
     padding:0;
     margin-right:15px;
     width:389px;
}

#cntright {
     float:left;
     padding:0;
     margin-top:10px;
     width:130px;
}


#wrapper #content {
     position:absolute;
     padding:35px 25px 25px 25px;
     margin-bottom:199px;
     width:535px;
     background:url(../images/ddc_ctn_background.png) repeat-y 0 0;
     top:199px;
     left:223px;
     z-index:500;
     font-size:12px;
     line-height:16px;
     color:#535353;
}

#wrapper #content a img,
#wrapper #content img,
#wrapper #noriswrapper a img {
     border:0;
}


#wrapper #content a:link, #content a:visited {
     color:#535353;
     text-decoration:underline;
}

#wrapper #content a:hover {
     color:#535353;
     text-decoration:none;
}


/*******************************************/
/*******************************************/
/*******************************************/
#wrapper #mainnavigation {
     position:absolute;
     padding:0;
     margin:0;
     width:183px;
     background:#fff;
     top:277px;
     left:47px;
     font-size:12px;
}

#wrapper #mainnavigation ul.navi {
     padding:0;
     margin:0;
     list-style-type:none;
     width:183px;
}

#wrapper #mainnavigation ul.navi li ul {
     padding-left:0;
     margin-left:0;
     list-style-type:none;
     width:183px;
}

#wrapper #mainnavigation ul.navi li {
     padding:0;
     margin:0;
     width:183px;
}


#wrapper #mainnavigation ul.navi li a {
     padding:4px 8px;
     margin:0;
     width:167px;
     background:#b9ccc8;
     /*height:23px;*/
     border-bottom:1px solid #fff;
     display:block;
     color:#405351;
     font-weight:bold;
     text-decoration:none;
}

#wrapper #mainnavigation ul.navi li ul li a {
     padding:4px 16px;
     margin:0;
     width:151px;
     background:#dde6e5; /*b9ccc8*/
     /*height:23px;*/
     border-bottom:1px solid #fff;
     display:block;
     color:#405351;
     font-weight:bold;
     text-decoration:none;
}

#wrapper #mainnavigation ul.navi li ul li ul li a {
     padding:4px 32px;
     margin:0;
     width:119px;
     background:#dde6e5; /*b9ccc8*/
     /*height:23px;*/
     border-bottom:1px solid #fff;
     display:block;
     color:#405351;
     font-weight:bold;
     text-decoration:none;
}


#wrapper #mainnavigation ul.navi li a:hover {
     color:#000;
}

#wrapper #mainnavigation ul.navi li a.active {
     color:#000;
     background:#dde6e5;
}

#wrapper #mainnavigation .bottom {
      float:left;
      background:url(../images/ddv_mainnavigation_bottom-background.jpg) repeat-x 0 0;
      height:85px;
      width:183px;
      margin:0;
      padding:0;
}


/*******************************************/
/*******************************************/
/*******************************************/
#wrapper #rootline {
     position:absolute;
     padding:0;
     margin-left:25px;
     padding-bottom:5px;
     width:535px;
     top:199px;
     left:223px;
     z-index:501;
     color:#545454;
     border-bottom:1px solid #cbcbcb;
     font-size:12px;
}

#wrapper #rootline a {
    color:#545454;
    text-decoration:none;
    font-weight:bold;
}

/*******************************************/
/*******************************************/
/*******************************************/
#wrapper #headerimage {
     position:absolute;
     padding:0;
     margin:0;
     width:766px;
     height:120px;
     background:url(../images/ddc_header_image.jpg) no-repeat 0 0;
     top:80px;
     left:47px;
     z-index:499;
}

.box_imgl ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0 0 0 180px;
padding-left:1em;
}

ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0 0 0 18px;
padding-left:1em;
}

ul.bullets {
overflow:hidden;
}
/*******************************************/
/*******************************************/
/* box index page */

.box {
    width: 370px;
    padding: 0;
    margin: .4em 0;
    }

.box h4 { padding: 0 .8em; margin: 0 0 .8em 0; }
.box h5 { padding: 0; margin: .5em 0 0; }
.box p { margin: 0 .2em .4em .8em; }
.box p span { white-space: nowrap; }

/* forms */

legend      { padding: .2em .8em; }
fieldset    { margin: .5em 0; }
.box form   { text-align: center; margin: .8em; }
.box fieldset { padding: 0; border: 0; }

form.bestellung { text-align: center; margin: 0 .8em .8em; }
form.bestellung fieldset { padding: 1em; border: 0; }

.colo-icon {
    float: left;
    margin: 0 1.4em .8em 0;
    width: 100px;
    height: 108px;

    }


/* box rechenzentrum with left-aligned image */

.box_imgl {
    padding: 0;
    margin: 20px 0;
    }

.box_imgl img {
    float: left;
    border: 1px inset #89A;
    width: 170px;
    height: 114px;
    margin: 0 20px 0 0;
    }

.box_imgl div.img { /* Bilder mit Untertiteln */
    float: left;
    border: 0;
    width: 170px;
    height: 114px;
    margin: 0 20px 24px 0;
    }

.box_imgl h4 {
text-align: center;
    margin: 10px 0;
    padding: 2px;
    color: #415251;
    background: #b9ccc8;
    }

.box_imgl h4.second {
    margin: 1em 0 0 190px;
    }

.box_imgl ul {
    list-style: none;
    margin: 0 0 0 180px;
    padding-left: 1em;
    }

.box_imgl ul li,  ul li{
    padding-left: 1.2em;
    }

.box_imgl h6 {
    font-size: 1em;
    padding: 0;
    margin: 0 0 .4em 190px;
    }

.box_imgl p {
    margin: 0 0 1em 0;
    padding: 0;
    }

.box_imgl p.ral {
    margin-right: 4em;
    }

    table {
    width: 100%;
    border-spacing: 1px;
    margin: .5em 0 1em;
    }

td, th { padding: .2em; }
td { vertical-align: top; }
td.ral { text-align: right; }
td dl { 
    margin: 0 1em;
    color: #000;
    font-family: Verdana, sans-serif;
    font-size: 1em;
    line-height: inherit;
    }
td dt {
    margin: 0;
    padding-left: 0;
    color: #000;
    font-size: 1em;
    font-weight: normal;
    background: inherit;
    }
td dd {
  margin: 0 0 0 50px; 
  float:left;
}

 /* poor support of first-child pseudo element in IE
 first td in table must be classified as "first" */
 table.wideleftcol td.first
{ width: 400px; }

/* table colors */
table           { border: 1px solid #bababa; }
th              { border-bottom: 1px solid #dde6e4; }
tfoot td        { border-top: 1px solid #C9D2E1; }
thead, tfoot    { color: #415251; background-color: #dde6e4; }
tfoot td        { text-align: center; font-size: .8em;}
/* tr.odd       { background-color: #F1F4F8; } */
tr.odd          { background-color: #F4F7FB; }
tbody th        { color: #415251; background-color: #b9ccc8; }
th.dark         { color: #415251; background-color: #b9ccc8; }

#col2           { font-weight: bold; }


span.nowrap { white-space : nowrap; }

/* Video Download */

dl.download {
    margin: .4em 0;
    padding: 0;
    width: 480px;
}
.download dt {
    float: left;
    width: 50px;
    margin: 0 15px 0 0;
    padding: 0;
    color: #000;
    background: #FFF;
    text-align: center;
}
.download dd {
    float: left;
    width: 400px;
    margin: 0;
    padding: 0;
}

dt { 
   color: #eb6a29;
   /*background: transparent url("../images/i_arrow.gif") 100px 3px no-repeat;*/
   font-size: 1.1em;
   font-weight: bold;
}

.orange     { color: #F70; }
.darkred    { color: #D03441; }
.bold       { font-weight: bold; }
.small      { font-size: .7em; color: #f00; }

ul.bullets li, .box_imgl ul li { background: transparent url("../images/i_arrow.gif") 0px 3px no-repeat; }
ul.bullets ol li { background: transparent; }


/* news */

.newsdate,
a#news_1, a#news_1:visited, a#news_1:hover, 
a#news_2, a#news_2:visited, a#news_2:hover 
    {
    font-weight: bold;
    color: #eb6a26;
    border-top: 1px dotted #cbcbcb;
    border-bottom: 1px dotted #cbcbcb;
    }

h3.newsh {
    margin: 0 0 .8em;
    }

.newsintro {
    font-weight: bold;
    }

.newsimg {
    float: left;
    }


 /* server icon produkt detail page */

img.left {
    width: 110px;
    float: left;
    margin: .4em 25px 15px 0;
}

p.right {
    margin-left: 135px;
}

/* order page form */

fieldset#person, fieldset#produkt, fieldset#order, fieldset#msg, fieldset#zusatz
    { padding: 0 0 1em 0; margin: 1em 0; border: none; }
        
fieldset#person h4, fieldset#produkt h4, fieldset#order h4, fieldset#msg h4, fieldset#zusatz h4
    { text-align: left; margin: 0 0 .8em 0; padding: .2em .5em; }

fieldset#person label, fieldset#msg label {
    float: left;
    clear: left;
    width: 180px;
    text-align: right;
    margin-top: 0.2em;
    margin-right: 0.5em;
    }

fieldset#person input, fieldset#msg input, fieldset#msg textarea {
    width: 200px;
    font-family: verdana, sans-serif;
    font-size: 1em;
    margin: .1em 0;
    padding: 0.1em 0.2em;
    border: 1px solid #999;
    }

fieldset#person dfn {
    }

fieldset#order { text-align: center; }

fieldset#zusatz .leftaligned_cbx {
    margin: .5em 0;
}

fieldset#zusatz label {
    display: block;
    padding-top: .4em;
    clear: left;
    width: 500px;
    }

fieldset#zusatz .leftaligned_cbx input {
    float: left;
    width: 1em;
    margin-right: .3em;
}

input.submit, a.submit {
    color: #2B333C;
    border: 3px double;
    border-color: #C4CCCC #ACB5B5 #6F7777 #ACB5B5;
    padding: 0.25em 0.5em;
    background: #fefefe url("../images/dcc_btn_background.gif") repeat-x;
    font-size: .8em;
    font-weight: bold;
    font-family: Verdana, helvetica, Arial, sans-serif;
    text-decoration: none;
    }

input.submit:hover, a.submit:hover {
    color: #2B333C;
    border-color: #eb6a26;
    }

div.button {
    text-align: center;
    padding: .8em 0;
}

.images img#foto {
border:0 none;
float:left;
height:72px;
margin-right:2px;
width:67px;
}
.images .icons img {
display:block;
margin:0 0 5px;
padding:0;
}

.images img {
border:1px inset #CCDDEE;
margin-bottom:5px;
}
.box {
background-color:#FFFFFF;
border:1px solid #CCCCCC;
}
.box {
margin:0.4em 0;
padding:0;
width:370px;
}

.box h4 {
background:#b9ccc8;
color:#3e514f;
margin:0 0 0.8em;
padding:0 0.8em;
}

h3 {
color:#eb6a29;
}

acronym {
   border-bottom: 1px dotted black; 
   cursor: help; 
}