/* STRUCTURE.CSS - XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* LEGEND START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/*
STRUCTURE.CSS defines the layout-architecture of the page, usually all elements are defined with an id
AUTHOR/E-MAIL: stephan s. kurz [stephan.kurz@weka.de], 2009-03-09
LAST CHANGE AUTHOR: stephan s. kurz [stephan.kurz@weka.de], 2009-03-09
LAST CHANGE ITEM: line nr. 6, line nr. 7
elements, classes and id's are tested on all relevant browsers and provide validated code only - browser-specific code is not allowed !
names of classes and id's only contain lowercase letters and '-' [hyphen] as seperator. '_' [underline] is not allowed !
conditional [browserspecific] css or css-hacks are not allowed !
when all development works are finished, optimize the codes style of writing [summarize, remove comments] and adapt it to your style !
*/
/* LEGEND END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* INITIALISING [RESET] OF ELEMENTS START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
html
{
height:100%;
margin-bottom:1px;
}
body
{
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
margin-left:0px;
padding-top:0px;
padding-right:0px;
padding-bottom:0px;
padding-left:0px;
border-style:none;
border-width:0px;
border-color:#ffffff;
}
img
{
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
margin-left:0px;
padding-top:0px;
padding-right:0px;
padding-bottom:0px;
padding-left:0px;
border-style:none;
border-width:0px;
border-color:#ffffff;
background:transparent;
}
div,table,tr,td,th,h1,h2,h3,h4,h5,h6,p,pre,form,input,select
{
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
margin-left:0px;
padding-top:0px;
padding-right:0px;
padding-bottom:0px;
padding-left:0px;
border-style:none;
border-width:0px;
border-color:#ffffff;
background:transparent;
vertical-align:top;
}
ul,ol
{
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
margin-left:0px;
padding-top:0px;
padding-right:0px;
padding-bottom:0px;
border-style:none;
border-width:0px;
border-color:#ffffff;
background:transparent;
vertical-align:top;
}
/* INITIALISING [RESET OF] ELEMENTS END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* BASIC ALIGNMENT OF THE PAGE-CONTAINER [CENTER] START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#page-center
{
width:1000px;
height:auto;
margin-left:-500px;
position:absolute;
top:0px;
left:50%;
}
/* BASIC ALIGNMENT OF THE PAGE-CONTAINER [CENTER] END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* PAGE-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#page-area
{
width:1000px;
height:auto;
}
/* PAGE-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* HEAD-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#head-area
{
width:1000px;
}
/* TOP-BAR START |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#top-bar
{
width:1000px;
height:39px;
}
#top-bar div
{
float: left;
}
/* TOP-BAR END |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* TOP-BAR-CONTAINER START |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#top-bar-container
{
width:350px;
height:39px;
}
/* TOP-BAR-CONTAINER END |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* META-NAVIGATION-CONTAINER START |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#meta-navigation-container
{
width:650px;
height:39px;
}
/* META-NAVIGATION-CONTAINER END |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* TOP-NAVIGATION-AREA START |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#top-navigation-area
{
width:1000px;
height:119px;
}
/* LOGO-CONTAINER START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#logo-container
{
width:240px;
height:119px;
float:left;
}
/* LOGO-CONTAINER END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* TOP-NAVIGATION-CONTAINER START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#top-navigation-container
{
width:625px;
height:50px;
float:left;
/*width:760px;
height:144px;
float:left;*/
}
/* TOP-NAVIGATION START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#top-navigation
{
width:625px;
height:50px;
clear:both;
overflow:visible;
}
/* TOP-NAVIGATION END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* TOP-BANNER START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#top-banner
{
width:760px;
height:119px;
float:left;
}
/* TOP-BANNER END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* TOP-NAVIGATION-CONTAINER END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* TOP-NAVIGATION-AREA END |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* SUB-NAVIGATION-AREA START |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#sub-navigation-area
{
width:1000px;
height:98px;
}
/* SUB-NAVIGATION-CONTAINER START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#sub-navigation-container
{
width:625px;
height:48px;
float:left;
}
/* SUB-NAVIGATION START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#sub-navigation
{
width:625px;
height:48px;
}
/* SUB-NAVIGATION END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* BREADCRUMB-CONTAINER START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#breadcrumb-container
{
width:604px;
height:35px;
margin-left:20px;
}
/* BREADCRUMB-CONTAINER END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* SUB-NAVIGATION-CONTAINER END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* SEARCH-AREA START |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#search-area
{
width:375px;
height:98px;
float:left;
}
/* SEARCH-CONTAINER START ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#search-container
{
width:375px;
height:50px;
}
/* SEARCH-CONTAINER END ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* EXTENDED-SEARCH START |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
#extended-search
{
width:375px;
height:35px;
}
/* EXTENDED-SEARCH END |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* SEARCH-AREA END |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* SUB-NAVIGATION-AREA END |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/* HEAD-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* OUTPUT-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#output-area
{
/*
margin-top:-1px;
*/
width:1000px;
height:auto;
}
/* OUTPUT-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* OUTPUT-CONTAINER START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#output-container
{
width:981px;
height:auto;
margin-left:19px;
}
/* OUTPUT-CONTAINER END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* CONTENT-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#content-area
{
margin-top:-1px;
width:605px;
height:auto;
float:left;
min-height:25px;
}
/* CONTENT-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* SIDEBAR-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#sidebar-area
{
margin-top:-1px;
width:355px;
height:auto;
float:left;
min-height:25px;
}
/* SIDEBAR-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* BOTTOM-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#bottom-area
{
width:960px;
height:auto;
clear:left;
background:#848684;
}
/* BOTTOM-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* PAGE-SHADOW-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#page-shadow-area
{
width:990px;
height:20px;
clear:left;
}
/* PAGE-SHADOW-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* FOOT-AREA START XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
#foot-area
{
margin-top:45px;
margin-left:20px;
width:960px;
height:90px;
}
/* FOOT-AREA END XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* STRUCTURE.CSS - XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */