﻿@keyframes show
{
    from
    {
        opacity : 0;
        scale   : 90%;
    }
    to
    {
        opacity : 1;
        scale   : 100%;
    }
}
@keyframes mostrarScalar {
	from 
    {
        opacity   : 0;
        transform : scale3d(.5, .5, .5);
	}
	to 
    {
        opacity: 1;
	}
}


.bloque-1 .icono, .bloque-1 .titulo, .bloque-1 .panel .titulo-1, .bloque-1 .panel .titulo-2, .bloque-1 .panel .row-titulo-3 svg, .bloque-1 .panel .titulo-3, .bloque-1 .panel .titulo-4, .bloque-1 .panel .row-titulo-3b svg
{
    animation: mostrarScalar 1.5s ease 0s 1 normal forwards;
}
.bloque-2 .titulo, .bloque-2 .txt-1, .bloque-2 .ico, .bloque-2 .txt-2, .bloque-2 .txt-3, .bloque-2 .boton, .bloque-3 .titulo, .bloque-3 svg, .bloque-3 .titulo-3, .bloque-3 .titulo-4, .bloque-4 .titulo, .bloque-4 .titulo-2, .bloque-4 .funcionalidad, .bloque-4 .contacto,
.bloque-5 .titulo-1, .bloque-5 .titulo-2, .bloque-5 .titulo-3, .bloque-5 .slider-itegraciones, .bloque-6 .col-comillas svg, .bloque-6 .opinion, .bloque-6 .row-opinion, .bloque-7 .texto-1, .bloque-7 .texto-2, .bloque-7 .boton, .bloque-8 .txt-1, .bloque-8 .txt-2, .bloque-8 .txt-3 a
{
    view-timeline-name   : --fadeA;
    view-timeline-axis   : block;
    animation-timeline   : --fadeA;
    animation-name       : show;
    animation-range      : entry 35% cover 50%;
    animation-fill-mode  : both;
}
 .bloque-2 .img-1 img, .bloque-3 .imagen-1 img, .bloque-3 .imagen-2 img, .bloque-8 .imagen img
 {
    view-timeline-name   : --fadeB;
    view-timeline-axis   : block;
    animation-timeline   : --fadeB;
    animation-name       : show;
    animation-range      : entry 15% cover 40%;
    animation-fill-mode  : both;
 }






.bloque-1
{
    background-color : #F4F7FE;
    position         : relative
}
.bloque-1 .icono
{
    padding : 100px 0px 20px 0px;
}
.bloque-1 .titulo
{
    color       : #244079;
    text-align  : center;
    font-size   : 44px;
    font-style  : normal;
    font-weight : 800;
    line-height : 57.2px;
    padding     : 0px 0px 275px 0px;
}
.bloque-1 .panel
{
    position       : absolute;
    top            : 287px;
    border-radius  : 12px;
    background     : #FFF;
    box-shadow     : 0px 8px 20px 0px rgba(0, 0, 0, 0.05);
    margin         : 0px 150px 0px 150px;
    width          : fit-content;
    padding-bottom : 40px;
}
.bloque-1 .panel .titulo-1
{
    color       : #244079;
    font-size   : 18px;
    font-style  : normal;
    font-weight : 400;
    line-height : 23.4px;
    padding     : 60px 0px 10px 60px
}
.bloque-1 .panel .titulo-2
{
    color       : #244079;
    font-family : Inter;
    font-size   : 36px;
    font-style  : normal;
    font-weight : 800;
    line-height : 46.8px;
    padding     : 0px 80px 80px 60px;    
}
.bloque-1 .panel .row-titulo-3
{
    padding : 60px 135px 0px 40px;
}
.bloque-1 .panel .row-titulo-3b
{
    padding : 30px 135px 0px 40px;
}
.bloque-1 .panel .titulo-3
{
    color       : #262626;
    font-size   : 22px;
    font-style  : normal;
    font-weight : 600;
    line-height : 26.4px;
    padding     : 0px 0px 0px 0px;
}
.bloque-1 .panel .titulo-4
{
    color       : #737B7D;
    font-size   : 16px;
    font-style  : normal;
    font-weight : 400;
    line-height : 22.4px;
    padding     : 10px 70px 0px 90px;    
}


