/*Variables */
/* General Styles*/
hr {
  border-top-color: #999 !important;
  margin: 3em 0 !important; }

body {
  background-color: #fff !important;
  color: #000; }

a.btn {
  background: transparent;
  border: 2px solid #d60f00;
  color: #d60f00;
  text-transform: uppercase;
  border-radius: 5px;
  width: auto;
  height: auto;
  padding: 10px 20px;
  line-height: 1em;
  transition: all .2s ease;
  margin: 0 10px 10px 0; }
  a.btn:hover {
    background: #d60f00;
    color: #fff; }
  a.btn:focus {
    background-color: #d60f00;
    color: #fff; }
  a.btn.featuredBtn {
    background: #d60f00;
    color: #fff;
    font-weight: bold;
    font-size: 1.135em;
    padding: 9px 15px; }
    a.btn.featuredBtn:hover {
      background: #fff;
      color: #d60f00; }

.tg-ajax-button {
  border: 2px solid #d60f00;
  font-weight: bold;
  font-size: 1.135em;
  text-transform: uppercase;
  border-radius: 5px;
  padding: 9px 15px;
  line-height: 1em;
  transition: all .2s ease;
  margin: 0 10px 10px 0; }

.btn-donate {
  align-items: center !important; }
  .btn-donate > a {
    background-color: #d60f00 !important;
    border: 2px solid #d60f00;
    color: #fff;
    text-transform: uppercase;
    border-radius: 5px;
    width: auto;
    height: fit-content;
    display: inline-block;
    line-height: 1em;
    transition: all .2s ease;
    margin-right: 10px; }
    .btn-donate > a:hover {
      background-color: #fff !important;
      color: #d60f00 !important; }

h1 {
  margin: 0 0 10px 0 !important; }
  h1 span {
    display: block;
    font-size: 75%; }

h2 {
  margin: 0 0 10px 0 !important; }
  @media screen and (max-width: 600px) {
    h2 {
      font-size: 185% !important; } }

h4 {
  margin: 30px 0 0 0 !important;
  color: #fff; }

.x-main {
  max-width: 100%; }

.x-container.offset {
  padding-top: 100px; }

@media screen and (max-width: 991px) {
  .x-container:not(.offset) {
    padding: 0 !important; } }

/* X-theme over rides */
#x-root.x-root {
  display: block; }

.entry-wrap {
  padding: 0 !important;
  box-shadow: none !important; }

/* Home page specific styling */
body.home .entry-content {
  padding: 0 !important;
  margin-bottom: 0 !important; }
@media screen and (max-width: 600px) {
  body.home h1 {
    font-size: 300% !important; } }

@media screen and (min-width: 991px) {
  .homeHead {
    margin-top: -75px !important; } }
.homeHead .home-header-sub {
  text-align: left;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.75); }
  @media screen and (min-width: 991px) {
    .homeHead .home-header-sub {
      display: inline-flex;
      align-items: center; } }
  .homeHead .home-header-sub p, .homeHead .home-header-sub a {
    display: block; }
  .homeHead .home-header-sub p {
    width: 100%;
    padding: 10px 30px;
    margin-bottom: 0; }
    @media screen and (min-width: 991px) {
      .homeHead .home-header-sub p:first-of-type {
        width: 77%; } }
    @media screen and (min-width: 991px) {
      .homeHead .home-header-sub p:nth-child(2) {
        width: 22%; } }
  .homeHead .home-header-sub a {
    margin: 0 0 0 10px;
    background: #d60f00;
    color: #fff; }
    .homeHead .home-header-sub a:hover {
      background: #fff;
      color: #d60f00; }
    @media screen and (max-width: 991px) {
      .homeHead .home-header-sub a {
        width: 100%;
        margin: 0; } }

@media screen and (min-width: 991px) {
  .homeHead2 {
    margin-top: inherit !important; } }
.homeHead2 .home-header-sub {
  background: transparent; }

ul.home-list li {
  position: relative; }
  ul.home-list li:after {
    content: '';
    position: absolute;
    top: 0;
    left: -50px;
    height: 37px;
    width: 40px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url("../img/li-image-home.png"); }

.x-container .entry-content {
  padding: 20px 30px;
  background: #eee;
  margin-bottom: 30px; }

.home-red-cta .x-bar-content-area {
  padding-bottom: 40px; }
.home-red-cta .home-red-btn-wrap {
  position: absolute;
  bottom: 10px;
  left: 0;
  text-align: center;
  width: 100%; }

/* Home page event styling */
#home-event, #home-vlog {
  display: inline-flex;
  width: 100%; }
  #home-event .row, #home-vlog .row {
    width: 100%; }
  #home-event .content-wrap, #home-vlog .content-wrap {
    background: #f7f7f7; }
    #home-event .content-wrap .eventContent, #home-vlog .content-wrap .eventContent {
      padding: 30px 15px; }
      #home-event .content-wrap .eventContent h2, #home-vlog .content-wrap .eventContent h2 {
        margin-bottom: 10px;
        margin-top: 0; }
      #home-event .content-wrap .eventContent h3, #home-vlog .content-wrap .eventContent h3 {
        margin-bottom: 10px;
        margin-top: 0; }
  #home-event .img-wrap, #home-vlog .img-wrap {
    height: 100%;
    padding: 0; }
    @media screen and (max-width: 600px) {
      #home-event .img-wrap, #home-vlog .img-wrap {
        display: none; } }
    #home-event .img-wrap .eventImg, #home-vlog .img-wrap .eventImg {
      height: 100%;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      border-bottom: 10px solid #d60f00; }

