﻿      /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */
    @import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300|Open+Sans:400italic,600italic,400,300,600);
    @import url(https://fonts.googleapis.com/css?family=Roboto);
    /*@import url(ttp://weloveiconfonts.com/api/?family=entypo);*/

/*@font-face {
	font-family: "entypo";
  src: url('fonts/entypo.eot'); 
  src: url('fonts/entypo.eot?#iefix') format('embedded-opentype'), 
       url('fonts/entypo.woff2') format('woff2'), 
       url('fonts/entypo.woff') format('woff'), 
       url('fonts/entypo.ttf') format('truetype'), 
       url('fonts/entypo.svg#svgFontName') format('svg'); 
		}*/

/*@font-face {
        font-family: 'entypo';  
        src: url('../font/fontello.eot?76429583');  
        src: url('../font/fontello.eot?76429583#iefix') format('embedded-opentype'),       
        url('../font/fontello.woff2?76429583') format('woff2'),       
        url('../font/fontello.woff?76429583') format('woff'),       
        url('../font/fontello.ttf?76429583') format('truetype'),       
        url('../font/fontello.svg?76429583#fontello') format('svg');  
        font-weight: normal;
        font-style: normal;
}*/

@font-face {
        font-family: 'entypo';  
        src: url('fonts/entypo.eot?76429583');  
        src: url('fonts/entypo.eot?76429583#iefix') format('embedded-opentype'),       
        url('fonts/entypo.woff2?76429583') format('woff2'),       
        url('fonts/entypo.woff?76429583') format('woff'),       
        url('fonts/entypo.ttf?76429583') format('truetype'),       
        url('fonts/entypo.svg?76429583#fontello') format('svg');  
        font-weight: normal;
        font-style: normal;
}


/*@font-face { 
	font-family: "MuseoLight";

  src: url('fonts/Museo300-Regular-webfont.eot'); 
  src: url('fonts/Museo300-Regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/Museo300-Regular-webfont.woff2') format('woff2'), 
       url('fonts/Museo300-Regular-webfont.woff') format('woff'), 
       url('fonts/Museo300-Regular-webfont.ttf')  format('truetype'), 
       url('fonts/Museo300-Regular-webfont.svg#svgFontName') format('svg'); 

		}*/

/*

font-family: 'Source Sans Pro', serif;

font-family: 'Open Sans', sans-serif;

font-family: 'entypo', sans-serif;

*/
/* entypo */
/*[class*="entypo-"]:before {*/
[class*="icon-"]:before {
  font-family: 'entypo', sans-serif;
  margin: 0 5px 0 0;
}

* {
    box-sizing: border-box;
}



a.read {
	background: #5094F2;
	color:#fff;
	text-decoration:none;
	font-size:15px;
	font-weight:300;
	padding:0.5em 1em;
	display: inline-block;
	text-decoration: none;
	text-shadow: inset 0 2px 0 red, inset 0 0 4px red;
	border-radius:3px;
	text-align: center;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	-msborder-radius:3px;
	position:relative;
}
 a.read:hover {
	background:#D94748;
}

.fixed{
  top:0;
  position:fixed;
  width:auto;
  display:none;
  border:none;
}

.container_tbl{
  width:90%;
  margin:auto;
}

/* Generelles */


.section-text {
    text-align: center;
    padding: 0 25%;
}

section {
    /*width: 100%;*/
    /*background: #fff;*/
    /*padding-top: 20px;
    padding-bottom: 80px;*/
    /*margin-top:-30px;*/
}

section button.regular-bt {
  margin: 20px;
  border: none;
  display: block;
  background: #D33536;
  color: #fff;
  text-transform: uppercase;
  font: 300 1.2rem 'Open Sans', sans-serif;
  padding: 7px 15px;
  border-radius: 5px;
  transition: 0.1s;
}
section button:focus {
  box-shadow: none;
  outline: none;
}
section button:active {
  box-shadow: 0px 3px 6px 0px #bc1414 inset;
}
section button:hover {
  border-radius: 10px;
}


/* Section Pakete */

#pakete em {
    color: #000;
  font-weight: bold;
  background: #7dc160;
  border-bottom: 2px solid #3ca02a;
  padding: 0px 7px;
  line-height: 1.8;
}