.bloque-2 .titulo
{
    padding     : 250px 0px 108px 0px;
    color       : #385DA8;
    text-align  : center;
    font-size   : 22px;
    font-style  : italic;
    font-weight : 400;
    line-height : 30.8px;
    margin      : 0 auto;
    max-width   : 750px;
}
.bloque-2 .img-1
{
    padding : 0px 0px 100px 168px;
}
.bloque-2 .txt-1
{
    color       : #244079;
    font-size   : 36px;
    font-style  : normal;
    font-weight : 800;
    line-height : 46.8px;
    padding     : 10px 100px 50px 95px;
}
.bloque-2 .txt-2
{
    color       : #262626;
    font-size   : 22px;
    font-style  : normal;
    font-weight : 600;
    line-height : 26.4px;
    padding     : 0px 0px 10px 10px;
}
.bloque-2 .txt-3
{
    color       : #737B7D;
    font-size   : 16px;
    font-style  : normal;
    font-weight : 400;
    line-height : 22.4px;
    padding     : 0px 150px 0px 10px;
}
.bloque-2 .ico
{
    padding : 0px 0px 0px 95px;
}
.bloque-2 .row-1
{
    padding-top    : 30px;
    padding-bottom : 30px;
}
.bloque-2 .col-boton
{
    display         : flex;
    justify-content : space-around;
}
.bloque-2 .boton
{
    border-radius  : 6px;
    border         : 2px solid #385DA8;
    background     : #FFFFFF;
    color          : #385DA8;
    font-size      : 16px;
    font-style     : normal;
    font-weight    : 600;
    line-height    : 22px;
    letter-spacing : -0.32px;
    width           : fit-content;
    margin          : 50px 0px 0px 0px;
    padding         : 13px 40px;
}

.bloque-3
{
    background-color : #F4F7FE;
    padding-bottom   : 100px;
}
.bloque-3 .titulo
{
    max-width   : 690px;
    color       : #244079;
    text-align  : center;
    font-size   : 36px;
    font-style  : normal;
    font-weight : 800;
    line-height : 46.8px;
    margin      : 0 auto;
    padding     : 120px 0px 80px 0px;
}
.bloque-3 .row-titulo-3
{
    padding : 60px 135px 0px 40px;
}
.bloque-3 .row-titulo-3b
{
    padding : 30px 135px 0px 40px;
}
.bloque-3 .row-titulo-3c
{
    padding : 0px 135px 0px 40px;
}
.bloque-3 .titulo-3
{
    color       : #262626;
    font-size   : 22px;
    font-style  : normal;
    font-weight : 600;
    line-height : 26.4px;
    padding     : 0px 0px 0px 0px;
}
.bloque-3 .titulo-4
{
    color       : #737B7D;
    font-size   : 16px;
    font-style  : normal;
    font-weight : 400;
    line-height : 22.4px;
    padding     : 10px 70px 0px 90px;    
}
.bloque-3 .imagen-1
{
    padding : 0px 0px 0px 120px;    
}
.bloque-3 .imagen-1 img, .bloque-3 .imagen-2 img
{
    width   : 100%;
}
.bloque-3 .imagen-2
{
    padding : 90px 0px 0px 0px;
    margin  : 0px 0px 0px -15px;
}
.bloque-3 .textos-p1
{
    padding : 40px 60px 0px 70px;
}
.bloque-3 .textos-p2
{
    padding : 53px 0px 0px 77px;
}
.bloque-3 ul
{
    padding: 0px 0px 0px 20px;
}
.bloque-3 li
{
     padding : 0px 0px 10px 0px;
}


