.press__items {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: masonry;
display: none;
max-width: 916px;
margin: 0 auto;
}
.press__item {
display: block;
float: left;
width: 33%; padding: 10px;
padding: calc(var(--clamp-scale-2) * 25);
height: 400px;
height: calc(var(--clamp-scale-2) * 400);
position: relative;
transition: transform 1.5s, bos-shadow .5s;
overflow: hidden;
background: white;
text-decoration: none !important;
}
.hentry .press__item .wp-post-image,
.press__item img {
margin-bottom: 0;
}
.press__item:hover {
z-index: 10;
box-shadow: 8px 8px 15px rgba(0, 0, 0, 0.4);
transform: scale(1.10);
}
.press__desc {
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
padding: 15px 20px;
padding: calc(var(--clamp-scale-3) * 15) calc(var(--clamp-scale-3) * 20);
background: #b2b2b1;
text-align: center;
color: white;
bottom: -500px;
transition: bottom .4s;
transition-delay: 0.5;
z-index: 11;
}
.press__desc h2 {
color: white !important;
font-size: clamp(1rem, 0.9421052631578947rem + 0.16842105263157908vw, 1.1rem);
margin-bottom: 0 !important;
text-transform: uppercase !important;
}
.press__desc span {
display: block;
color: white !important;
font-size: 0.8rem;
}
.press__item:hover .press__desc {
bottom: 0px;
}
.press-loader {
display: inline-block;
height: 50px;
width: 100%;
display: flex;
justify-content: center;
}
.press-loader:after {
content: " ";
display: block;
width: 34px;
height: 34px;
margin: 8px;
border-radius: 50%;
border: 3px solid var(--color-5);
border-color: var(--color-5) transparent var(--color-5) transparent;
animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
} body.single-press .entry-taxonomy,
body.single-press .entry-header {
display: none;
}
body.single-press .press__single-gallery {
width: 100%;
max-width: 916px;
margin: 0 auto;
}
.press__items,
body.single-press .entry-content {
width: 100%;
}
body.single-press #main {
display: flex;
flex-direction: column;
flex-wrap: wrap;
text-align: center;
}
body.single-press h1:before {
display: none !important;
}
body.single-press h1.has-excerpt {
margin-bottom: 10px !important;
}
body.single-press .press__single_excerpt {
margin-bottom: clamp(2.2222222222222223rem, 0.6140350877192984rem + 4.678362573099415vw, 5rem);
}
.button--press-back {
width: auto !important;
margin-bottom: clamp(2.7777777777777777rem, 1.9736842105263155rem + 2.3391812865497084vw, 4.166666666666667rem);
display: block;
font-size: 0.85rem !important;
line-height: 1.4rem;
}
.button--press-back:hover {
transform: scale(1.05);
}
body.single-press .button--press-back::before {
transform: translateY(4px) !important;
width: 17px;
height: 17px;
}
body.single-press img {
width: 100%;
height: auto;
} .press__single-gallery {
width: 100%;
}
.press__single-gallery-item {
width: 100%;
transition: transform 1.6s;
}
.press__single-gallery-item:not(:last-child) {
margin-bottom: clamp(2.7777777777777777rem, 1.9736842105263155rem + 2.3391812865497084vw, 4.166666666666667rem);
}
.press__single-gallery-item:hover {
transform: scale(1.05);
}
@media screen and (max-width: 1024px) {
.press_items {
max-width: 600px;
width: 100%;
}
.press__item {
width: 50%;
}
}
@media screen and (max-width: 781px) {
.press__items {
max-width: calc(100% - clamp(2.2222222222222223rem, -0.4795321637426899rem + 7.859649122807018vw, 6.888888888888889rem));
margin: 0 auto;
}
body.single-press .entry-content>* {
padding-left: clamp(2.2222222222222223rem, -0.4795321637426899rem + 7.859649122807018vw, 6.888888888888889rem) !important;
padding-right: clamp(2.2222222222222223rem, -0.4795321637426899rem + 7.859649122807018vw, 6.888888888888889rem) !important;
}
}
@media screen and (max-width: 550px) {
.press_items {
max-width: 350px;
}
.press__item {
width: 100%;
}
}
@media (hover:none) {
.press__single-gallery-item:hover,
.press__item:hover {
box-shadow: unset;
transform: unset;
}
.press__desc {
position: relative;
left: unset;
bottom: unset;
background: transparent !important;
margin-top: 15px;
}
.press__desc h2,
.press__desc span {
color: var(--color-5) !important;
}
}