/** -------------------------------------------------------------------------
*
*   CSS for ALC (front)
*   Author: Leye Jin
*   Version: 3.1337
*
* ---------------------------------------------------------------------------*/

/* General styles
=============================================================================*/
/* CSS colours -------------------*/
::selection {
   background: var(--bg2);
   color: var(--bg4);
   text-shadow: none;
}

:root {
   --bg1: #171314;
   --bg2: #BC151A;
   --bg3: #FFC800;
   --bg4: #FFFFFF;
   --bg5: #3C3C3C;
   --alc-danger: #A21616;
   --alc-danger-bg: #FCE5E5;
   --alc-warning: #C46B04;
   --alc-warning-bg: #FDEDDB;
   --alc-info: #3640F5;
   --alc-info-bg: #DDEBFE;
   --alc-success: #27895B;
   --alc-success-bg: #EFFFEB;
}

/* Page elements -------------------*/
body {
   margin: 0 auto;
   padding: 0;
   position: relative;
   overflow-x: hidden;
}

h1 {
   font-family: "Khand", sans-serif;
   color: var(--bg4);
   font-size: clamp(36px,5vw,80px);
   line-height: 1;
   letter-spacing: 2px;
   font-weight: 900;
   text-shadow: 2px 2px 4px rgb(23, 19, 20);
}

h1 span {
   display: inline-block;
   font-family: "Zeyada", cursive;
   color: var(--bg3);
   font-weight: bold;
   font-size: 160px;
   height: 90px;
   text-shadow: none;
}

h2 {
   font-family: "Khand", sans-serif;
   font-size: 32px;
   letter-spacing: 1px;
   color: var(--bg1);
   font-weight: bold;
}

h3 {
   font-family: "Khand", sans-serif;
   color: var(--bg1);
   letter-spacing: 2px;
   font-size: 24px;
}

h4 {
   color: var(--bg2);
   letter-spacing: 2px;
   font-weight: bold;
}

.footer-bottom, a, p, .alc-btn, .footer-top, .navigation-link, .navigation-menu-link, .alc-form .input-group-text, .mini-card-contact {
   font-size: 22px;
   font-family: "Khand", sans-serif;
}

hr {
   border-top: 1px solid var(--bg4);
}

.transition-page {
   cursor: pointer;
}

.fx-word {
   overflow: hidden;
}

.fx-word h1, .fx-word h2, .fx-word h3, .fx-word p {
   -webkit-transition: 1.2s cubic-bezier(.65, .05, .36, 1);
   transition: 1.2s cubic-bezier(.65, .05, .36, 1);
}

.fx-word h1:nth-child(2) {
   transition-delay: 0.2s;
}

.fx-word h1:nth-child(3) {
   transition-delay: 0.3s;
}

.fx-word h1:nth-child(4) {
   transition-delay: 0.5s;
}

.fx-off {
   transform: translate(-20%, 0);
   opacity: 0;
}

img, .captcha-img {
   user-select: none;
   -moz-user-select: none;
   -webkit-user-drag: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   pointer-events: none;
}

.skeleton {
   position: relative;
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   height: 550px;
   background-color: var(--bg5);
   -webkit-transition: all .3s;
   transition: all .3s;
   animation: image-loading 3s infinite;
}

@-webkit-keyframes image-loading {
  0% {
   background-color: var(--bg5);
  }
  50% {
   background-color: var(--bg4);
  }
  100% {
   background-color: var(--bg5);
  }
}
@keyframes image-loading {
  0% {
   background-color: var(--bg5);
  }
  50% {
   background-color: var(--bg4);
  }
  100% {
   background-color: var(--bg5);
  }
}

/* Sections -------------------*/
section {
   position: relative;
   z-index: 5;
   margin: 0 auto;
   overflow: hidden;
}

.section-container {
   padding: 64px 32px;
   min-height: 720px;
}

