/* Track Your Kid 2010 - Stylesheet */
/* body { color: #222222;} */

#ui-application { width: 1000px;}

#ui-header { width: 100%;  height: 100px; font-size: 24px; color: white; background-color: #AAAAAA; }

#ui-navigationbar { width: 140px; padding: 5px;background-color: #AAAAAA; font-size: 16px; color: white; float:left; }

#ui-content { width: 765px; float: left;}

.ui-content-block  {margin: 5px 0 0 5px;}
.ui-content-block-headline { margin: 3px; font-size: 18px; height: 40px; }
.ui-content-block-headline div { height: 32px; float:left; padding-top: 8px;}
.ui-content-block-headline span { height: 32px; width: 32px; display: block; float: left; margin: 4px 10px 4px 4px;}

/* Aufteilungsvarianten im Content */
.ui-content-block-content {clear: both; margin: 3px; display: block;}

/* 2-Spaltig */
.ui-content-block-content-column-dual-1 { width: 350px; float: left; margin: 3px;}
.ui-content-block-content-column-dual-2 { width: 390px; float: right; margin: 3px;}
.ui-content-block-content-column-dual-2-1 { width: 245px; float:left; padding-left: 15px;}
.ui-content-block-content-column-dual-2-2{ width: 120px; float:right}

/* 3-Spaltig */
.ui-content-block-content-column-triple-1 {width: 280px; float: left; margin: 3px;}
.ui-content-block-content-column-triple-2 {width: 280px; float: left; margin: 3px; text-align: center;}
.ui-content-block-content-column-triple-3 {width: 280px; float: right; margin: 3px;}

/* Liste aller Verfügbaren Logos. Für jedes Logo eigene Klasse.
 * Pfadangaben sind alle relativ zur CSS-Datei. */
.ui-content-block-headline-icon-8301 {background-image: url("img/icon/icon-8301.png"); background-repeat: no-repeat; }
.ui-content-block-headline-icon-8302 {background-image: url("img/icon/icon-8302.png"); background-repeat: no-repeat; }
.ui-content-block-headline-icon-8303 {background-image: url("img/icon/icon-8303.png"); background-repeat: no-repeat; }
.ui-content-block-headline-icon-8304 {background-image: url("img/icon/icon-8304.png"); background-repeat: no-repeat; }
.ui-content-block-headline-icon-8305 {background-image: url("img/icon/icon-8305.png"); background-repeat: no-repeat; }
.ui-content-block-headline-icon-8306 {background-image: url("img/icon/icon-8306.png"); background-repeat: no-repeat; }
.ui-content-block-headline-icon-8307 {background-image: url("img/icon/icon-8307.png"); background-repeat: no-repeat; }
.ui-content-block-headline-icon-8308 {background-image: url("img/icon/icon-8308.png"); background-repeat: no-repeat; }

.ui-content-block-buttonbar { height: 44px; margin-top: 30px;}
.ui-content-block-buttonbar-button-login {cursor: pointer; background-image: url("img/btn_signup.PNG"); background-repeat: no-repeat; background-position: -22px; height: 39px; width: 158px; float: left; margin-right: 20px;}
.ui-content-block-buttonbar-button-demo{cursor: pointer; background-image: url("img/btn_test.PNG"); background-repeat: no-repeat;  background-position: -16px; height: 39px; width: 158px;float: left;}


/* Styles zur Positionierung */
.ui-helper-float-left { float: left; }
.ui-helper-float-right { float: right; }

/* Zentrierter Einzug */
.ui-helper-margin-center { margin: 0 auto;}