@charset "utf-8";

*{
	margin: 0px;
    padding: 0px;
    border: 0px;
    outline: 0px;
    box-sizing: border-box;
	transition: all 550ms;
    transition-duration: 150ms;
    transition-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
    transition-delay: 0ms;
    transition-property: all;
	color: var(--gold_dark);
	font-family: Times,serif;
}

:root{
	--gold_dark: #c07a2e;
	--gold_light: #fde2b8;
}	
		
hr{
	clear: both;
}

main,
header,
footer{
	margin: auto;
	width: 950px;
}
	
.mainBox.cartBox{
	width:750px;
}

.mainBox.asideBox{
	width:200px;
}

.asideBox div{
	float: left;
	width: 64px;
	padding-top: 600px;
}

.asideBox div img{
	width: 64px;
	height: 64px;
}

header #vastu_Slogan{
	padding: 30px 0px;
}

header #vastu_Slogan h1{
	font-size: 2em
}

	
header #vastu_Slogan h1 span{
	font-size: 1.2em;
}

header #vastu_Slogan h2{
	font-size: 1em
}

header #vastu_Slogan h2 span{
    height: 50px;
    display: block;
    font-size: 50px;
    padding-top: 20px;
    color: #7c4f1f;
}

header #vastu_Slogan h2 span.index {
    height: 50px;
    font-size: 1em;
    color: var(--gold_dark) !important;
    padding: 0px;
}

header #vastu_Slogan .logobox,
header #vastu_Slogan .sloganbox{
	display: block;
	float: left;
}

header #vastu_Slogan .logobox img,
header #vastu_Slogan .logobox{
	width: 75px;
	height: 75px;
}


header #vastu_Slogan .sloganbox {
	width: 600px;
	line-height: 30px;
	text-align: center;
}
	
	
	
header #vastu_Subnav{
	text-align: right;
}
	
main{
	height: 750px;
	position: relative;
}
	
.mainBox{
	float: left;
}
	
h1,
h2,
h3,
h4{
	text-transform: uppercase;
	letter-spacing: 3px;
}

#vastu_en h1 span{letter-spacing: 1px;}
	
a{
	text-decoration: none;
	text-align: center;
}
	
.cart.carttext{
	background-color: var(--gold_light);
}
	
	
button{
	cursor: pointer;
}
    
.cart1,
.cart2,
.cart3,
.cart4,
.cart5,
.cart6,
.cart7,
.cart8,
.cart9{
	background: #fbedd6;
}
	
.cart{
	width: 240px;
	height: 240px;
	float: left;
	margin: 5px;
	border: solid var(--gold_dark) 2px;
	display: block;	
}
	
.cart:hover{
	box-shadow: var(--gold_dark) 0 0 30px;
}

.cart.textoff:hover{
	box-shadow: #ffffff 0 0 30px;
}

#cart1,
#cart2,
#cart3,
#cart4,
#cart5,
#cart6,
#cart7,
#cart8,
#cart9{
	margin: 0px;
	padding: 0px;
	height: 0px;
	width: 0px;
	overflow: hidden;
	border: none;
}

.cart1 #cart1,
.cart2 #cart2,
.cart3 #cart3,
.cart4 #cart4,
.cart5 #cart5,
.cart6 #cart6,
.cart7 #cart7,
.cart8 #cart8,
.cart9 #cart9{
	display: block;
	background: red;
	width: 750px;
	height: 750px;
	z-index: 1;
	background-color: var(--gold_light);
	box-shadow: var(--gold_dark) 0 0 30px;
}
	
div.cart:not(div.cart.cartoff){		  
	position: absolute;
	top: 50%;
	left: 39.5%;
	transform: translate(-50%, -50%);
}

.navButton{
	width: 50px;
	height: 50px;
	border-radius: 50px;
	font-size: 1.2em;
	line-height: 50px;
	font-weight: 900;
	position: absolute;
}
	
.navButton:hover{
	font-size: 2em;
}
	
.navButton.close{
	top: 15px;
	right: 15px;
}
	
.navButton.left{
	bottom: 100px;
	transform: translate(0%, -50%);
	left: 15px;
}

.navButton.right{
	bottom: 100px;
	right: 15px;
	transform: translate(0%, -50%);
}
	
	
.cart img{
	display: block;
	width:100%;
	height: 80%;
}

.cart.carttext img{
	height: 100%;
}
	
.cart h3{
	display: block;
	width:100%;
	height: 20%;
	background-color: var(--gold_light);
}
	
div.cart h3 {
	text-align: center;
	line-height: 140px;
	font-size: 3em;
}

