/* 
	this code has been written for stephan-siegrist.ch
	this means you may not use it for you site's design.
  	thank you. 

	author: franz walter / franz.walter@studio-nanuuq.com
*/
   
/* @group layout */



/* main page layout*/

*, body {
	margin:0;
	padding:0;   
}

body {                    
	background: #222;   
	line-height: 1.6;
	color: #191919;
	color: rgba(0,0,0,1);
	-webkit-text-size-adjust: none; 
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

a {
	color:#000;
	text-decoration: none;
	outline: none;  
}                       

a:hover, a:focus {
	text-decoration: none;
}
	
a:visited {

}

img {
	border:none;
}

.clear {
	clear: both;
}

#wrapper {overflow:hidden!important;height:100%;position:absolute;top:0;left:0;}

.body {
	width: 100%;
	z-index:100;  
	position: relative;                      
}

body#home .body {  
	position: absolute;                             
	bottom:0px; 
	left:0px;
}  
      	 

h1 a.white {	
	position:absolute;
	top: 15px;
	left: 0px;
	width: 340px;
	height: 60px;
	display: block;
	background: url('../images/core/ci_dhs.png') top left no-repeat;
	z-index: 1000;
	text-indent: -5000px;
	overflow: hidden;
}

body#home h1 a.white {	
	top: 15px;
}

.fb a {
	position:absolute;
	display: block;
	width:100px;
	height:32px;
	background: url('../images/fb.gif') top left no-repeat;
	top: 0px;
	right:10px;
	z-index: 1000;
	text-indent: -5000px;
	overflow: hidden;
}

article {
	width: 100%;
	display: block;	
}

.inner-container h2 {
	font-size: 182%;
	padding-left: 60px;
	color: #222222;
	padding-bottom: 0px;
	line-height: 22px;
	text-transform:uppercase;
}

body.projects h2,body.projects h3 {
	color:#FFF!important;
}

.inner-container h3 {
	font-size: 85%;
	text-transform: uppercase;
	letter-spacing: 1px;
	color:#666666;
	padding-left: 60px;
	padding-top: 0px;
	margin-top: 5px;
	margin-bottom: 0px;
}

.inner-container .header {
	padding-top: 50px;
}

.inner-container p {
	margin-bottom: 8px;
}

/* .inner-container p strong {
	font-weight: normal;
	background: #fefce3;
	padding:2px;
} */

/* @group one-pager layout */

.content-container {
    font-size: 93%;
	width: 480px;
	top: 0px;
	margin:0 auto;
	padding-top: 120px;
	margin-bottom: 50px;
}

.inner-container {
	position: relative;
	margin-left: 6px;
	width: 460px;
	background: transparent url(../images/white80p.png);
	background: rgba(255,255,255,0.9);
	/*border: 5px solid #CCC;*/
	padding-bottom: 20px;
	-webkit-box-shadow: rgba(0,0,0,.6) 0px 2px 12px;
	-moz-box-shadow:  rgba(0,0,0,.6) 0px 2px 12px;;
}

.outer-column {margin-top:150px;background:#FFF!important;z-index:400;min-height:300px;padding-top:20px;}


.inner-container .column {
	padding-left: 20px;
	width: 440px;
	overflow: hidden;	
	float: left;
}

.inner-container .column.second {
	padding-left: 30px;
	width: 440px;
}


/* @end */



/* @group background */

#loading {
	position: absolute;
	top: 38.5%; 
	left: 47.5%;
	z-index: 3;
	width: 24px; 
	height: 24px;
	text-indent: -999em;
	background-image: url(../images/core/progress.gif);
}
#supersize{
	position:fixed; 
	data-position="fixed"
	bottom:0px;    
	overflow:hidden!important;
	height:100%!important; 
	
}
#supersize img, #supersize span {
	height:100%;
	width:100%;            
	position:absolute;
	z-index: 0;
}   

#supersize .prevslide, #supersize .prevslide img {
	z-index: 1;   
	
}
#supersize .activeslide, #supersize .activeslide img {
	z-index: 2;
}

#supersize .overlay {width:100%;height:100%;position:absolute;top:0;left:0;}
 
#supersize .overlay img {width:100%;height:100%; z-index:1000;}
   
/* @end */


/* @group navigation */		

nav {
	display:block;
	width:100%;

}
    
.navigation {
font-size:14px;
	width:100%;
	z-index:1000;
	min-height:20px;
	background-image: url(../images/core/nav_bg.png);
}      

body.menu .navigation, body.designer .navigation, body.access .navigation, body.contact .navigation {
	position: absolute;
	top: 85px;
}


.navigation ul.main {   
	margin:0 auto;
	max-width:990px;
	display:block;   
	height:50px!important; /* MIN-HEIGHT */
	overflow:hidden;
	padding-left:50px;
} 
 