#pakete .entypo-check {
  color: #36ac3e;
}
#pakete .entypo-cancel {
  color: #d33536;
}
#pakete table {
    /*border: 1px solid #191919;*/
      /*border-radius: 15px;*/ 

    border-collapse: separate;

    width: 100%;
    height: 100%;
    /*border: 1px solid #ddd;*/
    border-spacing: 0;
    font: 400 1.4rem 'Open Sans', sans-serif;
    transition: width 0.2s height 0.2s;
    background:#fff;
    /*border: 2px solid #9fb6c8;*/
}

/*#pakete tbody:last-child {
    padding: 0px 0 25px 0px !important;
}*/

#pakete tbody {
    height:100%;
}


/*#pakete tr:first-child th {
  font: font-size: 22px; color: #efefef; text-align: center; font-weight: 600; border: 1px solid #9fb6c8; font-family:Roboto !important; 
  text-transform: uppercase;
}*/

#pakete tr:first-child {
  /*font: 400 1.4rem 'Open Sans', sans-serif !important;*/
  font-size: 22px; color: #efefef; text-align: center; font-weight: 600; border: 1px solid #9fb6c8; font-family:Roboto !important; 
  height:50px;
  /*margin: 0 0 0 30px;*/
  text-transform: uppercase;
    /*border-radius: 5px;*/ 
    /*border-top-left-radius: 6px;
    border-top-right-radius: 6px;*/

}

#pakete tr:first-child th{
    /*border-radius: 5px;*/ 
            font-family:Roboto !important; 

            color: #000;
            background: #ffffff !important; 

              /*background: #445b7a; /* Old browsers 
              background: -moz-linear-gradient(top, #445b7a 0%, #191919 100%); /* FF3.6+ 
              background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#445b7a), color-stop(100%,#191919)); /* Chrome,Safari4+ 
              background: -webkit-linear-gradient(top, #445b7a 0%,#191919 100%); /* Chrome10+,Safari5.1+ 
              background: -o-linear-gradient(top, #445b7a 0%,#191919 100%); /* Opera 11.10+ 
              background: -ms-linear-gradient(top, #445b7a 0%,#191919 100%); /* IE10+ 
              background: linear-gradient(to bottom, #445b7a 0%,#191919 100%); /* W3C 
              filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#445b7a', endColorstr='#191919',GradientType=0 ); /* IE6-9*/ 

    /*margin: 0 0 0 30px;*/

    border-top-left-radius: 15px;
    border-top-right-radius: 15px;

}
#pakete tr:first-child th:nth-child(1){
    /*border-radius: 5px;*/ 
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;

}


#pakete tr:hover {
    color: #6d787e;
}
#pakete th, #pakete td {
  /*border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;*/
  text-align: center;
}

#pakete th:last-child, #pakete td:last-child {
  border-right: none;
}
#pakete tr:last-child td, #pakete tr:last-child th {
  border-bottom:none;
} 

#pakete th {
  /*background: #efefef;
  font: 600 1.4rem 'Open Sans', sans-serif;*/

font-size: 22px; 
color: #efefef; 
/*text-align: center; 
font-weight: 600;*/ 
/*border: 1px solid #9fb6c8;*/ 
            /*font-family:Roboto !important;*/ 
              /*background: #445b7a; /* Old browsers 
              background: -moz-linear-gradient(top, #445b7a 0%, #191919 100%); /* FF3.6+ 
              background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#445b7a), color-stop(100%,#191919)); /* Chrome,Safari4+ 
              background: -webkit-linear-gradient(top, #445b7a 0%,#191919 100%); /* Chrome10+,Safari5.1+ 
              background: -o-linear-gradient(top, #445b7a 0%,#191919 100%); /* Opera 11.10+ 
              background: -ms-linear-gradient(top, #445b7a 0%,#191919 100%); /* IE10+ 
              background: linear-gradient(to bottom, #445b7a 0%,#191919 100%); /* W3C 
              filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#445b7a', endColorstr='#191919',GradientType=0 ); /* IE6-9*/ 



}

