/**
 *
 * css:         greentext.css
 * version:     1.0
 * author:      Veronika Schubin
 * email:       veronika_schubin@web.de
 * website:     www.picturefriend.com
 * 
 * desc:        
 * Das CSS setzt verschiedenste Elemente zurück in den eigentlichen Ursprungszustand.
 * Zur besseren Gestaltung werden alle bestehenden Abstände der verschiedenen Browser ausser Kraft gesetzt.
 * Natürlich können auch noch weitere hinzukommen, allerdings sind diese für das Boxmodell am wichtigsten.
 * Die Erweiterung der kompletten Elemente wurden momentan von Eric Meyer übernommen, da diese ein
 * breiteres Spektrum abdecken. http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
 */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100.01%;
    font-family: inherit;
    vertical-align: baseline;
}

sub, 
sup {
	line-height: 0px;
	font-size: 85%;
}

/* remember to define focus styles! */
:focus { outline: 0; }

body {
    line-height: 1;
    color: black;
    background: white;
}

ol, ul {
    list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
}

caption, th, td {
    text-align: left;
    font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
}

blockquote, q {
    quotes: "" "";
}

/* --------------------------------------*/
/* ---- Allgemein <<<-----------*/
/* --------------------------------------*/


body {
    background: #fff;
	color: #6f6d6e;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	line-height: 21px;
	margin: 0;
	padding: 0;
}
a:link,
a:visited,
a:active,
a:hover,
a:focus {
	color:#6f6d6e;
}
p {
    margin: 10px 0;
}

em, i {
	font-style: italic;
}

strong {
    font-weight: 700;
}

input,
textarea {
    border: 1px solid #c8cccc;
    padding: 2px 5px;
}

.clear {
    clear: both;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
}
/** 
	* Schmuckbilder
	* Definieren seitenspezifische ID's	
*/

#icons {
	position: absolute;
	z-index: 0;
}
#homeCat #icons {
	top: 280px;
	left: 57px;
	width: 125px;
	height: 391px;
	background: url(../_graphics/icons_home.png) top center no-repeat;
}
#themesCat #icons {
	top: 84px;
	left: 748px;
	width: 180px;
	height: 126px;
	background: url(../_graphics/icons_themes.png) top center no-repeat;
}
#servicesCat #icons {
	top: 628px;
	left: 94px;
	width: 156px;
	height: 160px;
	background: url(../_graphics/icons_services.png) top center no-repeat;
}
#referencesCat #icons {
	top: 415px;
	left: 100px;
	width: 162px;
	height: 223px;
	background: url(../_graphics/icons_references.png) top center no-repeat;
}
#aboutCat #icons {
	top: 91px;
	left: 787px;
	width: 84px;
	height: 82px;
	background: url(../_graphics/icons_about.png) top center no-repeat;
}
#contactCat #icons {
	top: 155px;
	left: 745px;
	width: 81px;
	height: 81px;
	background: url(../_graphics/icons_contact.png) top center no-repeat;
}


/**
 * Body Wrapper (970px)
 * Der Wrapper hält die Seite zusammen und positioniert die Inhalte im Browserfenster zentriert.
 */
#bodyWrapper {
    margin: 0 auto;
    width: 970px;
	position: relative;
}


/**
 * Wrapper (970px)
 * Der Wrapper hält den gesamten Contentbereich und den Related Content zusammen.
 */
#wrapper {
    clear:left;
    margin:10px 0 0 0;
}

* html #wrapper {
    height:1%;
}
#header {
	height: 180px;
}
#logo {
	float: left;
	width: 230px;
}
/**
 * Content (700px)
 * Definiert den Hauptinhalt innerhalb des #wrapper div´s.
 */
#content {
    display: inline;
    float: right;
    min-height: 100px;
    width: 700px;
	margin: 3px 0 0 0;
}

/**
 * Related Content
 * Definiert die Inhalte der linken Spalte.
 */
#relatedContent {
    display: inline;
    float: left;
    margin: 0 0 80px 20px;
    width: 230px;
	font-size: 26px;
	line-height: 26px;
}
#relatedContent p a {
	text-decoration: none;
	padding: 3px 0;
	margin: 0;
	display: block;
}
#relatedContent p a .cufon {
	margin: -3px 0;
}
#relatedContent p a:hover {
	background-color: #e2e2e2;
}

/**
 * Footer
 * Setzt die Fußzeile mit Copyright.
 */
