Difference between revisions of "Team:IIT Kanpur/Team"

Line 2: Line 2:
 
<html>
 
<html>
 
<style>
 
<style>
.demo{ background: #f0e0d4; }
 
 
.our-team{
 
.our-team{
 
     text-align: center;
 
     text-align: center;
Line 11: Line 10:
 
     height: 200px;
 
     height: 200px;
 
     border-radius: 50%;
 
     border-radius: 50%;
     border: 8px solid #7a4b94;
+
     border: 8px solid #222;
 
     margin: 0 auto;
 
     margin: 0 auto;
 
     overflow: hidden;
 
     overflow: hidden;
Line 19: Line 18:
 
     height: auto;
 
     height: auto;
 
}
 
}
.our-team .social{
 
    list-style: none;
 
    padding: 0;
 
    margin: 0;
 
    position: absolute;
 
    top: 50px;
 
    left: 20px;
 
    transition: all 0.3s ease-out 0s;
 
}
 
.our-team .social li a{
 
    width: 30px;
 
    height: 30px;
 
    line-height: 30px;
 
    border-radius: 50%;
 
    background: #f28a31;
 
    font-size: 14px;
 
    color: #fff;
 
    text-align: center;
 
    margin-bottom: 5px;
 
    transform: scale(0);
 
    transition: all 0.2s ease 0s;
 
}
 
.our-team:hover .social li a{ transform: scale(1); }
 
.our-team:hover .social li a:hover{ background: #7a4b94; }
 
 
.our-team .team-content{
 
.our-team .team-content{
 
     padding: 15px 15px 20px;
 
     padding: 15px 15px 20px;
    background: #7a4b94;
 
 
     border-radius: 40px 10px;
 
     border-radius: 40px 10px;
     margin-top: -20px;
+
     margin-top: 0 auto;
 
     color: #fff;
 
     color: #fff;
 
}
 
}
Line 89: Line 63:
 
                         <img src="images/img-1.jpg" alt="">
 
                         <img src="images/img-1.jpg" alt="">
 
                     </div>
 
                     </div>
                     <ul class="social">
+
                      
                        <li><a href="#" class="fab fa-facebook"></a></li>
+
                        <li><a href="#" class="fab fa-google-plus"></a></li>
+
                        <li><a href="#" class="fab fa-twitter"></a></li>
+
                    </ul>
+
 
                     <div class="team-content">
 
                     <div class="team-content">
 
                         <h3 class="title">Williamson</h3>
 
                         <h3 class="title">Williamson</h3>

Revision as of 11:57, 17 October 2018

Williamson

Web Developer

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ac eros lacus. Sed commodo fringilla pharetra. Proin sodales risus et nunc volutpat.

Kristiana

Web Designer

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ac eros lacus. Sed commodo fringilla pharetra. Proin sodales risus et nunc volutpat.