body {
  line-height: 1.6;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  &.helix-ultimate-preloader {
    overflow: hidden;
    &:before {
      content: " ";
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 99998;
      background: rgba(255, 255, 255, 0.9);
    }
    &:after {
      content: "\f110";
      font-family: "FontAwesome";
      font-size: 36px;
      position: fixed;
      top: 50%;
      left: 50%;
      margin-top: -24px;
      margin-left: -24px;
      width: 48px;
      height: 48px;
      line-break: 48px;
      text-align: center;
      color: #007bff;
      -webkit-animation: fa-spin 2s infinite linear;
      animation: fa-spin 2s infinite linear;
      z-index: 99999;
    }
  }
}
h1 {
  letter-spacing: -1px;
}
a {
  transition: color 400ms, background-color 400ms, opacity 400ms;
}

a,
a:hover,
a:focus,
a:active {
  text-decoration: none;
}

label {
  font-weight: normal;
}

legend {
  padding-bottom: 10px;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

//Buttons
button {
  &:focus {
    outline: none;
  }
}
.sppb-btn {
  padding: 14px 25px;
  border-radius: 2px;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1.1px;
  cursor: pointer;
  &.sppb-btn-xlg {
    font-size: 18px;
    padding: 20px 45px;
  }
  &.sppb-btn-lg {
    padding: 18px 35px;
    font-size: 16px;
  }
  &.sppb-btn-sm {
    padding: 8px 20px;
  }
  &.sppb-btn-xs {
    padding: 4px 12px;
    font-size: 12px;
  }
  &.sppb-btn-primary {
    color: #fff;
    background-color: $link_color;
    &.sppb-btn-white {
      background-color: #fff;
      color: $link_color;
      &:hover,
      &:focus {
        background-color: darken(#fff, 3%);
      }
    }
    &.sppb-btn-outline {
      background-color: transparent;
      border: 2px solid $link_color;
      color: $link_color;
      &:hover,
      &:focus {
        background-color: $link_color;
        color: #fff;
      }
    }
    &:hover,
    &:focus {
      background-color: darken($link_color, 7%);
    }
  }
  &.sppb-btn-default {
    background-color: #fff;
    border-color: #fff;
    &:hover,
    &:focus {
      border-color: darken(#fff, 2%);
      background-color: darken(#fff, 2%);
    }
    &.sppb-btn-outline {
      border: 2px solid #fff;
      color: #fff;
      background-color: transparent;
      &:hover,
      &:focus {
        background-color: #fff;
        color: $text_color;
      }
    }
  }
  &.sppb-btn-link {
    background-color: transparent;
    padding: 0;
    color: $link_color;
    text-decoration: none !important;
    &.sppb-white {
      color: #fff;
    }
    &:focus,
    &:hover {
      opacity: 0.7;
    }
  }
}
.sppb-white {
  .sppb-btn.sppb-btn-link {
    color: #fff;
  }
}
.sppb-btn-white {
  .sppb-btn-primary {
    background-color: #fff;
    color: $link_color;
    border: none;
    padding: 16px 25px;
    &:hover,
    &:focus {
      background-color: darken(#fff, 3%);
    }
  }
}
//Topbar
#sp-top-bar {
  padding: 9px 0;
  font-size: 14px;
  .sp-module {
    display: inline-block;
    &:not(:last-child) {
      margin-right: 30px;
    }
  }
}

ul.social-icons {
  list-style: none;
  padding: 0;
  margin: -5px;
  display: inline-block;
  > li {
    display: inline-block;
    margin: 5px 7px;
  }
}

// language switcher
.sp-module-content {
  .mod-languages {
    ul.lang-inline {
      margin: 0;
      padding: 0;
      &.show {
        display: flex;
        flex-direction: column;
      }
      li {
        border: none;
        display: inline-block;
        margin: 0 5px 0 0;
        a {
          padding: 0 !important;
        }
        > a:before {
          display: none;
        }
      }
    }
  }

  // Latest Articles
  .latestnews {
    > li {
      > a {
        > span {
          display: block;
          margin-top: 5px;
          font-size: 85%;
        }
      }
    }
  }
}

.sp-contact-info {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  li {
    display: flex;
    margin-left: 10px;
    font-size: 14px;
    align-items: center;
    span {
      margin-right: 10px;
      font-size: 16px;
      color: $link_color;
    }
  }
}

// Header
#sp-header {
  height: $header_height;
  left: 0;
  position: relative;
  top: 0;
  width: 100%;
  z-index: 99;
  border-bottom: 1px solid #e6e6e6;
  .logo {
    height: $header_height;
    display: inline-flex;
    margin: 0;
    align-items: center;
    a {
      font-size: 24px;
      line-height: 1;
      margin: 0;
      padding: 0;
    }
    p {
      margin: 5px 0 0;
    }
  }
  &.header-sticky {
    position: fixed;
    z-index: 9999;
  }
}
#sp-header,
#sp-top-bar,
#sp-logo-wrap {
  .sp-module {
    margin-bottom: 0;
  }
}
// Page Title

#sp-title {
  min-height: 0;
}

.sp-page-title {
  box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
  background: #fff;
  padding: 60px 0px 70px 0px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  .sp-page-title-heading,
  .sp-page-title-sub-heading {
    margin: 0;
    padding: 0;
  }
  .sp-page-title-heading {
    font-size: 37px;
    font-weight: 400;
    margin-bottom: 10px;
    line-height: 1.4;
    color: darken($text_color, 50%);
  }
  .sp-page-title-sub-heading {
    font-size: 16px;
    font-weight: normal;
    line-height: 1.3;
    margin-top: 10px;
    opacity: 0.7;
  }
  .breadcrumb {
    background: none;
    padding: 0;
    margin: 10px 0 0 0;
    > .active {
      color: rgba(255, 255, 255, 0.8);
    }
    > span,
    > li,
    > li + li:before,
    > li > a {
      color: #fff;
    }
  }
}

// Body
.body-innerwrapper {
  overflow-x: hidden;
}
.layout-boxed .body-innerwrapper {
  max-width: 1240px;
  margin: 0 auto;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

#sp-main-body {
  padding: 100px 0;
}

.com-sppagebuilder #sp-main-body {
  padding: 0;
}

// Login Form

.login {
  img {
    display: inline-block;
    margin: 20px 0;
  }
  .checkbox {
    input[type="checkbox"] {
      margin-top: 6px;
    }
  }
}

.form-links {
  ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
}

// Search

.search {
  .btn-toolbar {
    margin-bottom: 20px;
    span.icon-search {
      margin: 0;
    }
    button {
      color: #fff;
    }
  }
  .phrases {
    .phrases-box {
      .controls {
        label {
          display: inline-block;
          margin: 0 20px 20px;
        }
      }
    }
    .ordering-box {
      margin-bottom: 15px;
    }
  }
  .only {
    label {
      display: inline-block;
      margin: 0 20px 20px;
    }
  }
  .search-results {
    dt.result-title {
      margin-top: 40px;
    }
    dt,
    dd {
      margin: 5px 0;
    }
  }
}

.filter-search {
  .chzn-container-single {
    .chzn-single {
      height: 34px;
      line-height: 34px;
    }
  }
}

.form-search {
  .finder {
    label {
      display: block;
    }
    .input-medium {
      width: 60%;
      border-radius: 4px;
    }
  }
}

.finder {
  .word {
    input {
      display: inline-block;
    }
  }
  .search-results.list-striped {
    li {
      padding: 20px 0;
    }
  }
}

// contentpane
.contentpane {
  &:not(.com-sppagebuilder) {
    padding: 20px;
  }
}

