@charset "UTF-8";

body
{
	margin: 0px;
	padding: 0px;
	background-color:#ffffff;
	background-image: url(bilder/dkpattern.png);
}


.gradient
{
	position: absolute;
	background-image:url(bilder/gradientbackground.png);
	background-size: 100% 100%;
	background-color: transparent;
	width: 100%;
	height: 100%;
  
  }
  
 .contactbutton
 {
	position: absolute;
	margin-top: 360px;
	margin-left: 220px;
	width: 120px;
	height: 30px;
	background-color: transparent;
	 
 }
 
 .oldwebpagebutton
 {
	position: absolute;
	margin-top: 400px;
	margin-left: 170px;
	width: 170px;
	height: 30px;
	background-color: transparent;
	 
 }


.header 
{
	background-image:url(bilder/middle.png);
	margin-left:auto;
	margin-right:auto;
	width: 800px;
	height: 517px;
  
  }
  
 .lamp 
{
	position:absolute;
	background-image:url(bilder/greenlamp.png);
	background-repeat:no-repeat;
	padding-left:31px;
	padding-top:7px;
	margin-top:478px;
	margin-left:424px;
	width: 200px;
	height: 31px;
	font-size:13px;
	color:#8B9DAC;
  
  }
  
  .service
  {
	position:absolute;
	padding-left:0px;
	padding-top:0px;
	margin-top:342px;
	margin-left:424px;
	width: 260px;
	height: 31px;
	font-size:13px;
	color:#8B9DAC;
  }
  
   .about
  {
	position:absolute;
	padding-left:0px;
	padding-top:0px;
	margin-top:158px;
	margin-left:422px;
	width: 257px;
	height: 150px;
	font-size:13px;
	color:#8B9DAC;
  }
  
     #aboutkursiv
  {
	font-size:13px;
	font-style:italic;
	font-weight:bold;
	color:#8B9DAC;
  }
  
     .featured
  {
	position:absolute;
	padding-left:0px;
	padding-top:0px;
	margin-top:170px;
	margin-left:118px;
	width: 300px;
	height: 150px;
	font-size:13px;
	color:#8B9DAC;
  }
  
  .blog
{
	float:left;
    background:url(bilder/blog-on.jpg)no-repeat;
	background-color:#9aa4b3;
	margin-top:125px;
	margin-left:695px;
	width: 133px;
	height: 56px;
	opacity:0;
	-webkit-transition: all 150ms ease;
	cursor: pointer;
}

.blog:hover
{
	background-position:10px 0;
    opacity:1;
}

.chat
{
	float:left;
    background:url(bilder/chat-on.jpg)no-repeat;
	background-color:#9aa4b3;
	margin-top:0px;
	margin-left:695px;
	width: 133px;
	height: 56px;
	opacity:0;
	-webkit-transition: all 150ms ease;
	cursor: pointer;
}

.chat:hover
{
	background-position:10px 0;
    opacity:1;
}

.flickr
{
	float:left;
    background:url(bilder/flickr-on.jpg)no-repeat;
	background-color:#9aa4b3;
	margin-top:0px;
	margin-left:695px;
	width: 133px;
	height: 56px;
	opacity:0;
	-webkit-transition: all 200ms ease;
	cursor: pointer;
}

.flickr:hover
{
	background-position:10px 0;
    opacity:1;
}

.twitter
{
	float:left;
    background:url(bilder/twitter-on.jpg)no-repeat;
	background-color:#9aa4b3;
	margin-top:0px;
	margin-left:695px;
	width: 133px;
	height: 56px;
	opacity:0;
	-webkit-transition: all 150ms ease;
	cursor: pointer;
}

.twitter:hover
{
	background-position:10px 0;
    opacity:1;
}



.nav 
{ 
	width: 800px;
	height: 32px;
	margin-left:auto;
	margin-right:auto;
	overflow:hidden;
}

.navcontact 
{ 
	width: 800px;
	height: 28px;
	margin-left:auto;
	margin-right:auto;
	overflow:hidden;
}

.showroom-left 
{ 
	float:left;
	margin-top: 75px;
	margin-left: 0px;
	width: 31px;
	height: 32px;
	opacity: 0.7;
	background-image:url(bilder/showroom-left.png);
	background-position: 0 0px;
	-webkit-transition: opacity 200ms linear;
	cursor: pointer;
}

