#portfolio{background-color:#333;padding:112px 0}h2.section-title{color:#fff;font-size:2.5rem;margin-bottom:20px}#portfolio .title{color:#aaa;margin-bottom:10px}.button-group{display:flex;justify-content:space-around}.btn{border:1px solid #fff;color:#fff;font-size:14px;padding:10px 20px;text-transform:uppercase;transition:all .3s ease}.btn.is-checked,.btn:hover{background-color:#fff;color:#222}.grid{display:flex;flex-wrap:wrap;justify-content:space-between}.portfolio-item{margin-bottom:15px;overflow:hidden;position:relative;transition:transform .3s ease}.portfolio-item img{border-radius:10px;display:block;height:auto;max-width:100%;width:100%}.portfolio-item a{display:block;position:relative;text-decoration:none}.tab-buttons{justify-content:center;margin-bottom:20px}.tab-buttons .btn{border:2px solid #fff;cursor:pointer;padding:10px 20px;transition:all .3s ease}.tab-buttons .btn,.tab-buttons .btn.is-checked{background-color:transparent;border-radius:30px;color:#fff}.tab-buttons .btn:hover{background-color:#ddd;color:#222}.portfolio-item{display:none}.show{display:block}@media (min-width:1200px){.portfolio-item{width:32%}}@media (min-width:992px) and (max-width:1199px){.portfolio-item{width:48%}}@media (min-width:768px) and (max-width:991px){.portfolio-item{width:48%}}@media (max-width:767px){.portfolio-item{width:100%}}