/*
    The intention of this file is to determine the common layout scheme
    for the application. In former times this would have been your base
    table construct, where place all your spots like header, footer, etc.
*/


body
{
	text-align: left;
	font-family: tahoma, verdana, arial, sans-serif;
	font-size: 11px;
	color: #666666;
	background: #ffffff;
	padding: 0;
	margin: 0;
}

/*
   This is the very first container in each apondos application.
   It is used to determine basic layout-options like: width, alignment and padding of
   the application
*/
#base_container
{
    position:relative;
    float: left;
    text-align: left;
    margin: 0 auto;
    padding: 0;
    width: 783px;
    background-image: url(/resources/images/theme1/nav_bg.jpg);
    background-repeat: repeat-y;
    border-right: 1px dotted #869084;
    border-bottom: 1px dotted #869084;
}

#content
{
    margin-top: 10px;
    margin-left: 280px;
    padding-left: 30px;
    padding-top: 0px;
    padding-right: 10px;
}


#nav
{
	float: left;
	display: inline;
	background-image: url(/resources/images/theme1/nav_logo.jpg);
	background-repeat:  no-repeat;
	background-position: 0px 7px;
	padding-top: 10px;
	padding-left: 40px;
	padding-bottom: 0;
	margin-left: 10px;
	margin-top: 0px;
}

#nav_member
{
	float: left;
	display: inline;
	background-position: 0px 15px;
	padding-top: 10px;
	padding-bottom: 0;
	margin-left: 0px;
        margin-right: 0px;
	margin-top: 30px;
}

/*
   The common header, usually used to place a logo, a claim and other common and global informations
*/
#header
{
    display: block;
    text-align: left;
    background-image: url(/resources/images/teaser_image.png);
    background-repeat: no-repeat;

    color: #666;
    padding-top: 90px;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 0px;
    margin-bottom: 30px;
}

#header_text
{
    text-align: right;
    font-size: 12px;
    font-family: Tahoma,Verdana,sans-serif;
    font-weight: bold;
    display: block;
    width: 250px;
    margin-bottom: 30px;
    margin-left: 130px;
    border-bottom: 1px dashed #666;
}

/*
    used for common footer informations
*/
#footer
{
    margin-top: 25px;
}

/*
    this is where the real contents are renders
*/
#stage
{
    text-align: left;
    margin: 0 auto;
    padding: 0px 0px 10px 10px;
    width: 773px;
}

#stage #base_container #nav ul
{
    margin-top: 0px;
    list-style-type: none;
    padding-bottom: 0;
}

#stage #base_container #nav ul li
{
    padding-top: 10px;
    margin-bottom: 0px;
    padding-left: 20px;
}

#stage #base_container #content p
{
    width: 430px;
    text-align: justify;
    line-height: 1.4em;
}

#inner_stage
{
    padding: 10px;
    width: 780px;
}

/*
    A global and common navigation
*/
#global_navigation
{
    margin-right: 10px;
}

/*
    The local navigation depends usually from the current context
    of the application.
*/
#local_navigation
{
    margin-top: 25px;
    padding-top: 0px;
    float: left;
    border-right: 1px solid #9F0102;
    border-top: 1px solid #9F0102;
    border-bottom: 1px solid #9F0102;
}

/* The container for language selection */
#language_selection
{
    position: absolute;
    left: 920px;
    top: 20px;
    list-style-type: none;
    display: inline;
    margin-top: 0;
    padding-top: 0;
}



.footer
{
    margin-top: 30px;
    margin-bottom: 30px;
    text-align: left;
}

.image_left
{
    float: left;
    height: 100px;
    padding-right: 30px;
}

/* Common Layout Element. It shall be in addition with other
   classes to define the "top" of something

   if e.g. the first item of a list shall have a red line on top and
   the others dont, it could be realized in this manner:
   <li class="common_list top">Time</li>
   <li class="common_list">Other List Item</li>

   The idea is to avoid many very special classes
*/
.top
{
    border-top: 1px solid #9F0102;
}

/* see the class .top */
.bottom
{
    border-bottom: 1px solid #9F0102;
}

/* see the class .top */
.left
{
    border-left: 1px solid #9F0102;
}

/* see the class .top */
.right
{
    border-right: 1px solid #9F0102;
}

/* the left column of 2 a two column layout, usually used within <p> tags */
.left_paragraph
{
    width: 45%;
    float: left;
    display: block;
}

/* the right column of 2 a two column layout, usually used within <p> tags */
.right_paragraph
{
    width: 45%;
    float: left;
    margin-left: 0px;
    padding-left: 55px;
    padding-right: 5px;
    padding-top: 0;
    display: inline;
}

.full_row
{
    width: 95%;
    position: relative;
    float: left;
    display: block;
}

.divider
{
    width: 100%;
    text-align: center;
    margin-top: 10px;
    display: block;
}

/* Catalogue styles */
.container
{
  background-color: #ffffff;
  margin: 5px;
  float: left;
  width: 100%;
  display: inline;
}
.container.dotted
{
    background-color: #ffffff;
	width: 100%;
    position: relative;
 	border-bottom-color: #808080;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}
.block
{
  background-color: #ffffff;
  margin: 5;
  float: left;
  width: 30%;
  display: inline;
}
.item
{
  background-color: #ffffff;
  margin-left: 2;
  float: left;
  display: inline;
  font-size: 8pt;
}

.common-table-cell{
    border-bottom: 1px dotted #333
}