// Bottom

#sp-bottom {
  padding: 70px 0 40px;
  .sp-module {
    margin-bottom: 30px;
    .sp-module-title {
      font-weight: 700;
      font-size: 21px;
      margin: 0 0 30px;
      color: darken($text_color, 50%);
    }

    ul {
      list-style: none;
      padding: 0;
      margin: 0;
      > li {
        display: block;
        margin-bottom: 10px;
        &:last-child {
          margin-bottom: 0;
        }
        > a {
          display: block;
        }
      }
    }
  }
}

// Footer
#sp-footer {
  font-size: 14px;
  padding: 0;
  border-top: solid 1px #e3e3e3;
  border-bottom: solid 1px #e3e3e3;

  .container-inner {
    padding: 21px 0;
  }

  ul {
    &.menu {
      display: inline-block;
      list-style: none;
      padding: 0;
      margin: 0;
      li {
        display: inline-block;
        &:not(:last-child) {
          margin-right: 40px;
        }
        a {
          display: block;
          &:hover {
            background: none;
          }
        }
      }
    }
  }

  #sp-footer2 {
    text-align: right;
  }
}

// Coming soon
html.coming-soon {
  width: 100%;
  height: 100%;
  min-height: 100%;

  body {
    width: 100%;
    height: 100%;
    min-height: 100%;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
    background-repeat: no-repeat;
    background-position: 50% 40%;
  }
  .container {
    text-align: left;
  }
  .coming-soon-logo {
    display: inline-block;
    margin-bottom: 2rem;
  }

  #coming-soon-countdown {
    margin-top: 30px;
    max-width: 500px;

    .coming-soon-days,
    .coming-soon-hours,
    .coming-soon-minutes,
    .coming-soon-seconds {
      margin: 0;
      float: left;
      width: 25%;

      .coming-soon-number {
        width: 100%;
        font-size: 40px;
        letter-spacing: -1px;
        line-height: 1;
      }

      .coming-soon-string {
        font-size: 16px;
        letter-spacing: -1px;
        display: block;
        text-transform: uppercase;
      }
    }
  }
  .coming-soon-title {
    margin-bottom: 30px;
  }
  .coming-soon-content {
    opacity: 0.6;
  }
  .coming-soon-position {
    margin-top: 2rem;
  }

  .social-icons {
    margin-top: 50px;
    > li > a {
      width: 40px;
      height: 40px;
      opacity: 0.4;
      border: solid 1px #afafaf;
      display: inline-block;
      text-align: center;
      border-radius: 40px;
      line-height: 40px;
      color: #afafaf;
      &:hover,
      &:focus {
        color: $link_color;
        border-color: $link_color;
        opacity: 1;
      }
    }
  }
  .coming-soon-login form {
    display: inline-block;
  }
}

// error
html.error-page {
  width: 100%;
  height: 100%;

  body {
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
    background-repeat: no-repeat;
    background-position: 50% 40%;
  }

  .error-logo {
    display: inline-block;
    margin-bottom: 2rem;
  }

  .error-code {
    margin: 0 0 1rem;
    font-size: 67px;
    line-break: 1;
    color: darken($text_color, 50%);
  }

  .error-message {
    font-size: 28px;
    margin-bottom: 3rem;
    font-weight: 300;
    color: darken($text_color, 50%);
  }
  .error-img-wrap {
    text-align: center;
    .error-img {
      display: inline-block;
    }
  }
}

.sp-social-share {
  ul {
    display: block;
    padding: 0;
    margin: 20px -5px 0;
    li {
      display: inline-block;
      font-size: 24px;
      margin: 0 5px;
    }
  }
}

// profile
.profile {
  > div:not(:last-child) {
    margin-bottom: 30px;
  }
}

.dl-horizontal {
  dt {
    margin: 8px 0;
    text-align: left;
  }
}

// page-header
.page-header {
  padding-bottom: 15px;
}

// featured contact
table.category {
  width: 100%;
  thead,
  tbody {
    > tr {
      border: 1px solid #f2f2f2;
      th,
      td {
        padding: 10px;
      }
    }
  }
}

//contact from
.contact-form {
  .form-actions {
    background: none;
    border: none;
  }
}

@media print {
  .visible-print {
    display: inherit !important;
  }
  .hidden-print {
    display: none !important;
  }
}

// Preloader
.sp-preloader {
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 99999;
  > div {
    border-radius: 50%;
    height: 50px;
    width: 50px;
    top: 50%;
    left: 50%;
    margin-top: -25px;
    margin-left: -25px;
    position: absolute;
    animation: spSpin 0.75s linear infinite;
    &:after {
      content: "";
      position: absolute;
      width: 49px;
      height: 49px;
      top: 1px;
      right: 0;
      left: 0;
      margin: auto;
      border-radius: 50%;
    }
  }
}

.sp-scroll-up {
  display: none;
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  font-size: 16px;
  color: #fff;
  background: #333;
  border-radius: 3px;
  z-index: 1000;

  &:hover,
  &:active,
  &:focus {
    color: #fff;
    background: #444;
  }
}

// Forms
.control-group {
  margin-bottom: 1rem;
}

select.form-control:not([multiple]),
select.inputbox:not([multiple]),
select:not([multiple]) {
  height: calc(2.25rem + 2px);
}
.site {
  input[type="text"],
  input[type="email"],
  input[type="url"],
  input[type="date"],
  input[type="password"],
  input[type="search"],
  input[type="tel"],
  input[type="number"],
  select {
    display: block;
    width: 100%;
    border: none;
    border-radius: 2px;
    padding: 17px 20px;
    font-size: 14px;
    color: #495057;
    background-color: #fff;
    background-image: none;
    background-clip: padding-box;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;

    &:focus {
      color: #495057;
      background-color: #fff;
      border-color: #80bdff;
      outline: 0;
    }
  }
  textarea {
    border: none !important;
    border-radius: 2px;
  }
  select {
    height: 50px !important;
  }
}

.chzn-select,
.chzn-select-deselect {
  width: 100%;
}