/* News Listing */
.newsFeed {
  display: flex;
  flex-wrap: wrap;
  width: 100%; }
  .newsFeed .newsItem {
    margin-left: 0 !important;
    margin-right: auto;
    position: relative;
    margin-bottom: 30px;
    background: #f7f7f7;
    background-clip: content-box; }
    .newsFeed .newsItem .firstFlag {
      background: #014078;
      padding: 10px 20px;
      color: #fff;
      font-size: 1.1em;
      text-transform: uppercase;
      display: inline-flex;
      align-items: center;
      position: absolute;
      max-width: calc(100% - 20px); }
      .newsFeed .newsItem .firstFlag i {
        font-size: 2em;
        margin-right: 10px; }
    .newsFeed .newsItem .newsImage {
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      border-bottom: 10px solid #d60f00;
      height: 250px; }
    .newsFeed .newsItem .newsContent {
      padding: 15px 15px 60px; }
      .newsFeed .newsItem .newsContent h2 {
        margin-top: 0; }
      .newsFeed .newsItem .newsContent h3 {
        font-size: 1.5em;
        margin-bottom: 10px;
        margin-top: 0; }
      .newsFeed .newsItem .newsContent a {
        position: absolute;
        bottom: 15px; }
    .newsFeed .newsItem.firstItem .newsImage {
      height: 350px; }

.newsDate p {
  margin-bottom: 0;
  font-size: 1.1em; }

#featured-homepage .featuredFlag {
  background: #014078;
  padding: 10px 20px;
  color: #fff;
  font-size: 1.7em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  width: 60%;
  min-width: 200px; }
  #featured-homepage .featuredFlag i {
    font-size: 2rem;
    margin-right: 10px; }
#featured-homepage .newsItem {
  width: 100%;
  background: #eee;
  margin-bottom: 10px; }
  #featured-homepage .newsItem .newsContent {
    padding: 10px 15px; }
    #featured-homepage .newsItem .newsContent .newsTitle h3 {
      font-size: 1.3em; }
    #featured-homepage .newsItem .newsContent .readMore a {
      position: relative;
      bottom: auto; }

