.relative {
    position: relative;
}
.inner {
    margin: 0 auto;
    max-width: 100%;
}

.mi-slider {
    height: 685px;
}

.mi-slider ul {
	bottom: 60px;
    left: 0;
    list-style-type: none;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: 80px;
    width: 100%;
}

.no-js .mi-slider ul {
	position: relative;
	left: auto;
	bottom: auto;
	margin: 0;
	overflow: visible;
}

.mi-slider ul.mi-current {
	pointer-events: auto;
}

.mi-slider ul .coupons-line {
	float:left;
	width:100%;
}

.mi-slider ul .coupons-line li {
	display: inline-block;
	width: 18.4%;
	max-width: 300px;
	-webkit-transform: translateX(600%);
	transform: translateX(600%);
	-webkit-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;
	float:left;
	margin-bottom:2%;
	margin-right:2%;
}

.mi-slider ul li.li5 {margin-right:0; float:right;}


.no-js .mi-slider ul .coupons-line li {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}

.mi-slider ul .coupons-line li a,
.mi-slider ul .coupons-line li img {
	display: block;
    height: inherit;
    margin: 0 auto;
    width: 100%;
}

.mi-slider ul .coupons-line li a {
	outline: none;
	cursor: pointer;
}

.mi-slider ul .coupons-line li img {
	max-width: 100%;
	border: none;
}

.mi-slider ul .coupons-line li h4 {
	display: inline-block;
	font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif;
	font-style: italic;
	font-weight: 400;
	font-size: 18px;
	font-size:1.125rem;
	padding: 20px 10px 0;
}

.mi-slider ul .coupons-line li:hover {
	opacity: 0.5;
} 

.mi-slider nav {
	border-top: 2px solid #333;
    margin: 0 auto;
    position: relative;
    text-align: center;
    top: 40px;
    width:100%;
}

.no-js nav {
	display: none;
}

.mi-slider nav a {
	color: #95e8b4;
    display: inline-block;
    font-family: Arial,Helvetica,sans-serif;
    outline: medium none;
    padding: 0 0 30px;
    position: relative;
    text-transform: uppercase;
    top: -34px;
    transition: color 0.2s linear 0s;
    width:20%;
    float:left;
}

.mi-slider nav a:hover,
.mi-slider nav a.mi-selected {
	color: #00af41;
}

.mi-slider nav a.mi-selected {
	color:#000;
}

