section {

padding: 50px 0;

}

body, html {

height: 100%;
margin: 0;
opacity: 1;
transition: opacity 0.5s ease-in;

}

.wrapper {

@include media-breakpoint-up(md) {
  min-height: calc(100vh - 315px);
}

}

.content-default {

background-color: $white;
box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);
margin: 80px 0;
padding: 50px 10px;
@include media-breakpoint-up(md) {
  padding: 50px;
}

}

.section-indent {

margin-top: -100px;
@include media-breakpoint-down(md) {
  margin-top: 0;
}

}

.bg-navy {

color: $white;

}

.image-center-container {

height: 100%;
text-align: center;

img {
  min-height: 100%;
  min-width: 100%;
}
@include media-breakpoint-down(md) {
  img {
    max-width: 100%;
    min-width: 0;
  }
}

}

.modal-open {

position: fixed;

}

.program {

align-items: center;
display: -webkit-flex;
display: -ms-flex;
display: flex;
@include media-breakpoint-down(xs) {
  flex-wrap: wrap;
}

}

.program-body {

border-top: solid 1px $blue-grey;
margin-top: 1rem;
padding-top: 1rem;
@include media-breakpoint-up(sm) {
  border-left: solid 1px $blue-grey;
  border-top: 0;
  flex: 1;
  margin-left: 30px;
  margin-top: 0;
  padding-left: 30px;
  padding-top: 0;
}

}

.program-image {

flex-basis: 92px;
min-width: 92px;
@include media-breakpoint-down(xs) {
  flex-basis: 100%;
  margin-bottom: 1rem;
  min-width: 100%;
  text-align: center;
}

}

.section-dark {

background-color: #e4e8ea;

}

.timeline-section {

display: flex;
flex-wrap: wrap;

}

.timeline-section li {

list-style: none;
position: relative;
text-align: left;
width: 100%;
@extend .clearfix;

.timeline-item {
  padding: 0 50px;
  position: relative;

  &:before {
    background-color: #e2e2e2;
    border: 1px solid theme-color("primary");
    border-radius: 50%;
    content: "";
    display: block;
    height: 1rem;
    position: absolute;
    top: 6px;
    width: 1rem;
    z-index: 10;
  }
}

&:nth-child(2n) {
  padding-right: 50%;
  text-align: right;

  .timeline-item {
    &:before {
      right: -0.5rem;
    }
  }
}

&:nth-child(2n+1) {
  padding-left: 50%;

  .timeline-item {
    &:before {
      left: -0.5rem;
    }
  }
}

}

.timeline-wrapper {

min-height: 400px;
position: relative;

}

.timeline-section {

padding: 0;

}

.timeline-nested {

max-height: 0;
position: absolute;
top: 0;
transform: scale(0);
transition: all ease-in;
transition-delay: 0s;
transition-duration: 0.2s;

&:after {
  border-left: 1px solid theme-color("primary");
  bottom: 0;
  content: "";
  left: 50%;
  margin-left: -0.5px;
  position: absolute;
  top: -10px;
}

&.collapse-show {
  max-height: 900px;
  position: relative;
  transform: scale(1);
  transition-delay: 0.2s;
  transition-duration: 0.5s;
}

}

.timeline {

max-height: 450px;
transform: scale(1);
transition: all ease-in;
transition-delay: 0.2s;
transition-duration: 0.5s;

&:after {
  border-left: 1px solid theme-color("primary");
  bottom: 0;
  content: "";
  left: 50%;
  margin-left: -0.5px;
  position: absolute;
  top: -10px;
}

&.collapse-hide {
  max-height: 0;
  transform: scale(0);
  transition-delay: 0s;
  transition-duration: 0.2s;
}

}

.timeline-nested-close {

position: absolute;
top: 0;
z-index: 10;

}

.timeline-nested-title {

align-items: center;
background-color: theme-color("primary");
border-radius: 50%;
color: $white;
display: flex;
height: 100px;
justify-content: center;
margin: 0 auto 40px;
position: relative;
width: 100px;
z-index: 20;

h4 {
  margin-bottom: 0;
}

}

.card {

background-color: $white;
box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);
margin-bottom: 30px;

}

.card-horizontal {

@include media-breakpoint-up(md) {
  flex-direction: row;
}

.card-body {
  margin-left: 10px;
}

}

.section-footer {

padding: 30px 0 80px;

}

.section-bio {

margin-top: 50px;

}

.bio-wrapper {

background-color: $white;
box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);
margin-top: 20px;
padding: 50px;

}

.editor-link {

display: none;

}

.cms-editor-active .editor-link {

background-color: #f7e064;
display: block;
margin: 0 auto;
padding: 10px 20px;

}

.btn-link {

@extend .text-primary;

}

.fill-blue g, .fill-blue path {

fill: #546c7e;

} // Modal

.modal-open {

bottom: 0;
left: 0;
right: 0;
top: 0;

}

.modal-title {

color: $navy;
line-height: 1;

}

.modal-header {

padding: 1.5rem 2.5rem;

}

.modal-body {

max-height: 500px;
overflow: scroll;
padding: 0;

}

.modal-content {

border-radius: 0;
box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);

&:after {
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.78) 61%, $white);
  bottom: 0;
  content: "";
  height: 53px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
}

}

.modal-header .close {

padding: 0;

}

