/* ------------------------------------------------ 

Name: screen.css
Project: Bastian Offsetdruck GmbH
Version: 1.0
Author: Frank Fuchs - programming | consulting | design http://www.ff77.de

--- TOC ---

1. 	General Stuff
2. 	Layout
3. 	Navigation
4. 	Headings
5. 	Content
5.1 Slideshow
5.2 Accordion
6. 	Forms
7. 	Footer

------------------------------------------------ */


/* --------------------------------------------- */
/* 1. General Stuff ---------------------------- */

body {
	background: #d9d9d9 url("../_graphics/bg.jpg") no-repeat 50% 0;
	font: normal 62.5% "Trebuchet MS", Arial, Helvetica, sans-serif;
    color: #444444;
}

.left {
	float: left;
}

.right {
	float: right;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility:hidden;
}

.clearfix {
    display:inline-block;
}
/* Hide from IE Mac \*/
.clearfix {
    display: block;
}
/* End hide from IE Mac */

/* --------------------------------------------- */
/* 2. Layout ----------------------------------- */

#header {
	height: 100px;
	width: 940px;
	margin: 0px auto 0px auto;
	padding: 0;
}

#content {
	width: 940px;
	margin: 0px auto 0px auto;
	padding: 0;
}

#main {
	width: 700px;
	margin: 0px 0px 0px 20px;
	float: right;
}

#sidebar {
	width: 220px;
	float: left;
}

.left {
	width: 460px;
	margin: 0px 20px 0px 0px;
	float: left;
}

.right {
	width: 460px;
	float: right;
}

#footer {
	width: 940px;
	margin: 0px auto 35px auto;
	padding: 0;
}

/* --------------------------------------------- */
/* 3. Navigation ------------------------------- */

#top-nav {
	margin: 5px 8px;
	text-align: right;
	font-weight: bold;
	vertical-align:middle;
	line-height: 16px;
}

#top-nav a {
	font-weight: bold;
	font-size: 1em;
    color: #444444;	
	text-decoration: none;
	vertical-align:middle;	
	line-height: 16px;
}

#top-nav a:hover {
	text-decoration: underline;
}


#nav {
	margin-top: 20px;
	float: right;
}

#nav li {
	margin-left: 5px; 
	display: block;
	float: left;
	text-align: center;
}

#nav a {
	display: inline-block;
	padding: 3px 8px;
	font-weight: bold;
	font-size: 1.4em;
    color: #444444;	
	text-decoration: none;
}

#nav li.current_page_item a {
	background: #e9eedf;	
}

#nav li.current_page_parent a {
	background: #e9eedf;	
}

#nav li.current_page_ancestor a {
	background: #e9eedf;	
}

#nav a:hover {
	background: #669900 !important;	
	color: #ffffff  !important;
}

.subnav ul {
	list-style:none !important;
	background: #ffffff;	
	margin: 0 !important;
	padding: 4px 13px !important;
}

.subnav ul ul {
	padding: 0px 13px 4px 13px!important;
}

.subnav ul li {
	background: #ffffff;	
	margin: 8px 0px 8px 0px !important;
	padding: 0 !important;
	line-height: 1em;
}

.subnav a {
	font-weight: normal !important;;
	font-size: 13px;
    color: #444444;	
	text-decoration: none;
}

.subnav a:hover {
	text-decoration: underline;	
}

.subnav li.current_page_item a {
	color: #669900 !important;	
	font-weight: bold !important;
}

.subnav li.current_page_item li a {
	color: #444444 !important;	
	font-weight: normal !important;
}

.subnav li.current_page_parent a {
	font-weight: bold !important;
}

.subnav li.current_page_parent li a {
	font-weight: normal !important;
}
.subnav li.current_page_ancestor a {
	font-weight: bold !important;

}

.subnav li.current_page_ancestor li a {
	font-weight: normal !important;

}

/* --------------------------------------------- */
/* 4. Headings --------------------------------- */

h1 {
	font-size: 2.4em;
	margin: 0em 0em 13px 0em;
	font-weight: normal;
	line-height: 1.5em;
	color: #669900;
}

#content .block .transparent h1 {
	color: #fff;
}

h2 {
	font-size: 1.5em;
	margin: 1.7em 0em 0.5em;
	color: #444444;
}

.subnav h2 {
	margin: 0em 0em 0.65em;
	color: #669900;
}

h3 {
	font-size: 1.3em;
	margin: 1.7em 0em 1.3em;
	color: #222222;
	font-weight: bold;
}

#accordion h2 {
	margin: 0em;
}