.chzn-container {
  &.chzn-container-single {
    .chzn-single {
      display: block;
      width: 100%;
      padding: 0.5rem 0.75rem;
      font-size: 1rem;
      line-height: 1.25;
      height: calc(2.25rem + 2px);
      color: #495057;
      background-color: #fff;
      background-image: none;
      background-clip: padding-box;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-radius: 0.25rem;
      transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
      box-shadow: none;

      div {
        width: 30px;
        background: none;
        > b {
          background: none;
          position: relative;
          &:after {
            content: "\f0dc";
            font-family: FontAwesome;
            font-size: 0.875rem;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
          }
        }
      }
    }

    &.chzn-container-active {
      &.chzn-with-drop {
        .chzn-single {
          border-radius: 0.25rem 0.25rem 0 0;
        }
      }
    }

    .chzn-search {
      padding: 0.625rem;
      input[type="text"] {
        display: block;
        width: 100%;
        padding: 0.5rem 1.429rem 0.5rem 0.75rem;
        font-size: 0.875rem;
        line-height: 1.25;
        height: calc(2rem + 2px);
        color: #495057;
        background-color: #fff;
        background-image: none;
        background-clip: padding-box;
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 0.25rem;
        transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
        box-shadow: none;
        -webkit-box-shadow: none;

        &:focus {
          border-color: #80bdff;
          outline: 0;
          box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
          -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
        }
      }

      &:after {
        content: "\f002";
        font-family: FontAwesome;
        font-size: 0.875rem;
        color: rgba(0, 0, 0, 0.2);
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
      }
    }

    .chzn-drop {
      border-color: rgba(0, 0, 0, 0.15);
      border-radius: 0 0 0.25rem 0.25rem;
      box-shadow: none;
      -webkit-box-shadow: none;
    }

    .chzn-results {
      li {
        &.highlighted {
          background-image: none !important;
        }
      }
    }
  }

  &.chzn-container-multi {
    .chzn-choices {
      display: block;
      width: 100%;
      padding: 0 0.75rem;
      min-height: calc(2.25rem + 2px);
      line-height: 1.25;
      background-color: #fff;
      background-image: none;
      background-clip: padding-box;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-radius: 0.25rem;
      transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
      box-shadow: none;
      -webkit-box-shadow: none;

      li {
        &.search-field {
          input[type="text"] {
            font-size: 0.875rem;
            font-weight: normal;
            line-height: 1.25;
            height: calc(2rem + 2px);
            background-color: #fff;
          }
        }

        &.search-choice {
          margin: 5.5px 5px 0 0;
          padding: 5px 20px 5px 5px;
          background-image: none;
          background-color: #f5f5f5;
          border-color: rgba(0, 0, 0, 0.1);
          box-shadow: none;
          -webkit-box-shadow: none;

          .search-choice-close {
            background: none;
            top: 5px;
            color: rgba(0, 0, 0, 0.2);
            &:hover {
              color: rgba(0, 0, 0, 0.5);
            }
            &:after {
              content: "\f00d";
              font-family: FontAwesome;
              font-size: 0.875rem;
              position: absolute;
              top: 0;
              right: 0;
            }
          }
        }
      }
    }

    &.chzn-with-drop {
      &.chzn-container-active {
        .chzn-choices {
          border-radius: 0.25rem;
        }
      }
      .chzn-drop {
        margin-top: -4px;
        border: none;
        border-radius: 0;
        box-shadow: none;
        -webkit-box-shadow: none;

        .chzn-results {
          &:not(:empty) {
            padding: 0.75rem;
            background: #fff;
            border: 1px solid rgba(0, 0, 0, 0.15);
            border-top: 0;
            border-radius: 0 0 0.25rem 0.25rem;
          }

          li {
            &.no-results {
              background: none;
            }
          }
        }
      }
    }
  }
}

// Form control
.form-horizontal {
  .control-label {
    float: left;
    width: auto;
    padding-top: 5px;
    padding-right: 5px;
    text-align: left;
  }

  .controls {
    margin-left: 220px;
  }
}

.card-block {
  padding: 20px;
  ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block;
    li {
      display: block;
    }
  }
}

// Alerts
.alert {
  &.alert-error {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
  }
}

// Cookie
#sp-cookie-consent {
  position: fixed;
  font-size: 16px;
  font-weight: 500;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 10001;

  > div {
    padding: 20px;
    position: relative;
  }
}
.form-check-inline {
  input[type="radio"] {
    display: none;
  }
}
#attrib-helix_ultimate_blog_options {
  #jform_attribs_helix_ultimate_article_format {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    .form-check-inline {
      margin: 0;
      margin-right: -5px;
      label {
        display: inline-block;
        padding: 4px 12px;
        margin-bottom: 0;
        font-size: 13px;
        line-height: 18px;
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
        background-color: #f3f3f3;
        color: #333;
        border-top: 1px solid #b3b3b3;
        border-right: 1px solid #b3b3b3;
        border-bottom: 1px solid #b3b3b3;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        border-radius: 0;
        &.btn-success {
          background: #46a546;
          color: #fff;
        }
        input[type="radio"] {
          display: none !important;
        }
      }
      &:last-child {
        label {
          border-top-right-radius: 3px;
          border-bottom-right-radius: 3px;
        }
      }
      &:first-child {
        label {
          border-left: 1px solid #b3b3b3;
          border-top-left-radius: 3px;
          border-bottom-left-radius: 3px;
        }
      }
    }
  }
}
.com-contenthistory {
  .btn-group {
    display: flex;
    justify-content: flex-end;
    button {
      display: inline-block;
      padding: 4px 12px;
      margin-bottom: 0;
      font-size: 13px;
      line-height: 18px;
      text-align: center;
      vertical-align: middle;
      cursor: pointer;
      color: #333;
      text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
      background-color: #f5f5f5;
      background-repeat: repeat-x;
      border: 1px solid #bbb;
      border-bottom-color: #a2a2a2;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
      &:hover {
        color: #333;
        background-color: #e9e9e9;
      }
    }
  }
}
#versionsModal {
  top: 10%;
  .modal-dialog {
    max-width: 80%;
  }
  iframe {
    min-height: 300px;
  }
}

// Login Popup
.close-icon {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 30px;
  overflow: hidden;
  &:before,
  &:after {
    content: "";
    position: absolute;
    height: 2px;
    width: 100%;
    top: 50%;
    left: 0;
    margin-top: -1px;
    background: #000;
    transition: 0.3s;
  }
  &:before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  &:after {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}
body.login-open {
  overflow: hidden;
}
#login {
  display: none;
  animation: fadeIn 0.3s;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f4f4f4;
  height: 100%;
  z-index: 9999;
  .container-fluid {
    &,
    .row {
      height: 100%;
    }
    > .row {
      align-items: center;
    }
    .login-info-col {
      position: initial;
    }
  }
  .login-bg-img {
    background-image: url(../images/login-sidebar-img.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 100%;
  }
  .login-info-wrapper {
    max-width: 450px;
    padding-left: 65px;
    color: darken($text_color, 50%);
    text-align: left;
    a {
      color: $text_color;
      &:hover,
      &:focus {
        color: $link_color;
      }
    }
    h2 {
      font-weight: 700;
      font-size: 37px;
      margin-bottom: 30px;
      text-transform: uppercase;
    }
    #form-login-remember {
      color: $text_color;
    }
    .reg-link {
      font-size: 16px;
      margin-top: 30px;
    }
  }
  button.close {
    position: absolute;
    top: 20px;
    right: 20px;
    opacity: 1;
    transition: 0.3s;
    &:hover,
    &:focus {
      .close-icon {
        &:before,
        &:after {
          background: $link_color;
        }
      }
    }
  }
}
.sp-custom-login.sp-mod-login {
  .info-text {
    .sppb-btn-link {
      font-size: 14px;
      text-transform: inherit;
      font-weight: 400;
      letter-spacing: 0px;
      display: flex;
      align-items: center;
      i {
        margin-right: 7px;
        font-size: 16px;
      }
    }
  }
}
.sp-custom-login-on {
  position: relative;
  .icons-wrap {
    .user-icon {
      font-size: 16px;
      margin-right: 5px;
    }
    .log-text {
      font-size: 13px;
      font-weight: 500;
    }
  }
  .arrow-icon {
    font-size: 12px;
    margin-left: 5px;
  }
  .form-login-wrap {
    position: absolute;
    top: 100%;
    display: none;
    -webkit-animation: fadeInDown 0.5s;
    animation: fadeInDown 0.5s;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    z-index: 10;
    right: 0px;
    padding-top: 9px;
    .login-greeting {
      margin-bottom: 10px;
    }
    .form-users-wrapper {
      font-size: 14px;
      min-width: 120px;
      border: 1px solid #e0e0e0;
      background: #fff;

      ul.menu {
        list-style: none;
        font-weight: 600;
        padding: 20px;
        margin-bottom: 0;
        border-bottom: 1px solid #efeff3;
        > li:not(:last-child) {
          margin-bottom: 15px;
        }
      }
      .logout-button {
        font-weight: 600;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        text-align: center;
        padding: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        &:hover,
        &:focus {
          color: $link_color;
          cursor: pointer;
          text-decoration: none;
          input[type="submit"] {
            color: $link_color !important;
          }
        }
        i.fa {
          font-size: 16px;
          margin-right: 10px;
          color: $text_color;
        }
        input[type="submit"] {
          font-size: 14px;
          font-weight: 600;
          cursor: pointer;
          color: $text_color !important;
        }
      }
    }
  }
  &:hover {
    .form-login-wrap {
      display: block;
    }
  }
}

