body{
    font-family: roboto;
    font-weight: 300;
}

.contenedor_tabla{
    width: 50%;
    margin: auto;
}

.fila{
    background-color: #428A96;
    color: #fff;
    width: 35%;
    float: left;
    padding: 5px;
}

.fila2{
    color: #000;
    width: 55%;
    float: left;
}

.fila3{
    background-color: #422A96;
    color: #fff;
    width: 90%;
    float: left;
    padding: 5px;
}

.fila4{
    background-color: #8A8A96;
    color: #fff;
    width: 35%;
    float: left;
    padding: 5px;
}

.fila5{
    background-color: #8A8A8A;
    color: #fff;
    width: 35%;
    float: left;
    padding: 5px;
}

.fila6{
    color: #fff;
    width: 55%;
    float: left;
}

.fila7{
    background-color: #AA8A8A;
    color: #fff;
    width: 35%;
    float: left;
    padding: 5px;
}

.inputs{
    border: 2px solid #8EB7BE;
    height: 25px;
    font-family: roboto;
}

.limpiar{
    clear: both;
}

.calcular_fila{
    width: 100%;
}

.calcular_boton {
    background-color: #428A96;
    border: 0px;
    font-family: roboto;
    font-size: 22px;
    cursor: pointer;
    margin: auto;
    width: 100%;
    color: #fff;
    padding: 7px;
}

.span_val{
    font-weight: 500;
    font-size: 17px;
}

.respuesta{
    display: none;
    color: red;
}

#valor_respuesta{
    font-weight: 500;
    font-size: 17px;
    color: red;
}

.calcular_fila{
    width: 92%;
}

 .range_gen{
        width: 100%;
        margin-bottom: 15px;
    }

@media (min-width: 768px) and (max-width: 979px) {
    .contenedor_tabla{
        width: 80%;
        margin: auto;
    }
    
    .fila{
        width: 95%;
        float: none;
        padding: 7px;
    }

    .fila2{
        width: 95%;
        float: none;
    }
    
    .range_gen{
        width: 100%;
        margin-bottom: 15px;
    }
    
    .calcular_boton{
        width: 98%;
        padding: 7px;
        color: #fff;
    }
    
}

@media  (max-width: 767px) {
    .contenedor_tabla{
        width: 100%;
        margin: auto;
    }

    .fila{
        width: 95%;
        float: none;
        padding: 7px;
    }

    .fila2{
        width: 95%;
        float: none;
    }
    
    .range_gen{
        width: 100%;
        margin-bottom: 15px;
    }
    
    .calcular_boton{
        width: 95%;
        padding: 7px;
        color: #fff;
    }
}