Bootstrap Snippet Telefones Úteis - Filtered List using HTML CSS Bootstrap jQuery

"Telefones Úteis - Filtered List"
Bootstrap 3.1.0 Snippet by brenot

3.1.0 jQuery

1.1K 0 Fav

Post to Facebook Tweet this

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>  <a href="http://bootsnipp.com/mouse0270/snippets/4l0k2" class="btn btn-danger hide" id="back-to-bootsnipp">Back to Bootsnipp</a> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-offset-3 col-sm-6"> <div class="panel panel-default"> <div class="panel-heading c-list"> <span class="title">Telefones Úteis</span> <ul class="pull-right c-controls"> <li><a href="#" class="hide-search" data-command="toggle-search" data-toggle="tooltip" data-placement="top" title="Toggle Search"><i class="fa fa-ellipsis-v"></i></a></li> </ul> </div> <div class="row" style="display: none;"> <div class="col-xs-12"> <div class="input-group c-search"> <input type="text" class="form-control" id="contact-list-search"> <span class="input-group-btn"> <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-search text-muted"></span></button> </span> </div> </div> </div> <ul class="list-group" id="contact-list"> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-a"> <p class="label-contato"><strong>ABAM</strong></p> <p class="info-contato">Associação Brasileira de Auxílio Mútuo ao Servidor Público</p> <div class="tel-contato"><strong>2232-4580</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Aerobarcas</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2533-4343</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Aeroporto Internacional</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2432-7070</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Aeroporto de Jacarepaguá</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2620-8589</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Aeroporto Santos Dumont</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3398-5050</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>AFDM - BRASIL</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3398-4526</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Agência Nacional de Saúde</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3398-4527</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Água e esgoto</strong></p> <p class="info-contato">Cedae (Companhia Estadual de Águas e Esgotos)</p> <div class="tel-contato"><strong>0800-2821-195</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Al-Anon</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2507-4558</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Alcoólicos Anônimos</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2507-5830</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Alô Rio</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2542-8080</strong></div> <div class="tel-contato"><strong>2542-8004</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Ambulância</strong></p> <p class="info-contato">Serviço Público de Remoção de Doentes - SAMU</p> <div class="tel-contato"><strong>192</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Ampla</strong></p> <p class="info-contato">Iluminação e energia</p> <div class="tel-contato"><strong>0800-2821-195</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>ANATEL</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800-282-1195</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Animais</strong></p> <p class="info-contato">Suipa (Sociedade União Internacional Protetora dos Animais)</p> <div class="tel-contato"><strong>2501-1529</strong></div> <div class="tel-contato"><strong>2501-9954</strong></div> <div class="tel-contato"><strong>2261-6875</strong></div> <div class="tel-contato"><strong>2501-8691</strong></div> <div class="tel-contato"><strong>2261-9405</strong></div> <div class="tel-contato"><strong>2501-1085</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Anjos do Asfalto</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2590-2121</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>ASEP</strong></p> <p class="info-contato">Agência Reguladora de Serviços Públicos do Rio de Janeiro</p> <div class="tel-contato"><strong>2253-4813</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Atendimento ao Turista</strong></p> <p class="info-contato">Centro Integrado de Atendimento ao Turista</p> <div class="tel-contato"><strong>2541-7522</strong></div> <div class="tel-contato"><strong>2542-8004</strong></div> <div class="tel-contato"><strong>2542-8080</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>APAE</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2220-5065</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-b"> <p class="label-contato"><strong>Banco Central</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2253-9283</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Banco de Sangue</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800-280-0120</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>BPTur</strong></p> <p class="info-contato">Batalhão de Policiamento em Áreas Turísticas</p> <div class="tel-contato"><strong>2332-7932</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Barcas</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>133</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-c"> <p class="label-contato"><strong>Caixa Econômica Federal</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3978-8827</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>CAS</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3978-8829</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Cedae</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800-24-9040</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>CEG</strong></p> <p class="info-contato">Gás</p> <div class="tel-contato"><strong>0800-24-7766</strong></div> <div class="tel-contato"><strong>0800-282-0205</strong></div> <div class="tel-contato"><strong>0800-979-2345</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Central de Atendimento à Mulher</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>180</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Central de Atendimento ao Cidadão</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>1746</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>CET-Rio</strong></p> <p class="info-contato">Trânsito</p> <div class="tel-contato"><strong>2226-5566</strong></div> <div class="tel-contato"><strong>0800-282-0708</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Comlurb</strong></p> <p class="info-contato">Companhia Municipal de Limpeza Urbana</p> <div class="tel-contato"><strong>2204-9999</strong></div> <div class="tel-contato"><strong>2214-7073</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Corpo de Bombeiros</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>193</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Correios</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800-570-0100</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Crianças desaparecidas</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2286-8337</strong></div> <div class="tel-contato"><strong>2226-6375</strong></div> <div class="tel-contato"><strong>2286-7631</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>CVV</strong></p> <p class="info-contato">Centro de Valorização da Vida</p> <div class="tel-contato"><strong>0800-726-0101</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Defesa Civil</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>199</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-d"> <p class="label-contato"><strong>Defesa Civil Estadual</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3399-4302</strong></div> <div class="tel-contato"><strong>3399-4301</strong></div> <div class="tel-contato"><strong>2293-1713</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Defesa Civil Municipal</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>199</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Delegacia de Atendimento ao Turista</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800-282-1195</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Delegacia da Mulher</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>142</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Detran</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800-20-4040</strong></div> <div class="tel-contato"><strong>0800-24-7766</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Direitos Humanos</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2508-5500</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque-Aids</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800-570-0100</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque-Amamentação</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>141</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque Barulho</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2503-2795</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque Denúncia</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2253-1177</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque Intoxicação</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>0800 722 6001</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque Procon</strong></p> <p class="info-contato">Defesa do consumidor</p> <div class="tel-contato"><strong>1512</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque Sinal</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2508-5500</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque Transportes</strong></p> <p class="info-contato">Trânsito</p> <div class="tel-contato"><strong>2286-8010</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Disque Verde</strong></p> <p class="info-contato">Patrulha ambiental</p> <div class="tel-contato"><strong>2498-1001</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-g"> <p class="label-contato"><strong>GAT</strong></p> <p class="info-contato">Grupamento de Apoio ao Turista</p> <div class="tel-contato"><strong>2535-3780</strong></div> <div class="tel-contato"><strong>2535-2385</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-h"> <p class="label-contato"><strong>Disque Sangue HEMORIO</strong> </p> <div class="tel-contato"><strong>0800 2820708</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-i"> <p class="label-contato"><strong>INCA</strong></p> <div class="tel-contato"><strong>3207-1000</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Instituto Benjamin Constant</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3478-4442</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-l"> <p class="label-contato"><strong>Light</strong></p> <p class="info-contato">Iluminação e energia</p> <div class="tel-contato"><strong>0800-282-0120</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-m"> <p class="label-contato"><strong>Moradores de rua</strong></p> <p class="info-contato">Secretaria de Estado de Assistência Social e Direitos Humanos</p> <div class="tel-contato"><strong>2299-5451</strong></div> <div class="tel-contato"><strong>2299-5697</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-n"> <p class="label-contato"><strong>Nar-Anon</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2263-6595</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Narcóticos Anônimos</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2533-5015</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-p"> <p class="label-contato"><strong>Polícia Civil</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>197</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Polícia Federal</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>194</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Polícia Militar</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>190</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Poda ou remoção de árvores</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2221-2574</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Praças abandonadas</strong></p> <p class="info-contato">Fundação Parques e Jardins</p> <div class="tel-contato"><strong>2323-3500</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-r"> <p class="label-contato"><strong>RioLuz</strong></p> <p class="info-contato">Iluminação e energia</p> <div class="tel-contato"><strong>3907-5600</strong></div> <div class="tel-contato"><strong>2535-5151</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Rodoviária Novo Rio</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2263-4857</strong></div> <div class="tel-contato"><strong>3213-1800</strong></div> <div class="tel-contato"><strong>R 397</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-s"> <p class="label-contato"><strong>Secretaria Municipal de Assistência Social</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>3973-3800</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-t"> <p class="label-contato"><strong>Tapa buraco</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2589-1234</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>Telefonia</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>10331</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12"> <p class="label-contato"><strong>TURISRIO</strong></p> <p class="info-contato">Companhia de Turismo do Estado do Rio de Janeiro</p> <div class="tel-contato"><strong>0800 282 2007</strong></div> <div class="tel-contato"><strong>2333-1037</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="contato col-xs-12" id="letra-v"> <p class="label-contato"><strong>Vigilância sanitária</strong></p> <p class="info-contato"></p> <div class="tel-contato"><strong>2503-2280</strong></div> <div class="tel-contato"><strong>2215-0690</strong></div> <div class="linha-contato"></div> </div> <div class="clearfix"></div> </li> <li class="list-group-item"> <div class="col-xs-12 col-sm-3"> <img src="http://api.randomuser.me/portraits/men/49.jpg" alt="Scott Stevens" class="img-responsive img-circle" /> </div> <div class="col-xs-12 col-sm-9"> <span class="name">Scott Stevens</span><br/> <span class="glyphicon glyphicon-map-marker text-muted c-info" data-toggle="tooltip" title="5842 Hillcrest Rd"></span> <span class="visible-xs"> <span class="text-muted">5842 Hillcrest Rd</span><br/></span> <span class="glyphicon glyphicon-earphone text-muted c-info" data-toggle="tooltip" title="(870) 288-4149"></span> <span class="visible-xs"> <span class="text-muted">(870) 288-4149</span><br/></span> <span class="fa fa-comments text-muted c-info" data-toggle="tooltip" title="scott.stevens@example.com"></span> <span class="visible-xs"> <span class="text-muted">scott.stevens@example.com</span><br/></span> </div> <div class="clearfix"></div> </li> </ul> </div> </div> </div>  <script src="//rawgithub.com/stidges/jquery-searchable/master/dist/jquery.searchable-1.0.0.min.js"></script> </div>

