﻿/**
 * Main styles for kunst-zu-wohnen.de
 */

@font-face {
  font-family:AllerRegular;
  src:url(../../fonts/aller_rg-webfont.woff);
}

@font-face {
  font-family:AllerLight;
  src:url(../../fonts/aller_lt-webfont.woff);
}

body {
	background-color:#494c51;
}

p, li {
	line-height:160%;
}

div, h2, h3, h4, p, li {
	font-family:AllerLight, Verdana;
}

#page {
	width:960px;
	margin:auto;
	padding:20px 0 0 0;
	position:relative;
	color:#ffffff;
}


/****************************************************************************************************************
 * Page parts
 */
 
#main-navigation {
	background-color:#494c51;
	float:left;
	position:absolute;
	top:87px;
	left:10px;
	z-index:3;
}

.page-1 #main-navigation {
	display:none;
}

#logo {
	float:right;
	z-index:5;
	margin-right:150px;
	position:relative;
}

#logo h1 {
	position:absolute;
	top:-200px;
}

#content {
	margin:88px 0 0 0;
	padding:10px;
	border:1px solid #85888d;
	height:505px;
	position:relative;
}

.page-7 #content {
	padding:40px 10px 10px 10px;
	height:475px;
}

footer {
	position:absolute;
	z-index:3;
	top:623px;
	left:10px;
	/*color:#85888d;*/
	color:#ffffff;
	width:100%;
}

footer #copyright {
	background-color:#494c51;
	margin-top:5px;
	padding:0 5px;
	/*font-size:0.7em;*/
	font-size:12px;
	float:left;
}

#meta-navigation {
	float:right;
	width:390px;
}

.page-1 #meta-navigation {
	display:none;
}

#content-bottom {
	margin-top:50px;
	padding:0 0 0 160px;
	/*olor:#85888d;*/
	color:#999999;
}


/****************************************************************************************************************
 * Navigation
 */

/**
 * Main navigation
 */
  
#main-navigation ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

#main-navigation ul li {
	float:left;
	margin:5px 10px 0 10px;
}

#main-navigation ul li a {
	color:#ffffff;
	text-decoration:none;
	/*font-size:0.9em;*/
	font-size:14px;
}

#main-navigation .ui-selecteditembar {
	height:5px;
	background-color:#cf4613;
}


/**
 * Meta navigation
 */

#meta-navigation ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

#meta-navigation ul li {
	float:left;
	margin-right:15px;
}

#meta-navigation a {
	display:block;
	width:24px;
	height:24px;
}

#meta-navigation .email {
	background-image:url(../../img/icon-email.png);
	background-repeat:no-repeat;
}

#meta-navigation .home {
	background-image:url(../../img/icon-home.png);
	background-repeat:no-repeat;
}

#meta-navigation a {
	text-decoration:none;
}


/****************************************************************************************************************
 * Content
 */

h3 {
	/*font-size:0.9em;*/
	font-size:14px;
	font-weight:normal;
}

ul {
	margin:0;
	padding:0 0 0 16px;
}

#content a {
	color:#ffffff;
	text-decoration:none;
	background-image:url(../../img/arrow_orange.png);
	background-repeat:no-repeat;
	background-position:right top;
	padding-right:15px;
}

#content a:hover {
	text-decoration:underline;
}

#content figure a {
	padding-right:0;
	background-image:none;
}
 
#content .image {
	float:left;
	width:560px;
	height:505px;
	background-color:#333333;
}

#content .text  {
	float:left;
	width:340px;
	margin:80px 0 0 10px;
}

#content .csc-textpic-text {
	margin-top:80px;
}

.page-7 #content .csc-textpic-text {
	margin-top:30px;
	margin-left:570px;
}

#content p,
#content ul,
#content-bottom p,
#content-bottom ul {
	/*font-size:0.9em;*/
	font-size:14px;
	margin:0 0 1em 0;
}

#content-bottom ul {
	list-style-image:url(../../img/arrow_white.png);
}

#content-bottom  h4 {
	color:#ffffff;
	/*font-size:0.9em;*/
	font-size:14px;
	margin:0;
}

#content-bottom  .left {
	width:480px;
	float:left;
	margin-right:50px;
}

#content-bottom  .right {
	width:220px;
	float:left;
}

.page-1 #content-bottom  .right {
	float:right;
}

#content-bottom  a {
	color:#ffffff;
	text-decoration:none;
}

#content-bottom  a:hover{
	color:#ffffff;
	text-decoration:underline;
}

#content-bottom .important {
	color:#ffffff;
}

.page-7 .csc-textpic-imagewrap {
	width:550px;
	margin-top:30px;
}

.page-7 .csc-textpic-intext-left-nowrap .csc-textpic-imagewrap {
	margin-right:20px
}

.page-7 .csc-textpic-imagewrap figure {
	float:right;
}


/****************************************************************************************************************
 * Image gallery
 */
 
#content .csc-textpic {
	/*overflow:visible;*/
}

.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
	margin:0 !important;
	padding:0 !important;
}

.imagegallery-btn-backward,
.imagegallery-btn-forward {
	width:50px;
	height:50px;
	position:absolute;
	top:225px;
	z-index:88;
	cursor:pointer;
}

.imagegallery-btn-backward {
	background-image:url(../../img/btn-prev.png);
}

.imagegallery-btn-forward {
	left:520px;
	background-image:url(../../img/btn-next.png);
}

.csc-textpic-caption {
	position:absolute;
	z-index:90;
	background-color:#cf4613;
	color:#d9d6d4;
	width:140px;
	opacity:0.8;
	/*font-size:0.9em;*/
	font-size:14px;
	font-weight:bold;
	padding:10px;
	top:100px;
	left:-50px;
}

.csc-textpic .orange .csc-textpic-caption  {
	background-color:#cf4613;
}

.csc-textpic .blau .csc-textpic-caption  {
	background-color:#1c307e;
}

.csc-textpic .oben-links .csc-textpic-caption  {
	top:80px;
	left:-50px
}

.csc-textpic .unten-links .csc-textpic-caption  {
	top:360px;
	left:-50px
}

.csc-textpic .oben-rechts .csc-textpic-caption  {
	top:80px;
	left:460px
}

.csc-textpic .unten-rechts .csc-textpic-caption  {
	top:360px;
	left:460px
}