.bloque-4
{
}
.bloque-4 .titulo
{
    color       : #244079;
    text-align  : center;
    font-size   : 36px;
    font-style  : normal;
    font-weight : 800;
    line-height : 46.8px;
    padding     : 120px 0px 10px 0px;
}
.bloque-4 .titulo-2
{
    color       : #737B7D;
    text-align  : center;
    font-size   : 20px;
    font-style  : normal;
    font-weight : 400;
    line-height : 26px;
    max-width   : 670px;
    margin      : 0 auto;
    padding     : 0px 0px 90px 0px;
}
.bloque-4 .col-funcionalidades
{
    padding : 0px 80px 14px 100px;
}
.bloque-4 .col-funcionalidad
{
    padding : 0px;
}

.bloque-4 .funcionalidad
{    
    border-radius : 12px;
    border        : 1.5px solid rgba(36, 64, 121, 0.15);
    min-height    : 115px;
    margin       : 8px;
}
.bloque-4 .funcionalidad .row-funcionalidad
{
    padding : 30px 30px 30px 30px;
}
.bloque-4 .funcionalidad .icono
{
    padding : 0px 0px 0px 0px;
}
.bloque-4 .funcionalidad .texto
{
    color       : #262626;
    font-size   : 22px;
    font-style  : normal;
    font-weight : 600;
    line-height : 26.4px;
    display     : flex;
    align-items : center;
}
.bloque-4 .contacto
{
    color       : #DD082D;
    font-size   : 18px;
    font-style  : normal;
    font-weight : 800;
    line-height : 23.4px;
    text-align  : center;
    padding     : 60px 0px 120px 0px;
}


.bloque-5
{
    background-color : #F4F7FE;
}
.bloque-5 .titulo-1
{
    color       : #244079;
    text-align  : center;
    font-size   : 18px;
    font-style  : normal;
    font-weight : 400;
    line-height : 23.4px;
    padding     : 120px 0px 30px 0px;
}
.bloque-5 .titulo-2
{
    color       : #244079;
    text-align  : center;
    font-size   : 36px;
    font-style  : normal;
    font-weight : 800;
    line-height : 46.8px;
    padding     : 0px 0px 10px 0px;
}
.bloque-5 .titulo-3
{
    color       : #737B7D;
    text-align  : center;
    font-size   : 20px;
    font-style  : normal;
    font-weight : 400;
    line-height : 26px;
    padding     : 0px 0px 60px 0px;
    max-width   : 675px;
    margin      : 0 auto;
}
.bloque-5 .row-slider
{
    padding : 60px 0px 170px 0px;
}

.bloque-6 .col-comillas
{
    text-align : center;
    margin     : 100px 0px 24px 0px;
}
.bloque-6 .row-opinion
{
    justify-content : center;
    margin          : 45px 0px 110px 0px;
}
.bloque-6 .opinion
{
    color       : #262626;
    text-align  : center;
    font-size   : 28px;
    font-style  : italic;
    font-weight : 300;
    line-height : 39.2px;
    max-width   : 800px;
    margin      : 0 auto;
}
.bloque-6 .row-opinion .usuario
{
    margin  : 0px 0px 0px 20px;
    padding : 0px;
}
.bloque-6 .row-opinion .txt-1
{
    color       : #737B7D;
    font-size   : 16px;
    font-style  : normal;
    font-weight : 600;
    line-height : normal;
    padding     : 0px;
    margin      : 0px;
}
.bloque-6 .row-opinion .txt-2
{
    color       : #5A7184;
    font-size   : 14px;
    font-style  : normal;
    font-weight : 400;
    line-height : normal;
    padding     : 0px;
    margin      : 4px 0px 0px 5px;
}
.bloque-6 .row-opinion .logo
{
    padding     : 0px;
    margin      : 0px;
}
.bloque-6 .row-opinion .sello
{
    padding     : 0px;
    margin      : 0px;
}
.bloque-6 .row-opinion .puesto
{
    padding : 3px 0px 0px 0px;
    margin  : 0px;
}