.mi-slider nav a.mi-selected:after,
.mi-slider nav a.mi-selected:before {
	content: '';
	position: absolute;
	top: 27px;
	border: solid transparent;
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.mi-slider nav a.mi-selected:after {
	border-color: transparent;
	border-top-color: #fff;
	border-width: 20px;
	left: 50%;
	margin-left: -20px;
}

.mi-slider nav a.mi-selected:before {
	border-color: #333 transparent transparent;
    border-width: 18px;
    left: 50%;
    margin-left: -18px;
    top: 32px;
 }

/* Move classes and animations */

.mi-slider ul:first-child .coupons-line li,
.no-js .mi-slider ul .coupons-line li {
	-webkit-animation: scaleUp 350ms ease-in-out both;
	animation: scaleUp 350ms ease-in-out both;
}

@-webkit-keyframes scaleUp {
	0% { -webkit-transform: translateX(0) scale(0); }
	100% { -webkit-transform: translateX(0) scale(1); }
}

@keyframes scaleUp {
	0% { -webkit-transform: translateX(0) scale(0); transform: translateX(0) scale(0); }
	100% { -webkit-transform: translateX(0) scale(1); transform: translateX(0) scale(1); }
}

.mi-slider ul:first-child .coupons-line li:first-child {
	-webkit-animation-delay: 90ms;
	animation-delay: 90ms;
}

.mi-slider ul:first-child .coupons-line li:nth-child(2) {
	-webkit-animation-delay: 180ms;
	animation-delay: 180ms;
}

.mi-slider ul:first-child .coupons-line li:nth-child(3) {
	-webkit-animation-delay: 270ms;
	animation-delay: 270ms;
}

.mi-slider ul:first-child .coupons-line li:nth-child(4) {
	-webkit-animation-delay: 360ms;
	animation-delay: 360ms;
}

/* moveFromRight */

.mi-slider ul.mi-moveFromRight .coupons-line li {
	-webkit-animation: moveFromRight 350ms ease-in-out both;
	animation: moveFromRight 350ms ease-in-out both;
}

/* moveFromLeft */

.mi-slider ul.mi-moveFromLeft .coupons-line li {
	-webkit-animation: moveFromLeft 350ms ease-in-out both;
	animation: moveFromLeft 350ms ease-in-out both;
}

/* moveToRight */

.mi-slider ul.mi-moveToRight .coupons-line li {
	-webkit-animation: moveToRight 350ms ease-in-out both;
	animation: moveToRight 350ms ease-in-out both;
}

/* moveToLeft */

.mi-slider ul.mi-moveToLeft .coupons-line li {
	-webkit-animation: moveToLeft 350ms ease-in-out both;
	animation: moveToLeft 350ms ease-in-out both;
}

/* Animation Delays */

.mi-slider ul.mi-moveToLeft .coupons-line li:first-child,
.mi-slider ul.mi-moveFromRight .coupons-line li:first-child,
.mi-slider ul.mi-moveToRight .coupons-line li:nth-child(4),
.mi-slider ul.mi-moveFromLeft .coupons-line li:nth-child(4) {
	-webkit-animation-delay: 0ms;
	animation-delay: 0ms;
}

.mi-slider ul.mi-moveToLeft .coupons-line li:nth-child(2),
.mi-slider ul.mi-moveFromRight .coupons-line li:nth-child(2),
.mi-slider ul.mi-moveToRight .coupons-line li:nth-child(3),
.mi-slider ul.mi-moveFromLeft .coupons-line li:nth-child(3) {
	-webkit-animation-delay: 90ms;
	animation-delay: 90ms;
}

.mi-slider ul.mi-moveToLeft .coupons-line li:nth-child(3),
.mi-slider ul.mi-moveFromRight .coupons-line li:nth-child(3),
.mi-slider ul.mi-moveToRight .coupons-line li:nth-child(2),
.mi-slider ul.mi-moveFromLeft .coupons-line li:nth-child(2) {
	-webkit-animation-delay: 180ms;
	animation-delay: 180ms;
}

.mi-slider ul.mi-moveToLeft .coupons-line li:nth-child(4),
.mi-slider ul.mi-moveFromRight .coupons-line li:nth-child(4),
.mi-slider ul.mi-moveToRight .coupons-line li:first-child,
.mi-slider ul.mi-moveFromLeft .coupons-line li:first-child  {
	-webkit-animation-delay: 270ms;
	animation-delay: 270ms;
}

/* Animations */

@-webkit-keyframes moveFromRight {
	0% { -webkit-transform: translateX(600%); }
	100% { -webkit-transform: translateX(0%); }
}

@-webkit-keyframes moveFromLeft {
	0% { -webkit-transform: translateX(-600%); }
	100% { -webkit-transform: translateX(0%); }
}

@-webkit-keyframes moveToRight {
	0% { -webkit-transform: translateX(0%); }
	100% { -webkit-transform: translateX(600%); }
}

@-webkit-keyframes moveToLeft {
	0% { -webkit-transform: translateX(0%); }
	100% { -webkit-transform: translateX(-600%); }
}

@keyframes moveFromRight {
	0% { -webkit-transform: translateX(600%); transform: translateX(600%); }
	100% { -webkit-transform: translateX(0); transform: translateX(0); }
}

@keyframes moveFromLeft {
	0% { -webkit-transform: translateX(-600%); transform: translateX(-600%); }
	100% { -webkit-transform: translateX(0); transform: translateX(0); }
}

@keyframes moveToRight {
	0% { -webkit-transform: translateX(0%); transform: translateX(0%); }
	100% { -webkit-transform: translateX(600%); transform: translateX(600%); }
}

@keyframes moveToLeft {
	0% { -webkit-transform: translateX(0%); transform: translateX(0%); }
	100% { -webkit-transform: translateX(-600%); transform: translateX(-600%); }
}

.mi-slider {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}


  /********* COUPONS ****/
  
#mi-slider > ul > .coupons-line > li > a.coupon,
#mi-slider > ul > .coupons-line > li > div.coupon-drucken {	
	background: rgba(250,250,250,1);
	background: -moz-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(250,250,250,1) 85%, rgba(221,221,221,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(250,250,250,1)), color-stop(85%, rgba(250,250,250,1)), color-stop(100%, rgba(221,221,221,1)));
	background: -webkit-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(250,250,250,1) 85%, rgba(221,221,221,1) 100%);
	background: -o-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(250,250,250,1) 85%, rgba(221,221,221,1) 100%);
	background: -ms-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(250,250,250,1) 85%, rgba(221,221,221,1) 100%);
	background: linear-gradient(to bottom, rgba(250,250,250,1) 0%, rgba(250,250,250,1) 85%, rgba(221,221,221,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#dddddd', GradientType=0 );
    border: 1px solid #eee;
    float: left;
    min-height: 90px;
    padding: 4%;
    width: 90%;
    font-size:1rem;
    height:auto;
}

#mi-slider > ul > .coupons-line > li > div.coupon-drucken {
	border:1px #00af41 dashed;
}
	
