.topspace{background:#3276c6;padding:102px 0 40px}

.slider{position:relative;width:calc(100% - 410px);overflow:hidden;border-radius: 6px;background: #3d8ce8;float:left; margin-right:40px}
.slides{height:100%;overflow:hidden;-webkit-backface-visibility:hidden;-webkit-transform-style:preserve-3d;-webkit-transition:all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-moz-transition:all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-ms-transition:all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-o-transition:all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);transition:all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);margin:0;padding:0}
.slide{height:100%;float:left;clear:none;width: 100%}

.slider-arrow{position:absolute;display:block;height:100%;width:80px;background:rgb(255 255 255 / 0%);transition: .3s all ease}
.slider-arrow img{position: absolute;width:16px;height:16px;top:0;bottom:0;left:0;right:0;margin:auto;transition: .3s all ease}
.slider-arrow:hover{background: rgb(255 255 255 / 10%)}

.slider-arrow--right{top:0;right:0}
.slider-arrow--left{top:0;left:0}

.slider-arrow--left img{transform: rotate(180deg)}
.slider-nav{position:absolute;bottom:20px;width: max-content;left: 0;right: 0;margin: 0 auto;}
.slider-nav__item{width:32px;background:#fff;height:2px;float:left;clear:none;display:block;margin:0 3px;opacity:.1;}
.slider-nav__item:hover{opacity:1}
.slider-nav__item--current{opacity:1}



li.slide{list-style: none;margin:0;}
li.slide .box{height:310px;padding:30px 95px;color:#fff;background: #3d8ce8;position: relative;}
.darkslide{background: rgb(29 30 31 / 50%);width: 100%;height: 100%;backdrop-filter: blur(2px);}

img.slidebg{position: absolute;right: 100px;height: 370px;bottom: 0;pointer-events:none;user-select:none}




.slidetext{position: relative;z-index: 2;}

.slidetext h2, .slidetext h1{font-size: 38px;text-transform: uppercase;font-weight: 800;margin: 0}
.slidetext p{width: 60%;line-height: 26px;margin: 15px 0;font-size: 16px}

.wework{float: left;background: #3d8ce8;width:370px;height:370px;border-radius: 6px;}
.wework img{float: left;width: 100%;-webkit-mask-image: radial-gradient(black 70%, transparent 90%, transparent);}

.sllinks{overflow: hidden;width: 60%;margin-top: 20px;}
.sllink{display:block;float:left;padding:0 6px;line-height:24px;border-radius:3px;border:1px solid #fff;color:#fff;margin:0 10px 8px 0}
.sllink:hover{background:#fff;border:1px solid #fff;color:#3d8ce8}

@media (max-width: 1400px) {
.slidetext h2, .slidetext h1{font-size: 34px}
.slidetext p{width: 65%;line-height: 22px;margin: 10px 0;font-size: 15px}
}
@media (max-width: 1200px) {
li.slide .box{height: 330px;padding: 20px 80px;}
.slidetext h2, .slidetext h1{font-size:32px}
img.slidebg{right: 30px;}
.sllinks{width:80%}
}

@media (max-width: 1100px) {
.slider-arrows{display:none}
li.slide .box{height: 330px;padding: 20px 40px;}
.slidetext h2, .slidetext h1{font-size:28px}
}

@media (max-width: 950px) {
li.slide .box{height: 330px;padding: 20px;}
.slidetext h2, .slidetext h1{font-size:26px}
}

@media (max-width: 860px) {
.slider{width:100%;margin-right:0}
.wework{display:none}
.slidetext h2, .slidetext h1{font-size:30px}
.sllinks{width:60%}
}

@media (max-width: 740px) {
.slidetext h2, .slidetext h1{font-size:28px}
.slidetext p{width:75%}
.sllinks{width:70%}
.sllink{margin: 0 5px 5px 0;}
}



@media (max-width: 500px) {
li.slide .box{height: 350px;text-align:center}
.slidetext h2, .slidetext h1{font-size:24px;margin-top:30px	}
.slidetext p{width:84%;margin:10px 8%}
.sllinks{width: 80%;margin: 20px 10% 0;}
.sllink{display:inline-block;float:none;background:#fff;color:#3d8ce8}
img.slidebg{opacity:.7;filter:blur(2px)}

}
@media (max-width: 420px) {
.slidetext h2, .slidetext h1{font-size:22px;margin-top:20px	}
.slidetext p{width:90%;margin:10px 5%}
.sllinks{width: 84%;margin: 20px 8% 0;}
li.slide .box{padding: 15px;overflow: hidden;}
img.slidebg{right: 0;left: 0;margin: 0 auto;}


}

@media (max-width: 390px) {
li.slide .box{padding: 10px;}
.slidetext h2, .slidetext h1{font-size: 21px;margin-top: 15px;}
.sllink{margin: 0 4px 4px 0;padding: 0 4px}
.slidetext p{font-size:14px;line-height:20px}

}