@import url(//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css); body { padding: 30px 0px 60px; } .panel > .list-group .list-group-item:first-child { /*border-top: 1px solid rgb(204, 204, 204);*/ } @media (max-width: 767px) { .visible-xs { display: inline-block !important; } .block { display: block !important; width: 100%; height: 1px !important; } } #back-to-bootsnipp { position: fixed; top: 10px; right: 10px; } .c-search > .form-control { border-radius: 0px; border-width: 0px; border-bottom-width: 1px; font-size: 1.3em; padding: 12px 12px; height: 44px; outline: none !important; } .c-search > .form-control:focus { outline:0px !important; -webkit-appearance:none; box-shadow: none; } .c-search > .input-group-btn .btn { border-radius: 0px; border-width: 0px; border-left-width: 1px; border-bottom-width: 1px; height: 44px; } .c-list { padding: 0px; min-height: 44px; } .title { display: inline-block; font-size: 1.7em; font-weight: bold; padding: 5px 15px; } ul.c-controls { list-style: none; margin: 0px; min-height: 44px; } ul.c-controls li { margin-top: 8px; float: left; } ul.c-controls li a { font-size: 1.7em; padding: 11px 10px 6px; } ul.c-controls li a i { min-width: 24px; text-align: center; } ul.c-controls li a:hover { background-color: rgba(51, 51, 51, 0.2); } .c-toggle { font-size: 1.7em; } .name { font-size: 1.7em; font-weight: 700; } .c-info { padding: 5px 10px; font-size: 1.25em; }

$(function () { /* BOOTSNIPP FULLSCREEN FIX */ if (window.location == window.parent.location) { $('#back-to-bootsnipp').removeClass('hide'); } $('[data-toggle="tooltip"]').tooltip(); $('#fullscreen').on('click', function(event) { event.preventDefault(); window.parent.location = "http://bootsnipp.com/iframe/4l0k2"; }); $('a[href="#cant-do-all-the-work-for-you"]').on('click', function(event) { event.preventDefault(); $('#cant-do-all-the-work-for-you').modal('show'); }) $('[data-command="toggle-search"]').on('click', function(event) { event.preventDefault(); $(this).toggleClass('hide-search'); if ($(this).hasClass('hide-search')) { $('.c-search').closest('.row').slideUp(100); }else{ $('.c-search').closest('.row').slideDown(100); } }) $('#contact-list').searchable({ searchField: '#contact-list-search', selector: 'li', childSelector: '.col-xs-12', show: function( elem ) { elem.slideDown(100); }, hide: function( elem ) { elem.slideUp( 100 ); } }) });

Questions / Comments:

Posting GuidelinesFormatting