body {
            font:100%  'Helvetica Neue', Helvetica, Arial, Verdana, sans-serif;
            background-color:#B9CBE1;
        }


        #wrap {
            position: relative;
            width: 990px; /* vorher 920 */
            margin: 5% auto 0 auto;
            text-align: left;
        }
        
        
        h1,h2,h3 {
            font-weigh__ttt:normal;
            color:#497FB0;
        }
        
        h1 {
            font-size:120%;
            color:#000000;
            font-weight:normal;
            font-familll_lly: 'Trebuchet MS', 'Helvetica Neue', Arial, sans-serif;
            margin: 5px 0 5px 0;
            padding: 0px 0 0px 0;
        }
        
        h2 {
            font-size:12px; 
            padding-bottom:20px; 
        }
        
        h3 {
            font-size:12px;
        }
        
        /* hier beginnt das für die Box relevante CSS  */
        
        #header {
            position: relative;
			padding-left:480px; /*FLASH wäre bei 370px */
			bottom: 30px;	    /*FLASH wäre bei 13px */
        }
#unternavigation { 
            width: 730px;
height: 40px;
padding-right: 40px
}

        .referenzentext {
        	color:#497FB0;
        	padding:10px 0px 5px 0px}

#navcontainer li
{
list-style-type: none;
padding-top: 12px;
margin: 0px;
padding-left: 20px;
padding-right: 20px;
display: block;
border-left: 1px dashed #B9CBE1;
text-decoration:none; 
font-size:11px;
float:right;
text-align: center;
}

#navcontainer a
{
text-decoration: none;
display: block;
color:#93AED1;
}