// Header
#sp-logo {
  .logo {
    display: flex;
    align-items: center;
    .logo-slogan {
      font-size: 14px;
      margin-left: 20px;
      padding-left: 20px;
      border-left: 1px solid rgba(0, 0, 0, 0.18);
      letter-spacing: 0.7px;
    }
  }
}
#sp-logo-wrap {
  padding: 25px 0;
  background-color: #fff;
  border-bottom: 1px solid #e6e6e6;
}
#sp-menu {
  > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    .sp-module {
      order: 2;
    }
    .sp-megamenu-wrapper {
      order: 1;
    }
  }
}
.top-services {
  ul.menu {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    > li {
      &:not(:last-child) {
        margin-right: 50px;
      }
      > a {
        position: relative;
        &:before {
          content: "";
          position: absolute;
          bottom: -14px;
          left: 50%;
          border-left: 7px solid transparent;
          border-right: 7px solid transparent;
          border-bottom: 7px solid #fff;
          width: 0;
          height: 0;
          transform: translateX(-50%);
          opacity: 0;
          transition: 0.3s;
        }
        &:hover,
        &:focus {
          &:before {
            opacity: 1;
          }
        }
      }
      &.active {
        > a {
          opacity: 1;
          &:before {
            opacity: 1;
          }
        }
      }
    }
  }
}
.mod-languages {
  display: flex;
  .globe-icon {
    font-size: 16px;
  }
  a.btn.dropdown-toggle {
    padding: 0;
    line-height: 1;
    font-size: 14px;
  }
  img {
    display: none;
  }
  .lang-inline {
    min-width: auto;
    padding: 5px 10px !important;
    font-size: 12px;
    a {
      color: $text_color !important;
      &:hover,
      &:focus {
        color: $link_color !important;
      }
    }
  }
}
.map-link {
  .sppb-addon-title {
    display: flex;
    align-items: center;
  }
  span.fa {
    font-size: 16px;
    margin-right: 5px;
    font-family: "finatic" !important;
    &:before {
      content: "\e93c";
    }
  }
}
#sp-top2 {
  > div {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}
#sp-logo-right {
  .sp-column {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    > .sp-module {
      margin-left: 30px;
    }
  }
  .sp-contact-info {
    span.fa {
      font-size: 18px;
      margin-right: 10px;
    }
  }
  a {
    color: $text_color;
  }
  .search {
    form {
      position: relative;
    }
    &:after {
      top: 50%;
      right: 10px;
      transform: translateY(-50%);
      font-size: 20px;
      color: $link_color;
    }
    input {
      border-radius: 2px;
      background: transparent;
      border: solid 1px #d9d9d9;
      padding: 7px 35px 7px 15px;
      &::placeholder {
        color: #afafaf;
        font-style: italic;
      }
    }
  }
}
.border-link-color {
  border-color: $link_color !important;
}
.icon-link-color {
  a {
    color: $link_color !important;
  }
  .sppb-addon-title-icon {
    color: $link_color;
  }
}
.text-dark-color,
.header-dark .sppb-addon-title {
  color: darken($text_color, 50%);
}
.custom-map-icon {
  span.fa {
    font-size: 16px;
    margin-right: 5px;
    font-family: "finatic" !important;
    &:before {
      content: "\e93c";
    }
  }
}
.link-color {
  color: $link_color;
}
.dark-link-color {
  color: darken($link_color, 20%);
}

//finatic-testimonial-slider
.finatic-testimonial-slider {
  .owl-stage {
    display: flex;
  }
  .last-owl-active-item {
    .item {
      border-right: none !important;
    }
  }
  .item {
    border-right: solid 1px rgba(127, 127, 127, 0.35);
    padding-right: 30px;
    padding-bottom: 50px;
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
    transition: 0.3s;
    opacity: 0.8;
    &:hover {
      opacity: 1;
    }
    h3 {
      font-size: 21px;
      font-weight: 400;
      line-height: 1.43;
      margin-bottom: 20px;
    }
    .finatic-testimonial-footer {
      display: flex;
      align-items: center;
      img {
        max-width: 40px;
        border-radius: 40px;
        margin-right: 15px;
      }
      p {
        margin: 0;
      }
    }
  }
}
.hero-section {
  &:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 225px;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75));
  }
  .hero-elements-column {
    max-width: 1110px;
    margin-left: auto;
    margin-right: auto;
  }
}
.sppb-modal-selector span.text {
  letter-spacing: 1.1px;
}