.section-overlay {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background: rgba(0, 0, 0, 0.5);
}

.section-image {
   background-repeat: no-repeat;
   background-position-x: 50%;
   background-position-y: 50%;
   background-size: cover;
}

.section-dark {
   background: var(--bg1);
}

section h3 {
   font-size: 32px;
   text-transform: uppercase;
   color: var(--bg4);
   position: relative;
   border-left: 8px solid var(--bg2);
   padding-left: 16px;
   font-weight: 900;
   height: 64px;
}

section h3 span {
   position: absolute;
   font-size: 22px;
   top: 36px;
   left: 0;
   color: var(--bg2);
   text-transform: uppercase;
   padding-left: 16px;
   font-weight: 400;
}

section p {
   color: var(--bg4);
}

.section-light {
   background: rgba(255, 255, 255, 0.5);
}

.section-light h3 {
   color: var(--bg1);
}

.section-light p {
   color: var(--bg1);
}

.header {
   background-attachment: fixed;
}

.header-small {
   height: 300px;
}

.header-overlay {
   background: rgba(23,19,20,0.5);
   min-height: 100vh;
   width: 100%;
}

.header-img {
   position: fixed;
   bottom: -39%;
   right: -17%;
   width: 1024px;
   opacity: 0.2;
}

.header-img img {
   -webkit-transition: all 2s cubic-bezier(.65, .05, .36, 1);
   transition: all 2s cubic-bezier(.65, .05, .36, 1);
   width: 1024px;
}

.header-title {
   position: fixed;
   top: 50%;
   left: 0;
   transform: translateY(-25%);
   width: 100%;
   padding: 32px 64px;
}

.header-small .header-title {
   top: calc(25% + 96px);
}

.header-title p {
   color: rgba(255, 255, 255, 0.7);
   text-transform: uppercase;
   display: block;
}

.header-title h2 {
   color: var(--bg3);
   text-transform: uppercase;
   display: block;
}

.yt-embed {
   width: 100%;
   height: 512px;
   margin: 0;
}

.mini-card {
   border: 2px solid var(--bg5);
   text-align: center;
}

.mini-card i {
   display: block;
   color: var(--bg1);
   font-size: 32px;
   margin: 8px auto;
}

.mini-card .mini-card-link {
   color: var(--bg1);
   text-decoration: none;
   font-size: 20px;
   text-transform: uppercase;
}

.mini-card .mini-card-link span, .mini-card .mini-card-contact span {
   color: var(--bg2);
   font-size: 48px;
   font-weight: 900;
   letter-spacing: -1px;
   line-height: 1;
}

.mini-card .mini-card-contact {
   color: var(--bg1);
   text-decoration: none;
   font-size: 20px;
   text-transform: uppercase;
   margin-bottom: 0;
}

.mini-card-left {
   position: relative;
   padding: 16px 0;
   border-right: 2px solid var(--bg5);
   border-bottom: none;
   -webkit-transition: all 0.3s ;
   transition: all 0.3s;
}

.mini-card-right {
   position: relative;
   padding: 16px 0;
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
}

.mini-card-left:hover, .mini-card-right:hover {
   background: var(--bg1);
}

.mini-card-left:hover i, .mini-card-right:hover i {
   color: var(--bg4);
}

.mini-card-left:hover a, .mini-card-right:hover a, .mini-card-left:hover .mini-card-contact, .mini-card-right:hover .mini-card-contact {
   color: var(--bg4);
}

.mini-card-left:hover a span, .mini-card-right:hover a span, .mini-card-left:hover .mini-card-contact span, .mini-card-right:hover .mini-card-contact span {
   color: var(--bg2);
}

.alc-tile {
   background: var(--bg1);
   padding-left: 16px;
   padding-right: 16px;
   border: 1px solid var(--bg5);
   position: relative;
   overflow: hidden;
   height: 320px;
}

