/* framework.css */

/* ==================================================================== */
/* ========================= Work in Progress ========================= */
/* ==================================================================== */
div.wip1 {
	background-color:#CC99FF;
}
div.wip2 {
	background-color:#66FF99;
}
div.wip3 {
	background-color:#FF99FF;
}

/* =========================================================== */
/* ========================= General ========================= */
/* =========================================================== */
html,
body {
	margin:0px;
	padding:0px;
}
body {
	background:#FFF;
	color:#000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:16px;
}

img { border:0px; }

h1, h2, h3 ,h4 {
	font-family:Arial, Helvetica, sans-serif;
	margin:0px;
	padding:0px;
	font-weight:normal;
}
h4 { color:#F00; }

a:link,
a:visited {
	color:#000;
	text-decoration:underline;
}
a:hover,
a:active {
	text-decoration:none;
}

strong {
	font-weight:bold;
}

div.error {
	color:#FF3366;
}

.important {
	font-weight:bold;
}

/* ============================================================== */
/* ========================= Form Style ========================= */
/* ============================================================== */
table.table, 
table.tableScroll {
	width:100%;
}
table.table tr {

}
table.table tr th {
	text-align:center;
	font-size:10px;
	line-height:12px;
}
table.table tr.active td {
	background-color:#9CBDDC;
	color:#FFF;
}
table.table tr td {

}

/* ------------------------- input ------------------------- */
input.checkbox {
	padding:0px;
	margin:0px;
	background:url(../images/checkbox.gif) 0 0;
}
.checkboxText {
	padding:2px 0px 0px 5px;
}

input.radio {
	padding:0px;
	margin:0px;
}

select.select {
	font-size:12px;
	font-weight:normal;
	font-family:Arial, Helvetica, sans-serif;
	line-height:16px;
	background:#D0DDEE;
	border-width:1px;
	border-color:#D0DDEE;
	border-style:solid;
	width:99.9%;
}

.textarea {
	font-size:12px;
	font-weight:normal;
	font-family:Arial, Helvetica, sans-serif;
	line-height:16px;
	background:#D0DDEE;
	border-width:1px;
	border-color:#D0DDEE;
	border-style:solid;
	width:99.9%;
}

input.input {
	font-size:12px;
	font-weight:normal;
	line-height:16px;
	background:#D0DDEE;
	border-width:1px;
	border-color:#D0DDEE;
	border-style:solid;
	width:99.9%;
}
input.file {
	font-size:12px;
	font-weight:normal;
	line-height:16px;
	background:#D0DDEE;
	border-width:1px;
	border-color:#D0DDEE;
	border-style:solid;
	width:99.9%;
}

input.input[disabled],
select.select[disabled],
.textarea[disabled],
input.radio[disabled],
input.checkbox[disabled],
input.file[disabled]
{
	color:#808080;
}

input.filter:focus, 
input:focus, 
textarea:focus,
select:focus, 
input.error:focus, 
input.file:focus {
	background-color:#FFF;
}

input.error, 
select.error {
	border-width:1px;
	border-color:#FF3366;
	border-style:solid;
}

input.submit {
	font-size:12px;
	font-weight:normal;
	font-family:Arial, Helvetica, sans-serif;
	line-height:16px;
	background:#FFF;
	border-width:1px;
	border-color:#000;
	border-style:solid;
}
input.submit:hover,
input.submit:focus {
	background:#D0DDEE;
}

/* ========================================================= */
/* ========================= Style ========================= */
/* ========================================================= */

/* floating */
.float1 {
	float:left;
}
.float2 {
	float:right;
}
/* textAlign */
.left {
	text-align:left;
}
.center {
	text-align:center;
}
.right {
	text-align:right;
}
/* clearing */
.clear {
	clear:both;
}
.clearfix {
	display:block;
}
/* fontSize */
.noLetters {
	font-size:0px;
	line-height:0px;
}

.noHover:link, 
.noHover:active, 
.noHover:visited, 
.noHover:hover {
	text-decoration:none;
}

.defaultLetters {
	color:#000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:16px;
}
/* cubeStyle (headerNews, mainNews) */
div.cube {
	background:#9CBDDC;
	font-size:0px;
	line-height:0px;
	height:16px;
	width:16px;
}
/* teserStyle (Fachhaendler) */
div.teaser {
	color:#9CBDDC;
	font-size:12px;
	line-height:16px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0px;
	margin:0px;
}
div.relative {
	color:#FFF;
}
/* default background-color for relative-elements */
div#main div.content div.relative {
	background-color:#9CBDDC;
	/* background:url(../images/transActive.gif); */
}