#navcontainer li#active { background: url("/rippelmarken-internet/images/pfeil-oben.gif") no-repeat; background-position: 50% 0px;}
#navcontainer li#active a { color:#335879}
#navcontainer a:hover {  }

 
       #footer {
            position: relative;
			clear: both;
            width: 970px; /* vorher 900 */
			padding-left:0px;
			padding-top:30px; display: none;
        }
        
        #menuebox {
            width: 180px; /* vorher 110 */
            height: 300px; /* vorher 255 */
            float:left; background:url(/rippelmarken-internet/images/background-menue-breit.gif) left top no-repeat;
            background-position:10px}
        #menuebox a:link, #menuebox a:visited { font:11px  'Helvetica Neue', Helvetica, Arial, Verdana, sans-serif; line-height: 1.5em; color: #ffffff; text-decoration: none; font-weight:bold}
        #menuebox a:hover {color: #000000}

        #mittebox {
            position:relative; 
            width: 800px; 
            background:url(/rippelmarken-internet/images/background.gif) bottom left no-repeat; 
            float:left
        }

        #mitteoben {
            background:url(/rippelmarken-internet/images/background-oben.gif) top left no-repeat; 
            padding-bottom:15px; 
            heightttt:50px;
            line-height:18px;
            padding-left: 4%;
            float:left;
        }

        #mittelinks {
            width: 780px;
            float:left;
            color:#000000;
            text-decoration:none;
            font-size:12px;
            line-height:18px;
            padding-bottom:30px;
        }
        .spalte a { color:#467EB0; 
            padding-left: 10px;
            background:url(/rippelmarken-internet/images/pfeil-klein.gif) left no-repeat; 
            background-position:3px 0px}


        .spalte {
            width:27%;
            padding-left:4%;
            color:#000000;
            float: left;
            font-size:11px;
            line-height:16px;
     }


        .spalteimage {
            margin-right:-20px;
     }

        #blogliste {
            width:35%;
            height:100px;
            padding:10px;
            color:#000000;
            float: left;
            font-size:11px;
            line-height:16px;
            margin:0 0 4% 4%;
            position:relative;
            background:url(/rippelmarken-internet/images/background-referenzen.gif) bottom left repeat-y; background-position:0px 300px;
     }

        #rechtsbox {width: 390px; height: 350px; margin-left:3px; float:left}
        #rechtsboxoben {width: 390px; height: 280px; margin-bottom:10px; background-color:#D8E4F3; float:left}
        
        .menuepunkt {margin-left:0px; padding-left: 17px }
        .menuepunktaktiv {margin-left:0px; padding-left: 17px; background:url(/rippelmarken-internet/images/punkt-aktiv.gif) left no-repeat; background-position:0px -4px}
        .untermenuepunkt {margin-left:0px; padding-left: 35px; font-weight:normal}
        .untermenuepunktaktiv {margin-left:0px; padding-left: 35px; color: #000000; background:url(/rippelmarken-internet/images/pfeil-aktiv.gif) left no-repeat; background-position:25px -5px}
        


        
        .inhalt p{
            margin:0px;
            padding:25px 30px 25px 20px;
            color:#497FB0;
            text-decoration:none;
            font-size:11px; 
            line-height:22px
        }
        .inhalt {
            margin:0;
            padding-top:25px;
        }
        #haupttext {
            margin:0px;
            padding:5px 30px 25px 20px;
            color:#497FB0;
            text-decoration:none;
            font-size:13px;
            line-height:20px
        }
        #zurueck {
            position: absolute;
            width: 19px;
            height: 25px;
	    top: 280px;
	    left: 760px;
	    border:0px; 
        }

        #weiter {
            position: absolute;
            width: 76px;
            height: 25px;
	    top: 280px;
	    left: 782px;
	    border:0px; 
        }
        #startbuttons {
            position: relative;
            width: 740px;
            height: 320px;
	    border:0px; 
            background:url(/rippelmarken-internet/images/webdesign-programmierung.jpg) top left no-repeat;
            font-size:10px;
            line-height:11px;
            color:#7e7e7e;
            margin-left:30px;
        }
        #startbuttons p{
            position: relative;
	    padding: 30px 30px 0 45px;
        }
        #startbuttons a {
            background: #ffffff;
            margin: 0px;
            font-weight: bold;
            font-size:11px;
            color: #497FB0;
            text-decoration:none;
        }
        #startfeldlinks {
            position: relative;
            width: 240px;
	    float: left;
	    height: 210px;
	    margin: 80px 0px 0px 0px;
            background:url(/rippelmarken-internet/images/icon-beratung.jpg) top left no-repeat;
            background-position:5px 5px;
            border-left:1px solid #e0e0e0;
            border-right:1px solid #e0e0e0;
            border-bottom:1px solid #e0e0e0;
        }
        #startfeldmitte {
            position: relative;
            width: 240px;
	    float: left;
	    height: 210px;
	    margin: 80px 0px 0px 0px;
            background:url(/rippelmarken-internet/images/icon-referenzen.jpg) top left no-repeat;
            background-position:5px 5px;
            border-right:1px solid #e0e0e0;
            border-bottom:1px solid #e0e0e0;
        }
        #startfeldrechts {
            position: relative;
            width: 240px;
	    float: left;
	    height: 210px;
	    margin: 80px 0px 0px 0px;
            background:url(/rippelmarken-internet/images/icon-sitecheck.jpg) top left no-repeat;
            background-position:5px 5px;
            border-right:1px solid #e0e0e0;
            border-bottom:1px solid #e0e0e0;
        }
        .startfeldbild {
            position: absolute;
	    bottom: 0px;
	    right: 0px;
        }

#erklaertext { width: 180px; float:right; font-size:10px; padding-right:20px; text-decoration:none; line-height:16px}
#referenzlinks { width: 170px; float:left; font-size:10px; color:#ffffff; padding-left: 10px; line-height:17px}
#referenzlinks a {text-decoration:none; color:#ffffff}
#referenzlinks a.aktiv {color:#335879; font-weight:bold}
#referenzlinks a:hover {color:#000000}
#jd_slideshow {border:0px solid #D8E4F3; width:780px; height:350px; background-color: #DAE3EF;}