//finatic-services
.finatic-services {
  overflow: hidden;
  .owl-stage {
    padding-bottom: 2px;
  }
  .item {
    .item-info {
      box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
      background: #fff;
      margin: -189px 25px 0px 25px;
      position: relative;
      h3 {
        margin: 0;
        padding: 30px;
        font-size: 21px;
        font-weight: 400;
        color: darken($text_color, 50%);
      }
      .finatic-service-items {
        padding: 0;
        margin: 0;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        > li {
          border-bottom: solid 1px #e3e3e3;
          border-right: solid 1px #e3e3e3;
          flex: 0 0 50%;
          max-width: 50%;
          padding: 30px;
          display: flex;
          align-items: center;
          transition: 0.3s;
          position: relative;
          .full-link {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
          }
          &:hover {
            background-color: rgba(175, 175, 175, 0.1);
          }
          &:nth-child(2n) {
            border-right: none;
          }
          &:nth-last-child(1),
          &:nth-last-child(2) {
            border-bottom: none;
          }
          i {
            font-size: 40px;
            margin-right: 15px;
            color: $link_color;
          }
          p {
            margin: 0;
            line-height: 1.4;
            max-width: 130px;
          }
        }
      }
      .sppb-btn {
        padding: 15px 30px;
        display: flex;
        justify-content: space-between;
        font-weight: 400;
        color: $text_color;
        opacity: 0.7;
        border-top: solid 1px #e3e3e3;
        &:hover,
        &:focus {
          opacity: 1;
          color: $link_color;
        }
      }
    }
  }
  .owl-nav button {
    width: 50px;
    height: 100px;
    border: solid 2px #ffffff !important;
    border-left: none !important;
    background-color: rgba(255, 255, 255, 0.3) !important;
    font-size: 30px !important;
    position: absolute;
    top: 50%;
    left: -60px;
    transform: translateY(-50%);
    border-radius: 0px 100px 100px 0px;
    color: #fff !important;
    box-shadow: 1px 0px 3px 0px rgba(0, 0, 0, 0.3);
    transition: 0.3s;
    i.fa {
      margin-left: -10px;
    }
    &.owl-next {
      right: -60px;
      left: auto;
      border-radius: 100px 0px 0px 100px;
      border-left: solid 2px #ffffff !important;
      border-right: none !important;
      box-shadow: -1px 0px 3px 0px rgba(0, 0, 0, 0.3);

      i.fa {
        margin-left: 10px;
      }
    }
    &:hover,
    &:focus {
      background-color: $link_color !important;
      border-color: $link_color !important;
    }
  }
  &:hover {
    .owl-nav button {
      left: 0;
      &.owl-next {
        right: 0;
        left: auto;
      }
    }
  }
  .owl-carousel {
    .item {
      padding-bottom: 49px;
      .item-info {
        margin: 0px 30px;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        h3 {
          padding: 30px;
        }
        .sppb-btn {
          padding: 15px 30px;
        }
      }
    }
    .owl-nav button {
      margin-top: -30px;
    }
  }
  &.gird-layout {
    .item {
      position: relative;
      padding-bottom: 60px;
      margin-bottom: 30px;
      .item-info {
        position: absolute;
        bottom: 11px;
        left: 0;
        right: 0;
        margin: 0 25px;
      }
    }
  }
}
.link-color-bg,
.link-overlay-bg {
  background-color: $link_color;
}
.darklink-color-bg {
  background-color: darken($link_color, 15%);
}
.free-consultation {
  .sppb-form-builder-btn {
    width: auto;
  }
  .sppb-ajax-contact-status {
    background: rgba(255, 255, 255, 0.7);
    padding: 8px 16px;
    font-size: 14px;
  }
}
.explore-case-study {
  .overlay-background-style {
    background-color: rgba($link_color, 0.9) !important;
  }
  .overlay-image-button-wrap {
    .sppb-btn {
      i.fa {
        font-size: 150%;
        margin-right: 10px;
      }
    }
  }
  .title-subtitle-top-left .overlay-image-title {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .sppb-addon-subtitle {
    margin-bottom: auto;
  }
}
.sppb-addon-articles {
  .sppb-addon-content {
    text-align: center;
    .sppb-row {
      text-align: left;
    }
    > .sppb-btn {
      margin-top: 30px;
    }
  }
  .sppb-addon-article {
    .sppb-article-img-wrap {
      display: block;
      height: 250px;
      background-repeat: no-repeat;
      background-size: cover;
    }
    .sppb-article-info-wrap {
      background: #fff;
      padding: 20px 30px 0px 30px;
      box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
      position: relative;
      h3 {
        font-size: 21px;
        font-weight: 400;
        line-height: 1.5;
        a {
          color: darken($text_color, 50%);
          &:hover,
          &:focus {
            color: $link_color;
          }
        }
      }
    }
    .sppb-article-introtext {
      margin-top: 11px;
    }
    .sppb-readmore {
      margin-top: 30px;
      margin-left: -30px;
      margin-right: -30px;
      border-top: 1px solid #e3e3e3;
      display: block;
      letter-spacing: 1.13px;
      color: #afafaf;
      text-transform: uppercase;
      font-size: 14px;
      padding: 15px 30px;
      position: relative;
      &:hover,
      &:focus {
        color: $link_color;
      }
      &:after {
        content: "\e93f";
        font-family: "finatic" !important;
        float: right;
      }
    }
  }
  &.case-study-default-layout,
  &.case-study-classic-layout {
    .sppb-addon-article {
      .sppb-article-img-wrap {
        height: 300px;
      }
      .sppb-article-info-wrap {
        margin: -70px 25px 0px 25px;
      }
    }
  }
  &.case-study-classic-layout {
    .sppb-addon-content > div > div {
      &:nth-child(1) {
        flex: 0 0 68%;
        max-width: 68%;
        .sppb-article-introtext {
          display: block;
        }
      }
      &:nth-child(2) {
        flex: 0 0 32%;
        max-width: 32%;
      }
    }
    .sppb-article-introtext {
      display: none;
    }
  }
  &.case-study-creative-layout {
    .sppb-row > div {
      &:nth-child(2n) {
        .sppb-addon-article {
          flex-direction: row-reverse;
          .sppb-article-info-wrap {
            margin: 40px -70px 40px 0px;
          }
        }
      }
    }
    .sppb-addon-article {
      display: flex;
      flex-wrap: wrap;
      max-width: 100%;
      .sppb-article-img-wrap {
        flex: 0 0 60%;
        height: 380px;
      }
      .sppb-article-info-wrap {
        flex: 0 0 46%;
        margin: 40px 0px 40px -70px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding: 40px 40px 0px 40px;
        .sppb-readmore {
          margin-left: -40px;
          margin-right: -40px;
          padding: 15px 40px;
        }
        .sppb-article-introtext {
          margin-bottom: auto;
        }
      }
    }
  }
}
.custom-icon {
  font-size: 54px;
  color: $link_color;
}
.advance-slideshow {
  .sppb-inner-wrapper {
    max-width: 690px;
  }
  .slider-video-popup {
    display: none;
  }
  .sp-item.active .slider-video-popup {
    display: block;
    animation-delay: 0.6s;
    animation-name: fadeInLeft;
    animation-duration: 0.8s;
    animation-fill-mode: both;
  }
  .prev-control.nav-control {
    .fa {
      margin-left: 35px;
    }
  }
  .next-control.nav-control {
    .fa {
      margin-right: 35px;
    }
  }
}
.slider-video-popup {
  .sppb-modal-selector {
    background: #fff;
    padding: 10px 30px 10px 10px;
    border-radius: 5px;
    > span:nth-child(1) {
      width: 80px;
      height: 80px;
      text-align: center;
      background-image: url(../images/video-popup-bg.jpg);
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
      border-radius: 5px;
      display: flex !important;
      align-items: center;
      justify-content: center;
      margin-right: 30px;
      position: relative;
      overflow: hidden;
      &:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #000;
        opacity: 0.4;
      }
      .fa {
        position: relative;
        color: #fff;
      }
    }
    .text {
      text-transform: uppercase;
      color: #828282;
      line-height: 1.5;
      font-weight: 300;
      .subtext {
        display: block !important;
        font-size: 21px;
        font-weight: 700;
        margin-top: 15px;
        text-transform: initial;
        letter-spacing: 0px;
        color: $link_color;
      }
    }
  }
}
.sppb-testimonial-pro {
  padding-bottom: 60px;
  &.finatic-testimonial {
    background-color: $link_color;
    padding: 100px;
    .sppb-addon-testimonial-pro-footer {
      align-items: center;
      .sppb-addon-testimonial-pro-client-name {
        color: #fff;
      }
    }
    .sppb-carousel-indicators {
      bottom: 50px;
      li {
        border: none;
        background: #fff;
        opacity: 0.15;
        transition: 0.3s;
        margin-right: 10px;
        &.active {
          background: #fff;
          opacity: 1;
        }
      }
    }
  }
  .sppb-testimonial-message {
    font-style: italic;
  }
  .sppb-carousel-indicators {
    li {
      border: none;
      background: rgba(5, 5, 5, 0.15);
      transition: 0.3s;
      margin-right: 10px;
      &.active {
        background: $link_color;
      }
    }
  }
  .sppb-addon-testimonial-pro-footer {
    flex-direction: column;
    .sppb-addon-testimonial-pro-client-name {
      color: $link_color;
    }
    .testimonial-pro-client-name-wrap {
      margin-top: 15px;
    }
  }
}
.hero-contact-info-wrapper {
  position: absolute;
  top: 50%;
  width: auto;
  height: auto;
  transform: translateY(-50%);
  left: 50px;
  &.right {
    left: auto;
    right: 50px;
    .hero-contact-info ul li i.fa {
      margin: 0;
    }
  }
}
.hero-contact-info {
  ul li {
    margin-bottom: 18px;
    i.fa {
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      border: 1px solid rgba(255, 255, 255, 0.3);
      border-radius: 50px;
      margin-right: 20px;
      transition: 0.3s;
      &:hover {
        border: 1px solid rgba(255, 255, 255, 1);
        cursor: pointer;
        & + .sppb-icons-label-text {
          opacity: 1;
          visibility: visible;
        }
      }
    }
    .sppb-icons-label-text {
      background: rgba(255, 255, 255, 0.3);
      padding: 9px 15px;
      border-radius: 3px;
      position: relative;
      opacity: 0;
      visibility: hidden;
      transition: 0.3s;
      &:before {
        content: "";
        border-right: 5px solid rgba(255, 255, 255, 0.3);
        border-left: 5px solid transparent;
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
        height: 0;
        width: 0;
        position: absolute;
        left: -10px;
        top: 50%;
        transform: translateY(-50%);
      }
    }
    // &:hover{
    // 	i.fa{
    // 		border: 1px solid rgba(255, 255, 255, 1);
    // 	}
    // 	.sppb-icons-label-text{
    // 		opacity: 1;
    // 	}
    // }
  }
}
.classic-clients {
  img {
    padding: 25px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    transition: 0.3s;
    &:hover {
      border-color: #fff;
    }
  }
}
.light-btn-outline {
  .sppb-btn-default.sppb-btn-outline {
    border: 1px solid rgba(255, 255, 255, 0.2);
    &:hover,
    &:focus {
      border-color: #fff;
    }
  }
}
.wrapper-shadow {
  box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
}
.sppb-addon-tab {
  .sppb-nav {
    > li {
      &.active > a {
        background-color: #fff;
        color: $link_color;
        border: none;
        box-shadow: 0 -1px 2px 0 rgba(209, 209, 209, 0.5);
      }
      > a {
        border: none;
        text-transform: uppercase;
        padding: 25px 40px;
        color: #828282;
        background-color: transparent;
      }
    }
  }
  .sppb-tab-content {
    background: #fff;
    margin: 0;
    padding: 50px;
    box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
  }
}
.tab-features-list {
  list-style: none;
  padding: 0;
  font-size: 14px;
  line-height: 1.7;
  > li {
    display: flex;
    align-items: baseline;
    &:not(:last-child) {
      margin-bottom: 20px;
    }
    span {
      color: $link_color;
      margin-right: 15px;
    }
  }
}
.more-z-index {
  z-index: 10 !important;
}
.light-text {
  opacity: 0.5;
  font-weight: 100;
}
.contact-info-box {
  .sppb-addon-title {
    padding: 15px 30px;
    border-bottom: 1px solid #e3e3e3;
  }
  .sppb-addon-content {
    padding: 30px;
    ul {
      margin: 0;
      padding: 0;
      list-style: none;
      > li {
        &:not(:last-child) {
          margin-bottom: 15px;
        }
        span {
          font-size: 18px;
          margin-right: 15px;
          color: $link_color;
          &.fn-address {
            font-size: 160%;
          }
        }
      }
    }
  }
}
.sppb-addon-accordion {
  font-size: 14px;
  .sppb-panel-faq > .sppb-panel-heading {
    border: none;
    background: #fbfbfc;
    padding: 14px 30px 14px 20px;
    margin-bottom: 20px;
    &.active {
      box-shadow: 0 1px 2px 0 #d1d1d1;
      color: $link_color;
      .sppb-toggle-direction {
        color: $link_color;
      }
    }
    border-radius: 3px;
    .sppb-panel-title {
      font-weight: 400;
    }
    .sppb-toggle-direction {
      font-size: 11px;
      color: #828282;
    }
  }
  .sppb-panel.sppb-panel-faq {
    .sppb-panel-body {
      border: none;
    }
  }
}
.finatic-advance-tab {
  .sppb-tab-content.sppb-tab-tabs-content {
    background-color: transparent;
    box-shadow: none;
    padding: 0;
    .sppb-tab-pane {
      &.active {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        max-width: 100%;
      }
      > div {
        flex: 0 0 50%;
        max-width: 50%;
        &:nth-child(1) {
          padding-right: 20px;
        }
        &:nth-child(2) {
          padding-left: 40px;
          padding-right: 100px;
        }
      }
    }
  }
  .sppb-nav-tabs {
    border-bottom: 2px solid rgba(175, 175, 175, 0.4);
    margin-bottom: 80px;
    > li {
      margin-bottom: 0;
      border-left: 30px solid #f4f4f4;
      border-right: 30px solid #f4f4f4;
      transition: 0.3s;
      > a {
        font-size: 21px;
        font-weight: 400;
        color: darken($text_color, 50%);
        background: transparent;
        box-shadow: none;
        padding: 45px 30px;
        transition: 0.3s;
        margin: 0;
        box-shadow: none !important;
        border: none !important;
        text-transform: initial;
        &:before {
          content: "";
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          background-image: url(../images/tab-active-bg.png);
          background-repeat: no-repeat;
          background-size: cover;
          background-position: center center;
          transition: 0.3s;
          opacity: 0;
        }
        span {
          display: block;
          font-size: 50px;
          margin-bottom: 20px;
          color: $link_color;
          transition: 0.3s;
        }
      }
      &.active {
        position: relative;
        transform: translateY(30px);
        > a {
          color: #fff;
          background: $link_color;
          span {
            color: #fff;
          }
          &:before {
            opacity: 1;
          }
        }
      }
    }
  }
}
.sppb-modal-selector.sppb-magnific-popup {
  position: relative;
}
.sppb-addon-person {
  .sppb-addon-content {
    > div {
      align-items: center;
    }
  }
  .sppb-person-information {
    border-bottom: solid 1px rgba(175, 175, 175, 0.7);
  }
  .sppb-person-information span.sppb-person-designation {
    color: darken($text_color, 50%);
  }
}