/* FOLLOW BUTTONS */
.socialFollow a {
  display: inline-block;
  padding: 10px 10px 10px 0;
  font-size: 2em;
  transition: all .2s ease;
  text-shadow: none;
  color: var(--btn-color); }
  .socialFollow a:hover {
    color: var(--btn-hover); }
  .socialFollow a.round {
    height: 45px;
    width: 45px;
    padding: 0;
    margin: 10px 10px 10px 0;
    background: #aaa;
    border-radius: 100%;
    text-align: center; }
  .socialFollow a .icon-gab {
    background-image: url(https://www.jccf.ca/wp-content/uploads/2021/03/gab-1.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 45px;
    width: 45px; }
.socialFollow.socialFollowStatic {
  display: inline-flex; }
  .socialFollow.socialFollowStatic a {
    height: 55px;
    width: 55px;
    background: #014078;
    padding: 0;
    text-align: center;
    border-radius: 100%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    transition: all .2s ease;
    margin: 5px; }
    .socialFollow.socialFollowStatic a:hover {
      background-color: #d60f00; }

/* SIDEBAR STYLING */
div.widget ul {
  border: none; }
div.widget h4 {
  text-transform: uppercase;
  padding-bottom: 15px !important;
  margin-bottom: 15px !important;
  border-bottom: 1px solid #aaa; }

div.gform_widget .gform_body ul {
  outline: none;
  border: none; }
  div.gform_widget .gform_body ul li {
    border: none; }
    div.gform_widget .gform_body ul li input:focus {
      border-bottom: 1px solid #d60f00 !important;
      box-shadow: 0 1px 0 0 #d60f00 !important; }
div.gform_widget input[type='submit'] {
  box-shadow: none !important;
  text-shadow: none !important;
  background-color: #d60f00;
  border: 2px solid #d60f00;
  transition: all .2s ease;
  text-transform: uppercase; }
  div.gform_widget input[type='submit']:hover {
    color: #d60f00;
    background-color: #fff; }

div.widget_categories ul {
  border: none; }
  div.widget_categories ul li {
    border: none;
    padding-left: 0; }
    div.widget_categories ul li a {
      color: #000;
      border-bottom: none;
      position: relative;
      padding-left: 30px;
      font-size: 16px; }
      div.widget_categories ul li a:hover:before {
        border-color: #d60f00;
        background-color: #d60f00; }
      div.widget_categories ul li a:before {
        content: '';
        position: absolute;
        left: 0;
        top: 1px;
        border-radius: 100%;
        height: 20px;
        width: 20px;
        border: 1px solid #555;
        opacity: 1;
        transition: all .2s ease; }

div.popular-posts ul {
  border: none; }
  div.popular-posts ul li {
    border: none;
    box-shadow: none; }
    div.popular-posts ul li a {
      border-bottom: none;
      color: #000;
      font-weight: bold; }

/* CASE PAGE */
#case_sort strong {
  font-size: 1.1em;
  margin-right: 10px; }
#case_sort select {
  width: calc(100% - 75px); }

.caseFeed {
  display: flex;
  flex-wrap: wrap;
  width: 100%; }
  .caseFeed .caseItem {
    margin-left: 0 !important;
    margin-right: auto;
    position: relative;
    margin-bottom: 30px;
    background: #f7f7f7;
    background-clip: content-box; }
    @media screen and (max-width: 600px) {
      .caseFeed .caseItem {
        padding: 0; } }
    .caseFeed .caseItem .firstFlag {
      background: #014078;
      padding: 10px 20px;
      color: #fff;
      font-size: 1.1em;
      text-transform: uppercase;
      display: inline-flex;
      align-items: center;
      position: absolute; }
      .caseFeed .caseItem .firstFlag i {
        font-size: 2em;
        margin-right: 10px; }
    .caseFeed .caseItem .caseImage {
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      border-bottom: 10px solid #d60f00;
      height: 250px; }
    .caseFeed .caseItem .caseContent {
      padding: 15px 15px 60px; }
      .caseFeed .caseItem .caseContent h2 {
        margin-top: 0; }
      .caseFeed .caseItem .caseContent h3 {
        font-size: 1.5em;
        margin-bottom: 10px;
        margin-top: 0; }
      .caseFeed .caseItem .caseContent a {
        position: absolute;
        bottom: 15px; }
    .caseFeed .caseItem.firstItem .caseImage {
      height: 350px; }

.pagination a, .pagination span {
  border: 1px solid #aaa;
  text-align: center;
  height: 30px;
  width: 30px;
  display: inline-block;
  line-height: 30px;
  float: left;
  color: #000;
  transition: all .2s ease; }
  .pagination a.current, .pagination span.current {
    background-color: #d60f00;
    color: #fff; }
  .pagination a:hover, .pagination span:hover {
    background-color: #d60f00;
    color: #fff; }
  .pagination a.dots, .pagination span.dots {
    padding: 0 10px;
    width: auto;
    border: none; }
    .pagination a.dots:hover, .pagination span.dots:hover {
      background-color: #fff;
      color: #000; }
  .pagination a.next, .pagination a.prev, .pagination span.next, .pagination span.prev {
    width: auto;
    padding: 0 10px; }

body.single article.type-court_cases .entry-content {
  margin-bottom: 0; }
body.single #case_extra_data {
  padding: 35px;
  background-color: #eee;
  display: inline-flex;
  flex-wrap: wrap;
  width: 100%; }
  body.single #case_extra_data .docTitle {
    border-top: 2px solid #ccc;
    padding-bottom: 20px;
    padding-top: 30px;
    margin-bottom: 20px; }
    body.single #case_extra_data .docTitle h4 {
      margin-top: 0 !important; }
  body.single #case_extra_data .casesExtra {
    border-right: 2px solid #ccc;
    margin: 0 auto 30px; }
    @media screen and (max-width: 991px) {
      body.single #case_extra_data .casesExtra {
        border: none; } }
    body.single #case_extra_data .casesExtra:last-of-type {
      border-right: none; }
    body.single #case_extra_data .casesExtra .casesExtra-title {
      font-weight: bold;
      margin-bottom: 10px;
      width: 100%; }
    body.single #case_extra_data .casesExtra .casesExtra-links {
      width: 100%; }
      body.single #case_extra_data .casesExtra .casesExtra-links ul {
        margin: 0; }
        body.single #case_extra_data .casesExtra .casesExtra-links ul li {
          margin-bottom: 10px; }