.alc-tile-title {
   display: flex;
   position: absolute;
   top: 50%;
   align-items: center;
   padding: 0 32px;
   position: relative;
   opacity: 1;
   transform: translateY(-50%);
   height: 64px;
}

.alc-tile-text {
   position: absolute;
   top: 50%;
   padding: 0 16px;
   opacity: 0;
   transform: translateY(0);
   color: var(--bg1)!important;
   font-size: 20px;
}

.alc-tile, .alc-tile-title, .alc-tile-text, .alc-tile h3, .alc-tile i {
   -webkit-transition: all 0.5s!important;
   transition: all 0.5s!important;
}

.alc-tile h3 {
   border-left: none;
   padding-left: 0;
   color: var(--bg2);
   height: auto;
   margin-bottom: 0;
}

.alc-tile i {
   color: var(--bg4);
   font-size: 64px;
   opacity: 1;
}

.alc-tile:hover {
   background-image: url('../img/services-tile-bg.jpg');
   background-size: cover;
}

.alc-tile:hover .alc-tile-title {
   opacity: 0;
}

.alc-tile:hover .alc-tile-text {
   opacity: 1;
   transform: translateY(-50%);
}

.alc-tile:hover .alc-tile-title i {
   color: var(--bg1);
   opacity: 0;
}

.acc-list {
   background: var(--bg5);
   display: flex;
   align-items: center;
   padding: 8px;
   border: 1px solid var(--bg3);
}

.acc-list i {
   color: var(--bg3);
   font-size: 24px;
}

.acc-list p {
   font-size: 18px;
}

.acc-list p span {
   color: var(--bg3);
   font-size: bold;
}

.project-tile {
   height: 600px;
}

.project-client {
   background: var(--bg4);
   padding: 4px 8px;
   text-align: center;
}

.project-title {
   background: var(--bg1);
   padding: 16px;
   text-align: center;
}

.project-number {
   background: var(--bg2);
   padding: 8px;
   width: 80px;
   text-align: center;
}

.project-title h3, .project-number h3 {
   border-left: none;
   padding-left: 0;
   height: auto;
   margin-bottom: 0;
   font-size: 28px;
   color: var(--bg4);
}

.project-client h3 {
   border-left: none;
   padding-left: 0;
   height: auto;
   margin-bottom: 0;
   font-size: 16px;
   color: var(--bg1);
}

.project-overlay {
   padding: 80px 32px;
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   background: rgba(23, 19, 20, 0.2);
}

.project-view {
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   -webkit-transition: 0.3s;
   transition: 0.3s;
}

.project-view i {
   opacity: 0;
   color: var(--bg4);
   font-size: 64px;
   -webkit-transition: 0.5s;
   transition: 0.5s;
   display: block;
   left: calc(50% - 40px);
   position: relative;
   top: 50%;
}

.project-tile:hover .project-view {
   background: rgba(23, 19, 20, 0.8);
}

.project-tile:hover .project-view i {
   opacity: 1;
}

/* Buttons -------------------*/
.alc-link {
   text-decoration: underline;
   text-decoration-style: dotted;
   transition: 0.3s;
   -webkit-transition: 0.3s;
   color: var(--bg1);
}

.alc-link:hover {
   text-decoration: underline;
   text-decoration-style: dotted;
   color: var(--bg2);
}

.alc-btn {
   display: inline-block;
   text-decoration: none !important;
   text-align: center;
   text-transform: uppercase;
   outline: none;
   padding: 8px 24px;
   cursor: pointer;
   transition: 0.3s;
   -webkit-transition: 0.3s;
}

.alc-btn i {
   transition: 0.3s;
   -webkit-transition: 0.3s;
}

.alc-btn-normal {
   color: var(--bg4);
   background: var(--bg1);
}

.alc-btn-normal:hover {
   color: var(--bg1);
   background: var(--bg4);
}

.alc-btn-normal:disabled {
   opacity: 0.5;
}

