/*
Theme Name: Pirotta
Theme URI: http://www.pirottaservices.com/
Author: CodeFavorite
Version: 0.9.0

Resource Licenses:
Font Awesome: http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
Bootstrap: http://getbootstrap.com | https://github.com/twbs/bootstrap/blob/master/LICENSE (Code licensed under MIT, documentation under CC BY 3.0.)
and of course
jQuery: https://jquery.org | (Code licensed under MIT)
WP Bootstrap Navwalker by Edward McIntyre: https://github.com/twittem/wp-bootstrap-navwalker | GNU GPL
*/

/*
This file is just used to identify the theme in WordPress.
The compiled CSS output can be found in /css/theme.css
The SASS sources for it can be found in /sass/
The dependencies can be found in /src/ after running "gulp copy-assets" terminal command

...and now go out and play!
*/
.custom-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	width: 100%;
}

.grid-item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.grid-item img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    display: block;
}

.overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 20px;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.93), transparent);
	color: #fff;
	transition: 0.4s ease;
}

/* Hide paragraph initially */
.overlay p {
	opacity: 0;
	max-height: 0;
	transition: 0.6s ease-in-out;
}

/* Show paragraph on hover */
.grid-item:hover .overlay p {
    opacity: 1;
    max-height: 200px;
}

/* Optional smooth lift effect */
.grid-item {
    transition: 0.3s ease;
}
.overlay h3, .overlay p {
  color: #fff;
}
.overlay h3 {
  font-size: 25px;
}
.row.top-content {
  margin-bottom: 30px;
}
.row.top-content h3 {
  font-family: "Segoe Pro Light";
  text-transform: uppercase;
  font-size: 2.45em;
  line-height: 1.3;
}
.row.top-content .col-md-6 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}