/*STAFF PAGE */
#staff_members .staffMember {
  cursor: pointer; }
  #staff_members .staffMember:hover .memberInner .memberInfo {
    bottom: 35px; }
  #staff_members .staffMember .memberInner {
    width: 100;
    height: 70vh;
    border-radius: 10px;
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
    min-height: 480px; }
    @media screen and (max-width: 480px) {
      #staff_members .staffMember .memberInner {
        min-height: 400px; } }
    #staff_members .staffMember .memberInner:before {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      height: 100%;
      width: 100%;
      background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 70%); }
    #staff_members .staffMember .memberInner p {
      color: #fff;
      font-weight: bold;
      font-size: 1.2em;
      margin-bottom: 0;
      position: absolute;
      bottom: 0;
      left: 0;
      text-align: center;
      width: 100%;
      background: #d60f00;
      padding: 5px; }
    #staff_members .staffMember .memberInner .memberInfo {
      position: absolute;
      bottom: 25px;
      left: 0px;
      transition: all .2s ease;
      width: 100%;
      padding: 20px; }
      #staff_members .staffMember .memberInner .memberInfo h3 {
        color: #fff;
        margin-top: 0; }
      #staff_members .staffMember .memberInner .memberInfo h4 {
        margin-top: 0 !important;
        color: #fff; }

#staff_popup {
  opacity: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  background: RGBA(0, 0, 0, 0.5);
  top: 0;
  left: 0;
  z-index: -1;
  transition: all .2s ease; }
  #staff_popup.active {
    display: block;
    opacity: 1; }
  #staff_popup .popupInner {
    position: fixed;
    top: 20vh; }
    #staff_popup .popupInner .popupContent {
      background: #fff;
      max-width: 650px;
      width: 100%;
      margin: 0 auto;
      padding: 1.5rem;
      border-radius: 10px;
      position: relative; }
      #staff_popup .popupInner .popupContent h3 {
        margin-top: 0;
        margin-bottom: 20px; }
      #staff_popup .popupInner .popupContent p {
        color: #000; }
      #staff_popup .popupInner .popupContent .popupClose {
        position: absolute;
        top: -3px;
        right: 5px;
        color: #666;
        cursor: pointer;
        transition: all .2s ease;
        font-size: 1.5em; }
        #staff_popup .popupInner .popupContent .popupClose:hover {
          color: #000; }

/* CTA Styling */
#cta-block {
  background-color: #014078;
  background-image: url(../img/cta-banner.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
  text-align: center;
  min-height: 440px;
  display: inline-flex;
  align-items: center;
  width: 100%;
  position: relative; }
  #cta-block.no-bg {
    background-image: none;
    min-height: 240px; }
  #cta-block:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #014078;
    opacity: .75; }
  #cta-block .cta-warn {
    color: red;
    position: absolute;
    bottom: 10px;
    left: 10px;
    text-align: left; }
  #cta-block .cta-inner {
    width: 100%;
    text-align: center;
    opacity: .85;
    padding: 60px; }
    #cta-block .cta-inner h3 {
      color: #fff;
      line-height: 1em;
      margin: 0 auto 15px auto;
      padding: 0 0 15px 0;
      position: relative;
      width: 100%;
      max-width: 400px; }
      #cta-block .cta-inner h3:after {
        content: '';
        width: 100%;
        height: 1px;
        background: #fff;
        position: absolute;
        left: 0;
        bottom: 0; }
    #cta-block .cta-inner p {
      margin-bottom: 10px; }
    #cta-block .cta-inner a.cta-btn {
      color: #fff;
      background-color: transparent;
      border: 2px solid #fff;
      text-transform: uppercase; }
      #cta-block .cta-inner a.cta-btn:hover {
        background: #fff;
        color: #014078; }
  #cta-block form {
    width: 100%;
    max-width: 750px; }
    #cta-block form ul li label {
      color: #fff; }
    #cta-block form ul li input {
      color: #fff;
      font-size: 1.25em;
      background: RGBA(255, 255, 255, 0.35); }
      #cta-block form ul li input:focus {
        border-bottom-color: #d60f00;
        box-shadow: 0 1px 0 0 #d60f00; }
    #cta-block form input[type='submit'] {
      background-color: transparent !important;
      border: 2px solid #fff;
      color: #fff;
      text-transform: uppercase;
      border-radius: 5px;
      width: auto;
      height: fit-content;
      display: block;
      line-height: 1em;
      transition: all .2s ease;
      margin-right: 10px;
      box-shadow: none;
      text-shadow: none;
      margin: 0 auto;
      font-size: 1.5em;
      padding-left: 40px;
      padding-right: 40px; }
      #cta-block form input[type='submit']:hover {
        background-color: #fff !important;
        color: #014078 !important; }