.bloque-7
{
    background-color : #385DA8;
}
.bloque-7 a
{
    width  : fit-content;
    margin : 0 auto;
}
.bloque-7 .texto-1
{
    color       : #FFFFFF;
    text-align  : center;
    font-size   : 28px;
    font-style  : normal;
    font-weight : 800;
    line-height : 36.4px;
    max-width   : 670px;
    margin      : 80px auto 10px auto;
}
.bloque-7 .texto-2
{
    color       : #C3CEE5;
    text-align  : center;
    font-size   : 18px;
    font-style  : normal;
    font-weight : 400;
    line-height : 23.4px;
    max-width   : 670px;
    margin      : 0 auto;
}
.bloque-7 .boton
{
    border-radius : 6px;
    background    : #DD082D;
    color         : #FFFFFF;
    padding       : 12px 40px;
    margin        : 30px auto 80px auto;
}


.bloque-8
{
    background-color : #F4F7FE;
}
.bloque-8 .col-textos
{
    padding : 0px 180px 0px 120px;
}
.bloque-8 .txt-1
{
    color       : #244079;
    font-size   : 44px;
    font-style  : normal;
    font-weight : 800;
    line-height : 57.2px;
    margin      : 124px 0px 0px 0px;
}
.bloque-8 .txt-2
{
    color       : #737B7D;
    font-size   : 18px;
    font-style  : normal;
    font-weight : 400;
    line-height : 23.4px;
    margin      : 20px 0px 40px 0px;
}
.bloque-8 .txt-3
{
    color       : #DD082D;
    font-size   : 18px;
    font-style  : normal;
    font-weight : 800;
    line-height : 23.4px;
    margin      : 0px 0px 124px 0px;
}
.bloque-8 .imagen
{
    margin : 60px 0px 0px 0px;
}




@media (min-width: 1440px) 
{
}
@media (min-width: 1400px)  and (max-width: 1440px) /*XXL*/
{
    .bloque-1 .panel
    {
        margin: 0px 130px 0px 130px;
    }

    .bloque-2 .img-1 
    {
        padding: 0px 0px 100px 140px;
    }

    .bloque-3 .imagen-1 
    {
        padding: 0px 0px 0px 100px;
    }
}
@media (min-width: 1200px)  and (max-width: 1399px) /*XL*/
{
    .bloque-1 .panel
    {
        margin: 0px 100px 0px 100px;
    }
    .bloque-1 .titulo
    {
        font-size : 41px;
        padding   : 0px 0px 275px 0px;
    }


    .bloque-2 .img-1 
    {
        padding: 0px 0px 100px 110px;
    }
    .bloque-2 .img-1 img
    {
        width: 100%;
    }
    .bloque-2 .txt-1
    {
        font-size   : 29px !important; 
        line-height : initial !important;
        padding     : 0px 50px 40px 85px;
    }
    .bloque-2 .ico 
    {
        padding: 0px 0px 0px 75px;
    }
    .bloque-2 .txt-3
    {
        padding: 0px 40px 0px 10px;
    }


    .bloque-3 .textos-p2 
    {
        padding: 53px 0px 0px 60px;
    }


    .bloque-4 .funcionalidad
    {    
        min-height    : 141px;
    }


    .bloque-8 .col-textos
    {
        padding: 0px 100px 0px 120px;
    }
}

