@media only screen and (max-width: 1075px) {
    .mobile-tablet {
        display: block;
    }

    .pc {
        display: none;
    }

    #demo{
        z-index: 100;
    }
    .bloque1-offset-top {
        margin-top: 55px;
    }

    .mob-bl1{
        position: relative;        
        width:100%;        
        /*background-color:rgb(0, 217, 255);*/
    }
    


}

@media only screen and (max-width:667px){
    .mobile-tablet {
        display: block;
    }

    .pc {
        display: none;
    }

    #demo{
        z-index: 100;
    }
    .bloque1-offset-top {
        margin-top: 55px;
    }

    .mob-bl1{
        position: relative;        
        width:100%;        
        /*background-color:rgb(0, 217, 255);*/
    }

    .bl1-titulo {
        position: relative;
        width: 100%;
        left: 10%;
        top: 13%;
        font-family: Sifon, serif;
        font-size: 25px;
        line-height: 1.1;
        color: rgb(61, 106, 229);
        padding-bottom: 15px;
    }
    .bl1-titulo > span{
        position: relative;
        width: 44%;
        font-family: RobotoM, sans-serif;
        font-size: 23px;
        line-height: 0;
        color: rgb(255, 116, 107);
        
    }
    
    .bl1-descripcion {
        position: relative;
        width: 79%;
        left: 10%;
        top: 11%;
        padding-top: 2%;
        font-family: RobotoL, serif;
        font-size: 15px;
        line-height: 1.4;
        color: rgb(64, 39, 94);        
    }

    .bl1{
        position: relative;
        background: url('../../imagenes/infografia5/movil/smartphone/bl1_fondo.png') no-repeat;
        background-size: cover;
    }
    .bl1-ilust{
        position: relative; 
        width: 100%; 
        height: 314px;
    }
    .bl1-personajes {
        position: absolute;
        left: 20%;
        top: 24%;
    }
    .bl1-planta-izq{
        position: absolute;
        left:0px;
        top:calc(100% - 315px);
    }
    .bl1-planta-der{
        position: absolute;
        left:calc(100% - 134px);        
        top:calc(100% - 152px);
    }
    .bl2{
        position: relative;
        background: url('../../imagenes/infografia5/movil/smartphone/bl2_fondo.png') no-repeat;
        background-size: cover;
        height: 640px;
    }
    .bl2-plantas-izq{
        position: absolute;
        left:0px;
        top:calc(100% - 247px);
    }
    .bl2-plantas-der{
        position: absolute;
        left:calc(100% - 181px);
        top:calc(100% - 297px);
    }
    .bl2-carrete {
        position: absolute;
        left: 50%;
        top: 144px;
        transform: translate(-50%);
    }
    .bl2-estrellas-mov{
        position: absolute;
        left:50%;
        top:0px;
        transform:translate(-50%);
    }
    .bl2-pestana-mov{
        position: absolute;
        left:0px;
        top:67px;
    }
    .bl2-texto {
        position: relative;
        width: 67%;
        max-width: 423px;
        left: 22%;
        top: 49%;
        padding-top: 2%;
        font-family: RobotoL, serif;
        font-size: 15px;
        line-height: 1.4;
        color: rgb(64, 39, 94);
    }
    .bl3{
        position: relative;
        background: url('../../imagenes/infografia5/movil/smartphone/bl3_fondo.png') no-repeat;
        background-size: cover;
        height: 640px;
    }
    .bl3-plantas-izq{
        position: absolute;
        left:0px;
        top:calc(100% - 160px);
    }
    .bl3-plantas-der{
        position: absolute;
        left:calc(100% - 114px);
        top:calc(100% - 176px);
    }
    .bl3-nubes-mov {
        position: absolute;
        left: 20%;
        top: 40%;
    }
    .bl3-edificio{
        position: absolute;
        left:50%;
        top:250px;
        transform: translate(-50%);
    }
    .bl3-pestana-mov{
        position: absolute;
        left:0%;
        top:60px;
    }
    .bl3-texto {
        position: relative;
        width: 86%;
        left: 13%;
        top: 17%;
        padding-top: 2%;
        font-family: RobotoL, serif;
        font-size: 15px;
        line-height: 1.5;
        color: rgb(64, 39, 94);
    }
    .bl4{
        position: relative;
        background: url('../../imagenes/infografia5/movil/smartphone/bl4_fondo.png') no-repeat;
        background-size: cover;
        /*height: 640px;*/
    }
    .bl4-top{
        position: relative;
        width: 100%;
        height: 420px;
    }
    .bl4-bottom{
        position: relative;
        width: 100%;
        background-image: linear-gradient(to right, rgb(68,112,230) , rgb(80,79,191));
        font-family: RobotoM, sans-serif;
        font-size: 15px;
        line-height: 1.4;
        color: white;
        padding-left: 13%;
        padding-right: 13%;        
        padding-top: 30px;
        padding-bottom: 30px;   
        text-align: center;
    }

    .bl4-plantas-izq{
        position: absolute;
        left:0%;
        top:130px;
    }
    .bl4-plantas-der{
        position: absolute;
        left: calc(100% - 125px);
        top: 62%;
    }
    .bl4-pestana1-mov{
        position: absolute;
        left:0%;
        top:26px;

    }
    .bl4-pestana2-mov{
        position: absolute;
        left:0%;
        top:404px;
        z-index: 101;

    }
    .bl4-personaje-estrellas{
        position: absolute;
        left: 32%;
        top: 189px;
        width: 159px;
        height: 201px;

    }
    .bl4-personaje{
        position: absolute;
        left:0%;
        top:0%;

    }
    .bl4-estrellas{
        position: absolute;
        left:0%;
        top:-5%;

    }
    .bl4-nubes{
        position: absolute;
        left:0%;
        top:10%;

    }
    .bl4-texto {
        position: absolute;
        left: 50%;
        top: 17%;
        transform: translate(-50%);
        width: 83%;
        font-family: RobotoL, serif;
        font-size: 15px;
        line-height: 1.5;
        color: rgb(64, 39, 94);
    }
    .bl5{
        position: relative;
        background-color: rgb(242,255,249);
    }
    .bl5-bottom-table-col1 {
        border-bottom: 1px solid;
        border-bottom-style: dashed;
        border-color: rgb(171, 183, 201);
        border-right: none;
        border-right-style: none;
    }
    .bl5-bottom-table-col2 {
        vertical-align: top;
    }
    .bl5-bottom-table-col2 > div {
        width: 100%;
        font-family: RobotoL, serif;
        font-size: 12px;
        line-height: 1.4;
        color: rgb(28, 26, 100);
    }

}