@font-face {
	font-family: 'OakesGrotesk-Bold';
	src: url('oakes-grotesk-bold.eot');
	src: url('oakes-grotesk-bold.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-bold.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-bold.woff') format('woff'),
	     url('oakes-grotesk-bold.ttf') format('truetype'),
	     url('oakes-grotesk-bold.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-BoldItalic';
	src: url('oakes-grotesk-bold-italic.eot');
	src: url('oakes-grotesk-bold-italic.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-bold-italic.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-bold-italic.woff') format('woff'),
	     url('oakes-grotesk-bold-italic.ttf') format('truetype'),
	     url('oakes-grotesk-bold-italic.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-RegularItalic';
	src: url('oakes-grotesk-italic.eot');
	src: url('oakes-grotesk-italic.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-italic.woff2') format('woff2'),
	     url('https://www.communitech.ca/oakes-grotesk-italic.woff') format('woff'),
	     url('oakes-grotesk-italic.ttf') format('truetype'),
	     url('oakes-grotesk-italic.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-Light';
	src: url('oakes-grotesk-light.eot');
	src: url('oakes-grotesk-light.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-light.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-light.woff') format('woff'),
	     url('oakes-grotesk-light.ttf') format('truetype'),
	     url('oakes-grotesk-light.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-LightItalic';
	src: url('oakes-grotesk-light-italic.eot');
	src: url('oakes-grotesk-light-italic.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-light-italic.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-light-italic.woff') format('woff'),
	     url('oakes-grotesk-light-italic.ttf') format('truetype'),
	     url('oakes-grotesk-light-italic.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-Medium';
	src: url('oakes-grotesk-medium.eot');
	src: url('oakes-grotesk-medium.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-medium.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-medium.woff') format('woff'),
	     url('oakes-grotesk-medium.ttf') format('truetype'),
	     url('oakes-grotesk-medium.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-MediumItalic';
	src: url('oakes-grotesk-medium-italic.eot');
	src: url('oakes-grotesk-medium-italic.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-medium-italic.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-medium-italic.woff') format('woff'),
	     url('oakes-grotesk-medium-italic.ttf') format('truetype'),
	     url('oakes-grotesk-medium-italic.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-Regular';
	src: url('https://communitech-staging/assets/themes/communitech/fonts/oakes-grotesk-regular/oakes-grotesk-regular.eot');
	src: url('https://communitech-staging/assets/themes/communitech/fonts/oakes-grotesk-regular/oakes-grotesk-regular.eot?#iefix') format('embedded-opentype'),
         url('https://communitech-staging/assets/themes/communitech/fonts/oakes-grotesk-regular/oakes-grotesk-regular.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-regular.woff') format('woff'),
	     url('https://communitech-staging/assets/themes/communitech/fonts/oakes-grotesk-regular/oakes-grotesk-regular.ttf') format('truetype'),
	     url('https://communitech-staging/assets/themes/communitech/fonts/oakes-grotesk-regular/oakes-grotesk-regular.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-Semi-Bold';
	src: url('oakes-grotesk-semi-bold.eot');
	src: url('oakes-grotesk-semi-bold.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-semi-bold.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-semi-bold.woff') format('woff'),
	     url('oakes-grotesk-semi-bold.ttf') format('truetype'),
	     url('oakes-grotesk-semi-bold.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OakesGrotesk-Semi-BoldItalic';
	src: url('oakes-grotesk-semi-bold-italic.eot');
	src: url('oakes-grotesk-semi-bold-italic.eot?#iefix') format('embedded-opentype'),
         url('oakes-grotesk-semi-bold-italic.woff2') format('woff2'),
	     url('https://www.communitech.ca/assets/themes/communitech/fonts/oakes-grotesk-semi-bold-italic.woff') format('woff'),
	     url('oakes-grotesk-semi-bold-italic.ttf') format('truetype'),
	     url('oakes-grotesk-semi-bold-italic.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

.OakesGrotesk-Bold {
    font-family:'OakesGrotesk-Bold';
    font-weight: normal;
}

.OakesGrotesk-Regular {
    font-family:'OakesGrotesk-Regular';
    font-weight: normal;
}

.OakesGrotesk-Light {
    font-family:'OakesGrotesk-Light'!important;
    font-weight: normal;
}

body {
    font-family:'OakesGrotesk-Regular'!important;
    font-weight: normal;
}

a {
    color:#222222!important;
}

h2 {
    font-family:'OakesGrotesk-Light'!important;
    font-weight: normal;
    color:#CC1100!important;
}

.nav-link {
    color:#ffffff!important;
}

.btn {
    border-radius:29.22rem;
    padding: 0.375rem 1.75rem;
}

.h2 {
    color:#CC1100!important;
}

.h1 {
  font-size: 3em; 
}

.myaccordion .btn {
    width: 100%;
    color: #CC1100;
    padding: 0;
}

.counter-section i { display:block; margin:0 0 10px}
.counter-section span.counter { font-size:50px; color:#000; line-height:60px; display:block; font-family: "OakesGrotesk-Bold",sans-serif; letter-spacing: 2px}
.counter-title{ font-size:14px; font-family: "OakesGrotesk-Regular",sans-serif; letter-spacing:2px; text-transform: uppercase}
.counter-icon {top:25px; position:relative}
.counter-style2 .counter-title {letter-spacing: 0.55px; float: left;}
.counter-style2 span.counter {letter-spacing: 0.55px; float: left; margin-right: 10px;}
.counter-style2 i {float: right; line-height: 26px; margin: 0 10px 0 0}
.counter-subheadline span {float: right;}  




/* 10 */
.site-blocks-cover {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  background-attachment: fixed;
  position: relative; }
  .site-blocks-cover.overlay {
    position: relative; }
    .site-blocks-cover.overlay:before {
      position: absolute;
      content: "";
      left: 0;
      bottom: 0;
      right: 0;
      top: 0;
      background: rgba(0, 0, 0, 0.2); }
  .site-blocks-cover, .site-blocks-cover > .container > .row {
    min-height: 600px;
    height: calc(100vh); }
  .site-blocks-cover h1 {
    font-family:'OakesGrotesk-Regular'!important;
    font-size: 7rem;
    font-weight: 700;
    line-height: 1; }
    @media (max-width: 991.98px) {
      .site-blocks-cover h1 {
        font-size: 4rem; } }
  .site-blocks-cover .sub-text {
    font-size: 1.4rem;
    color: white;
    font-weight: 300; }
    @media (max-width: 991.98px) {
      .site-blocks-cover .sub-text {
        color: #000; } }
  .site-blocks-cover .img-wrap {
    position: absolute;
    z-index: -1;
    width: calc(100% - 50%);
    top: 0;
    height: 100%;
    z-index: 2;
    right: 50%;
    min-height: 600px;
    overflow: hidden;
    border-bottom-right-radius: 200px; }
    @media (max-width: 991.98px) {
      .site-blocks-cover .img-wrap {
        width: 100%;
        right: 0%;
        top: 0; }
        .site-blocks-cover .img-wrap .hero-slider:before {
          position: absolute;
          content: "";
          background: #fff;
          opacity: .5;
          z-index: 2;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0; } }
    .site-blocks-cover .img-wrap .slide {
      height: 100vh;
      position: relative; }
      .site-blocks-cover .img-wrap .slide img {
        position: absolute;
        top: 0;
        height: 100%;
        width: 100%;
        -o-object-fit: cover;
        object-fit: cover; }
  .site-blocks-cover .intro {
    z-index: 3;
    position: relative; }
    .site-blocks-cover .intro .heading {
      margin-left: -150px; }
      @media (max-width: 991.98px) {
        .site-blocks-cover .intro .heading {
          margin-left: 0; } }
    .site-blocks-cover .intro .text {
      padding-left: 50px; }
      @media (max-width: 991.98px) {
        .site-blocks-cover .intro .text {
          padding-left: 0; } }

.site-menu-toggle .menu-text {
  position: relative;
  top: -6px;
  text-transform: uppercase; }

.hero-slider .owl-nav {
  position: absolute;
  bottom: 120px;
  right: 50px;
  z-index: 100; }
  .hero-slider .owl-nav .owl-prev, .hero-slider .owl-nav .owl-next {
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    border-radius: 50%;
    background: #007bff;
    color: #fff;
    margin-bottom: 10px;
    font-size: 1.3rem; }
    .hero-slider .owl-nav .owl-prev span, .hero-slider .owl-nav .owl-next span {
      color: #fff;
      font-size: 30px; }
    .hero-slider .owl-nav .owl-prev:active, .hero-slider .owl-nav .owl-prev:focus, .hero-slider .owl-nav .owl-next:active, .hero-slider .owl-nav .owl-next:focus {
      outline: none; }

.btn-pill {
  border-radius: 30px;
  padding: 15px 30px;
  border-color: #fff;
  color: #fff; }
  .btn-pill:hover {
    background: #fff;
    border-color: #fff;
    color: #000; }
    
.dropdown-menu {
    background-color: #E6E7E8;
    min-width: 25rem;
}

/* mega menu 


.bg-white {
    background-color: #fff;
}

.navbar-brand {
    padding: 23.5px 20px;
    font-size: 18px;
}

.navbar-nav {
    width: 100%;
}

.nav-item {
    padding: 20px 8px;
    margin: 0px 3px;
    text-align: center;
    border-radius: 5px;
    font-size: 16px;
    color: grey;
    position: static;
}

.nav-item.active {
    color: #EF5350;
}

.nav-item:hover {
    color: #EF5350;
}

a {
    color: inherit !important;
}

.nav-link {
    padding: 5px;
}

.navbar-collapse.collapse.in {
    display: block !important;
}

.fa-angle-down {
    padding-left: 10px;
}

.fa-icon {
    font-size: 30px;
    color: #fff;
    background-color: pink;
    margin: 2px 10px 5px 0px;
    border-radius: 10px;
    width: 50px;
    height: 50px;
}

.dropdown-menu {
    margin-top: 0px;
    border: none;
    background-color: #F3E5F5;
    padding: 50px 50px 30px 50px;
}

#dropdown-menu1 {
    position: absolute;
    left: 165px;
}

#dropdown-menu2 {
    position: absolute;
    left: 285px;
}

#dropdown-menu3 {
    position: absolute;
    left: 415px;
}

.tab {
    margin-bottom: 20px;
    width: 230px;
}

.tab:hover {
    color: #E91E63 !important;
}

.dropdown-item {
    padding: 0px;
}

.dropdown-item:hover {
    background-color: inherit;
}

@media (max-width: 767px) {
    .nav-item {
        width: 100%; 
        text-align: left;
        padding-left: 10px;
    }

    .dropdown-menu {
        left: 0 !important;
        position: relative !important;
        padding: 20px;
    }
}
*/

/*event-timeline*/
.timeline {
    list-style: none;
    padding: 20px 0 20px;
    position: relative;
}

    .timeline:before {
        top: 0;
        bottom: 0;
        position: absolute;
        content: " ";
        width: 3px;
        background-color: #eeeeee;
        left: 50%;
        margin-left: -1.5px;
    }

    .timeline > li {
        margin-bottom: 20px;
        position: relative;
    }

        .timeline > li:before,
        .timeline > li:after {
            content: " ";
            display: table;
        }

        .timeline > li:after {
            clear: both;
        }

        .timeline > li:before,
        .timeline > li:after {
            content: " ";
            display: table;
        }

        .timeline > li:after {
            clear: both;
        }

        .timeline > li > .timeline-panel {
            width: 46%;
            float: left;
            border: 1px solid #d4d4d4;
            border-radius: 2px;
            padding: 20px;
            position: relative;
            -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
        }

            .timeline > li > .timeline-panel:before {
                position: absolute;
                top: 26px;
                right: -15px;
                display: inline-block;
                border-top: 15px solid transparent;
                border-left: 15px solid #ccc;
                border-right: 0 solid #ccc;
                border-bottom: 15px solid transparent;
                content: " ";
            }

            .timeline > li > .timeline-panel:after {
                position: absolute;
                top: 27px;
                right: -14px;
                display: inline-block;
                border-top: 14px solid transparent;
                border-left: 14px solid #fff;
                border-right: 0 solid #fff;
                border-bottom: 14px solid transparent;
                content: " ";
            }

        .timeline > li > .timeline-badge {
            color: #fff;
            width: 50px;
            height: 50px;
            line-height: 50px;
            font-size: 1.4em;
            text-align: center;
            position: absolute;
            top: 16px;
            left: 50%;
            margin-left: -25px;
            background-color: #CC1100;
            z-index: 100;
            border-top-right-radius: 50%;
            border-top-left-radius: 50%;
            border-bottom-right-radius: 50%;
            border-bottom-left-radius: 50%;
        }

        .timeline > li.timeline-inverted > .timeline-panel {
            float: right;
        }

            .timeline > li.timeline-inverted > .timeline-panel:before {
                border-left-width: 0;
                border-right-width: 15px;
                left: -15px;
                right: auto;
            }

            .timeline > li.timeline-inverted > .timeline-panel:after {
                border-left-width: 0;
                border-right-width: 14px;
                left: -14px;
                right: auto;
            }

.timeline-badge.primary {
    background-color: #2e6da4 !important;
}

.timeline-badge.success {
    background-color: #3f903f !important;
}

.timeline-badge.warning {
    background-color: #f0ad4e !important;
}

.timeline-badge.danger {
    background-color: #d9534f !important;
}

.timeline-badge.info {
    background-color: #5bc0de !important;
}

.timeline-title {
    margin-top: 0;
    color: inherit;
}

.timeline-body > p,
.timeline-body > ul {
    margin-bottom: 0;
}

    .timeline-body > p + p {
        margin-top: 5px;
    }

@media (max-width: 767px) {
    ul.timeline:before {
        left: 40px;
    }

    ul.timeline > li > .timeline-panel {
        width: calc(100% - 90px);
        width: -moz-calc(100% - 90px);
        width: -webkit-calc(100% - 90px);
    }

    ul.timeline > li > .timeline-badge {
        left: 15px;
        margin-left: 0;
        top: 16px;
    }

    ul.timeline > li > .timeline-panel {
        float: right;
    }

        ul.timeline > li > .timeline-panel:before {
            border-left-width: 0;
            border-right-width: 15px;
            left: -15px;
            right: auto;
        }

        ul.timeline > li > .timeline-panel:after {
            border-left-width: 0;
            border-right-width: 14px;
            left: -14px;
            right: auto;
        }
}

.btn-ct-white {
    background-color: #FFFFFF;
    border-color: #222222;
}

.glass{
    background: rgba( 255, 255, 255, 0.25 )!important;
    box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 )!important;
    backdrop-filter: blur( 5px );
}

.nav-link-dark {
    color: #222222!important;
}

.bg-ct-ice-gray {
    background-color: #E6E7E8!important;
}

.nav-tabs-pills-ct-darkest-gray {
    background-color: #222222!important;
}


/*
flip card
*/
.card-flip > div {
  backface-visibility: hidden;
  transition: transform 300ms;
  transition-timing-function: linear;
  width: 100%;
  height: 100%;
  margin: 0;
  display: flex;
}

.card-front {
  transform: rotateY(0deg);
}

.card-back {
  transform: rotateY(180deg);
  position: absolute;
  top: 0;
}

.card-flip:hover .card-front {
  transform: rotateY(-180deg);
}
  
.card-flip:hover .card-back {
  transform: rotateY(0deg);
}