body        { font-family: Arial,Helvetica,sans-serif; font-size:12px; text-align:left; padding:0px; margin:0px; }
table       { margin:0px; padding:0px; border-collapse:collapse; }
table td    { padding:0px; margin:0px; vertical-align:top; text-align:left; }
h1          { padding:0; margin:0; font-size:21px; font-weight:normal; }
h2          { padding:0; margin:0; font-size:14px; font-weight:normal; }
h4          { position: absolute; top: 0; left: 0; margin: 0; color: white; text-transform: uppercase; font-size: 13px; font-weight: normal; }
ul          { margin:0px; padding:0px; }
ul li       { list-style-type:none; margin:0px; padding:0px; }
img         { border: none; margin:0; padding:0; }
a           { text-decoration:none; outline: none; color:#000; }
a:hover     { text-decoration:underline; cursor: pointer; }
form        { margin:0; padding:0; }
form button { background: #000000; color: #fff; font-size:11px; border: none; height:20px; line-height:20px; }
p           { margin:14px 0; padding:0; }
iframe      { border:none; margin:0; }
/*  --END COMMON STYLES--  */

/*
	ENHANCEMENT:
	These selection declarations have to be separate.
	No text-shadow: twitter.com/miketaylr/status/12228805301
	(added on 01.06.11 at 17:22:24 PM by Edy Ionescu)
*/
::-moz-selection 	{ background: #FF5E99; color: #FFF; text-shadow: none; }
::selection 		{ background: #FF5E99; color: #FFF; text-shadow: none; }

/* Begin fonts embedding /*

/*
	ENHANCEMENT:
	-	The bulletproof smiley syntax.
	-	The OpenType spec indicates any two-byte unicode characters won't work in a font name on Mac at all,
		so that lessens the likelihood that someone actually released a font with such a name.
		IE chockes on this one and thereby sticks with the eot.
	(added on 27.07.10 at 16:12:06 PM by Edy)

	FIX:
	-	The EOT font is rejected by IE if the NAME table doesn't conform to Microsoft's expectations.
		Use the fontsquirrel.com generator instead. It fixes the NAME table issue.
   	(added on 09.12.10 at 17:52:32 PM by Edy)
*/
@font-face {
	font-family: 'Universe Condensed';
	src: url('./common/fonts/ucr___ub.eot');
	src: local('☺'), url('./common/fonts/ucr___ub.woff') format('woff'), url('./common/fonts/ucr___ub.ttf') format('truetype'), url('./common/fonts/ucr___ub.svg#webfontSAYAwFVt') format('svg');
	font-weight: normal;
	font-style: normal;
}
/* End fonts embedding */
/* General rules */
html, body {
	height:100%;
}
table {
	width: 100%;
}
body {
	color:#000;
	margin:0;
	padding:0;
	background-color:white;
}
form button {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    color: #FFFFFF;
    font-size: 11px;
    line-height: 19px;
    margin-right: 4px;
}
#templateKontakt iframe {
	width: 754px;
	height: 424px;
	position: absolute;
	bottom: 0;
	margin: 0;
}
/* End general rules */

#wrapper {
	width:1005px;
	height: 716px;
	margin:0 auto;
}
#logo {
	float:left;
}
#logo img {
	width: 250px;
	height: 82px;
	display:block;
}
#menu {
	float:left;
	width:616px;
	text-align:right;
	padding-top:49px;
}
#menu ul{
	float:right;
}
#menu ul li, #footerMenu ul li {
	float:left;
	padding:0 1px;
}
#menu ul li a, #footerMenu ul li a {
	display:block;
	height:19px;
	line-height:19px;
	padding-left:8px;
	padding-right:8px;
	font-family: "Universe Condensed";
	font-size:14px;
	color: black;
}
#menu ul li a.active, #menu ul li a:hover,
#footerMenu ul li a.active, #footerMenu ul li a:hover {
	color:white;
	background:black;
	text-decoration:none;
}
#holdSearchForm {
	float:right;
	width:114px;
	height:19px;
	margin-top:49px;
	background:black;color:white;
}
#holdSearchForm table tr td {
	vertical-align:middle;
	height:19px;
	line-height:19px;
}
#holdSearchForm input {
	width:82px;
	text-transform: uppercase;
	font-family: "Universe Condensed";
	font-size:10px;
	margin-left:6px;
	border: none;
	display: block;background:black;
}
.holdContent {
	clear:both;
	width:1005px;
	height:558px;
	position: relative;
}
.holdContent p {
	font-size: 12px;
}
#subMenu {
	float:left;
	width:209px;
	padding-top:93px;
	padding-left:42px;
}
#subMenu ul li {
	padding: 0;
	padding-bottom: 1px;
}
#subMenu ul li a {
	display:block;
	width:170px;
	line-height:19px;
	padding-left:6px;
	padding-right:6px;
	font-size:14px;
	font-family: "Universe Condensed";
}
#subMenu ul li a.active, #subMenu ul li a:hover {
	background:black;
	text-decoration:none;
	color:white;
}
#subMenu #subSubMenu a.active, #subMenu #subSubMenu a:hover {
	background:#e6cb72;
	text-decoration:none;
	color:white;
}
#subSubMenu {
	padding-top: 1px;
	padding-bottom:32px;
}
.content {
	position:relative;
	float:left;
	width:754px;
	height:558px;
}


