@font-face {
    font-family: 'Raleway-Bold';
    src: url('../fonts/Raleway-Bold.ttf');
}
@font-face {
    font-family: 'Raleway-SemiBoldItalic';
    src: url('../fonts/Raleway-SemiBoldItalic.ttf');
}
@font-face {
    font-family: 'Tofino Regular';
    src: url('../fonts/Tofino-Regular.ttf');
}
:root {
    --green:#50891A ;
    --lightgreen: #45C33D;
    --darkgreen: #022D0B;
    --darksilver: #3D3D3D;
}


.semi{
    display: flex;
}
.semi_col1{
width: 50%;

}

.semi_col2{
width: 50%;
padding-left: 10%;
}

.title_semi{
    margin:auto;
    text-align: left;
    padding-left: 31%;
    font-family: 'Raleway-Bold';
    font-size: 2rem;
    color: var(--darkgreen);
    font-size: 2vw;

}

.title_semi h1{
    font-size: 2.3rem;
}

.carrucel{
    display: flex;
    justify-content: center;
    padding-top: 5rem;
    padding-bottom: 3rem;
}

.carrucel img{
    height: 10rem;
    margin: 1rem;
}
/* --- --- CAROUSEL --- --- */
.carousel__contenedor {
	position: relative;
}

.carousel__anterior,
.carousel__siguiente {
	position: absolute;
	display: block;
	width: 30px;
	height: 30px;
	border: none;
	top: calc(50% - 1rem);
	cursor: pointer;
	line-height: 30px;
	text-align: center;
	background: none;
	color: var(--lightgreen);
	opacity: 90%;
    z-index: 9999;
    font-size: 1.5rem;
}
.carousel__siguiente{
    right: 0;
}
.carousel__elemento img{
height: 100%;


}

.carousel__anterior:hover,
.carousel__siguiente:hover {
	opacity: 100%;
}



.carousel__lista {
	overflow: hidden;
  
}

.carousel__elemento {
	text-align: center;
    
}

.carousel__indicadores .glider-dot {
	display: block;
	width: 30px;
	height: 4px;
	background: #fff;
	opacity: .2;
	border-radius: 0;
}

.carousel__indicadores .glider-dot:hover {
	opacity: .5;
}

.carousel__indicadores .glider-dot.active {
	opacity: 1;
}

.carousel{
    display: none;
}

@media (max-width: 800px){
    .semi_col2{
    display: none;
    }

    .semi_banner{
        width: 100%;
    }
    .title_semi{
        padding: 0;
        text-align: center;
    }
    .carrucel{
       flex-wrap: wrap;
    }
    .carousel{
        display: block;
        margin-top: 3rem;
    }
    .carrucel{
        display: none;
    }
}