/*
Theme Name: Pankonin & Sandham
Theme URI: http://www.rheinschmiede.de/
Description: Wordpress theme for Pankonin & Sandham
Version: 1.0
Author: Sven Wagener
Author URI: http://www.rheinschmiede.de/
Text Domain: Pankonin & Sandham
*/
@charset "utf-8";
/* CSS Document */

/*******************************
*	general settings
*******************************/
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family:Arial;
	/*background-image:url(images/bg-gradient.png);
	background-repeat:repeat-x;*/
	/* background-attachment:fixed; */
	background-color:#cccfd0;
	color: #6f767a;
}
h1{
	margin:0;
	padding:0;
}
h2{
	margin:0;
	padding:0;
}
h3{
	margin:0;
	padding:0;
}
h4{
	margin:0;
	padding:0;
}
h5{
	margin:0;
	padding:0;
}
h6{
	margin:0;
	padding:0;
}
p{
	margin:0;
	padding:0;
}
a{
	color:#6F767A;
	text-decoration:none;
}
a:hover{
	color:#008acf;
	
}
.body{
	background-image:url(images/bg-long.jpg);
	background-repeat:repeat-x;
	background-attachment:fixed;
}
.bodystart{
	background-image:url(images/bg-gradient-start.png);
	background-repeat:repeat-x;
	background-attachment:fixed;
}
#site{
	width:870px;
	margin:auto;
}
/*******************************
*	head
*******************************/
#head{
	position:fixed;
	top:0;
	height:136px;
	background-image:url(images/bg-head.gif);
	background-color:#FFFFFF;
	z-index:10;
}
#headbg{
	height:135px;
	position:fixed;
	background-color:#FFFFFF;
	top:0;
	z-index:0;
	width:100%;
}
#umbrellamenue{
	height:20px;
	border-top:1p solid #f3f4f4;
	margin:0 10px;
	width:850px;
}
#logo{
	height:58px;
	padding:5px 0 0 0;
	margin:0 10px;	
	width:850px;
}
#headgradient{
	background-image:url(images/verlauf_top_s.png);
	background-repeat:repeat-x;
	height:33px;
}
/*******************************
*	menue top
*******************************/
#menuetop{
	font-size:12px;	
	font-weight:bold;
	border-bottom:1px solid #858f93;
	height:26px;
	margin:0 10px;
	width:850px;
	color: #525f66;
}
#menuetop a{
	text-decoration:none;
	color: #525f66;
}
#menuetop ul{
	list-style-type:none;
	padding:0;
	margin:0;
}
#menuetop ul li{
	float:right;
	margin:0 0 0 20px;
	padding:6px 0 0 0;
	font-size:12px;
	font-family:Arial;
	border-top:1px solid #FFFFFF;
}
#menuetop .active{
	border-top:1px solid #00131e;
	color: #00131e;
}
#menuetop .active a{
	color: #00131e;
}
#menuetop .active a:hover{
	color: #00131e;
}
#menuemain{
	width:635px;
	float:left;
}
#menuesub{
	width:205px;
	float:right;
}
#menuebottom{
	height:25px;
	font-size:12px;
	font-weight:bold;
	margin:0 6px 0 10px;
}
#menuebottom .active{
	border-bottom:1px solid #00131e;
	color: #00131e;
	line-height:24px;
}
#menuebottomleft{
	width:635px;
	float:left;
}
/* Mousover menue */
#menuebottomleft ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
#menuebottomleft ul li{
	position: relative;
}
/* Hidden part */
#menuebottomleft li ul {
	position: absolute;
	left: 0px;
	top: 24px;
	border-bottom:1px solid #ccc;
	display:none;
}
/* List point in hidden menue */
#menuebottomleft li ul li{
	margin:0;
	border-bottom:0;
	background-color: #fff;
}
/* List point anchor in hidden menue */
#menuebottomleft ul li ul a{
	display: block;
	text-decoration: none;
	color: #777;
	padding: 0 5px 0 25px;
	line-height:25px;
	width:127px;
	border-bottom:0;
	border-top:0;
	margin:0;
	padding:0 0 0 20px;
}
#menuebottomleft ul a:hover{
	background: #008acf;	
	color: #FFF;
}
#menuebottomleft li:hover .dropdown{
	border: 1px solid #ccc;
	width:122px;
	border-bottom:0;
}
#menuebottomleft li:hover ul { 
	display: block;
}
.dropdown{
	float:left;
	width:125px;
	/*border: 1px solid #ccc;*/
	padding: 0 5px 0 20px;
	background-image:url(images/dropdown-list-arrow.png);
	background-repeat:no-repeat;
	background-position:5px 7px;
}
.menueindustrial{
	background-image:url(images/rectangle-blue-8x3.png);
	background-repeat:no-repeat;
	background-position:5px 15px;
	border:1px solid #ccc;
}
.menueergonomy{
	background-image:url(images/rectangle-green-8x3.png);
	background-repeat:no-repeat;
	background-position:5px 15px;
	border:1px solid #ccc;
}
.menueinterface{
	background-image:url(images/rectangle-orange-8x3.png);
	background-repeat:no-repeat;
	background-position:5px 15px;
	border:1px solid #ccc;
}
.menuecorporate{
	background-image:url(images/rectangle-magenta-8x3.png);
	background-repeat:no-repeat;
	background-position:5px 15px;
	border:1px solid #ccc;
}
#menuebottomright{
	width:205px;
	float:right;
}
#menuebottom ul{
	list-style-type: none;
	padding:0;
	margin:0;
}
#menuebottom ul li{
	float:left;
	margin:2px 10px 0 0;
	font-size:13px;
	font-family:Arial;
	line-height:23px;
	border-bottom:1px solid #FFFFFF;
}
#menuebottomright ul li{
	float:right;
	margin:1px 0 0 10px;
	font-size:12px;
	font-family:Arial;
	line-height:24px;
}
#menuebottom a{
	text-decoration:none;
	color: #525f66;
}
#menuebottomright{
}
#imgnav{
	width:52px; 
	padding:4px 0 0 0;
	float:right;
}
#pagina{
	float:right;
	margin-right:20px;
	line-height:25px;
	font-family:Arial, Helvetica, sans-serif;
	color:#6F767A;	
}
/*******************************
*	Content
*******************************/
#content{
	padding:141px 0 0 0;
	z-index:5;
}
#contenttop{
}
/*******************************
*	Content
*******************************/
.headlines{
	margin:0 10px 0px 10px;
	padding:0 0 7px 0;
	height:68px;
}
.headlines h1{
	padding:0;
	margin:20px 0 0 -3px;
	font-size:25px;
	line-height:30px;
	font-family:"Arial Narrow", Arial;
	font-weight:normal;
	color:#434c51;
}
.headlines h2{
	padding:0;
	margin:0 0 8px -3px;
	font-size:25px;
	line-height:30px;	
	font-family:"Arial Narrow", Arial;
	font-weight:normal;	
	color:#82888c;
}
.noheadlines{
	height:28px;
}
.greyline{
	border-top:1px solid #cccfd0;
	padding: 0;
	height:1px;
}
/*******************************
*	Teaser
*******************************/
#teaserimage{
	margin:0 5px;
	width:860px;
	height:305px;
}
#teaserbox{
	width:350px;
	cursor: pointer;
}
#teaserboxstart{
	width:348px;
	height:1px;
	background-color:#FFFFFF;
	margin:auto;
}
#teaserboxcontent{
	width:310px;
	background-color:#FFFFFF;
	padding:13px 20px;
	font-weight:normal;
	cursor: pointer;
}
#teaserboxlink{
	width:310px;
	background-color:#FFFFFF;
	padding:0px 20px 15px 20px;
	display:none;
}
#teaserboxlink a{
	font-family:Arial;
	font-style:italic;
	text-decoration:none;
	font-size:13px;
	font-weight:bold;
	line-height:14px;
	padding:0;
	margin:0;
	color:#778086;
}
#teaserboxlink a:hover{
	color:#cf0073;
}
#teaserboxlink p{
	padding:0;
	margin:0;
}
#teaserboxend{
	width:348px;
	height:1px;
	background-color:#FFFFFF;
	margin:auto;
	clear:both;
}
#teaserboxcontent h3{
	font-family:"Arial Narrow", Arial;
	font-size:20px;
	font-weight:normal;
	line-height:23px;
	padding:0;
	margin:0;
	color:#cf0073;
	text-transform:uppercase;
	letter-spacing:1px;
	cursor: pointer;
}
#teaserboxcontent p{
	font-family:Arial;
	font-size:13px;
	font-weight:normal;
	line-height:23px;
	padding:0;
	margin:0;
	color:#778086;
	cursor: pointer;
}
#teaserboxcontent h3 a{
	font-family:"Arial Narrow", Arial;
	font-size:20px;
	font-weight:normal;
	line-height:23px;
	padding:0;
	margin:0;
	color:#cf0073;
	text-transform:uppercase;
	letter-spacing:1px;
	cursor: pointer;
	text-decoration:none;
}
#teaserboxcontent p a{
	font-family:Arial;
	font-size:13px;
	font-weight:normal;
	line-height:23px;
	padding:0;
	margin:0;
	color:#778086;
	cursor: pointer;
	text-decoration:none;
}