#footer {
	position: absolute;
	bottom:-72px;
	left:0;
	color:#606163;
	font-size:9px;
}
#footerMenu {
	width:542px;
	height:19px;
}
#footer address {
	width:216px;
	padding:0 40px;
	padding-left:20px;
	font-size:9px;
	color:#606163;
	font-style:normal;
}
#footer a {
	color:#606163;
}
#footer div#copyright {
	padding-left: 20px;
}
#footer div#copyright a {
	text-decoration: underline;
}
#footer div#copyright a:hover {
	text-decoration: none;
}
#footer img {
	width: 197px;
	height: 20px;
}
.holdHeadline {
	width:221px;
	height:82px;
	padding:15px;
	background:black;
}
.headline, .headline p {
	font-size: 1.33em;
	color: white;
	font-weight:normal;
}
.headline p {
	margin:0;
	padding:0;
}
#holdText {
	width:221px;
	height:267px;
	padding:15px;
	background:white;
	overflow:auto;
	color:black;
}
#templatePhilosophie .holdHeadline {
	margin-top:23px;
}
#templatePhilosophie #holdText {
	background:white;color:black;
}
#templateImpressum .holdHeadline {
	position:absolute;
	bottom:0;
}
#templateImpressum #holdText {
	position:absolute;
	bottom:111px;
}
#templateBigger .holdHeadline {
	margin-top:23px;
}
#templateBigger #holdText {
	position:absolute;
	top:23px;
	left:251px;
	width: 473px;
	height: 535px;
	background: #393939;
	color: white;
}
#templateKontakt .holdHeadline {
	position:absolute;
	top:23px;
	right:0;
}
#templateKontakt #holdText {
	position:absolute;
	right:0;
	top:134px;
	background:#465361;
}
#templateTeam .holdHeadline {
	margin-top:23px;
}
#holdTeam {
	position:absolute;
	top:23px;
	left:251px;
	width:503px;
	height:335px;
	background:#64744f;
}
#holdTeam table td {
	vertical-align:middle;
	font-size: 12px;
}
#holdTeam table td:first-child {
	width: 112px;
	height: 112px;
}
#holdTeam table td img {
	display:block;
}
.teamMember {
	padding-left:23px;
	color:white;
}
.teamMember h2 {
	font-size:16px;
	font-weight:normal;
}
.content a {
	color:white;
}
#newsHeadline {
	position:absolute;
	top:23px;
	right:0;
	height:31px;
	padding-top:76px;
	padding-bottom:4px;
}
#navigation {
	width:203px;
	height:19px;
	margin-top:98px;
	margin-bottom:17px;
}
#navigation a {
	color: black;
}
#navigation #prev {
	float:left;
	height:19px;
	line-height:19px;
	padding-left:25px;
	background:url('./img/prev-off.png') top left no-repeat;
}
#navigation a#prev:hover {
	text-decoration:none;
	background:url('./img/prev-on.png') top left no-repeat;
}
#navigation #next {
	float:right;
	height:19px;
	line-height:19px;
	padding-right:25px;
	background:url('./img/next-off.png') top right no-repeat;
}
#navigation a#next:hover {
	text-decoration:none;
	background:url('./img/next-on.png') top right no-repeat;
}
#holdNews {
	width:100%;
	height:424px;
	color:white;
	background-color:#393939;
}
#newsImageAndDownload img {
	float:left;
}
#newsImageAndDownload table {
	width: auto;
}
#newsImageAndDownload table td {
	vertical-align:bottom;
}
#newsImageAndDownload table td a,
td.downloadIcons a {
	font-family: "Universe Condensed";
	font-size: 16px;
	text-transform: uppercase;
	text-decoration: none;
	display: block;
	background: black;
	color: white;
	padding: 5px;
}
td.downloadIcons a {
	width: 22px;
	text-align: center;
}
#newsImageAndDownload table td a:hover,
td.downloadIcons a:hover {
	background: white;
	color: black;
}
#newsDetails {
	height:208px;
	padding-bottom:4px;
}
#newsDetails table td {
	padding:0 48px;
}
#newsDetails h1.title {
	font-size:16px;
	margin-top:30px;
	margin-bottom:20px;
	margin-left: 48px;
}
#downloadsHeadline {
	position:absolute;
	top:23px;
	right:0;
	height:31px;
	padding-top:76px;
	padding-bottom:4px;
}
#holdDownloads {
	width:504px;
	height:424px;
	background-color:#524a41;
	color:white;
}
#holdDownloads table {
	width: auto;
}
#holdDownloads table img {
	display: block;
}
td.downloadIcons {
	vertical-align:bottom;
	height:27px;
}
#holdDownloads td.downloadDetails {
	vertical-align:middle;
	padding-left:27px;
}
td.downloadDetails h2 {
	font-size:16px;
}

