Difference between revisions of "Template:KUAS Korea/Team/Team"

Line 2: Line 2:
 
<style>
 
<style>
  
−
/* Testimonials Section
+
    /* Testimonials Section
−
--------------------------------*/
+
    --------------------------------*/
−
#testimonials {
+
    #testimonials {
−
  padding: 60px 0;
+
        padding: 60px 0;
−
}
+
    }
  
−
#testimonials .section-header {
+
    #testimonials .section-header {
−
  margin-bottom: 40px;
+
        margin-bottom: 40px;
−
}
+
    }
  
−
#testimonials .testimonial-item {
+
    #testimonials .testimonial-item {
−
  text-align: center;
+
        text-align: center;
−
}
+
    }
  
−
#testimonials .testimonial-item .testimonial-img {
+
    #testimonials .testimonial-item .testimonial-img {
−
  width: 120px;
+
        width: 120px;
−
  border-radius: 50%;
+
        border-radius: 50%;
−
  border: 4px solid #f6f8f1;
+
        border: 4px solid #f6f8f1;
−
  margin: 0 auto;
+
        margin: 0 auto;
−
}
+
    }
  
−
#testimonials .testimonial-item h3 {
+
    #testimonials .testimonial-item h3 {
−
  font-size: 20px;
+
        font-size: 20px;
−
  font-weight: bold;
+
        font-weight: bold;
−
  margin: 10px 0 5px 0;
+
        margin: 10px 0 5px 0;
−
  color: #28272c;
+
        color: #28272c;
−
}
+
    }
  
−
#testimonials .testimonial-item h4 {
+
    #testimonials .testimonial-item h4 {
−
  font-size: 14px;
+
        font-size: 14px;
−
  color: #c2bcb9;
+
        color: #c2bcb9;
−
  margin: 0 0 15px 0;
+
        margin: 0 0 15px 0;
−
}
+
    }
  
−
#testimonials .testimonial-item .quote-sign-left {
+
    #testimonials .testimonial-item .quote-sign-left {
−
  margin-top: -15px;
+
        margin-top: -15px;
−
  padding-right: 10px;
+
        padding-right: 10px;
−
  display: inline-block;
+
        display: inline-block;
−
  width: 37px;
+
        width: 37px;
−
}
+
    }
  
−
#testimonials .testimonial-item .quote-sign-right {
+
    #testimonials .testimonial-item .quote-sign-right {
−
  margin-bottom: -15px;
+
        margin-bottom: -15px;
−
  padding-left: 10px;
+
        padding-left: 10px;
−
  display: inline-block;
+
        display: inline-block;
−
  max-width: 100%;
+
        max-width: 100%;
−
  width: 37px;
+
        width: 37px;
−
}
+
    }
  
−
#testimonials .testimonial-item p {
+
    #testimonials .testimonial-item p {
−
  font-style: italic;
+
        font-style: italic;
−
  margin: 0 auto 15px auto;
+
        margin: 0 auto 15px auto;
−
}
+
    }
  
−
@media (min-width: 992px) {
+
    @media (min-width: 992px) {
−
  #testimonials .testimonial-item p {
+
        #testimonials .testimonial-item p {
−
    width: 80%;
+
            width: 80%;
−
  }
+
        }
−
}
+
    }
  
−
#testimonials .owl-nav, #testimonials .owl-dots {
+
    #testimonials .owl-nav, #testimonials .owl-dots {
−
  margin-top: 5px;
+
        margin-top: 5px;
−
  text-align: center;
+
        text-align: center;
−
}
+
    }
  
−
#testimonials .owl-dot {
+
    #testimonials .owl-dot {
−
  display: inline-block;
+
        display: inline-block;
−
  margin: 0 5px;
+
        margin: 0 5px;
−
  width: 12px;
+
        width: 12px;
−
  height: 12px;
+
        height: 12px;
−
  border-radius: 50%;
+
        border-radius: 50%;
−
  background-color: #c2bcb9;
+
        background-color: #c2bcb9;