.alc-btn-normal:disabled:hover {
   color: var(--bg2);
   background: var(--bg1);
}

.alc-btn-red {
   color: var(--bg4);
   background: var(--bg2);
}

.alc-btn-red:hover {
   color: var(--bg1);
   background: var(--bg4);
}

/* Alerts -------------------*/
.alert {
   display: flex;
   border: 0;
   border-radius: 0;
   padding: 0;
}

.alert i {
   font-size: 32px;
   padding: 16px;
   color: var(--bg4);
   display: flex;
   align-items: center;
   width: 64px;
}

.alert a, .alert b {
   display: contents;
}

.alert-body {
   padding: 16px;
   font-family: "Khand", sans-serif;
   font-size: 20px;
}

.alert-danger {
   color: var(--bg2);
   background-color: var(--alc-danger-bg);
}

.alert-danger i {
   background: var(--bg2);
}

.alert-warning {
   color: var(--alc-warning);
   background-color: var(--alc-warning-bg);
}

.alert-warning i {
   background: var(--alc-warning);
}

.alert-info {
   color: var(--bg2);
   background-color: transparent;
   border: 2px solid var(--bg2);
}

.alert-info i {
   background: none;
}

.alert-success {
   color: var(--alc-success);
   background-color: var(--alc-success-bg);
}

.alert-success i {
   background: var(--alc-success);
}

/* Preloader -------------------*/
.alc-preloader-wrapper {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: var(--bg4);
   z-index: 99;
   user-select: none;
   height: 100vh;
   transition: 0.8s cubic-bezier(.77,0,.18,1);
   -webkit-transition: 0.8s cubic-bezier(.77,0,.18,1);
}

.alc-preloader-logo {
   position: absolute;
   top: calc(50% - 150px);
   left: calc(50% - 150px);
   width: 300px;
   height: 300px;
}

.alc-preloader-logo img {
   width: 300px;
   height: 300px;
}

/* Loading spinner -------------------*/
.loading-overlay {
   background-color: rgba(0, 0, 0, 0.8);
   z-index: 49;
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   display: none;
}

.loading-overlay img {
   position: absolute;
   left: calc(50% - 32px);
   top: calc(50% - 32px);
}

.loader {
   position: absolute;
   top: calc(50% - 145px);
   left: calc(50% - 145px);
   width: 290px;
   height: 290px;
   animation: rotation 1s linear infinite;
} 
.loader::after {
   content: '';
   position: absolute;
   top: calc(50% - 145px);
   left: calc(50% - 145px);
   width: 290px;
   height: 290px;
   border-radius: 50%;
   border: 8px solid transparent;
   border-bottom-color: var(--bg2);
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
} 

/* Modals -------------------*/
.modal-backdrop {
   opacity: 0.8!important;
}

.modal-content {
   border: 0;
   border-radius: 0 !important;
   background: transparent;
}

.modal .close {
   position: absolute;
   right: 16px;
   top: 12px;
   padding: 0;
   display: flex;
   -webkit-transition: all .3s;
   transition: all .3s;
   background: none;
   border: none;
   z-index: 2;
}

.modal .close i {
   font-size: 48px;
   color: var(--bg2);
   cursor: pointer;
   -webkit-transition: all .3s;
   transition: all .3s;
}

.modal .close:hover i {
   color: var(--bg4);
}

.modal .close:focus {
   outline: none;
}

.modal-header {
   border: 0;
}

.modal.fade .modal-dialog {
   transform: translateX(-16px);
   opacity: 0.5;
   -webkit-transition: all .3s;
   transition: all .3s;
}

.modal.show .modal-dialog {
   opacity: 1;
   transform: translateX(0);
}

.modal-open {
  padding-right: 0 !important;
  overflow-y: auto;
}

/* Top navigation menu
=============================================================================*/
/* Navbar -------------------*/