@media (min-width: 992px)  and (max-width: 1199px) /*LG*/
{
    .bloque-1 .icono 
    {
        padding: 80px 0px 20px 0px;
    }
    .bloque-1 .titulo
    {
        font-size : 41px;
        padding   : 0px 0px 230px 0px;
    }
    .bloque-1 .panel
    {
        margin : 0px 70px 0px 70px;
        top    : 270px;
    }
    .bloque-1 .panel .titulo-2
    {
        font-size   : 30px !important; 
        line-height : initial !important;
    }
    .bloque-1 .panel .row-titulo-3 
    {
        padding: 60px 40px 0px 10px;
    }
    .bloque-1 .panel .row-titulo-3b
    {
        padding: 30px 40px 0px 10px;
    }
    .bloque-1 .panel .titulo-4
    {
        padding: 10px 30px 0px 60px;
    }



    .bloque-2 .titulo
    {
        padding: 250px 0px 100px 0px;
    }
    .bloque-2 .img-1 
    {
        padding         : 0px 0px 100px 80px;
        display         : flex;
        flex-direction  : column;
        justify-content : flex-end;
    }
    .bloque-2 .img-1 img
    {
        width: 100%;
    }
    .bloque-2 .txt-1
    {
        font-size   : 29px !important; 
        line-height : initial !important;
        padding     : 0px 50px 40px 85px;
    }
    .bloque-2 .ico 
    {
        padding: 0px 0px 0px 75px;
    }
    .bloque-2 .txt-3
    {
        padding: 0px 40px 0px 10px;
    }
    .bloque-2 .col-boton
    {
        padding-bottom: 80px;
    }



    .bloque-3
    {
        padding-bottom: 50px;
    }
    .bloque-3 .titulo
    {
        font-size   : 33px !important; 
        line-height : initial !important;
        padding     : 90px 0px 60px 0px;
    }
    .bloque-3 .row-titulo-3 
    {
        padding: 0px 135px 0px 40px;
    }
    .bloque-3 .imagen-1 
    {
        padding : 0px 0px 0px 90px;
        display : flex;
    }
    .bloque-3 .imagen-2
    {
        display         : flex;
        flex-direction  : column;
        justify-content : center;
        padding         : 0px;
    }
    .bloque-3 .textos-p1 
    {
        padding: 40px 60px 0px 40px;
    }


    .bloque-4 .titulo
    { 
        font-size   : 32px !important; 
        line-height : initial !important;
    }


    .bloque-5 .titulo-2
    {
        font-size   : 32px !important; 
        line-height : initial !important;
    }
    .bloque-5 .row-slider
    {
        padding : 60px 0px 130px 0px;
    }


    .bloque-8 .col-textos
    {
        padding: 0px 100px 0px 70px;
    }
    .bloque-8 .imagen img
    {
        width : 100%;
    }
    .bloque-8 .txt-1
    {
        font-size   : 39px !important; 
        line-height : initial !important;
    }
}