#logo {
	clear: both;
	height: 53px;
	width: 300px;
	margin: 0px 8px 0px 8px;
	float: left;
	background: url("../_graphics/logo.png") no-repeat;
	text-indent: -9999px;
}

/* --------------------------------------------- */
/* 5. Content ---------------------------------- */

#content .block {
	margin-bottom: 20px;
	padding: 8px;
	background: url("../_graphics/grey.png");	
	/*background: url("../_graphics/transparent-20.png");	*/
	color: #444444;
}

#gallery-1 {
	width: 640px !important;	
}

.gallery-item {
	width: 160px !important;
}

#content .block .white {
	padding: 1.3em;
	height: 100%;
	background: #fff;
}

#content .block .breadcrumb {
	width: 100%;
	background: #eee;
}

#content .block .breadcrumb a {
	display: inline-block;
	height: 34px;
	line-height: 34px;
	padding: 0em 13px;
	font-size: 15px !important;
	text-decoration: none !important;
}

#content .block .breadcrumb span a {
	display: inline-block;
	height: 34px;
	line-height: 34px;
	padding-left: 46px;
	font-size: 15px !important;
	text-decoration: none !important;
	background: url("../_graphics/arrow-bread.png") no-repeat 0px 50%;	
}

#content .block .breadcrumb span.last a {
	display: inline-block;
	height: 34px;
	line-height: 34px;
	padding-left: 46px;
	font-size: 15px !important;
	text-decoration: none !important;
	color: #fff !important;
	background: #669900 url("../_graphics/arrow-bread.png") no-repeat 0px 50% !important;	
}

#content .block span.last {
	padding-right: 17px;
	display:inline-block;
	background: url("../_graphics/arrow-bread-end.gif") no-repeat 100% 0px;	
}


#content .block .breadcrumb a:hover {
	font-size: 15px !important;
	text-decoration: underline !important;
}

#content .block .grey {
	padding: 1.3em;
	height: 100%;
	background: #eee;
}

#content .block .transparent {
	color: #fff;
	height: 100%;
	padding: 0em;
	background: #9ec285 url("../_graphics/gradient.png") repeat-x;	
}

#a1 {
	display:inline-block;
	text-indent: -9999px;
	height:16px;
	width: 29px;
	background: url("../_graphics/de-grey.png") no-repeat;
}

#a1:hover, #a1.select {
	background: url("../_graphics/de.png") no-repeat;
}

.german {
	display:inline-block;
	text-indent: -9999px;
	height:16px;
	width: 29px;
	background: url("../_graphics/de.png") no-repeat;
}

.english {
	display:inline-block;
	text-indent: -9999px;
	height:16px;
	width: 29px;
	background: url("../_graphics/en.png") no-repeat;
}

#a2 {
	display:inline-block;
	height:16px;
	width: 29px;
	background: url("../_graphics/en-grey.png") no-repeat;
}

#a2:hover, #a2.select {
	background: url("../_graphics/en.png") no-repeat;
}

#a3 {
	display:inline-block;
	height:16px;
	width: 29px;
	background: url("../_graphics/fr-grey.png") no-repeat;
}

#a3:hover, #a3.select {
	background: url("../_graphics/fr.png") no-repeat;
}

#content .block .transparent .tab {
	padding: 0.5em 1.3em 1.3em 1.3em;
}

#content .news-entry {
	margin: 1.3em 0em;
	padding-bottom: 5px;
	border-bottom: 3px solid #bbb;	
}

#content .news-date {
	padding: 4px 0px;
	width: 38px;
	float: left;
	margin-bottom: 8px;	
	text-align: center;
	background: #222222;
	color: #FFFFFF;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: bold;
}

#content .news-date span {
	font-size: 18px;
}

#content .news-content {
	float: right;
	width: 370px;
	margin-bottom: 8px;	
}

#content .wide {
	width: 605px !important;
}

#content .news-content h3 {
	margin: 0px !important;
}

#content .news-content p {
	margin: 8px 0em !important;
}

#content .news-content a {
	text-decoration: none;
}


#content p {
	margin: 0em 0em 1.3em 0em;
	font-size: 1.3em;
	line-height: 1.5em;	
}

#content ul {
	margin: 1.3em 0em;
	font-size: 1.3em;
	line-height: 1.5em;
	list-style: square;
}

#content ul li {
	margin-left: 1.7em;
	padding-left: 0.3em;
}

#content ol {
	margin: 1.3em 0em;
	font-size: 1.3em;
	line-height: 1.5em;
	list-style: decimal;
}

#content ol li {
	margin-left: 1.7em;
	padding-left: 0.3em;
}

#content blockquote {
	margin-left: 1.7em;
	margin-right: 1.7em;
	font-style:italic;
}

