/* Start of CMSMS style sheet 'chao-media main css' */
/*****************
browsers interpret margin and padding a little differently, 
we'll remove all deult padding and margins and
set them later on
******************/
* {
margin:0;
padding:0;
}

/*****************
set display: none for div
******************/
.accessibility,
div.breadcrumbs,
div#news,
{
   display: none !important;
}

div #pagewrapper {

}

/*****************
Set initial font styles
******************/
body {
   text-align: left;
   font-family:  Arial, Verdana, Helvetica, sans-serif;
   font-size: 80.01%;
   line-height: 1.4em;
   background-color: #fff;
}

/******************
set font size for all divs,
this overrides some body rules
******************/
div {
   font-size: 1em;
}

/******************
if img is inside "a" it would have 
borders, we don't want that
******************/
img {
   border: 0;
}

/******************
default link styles
set all links to have underline and bluish color 
******************/
a, a:link, a:active, .chaogreen {
   text-decoration: none;
/* css validation will give a warning if color is set without background color. this will explicitly tell this element to inherit bg colour from parent element */
   background-color: inherit; 
   color: #060; 
}

a:visited {
   text-decoration: none;
   background-color: inherit;
   color: #060;                /* a different color can be used for visited links */
}

/* remove underline on hover and change color */
a:hover {
   text-decoration: underline;
/* background-color: #C3D4DF;*/
   color: #649D8A;
}

/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
   height: 1px;
   margin: 1em;
   border-bottom: 1px dotted black;
}

/* relational links under content */
div.left49 {
  float: left;
  width: 47%;  /* 50% for both left and right might lead to rounding error on some browser */
  margin: 0.5em;
}

div.right49 {
  float: right;
  width: 47%;
  text-align: right;
  margin: 0.5em;
}

/********************
GLOBAL STYLING
*********************/
div#pagewrapper{
   margin: 0 auto;     /* this centers wrapper */
   max-width: 90%; /* IE wont understand these, so we will use javascript magick */
   min-width: 65em;
   background-color: transparent;
   color: black;
}

/*** form ***/

.formtexteinzeilig {
	font-size: 10px;
	color: #1A3553;
	background-color: #F6F6F6;
	height: 16px;
	width: 120px;
	border: 1px solid gray;
}

.formtextmehrzeilig {
	font-size: 10px;
	color: #1A3553;
	background-color: #F6F6F6;
	height: 100px;
	width: 400px;
	border: 1px solid gray;
}
.formbutton {
	font-size: 14px;
	color: #000;
	background-color: #C3D9FF;
	height: 22px;
	width: 120px;
	border: 1px solid;
}

/*** header ***/

div#header {
  width: 100%;
  height: 5em;
}

div#header_text {
  float: left;
  margin-top:3em;
  width: 59%;
}

div#header h1 {
  font-size: 1.2em;
  line-height: 1.4em; 
  color: #C3D9FF;
  padding-bottom: 0.5em;
}

div#header_menu {
  float: right;
  text-align:right;
  width: 30%;
  padding-left: 0;
  margin-left: 1em;
}

#header_menu ul{
  float: left;
  width: 45%;
}

#header_menu li{
   list-style: none;
   margin: 0;
   display: inline;
}

#header_menu li a{
   text-decoration:none; /* no underline for links */
}

div#print {
  float: right;
  width: 3em;
  text-align:center;
}

div#search {
  float: right;
}

.search {
  margin: 0 auto;
  list-style-type: none;
}

/*** menu ***/

div#menu {
  width: 25%;
  border-left: solid 1em #C3D9FF;
  float: left;
  margin-right: 1em;
  margin-bottom: 1em;
}

div#menu_pic {
  height: 14em;  /** !padding! **/
  border: solid 1em #fff; /** !background color! **/
  border-right: 0em;
  background: #fff url(images/chao_media.gif) no-repeat 0 0;
}

div#menu a {
  padding-left: 0.5em;
}

div#menu a.activeparent {
  font-weight:bold;
}

div#menu ul {
  list-style-type: none;
  line-height: 2em;
  background-color: #e8eae7;
  border-left: solid 1em #C3D9FF;
  border-right: solid 1em #C3D9FF;
}

div#menu ul li{
  border-top: solid 0.1em #C3D9FF;
  background-color: #D3E0E5;
  padding-top: 0.2;
  padding-bottom: 0.2;
}

div#menu ul  ul {
  border: none;
  padding: none;
  padding-left: 1em;
}