−
}
+
    }
  
−
#testimonials .owl-dot.active {
+
    #testimonials .owl-dot.active {
−
  background-color: #a54040;
+
        background-color: #a54040;
−
}
+
    }
  
−
/* Team Section
+
    /* Team Section
−
--------------------------------*/
+
    --------------------------------*/
−
#team {
+
    #team {
−
  background: #f6f8f1;
+
        background: #f6f8f1;
−
  padding: 60px 0;
+
        padding: 60px 0;
−
}
+
    }
  
−
#team .member {
+
    #team .member {
−
  text-align: center;
+
        text-align: center;
−
  margin-bottom: 20px;
+
        margin-bottom: 20px;
−
  background: #f6f8f1;
+
        background: #f6f8f1;
−
  position: relative;
+
        position: relative;
−
}
+
    }
  
−
#team .member .member-info {
+
    #team .member .member-info {
−
  opacity: 0;
+
        opacity: 0;
−
  display: flex;
+
        display: flex;
−
  justify-content: center;
+
        justify-content: center;
−
  align-items: center;
+
        align-items: center;
−
  position: absolute;
+
        position: absolute;
−
  bottom: 0;
+
        bottom: 0;
−
  top: 0;
+
        top: 0;
−
  left: 0;
+
        left: 0;
−
  right: 0;
+
        right: 0;
−
  transition: 0.2s;
+
        transition: 0.2s;
−
}
+
    }
  
−
#team .member .member-info-content {
+
    #team .member .member-info-content {
−
  margin-top: -50px;
+
        margin-top: -50px;
−
  transition: margin 0.2s;
+
        transition: margin 0.2s;
−
}
+
    }
  
−
#team .member:hover .member-info {
+
    #team .member:hover .member-info {
−
  background: rgba(0, 0, 0, 0.7);
+
        background: rgba(0, 0, 0, 0.7);
−
  opacity: 1;
+
        opacity: 1;
−
  transition: 0.4s;
+
        transition: 0.4s;
−
}
+
    }
  
−
#team .member:hover .member-info-content {
+
    #team .member:hover .member-info-content {
−
  margin-top: 0;
+
        margin-top: 0;
−
  transition: margin 0.4s;
+
        transition: margin 0.4s;
−
}
+
    }
  
−
#team .member h4 {
+
    #team .member h4 {
−
  font-weight: 700;
+
        font-weight: 700;
−
  margin-bottom: 2px;
+
        margin-bottom: 2px;
−
  font-size: 18px;
+
        font-size: 18px;
−
  color: #f6f8f1;
+
        color: #f6f8f1;
−
}
+
    }
  
−
#team .member span {
+
    #team .member span {
−
  font-style: italic;
+
        font-style: italic;
−
  display: block;
+
        display: block;
−
  font-size: 14px;
+
        font-size: 14px;
−
  color: #f6f8f1;
+
        color: #f6f8f1;
−
}
+
    }
−
#team .member p {
+
    #team .member p {
−
  display: block;
+
        display: block;
−
  font-size: 13px;
+
        margin-top:20px;
−
  color: #f6f8f1;
+
        font-size: 13px;
−
}
+
        color: #f6f8f1;
 +
    }
  
−
#team .member .social {
+
    #team .member .social {
−
  margin-top: 15px;
+
        margin-top: 15px;
−
}
+
    }
  
−
#team .member .social a {
+
    #team .member .social a {
−
  transition: none;
+
        transition: none;
−
  color: #f6f8f1;
+
        color: #f6f8f1;
−
}
+
    }
  
−
#team .member .social a:hover {
+
    #team .member .social a:hover {
−
  color: #a54040;
+
        color: #a54040;
−
}
+
    }
  
−
#team .member .social i {
+
    #team .member .social i {
−
  font-size: 18px;
+
        font-size: 18px;
−
  margin: 0 2px;
+
        margin: 0 2px;
−
}
+
    }
 
</style>
 
</style>
 
</html>
 
</html>

Revision as of 15:47, 5 August 2018