/*
**  direction setting variables 
*/
/*
**  font family setting variables 
*/
/*******************************  import All used scss files   ******************************/
/*
**  Font size variables 
*/
/*
**  Sections PaddingY  variables 
*/
/*
** Colors variables
*/
/*
**  clearfix mixin  
*/
/****************** MEDIA QUERY MANAGER *****************/
/*
** Bootstrap 5 breakpoints
**  xs: 0, // X-Small devices (portrait phones, less than 576px)
**  sm: 576px, // Small devices (landscape phones, less than 768px)
**  md: 768px,  // Medium devices (tablets, less than 992px)
**  lg: 992px,// Large devices (desktops, less than 1200px)
**  xl: 1200px,// X-Large devices (large desktops, less than **1400px)
** xxl: 1400px  
*/
/*
**  Desktop First MEDIA QUERY MANAGER Mixin.
**  we used bootstrap5 Breakpoints in px.
**  we use Max-width We occasionally use media queries that go the given screen size or smaller) --> max-width and down. 
*/
/*
**  Mobile First MEDIA QUERY MANAGER Mixin.
**  we used bootstrap5 Breakpoints in px.
**  we use Min-width We occasionally use media queries that go the given screen size or larger) --> min-width and up. 
*/
/*
**  Single Breakpoint MEDIA QUERY MANAGER Mixin.
**  we used bootstrap5 Breakpoints in px.
**  we use Min-width & max-width to specify the a single breakpoin 
*/
/*
**  Between Breakpoints MEDIA QUERY MANAGER Mixin.
**  we used bootstrap5 Breakpoints in px.
**  Similarly, media queries may span multiple breakpoints widths:
**  we use Min-width & max-width to specify the a range breakpoint 
*/
/*
**  Helvetica Neue Font =>   font-family: "Helvetica Neue" , sans-serif;
*/
@font-face {
  font-family: 'Helvetica Neue';
  src: url("../fonts/Helvetica_Neue_font/HelveticaNeue.eot");
  /* IE9 Compat Modes */
  src: url("../fonts/Helvetica_Neue_font/HelveticaNeue.eot?#iefix") format("embedded-opentype"), url("../fonts/Helvetica_Neue_font/HelveticaNeue.woff2") format("woff2"), url("../fonts/Helvetica_Neue_font/HelveticaNeue.woff") format("woff"), url("../fonts/Helvetica_Neue_font/HelveticaNeue.ttf") format("truetype"), url("../fonts/Helvetica_Neue_font/HelveticaNeue.svg#svgFontName") format("svg");
  /* Legacy iOS */ }

/*
**  CSS Initializati Reset
*/
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: inherit; }

/*
**  Set root font => to set the default 1rem unit value
*/
html {
  font-size: 62.5%;
  /* 1rem = 10px -->  10/16 *100% = 62.5% */ }

/*
**  Set default inherited properties in body element 
*/
body {
  background-color: #fff;
  box-sizing: border-box;
  font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  font-size: 1.6rem;
  font-weight: normal;
  line-height: 1.83;
  color: #000;
  overflow: hidden; }

/*
**  Reset builts of ul and ol  Lists.
*/
ul,
ol {
  list-style-type: none;
  margin: 0;
  padding: 0; }

/*
**  define the style for the primary heading in the page  =>heading-primary{
*/
.heading-primary {
  font-size: 5vw;
  margin-bottom: 2.5rem;
  font-family: "Source Sans Pro", sans-serif;
  color: #01012f;
  font-weight: 700;
  line-height: 1.34;
  text-align: center;
  text-transform: uppercase; }
  @media (max-width: 767.98px) {
    .heading-primary {
      font-size: 3rem; } }
  @media (max-width: 320.98px) {
    .heading-primary {
      font-size: 2.5rem; } }

/*
**  define padding section in all screens
*/
.section {
  font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  padding: 6rem 0; }
  @media (max-width: 1199.98px) {
    .section {
      padding: 5rem 0; } }
  @media (max-width: 767.98px) {
    .section {
      padding: 4rem 0; } }
  @media (max-width: 320.98px) {
    .section {
      padding: 3.5rem 0; } }