/*******************************
*	Buttons
*******************************/
#buttons{
	margin:35px 5px 0 5px;
	font-family:"Arial Narrow", Arial;
	font-size:20px;
	line-height:24px;
	color:#828c92;
}
#buttons a{
	text-decoration:none;
	color:#828c92;
}
.button01{
	width:215px;
	height:131px;
	background-image:url(images/button-industrial-design.png);
	background-repeat:no-repeat;
	background-position:bottom;
	float:left;
	cursor: pointer;
}
.button02{
	width:215px;
	height:131px;
	background-image:url(images/button-ergonomie.png);
	background-repeat:no-repeat;
	background-position:bottom;
	float:left;
	cursor: pointer;	
}
.button03{
	width:215px;
	height:131px;
	background-image:url(images/button-interface-design.png);
	background-repeat:no-repeat;
	background-position:bottom;
	float:left;
	cursor: pointer;	
}
.button04{
	width:215px;
	height:131px;
	background-image:url(images/button-corporate-design.png);
	background-repeat:no-repeat;
	background-position:bottom;
	float:left;
	cursor: pointer;
}
.buttoncontent{
	width:157px;
	border-top: 1px solid #cccfd0;
	margin:0 5px;
	padding:20px 26px 20px 22px;
	z-index:0px;
	position:relative;
	top:0;	
}
.buttoncontentover{
	width:157px;
	border-top: 1px solid #cccfd0;
	font-size:13px;
	line-height:17px;
	margin:0 5px;
	padding:20px 26px 20px 22px;
	z-index:5px;
	position:relative;
	top:0;
	display:none;
	font-family:Arial, Helvetica, sans-serif;
	color:#263136;
}
.buttoncontentover b{
	color:#263136;
}
/*******************************
*	Projects
*******************************/
#projects{
	margin:0 5px;	
}
.project{
	width:215px;
	height:200px;
	background-image:url(images/button-projects-bg.png);
	background-position:bottom;
	float:left;
	margin:28px 0 -2px 0;
	cursor: pointer;	
}
.projecthead{
	border-top:1px solid #cccfd0;
	height:5px;
	margin:0 5px;
}
.pojectpic{
	width:205px;
	height:120px;
	margin:0 5px;
}
.projectcolorbar01{
	border-left:#FFFFFF 4px solid;
	border-top:#FFFFFF 2px solid;
	background-color:#ef0083;
	width: 13px;
	height: 3px;
	float:right;
	margin-top:115px;
}
.projectcolorbar02{
	border-left:#FFFFFF 4px solid;
	border-top:#FFFFFF 2px solid;
	background-color:#f48100;
	width: 13px;
	height: 3px;
	float:right;
	margin-top:115px;
}
.projectcolorbar03{
	border-left:#FFFFFF 4px solid;
	border-top:#FFFFFF 2px solid;
	background-color:#4dc504;
	width: 13px;
	height: 3px;
	float:right;
	margin-top:115px;
}
.projectcolorbar04{
	border-left:#FFFFFF 4px solid;
	border-top:#FFFFFF 2px solid;
	background-color:#0049b9;
	width: 13px;
	height: 3px;
	float:right;
	margin-top:115px;
}
.pojecttext{
	width:165px;
	padding:10px 20px;
	margin:0 5px;
}
.pojecttext p{
	font-family:Arial;
	font-size:13px;
	color:#263136;
	padding:0;
	margin:0;
}
.pojecttext h4{
	padding:0;
	margin:0;
	font-family:Arial;
	font-weight:bold;
	font-size:13px;	
	color:#263136;
}
.pojecttext a{
	color:#263136;
	text-decoration:none;
}
.pojecttext a:hover{
	color:#008acf;	
}
.projectcontentover{
	padding: 30px 20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	line-height:17px;
	color:#263136;
	display:none;
}
.projectcontentovertext{
	height:120px;
}
.projectcontentoverlink{
	height:40px;
}
.projectcontentover p{
	padding:0;
	margin:0;
}
.projectcontentover a{
}
.projectcontentover a:hover{
	color:#008acf;	
}
.projectcontentover strong{
	font-weight:bold;
}
.projectcontentover a{
	text-decoration:none;
	font-style:italic;
	color:#263136;
}
/*******************************
*	Project
*******************************/
#project{
}
#projectcontent{
}
#projectsubcontent{
	margin:18px 0 0 0;	
}
#projectsubcontent .projectleft .content{
	margin:0 5px;
}
#projectpic{
	width:645px;
	height:445px;
	background-image:url(images/bg-project-pic.png);
	background-position: center;
	background-repeat:no-repeat;
	margin:4px 0 0 0;
}
#projectpicnavi{
	position:relative; 
	top:0px; 
	left:5px; 
	z-index:1; 
	width:635px; 
	height:440px;
}
#projectpicnavileft{
	float:left;
	width:50%;
	text-align:left;
}
#projectpicnaviright{
	float:right;
	width:50%;
	text-align:right;
}
#projectpicfile{
	position:relative;
	top:-440px;
	left:5px;
	z-index:0;
	width:635px;
	height:440px;
}
#projectpicsubtext{
	margin: 10px 5px 0 5px;
	font-size:15px;
	line-height:23px;
	font-family:Arial, Helvetica, sans-serif;
	color:#6F767A;
	min-height:46px;
}
.projectleft{
	width:645px;
	float:left;
	margin-left:5px;	
}
.projectleft .greyline{
	margin: 0 5px;
}
.projectleft .content .greyline{
	margin: 0;
}
.projectright{
	width:205px;
	float:right;
	margin: 0 10px 0 5px;
	font-size:15px;
	font-weight:bold;
	line-height:23px;
	font-family:Arial, Helvetica, sans-serif;
}
.projectright h4{
	margin:20px 0 0 0;
	font-weight:bold;	
}
.projectright p{
	font-weight:normal;
}
.projectright .image{
	height:440px;
}
.projectright .greyline{
	margin: 0;
}
#colors{
}
#colors .projectcolorbar01{
	background-color:#ef0083;
	width: 13px;
	height: 3px;
	margin:3px 0  20px;
}
#colors .projectcolorbar02{
	background-color:#f48100;
	width: 13px;
	height: 3px;
	margin:3px 0  20px;
}
#colors .projectcolorbar03{
	background-color:#4dc504;
	width: 13px;
	height: 3px;
	margin:3px 0  20px;
}
#colors .projectcolorbar04{
	background-color:#0049b9;
	width: 13px;
	height: 3px;
	margin:3px 0  20px;
}
/* Data */
.projectright .data{
	margin: 2px 0 20px 0;
	font-size: 13px;
	font-family:Arial, Helvetica, sans-serif;
	color:#6F767A;
	font-weight:bold;
	line-height:18px;
}
.projectright .data .dataproperty{
	width:65px;
	float:left;
}
.projectright .data .datavalue{
	width:140px;
	float:right;
	color:#263136;
}
.projectright .text{
	font-size:13px;
	font-weight:bold;
	line-height:18px;
	color:#6F767A;
}
.projectright .text p{
	font-size:13px;
	font-weight:bold;
	line-height:18px;
	color:#6F767A;
}
/* Short Info */
#shortinfo{
	padding:4px 0 0 0;
	font-family:Arial, Helvetica, sans-serif;
	color:#6F767A;
}
#shortinfo h4{
	margin:22px 0 0 0;
}
/* Preview pictures */
#picsone{
	position:absolute;
	top:618px;
	width:215px;
}
#picsone .greyline{
	margin: 0 10px 0 0;
}
#picstwo{
	position:absolute;
	top:585px;
	width:215px;
}
#picstwo .greyline{
	margin: 0 10px 0 0;
}
#picsthree{
	position:absolute;
	top:548px;
	width:215px;
}
#picsthree .greyline{
	margin: 0 10px 0 0;
}
#pics .greyline{
	width:205px;
}
#picsnav{
	width:56px; 
	padding:3px 6px 0 0;
	float:right;
}
#picsone #picgrid{
	background-image:url(images/bg-img-grid-one.png);	
	width:212px;
	height:38px;
	margin-top:8px;
	margin-left:-4px;	
}
#picstwo #picgrid{
	background-image:url(images/bg-img-grid-two.png);	
	width:212px;
	height:75px;
	margin-top:8px;
	margin-left:-4px;	
}
#picsthree #picgrid{
	background-image:url(images/bg-img-grid.png);
	width:212px;
	height:112px;
	margin-top:8px;
	margin-left:-4px;	
}
.picpicgrid{
	margin:0 0 4px 4px;
	float:left;
	width:48px;
	height:33px;
}
.picpicgridactive{
	margin:-1px 0 4px 4px;
	float:left;
	width:48px;
	height:33px;
	border-top: #263136 1px solid;
}
/* Website */
#website{
	position:absolute;
	top:677px;
	line-height:23px;
	color: #6F767A;
	padding:0 0 20px 0;
}
/* Project Content Text */
.content{
	font-family:Arial, Helvetica, sans-serif;
	color:#00131E;
}
.content h3{
	font-size:25px;
	font-family:"Arial Narrow", Arial;
	margin:14px 0 0 0;
	font-weight:normal;
}
.content p{
	line-height:23px;
	font-size:15px;
	font-family:Arial, Helvetica, sans-serif;
	margin:0;
}
/* Grey box */
.greybox{
	width:213px;
	margin:30px 0 0 -3px;
	font-size:15px;
	line-height:23px;
	font-family:Arial, Helvetica, sans-serif;
	color:#6F767A;
}
.greybox p{
	padding:0;
	margin:0;
	font-weight:normal;
}
.greybox h4{
	padding:0;
	margin:0;
	font-weight:bold;
}
.greybox .greyboxtop{
	height:1px;
	background-image:url(images/greybox-top.png);
}
.greybox .greyboxcontent{
	background-image:url(images/greybox-content.png);
	background-repeat:repeat-y;
	padding:13px;
}
.greybox .greyboxend{
	background-image:url(images/greybox-end.png);
	height:5px;
}
/*******************************
*	Page
*******************************/
#page{
	margin:0;
}
.pageleft{
	width:640px;
	float:left;
	margin:0 5px 0 10px;
}
.pageleft p{
	font-family:Arial, Helvetica, sans-serif;
	color:#263136;
	line-height:24px;
}
/* Page Content Text */
.pageleft h3{
	font-size:25px;
	font-family:"Arial Narrow", Arial;
	margin:14px 0 0 0;
	font-weight:normal;
}
.pageleft h4{
	font-size:25px;
	font-family:"Arial Narrow", Arial;
	margin:14px 0 0 0;
	font-weight:normal;
}
.pageleft p{
	line-height:23px;
	font-size:15px;
	font-family:Arial, Helvetica, sans-serif;
	margin:0;
}
.pageright{
	width:200px;
	float:right;
	margin:0 10px 0 5px;;	
}
.pageright p{
	font-family:Arial, Helvetica, sans-serif;
	color:#263136;
	line-height:24px;
}
.pageright .greyline{
	margin:0 0 20px 0;
}
.pageintro{
	margin:0 10px;
}
.pageintro p{
	margin:30px 0 15px 0;
	font-family:Arial, Helvetica, sans-serif;
	color:#90969;
	font-weight:bold;
	font-size:15px;
	line-height:24px;
}
.pageleft .greyline{
	margin:0 0 20px 0;
}
/*******************************
*	Footer
*******************************/
#footer{
	margin:35px 10px 300px 10px;
	width:850px;
	border-top:1px solid #858f93;
	font-weight:bold;
	font-size:12px;
	font-family:Arial;
}

