.custom-text {
  -webkit-text-stroke: 1px #0B3558;
  -webkit-text-fill-color: transparent;
  opacity: .15
}

.custom-text-white {
  -webkit-text-stroke: .5px #ffffff;
  -webkit-text-fill-color: transparent;
  opacity: .15
}

.grid-service {
  &:hover {
    box-shadow: 0 18px 88px-4px #18274b26, 0 0 28px #18274b26
  }
}

@keyframes pulse-border {
  0% {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    transform: translate(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1
  }

  to {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    transform: translate(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0
  }
}

.video-icon:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translate(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: #A91116 repeat scroll 0 0;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-animation: pulse-border 2s ease-out infinite;
  animation: pulse-border 2s ease-out infinite
}

@keyframes floating-animate {
  0% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px)
  }

  50% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px)
  }

  to {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px)
  }
}

.floating-animate {
  animation-name: floating-animate;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -webkit-animation-name: floating-animate;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: floating-animate;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: floating-animate;
  -ms-animation-duration: 2s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: floating-animate;
  -o-animation-duration: 2s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear
}

@keyframes heading-move {
  0% {
    transform: translate(-1px)
  }

  50% {
    transform: translate(30px)
  }

  to {
    transform: translate(-1px)
  }
}

.heading-move:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  line-height: 20px;
  font-weight: 600;
  text-align: center;
  -webkit-animation: heading-move 4s infinite linear;
  animation: heading-move 4s infinite linear;
  border-bottom: solid #fff 3px
}

.heading-move:after {
  content: "\276f\276f";
  position: absolute;
  color: #a91116;
  left: 0;
  top: -8px;
  font-size: 15px;
  letter-spacing: -1px;
  height: 20px;
  width: 20px;
  line-height: 20px;
  font-weight: 600;
  text-align: center;
  -webkit-animation: heading-move 4s infinite linear;
  animation: heading-move 4s infinite linear
}

.heading-move-full-white:after {
  color: #a91116 !important
}

.heading-move-full-white:before {
  border-bottom-color: #a91116 !important
}

.heading-move-bright:before {
  border-bottom-color: #eaf0f7 !important
}

.heading-move-pink:before {
  border-bottom-color: #fdeaea !important
}

.track-input {
  box-shadow: none !important
}

#goog-gt-vt {
  display: none
}

#google_translate_element .skiptranslate.goog-te-gadget {
  height: 38px;
  display: flex;
  flex-direction: column;
  gap: 50px
}

#google_translate_element .skiptranslate.goog-te-gadget>span {
  display: none
}

.goog-te-gadget .goog-te-combo {
  margin: 0 !important;
  height: 38px;
  padding: 0 12px;
  border: 1px solid #0B3558;
  color: #0b3558
}

@media all and (max-width: 640px) {
  .goog-te-gadget .goog-te-combo {
    padding: 0 8px
  }
}

.custom-tab {
  justify-content: space-between
}

.custom-tab button {
  box-shadow: none;
  color: #0b3558;

  &:focus {
    box-shadow: none
  }

  &[aria-selected=true] {
    color: #0069d9;
    border-color: #0069d9;
    font-weight: 600
  }
}

.custom-modal div {
  background: transparent
}

.slider-wrapper {
  display: flex;
  transition: transform .5s ease-in-out
}

.slider-item {
  flex: 0 0 33.33%
}

.blog-carousel div,
.home-slider div {
  overflow: hidden !important
}

.home-slider .group:focus .group-focus\:ring-white {
  --tw-ring-opacity: 0
}

.body-wygwys img {
  margin: 0 auto
}

.body-wygwys h2 {
  font-weight: 700;
  font-size: 20px;
  margin-top: 16px
}

.body-wygwys h2:first-child {
  margin-top: 0
}

.body-wygwys h3 {
  font-weight: 700;
  font-size: 18px;
  margin-top: 12px
}

.body-wygwys h3:first-child {
  margin-top: 0
}

.body-wygwys strong {
  font-weight: 700
}

.progress-scroll {
  position: fixed;
  top: 0;
  z-index: 10000000;
  width: 100%;
  background-color: transparent
}

.progress-container {
  width: 100%;
  height: 3px;
  background: transparent
}

.progress-bar {
  height: 3px;
  background: #0069d9;
  width: 0%
}

@media all and (max-width: 1200px) {
  .overviewComponent {
    padding-bottom: 32px
  }

  .overviewComponent .overview-grid {
    gap: 32px
  }

  .overviewComponent .image-overview {
    height: auto
  }

  .overviewComponent .info {
    position: relative;
    bottom: 0;
    margin-top: 32px
  }

  .overviewComponent .analytics {
    padding: 16px;
    gap: 16px
  }

  .overviewComponent .president .presidentImage {
    padding: 32px
  }

  .overviewComponent .president .presidentImage img {
    width: 150px
  }
}

@media all and (max-width: 1120px) {
  .overviewComponent .overview-grid {
    align-items: center
  }
}

@media all and (max-width: 1024px) {
  .overviewComponent .overview-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr))
  }

  .overviewComponent .analytics .count {
    padding-left: 16px;
    padding-right: 16px
  }

  .overviewComponent .analytics .count .countNumber {
    font-size: 24px
  }

  .overviewComponent .analytics .count .countLabel {
    font-size: 18px
  }

  .overviewComponent .president .presidentImage {
    padding: 16px
  }

  .overviewComponent .president .presidentImage img {
    width: 150px
  }
}

@media all and (max-width: 830px) {
  .overviewComponent .contentInfo {
    padding-left: 0
  }

  .overviewComponent .leftDraw {
    display: none
  }

  .overviewComponent .president .presidentImage {
    padding: 16px
  }

  .overviewComponent .president .presidentImage img {
    width: 150px
  }
}

@media all and (max-width: 767px) {
  .overviewComponent .president {
    flex-direction: row;
    max-width: 100%;
    gap: 16px;
    margin-top: 16px
  }

  .overviewComponent .president .presidentImage {
    padding: 0;
    z-index: 100;
    flex-direction: column
  }

  .overviewComponent .president .presidentContent {
    padding: 16px
  }

  .overviewComponent .president .presidentName {
    text-align: center
  }

  .overviewComponent .president .presidentImage img {
    width: 100%;
    height: auto;
    object-fit: contain
  }
}