/******************************************/
/* CCS-File von ENNOS GmbH - Freiburg     */
/* www.ennos.de                           */
/* 10. Nov. 2009 - Zoanlanlon-Webdesign   */
/******************************************/


/**********************************/
/* Normalisiert die Einstellungen */
/**********************************/

/* Normalisiert margin, padding */
html, body, div, ul, li, h1, h2, h3, h3, h4, h5, p, blockquote {margin: 0; padding: 0;}

/* Normalisiert die Fontstyles */
h1, h2, h3, h3, h4, h5 {font-size: 100%;}

/* Entfernt list styles */
ol, ul {list-style: none;}


/****************************************************/
/* Positionierungen der Elemente                    */
/****************************************************/
/*  2 spaltiges Layout mit Header und footer        */
/*  Bildbreite:  800px                              */
/****************************************************/
/*  Header:  800px*100px                            */
/****************************************************/
/*  Navigation: 175px   **  textbereich: 625px      */
/****************************************************/
/*  footer: 800px*20px                              */
/****************************************************/


html {text-align: center;}

body {
    width: 800px;
    margin: 0 auto;
    }

#header {
        width: 100%;
        margin-top: 10px;
        height: 90px;
        }


#header_home {
    padding-right: 5%;
    height: 100%;
    background-image: url(../images/home.jpg);
    }

#header_unternehmen {
    padding-right: 5%;
    height: 100%;
    background-image: url(../images/ennos_fassade.jpg);
    }

#header_leistung {
    padding-right: 5%;
    height: 100%;
    background-image: url(../images/leiterplatte.jpg);
    }

#header_anwendungen {
    padding-right: 5%;
    height: 100%;
    background-image: url(../images/anwendungen.jpg);
    }

#header_impressum {
    padding-right: 5%;
    height: 100%;
    background-image: url(../images/impressum.jpg);
    }

#navi_top {
    width: 98%;
    padding-right: 2%;
    height: auto;
    }

#wrapper {
    clear: both;
    float: left;
    width: 100%;
    height: auto;
    }

#navigation{
    float: left;
    width: 17%;
	padding: 0px;
/*    height: auto;*/
    }

#textbereich {
	float: right;
	width: 79%;
	padding: 2%;
 /*   height: 100%;*/
    }

#footer {
	clear: both;
	width: 98%;
	height: auto;
    padding-right: 2%;
    }


/* Bildergalerien */

#galerie {
	width: 100%;
/*    float: left; */
    }

#galerie dl {
    width: auto;
    margin-top: 5px;
    padding: 0px;
    float: right;
    }

#galerie dd {
	font-size: 100%;
    margin-left: 0px;
    margin-right: 5px;
    }
#galerie dt {
	width: auto;
	float: right;
    }

#galerie dt img{
	margin-right: 5px;
    margin-left: 5px;
    padding: 4px;
    width: 100px;
    height: 75px;
    border: 1px solid #efefef;
    background-color: #fff;
    border-bottom: 1px solid #aaa;
    }

/* Vorstellung der Personen */

#galerie_personen {
	width: 100%;
    float: left;
    }

#galerie_personen dl {
    width: 48%;
    margin-top: 40px;
    padding: 0px;
    float: left;
    }

#galerie_personen dt img{
    margin-right: 10px;
    padding: 4px;
    width: 80px;
    height: 104px;
    border: 1px solid #efefef;
    background-color: #fff;
    border-bottom: 1px solid #aaa;

    }

#galerie_personen dd {
	font-size: 90%;
    margin: 0px;
	}

/* Ende Vorstellung der Personen */



#bild_gross img{
	margin: 0px;
    padding: 5px;
    border: 1px solid #efefef;
    background-color: #fff;
    border-bottom: 1px solid #aaa;
    }

#bild_logo img{
 	margin: 25px 6px 50px 9px;
    padding: 0px;
    border: 1px solid #efefef;
    background-color: #fff;
    border-bottom: 1px solid #aaa;
    }

#bild_flagge img{
	float: left;
    margin-left: 10px;
    width: 30px;
    height: 20px;
    background-color: #fff;
    border: 1px solid #AFAFAF;
    border-bottom: #aaa;
    }


/* Standardauflistungen */
#listen {
	width: auto;
    float: left;
    }

#listen dd {
	margin-left: 0;
    }
/****************************/
/* Typography, colors 		*/
/*							*/
/* verwendete Farben:		*/
/* #F1F2F2 	grau_10%_w 		*/
/* #CBD5DF  blau_25%_w 		*/
/* #97ACBF  blau_50%_w 		*/
/* #2E4C68	blau_75%_s		*/
/*							*/
/****************************/

body    {
    font-family: "Trebuchet MS", "Lucida Grande", "Verdana", "sans-serif";
    font-size: small;
    line-height: 1.35;
	background-color: #FFF;  /*weiss */
	}