#content a {
	font-weight: bold;
	color: #444444;
}

#content a.more, .post-navigation a {
	display: inline-block;
	text-align: center;
	line-height: 20px;
	padding: 2px 6px;
	font-weight: bold;
	font-size: 13px;
	text-decoration: none;
	color: #fff !important;
	background: #669900;
}

#content img {
	border: none !important;
}

#content img.alignleft {
	margin: 0px 15px 0px 0px;
	float: left;
}

#content img.alignright {
	margin: 0px 0px 0px 15px;
	float: right;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.feed {
	font-size: 13px;
}

#content .contact {
	font-size: 18px !important;
	padding-bottom: 5px;
	margin-top: 13px;
	margin-bottom: 8px;
	border-bottom: 3px solid #a5bf8e;
	color: #fff;
}

#sidebar .contact {
	font-size:  13px !important;
	padding-bottom: 5px;
	margin-top: 13px;
	margin-bottom: 8px;
	border-bottom: 3px solid #a5bf8e;
	color: #fff;
}

#sidebar h1 {
	font-size: 18px !important;
}

#content .contact a {
	color: #fff !important;
	font-weight: normal !important;
	text-decoration: none !important;
}


#content .contact a:hover {

	text-decoration: underline !important;
}

#content td {
	padding-bottom: 10px;
}



/* 5.1 Slideshow ---------------------------------- */

#slideshow {
	height: 284px;
	width: 924px;
	overflow: hidden;
	position: relative;
	background: #fff;
}

#slideshow-overlay {
	position: relative;
	padding-top: 2.6em;
	top: 0px;
	left: 0px;
	z-index: 9999;
	border: none;
}

#slideshow-control {
	float: left;
	font-size: 1em !important;
	margin: 0px !important;
	padding: 0px !important;
}

#slideshow-control li {
	font-size: 1em !important;
	margin: 0px !important;
	padding: 0px !important;
	margin-bottom: 1.3em !important;
	
}

#slideshow-control span {
	display: inline-block;
	padding: 8px 13px;
	color: #669900;
	background: #fff;
	font-size: 2.4em;
	font-weight: normal;
	text-decoration: none;
}

#slideshow-control span.select {
	color: #fff;
	background: #669900;
}

.slideshow-info h2 {
	margin-top: 0 !important;
	margin-bottom: 8px !important;
	font-size: 15px !important;
}

.slideshow-info p {
	font-size: 13px !important;
}

.slideshow-info {
	width: 310px;
	float: right;
	padding: 1.3em;
	font-size: 1.3em;
	line-height: 1.5em;
	background: #fff;
}

#slideshow-items img {
	position: absolute;
	top: 0px;
	left: 0px;
	border: none;
	display: none;
}

/* 5.2 Accordion ---------------------------------- */

#content .ui-accordion-header {
	margin: 1.3em 0em 0em 0em;
}

#content .ui-accordion-header a {	
	padding: 8px 8px 8px 35px;
	background: #eee url("../_graphics/arrow-close.png") no-repeat 8px 50%;
	display: block;
	text-decoration: none;
}

#content .ui-state-active a {	
	background: #eee url("../_graphics/arrow-open.png") no-repeat 8px 50%;
}

#content .ui-accordion-content {
	padding: 8px 8px 8px 35px;
	background: #eee;
	font-size: 1.3em;
	line-height: 1.3em;	
	overflow: hidden;
}


#accordion p {
	font-size: 13px !important;
}


/* --------------------------------------------- */
/* 6. Forms ------------------------------------ */

#content form {
	padding: 13px;
	background: #eeeeee;
}

#content form p {
	margin: 0px 0px 8px 0px !important;
}

#content label {
	display: inline-block;
	margin: 0px 0px 4px 0px !important;
	vertical-align: top;
	width: 100px;
	font-size: 13px;
	font-weight: bold;
	color: #444444;
}

#content select, option {
	font: normal 13px "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#content input {
	width: 300px;
	font: normal 13px "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#content textarea {
	font: normal 13px "Trebuchet MS", Arial, Helvetica, sans-serif;
	width: 300px;
	height: 150px;
}

#content .error { color: red;}

#content input.button {
	font-size: 13px;
	width: 60px;
	border: none;
	background: #669900;
	line-height: 20px;
	padding: 2px 6px;
	font-weight: bold;
	color: white;
}

/* --------------------------------------------- */
/* 7. Footer ----------------------------------- */

#footer {
	height: 100px;
	width: 924px;
	margin: 0px auto;
	text-align: right;
	font-size: 1em;
	font-weight: bold;
}