/* Citta Care theme - orange / plum palette (values measured from the original site). */
:root {
  --text: #444;
  --link: #872c5d;
  --link-hover: #e67c00;
  --h1: #292929;
  --h2: #292929;
  --h3: #ee741c;
  --h1-size: 28px; --h1-size-lg: 28px; --h1-size-md: 28px; --h1-size-sm: 28px;

  --header-h: 150px;
  --header-border: #872c5d;
  --logo-h: 150px;
  --logo-top: 0px;
  --menu-top: 45px;
  --header-h-md: 180px; --logo-h-md: 100px; --logo-top-md: 0px; --menu-top-md: 104px;
  --header-h-tab: 100px; --logo-h-tab: 80px; --logo-top-tab: 10px;
  --header-h-sm: 100px; --logo-h-sm: 80px; --logo-top-sm: 10px;
  --menu-fs: 17px;
  --menu-weight: 700;
  --menu-hover: #444;
  --drop-border: #b0849c;
  --drop-hover-bg: #f7921e;
  --drop-hover-fg: #fff1e0;

  --btn-radius: 500px;
  --btn-bg: #ee741c;
  --btn-border: #f7921e;
  --btn-hover-bg: #f7921e;
  --btn-hover-border: #ee741c;
  --hollow-fg: #f7921e;
  --hollow-border: 3px solid #f7921e;
  --hollow-weight: 700;
  --hollow-hover: #ee741c;

  --stripe-light: #eee;
  --stripe-dark: #1d1f1a;
  --stripe-palette: #ee741c;
  --stripe-palette-dark: #f7921e;
  --stripe-palette-light: #fff1e0;
  --stripe-compliment: #872c5d;
  --stripe-compliment-dark: #661440;
  --stripe-compliment-light: #b0849c;
  --stripe-light-border: 1px solid #d5d5d5;
  --stripe-dark-border: 1px solid #555;
  --stripe-palette-border: 1px solid #f7921e;
  --stripe-palette-dark-border: 1px solid #ee741c;
  --stripe-palette-light-border: 1px solid #ee741c;
  --light-stripe-heading: #f7921e;

  --footer-bg: #444;
  --footer-border: 1px solid #fff;
  --footer-link: #eae1f5;
  --footer-social: #fff;
  --footer-social-hover: #fff;

  --accent: #ee741c;
  --modal-head: #ee741c;
  --mobile-bar-bg: rgba(255, 241, 224, .8);
  --mobile-btn-bg: #ee741c;
  --mobile-btn-border: #fff1e0;
  --drawer-link: #f7921e;
  --back-top-bg: rgba(238, 116, 28, .85);
}

/* Header: the menu highlight is a faint orange fill that drops down behind the item */
.main-nav > ul > li:before {
  top: 0; right: 0; bottom: 0; left: 0;
  height: auto;
  background: rgba(230, 112, 32, .1);
  transform: scaleY(0);
  transform-origin: 50% 0;
  transition: transform .3s ease-out;
}
.main-nav > ul > li:hover:before { right: 0; transform: scaleY(1); }
.site-logo img { max-width: 100%; }