.login,
#member-registration {
  .input-group {
    .input-group-text {
      display: none;
    }
  }
}
.custom-full-menu {
  .sp-menu-full {
    > .sp-dropdown-inner > .row > div:nth-child(2) {
      .sp-mega-group {
        display: flex;
        margin: -20px;
        > li {
          flex: 0 0 50%;
          max-width: 50%;
          padding: 20px;
        }
      }
    }
  }
}

/************************************************************************/
/********* **************** Start Blog Listing ********* ****************/
/************************************************************************/
.article-can-edit{
	position: relative;
	z-index: 10;
	>a {
    background: #fff;
    display: inline-block;
    padding: 6px 20px;
    box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    border-radius: 2px;
	}
}
.finatic-blog {
  //Start Top News scroller
  .blog-list-news-scroller {
    .bx-wrapper {
      margin-bottom: 0;
      .bx-viewport {
        padding-bottom: 60px;
      }
      img {
        width: 100%;
      }
      .sppb-articles-carousel-content {
        margin: 0 25px;
        padding: 0px;
        position: relative;
        position: absolute;
				bottom: -50px;
				left: 0;
				right: 0;
        background-color: #fff;
        box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
        .sppb-articles-carousel-meta {
          padding: 25px 30px 0;

          span {
            font-weight: 400 !important;
            color: #afafaf;
          }
        }
        .sppb-articles-carousel-link {
          padding: 0 30px 30px 30px;
          margin: 5px 0 0 0;
          font-size: 21px;
          font-weight: 400;
          line-height: 28px;
          color: #050505;
          border-bottom: solid 1px #e3e3e3;

          &:hover {
            color: $link_color;
          }
        }
        .sppb-articles-carousel-meta-category {
          a {
            padding: 12px 0 15px 30px;
            margin: 0;
            font-size: 14px;
            font-weight: 400;
            letter-spacing: 1.15px;
            color: #afafaf;
            text-transform: uppercase;

            &:hover {
              color: $link_color;
            }
          }
        }
      }
      .bx-controls {
        top: 40% !important;

        .bx-controls-direction {
          a {
            width: 100px;
            height: 100px;
            line-height: 100px;
            background-color: rgba(255, 255, 255, 0.2);
            border-radius: 100%;
            border: solid 2px #fff;
            color: #fff;
            transition: 400ms;
            box-shadow: 1px 0px 3px 0px rgba(0, 0, 0, 0.3);
            i.fa {
              margin-left: 45px;
            }

            &:hover {
              background-color: $link_color;
              border: solid 2px $link_color;
            }
          }
          a.bx-next {
            right: -45px;
            left: auto;
						i.fa {
              margin-left: 0px;
              margin-right: 45px;
            }
          }

          a.bx-prev {
            left: -45px;
          }
        }
        .bx-default-pager {
          display: none;
        }
      }
    }
  }

  // Right/Left Side Bar
  #sp-right,
  #sp-left {
    .sp-module {
      margin-bottom: 30px;
    }

    h3.sp-module-title {
      font-size: 28px;
      color: $link_color;
      font-weight: 400;
      margin-bottom: 30px;
    }

    .search {
      position: relative;

      input {
        height: 52px;
        font-size: 16px !important;
        color: #afafaf;
        font-style: italic;
        border-radius: 0 !important;
      }

      &:after {
        position: absolute;
        content: "\f002";
        font-family: FontAwesome;
        right: 15px;
        top: 15px;
      }
    }

    ul.categories-module {
      margin: 0;
      padding: 0;
      list-style: none;

      li {
        h4 {
          font-size: 16px;
          font-weight: 400;
          margin-bottom: 15px;
          padding-bottom: 15px;
          border-bottom: solid 1px #e3e3e3;
          position: relative;

          a {
            color: #828282;
          }

          &:after {
            position: absolute;
            content: "\f105";
            font-family: FontAwesome;
            right: 0;
          }

          &:hover {
            a,
            &:after {
              color: $link_color;
            }
          }
        }

        &:last-child {
          h4 {
            border-bottom: 0;
          }
        }
      }
    }

    .latestnews {
      > div {
        width: 100%;
        display: flex;
        align-items: center;
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid #eaeaea;

        &:last-child {
          padding-bottom: 0;
          margin-bottom: 0;
          border-bottom: 0;
        }

        > a {
          font-size: 13px;
          color: #6c6d8b;
        }

        .article-list-img {
          flex: 0 0 40%;
					max-width: 140px;
          margin-right: 20px;
					background-repeat: no-repeat;
					background-size: cover;
					height: 90px;
        }

        .latest-post-content-wrap {
					flex: 0 0 60%;
					max-width: 60%;
          .latest-post-title {
            a {
              font-size: 17px;
              color: #050505;

              &:hover {
                color: $link_color;
              }
            }
          }

          .latest-post-info {
            span.category-date {
              color: #afafaf;
              font-size: 13px;
            }
          }
        }
      }
    }
  }

  //Main Contens
  .blog {
    .article-list {
      .article {
        margin-bottom: 30px;

        .article-body {
          padding-top: 25px;
          background-color: #fff;

          .article-info {
            padding: 0 30px 15px;
            font-size: 14px;
            color: #afafaf;

            span.createdby,
            span.category-name {
              display: none;
            }
          }

          .article-header {
            h2 {
              font-size: 21px;
              font-weight: 400;
              line-height: 30px;
              padding: 0 30px;

              a {
                color: #050505;

                &:hover {
                  color: $link_color;
                }
              }
            }
          }

          .article-introtext {
            padding: 0 30px 35px;
          }

          .readmore {
            position: relative;
            padding: 15px 30px;
            font-size: 14px;
            letter-spacing: 1.13px;
            text-transform: uppercase;
            border-top: solid 1px #e3e3e3;

            a {
              color: #afafaf;
            }

            &:after {
              position: absolute;
              content: "\e93f";
              font-family: "finatic" !important;
              right: 30px;
            }

            &:hover {
              a,
              &:after {
                color: $link_color;
              }
            }
          }
        }
      }
    }

    .pagination-wrapper {
      padding-top: 45px;
    }
  }
}

