/* portfolio */
#portfolio { margin-bottom: 200px; }
.section-portfolio { min-height: 400px; background-color: #fff; padding-bottom: 70px; padding-top: 70px; overflow: hidden; }
.section-portfolio hr { width: 90px; border-top: 2px solid transparent; }
#portfolio .title-portfolio { margin-left: auto; margin-right: auto; margin-bottom: 30px; float: none; }
#portfolio .title-portfolio h1, #portfolio .title-portfolio h2, #portfolio .title-portfolio h3, #portfolio .title-portfolio h4, #portfolio .title-portfolio h5, #portfolio .title-portfolio h6 { text-transform: uppercase; color: #515151; font-size: 48px; font-weight: 300; text-align: center; }
#portfolio .title-portfolio p { font-weight: 300; text-align: center; color: #888; font-size: 16px; }
.custom-portfolio { background-color: #FFF; padding-bottom: 0; }
.custom-filters { padding: 0; margin: 0 auto; float: none; list-style: none; text-align: center; }
.custom-filters li { display: inline-block; padding: 8px 12px; margin: 5px; background-color: #fff; border-radius: 4px; cursor: pointer; color: #999; font-size: 14px; font-weight: 700; text-transform: uppercase; transition: all .3s ease; }
.custom-filters li:hover, .custom-filters li.active { color: #fff; }
.portfolio-grid { padding: 0; margin-top: 50px; margin-bottom: 0; }
.portfolio-grid:before, .portfolio-grid:after { content: " "; display: table; }
.portfolio-grid:after { clear: both; }
.portfolio-grid li { width: 25%; float: left; display: none; opacity: 0; position: relative; overflow: hidden; cursor: pointer; }
.portfolio-grid li:hover .project-overlay { opacity: 1; right: 0; }
.portfolio-grid li img { width: 100%; }
.project-overlay { position: absolute; height: 100%; width: 100%; top: 0; right: 100%; opacity: 0; transition: .3s ease; padding: 40px 20px; color: #fff; text-align: center; }
.project-overlay .fa { margin-bottom: 15px; }
.project-overlay span { display: block; text-transform: uppercase; }
.project-name { font-size: 23px; }
.project-extended.open { padding-top: 70px; padding-bottom: 70px; }
.project-extended.open .custom-project-controls { display: block; }
.project-category-border { width: 90px; background: #deac2e; height: 1px; margin: 5px 15px; }
.project-category { text-align: center; margin: 20px 0; }
.project-media { position: relative; }
.project-media img { display: block; margin: 0 auto; }
.project-info h1, .project-info h2, .project-info h3, .project-info h4, .project-info h5, .project-info h6 { text-align: center; text-transform: uppercase; color: #515151; font-size: 48px; font-weight: 300; margin-top: 0; }
.project-info span { display: inline-block; color: #999; text-transform: uppercase; }
.project-info p { text-align: center; }
.custom-project-controls { padding: 0; display: none; list-style: none; text-align: center; margin-bottom: 50px; }
.custom-project-controls li { display: inline-block; margin: 10px; }
.custom-project-controls li a { display: block; color: #ccc; border: 2px solid #ccc; padding: 4px 0; border-radius: 50%; height: 40px; width: 40px; text-align: center; }

#portfolio .title-portfolio hr { border-color: #deac2e; } 
.service:hover > .fa-stack > .fa-circle { color: #deac2e; }
.custom-filters li:hover, .custom-filters li.active { background-color: #deac2e; }
/*.portfolio-grid li:hover .project-overlay { background-color: #deac2e; }*/
.portfolio-grid li:hover .project-overlay { background-color: rgba(222,172,46,0.90); }
#project-controls li a:hover { color: #deac2e; border-color: #deac2e; }
::selection { background-color: #deac2e; color: #fff; }

@media (max-width: 1024px) {
.project-name { font-size: 18px; line-height:1em; }
}

@media (max-width: 991px) {
.portfolio-grid li { width: 50%; }
}

@media (max-width: 479px) {
.project-name { font-size: 20px; }
.portfolio-grid li { width: 100%; }
.custom-filters li { font-size: 12px; }
.project-category-border { width: 0px; }
.project-info h1, .project-info h2, .project-info h3, .project-info h4, .project-info h5, .project-info h6 { font-size: 28px; }
}
/* portfolio end */