/* ---------------------------------*/
/* Flachenpost */
/* ---------------------------------*/



#flaschenpost {
            padding-left:4%;
            padding-right:4%;
            top:15px;
            font-size:12px;
            width:380px;
            heigthttt:550px;
background:white
}
        #flaschenpost a { color:#467EB0; 
            padding-left: 10px;
            background:url(/rippelmarken-internet/images/pfeil-klein.gif) left no-repeat; 
            background-position:3px 0px}

#flaschenpost ul
{
list-style: none;
margin: 0;
padding: 0.25em;
}
#flaschenpost li
{
            background:url(/rippelmarken-internet/images/pfeil-klein.gif) no-repeat left 5px;
            list-style: none;
            margin: 0;
            padding: 5px;
            padding-left: 9px;
            border-bottom: 1px solid #B9CBE1;
            font-size:11px; 
            line-height:14px;
}


/* ---------------------------------*/
/* BILDERGGALERIE */
/* ---------------------------------*/



#galerie ul li {
	margin: 5;
text-align: center;
}
#galerie li {
	width: 200px;
	height: 170px;
	margin: 5px 5px 5px 5px;
	padding :5px;
	display: block;
	float: left;
	background-co__lor: #E8EEF7;
	border:0px dotted #A4BCE0;
	text-align: center;
}

#galerie img {border:1px solid #B9CBE1 }

#galerie .preview {
	width: 90px;
	hei__ght: 100px;
	margin-bottom: 5px;

}
#galerie.preview  {
	text-align: center;
	padding: 4px;
	background: #fff;
	border: solid 0px #ccc;

}
#galerie .preview a:hover  {
	border-color: #999;
}
#galerie ul {
	padding: 0;
	margin: 0;
}
#galerie li a:link, #galerie li a:visited {
	text-decoration: none;
}
#galerie li a:hover {
	text-decoration: none;
	background-color: #f0f0f0:
}

/* ---------------------------------*/
/* Glossar - Slider */
/* ---------------------------------*/

#scroller {

}

#scrollerhoehe {
    position: absolute;
    left:34%;
padding-left:10%;
width: 53%;
padding-right:4%;
padding-top:0px;margin-top:0px;
height:400px;
right:10px;
}

.scroll {
    height: 400px;
    width: 260px;
    overflow: auto;
    overflow-x: hidden;
    position: absolute;
    left:10px; 
    top:0;
    background:url(/rippelmarken-internet/images/glossar.gif) no-repeat;
}

.scroll a { 
    color:#467EB0; padding-left: 10px; background:url(/rippelmarken-internet/images/pfeil-klein.gif) left no-repeat; background-position:3px 0px
}

.scrollContainer div.panel {
    padding: 5px 10px 10px 20px;
    height: 400px;
    width: 230px;
    font-size:11px;
    line-height:14px;
    position: absolute;
left:0;
top:0;
    background:url(/rippelmarken-internet/images/glossar.gif) no-repeat;
}


ul.scrollnavigation {
    list-style: none;
    margin: 0px;
    padding: 0px 0 0 0;
    width:200px;
    position: absolute;
    left:270px;
display: block;
}

ul.scrollnavigation li {
    margin-right: 0px;
    padding:0px 0 0 0;
    padding: 5px 15px 5px 0px;
}

ul.scrollnavigation a {
    color: #000;
    text-decoration: none; 
    margin: 0px;
    display: block;
padding-left:  20px;
}

ul.scrollnavigation a:hover {
    background-color: #D8E4F3;
}

ul.scrollnavigation a.selected {
    background-color: #f3f6fa;
}

ul.scrollnavigation a:focus {
    outline: none;
}


/* clearfix 
------------------------------*/
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
* html>body .clearfix {
	display: inline-block; 
	width: 100%;
}
* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
}