.showroom-left:hover 
{ 
	width: 31px;
	height: 32px;
	opacity: 1;
	background-position: 0 0px;
	-webkit-transition: opacity 200ms linear;
}

.showroom-left:active
{ 
	background-position: 0 -32px;
	opacity: 1;
}

.showroom-right 
{ 
	float:left;
	margin-top: -132px;
	margin-left: 769px;
	width: 31px;
	height: 32px;
	opacity: 0.7;
	display:block;
	background-image:url(bilder/showroom-right.png);
	background-position: 0 0px;
	-webkit-transition: opacity 200ms linear;
	cursor: pointer;
}


.showroom-right:hover 
{ 
	width: 31px;
	height: 32px;
	opacity: 1;
	background-position: 0 0px;
	-webkit-transition: opacity 200ms linear;
}

.showroom-right:active
{ 
	background-position: 0 -32px;
	opacity: 1;
}


  
  

#open-on 
{
	margin-top: -32px;
	width: 100%;
	height: 32px;
	background-color: transparent;
}
  
#open-off 
{
	background-image:url(bilder/showroom-button.jpg);
	background-position: 0 0px;
	margin-top: 0px;
	width: 100%;
	height: 32px;
	background-color: transparent;
	cursor: pointer;
}
  
#close-on 
{ 
	top: 32px;
	width: 100%;
	height: 32px;
	background-color: transparent;
}
  
#close-off 
{ 
	background-image:url(bilder/showroom-button.jpg);
	background-position: 0 -38px;
	top: 0px;
	width: 100%;
	height: 32px;
	background-color: transparent;
	cursor: pointer;
}

#opencontact-on 
{
	margin-top: -28px;
	width: 100%;
	height: 28px;
	background-color: transparent;
}
  
#opencontact-off 
{
	background-image:url(bilder/contactme-button.jpg);
	background-position: 0 0px;
	margin-top: 0px;
	width: 100%;
	height: 28px;
	background-color: transparent;
	cursor: pointer;
}
  
#closecontact-on 
{ 
	top: 28px;
	width: 100%;
	height: 32px;
	background-color: transparent;
}
  
#closecontact-off 
{ 
	background-image:url(bilder/contactme-button.jpg);
	background-position: 0 -28px;
	top: 0px;
	width: 100%;
	height: 28px;
	background-color: transparent;
	cursor: pointer;
}


#box-off 
{ 
	background-image:url(bilder/showroom-back1.jpg);
	margin-left: auto;
	margin-right:auto;
	top: 0px;
	left: 0px;
	width: 800px;
	height: 0px;
	overflow:hidden;
	-webkit-transition: all 300ms ease;
}

#box-on
{
	background-image:url(bilder/showroom-back1.jpg);
	margin-left: auto;
	margin-right:auto;
    width: 800px;
    height: 200px;
	overflow:hidden;
	-webkit-transition: all 300ms ease;
}

#box-on-container
{
	float:left;
	margin-top: 20px;
	margin-left: 2px;
	background-color: transparent;
    width: 730px;
    height: 200px;
	overflow:hidden;
	-webkit-mask-image: url(bilder/slider-mask.png);
	-webkit-transition: all 500ms ease;
}

#box-off-content 
{ 
	margin-top: -200px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	top: 0px;
	left: 0px;
	width: 3650px;
	height: 0px;
	opacity: 0;
	background-color: transparent;
	-webkit-transition-property: opacity,margin-top, margin-left;
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 300ms;
	-webkit-transition-delay: 300ms,200ms, 0;
}

#box-on-content
{
	left: 50px;
	background-color: transparent;
	margin:10px;
    width: 3650px;
    height: 200px;
	opacity: 1;
	-webkit-transition-property: opacity, margin-top, margin-left;
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 300ms;
	-webkit-transition-delay: 300ms,200ms, 0;
} 

#boxcontact-off 
{ 
	background-image:url(bilder/contactback1.jpg);
	margin-left: auto;
	margin-right:auto;
	top: 0px;
	left: 0px;
	width: 800px;
	height: 0px;
	overflow:hidden;
	-webkit-transition: all 300ms ease;
}

