/*
CSS intro
http://www.w3.org/Style/CSS/
http://www.w3.org/MarkUp/Guide/Style
http://www.w3schools.com/css/
*/

body { margin-left: 10px; margin-right: 10px; 
       margin-top: 20px; margin-bottom: 10px;
       font-family: sans-serif; font-size: 10pt;
}

.center { text-align: center;
	  color: #004 }

.verticalFill { height: 10%; }

.border { border: 5px; border-style: solid; border-color: #000; }
.borderPink { border: 5px; border-style: solid; border-color: #f0d7db; }

.centerList { list-style: none; text-align: center; }

/* text drops a nice shadow */
.shadowtitle1 { position: relative; left: 1px; top: 1px; color: #666; 
	font-family: 'Utopia', serif;
        font-weight: bold; font-size: 20pt;
	padding: 10px;}
.shadowtitle2 { position: absolute; left: -1px; top: -1px; color: #000;
	font-family: 'Utopia', serif;
        font-weight: bold; font-size: 20pt;
	padding: 10px;} 
.shadowtext1 { position: relative; left: 1px; top: 1px; color: #666; }
.shadowtext2 { position: absolute; left: -1px; top: -1px; color: #000; } 

/* another way for a shadow *?
.glow { 
    background: white; 
    color: white;
    text-shadow: black 0px 0px 5px;
}

/* create inset main window */
.insetFrame {
border-width: 2px;
border-style: solid;
border-color: black white white #888;
}

/* Tabs with rounded corners see
http://www.din.or.jp/~hagi3/JavaScript/JSTips/Mozilla/Samples/MozBorderRadius.htm 
*/

#tab {background: white; padding: 0px 10px 0px 10px; margin: -3;
  list-style: none; font: bold 0.8em Verdana, sans-serif;}
#tab li {display: inline; padding: 2px 0; background: white;}
#tab li a {padding: 2px 10px 5px 10px; text-decoration: none;
	background: #eef;
	border: 2px outset grey; border-bottom-color: #FFF;
  	border-bottom-width: 0;
  	-moz-border-radius: 10px 10px 0px 0px;}
#tab li a:link {color: black;}
#tab li a:visited {color: #111;}
#tab li a:hover{background-color:#ddf; }

/* rounded corners for div and other elements */

#button { padding: 5px 10px 5px; margin: 0;
  list-style: none; font: bold 0.8em Verdana, sans-serif;}
#button li {text-align: center; padding: 7px 0; background: #fabc2d;}
#button li a {padding: 2px 10px 1px; text-decoration: none;
  background: #fabc2d; width: 100%;
  border: 2px outset yellow; border-bottom-color: #FFF; }
#button li a:link {color: black;}
#button li a:visited {color: #111;}
#button li a:hover{background-color:#d8a027; }

/* predefined images */
.titleImg { background: url("images/Sonnenblumen_Gradient.jpg"); }
.babyImg { background-image: url("images/BabyBG.jpg"); }
.leftGradient { background-image: url("images/LeftShade.png"); }
.rightGradient { background-image: url("images/RightShade.png"); }

TD { font: 0.8em Verdana, sans-serif; font-size: 50%; text-align: center; }

h1,h2,h3,h4,h5,p,ul { font-family: sans-serif; }
h2 { background-color: #88f; color: white;}
hr { background-color: #eef; color: #eef; border: 0px; height: 1px;
	margin: 0px 0px 0px 0px;  padding: 0px 0px 0px 0px;  }

.warn { background-color: red; color: white };