

#bildslider {
	
	position:relative; display:block; width:100%; height:700px;
}

#slideshow {
	position:absolute;
    height: 700px;
    width: 100%;
    line-height: 1.3;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.slider{
    position: relative;
    overflow: hidden;
    height: 100%;
    width: 100%;
}

.slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
		transform: scale(1.2);
    transition: all 2s ease-in-out;
		overflow:hidden;
}

.slide.current {
    opacity: 1;
		transform: scale(1);
}

.slide .content {
    position: absolute;
    bottom: 70px;
    left: -600px;
    opacity: 0;
    width: 600px;
    background-color: rgba(255, 255, 255, 0.7);
    color: #333;
    padding: 15px;
}

.slide .content h2 {
    margin-bottom: 6px;
		color: #545454;

		font-size: 30px;
		font-weight: 800;
}



.slide .content p {

		color: #545454;

		font-size: 18px;

}


.slide.current .content {
    opacity: 1;
    transform: translateX(600px);
    transition: all 1s ease-in-out 1s;
}



.buttons button#next {
    position: absolute;
    top: 40%;
    right: 15px;
}

.buttons button#prev {
    position: absolute;
    top: 40%;
    left: 15px;
}

.buttons button {
    border: 2px solid #545454;
    background:rgba(150, 150, 150, 0.75);
    color: #eee;
	font-size:30px;
    cursor: pointer;
    padding: 0px 10px 5px 10px;
    border-radius: 50%;
    outline: none;
}

.buttons button:hover {
	background-color: #434343;
	color: #FFF;
}

@media (orientation: portrait) {
	.slide .content {
		bottom: -300px;
		left: 0; right:0;
		width:100%;
		padding:5px;
	}

	.slide .content h2 { font-size:20px; margin-bottom:0px;}
		.slide .content p { font-size:13px;}	
	.slide.current .content {
		transform: translateY(-300px);
	}
	#bildslider {height:70vw;}
	#slideshow {height:70vw; }
	.slider {height:100%; }
	.buttons button#next {top:30vw;}
	.buttons button#prev {top:30vw;}
}

.onoffswitch {
	position: absolute;
	top: 10%;
	right: 15px;
	width: 78px;
  -webkit-user-select:none; -moz-user-select:none;
	-ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    height: 36px; padding: 0; line-height: 36px;
    border: 2px solid #666; border-radius: 36px;
    background-color: #999;
    transition: background-color 0.3s ease-in;
}
.onoffswitch-label:before {
    content: "";
    display: block; width: 36px; margin: 0px;
    background: #ff5555;
    position: absolute; top: 0; bottom: 0;
    right: 37px;
    border: 2px solid #666; border-radius: 36px;
    transition: all 0.3s ease-in 0s; 
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
        background:rgba(100, 100, 100, 0.95);
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
       background:rgba(150, 150, 150, 0.75);
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
    right: 0px; 
}