/* Callouts */
.i-callouts [class^=col] { padding: 0; }
.callout-wrap { position: relative; font-family: var(--siteFont2), sans-serif; text-align: center; }
.callout-wrap > .callout-title { opacity: 1; visibility: visible; width: 80%; padding: 0.625rem; position: absolute; top: 50%; left: 50%; z-index: 2; transform: translate(-50%, -50%); background: hsla(var(--siteColor1), 0.85); transition: all 0.25s; transition-delay: 0.35s; }
.callout-wrap .callout-title { font-size: 1.5rem; text-transform: capitalize; font-weight: 600; letter-spacing: 0.0625rem; line-height: 1.35; }
.callout-img { position: relative; padding-bottom: 100%; }
.callout-img > img { opacity: 1; width: 100%; height: 100%; position: absolute; top: 0; left: 0; object-fit: cover; }
.callout-rollover-wrap { opacity: 0; visibility: hidden; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: all 0.25s; transition-delay: 0.35s; }
.callout-wrap:hover > .callout-title { opacity: 0; visibility: hidden; transition: all 0.25s; transition-delay: 0s; }
.callout-wrap:hover .callout-rollover-wrap { opacity: 1; visibility: visible; width: 100%; height: 100%; position: absolute; top: 0; left: 0; /* background: rgba(11,42,49,0.75); */ background: hsla(var(--siteColor1), 0.6); transition: all 0.25s; transition-delay: 0s; }
.callout-rollover { opacity: 0; visibility: hidden; width: 80%; position: absolute; top: 0; left: 50%; z-index: 2; transform: translate(-50%, 0); transition: all 0.25s; transition-delay: 0.25s; }
.callout-wrap:hover .callout-rollover { opacity: 1; visibility: visible; top: 50%; transform: translate(-50%, -50%); transition: all 0.25s; transition-delay: 0.15s; }
.callout-rollover .callout-desc { margin: 0.625rem 0 1.875rem; font-size: 0.9375rem; line-height: 1.75; }
.callout-rollover .btn { padding: 0.75rem 1.25rem; border: 0.125rem solid hsl(var(--white)); font-size: 1.125rem; color: hsl(var(--white)); }
.i-sidebar .i-callouts { padding: 0.625rem 0; }
.i-sidebar .i-callouts [class^=col] { flex-basis: 100%; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; width: 100%; max-width: 100%; padding: 0; margin: 0 0 0.625rem; }
.i-sidebar .i-callouts [class^=col]:last-child { margin-bottom: 0; }
.i-sidebar .callout-rollover .callout-title { display: none; }

@media(max-width:1500px) {
  .i-callouts .row { justify-content: center; }
  .i-callouts [class^=col] { flex-basis: 33.33333%; flex-grow: 0; }
  .i-sidebar .i-callouts [class^=col] { flex-basis: 100%; }
  .i-sidebar .callout-img { padding-bottom: 100% !important; }
}
@media(max-width:1024px){
  .i-callouts [class^=col] { flex-basis: 50%; }
  .i-callouts [class^=col]:nth-child(3){ flex-basis: 100%; }
  .callout-img { padding-bottom: 80% !important; }
  .i-callouts [class^=col]:nth-child(3) .callout-img{ padding-bottom: 40% !important; }
}
@media(max-width:992px){
  .i-sidebar { margin: 1.25rem -0.9375rem; padding-top: 0.9375rem; }
  .i-sidebar .i-callouts [class^=col] { flex-basis: 50%; margin: 0;  }
  .i-sidebar .i-callouts [class^=col]:nth-child(3){ flex-basis: 100%; }
  .i-sidebar .callout-img { padding-bottom: 80% !important; }
  .i-sidebar .i-callouts [class^=col]:nth-child(3) .callout-img{ padding-bottom: 40% !important; }
  .callout-wrap .callout-title { font-size: 1.25rem; }
}
@media(max-width:736px){
  .i-callouts [class^=col], .i-sidebar .i-callouts [class^=col] { flex-basis: 100% !important; margin-bottom: 0.625rem; }
  .callout-img, .i-sidebar .callout-img { height: 19.375rem; padding-bottom: 0 !important; }
}
@media(max-width:480px){
  .i-sidebar { margin: 0; }
}