/* infoLink */
.infoLink {
	background-image:url(../images/squareInactive.gif);
	background-position:0px 2px;
	background-repeat:no-repeat;
	padding:0px 0px 0px 15px;
}
a.infoLink:link, 
a.infoLink:active, 
a.infoLink:visited {
	color:#7EA2C4;
	text-decoration:none;
}
a.infoLink:hover, a.infoLink2:hover, a.infoLink3:hover, a.infoLink4:hover, a.infoLink5:hover, a.infoLink6:hover {
	text-decoration:underline;
}
.infoLink2 {
	background-image:url(../images/squareBlack.gif);
	background-position:0px 2px;
	background-repeat:no-repeat;
	padding:0px 0px 0px 15px;
}
a.infoLink2:link, 
a.infoLink2:active, 
a.infoLink2:visited {
	color:#000;
	text-decoration:none;
}

.infoLink3 {
	background-image:url(../images/squareInactiveBorder.gif);
	background-position:0px 2px;
	background-repeat:no-repeat;
	padding:0px 0px 0px 15px;
}
a.infoLink3:link, 
a.infoLink3:active, 
a.infoLink3:visited {
	color:#7EA2C4;
	text-decoration:none;
}

.infoLink4 {
	background-image:url(../images/squareInactiveBorder.gif);
	background-position:0px 2px;
	background-repeat:no-repeat;
	padding:0px 0px 0px 15px;
}
a.infoLink4:link, 
a.infoLink4:active, 
a.infoLink4:visited {
	color:#000;
	text-decoration:none;
}

.infoLink5 {
	background-image:url(../images/infoLink5.gif);
	background-position:0px 2px;
	background-repeat:no-repeat;
	padding:0px 0px 0px 15px;
}
a.infoLink5:link, 
a.infoLink5:active, 
a.infoLink5:visited {
	color:#7EA2C4;
	text-decoration:none;
}

.infoLink6 {
	background-image:url(../images/infoLink6.gif);
	background-position:0px 2px;
	background-repeat:no-repeat;
	padding:0px 0px 0px 15px;
}
a.infoLink6:link, 
a.infoLink6:active, 
a.infoLink6:visited {
	color:#FFF;
	text-decoration:none;
}

.infoLink7 {
	background-image:url(../images/squareInactive.gif);
	background-position:0px 2px;
	background-repeat:no-repeat;
	padding:0px 0px 0px 15px;
}
a.infoLink7:link, 
a.infoLink7:active, 
a.infoLink7:visited {
	color:#CEDEEE;
	text-decoration:none;
}

/* ========================================================== */
/* ========================= Preview Framwork Layout ======== */
/* ========================================================== */
div#header div.theme {
	float:left;
	padding:45px 0px 0px 20px;
}


/* ========================================================== */
/* ========================= Layout ========================= */
/* ========================================================== */

/* ------------------------- nullFrame ------------------------- */
/* make of total page size */
div#nullFrame {
	float:left;
	width:990px;
}

/* ------------------------------------------------------- */
/* ------------------------- top ------------------------- */
/* ------------------------------------------------------- */
/* display after index */
div#top {
	background:#9CBDDC;
	float:left;
	width:100%;
}
/* ------------------------- topNavigation ------------------------- */
div#top div.navigation {
	float:left;
	width:100%;
}
/* topNavigation textStyle */
div#top div.navigation {
	color:#FFF;
	font-size:12px;
	font-weight:bold;
	line-height:20px;
	font-family:Arial, Helvetica, sans-serif;
}
/* topNavigation linkStyle */
div#top .navigation a:link, 
div#top .navigation a:visited {
	color:#FFF;
	text-decoration:none;
}
div#top .navigation a:active, 
div#top .navigation a:hover {
	color:#FFF;
	text-decoration:underline;
}
/* topNavigation activeStyle */
div#top div.navigation a.active {
	color:#CEDEEE;
	font-weight:normal;
}

