#banner {width: 100vw;z-index: 3;}
#banner .draggable {min-width: 95vw;width: 95vw;margin: 0px auto 0 0;}
#banner .pos_abs {width: 100vw;height: 100vh;top: 0;left: 0;}
#banner .info {padding-bottom: 10vh;height: 90vh;background: rgb(15 15 15 / 33%);display: none;}
#banner .info .txt {margin: 290px auto 0;transition: all 0.7s ease;}
#banner .info .txt * {font-weight: 200;color: var(--white);opacity: 0;-webkit-transform: translateY(15px);transform: translateY(25px);}
#banner .info .txt h3 {letter-spacing: 4px;font-size: 56px;text-align: center;line-height: 170%;margin-bottom: 60px;font-weight: 500;}
#banner .info .txt h3:before {content: "";position: absolute;left: 50%;bottom: -40px;width: 1px;height: 45px;background-color: rgb(243 243 243 / 38%);}
#banner .info .txt article{text-align: center;font-family: 'Roboto', sans-serif;font-size: 22px;font-weight: 600;text-transform: uppercase;}
#banner .info .txt p {font-size: 24px;text-align: center;letter-spacing: 15px;}
#banner a.pos_abs { z-index: 2; }

#banner img{min-height: 85vh;height: 85vh;}

/* slick-current */
#banner .slick-current .info .txt * {opacity: 1;-webkit-transform: translateY(20px);transform: translateY(20px);transition-delay: .3s;-webkit-transition-delay: .3s;}
#banner .slick-current .info .txt p {letter-spacing: 2px;transition-delay: .6s;-webkit-transition-delay: .6s;font-weight: 100;}

#banner .slick-dots li button:before{display:none;}
#banner .slick-dots li button{background: rgb(255 255 255 / 0%);width: 12px;height: 12px;}
#banner .slick-dots li.slick-active button{background: rgb(255 255 255 / 0%);}
#banner .slick-dots {position: absolute;margin-top: 45px;width: auto;height: 100%;display: flex !important;flex-direction: column;justify-content: center;bottom: 0;right: 5px;}
#banner .slick-dots li {margin: 8px 30px;width: 12px;height: 12px;background: var(--primary);display: block;opacity: .1;}
#banner .slick-dots li.slick-active {opacity: .8;}
#banner .slick-dots li:before {margin: auto;display: block;border: 1px rgba(var(--white-rgb), .2) solid;content: "";display: none;}
#banner .slick-dots li.slick-active:before { border-color: var(--primary); }

/* scrolldown */
#scrolldown {position: absolute;right: 5vw;bottom: 0;z-index: 1;width: 200px;padding-left: 40px;font-size: 14px;font-weight: 600;letter-spacing: 1px;color: rgb(0 0 0);background-color: rgb(255 255 255 / 80%);text-transform: uppercase;text-align: center;animation: godown 1s infinite linear;-webkit-animation: godown 1s infinite linear;font-family: 'Montserrat', sans-serif;display: flex;align-items: center;justify-content: space-between;}


#scrolldown span{background-color: var(--primary);}
#scrolldown span img{width: 12px;min-width: 12px;min-height: 12px;height: 12px;padding: 25px;}

@media screen and (max-width: 1640px){
	#banner .slick-dots li{margin: 8px 22px;}
}

@media screen and (max-width: 1440px){
	#banner .info .txt {margin: 240px auto 0;}
	#banner .info .txt h3{font-size: 43px;}
}
@media screen and (max-width: 1366px){
	#banner .draggable{min-width: 94vw;width: 94vw;}
	#scrolldown{right: 6vw;}
	#banner img{min-height: 75vh;height: 75vh;}
}
@media screen and (max-width: 1140px){
	#banner img{min-width: 100vw;width: 100vw;min-height: 50vh;height: 50vh;object-fit: cover;}
	#banner .slick-dots{display: flex !important;width: 100%;height: auto;flex-direction: row;bottom: 0;margin-top: 0;}
	#banner .slick-dots li{margin: 8px;}
	#banner .draggable{min-width: auto;width: auto;}
	#scrolldown{display: none;}
}
@media screen and (max-width: 960px){
	#banner .info .txt{margin: 150px auto 0;}
	#banner .info .txt h3{font-size: 38px;}
	#banner .info .txt p{font-size: 18px;}
	#banner img {min-height: 50vh;height: 50vh;}
	#scrolldown{display: none;}
}
@media screen and (max-width: 780px){
	#banner img {min-height: 40vh;height: 40vh;}

}
@media screen and (max-width: 640px){
	#banner img {min-height: 40vh;height: 40vh;}

}
@media screen and (max-width: 560px){
	#banner img {min-height: 30vh;height: 30vh;}

}
@media screen and (max-width: 480px){
	#banner .info{height: 50vh;}
	#banner .info .txt{margin: 150px auto 0;}
	#banner .info .txt h3{font-size: 28px;letter-spacing: 0.5px;margin-bottom: 40px;}
	#banner .info .txt article{font-size: 18px;font-weight: 300;}
	#banner .info .txt p{font-size: 14px;}
	#banner .slick-current .info .txt p{letter-spacing: 1.2px;}
	#banner img {min-height: 20vh;height: 20vh;}
	#banner .info .txt h3:before{bottom: -31px;width: 1px;height: 25px;}
}