/*
 *  Draco HTML Template by @afnizarnur
 *  License: Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0)
 */

h1,h2,h3,h4,h5,h6, summary{
    font-family:"Playfair Display SC",serif;
    color:#333}
    
a,p,li{
    font-family:"Lato",Arial,sans-serif;
    color:#4e4e4e;
    font-size:1em;
    line-height:1.75em}

a:hover{text-decoration:none !important;color:#333 !important;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out}.container{margin:auto;max-width:780px;padding:0 20px}@media only screen and (max-width: 767px){.intro img{display:block;margin-left:auto;margin-right:auto}footer{text-align:center}}.typed-cursor{opacity:1;font-weight:100;-webkit-animation:blink 0.7s infinite;-moz-animation:blink 0.7s infinite;-ms-animation:blink 0.7s infinite;-o-animation:blink 0.7s infinite;animation:blink 0.7s infinite}@-webkit-keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}@-moz-keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}@-ms-keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}@-o-keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}.main-nav{background:#f4f4f4;padding-top:23px}.main-nav nav ul li a{color:#a7a7a7}.main-nav nav ul li.active a{color:#4d4d4d}.section.second{margin-bottom:90px}.section .container{position:relative}.section .container:after{position:absolute;content:url(../img/separator.png);left:20px}.section .container h1{text-transform:uppercase;margin-bottom:30px;position:relative}.intro{padding:95px 0px 70px 0px;overflow-x:hidden}.intro img{width:81px;height:81px;border-radius:99px}.intro .wrap{margin:30px 0px}.intro h1:before{position:absolute;left:-220px;top:-150px;font-size:270px;z-index:-1;color:#f4f4f4}.intro h1 span{font-size:47px}.work .work-list{margin-left:0px}.work .work-list li{list-style:none;font-size:0.9375em;color:#8c8c8c}.work .work-list li a{padding-bottom:5px;font-size:1.1875em;font-weight:700;text-decoration:none;border-bottom:1px solid #b3b3b3}.work .work-list li a:hover{border-bottom:1px solid #333}.award .award-list{margin-left:0px}.award .award-list li:first-child{font-size:0.9375em;color:#8c8c8c}.skills .skill-list{margin-left:0px}.skills .skill-list li:first-child{font-size:0.9375em;color:#8c8c8c}.quote{background:url(../img/bg.png);padding:20px 0px;margin-top:120px}.quote h1{margin:100px 0px;padding:40px 20px;border:5px solid #fff;color:#fff}footer{padding:50px 0px 0px 0px}footer .social li{display:inline;margin-left:20px}footer .social li a{font-size:1.25em;color:#999}

figure {
    text-align: center;
  }
  
figcaption {
  font-family:"Lato",Arial,sans-serif;
  color:#4e4e4e;
  font-size:0.8em;
  line-height:1.75em;
  display: block;
  text-align: center;
}

.btn-cv {
  display: inline-block;
  padding: 2px 14px;
  border: 1px solid #b3b3b3;
  font-size: 0.95em;
  color: #4e4e4e;
  text-decoration: none;
  border-radius: 5px;
  transition: all 0.2s ease-in-out;
}

.btn-cv:hover {
  border-color: #4e4e4e;
  color: #333;
  background-color: #f4f4f4;
}

#project-filters button {
  background-color: #f4f4f4;
  border: 1px solid #ccc;
  color: #4e4e4e;
  font-size: 13px;
  font-weight: 500;
  padding: 4px 12px;
  margin: 4px 4px 10px 0;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

#project-filters button:hover,
#project-filters button.active {
  background-color: #e6e6e6;
  color: #333;
  border-color: #4e4e4e;
  box-shadow: inset 0 0 0 1px #b3b3b3;
}

.hidden-projects {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 0.6s ease, max-height 0.6s ease;
}

.hidden-projects.visible {
  opacity: 1;
  max-height: 1000px; /* sufficiently large for content */
}