/* ---------------------------------------------------------- */
/* ------------------------- header ------------------------- */
/* ---------------------------------------------------------- */
div#header {
	float:left;
	width:100%;
}
/* ------------------------- headerLogo ------------------------- */
/* 255 pixel left from 735 pixel headerNews */
/* 255 px - 161 px (logoWidth) = 94 px */
div#header div.logo {
	float:right;
}
/* ------------------------- headerNavigation ------------------------- */
div#header div.navigation {
	background:#E6EDF5;
	float:left;
	margin:0px 0px 1px 0px;
	width:100%;
}
div#header div.navigation div.first {
	background-color:#9CBDDC;
}
div#header div.navigation div.second {
	background-color:#CEDEEE;
}
/*
div#header div.navigation div.third {
	background-color:#E6EDF5;
}
*/
/* headerNavigation textStyle */
div#header div.navigation div.first div, 
div#header div.navigation div.second div, 
div#header div.navigation div.third div {
	font-size:16px;
	font-weight:bold;
	line-height:24px;
	font-family:Arial, Helvetica, sans-serif;
}
/* headerNavigation linkStyle */
div#header div.navigation div.first div a {
	color:#FFF;
}
div#header div.navigation div.second div a {
	color:#E6EDF5;
} 
div#header div.navigation div.third div a {
	color:#CEDEEE;
}
div#header div.navigation div.first div a:link, 
div#header div.navigation div.first div a:visited, 
div#header div.navigation div.second div a:link, 
div#header div.navigation div.second div a:visited, 
div#header div.navigation div.third div a:link, 
div#header div.navigation div.third div a:visited {
	text-decoration:none;
}
div#header div.navigation div.first div a:active, 
div#header div.navigation div.first div a:hover, 
div#header div.navigation div.second div a:active, 
div#header div.navigation div.second div a:hover, 
div#header div.navigation div.third div a:active, 
div#header div.navigation div.third div a:hover {
	text-decoration:underline;
}
/* headerNavigation activeStyle */
div#header div.navigation div.first div a.active, 
div#header div.navigation div.second div a.active {
	color:#FFF;
}
div#header div.navigation div.third div a.active {
	color:#9CBDDC;
}
/*  ------------------------- headerNews ------------------------- */
/* 735 pixel / 3 = 245 pixel width for single newsFrame */
div#header div.news {
	float:left;
	width:735px;
}
/* headerNews position of cube */
div#header .news div div.relative {
	position:relative;
	left:120px;
	bottom:12px;
}
/* headerNews Title */
div#header div.news div div div.title {
	color:#9CBDDC;
	font-size:18px;
	line-height:24px;
	font-family:Arial, Helvetica, sans-serif;
	font-style:italic;
	padding:0px;
	margin:0px;
}
/* headerNews Headline */
div#header div.news div div div.headline {
	color:#000;
	font-size:12px;
	line-height:14px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	padding:0px;
	margin:0px;
}
/* headerNews textStyle */
div#header div.news div div {
	color:#000;
	font-size:12px;
	line-height:14px;
	font-family:Arial, Helvetica, sans-serif;
}
/* headerNews More textStyle */
div#header div.news div div.relative div {
	color:#9CBDDC;
	font-style:italic;
	font-size:14px;
	font-weight:bold;
	line-height:20px;
	font-family:Arial, Helvetica, sans-serif;
}
/* headerNews More linkStyle */
div#header div.news div div.relative div a:link, 
div#header div.news div div.relative div a:visited {
	color:#9CBDDC;
	text-decoration:none;
}
div#header div.news div div.relative div a:active, 
div#header div.news div div.relative div a:hover {
	text-decoration:underline;
}