#mi-slider > ul > .coupons-line > li > .neue,
#mi-slider > ul > .coupons-line > li > .favoriten,
#mi-slider > ul > .coupons-line > li > .exklusiv,
#mi-slider > ul > .coupons-line > li > .empfehlung,
#mi-slider > ul > .coupons-line > li > .null {
	background-image:url('../images/coupon-neu.png');
	background-repeat:no-repeat;
	width:100%;
	height:20px;
}

#mi-slider > ul > .coupons-line > li > .favoriten {background-image:url('../images/coupon-favoriten.png');}
#mi-slider > ul > .coupons-line > li > .exklusiv {background-image:url('../images/coupon-exklusiv.png');}
#mi-slider > ul > .coupons-line > li > .empfehlung {background-image:url('../images/coupon-empfehlung.png');}
#mi-slider > ul > .coupons-line > li > .null {background-image:none;}


#mi-slider > ul > .coupons-line > li > a.coupon:hover {background-color:#d7d7d7; /*border:#fff 2px dashed;*/}

#mi-slider > ul > .coupons-line > li > a img,
#mi-slider > ul > .coupons-line > li > div.coupon-drucken span.logo img {
	height: 60%;
    position: relative;
    top: 20%;
    width: auto;
}

#mi-slider > ul > .coupons-line > li > a img.deals {
	position: relative;
    right: -72px;
    top: -5px;
}

#mi-slider > ul > .coupons-line > li > a img.schere {
	bottom: 10px;
    height: auto;
    left: 20px;
    width: 10%;
    position:relative;
}

#mi-slider > ul > .coupons-line > li > a > span,
#mi-slider > ul > .coupons-line > li > div > span {
    float:left;
    width:39%;
    position:relative;
}

#mi-slider > ul > .coupons-line > li > a > span.rabatt,
#mi-slider > ul > .coupons-line > li > div > span.rabatt {
    height: 72px;
    padding-left: 5%;
    width: 54%;
    font-size:0.9rem;
}

#mi-slider > ul > .coupons-line > li > a > span.rabatt b,
#mi-slider > ul > .coupons-line > li > div > span.rabatt b {font-weight:bold; font-size:1.2rem;}

#mi-slider > ul > .coupons-line > li > a > span.rabatt span,
#mi-slider > ul > .coupons-line > li > div > span.rabatt span {
	bottom: 0;
    font-size: 0.75rem;
    left: 0;
    margin: 0;
    position: absolute;
    text-align:center;
    padding-left:5%;
}

#mi-slider > ul > .coupons-line > li > a > span.rabatt span b,
#mi-slider > ul > .coupons-line > li > div > span.rabatt span b {color:red; font-size:0.75rem;}

#mi-slider > ul > .coupons-line > li > a > span.logo,
#mi-slider > ul > .coupons-line > li > div > span.logo {
	background-color: #fff;
    border: 1px dotted #95e8b4;
    height: 72px;
}

#mi-slider > ul > .coupons-line > li > a > span.escondido,
#mi-slider > ul > .coupons-line > li > div > span.escondido {
	display:none;
	margin-top:20px;
	font-size:0.875rem;
	min-height: 136px;
	width:100%;
}

