@charset "utf-8";
/* CSS Document */

.slider  {
    width: auto;
}
.slider .mask {
    /*margin: 0 -13px;*/
    
}
.slider .mask {
    position: relative;
    overflow: hidden;
    border-radius: 1em;
}

.slider .mask .scroll {
    position: relative;
    left: 0; top: 0;
    display: flex;
    flex-wrap: wrap;
}
/*
.slider .item {
    padding: 1em 1.7em;
}
*/

.paginacion {
    margin-top: 0em;
    position: relative;
}
.paginacion .pags {
    text-align: center;
    padding: 0 7em;
    margin-top: 3em;
}
.paginacion .pags div {
    display: inline-block; vertical-align: middle;
    width: 1.4em; height: 1.4em;
    margin: 1em;
    background: #ffffff;
    border: 2px solid #CCCCCC;
    border-radius: 10000px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s;
}
.paginacion .pags div.activo {
    left: 0px; top: 0px; right: 0px; bottom: 0px;
    border-color: #37BBED;
    background: #37BBED;
}
.slider .paginacion .flechas {
    display: flex;
    margin: 0 -0.7em;
}
.slider .paginacion .flechas .flecha {
    position: relative;
    pointer-events: all;
    cursor: pointer;
    transition: all 0.3s;
    width: 6.2em; height: 6.2em;
    background: #ffffff;
    border-radius: 10000px;
    margin: 0.7em;
}
.slider .paginacion .flechas .flecha svg {
    width: 2em;
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%,-50%);
}
.slider .paginacion .flechas .flecha svg .cls-1 {
    stroke: var(--color1); 
    transition: all 0.3s;
    fill: transparent !important;
}
.slider .paginacion .flechas .flecha:hover {
    background: var(--color1);
}
.slider .paginacion .flechas .flecha:hover svg .cls-1 {
    stroke: #ffffff;
}