﻿



.tabs {
   margin:70px auto 0;	width: 98%;
	
}
#InhaltAlle .tabs {
   margin: 0;	width: auto;
}
.tabs input {
	position: absolute; 	z-index: 1000;
	width: 215px;   height: 40px;   left: 10px;   top: 0px;
	opacity: 0;
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
	cursor: pointer;
}
.tabs input#tab-2{
	left: 5px; /* 120px */
}
.tabs input#tab-3{
	left: 5px; /* 240px */
}
.tabs input#tab-4{
	left: 5px; /* 360px */
}
.tabs label {
    background: white none repeat scroll 0 0;
    box-shadow: 0 0 10px 0 #ccc;
	background-color: rgba(222, 222, 222,1);
	/*background: -moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5ba4a4), color-stop(100%,#4e8c8a));
	background: -webkit-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%);
	background: -o-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%);
	background: -ms-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%);
	background: linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%);*/
	/*font-size: 15px;*/
    background: rgba(0, 0, 0, 0) -moz-linear-gradient(center top , #fff 0%, #efefef 75%) repeat scroll 0 0;
    /*border: 1px dotted #eaeaea;*/
	line-height: 50px;
	height: 49px; 	position: relative;
	padding: 0 20px; float: left; display: block;
	width: 100%; /* 80px */
	/*color: #385c5b;*/
	letter-spacing: 1px; 	text-transform: uppercase; 	font-weight: bold; 	text-align: center;
	text-shadow: 1px 1px 1px rgba(255,255,255,0.3);
    border-radius: 0;
    /*box-shadow: 2px 0 2px rgba(0,0,0,0.2), -2px 0 2px rgba(0,0,0,0.2);*/
}
.tabs label:after {
    content: '';
	background: #fff;
	position: absolute; bottom: -2px; left: 0;
	width: 100%;	height: 0;
	display: block;
}
.tabs input:hover + label {
	/*background: #5ba4a4;*/
	/* background: rgb(2, 92, 136); Old browsers */
	/* background: -moz-linear-gradient(top,  rgba(0, 32, 65,1) 0%, rgba(2, 92, 136,1) 100%); FF3.6+ */
	/*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0, 32, 65,1)), color-stop(100%,rgba(2, 92, 136,1)));  Chrome,Safari4+ */
	/* background: -webkit-linear-gradient(top,  rgba(0, 32, 65,1) 0%,rgba(2, 92, 136,1) 100%); Chrome10+,Safari5.1+ */
	/*background: -o-linear-gradient(top,  rgba(0, 32, 65,1) 0%,rgba(2, 92, 136,1) 100%);  Opera 11.10+ */
	/* background: -ms-linear-gradient(top,  rgba(0, 32, 65,1) 0%,rgba(2, 92, 136,1) 100%); IE10+ */
	/*background: linear-gradient(to bottom,  rgba(0, 32, 65,1) 0%,rgba(2, 92, 136,1) 100%);  W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#939393', endColorstr='#434343',GradientType=0 );  IE6-9 */
	/*text-shadow:0 1px 1px rgba(0,0,0,0.4);*/
	color: #0069A6;
}
.tabs label:first-of-type {
   z-index: 4;
   /*box-shadow: 2px 0 2px rgba(0,0,0,0.1);*/
}
.tab-label-2 {
   z-index: 3;
}
.tab-label-3 {
   z-index: 2;
}
 .tab-label-4 {
   z-index: 1;
}
 .tabs input:checked + label {
    background: #fff;
    text-shadow: 0px 0px 0px rgba(255,255,255,0);
    line-height: 55px;
    color: #0069A9;
	z-index: 6;
}
.tabs label.empty {
    display: none;
    visibility: hidden;
}
.tabs .clear-shadow {
	clear: both;
}
.tabs .content {
   /*background: #fff;*/
   width: 100%; padding-top:1em;
   border-top: 1px solid #efefef;
	z-index: 5;
   /*box-shadow: 0 -2px 3px -2px rgba(0,0,0,0.2), 0 2px 2px rgba(0,0,0,0.1);*/
   /*border-radius: 0 3px 3px 3px;*/
}
.tabs .content > br {
    display: none;
}
.tabs .content div {
	height:auto;
	/*position: absolute; top: 0; left: 0;*/
	padding: 10px 0;
	z-index: 1;
   opacity: 1;
   -webkit-transition: opacity linear 0.1s;
   -moz-transition: opacity linear 0.1s;
   -o-transition: opacity linear 0.1s;
   -ms-transition: opacity linear 0.1s;
   transition: opacity linear 0.1s;
}
.tabs input.tab-selector-1:checked ~ .content .content-1,
.tabs input.tab-selector-2:checked ~ .content .content-2,
.tabs input.tab-selector-3:checked ~ .content .content-3,
.tabs input.tab-selector-4:checked ~ .content .content-4 {
	z-index: 100;
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: opacity ease-out 0.2s 0.1s;
   -moz-transition: opacity ease-out 0.2s 0.1s;
   -o-transition: opacity ease-out 0.2s 0.1s;
   -ms-transition: opacity ease-out 0.2s 0.1s;
   transition: opacity ease-out 0.2s 0.1s;
	/*border:1px solid red;*/
}
.tabs input.tab-selector-1:checked ~ .content .content-2,
.tabs input.tab-selector-1:checked ~ .content .content-3,
.tabs input.tab-selector-1:checked ~ .content .content-4,
.tabs input.tab-selector-2:checked ~ .content .content-1,
.tabs input.tab-selector-2:checked ~ .content .content-3,
.tabs input.tab-selector-2:checked ~ .content .content-4,
.tabs input.tab-selector-3:checked ~ .content .content-1,
.tabs input.tab-selector-3:checked ~ .content .content-2,
.tabs input.tab-selector-3:checked ~ .content .content-4,
.tabs input.tab-selector-4:checked ~ .content .content-1,
.tabs input.tab-selector-4:checked ~ .content .content-2,
.tabs input.tab-selector-4:checked ~ .content .content-3 {
	display:none;
}

/*#Inhalt .content div p {
	font-size: 14px;
	line-height: 22px;
	font-style: italic;
	text-align: left;
	margin: 0;
	color: #777;
	padding-left: 15px;
	font-family: Cambria, Georgia, serif;
	border-left: 8px solid rgba(63,148,148, 0.1);
}*/
.content-1, .content-2, .content-3, .content-4 {
	width:98%;
	/*display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;   justify-content:space-between;   align-items:flex-start;*/
	margin:0 10px;
}
.content-3 .LogosVeranstalter {
	height:250px;
}
.content-1 span, .content-2 span, .content-3 span, .content-4 span {
	/*width:50%;*/
	float:left;
}
.StandardreiseDetail span ul {
	display:list-item;
	height:auto; width:auto;
	text-align:left;
	margin-bottom:25px;
}
.content-1 p, .content-2 p, .content-3 p, .content-4 p {
	width:100%;
	float:left;
}
.content-1 p img, .content-2 p img, .content-3 p img, .content-4 p img {
	width:95%;
}

.tabs h2 {
    margin-top: 0;
}

.ReiseprogrammHeader,
.ReiseprogrammHeader strong {
    color: #0069A9;
}

@media only screen and (min-width: 481px) 
{

.tabs label {
	width: 200px; /* 80px */
}
.tabs input#tab-2{
	left: 225px; /* 120px */
}
.tabs input#tab-3{
	left: 440px; /* 240px */
}
.tabs input#tab-4{
	left: 535px; /* 360px */
}

}