#pakete th:last-child{
    -moz-border-radius-topright:15px;
    -webkit-border-top-right-radius:15px;
    border-top-right-radius:15px
} 



#pakete td.rowTitle {text-align: left;}

#pakete th.rowTitleCategory {
    font-size: 22px; 
    color: #445b7a; 
    padding: 0 0 12px 2px;
    font-weight: 400; 
    font-family:"MuseoLight",serif !important;
    text-align: left;
}


#pakete th.rowTitle {
    font-size: 18px; 
    color: #9fb6c8; 
    /*text-align: center;*/ 
    /*font-weight: 600;*/ 
    padding: 5px 0 18px 30px;
    font-weight: 300; 
    /*border: 1px solid #9fb6c8;*/ 
    /*font-family:Roboto !important;*/ 
    font-family:"MuseoLight",serif !important;

    /*background: #e9f3fb; /* Old browsers*/ 
    /*background: #191919; /* Old browsers*/ 
    /*background: -moz-linear-gradient(top, #e9f3fb 0%, #C5E0FC 100%); /* FF3.6+ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e9f3fb), color-stop(100%,#C5E0FC)); /* Chrome,Safari4+ 
    background: -webkit-linear-gradient(top, #e9f3fb 0%,#C5E0FC 100%); /* Chrome10+,Safari5.1+ 
    background: -o-linear-gradient(top, #e9f3fb 0%,#C5E0FC 100%); /* Opera 11.10+ 
    background: -ms-linear-gradient(top, #e9f3fb 0%,#C5E0FC 100%); /* IE10+ 
    background: linear-gradient(to bottom, #e9f3fb 0%,#C5E0FC 100%); /* W3C 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9f3fb', endColorstr='#C5E0FC',GradientType=0 ); /* IE6-9*/ 
    text-align: left;
}
#pakete th.blank {
    /*background: none!important;*/ 
    background: #ffffff !important; 
    font-size: 18px !important; 
    width:500px;
    border: none!important;
    color: #9fb6c8 !important;
    text-align: left;
    text-transform:none !important;
    padding: 0 0 0 20px;

}

#pakete tr.rowInfoOne {
  height:1px;
}

/*#pakete tr.rowInfo {
    padding: 3px 0 8px 15px;
}*/


#pakete tr.rowInfo:first-child {
  /*font: 400 1.4rem 'Open Sans', sans-serif !important;*/
  font-size: 18px !important; 
  text-align: left !important; 
  text-transform:none !important;
  /*padding: 0;*/
  height:auto;
  	/*border-top-right-radius: 5px;*/
    /*border-radius: 15px !important; 
    -moz-border-radius: 15px !important;*/ 
    /*border-top-left-radius: 6px;
    border-top-right-radius: 6px;*/

/*border-right: 1px solid #191919;*/

    -moz-border-radius-topleft:10px;
    -webkit-border-top-left-radius:10px;
    border-top-left-radius:10px;
    -moz-border-radius-topright:15px;
    -webkit-border-top-right-radius:15px;
    border-top-right-radius:15px


}

/*#pakete tr.rowInfo:last-child {
    padding: 0px 0 25px 0px !important;
}*/



#pakete tr.rowInfo:hover {
    background: #f7dcdf;
}


