.portfolio { padding: 0; } .portfolio .portfolio-row { clear: both; } .portfolio .portfolio-item-size-container { position: relative; padding: 0; margin: 0; font-size: 0; line-height: 1; } .portfolio .portfolio-item-size-container .portfolio-item { min-height: 0; padding: 0 !important; margin: 0; position: absolute; } .portfolio .portfolio-item.not-found { width: 100% !important; text-align: left; } .portfolio .portfolio-item.not-found .found-wrap { display: flex; flex-direction: row !important; align-items: baseline; border: none; } .portfolio .portfolio-item.not-found .found-wrap:before { content: "\e67a"; font-style: normal; font-family: 'thegem-icons'; font-weight: normal; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-variant: normal; text-rendering: auto; line-height: 1; margin-right: 10px; position: initial; opacity: 1 !important; } .gem_tab .portfolio { padding-left: 1px; padding-right: 1px; } .portfolio h3.title { text-align: center; } .panel-sidebar-position-right .portfolio { padding-left: 0; } .portfolio-top-panel:not(.extended-posts-filter) { margin: 0 0 55px; overflow: visible; } .portfolio-top-panel .portfolio-filters, .portfolio-top-panel .portfolio-filters-resp { position: relative; z-index: 5; } .portfolio-top-panel:not(.sticky-fixed) { position: relative; } .portfolio-top-panel.filters-top-sticky { z-index: 2; } @media (min-width: 1001px) { .portfolio-top-panel.filters-top-sticky { margin-bottom: 45px; } } .portfolio.without-padding .portfolio-top-panel { margin-left: 0; margin-right: 0; } .portfolio.hover-title.portfolio-items-masonry .portfolio-top-panel { margin-left: 0; margin-right: 0; } .portfolio-filters { font-size: 0; } @media (max-width: 767px) { .portfolio-filters-mobile + .portfolio-filters { display: none !important; } } @media (min-width: 768px) { .portfolio-filters-mobile { display: none !important; } } .portfolio-filters a, .portfolio-filters .portfolio-filters-more-button { display: inline-block; text-decoration: none; vertical-align: top; margin: 0 10px 10px 0; padding: 0 25px; min-height: 30px; line-height: 30px; height: auto; border-radius: 15px; font-size: var(--thegem-to-body-tiny-font-size); color: inherit; border: none; } .portfolio-filters a:last-child, .portfolio-filters .portfolio-filters-more-button { margin-right: 0; } .portfolio-top-panel-row.filter-style-buttons .portfolio-filters div.portfolio-filters-more { margin: 0 10px 10px 0; } .portfolio-top-panel-row.filter-style-buttons .portfolio-filters div.portfolio-filters-more-button { margin: 0; } .portfolio-top-panel-row.filter-style-buttons .portfolio-filters-more-dropdown a { background: transparent !important; padding: 0 !important; } .portfolio-filters a .gem-print-icon { margin-right: 5px; } .portfolio-filters a span { display: inline-block; vertical-align: top; } .portfolio-filters a.all .icon { font-family: 'thegem-icons'; font-size: 22px; line-height: 1.2727; } .portfolio-count { float: right; padding: 8px 8px 8px 0; } .portfolio-filters-resp { display: none; text-align: right; margin: 13px 0px; position: relative; z-index: 10; } .portfolio-filters-resp .menu-toggle { border: none; width: 32px; height: 30px; text-indent: 100%; font-size: 0; line-height: 0; overflow: hidden; position: relative; cursor: pointer; outline: none; background: transparent; padding: 0; } .portfolio .portfolio-filters-resp .menu-toggle i { font-size: 24px; text-indent: initial; } .portfolio-filters-resp .menu-toggle .menu-line-1, .portfolio-filters-resp .menu-toggle .menu-line-2, .portfolio-filters-resp .menu-toggle .menu-line-3 { position: absolute; width: 8px; height: 8px; top: 50%; background: #99a9b5; margin-top: -4px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; } .portfolio-filters-resp .menu-toggle .menu-line-1 { left: 0; } .portfolio-filters-resp .menu-toggle .menu-line-2 { left: 50%; margin-left: -4px; } .portfolio-filters-resp .menu-toggle .menu-line-3 { right: 0; } .portfolio-filters-resp ul { padding: 0; list-style: none; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; margin: 0; position: absolute; width: 100%; left: 0; top: 35px; opacity: 0; pointer-events: none; -webkit-transform: translateY(10px); transform: translateY(10px); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .portfolio-filters-resp ul li { text-align: left; position: relative; } .portfolio-filters-resp ul li a { display: block; text-decoration: none; padding: 14px 34px 17px 34px; } .portfolio-filters-resp ul li:after { position: absolute; right: 20px; top: 0; font-family: 'thegem-icons'; font-size: 14px; line-height: 51px; speak: none; -webkit-font-smoothing: antialiased; content: "\e601"; } .portfolio-filters-resp ul.dl-menuopen { opacity: 1; pointer-events: auto; -webkit-transform: translateY(0px); transform: translateY(0px); } /* Animation classes for moving out and in */ .portfolio-filters-resp ul.dl-animate-out { -webkit-animation: MenuAnimOut 0.4s; animation: MenuAnimOut 0.4s; } @-webkit-keyframes MenuAnimOut { 0% { } 50% { -webkit-transform: translateZ(-250px) rotateY(30deg); } 75% { -webkit-transform: translateZ(-372.5px) rotateY(15deg); opacity: .5; } 100% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } } @keyframes MenuAnimOut { 0% { } 50% { -webkit-transform: translateZ(-250px) rotateY(30deg); transform: translateZ(-250px) rotateY(30deg); } 75% { -webkit-transform: translateZ(-372.5px) rotateY(15deg); transform: translateZ(-372.5px) rotateY(15deg); opacity: .5; } 100% { -webkit-transform: translateZ(-500px) rotateY(0deg); transform: translateZ(-500px) rotateY(0deg); opacity: 0; } } .portfolio-filters-resp ul.dl-animate-in { -webkit-animation: MenuAnimIn 0.3s; animation: MenuAnimIn 0.3s; } @-webkit-keyframes MenuAnimIn { 0% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } 20% { -webkit-transform: translateZ(-250px) rotateY(30deg); opacity: 0.5; } 100% { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1; } } @keyframes MenuAnimIn { 0% { -webkit-transform: translateZ(-500px) rotateY(0deg); transform: translateZ(-500px) rotateY(0deg); opacity: 0; } 20% { -webkit-transform: translateZ(-250px) rotateY(30deg); transform: translateZ(-250px) rotateY(30deg); opacity: 0.5; } 100% { -webkit-transform: translateZ(0px) rotateY(0deg); transform: translateZ(0px) rotateY(0deg); opacity: 1; } } @media only screen and (max-width: 1000px) { .portfolio-count { display: none; } .portfolio-filters { margin-right: 0; } } @media only screen and (max-width: 768px) { .portfolio-filters-resp { display: block; } .portfolio-count, .portfolio-filters { display: none; } .portfolio-top-panel:not(.filter-type-extended, .panel-with-search, .filters-mobile-dropdown) .portfolio-top-panel-right, .portfolio-top-panel:not(.filter-type-extended).panel-with-search .portfolio-top-panel-right .portfolio-sorting { display: none; } .portfolio-top-panel:not(.extended-posts-filter).filter-type-default { margin-bottom: 20px; } .portfolio-filters-resp { text-align: left; } .portfolio-top-panel { margin: 0 0 0px; } } .portfolio-filters-resp ul { border-top: 1px solid #dfe5e8; border-left: 1px solid #dfe5e8; border-right: 1px solid #dfe5e8; } .portfolio-filters-resp ul li { background: #f4f6f7; border-bottom: 1px solid #dfe5e8; } .portfolio-filters-resp ul > li a.active { background: #fff; border-left: 4px solid #00bcd4; padding-left: 26px; color: #3c3950; } .portfolio-filters-resp li a { color: #5f727f; } .portfolio-filters-resp li a:hover { color: #3c3950; } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters, .portfolio-top-panel-row.filter-style-buttons .portfolio-filters { margin-bottom: -10px; } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a, .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters div.portfolio-filters-more-button, .portfolio-top-panel-row.filter-style-tabs-default .portfolio-sorting-select div.portfolio-sorting-select-current { min-height: initial; padding: 0; margin-bottom: 10px; margin-right: 30px; background: none/* !important*/; border: none; border-radius: 0; font-family: var(--thegem-to-tabs-title-thin-font-family); font-style: var(--thegem-to-tabs-title-thin-font-style); font-weight: var(--thegem-to-tabs-title-thin-font-weight); text-transform: var(--thegem-to-tabs-title-thin-text-transform); font-size: var(--thegem-to-tabs-title-thin-font-size); line-height: var(--thegem-to-tabs-title-thin-line-height); letter-spacing: var(--thegem-to-tabs-title-thin-letter-spacing); color: var(--thegem-to-h6-color); } .portfolio-top-panel .portfolio-top-panel-row.filter-style-tabs-default .portfolio-search-filter { color: var(--thegem-to-h6-color); } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters div.portfolio-filters-more { margin-bottom: 10px; margin-right: 30px; } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters div.portfolio-filters-more-button, .portfolio-top-panel-row.filter-style-tabs-default .portfolio-sorting-select div.portfolio-sorting-select-current { margin: 0; } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a:hover { color: var(--thegem-to-h6-color); } @media only screen and (max-width: 768px) { .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters { display: block; } } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a.hover-pointer, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a.hover-pointer { position: relative; } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a:not(.active).hover-pointer:after, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a:not(.active).hover-pointer:after { content: ''; display: block; position: absolute; width: 0; height: 2px; bottom: -2px; left: 50%; background: currentColor; -webkit-transition: width .3s, height .3s, left .3s; -o-transition: width .3s, height .3s, left .3s; transition: width .3s, height .3s, left .3s; -webkit-transition-timing-function: cubic-bezier(.58,.3,.005,1); -o-transition-timing-function: cubic-bezier(.58,.3,.005,1); transition-timing-function: cubic-bezier(.58,.3,.005,1); } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a:not(.active).hover-pointer:hover:after, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a:not(.active).hover-pointer:hover:after { width: 100%; left: 0; z-index: 2; } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a.active, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a.active { border-bottom: 2px solid currentColor; background: none; } @media (min-width: 1025px) { .portfolio-top-panel .portfolio-top-panel-row.filter-style-tabs-default .portfolio-search-filter.input-style input, .portfolio-top-panel .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-search-filter.input-style input { border-width: 2px; } .portfolio-top-panel:not(.extended-posts-filter).filter-type-extended .portfolio-top-panel-right .portfolio-search-filter.input-style { margin-top: -10px; margin-bottom: 0; } } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a.active, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters div.portfolio-filters-more-button, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-sorting-select div.portfolio-sorting-select-current { font-family: var(--thegem-to-tabs-title-font-family); font-style: var(--thegem-to-tabs-title-font-style); font-weight: var(--thegem-to-tabs-title-font-weight); text-transform: var(--thegem-to-tabs-title-text-transform); font-size: var(--thegem-to-tabs-title-font-size); line-height: var(--thegem-to-tabs-title-line-height); letter-spacing: 0; color: var(--thegem-to-h6-color); } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-filters a.active { letter-spacing: var(--thegem-to-tabs-title-letter-spacing); } .portfolio-top-panel-row.filter-style-tabs-default .portfolio-search-filter-button, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-search-filter-button { margin: -4px 0; } .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters div.portfolio-filters-more-button, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-sorting-select div.portfolio-sorting-select-current { min-height: initial; padding: 0; margin-bottom: 10px; margin-right: 30px; background: none/* !important*/; border: none; border-radius: 0; text-transform: initial; color: var(--thegem-to-body-color); } .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters div.portfolio-filters-more { margin-bottom: 10px; margin-right: 30px; } .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters div.portfolio-filters-more-button, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-sorting-select div.portfolio-sorting-select-current { margin: 0; } .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a.active, .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a.active:hover { color: var(--thegem-to-link-color-active); } .portfolio-top-panel-row.filter-style-tabs-alternative .portfolio-filters a:hover { color: var(--thegem-to-link-color-hover); } .portfolio-filters-extended { display: flex; flex-wrap: wrap; } .portfolio-top-panel.filter-type-extended { display: block; margin: 0 0 20px; } .portfolio-navigator { font-size: 0; line-height: 1; text-align: center; clear: both; } .portfolio-load-more, .mixed-show-all { clear: both; margin-top: 100px; } .portfolio-load-more .inner, .mixed-show-all .inner { width: 100%; overflow: visible; text-align: center; padding: 0; position: relative; } .portfolio-load-more .gem-button-separator-line, .mixed-show-all .gem-button-separator-line { border-color: #b6c6c9; color: #b6c6c9; } .portfolio .portfolio-set { position: relative; margin-bottom: 20px; padding: 0; z-index: 1; float: none; } .portfolio.disable-bottom-margin .portfolio-set { margin-bottom: 0; } .portfolio:not(.portfolio-slider):is(.portfolio-pagination-normal, .portfolio-pagination-more, .portfolio-pagination-disabled) .portfolio-set { margin-bottom: 0; } .hover-title.portfolio-items-masonry .portfolio-set { margin-bottom: 50px; } .portfolio-item { text-align: center; margin-top: 0; } .portfolio .portfolio-item .item-separator-box { height: 0; font-size: 0; line-height: 1; } .portfolio.item-separator .portfolio-item:before, .portfolio.item-separator .portfolio-item:after { content: ''; display: block; position: absolute; left: 0; top: 0; bottom: 0; z-index: 6; border-left-style: solid; border-left-width: 1px; opacity: 0; -webkit-transition: none; transition: none; } .portfolio.item-separator .portfolio-item:after { opacity: 1; } .portfolio.item-separator.no-gaps .fullwidth-block .portfolio-item.right-item:after { opacity: 0; } .portfolio.item-separator .portfolio-item:after { left: auto; right: 0; } .portfolio.item-separator .portfolio-item.left-item:before { opacity: 1; } .portfolio.item-separator.no-gaps .fullwidth-block .portfolio-item.left-item:before { opacity: 0; } .portfolio.item-separator .portfolio-item .item-separator-box:before, .portfolio.item-separator .portfolio-item .item-separator-box:after { content: ''; display: block; position: absolute; left: 0; right: 0; top: 0; z-index: 6; border-top-style: solid; border-top-width: 1px; opacity: 1; } .portfolio.item-separator .portfolio-item .item-separator-box:before { opacity: 0; } .portfolio.item-separator .portfolio-item .item-separator-box:after { top: auto; bottom: 0; } .portfolio.item-separator .portfolio-item.top-item .item-separator-box:before { opacity: 1; } .portfolio.portfolio-pagination-scroll .portfolio-scroll-pagination { visibility: hidden; position: relative; } .portfolio.portfolio-pagination-scroll .portfolio-scroll-pagination.active { visibility: visible; height: 61px; } .portfolio .fullwidth-block { padding: 0 21px; box-sizing: border-box; } .portfolio .fullwidth-block.no-paddings { padding: 0; } .portfolio.without-padding .fullwidth-block { padding: 0; } .portfolio .fullwidth-block .portfolio-item { float: left; } .portfolio-item .wrap { width: 100%; display: inline-block; vertical-align: top; -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .portfolio.disable-isotope .portfolio-item .wrap { transition: all 0.2s linear, height 0s; } .portfolio:not(.portfolio-slider) .portfolio-item .wrap { border: none; } .portfolio.columns-1 .portfolio-item .wrap { border-bottom: 0 none; } .portfolio-item .wrap > .caption { padding-bottom: 30px; -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .portfolio-item .wrap > .caption:not(.click-disabled) { cursor: pointer; } .portfolio .portfolio-item .wrap > .caption { position: relative; z-index: 1; } .portfolio.portfolio-grid:not(.extended-products-grid, .columns-1) .portfolio-item .wrap > .caption { border-bottom: 1px solid var(--thegem-to-box-border-color, #DFE5E8); } .portfolio.portfolio-grid:not(.extended-products-grid, .columns-1) .portfolio-item:hover .wrap > .caption { border-bottom-color: #f4f6f7; } .portfolio.portfolio-grid.background-style-gray .portfolio-item .wrap > .caption, .portfolio.portfolio-grid.background-style-dark .portfolio-item .wrap > .caption, .portfolio.portfolio-grid.background-style-transparent .portfolio-item .wrap > .caption { border-bottom-width: 0; } .portfolio.background-style-transparent .portfolio-item .wrap > .caption { background-color: transparent; } .portfolio.background-style-gray .portfolio-item .wrap, .portfolio.background-style-dark .portfolio-item .wrap { border-bottom: 0 none; } .portfolio.background-style-gray:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .caption-sizable-content:after, .portfolio.background-style-gray:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .caption-sizable-content:after, .portfolio.background-style-dark .portfolio-item:not(:hover) .wrap > .caption .caption-sizable-content:after { box-shadow: 0 0 30px 45px #393d50; } .portfolio.background-style-dark.version-new.news-grid .portfolio-item .wrap > .caption .author, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .author, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .author, .portfolio.background-style-dark.version-new.news-grid .portfolio-item .wrap > .caption .post-author-date-separator, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .post-author-date-separator, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .post-author-date-separator, .portfolio.background-style-dark.version-new.news-grid .portfolio-item .wrap > .caption .post-date, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .post-date, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .post-date, .portfolio.background-style-dark.version-new.news-grid .portfolio-item .wrap > .caption .description, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .description, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .description, .portfolio.background-style-dark.version-new.news-grid .portfolio-item .wrap > .caption .grid-post-meta .grid-post-share .icon, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .grid-post-meta .grid-post-share .icon, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .grid-post-meta .grid-post-share .icon, .portfolio.background-style-dark.version-new.news-grid .portfolio-item .wrap > .caption .grid-post-meta .comments-link a, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .grid-post-meta .comments-link a, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .grid-post-meta .comments-link a, .portfolio.background-style-dark.version-new.news-grid .portfolio-item .wrap > .caption .grid-post-meta .zilla-likes, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover):not(.list-style) .portfolio-item:hover .wrap > .caption .grid-post-meta .zilla-likes, .portfolio.background-style-gray.version-new.news-grid:not(.disabled-hover).list-style .portfolio-item .wrap > .caption:hover .grid-post-meta .zilla-likes { color: #99a9b5; } .portfolio.without-padding .portfolio-item .wrap { background: none; } .portfolio.hover-title .portfolio-item .wrap { border: 0; padding-bottom: 0; background: none; } .portfolio-items-masonry .wrap { padding-bottom: 0; border: 0; background: none; } .portfolio-item .image { display: inline-block; position: relative; max-width: 100%; padding: 0; vertical-align: top; overflow: hidden; flex: none; } .portfolio-grid:not(.columns-1) .portfolio-item .image { width: 100%; } .portfolio-item .image .image-inner { position: relative; z-index: 2; } .portfolio.columns-1 .portfolio-item .image { margin: 0; padding: 0; } .portfolio.title-on-hover.columns-1 .portfolio-item .image { width: 100%; } .portfolio-item:not(.product) .image .button { position: absolute; right: 0; bottom: 0; z-index: 4; box-sizing: border-box; border-style: solid; border-color: transparent; border-width: 63px; border-right-width: 0; border-top-width: 0; cursor: pointer; height: 0; } .portfolio-item:not(.product) .image .button:before { content: "\e60c"; font-family: 'thegem-icons'; font-size: 19px; line-height: 1.05; position: absolute; left: -27px; top: 33px; z-index: 3; } .portfolio-item .image .button .button-corner { display: block; width: 8px; height: 8px; cursor: pointer; position: absolute; right: 0; bottom: -63px; z-index: 4; font-size: 0; line-height: 1; } .portfolio-item .image .button .button-corner span { display: block; width: 8px; height: 8px; cursor: pointer; font-size: 0; line-height: 1; } .portfolio-item .image .button .button-corner b { display: none; width: 1px; height: 2px; cursor: pointer; font-size: 0; line-height: 1; position: absolute; right: 0; bottom: 0; } .portfolio.portfolio-items-masonry .image .button .button-corner { display: none; } .portfolio.portfolio-items-masonry.hover-title .image .button .button-corner { display: block; } .portfolio.portfolio-items-masonry.hover-title .image .button .button-corner b { display: none; } .portfolio-item .image .button.active .button-corner { display: none; } .portfolio.without-padding .portfolio-item .image .button .button-corner { display: none; } .portfolio-item .image .image-inner { overflow: hidden; } .portfolio.portfolio-grid:is(.portfolio-style-creative, .portfolio-style-justified):not(.extended-products-grid, .columns-1, .list-style, .full-image) .portfolio-item:not(.double-item, .custom-ratio) .image-inner:not(.empty) { aspect-ratio: 1/1; } .portfolio.portfolio-grid:not(.inited) .image-inner, .portfolio.portfolio-grid .image-inner.without-image, .portfolio.portfolio-grid img[loading="lazy"] { background-color: var(--styled-bg-color, #f0f3f2); } .portfolio-item .image-inner.empty { display: none; } .portfolio-item .image picture { /*display: block;*/ /*height: 100%;*/ } .portfolio-item .image img { width: 100%; max-width: initial; height: auto; object-fit: cover; } .portfolio-style-masonry .portfolio-item .image img { width: calc(100% + 1px); margin: -0.5px; } .portfolio.portfolio-grid:is(.portfolio-style-creative, .portfolio-style-justified) .portfolio-item .image img { height: 100%; object-fit: cover; } .portfolio:is(.hover-horizontal-sliding, .hover-new-horizontal-sliding, .hover-default-horizontal-sliding) .portfolio-item .image img { width: 110%; } .portfolio.without-padding .portfolio-item .image img, .portfolio.without-padding .portfolio-item .image .image-inner { border-radius: 0 !important; -moz-border-radius: 0 !important; -webkit-border-radius: 0 !important; } .portfolio-item .image .overlay { display: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 3; overflow: hidden; } .portfolio-item .image .overlay:not(.click-disabled) { cursor: pointer; } .portfolio-item .image .overlay .overlay-circle { display: none; } .portfolio-item .image img.blur { -webkit-filter: blur(3px); -moz-filter: blur(3px); -o-filter: blur(3px); -ms-filter: blur(3px); filter: blur(3px); filter: url(blur.svg#blur); filter: progid:DXImageTransform.Microsoft.Blur(pixelRadius=3); } .without-padding .portfolio-item .image .overlay { border-radius: 0 !important; -moz-border-radius: 0 !important; -webkit-border-radius: 0 !important; } .portfolio.portfolio-items-masonry.hover-title.without-padding .portfolio-item .image .overlay { border-radius: 0 !important; -moz-border-radius: 0 !important; -webkit-border-radius: 0 !important; } .portfolio-item .image .overlay .portfolio-item-link { display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; text-decoration: none; z-index: 2; } .portfolio-item .image .overlay .links-wrapper { display: table; width: 100%; height: 100%; } .portfolio-item .image .overlay .links { display: table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle; } .portfolio-item .image .overlay .links a.icon { display: inline-block; text-decoration: none; margin-right: 45px; vertical-align: bottom; } .portfolio-item.portfolio-item-template .image .overlay .links a.icon:last-of-type { margin-right: 0 !important; } .portfolio:not(.portfolio-slider):not(.products) .portfolio-item .image .overlay .links a.icon svg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .portfolio-item .image .overlay .links .portfolio-icons-inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; justify-content: flex-start; line-height: 1; vertical-align: top; margin-left: -1px; } .portfolio.hover-default .portfolio-item .image .overlay .links .portfolio-icons-inner, .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links .portfolio-icons-inner, .portfolio.hover-zoom-overlay .portfolio-item .image .overlay .links .portfolio-icons-inner { justify-content: center; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links .portfolio-icons-inner, .portfolio.hover-circular .portfolio-item .image .overlay .links .portfolio-icons-inner, .portfolio.hover-gradient .portfolio-item .image .overlay .links .portfolio-icons-inner { margin-left: 0; } .portfolio-item .image .overlay .links .portfolio-icons-inner a.icon/*, .portfolio-item .image .overlay .links .portfolio-icons-inner .yith-wcwl-add-to-wishlist, .portfolio-item .image .overlay .links .portfolio-icons-inner .yith-wcwl-add-to-wishlist > div*/ { float: left; } @media (min-width: 992px) { .portfolio.extended-portfolio-grid .portfolio-item.columns-desktop-5 { width: 20%; } .portfolio.extended-portfolio-grid .portfolio-item.columns-desktop-5:is(.double-item-squared, .double-item-horizontal) { width: 40%; } } .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links a.icon { margin-right: 15px; } .portfolio-item .image .overlay .links a.icon.share { margin-right: 0; } .portfolio-item .image .overlay .links .portfolio-icons-inner > a.icon:last-child, .portfolio-item .image .overlay .links .portfolio-icons-inner > div:last-child a.icon { margin-right: 0 !important; } .portfolio .portfolio-item .image .overlay .links a.icon { color: #ffffff; } .portfolio .portfolio-item .image .overlay .links a.icon i { color: #ffffff; transition: all 0.3s; } .portfolio .portfolio-item .image .overlay .links a.icon svg { fill: #ffffff; transition: all 0.3s; } .portfolio:not(.hover-zooming-blur) .portfolio-item .image .overlay .links a.icon:hover i { color: inherit; } .portfolio:not(.hover-zooming-blur) .portfolio-item .image .overlay .links a.icon:hover svg { fill: currentColor; } .portfolio:not(.products-grid) .portfolio-item .image .overlay .links a.icon:before { content: none !important; } .portfolio .portfolio-item .image .overlay .links a.icon { width: 48px; height: 48px; line-height: 48px; } .portfolio .portfolio-item .image .overlay .links a.icon i.default { font-family: 'thegem-icons'; font-size: 48px; font-style: normal; line-height: inherit; display: inline-block; } .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links a.icon { width: 24px; height: 24px; line-height: 24px; } .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links a.icon i, .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links a.icon:before { font-size: 24px; } .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links a.icon svg { width: 24px; height: 24px; } .portfolio-item .image .overlay .links a.page i.default:before { content: '\e61f'; } .portfolio-item .image .overlay .links a.photo i.default:before { content: '\e60f'; } .portfolio-item .image .overlay .links a.self-link i.default:before { content: '\e61f'; } .portfolio-item .image .overlay .links a.inner-link i.default:before { content: '\e65b'; } .portfolio-item .image .overlay .links a.outer-link i.default:before { content: '\e623'; } .portfolio-item .image .overlay .links a.full-image i.default:before { content: '\e60f'; } .portfolio-item .image .overlay .links a.youtube i.default:before, .portfolio-item .image .overlay .links a.vimeo i.default:before, .portfolio-item .image .overlay .links a.self_video i.default:before { content: '\e610'; } .portfolio-item .image .overlay .links a.share i.default:before { content: '\e65c'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.page i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.photo i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.self-link i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.inner-link i.default:before { content: '\e61c'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.outer-link i.default:before { content: '\e608'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.full-image i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.youtube i.default:before, .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.vimeo i.default:before, .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.self_video i.default:before { content: '\e62a'; } .portfolio .portfolio-item .image .overlay .links a.share i.default:before { margin-left: -0.2em; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.share i.default:before { content: '\e65d'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.page i.default:before { content: '\e628'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.photo i.default:before { content: '\e629'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.self-link i.default:before { content: '\e628'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.inner-link i.default:before { content: '\e61c'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.outer-link i.default:before { content: '\e608'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.full-image i.default:before { content: '\e629'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.youtube i.default:before, .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.vimeo i.default:before, .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.self_video i.default:before { content: '\e62a'; } .portfolio-items-masonry:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.share i.default:before { content: '\e65d'; } .portfolio.hover-default:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .portfolio.hover-zoom-overlay:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .with-sidebar .portfolio.hover-default.columns-3:not(.portfolio-slider) .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none; } @media (max-width: 430px) { .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.page i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.photo i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.self-link i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.inner-link i.default:before { content: '\e61c'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.outer-link i.default:before { content: '\e608'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.full-image i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.youtube i.default:before, .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.vimeo i.default:before, .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.self_video i.default:before { content: '\e62a'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.share i.default:before { content: '\e65d'; } } @media (min-width: 768px) and (max-width: 870px) { .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.page i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.photo i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.self-link i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.inner-link i.default:before { content: '\e61c'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.outer-link i.default:before { content: '\e608'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.full-image i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.youtube i.default:before, .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.vimeo i.default:before, .portfolio:not(.hover-default) .portfolio-item .image .overlay .links a.self_video i.default:before { content: '\e62a'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.share i.default:before { content: '\e65d'; } } @media (min-width: 768px) and (max-width: 900px) { .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.page i.default:before { content: '\e628'; } .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.photo i.default:before { content: '\e629'; } .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.self-link i.default:before { content: '\e628'; } .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.inner-link i.default:before { content: '\e61c'; } .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.outer-link i.default:before { content: '\e608'; } .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.full-image i.default:before { content: '\e629'; } .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.youtube i.default:before, .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.vimeo i.default:before, .portfolio:not(.hover-default).portfolio-items-masonry .portfolio-item .image .overlay .links a.self_video i.default:before { content: '\e62a'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.share i.default:before { content: '\e65d'; } } @media (min-width: 1280px) { .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.page i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.photo i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.self-link i.default:before { content: '\e628'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.inner-link i.default:before { content: '\e61c'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.outer-link i.default:before { content: '\e608'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.full-image i.default:before { content: '\e629'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.youtube i.default:before, .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.vimeo i.default:before, .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.self_video i.default:before { content: '\e62a'; } .portfolio:not(.hover-default) .fullwidth-block .portfolio-item .image .overlay .links a.share i.default:before { content: '\e65d'; } } .portfolio-item .caption { text-align: center; padding: 32px 30px 0; } .portfolio.portfolio-grid:not(.columns-1) .portfolio-item .wrap > .caption { /*min-height: 167px;*/ min-height: initial; } .portfolio.no-gaps:not(.columns-1) .portfolio-item .wrap > caption, .portfolio.background-style-gray:not(.columns-1) .portfolio-item .wrap > caption, .portfolio.background-style-dark:not(.columns-1) .portfolio-item .wrap > caption { min-height: 168px; } .portfolio-item .overlay .caption { background-color: transparent; } .portfolio.columns-1 .portfolio-item .wrap > .caption { text-align: left; } .portfolio-items-masonry .portfolio-item .caption { border-top: 0 !important; padding-bottom: 28px; margin-top: -1px; } .portfolio-items-masonry .portfolio-item .overlay .caption { background-color: transparent; } .portfolio-items-masonry.without-padding .portfolio-item .caption { border-radius: 0 !important; -moz-border-radius: 0 !important; -webkit-border-radius: 0 !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .portfolio-items-masonry.hover-title .portfolio-item .caption { border: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-radius: 0 !important; -moz-border-radius: 0 !important; -webkit-border-radius: 0 !important; padding-bottom: 0; } .portfolio.hover-title .portfolio-item .caption { padding: 39px 20px 0; } .portfolio.hover-title.columns-3 .portfolio-item .caption { padding-top: 25px; } .portfolio.hover-title:is(.columns-4, .columns-5, .columns-6) .portfolio-item .caption { padding-top: 15px; } .portfolio-item .caption .title { text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; letter-spacing: 0; } .portfolio-item .caption .title span { display: block; margin: 0; color: inherit; overflow: hidden; text-overflow: ellipsis; } .portfolio.columns-1 .portfolio-item .caption .title { white-space: normal; text-overflow: clip; margin-bottom: 30px; } .portfolio.hover-title .portfolio-item .caption .title { margin-bottom: 20px; } .portfolio.hover-title:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .caption .title, .portfolio.title-on-page.hover-gradient:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .caption .title, .portfolio.title-on-page.hover-circular:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .caption .title, .portfolio.hover-gradient.fullwidth-columns-6 .portfolio-item:not(.double-item-squared) .overlay .caption .title, .portfolio.hover-circular.fullwidth-columns-6 .portfolio-item:not(.double-item-squared) .overlay .caption .title, .portfolio.fullwidth-columns-6 .portfolio-item:not(.double-item-squared) .overlay .caption .title { font-size: 14px; line-height: 1.5; margin-bottom: 10px; } @media (max-width: 767px) { .portfolio-style-creative.creative-disable-mobile:is(.columns-mobile-2) .portfolio-item .overlay .caption .title { font-size: 14px; line-height: 1.5; } } @media (min-width: 768px) and (max-width: 992px) { .portfolio-style-creative.creative-disable-tablet:is(.columns-tablet-4) .portfolio-item .overlay .caption .title { font-size: 14px; line-height: 1.5; } } .portfolio .portfolio-item .caption .caption-separator { width: 50px; height: 1px; max-width: 100%; margin: 10px auto; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .portfolio:not(.disabled-hover) .portfolio-item:hover .caption .caption-separator { width: 90px; } .portfolio.columns-1 .portfolio-item .caption .info { white-space: nowrap; } .portfolio:not(.columns-1) .portfolio-item .caption .info .sep { height: auto; } .portfolio.columns-1 .portfolio-item .caption .caption-separator-line, .portfolio.columns-1 .portfolio-item .caption .caption-separator-line-hover { position: relative; display: inline-block; vertical-align: bottom; padding-bottom: 18px; } .portfolio.columns-1 .portfolio-item .caption .caption-separator-line:after, .portfolio.columns-1 .portfolio-item .caption .caption-separator-line-hover:after { content: ''; position: absolute; bottom: 0; left: 0; height: 1px; width: 100%; } .portfolio.columns-1 .portfolio-item .caption .caption-separator-line:after, .portfolio.columns-1 .portfolio-item .caption .caption-separator-line-hover:after { -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .portfolio.columns-1 .portfolio-item .caption .caption-separator-line-hover:after { width: 0; } .portfolio.columns-1 .portfolio-item:hover .caption .caption-separator-line-hover:after { width: 100%; } .portfolio-item .wrap > .caption .subtitle, .portfolio-item .wrap > .caption .info { -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .portfolio-item .caption .subtitle, .portfolio-item .caption .info, .portfolio-item .caption .subtitle a, .portfolio-item .caption .info a, .portfolio-item .caption .subtitle p { text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .portfolio-item .caption .subtitle span { display: block; margin: 0; color: inherit; overflow: hidden; text-overflow: ellipsis; } .portfolio-items-masonry .portfolio-item .caption .subtitle, .portfolio-items-masonry .portfolio-item .caption .info, .portfolio-items-masonry .portfolio-item .caption .subtitle a, .portfolio-items-masonry .portfolio-item .caption .info a, .portfolio-items-masonry .portfolio-item .caption .subtitle p { white-space: normal; overflow: visible; text-overflow: clip; } .portfolio-item .caption .info a { cursor: pointer; } .portfolio.columns-1 .portfolio-item .caption .subtitle, .portfolio.columns-1 .portfolio-item .caption .info, .portfolio.columns-1 .portfolio-item .caption .subtitle a, .portfolio.columns-1 .portfolio-item .caption .info a, .portfolio.columns-1 .portfolio-item .caption .subtitle p { text-decoration: none; white-space: normal; overflow: visible; } .portfolio.columns-1 .portfolio-item .wrap { position: relative; display: flex; } .portfolio.columns-1 .portfolio-item .wrap > .caption { position: relative; } .portfolio-item .entry-info { bottom: 31px; position: absolute; right: 0; padding-left: 30px; } .portfolio.columns-1 .portfolio-item .caption .info { margin-bottom: 16px; } .portfolio-item .caption .info { font-size: var(--thegem-to-body-tiny-font-size); line-height: 1.5; margin-top: 3px; } .portfolio-item .caption .info .separator { margin: 0 4px; } .portfolio-item .caption .subtitle p { margin: 0; } .portfolio-item .caption .subtitle a:hover, .portfolio-item .caption .info a:hover { text-decoration: underline; } .portfolio.columns-1 .portfolio-item .caption .subtitle { margin-bottom: 15px; } .portfolio .overlay .links .caption .title, .portfolio .overlay .links .caption .subtitle, .portfolio .overlay .links .caption .subtitle p, .portfolio .overlay .links .caption .info { white-space: normal; overflow: visible; text-overflow: clip; } .fullwidth-block.portfolio-items-2 .portfolio-item { max-width: 555px; } .portfolio .portfolio-item .overlay-line { height: 2px; font-size: 0; line-height: 1; } @media only screen and (min-width: 1920px) { .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 20%; } .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 40%; } .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 16.665%; } .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 33.33%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 14.2857%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 28.5714%; } } @media only screen and (min-width: 1680px) and (max-width: 1920px) { .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 33.333332%; } .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 66.66666%; } .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-item-size-container .portfolio-item, .portfolio.fullwidth-columns-3.porfolio-even-columns .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical), .portfolio.fullwidth-columns-3.porfolio-even-columns .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 20%; } .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 40%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item, .portfolio.fullwidth-columns-5.porfolio-even-columns .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 16.665%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical), .portfolio.fullwidth-columns-5.porfolio-even-columns .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 33.33%; } } @media only screen and (min-width: 1280px) and (max-width: 1680px) { .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-item-size-container .portfolio-item, .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.fullwidth-columns-4 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical), .portfolio.fullwidth-columns-5 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 33.333332%; } .portfolio.fullwidth-columns-3 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 66.66666%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 20%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 40%; } .portfolio.fullwidth-columns-3.porfolio-even-columns .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.fullwidth-columns-3.porfolio-even-columns .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } .portfolio.fullwidth-columns-6.porfolio-even-columns .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 16.665%; } .portfolio.fullwidth-columns-6.porfolio-even-columns .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 33.33%; } } @media only screen and (min-width: 830px) and (max-width: 1280px) { .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-set .portfolio-item, .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 33.333332%; } .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 66.66666%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } .portfolio.porfolio-even-columns .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.porfolio-even-columns .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } } @media only screen and (max-width: 1100px) { .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 33.333332%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 66.66666%; } .portfolio.fullwidth-columns-6.porfolio-even-columns .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.fullwidth-columns-6.porfolio-even-columns .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } } @media only screen and (max-width: 880px) { .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 50%; } .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical) { width: 100%; } } @media only screen and (max-width: 830px) { .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-set .portfolio-item, .portfolio:not(.extended-portfolio-grid) .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-item-size-container .portfolio-item, .portfolio:not(.extended-portfolio-grid) .portfolio-item-size-container .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 50%; } .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical), .portfolio:not(.extended-portfolio-grid) .portfolio-set .portfolio-item.double-item:not(.double-item-vertical), .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical), .portfolio.columns-1 .portfolio-set .portfolio-item, .portfolio.columns-1 .portfolio-item-size-container .portfolio-item { width: 100%; } } @media only screen and (max-width: 550px) { .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-set .portfolio-item, .portfolio:not(.extended-portfolio-grid) .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item.double-item:not(.double-item-vertical), .portfolio:not(.extended-portfolio-grid) .fullwidth-block .portfolio-item-size-container .portfolio-item, .portfolio:not(.extended-portfolio-grid) .portfolio-item-size-container .portfolio-item, .portfolio.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: 100%; } } @media only screen and (min-width: 992px) and (max-width: 1120px) { .with-sidebar .portfolio.columns-3 .portfolio-item, .with-sidebar .portfolio.columns-3 .portfolio-item-size-container .portfolio-item { width: 50%; } } @media only screen and (min-width: 992px) and (max-width: 1100px) { .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item, .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item-size-container .portfolio-item { width: 33.3333%; } .portfolio:is(.columns-4, .columns-5, .columns-6) .portfolio-item.double-item:not(.double-item-vertical) { width: 66.66%; } .portfolio:is(.columns-4, .columns-5, .columns-6).porfolio-even-columns .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio:is(.columns-4, .columns-5, .columns-6).porfolio-even-columns .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } } @media only screen and (min-width: 800px) { .portfolio.columns-3.porfolio-even-columns .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio.columns-3.porfolio-even-columns .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } } @media only screen and (min-width: 550px) and (max-width: 800px) { .portfolio.columns-3.porfolio-even-columns .portfolio-item-size-container .portfolio-item { width: 50%; } .portfolio.columns-3.porfolio-even-columns .portfolio-item.double-item:not(.double-item-vertical) { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 992px) { .portfolio:is(.columns-4, .columns-5, .columns-6).porfolio-even-columns .portfolio-item-size-container .portfolio-item { width: 25%; } .portfolio:is(.columns-4, .columns-5, .columns-6).porfolio-even-columns .portfolio-item.double-item:not(.double-item-vertical) { width: 50%; } } .portfolio.portfolio-style-metro.fullwidth-columns-4 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.portfolio-style-metro.fullwidth-columns-5 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.portfolio-style-metro.fullwidth-columns-6 .fullwidth-block .portfolio-set .portfolio-item, .portfolio.portfolio-style-metro.fullwidth-columns-4 .fullwidth-block .portfolio-item-size-container .portfolio-item, .portfolio.portfolio-style-metro.fullwidth-columns-5 .fullwidth-block .portfolio-item-size-container .portfolio-item, .portfolio.portfolio-style-metro.fullwidth-columns-6 .fullwidth-block .portfolio-item-size-container .portfolio-item { width: auto; } .portfolio.fullwidth-columns-6 .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .description { display: none; } /* Vertical sliding hover */ .portfolio.hover-vertical-sliding:not(.version-alternative) .image .overlay .links, .portfolio.hover-new-vertical-sliding.title-on-hover .image .overlay .links, .portfolio.hover-default-vertical-sliding .image .overlay .links { text-align: left; vertical-align: top; } .portfolio.hover-vertical-sliding .overlay .links .caption { text-align: left; padding: 0; } .portfolio.hover-vertical-sliding .overlay .links { padding: 48px 42px; } .portfolio.hover-vertical-sliding .overlay .links a.icon { margin-right: 32px; } .portfolio.hover-vertical-sliding .overlay .overlay-line { margin: 16px 0; } .portfolio.hover-vertical-sliding:not(.version-alternative) .overlay .links .caption .description { width: 100%; position: absolute; left: 0; bottom: 0; padding: 0 42px 35px; } .vc_col-sm-9 .portfolio.hover-vertical-sliding .portfolio-item:not(.double-item-squared) .overlay .links { padding: 31px 28px; } .vc_col-sm-9 .portfolio.hover-vertical-sliding .portfolio-item:not(.double-item-squared) .overlay .description { padding: 0 28px 25px; } .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .subtitle { width: 85%; margin-bottom: 12px; } .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .info { width: 85%; } .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .description, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .with-sidebar .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none; } .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links .caption .subtitle { margin-bottom: 0; width: 90%; } .portfolio.portfolio-style-metro.hover-vertical-sliding .overlay .links .caption .subtitle, .portfolio.portfolio-style-metro.hover-vertical-sliding .overlay .links .caption .info { display: none; } @media only screen and (max-width: 1170px) { .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .subtitle { width: 85%; margin-bottom: 12px; } .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .info { width: 85%; } } @media only screen and (max-width: 920px) { .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .subtitle { display: block; } .portfolio.hover-vertical-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { margin-bottom: 0; } .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info, .portfolio.hover-vertical-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } } @media only screen and (max-width: 830px) { .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links .caption .subtitle { display: block; margin: 0; } } @media only screen and (max-width: 768px) { .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links .caption .subtitle { display: block; } .portfolio.hover-vertical-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info, .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .info, .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: block; } } @media only screen and (max-width: 460px) { .portfolio.hover-vertical-sliding.columns-2 .portfolio-item .overlay .links .caption .info, .portfolio.hover-vertical-sliding.columns-3 .portfolio-item .overlay .links .caption .info, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item .overlay .links .caption .info, .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item .overlay .links .caption .info, .with-sidebar .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none !important; } .portfolio.hover-vertical-sliding.columns-2 .portfolio-item .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .portfolio-item .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item .overlay .links .caption .subtitle { margin-bottom: 0 !important; } } @media only screen and (max-width: 412px) { .portfolio.hover-vertical-sliding.columns-2 .portfolio-item .overlay .links .caption .info, .portfolio.hover-vertical-sliding.columns-3 .portfolio-item .overlay .links .caption .info, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item .overlay .links .caption .info, .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item .overlay .links .caption .info { display: none !important; } } @media only screen and (min-width: 768px) and (max-width: 800px) { .portfolio.hover-vertical-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info, .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-vertical-sliding.columns-1 .overlay .links, .portfolio.hover-vertical-sliding.columns-2 .overlay .links, .portfolio.hover-vertical-sliding.columns-3 .overlay .links { padding: 41px 28px; } .portfolio.hover-vertical-sliding.columns-1 .overlay .links .caption .description, .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .description, .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .description { padding: 0 28px 25px; } .portfolio.hover-vertical-sliding.columns-1 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { margin-bottom: 0; } } @media only screen and (max-width: 412px) { .portfolio.hover-vertical-sliding.columns-1 .overlay .links, .portfolio.hover-vertical-sliding.columns-2 .overlay .links, .portfolio.hover-vertical-sliding.columns-3 .overlay .links, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links, .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links { padding: 41px 28px; } .portfolio.hover-vertical-sliding.columns-1 .overlay .links .caption .description, .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .description, .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .description, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links .caption .description, .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links .caption .description { padding: 0 28px 25px; } } @media only screen and (max-width: 340px) { .portfolio.hover-vertical-sliding.columns-1 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-2 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links .caption .subtitle { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1150px) { .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-vertical-sliding.columns-3 .overlay .links { padding: 41px 28px; } .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .description { padding: 0 28px 25px; } } @media only screen and (min-width: 920px) and (max-width: 992px) { .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .info { display: block; } } @media only screen and (min-width: 1150px) { .with-sidebar .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .with-sidebar .portfolio.hover-vertical-sliding.columns-3 .overlay .links { padding: 41px 28px; } } @media only screen and (min-width: 768px) { .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links { padding: 41px 28px; } .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links .caption .description { padding: 0 28px 41px; } } @media only screen and (min-width: 1735px) { .portfolio.hover-vertical-sliding.columns-3 .fullwidth-block .overlay .links .caption .subtitle, .portfolio.hover-vertical-sliding.columns-3 .fullwidth-block .overlay .links .caption .info { display: block; } } @media only screen and (min-width: 992px) { .with-sidebar .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links { padding: 18px 12px; } .with-sidebar .portfolio.hover-vertical-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .title { font-size: 14px; line-height: 21px; } } @media only screen and (max-width: 1120px) { .with-sidebar .portfolio.hover-vertical-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: block; } } @media only screen and (max-width: 340px) { .with-sidebar .portfolio.hover-vertical-sliding.columns-3 .overlay .links .caption .subtitle { display: none; } } @media only screen and (min-width: 1250px) and (max-width: 1770px), screen and (min-width: 992px) and (max-width: 1170px), screen and (min-width: 768px) and (max-width: 900px) { .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links .caption .subtitle { margin-bottom: 0; } .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links { padding: 41px 28px; } .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links .caption .description { padding: 0 28px 41px; } } @media only screen and (min-width: 980px) and (max-width: 1070px) { .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none; } } @media only screen and (min-width: 1170px) and (max-width: 1250px), screen and (min-width: 981px) and (max-width: 992px) { .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-vertical-sliding .fullwidth-block .overlay .links { padding: 18px 12px; } .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .title { font-size: 14px; line-height: 1.5; } .portfolio.hover-vertical-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .description { padding: 0 12px 41px; } } /* Default hover */ .portfolio.hover-default .portfolio-item .image .overlay .overlay-line, .portfolio.hover-zoom-overlay .portfolio-item .image .overlay .overlay-line { display: none; } .portfolio.hover-default .portfolio-item .image .overlay .links .caption .info { display: block; /*padding-top: 10px;*/ } .portfolio.hover-default .portfolio-item .image .overlay .links .caption { padding: 30px 30px 0; } .portfolio.hover-default .portfolio-item .image .overlay .links a.icon/*, .portfolio.hover-default .portfolio-item .image .overlay .links .portfolio-icons.product-bottom .yith-wcwl-add-to-wishlist .yith-wcwl-add-button, .portfolio.hover-default .portfolio-item .image .overlay .links .portfolio-icons.product-bottom .yith-wcwl-add-to-wishlist .yith-wcwl-wishlistexistsbrowse*/ { margin: 10px; } .portfolio.hover-default .portfolio-item .image .overlay .links a.icon { width: 48px; height: 48px; } .portfolio.hover-default .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-default .portfolio-item .image .overlay .links a.icon:before { font-size: 48px; } .portfolio.hover-default .portfolio-item .image .overlay .links a.icon svg { width: 48px; height: 48px; } .portfolio:is(.columns-4, .columns-5, .columns-6).hover-default .portfolio-item .image .overlay .links a.icon { width: 24px; height: 24px; line-height: 24px; } .portfolio:is(.columns-4, .columns-5, .columns-6).hover-default .portfolio-item .image .overlay .links a.icon i, .portfolio:is(.columns-4, .columns-5, .columns-6).hover-default .portfolio-item .image .overlay .links a.icon:before { font-size: 24px; } .portfolio:is(.columns-4, .columns-5, .columns-6).hover-default .portfolio-item .image .overlay .links a.icon svg { width: 24px; height: 24px; } .portfolio.portfolio-style-metro.hover-default .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.portfolio-style-metro.hover-default .portfolio-item .image .overlay .links .caption .info { display: none; } @media (max-width: 991px) { .portfolio.hover-default .portfolio-item .image .overlay .links a.icon/*, .portfolio.hover-default .portfolio-item .image .overlay .links .portfolio-icons.product-bottom .yith-wcwl-add-to-wishlist .yith-wcwl-add-button, .portfolio.hover-default .portfolio-item .image .overlay .links .portfolio-icons.product-bottom .yith-wcwl-add-to-wishlist .yith-wcwl-wishlistexistsbrowse*/ { margin-right: 15px; } .portfolio.hover-default .portfolio-item .image .overlay .links a.icon { width: 24px; height: 24px; line-height: 24px; } .portfolio.hover-default .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-default .portfolio-item .image .overlay .links a.icon:before { font-size: 24px; } .portfolio.hover-default .portfolio-item .image .overlay .links a.icon svg { width: 24px; height: 24px; } } .portfolio.hover-default .fullwidth-block .overlay .links .caption .subtitle { display: block; } @media only screen and (max-width: 380px) { .portfolio.hover-default .portfolio-item .image .overlay .links .caption .subtitle { display: none; } } @media only screen and (min-width: 1120px) { .with-sidebar .portfolio.hover-default .overlay .portfolio-item .image .links .caption .subtitle, .with-sidebar .portfolio.hover-default .overlay .portfolio-item .image .links .caption .info { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1040px) { .with-sidebar .portfolio.hover-default .portfolio-item .image .overlay .links .caption .subtitle, .with-sidebar .portfolio.hover-default .portfolio-item .image .overlay .links .caption .info { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1120px) { .portfolio.hover-default.columns-3 .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-default.columns-3 .portfolio-item .image .overlay .links .caption .info { display: none; } } @media only screen and (min-width: 1100px) and (min-width: 832px) and (max-width: 1030px) { .portfolio.hover-default:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .subtitle, .portfolio.hover-default:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .info { display: none; } } @media only screen and (min-width: 832px) and (max-width: 1100px) { .portfolio.hover-default:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-default:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .info { display: none; } } @media only screen and (min-width: 1170px) and (max-width: 1250px), screen and (min-width: 900px) and (max-width: 992px) { .portfolio.hover-default .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .title { font-size: 14px; line-height: 1.5; } } @media only screen and (max-width: 768px) { .portfolio.hover-default .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-default .fullwidth-block .portfolio-item .image .overlay .links .caption .info { display: block; } } @media only screen and (max-width: 460px) { .portfolio.hover-default .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-default .fullwidth-block .portfolio-item .image .overlay .links .caption .info { display: none; } } @media only screen and (min-width: 1250px) and (max-width: 1770px), screen and (min-width: 992px) and (max-width: 1170px), screen and (min-width: 768px) and (max-width: 900px) { } @media only screen and (min-width: 1170px) and (max-width: 1250px), screen and (min-width: 900px) and (max-width: 992px) { .portfolio.hover-default .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .title { font-size: 14px; line-height: 1.5; } } @media only screen and (max-width: 370px) { .portfolio.hover-default .portfolio-item .image .overlay .links .caption { padding-top: 15px; } } /* Zooming blur hover */ .portfolio.hover-zooming-blur .portfolio-item .image .overlay .overlay-line { display: none; } .portfolio.hover-zooming-blur .portfolio-item .image img { -o-transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); -o-transition: all 0.4s; -moz-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; } .portfolio.hover-zooming-blur .portfolio-item .image img.zoom { transform: scale(1.15); -o-transform: scale(1.15); -ms-transform: scale(1.15); -moz-transform: scale(1.15); -webkit-transform: scale(1.15); } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links .caption { padding: 30px 30px 0; } .portfolio:not(.hover-default, .hover-zoom-overlay) .portfolio-item .image .overlay .links a.icon { margin-right: 16px; } .portfolio:not(.hover-default, .hover-zoom-overlay) .portfolio-item .image .overlay .links a.icon { display: inline-block; width: 70px; height: 70px; text-align: center; line-height: 70px; border-radius: 50%; } .portfolio:not(.hover-default, .hover-zoom-overlay) .portfolio-item .image .overlay .links a.icon i, .portfolio:not(.hover-default, .hover-zoom-overlay) .portfolio-item .image .overlay .links a.icon:before { font-size: 32px; } .portfolio:not(.hover-default, .hover-zoom-overlay) .portfolio-item .image .overlay .links a.icon svg { width: 32px; height: 32px; } .portfolio:not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item .image .overlay .links a.icon { width: 32px; height: 32px; line-height: 32px; } .portfolio:not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item .image .overlay .links a.icon i, .portfolio:not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item .image .overlay .links a.icon:before { font-size: 32px; } .portfolio:not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item .image .overlay .links a.icon svg { width: 32px; height: 32px; } .portfolio:is(.columns-4, .columns-5, .columns-6):not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon { margin-right: 10px; } .portfolio:is(.columns-4, .columns-5, .columns-6):not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon { line-height: 24px; width: 24px; height: 24px; } .portfolio:is(.columns-4, .columns-5, .columns-6):not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon i, .portfolio:is(.columns-4, .columns-5, .columns-6):not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon:before { font-size: 24px; } .portfolio:is(.columns-4, .columns-5, .columns-6):not(.hover-default, .hover-zooming-blur, .hover-zoom-overlay, .hover-gradient) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon svg { width: 24px; height: 24px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon { margin: 5px; } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon, .portfolio.hover-zooming-blur:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon { margin: 4px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon { background-color: #3c3950; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon:before { background-color: transparent; } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon, .portfolio.hover-zooming-blur:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; /*font-size: 16px;*/ } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon i, .portfolio.hover-zooming-blur:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon i, .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon:before, .portfolio.hover-zooming-blur:is(.columns-3,.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon:before { font-size: 16px; } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon svg, .portfolio.hover-zooming-blur:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon svg { width: 16px; height: 16px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links .caption .title { margin-bottom: 15px; } .portfolio.portfolio-style-metro.hover-zooming-blur .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.portfolio-style-metro.hover-zooming-blur .portfolio-item .image .overlay .links .caption .info { display: none; } @media only screen and (max-width: 430px) { .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon:before { font-size: 16px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon svg { width: 16px; height: 16px; } } @media only screen and (max-width: 991px) { .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon:before { font-size: 16px; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links a.icon svg { width: 16px; height: 16px; } .portfolio.hover-zooming-blur .portfolio-item.double-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-zooming-blur .portfolio-item.double-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-zooming-blur .portfolio-item.double-item .image .overlay .links a.icon i { font-size: 16px; } .portfolio.hover-zooming-blur .portfolio-item.double-item .image .overlay .links a.icon svg { width: 16px; height: 16px; } } @media only screen and (max-width: 380px) { .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-zooming-blur .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 992px) and (max-width: 1100px), screen and (min-width: 768px) and (max-width: 830px) { .with-sidebar .portfolio.hover-zooming-blur.columns-2 .portfolio-item .image .overlay .links .caption .subtitle, .with-sidebar .portfolio.hover-zooming-blur.columns-2 .portfolio-item .image .overlay .links .caption .info { display: none; } .with-sidebar .portfolio.hover-zooming-blur.columns-2 .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 768px) { .portfolio.hover-zooming-blur:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .subtitle, .portfolio.hover-zooming-blur:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .info, .portfolio.hover-zoom-overlay:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .subtitle, .portfolio.hover-zoom-overlay:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .info { display: none; } .portfolio.hover-zooming-blur:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .title, .portfolio.hover-zoom-overlay:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 992px) and (max-width: 1120px) { .portfolio.hover-zooming-blur.columns-3 .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-zooming-blur.columns-3 .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-zooming-blur.columns-3 .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 1120px) { .with-sidebar .portfolio.hover-zooming-blur.columns-3 .portfolio-item .image .overlay .links .caption .subtitle, .with-sidebar .portfolio.hover-zooming-blur.columns-3 .portfolio-item .image .overlay .links .caption .info { display: none; } .with-sidebar .portfolio.hover-zooming-blur.columns-3 .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 992px) { .with-sidebar .portfolio.hover-zooming-blur:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption { padding-top: 15px; } .with-sidebar .portfolio.hover-zooming-blur:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .caption .title { font-size: 14px; line-height: 21px; } } @media only screen and (min-width: 1250px) and (max-width: 1820px), screen and (min-width: 992px) and (max-width: 1170px), screen and (min-width: 768px) and (max-width: 900px) { .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 1170px) and (max-width: 1250px), screen and (min-width: 900px) and (max-width: 992px) { .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item .image .overlay .links .caption { padding-top: 15px; } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .title { font-size: 14px; line-height: 1.5; } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-zooming-blur .fullwidth-block .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } /* Gradient hover */ .portfolio.hover-gradient .portfolio-item .image .overlay .overlay-line { display: none; } .portfolio.hover-gradient .portfolio-item .image img { -o-transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); -o-transition: all 0.4s; -moz-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; } .portfolio.hover-gradient .portfolio-item .image .overlay .links, .portfolio.hover-disabled .portfolio-item .image .overlay .links { vertical-align: bottom; padding: 0; text-align: left; } .portfolio.hover-gradient .portfolio-item .image .overlay .links .portfolio-icons { position: absolute; left: 0; top: 0; padding: 25px 30px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links .description { position: static; } .portfolio.hover-gradient .portfolio-item .image .overlay .links .caption, .portfolio.hover-disabled .portfolio-item .image .overlay .links .caption { padding: 0 30px 25px; width: 100%; text-align: left; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon { margin-right: 16px; } .portfolio:is(.columns-4, .columns-5, .columns-6):not(.hover-default, .hover-gradient, .hover-zooming-blur) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon { margin-right: 10px; } .portfolio.hover-gradient .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon, .portfolio.hover-gradient:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon { background-color: rgba(255, 255, 255, 0.8); color: #3c3950; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon:before { background-color: transparent; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon:before { color: #3c3950; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon svg { fill: #3c3950; } .portfolio.hover-gradient .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon, .portfolio.hover-gradient:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-gradient .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon i, .portfolio.hover-gradient:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon i, .portfolio.hover-gradient .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon:before, .portfolio.hover-gradient:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon:before { font-size: 16px; } .portfolio.hover-gradient .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon svg, .portfolio.hover-gradient:is(.columns-3, .columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links a.icon svg { width: 16px; height: 16px; } .portfolio.hover-gradient:not(.products) .portfolio-item .image .overlay .links .caption .title, .portfolio.hover-circular:not(.products) .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } .portfolio.portfolio-style-metro.hover-gradient .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.portfolio-style-metro.hover-gradient .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-gradient .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-disabled .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-gradient .portfolio-item .wrap > .caption .subtitle { display: none !important; } @media (max-width: 992px) { .portfolio.hover-gradient .portfolio-item .image .overlay .links .caption .info, .portfolio.hover-gradient .portfolio-item .wrap > .caption .info, .portfolio.hover-default .portfolio-item .image .overlay .links .caption .description, .portfolio.hover-zoom-overlay .portfolio-item .image .overlay .links .caption .description { display: none !important; } } .portfolio.gem-instagram-gallery.hover-gradient .portfolio-item .image .overlay .links .caption .subtitle { display: block !important; } .portfolio.hover-gradient.fullwidth-columns-4 .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle { display: block !important; max-width: 70%; } .hover-gradient .portfolio-item .image .overlay .links .portfolio-sharing-pane { text-align: left; } .hover-gradient .portfolio-item .image .overlay .links .portfolio-sharing-pane a.socials-item:first-child { margin-left: 0; } .portfolio.hover-gradient.hover-gradient-title .portfolio-item .image .overlay .links .caption .title, .portfolio.hover-gradient.hover-gradient-title .portfolio-item .image .overlay .links .caption .description { opacity: 1; } .portfolio.hover-gradient.hover-gradient-title .portfolio-item .image .overlay .links .caption .title, .portfolio.hover-gradient.hover-gradient-title .portfolio-item .image .overlay .links .caption .info { opacity: 1; top: 0; -webkit-transform: scale(1); transform: scale(1); } @media only screen and (max-width: 430px) { .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon:before { font-size: 16px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon svg { width: 16px; height: 16px; } } @media only screen and (max-width: 991px) { .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon/*, .portfolio.hover-gradient .portfolio-item .image .overlay .links .portfolio-icons.product-bottom .yith-wcwl-add-to-wishlist .yith-wcwl-add-button, .portfolio.hover-gradient .portfolio-item .image .overlay .links .portfolio-icons.product-bottom .yith-wcwl-add-to-wishlist .yith-wcwl-wishlistexistsbrowse*/ { margin-right: 8px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon:before { font-size: 16px; } .portfolio.hover-gradient .portfolio-item .image .overlay .links a.icon svg { width: 16px; height: 16px; } .portfolio.hover-gradient .portfolio-item.double-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-gradient .portfolio-item.double-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-gradient .portfolio-item.double-item .image .overlay .links a.icon i { font-size: 16px; } .portfolio.hover-gradient .portfolio-item.double-item .image .overlay .links a.icon svg { width: 16px; height: 16px; } } @media only screen and (max-width: 380px) { .portfolio.hover-gradient .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-gradient .portfolio-item .image .overlay .links .caption .info { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1100px), screen and (min-width: 768px) and (max-width: 830px) { .with-sidebar .portfolio.hover-gradient.columns-2 .portfolio-item .image .overlay .links .caption .subtitle, .with-sidebar .portfolio.hover-gradient.columns-2 .portfolio-item .image .overlay .links .caption .info { display: none; } .with-sidebar .portfolio.hover-gradient.columns-2 .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 768px) { .portfolio.hover-gradient:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .subtitle, .portfolio.hover-gradient:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .info, .portfolio.hover-disabled:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .info { display: none; } .portfolio.hover-gradient:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 992px) and (max-width: 1120px) { .portfolio.hover-gradient.columns-3 .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-gradient.columns-3 .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-gradient.columns-3 .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 1120px) { .with-sidebar .portfolio.hover-gradient.columns-3 .portfolio-item .image .overlay .links .caption .subtitle, .with-sidebar .portfolio.hover-gradient.columns-3 .portfolio-item .image .overlay .links .caption .info { display: none; } .with-sidebar .portfolio.hover-gradient.columns-3 .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 992px) { .with-sidebar .portfolio.hover-gradient:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption { padding-top: 15px; } .with-sidebar .portfolio.hover-gradient:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .caption .title { font-size: 14px; line-height: 21px; } } @media only screen and (min-width: 1250px) and (max-width: 1820px), screen and (min-width: 992px) and (max-width: 1170px), screen and (min-width: 768px) and (max-width: 900px) { .portfolio.hover-gradient .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-gradient .fullwidth-block .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-gradient .fullwidth-block .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 1170px) and (max-width: 1250px), screen and (min-width: 900px) and (max-width: 992px) { .portfolio.hover-gradient .fullwidth-block .portfolio-item .image .overlay .links .caption { padding-top: 15px; } .portfolio.hover-gradient .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .title { font-size: 14px; line-height: 1.5; } .portfolio.hover-gradient .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .product-price .price .amount { font-size: 127%; } .portfolio.hover-gradient .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-gradient .fullwidth-block .portfolio-item .image .overlay .links .caption .info { display: none; } .portfolio.hover-gradient .fullwidth-block .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 1280px) and (max-width: 1550px), screen and (min-width: 768px) and (max-width: 1100px) { .portfolio.hover-gradient.fullwidth-columns-4 .fullwidth-block .portfolio-item .image .overlay .links .caption .subtitle { display: none !important; } } /* Circular hover */ .portfolio.hover-circular .portfolio-item .image .overlay .overlay-circle { display: block; } .portfolio.hover-circular .portfolio-item .image img { -o-transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); -o-transition: all 0.4s; -moz-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; } .portfolio.hover-circular .portfolio-item .image .overlay .links { vertical-align: bottom; padding: 0; text-align: left; } .portfolio.hover-circular .portfolio-item .image .overlay .links .portfolio-icons { position: absolute; left: 0; right: 0; top: 0; padding: 35px 25px; } .portfolio.hover-circular .portfolio-item .image .overlay .links .description { position: static; } .portfolio.hover-circular .portfolio-item .image .overlay .links .caption { padding: 0 25px 25px; width: 100%; text-align: left; } @media only screen and (min-width: 550px) { .portfolio.hover-circular .portfolio-item.double-item-squared .image .overlay .links .portfolio-icons { padding: 45px 40px; } .portfolio.hover-circular .portfolio-item.double-item-horizontal .image .overlay .links .portfolio-icons { padding: 35px 40px; } .portfolio.hover-circular .portfolio-item.double-item-squared .image .overlay .links .caption { padding: 0 40px 35px; } .portfolio.hover-circular .portfolio-item.double-item-horizontal .image .overlay .links .caption { padding: 0 40px 25px; } } .portfolio.hover-circular .portfolio-item .image .overlay .links .caption .subtitle { max-width: 70%; left: 42px; display: none !important; } .portfolio.gem-instagram-gallery.hover-circular .portfolio-item .image .overlay .links .caption .subtitle { left: 25px; display: block !important; } .portfolio.hover-circular:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-circular:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .info { display: none; } .hover-circular .portfolio-item .image .overlay .links .portfolio-sharing-pane { text-align: left; } .hover-circular .portfolio-item .image .overlay .links .portfolio-sharing-pane a.socials-item:first-child { margin-left: 0; } .portfolio.hover-circular.hover-circular-title .portfolio-item .image .overlay .links .caption .title, .portfolio.hover-circular.hover-circular-title .portfolio-item .image .overlay .links .caption .description { opacity: 1; } .portfolio.hover-circular.hover-circular-title .portfolio-item .image .overlay .links .caption .title, .portfolio.hover-circular.hover-circular-title .portfolio-item .image .overlay .links .caption .info { opacity: 1; top: 0; -webkit-transform: scale(1); transform: scale(1); } .portfolio.hover-circular .overlay .links a.icon { margin-right: 32px; } .portfolio.hover-circular .overlay .overlay-line { margin: 16px 0; } .vc_col-sm-9 .portfolio.hover-circular .portfolio-item:not(.double-item-squared) .overlay .links { padding: 31px 28px; } @media only screen and (min-width: 1280px) and (max-width: 1550px), screen and (min-width: 550px) and (max-width: 1100px), screen and (max-width: 400px) { .portfolio.hover-circular .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-circular .portfolio-item .image .overlay .links .caption .info { display: none; } } @media only screen and (max-width: 430px) { .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon:before { font-size: 24px; } .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon svg { width: 24px; height: 24px; } } @media only screen and (max-width: 991px) { .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon { width: 24px; height: 24px; line-height: 24px; } .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon i, .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon:before { font-size: 24px; } .portfolio.hover-circular .portfolio-item .image .overlay .links a.icon svg { width: 24px; height: 24px; } .portfolio.hover-circular .portfolio-item.double-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.hover-circular .portfolio-item.double-item-squared .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.hover-circular .portfolio-item.double-item-squared .image .overlay .links a.icon i, .portfolio.hover-circular .portfolio-item.double-item-squared .image .overlay .links a.icon:before { font-size: 32px; } .portfolio.hover-circular .portfolio-item.double-item-squared .image .overlay .links a.icon svg { width: 32px; height: 32px; } } @media only screen and (min-width: 992px) { .with-sidebar .portfolio.hover-circular:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .image .overlay .caption .title { font-size: 14px; line-height: 1.5; } } @media only screen and (min-width: 1170px) and (max-width: 1250px), screen and (min-width: 900px) and (max-width: 992px) { .portfolio.hover-circular .fullwidth-block .portfolio-item:not(.double-item-squared) .image .overlay .links .caption .title { font-size: 14px; line-height: 1.5; } .portfolio.hover-circular .fullwidth-block .portfolio-item .image .overlay .links .caption .title { margin-bottom: 0; } } @media only screen and (min-width: 400px) and (max-width: 550px) { .portfolio.hover-circular:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-circular:is(.columns-4, .columns-5, .columns-6) .portfolio-item .image .overlay .links .caption .info { display: block; } } @media only screen and (min-width: 800px) { .portfolio.hover-circular.columns-2 .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-circular.columns-2 .portfolio-item .image .overlay .links .caption .info, .portfolio.hover-circular.columns-1 .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.hover-circular.columns-1 .portfolio-item .image .overlay .links .caption .info { display: block; } } /* Horizontal sliding hover */ .portfolio.hover-horizontal-sliding:not(.version-alternative) .overlay .links, .portfolio.hover-horizontal-sliding:not(.version-alternative) .portfolio-item .image .links, .portfolio.hover-new-horizontal-sliding.title-on-hover .overlay .links, .portfolio.hover-default-horizontal-sliding .overlay .links { text-align: left; vertical-align: bottom; } .portfolio.hover-horizontal-sliding .overlay .links .caption { text-align: left; padding: 0; } .portfolio.hover-horizontal-sliding .overlay .links { padding: 39px 50px; } .portfolio.hover-horizontal-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links { padding: 41px 28px; } .portfolio.hover-horizontal-sliding .overlay .links a.icon, .portfolio.hover-horizontal-sliding .overlay .links a.icon { margin-right: 32px; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 30px 0; } .portfolio.hover-horizontal-sliding.columns-2 .overlay .links .caption .subtitle { width: 65%; margin-bottom: 3px; } .portfolio.hover-horizontal-sliding.columns-2 .overlay .links .caption .info { width: 65%; } .portfolio.hover-horizontal-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links a.icon, .portfolio.hover-horizontal-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links a.icon { margin-right: 16px; } .portfolio.portfolio-style-metro.hover-horizontal-sliding .portfolio-item .image .overlay .links .caption .subtitle, .portfolio.portfolio-style-metro.hover-horizontal-sliding .portfolio-item .image .overlay .links .caption .info { display: none; } @media only screen and (max-width: 1170px) { .portfolio.hover-horizontal-sliding.columns-2 .overlay .links .caption .subtitle { width: 85%; } .portfolio.hover-horizontal-sliding.columns-2 .overlay .links .caption .info { width: 85%; } } @media only screen and (max-width: 920px) { .portfolio.hover-horizontal-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none; } .portfolio.hover-horizontal-sliding.columns-3 .overlay .links .caption .info { display: block; } } @media only screen and (max-width: 980px) { .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } } @media only screen and (max-width: 768px) { .portfolio.hover-horizontal-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .portfolio.hover-horizontal-sliding.columns-3 .overlay .links .caption .subtitle, .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle, .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links .caption .subtitle { display: block; } .portfolio.hover-horizontal-sliding.columns-2 .overlay .links .caption .info, .portfolio.hover-horizontal-sliding.columns-3 .overlay .links .caption .info, .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .info, .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links .caption .info { display: block; } } @media only screen and (max-width: 460px) { .portfolio.hover-horizontal-sliding:is(.columns-2, .columns-3, .columns-4, .columns-5, .columns-6) .overlay .links .caption .subtitle, .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links .caption .subtitle { display: none !important; } } @media only screen and (max-width: 440px) { .portfolio.hover-horizontal-sliding:is(.columns-2, .columns-3, .columns-4, .columns-5, .columns-6) .overlay .links .caption .info, .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links .caption .info { display: none !important; } } @media only screen and (min-width: 830px) { .with-sidebar .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .info { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1150px) { .with-sidebar .portfolio.hover-horizontal-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links a.icon { margin-right: 23px; width: 32px; height: 32px; line-height: 32px; } .with-sidebar .portfolio.hover-horizontal-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links a.icon:before { font-size: 32px; } .with-sidebar .portfolio.hover-horizontal-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links a.icon svg { width: 32px; height: 32px; } } @media only screen and (min-width: 768px) and (max-width: 845px) { .portfolio.hover-horizontal-sliding:is(.columns-1, .columns-2, .columns-3) .overlay .links { padding: 41px 28px; } } @media only screen and (max-width: 440px) { .portfolio.hover-horizontal-sliding:is(.columns-1, .columns-2, .columns-3, .columns-4, .columns-5, .columns-6) .overlay .links, .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links { padding: 41px 30px; } } @media only screen and (max-width: 360px) { .portfolio.hover-horizontal-sliding:is(.columns-1, .columns-2, .columns-3, .columns-4, .columns-5, .columns-6) .overlay .links, .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links { padding: 31px 20px; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 15px 0; } } @media only screen and (min-width: 992px) and (max-width: 1150px) { .portfolio.hover-horizontal-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-horizontal-sliding.columns-3 .overlay .links { padding: 41px 28px; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 15px 0; } .with-sidebar .portfolio.hover-horizontal-sliding.columns-2 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none; } } @media only screen and (min-width: 920px) and (max-width: 992px) { .portfolio.hover-horizontal-sliding.columns-3 .overlay .links .caption .subtitle, .portfolio.hover-horizontal-sliding.columns-3 .overlay .links .caption .info { display: block; } } @media only screen and (min-width: 1150px) { .with-sidebar .portfolio.hover-horizontal-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .with-sidebar .portfolio.hover-horizontal-sliding.columns-3 .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none; } .with-sidebar .portfolio.hover-horizontal-sliding.columns-3 .overlay .links { padding: 41px 28px; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 15px 0; } } @media only screen and (min-width: 768px) { .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item-squared) .overlay .links .caption .subtitle { display: none; } .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links { padding: 41px 28px; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 15px 0; } } @media only screen and (min-width: 1735px) { .portfolio.hover-horizontal-sliding.columns-3 .fullwidth-block .overlay .links .caption .subtitle, .portfolio.hover-horizontal-sliding.columns-3 .fullwidth-block .overlay .links .caption .info { display: block; } } @media only screen and (min-width: 992px) { .with-sidebar .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links { padding: 18px 12px; } .with-sidebar .portfolio.hover-horizontal-sliding:is(.columns-4, .columns-5, .columns-6) .overlay .links .caption .title { font-size: 14px; line-height: 1.5; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 15px 0; } } @media only screen and (min-width: 1250px) and (max-width: 1770px), screen and (min-width: 992px) and (max-width: 1170px), screen and (min-width: 768px) and (max-width: 900px) { .portfolio.hover-horizontal-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links { padding: 41px 28px; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 15px 0; } } @media only screen and (min-width: 1170px) and (max-width: 1250px), screen and (min-width: 900px) and (max-width: 992px) { .portfolio.hover-horizontal-sliding .fullwidth-block .portfolio-item:not(.double-item-squared) .overlay .links .caption .info { display: none; } .portfolio.hover-horizontal-sliding .fullwidth-block .overlay .links { padding: 18px 12px; } .portfolio.hover-horizontal-sliding .overlay .overlay-line { margin: 15px 0; } } /* Disabled hover */ .portfolio.hover-disabled .portfolio-item .image .overlay, .portfolio.hover-disabled .portfolio-item:hover .image .overlay, .portfolio.hover-disabled .portfolio-item.hover-effect .image .overlay { display: block; } .portfolio.hover-disabled:not(.caption-position-image) .portfolio-item .image .overlay .links-wrapper { /*display: none;*/ } .portfolio.hover-disabled .portfolio-item .image .overlay .links .caption { width: 100%; } /* PORTFOLIO TOP PANEL */ .portfolio-top-panel { display: table; width: 100%; } .portfolio-top-panel-left, .portfolio-top-panel-right { display: table-cell; vertical-align: top; } .portfolio-sorting { display: inline-block; white-space: nowrap; margin: 0; } .portfolio-sorting.title-h6 { margin: 0; } .portfolio-sorting > div { display: inline-block; vertical-align: middle; } .portfolio-sorting-sep { height: 30px; width: 1px; margin: 0 20px; background-color: #b6c6c9; } .portfolio-sorting label { display: inline-block; vertical-align: middle; cursor: pointer; font-size: 14px; } .sorting-switcher { position: relative; display: inline-block; vertical-align: middle; width: 40px; height: 24px; border-radius: 12px; background-color: #b6c6c9; } .sorting-switcher:after { content: ''; position: absolute; width: 16px; height: 16px; top: 4px; left: 4px; -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; background-color: #ffffff; border-radius: 50%; } .sorting-switcher.right:after { left: 20px; } .portfolio-top-panel.filter-type-default .portfolio-filters-resp { margin: 0; } .portfolio-top-panel.filter-type-default .portfolio-search-filter { margin-left: 5px; } @media (min-width: 768px) { .portfolio-top-panel.filter-type-default .portfolio-search-filter { margin-left: 15px; } } .portfolio-sharing-pane { height: 0; text-align: center; } .portfolio.hover-horizontal-sliding .portfolio-sharing-pane, .portfolio.hover-vertical-sliding .portfolio-sharing-pane { text-align: left; } .portfolio-likes { margin-top: 0; height: 0; opacity: 0; text-align: center; text-align: -webkit-center; -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .portfolio-item.hide-likes .portfolio-likes { -o-transition: none; -webkit-transition: none; transition: none; } .portfolio-item:not(.hide-likes):hover .portfolio-likes, .portfolio-item .portfolio-likes.visible { margin-top: 10px; height: 25px; opacity: 1; } .portfolio-likes .zilla-likes { display: flex; align-items: center; justify-content: center; width: fit-content; } .portfolio .zilla-likes { line-height: 1.3; } .portfolio .zilla-likes:before { content: none !important; } .portfolio .zilla-likes i { font-size: 16px; font-style: normal; margin-right: 6px; vertical-align: top; } .portfolio .portfolio-likes .zilla-likes i { font-size: 24px; } .portfolio .zilla-likes i.default:before { content: '\e641'; display: inline-block; font-family: "thegem-icons"; font-weight: normal; line-height: inherit; } .portfolio-item .image .overlay .portfolio-sharing-pane { /*white-space: nowrap;*/ font-size: 0; } .portfolio:not(.hover-default, .hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .portfolio-sharing-pane { margin-left: -6px; } .portfolio:is(.columns-4, .columns-5, .columns-6):not(.hover-default, .hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .portfolio-sharing-pane { margin-left: -3px; } .portfolio-item .image .overlay .portfolio-sharing-pane .socials-item { margin: 0 10px; } .portfolio:is(.columns-3, .columns-4, .columns-5, .columns-6, .fullwidth-columns-4, .fullwidth-columns-5, .fullwidth-columns-6) .portfolio-item .image .overlay .portfolio-sharing-pane .socials-item { margin: 0 5px; } .caption-sizable-content { position: absolute; padding: inherit; top: 0; left: 0; width: 100%; bottom: 30px; overflow: hidden; } .caption-sizable-content:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 0; -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .caption-sizable-content .after-overlay { position: absolute; bottom: 0; left: 0; width: 100%; z-index: 1; -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .caption-sizable-content.with-bottom-line { bottom: 70px; } .caption-bottom-line { position: absolute; padding: inherit; padding-right: 0; bottom: 0; left: 0; width: 100%; display: flex; align-items: center; } .portfolio.columns-1 .portfolio-item .caption-bottom-line .gem-button { margin-bottom: 0; margin-right: 15px; } @media only screen and (max-width: 991px) { .portfolio.columns-1 .portfolio-item .wrap { display: block; } .caption-sizable-content, .caption-bottom-line { position: relative; bottom: auto; padding: 0; } .caption-sizable-content:after { display: none; } } .portfolio.columns-1.background-style-white.no-gaps .portfolio-item:not([style*='top: 0px;']) .wrap > .caption { border-top: 0; } .portfolio-title { text-align: center; } .hover-gradient.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .title, .hover-circular.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .title { color: #212227; } .hover-gradient.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .subtitle, .hover-circular.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .subtitle, .hover-gradient.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .post-date, .hover-circular.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .post-date, .hover-gradient.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .author .author-name, .hover-gradient.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .author .author-name a, .hover-gradient.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .product-info .product-price, .hover-circular.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .product-info .product-price, .hover-gradient.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .product-info .product-price .amount, .hover-circular.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .product-info .product-price .amount, .news-grid.portfolio.hover-circular.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .info, .news-grid.portfolio.hover-circular.title-on-page.title-style-dark .portfolio-item .image .overlay .links .caption .info a { color: #212227; } .news-grid.portfolio.title-on-page.hover-circular.title-style-dark .portfolio-item .image .overlay .links .caption .info span.sep { border-left-color: #212227; } .portfolio-load-more .gem-button-separator-button, .mixed-show-all .gem-button-separator-button { padding: 0 20px; } .portfolio-load-more .gem-button-container .gem-button-separator-type-square, .mixed-show-all .gem-button-container .gem-button-separator-type-square { display: flex; flex-direction: column; align-items: center; } .gem-button-icon-position-right .gem-inner-wrapper-btn { flex-direction: row-reverse; } .portfolio .gem-pagination { display: flex; align-items: center; justify-content: center; } .portfolio .gem-pagination a, .portfolio .gem-pagination span.page-numbers { box-sizing: content-box; line-height: 30px; } .portfolio:not(.category-grid) .gem-pagination .prev, .portfolio:not(.category-grid) .gem-pagination .next { display: flex; align-items: center; justify-content: center; flex: none; } .portfolio:not(.category-grid) .gem-pagination .prev:before, .portfolio:not(.category-grid) .gem-pagination .next:before { content: none; } .portfolio .gem-pagination .prev i, .portfolio .gem-pagination .next i { font-size: 24px; } .portfolio .gem-pagination .prev i.default, .portfolio .gem-pagination .next i.default { font-family: 'thegem-icons'; font-weight: normal; font-style: normal; } .gem-pagination .prev i.default:before { content: '\e636'; } .gem-pagination .next i.default:before { content: '\e634'; } .portfolio .gem-button-separator, .portfolio .gem-button-separator-line { width: 100%; } .portfolio.caption-position-zigzag.portfolio-pagination-normal .portfolio-item.item-even .wrap, .portfolio.caption-position-zigzag:not(.portfolio-pagination-normal) .portfolio-item:nth-child(even) .wrap { flex-direction: row-reverse; } .portfolio.portfolio-list .portfolio-item { margin-bottom: -1px; } .portfolio.disable-isotope .portfolio-set { display: flex; flex-wrap: wrap; } .portfolio.disable-isotope:not(.portfolio-list, .list-style, .columns-1).title-on-page .portfolio-set .portfolio-item .wrap { height: 100%; display: flex; flex-direction: column; } .portfolio.disable-isotope.title-on-page .portfolio-set .portfolio-item .wrap > .caption { flex: auto; } .portfolio .portfolio-item.product.inline-column { float: left; margin-bottom: 0; } .preloader-new ~ * .portfolio-set { opacity: 0.6; } .preloader-new .preloader-spin, .preloader-new .preloader-spin-new { top: 100px; left: initial; right: 50%; } .portfolio.hover-none .portfolio-item .image .overlay { display: block; } .portfolio-preloader-wrapper { position: relative; width: 100%; clear: both; } /* Creative Grid */ .portfolio-grid.portfolio-style-creative .portfolio-set { display: grid; grid-auto-rows: minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative .portfolio-set:before, .portfolio-grid.portfolio-style-creative .portfolio-set:after { content: none; } .portfolio-grid.portfolio-style-creative.columns-mobile-1 .portfolio-set { grid-template-columns: minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative.columns-mobile-2 .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } @media (min-width: 768px) { .portfolio-grid.portfolio-style-creative.columns-tablet-2 .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative.columns-tablet-3 .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative.columns-tablet-4 .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); } } @media (min-width: 992px) { .portfolio-grid.portfolio-style-creative.columns-1 .portfolio-set { grid-template-columns: minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative.columns-2 .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative.columns-3 .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative:is(.columns-4, .fullwidth-columns-4) .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative:is(.columns-5, .fullwidth-columns-5) .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); } .portfolio-grid.portfolio-style-creative:is(.columns-6, .fullwidth-columns-6) .portfolio-set { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); } } .portfolio-grid.portfolio-style-creative .portfolio-item { width: auto !important; } .portfolio-grid.portfolio-style-creative .portfolio-item:not(.size-item) .wrap-out { position: relative; height: 100%; } .portfolio-grid.portfolio-style-creative .portfolio-item:not(.size-item) .wrap-out .wrap { /*position: absolute;*/ width: 100%; height: 100%; display: flex; flex-direction: column; } .portfolio-grid.portfolio-style-creative .portfolio-item:not(.size-item) .wrap-out .wrap .image .image-inner, .portfolio-grid.portfolio-style-creative .portfolio-item:not(.size-item) .wrap-out .wrap .image .post-featured-content { height: 100%; } .portfolio-grid.portfolio-style-creative .portfolio-item:not(.size-item) .wrap-out .wrap .image { flex: none; } .portfolio-grid.portfolio-style-creative .portfolio-item:not(.size-item) .wrap-out .wrap > .caption { flex: none; } .portfolio-grid.portfolio-style-creative .portfolio-item.double-item .wrap-out .wrap .image { flex: auto; } .portfolio-grid.portfolio-style-creative .portfolio-item.double-item .wrap-out .wrap .image .image-inner { position: absolute; width: 100%; } .portfolio-grid.portfolio-style-creative .portfolio-item.double-item .wrap-out .wrap > .caption { flex: none; } .portfolio-grid.portfolio-style-creative .portfolio-item.size-item { grid-column-end: span 1 !important; grid-row-end: span 1 !important; grid-column-start: 1; grid-row-start: 1; z-index: -1; opacity: 0 !important; visibility: hidden; } .portfolio-grid.portfolio-style-creative .portfolio-item:first-child { grid-column-start: 1; grid-row-start: 1; } .portfolio-grid.portfolio-style-creative .portfolio-item.double-item-squared { grid-column-end: span 2; grid-row-end: span 2; } .portfolio-grid.portfolio-style-creative .portfolio-item.double-item-horizontal { grid-column-end: span 2; } .portfolio-grid.portfolio-style-creative .portfolio-item.double-item-vertical { grid-row-end: span 2; } @media (max-width: 767px) { .portfolio-grid.portfolio-style-creative.creative-disable-mobile .portfolio-item { grid-column-end: span 1 !important; grid-row-end: span 1 !important; } } @media (min-width: 768px) and (max-width: 991px) { .portfolio-grid.portfolio-style-creative.creative-disable-tablet .portfolio-item { grid-column-end: span 1 !important; grid-row-end: span 1 !important; } } .portfolio-grid.portfolio-style-creative.title-on-hover .portfolio-item.double-item .image { position: absolute; width: 100%; height: 100%; } /* End Creative Grid */ .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular) .portfolio-item .image .overlay .links a.icon { width: 24px; height: 24px; line-height: 24px; } .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular) .portfolio-item .image .overlay .links a.icon { margin-right: 20px; } .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular) .portfolio-item .image .overlay .links a.icon i, .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular) .portfolio-item .image .overlay .links a.icon:before { font-size: 24px; } .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .links a.icon { width: 40px; height: 40px; line-height: 40px; } .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .links a.icon { margin-right: 8px; } .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .links a.icon i, .portfolio.portfolio-grid.hover-elements-size-small:is(.hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .links a.icon:before { font-size: 16px; } .portfolio.hover-title.hover-elements-size-small .portfolio-item .overlay .caption .title, .portfolio.title-on-page.hover-gradient.hover-elements-size-small .portfolio-item .overlay .caption .title, .portfolio.title-on-page.hover-circular.hover-elements-size-small .portfolio-item .overlay .caption .title, .portfolio.title-on-page.hover-disabled.hover-elements-size-small .portfolio-item .overlay .caption .title, .portfolio.hover-gradient.hover-elements-size-small .portfolio-item .overlay .caption .title, .portfolio.hover-circular.hover-elements-size-small .portfolio-item .overlay .caption .title, .portfolio.hover-disabled.hover-elements-size-small .portfolio-item .overlay .caption .title, .portfolio.hover-elements-size-small .portfolio-item .overlay .caption .title { font-size: 14px; line-height: 1.5; margin-bottom: 10px; } .portfolio.hover-default.hover-elements-size-small .portfolio-item .overlay .links .caption .subtitle, .portfolio.hover-zoom-overlay.hover-elements-size-small .portfolio-item .overlay .links .caption .subtitle { display: none; } .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular) .portfolio-item .image .overlay .links a.icon { width: 48px; height: 48px; line-height: 48px; margin: 10px; } .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular) .portfolio-item .image .overlay .links a.icon i, .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular) .portfolio-item .image .overlay .links a.icon:before { font-size: 48px; } .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .links a.icon { width: 70px; height: 70px; line-height: 70px; margin: 5px; } .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .links a.icon i, .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-zooming-blur, .hover-gradient) .portfolio-item .image .overlay .links a.icon:before { font-size: 32px; } .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular, .hover-zooming-blur, .hover-gradient, .hover-zoom-overlay, .hover-disabled) .portfolio-item .wrap .overlay .caption .title { font-size: 24px; line-height: 1.5; margin-bottom: 0; } .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular, .hover-zooming-blur, .hover-gradient, .hover-zoom-overlay) .portfolio-item .wrap .overlay .caption .subtitle, .portfolio.portfolio-grid.hover-elements-size-big:is(.hover-default, .hover-horizontal-sliding, .hover-vertical-sliding, .hover-circular, .hover-zooming-blur, .hover-gradient, .hover-zoom-overlay) .portfolio-item .wrap .image .overlay .links .caption .info { display: block; } .portfolio.portfolio-grid .portfolio-item .portfolio-video-icon { display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 0; line-height: 1; opacity: 0.8; transition: opacity 0.2s; z-index: 100; } .portfolio.portfolio-grid .portfolio-item .portfolio-video-icon:hover { opacity: 1; } .portfolio.portfolio-grid .portfolio-item .portfolio-video-icon:before { content: '\e655'; font-family: 'thegem-icons'; font-size: 50px; color: #ffffff; filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.1)); } .portfolio.portfolio-grid .portfolio-item.small-item .portfolio-video-icon:before { font-size: 60px; } .portfolio.portfolio-grid .portfolio-item.appearance-type-video .image-inner, .portfolio.portfolio-grid .portfolio-item.appearance-type-animated_gif .image-inner, .portfolio.portfolio-grid .portfolio-item.appearance-type-gallery .image-inner { z-index: initial; } .portfolio.portfolio-grid .portfolio-item.hide-overlay .overlay { z-index: -1; } .portfolio.portfolio-grid .portfolio-item.appearance-type-video .overlay:before, .portfolio.portfolio-grid .portfolio-item.appearance-type-animated_gif .overlay:before, .portfolio.portfolio-grid .portfolio-item.appearance-type-gallery .overlay:before { content: none !important; } .portfolio.portfolio-grid .portfolio-item.appearance-type-video img, .portfolio.portfolio-grid .portfolio-item.appearance-type-animated_gif img, .portfolio.portfolio-grid .portfolio-item.appearance-type-gallery img { transform: none !important; } @media (max-width: 991px) { .portfolio-item .gem-video-portfolio.hide-on-mobile { display: none; } } @media (min-width: 992px) { .portfolio-grid .portfolio-item .video-image-mobile { display: none; opacity: 0; } .portfolio-grid.portfolio-style-metro .portfolio-item .video-image-mobile, .portfolio-grid.portfolio-style-masonry .portfolio-item:not(.custom-ratio) .video-image-mobile { display: block; } } .gem-video-portfolio video, .gem-video-portfolio iframe { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .gem-video-portfolio.type-youtube iframe { aspect-ratio: 16/9; height: auto; max-height: 100%; top: 50%; transform: translateY(-50%); } .gem-video-portfolio video { object-fit: cover; } .gem-video-portfolio-mobile, .gem-video-portfolio-overlay { position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-size: cover; background-position: center; } .portfolio:not(.columns-1) .portfolio-item .image img.gem-gif-poster { position: absolute !important; top: 0; left: 0; } .portfolio-item:hover .image:not(.gif-load-on-hover) img.gem-gif-poster, .portfolio-item .image.gif-load-on-hover img.gem-gif-portfolio { opacity: 0; } .portfolio-grid.portfolio-style-metro .gem-video-portfolio { position: absolute; width: 100%; height: 100%; left: 0; top: 0; } .portfolio-item .video-type-icon, .portfolio-item .gif-type-icon { position: absolute; right: 9px; top: 9px; height: auto; fill: #ffffff; filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.1)); } .portfolio-item .video-type-icon{ width: 16px; } .portfolio-item .gif-type-icon { width: 18px; } .portfolio-image-slider { width: 100%; height: 100%; position: relative; overflow: hidden; aspect-ratio: 1/1; } .portfolio-image-slider:before { content: none !important; } .portfolio.columns-1 .portfolio-item .image img.gem-gif-portfolio { position: absolute; left: 0; top: 0; } .portfolio.columns-1 .portfolio-item .image img.gem-gif-poster { position: relative; } .portfolio.columns-1 .portfolio-item:not(.custom-ratio) .video-image-mobile { display: block; } .portfolio.columns-1 .portfolio-image-slider { position: absolute; } .portfolio-grid.portfolio-style-metro .portfolio-image-slider { position: absolute; } .portfolio-image-slider .slide { width: 100%; height: 100%; position: absolute; transition: all 0.5s; } .portfolio-image-slider .slide:first-child { z-index: 1; } .portfolio-image-slider .btn { position: absolute; display: flex; align-items: center; justify-content: center; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; background: 0 0; color: inherit; border: none; padding: 0!important; font: inherit; opacity: 0; transition: opacity 0.3s linear; z-index: 100; } .portfolio-item:hover .portfolio-image-slider .btn { opacity: 1; } .portfolio-image-slider .btn:before { content: ''; width: 18px; height: 18px; } .portfolio-image-slider .btn.btn-prev { left: 0; } .portfolio-image-slider .btn.btn-prev:before { background-image: url('../images/ar2.svg'); } .portfolio-image-slider .btn.btn-next { right: 0; } .portfolio-image-slider .btn.btn-next:before { background-image: url('../images/ar1.svg'); } .portfolio-image-slider .slide img { width: 100% !important; height: 100%; } /* Alternative Version */ .portfolio-grid.version-alternative:not(.hover-disabled) .portfolio-item .image .overlay .links { display: flex; flex-direction: column; justify-content: center; } .portfolio-grid.version-alternative .portfolio-item .caption .title, .portfolio-grid.version-alternative .portfolio-item .caption .title span { text-transform: none; letter-spacing: 0 } .portfolio-grid.version-alternative.background-style-transparent:not(.columns-1):not(.list-style) .portfolio-item .wrap > .caption { padding-left: 0; padding-right: 0; } .portfolio-grid.version-alternative:is(.hover-default, .hover-zooming-blur, .hover-vertical-sliding) .portfolio-item .image .set, .portfolio-grid.version-alternative.caption-position-page .portfolio-item .image .set, .portfolio-grid.version-alternative.hover-horizontal-sliding .portfolio-item .image .date { position: absolute; left: 0; top: 0; z-index: 3; color: var(--thegem-to-icons-portfolio-gallery-color-hover); background: #000000; max-width: calc(100% - 30px); white-space: normal; text-overflow: clip; overflow: auto; font-size: 75%; line-height: 1.5; padding: 0 8px; text-align: left; -webkit-transition: transform 0.3s; transition: transform 0.3s; } .portfolio-grid.version-alternative.caption-position-hover:is(.hover-default, .hover-zooming-blur, .hover-vertical-sliding) .portfolio-item .image .set, .portfolio-grid.version-alternative.caption-position-page .portfolio-item .image .set, .portfolio-grid.version-alternative.caption-position-hover.hover-horizontal-sliding .portfolio-item .image .date { background-color: rgba(0, 0, 0, 0.7); } .portfolio-grid.version-alternative .portfolio-item .image .set a { color: inherit; } .portfolio-grid.version-alternative:is(.hover-default, .hover-horizontal-sliding) .portfolio-item .image .overlay .links .caption .info { padding: 0; margin: 0 0 6px 0; } .portfolio-grid.version-alternative .portfolio-item .image .overlay .links .caption .title { margin-bottom: 10px; } .portfolio-grid.version-alternative .portfolio-item .image .set a:hover { text-decoration: underline; } .portfolio-grid.version-alternative .portfolio-item .wrap > .caption { display: flex; flex-direction: column; padding: 18px 38px; text-align: left; } .portfolio-grid.version-alternative.background-style-transparent .portfolio-item .wrap > .caption { padding-left: 0; padding-right: 0; } .portfolio-grid.version-alternative .portfolio-item .wrap > .caption > div { margin-bottom: 10px; } .portfolio-grid.version-alternative .portfolio-item .wrap > .caption > div.subtitle { margin-bottom: 13px; } .portfolio-grid.version-alternative .portfolio-item .wrap > .caption > div:last-child { margin-bottom: 0; } .portfolio-grid.version-alternative .portfolio-item .wrap > .caption .info { font-size: 75%; margin-top: 0; line-height: 1.5; } .portfolio-grid.version-alternative .image .portfolio-likes { height: auto !important; margin: 0 0 10px 0; text-align: left; } .portfolio-grid.version-alternative.caption-position-page .portfolio-item .wrap > .caption .title { color: var(--thegem-to-h4-color, #3c3950); margin-bottom: 6px; transition: all 0.3s; } .portfolio-grid.background-style-dark.caption-position-page .portfolio-item:not(:hover, .hover-effect) .wrap > .caption .title, .portfolio-grid.background-style-gray.caption-position-page .portfolio-item:is(:hover, .hover-effect) .wrap > .caption .title { color: var(--thegem-to-main-bg-color); } .portfolio-grid.background-style-dark.caption-position-page.list-style .portfolio-item .details .details-item, .portfolio-grid.background-style-dark.caption-position-page.list-style .portfolio-item .details .details-item .label, .portfolio-grid.background-style-dark.caption-position-page .portfolio-item:not(:hover, .hover-effect) .details .details-item, .portfolio-grid.background-style-dark.caption-position-page .portfolio-item:not(:hover, .hover-effect) .details .details-item .label, .portfolio-grid.background-style-gray.caption-position-page:not(.list-style) .portfolio-item:is(:hover, .hover-effect) .details .details-item, .portfolio-grid.background-style-gray.caption-position-page:not(.list-style) .portfolio-item:is(:hover, .hover-effect) .details .details-item .label { color: var(--thegem-to-portfolio-date-color); } .portfolio-grid.background-style-dark.caption-position-page.list-style .portfolio-item .details .details-item, .portfolio-grid.background-style-dark.caption-position-page .portfolio-item:not(:hover, .hover-effect) .details .details-item, .portfolio-grid.background-style-gray.caption-position-page:not(.list-style) .portfolio-item:is(:hover, .hover-effect) .details .details-item { border-color: var(--thegem-to-body-color); } .portfolio-grid.version-alternative.caption-position-page:not(.disabled-hover).background-style-transparent .portfolio-item:is(:hover, .hover-effect) .wrap > .caption .title { color: var(--thegem-to-link-color, #00bcd4); } .portfolio-grid.version-alternative.caption-position-page .portfolio-item .wrap > .caption .info { margin: 0 0 10px 0; } .portfolio-grid.version-alternative.caption-position-page .portfolio-likes { height: auto !important; opacity: 1; margin: auto 0 0 0 !important; text-align: left; } .portfolio-grid.version-alternative:is(.caption-position-hover, .caption-position-image) .portfolio-item .image .portfolio-likes { color: var(--thegem-to-icons-portfolio-gallery-color-hover); } .portfolio-grid.version-alternative .portfolio-likes .zilla-likes { font-size: 87.5%; color: inherit; } .portfolio-grid.version-alternative .portfolio-likes .zilla-likes i { font-style: normal; margin-right: 4px; font-size: 14px; } .portfolio-grid.version-alternative.caption-position-page .portfolio-likes .zilla-likes i { color: #f44336; } .portfolio-grid.version-alternative .portfolio-likes .zilla-likes i.default:before { content: '\e66b'; font-size: inherit; vertical-align: middle; } .portfolio-grid.version-alternative:is(.hover-horizontal-sliding, .hover-vertical-sliding) .overlay .links { padding: 30px; } .portfolio-grid:is(.version-alternative, .version-new):is(.caption-position-hover, .caption-position-image) .overlay .links .caption .description:not(:last-child) .subtitle, .portfolio-grid:is(.version-alternative, .version-new):is(.caption-position-hover, .caption-position-image) .overlay .links .caption .description .subtitle:not(:last-child), .portfolio-grid:is(.version-alternative, .version-new):is(.caption-position-hover, .caption-position-image) .overlay .links .caption .details:not(:last-child) { margin-bottom: 10px; } .portfolio-grid.version-alternative:not(.ready) .slide-content-hidden { display: none; } .portfolio-grid.version-alternative .portfolio-item .slide-content-hidden { transition: all 0.3s; } .portfolio-grid.version-alternative.caption-position-page.hover-horizontal-sliding .portfolio-sharing-pane, .portfolio-grid.version-alternative.caption-position-page.hover-vertical-sliding .portfolio-sharing-pane { text-align: center; } .portfolio-item .details .details-item { display: flex; align-items: center; } .portfolio-item .details .details-item .label { display: flex; align-items: center; height: 100%; color: inherit; margin: 0 0.6em 0 0; transition: all 0.3s; } .portfolio-item .details .details-item .label i, .portfolio-item .details .details-item .value i { font-size: inherit; } .portfolio-item .details .details-item .label i:not(:last-child), .portfolio-item .details .details-item .label svg:not(:last-child), .portfolio-item .details .details-item .value i:not(:last-child), .portfolio-item .details .details-item .value svg:not(:last-child) { margin-right: 6px; } .portfolio-item .details .details-item .value { display: flex; align-items: center; height: 100%; color: inherit; margin: 0; } .portfolio.caption-position-image .portfolio-item .details:not(:last-child) { margin-bottom: 6px; } .portfolio.caption-position-page .portfolio-item .details.layout-vertical .details-item .value { color: var(--thegem-to-portfolio-date-color); } .portfolio-item .details.layout-inline { display: flex; flex-wrap: wrap; column-gap: 14px; row-gap: 2px; } .portfolio-item .details.layout-inline.with-separator { column-gap: 6px; } .portfolio-item .details.layout-inline.style-labels { row-gap: 10px; } .portfolio-item .details.layout-inline.style-labels .details-item { border: 1px solid currentColor; padding: 0 0.4em; } .portfolio-item .details.layout-vertical .details-item { padding: 5px 0; } .portfolio-item .details.layout-vertical.with-divider .details-item:not(:first-child) { padding-top: 10px; } .portfolio-item .details.layout-vertical.with-divider .details-item:not(:last-child) { padding-bottom: 10px; border-bottom: 1px solid var(--thegem-to-divider-color); transition: all 0.3s; } .portfolio.version-new:is(.caption-position-hover, .caption-position-image):is(.hover-new-default, .hover-new-zooming-blur, .hover-new-gradient, .hover-new-zoom-overlay) .details, .portfolio.version-alternative:is(.caption-position-hover, .caption-position-image):is(.hover-default, .hover-zooming-blur, .hover-gradient, .hover-zoom-overlay) .details, .portfolio:not(.version-alternative, .version-new).caption-position-hover:is(.hover-default, .hover-zooming-blur, .hover-default-zooming-blur, .hover-zoom-overlay) .details { justify-content: center; } .portfolio-item .details .separator:last-child { display: none; } .portfolio:not(.version-alternative) .details { margin-top: 8px; } .portfolio:not(.version-alternative) .details.top-position { margin: 0 0 6px 0; } .portfolio:not(.version-alternative, .version-new).caption-position-page .details.layout-inline { justify-content: center; } .portfolio-item .details.layout-vertical.details-alignment-left .details-item { justify-content: flex-start; text-align: left; } .portfolio-item .details.layout-vertical.details-alignment-right .details-item { justify-content: flex-end; text-align: right; } .portfolio-item .details.layout-vertical.details-alignment-justify .details-item { justify-content: space-between; } .portfolio-item .details.layout-vertical.details-alignment-justify .details-item .label { text-align: left; } .portfolio-item .details.layout-vertical.details-alignment-justify .details-item .value { text-align: right; } .portfolio-item .details.layout-inline.details-alignment-left { justify-content: flex-start !important; } .portfolio-item .details.layout-inline.details-alignment-right { justify-content: flex-end !important; } .portfolio-item .details.layout-inline.details-alignment-center { justify-content: center !important; } a.additional-meta { cursor: pointer; } .portfolio-item .caption .read-more-button { margin-top: 10px; } .portfolio-item .caption .gem-button { margin: 0; display: flex; align-items: center; justify-content: center; } @media (min-width: 1001px) { .portfolio-top-panel.filters-top-sticky { padding: 10px 0; } .portfolio-top-panel.filters-top-sticky.filter-type-extended { padding: 13px 0; margin-bottom: 7px; } } .portfolio-top-panel.sticky-fixed .portfolio-top-panel { background-color: var(--thegem-to-main-bg-color, #FFFFFF); } body.shown-sticky-filters #site-header.fixed, body.shown-sticky-filters .header-sticky-template { transition: all .6s cubic-bezier(.19,1,.22,1); transform: translateY(-100%) !important; } body.hidden-sticky-filters #site-header.fixed, body.hidden-sticky-filters .header-sticky-template { transition: all .6s cubic-bezier(.19,1,.22,1); transform: none; } .portfolio-selected-filters { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: flex-end; -ms-flex-align: flex-end; align-items: flex-end; clear: both; z-index: 4; } .portfolio-selected-filters .portfolio-selected-filter-item { margin: 10px 10px 0 0; padding: 2px 10px 3px 10px; line-height: 1.1; border-radius: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; cursor: default; transition: all 0.3s; } .portfolio-selected-filters .portfolio-selected-filter-item.clear-filters { cursor: pointer; margin-top: 15px; order: 1; } .portfolio-selected-filters .portfolio-selected-filter-item.clear-filters:last-child { display: none; } .portfolio-selected-filters .portfolio-selected-filter-item.category { order: 2; } .portfolio-selected-filters .portfolio-selected-filter-item.attribute.product-tag { order: 3; } .portfolio-selected-filters .portfolio-selected-filter-item.attribute { order: 4; } .portfolio-selected-filters .portfolio-selected-filter-item.price { order: 5; } .portfolio-selected-filters .portfolio-selected-filter-item.status { order: 6; } .portfolio-selected-filters .portfolio-selected-filter-item.search { order: 7; } .portfolio-selected-filters .portfolio-selected-filter-item i.delete-filter { font-style: normal; font-family: "thegem-icons"; font-weight: normal; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-variant: normal; text-rendering: auto; font-size: 1.1em; line-height: 1; margin-right: -3px; cursor: pointer; } .portfolio-selected-filters .portfolio-selected-filter-item i.delete-filter:before { content: "\e619"; } .portfolio-selected-filters.portfolio-selected-filters-clone { display: none; } .portfolio-top-panel.selected-only { margin-bottom: 0 !important; } .portfolio-top-panel.selected-only .portfolio-selected-filters .portfolio-selected-filter-item { margin: 0 10px 20px 0; } @media (min-width: 992px) { .portfolio-top-panel.sidebar-filter.selected-only .portfolio-selected-filters .portfolio-selected-filter-item { margin-bottom: 20px; } } .portfolio-top-panel > .portfolio-selected-filters.center { justify-content: center; } .portfolio-top-panel > .portfolio-selected-filters.center .portfolio-selected-filter-item { margin: 10px 5px 0 5px; } .portfolio-top-panel > .portfolio-selected-filters.right { justify-content: flex-end; } .portfolio-top-panel > .portfolio-selected-filters.right .portfolio-selected-filter-item { margin: 10px 0 0 10px; } .portfolio-top-panel .portfolio-top-panel-row { display: flex; align-items: flex-start; } .portfolio-top-panel .portfolio-top-panel-left { flex: auto; max-width: 100%; } .portfolio-top-panel .portfolio-top-panel-right { margin-left: 10px; }