#paging {
	height:19px;
	margin-top:98px;
	margin-bottom:17px;
}
.Paginator a,
.pageList .this-page  { padding: 2px 6px; text-decoration: none; }
.Paginator .AtStart   { padding: 2px 10px 2px 9px; color: #aaa; background:url('./img/prev-off.png') top left no-repeat; }
.Paginator .Prev      { padding: 2px 10px 2px 9px; background:url('./img/prev-off.png') top left no-repeat; }
.Paginator .Prev:hover { background:url('./img/prev-on.png') top left no-repeat; }
.Paginator .break     { padding: 2px 6px; border: none; text-decoration: none; }
.Paginator .Next      { padding: 2px 9px 2px 10px; background:url('./img/next-off.png') top left no-repeat;}
.Paginator .Next:hover { background:url('./img/next-on.png') top left no-repeat; }
.Paginator .AtEnd     { padding: 2px 10px 2px 9px; background:url('./img/next-off.png') top left no-repeat; }
.Paginator .this-page { padding: 2px 6px; border-color: #999; font-weight: bold; font-size: 13px; vertical-align: top; background-color: #000; color: #FFF; }
.Paginator a:hover    { color: #fff; background: #000; text-decoration: none;}

#projectHeadline {
	position:absolute;
	top:23px;
	right:0;
	height:31px;
	padding-top:76px;
	padding-bottom:4px;
}
#holdProjectCategs {
	position:absolute;
	top:134px;
	right:0;
	margin-right: 251px;
	height:425px;
}
#holdProjectCategs table {
	width: auto;
}
#holdProjectCategs table td {
	vertical-align: bottom;
}
#holdProjectCategs img {
	display:block;
}
#holdProjectCategs div {
	position:relative;
}
#holdProjectCategs div.dummy {
	/*min-width: 189px;*/
	height: 19px;
	line-height: 19px;
	text-align: right;
	padding-right: 25px;
}
#holdProjectImages {
	display: none;
}
.categDetails {
	position:absolute;
	bottom:0;
	right:0;
	display:block;
	width:19px;
	height:19px;
	background:url('./img/next-on.png') top left no-repeat;
}
#bigImage {
	position:absolute;
	bottom:0;
	right:0;
}
#holdProjectDetails {
	position:absolute;
	top:134px;
	right:0px;
	width: 251px;
    background-color: white;
    color: black;
}
#holdProjectDetails > div:first-child {
	padding: 15px;
	width: 221px;
	height: 160px;
}
#holdProjectDetails > div:first-child p {
	line-height: 15px;
}
#holdProjectDetails > div#theater {
	position:relative;
	overflow:hidden;
	width: 251px;
	height: 72px;
	padding: 6px 0;
	background: black;
}
#holdProjectDetails > div#theater div {
	height: 72px;
}
#holdProjectDetails > div#theater div.items div {
	margin-left: 6px;
}
#holdProjectDetails > div#theater a img {
	height: 72px;
	width: 119px;
	opacity: 0.4;
	filter:alpha(opacity=40);
}
#holdProjectDetails > div#theater a.active img {
	opacity: 1;
	filter:alpha(opacity=100);
}