/*#maintable {width: 100%; table-layout: fixed; text-align: center; margin: 4em 0; border-collapse: collapse; }*/
/*#maintable tr {background: transparent!important;}
#maintable td,
#maintable th {padding: 20px; text-align: center;}
#maintable td.rowTitle {text-align: left;}*/
/*#pakete .blank {background: none!important; border: none!important;}*/
/*#pakete .blackbold th {font-size: 22px; color: #efefef; text-align: center; font-weight: 600; border: 1px solid #9fb6c8; font-family:Roboto !important;*/ 
              /*background: #333333; /* Old browsers */*/
              /*background: -moz-linear-gradient(top, #333333 0%, #191919 100%); /* FF3.6+ */
              /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#333333), color-stop(100%,#191919)); /* Chrome,Safari4+ */
              /*background: -webkit-linear-gradient(top, #333333 0%,#191919 100%); /* Chrome10+,Safari5.1+ */
              /*background: -o-linear-gradient(top, #333333 0%,#191919 100%); /* Opera 11.10+ */
              /*background: -ms-linear-gradient(top, #333333 0%,#191919 100%); /* IE10+ */
              /*background: linear-gradient(to bottom, #333333 0%,#191919 100%); /* W3C */
              /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#191919',GradientType=0 ); /* IE6-9 */
 /*}*/
 #pakete .blackbold td {background-color: #f0f1f1; border: 1px solid #c8d6e2;} 
 #pakete .blackbold td.rowTitle {border-left: 4px solid #222}



/* The surrounding box */
#pakete .box {
  position: relative;
  margin: 3% auto 0;
  width: 70%;
  height: 100px;
  perspective: 10000;
  transform-style: preserve-3d;
  min-width: 950px;
  overflow: visible; 
  transition: width 0.2s height 0.2s;

}

/* The front and the backside and the little tables */
#pakete .box .front, #pakete .box .back, #pakete .box .responsive-tables [class*="little"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  /*height: 100%;*/
  
  backface-visibility: hidden;
  transform-style: preserve-3d;
  transition: transform 0.7s; /* How long should the flipping be? */
  transform-origin: 50% 50%;
  
  background: #fff;
  border-radius: 5px;
}
#pakete .box .responsive-tables [class*="little"] {
  width: 48%;
}



#pakete .box .responsive-tables {
  display: none;
  width: 100%;
  height: 100%;
}





/* 3states of the little tables  */

#pakete .box .responsive-tables [class*="little"] {
  transform: rotateY(0deg) translateX(250%);
  transform-origin: 0 0;
  transition: transform 0.6s, opacity 0.0s 0.4s;
  opacity: 0.0;
}

#pakete .box [class*="little"].active {
  transform: rotateY(0) translateX(0);
  transition: transform 0.6s;
  opacity: 1;
}
#pakete .box [class*="little"].activetwo {
  transform: rotateY(0) translateX(106%);
  transition: transform 0.6s;
  opacity: 1;
}
#pakete .box [class*="little"].last {
  transform: rotateY(0) translateX(-110%);
  transition: transform 0.6s opacity 0.0s 0.4s;
  opacity: 0.0;
}





/* The flipping system */
#pakete .front { /* große tabelle zu anfang nicht gedreht */
  transform: rotateY(0deg);
}
#pakete .back { /* alle backsites gedreht, nicht sichtbar zu anfang */
  transform: rotateY(180deg);
  padding: 5%;
  border: 1px solid #ddd;
  box-sizing: border-box;
}
/*----- Drehung nach 1 ---------*/
#pakete .box.flip1 .front { /* große tabelle drehen */
  transform: rotateY(-180deg);
}
#pakete .box.flip1 .little1 { /* bei mobile auch kleine tabelle drehen */
  transform: rotateY(-180deg);
}
#pakete .box.flip1 .back.first { /* backsite sichtbar machen */
  transform: rotateY(0deg);    
}
/*----- Drehung nach 2 ---------*/
#pakete .box.flip2 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip2 .little2 {
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip2 .back.second {
  transform: rotateY(0deg);    
}
/*----- Drehung nach 3 ---------*/
#pakete .box.flip3 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip3 .little3 { 
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip3 .back.third {
  transform: rotateY(0deg);    
}
/*----- Drehung nach 4 ---------*/
#pakete .box.flip4 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip4 .little4 { 
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip4 .back.fourth {
  transform: rotateY(0deg);    
}
/*----- Drehung nach 5 ---------*/
#pakete .box.flip5 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip5 .little5 { 
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip5 .back.fifth{
  transform: rotateY(0deg);    
}
/*----- Drehung nach 6 ---------*/
#pakete .box.flip6 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip6 .little6 { 
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip6 .back.sixth{
  transform: rotateY(0deg);    
}
/*----- Drehung nach 5 ---------*/
#pakete .box.flip7 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip7 .little7 { 
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip7 .back.seventh{
  transform: rotateY(0deg);    
}
/*----- Drehung nach 5 ---------*/
#pakete .box.flip8 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip8 .little8 { 
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip8 .back.eigth{
  transform: rotateY(0deg);    
}
/*----- Drehung nach 5 ---------*/
#pakete .box.flip9 .front {
  transform: rotateY(-180deg);
}
#pakete .box.flip9 .little9 { 
  transform: rotateY(-180deg) translateX(0);
}
#pakete .box.flip9 .back.ninth{
  transform: rotateY(0deg);    
}


