%PDF- %PDF-
Direktori : /var/www/html/qendrasteps/wp-content/themes/tm-heli/assets/sass/portfolio/ |
Current File : /var/www/html/qendrasteps/wp-content/themes/tm-heli/assets/sass/portfolio/_archive.scss |
.post-type-archive-project { .page-title { margin-bottom: 30px; } .big-title { background-image: url("../../images/bg04.jpg") !important; } } .post-type-archive-project .projects { @extend %clearfix; margin: 0; padding: 0; list-style: none; &.projects-masonry { display: none; } .type-project { position: absolute; float: left; margin: 0 0 15px; background-color: transparent; &.column-1 { width: calc(100%); } &.column-2 { width: calc(100% / 2 - 7.5px); } &.column-3 { width: calc(100% / 3 - 10px); } &.column-4 { width: calc(100% / 4 - 11.25px); } &.column-5 { width: calc(100% / 5 - 12px); } &:before, h3, .project-icon-zoom, .project-loop-category-container { transition: all .3s; } &:before, &:after, h3, .project-icon-zoom, .project-loop-category-container { position: absolute; opacity: 0; } &:before { z-index: 1; display: block; width: 100%; height: 100%; background-color: rgba(17, 17, 17, .95); content: ""; } &:after { top: 30px; right: 30px; bottom: 30px; left: 30px; z-index: 2; border: 1px solid #333; content: ""; } .project-loop-category-container { bottom: 20px; z-index: 10; width: 100%; color: #888; text-align: center; a { color: #888; &:hover { color: #fff; } } } h3 { bottom: 30px; left: 50%; z-index: 3; width: 100%; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 16px; line-height: 22px; transform: translateX(-50%); } figure { margin: 0; } .project-icon-zoom { top: 50%; left: 50%; z-index: 10; margin-top: -50px; color: #fff; font-size: 30px; opacity: 0; transform: translate(-50%, -50%); } &:hover { &:before, &:after, h3, .project-loop-category-container, .project-icon-zoom { opacity: 1; } .project-icon-zoom { margin-top: 0; } h3 { bottom: 70px; } .project-loop-category-container { bottom: 50px; } } } } // Hotfix WTHL-9 .myportfolio-container .esg-entry-cover .esg-bc { a, a:visited { color: #888; } a:hover { color: #fff; } }