/* basic stuff */



body {
	font-family: Calibri, Helvetica, sans-serif ;
        font-size: 0.65em/1.3em;
        font-style: normal;
	font-weight: normal;
	font-variant: normal;
	background: #f5f5f5;
	color: #000;
	text-align: left;
	padding: 0;
	margin: 0;
	height: 100%;
}

h1 {
        border-bottom: #000 1px solid;
}

html > body h1 {
        /* redefinition of the border to dotted,
        hidden from IE - because the dashed line
        that IE uses instead of dots looks a bit
        too crude in my opinion */
        border-bottom: #000 1px dotted;
}


#wmlogo { width:50px;display:none; }

/* main elements - lists */
#body ul {
padding-left: 40px;
}
	
#body li {
padding-bottom: 10px;
padding-left: 10px;
}

/* main elements - tables */
#body table {
border: 1px solid #4C4C4C;
margin-left:10px;
margin-right:10px;
}

#body td,
#body th {
padding: 10px 10px 10px 10px;
vertical-align: top;
border:none;
}	


a, a:link { color: #516A94; background: transparent; text-decoration: none; }
a:visited { color: #516A94; background: transparent }
a:hover { color: #8597B6; background: transparent }
a:active { color: #8597B6; background: transparent }

/* container */

#container {
	position: relative;
	padding: 0px 5px 5px 5px;
	margin: 5px;
	text-align: left;
	background: white;
	border: #000 1px solid;
	color: inherit;
}

/* and now the specific divs */

/* header */							
#header {
position:relative;
background-repeat: repeat-x; 
background-image: url('/media/grad-iphone.png');
padding: 0px;
margin:0px;
margin-top:10px;
height:150px;
width: 100%;
vertical-align: top;
//top: -1.0em;
}

#header p {
font-family : Calibri, Helvetica, sans-serif;
font-size: 1.2em;
font-weight: bold;
text-align: center;
padding:30px;
}


a.bannerimage {
text-decoration:none;
}

#topnavigation {
//	position: relative;
        list-style: none;
//	padding: 5px 5px 5px 5px;
	margin-left, margin-right: 10px;
//	text-align: center;
//        left: -1.0em;
//	top: -1.0em;
        display:none;
}

#topnavigation ul {
    list-style: none;
    margin: 10px;
    padding: 0;
}
/* there seems to be an issue in Opera with the hover on the lselect...
any clues to a solution would be appreciated ;) */

#topnavigation ul li:hover  {
	background: #516A94;
	color: #fff;
        list-style: none;
}

#topnavigation ul li:hover a {
	background: inherit;
	color: #eee;
        list-style: none;
}

#topnavigation ul a:hover {
	/* this style is there to make up for IE's inability to apply
	:hover pseudo to an li. of course, it won't look the same as having the whole
	li turn red, but it should be an acceptable compromise */
	background: #516A94;
	color: #eee;
        list-style: none;
}

#topnavigation ul li:hover ul li a {
	background: inherit;
	color: #516A94;
        list-style: none;
}

#topnavigation ul li:hover ul li:hover  {
	background: #8597B6;
	color: #fff;
        list-style: none;
}

#topnavigation ul li:hover ul li:hover a {
	background: inherit;
	color: #eee;
        list-style: none;
}

#topnavigation ul li:hover ul a:hover {
	/* this style is there to make up for IE's inability to apply
	:hover pseudo to an li. of course, it won't look the same as having the whole
	li turn red, but it should be an acceptable compromise */
	background: #516A94;
	color: #eee;
        list-style: none;
}


#body {
	position: relative;
	padding: 5px 5px 5px 5px;
	margin-left, margin-right: 10px;
	text-align: left;
	
	
}

#body-index {
        font: 0.7em/1.35em Calibri, Helvetica, sans-serif ;
                font-style: normal;
                font-weight: lighter;
	position: relative;
	padding: 5px 5px 5px 5px;
	margin-left, margin-right: 10px;
	text-align: left;
	min-height: 500px;
//	background-image: url(../wesmem.jpg);
	background-repeat: no-repeat;
	background-position: center;

}


div#body a {
	text-decoration: none;
	font-weight: bold;
}



#imprint {
position: relative;
clear: both;
	margin: 0;
	padding: 5px;
	border: 1px #000 dotted;
	background: #fff;
	color: inherit;
	text-align: center;
}





/* homepage only - boxes  */	

/**************** menu coding *****************/
#menubox a, #menu h2, #menubox h1 {
        list-style: none;
margin: 0;
padding: 2px 3px;
}

#body h1 {
  text-align: center;
}

#menubox li, #menubox h1 {
    list-style: none;
//position: relative;
//white-space:nowrap;
//width:5em;
//padding: .2em 1em;
//display:inline;
    background-color: #FFFFFF;
    border: 1px solid #999999;
    color: #222222;
    display: block;
    font-size: 17px;
    font-weight: bold;
    margin-bottom: -1px;
    padding: 12px 10px;
    text-decoration: none;
}

#menubox li:first-child a {
    -webkit-border-top-left-radius: 8px;
    -webkit-border-top-right-radius: 8px;
}
#menubox li:last-child a {
    -webkit-border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
}

#menubox ul ul {
        list-style: none;
position: relative;
white-space:nowrap;
top: 0;
left: 100%;
//top: 1.6em;
//left: -0.5em;
z-index:500;
display:inline;
}

div#menubox ul ul,
div#menubox ul li:hover ul ul
{display: none;}