@media (min-width: 768px)  and (max-width: 991px) /*MD*/
{
    .bloque-1 .icono 
    {
        padding: 80px 0px 20px 0px;
    }
    .bloque-1 .titulo
    {
        font-size : 41px;
        padding   : 0px 0px 250px 0px;
    }
    .bloque-1 .panel
    {
        margin : 0px 70px 0px 70px;
        top    : 270px;
    }
    .bloque-1 .panel .titulo-1
    {
        padding: 30px 0px 10px 60px;
    }
    .bloque-1 .panel .titulo-2
    {
        font-size   : 30px !important; 
        line-height : initial !important;
        padding     : 0px 60px 0px 60px;
    }
    .bloque-1 .panel .row-titulo-3 
    {
        padding: 40px 40px 0px 10px;
    }
    .bloque-1 .panel .row-titulo-3b
    {
        padding: 30px 40px 0px 10px;
    }
    .bloque-1 .panel .titulo-4
    {
        padding: 10px 30px 0px 60px;
    }


    .bloque-2 .titulo
    {
        padding: 250px 60px 90px 60px;
    }

    .bloque-2 .img-1 
    {
        padding         : 0px 40px 100px 60px;
        display         : flex;
        justify-content : space-around;
    }
    .bloque-2 .img-1 img
    {
        width: 80%;
    }
    .bloque-2 .txt-1
    {
        font-size   : 29px !important; 
        line-height : initial !important;
        padding     : 0px 50px 40px 85px;
    }
    .bloque-2 .ico 
    {
        padding: 0px 0px 0px 75px;
    }
    .bloque-2 .txt-3
    {
        padding: 0px 40px 0px 10px;
    }
    .bloque-2 .col-boton
    {
        padding-bottom: 80px;
    }


    .bloque-3
    {
        padding-bottom: 50px;
    }
    .bloque-3 .titulo
    {
        font-size   : 33px !important; 
        line-height : initial !important;
        padding     : 90px 20px 30px 40px;
    }
    .bloque-3 .row-titulo-3
    {
        padding: 20px 135px 0px 40px;
    }
    .bloque-3 .row-bloque-3
    {
        flex-direction: column-reverse;
    }
    .bloque-3 .imagen-1, .bloque-3 .imagen-2
    {
        padding    : 30px 0px 0px 20px;
        margin     : 0px;
        text-align : center;
    }
    .bloque-3 .imagen-1 img, .bloque-3 .imagen-2 img
    {
        width : 70%
    }
    .bloque-3 .textos-p1, .bloque-3 .textos-p2
    {
        padding: 50px 0px 0px 50px;
    }


    .bloque-4 .titulo
    { 
        font-size   : 32px !important; 
        line-height : initial !important;
        padding     : 80px 0px 10px 0px;
    }
    .bloque-4 .funcionalidad
    {    
        min-height    : 141px;
    }
    .bloque-4 .funcionalidad .texto
    {
        font-size: 20px;
    }
    .bloque-4 .col-funcionalidades 
    {
        padding: 0px 50px 14px 70px;
    }
    .bloque-4 .contacto
    {
        padding: 60px 0px 80px 0px;
    }


    .bloque-5 .titulo-1
    {
        padding: 90px 0px 30px 0px;
    }
    .bloque-5 .titulo-2
    {
        font-size   : 32px !important; 
        line-height : initial !important;
    }
    .bloque-5 .row-slider
    {
        padding : 30px 0px 80px 0px;
    }
    .bloque-5 .titulo-3
    {
        padding: 10px 20px 60px 20px;
    }


    .bloque-6 .opinion, .bloque-7 .texto-2
    {
        padding : 0px 20px 0px 40px;
    }


    .bloque-8 .txt-1
    {
        font-size   : 39px !important; 
        line-height : initial !important;
        margin      : 80px 0px 0px 0px;
    }
    .bloque-8 .col-textos
    {
        padding: 0px 100px 0px 120px;
    }
    .bloque-8 .txt-3
    {
        margin: 0px 0px 60px 0px;
    }
    .bloque-8 .imagen
    {
        text-align : center;
        margin     : 0px 0px 80px 0px;
    }
}

