/* Slider */

section.wide {
    padding: 35px 0;
    font-weight: 300;
    overflow: hidden;
}

#eventSlider {
    position: relative;
}

.sliderMask {
    position: relative;
    margin: 0 auto;
    overflow: hidden;
}

.sliderContainer {
	--slide-count: 3;

    position: absolute;
    left: 0;
    display: flex;
}

.sliderContainer.animate {
    transition: .25s cubic-bezier(0.4, 0.0, 0.2, 1);;
}

#eventSlider .slide {
    position: relative;
    width: 370px;
    min-height: 450px;
    height: auto;
    padding: 3em 4.5em;
    padding: 3em 0;
    margin: 0 2em;
    flex: 0 0 auto;
}

.slide-container{
	position: relative;
	height: 100%;
    margin: auto;
    padding: 40px 50px;
}



#slideNext,
#slidePrev {
    position: absolute;
    top: 50%;
    margin-top: -27px;
    z-index: 100;
    width: 54px;
    color: #fff;
    font-size: 34px;
    text-align: center;
    line-height: 54px;
    cursor: pointer;
    transition: .25s ease-out;
}

.ico-arrow::before {
    color: inherit;
}


#slideNext:hover,
#slidePrev:hover {
    color: var(--red);
}

#slidePrev {
    left: -10px;
    transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
}

#slideNext {
    right: -10px;
}

@media (max-width: 768px) {
	
    .section3 .container-title{
        position: relative;
        margin: 0 auto 60px;
        width: 100%;
    }

    .section3 h2{
        -moz-transform: unset;
        -o-transform: unset;
        -webkit-transform: unset;
        filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=0.083);
        -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";
        transform: unset;
    }

    .slide .month{
        font-size: 26px;
    }

    .slide .day {
        font-size: 50px;
    }

    .slide-container{
        margin: 0 0 0 5px;
    }

    #eventSlider{
        width: 100%;
    }

    .sliderMask{
        width: 80%;
    }
    .slide-container {
	    padding: 30px 37px;
    }
    #events-section .container {
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    }

}

@media (max-width: 640px) {

    section {
        padding: 45px 0;
    }

}

@media (max-width: 576px) {
	
    .sliderMask {
        width: 85%;
    }
    #slideNext,
	#slidePrev {
    width: 41px;
    font-size: 24px;

}
}


@media (max-width: 480px) {
	
    .sliderMask {
        width: 70%;
    }
    
    	#eventSlider .slide {
	    	width: 246px;
	    }
}

