@charset "utf-8";
/* CSS Document */


content{
	position:relative;
	display: block;
	padding-top:135px;
	margin:auto;
    min-height:300px;
}

::-webkit-scrollbar {
    width: 8px;
	height:8px;
	background-color:white;
}
 
/* Track */
::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(0,0,0,0.3); 
    -webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0.5); 
	box-shadow: inset 0 0 6px rgba(255,255,255,0.5); 
}
::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(255,255,255,0.8); 
}

banner{
    position:relative;
    display:block;
    width:100%; 
    height:0px; 
    padding-bottom:25%;
    background-color:#fff;
    overflow:hidden;
}

@media(max-width:768px){
    banner{
        padding-bottom:35%;
    }
}

@media(max-width:600px){
    banner{
        padding-bottom:45%;
    }
}

@media(max-width:500px){
    banner{
        padding-bottom:50%;
    }  
}

@media(max-width:350px){
    banner{
        padding-bottom:70%;
    }
}


banner .banner-bg{
    position:absolute;
    display:block;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
}

banner .banner-bg img{
    position:absolute;
    display:block;
    top:50%;
    right:0px;
    transform:translateY(-50%);
    height:100%;
    width:auto;
}

banner .banner-overlay{
}

banner .banner-title{
    position:absolute;
    display:none;
    width:auto;
    top:50%;
    left:0px;
    transform:translateY(-50%);
    padding:20px 20px;
    padding-left:20px;
}
banner .banner-title .banner-title-overlay{
    position:absolute;
    display:block;
    width:120%;
    height:100%;
    top:50%;
    left:42%;
    border-radius:15px;
    -webkit-transform: skew(-20deg) translate(-50%,-50%);
    -moz-transform: skew(-20deg) translate(-50%,-50%);
    -o-transform: skew(-20deg) translate(-50%,-50%);
     background-color:rgba(50,50,50,0.4);
    color:#fff;
    z-index:2;
}

banner .banner-title .banner-title-text{
    position:relative;
    display: block;
    font-size:50px;
    font-family:"Montserrat",sans-serif;
    font-weight:500;
    color:#fff;
    z-index:3;
}

.deals-list{
    position:relative;
    display:block;
    width:100%;
    height:auto; 
    max-width:1280px;
    min-height:500px;
    margin:auto;
    margin-top:50px;
    overflow:auto;
    padding-bottom:50px;
    margin-bottom:50px;
}

.deals-list #deals-list-content{
    padding-bottom:100px;
    margin:auto;
}

.deals-card {
	background: #FFF;
	border-radius: 3px;
	float: left;
	width: 386px;
	margin-bottom: 20px;
	margin-right: 20px;
	position: relative;
    overflow:hidden;
}
.deals-card:nth-of-type(3n) {
	margin-right: 0;
}
.deals-header {
	height: 250px;
	position: relative;
	border-radius: 3px 3px 0 0;
}
.deals-info {
	padding: 10px;
}
.deals-info a {
	color: #333;
}
.deals-date {
	text-transform: uppercase;
	font-size: 0.9em;
}
.deals-month, .deals-day {
	display: block;
}
.deals-month {
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.3em;
}
.deals-day {
	font-size: 2em;
}
.deals-details {
}
.deals-name {
	display: block;
	font-size: 25px;
    font-weight:bold;
}
.deals-sub-details {
    height:auto;
    padding-bottom:10px;
	margin-bottom: 5px;
    overflow:hidden;
}

.deal-list-footer{
    position:absolute;
    display:none;
    bottom:0px;
    width:100%;
    height:auto;
    text-align:center;
}

.deal-list-footer .loadDealBtn{
    position:relative;
    display:inline-block;
    padding:10px 15px;
    border-radius:3px;
    background-color:#ff6e40;
    text-align:center;
    color:#fff;
    font-weight:bold;
}