html, body{
    width:100%;
    height:100%;
    background-color:#fff;
	
    }
    
    
    
    
.carousel-inner,.carousel,.item,.fill {
  height:100%;
  width:100%;
  background-position:center center;
  background-size:cover;
}
.slide-wrapper{display:inline;}
.slide-wrapper .container{padding:0px;}

/*------------------------------ vertical bootstrap slider----------------------------*/

.carousel-inner> .item.next ,  .carousel-inner > .item.active.right{ transform: translateY(100%); -webkit-transform: translateY(100%); -ms-transform: translateY(100%);
-moz-transform: translateY(100%); -o-transform: translateY(100%);  top: 0;left:0;}
.carousel-inner > .item.prev ,.carousel-inner > .item.active.left{ transform: translateY(-100%); -webkit-transform: translateY(-100%);  -moz-transform: translateY(-100%);
-ms-transform: translateY(-100%); -o-transform: translateY(-100%); top: 0; left:0;}
.carousel-inner > .item.next.left , .carousel-inner > .item.prev.right , .carousel-inner > .item.active{transform:translateY(0); -webkit-transform:translateY(0);
-ms-transform:translateY(0);-moz-transform:translateY(0); -o-transform:translateY(0); top:0; left:0;}

/*------------------------------- vertical carousel indicators ------------------------------*/
.carousel-indicators{
position:absolute;
top:0;
bottom:0;
margin:auto;
height:20px;
right:10px; left:auto;
width:auto;
}
#VerticalSlide .carousel-indicators li{display:block; margin-bottom:5px; border:1px solid (0,0,0,0.3); }
#VerticalSlide .carousel-indicators li.active{margin-bottom:5px; background:(0,0,0,0.3);}

#VerticalSlide .carousel-indicators li {
 border-color: rgba(0,0,0,0.3);
}
#VerticalSlide .carousel-indicators li.active {
 background-color: rgba(0,0,0,0.3);
}



.carousel-indicators li.active,
    .carousel-indicators li {
    border-radius: 15px;
     height: 15px;
  width: 15px;
}



/*-------- Animation slider ------*/

.animated{
	animation-duration:3s;
	-webkit-animation-duration:3s;
	-moz-animation-duration:3s;
	-ms-animation-duration:3s;
	-o-animation-duration:3s;
	visibility:visible;
	opacity:1;
	transition:all 0.3s ease;
}


.slide-wrapper{
	position: static;
}


#VerticalSlide{
	position: absolute;
	z-index: 1;
	top:0px;
}



#VerticalSlide2{
	position: absolute;
	left: 40%;
	width:210px;
	height: 420px;
	z-index: 2;
	top:200px;
	
}








#VerticalSlide2 .carousel-img img{
	width: 210px;
}

.phone {
    left: -120px;
    position: absolute;
    top: -60px;
    width: 350px;
    z-index: 3;
}







/********** SLIDER TEXT **************/
.SliderItemTextBig {
 text-transform: uppercase;
 font-size:4vw;
 font-weight: 600;
 color: rgba(0,0,0,0.3);
 font-family: Arial Black,Arial Bold,Gadget,sans-serif;
 z-index: 1;
 position: relative;
 min-height: 100vh;
 max-height: 100vh;
 top:6vh;
 left: 2vw;
}

.SliderText {
 position: absolute;
 z-index: 2;
 top:30vh;
 right:10vw;
 width:30vw;
 z-index: 99;
}
.SliderTextUeberschrift {
 font-size: 42px;
 margin-bottom:40px;
 font-weight:300;
}
.SliderTextUeberschriftWhite {
 font-size: 42px;
 margin-bottom:40px;
 font-weight:300;
 color:#fff;
}


.SliderTextSpan {
 font-size: 28px;
 line-height: 34px;
 max-width:320px;
 font-weight:300;
}

.SliderTextSpanWhite {
 font-size: 28px;
 line-height: 34px;
 max-width:320px;
 font-weight:300;
 color:#fff;
}










/************ ITEM SLIDE 1 ****************/
.ItemSlide1,
.Rotate0to-20 {
 position: absolute;
 z-index: 3;
 -webkit-animation:Rotate0to-20 1s linear 1;
 -moz-animation:Rotate0to-20 1s linear 1;
 animation:Rotate0to-20 1s linear 1;
 transform: rotate(-20deg);
}
@-moz-keyframes Rotate0to-20 {
 from {
  transform: rotate(0deg);
 }
 to {
  transform: rotate(-20deg);
 }
}
@-webkit-keyframes Rotate0to-20 {
 from {
  transform: rotate(0deg);
 }
 to {
  transform: rotate(-20deg);
 }
}
@keyframes Rotate0to-20 {
 from {
  transform: rotate(0deg);
 }
 to {
  transform: rotate(-20deg);
 }
}
.Slide1Gold {
 bottom: 35vh;
 left: 10vw;
 top: auto;
}
.Slide3Plant {
 right:auto;
 left: -20vw;
 bottom:10vh;
}

