body{
	font-family: 'Open Sans', sans-serif;
}

.smaller_font{
	font-size:15px!important;line-height:1.5!important;
}

.normal_font{
	font-size:26px!important;
}

.cards_back {
	background-position:center;
	background-repeat:no-repeat;
}

.cards{
	width: 100%;
	max-width: 600px;
	height: 800px;
	background-color: black !important;
	background-size: auto 700px !important;
	position: relative;
	margin: 0 auto;
}
.cards .top{
	background: -moz-linear-gradient(top, rgba(222,32,106,1) 1%, rgba(222,32,106,1) 33%, rgba(222,32,106,0) 100%);
	background: -webkit-linear-gradient(top, rgba(222,32,106,1) 1%,rgba(222,32,106,1) 33%,rgba(222,32,106,0) 100%);
	background: linear-gradient(to bottom, rgba(222,32,106,1) 1%,rgba(222,32,106,1) 33%,rgba(222,32,106,0) 100%);
	padding: 15px;
    height: 135px;
	text-align: center;
}
.cards .top img{
	max-width: 80px;
}
.cards .top .title{
	padding: 0;
    color: #fff;
    font-size: 20px!important;
    font-weight: 600;
    line-height: 30px;
    -webkit-line-clamp: 3;
    margin-top: 5px;
}
.cards .btm{
	position: absolute;
	bottom: 0;
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.01) 1%, rgba(0,0,0,1) 77%, rgba(0,0,0,1) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(0,0,0,1) 77%,rgba(0,0,0,1) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(0,0,0,1) 77%,rgba(0,0,0,1) 100%);
	width: 100%;
	height: 350px;
}
.cards .btm .wrapper{
	position: absolute;
	bottom: 0;
	width: 90%;
	padding: 30px;
}
.cards .btm .wrapper .merchant,
.cards .btm .wrapper .address{
	color: #fff;
    width: 65%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    margin-bottom: 10px;
}
.cards .btm .wrapper .merchant {margin-bottom: 0px; font-weight: bold;}
.cards .btm .wrapper a{
	background-color: #5d9a16;
	display: block;
	color: #fff;
	text-decoration: none;
	text-align: center;
	border-radius: 15px;
	padding: 20px;
	transition: all .3s;
}
.cards .btm .wrapper a:hover{
	background-color: #3d6b08;
}
.cards .btm .wrapper a > div{
	font-weight: 600;
	font-size: 40px;
	text-transform: uppercase;
}
.cards .btm .wrapper a > .sale{
	font-size: 20px;
}
.cards .discount{
	background-color: #de206a;
	height: 150px;
	width: 150px;
	border-radius: 50%;
	text-align: center;
	position: absolute;
	right: 50px;
	bottom: 123px;
	z-index: 9;
	animation: anim 250ms ease-in;
	-webkit-animation: anim 250ms ease-in;
	transform: rotate(15deg);
}
.cards .discount .wrapper{
	padding-top: 31%;
}
.cards .discount .wrapper span{
	font-size: 50px;
	color: white;
	font-weight: 600;
	text-transform: uppercase;
	line-height: 34px;
}
.cards .discount .wrapper .off{
	font-size: 30px;
}

@keyframes anim {
    0% {
        transform: scale(1.5) rotate(15deg);
        -webkit-transform: scale(1.5) rotate(15deg);
    }
    100% {
        transform: scale(1.0) rotate(15deg);
        -webkit-transform: scale(1.0) rotate(15deg);
    }
}








@media (max-width: 1199px) {

}
@media (max-width: 991px) {

}
	/*.cards{
		height: 600px;
		background-size: 650px auto !important;
	}
	.cards .top{
		height: 250px;
	}
	.cards .top .title{
		padding-bottom: 0;
		color: #fff;
		font-size: 32px;
		font-weight: 600;
		line-height: 40px;
		-webkit-line-clamp: 2;
	}
	.cards .top img{
		max-width: 60px;
	}
	.cards .btm{
		height: 370px;
	}
	.cards .btm .wrapper{
		padding: 15px;
	}
	.cards .btm .wrapper .address{
		font-size: 20px;
		margin-bottom: 15px;
	}
	.cards .btm .wrapper a{
		padding: 15px;
	}
	.cards .btm .wrapper a > div{
		font-size: 28px;
	}
	.cards .btm .wrapper a > .sale{
		font-size: 20px;
	}
	.cards .discount{
		height: 110px;
		width: 110px;
		right: 36px;
		bottom: 82px;
	}
	.cards .discount .wrapper{
		padding-top: 30%;
	}
	.cards .discount .wrapper span{
		font-size: 36px;
		line-height: 26px;
	}
	.cards .discount .wrapper .off{
		font-size: 24px;
	}*/

	.cards{
		height: 427px;
		background-size: 500px auto !important;
	}
	.cards .top{
		padding:15px;
        height: 135px;
	}
	.cards .top .title{
		padding: 3px 10px;
		color: #fff;
		font-size: 22px;
		font-weight: 600;
		line-height: 22px;
		-webkit-line-clamp: 3;
	}
	.cards .top img{
		max-width: 50px;
	}
	.cards .btm{
		height: 250px;
	}
	.cards .btm .wrapper{
		padding: 15px;
	}
	.cards .btm .wrapper .address{
		font-size: 14px;
		margin-bottom: 10px;
	}
	.cards .btm .wrapper a{
		padding: 10px;
	}
	.cards .btm .wrapper a > div{
		font-size: 20px;
	}
	.cards .btm .wrapper a > .sale{
		font-size: 14px;
	}
	.cards .discount{
		height: 80px;
		width: 80px;
		right: 20px;
		bottom: 66px;
	}
	.cards .discount .wrapper{
		padding-top: 30%;
	}
	.cards .discount .wrapper span{
		font-size: 26px;
		line-height: 22px;
	}
	.cards .discount .wrapper .off{
		font-size: 16px;
	}

@media (max-width: 375px) {

}