/************************************************************************/
/**************** ********* End:: Blog Listing ********* ****************/
/************************************************************************/

/************************************************************************/
/**************** ********* Start Blog Details ********* ****************/
/************************************************************************/
.com-content.view-category{
	.article-list{
		.article{
			.article-intro-image{
				height: 250px;
				background-repeat: no-repeat;
				background-size: cover;
			}
		}
	}
}

.view-article {
	div[itemprop="articleBody"]{
    line-height: 1.75;
  }
  .blog-list-news-scroller,
  .content-top-title {
    display: none;
  }
  .finatic-blog-details {
    .article-img-wrpaaer {
      position: relative;
      .article-header {
        background-color: #fff;
        padding: 50px;
        position: absolute;
        width: 95%;
        left: 0;
        right: 0;
        margin: auto;
        bottom: -55px;
        .article-info {
          span.createdby,
          span.category-name,
          span.hits {
            display: none;
          }
          font-size: 16px;
          font-weight: 400;
          color: #afafaf;
        }
        h1 {
          font-size: 28px;
          font-weight: 400;
          color: #050505;
          line-height: 40px;
        }
      }
    }
    div[itemprop="articleBody"] {
      margin-top: 100px;
      padding: 0 100px;
      .blockquote {
        padding: 40px;
        background-color: #fff;
        color: $link_color;
        border-left: solid 5px $link_color;
      }
      .top-bottom-border {
        margin: 55px 0;
        padding: 30px 0;
        font-size: 21px;
        color: $link_color;
        line-break: 35px;
        border-top: solid 2px $link_color;
        border-bottom: solid 2px $link_color;
      }
    }
    .tags-wrapper {
      margin: 30px 100px;
      border: solid 1px rgba(175, 175, 175, 0.3);
      border-right: 0;
      border-left: 0;
      line-height: 40px;
      .finatic-tags {
        border-right: solid 1px rgba(175, 175, 175, 0.3);
        .tags-title {
          display: inline-block;
          margin-right: 10px;
          h5 {
            font-size: 14px;
            color: #050505;
          }
        }
        ul.tags {
          display: inline-block;
          margin: 0;
          li {
            margin-right: 2px;
            a {
              color: #828282;
              font-size: 14px;
              font-weight: 400;
              text-transform: lowercase;
              &:hover {
                color: $link_color;
              }
            }
          }
        }
      }
      .share-wrapper {
        .article-social-share {
          text-align: right;
          .social-share-icon {
            .social-icon-title {
              display: inline-block;
              margin-right: 10px;
              h5 {
                font-size: 14px;
                color: #050505;
              }
            }
            ul {
              margin: 0;
              padding: 0;
              list-style: none;
              display: inline-block;
              li {
                display: inline-block;
                margin-right: 10px;
                a {
                  color: #828282;
                  font-size: 14px;
                  font-weight: 400;
                  text-transform: lowercase;
                  &:hover {
                    color: $link_color;
                  }
                }
              }
            }
          }
        }
      }
    }
    .pagenav {
      padding: 0 100px;
      max-width: inherit;
    }
  }
}

/************************************************************************/
/**************** ********* End:: Blog Details ********* ****************/
/************************************************************************/

.link-color-optlight.sppb-divider {
  border-color: rgba($link_color, 0.5) !important;
}