.navigation {
   z-index: 61;
   display: flex;
   background: var(--bg4);
   align-items: center;
   width: 100%;
   position: fixed;
   height: 96px;
}

.navigation-brand {
   opacity: 0;
   -webkit-transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
   transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
   margin-left: 16px;
   text-decoration: none;
}

.navigation-brand-name {
   display: flex;
   flex-direction: column;
   justify-content: center;
}

.navigation-acc {
   display: inline-block;
   width: 23vw;
   height: 96px;
   background: center center url('../img/accreditations.jpg') no-repeat;
   background-size: contain;
}

.navigation-links {
   display: flex;
   flex-direction: row;
   -webkit-transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
   transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
   -webkit-transition-delay: 0.5s;
   transition-delay: 0.5s;
   opacity: 0;
   text-transform: uppercase;
   background: var(--bg1);
   text-align: center;
}

.navigation .navigation-link {
   -webkit-transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
   transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
   height: 96px;
   padding: 32px 0;
   width: 128px;
   position: relative;
   text-decoration: none;
   color: var(--bg4);
}

.navigation .navigation-link:hover {
   background: var(--bg4);
   color: var(--bg1);
}

.navigation-toggler {
   height: 32px;
   z-index: 63;
   display: none;
   position: absolute;
   right: 32px;
}

.navigation-links .link-active span {
   width: 0;
   height: 0;
   border-left: 16px solid transparent;
   border-right: 16px solid transparent;
   border-bottom: 12px solid var(--bg3);
   display: block !important;
   position: absolute;
   bottom: 0;
   left: 64px;
}

.navigation-links .navigation-link span {
   display: none;
}

.navigation-toggler:focus, .navigation-toggler:active {
   box-shadow: none;
}

.navigation-bars {
   position: relative;
   display: inline-block;
   width: 32px;
   height: 2px;
   background: var(--bg1);
}

.navigation-bars:after, .navigation-bars:before {
   content: "";
   position: absolute;
   width: 32px;
   height: 2px;
   background: var(--bg1);
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
}

.navigation-toggler-off .navigation-bars {
   top: 0px;
}

.navigation-toggler-off .navigation-bars:before {
   top: -10px;
}

.navigation-toggler-off .navigation-bars:after {
   top: 10px;
}

.navigation-toggler-on .navigation-bars:before, .navigation-toggler-on .navigation-bars:after {
   top: 0;
}

/* Offscreen navigation menu -------------------*/
.navigation-overlay {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.6);
   backdrop-filter: blur(2px);
   display: none;
}

.navigation-menu {
   position: fixed;
   top: 0;
   right: 0;
   width: 75%;
   background: var(--bg4);
   z-index: 62;
   -webkit-transition: 0.8s cubic-bezier(.65, .05, .36, 1);
   transition: 0.8s cubic-bezier(.65, .05, .36, 1);
   backdrop-filter: blur(5px);
   overflow: auto;
   height: 100vh;
}

.navigation-menu-body {
   padding: 96px 0;
}

.navigation-off {
   transform: translateX(100%);
}

.navigation-on {
   transform: translateX(0);
}

.navigation-menu-link {
   color: var(--bg1);
   display: block;
   padding: 16px 32px;
   text-decoration: none;
}

.navigation-menu-link i {
   color: var(--bg2);
}

.navigation-menu-link:hover {
   color: var(--bg4);
   background: var(--bg1);
}

/* Homepage
=============================================================================*/
.scroll-down {
   position: fixed;
   width: 1px;
   height: 56px;
   left: 50%;
   bottom: 0;
   margin: auto;
   background-color: rgba(255, 255, 255, 0.7);
   z-index: 6;
}

.scroll-down i {
   position: absolute;
   animation: drop 3s cubic-bezier(.92,-0.03,.93,.1) infinite;
    animation-direction: normal;
   animation-direction: normal;
   -webkit-animation-direction: normal;
   animation-direction: normal;
   left: -7px;
   color: var(--bg3);
   font-size: 12px;
}