.support-links .x-text:not(.x-text-headline) {
  padding-bottom: 75px; }
.support-links .x-anchor {
  position: absolute;
  bottom: 0;
  left: 0; }

/* footer styles */
footer {
  z-index: 9998; }
  footer .x-bar-footer p {
    margin-bottom: 0; }

ul.footer-menu {
  flex-direction: column !important; }
  ul.footer-menu li {
    text-align: left; }
    ul.footer-menu li a {
      color: #fff;
      display: inline-block;
      width: auto;
      text-transform: uppercase; }
      ul.footer-menu li a div {
        margin: 0 !important;
        padding: 0 !important;
        max-width: none;
        display: inline-block; }

body.single .entry-featured {
  max-height: 50vh;
  overflow: hidden;
  margin-bottom: 30px; }
  body.single .entry-featured .x-video-inner {
    padding-bottom: 50vh !important; }
  body.single .entry-featured .entry-thumb {
    max-height: 50vh;
    height: 100%;
    display: inline-flex;
    align-items: center; }
body.single .entry-title {
  margin-bottom: 0 !important;
  background: #eee;
  padding: 30px 30px 0; }
  body.single .entry-title h1 {
    margin-bottom: 0; }
body.single .entry-content {
  margin-top: 0; }

.mec-single-event {
  padding-top: 120px; }
  .mec-single-event .mec-events-event-image {
    height: 40vh;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    flex-flow: nowrap; }

.gform_wrapper .gf_progressbar_wrapper h3.gf_progressbar_title {
  font-size: 1.5em !important;
  color: #014078;
  margin-left: 0; }
.gform_wrapper .gf_progressbar_wrapper .gf_progressbar {
  margin: 20px 0;
  box-shadow: none;
  padding: 0; }
  .gform_wrapper .gf_progressbar_wrapper .gf_progressbar .gf_progressbar_percentage {
    height: 35px;
    background: #014078;
    font-size: 1em !important; }
    .gform_wrapper .gf_progressbar_wrapper .gf_progressbar .gf_progressbar_percentage span {
      margin-right: 10px;
      line-height: 35px; }
  .gform_wrapper .gf_progressbar_wrapper .gf_progressbar:after {
    display: none; }
.gform_wrapper .gfield_checkbox li input, .gform_wrapper .gfield_radio li input {
  position: relative;
  opacity: 1;
  pointer-events: all; }
.gform_wrapper .gfield_checkbox li label, .gform_wrapper .gfield_radio li label {
  font-size: 1em !important;
  color: #000; }
.gform_wrapper .gform_footer input[type="submit"], .gform_wrapper .gform_footer input[type="button"] {
  background-color: #d60f00 !important;
  border: 2px solid #d60f00;
  color: #fff;
  text-transform: uppercase;
  border-radius: 5px;
  width: auto;
  height: fit-content;
  display: block;
  line-height: 1em;
  transition: all .2s ease;
  margin-right: 10px;
  box-shadow: none;
  text-shadow: none;
  margin: 0 auto;
  font-size: 1.5em;
  padding-left: 40px;
  padding-right: 40px;
  margin-bottom: 30px !important; }
  .gform_wrapper .gform_footer input[type="submit"]:hover, .gform_wrapper .gform_footer input[type="button"]:hover {
    background-color: #fff !important;
    color: #d60f00 !important; }

.div_accordion .accordion_click {
  cursor: pointer; }
  .div_accordion .accordion_click:hover {
    background-color: #014078; }
    .div_accordion .accordion_click:hover .x-text-content-text-primary {
      color: #fff; }
.div_accordion .accordion_items {
  transition: all .5s ease; }
  .div_accordion .accordion_items.active {
    height: auto; }