// Case Studies
.case-studies {
  .article-list {
    &.articles-leading {
      display: flex;
      flex-wrap: wrap;
      margin-right: -15px;
      margin-left: -15px;

      .article {
        float: left;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        flex: 0 0 50%;
        max-width: 50%;
				&:nth-child(1){
					flex: 0 0 70%;
					max-width: 70%;
				}
				&:nth-child(2){
					flex: 0 0 30%;
					max-width: 30%;
					.article-introtext{
						display: none;
					}
				}
				.article-intro-image{
					height: 300px;
				}
      }
    }

    .article {
      margin-bottom: 60px;
    }

    .article-feature-gallery,
    .article-featured-audio,
    .article-featured-video,
    .article-intro-image {
      img {
        width: 100%;
      }
    }

    .article-body {
      padding: 23px 30px 0;
      margin: -75px 25px 0;
      position: relative;
      z-index: 10;
      line-height: 1.63;
      box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
      background-color: #ffffff;
    }

    .article-header {
      h1,
      h2 {
        font-size: 21px;
        font-weight: 400;
        line-height: 1.43;
        margin-bottom: 15px;

        a {
          color: darken($text_color, 50%);

          &:hover {
            color: $link_color;
          }
        }
      }
    }

    .article-info {
      display: none;
    }

    .readmore a {
      font-size: 14px;
      font-weight: 400;
      letter-spacing: 1.13px;
      color: #afafaf;
      text-transform: uppercase;
      padding: 13px 30px;
      margin: 30px -30px 0;
      display: block;
      position: relative;
      border-top: 1px solid #e3e3e3;

      &:after {
        content: "\e93f";
        position: absolute;
        right: 30px;
        top: 50%;
        font-family: "finatic" !important;
        font-size: 16px;
        color: $link_color;
        transform: translateY(-50%);
      }

      &:hover {
        color: $link_color;
      }
    }
  }
}

// pagination
.pagination-wrapper {
  .mr-auto {
    margin: auto;
    width: 100%;
  }

  .pagination-counter {
    display: none;
  }
}
ul.pagination {
  width: 100%;
  justify-content: center;
  border-radius: 0;
  position: relative;
  margin-top: -10px;
  border-bottom: 1px solid #e3e3e3;

  .page-item {
    position: relative;
    margin-bottom: -2px;

    .next,
    .previous {
      display: none;
    }

    &:first-child {
      left: 0;
    }

    &:last-child {
      right: 0;
    }

    &:first-child,
    &:last-child {
      position: absolute;

      .page-link {
        margin: 0;
        font-size: 14px;
        font-weight: 400;
        letter-spacing: 1.13px;
        color: #afafaf;
        text-transform: uppercase;
      }

      &.active {
        position: relative;
      }
    }

    &.active .page-link,
    .page-link {
      font-size: 16px;
      font-weight: 700;
      color: #afafaf;
      padding: 12px 5px;
      margin: 0 18px;
      border: 0;
      border-radius: 0;
      background-color: transparent;
    }

    &.active .page-link {
      color: $link_color;
      border-bottom: 3px solid $link_color;

      &:hover {
        color: $link_color;
        background-color: transparent;
      }
    }
  }
}

// Blog details

.view-article {
  &.case-studies {
    .sp-page-title {
      display: none;
    }

    #sp-main-body {
      padding-top: 0;

      .container {
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
      }

      .sppb-row-container {
        margin-left: auto;
        margin-right: auto;
      }
    }
  }

  .article-details {
    &.case-studies {
      .article-full-image {
        margin-bottom: 50px;
      }

      .article-body-wrap {
        max-width: 1140px;
        margin: 0 auto;
        padding: 0 15px;
      }

      .article-header-wrap {
        width: 945px;
        position: relative;
        margin: -15% auto 0;
        display: table;
        border-bottom: solid 1px rgba(175, 175, 175, 0.5);
      }

      .article-header {
        padding: 50px;
        box-shadow: 0 1px 2px 0 rgba(209, 209, 209, 0.5);
        background-color: #ffffff;
        margin-bottom: 40px;

        h1 {
          font-size: 28px;
          font-weight: 400;
          line-height: 1.43;
          letter-spacing: 0;
          color: darken($text_color, 50%);
          margin-bottom: 0;
          margin-top: 35px;
        }
      }

      .article-info {
        width: 81.5%;
        float: left;
        margin-bottom: 40px;

        > span {
          font-size: 21px;
          font-weight: 700;
          color: darken($text_color, 50%);
          text-transform: capitalize;

          a {
            color: darken($text_color, 50%);

            &:hover {
              color: $link_color;
            }
          }

          &.published {
            position: absolute;
            top: 50px;
            left: 50px;
            font-size: 16px;
            font-weight: 400;
            color: #afafaf;
            line-height: 0.9;

            &:before {
              content: "\e937";
              font-family: "finatic" !important;
              font-size: 20px;
              color: $link_color;
              margin-right: 10px;
            }
          }

          &.category-name,
          &.createdby,
          &.hits {
            width: 33.333%;
            float: left;
          }
        }
      }

      .article-ratings-social-share {
        width: 18.5%;
        float: left;

        .article-ratings {
          display: none;
        }

        .social-icon-title h5 {
          font-size: 14px;
          font-weight: 300;
          letter-spacing: 1px;
          color: darken($text_color, 50%);
          text-transform: uppercase;
          margin-bottom: 10px;
          display: none;
        }

        .social-share-icon {
          ul {
            margin: 0;
            padding: 0;

            li {
              list-style: none;
              display: inline-block;

              &:not(:last-child) {
                margin-right: 15px;
              }

              a {
                display: inline-block;
                width: 30px;
                height: 30px;
                line-height: 30px;
                font-size: 14px;
                color: #fff;
                border-radius: 50%;
                text-align: center;

                &.facebook {
                  background-color: #3a5692;
                }

                &.twitter {
                  background-color: #00c1f7;
                }

                &.linkedin {
                  background-color: #2977c9;
                }
              }
            }
          }
        }
      }

      .article-tags {
        max-width: 66.666667%;
        display: flex;
        line-height: 1;
        padding: 15px 0;
        margin-left: auto;
        margin-right: auto;
        margin-top: 40px;
        border-top: solid 1px rgba($text_color, 0.2);
        border-bottom: solid 1px rgba($text_color, 0.2);
      }

      .tags,
      .tags-title {
        h5,
        li a {
          font-size: 14px;
          font-weight: 400;
        }
      }

      .tags-title {
        h5 {
          margin-right: 10px;
          margin-bottom: 0;
          color: darken($text_color, 50%);
        }
      }

      .tags {
        margin: 0;

        li {
          margin-right: 0;
          position: relative;

          &:not(:last-child):after {
            content: ",";
            margin-right: 3px;
            margin-left: -2px;
          }

          a {
            color: #828282;
            text-transform: lowercase;

            &:hover {
              color: $link_color;
            }
          }
        }
      }
    }
  }
}

.blog-details-list {
  ul {
    margin: 0;
    padding: 0;
    li {
      list-style: none;
      position: relative;
      padding-left: 35px;
      margin-bottom: 10px;
      &:before {
        content: "\e935";
        position: absolute;
        left: 0;
        top: 3px;
        font-family: "finatic" !important;
        font-size: 14px;
        color: $link_color;
      }
    }
  }
}

// pager

.pager {
  max-width: 66.666667%;
  display: flow-root;
  margin-left: auto;
  margin-right: auto;
  margin-top: 68px;
  padding: 0;
  > li {
    list-style: none;
    display: inline-block;
    a {
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 1.13px;
      color: #afafaf;
      text-transform: uppercase;
      position: relative;

      &:hover {
        color: $link_color;
      }
    }
    &.previous {
      float: left;
      a:before {
        content: "\e936";
        font-size: 12px;
        font-family: "finatic" !important;
        margin-right: 5px;
      }
    }
    &.next {
      float: right;
      a:after {
        content: "\e93f";
        font-size: 12px;
        font-family: "finatic" !important;
        margin-left: 5px;
      }
    }
  }
}