div#menubox ul li:hover ul,
div#menubox ul ul li:hover ul
{
padding: 0em 0em;
background-color: #ffffff;
display: inline;
marker-offset: 0;
        list-style: none;
}



#menubox {
//	position: relative;
        list-style: none;
//	padding: 5px 5px 5px 5px;
	margin-left, margin-right: 10px;
//	text-align: center;
//        left: -1.0em;
//	top: -1.0em;
        display:none;
}
#menubox ul {
    list-style: none;
    margin: 10px;
    padding: 0;
}
/* there seems to be an issue in Opera with the hover on the lselect...
any clues to a solution would be appreciated ;) */

#menubox ul li:hover  {
	background: #516A94;
	color: #fff;
        list-style: none;
}

#menubox ul li:hover a {
	background: inherit;
	color: #eee;
        list-style: none;
}

#menubox ul a:hover {
	/* this style is there to make up for IE's inability to apply
	:hover pseudo to an li. of course, it won't look the same as having the whole
	li turn red, but it should be an acceptable compromise */
	background: #516A94;
	color: #eee;
        list-style: none;
}

#menubox ul li:hover ul li a {
	background: inherit;
	color: #516A94;
        list-style: none;
}

#menubox ul li:hover ul li:hover  {
	background: #8597B6;
	color: #fff;
        list-style: none;
}

#menubox ul li:hover ul li:hover a {
	background: inherit;
	color: #eee;
        list-style: none;
}

#menubox ul li:hover ul a:hover {
	/* this style is there to make up for IE's inability to apply
	:hover pseudo to an li. of course, it won't look the same as having the whole
	li turn red, but it should be an acceptable compromise */
	background: #516A94;
	color: #eee;
        list-style: none;
}



#box1{	
        position: relative;
        background-repeat: repeat-x; 
        background-image: url('../gradient.png');
        width:250px;	
	float:left;
	margin-left:10px;
	margin-top:10px;
	padding: 5px;
	min-height: 200px;
        font: 0.7em/1.35em Calibri, Helvetica, sans-serif ;
                font-style: normal;
                font-weight: lighter;

	}

#directionsbox{	
display:none;
position: relative;
background-repeat: repeat-x; 
background-image: url('../gradient.png');
width:250px;
	float:left;
	margin-right:10px;
	margin-top:10px;
	padding: 5px;
	min-height: 200px;
        font: 0.7em/1.35em Calibri, Helvetica, sans-serif ;
                font-style: normal;
                font-weight: lighter;

	}


#box2{	
position: relative;
background-repeat: repeat-x; 
background-image: url('../gradient.png');
width:250px;
	float:left;
	margin-right:10px;
	margin-top:10px;
	padding: 5px;
	min-height: 200px;
        font: 0.7em/1.35em Calibri, Helvetica, sans-serif ;
                font-style: normal;
                font-weight: lighter;

	}


#box3{	
position: relative;
background-repeat: repeat-x; 
background-image: url('../gradient.png');
width:250px;
clear: both;
	float:left;
	margin-left:10px;
	margin-top:10px;
	padding: 5px;
	min-height: 200px;
        font: 0.7em/1.35em Calibri, Helvetica, sans-serif ;
                font-style: normal;
                font-weight: lighter;

	}


#box4{	
background-repeat: repeat-x; 
background-image: url('../gradient.png');
width:250px;
	float:left;
	margin-right:10px;
	margin-top:10px;
	padding: 5px;
	min-height: 200px;
        font: 0.7em/1.35em Calibri, Helvetica, sans-serif ;
                font-style: normal;
                font-weight: lighter;

	}






/**************** menu coding *****************/
#topnavigation a, #menu h2 {
        list-style: none;
margin: 0;
padding: 2px 3px;
}



#topnavigation li {
    list-style: none;
//position: relative;
//white-space:nowrap;
//width:5em;
//padding: .2em 1em;
//display:inline;
    background-color: #FFFFFF;
    border: 1px solid #999999;
    color: #222222;
    display: block;
    font-size: 17px;
    font-weight: bold;
    margin-bottom: -1px;
    padding: 12px 10px;
    text-decoration: none;
}

#topnavigation li:first-child a {
    -webkit-border-top-left-radius: 8px;
    -webkit-border-top-right-radius: 8px;
}
#topnavigation li:last-child a {
    -webkit-border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
}

#topnavigation ul ul {
        list-style: none;
position: relative;
white-space:nowrap;
top: 0;
left: 100%;
//top: 1.6em;
//left: -0.5em;
z-index:500;
display:inline;
}

div#topnavigation ul ul,
div#topnavigation ul li:hover ul ul
{display: none;}

div#topnavigation ul li:hover ul,
div#topnavigation ul ul li:hover ul
{
padding: 0em 0em;
background-color: #ffffff;
display: inline;
marker-offset: 0;
        list-style: none;
}


#header div.leftButton {
    position: absolute;
    top: 112px;
    left: 6px;
    height: 30px;
    font-weight: bold;
    text-align: center;
    color: white;
    text-shadow: rgba(0,0,0,0.6) 0px -1px 0px;
    line-height: 28px;
    border-width: 0 8px 0 8px;
    -webkit-border-image: url(/mobile/button.png) 0 8 0 8;
}

#header div.leftButton2 {
    position: absolute;
    top: 112px;
    right: 6px;
    height: 30px;
    font-weight: bold;
    text-align: center;
    color: white;
    text-shadow: rgba(0,0,0,0.6) 0px -1px 0px;
    line-height: 28px;
    border-width: 0 8px 0 8px;
    -webkit-border-image: url(/mobile/button.png) 0 8 0 8;
}