#header {
    color: black;
    background-color: #036;  /* blauer hintergrund */
    border-top: 1px #2E4C68 solid;  /*blau_75%_s */
    text-align: right;
    }

#navi_top {
    color: black;
    background-color: #97ACBF;  /* blau_50%_w */
    border-top: 1px #2E4C68 solid;   /*blau_75%_s */
    border-bottom: 1px #2E4C68 solid;
    text-align: right;
    }

#wrapper {
	color: black;
 /*   background-color:  #CBD5DF; /* blau_25%_w */
    background-color: #F1F2F2; /*grau_10%_w */
    text-align: left;
    }


#navigation{
    color: black;
    background-color: #CBD5DF; /* blau_25%_w */
    padding-left: 0px;
    margin: 0px;
/*    text-align: left;*/
    }

#textbereich {
    color: black;
/*    background-color: #F1F2F2; /*grau_10%_w */
	}

#logobereich {
    color: black;
    background-color: #ccc; /* helles grau */
    padding-left: 25px;
    border: 10px;
    margin-top: 0;
    text-align: left;
    }

#footer {
    color: black;
    background-color: #97ACBF;  /* blau_50%_w */
    border-top: 1px #2E4C68 solid;   /*blau_75%_s */
    border-bottom: 1px #2E4C68 solid;
    text-align: right;
    }

table{
	font-size: 100%;
	line-height: 1.5;
	padding: 0;
    }

p 	{
    text-align: left;
    color: #440044;
    margin-bottom: 4px;
	}
h1  {
    font-size: 280%;
    letter-spacing: 5px;
    margin: 0;
    color: #8E2C71; /*lila_25%_b */
    } /* header h1*/
h2  {
    font-size: 160%;
    letter-spacing: 1px;
    margin-bottom: 15px;
    color: #2E4C68;
    }  /* header */
h3 	{
	font-size: 150%;
    font-style: normal;
	letter-spacing: 1px;
	margin-bottom: 10px;
    margin-top: 3px;
	color: #528C4A;
	}
h4  {
    font-size: 120%;
    letter-spacing: 1px;
    padding-left: 0px;
    margin-bottom: 2px;
    margin-top: 0px;
    color: #54515C;
    }
h5 	{
	font-size: 100%;
	letter-spacing: 0px;
    margin-top: 5px;
    margin-bottom: 0px;
	color: black;
	}
h6 	{
	font-size: 75%;
    margin-top: 1px;
    margin-bottom: 1px;
	color: #2F2F2F;
	}  /* footer */

ul	{
	color: #000000;
    font-size: 100%;
    text-decoration: none;
    text-indent: 0px;
    list-style-type: square;
    list-style-position: inside;
    }

/******************************/
/*  Festlegung der Farben     */
/******************************/
/*
blau: #003366
lila: #990099
gruen: #339933
lilagrau: #666699
*/
/*************************/
/* Navigationsgestaltung */
/*************************/

#navi_horrizontal li, #navi_horrizontal li ul li
  	{display: inline;}

#navi_horrizontal
	{
    	list-style-type: none;
    	width: 100%;
    	overflow: hidden;
		margin: 0;
		list-style-type: none;
  	}

#navi_horrizontal a
	{
    	text-decoration: none;
    	display: inline;
        background-color: #CBD5DF; /* blau_25%_w */
    	width: auto;
    	padding: 3px 10px 3px 10px;
        color: #000;
    }


  	#navi_horrizontal li a:hover,
  	 { background-color:#8E2C71; color: #fff; }

    #navi_horrizontal li#h_active
    {
        font-weight: bold;
        font-size: 100%;
        color: #c3c;
	}



  	#navi li, #navi li ul li
  	{display: inline;}

  	#navi
  	{
    	list-style-type: none;
    	width: 100%;
    	overflow: hidden;
		margin: 0;
		list-style-type: none;
  	}

  	#navi li,ul {
  		list-style-type: none;
    	margin: 0;
    	padding: 0;
    }

	#navi a {
    	text-decoration: none;
    	display: block;
    	width: auto;
    	padding: 4px 0px 4px 0px;

  	}

	#navi li a {
        background-color:#CBD5DF; /* blau_25%_w */
        color: #333;
        padding: 4px 0px 4px 10px;
        border-bottom: 1px #64839F solid;
    }

    #navi li ul li a {
        background-color: #CBD5DF; /* blau_25%_w */
        color: #555;
        font-size: 90%;
    	padding: 2px 0px 2px 20px;
        border-top: 2px #64839F solid;
        }

/* aktive links */

    #navi li ul li#active,
    #navi li#active
    {
        font-weight: bold;
        font-size: 105%;
        color: #c3c;
	}

  	#navi li a:hover,
    #navi li ul li a:hover
  	 { background-color:#8E2C71; color: #fff; }