/*-----------------------------------------------------------------------*/
/* Hyperlinks */
/*-----------------------------------------------------------------------*/	
	
	a:link { 
	text-decoration: none; 
	color: #000000; } 

	a:visited { 
	text-decoration:none;
    color: #565656; 
	} 

	a:focus { 
	text-decoration:underline;
    color: #cdcdcd;
	} 

	a:hover { 
	text-decoration:underline;
    color: #000000; 
	} 

	a:active { 
	text-decoration:underline;
    color: #cdcdcd; 
	}
	
	a img {
    border : 0 none;
    } 
    
    .grossabstand {
    letter-spacing: 0.5em;
    line-height: 2.5;
    }
    
    .grossabstand2 {
    letter-spacing: 0.2em;
    line-height: 2.5;
    }
    
          	        	
	
/*-----------------------------------------------------------------------*/
/* Absätze */
/*-----------------------------------------------------------------------*/

  * {
     margin: 0;
     padding: 0;
    }


p  { 
    margin: 15px 0;
	font-family: Verdana; 
	font-weight: normal;
	font-style: normal;
	letter-spacing: 0px;
	color: #000000;
	}
	
b, STRONG { 
	font-family: Verdana; 
	font-weight: bold;
	font-style: normal;
	font-size: 1.0em;
	letter-spacing: 0px;
	color: #000000;
	}	   
   
   .floatrechts1 {
    float:right;
    margin-right: 5%;
    cursor:n-resize;
   }
   
   .floattab9 {
   float:left;
   width: 50%;
   padding-left:25%;
   }
   
   .floattab10 {
   width: 50%;
   margin-left: auto;
   margin-right: auto;
   }
   


/*-----------------------------------------------------------------------*/
/* Body */
/*-----------------------------------------------------------------------*/	


body {
	background-color:#565656;
	font-family: Verdana; 
	font-weight: normal;
	font-style: normal;
	font-size: 0.75em;
	-webkit-text-size-adjust: 100%;
	overflow:hidden;
	background-image: url(grafiken_2014/bg1.jpg);
    }
    
/*-----------------------------------------------------------------------*/
/* ANFANG 2014 - NEU */
/*-----------------------------------------------------------------------*/	




    #menufenster {
    position:absolute;
    z-index:2;
    width: 25%;
    height: 100%;
    background-color:#ffffff;
    border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:0px;
    border-style:solid;
    border-color:#cdcdcd;
    float:left;
    }
    
    #menuerahmen {
    position:relative;
    width: 100%;
    height: 100%;
    }
    
    #menu_mobil_links {
    position:absolute;
    top: -200%;
    left: -200%;
    float:left;
    } 
    
    #menu_mobil_rechts {
    position:absolute;
    top: -200%;
    left: -200%;
    float:left;
    } 
    
    #hoehenvorgabe {
    position:absolute;
    top: -200%;
    left: -200%;
    } 
    
    #logo {
    width: 130px;
    position:relative;
    padding-top:20%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:0px;
    border-style:solid;
    border-color:#cdcdcd;
    float:none;
    }
    
    
    #startseite {
    position:absolute;
    top: 8%;
    left: 40%;
    width: 40%;
    max-width: 700px;
    /*min-height: 50%;*/
    background-color:#ffffff;
    border-left-width:10px;
    border-right-width:10px;
    border-top-width:10px;
    border-bottom-width:10px;
    border-style:solid;
    border-color:#cdcdcd;
    }
    
    #leistungen {
    position:absolute;
    overflow: auto;
    top: 8%;
    left: 187.5%;
    width: 50%;
    height: 70%;
    background-color:#eaebed;
    border-left-width:10px;
    border-right-width:10px;
    border-top-width:10px;
    border-bottom-width:10px;
    border-style:solid;
    border-color:#cdcdcd;
    }
    
    #referenzen {
    position:absolute;
    overflow: auto;
    height: 70%;
    max-height: 82%;
    top: 8%;
    left: 337.5%;
    width: 50%;
    background-color:#eaebed;
    border-left-width:10px;
    border-right-width:10px;
    border-top-width:10px;
    border-bottom-width:10px;
    border-style:solid;
    border-color:#cdcdcd;
    }
    
    #team {
    position:absolute;
    overflow: auto;
    max-height: 82%;
    top: 158%;
    left: 37.5%;
    width: 50%;
    background-color:#ffffff;
    border-left-width:10px;
    border-right-width:10px;
    border-top-width:10px;
    border-bottom-width:10px;
    border-style:solid;
    border-color:#cdcdcd;
    }
    
    #kontakt {
    position:absolute;
    top: 158%;
    left: 187.5%;
    width: 50%;
    overflow: auto;
    max-height: 82%;
    background-color:#ffffff;
    border-left-width:10px;
    border-right-width:10px;
    border-top-width:10px;
    border-bottom-width:10px;
    border-style:solid;
    border-color:#cdcdcd;
    }
    
    #impressum {
    position:absolute;
    background-color:#eaebed;
    overflow: auto;
    top: 158%;
    left: 337.5%;
    width: 50%;
    overflow: auto;
    max-height: 82%;
    background-color:#ffffff;
    border-left-width:10px;
    border-right-width:10px;
    border-top-width:10px;
    border-bottom-width:10px;
    border-style:solid;
    border-color:#cdcdcd;
    }
    
    .leistung {
    position:relative;
    margin-top: 1%;
    margin-left: 1%;
    margin-right: 1%;
    margin-bottom: 1%;
    width: 22.1%;
    background-color:#ffffff;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;
    float:left;
    }
    
    .leistung_links {
    position:relative;
    margin-top: 1%;
    margin-left: 2%;
    margin-right: 1%;
    margin-bottom: 1%;
    width: 22.1%;
    background-color:#ffffff;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;
    float:left;
    }
    
    .leistung_rechts {
    position:relative;
    margin-top: 1%;
    margin-left: 1%;
    margin-right: 2%;
    margin-bottom: 1%;
    width: 22.1%;
    background-color:#ffffff;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;
    float:left;
    }
    
    .referenz_links {
    position:relative;
    margin-top: 0%;
    margin-left: 2%;
    margin-right: 0%;
    margin-bottom: 0%;
    width: 31%;
    background-color:#ffffff;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;
    float:left;
    }
    
    .referenz_mitte {
    position:relative;
    margin-top: 0%;
    margin-left: 1%;
    margin-right: 1%;
    margin-bottom: 0%;
    width: 31%;
    background-color:#ffffff;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;
    float:left;
    }
    
    .referenz_rechts {
    position:relative;
    margin-top: 0%;
    margin-left: 0%;
    margin-right: 1%;
    margin-bottom: 0%;
    width: 31%;
    background-color:#ffffff;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;
    float:left;
    }
    
    .referenz_details {
    position:relative;
    background-color:#ffffff;
    margin-top: 1%;
    margin-left: 2%;
    margin-right: 3%;
    margin-bottom: 1%;
    padding-bottom: 1%;
    padding-top: 5%;
    padding-left: 1%;
    padding-right: 1%;
    width: 93.5%;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;  
    }
    
    .team_details {
    position:relative;
    background-color:#ffffff;
    margin-top: 1%;
    margin-left: 2%;
    margin-right: 3%;
    margin-bottom: 1%;
    padding-bottom: 1%;
    padding-top: 5%;
    padding-left: 1%;
    padding-right: 1%;
    width: 93.5%;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;  
    }
    
    
    
    .leistung_details {
    position:relative;
    background-color:#ffffff;
    margin-top: 1%;
    margin-left: 2%;
    margin-right: 3%;
    margin-bottom: 1%;
    padding-bottom: 1%;
    padding-top: 5%;
    padding-left: 5%;
    padding-right: 5%;
    width: 85.5%;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#cdcdcd;  
    }
    
    .unterstrich_referenz {
    position:relative;
    width: 140px;
    margin-top:5px;
    border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#000000; 
    }
    
    #leistung_design { 
	background-image:url(grafiken_2014/leistung_design.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_design:hover { 
	background-image:url(grafiken_2014/leistung_design_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_webdesign { 
	background-image:url(grafiken_2014/leistung_web.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_webdesign:hover { 
	background-image:url(grafiken_2014/leistung_web_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_textierung { 
	background-image:url(grafiken_2014/leistung_textierung.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_textierung:hover { 
	background-image:url(grafiken_2014/leistung_textierung_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_programmierung { 
	background-image:url(grafiken_2014/leistung_php.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_programmierung:hover { 
	background-image:url(grafiken_2014/leistung_php_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_app { 
	background-image:url(grafiken_2014/leistung_app.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_app:hover { 
	background-image:url(grafiken_2014/leistung_app_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_konzept { 
	background-image:url(grafiken_2014/leistung_konzept.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_konzept:hover { 
	background-image:url(grafiken_2014/leistung_konzept_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_video { 
	background-image:url(grafiken_2014/leistung_video.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_video:hover { 
	background-image:url(grafiken_2014/leistung_video_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_foto { 
	background-image:url(grafiken_2014/leistung_foto.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_foto:hover { 
	background-image:url(grafiken_2014/leistung_foto_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_sps { 
	background-image:url(grafiken_2014/leistung_sps.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_sps:hover { 
	background-image:url(grafiken_2014/leistung_sps_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
	
	#leistung_china { 
	background-image:url(grafiken_2014/leistung_china.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}
    
    #leistung_china:hover { 
	background-image:url(grafiken_2014/leistung_china_text.jpg);
	background-repeat:no-repeat;
    background-position:center; 
	}


/*-----------------------------------------------------------------------*/
/* ENDE 2014 - NEU */
/*-----------------------------------------------------------------------*/

/*-----------------------------------------------------------------------*/
/* Zitate */
/*-----------------------------------------------------------------------*/	

.spruch {
    position:relative;
    margin-top:20px;
	margin-bottom:20px;
	text-align: center;
	font-family: KlintStd-Medium, Arial; 
	font-weight: normal;
	font-style: normal; 
	font-size: 2.5em;
	color: #575757;
    }
    
    .hp_text {
    position:relative;
    margin-left: auto; 
	margin-right: auto; 
	text-align: center;
    font-family: KlintStd-Light, Arial; 
	font-weight: normal;
	font-style: normal; 
	font-size: 1.2em;
	color: #000000;
    }
    
    
    #animationbox1 {
    position:relative; 
    margin-top:0px;
    margin-left:0px;
    width: 100%;
    max-width: 700px;
    padding-top:0px;
    padding-bottom:0px;
    padding-right:0px;
    padding-left:0px;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:1px;
    border-style:none;
    border-color:#cdcdcd;
    float:none;
    }


    #test2 {
    background-color:#cdcdcd !important;
    }  
    

/*-----------------------------------------------------------------------*/
/* Menue */
/*-----------------------------------------------------------------------*/	  

/*   ul {width:810px; display:table}
   li {list-style: none; display:table-cell}  */ 
 
    #menu { 
    visibility: visible;
    position: absolute;
    bottom: 50%;
    width: 50%; 
    margin-left: 33%;
    /*padding-top: 50%; */
    margin-bottom: 0px;
    background: #ffffff; 
    font-family: Verdana; 
    font-size: 1em; 
    line-height: 1.5; 
    float: left; 
    min-height: 25px;
    margin-bottom:30px;
    }
    
    /*--formatiert die Themenblöcke--*/ 
    #menu ul { 
    /*float: left; */
    width: 140px; 
    list-style-type: none; 
    }
    

    /*--definiert die "Drop-Down-Links" im Normalzustand--*/ 
    #menu a { 
    text-decoration: none; 
    display: block; 
    border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:0px;
    border-style:solid;
    border-color:#000000;
    background: #ffffff; 
    color: #003366;
    padding: 0px 0px; 
    }  

    /*--definiert die "Drop-Down-Links" im Hoverzustand--*/ 
    #menu a:hover { 
    color: #cdcdcd; 
    background: #ffffff; 
    }

    #menu li { 
    position: relative; 
    } 

    /*--versteckt die "Drop-Down-Links", solange nicht gehovert wird--*/ 
    #menu ul ul { 
    position: absolute; 
    z-index: 2; 
    display: none; 
    }
    
    /*--lässt die Dropdown-Links beim Hovern erscheinen--*/ 
    #menu ul li:hover ul { 
    display: block; 
    }
    
    /*--nur für IE-Versionen kleiner gleich 6 erkennbar--*/ 

    * html #menu ul li { 
    float: left; 
    width: 100%; 
    } 

    /*--nur für IE 7 erkennbar--*/ 

    *+ html #menu ul li { 
    float: left; 
    width: 100%; 
    }
    
    /*--definiert einen Einzellink im Normalzustand, wenn kein Drop-Down erforderlich--*/ 

	#menu a.direkt:link { 
	font-size: 1em; 
	color: #000000; 
	border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#000000; 
    background: #ffffff; 
    text-align: left;
    padding-bottom:2px;
	} 
	
	#menu a.direkt:visited { 
	font-size: 1em; 
	color: #000000; 
	border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#000000; 
    background: #ffffff; 
    text-align: left;
    padding-bottom:2px;
	}
	
	#menu a.direkt:focus { 
	font-size: 1em; 
	color: #000000; 
	border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#000000; 
    background: #ffffff; 
    text-align: left;
    padding-bottom:2px;
	}
	
	#menu a.direkt:active { 
	font-size: 1em; 
	color: #000000; 
	border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:1px;
    border-style:solid;
    border-color:#000000; 
    background: #ffffff; 
    text-align: left;
    padding-bottom:2px;
	}

	/*--definiert einen Einzellink im Hoverzustand, wenn kein Drop-Down erforderlich--*/ 

	#menu a.direkt:hover { 
	color: #000000; 
	border-left-width:0px;
    border-right-width:0px;
    border-top-width:0px;
    border-bottom-width:3px;
    border-style:solid;
    border-color:#000000; 
    background: #ffffff;
    text-align: left; 
    padding-bottom:0px;
	}