@import url('https://fonts.googleapis.com/css?family=Raleway');
#banner .slick-slide{position:relative;overflow:hidden}
#banner .slick-slide >a{display:block;position:relative;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;overflow:hidden}
.slick-slide a img{width:100%}
.slick-slide video,.slick-slide iframe,.slick-slide canvas{position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(1.4);z-index:2}
.slick-slide video,.slick-slide canvas{width:auto;transform:scale(1.4)}
#banner .slick-slide .art{position:absolute;z-index:3;width: 550px;top: calc(50% - 20px);left:200px;display: none;}
#banner .slick-slide h2{font-size: 85px;line-height:110%;color: #323847;text-transform: uppercase;word-break: break-word;position: relative;padding-bottom: 50px;}
#banner .slick-slide h2:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60px;
    height: 1px;
    background-color: #727879;
}
#banner .slick-slide p{margin-top:40px;font-size: 20px;line-height:150%;color: #323847;letter-spacing: 4px;}
#banner .slick-slide b{display:inline-block;background:rgba(255,255,255,0.71);padding:20px 65px;font-size:16px;line-height:110%;color:#3c3c3c;margin-top:65px;transition:all linear .2s;cursor:pointer}
#banner .slick-slide b:hover{background:rgba(218,42,42,0.71);color:#fff}
#banner .slick-dots{bottom: 20px;text-align: center;}
#banner .slick-dots li button{
    width: 60px;
    height: 4px;
    padding: 0;
}
#banner .slick-dots li{
    width: 60px;
    height: 4px;
}
#banner .slick-dots li button:before,#banner .slick-dots li.slick-active button:before{content: '';background: #fff;width: 60px;height: 4px;opacity: 1;}
#banner .slick-dots li button:before{font-size: 12px;background: #fff;opacity: .5;}
#views{position: relative;}

@media (min-width: 1025px) {
	#banner .slick-slide b a:hover{opacity:.7}
}
@media (max-width: 1440px) {
	#banner .slick-slide .art{top:calc(50% - 100px);left: 150px;}
	#banner .slick-slide b{margin-top:55px}
}
@media (max-width: 1280px) {
    #banner .slick-slide h2{
    font-size: 55px;
}
#banner .slick-slide .art{
    top: calc(50% - 50px);
    left: 60px;
    width: 400px;
}
}
@media (max-width: 1024px) {
	#views{width:100%;margin-left:0;}
	#banner .slick-slide .art{left:100px;top:calc(50% - 80px)}
	#banner .slick-slide h2{font-size:34px}
	#banner .slick-slide p{margin-top:30px;font-size:16px}
	#banner .slick-slide b{margin-top:45px;padding:18px 50px}
}
@media (max-width: 768px) {
	#banner .slick-slide .art{width: 220px;top:initial;bottom:50px;left: 30px;}
	#banner .slick-slide img{padding:30px 0}
}
@media (max-width: 640px) {
	#banner .slick-slide .art{left: 20px;width: calc(100% - 180px);}
	#banner .slick-slide p{margin-top:15px;line-height:130%}
	#banner .slick-slide b{margin-top:30px;padding:15px 40px}
}
@media (max-width: 480px) {
	#banner .slick-slide .art{bottom:20px}
	#banner .slick-slide h2{font-size:24px;padding-bottom: 20px;}
	#banner .slick-slide p{font-size: 12px;}
	#banner .slick-slide b{font-size:13px;margin-top:15px;padding:10px 30px}
	#banner .slick-dots{text-align:end;bottom: 0px;}
	#banner .slick-dots li, #banner .slick-dots li button, #banner .slick-dots li button:before, #banner .slick-dots li.slick-active button:before{
    width: 30px;
}
}