#footer {
	position: relative;
	height: 100px;
	padding: 100px 0 0 0;
}
/* Farben */
.c1,
.c1 a {
	color: #86a87e;
}
.c2,
.c2 a {
	color: #596c3e;
}
.c3,
.c3 a {
	color: #7abc18;
}
.c4,
.c4 a {
	color: #008a3d;
}
.c5,
.c5 a {
	color: #006153;
}
.c6,
.c6 a {
	color: #66a653;
}
.c7,
.c7 a {
	color: #006225;
}
.c8,
.c8 a {
	color: #48651c;
}
.c9,
.c9 a {
	color: #8a9463;
}
.c10,
.c10 a {
	color: #86a87e;
}
.c11,
.c11 a {
	color: #236154;
}

/**
 * Hauptnavigation
 */
#mainNav {
  width: 700px;
  float: right;
  padding: 108px 0 0 0;
}
ul#nav {
	margin: 0;
	height: 30px;
	list-style-type: none;
	position: relative;
}
ul#nav li a {
	position: absolute;
	top: 0;
	text-decoration: none;
	padding: 30px 0 0 0;
	overflow: hidden;
	height: 0px !important;
	height /**/:30px; /* IE5/Win */
	background: url(../_graphics/navi.png) no-repeat;
}
ul#nav li#services a {
	background-position: -79px 0px;
	left: 0px;
	width: 105px;
}
ul#nav li#services a:hover,
ul#nav li#services.selected a {
	background-position: -778px 0px;
}
ul#nav li#themes a {
	background-position: 0 0;
	left: 105px;
	width: 79px;
}
ul#nav li#themes a:hover,
ul#nav li#themes.selected a {
	background-position: -699px 0px;
}
ul#nav li#references a {
	background-position: -184px 0px;
	left: 184px;
	width: 105px;
}
ul#nav li#references a:hover,
ul#nav li#references.selected a {
	background-position: -883px 0px;
}
ul#nav li#aboutUs a {
	background-position: -288px 0px;
	left: 288px;
	width: 86px;
}
ul#nav li#aboutUs a:hover,
ul#nav li#aboutUs.selected a {
	background-position: -987px 0px;
}

ul#nav li#contact a {
	background-position: -373px 0px;
	left: 373px;
	width: 287px;
}
ul#nav li#contact a:hover,
ul#nav li#contact.selected a {
	background-position: -1072px 0px;
}

/* Bereiche des Inhaltes */
#content .cufon {
	margin: 2px 0;
}
/* Home */
#homeCat #content {
	width: 705px;
	margin-left: 10px;
}
#homeCat #content p,
#referencesCat #content p {
	font-size: 31px;
	line-height: 33px;
}
/* Referenzen */
#referencesCat #content a {
	text-decoration: none;
}
#referencesCat #relatedContent {
	margin: 18px 0 0 26px;
}
#referencesCat #relatedContent a {
	font-size: 12px;
	margin: 0;
	padding: 0;
	text-decoration: none;
}
#referencesCat #relatedContent a .cufon {
	margin: 0 0 3px 0;
}
/* Themen */
#themesCat #content p {
	margin: 10px 0 0 0;
}
#themesCat #content span {
	font-style: italic;
	font-size: 12px;
	line-height: 16px;
	margin: 5px 0 15px 2px;
	display: block;
}
.themesHover {
	background-color: #e2e2e2;
}
/* Über uns */
#aboutCat #content {
    float: none;
    width: auto;
}
#aboutCat h1 {
	font-size: 26px;
	margin: 0;
}
#aboutCat h1.more {
	margin: 10px 0 0 0;
}
#aboutCat p,
#aboutCat h3 .cufon {
	margin: 0;
}
#aboutCat p {
	width: 560px;
	float: left;
	margin: 25px 0 30px 0;
}
#aboutCat h3 .cufon {
	margin: -25px 0 0 0;
}
#aboutCat .aboutImg {
	display: inline;
    float: left;
    margin: 30px 0 20px 20px;
    width: 230px;
}
#aboutCat .aboutImgMore {
    display: inline;
    float: left;
    margin: 35px 0 20px 20px;
    width: 230px;
}
#aboutCat #content span {
	font-style: italic;
}
/* Impressum */
#imprint {
	display:none;
	height:320px;
	width:285px;
	position: absolute;
	left: 58px;
	top: -230px;
	border: 1px solid #b7b7b7;
	z-index: 20;
}
/* Leistungen */
#servicesCat #content span {
	padding: 3px 0;
}
.servicesHover {
	background-color: #e2e2e2;
}
/* Kontakt */
#contactCat h1 {
	font-size: 31px;
	margin: 0;
}
#contactCat p {
	margin: 0 0 10px 0;
}