@-webkit-keyframes drop {
   0% {
      top: -6px;
      opacity: 0;
   }
   50% {
      opacity: 0.8;
   }
   100% {
      top: 100%;
   }
}

@keyframes drop {
   0% {
      top: -6px;
      opacity: 0;
   }
   50% {
      opacity: 0.8;
   }
   100% {
      top: 100%;
   }
}

/* Carousels
=============================================================================*/
.carousel {
   padding: 16px;
}

.carousel-inner > .carousel-item {
   -webkit-transition: 0.8s cubic-bezier(.65, .05, .36, 1);
   transition: 0.8s cubic-bezier(.65, .05, .36, 1);
}

#gallery-carousel .carousel-item {
   -webkit-transition: 0.8s;
   transition: 0.8s;
}

.carousel-item-img {
   background-size: cover!important;
   height: 65vh;
}

.carousel p {
   color: var(--bg3);
}

.carousel-btn-next, .carousel-btn-prev {
   position: absolute;
   top: 50%;
   padding: 32px 0;
   width: 32px;
}

.carousel-btn-prev {
   left: 0;
}

.carousel-btn-next {
   right: 0;
}

.carousel .tsm-text {
   position: relative;
   font-size: 20px;
   font-family: "Khand", sans-serif;
   color: var(--bg4);
   padding: 24px 16px;
}

.carousel .tsm-text i {
   display: block;
   font-size: 32px;
   color: var(--bg2);
}

.carousel .tsm-name, .carousel .tsm-company {
   font-size: 20px;
   font-family: "Khand", sans-serif;
   padding: 4px 8px;
   text-align: center;
}

.carousel .tsm-name {
   background: var(--bg3);
   color: var(--bg1);
}

.carousel .tsm-company {
   background: var(--bg5);
   color: var(--bg4);
}

.carousel-indicators {
   position: relative;
   background-color: var(--bg5);
   padding: 8px 0;
   height: 56px;
}

.carousel-indicators [data-bs-target] {
   height: 20px;
   width: 20px;
   background-color: transparent;
   border: 2px solid var(--bg4);
   margin: 8px;
   -webkit-transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
   transition: all 0.5s cubic-bezier(.65, .05, .36, 1);
}

.carousel-indicators .active {
   background-color: var(--bg4);
   transform: scale(1.1);
}

.project-gallery-prev, .project-gallery-next {
   height: 56px;
   bottom: 0px;
   position: absolute;
   display: block;
   top: unset;
   z-index: 2;
   font-size: 24px;
   opacity: 1;
   -webkit-transition: 0.3s all;
   transition: 0.3s all;
}

.project-gallery-next {
   right: 0;
}

/* Gallery
=============================================================================*/
.gallery-item {
   position: absolute;
   bottom: 0;
   left: calc(50% - 64px);
   background: var(--bg5);
   color: var(--bg2);
   width: 128px;
   font-family: "Khand", sans-serif;
   font-size: 32px;
   text-align: center;
   font-weight: bold;
}

.gallery-item span {
   font-size: 16px;
   color: var(--bg4);
}

/* Footer
=============================================================================*/
.footer {
   position: relative;
   z-index: 5;
   box-shadow: 0px 0px 16px -8px var(--bg5);
}

.footer-overlay {
   background: rgba(255, 255, 255, 0.9);
   padding: 64px;
}

.footer p {
   margin-bottom: 0px;
}

.footer p i {
   color: var(--bg2);
}

.footer-top {
   background: center url('../img/footer-bg.jpg') no-repeat;
   background-size: cover;
}

.footer-bottom {
   background-color: var(--bg5);
   color: var(--bg4);
   padding: 16px 64px;
   text-align: center;
}

.footer-bottom a {
   color: var(--bg4);
}

.footer-ack {
   border: 2px solid var(--bg3);
   padding: 16px;
}

