/* Citta Housing theme - purple palette (values measured from the original site). */
:root {
  --text: #444;
  --link: #e34683;
  --link-hover: #70364d;
  --h1: #82438c;
  --h2: #82438c;
  --h3: #5a2163;

  --header-h: 120px;
  --header-border: #82438c;
  --logo-h: 80px;
  --logo-top: 20px;
  --menu-top: 49px;
  --header-h-md: 120px; --logo-h-md: 40px; --logo-top-md: 5px; --menu-top-md: 51px;
  --header-h-tab: 120px; --logo-h-tab: 48px; --logo-top-tab: 6px;
  --header-h-sm: 120px; --logo-h-sm: 96px; --logo-top-sm: 12px;
  --menu-fs: 15px;
  --menu-weight: 400;
  --menu-hover: #910039;
  --menu-bar: #82438c;
  --drop-border: #82438c;
  --drop-hover-bg: #910039;
  --drop-hover-fg: #444;

  --btn-radius: 6px;
  --btn-bg: #82438c;
  --btn-border: #5a2163;
  --btn-hover-bg: #5a2163;
  --btn-hover-border: #82438c;
  --hollow-fg: #fff;
  --hollow-border: 2px solid #fff;
  --hollow-weight: 700;
  --hollow-hover: #82438c;

  --stripe-light: #eee;
  --stripe-dark: #1d1f1a;
  --stripe-palette: #82438c;
  --stripe-palette-dark: #5a2163;
  --stripe-palette-light: #b877c3;
  --light-stripe-heading: #5a2163;

  --footer-bg: #333;
  --footer-link: #82438c;
  --footer-social: #82438c;
  --footer-social-hover: #910039;

  --accent: #82438c;
  --modal-head: #5a2163;
  --mobile-bar-bg: rgba(184, 119, 195, .8);
  --mobile-btn-bg: #82438c;
  --mobile-btn-border: #b877c3;
  --drawer-link: #5a2163;
}

@media (min-width: 1200px) { .site-logo { top: 5px; } }
.vidbg02 { background-image: url(/shared/images/content/bus_56552/video/poster02.jpg); }
.parallax01 { background-image: url(/shared/images/content/bus_56552/parallax/parallax_01.jpg); }

/* Light stripes use dark hollow buttons */
.ub-light .btn-hollow, .ub-palette-light .btn-hollow, .ub-white .btn-hollow { color: var(--text); border: 2px solid var(--text); }
.ub-light .btn-hollow:hover, .ub-palette-light .btn-hollow:hover, .ub-white .btn-hollow:hover { color: var(--text); border: 2px solid #666; }
.ub-dark .btn-hollow:hover, .ub-palette-dark .btn-hollow:hover, .ub-palette .btn-hollow:hover { color: #fff; border: 2px solid #eee; }