.modal-nav {

align-items: center;
display: -webkit-flex;
display: -ms-flex;
display: flex;
justify-content: space-between;
margin-bottom: 1rem;
padding: 0 2.5rem;

.breadcrumb {
  margin-bottom: 0;
}

} @media (max-width: 768px) {

.modal-body {
  padding: 0 40px;
}

} // Breadcrumb

.breadcrumb {

font-size: 12px;
font-weight: 500;

}

.breadcrumb-item {

a {
  @extend .text-info;
}

} // Dropdown

.dropdown-toggle {

font-size: 12px;

}

.dropdown-menu {

box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);

}

.dropdown-item {

font-size: 12px;
@extend .text-info;
font-weight: 500;

}

.dropdown-toggle {

white-space: nowrap;

}

.dropdown-toggle:after {

background-image: url("data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNTEyIiBoZWlnaHQ9IjUxMiIgdmlld0JveD0iMCAwIDQ1MS44NDcgNDUxLjg0NyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDUxLjg0NyA0NTEuODQ3OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgY2xhc3M9IiI+PGc+PGc+Cgk8cGF0aCBkPSJNMjI1LjkyMywzNTQuNzA2Yy04LjA5OCwwLTE2LjE5NS0zLjA5Mi0yMi4zNjktOS4yNjNMOS4yNywxNTEuMTU3Yy0xMi4zNTktMTIuMzU5LTEyLjM1OS0zMi4zOTcsMC00NC43NTEgICBjMTIuMzU0LTEyLjM1NCwzMi4zODgtMTIuMzU0LDQ0Ljc0OCwwbDE3MS45MDUsMTcxLjkxNWwxNzEuOTA2LTE3MS45MDljMTIuMzU5LTEyLjM1NCwzMi4zOTEtMTIuMzU0LDQ0Ljc0NCwwICAgYzEyLjM2NSwxMi4zNTQsMTIuMzY1LDMyLjM5MiwwLDQ0Ljc1MUwyNDguMjkyLDM0NS40NDlDMjQyLjExNSwzNTEuNjIxLDIzNC4wMTgsMzU0LjcwNiwyMjUuOTIzLDM1NC43MDZ6IiBkYXRhLW9yaWdpbmFsPSIjMDAwMDAwIiBjbGFzcz0iYWN0aXZlLXBhdGgiIHN0eWxlPSJmaWxsOiMwMDIzNEIiIGRhdGEtb2xkX2NvbG9yPSIjMDAyMzRiIj48L3BhdGg+CjwvZz48L2c+IDwvc3ZnPg==");
background-repeat: no-repeat;
background-size: contain;
border: 0;
height: 8px;
vertical-align: 0;
width: 9px;

} // Alerts @each $color, $value in $theme-colors {

.alert-#{$color} {
  .alert-close {
    @include alert-close-variant($value)
  }
}

}

.alert {

.close {
  position: absolute;
  right: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
}

} // Map

map {

height: 450px;
width: 100%;

}

.map-wrapper {

position: relative;
@include media-breakpoint-up(md) {
  .tiles-wrapper {
    max-width: 400px;
    position: absolute;
    right: 50px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 100;
  }
}

}

.sub-category-content {

img {
  display: block;
  height: auto;
  margin-bottom: 1rem;
  max-width: 100%;
}

}

.content-main {

a {
  text-decoration: underline;
}

} // Sidebar

.sidebar {

background-color: $white;
box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);
margin-bottom: 1rem;

}

.category {

.list-group-item {
  border: 0;
}

> a {
  color: $blue-grey;
  display: block;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.2px;
  line-height: 1.75;
  padding: 20px 21px;
  text-transform: capitalize;
  @include media-breakpoint-up(lg) {
    font-size: 20px;
    padding: 28px 30px;
  }

  &[data-toggle="collapse"] {
    position: relative;

    &:after {
      content: "\e903";
      font-size: 12px;
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%);
      font-family: 'icomoon' !important;
    }

    &.collapsed {
      position: relative;

      &:after {
        content: "\e902";
      }
    }
  }
}

&:not(.active) {
  position: relative;
  margin-top: -1px;

  [data-toggle="collapse"] {
    &:after {
      color: theme-color("secondary");
    }
  }

  .category-inactive {
    border-bottom: solid 1px #dee2e3;
  }
}

& + .category:not(.active) {
  position: relative;

  &:before {
    border-top: solid 1px #dee2e3;
    content: "";
    display: block;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    z-index: 10;
    @include media-breakpoint-up(lg) {
      right: 20px;
      left: 20px;
    }
  }
}

&.active {
  .category-active {
    background-color: theme-color("primary");
    color: $white;
  }
}

}

.sub-category {

padding: 20px 0;

.list-group-item {
  border: none;
  border: 0;
  color: theme-color("secondary");
  font-weight: 500;
  font-size: 14px;
  line-height: 1.5;
  padding: 11px 40px;
  text-transform: capitalize;
  @include media-breakpoint-up(lg) {
    color: $blue-grey;
    font-size: 16px;
    padding: 11px 30px;
  }

  &.sub-category-active {
    color: theme-color("secondary");
    position: relative;

    &:before {
      background-color: theme-color("primary");
      bottom: 5px;
      content: "";
      display: block;
      left: 0;
      position: absolute;
      top: 5px;
      width: 5px;
    }
  }
}

}

.component__body {

padding: 1rem;
margin: 1rem 0 0;
border: solid #f7f7f9;
border-width: 0.2rem 0 0;
border-width: 0.2rem;

}