div#menu ul li ul li{
  border-top: none;
  background-color: transparent;
}


div#menu ul li ul li ul li{
  background-color: #f7f6f1;
}

div#menu ul  ul {
  padding-left:1.5em;
}

.currentpage h3 {
  color: #8a8687;
  font-size: 1em;
  padding-left:0.5em;
}

/*** content ***/

div#content {
  position: relativ;
  float: left;
  width: 100%;
  border-top: solid 1em #C3D9FF;
  border-bottom: solid .5em #C3D9FF;
  height: auto;
}

div#content_primary {
   width: 70%;
   max-width: 70%; /* IE wont understand these, so we will use javascript magick */
   min-width: 70em;
   float: left;
  }

div#content_primary_pic {
  width: 69%;
  float: left;
  height: 20em;  /** !padding! **/
  color:#fff;
  text-align: right;

  vertical-align: baseline;
  font-size: 1em;
  magrin:0em;
  padding:0em;

  border-top: solid 1em #fff; /** !background color! **/
  border-bottom: solid 3em #fff; /** !background color! **/
  background: #fff url(images/chao_media.jpg) no-repeat 0 0;
}


div#content_primary_pic h2{
  padding-right: 1em;
  padding-top: 5em;
  font-size: 3em;

}

div#content_primary_text {
  padding-bottom:2em;
  text-align: justify;
  margin-left: 28%;
}

div#content_primary_text p p{
  margin: 2em;
  margin-right: 0em;
}

#content_primary_text ul {
  list-style-type: none;
  line-height: 2em;
  margin-top:2em;
  padding-left:2em;
}

#content_primary_text ul ul{
  padding-left:4em;
}

table{
  width:99%;
}

#content_primary table{
  width:69%;
}


td{
  margin-bottom:1em;
  padding:0.5em;
}

/*** beginn content 2-4 ***/

div#content_2, div#content_3, div#content_4 {
  padding: 1em;
  margin: 1em;
  float: right;
  border: dashed 0.1em #C3D9FF; 
}

div#content_2, div#content_3 {
  width:14em; 
}

div#content_2 img, div#content_3 img, div#content_4 img {
  border: solid 0em #fff; 
}

div#content_2 ul, div#content_3 ul, div#content_4 ul {
  list-style-type: none;
  padding-left:1em;
}

div#content_2 ol, div#content_3 ol, div#content_4 ol {
  padding-left:1.2em;
}

div#content_2 {

}

div#content_3 {

}

div#content_4 {

}

/*** end content 2-4 ***/

/*** footer ***/

div#footer {
  width: 100%;
  height: 5em;
  float: right;
  border-bottom: solid .5em #C3D9FF;
  background-color: #E0ECFF;
}

/********************
PICTURE STYLING
*********************/

div#content_primary_pic.int_kontakt {
  background: #fff url(images/kontakt.jpg) no-repeat 0 0;
}

div#content_primary_pic.gastebuch{
  background: #fff url(images/gaestebuch.jpg) no-repeat 50px 0px;
}
div#content_primary_pic.webspace{
  background: #fff url(images/webspace.jpg) no-repeat 0px 20px;
}

div#menu_pic.int_kontakt{
  background: #fff url(images/kontakt.jpg) no-repeat 0 0;
}

div#content_primary_pic.neumann{
  background: #fff url(images/neumann.jpg) no-repeat 0 0;
}

div#content_primary_pic.kaufberatung{
  background: #fff url(images/hand.jpg) no-repeat 0 0;
} 

div#content_primary_pic.support{
  background: #fff url(images/pille.jpg) no-repeat 0 0;
}

div#content_primary_pic.angebot{
  background: #fff url(images/lampe.jpg) no-repeat 0 0;
}

div#content_primary_pic.datenwachschutz{
  background: #fff url(images/spritze.jpg) no-repeat 0 0;
}

div#content_primary_pic.heise-security{
  background: #fff url(images/spritze.jpg) no-repeat 0 0;
}

div#content_primary_pic.chao-media-news{
  background: #fff url(images/kartoffel.jpg) no-repeat 0 0;
}

div#content_primary_pic.heise-news{
  background: #fff url(images/stuhl.jpg) no-repeat 0 0;
}

div#content_primary_pic.medien{
  background: #fff url(images/moesel.jpg) no-repeat 0 0;
}

div#content_primary_pic.softwareentwicklung{
  background: #fff url(images/baum.jpg) no-repeat 0 0;
}


/********************
CONTENT STYLING
*********************/
/* End of 'chao-media main css' */