#footer a{
	text-decoration:none;
}
#footermenueleft{
	float:left;
}
#footermenueleft ul{
	margin:0;
	padding:0;
	list-style-type:none;
}
#footermenueleft ul li{
	float:left;
	margin:6px 20px 0 0;
	padding-bottom:4px;
}
#footermenueright{
	float:right;
}
#footermenueright .active{
	border-bottom: 1px solid #00141e;	
}
#footermenueright .active a{
	color:#00141e;
}
#footermenueright ul{
	margin:0;
	padding:0;
	list-style-type:none;
}
#footermenueright ul li{
	float:left;
	margin:6px 0 0 20px;
	padding-bottom:4px;
}
#footermenueright a{
	color:#747f84;
}
.iconhome{
	background-image:url(images/icon-home.png);
	background-repeat:no-repeat;
	background-position:0px 2px;
	padding:0 0 0 15px;
}
.iconhome a{
	color:#747f84;
}
.iconhomeactive{
	background-image:url(images/icon-home-on.png);
	background-repeat:no-repeat;
	background-position:0px 2px;
	padding:0 0 0 15px;
	border-bottom: 1px solid #00141e;	
}
.iconhomeactive a{
	color:#00141e;
	border-bottom:1px #00141e;
}
.icontop{
	background-image:url(images/icon-top.png);
	background-repeat:no-repeat;
	background-position:0px 2px;
	padding:0 0 0 14px;
}
.icontop a{
	color:#747f84;
}
.icontopactive{
	background-image:url(images/icon-top-on.png);
	background-repeat:no-repeat;
	background-position:0px 2px;
	padding:0 0 0 14px;
	border-bottom: 1px solid #00141e;	
}
.icontopactive a{
	color: #00141e;
}
.iconsitemap{
	background-image:url(images/icon-sitemap.png);
	background-repeat:no-repeat;
	background-position:0px 2px;
	padding:0 0 0 15px;
}
.iconsitemap a{
	color:#747f84;
}
.iconsitemapactive{
	background-image:url(images/icon-sitemap-on.png);
	background-repeat:no-repeat;
	background-position:0px 2px;
	padding:0 0 0 15px;
	border-bottom: 1px solid #00141e;	
}
.iconsitemapactive a{
	color: #00141e;
}
/*******************************
*	Styles for HTML sitemap generator
*******************************/
.ddsg-pagenav{
	margin:0 0 20px 0;
}
.ddsg-wrapper div{
	display:none;
}
.switchdiv{
	cursor:pointer;
}
.switchtext{
	border-bottom: 1px solid #CCCFD0;
	padding:0 0 15px 0;
}