/* Project CSS */

.projects_options_wrapper{
margin:30px 0px 40px 0px;
}

.projects_option_col{
width:50%;
position: relative;
padding:0px 0px 30px 0px;
}

.projects_option_col:nth-child(odd){
padding:0px 15px 30px 0px;
}

.projects_option_col:nth-child(even){
padding:0px 0px 30px 15px;
}

.project_hero{
  height:285px;
  width: 100%;
  background-image:
    linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,0.0)),
    var(--hero-bg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 110%;
  transition: background-size .5s ease;
}

.project_hero:hover{
background-size: 120%;
}

.project_option_content {
display: flex;
flex-direction: column;
align-items: left;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
transition: background-color 0.3s ease;
transition: padding 0.6s ease;
padding:50px 15px 50px 50px;
}

.project_option_content:hover {
padding:50px 0px 50px 65px;
}

.project_option_content h2{
font-family: Montserrat;
font-size: 24px;
font-weight: normal;
color: white;
text-transform: uppercase;
margin:0;
}

.project_option_content button{
margin:20px 0px 0px 0px;
}

/* END PROJECT CSS */

/* project choice */

.project_choice{
margin-top:30px;
margin-bottom: 30px;
}

.project_choice_col{
background-color: black;
padding:15px 20px;
text-align: center;
transition: background-color 0.3s ease;
}

.project_choice_col:hover{
background-color: #28a9e1;
cursor: pointer;
}

.project_choice_col.active {
  background-color: #28a9e1;
}

.project_choice_col.active:hover{
background-color: #28a9e1;
}

.project_choice_col a{
display:block;
text-decoration:none;
}

.project_choice p{
color: white;
font-size: 15px;
}

/* end gallery choice */

/* Gallery Detail CSS */

.gallery-detail-page,
.gallery-detail-page *,
.gallery-detail-page *::before,
.gallery-detail-page *::after{
box-sizing:border-box;
}

.gallery-detail-page .breadcrumbs{
margin-bottom:0;
}

.gallery-container {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto 30px auto;
  padding: 0 30px 30px 30px;
  background-color: #ffffff;
}

.gallery-display{
  width: min(100%, 667px);
  margin: 0 auto;
}

.gallery-main-frame {
  width: 100%;
  height: clamp(260px, 68vw, 500px);
  max-height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  overflow: hidden;
}

.gallery-slide{
  display:none;
  width:100%;
  height:100%;
  margin:0;
  align-items:center;
  justify-content:center;
}

.gallery-slide.is-active{
  display:flex;
}

.gallery-slide img{
  max-width: 667px;
  max-height: 500px;
  width: auto;
  height: auto;
  object-fit: contain;
  display:block;
}

.gallery-controls{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  margin-top: 10px;
}

.gallery-arrow{
  min-height: 38px;
  border: none;
  background-color: #28a9e1;
  color: #000000;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 27px;
  line-height:1;
  cursor:pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.gallery-arrow:hover{
  background-color:#000000;
  color:#28a9e1;
}

.gallery-arrow:focus{
  outline:none;
}

.gallery-arrow:focus-visible{
  outline:2px solid #ffffff;
  outline-offset:2px;
}

.gallery-thumbs-shell{
  width:100%;
  margin-top: 10px;
}

.gallery-thumbs-track{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  width:100%;
}

.gallery-thumb{
  width: 100%;
  aspect-ratio: 1.1 / 1;
  padding:0;
  border: 2px solid transparent;
  background-color:#ffffff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:border-color 0.2s ease;
}

.gallery-thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.gallery-thumb.is-active{
  border-color:#28a9e1;
}

.gallery-thumb:focus{
  outline:none;
}

.gallery-thumb:focus-visible{
  outline:2px solid #ffffff;
  outline-offset:2px;
}

.gallery-empty {
  width: min(100%, 667px);
  height: clamp(260px, 68vw, 500px);
  max-height: 500px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align:center;
  padding: 20px;
  background-color: #ffffff;
  color:#000000;
}

.gallery-staff-link{
  margin-top:20px;
  text-align:center;
}

.gallery-staff-link a{
  color:#000000;
}

.gallery-single-image .gallery-controls{
  display:none;
}

.gallery-single-image .gallery-thumbs-shell{
  display:none;
}


/* END NEW GALLERY CSS */

@media only screen and (max-width: 1400px) {
}

@media only screen and (max-width: 1200px) {

}

@media only screen and (max-width: 992px) {
.projects_option_col{
width:100%;
position: relative;
padding:0px 0px 30px 0px;
}

.projects_option_col:nth-child(odd){
padding:0px 0px 30px 0px;
}

.projects_option_col:nth-child(even){
padding:0px 0px 30px 0px;
}
.project_hero{
height:225px;
}
}

@media only screen and (max-width: 768px) {
.project_option_content {
padding:50px 15px 30px 40px;
}
}

@media only screen and (max-width: 576px) {
.project_choice .row{
  margin-left: 0;
  margin-right: 0;
  }
.project_choice{
  padding-left: 15px;
  padding-right: 15px;
}
.projects_options_wrapper{
  padding-left: 15px;
  padding-right: 15px;
}
.project_hero{
height:220px;
}
.project_option_content {
padding:50px 15px 30px 25px;
}
.gallery-container { 
padding:0 15px 30px 15px;
}
.gallery-thumbs-track{
gap:12px;
}
}