.footer-ack p {
   font-size: 20px;
}

.footer-contacts {
   margin-top: 32px;
}

/* Forms
=============================================================================*/
.alc-form h4 {
   text-align: center;
}

.alc-form p {
   font-size: 20px;
   color: var(--bg1);
   margin-bottom: 0;
}

.alc-form input[type="text"],
.alc-form input[type="email"] {
   -webkit-transition: all .3s;
   transition: all .3s;
   color: var(--bg4);
   background: rgba(255, 255, 255, 0.05);
   border-radius: 0;
   border: 1px solid var(--bg5);
   height: 45px;
}

.alc-form textarea {
   border-radius: 0;
   border: 1px solid var(--bg5);
   background: rgba(255, 255, 255, 0.05);
   resize: none;
}

.form-control::placeholder {
   color: rgba(255, 255, 255, 0.4);
}

.alc-form label, .form-control, .form-group {
   font-family: "Khand", sans-serif;
   color: var(--bg4);
}

.alc-form input[type="text"]:focus,
.alc-form input[type="email"]:focus,
.alc-form textarea:focus {
   background: none;
   border: 1px solid var(--bg3);
   box-shadow: none;
   color: var(--bg4);
}

.alc-form .form-check-input:focus {
   border-color: var(--bg3);
   outline: 0;
   box-shadow: none;
}

.alc-form .input-group {
   margin: 4px 0;
   flex-wrap: nowrap;
}

.alc-form .input-group-prepend {
   height: 45px;
}

.alc-form .input-group-text {
   background: var(--bg5);
   color: var(--bg4);
   border: none;
   border-radius: 0;
   height: 45px;
}

.alc-form .btn-spinner {
   position: absolute;
   height: 100%;
   width: 100%;
   background: rgba(0, 0, 0, 0.8);
   display: none;
}

.alc-form .btn-spinner span {
   position: absolute;
   top: calc(50% - 8px);
   left: calc(50% - 8px);
}

/* Responsive styles
=============================================================================*/
@media screen and (max-width: 1400px) {
   .navigation-acc {
      display: none;
   }
}

@media screen and (max-width: 1199.98px) {
   
   .navigation-links {
      display: none;
   }
   
   .navigation-toggler {
      display: block;
   }
   
   .navigation-menu {
      width: 33%;
   }
}

@media screen and (max-width: 991.98px) {
   h1 span {
      font-size: 128px;
   }
   
   .header-h1 p {
      font-size: 18px;
   }
   
   .navigation-menu {
      width: 50%;
   }
   
   .mini-card-left {
      border-right: none;
   }
   
   .footer-contacts {
      text-align: center;
   }
}

@media screen and (max-width: 767.98px) {
   h1 {
      letter-spacing: 0;
   }
   
   h1 span {
      font-size: 96px;
   }
   
   h3:before {
      width: 16px;
      height: 4px;
   }
   
   .section-overlay {
      padding: 32px 16px;
   }
   
   .navigation-menu {
      width: 75%;
   }
   
   .navigation-sn {
      display: none;
   }
   
   .header-title {
      padding: 32px;
      text-align: center;
   }
   
   .header-img {
      display: none;
   }
}

@media screen and (max-width: 575.98px) {
   h1 span {
      font-size: 72px;
      height: 0;
   }
   
   .navigation-brand {
      margin: 0 auto;
   }
   
   .navigation-brand-name {
      display: none;
   }
   
   .carousel .tsm-text {
      font-size: 18px;
   }
   
   .alc-tile-text {
      font-size: 16px;
   }
   
   .footer-top {
      padding: 32px;
   }
   
   .footer-bottom {
      padding: 16px 32px;
   }
}

@media screen and (max-width: 420px) {
   h3 span {
      display: none;
   }
}

@media screen and (max-height: 600px) {
   h1 span {
      font-size: 64px;
      height: 0;
   }
}