<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="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<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 ---------->
<div class="container">
<div class="row">
<div class="col-sm-12 bhoechie-tab-container">
<div class="col-md-1 col-sm-2 col-xs-3 bhoechie-tab-menu">
<div class="list-group">
<a href="#" class="list-group-item active text-center">
<img src="https://www.fmsc.org/-/media/images/batey106/ismaeledited.jpg" width="100%" height="100%"><span class="cover">Ismael</span>
</a>
<a href="#" class="list-group-item text-center">
<img src="https://www.fmsc.org/-/media/images/batey106/rosaedited2.jpg" width="100%" height="100%"><span class="cover">Rosa</span>
</a>
<a href="#" class="list-group-item text-center">
<img src="https://www.fmsc.org/-/media/images/batey106/chefcanditoedited.jpg" width="100%" height="100%"><span class="cover">Chef Candito
</span></a>
<a href="#" class="list-group-item text-center">
<img src="https://www.fmsc.org/-/media/images/batey106/pastormedeedited.jpg" width="100%" height="100%"><span class="cover">Pastor Mede
</span></a>
<a href="#" class="list-group-item text-center">
<img src="https://www.fmsc.org/-/media/images/batey106/rosaedited2.jpg" width="100%" height="100%"><span class="cover">Five
</span></a>
<a href="#" class="list-group-item text-center">
<img src="https://www.fmsc.org/-/media/images/batey106/ismaeledited.jpg" width="100%" height="100%"><span class="cover">Six
</span></a>
</div>
</div>
<div class="col-lg-11 col-md-11 col-sm-10 col-xs-9 bhoechie-tab">
<!-- flight section -->
<div class="bhoechie-tab-content active">
<div class="image third-round leader1 leaderimg" style="">
<img class="img-responsive" src="https://www.fmsc.org/-/media/images/batey106/ismaeledited.jpg" alt="leaders">
</div>
<div class="leaderdescription" style="">
<div id="leader1-content" class="anchortarget" style="display: block;">
<h2>Ismael</h2>
<p>If you ask 21-year-old Ismael what he wants to be when he grows up, first he will you that he’s already grown up. Then he’ll rattle off a list of a dozen career possibilities and ideas for his future. But more than anything, Ismael wants to be a leader in Batey 106 and in the Dominican Republic – an identity he doesn’t realize he has already begun to achieve.</p>
<p>“When people ask what you want to do with your future, it means they can see you have a future,” he said. </p>
<p>Before the cooking and English classes were available in Batey 106, young people would leave, Ismael said. But now, he said, they have a future. </p></div>
</div>
</div>
<!-- train section -->
<div class="bhoechie-tab-content">
<div class="image third-round leader1 leaderimg" style="">
<img class="img-responsive" src="https://www.fmsc.org/-/media/images/batey106/rosaedited.jpg" alt="leaders">
</div>
<div class="leaderdescription" style="">
<div id="leader2-content" class="anchortarget" style="display: block;">
<h2>Rosa</h2>
<p>Rosa remembers watching her older sister get married at 13 years old. And it wasn’t just her, she said. </p>
<p>Roas has lived in Batey 106 her whole life and seen girls as young as 12 get married and have babies. </p>
<p>“You would see children carrying children, and this caused a lot of problems,” the 29-year-old committee member said. “They knew that that was the only way they could find what they were looking for and be taken care of.”</p>
<p>But it’s different now.</p>
<p>“This project has done a big thing for the females of this community,” she said about the PBFA. “Now there’s a mentality with the young girls that there is more.”</p>
<p>And it’s personal for Rosa as a mom of three girls ranging in age from 10 months to 9 years. </p>
<p>She dreams that her daughters can achieve what she wasn’t able to, and now she knows they have that opportunity. </p>
<p>But the project has also revitalized her dreams. She is currently finishing secondary school and has plans to study psychology. </p></div>
</div>
</div>
<!-- hotel search -->
<div class="bhoechie-tab-content">
<div class="image third-round leader1 leaderimg" style="">
<img class="img-responsive" src="https://www.fmsc.org/-/media/images/batey106/chefcanditoedited.jpg" alt="leaders">
</div>
<div class="leaderdescription" style="">
<div id="leader2-content" class="anchortarget" style="display: block;">
<h2>Chef Candito</h2>
<p>“You would see children carrying children, and this caused a lot of problems,” the 29-year-old committee member said. “They knew that that was the only way they could find what they were looking for and be taken care of.”</p>
<p>But it’s different now.</p>
<p>“This project has done a big thing for the females of this community,” she said about the PBFA. “Now there’s a mentality with the young girls that there is more.”</p>
<p>And it’s personal for Rosa as a mom of three girls ranging in age from 10 months to 9 years. </p>
<p>She dreams that her daughters can achieve what she wasn’t able to, and now she knows they have that opportunity. </p>
<p>But the project has also revitalized her dreams. She is currently finishing secondary school and has plans to study psychology. </p></div>
</div>
</div>
<div class="bhoechie-tab-content">
<div class="image third-round leader1 leaderimg" style="">
<img class="img-responsive" src="https://www.fmsc.org/-/media/images/batey106/pastormedeedited.jpg" alt="leaders">
</div>
<div class="leaderdescription" style="">
<div id="leader2-content" class="anchortarget" style="display: block;">
<h2>Pastor Mede</h2>
<p>Roas has lived in Batey 106 her whole life and seen girls as young as 12 get married and have babies. </p>
<p>“You would see children carrying children, and this caused a lot of problems,” the 29-year-old committee member said. “They knew that that was the only way they could find what they were looking for and be taken care of.”</p>
<p>But it’s different now.</p>
<p>“This project has done a big thing for the females of this community,” she said about the PBFA. “Now there’s a mentality with the young girls that there is more.”</p>
<p>And it’s personal for Rosa as a mom of three girls ranging in age from 10 months to 9 years. </p>
<p>She dreams that her daughters can achieve what she wasn’t able to, and now she knows they have that opportunity. </p>
<p>But the project has also revitalized her dreams. She is currently finishing secondary school and has plans to study psychology. </p></div>
</div>
</div>
<div class="bhoechie-tab-content">
<div class="image third-round leader1 leaderimg" style="">
<img class="img-responsive" src="https://www.fmsc.org/-/media/images/batey106/chefcanditoedited.jpg" alt="leaders">
</div>
<div class="leaderdescription" style="">
<div id="leader2-content" class="anchortarget" style="display: block;">
<h2>Five</h2>
<p>But it’s different now.</p>
<p>“This project has done a big thing for the females of this community,” she said about the PBFA. “Now there’s a mentality with the young girls that there is more.”</p>
<p>And it’s personal for Rosa as a mom of three girls ranging in age from 10 months to 9 years. </p>
<p>She dreams that her daughters can achieve what she wasn’t able to, and now she knows they have that opportunity. </p>
<p>But the project has also revitalized her dreams. She is currently finishing secondary school and has plans to study psychology. </p></div>
</div>
</div>
<div class="bhoechie-tab-content">
<div class="image third-round leader1 leaderimg" style="">
<img class="img-responsive" src="https://www.fmsc.org/-/media/images/batey106/ismaeledited.jpg" alt="leaders">
</div>
<div class="leaderdescription" style="">
<div id="leader2-content" class="anchortarget" style="display: block;">
<h2>Six</h2>
<p>“This project has done a big thing for the females of this community,” she said about the PBFA. “Now there’s a mentality with the young girls that there is more.”</p>
<p>And it’s personal for Rosa as a mom of three girls ranging in age from 10 months to 9 years. </p>
<p>She dreams that her daughters can achieve what she wasn’t able to, and now she knows they have that opportunity. </p>
<p>But the project has also revitalized her dreams. She is currently finishing secondary school and has plans to study psychology. </p></div>
</div>
</div>
</div>
</div>
</div>
</div>
/* bhoechie tab */
div.bhoechie-tab-container{
z-index: 10;
background-color: #ffffff;
padding: 0 !important;
border-radius: 4px;
-moz-border-radius: 4px;
margin-top: 20px;
margin-left: 50px;
background-clip: padding-box;
opacity: 0.97;
filter: alpha(opacity=97);
}
.list-group-item {
max-height: 100px;
overflow: hidden;
padding: 0 !important;
border: 0 !important;
margin: 10px 0px;
}
.list-group-item img {
opacity: 0.2;
border-radius: 50%;
}
.active img {
opacity: 0.8;
}
div.bhoechie-tab-menu{
padding-right: 0;
padding-left: 0;
padding-bottom: 0;
}
div.bhoechie-tab-menu div.list-group{
margin-bottom: 0;
}
div.bhoechie-tab-menu div.list-group>a{
margin-bottom: 0;
}
div.bhoechie-tab-menu div.list-group>a .glyphicon,
div.bhoechie-tab-menu div.list-group>a .fa {
color: rgba(35, 97, 146, 0.85);;
}
div.bhoechie-tab-menu div.list-group>a:first-child{
border-top-right-radius: 0;
-moz-border-top-right-radius: 0;
}
div.bhoechie-tab-menu div.list-group>a:last-child{
border-bottom-right-radius: 0;
-moz-border-bottom-right-radius: 0;
}
div.bhoechie-tab-menu div.list-group>a.active,
div.bhoechie-tab-menu div.list-group>a.active .glyphicon,
div.bhoechie-tab-menu div.list-group>a.active .fa{
background-color: white;
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
}
div.bhoechie-tab-menu div.list-group>a.active:after{
content: '';
position: absolute;
left: 100%;
top: 50%;
margin-top: -13px;
border: 0;}
.cover {
position: absolute;
top: 30px;
left: 10px;
font-weight: bold;
}
div.bhoechie-tab-content{
background-color: #ffffff;
border: 0px;
padding: 0px;
}
div.bhoechie-tab div.bhoechie-tab-content:not(.active){
display: none;
}
.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
border: 0px;
}
.third-round img {
max-width: 200px;
border-radius: 100px;
float: right;
margin-left: 50px;
}
$(document).ready(function() {
$("div.bhoechie-tab-menu>div.list-group>a").click(function(e) {
e.preventDefault();
$(this).siblings('a.active').removeClass("active");
$(this).addClass("active");
var index = $(this).index();
$("div.bhoechie-tab>div.bhoechie-tab-content").removeClass("active");
$("div.bhoechie-tab>div.bhoechie-tab-content").eq(index).addClass("active");
});
});