#boxcontact-on
{
	background-image:url(bilder/contactback1.jpg);
	margin-left: auto;
	margin-right:auto;
    width: 800px;
    height: 321px;
	overflow:hidden;
	-webkit-transition: all 300ms ease;
} 

#contact-off
{
	margin-left:120px;
	margin-top: 0px;
    width: 320px;
    height: 310px;
    opacity: 0;
	-webkit-transition: all 300ms ease;
	overflow:hidden;
}

#contact-on
{
	margin-left:120px;
	margin-top: 0px;
    width: 320px;
    height: 310px;
    opacity: 1;
	-webkit-transition: all 300ms ease;
	overflow:hidden;
}

.download
{
	float: right;
	background-image:url(bilder/download-vcard.png);
	margin-right:95px;
	margin-top: -180px;
	background-color: transparent;
    width: 269px;
    height: 183px;
	opacity: 0;
	-webkit-transition: all 300ms ease;
}

.download:hover
{
	opacity: .7;
}

.download:active
{
	opacity: .9;
}


.footer
{
	margin-left: auto;
	margin-right:auto;
    width: 800px;
    height: 73px;
    font-size: 14px;
    font-family: Helvetica, Arial ;
    text-align:center; 
    color: #000000;
    } 

.projecttext
{
	position: absolute;
	margin-top:  5px;
	margin-left: 5px;
	height: 455px;
	width:  200px;
	font-size:14px;
	color:#8B9DAC;
}

#projecttextheader
{
	font-size:18px;
	font-weight: bold;
	color:#8B9DAC;
}

.projectlink
{
	float:  right;
	margin-top:  0px;
	margin-right: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 1px;
	height: 17px;
	width:  auto;
	font-size:14px;
	font-weight: bold;
	background-color: transparent;
	color:#8B9DAC;
	font-family: Times;
	font-style:  italic;
	font-size: 13px;
	color: #8B9DAC;
	text-align: center;
	opacity:  0.8;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-box-shadow: 0px 1px 0px #fff;	
	-webkit-transition: all 200ms ease;
	border: solid 1px #8B9DAC;
	cursor: pointer;
}

.projectlink:hover
{
	opacity:  0.6;
	background-color: #8B9DAC;
	color:  white;
	-webkit-transition: all 200ms ease;
	
}

.projectlink:active
{
	opacity:  0.8;
	background-color: #8B9DAC;
	color:  white;
	-webkit-transition: all 200ms ease;
	
}

.projectopen
{
	float:  right;
	margin-top:  270px;
	margin-right: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 1px;
	height: 17px;
	width:  auto;
	font-size:14px;
	font-weight: bold;
	background-color: transparent;
	color:#8B9DAC;
	font-family: Times;
	font-style:  italic;
	font-size: 13px;
	color: #8B9DAC;
	text-align: center;
	opacity:  0.8;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-box-shadow: 0px 1px 0px #fff;	
	-webkit-transition: all 200ms ease;
	border: solid 1px #8B9DAC;
	cursor: pointer;
}

.projectopen:hover
{
	opacity:  0.6;
	background-color: #8B9DAC;
	color:  white;
	-webkit-transition: all 200ms ease;
	
}

.projectopen:active
{
	opacity:  0.8;
	background-color: #8B9DAC;
	color:  white;
	-webkit-transition: all 200ms ease;
	
}
.divider
{
	position: absolute;
	margin-top:  10px;
	margin-left: 215px;
	background-image: url(bilder/divider.jpg);
	height: 468px;
	width:  18px;
}

.diashow
{
	position: absolute;
	margin-top:  5px;
	margin-left: 240px;
	height: 480px;
	width:  505px;
}

#imagefx
{
	opacity:  0.7;
	-webkit-transition: all 300ms ease;
	
}

#preload
{
	display:  none;
	
}

#imagefx:hover
{
	opacity:  1;
	-webkit-transition: all 300ms ease;
	
}

#imagefx:active
{
	opacity:  0.8;
	-webkit-transition: all 300ms ease;
	
}

a:link 
{
	text-decoration:none;
}
a:visited 
{
	text-decoration:none;
}
a:active 
{
	text-decoration:none;
}
a:hover 
{
	text-decoration:none;
}