.anim_bottom {
    opacity: 0;
    transform: translatey(150px);
    transition: 
        opacity 0.6s ease,
        transform 0.6s ease;
}

.anim_bottom.animate {
    opacity: 1;
    transform: translateX(0);
}

.animate_box .anim_left,
.animate_box .anim_right,
.animate_box .section_title {
	opacity: 0;
	transition: all 0.9s ease;
}

/* lewa kolumna */
.animate_box .anim_left {
	transform: translateX(-100px);
}

/* prawa kolumna */
.animate_box .anim_right {
	transform: translateX(100px);
}

/* tytuł – delikatnie z góry */
.animate_box .section_title {
	transform: translateY(-40px);
}

/* aktywacja */
.animate_box.is-visible .anim_left,
.animate_box.is-visible .anim_right,
.animate_box.is-visible .section_title {
	opacity: 1;
	transform: translate(0, 0);
}

/* fade-in */

.fade-scale {
    opacity: 0;
    transform: scale(0);
    transition: 
    opacity 0.6s ease-out,
    transform 0.3s ease-out;
}

.fade-scale.show {
    opacity: 1;
    transform: scale(1);
}

/* Karuzela pionowa */

#services_addit_bg {
    background: linear-gradient(180deg,rgba(45, 74, 67, 0.7) 0%, rgba(45, 74, 67, 0) 34%);
    padding: 0;
}

.vertical-carousel {
	height: 550px;
	overflow: hidden;
	position: relative;
}

.vertical-carousel .tab_box {
	margin-bottom: 20px;
}

.vertical-carousel {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-y;
}

/* opcjonalny efekt fade na górze i dole */
.fade_bg {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 120px;
	z-index: 2;
	pointer-events: none;
}

.top_fade {
	background: linear-gradient(180deg,rgba(45, 61, 58, 1) 0%, rgba(44, 57, 55, 0) 100%);
}

.bottom_fade {
    margin-top: -120px;
	background: linear-gradient(180deg,rgba(7, 14, 20, 0) 0%, rgba(7, 14, 20, 1) 100%);
}

.dots_bt {
    background: rgba(255,255,255,0.1);
    border: 0;
    width: 0.8em;
    height: 0.8em;
    border-radius: 10px;
    margin-top: 1em;
    margin-right: 0.4em;
}

.dots_bt.active {
    background: #28FED0;
    border: 0;
    width: 0.8em;
    height: 0.8em;
    border-radius: 10px;
    margin-top: 1em;
    margin-right: 0.4em;
}

@media (max-width: 768px) {
    .anim_bottom {
        opacity: unset;
    }

    .top_fade {
	    background: linear-gradient(180deg, rgb(16 18 18) 0%, rgba(44, 57, 55, 0) 100%);
    }

    .animate_box .anim_left, .animate_box .anim_right, .animate_box .section_title {
        opacity: 1;
    }
    
    .animate_box .anim_right, .animate_box .anim_left {
        transform: translateX(0px);
    }

    div.anim_right {
        padding: 1em 0;
    }
}