/************ ITEM SLIDE 2 ****************/
.ItemSlide2,
.Rotate0deg
 {
 position: absolute;
 z-index: 4;
 top: 70vh;
 left:10vw;
 -webkit-animation:Rotate0deg 1s linear 1;
 -moz-animation:Rotate0deg 1s linear 1;
 animation:Rotate0deg 1s linear 1;
 transform: rotate(0deg);
}
@-moz-keyframes Rotate0deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(0deg);
 }
}
@-webkit-keyframes Rotate0deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(0deg);
 }
}
@keyframes Rotate0deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(0deg);
 }
}
.Slide1Glasses {
 bottom: 20vh;
 left: 10vw;
 top: auto;
}


/************ ITEM SLIDE 3 ****************/
.ItemSlide3,
.Rotate-20deg {
 position: absolute;
 z-index: 5;
 -webkit-animation:Rotate-20deg 1s linear 1;
 -moz-animation:Rotate-20deg 1s linear 1;
 animation:Rotate-20deg 1s linear 1;
 transform: rotate(-20deg);
}
@-moz-keyframes Rotate-20deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(-20deg);
 }
}
@-webkit-keyframes Rotate-20deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(-20deg);
 }
}
@keyframes Rotate-20deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(-20deg);
 }
}
.Slide1Coffe {
 bottom: -50vh;
 left: auto;
 right: 10vw;
 top: auto;
}
.Slide2Silver {
 top: 60vh;
 right: 10vw;
}
.Slide3Glasses {
 right: 5vw;
 left: auto;
 z-index: 999;
 top: 50vh;
}
.Slide3Lamp {
 top: -150px;
 right: -200px;
}



/************ ITEM SLIDE 4 ****************/
.ItemSlide4,
.Rotate-120deg {
 position: absolute;
 z-index: 5;
 left:auto;
 right:5vw;
 -webkit-animation:Rotate-120deg 1s linear 1;
 -moz-animation:Rotate-120deg 1s linear 1;
 animation:Rotate-120deg 1s linear 1;
 transform: rotate(-120deg);
}
@-moz-keyframes Rotate-120deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(-120deg);
 }
}
@-webkit-keyframes Rotate-120deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(-120deg);
 }
}
@keyframes Rotate-120deg {
 from {
  transform: rotate(90deg);
 }
 to {
  transform: rotate(-120deg);
 }
}
.Slide3Paper {
 top: 20vh;
 bottom:-20vh;
 right: -160px;
}
.Slide4Gold {
 bottom: 10vh;
 top:auto;
 left: 20vw;
}
.Slide4Gold img {
 width:200px;
}
.Slide4USB {
 bottom: auto;
 top:20vh;
 right: 5vw;
}


/************ ITEM SLIDE 5 ****************/
.Slide5Phone {
 bottom: -480px;
 top:auto;
 left: 5vw;
}
.Slide5Pink {
 top:auto;
 left: 10vw;
 bottom:40vh;
}


/*********************** ITEM SLIDE 6 **********/
.Slide6Paper {
 bottom: -5vh;
 top: 60vh;
 right:-5vw;
 left: auto;
}
.Slide6Dreieck {
 bottom: 0vh;
 top: 60vh;
 right:5vw;
 left: auto;
 z-index: 20;
}
.Slide6Gold {
 bottom: 10vh;
 top: auto;
 left:10vw;
 right: auto;
}


/****************** ITEM SLIDE 7 *****************/
.Slide7Silver {
 bottom: 40vh;
 z-index: 20;
 left:10vw;
}
.Slide7mouse {
 bottom: 40vh;
 z-index: 20;
 right:20vw;
 left: auto;
 top: 60vh;
}
.Slide7eraser {
 bottom: 20vh;
 z-index: 20;
 right:30vw;
 left: auto;
 top: auto;
}






@media(max-width:1400px){

	#VerticalSlide2{
	position: absolute;
	left: 35%;
	width:210px;
	height: 420px;
	z-index: 2;
	top:160px;
	
}


.Slide1Coffe {
 bottom: -60vh;
 left: auto;
 right: 0vw;
 top: auto;
}

.Slide1Glasses{
	left:-5vw;
}

#VerticalSlide img{
	width: 60%;
}

.Slide4Gold{
	left: 3vw;
}



}









@media(max-width:898px){

	#VerticalSlide2{
 height: 240px;
    left: 20px;
    position: absolute;
    top: 220px;
    width: 120px;
    z-index: 2;
	
}


.Slide1Coffe {
 bottom: -80vh;
 left: auto;
 right: 10vw;
 top: auto;
}

.Slide1Glasses{
	left:-5vw;
}

#VerticalSlide img{
	width: 30%;
}

.Slide4Gold{
	left: 3vw;
}


#VerticalSlide2 .carousel-img img{
	width: 140px;
}

.phone {
    left: -68px;
    position: absolute;
    top: -34px;
    width: 240px;
    z-index: 3;
}

.phone img{
	width: 200px;
}

.Slide1Gold{
	bottom: 3vw;
}

.SliderText {
    position: absolute;
    right: 20vw;
    top: 30vh;
    width: 30vw;
    z-index: 99;
}

}






.SliderItemTextBig{
	display: none;
}



#depot .col-sm-6{
	margin-top: 80px;
}