@import 'https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800';

html, body { margin: 0; padding: 0; width: 100%; height: 100%; background: #111; }

.slideshow { width: 100%; height: 100%; position: relative; }
.item { width: 100%; height: 100%; position: relative; }
.slick-list, .slick-track { height: 100%; }

.back { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-position: center; background-size: cover; }
.back:before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgb(0,0,0); background: linear-gradient(90deg, rgba(15,15,15,.9) 0%, rgba(15,15,15,0) 100%); }
.content { width: calc(100% - 50px); font-family: 'Montserrat'; color: #FFF; position: absolute; top: 50%; left: 50px; transform: translateY(-50%); z-index: 1; }
.content .title { width: 90%; font-size: 60px; font-weight: 800; text-shadow: rgba(0,0,0,.2) 2px 2px; }
.content .sub-title { margin: 0 0 10px; font-size: 40px; font-weight: 300; text-shadow: rgba(0,0,0,.2) 1px 1px; }
.content .description { width: 500px; font-size: 25px; font-weight: 200; line-height: 1.3; }
.qr { padding: 10px; text-align: center; background: #000; position: absolute; bottom: 25px; left: 50px; border-radius: 8px; }
.qr img { width: 50px; height: auto; border-radius: 5px; display: block; }
.qr:after { content: 'Scan me'; font-family: 'Montserrat';  font-size:  9px; font-weight: 700; letter-spacing: .5px; color: #FFF; text-transform: uppercase; padding: 7px 0 0; display: block; }

.item-group { width: 100%; height: calc(100% - 125px); position: relative; background: #111; }
.box { width: 33.33%; height: 50%; position: relative; float: left; }
.box .back:before { opacity: .8; }
.box .content { left: 30px; }
.box .content .title { font-size: 25px; }
.box .content .sub-title { margin: 5px 0 5px; font-size: 18px; }
.banner { width: 100%; height: 125px; font-family: 'Montserrat';  font-size:  35px; font-weight: 800; text-align: center; color: #FFF; line-height: 118px; text-shadow: rgba(0,0,0,.2) 2px 2px; background-position: center; background-size: cover; float: left; }

.item-promo { text-align: center; }
.item-promo .back:before { display: none; }
.item-promo .content { width: 100%; left: 0; top: calc(50% - 20px); }
.item-promo .content .logo { margin-bottom: 35px; }
.item-promo .content .logo img { width: 200px; height: auto; display: inline-block; }
.item-promo .content .title { width: 100%; padding: 0 110px; font-size: 35px; box-sizing: border-box; }

.thredbo-logo { position: absolute; bottom: 42px; right: 50px; }
.thredbo-logo img { width: 55px; height: auto; display: block; }