ul.main li {
	float:left;
}

ul.main > li:first-child {
	margin-left:10px;
}

ul.main li a {
	height:23px!important;
	
	font-weight: bold;
	text-transform: uppercase;
	display:block;      
	color:#877867;
	margin-right: 23px;      
	padding-top:12px;  
	overflow:hidden!important;
}

ul a:hover, ul a.active { color:#F6E1D9!important;}

ul a:active { color: #F6E1D9;}


/* @end */



/* @end */





/* @group responsive layout  */

@media handheld and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 600px)  {
	/*layouts smaller than 600px, iPhone and mobiles*/
	
}

@media screen and (min-width: 920px) {
	/*layouts larger than 900px*/

}
	
@media screen and (min-width: 1350px) {
	/*layouts larger than 1300px*/
}
	
@media screen and (min-width: 1500px) {
	/*layouts larger than 1600px*/
	
}	

@media only screen and (max-device-width: 480px) {
	/*layouts for iphone*/

}

@media only screen and (max-device-width: 480px) and (-webkit-device-pixel-ratio: 2){
	/*layouts for iphone4*/
	
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	/*iPad styles*/
	
}


/* @end */


.teaser_popup {
	background: #000;
	-webkit-box-shadow: rgba(0,0,0,.6) 0px 2px 12px;
	-moz-box-shadow:  rgba(0,0,0,.6) 0px 2px 12px;;
	width: 610px;
	height: 343px;
	position: relative;
	display: none;

}

#backtotop  {

}

.backtotop a {
	position: absolute;
	display: block;
	bottom: 0px;
	right: 20px;
	width: 50px;
	height: 45px;
	text-indent: -5000px;
	background: url(../images/core/back_to_top.png) top left no-repeat;	
}


.footer{
display: block;
position:absolute;
overflow:hidden;
width: 100%;
height: 35px;
margin: 0px;

}

.copyright{
display: block;
	position: absolute;
	overflow: hidden;
	bottom:11px;
	right:15px;
	width: 245px;
	height: 7px;
	font-size: 77%;
	text-indent: -9999px;
	background-image: url('../images/core/copyright.png');
}







/*MENU*/

hr{
	display:none;
}

#ancillary{
    font-size:12px;
	width:420px;
	margin-top: 0px;
	
	float: left;
	clear: both;
	padding-bottom: 50px;
}

#ancillary .block{
	float:left;
	width: 360px;
	margin-left: 50px;
	
}

#ancillary .first, * html #ancillary .first{
  clear:both;
  margin-left: 50px;
}
#ancillary .block-separator{
  clear:both;
  height:2.5em;
}

#ancillary .block h4{
	display:block;
	font-size: 138.5%;
	margin:0 0 0 0;
	color: #191919;
	list-style-type:none;
	margin:0px;
	padding-top: 30px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #888888;
	text-align: left;
}

ul.dates{
	list-style-type:none;
	margin: 0px 0 10px 0;
}
ul.dates li{
	list-style-type:none;
	margin:0px;
	padding-top: 7px;
	padding-right: 5px;
	padding-bottom: 7px;
	padding-left: 5px;
	text-align:left;
	
}


.mname{
clear:both;
	float: left;
}

.price{
clear:right;
	width:50px;
	float: right;
}

.proviso{
clear:both;
float: left;
	
	font-size: 85%;
}


/*STUFF*/

#staff-container{
	width:266px;
	font-size: 85%;
	margin-top: 70px;
	margin-left: 100px;
	padding-bottom: 50px;
}

.pld {
	float:left;
	display:block;
	width:230px;
	height:300px;
	background-color:#FFF;
	padding:15px;
	margin:0 10px 10px 0;
	font-weight:bold;
	line-height:120%;
	 -moz-box-shadow: 2px 2px 1px rgba(0,0,0,0.09);
  -webkit-box-shadow: 2px 2px 1px rgba(0,0,0,0.09);
  box-shadow: 2px 2px 1px rgba(0,0,0,0.09);
  text-transform:uppercase;
}

.pld img {
	margin:0;
	padding:0;
}

.pld dl {
	margin-top:-10px;
}

.post {
	color:#666;
	font-size:93%;	
	margin:10px 0 0 0;
	padding:0;
	text-transform:uppercase;
}

.name {
	color:#191919;
	font-size:100%;
	margin:0 0 0 0;
	padding:0;
}

.sns {
	float:right;
	margin-top:10px;
}

.sns img {
	
}


/*ACCESS*/

.adress{
width: 360px;
margin-left: 60px;
margin-top: 50px;
}

.map{
	zoom: 66.6%;
	margin-left: 25px;
}

.gmap{
	border: 0;
	top: 50%;
	left: 50%;
	width: 112px;
	height: 42px;
	margin-top: 20px;
	margin-left:180px;
	margin-bottom: 0px;