.cart1 div.cart:not(#cart1),
.cart2 div.cart:not(#cart2),
.cart3 div.cart:not(#cart3),
.cart4 div.cart:not(#cart4),
.cart5 div.cart:not(#cart5),
.cart6 div.cart:not(#cart6),
.cart7 div.cart:not(#cart7),
.cart8 div.cart:not(#cart8),
.cart9 div.cart:not(#cart9){
	width: 700px;
	height: 700px;
} 

.cart1 .mainBox.asideBox,
.cart2 .mainBox.asideBox,
.cart3 .mainBox.asideBox,
.cart4 .mainBox.asideBox,
.cart5 .mainBox.asideBox,
.cart6 .mainBox.asideBox,
.cart7 .mainBox.asideBox,
.cart8 .mainBox.asideBox,
.cart9 .mainBox.asideBox,
.cart1 button.cart,
.cart2 button.cart,
.cart3 button.cart,
.cart4 button.cart,
.cart5 button.cart,
.cart6 button.cart,
.cart7 button.cart,
.cart8 button.cart,
.cart9 button.cart{
    opacity: 0;
}

a img,
button img{
	height: 192px;
}

a h3,
button h3{
	height: 48px;
	line-height: 48px;
	font-weight: 100;
}

.cart.carttext,
.cart.carttext:hover{
  box-shadow: 0 0 0 #fff !important;
}

.onbox{
    width: 750px;
    height: 750px;
    font-size: 2em;
    padding: 100px;
}

button p{
    text-align: left;
    padding-left: 7px;
}

.logo_left,
.logo_right{
  	position: relative;
    top: -8px;
}

.logo_left{
  	left: 65px;
}


.logo_right {
  	right: 65px;
}


#vastu_de .asidebox.en,
#vastu_en .asidebox.de,
#vastu_de .asideBox.en,
#vastu_en .asideBox.de{
    display: none !important;
}

a.tel:hover ~ a,
a.mail:hover ~ a{
    display: none;
}
a.tel:hover:after,
a.mail:hover:after{
    position: absolute;
    padding-left: 5px;
}
a.tel:hover:after{
    content: '+49 2432 985 99 39';
}

a.mail:hover:after{
    content: 'christian.schweizer@vastu.team';
}


h4{    font-size: 20px;}
    

.cart.cartoff.textoff{
 width: 740px;
   height: 740px;
  overflow: auto;
  padding: 50px;
}


.textoff span{
    background: #fbedd6;
  padding: 15px;
  display: block;
}

.footer_logobox{padding: 615px 0 0 2px;} 
.footer_navbox{padding: 600px 0 0 5px;} 





@media only screen and (max-width: 939px) {
  .mainBox {
    float: none;
  }
  
  header #vastu_Slogan {
    padding: 60px 0px 30px 0px;
}
  
  .asidebox {
    position: absolute;
    top: 20px;
    right: 15px;
}
 
  .asideBox div {
     padding-top: 0px;
}
  
  main, header, footer {
    width: 750px;
}
  
  div.cart:not(div.cart.cartoff) {
    left: 50%;
}

.mainBox.asideBox {
    width: 260px;
}

.asideBox div {

    width: 70px;
}

.footer_navbox a {
    display: block;
    text-align: revert;
    width: 90px;
}

  
}

@media only screen and (max-width: 739px) {
.cart {
    float: none;
    margin: 30px auto;    
	width: 320px;
  height: 320px;
  position: relative;
  }
  
  button.cart {
  z-index: -1000;
  }
  
   button.cart:after {
    content: '';
    display: block;
	width: 320px;
 	 height: 320px;
    position: absolute;
    top: 0;
    z-index: 1000;
}
  
  .mainBox.cartBox {
    width: 100%;
    margin: auto;
}
  
  header #vastu_Slogan h1,
  header #vastu_Slogan h2 span{
    font-size: 1.5em;
}

  .logo_left{
  display:none;
  }
  
  header #vastu_Slogan .logobox img, header #vastu_Slogan .logobox {
    position: absolute;
    top: 15px;
}
  
  header #vastu_Slogan {
    padding: 130px 0px 0 0px;
}
  
  header #vastu_Slogan .sloganbox {
    width: 100%;

}
  
  main, header, footer {
    width: 100%;
}
  
  .cart.cartoff.textoff {
    width: auto;
    height: auto;

    padding: 50px;
    border: 0px;
  }

  
button p {
    padding-left: 20px !important;
    font-size: 14px !important;
}

.mainBox.asideBox {
    padding-left: 25px;
    padding-bottom: 25px;
  }
  a h3, button h3 {
    line-height: 58px;
}
  
  .linedubble {
    padding-top: 14px !important;
}
  
  main {
    height: auto;
    position: static;
}
  
.logo_right{
    left: 25px !important;
}
  
}


.linedubble {
    line-height: 1;
    padding-top: 8px;
}

.linedubble.big {
    line-height: 45px;
    padding-top: 25px;
}

.linedubble.inner {
    line-height: 1 !important;
    padding-top: 26px;
}