#mi-slider > ul > .coupons-line > li > a > span > span,
#mi-slider > ul > .coupons-line > li > div > span > span {
	width:98%;
	float:left;
	margin-top:4px;
	margin-bottom:4px;
}

#mi-slider > ul > .coupons-line > li > a > span > span.title,
#mi-slider > ul > .coupons-line > li > div > span > span.title {
    font-weight: bold;
    text-align: center;
}

#mi-slider > ul > .coupons-line > li > a > span > span.code {
	padding:5px 2px;
	border-radius:5px;
	background-color:#95e8b4;
	background-image:url('../images/back-code.png');
	background-repeat:repeat-x;
	color:black;
}

#mi-slider > ul > .coupons-line > li > a > span > span.zeit {
	font-size:0.75rem;
}

#mi-slider > ul > .coupons-line > li > div.coupon-drucken a.pdf-btn {height:60px; width:60px;}


#mi-slider > ul > .coupons-line > li > span.close {
    color: #b7b7b7;
    display: none;
    float: right;
    font-size: 0.875rem;
    font-weight: bold;
    margin: -22px 4px -22px 8px;
    padding: 2px 8px;
}

#mi-slider > ul > .coupons-line > li > span.close:hover {cursor:pointer; color:white; opacity:1; background-color:#95e8b4;}

#mi-slider > ul > .coupons-line > li > a > span {color:#333;}

#werbunglang,
#werbunglang-drucken {
	float:left;
	width:79.6%;
	height:136px;
	background-color:lime;
	display:none;
	margin-bottom:20px;
}



/**********************************************************************************************    900px   ************************/
@media only screen and (min-device-width : 901px) and (max-device-width : 1223px) {

	.mi-slider ul .coupons-line li {
	     display: inline-block;
	    float: none;
	    margin: 2%;
	    max-width: 3000px;
	    transform: translateX(600%);
	    transition: opacity 0.2s linear 0s;
	    width: 28.3%;
	}

}

/**********************************************************************************************    900px   ************************/
@media only screen and (min-device-width : 801px) and (max-device-width : 900px) {

	.mi-slider nav {border:0; top:0;}

	.mi-slider nav a.mi-selected::after, .mi-slider nav a.mi-selected::before {border:0;}

	.mi-slider nav a {
		color: #888;
		float:none;
		width:26%;
		margin:1%;
		padding:1%;
		top: 0px;
		margin-bottom:20px;
		background: #eee none repeat scroll 0 0;
	    border: 1px solid #00cc00;
	    border-radius: 6px;
	    box-shadow: 1px 1px 2px rgba(120, 120, 120, 0.4) inset, -2px -2px 2px rgba(255, 255, 255, 0.4) inset;
	}
	
	.mi-slider nav a.mi-selected {background: #95e8b4 none repeat scroll 0 0;}
	
	.mi-slider nav a:hover {
		background: #ddd none repeat scroll 0 0;
		transition: color 0.2s linear 0s;
		color:#fff;
		text-decoration:underline;
	}
	
	.mi-slider nav a.mi-selected:hover {
		background: #95e8b4 none repeat scroll 0 0;
		transition: none;
	}
	
	/* coupons */
	.mi-slider {min-height:1772px;}
	.mi-slider ul {top:200px;}
	
	/*** coupons index ***/

	.mi-slider ul .coupons-line li,
	.mi-slider ul:first-child .coupons-line li:first-child,
	.mi-slider ul:first-child .coupons-line li, .no-js .mi-slider ul .coupons-line li,
	.mi-slider ul li.li5
	 {
		width:29%!important;
		padding:1%;
		margin:0%;
		float:none;
	}
	.mi-slider ul li.li5 {float:none!important;}
	#mi-slider > ul > .coupons-line > li > a > span.escondido {display:block!important;}
	#mi-slider > ul > .coupons-line > li > span.close {display:none!important;}
	#werbunglang, #werbunglang-drucken {display:none!important;}
	#mi-slider > ul > .coupons-line > li > a img.schere {bottom:0;}


}

/**********************************************************************************************    800px   ************************/

@media only screen and (min-device-width : 481px) and (max-device-width : 800px) {

	.mi-slider nav a {width:45%;}
	
	.mi-slider ul .coupons-line li,
	.mi-slider ul:first-child .coupons-line li:first-child,
	.mi-slider ul:first-child .coupons-line li,
	.no-js .mi-slider ul .coupons-line li, .mi-slider ul li.li5 {
		border:none;
		width:44%!important;
		float:left;
		margin:2%;
	}
	
	#mi-slider > ul > .coupons-line > li > a > span.logo,
	#mi-slider > ul > .coupons-line > li > div > span.logo {
		margin: 5% 15%;
	    max-height: 100px;
	    min-height: 0;
	    padding: 2%;
	    width: 66%!important;
	}
		
	#mi-slider > ul > .coupons-line > li > a img, #mi-slider > ul > .coupons-line > li > div.coupon-drucken span.logo img {
	    height: 90%;
	    padding-top: 4px;
	    position: relative;
	    top: 0;
	    width: auto;
	}
	
	#mi-slider > ul > .coupons-line > li > a > span.rabatt,
	#mi-slider > ul > .coupons-line > li > div > span.rabatt {
		font-size: 0.9rem;
	    height: 72px;
	    padding-left: 0%;
	    width: 100%;
	}

	#mi-slider > ul > .coupons-line > li > a > span.rabatt span,
	#mi-slider > ul > .coupons-line > li > div > span.rabatt span {padding-left: 0%;}

}