#pakete .back img {
  float: left;
  width: 120px;
  margin-top: 80px;
}

#pakete .back p {
    padding-left: 40px;
    margin-left: 120px;
}

#pakete .price {
    font: 600 1.4rem 'Open Sans', sans-serif; 
    padding-left: 40px;
}

#pakete h2 {
    margin-top: 40px;
}

/* The buttons */
#pakete .responsive-tables button.next-table {
  font-family: 'entypo', sans-serif;
  position: absolute;
  right: -0.5%;
  top: 50%;
  width: 25px;
  height: 30px;
  margin-top: -25px;
  background: #D43536;
  border: none;
  color: #fff;
  font-size: 2.2rem;
  padding: 0;
  z-index: 99;
  border-radius: 50% 0 0 50%;
}
#pakete .responsive-tables button.prev-table {
  font-family: 'entypo', sans-serif;
  position: absolute;
  left: -0.5%;
  top: 50%;
  width: 25px;
  height: 30px;
  margin-top: -25px;
  background: #D43536;
  border: none;
  color: #fff;
  font-size: 2.2rem;
  padding: 0;
  z-index: 99;
  border-radius: 0 50% 50% 0;
}
#pakete .box[class*="flip"] .responsive-tables button.next-table, #pakete .box[class*="flip"] .responsive-tables button.prev-table {
  background: #d6b8b8;
  pointer-events: none;
}

#pakete button {
  border: none;
  border-radius: 5px;
  background: #D43536;
  padding: 10px 25px;
  color: #fff;
  transition: box-shadow 0.1s, border-radius 0.3s;
  font: 300 1.2rem 'Open Sans', sans-serif;
  cursor: pointer;
}
#pakete button:focus {
  box-shadow: none;
  outline: none;
}
#pakete button:active {
  box-shadow: 0px 3px 6px 0px #bc1414 inset;
}
#pakete button:hover {
  border-radius: 10px;
}

#pakete [class*='hide-me_'] {
  width: 0px !important;
  height: 0px !important;
  padding: 0px !important;
  background: transparent !important;
  border-radius: 100% !important;
  border-top: 40px solid transparent !important;
  border-bottom: 40px solid transparent !important;
  border-left: 40px solid #f66f6f !important;
  border-right: 40px solid transparent !important;
  display: block;
  position: absolute;
  right: -41px;
  top: -41px;
  transform: rotate(315deg);
  cursor: pointer;
}

#pakete [class*='hide-me_']:before {
  content: "\232b";
  font: 1.4rem 'entypo', sans-serif;
  position: absolute;
  top: -8px;
  left: -32px;
  color: #ffd8d8;
  display: block;
  transition: 0.3s;
}

#pakete [class*='hide-me_']:hover:before {
  color: #fff;
}