#holdProjectDetails h1 {
	font-size:16px;
}
#triggerGallery {
	position:absolute;
	top: 69px;
	right: 251px
}
#templateKontakt #triggerGallery {
	right: 251px;
	top: 69px;
}
#templatePhilosophie #triggerGallery,
#templateCNC #triggerGallery,
#templateLeistungen #triggerGallery,
#templateTeam #triggerGallery,
#templateStandard #triggerGallery {
	top: 135px;
	right: 438px;
}
#templateImpressum #triggerGallery {
	top: 383px;
	right: 438px;
}
#templateBigger #triggerGallery {
	z-index: 100;
	right: 503px;
}
#homeGallery {
	position: relative;
	height:425px;
}
#homeGallery .nav {
	position: absolute;
	top: 50%;
	margin-top: -13px;
	right: 23px;
	width: 14px;
	height: 25px;
	z-index: 10;
}
#homeGallery .nav:first-child {
	left: 10px;
}
#homeGallery table {
	width: 100%;
	height: 425px;
}
#homeGallery table td {
	text-align: center;
	vertical-align: middle;
}
#homeGallery .prev {
	display:block;
	width:31px;
	height:31px;
	padding:5px;
	background:url('./img/left-big-off.png') center center no-repeat;;
}
#homeGallery .prev:hover {
	background-image:url('./img/left-big-on.png');
}
#homeGallery .next {
	display:block;
	width:31px;
	height:31px;
	padding:5px;
	background:url('./img/right-big-off.png') center center no-repeat;;
}
#homeGallery .next:hover {
	background-image:url('./img/right-big-on.png');
}
#holdText.holdReferences {
	padding-left:0px;
	padding-top:0px;
	padding-bottom:0px;
}
#holdText.holdReferences img {
	display:block;
}
.contentReference #paging {
	margin-top:0;
}
.referenceImage {
	width: 203px;
}
.referenceDetails {
	padding: 20px 30px 0 30px;
	vertical-align:middle;
	color: white;
}
.referenceDetails p {
	margin: 3px 0;
}
.referenceDetails h2 {
	font-size:18px;
	font-weight: bold;
}
.referenceDetails div {
	padding-top: 20px;
}
div.separator {
	padding: 20px 30px 0 30px;
	margin-bottom: 20px;
	border-bottom: solid #6b6b6b 1px;
}

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	height:425px;
	margin:0 auto;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accommodate scrollable items.
	it\'s enough that you set width and height for the root element and
	not for this element.
*/
.scrollable .items,
#theater .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
}
/*
	a single item. must be floated in horizontal scrolling.
	typically, this element is the one that *you* will style
	the most.
*/
.items div {
	float:left;
}
.scrollable .items div {
	height:425px;
	line-height:424px;
	width: 1005px;
}

.scrollable .items div img {
	vertical-align: middle; display:block;
}
#featured {
	position: absolute;
	bottom:0;
	left:0;
	width: 1005px;
	height:105px;
}
#featured img {
	display: block;
}
#featured td {
	width: 251px;
	height:105px;
}
.teaser {
	position: relative;
	height:105px;
	padding:14px;
	color:black;
}
.teaser a.button {
	position: absolute;
	right: 15px;
	bottom: 10px;
	width:7px;
	height:11px;
	background:url('./img/teaserDetails.png') top left no-repeat;
}
#teaser1 {
	background:#eeeeee;
}
#teaser2 {
	background:#eeeeee;
}