@media (min-width: 576px)  and (max-width: 767px) /*SM*/
{
    .bloque-1 .icono 
    {
        padding: 50px 0px 20px 0px;
    }
    .bloque-1 .titulo
    {
        font-size : 41px;
        padding   : 0px 0px 280px 0px;
    }
    .bloque-1 .panel
    {
        margin : 0px 40px 0px 40px;
        top    : 240px;
    }
    .bloque-1 .panel .titulo-1
    {
        padding: 30px 0px 10px 60px;
    }
    .bloque-1 .panel .titulo-2
    {
        font-size   : 24px !important; 
        line-height : initial !important;
        padding     : 0px 40px 0px 40px;
    }
    .bloque-1 .panel .titulo-3
    {
        font-size: 20px;
    }
    .bloque-1 .panel .row-titulo-3 
    {
        padding: 40px 40px 0px 10px;
    }
    .bloque-1 .panel .row-titulo-3b
    {
        padding: 30px 40px 0px 10px;
    }
    .bloque-1 .panel .titulo-4
    {
        padding: 10px 30px 0px 60px;
    }


    .bloque-2 .titulo
    {
        padding: 250px 60px 90px 60px;
    }
    .bloque-2 .img-1 
    {
        padding         : 0px 10px 70px 40px;
        display         : flex;
        justify-content : space-around;
    }
    .bloque-2 .img-1 img
    {
        width: 80%;
    }
    .bloque-2 .txt-1
    {
        font-size   : 29px !important; 
        line-height : initial !important;
        padding     : 0px 30px 40px 85px;
    }
    .bloque-2 .ico 
    {
        padding: 0px 0px 0px 75px;
    }
    .bloque-2 .txt-3
    {
        padding: 0px 40px 0px 10px;
    }
    .bloque-2 .col-boton
    {
        padding-bottom: 80px;
    }


    .bloque-3
    {
        padding-bottom: 50px;
    }
    .bloque-3 .titulo
    {
        font-size   : 33px !important; 
        line-height : initial !important;
        padding     : 90px 20px 30px 40px;
    }
    .bloque-3 .row-titulo-3
    {
        padding: 20px 135px 0px 40px;
    }
    .bloque-3 .row-bloque-3
    {
        flex-direction: column-reverse;
    }
    .bloque-3 .imagen-1, .bloque-3 .imagen-2
    {
        padding    : 30px 0px 0px 20px;
        margin     : 0px;
        text-align : center;
    }
    .bloque-3 .imagen-1 img, .bloque-3 .imagen-2 img
    {
        width : 70%
    }
    .bloque-3 .textos-p1, .bloque-3 .textos-p2
    {
        padding: 25px 0px 0px 25px;
    }


    .bloque-4 .titulo
    { 
        font-size   : 32px !important; 
        line-height : initial !important;
        padding     : 80px 0px 10px 0px;
    }
    .bloque-4 .funcionalidad .texto
    {
        font-size: 20px;
    }
    .bloque-4 .col-funcionalidades 
    {
        padding: 0px 50px 14px 70px;
    }
    .bloque-4 .contacto
    {
        padding: 60px 0px 80px 0px;
    }


    .bloque-5 .titulo-1
    {
        padding: 90px 0px 30px 0px;
    }
    .bloque-5 .titulo-2
    {
        font-size   : 32px !important; 
        line-height : initial !important;
    }
    .bloque-5 .row-slider
    {
        padding : 30px 0px 80px 0px;
    }
    .bloque-5 .titulo-3
    {
        padding: 10px 20px 60px 20px;
    }


    .bloque-6 .opinion, .bloque-7 .texto-2
    {
        padding : 0px 20px 0px 40px;
    }


    .bloque-8 .txt-1
    {
        font-size   : 39px !important; 
        line-height : initial !important;
        margin      : 80px 0px 0px 0px;
    }
    .bloque-8 .col-textos
    {
        padding: 0px 30px 0px 50px;
    }
    .bloque-8 .txt-3
    {
        margin: 0px 0px 60px 0px;
    }
    .bloque-8 .imagen
    {
        text-align : center;
        margin     : 0px 0px 80px 0px;
    }
}

