@charset "UTF-8";
/***!  /media/templates/site/cassiopeia_clcu/css/user.css?cb2f8a  !***/

:root {
  --primary: #1857ad;

  --cassiopeia-color-primary: var(--primary);

  --color-primary: var(--primary);

  --primary-rgb: 10, 111, 56;

  --secondary: #525251;

  --color-secondary: var(--secondary);

  --cassiopeia-color-hover: #034f50;

  --cassiopeia-color-link: #0c7086;

  --template-text-dark: #444;

  --body-color: #444;

  --font-heading: Arial, Helvetica, sans-serif;

  --body-font-family: "Open Sans", sans-serif;

  --modal-width: 80%;

  --bg-header: #fff;

  --bg-footer: var(--secondary);
}

/* Main Container */

.table-primary {
  --table-bg: var(--primary);
}

body:not(.home) main {
  padding: 3rem;
}

.home main {
  margin: 0;

  padding: 0;
}

.modal-backdrop.fade.show {
  display: none;
}

.modal.fade.show {
  background-color: #0007;
}

header + .site-grid {
}

body:not(.home) .container-sidebar-left,
body:not(.home) .container-component {
  margin-block: 3rem;
  background-color: #fff;
}

body:not(.home) .container-component {
  border-radius: 0 4px 4px 0;
}

.container-sidebar-left .sidebar-left:first-child {
  margin-top: 2em;
}

.container-sidebar-left .sidebar-left:last-child {
  margin-bottom: 2em;
}

.border-primary {
  border-color: var(--color-primary) !important;
}

.container-header {
  background: var(--bg-header);
}

.container-banner {
  margin: 0;
}

body.home .random-image {
  max-height: 746px;

  overflow: hidden;
}

.random-image img {
  width: 100%;

  object-fit: cover;

  height: 100%;
}

.container-nav {
  background-color: var(--primary);
}

.btn {
  margin: 0;
}

.container-component > * + * {
  margin-top: 0;
}

/* Make the definition lists look like tables. 

   Add "table" class to <dl>

*/

dl.table {
  display: grid;

  grid-auto-columns: auto;

  grid-template-columns: 40% 60%;
}

dl.table > dt,
dl.table > dd {
  padding: 0.5rem;

  border-collapse: collapse;

  margin: 0;

  border: 0 solid;

  border-bottom-width: 1px;

  border-color: inherit;
}

dl.table > dt:nth-child(4n + 1),
dl.table > dd:nth-child(4n + 2) {
  background-color: var(--table-striped-bg);
}

/* Small menu triangles */

.metismenu.mod-menu .mm-toggler:after {
  color: #fff;

  border-left: 0.4em solid transparent;

  border-right: 0.4em solid transparent;

  border-top: 0.4em solid;
}

.footer {
  background: var(--bg-footer);
}

.table thead th {
  white-space: normal;
}

.rsfp-signature-footer .description {
  color: #fff;
}

.footer {
  margin-block-start: 0;
}

body.home .container-banner {
  position: relative;
}

body:not(.home) .site-grid {
  grid-gap: 0;
}

.container-component,
.container-footer {
  position: relative;
}

.container-sidebar-left {
  text-align: center;
  background-color: #fff;
  border-radius: 5px 0 0 5px;
  position: relative;
}

.awesomplete > input {
  width: 160px;
}

:has(+ h2, + .h2) {
  margin-block-end: 2.5rem;
}

:has(+ h3, + .h3) {
  margin-bottom: 1.5rem;
}

.topbar.sr-only,
.slide-dot-button span {
  color: #000;
  background-color: #fff;
}

@media (width <= 767.98px) {
  .container-header .container-nav nav {
    margin-top: 0.5rem;
  }
}

/* Carousel */

/**

  Container

*/

.carousel {
  position: relative;

  --carousel-height: 250px;
}

/**

    Controls - pause/play, previous, and next buttons

  */

/* All buttons */

.is-control {
  background: none;

  color: rgba(0, 0, 0, 0.7);

  border: 0;

  cursor: pointer;

  transition: all 0.2s linear;
}

.is-control:focus {
  outline: none;

  background-color: rgba(0, 0, 0, 0.8);

  color: rgba(255, 255, 255, 1);
}

/* Pause/play button */

.rotation-button {
  position: absolute;
  bottom: -7px;
  left: -3rem;
  padding: 10px 15px;
  z-index: 1;
  font-size: 20px;
  border-radius: 5px;
}

.rotation-button .pause-container,
.rotation-button .resume-container {
  display: none;
}

/* Previous slide button */

.previous-button {
  position: absolute;

  left: -3rem;

  top: calc(var(--carousel-height) / 2 - 40px);

  padding: 5px 15px;

  z-index: 1;

  font-size: 40px;

  border-top-right-radius: 10px;

  border-bottom-right-radius: 10px;

  border-left: 0;
}

/* Next slide button */

.next-button {
  position: absolute;

  right: -3rem;

  top: calc(var(--carousel-height) / 2 - 40px);

  padding: 5px 15px;

  z-index: 1;

  font-size: 40px;

  border-top-left-radius: 10px;

  border-bottom-left-radius: 10px;

  border-right: 0;
}

/**

    Slides

  */

.slides {
  z-index: 0;

  white-space: wrap;

  height: var(--carousel-height);

  overflow: hidden;

  display: flex;
}

.slides .slide {
  flex: 0 0 100%;

  position: relative;
}

.slides .slide[aria-hidden="true"] {
  visibility: hidden;
}

.slides .slide .background-image {
  width: 100%;

  height: 100%;

  object-fit: cover;
}