/*  STANDARD FORM AND ERROR MESSAGES  */
table.data_input .data_input {
	margin:0;
	width:310px;
}
table.data_input td 			   { padding:1px; }
table.data_input h2,
table.data_confirm h2 			   { margin:20px 0; font-size: 18px; }
table.data_input input.button_submit	   { font-size:12px; border:solid black 1px; font-family:LiberationSerif-Regular; margin:0; }
table.data_input .fieldRequired    { color:red; }
table.data_input .fieldError       { color:#b00; }
table.data_input .label_key        { text-decoration:underline; }
table.data_input .fieldInfo        { color:#575757; font-weight:normal; }
table.data_confirm td 			   { padding:1px; }
table.data_input select			   { font-family: "Swiss721",Times New Roman,Arial,Helvetica,sans-serif; font-size: 13px;  }
table.data_input input	 		   { border:solid #a6a6a6 1px; margin-bottom:2px; font-family: "Swiss721",Times New Roman,Arial,Helvetica,sans-serif; font-size: 13px;  }
table.data_input textarea		   { border:solid #a6a6a6 1px; width:250px; height:120px; font-family: "Swiss721",Times New Roman,Arial,Helvetica,sans-serif; font-size:13px; }
table.data_input input[type=radio] { border: none; }
table.data_input #messageBoxError  { margin-left:0px; }

/* Error Messages Box */
div.messageBoxError                {  min-height:48px; margin: 0; margin-top: 20px; margin-right: 20px; width: auto;
                                     background-color:#FFFFCC; background-image:url(img/icon_critalert.gif); background-position:20px 14px;
                                     background-repeat:no-repeat; border:1px solid #FFCC00; color:#C60000; padding:7px 40px 7px 80px;
									 -moz-border-radius:10px; }
div.messageBoxError ul             { padding-left:0px; }
div.messageBoxError ul li          { list-style-type:disc; padding:4px 4px 4px 0px; margin-left:13px;}
div.messageBoxError p              { margin:5px 0; }


/*  Client side error messages (Use the sliding doors method, .error_bg is the bg element and .error is the foreground element)  */
.error_bg                  { height:30px;position:absolute; display:block; background:url(img/errorTooltip1.png) left center no-repeat; color:white; padding-left:20px; min-width:200px; }
.error_bg .error           { display:block; width:100%; height:30px; position: absolute; left:9px; font-style:italic; font-weight:bold; font-size:11px;
							background:url(img/errorTooltip2.png) right center no-repeat; text-align: center;
							line-height:23px; /*  Use line-height to position the label in the middle  */ }
input.error,
textarea.error,
select.error                { border-color:red; }

.content.search {
	padding: 50px 0;
	position: relative;
	width: 100%;
}
.content.search h1 {
	margin-left: 50px;
}
#contentError {
	margin: 50px;
	margin-left: 100px;
	height: 446px;
	background: url('./img/404.png') right top no-repeat;
}
#contentError td {
	vertical-align: middle;
	padding-left: 30px;
}
#contentError a {
	color: #CC0000;
}


/* Begin Paging  */
.content.search .Pages{ text-align: center; margin-top:10px; }
.Pages a              { font-size: 14px; }
.Paginator            { font-size: 14px; padding-top: 10px; padding-left: 0px; padding-bottom: 10px; }
.Paginator a,
.Pages div.Results    { text-align: center; font-size: 14px; color: #000; margin-top: 8px; margin-bottom:40px; }
.Pages div.Results form,
.Pages div.Results form div { display:inline; z-index:100; }
.Pages div.Results select { font-size: 14px; }
/* End Paging  */


/* Begin Search Results*/
#searchResults { margin:30px auto 0; width: 710px; height: 350px; background: #393939; color: #BBB; padding: 30px;}
#searchResults ul li {line-height:15px; padding-bottom: 1em; }
#searchResults ul li a { color:#FFF; }
#searchResults ul li p { font-size: 14px; text-transform: uppercase; margin: 0;}
#searchResults .searchTerm { border-bottom: dotted 1px; color: white;  }
#searchResults .summary{margin-bottom:5px; font-size: 13px;}
/* End Search Results */


@media print {
	#top, #search, #footer, #print {
		display:none;
	}
}