.mt-posts {
margin: 0 auto;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
-webkit-user-drag: none;
-moz-user-drag: none;
user-drag: none;
float: left;
width: 100%;
}
@media (min-width: 1023px) {
.entry-content > .wpb_row.portfolio-padding > .wrapper {
padding: 0 30px;
box-sizing: border-box;
}
.header-position-left .entry-content > .wpb_row.full-width.portfolio-padding > .wrapper {
padding-right: 3vw;
padding-left: 30px;
}
.header-position-right .entry-content > .wpb_row.full-width.portfolio-padding > .wrapper {
padding-left: 3vw;
padding-right: 30px;
}
} .mt-posts-loader {
position: absolute;
margin: 0 auto;
width: 26px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: opacity ease .1s, visibility ease .1s;
opacity: 0;
visibility: hidden;
top: 100px;
opacity: 1;
visibility: visible;
opacity: .6;
width: 40px;
}
.lazyloading + .mt-posts-loader {
opacity: 1;
visibility: visible;
opacity: 1;
}
.mt-posts-loader:before {
content: '';
display: block;
padding-top: 100%;
}
.lazyload-enabled > .mt-posts-loader {
display: none;
}
.mt-posts-loader__circular {
animation: mt-posts-loader-rotate 1s linear infinite;
height: 100%;
transform-origin: center center;
width: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
.mt-posts-loader__path {
stroke: var(--secondary-color);
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
animation: mt-posts-loader-rotate-dash 1.5s ease-in-out infinite;
stroke-linecap: round;
transition: stroke .1s;
stroke-width: 4;
}
@keyframes mt-posts-loader-rotate {
100% {
transform: rotate(360deg);
}
}
@keyframes mt-posts-loader-rotate-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -35px;
}
100% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -124px;
}
}
.mt-posts-wrapper {
margin: 0 auto;
padding: 0;
list-style: none;
}
.grid__item {
margin-bottom: var(--margin-bottom-sizer);
float: left;
position: relative;
}
.grid__item-wrapper-helper {
float: left;
width: 100%;
} .grid {
display: grid;
grid-column-gap: 20px;
}
.grid--col-2 {
grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 990px) {
.grid--col-1-desktop {
grid-template-columns: repeat(1, 1fr);
}
.grid--col-2-desktop {
grid-template-columns: repeat(2, 1fr);
}
.grid--col-3-desktop {
grid-template-columns: repeat(3, 1fr);
}
.grid--col-4-desktop {
grid-template-columns: repeat(4, 1fr);
}
}
@media screen and (min-width: 750px) and (max-width: 989px) {
.grid--col-3-tablet {
grid-template-columns: repeat(3, 1fr);
}
}
.grid--margins-small {
grid-column-gap: 10px;
}
.grid--margins-tiny {
grid-column-gap: 1px;
}
.grid--margins-none {
grid-column-gap: 0;
} .grid--layout-masonry {
visibility: hidden;
}
.masonry-grid-sizer {
display: block;
height: 0;
}
.masonry-grid-gutter-sizer {
width: var(--gutter-sizer);
display: block;
height: 0;
position: absolute;
}
.masonry-grid--col-2 .masonry-grid-sizer,
.masonry-grid--col-2 .masonry-grid__item {
width: calc((100% - var(--gutter-sizer)) / 2 );
}
@media screen and (min-width: 750px) and (max-width: 989px) {
.masonry-grid--col-3-tablet .masonry-grid-sizer,
.masonry-grid--col-3-tablet .masonry-grid__item {
width: calc((100% - var(--gutter-sizer) * 2) / 3 );
}
}
@media screen and (min-width: 990px) {
.masonry-grid--col-2-desktop .masonry-grid-sizer,
.masonry-grid--col-2-desktop .masonry-grid__item {
width: calc((100% - var(--gutter-sizer)) / 2 );
}
.masonry-grid--col-3-desktop .masonry-grid-sizer,
.masonry-grid--col-3-desktop .masonry-grid__item {
width: calc((100% - var(--gutter-sizer) * 2) / 3 );
}
.masonry-grid--col-4-desktop .masonry-grid-sizer,
.masonry-grid--col-4-desktop .masonry-grid__item {
width: calc((100% - var(--gutter-sizer) * 3) / 4 );
}
} .grid--layout-cellsbyrow {
display: grid;
}
.grid--layout-cellsbyrow .grid__item {
margin-bottom: 0;
display: inline-flex;
width: auto;
}
.grid--layout-cellsbyrow .grid__item-helper {
padding: 15%;
box-sizing: border-box;
height: 100%;
width: 100%;
display: inline-flex;
align-items: center;
justify-content: center;
} .grid--layout-justified  {
display: flex;
flex-wrap: wrap;
}
.grid--layout-justified .grid__item,
.grid--layout-justified:after {
--ratio: calc(var(--w) / var(--h));
--row-height: 38.8vh;
--row-width: 20vw;
flex-basis: calc(var(--ratio) * var(--row-width));
}
.grid--layout-justified .grid__item {
flex-grow: calc(var(--ratio) * 100);
width: 100% !important;
}
.grid--layout-justified:after {
--w: 2;
--h: 1;
content: "";
flex-grow: 1000000;
}
.grid--layout-justified .grid--title-hidden .grid__item {
margin-bottom: 30px;
}
.grid--layout-justified .grid__item .card {
overflow: hidden;
} .card {
font-style: normal;
text-decoration: none;
display: block;
position: relative;
float: left;
width: 100%;
}
.card__content {
display: flex;
color: var(--primary-color);
margin: 1.15rem 0;
}
.card__content-wrapper {
max-width: 75%;
display: flex;
flex-direction: column;
gap: 0.575rem;
} .card__title {
margin: 0;
color: var(--title-color);
line-height: 1.65;
padding: 0.1rem 0;
}
.card__meta {
display: inline-block;
} .card__more-link {
display: inline-block;
} .card__title__underline_on_hover {
position: relative;
display: inline-block;
}
.card__title__underline_on_hover:after {
content: '';
position: absolute;
width: 100%;
height: 1px;
background: var(--title-color);
transform: scaleX(0);
transform-origin: bottom right;
transition: transform 0.1s ease, opacity 0.1s ease, background 0.1s ease;
display: block;
opacity: 1;
left: 0;
}
.card:hover .card__title__underline_on_hover:after {
transform-origin: bottom left;
transform: scaleX(1);
} .card__content--title-hidden {
position: absolute;
top: 0;
left: 0;
color: #fff;
height: 100%;
width: 100%;
overflow: hidden;
z-index: 4;
display: flex;
margin: 0;
}
.card__content-wrapper--title-hidden {
z-index: 2;
padding: 5% 4%;
opacity: 0;
visibility: hidden;
transition: opacity ease 0.1s, visibility ease 0.1s;
box-sizing: border-box;
}
.card:hover .card__content-wrapper--title-hidden {
visibility: visible;
opacity: 1;
} .card__content-justify-center {
justify-content: center;
text-align: center;
} .card__content-position-center {
align-items: center;
justify-content: center;
text-align: center;
} .card__attachment {
display: block;
max-width: 100%;
width: 100%;
float: left;
position: absolute;
height: 100%;
z-index: 2;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: auto;
margin: 0 auto;
transform: scale(1.01);
}
.card__image {
position: relative;
overflow: hidden;
display: block;
background: var(--third-color);
} .card__overlay {
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,.8);
visibility: hidden;
opacity: 0;
display: block;
top: 0;
left: 0;
z-index: 3;
transition: opacity ease .1s, visibility ease .1s;
transform: scale(1.1);
}
.card:hover .card__overlay {
visibility: visible;
opacity: 1;
} .card:hover .card__title {
color: var(--title-color-on-hover);
}
.card:hover .card__title:after {
background: var(--title-color-on-hover);
} .card__attachment--hover-scale-effect {
transition: opacity .1s, transform 0.25s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.card--hover-scale-effect:hover .card__attachment--hover-scale-effect {
transform: scale(1.05);
} .card__attachment--hover-scale-effect2 {
transition: opacity .1s, transform 0.25s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.card__image--hover-scale-effect2 {
transition: background 0.25s, transform 0.3s ease;
position: relative;
}
.card--hover-scale-effect2:hover .card__image--hover-scale-effect2 {
transform: scale(0.99);
}
.card--hover-scale-effect2:hover .card__attachment--hover-scale-effect2 {
transform: scale(1.05);
} .card__image--hover-scale-effect3 {
transition: background 0.25s, transform 0.3s ease;
}
.card--hover-scale-effect3:hover .card__image--hover-scale-effect3 {
transform: scale(1.01);
} .meta-data-animation-fadein {
opacity: 0;
visibility: hidden;
transition: all cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s;
}
.card:hover .meta-data-animation-fadein {
visibility: visible;
opacity: 1;
transition-delay: var(--delay);
} .meta-data-animation-fadeinup {
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: all cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s;
}
.card:hover .meta-data-animation-fadeinup {
visibility: visible;
opacity: 1;
transform: translateY(0);
transition-delay: var(--delay);
} .meta-data-animation-fadeinflip {
opacity: 0;
visibility: hidden;
transform: scaleY(0);
transition: all cubic-bezier(0.215, 0.61, 0.355, 1) .1s;
}
.card:hover .meta-data-animation-fadeinflip {
visibility: visible;
opacity: 1;
transform: scaleY(1);
transition-delay: var(--delay);
} .card__posts-attachment {
position: absolute;
top: 0;
left: 0;
opacity: 0;
transition: opacity ease .1s, transform 0.45s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.card--second-image:hover .card__attachment {
opacity: 0;
}
.card--second-image:hover .card__posts-attachment {
opacity: 1;
} .infinite-scroll-enabled .nav-pagination,
.infinite-scroll-enabled-with-button .nav-pagination {
display: none;
}
.load-more-wrapper {
text-align: center;
position: relative;
min-height: 45px;
}
.load-more {
cursor: pointer;
margin: 0;
color: var(--buttons-text-color);
font-size: 10px;
text-align: center;
background: var(--buttons-background-color);
border: none;
overflow: hidden;
position: relative;
padding: 17px 24px;
min-width: 166px;
letter-spacing: 2px;
line-height: 0;
height: 45px;
font-weight: inherit;
text-transform: uppercase;
box-shadow: none;
transition: all .1s ease;
display: inline-flex;
align-items: center;
justify-content: center;
}
.load-more:hover {
color: var(--buttons-text-color-hover);
opacity: 1;
background: var(--buttons-background-color-hover);
}
.buttons-style-outline .load-more {
border: 1px solid var(--buttons-background-color);
background: 0;
}
.buttons-style-outline .load-more:hover {
background: var(--buttons-background-color-hover);
border-color: var(--buttons-background-color-hover);
}
.load-more:disabled {
pointer-events: none;
opacity: 0;
transform: scale(.85);
}
.load-more-loader-wrapper {
width: 32px;
margin: 0 auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(.85);
opacity: 0;
transition: all ease .1s;
}
.load-more-loader-wrapper.request {
transform: translate(-50%, -50%) scale(1);
opacity: 1;
}
.load-more-loader-wrapper:before {
content: '';
display: block;
padding-top: 100%;
}
.load-more-loader-wrapper__circular {
animation: load-more-loader-wrapper-rotate 1s linear infinite;
height: 100%;
transform-origin: center center;
width: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
.load-more-loader-wrapper__path {
stroke: var(--secondary-color);
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
animation: load-more-loader-wrapper-dash 1.5s ease-in-out infinite;
stroke-linecap: round;
transition: stroke .1s;
stroke-width: 4;
}
@keyframes load-more-loader-wrapper-rotate {
100% {
transform: rotate(360deg);
}
}
@keyframes load-more-loader-wrapper-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -35px;
}
100% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -124px;
}
}
@media (max-width: 768px) {
.full-width .grid--layout-justified {
margin-left: 0;
margin-right: 0;
}
.grid--layout-justified {
max-width: 370px;
margin: 0 auto;
display: block;
}
.grid--layout-justified .grid__item {
padding: 0;
}
}