/**********************************************************************************************    480px   ************************/

@media only screen and (min-device-width : 281px) and (max-device-width : 480px) {




	.mi-slider{min-height:2011px;}
	.mi-slider nav a {width:80%;}
	.mi-slider ul {top:275px;}
	.mi-slider ul .coupons-line li,
	.mi-slider ul:first-child .coupons-line li:first-child,
	.mi-slider ul:first-child .coupons-line li,
	.no-js .mi-slider ul .coupons-line li,
	.mi-slider ul li.li5 {
	    float: left;
	    margin-bottom: 5%;
	    max-width: 100%;
	    padding: 2%;
	    width: 96% !important;
	}
	
	#mi-slider > ul > .coupons-line > li > a.coupon,
	#mi-slider > ul > .coupons-line > li > div.coupon-drucken {
		border:none;
	}

	#mi-slider > ul > .coupons-line > li > a > span.logo,
	#mi-slider > ul > .coupons-line > li > div > span.logo {
	    margin: 4% 4% 4% 0;
	    max-height: 100px;
	    min-height: 0;
	    padding: 2%;
	    width: 42% !important;
	}
	
	#mi-slider > ul > .coupons-line > li > a > span.rabatt,
	#mi-slider > ul > .coupons-line > li > div > span.rabatt {
	    padding-left: 0%;
	    width: 48%;
	    margin:4% 0;
	}

}


/**********************************************************************************************    280px   ************************/

@media only screen and (max-device-width : 280px) {


	.mi-slider{min-height:2011px;}
	.mi-slider nav a {width:80%;}
	.mi-slider ul {top:275px;}
	.mi-slider ul .coupons-line li,
	.mi-slider ul:first-child .coupons-line li:first-child,
	.mi-slider ul:first-child .coupons-line li,
	.no-js .mi-slider ul .coupons-line li,
	.mi-slider ul li.li5 {
	    float: left;
	    margin-bottom: 5%;
	    max-width: 100%;
	    padding: 2%;
	    width: 96% !important;
	}
	
	#mi-slider > ul > .coupons-line > li > a.coupon,
	#mi-slider > ul > .coupons-line > li > div.coupon-drucken {
		border:none;
	}

	#mi-slider > ul > .coupons-line > li > a > span.logo,
	#mi-slider > ul > .coupons-line > li > div > span.logo {
		margin: 5% 15%;
	    max-height: 100px;
	    min-height: 0;
	    padding: 2%;
	    width: 66%!important;
	}
		
	#mi-slider > ul > .coupons-line > li > a img, #mi-slider > ul > .coupons-line > li > div.coupon-drucken span.logo img {
	    height: 90%;
	    padding-top: 4px;
	    position: relative;
	    top: 0;
	    width: auto;
	}
	
	#mi-slider > ul > .coupons-line > li > a > span.rabatt,
	#mi-slider > ul > .coupons-line > li > div > span.rabatt {
		font-size: 0.9rem;
	    height: 72px;
	    padding-left: 0%;
	    width: 100%;
	}

}