/*
**  define bg colors
*/
.bg--primary {
  background-color: #ef233c !important; }

.bg--light {
  background-color: #f3f2f1 !important; }

.bg--light-2 {
  background-color: #f3f8fe !important; }

.bg--dark-1 {
  background-color: #01012f !important; }

.bg--dark-2 {
  background-color: #69dc9e !important; }

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

.bg--black {
  background-color: #000 !important; }

/*
**  define text colors
*/
.c--dark-1 {
  color: #01012f !important; }

.c--dark-2 {
  color: #43403e !important; }

.c--white {
  color: #fff !important; }

/*
**  define utility classes to make clearfix for specified floated elements
*/
.u-clearfix::after {
  content: '';
  display: block;
  clear: both !important; }

/*
**  define utility classes to hidden specified elements
*/
.u-hidden {
  display: none !important;
  opacity: 0 !important; }

.u-sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 9999 !important; }

/*
**  define utility classes to hidden  specified  section elements
*/
.u-section--hidden {
  opacity: 0 !important;
  transform: translateY(8rem) !important; }

/*
**  define utility class for center inline & inline-block specified elements 
*/
.u-center-text {
  text-align: center !important; }

/*
**  define utility classes for set margin bottom for specified elements
*/
.u-mb-1 {
  margin-bottom: 1rem !important; }

.u-mb-2 {
  margin-bottom: 1.6rem !important; }

.u-mb-3 {
  margin-bottom: 2rem !important; }

.u-mb-4 {
  margin-bottom: 1.5rem !important; }

.u-mb-5 {
  margin-bottom: 2rem !important; }

.u-mb-6 {
  margin-bottom: 4rem !important; }

.u-mb-7 {
  margin-bottom: 6rem !important; }

.u-mb-8 {
  margin-bottom: 7rem !important; }

.u-mb-9 {
  margin-bottom: 9rem !important; }

.u-mb-10 {
  margin-bottom: 12rem !important; }

.link-btn {
  border: none;
  padding: 5px 10px;
  font-size: inherit;
  position: relative; }
  .link-btn::before {
    transition: all 0.85s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    content: "";
    width: 50%;
    height: 100%;
    background: #01012f;
    position: absolute;
    top: 0;
    left: 0; }
  .link-btn__text {
    text-decoration: none;
    text-transform: capitalize;
    color: white;
    mix-blend-mode: difference;
    letter-spacing: 0.5rem; }
    .link-btn__text:hover {
      color: white;
      mix-blend-mode: difference; }
  .link-btn:hover::before {
    background: #01012f;
    width: 100%; }
  .link-btn--rounded {
    border-radius: 50px; }
    .link-btn--rounded::before {
      border-radius: 50px;
      width: 45%;
      background: #01012f; }
    .link-btn--rounded:hover::before {
      background: #01012f;
      width: 100%; }
  .link-btn--width::before {
    width: 58%; }

.preloader {
  width: 100%;
  height: 100vh;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #ef233c;
  z-index: 9999999;
  transition: opacity 0.5s ease-in; }
  .preloader__items {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  .preloader__item {
    position: absolute;
    width: 40px;
    height: 40px;
    background: #262626;
    animation: animate 4s infinite forwards ease-in-out; }
    .preloader__item:nth-child(1) {
      background: #43403e;
      left: -44px;
      top: -44px;
      animation-delay: 0.5s; }
    .preloader__item:nth-child(2) {
      background: #69dc9e;
      left: 0px;
      top: -44px;
      animation-delay: 1s; }
    .preloader__item:nth-child(3) {
      background: #43403e;
      left: 0px;
      top: 0px;
      animation-delay: 2s; }
    .preloader__item:nth-child(4) {
      background: #69dc9e;
      left: -44px;
      top: 0px;
      animation-delay: 1.5s; }

@keyframes animate {
  0% {
    transform: rotateY(0deg); }
  20% {
    transform: rotateY(360deg); }
  40% {
    transform: rotateX(180deg); }
  60% {
    transform: rotateX(0deg); }
  80% {
    transform: rotateX(360deg); }
  100% {
    transform: rotateY(180deg); } }

.section--service {
  background-color: #fff;
  padding: 4rem; }
  @media (max-width: 991.98px) {
    .section--service {
      padding: 4rem 3rem; } }
  @media (max-width: 767.98px) {
    .section--service {
      padding: 4rem 2.5rem; } }
  @media (max-width: 575.98px) {
    .section--service {
      padding: 3rem 2rem; } }
  @media (max-width: 320.98px) {
    .section--service {
      padding: 2rem 1.5rem; } }
  .section--service .section--service__header {
    font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif;
    color: #ef233c;
    font-size: 3rem;
    text-transform: uppercase;
    font-weight: 700;
    text-align: center;
    margin-bottom: 2.5rem; }
    @media (max-width: 991.98px) {
      .section--service .section--service__header {
        font-size: 2rem; } }
  .section--service .section--service__text {
    font-family: inherit;
    color: #878e94;
    font-size: 1.7rem;
    font-weight: 100; }
    @media (max-width: 991.98px) {
      .section--service .section--service__text {
        font-size: 1.5rem; } }
  .section--service__circle__header {
    font-family: "Source Sans Pro", sans-serif;
    text-align: left;
    font-size: 3.2rem;
    padding: 2rem;
    font-weight: 600; }
  .section--service__circle__item {
    box-shadow: 0 2px 6px rgba(1, 1, 47, 0.25);
    font-family: inherit;
    border-radius: 2rem;
    text-align: center;
    color: #fff;
    background: linear-gradient(45deg, #01012f 0%, #69dc9e 100%);
    position: relative;
    overflow: hidden;
    cursor: pointer;
    width: 18vw;
    height: 18vw;
    margin: 0 3rem 4rem;
    transition: all 0.7s; }
    @media (max-width: 991.98px) {
      .section--service__circle__item {
        width: 28vw;
        height: 28vw;
        margin: 0 6vw 4rem; } }
    @media (max-width: 767.98px) {
      .section--service__circle__item {
        width: 60vw;
        height: 60vw;
        margin: 0 0 5rem; } }
    @media (max-width: 320.98px) {
      .section--service__circle__item {
        width: 70vw;
        height: 70vw; } }
    .section--service__circle__item__header {
      width: 100%;
      max-height: 100%;
      margin: auto;
      padding: 1.5rem 1rem;
      position: absolute;
      top: 50%;
      left: 50%;
      transition: all 0.5s;
      transform: translate(-50%, -50%);
      display: flex;
      flex-direction: column; }
      .section--service__circle__item__header h3 {
        font-size: 1.9rem;
        font-weight: 700;
        text-transform: uppercase;
        position: relative; }
        @media (max-width: 1199.98px) {
          .section--service__circle__item__header h3 {
            font-size: 1.4rem; } }
        @media (max-width: 991.98px) {
          .section--service__circle__item__header h3 {
            font-size: 1.8rem; } }
        @media (max-width: 767.98px) {
          .section--service__circle__item__header h3 {
            font-size: 2.5rem; } }
        @media (max-width: 575.98px) {
          .section--service__circle__item__header h3 {
            font-size: 2rem; } }
        .section--service__circle__item__header h3::after {
          content: '';
          width: 4rem;
          height: 2px;
          position: absolute;
          background: #f3f2f1;
          display: block;
          bottom: -1rem;
          left: 0;
          right: 0;
          margin: 0 auto; }
      .section--service__circle__item__header p {
        margin-top: 2rem;
        font-size: 1.2rem;
        line-height: 1.5; }
        @media (max-width: 1199.98px) {
          .section--service__circle__item__header p {
            font-size: 1.1rem; } }
        @media (max-width: 991.98px) {
          .section--service__circle__item__header p {
            font-size: 1.3rem; } }
        @media (max-width: 767.98px) {
          .section--service__circle__item__header p {
            font-size: 2rem; } }
        @media (max-width: 575.98px) {
          .section--service__circle__item__header p {
            font-size: 1.2rem; } }
    .section--service__circle__item__text {
      position: absolute;
      top: 100%;
      left: 50%;
      width: 100%;
      height: 100%;
      transition: all 0.5s;
      transform: translateX(-50%);
      font-size: 1.3rem;
      line-height: 1.4; }
      .section--service__circle__item__text img {
        width: 100%;
        height: 100%; }
      @media (max-width: 1199.98px) {
        .section--service__circle__item__text {
          font-size: 1rem; } }
      @media (max-width: 991.98px) {
        .section--service__circle__item__text {
          font-size: 1.2rem; } }
      @media (max-width: 767.98px) {
        .section--service__circle__item__text {
          font-size: 1.6rem; } }
      @media (max-width: 575.98px) {
        .section--service__circle__item__text {
          font-size: 1.2rem; } }
    .section--service__circle__item:hover {
      transform: scale(1.1); }
    .section--service__circle__item:hover .section--service__circle__item__header {
      top: -100%; }
    .section--service__circle__item:hover .section--service__circle__item__text {
      top: 0%; }

.section--service__circle--grey {
  background-color: #e9e9e9; }

.scroll-top-btn {
  display: inline-block;
  border-radius: 100%;
  overflow: hidden;
  position: fixed;
  right: 15px;
  bottom: 40px;
  color: #ef233c;
  background-color: #fff;
  opacity: 1;
  cursor: pointer;
  display: none;
  font-size: 4rem;
  font-weight: normal;
  transition: 0.3s all ease-in-out; }
  @media (max-width: 575.98px) {
    .scroll-top-btn {
      font-size: 3.5rem;
      right: 15px;
      bottom: 18px; } }
  .scroll-top-btn:hover {
    color: #fff;
    background-color: #ef233c;
    transform: translateY(-0.2rem);
    box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.2); }

.timeline-wrapper {
  font-family: inherit;
  padding-top: 80px;
  padding-bottom: 80px;
  position: relative; }
  .timeline-wrapper .btn-wrapper {
    width: 100%;
    text-align: center;
    margin-top: 50px; }
    @media (max-width: 800px) {
      .timeline-wrapper .btn-wrapper {
        text-align: left;
        margin-left: 120px;
        margin-top: -60px; } }
  .timeline-wrapper .line {
    height: 1px;
    width: 1200%;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
    border-top: 7px solid #43403e; }
    @media (max-width: 800px) {
      .timeline-wrapper .line {
        width: 100%;
        height: 100%;
        border: 0;
        border-left: 7px solid #43403e;
        left: 50%; } }

.timeline {
  position: relative;
  width: 100vw;
  padding: 20px 0;
  z-index: 5; }
  @media (max-width: 800px) {
    .timeline {
      width: auto;
      margin: 7px;
      margin-bottom: -75px; } }
  .timeline .node-wrapper {
    padding: 0 100px;
    display: flex; }
    @media (max-width: 800px) {
      .timeline .node-wrapper {
        display: block;
        padding: 0; } }

.tl-node {
  position: relative;
  margin: 0 100px; }
  @media (max-width: 800px) {
    .tl-node {
      margin: 0;
      margin-left: -3px;
      display: flex;
      margin-bottom: 120px; } }
  .tl-node p {
    color: #69dc9e;
    font-weight: 900;
    margin: 0;
    font-size: 2rem;
    text-align: center;
    position: absolute;
    top: -35px;
    left: -5px;
    width: 100%;
    font-family: inherit;
    letter-spacing: 0.8px; }
    @media (max-width: 800px) {
      .tl-node p {
        display: none; } }
  .tl-node h3,
  .tl-node h5 {
    text-align: center;
    font-family: inherit;
    margin: 0; }
  .tl-node h3 {
    color: #43403e;
    text-align: center;
    font-size: 15px;
    font-weight: normal;
    line-height: 1.5;
    margin-bottom: 5px; }
  .tl-node h5 {
    text-align: center;
    color: #01012f;
    font-size: 20px;
    margin-bottom: 5px;
    font-weight: 900;
    letter-spacing: 0.8px; }
    @media (max-width: 800px) {
      .tl-node h5 {
        color: #69dc9e; } }
  .tl-node .data {
    opacity: 0;
    transition: all 400ms;
    position: absolute;
    width: 250px;
    z-index: 1;
    background-color: #fff;
    visibility: hidden;
    top: 65px;
    left: -20px;
    border: 2px solid #69dc9e; }
    .tl-node .data img {
      width: 100%;
      height: auto;
      display: block; }
    .tl-node .data .upper {
      padding: 8px; }
      @media (max-width: 800px) {
        .tl-node .data .upper {
          padding: 8px;
          padding-right: 22px;
          padding-left: 0px; } }
    @media (max-width: 800px) {
      .tl-node .data {
        position: relative;
        top: 55px;
        left: auto;
        visibility: visible;
        opacity: 1;
        width: 80%;
        margin: auto; } }
  .tl-node .dot {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 0.6rem solid #69dc9e;
    background-color: #43403e;
    transition: all 200ms;
    position: relative;
    z-index: 10; }
    @media (max-width: 800px) {
      .tl-node .dot {
        left: 50%;
        margin-left: 4.5px;
        transform: translateX(-50%); } }
  @media (max-width: 800px) {
    .tl-node:hover .dot {
      transform: translateX(-50%) scale(1.2); } }
  .tl-node:hover .data {
    visibility: visible;
    opacity: 1; }

.left-triangle:before {
  content: '';
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #69dc9e;
  position: absolute;
  top: -16px;
  left: 17px; }
  @media (max-width: 800px) {
    .left-triangle:before {
      display: none;
      top: 15px;
      left: -33px !important;
      border-top: 17px solid transparent;
      border-bottom: 17px solid transparent;
      border-right: 17px solid #69dc9e; } }

.right-triangle:before {
  content: '';
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #69dc9e;
  position: absolute;
  top: -16px;
  right: 20px; }
  @media (max-width: 800px) {
    .right-triangle:before {
      display: none;
      top: 15px;
      left: -40px !important;
      border-top: 20px solid transparent;
      border-bottom: 20px solid transparent;
      border-right: 20px solid #fff; } }

@media (max-width: 800px) {
  .timeline-full {
    width: auto;
    margin: 0; } }

.timeline-full .line {
  width: 100%;
  height: 100%;
  border: 0;
  border-left: 5px solid #43403e;
  left: 15px;
  z-index: 1; }

.timeline-full .node-wrapper {
  display: block;
  position: relative;
  max-width: 900px;
  margin: auto;
  padding: 0; }

.timeline-full .tl-node {
  display: flex;
  margin: auto;
  margin-bottom: 50px; }

.timeline-full p {
  display: none; }

.timeline-full .data {
  position: relative;
  top: -20px;
  left: auto;
  visibility: visible;
  opacity: 1;
  margin-left: 50px;
  width: 80%; }
  .timeline-full .data img {
    width: 100%;
    height: auto; }

.timeline-full .dot {
  background-color: #000;
  border: 4px solid #fff; }

.timeline-full .left-triangle:before,
.timeline-full .right-triangle:before {
  top: 15px;
  left: -40px !important;
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
  border-right: 20px solid #fff; }

.map {
  text-align: center;
  font-family: inherit;
  color: #43403e;
  font-weight: normal; }
  .map__img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0.8rem;
    margin-bottom: 2rem;
    filter: grayscale(100%);
    transition: all 0.3s; }
  .map:hover .map__img {
    filter: grayscale(0); }
  .map__header {
    font-family: "Source Sans Pro", sans-serif;
    color: #ef233c;
    text-transform: capitalize;
    font-size: 2.5rem;
    font-weight: 600; }
  .map__address {
    font-size: 1.6rem;
    color: inherit; }
  .map__phone a {
    font-size: 1.6rem;
    color: inherit;
    text-decoration: none; }
    .map__phone a:hover {
      text-decoration: underline; }

/*
**  define styling for form element components with specified with classe form.
*/
.form {
  font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif; }
  .form__group {
    margin-bottom: 3rem; }
  .form__label {
    margin: 0;
    padding: 0.375rem 0.75rem;
    font-family: "Source Sans Pro", sans-serif;
    font-weight: 600;
    font-size: 1.6rem;
    width: 100%;
    height: 3.85rem;
    color: #fff;
    background-color: #43403e;
    display: flex;
    justify-content: center;
    text-transform: uppercase;
    align-items: center; }
  .form__input {
    text-align: left; }
  .form__input, .form__textarea {
    display: block;
    width: 100%;
    border-radius: 0;
    color: #01012f;
    border: 0.2rem solid #43403e;
    padding: 0.375rem 0.75rem;
    font-size: 1.5rem;
    font-family: inherit;
    font-weight: normal;
    background-color: unset; }
    .form__input::-webkit-input-placeholder, .form__textarea::-webkit-input-placeholder {
      color: rgba(135, 142, 148, 0.6); }
    .form__input:focus, .form__textarea:focus {
      outline: none;
      color: #01012f;
      background-color: unset;
      box-shadow: 0 0 0 0.25rem #69dc9e;
      border-color: #69dc9e; }
    .form__input:focus:invalid, .form__textarea:focus:invalid {
      box-shadow: 0 0 0 0.25rem rgba(255, 0, 0, 0.8);
      border-color: rgba(255, 0, 0, 0.8); }
    .form__input.error, .form__textarea.error {
      margin-top: 0 !important; }
  .form__textarea {
    resize: none;
    height: 19rem; }
  .form label.error {
    font-family: inherit;
    color: rgba(255, 99, 71, 0.9);
    font-size: 1.2rem;
    font-weight: 700;
    display: inline-block;
    padding-left: 1rem;
    margin-top: 0.7rem;
    display: block; }
  .form__textarea {
    resize: none; }
  .form__submit-btn {
    font-size: 2.6rem;
    padding: 0.5rem 0rem;
    position: relative;
    display: block;
    width: 100%;
    color: #fff;
    background-color: #43403e;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    transition: all 0.2s; }
    .form__submit-btn:hover {
      transform: translateY(-0.3rem);
      box-shadow: 0 1rem 1rem #43403e;
      text-decoration: underline; }
    .form__submit-btn:hover::before {
      transform: scaleX(1.4) scaleY(1.6);
      opacity: 0;
      z-index: 5; }
    .form__submit-btn:focus {
      outline: none;
      /* to change default for button*/
      transform: translateY(-0.1rem);
      box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.2); }
    .form__submit-btn::before {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: -1;
      transition: all 4s; }

.form__selectbox__svg, .form__selectbox__icon {
  color: #43403e;
  position: absolute;
  top: -1rem;
  right: 1rem;
  cursor: pointer; }

.form__selectbox__icon {
  line-height: 4rem;
  font-size: 5rem; }

.form__selectbox__dropdown {
  width: 100%;
  height: 3.85rem;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  text-align: right;
  color: transparent;
  background-color: transparent;
  border: none; }
  .form__selectbox__dropdown:hover, .form__selectbox__dropdown:focus {
    background-color: transparent;
    color: transparent;
    border: none; }

.form__selectbox .dropdown-menu {
  font-family: inherit;
  border-radius: 0 !important;
  text-align: center;
  border: 2px solid #43403e;
  border-top: 0;
  min-width: 300px;
  left: 0;
  font-size: 1rem;
  color: #212529;
  background-color: #fff; }
  @media (max-width: 575.98px) {
    .form__selectbox .dropdown-menu {
      width: 100%; } }
  .form__selectbox .dropdown-menu .dropdown-item {
    font-family: inherit;
    font-size: 1.6rem;
    display: block;
    width: 100%;
    padding: 0.25rem 1rem;
    font-weight: 400;
    text-decoration: none;
    background-color: transparent;
    border: 0;
    text-transform: uppercase;
    color: #878e94;
    position: relative;
    cursor: pointer; }
    .form__selectbox .dropdown-menu .dropdown-item:hover {
      background-color: #43403e;
      color: #fff; }

.form__selectbox .dropdown-item:hover .form__selectbox_item_svg,
.form__selectbox .dropdown-item:hover .form__selectbox_item_icon {
  opacity: 1; }

.form__selectbox_item_svg,
.form__selectbox_item_icon {
  position: absolute;
  color: #fff;
  right: 0;
  top: 0;
  position: absolute;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  font-size: 35px;
  opacity: 0;
  cursor: pointer; }

.form__selectbox_item_icon {
  font-size: 3.5rem; }

.flip-card {
  transform-style: preserve-3d;
  perspective: 1000px;
  margin: 2rem; }
  .flip-card__front, .flip-card__back {
    background-size: cover;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25);
    border-radius: 10px;
    background-position: center;
    transition: transform 1s cubic-bezier(0.4, 0.2, 0.2, 1);
    backface-visibility: hidden;
    text-align: center;
    min-height: 280px;
    height: auto;
    border-radius: 10px;
    color: #fff;
    font-size: 1.5rem; }
  .flip-card__front {
    transform: rotateY(0deg);
    transform-style: preserve-3d; }
    .flip-card__front:after {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      width: 100%;
      height: 100%;
      content: '';
      display: block;
      opacity: 0.6;
      background-color: #000;
      backface-visibility: hidden;
      border-radius: 10px; }
    .flip-card__front p {
      font-size: 2rem;
      margin-bottom: 2rem;
      text-transform: uppercase;
      position: relative; }
      .flip-card__front p:after {
        content: '';
        width: 4rem;
        height: 2px;
        position: absolute;
        background: #c6d4df;
        display: block;
        left: 0;
        right: 0;
        margin: 0 auto;
        bottom: -0.75rem; }
    .flip-card__front span {
      color: rgba(255, 255, 255, 0.7);
      font-family: 'Montserrat';
      font-weight: 300; }
  .flip-card__back {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(45deg, #878e94 0%, #69dc9e 100%);
    transform: rotateY(180deg);
    transform-style: preserve-3d; }
  .flip-card__inner {
    transform: translateY(-50%) translateZ(60px) scale(0.94);
    top: 50%;
    position: absolute;
    left: 0;
    width: 100%;
    padding: 2rem;
    box-sizing: border-box;
    outline: 1px solid transparent;
    perspective: inherit;
    z-index: 2; }
  .flip-card:hover .flip-card__front,
  .flip-card:hover .flip-card__back {
    transition: transform 1s cubic-bezier(0.4, 0.2, 0.2, 1); }
  .flip-card:hover .flip-card__back {
    transform: rotateY(0deg);
    transform-style: preserve-3d; }
  .flip-card:hover .flip-card__front {
    transform: rotateY(-180deg);
    transform-style: preserve-3d; }

/*
**  define styling for element component with specified with classe contact-header.
*/
.img-flip {
  transform: scaleX(-1); }

@media (max-width: 991.98px) {
  .header {
    margin-top: 66px; } }

.header .main-section {
  font-family: inherit;
  color: white;
  position: relative; }
  .header .main-section__item {
    height: 70vh; }
    @media (max-width: 991.98px) {
      .header .main-section__item {
        height: 60vh; } }
    .header .main-section__item img {
      height: 100%; }
    .header .main-section__item::after {
      content: "";
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      background-color: rgba(105, 220, 158, 0.1);
      z-index: 1; }
  .header .main-section__content {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 2; }
  .header .main-section__title {
    font-family: "Source Sans Pro", sans-serif;
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    line-height: 1.7;
    font-weight: 700;
    text-shadow: 1px 1px 4px #000;
    margin-bottom: 1.2rem;
    font-size: 3.5rem; }
    @media (max-width: 1199.98px) {
      .header .main-section__title {
        font-size: 3rem; } }
    @media (max-width: 767.98px) {
      .header .main-section__title {
        font-size: 2.5rem; } }
    @media (max-width: 575.98px) {
      .header .main-section__title {
        font-size: 2rem; } }
  .header .main-section__text {
    font-weight: 600;
    text-shadow: 1px 1px 2px #000;
    font-size: 3rem; }
    @media (max-width: 1199.98px) {
      .header .main-section__text {
        font-size: 2.5rem; } }
    @media (max-width: 767.98px) {
      .header .main-section__text {
        font-size: 2rem; } }
    @media (max-width: 575.98px) {
      .header .main-section__text {
        font-size: 1.5rem; } }
  .header .main-section__link {
    display: inline-block;
    margin-top: 2.5rem;
    text-decoration: none;
    color: white;
    border: 1px solid #fff;
    border-radius: 0.5rem;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    padding: 12px 26px;
    transition: all 0.5s;
    background-color: #ef233c; }
    @media (max-width: 991.98px) {
      .header .main-section__link {
        font-size: 11px;
        padding: 11px 24px; } }
    @media (max-width: 767.98px) {
      .header .main-section__link {
        font-size: 10px;
        padding: 10px 22px; } }
    .header .main-section__link:hover {
      color: #ef233c;
      border: 1px solid #2c2a29;
      background-color: #fff; }
  .header .main-section .owl-dots {
    position: absolute;
    left: 50%;
    bottom: 4rem;
    z-index: 3;
    transform: translateX(-50%); }
    @media (max-width: 991.98px) {
      .header .main-section .owl-dots {
        bottom: 3rem; } }
    @media (max-width: 767.98px) {
      .header .main-section .owl-dots {
        bottom: 2rem; } }
  .header .main-section .owl-dot {
    margin: 0 5px; }
    .header .main-section .owl-dot span {
      width: 2.5rem;
      height: 0.35rem;
      margin: 0;
      border-radius: 10rem;
      background-color: #fff;
      transition: opacity 0.6s ease; }
      @media (max-width: 991.98px) {
        .header .main-section .owl-dot span {
          width: 2rem;
          display: none; } }
      @media (max-width: 575.98px) {
        .header .main-section .owl-dot span {
          display: none; } }
    .header .main-section .owl-dot.active span, .header .main-section .owl-dot:hover span {
      background-color: #ef233c; }
  .header .main-section .owl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-left: 3rem;
    padding-right: 3rem; }
    .header .main-section .owl-nav.disabled {
      display: none; }
  .header .main-section .owl-prev, .header .main-section .owl-next {
    border: solid 2px #fff !important;
    border-radius: 50% !important;
    width: 3rem;
    height: 3rem;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    transition: 0.3s;
    color: #fff !important; }
    .header .main-section .owl-prev:focus, .header .main-section .owl-next:focus {
      outline: none; }
  .header .main-section .owl-prev:hover, .header .main-section .owl-next:hover {
    background: transparent !important;
    border-color: #ef233c !important;
    color: #ef233c !important; }

/*
**  define styling for element component with specified with classe nav.
*/
.nav {
  font-family: "Source Sans Pro", sans-serif;
  position: relative;
  background-color: #fff;
  border-bottom: 2px solid #ef233c;
  box-shadow: 0 0.1rem 0.2rem rgba(0, 0, 0, 0.4); }
  .nav.u-sticky {
    background-color: white; }
  .nav .navigation {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 0.7rem 0;
    /* logo image*/
    /* ul list*/
    /*ul li item*/
    /*ul li a*/ }
    @media (max-width: 991.98px) {
      .nav .navigation {
        justify-content: center; } }
    .nav .navigation__logo-image {
      display: block;
      height: 5rem;
      width: auto;
      cursor: pointer;
      display: none; }
      @media (max-width: 991.98px) {
        .nav .navigation__logo-image {
          display: block; } }
    .nav .navigation__list {
      flex-basis: 85%;
      display: flex;
      flex-direction: row;
      justify-content: space-around;
      align-items: center; }
      @media (max-width: 991.98px) {
        .nav .navigation__list {
          border: 0.2rem solid #ef233c;
          width: 100%;
          position: absolute;
          top: 100%;
          z-index: 99;
          background-color: #fff;
          flex-direction: column;
          opacity: 1;
          transition: opacity 1s;
          padding-bottom: 0.5rem;
          border-bottom-left-radius: 1rem;
          border-bottom-right-radius: 1rem; } }
    @media (max-width: 991.98px) {
      .nav .navigation__item {
        width: 100%; }
        .nav .navigation__item:not(:last-child) {
          border-bottom: 0.1rem solid #69dc9e; } }
    .nav .navigation__link {
      font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif;
      font-weight: 700;
      text-decoration: none;
      text-transform: uppercase;
      font-size: 1.8rem; }
      @media (max-width: 1399.98px) {
        .nav .navigation__link {
          font-size: 1.6rem; } }
      @media (max-width: 1199.98px) {
        .nav .navigation__link {
          font-size: 1.4rem; } }
      @media (max-width: 991.98px) {
        .nav .navigation__link {
          font-size: 1.3rem;
          font-weight: 700;
          display: block;
          width: 100%;
          padding: 0.5rem 0;
          text-align: center;
          transition: all 0.3s; }
          .nav .navigation__link:hover, .nav .navigation__link:active, .nav .navigation__link--active:link, .nav .navigation__link--active:visited {
            background-color: #f3f8fe;
            color: #ef233c; } }
      @media (max-width: 575.98px) {
        .nav .navigation__link {
          font-size: 1.2rem; } }
      .nav .navigation__link:link, .nav .navigation__link:visited {
        color: #01012f; }
      .nav .navigation__link:hover, .nav .navigation__link:active, .nav .navigation__link--active:link, .nav .navigation__link--active:visited {
        color: #ef233c; }
    .nav .navigation__toggle-btn {
      position: absolute;
      top: 1.1rem;
      right: 1.3rem;
      border: none;
      width: 4.3rem;
      height: 4.3rem;
      border-radius: 0.4rem;
      background-color: #ef233c;
      padding: 1rem 0.7rem;
      cursor: pointer;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      transition: box-shadow 0.3s, transform 0.3s;
      display: none; }
      .nav .navigation__toggle-btn:hover {
        justify-content: space-around;
        transform: translateY(-0.1rem);
        box-shadow: 0 0.5rem 0.2rem rgba(0, 0, 0, 0.4); }
      .nav .navigation__toggle-btn:focus {
        outline: none;
        transform: translateY(0);
        box-shadow: 0 0.5rem 0.3rem rgba(0, 0, 0, 0.4); }
      .nav .navigation__toggle-btn span {
        display: block;
        width: 100%;
        height: 0.35rem;
        background-color: #fff;
        border-radius: 2rem; }
      @media (max-width: 991.98px) {
        .nav .navigation__toggle-btn {
          display: flex; } }

/*
**  define styling for element components with specified with classe footer.
*/
.footer {
  background-image: linear-gradient(to right, #01012f, #0091ad);
  color: #fff;
  font-size: 1.6rem;
  padding-top: 5rem; }
  @media (max-width: 1199.98px) {
    .footer {
      padding-top: 4rem; } }
  @media (max-width: 991.98px) {
    .footer {
      padding-top: 3rem; } }
  @media (max-width: 767.98px) {
    .footer {
      padding-top: 2.5rem; } }
  @media (max-width: 575.98px) {
    .footer {
      padding-top: 2rem; } }
  @media (max-width: 575.98px) {
    .footer .main-footer__item--logos {
      width: 75%;
      margin: 0 auto; } }
  .footer .main-footer__logo-link {
    display: block;
    width: 80%;
    margin: 0 auto; }
    @media (max-width: 991.98px) {
      .footer .main-footer__logo-link {
        width: 60%; } }
    @media (max-width: 575.98px) {
      .footer .main-footer__logo-link {
        width: 80%; } }
    .footer .main-footer__logo-link__img {
      width: 100%;
      height: auto;
      display: block; }
  .footer .main-footer__contact__logos img {
    width: calc(90% / 5);
    height: auto;
    display: block; }
  @media (max-width: 320.98px) {
    .footer .main-footer__item--certficate .col-6 {
      width: 100%; }
      .footer .main-footer__item--certficate .col-6:not(:last-child) {
        margin-bottom: 2rem; } }
  .footer .main-footer__list__item {
    text-align: left; }
  .footer .main-footer__list__heading {
    text-align: left;
    font-family: "Source Sans Pro", sans-serif;
    text-decoration: underline;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.7rem;
    margin-bottom: 0.8rem; }
  .footer .main-footer__list__link {
    font-size: 1.2rem;
    font-weight: 600;
    text-decoration: none;
    color: inherit;
    cursor: pointer; }
    .footer .main-footer__list__link:hover {
      text-decoration: underline; }
  @media (max-width: 575.98px) {
    .footer .main-footer__list {
      width: 75%;
      margin: 0 auto; } }
  .footer .main-footer__partner-link {
    display: block;
    width: 100%; }
  .footer .main-footer__partner-img {
    display: block;
    margin: 0 auto;
    width: 90%;
    height: auto; }
    @media (max-width: 575.98px) {
      .footer .main-footer__partner-img {
        width: 50%; } }
  .footer .main-footer .form {
    font-family: inherit; }
    .footer .main-footer .form__title {
      font-family: "Source Sans Pro", sans-serif;
      text-transform: uppercase;
      text-decoration: underline;
      font-weight: 700;
      font-size: 1.7rem;
      margin-bottom: 0.8rem; }
    .footer .main-footer .form__text {
      font-size: 1.2rem;
      font-weight: 600;
      color: inherit;
      line-height: 26px;
      margin-bottom: 15px; }
    .footer .main-footer .form__email {
      display: inline-block;
      width: 100%;
      border-radius: 0.3rem;
      border: 1px solid #ddd;
      height: 36px;
      padding: 5px 12px;
      outline: medium none;
      color: #000; }
      @media (max-width: 1199.98px) {
        .footer .main-footer .form__email {
          width: 80%;
          margin: 0 auto; } }
    .footer .main-footer .form__btn {
      font-family: inherit;
      border-radius: 0;
      background-color: #43403e;
      color: #fff;
      border-radius: 0.4rem;
      border: none;
      display: inline-block;
      padding: 6px 30px;
      text-transform: uppercase;
      margin-top: 1.5rem;
      transition: all 0.3s;
      cursor: pointer;
      opacity: 1;
      transition: all 0.3s ease-in; }
      .footer .main-footer .form__btn:hover {
        opacity: 0.7; }
  .footer .sub-footer {
    margin-top: 3rem;
    padding: 1rem 0;
    color: white;
    background-color: #43403e; }
    .footer .sub-footer__social-list__item:not(:last-child) {
      margin-right: 1rem; }
    .footer .sub-footer__social-list__link {
      text-decoration: none;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 3rem;
      height: 3rem;
      border-radius: 0.4rem;
      border: 0.1rem solid #fff;
      background-color: #43403e;
      cursor: pointer;
      transition: all 0.3s ease-in; }
      @media (max-width: 575.98px) {
        .footer .sub-footer__social-list__link {
          width: 2.5rem;
          height: 2.5rem;
          border-radius: 0.3rem; } }
      .footer .sub-footer__social-list__link i {
        font-size: 1.6rem;
        color: #fff;
        transition: all 0.3s ease-in; }
        @media (max-width: 575.98px) {
          .footer .sub-footer__social-list__link i {
            font-size: 1.2rem; } }
      .footer .sub-footer__social-list__link:hover {
        border: 0.1rem solid #43403e;
        background-color: #fff; }
        .footer .sub-footer__social-list__link:hover i {
          color: #69dc9e; }
    .footer .sub-footer__social-list__icon {
      color: #fff;
      transition: 0.5s transform; }
    .footer .sub-footer__copyright {
      font-family: inherit; }
      .footer .sub-footer__copyright__sentences {
        text-transform: uppercase;
        font-weight: 600;
        color: inherit;
        margin-bottom: 0;
        font-size: 1.3rem; }
        @media (max-width: 575.98px) {
          .footer .sub-footer__copyright__sentences {
            font-size: 1rem; } }
      .footer .sub-footer__copyright__link {
        text-decoration: none;
        font-weight: 700;
        color: inherit;
        transition: color 0.2s; }
        .footer .sub-footer__copyright__link:hover {
          color: #69dc9e;
          text-decoration: underline; }

/********** defines main layout of all pages *****************/
/* ******************** HOME PAGE *********************/
.section--logo {
  padding: 2rem 0;
  display: block; }
  @media (max-width: 1199.98px) {
    .section--logo {
      padding: 1.5rem 0; } }
  @media (max-width: 991.98px) {
    .section--logo {
      display: none; } }
  .section--logo__content {
    text-align: center;
    margin: 0 auto; }
  .section--logo__logo {
    width: 200px;
    height: auto; }
  .section--logo__title {
    font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: rgba(67, 64, 62, 0.9);
    margin-top: 1.5rem; }
    @media (max-width: 1399.98px) {
      .section--logo__title {
        font-size: 2.25rem; } }
    @media (max-width: 1199.98px) {
      .section--logo__title {
        font-size: 2rem; } }
    .section--logo__title__char {
      color: #69dc9e; }

.mission_card {
  background-color: #f3f8fe;
  border: 1px solid rgba(1, 1, 47, 0.5);
  border-radius: 1rem;
  background-size: cover;
  position: relative;
  width: 100%;
  height: 365px;
  font-family: "Open Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  overflow: hidden;
  transition: all 0.3s;
  cursor: pointer; }
  .mission_card:hover {
    box-shadow: 0 2px 4px #707070; }
    .mission_card:hover .mission_content {
      top: 53%; }
  @media (max-width: 991.98px) {
    .mission_card {
      height: 265px; } }

.mission_header {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  font-family: "Source Sans Pro", sans-serif;
  color: #01012f;
  font-size: 4vw;
  font-weight: bold;
  text-transform: uppercase; }
  @media (max-width: 767.98px) {
    .mission_header {
      font-size: 3.5rem; } }

.mission_content {
  position: absolute;
  left: 0;
  top: 100%;
  height: 50%;
  width: 100%;
  padding: 10px;
  padding-top: 20px;
  text-align: center;
  color: #fff;
  background-image: linear-gradient(to bottom, rgba(223, 81, 85, 0.6), #df5155);
  transition: all 0.3s ease;
  line-height: 25px; }
  .mission_content:last-child {
    display: flex;
    justify-content: space-around; }
    .mission_content:last-child ul {
      text-align: left;
      padding: 0; }
  .mission_content p {
    margin: 0;
    overflow-y: auto; }
  @media (min-width: 767.98px) and (max-width: 991.9px) {
    .mission_content {
      font-size: 1.5vw; } }

.section--markets {
  background-color: #fff;
  margin-bottom: -1.5rem; }

.markets_link {
  text-decoration: none; }

.markets_card {
  border: 0.15rem solid #01012f;
  padding: 0.15rem;
  position: relative;
  background-image: linear-gradient(45deg, #01012f, #7c98b3);
  background-size: cover;
  background-clip: content-box;
  background-position: center;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.5s ease-in; }
  .markets_card:hover {
    box-shadow: 0 2px 4px #707070; }
    .markets_card:hover .markets-card_img {
      opacity: 1; }
    .markets_card:hover .markets-card_header {
      transform: rotate(360deg); }
  @media (max-width: 1199.98px) {
    .markets_card {
      width: 250px;
      height: 250px; } }
  @media (max-width: 991.98px) {
    .markets_card {
      width: 200px;
      height: 200px; } }

.markets-card_header {
  text-transform: uppercase;
  color: #fff;
  font-size: 3rem;
  font-weight: 500;
  text-align: center;
  z-index: 2;
  transition: transform 0.5s ease-in; }
  @media (max-width: 1199.98px) {
    .markets-card_header {
      font-size: 3rem; } }
  @media (max-width: 991.98px) {
    .markets-card_header {
      font-size: 2rem; } }

.section--partners .owl-dots {
  display: none; }

.partners_content {
  font-size: 2rem;
  width: 80%;
  margin: 0 auto 2rem;
  display: block;
  color: #545454;
  text-align: justify; }
  @media (max-width: 1199.98px) {
    .partners_content {
      font-size: 1.8rem; } }
  @media (max-width: 991.98px) {
    .partners_content {
      font-size: 1.6rem; } }
  @media (max-width: 767.98px) {
    .partners_content {
      font-size: 1.4rem; } }
  @media (max-width: 575.98px) {
    .partners_content {
      font-size: 1.2rem; } }
  @media (max-width: 991.98px) {
    .partners_content {
      width: 95%; } }

.partners_card {
  display: flex;
  width: 100% !important;
  height: 150px;
  margin: 10px auto;
  background-color: white;
  border: 1.5px solid #69dc9e; }
  .partners_card img {
    width: 100px !important;
    margin: auto;
    display: block; }

/********************* ABOUT US PAGE ********************/
.who_content {
  font-family: inherit;
  font-family: 500;
  width: 80%;
  margin: 0 auto 20px;
  color: #545454; }

@media (max-width: 767.98px) {
  .section--why-saudi-bell__info {
    padding: 0 1.5rem; } }

.section--why-saudi-bell__text {
  color: #01012f;
  font-family: inherit;
  font-size: 1.7rem;
  font-weight: normal;
  word-spacing: 0.3rem;
  line-height: 2.2rem; }
  @media (max-width: 767.98px) {
    .section--why-saudi-bell__text {
      font-size: 1.5rem; } }
  .section--why-saudi-bell__text:not(:last-child) {
    margin-bottom: 2.5rem; }

.section--why-saudi-bell .dcs-logo {
  width: 90%;
  margin: auto; }
  .section--why-saudi-bell .dcs-logo__image {
    display: block;
    width: 100%;
    height: auto; }

.section--timeline {
  overflow-x: hidden; }

.section--founders__text {
  font-size: 1.6rem;
  line-height: 1.5;
  color: #878e94;
  padding: 0 1rem;
  margin: 2rem 0; }

.section--founders__img-container {
  width: 25rem;
  height: 25rem;
  border-radius: 50%;
  margin: 0 auto;
  background-image: url("../img/founders-messages/Picture3.png");
  background-size: contain;
  position: relative; }

.section--founders__img {
  display: block;
  width: 70%;
  height: 70%;
  border-radius: 50%;
  position: absolute;
  top: 18%;
  left: 15%;
  transform: translate(-50% -50%); }

.stories-card_img {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
  border: 1px solid black;
  background-color: #fff; }
  .stories-card_img img {
    max-width: 100%;
    max-height: 100%; }

.stories-card_header {
  font-family: "Source Sans Pro", sans-serif;
  color: #ef233c;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  min-height: 50px; }
  @media (max-width: 1199.98px) {
    .stories-card_header {
      font-size: 1.7rem; } }

.stories-card_content {
  font-family: inherit;
  margin-bottom: 20px; }
  .stories-card_content:first-of-type {
    height: 300px;
    overflow-x: auto; }
    @media (max-width: 767.98px) {
      .stories-card_content:first-of-type {
        height: auto; } }
  .stories-card_content:not(:first-of-type) {
    display: none; }

.stories-card_subheader {
  font-weight: "Source Sans Pro", sans-serif;
  font-weight: 700;
  font-size: 1.7rem;
  text-align: center;
  margin-bottom: 10px;
  color: #01012f; }
  @media (max-width: 1199.98px) {
    .stories-card_subheader {
      font-size: 1.5rem; } }

.stories-card_description {
  font-family: inherit;
  text-align: justify;
  color: #061018; }

.stories-card_button {
  display: block;
  padding: 5px 20px;
  margin: auto;
  color: white;
  background-color: #ef233c;
  border: none; }

/******************** CLIENTS PAGE ********************/
/*=============== START CLIENTS SECTION ===============*/
.section--clients {
  text-align: center; }
  .section--clients .clients_img {
    padding: 1rem;
    width: 150px;
    height: 150px;
    display: block;
    margin: 2rem auto 0;
    background-color: white;
    border: 0.1rem solid #000; }
    @media (min-width: 768px) and (max-width: 991.98px) {
      .section--clients .clients_img {
        width: 120px;
        height: 120px; } }
  .section--clients .clients_name {
    width: 150px;
    margin: auto;
    margin-top: 1rem;
    padding: 0 8%;
    font-size: 14px;
    font-weight: 700;
    font-family: inherit;
    text-transform: uppercase; }
    @media (min-width: 768px) and (max-width: 991.98px) {
      .section--clients .clients_name {
        width: 120px; } }

/*=============== END CLIENTS SECTION ===============*/
/*=============== START CONTACT SECTION ===============*/
.section--contact-us__text {
  font-family: inherit;
  color: #878e94;
  font-size: 1.8rem;
  font-weight: 500; }

.section--contact-us__email {
  font-size: 2.2rem;
  padding: 2rem; }
  .section--contact-us__email__svg, .section--contact-us__email__icon {
    color: #ef233c;
    font-size: 3.5rem; }
  .section--contact-us__email__link {
    text-decoration: none;
    margin-left: 1rem;
    color: #01012f;
    transition: all 0.3s;
    font-weight: 600; }
    .section--contact-us__email__link:hover {
      text-decoration: underline;
      color: #ef233c; }

.section--contact-us .form__label {
  font-size: 1.6rem; }
  @media (max-width: 991.98px) {
    .section--contact-us .form__label {
      font-size: 1.3rem; } }
  @media (max-width: 767.98px) {
    .section--contact-us .form__label {
      font-size: 1.1rem; } }
  @media (max-width: 575.98px) {
    .section--contact-us .form__label {
      font-size: 1.3rem;
      height: auto; } }

.section--contact-us .form__submit-btn {
  font-size: 2.6rem; }
  @media (max-width: 991.98px) {
    .section--contact-us .form__submit-btn {
      font-size: 2rem; } }

/*=============== END CONTACT SECTION ===============*/
/*=============== START PRODUCT SECTION ===============*/
.product-section__img img {
  width: 100%;
  border-radius: 1rem;
  padding: 0.3rem;
  border: 0.2rem solid #69dc9e; }

.product-section__content {
  padding-left: 5rem; }
  @media (max-width: 767.98px) {
    .product-section__content {
      padding: 4rem 0 1rem;
      text-align: center; } }
  .product-section__content h2 {
    text-transform: uppercase;
    font-size: 3rem;
    font-weight: 600;
    color: #01012f; }
    .product-section__content h2::first-letter {
      color: #69dc9e; }
  .product-section__content p {
    color: #878e94;
    padding: 2rem 0; }

/*=============== END PRODUCT SECTION ===============*/