@media (min-width: 0px)  and (max-width: 575px) /*XS*/
{ 
    .bloque-1 .icono 
    {
        padding: 50px 0px 20px 0px;
    }
    .bloque-1 .titulo
    {
        font-size : 32px;
        padding   : 0px 0px 370px 0px;
    }
    .bloque-1 .panel
    {
        margin : 0px 20px 0px 20px;
        top    : 220px;
    }
    .bloque-1 .panel .titulo-1
    {
        padding: 30px 0px 10px 60px;
    }
    .bloque-1 .panel .titulo-2
    {
        font-size   : 24px !important; 
        line-height : initial !important;
        padding     : 0px 40px 0px 40px;
    }
    .bloque-1 .panel .titulo-3
    {
        font-size: 20px;
    }
    .bloque-1 .panel .row-titulo-3 
    {
        padding: 40px 40px 0px 10px;
    }
    .bloque-1 .panel .row-titulo-3b
    {
        padding: 30px 40px 0px 10px;
    }
    .bloque-1 .panel .titulo-4
    {
        padding: 10px 30px 0px 60px;
    }


    .bloque-2 .titulo
    {
        padding: 300px 10px 60px 30px;
    }
    .bloque-2 .img-1 
    {
        padding         : 0px 10px 70px 40px;
        display         : flex;
        justify-content : space-around;
    }
    .bloque-2 .img-1 img
    {
        width: 80%;
    }
    .bloque-2 .txt-1
    {
        font-size   : 29px !important; 
        line-height : initial !important;
        padding     : 0px 30px 40px 30px;
    }
    .bloque-2 .ico 
    {
        padding: 0px 0px 0px 30px;
    }
    .bloque-2 .txt-3
    {
        padding: 0px 40px 0px 10px;
    }
    .bloque-2 .col-boton
    {
        padding-bottom: 80px;
    }


    .bloque-3
    {
        padding-bottom: 50px;
    }
    .bloque-3 .titulo
    {
        font-size   : 30px !important; 
        line-height : initial !important;
        padding     : 60px 20px 30px 40px;
    }
    .bloque-3 .row-titulo-3
    {
        padding: 20px 20px 0px 10px;
    }
    .bloque-3 .row-titulo-3b 
    {
        padding: 30px 20px 0px 10px;
    }
    .bloque-3 .row-titulo-3c 
    {
        padding: 0px 20px 0px 10px;
    }
    .bloque-3 .titulo-4
    {
        padding: 10px 20px 0px 60px;
    }
    .bloque-3 .row-bloque-3
    {
        flex-direction: column-reverse;
    }
    .bloque-3 .imagen-1, .bloque-3 .imagen-2
    {
        padding    : 30px 0px 0px 20px;
        margin     : 0px;
        text-align : center;
    }
    .bloque-3 .imagen-1 img, .bloque-3 .imagen-2 img
    {
        width : 70%
    }
    .bloque-3 .textos-p1, .bloque-3 .textos-p2
    {
        padding: 25px 0px 0px 25px;
    }


    .bloque-4 .titulo
    { 
        font-size   : 32px !important; 
        line-height : initial !important;
        padding     : 60px 10px 10px 10px;
    }
    .bloque-4 .titulo-2
    {
        padding: 0px 10px 40px 10px;
    }
    .bloque-4 .funcionalidad .texto
    {
        font-size: 20px;
    }
    .bloque-4 .col-funcionalidades 
    {
        padding: 0px 20px 14px 40px;
    }
    .bloque-4 .contacto
    {
        padding: 40px 0px 60px 0px;
    }


    .bloque-5 .titulo-1
    {
        padding: 60px 0px 30px 20px;
    }
    .bloque-5 .titulo-2
    {
        font-size   : 30px !important; 
        line-height : initial !important;
        padding     : 0px 0px 10px 20px;
    }
    .bloque-5 .row-slider
    {
        padding : 30px 0px 80px 0px;
    }
    .bloque-5 .titulo-3
    {
        padding: 10px 20px 60px 40px;
    }


    .bloque-6 .opinion, .bloque-7 .texto-2
    {
        padding : 0px 20px 0px 40px;
    }


    .bloque-8 .txt-1
    {
        font-size   : 36px !important; 
        line-height : initial !important;
        margin      : 80px 0px 0px 0px;
    }
    .bloque-8 .col-textos
    {
        padding: 0px 30px 0px 50px;
    }
    .bloque-8 .txt-3
    {
        margin: 0px 0px 60px 0px;
    }
    .bloque-8 .imagen
    {
        text-align : center;
        margin     : 0px 0px 80px 0px;
    }
    .bloque-8 .imagen img
    {
        width : 80%;
    }
}