@media only screen and (max-width : 1024px) {
/* The surrounding box */
#pakete .box {
  position: relative;
  margin: 3% auto 0;
  width: 70%;
  /*height: 500px !important;
  perspective: 10000;*/
  transform-style: preserve-3d;
  min-width: 0px;
  /*overflow: hidden;*/ 
  transition: width 0.2s height 0.2s;
}

/* The front and the backside and the little tables */
#pakete .box .front, #pakete .box .back, #pakete .box .responsive-tables [class*="little"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  /*height: 100%;*/
  
  backface-visibility: hidden;
  transform-style: preserve-3d;
  transition: transform 0.7s; /* How long should the flipping be? */
  transform-origin: 50% 50%;
  
  background: #fff;
  border-radius: 5px;
}
#pakete .box .responsive-tables [class*="little"] {
  width: 47%;
}

#pakete .box .responsive-tables {
  /*display: block;*/
  /*width: 100%;
  height: 100%;*/
}
#pakete .front {
  /*display: none;*/
}



/* 3states of the little tables  */

#pakete .box .responsive-tables [class*="little"] {
  transform: rotateY(0deg) translateX(250%);
  transform-origin: 0 0;
  transition: transform 0.6s, opacity 0.0s 0.4s;
  opacity: 0.0;
}

#pakete .box [class*="little"].active {
  transform: rotateY(0) translateX(0);
  transition: transform 0.6s;
  opacity: 1;
}
#pakete .box [class*="little"].activetwo {
  transform: rotateY(0) translateX(112.7659574%);
  transition: transform 0.6s;
  opacity: 1;
}
#pakete .box [class*="little"].last {
  transform: rotateY(0) translateX(-110%);
  transition: transform 0.6s opacity 0.0s 0.4s;
  opacity: 0.0;
}

#pakete th.rowTitle {
    font-size: 12px; 
}

#pakete th {
    font-size: 15px;
}

#pakete th.blank {
    font-size: 15px !important;
}

#pakete tr:first-child {
    font-size: 15px;
}

    #pakete tr:first-child {
        /*margin: 0 20px 0 0;*/
    }

        #pakete tr:first-child th {
        padding: 0 20px 0 20px;
        }


} /* Ipad 1-3 und große Tablets  Media Query Ende */


@media only screen and (max-width : 768px) {
    #pakete .box {
        width: 90%;
        min-width: 0px;
    }
    /* Kindle Fire und kleine Tablets Media Query ende*/

}

@media only screen and (max-width : 533px) {

/* Section Pakete */

#pakete .box {
  position: relative;
  margin: 3% auto 0;
  width: 80%;
  height: 400px;
  perspective: 10000;
  transform-style: preserve-3d;
  min-width: 0px;
  overflow: hidden; 
  transition: width 0.2s height 0.2s;
}


/* The front and the backside and the little tables */
#pakete .box .front, #pakete .box .back, #pakete .box .responsive-tables [class*="little"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; 
  backface-visibility: hidden;
  transform-style: preserve-3d;
  transition: transform 0.7s; /* How long should the flipping be? */
  transform-origin: 50% 50%;  
  background: #fff;
  border-radius: 5px;
}
#pakete .box .responsive-tables {
  display: block;
}
#pakete .front {
  display: none;
}



/* 3states of the little tables  */

#pakete .box .responsive-tables [class*="little"] {
  transform: rotateY(0deg) translateX(150%);
  transform-origin: 0 0;
  transition: transform 0.6s, opacity 0.0s 0.4s;
  opacity: 0.0;
}

#pakete .box [class*="little"].active {
  transform: rotateY(0) translateX(0);
  transition: transform 0.6s;
  opacity: 1;
}
#pakete .box [class*="little"].activetwo {
  transform: rotateY(0) translateX(110%);
  transition: transform 0.6s;
  opacity: 1;
}
#pakete .box [class*="little"].last {
  transform: rotateY(0) translateX(-110%);
  transition: transform 0.6s opacity 0.0s 0.4s;
  opacity: 0.0;
}


} /* Handys Media Query Ende */