/* -------------------------------------------------------- */
/* ------------------------- main ------------------------- */
/* -------------------------------------------------------- */
div#main {
	float:left;
	width:100%;
}
/* ------------------------- mainContent ------------------------- */
/* 740 px */
div#main div.content {
	float:left;
	width:740px;
}
/* ------------------------- pagetype ------------------------- */
/* pagetypeIndex */
div.pagetypeIndex {
	background:url(../images/mainIndexMenu.jpg) no-repeat right bottom;
}
div.pagetypeIndex div#mainFooter {
	background:url(../images/mainIndexFooter.jpg) no-repeat left top;
}
/* pagetypePlaner */
div.pagetypePlaner {
	background:url(../images/mainPlanerMenu.jpg) no-repeat right bottom;
}
div.pagetypePlaner div#mainFooter  {
	background:url(../images/mainPlanerFooter.jpg) no-repeat left top;
}
div.pagetypePlaner div.content div div div div.relative {
	position:relative;
	left:0px;
	top:210px;
	width:180px;
}
/* pagetypeVerarbeiter */
div.pagetypeVerarbeiter {
	background:url(../images/mainVerarbeiterMenu.jpg) no-repeat right bottom;
}
div.pagetypeVerarbeiter div#mainFooter {
	background:url(../images/mainVerarbeiterFooter.jpg) no-repeat left top;
}
/* pagetypeFachhaendler */
div.pagetypeFachhaendler {
	background:url(../images/mainFachhaendlerMenu.jpg) no-repeat right bottom;
}
div.pagetypeFachhaendler div#mainFooter {
	background:url(../images/mainFachhaendlerFooter.jpg) no-repeat left top;
}
div.pagetypeFachhaendler div.content div div div div.relative {
	position:relative;
	left:0px;
	top:160px;
	width:180px;
}
/* pagetypePlaner pagenameDeckensegel */
div.pagenameDeckensegel div.content div div div.teaser {
	color:#9CBDDC;
	font-size:16px;
	font-weight:bold;
	line-height:20px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0px;
	margin:0px;
}
/* ------------------------- mainNavigation ------------------------- */
/* 250 px */
div#main div.navigation {
	float:left;
	width:250px;
}
/* border of root AND branch divs */
div#main div.navigation div div.border0010,
div#main div.navigation div.border0010 {
	border-width:0px 0px 1px 0px;
	border-style:solid;
	border-color:#FFF;
}
/* root background */
div#main div.navigation div.root, 
div#main div.navigation div div.root { background:url(../images/trans.gif) repeat; }
/* branch background */
div#main div.navigation div div.branch, 
div#main div.navigation div.branch { background-color:#9CBDDC; }
/* branch square */
div#main div.navigation div div.square {
	background-color:transparent;
	background-image:url(../images/squareInactive.gif);
	background-repeat:no-repeat;
}
/* branch font (active) */
div#main div.navigation div div.branch div div {
	color:#FFF;
}
/* branch link (link) */
div#main div.navigation div div.branch div div a {
	color:#CEDEEE;
}
/*
div#main div.navigation div div.branch div.squareActive div a {
	color:#FFF;
}
*/
/* branch square active */
div#main div.navigation div div.squareActive {
	background-color:transparent;
	background-image:url(../images/square.gif);
	background-repeat:no-repeat;
}
/* branch square positions */
div#main div.navigation div div.stage1 {
	background-position:10px 2px;
}
div#main div.navigation div div.stage2 {
	background-position:30px 2px;
}
div#main div.navigation div div.stage3 {
	background-position:50px 2px;
}
/* mainNavigation Root textStyle */
div#main div.navigation div div.root div a {
	color:#164892;
	text-decoration:none;
}
/* mainNavigation Root AND Branch hoverStyle */
div#main div.navigation div div.root div a:hover, 
div#main div.navigation div div.branch div a:hover {
	text-decoration:underline;
}
/* mainNavigation Branch linkStyle */
div#main div.navigation div div.branch div a {
	text-decoration:none;
}
/* ------------------------- mainNews ------------------------- */
/* 250 px */
div#main div.news {
	float:left;
	width:250px;
}
/* mainNews Title (Themen) */
div#main div.news div div div.title {
	color:#9CBDDC;
	font-style:italic;
	font-weight:bold;
	font-size:28px;
	line-height:32px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0px;
	margin:0px;
	
}
/* mainNews Headline */
div#main div.news div div div.headline {
	color:#000;
	font-weight:bold;
	font-size:12px;
	line-height:14px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0px;
	margin:0px;
}
/* mainNews textStyle */
div#main div.news div div {
	color:#000;
	font-size:12px;
	line-height:14px;
	font-family:Arial, Helvetica, sans-serif;
}
/* mainNews position of cube */
div#main .news div div.relative {
	position:relative;
	left:140px;
	bottom:8px;
}
/* mainNews More textStyle */
div#main div.news div div.relative div {
	color:#000;
	font-style:italic;
	font-size:14px;
	font-weight:bold;
	line-height:20px;
	font-family:Arial, Helvetica, sans-serif;
}
/* mainNews More linkStyle */
div#main div.news div div.relative div a:link, 
div#main div.news div div.relative div a:visited {
	color:#000;
	text-decoration:none;
}
div#main div.news div div.relative div a:active, 
div#main div.news div div.relative div a:hover {
	text-decoration:underline;
}
/* ------------------------- mainFooter ------------------------- */
div#mainFooter {
	float:left;
	height:50px;
	width:100%;
}

