Bootstrap 3 Template

This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">

    <form action="#" method="post">

        <div class="container">
            <br><br><br><br>
            <div class="row">
            <div class="col-md-2"></div>
            <div class="col-md-3">

                <label for="select1" class="control-label">
                    <select id="select1" class="form-control input-md">
                        <option>1</option>
                        <option>2</option>
                    </select>
                </label>

                <br><br>

                <label for="select2" class="control-label">
                    <select id="select2" class="form-control input-md">
                        <option>1</option>
                        <option>2</option>
                    </select>
                </label>

                <br><br>

                </div>
            <div class="col-md-3">

                <label for="input1" class="control-label">
                    <input id="input1" type="number" class="form-control">
                </label>

                <br><br>

                <label for="input2" class="control-label">
                    <input id="input2" type="text" class="form-control">
                </label>

                <br><br>
    </div>

                <div class="col-md-3">
                    <label class="radio radio-inline" for="radioSim">
                        <input type="radio" class="radio" id="radioSim" name="radioName1" value="sim">
                        <b>Sim</b></label>
                    <label class="radio radio-inline" for="radioNao">
                        <input type="radio" class="radio" id="radioNao" name="radioName1" value="não">
                        <b>Não</b></label>

                    <br><br>

                    <label class="radio radio-inline"...

CSS

/* BARRA  DE PROGRESSO */

    .tasks{
        background-color: #F6F8F8;
        padding: 10px;
        border-radius: 5px;
        margin-top: 10px;
    }
    .tasks span{
        font-weight: bold;
    }
    .tasks input{
        display: block;
        margin: 0 auto;
        margin-top: 10px;
    }
    .tasks a{
        color: #000;
        text-decoration: none;
        border:none;
    }
    .tasks a:hover{
        border-bottom: dashed 1px #0088cc;
    }
    .tasks label{
        display: block;
        text-align: center;
    }

JavaScript

$("select, input").one('change', 'keypress', function() {
            var totalSelect = $('select').length;
            console.log(totalSelect);
            var totalInput = $('input').length;
            var total = totalInput + totalSelect;
            var atual = document.getElementById('progress').getAttribute('aria-valuenow');
            console.log(atual);
            if (atual == 0) {
                var percentual = 100 / total;
            console.log(percentual);
                $('.progress-bar').css('width', percentual + '%').attr('aria-valuenow', percentual);
            }
            else {
                percentual = (100 / total) + atual;
               $('.progress-bar').css('width', percentual + '%').attr('aria-valuenow', percentual);
        }
        });