/**

    Slide 2 content

  */

.slides .slide .content {
  position: absolute;

  top: 20px;

  left: 15%;

  max-width: 400px;

  width: 50%;

  max-height: 70%;

  padding: 15px;

  white-space: normal;

  color: white;

  background-color: royalblue;

  box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.3);
}

.slides .slide .content h2 {
  margin: 0;

  font-size: 1.7rem;
}

.slides .slide .content p {
  margin: 10px 0 20px 0;
}

.slides .slide .content .cta-link {
  display: inline-block;

  padding: 5px 10px;

  background-color: white;

  color: rgba(0, 0, 0, 0.7);

  text-decoration: none;

  font-weight: 800;

  box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.3);
}

.slides .slide .content .cta-link:focus,
.slides .slide .content .cta-link:hover {
  text-decoration: underline;

  color: black;
}

.slides .slide .content .cta-link:focus {
  outline: 3px solid rgba(0, 0, 0, 1);
}

/**

    Slide dot navigation

  */

.navigation {
  position: absolute;

  bottom: 10px;

  width: 100%;

  text-align: center;

  list-style: none;

  margin: 0;

  padding: 0;
}

.navigation .slide-dot {
  display: inline;
}

.navigation .slide-dot:not(:last-of-type) {
  margin-right: 5px;
}

.navigation .slide-dot-button {
  background-color: rgba(0, 0, 0, 0.3);

  border: 0;

  width: 15px;

  height: 15px;

  border-radius: 15px;

  cursor: pointer;
}

.navigation .slide-dot-button:focus {
  box-shadow: 0 0 0 1px white, 0 0 0 4px hsl(204, 86%, 53%);

  outline: none;
}

.navigation .slide-dot .slide-dot-button[aria-current="true"] {
  background-color: rgba(0, 0, 0, 1);
}

/**

    Utilities

  */

.is-visible {
  display: block !important;
}

.container-bottom-a > *,
.container-bottom-b > *,
.container-top-a > *,
.container-top-b > * {
  margin: 0;
}

.icons p {
  margin: 0 0 0 5px;

  font-weight: bold;

  text-transform: uppercase;

  font-size: 15px;

  line-height: 1.2;
}

[align="center"] {
  text-align: center;
}

.metismenu.mod-menu {
  margin: 0.5rem 0;
}

.container-header nav {
  margin-top: 0;
}

.table {
  margin-block-end: 2rem;
}

.navbar .mod-menu .level-1 > ul {
  padding-block: 0.4rem;
}

.table-primary {
  --table-bg: var(--primary);
  --table-striped-bg: #f6f6f6;
  --table-color: #fff;
}

.form-control {
  border-color: #555;
}

.table-primary thead th {
  background-color: var(--color-secondary);

  color: #fff;
}

.table th {
  font-weight: 700;
}

h1,
h2,
h3 {
  margin-block-end: 0.67em;
}

.logo {
  font-size: calc(90% + 0.9vw);

  line-height: 1.1;
}

.atm-input {
  border: 1px solid #555;

  border-right: 0;

  border-radius: 4px 0 0 4px;

  max-width: 120px;
}

.foreclosure-link {
  text-decoration: none;
  max-width: 200px;
}

.foreclosure-link:hover {
  text-decoration: underline;
}

.go {
  border: 1px solid #555;

  border-radius: 0 4px 4px 0;
}

.atm-label {
  width: 114px;
}

.container-below-top .logo a {
  color: #1857ad;

  text-decoration: none;
}

.container-topbar a:not(.btn):hover,
.container-topbar a:not(.btn):focus,
.container-topbar .btn-link:hover,
.container-topbar .btn-link:focus,
.container-below-top a:not(.btn):hover,
.container-below-top a:not(.btn):focus,
.container-below-top .btn-link:hover,
.container-below-top .btn-link:focus {
  color: #0c3f86;
}

.logo span {
  font-size: calc(40% + 1vw);
}

blockquote {
  font-size: 2rem;

  padding: 3rem;

  background: var(--footer-color);

  font-style: italic;

  font-weight: 600;
}

.dog404 {
  background: transparent url("https://www.clcu.org/images/404-dog.jpg") right bottom no-repeat;

  background-size: contain;
}

.djslider-default .navigation-container img {
  z-index: 1;
}

.container-header .grid-child {
  flex-wrap: wrap;
}

/* Mobile slideshow */

@media (max-width: 767px) and (orientation: portrait) {
  .container-banner .djslider-default,
  .container-banner .djslider-default ul.djslider-in > li {
    height: 550px !important;

    max-width: 100vw;
  }

  .container-banner .djslider-default img.dj-image {
    aspect-ratio: 11/16;

    object-fit: cover;
  }

  .djslider-default,
  .djslider-default ul.djslider-in > li {
    height: 360px !important;
  }

  .djslider-default img.dj-image {
    aspect-ratio: 1/1;

    object-fit: cover;
  }
}

@media (min-width: 768px) {
  .metismenu.mod-menu {
    margin: 0;
  }

  .home-slider {
    top: calc(50% - (314px / 2));

    left: 20px;
  }

  .carousel {
    --carousel-height: 250px;

    width: 300px;
  }

  .container-header .grid-child {
    flex-wrap: nowrap;
  }

  .random-image {
    height: 100%;
  }

  body:not(.home) .container-banner {
    position: absolute;

    height: calc(100% - 412px);
  }

  .banner {
    position: absolute;
  }
}

@media (min-width: 1200px) {
  .home-slider {
    left: 80px;
  }

  .carousel {
    --carousel-height: 250px;

    width: 380px;
  }
}