/* ---------------------------------------------------------- */
/* ------------------------- footer ------------------------- */
/* ---------------------------------------------------------- */
div#footer {
	float:left;
	width:100%;
}
/* footer textStyle */
div#footer {
	color:#9CBDDC;
	font-size:9px;
	line-height:12px;
	font-family:Arial, Helvetica, sans-serif;
}
/* footer linkStyle */
div#footer a:link, 
div#footer a:visited {
	color:#9CBDDC;
	text-decoration:underline;
}
div#footer a:active, 
div#footer a:hover {
	text-decoration:none;
}

/* ---------------------------------------------------------- */
/* ------------------------- border ------------------------- */
/* ---------------------------------------------------------- */
.border0001 {
	border-width:0px 0px 0px 1px;
	border-style:solid;
}
.border0010 {
	border-width:0px 0px 1px 0px;
	border-style:solid;
}
div.border1000 {
	border-width:1px 0px 0px 0px;
	border-style:solid;
}

/* ---------------------------------------------------------- */
/* ------------------------- Margin ------------------------- */
/* ---------------------------------------------------------- */
.margin10 {
	margin:10px 0px;
}
.margin01 {
	margin:0px 10px;
}
.margin1000 {
	margin:10px 0px 0px 0px;
}
.margin9000 {
	margin:90px 0px 0px 0px;
}
.margin1100 {
	margin:10px 10px 0px 0px;
}

/* SANDBOX */
.listCube {
	padding:0px 0px 0px 12px;
	background: url(../images/listCube.gif) 0px 4px no-repeat;
}

ul.listLine {
	list-style:none;
	margin-top:5px;
}

ul.listLine li {
	padding: 0px 0px 5px 12px;
	background: url(../images/listLine.gif) 0 7px no-repeat;
}

/* ================================================================ */
/* ========================= Border Color ========================= */
/* ================================================================ */
.borderColorVogl1 {
	border-color:#164892;
}
.borderColorVogl2 {
	border-color:#A4A7D0;
}
.borderColorVogl3 {
	border-color:#9CBDDC;
}
.borderColorVogl4 {
	border-color:#CEDEEE;
}
.borderColorVogl5 {
	border-color:#E6EDF5;
}
.borderColorWhite {
	border-color:#FFF;
}
.borderColorBlack {
	border-color:#000;
}

/* =============================================================== */
/* ========================= Background Colors ========================= */
/* =============================================================== */
.bgColorVogl1 {
	background-color:#164892;
}
.bgColorVogl2 {
	background-color:#A4A7D0;
}
.bgColorVogl3 {
	background-color:#9CBDDC;
}
.bgColorVogl4 {
	background-color:#CEDEEE;
}
.bgColorVogl5 {
	background-color:#E6EDF5;
}

/* =============================================================== */
/* ========================= Font Colors ========================= */
/* =============================================================== */
.fontColorVogl1 {
	color:#164892;
}
.fontColorVogl2 {
	color:#A4A7D0;
}
.fontColorVogl3 {
	color:#9CBDDC;
}
.fontColorVogl4 {
	color:#CEDEEE;
}
.fontColorVogl5 {
	color:#E6EDF5;
}
.fontColorWhite {
	color:#FFF;
}
.fontColorWhite:link, 
.fontColorWhite:active, 
.fontColorWhite:visited, 
.fontColorWhite:hover {
	color:#FFF;
}
.fontColorBlack {
	color:#000;
}

/* ============================================================= */
/* ========================= Font Size ========================= */
/* ============================================================= */
.fontSize9 {
	font-size:9px;
	line-height:12px;
}
.fontSize10 {
	font-size:10px;
	line-height:12px;
}
.fontSize11 {
	font-size:11px;
	line-height:14px;
}
.fontSize12 {
	font-size:12px;
	line-height:16px;
}
.fontSize13 {
	font-size:13px;
	line-height:17px;
}
.fontSize14 {
	font-size:14px;
	line-height:18px;
}
.fontSize15 {
	font-size:14px;
	line-height:19px;
}
.fontSize16 {
	font-size:16px;
	line-height:20px;
}
.fontSize17 {
	font-size:17px;
	line-height:21px;
}
.fontSize18 {
	font-size:18px;
	line-height:22px;
}
.fontSize20 {
	font-size:20px;
	line-height:24px;
}
.fontSize22 {
	font-size:22px;
	line-height:26px;
}
.fontSize24 {
	font-size:24px;
	line-height:28px;
}
.fontSize28 {
	font-size:28px;
	line-height:32px;
}