/*
Theme Name: OceanWP Child Theme
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme. Sample child theme.
Author: OceanWP
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */

#main .page-header-inner .page-header-title { line-height: 1.2; }
.content-container { padding-top: 34px; padding-bottom: 34px; font-size: 16px; line-height: 1.5; color: #212121; }
.posts { display: grid; gap: 2rem; grid-template-columns: 1fr; }
.posts .post-img { margin-bottom: 8px; overflow: hidden; }
.posts .post-img a { position: relative; display: block; padding-top: 75%; transition: transform 0.3s; }
.posts .post-img a:hover { transform: scale(1.08); }
.posts .post-img a:after { content: ''; position: absolute; z-index: 1; width: 300%; height: 0%; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-45deg); background-color: rgb(255 255 255 / .2); }
.posts .post-img a:hover:after { height: 250%; transition: all 600ms linear; background-color: transparent; }
.posts .post-img a > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.posts .post-title { margin: 0; font-size: 18px; line-height: 1.2; }

.photo-gallery { display: grid; gap: 1rem; }
.photo-gallery-item { display: block; aspect-ratio: 4 / 3; overflow: hidden; }
.photo-gallery-item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.photo-gallery-item:hover img { transform: scale(1.03); }
body .glightbox-clean .gslide-desc { font-size: 16px; }

/* RESPONSIVE CSS
-------------------------------------------------- */
@media (max-width: 575.98px) {
}

@media (min-width: 576px) {
    .posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .photo-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
}

@media (min-width: 768px) {
    .posts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .photo-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 991.98px) {
}

@media (min-width: 992px) {
    .posts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .photo-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1199.98px) {
    
}

@media (min-width: 1200px) {
}

@media (min-width: 1400px) {
}