Untitled

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <style>
      h1,h2,h3,h4{
	font-family: 'Mirza', cursive;

}

p,label{
	font-family: 'Roboto', sans-serif;

}


#about-us{
	max-width: 100%;
	padding-top: 50px;
}


/*Team -section*/
 #team-section h4{
	text-shadow: 0px -1px 1px rgba(76, 78, 115, 1);
}
.member-img img{
	padding-top: 10px;
	width: 50%;

}
.team-profile{
	background: #e0eafc;

}
.member-social {
	background: #EECDA3;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #EF629F, #EECDA3);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #EF629F, #EECDA3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.member-social .fa{
	color: white;
	padding: 20px 5px;
	font-size: 20px;
}

.member-social .fa:hover {
	color: #5f98f4;
}

.team-data {
	padding-top: 20px;
	padding-bottom: 20px;
}
/*Team media queries*/
@media (max-width: 768px){
	.team-data .col-xs-6 {
		width: 50%;
		padding-top : 10px;
	}
}

/*Services*/

.my-services {
	margin-top: 50px;
}


.service {
	margin-top: 20px;
}

@media (max-width: 768px){
	.img-responsive {
		width: 60% !important;


	}
}

@media (max-width: 320px){
	.my-services img{
		display: none !important;

	}
	.my-services{
		text-align: center;
	}
}

  </style>
</head>
<body>
 <link href="https://fonts.googleapis.com/css?family=Mirza:400,700|Roboto" rel="stylesheet">
  <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<section id="team-section">
        <h2 align="center">Our Leaders</h2>
        <div class="container">
          <div class="row team-data">
            <div class="col-md-3 col-sm-3 col-xs-6 col-md-offset-1">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 1</h4>
                      <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
            </div>
            </div>
            <div class="col-md-3 col-sm-3 col-xs-6 ">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 2</h4>
                   <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
              </div>
            </div>  <!-- member 1 ends here  -->
            <div class="col-md-3 col-sm-3 col-xs-6">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 3</h4>
                   <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
              </div>
            </div> <!-- member 2 ends here  -->

        </div>
      </section>
<section id="team-section">
        <h2 align="center">Our Team</h2>
        <div class="container">
          <div class="row team-data">
            <div style="margin-left:50px;" class="col-md-2 col-sm-3 col-xs-6 ">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 1</h4>
                   <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
            </div>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6 ">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 2</h4>
                   <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
              </div>
            </div>  <!-- member 1 ends here  -->
            <div class="col-md-2 col-sm-3 col-xs-6">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 3</h4>
                   <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
              </div>
            </div> <!-- member 2 ends here  -->
            <div class="col-md-2 col-sm-3 col-xs-6">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 4</h4>
                   <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
              </div>
            </div> <!-- member 3 ends here  -->
             <div class="col-md-2 col-sm-3 col-xs-6">
              <div class="team-profile">
                <div class="member-img" align="center">
                  <img src="https://s4.postimg.org/7ec1711st/person.png" alt="">
                </div>
                <h4 align="center">Member 4</h4>
                   <h5 align="center">Position</h5>
                <div class="member-social" align="center">
                  <a href=""><i class="fa fa-facebook"></i></a>
                  <a href=""><i class="fa fa-twitter"></i></a>
                  <a href=""><i class="fa fa-google"></i></a>
                </div>
              </div>
            </div> <!-- member 3 ends here  -->
          </div>
        </div>
      </section>
</body>
</html>