/* Headings inside light stripes are orange; in compliment stripes plum */
.ub-light h1, .ub-light h2, .ub-light h3, .ub-light h4,
.ub-white h1, .ub-white h2, .ub-white h3, .ub-white h4 { color: #f7921e; }
.ub-compliment-light h1, .ub-compliment-light h2, .ub-compliment-light h3, .ub-compliment-light h4 { color: #661440; }
.ub-compliment-dark h1, .ub-compliment-dark h2, .ub-compliment-dark h3, .ub-compliment-dark h4,
.ub-compliment h1, .ub-compliment h2, .ub-compliment h3, .ub-compliment h4 { color: #b0849c; }
.ub-palette a { color: #f7921e; }

/* Hollow buttons: white on dark/colour stripes, dark on light stripes */
.parallax-dark .btn-hollow, .ub-dark .btn-hollow, .parallax-black .btn-hollow, .ub-palette-dark .btn-hollow, .ub-palette .btn-hollow { color: #fff; border: 2px solid #fff; }
.parallax-dark .btn-hollow:hover, .ub-dark .btn-hollow:hover, .parallax-black .btn-hollow:hover, .ub-palette-dark .btn-hollow:hover, .ub-palette .btn-hollow:hover { color: #fff; border: 2px solid #eee; }
.parallax-light .btn-hollow, .ub-light .btn-hollow, .ub-palette-light .btn-hollow, .parallax-colour .btn-hollow { color: #444; border: 2px solid #444; }
.parallax-light .btn-hollow:hover, .ub-light .btn-hollow:hover, .ub-palette-light .btn-hollow:hover, .parallax-colour .btn-hollow:hover { color: #444; border: 2px solid #666; }
.ub-compliment-light .btn-hollow { color: #661440; border: 2px solid #661440; }
.ub-compliment-light .btn-hollow:hover { color: #872c5d; border: 2px solid #872c5d; }
.ub-compliment-dark .btn-hollow, .ub-compliment .btn-hollow { color: #fff; border: 2px solid #fff; }

hr { margin: 15px 0; border: 0; border-top: 1px solid #f7921e; border-bottom: 1px solid #e9e9e9; }
.parallax-dark hr, .ub-dark hr, .parallax-black hr, .ub-palette-dark hr, .ub-palette hr { border-top: 1px solid #fff1e0; border-bottom: 1px solid #fff; }
.parallax-light hr, .ub-light hr, .ub-palette-light hr, .parallax-colour hr, .ub-white hr { border-top: 1px solid #f7921e; border-bottom: 1px solid #fff; }
blockquote { border-left: 5px solid #f7921e; }

/* Photo-background sections and their tints */
.vidbg01 { background-image: url(/shared/images/content/bus_54896/video/poster01.jpg); }
.vidbg03 { background-image: url(/shared/images/content/bus_54896/video/poster03.jpg); }
.vidbg04 { background-image: url(/shared/images/content/bus_54896/video/poster04.jpg); }
.parallax01 { background-image: url(/shared/images/content/bus_54896/parallax/parallax_01.jpg); }
.parallax02 { background-image: url(/shared/images/content/bus_54896/parallax/parallax_02.jpg); }
.parallax-dark { background: rgba(247, 146, 30, .65); color: #fff; border: 0; }
.parallax-light { background: rgba(255, 255, 255, .65); color: #444; border: 0; }
.parallax-black { background: rgba(0, 0, 0, .65); color: #444; }
.parallax-colour { background: rgba(255, 241, 224, .65); color: #fff; }
.parallax-gradient-c1c2 { background-image: linear-gradient(to right, rgba(247, 146, 30, .5), rgba(102, 20, 64, .5)); color: #fff; }
.parallax-standard { background: 0; }
.parallax-colour p, .parallax-light p { color: #444; }

/* Photo galleries: square thumbnails, photo cropped to fill; click opens the lightbox */
.r8_gallery .landscape { position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; margin-bottom: 30px; }
.r8_gallery .landscape a { display: block; width: 100%; height: 100%; }
.r8_gallery .landscape img.gallery-img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none !important; object-fit: cover; }
/* portrait photos fill the width and are cropped at the bottom */
.r8_gallery .portrait { position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; margin-bottom: 30px; }
.r8_gallery .portrait a { display: block; }
.r8_gallery .portrait img.gallery-img { width: 100%; height: auto !important; max-width: none !important; }

/* Blog listing pages (post cards) */
.blog-page #content ul li:before { content: normal; }
/* headings keep the News Cycle font and size (the original's ID rules win); only line height changes */
.blog_text { line-height: 130%; }
.blog_text:not(h1):not(h2) { font-family: 'Quicksand', sans-serif; font-size: 110%; }
#blog h1, #blog h2 { margin-top: 20px; margin-bottom: 10px; }
#content h2.blog_summary { font-size: 24px; }
.cat-title { text-transform: capitalize; }
.list_layout { display: none; }
.muted_hr { display: block; height: 1px; border: 0; margin: 1em 0; padding: 0; background-color: #ccc; }
.layout_buttons .btn-xs { padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; }
.post_container1 {
  margin: 0 auto 10px;
  background-color: rgba(255, 255, 255, .6);
  padding: 15px;
  border: 1px solid #e6e6e6;
  font-family: 'Quicksand', sans-serif;
  height: 440px;
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
}
.post_container1:hover { box-shadow: 0 0 11px rgba(33, 33, 33, .2); }
.post_container1.dateshow { height: 450px; }
.post_container1.datehide .post_date { display: none; }
.post_container1 .post_image { margin: -15px -15px 15px -15px; }
.post_container1.fill .post_image { height: 200px; background-size: cover !important; background-position-x: center; background-position-y: top; }
.post_container1.addstyle1 .post_image { height: 200px; }
.post_container1 .post_title { font-size: 1.15em; margin: 15px 0 5px; line-height: 140%; }
.post_container1 .post_date { font-size: .75em; color: #999; font-style: italic; }
.post_container1 .post_summary_card { font-size: 1em; color: #333; }
.post_container1 .fixed-foot { position: absolute; bottom: 0; width: calc(100% - 30px); }
.post_foot { font-size: .85em; }
.post_social { font-size: .95em; color: #ccc; float: right; text-align: right; position: relative; top: -20px; }
@media (max-width: 991px) {
  .post_container1 .post_title { font-size: 1.1em; }
  .layout_buttons { margin-bottom: 15px; }
}

/* Footer: round social icons that lift on hover */
.site-footer .social a {
  width: 25px; height: 25px; line-height: 25px;
  margin: 22px 15px 13px 0;
  vertical-align: top;
  padding: 0;
  border-radius: 50%;
  text-align: center;
  font-size: 15px;
  color: #fff;
  transition: transform .3s;
}
.site-footer .social a:hover { transform: translateY(-5px); color: #fff; }
.site-footer .social .soc-facebook { background: #1a5aa0; }
.site-footer .social .soc-instagram { background: #4b3a33; }
.site-footer .align-social, .site-footer .footer-links { padding-top: 22px; }


/* gallery boxes are square; the linked picture box (hvrbox) is 4:3 */
.r8_gallery .hvrbox { aspect-ratio: 4 / 3; }
/* Linked picture box with a caption bar over the photo (e.g. Locations -> Canterbury) */
.r8_gallery .hvrbox { position: relative; }
.r8_gallery .hvrbox > a > span:empty { display: none; }
.r8_gallery .gallery-gradBox { display: block; position: absolute; inset: 0; color: #000; padding: 12px; font-size: 16px; }
.r8_gallery .gallery-gradBox .overlayText { position: relative; height: 100%; width: 100%; color: #222; }
.r8_gallery .overlayText .textWrapper2 { position: absolute; display: inline-block; text-align: left; font-size: 16px; line-height: 1.4em; padding: 12px; }
.r8_gallery .overlayText .textWrapper2.block { width: 100%; }
.r8_gallery .overlayText .textWrapper2.centre_bottom { bottom: 0; left: 0; text-align: center; }
.r8_gallery .overlayText .textWrapper2.light { background-color: rgba(255, 255, 255, .5); color: #222; }
.r8_gallery .overlayText .textWrapper2 .inner_title { font-size: 20px; font-weight: bold; }
.r8_gallery i.icon-corner { position: absolute; top: 10px; right: 25px; color: #fff; font-size: .9em; }
@media (max-width: 991px) {
  .r8_gallery .gallery-gradBox, .r8_gallery .overlayText .textWrapper2 { padding: 5px; font-size: 12px; }
  .r8_gallery .overlayText .textWrapper2 .inner_title { font-size: 16px; }
}
