<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800' rel='stylesheet' type='text/css'> <div class="container"> <div class="row photo-with-button" style="background:url(http://legalprom.cl/wp-content/uploads/2014/05/main-bg-sociedades.jpg) no-repeat center;"> <div class="col-md-6 photo-with-button-content"> <h2>Necesito ayuda en</h2> <label class="checkbox-inline"> <input type="checkbox" id="inlineCheckbox1" value="option1"> Laboral </label> <label class="checkbox-inline"> <input type="checkbox" id="inlineCheckbox2" value="option2"> Bienes Raices </label> <label class="checkbox-inline"> <input type="checkbox" id="inlineCheckbox3" value="option3"> Litigios </label> <label class="checkbox-inline"> <input type="checkbox" id="inlineCheckbox3" value="option3"> Contratos </label> <h5 style="font-size:18px;font-weight:700;">Cuéntenos su caso</h5> <textarea class="form-control" rows="3"></textarea> <h5 style="font-size:18px;font-weight:700;">Quiero que un abogado experto me responda a</h5> <form class="form-inline"> <div class="form-group"> <label for="exampleInputEmail2">Mi e-mail</label> <input type="email" class="form-control" id="exampleInputEmail2" style="margin:0 0 10px 30px;"> </div> <div class="form-group"> <label for="exampleInputnumber">Mi teléfono</label> <input type="quantity" class="form-control" id="exampleInputnumber" min="8" max="12" style="margin-left:14px;"> </div> </form> <button class="btn btn-primary btn-lightblue-large">Enviar Caso Ahora</button> </div> </div> <h2 style="text-align:center;font-weight:300;color:#057d9f;margin:50px 0 30px 0;">3 Sencillos Pasos</h2> <div class="row row-three"> <div class="col-md-4"> <center><img alt="Paso 1 - formulario online" src="http://legalprom.cl/wp-content/uploads/2013/12/paso1-formulario.jpg"/></center> <h3 style="color:#444;">Cuéntenos su caso</h3> </div> <div class="col-md-4"> <center><img alt="Paso 2 - generación y revisión de documentos" src="http://legalprom.cl/wp-content/uploads/2013/12/paso2-documentos.jpg"/></center> <h3 style="color:#444;">Reciba respuesta de un abogado experto</h3> </div> <div class="col-md-4"> <center><img alt="Paso 3 - Firma en notaria" src="http://legalprom.cl/wp-content/uploads/2013/12/paso3-firma.jpg"/></center> <h3 style="color:#444;">Resuelva su caso</h3> </div> </div> </div>

body{ font-family: 'Open Sans', sans-serif;} .container{ width:100%;} .photo-with-button{ padding-top:100px; padding-bottom:100px;} .photo-with-button-content{ color:#35556b; padding-left:170px;} .photo-with-button-content h2{ font-size:46px; font-weight:300; width:600px; margin-bottom:30px;} .photo-with-button-content p{ font-size:18px; font-weight:300; } .btn-blue-large{ margin-top:30px; padding:20px; font-size:24px; font-weight:600; background-color:#35556b; border-color:#35556b;} .row-three{ margin:50px 0; padding:0 100px;} .row-three h3{ font-weight:300; color:#057d9f; text-align:center; font-size:24px;} .row-three p{ font-weight:300; text-align:center;} .btn-lightblue-large{ background-color:#39aecf; border-color:#39aecf; padding: 18px 30px; font-size:20px; font-weight:bold; margin:20px 0;} /*-------------------------------------------*/