:root {
	--bs-primary: #3c4bf0;
	--bs-secondary: #28AA4A;
	--bs-light: #f6f6f6;
	--bs-dark: #15222B;
	--bs-accent1: #FFCB00;
	--bs-accent2: #657b96;
	--bs-accent3: #a6d1c4;
	--bs-primary-rgb: 60, 75, 240;
	--bs-secondary-rgb: 40, 170, 74;
	--bs-light-rgb: 246, 246, 246;
	--bs-dark-rgb: 21, 34, 43;
	--bs-accent1-rgb: 255, 203, 0;
	--bs-accent2-rgb: 101, 123, 150;
	--bs-accent3-rgb: 169, 180, 194;
   --bs-gradient: linear-gradient(0deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
	--bs-font-sans-serif: "gothambook", Helvetica, Arial, sans-serif;
	--bs-body-font-family: var(--bs-font-sans-serif);
	--bs-body-color: #383941;
	--bs-body-bg: #FFFFFF;
	--bs-body-bg-gradient: linear-gradient(to right top, #f2f2f2, #e1e1e1, #d1d1d1, #c1c1c1, #b1b1b1);
	--bs-heading-font:"poppinsextrabold", Helvetica, Arial, sans-serif;
	--bs-heading-alt-font:"poppinsbold", Helvetica, Arial, sans-serif;
	--bs-box-shadow-main: 0 30px 40px 0px rgba(var(--bs-primary-rgb), 0.15);
   --bs-breadcrumb-font-size: .75rem;
}

/* ==========================================================================
   WEBFONTS
   ========================================================================== */
	
   .got {font-family: 'gothambook'!important;}
   .gotb {font-family: 'gothambold'!important;}
   .gotm {font-family: 'gothammedium'!important;}
   .pop {font-family: 'poppinssemibold'!important;}
   .popb {font-family: 'poppinsbold'!important;}
   .popx {font-family: 'poppinsextrabold'!important;}

/* ==========================================================================
   BASE: opinionated defaults
   ========================================================================== */

	:root {--indent: 0;}
	@media screen and (min-width: 40rem) {
		:root {
			--indent: clamp(1.5rem, 4vw, 2.5rem);
		}
	}

   b, strong {font-family: 'gothambold';}

/* ==========================================================================
   LAYOUT
   ========================================================================== */

   /* HEADER */
   header {position:relative; left:0; top:0; right:0; z-index:99; width:100%; font-family: var(--bs-heading-alt-font);}
   header .inner-container {position:relative; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding:1rem .5rem; background-color:var(--bs-white);}
   header #fivew-logo img {max-height: 3rem; opacity: 1; transition:all 300ms ease;}
   header #fivew-logo img:hover {opacity: .75;}
   header .mobile-nav-toggler {display:block; cursor:pointer; color:var(--bs-black); font-size:2rem;}
   header #navbarSupportedContent {display:block;}
   header #main-nav {margin-left: auto; margin-right: 1rem;}

   /* Sticky Header */
   header .sticky-header {position:fixed; opacity:0; visibility:hidden; left:0; top:0; width:100%; padding:0; z-index:0; transition:all 500ms ease; background-color:var(--bs-white); box-shadow:0 0 .75rem rgba(0,0,0,0.10);}
   header.fixed-header .sticky-header {z-index:999; opacity:1; visibility:visible; -ms-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -op-animation-name: fadeInDown; -webkit-animation-name: fadeInDown; animation-name: fadeInDown; -ms-animation-duration: 500ms; -moz-animation-duration: 500ms; -op-animation-duration: 500ms; -webkit-animation-duration: 500ms; animation-duration: 500ms; -ms-animation-timing-function: linear; -moz-animation-timing-function: linear; -op-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; -ms-animation-iteration-count: 1; -moz-animation-iteration-count: 1; -op-animation-iteration-count: 1; -webkit-animation-iteration-count: 1; animation-iteration-count: 1;}

   /* Main Menu */
   .main-menu {position:relative; text-align:center; transition:all 300ms ease; display: none; justify-content: center;}
   .main-menu .navbar-collapse {padding:0; display:block !important;}
   .main-menu .navigation {position:relative; padding: 0; display: flex; margin:0 1.5rem; margin-block-start: 0;}
   .main-menu .navigation > li {position:relative; display:flex; align-items: center; transition:all 500ms ease; margin: 0 .75rem; text-transform: uppercase;}
   .main-menu .navigation > li > a {position: relative; display:block; padding:1.5rem 0; color:var(--bs-dark);}
   .main-menu .navigation > li:hover > a {color:var(--bs-primary);}
   .main-menu .navigation > li:before {position:absolute; content:''; left:0; bottom:0; height:.125rem; right:0; opacity:0; transform:scale(0.2,1); transition:all 500ms ease; background-color:var(--bs-primary);}
   .main-menu .navigation > li:hover:before {opacity:1; transform:scale(1,1);}

   /*Mobile Menu*/
   .mobile-menu {position: fixed; right: 0; top: 0; width: 18.75rem; padding-right:2rem; max-width:100%; height: 100%; visibility: hidden; z-index: 999999;}
   .mobile-menu #fivew-logo {position:relative; padding:1.5rem; text-align:left;}
   .mobile-menu #fivew-logo img {max-width:12.5rem;}
   .mobile-menu-visible {overflow: hidden;}
   .mobile-menu-visible .mobile-menu {visibility: visible;}
   .mobile-menu .menu-backdrop {position: fixed; right: 0; top: 0; width: 0%; height: 100%; z-index: 1; background: rgba(0,0,0,0.90); transform: translateX(101%); transition: all 900ms ease; transition-delay: 300ms;}
   .mobile-menu-visible .mobile-menu .menu-backdrop {opacity: 1; width:100%; visibility: visible; transition: all 900ms ease; transform: translateX(0%);}
   .mobile-menu .menu-box {position: absolute; right: -25rem; top: 0; width: 100%; height: 100%; max-height: 100%; overflow-y: auto; background: #ffffff; padding: 0; z-index: 5; border-radius: 0; transition: all 900ms ease;}
   .mobile-menu-visible .mobile-menu .menu-box {right:0; transition-delay: 600ms;}
   .mobile-menu .close-btn {position: absolute; right: 1rem; top: 1.5rem; line-height: 2rem; width: 2rem; text-align: center; font-size: 2rem; color: var(--bs-dark); cursor: pointer; z-index: 10; transition:all 0.5s ease; transform: translateY(-3.125rem);}
   .mobile-menu-visible .mobile-menu .close-btn {transform: translateY(0px); transition-delay: 900ms;}
   .mobile-menu .close-btn:hover {opacity: 0.50;}
   .mobile-menu .navigation {position: relative; display: block; width:100%; border-top: 1px solid rgba(0,0,0,0.10); padding-left: 0;}
   .mobile-menu .navigation li {position: relative; display: block; border-bottom: 1px solid rgba(0,0,0,0.10);}
   .mobile-menu .navigation li > a {position: relative; display: block; line-height: 1.5rem; padding: .75rem 1.25rem; font-size: 1rem; text-transform: uppercase;}
   .header .sticky-header .navbar-header {display:none;}
   .header .outer-box {position: relative;}

   @media (min-width: 992px) {}

   @media (min-width: 1200px) {
      header #main-nav {margin-left: 0;}
      header .inner-container {padding:1rem 2rem;}
      .main-menu {display: flex;}
      header .mobile-nav-toggler {display:none;}
      header.fixed-header .sticky-header #fivew-logo img {max-height: 2rem;}
   }

   @media (min-width: 1400px) {
      .main-menu {text-align:center;}
      .main-menu .navigation > li {margin:0 1.5rem;}
   }

   /* CONTAINERS */
   main {margin: 2rem 0 0; flex: 1;}

   section {padding-top: 2.125rem; height: auto; overflow-x: clip;}

   @media (min-width: 768px) {
      section {padding-top: 8.125rem;}
   }

   .fancybox-container {z-index: 100000;}
   .fancybox-content {background:rgba(255, 255, 255, 0.3); max-width:fit-content;}
   .fancybox-slide--html .fancybox-close-small {color: #FFFFFF;}

   .responsive-slider-container {position: absolute; top: 0; left: 0; bottom: 0; right: 0;}

/* ==========================================================================
   CONTENT
   ========================================================================== */

   /* REBOOT */
   /* Page Defaults */
   html, body {margin:0; padding:0; height: 100%;}
   body {font-family: var(--bs-body-font-family); display: flex; flex-direction: column; min-height: 100vh; overflow-x: hidden;}

   /* Paragraphs */
   p {margin-bottom:1.2rem;}

   /* Links */
   a {position: relative; text-decoration:none; cursor:pointer; color:var(--bs-primary); -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease;}
   button, a:hover, a:focus, a:visited{text-decoration:none; outline:none !important;}
   a:hover {color: #FFCB00;}

   /* Horizontal rules */
   .divider {border-bottom:1px dashed #b8b8b8; margin:2rem 0; width:100%; border-top:0;}

   /* Lists */
   ul, ol {margin-bottom:0.75rem;}

   /* TYPOGRAPHY */
   h1, h2, h3, h4, h5, h6 {color: var(--bs-primary); font-family:var(--bs-heading-font); text-transform: uppercase;}
   h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {font-family: var(--bs-heading-font); font-size: .75em;}
   
   .lead {font-weight: inherit;}

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

   @media (min-width: 992px) {}

   .section-title {position: relative; display: block; margin-bottom: 2rem; margin-top: -.5rem;}
   .section-title span {position: relative; display: inline-block; font-size: 1rem; line-height: 1rem; color: var(--bs-secondary); font-family: 'poppinssemibold'!important; text-transform: uppercase;}
   .section-title span:before {content: ""; position: absolute; top: 50%; right: -2.75rem; width: 2rem; height: .125rem; background-color: var(--bs-secondary); transform: translateY(-50%);}
   .section-title.darkbg {color:var(--bs-white);}
   .section-title.darkbg span {color:var(--bs-accent3);}
   .section-title.text-center span:before {display: none;}

   /* IMAGES */
   figure {margin:0;}
   
   .img-block .img-box {position: relative; display: block; padding-right: 2.5rem; /*margin-right: 1.25rem;*/ margin-right: 0; padding-bottom: 7.5rem;}
   .img-block .img-box img {width: 100%;}
   .img-block .img-box .img-1 {position: relative; overflow: hidden; padding-bottom: 1.875rem;}
   .img-block .img-box .img-1:before, .img-block .img-box .img-1:after {position: absolute; content: '';}
   .img-block .img-box .img-1:before {width: 100%; height: .625rem; left:0; bottom: 0; background: var(--bs-secondary);}
   .img-block .img-box .img-1:after {top: 0; left: -80%; display: block; width: 50%; height: 100%; background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); transform: skewX(-25deg);}
   .img-block .img-box:hover .img-1:after {-webkit-animation: shine 1s; animation: shine 1s;}
   .img-block .img-box .img-2 {position: absolute; right: 0; bottom: 0; background: #fff; /*padding: 1.25rem;*/ padding: 1.25rem .25rem 0 1.25rem;}

   @media (min-width: 1200px) {
      .img-block .img-box {padding-bottom:11.25rem;}
   }

   @media (min-width: 1400px) {
      .img-block .img-box {padding-bottom:2.25rem;}
   }

   .section-bg {position: absolute; top: 0; bottom: 7.5rem; width: calc((100% - -2rem) /2); height: 100%; background-size: contain; background-repeat: no-repeat; z-index: -1;}
   .section-bg.right {right: 0; background-position: bottom right;}
   .section-bg.wide {bottom:0; left: 0; width: calc((100% - -1320px) / 2); background-position: top left; background-size:cover; height: auto;}

   /* TABLES */
   .table>:not(:first-child) {border-top: 1px solid #eaeaea;}

   thead.table-primary {--bs-table-bg: var(--bs-primary);}

   table.program {background-color: #FFF; border-collapse: separate; border-spacing: .25rem;}
   table.program, table.program th, table.program td {border: 1px solid #eceeef;}
   table.program tbody th {text-align: center;}
   
   .responsive-data {border: 1px solid #ccc; border-collapse: collapse; margin: 0; padding: 0; width: 100%; /*table-layout: fixed;*/}
   .responsive-data caption {font-size: 1.5rem; margin: .5rem 0 .75rem; font-family:var(--bs-alt-font);}
   .responsive-data tr {background-color: #f8f8f8; border: 1px solid #ddd; padding: .35rem;}
   .responsive-data th, .responsive-data td {padding: .625rem; text-align: center;}
   .responsive-data th {font-size: .85rem; /*letter-spacing: .1em;*/ text-transform: uppercase;}
   @media screen and (max-width: 600px) {
      .responsive-data {border: 0;}
      .responsive-data caption {font-size: 1.25rem;}
      .responsive-data thead {border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
      .responsive-data tr {border-bottom: 3px solid #ddd; display: block; margin-bottom: .625rem;}
      .responsive-data th, .responsive-data td {border-bottom: 1px solid #ddd; display: block; font-size: .875rem; text-align: right;}
      .responsive-data td::before {content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase;}
      .responsive-data td:last-child {border-bottom: 0;}
   }

/* ==========================================================================
   FORMS
   ========================================================================== */

   input:focus, input:active, .form-control:focus, .form-control:active {box-shadow:none!important;}
   .form-control {padding: .725rem 1rem;}
   .form-control::placeholder {color:rgba(102,102,102,.5);}

/* ==========================================================================
   COMPONENTS
   ========================================================================== */	

   /* ACCORDION */
   .acc0rdion {position: relative; display: block; transition: all 500ms ease;}
   .acc0rdion .title {position: relative; display: block; cursor: pointer; transition: all 200ms linear; transition-delay: 0.1s;}
   .acc0rdion .title h4 {margin: 0; font-size: 1rem; font-weight: 500; line-height: 2rem; color: var(--bs-accent2); padding-left: 2rem; position: relative; transition: all 500ms ease;}
   .acc0rdion .title h4:before, .acc0rdion .title h4:after {content: ""; position: absolute; top: 50%; border-radius: 50%; transition: all 500ms ease; text-align: center; transform: translateY(-50%);}
   .acc0rdion .title h4:before {left: 0;  width: 1.25rem; height: 1.25rem; background-color: var(--bs-accent2);}
   .acc0rdion .title h4:after {left: .375rem; width: .5rem; height: .5rem; background-color: var(--bs-white);}
   .acc0rdion.active .title h4 {color: var(--bs-secondary);}
   .acc0rdion.active .title h4:before {background-color: var(--bs-secondary);}
   .acc0rdion.active .title h4:after {background-color: var(--bs-accent1);}
   .acc0rdion .content {position: relative; padding-left: 2rem; padding-top: 1rem;}
   .acc0rdion + .acc0rdion {margin-top: 1rem;}

   /* BREADCRUMB */

   /* BUTTONS */
   button:hover, button:focus, .btn:active, .btn:focus {text-decoration: none; outline: none;}
   
   .btn {display:inline-block; transition:all 0.3s ease; font-family: var(--bs-heading-font); font-size: 1.125rem; line-height: 1.875rem; text-transform: uppercase; letter-spacing:.5px; padding: 1rem 2.25rem;}
   .btn-sm {font-size: .875rem; line-height: 1.5rem; padding: .75rem 1.25rem;}
   .btn-primary, .btn-secondary, .btn-dark {position: relative; font-weight:500; overflow: hidden; text-align:center; border-radius:.25rem; display: inline-grid; color: var(--bs-white); background-color:var(--bs-primary); border: none;}
   .btn-primary .text, .btn-secondary .text, .btn-dark .text {position:relative; z-index:1;}
   .btn-primary:before, .btn-secondary:before, .btn-dark:before {transition-duration: 800ms; position: absolute; width: 200%; height: 200%; content: ""; top: 110%; left: 50%; transform: translateX(-50%); border-radius: 50%; z-index: 1; background: var(--bs-white);}
   .btn-primary span, .btn-secondary span, .btn-dark span {position:relative; z-index:1; font-style:normal; display:inline-block; margin-left:.25rem; transition-duration: 800ms;}
   .btn-primary:hover {background-color: var(--bs-primary); color: var(--bs-primary);}
   .btn-primary:hover:before, .btn-secondary:hover:before, .btn-dark:hover:before {top: -40%;}
   .btn-secondary {background-color:var(--bs-secondary);}
   .btn-secondary:hover {background-color: var(--bs-secondary); color: var(--bs-secondary);}
   .btn-dark {background-color:var(--bs-dark);}
   .btn-dark:before {background: var(--bs-primary);}
   .btn-dark:hover {background-color: var(--bs-dark); color: var(--bs-white);}

   .btn-circle {position:relative; display: flex; justify-content: center; align-items: center; border-radius: 50%; width: 10rem; height: 10rem; background-color: var(--bs-secondary); transition: all 500ms ease;}
   .btn-circle:after {content: ''; position: absolute; border-radius: 50%; background:transparent; border: 2px dashed var(--bs-white); width: 90%; height: 90%; z-index: 0;  animation: rotateit 15s linear infinite;}
   .btn-circle:hover {background-color: var(--bs-primary);}
   
   .scroll2top {position:fixed; bottom:1rem; right:1rem; width:2.5rem; height:2.5rem; color:var(--bs-primary); text-transform:uppercase; font-size: 1.25rem; line-height:2.375rem; text-align:center; z-index:100; cursor:pointer; background:var(--bs-white); display:none; box-shadow:0px 0px 10px rgba(0,0,0,0.15); transition:all 300ms ease;}
   .scroll2top:hover {color:var(--bs-white); background:var(--bs-primary);}

   /* CARD */
   .card {border-radius: 0; border: none;}
   .shadowy {margin-bottom: 5.5rem; background: var(--bs-white); box-shadow: var(--bs-box-shadow-main); border-radius: var(--bs-border-radius-sm);}
   .side-card {position: relative; display: block; margin: 3.75rem 1rem 0; border: none; border-radius: 0; background: transparent;}
   .side-card.left {margin-right: 6.75rem; margin-left: 0;}

   @media (min-width: 992px) {
      .side-card {margin-left: 2.5rem; margin-right: 6.25rem;}
   }

   /* COLLAPSE */
   /* LIST GROUP */

   /* NAVBAR */
   
   

/* ==========================================================================
   HELPERS
   ========================================================================== */

   /* ANIMATIONS */
   @-webkit-keyframes zoom-fade {
      0% {-webkit-transform: scale(0.8); transform: scale(0.8);}
      50% {-webkit-transform: scale(1); transform: scale(1);}
      100% {-webkit-transform: scale(0.8); transform: scale(0.8);}
   }
    
    @keyframes zoom-fade {
      0% {-webkit-transform: scale(0.8); transform: scale(0.8);}
      50% {-webkit-transform: scale(1); transform: scale(1);}
      100% {-webkit-transform: scale(0.8); transform: scale(0.8);}
   }

   @keyframes rotateit {
      0% {transform: rotate(0deg); opacity: 1;}
      50% {transform: rotate(-180deg);}
      100% {transform: rotate(-360deg); opacity: 1;}
   }
   @-webkit-keyframes floating {
      0% {-webkit-transform: translateY(0px); transform: translateY(0px); opacity: 1;}
      50% {-webkit-transform: translateY(30px); transform: translateY(30px); opacity: 1;}
      100% {-webkit-transform: translateY(0px); transform: translateY(0px); opacity: 1;}
   }
   @keyframes floating {
      0% {transform: translateY(0px); transform: translateY(0px); opacity: 1;}
      50% {transform: translateY(30px); transform: translateY(30px); opacity: 1;}
      100% {transform: translateY(0px); transform: translateY(0px); opacity: 1;}
   }

   @-webkit-keyframes ripple {
      70% {box-shadow: 0 0 0 70px rgba(253, 167, 0, 0);}
      100% {box-shadow: 0 0 0 0 rgba(253, 167, 0, 0);}
   }
   @keyframes ripple {
      70% {box-shadow: 0 0 0 70px rgba(253, 167, 0, 0);}
      100% {box-shadow: 0 0 0 0 rgba(253, 167, 0, 0);}
   }

   @-webkit-keyframes shine {
      100% {left: 125%;}
   }
   @keyframes shine {
      100% {left: 125%;}
   }

   @keyframes rotatingText {
      from {transform: rotate(0);}
      to {transform: rotate(-360deg);}
   }

   @keyframes slide{
      from { background-position: 0 0; }
        to { background-position: 1920px 0; }
    }
    
    @-webkit-keyframes slide{
      from { background-position: 0 0; }
        to { background-position: 1920px 0; }
    }

   /* CLEARFIX */
   .clearfix {line-height: 0;}

   /* COLOR & BACKGROUND */
   .text-accent1 {color: var(--bs-accent1);}
   .text-accent2 {color: var(--bs-accent2);}
   .text-accent3 {color: var(--bs-accent3);}
   
   .bg-halfgrey {
		background: #fcfcfc; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 29.99%, #f6f7fb 30%, #f6f7fb 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 29.99%,#f6f7fb 30%,#f6f7fb 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 29.99%,#f6f7fb 30%,#f6f7fb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f7fb',GradientType=0 ); /* IE6-9 */
	}

   .bg-accent1 {background-color: var(--bs-accent1);}
   .bg-accent2 {background-color: var(--bs-accent2);}
   .bg-accent3 {background-color: var(--bs-accent3);}

/* ==========================================================================
   UTILITIES
   ========================================================================== */

   /* BORDERS */
   /* COLORS */
   
   /* SHADOWS */
   .box-shadow-lg {-webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.30); box-shadow: 0 0 30px 0 rgba(0,0,0,.30);}
   .box-shadow-md {-webkit-box-shadow: 0 0 15px 0 rgba(0,0,0,.20); box-shadow: 0 0 15px 0 rgba(0,0,0,.20);}
   .box-shadow-sm {-webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.15); box-shadow: 0 2px 2px 0 rgba(0,0,0,0.15);}

   /* TEXT */
   .text-justify {text-align: justify;}

	
/* ==========================================================================
   List Styles
   ========================================================================== */

	/* Icon List */
   .icony {position: relative; display: block; margin-top: 2rem; margin-bottom: 2.75rem;}
   .icony li {position: relative; display: flex; align-items: center; align-items: start;}
   .icony li+li {margin-top:1.5rem;}
   .icony li .icon {position: relative; display: inline-block; margin-right: .625rem;}
   .icony li .icon span {position: relative; display: inline-block; font-size: 1.5rem; color: var(--bs-accent2); top: .125rem;}
   .icony li p {margin-bottom: 0;}

   /* Check List */

/* ==========================================================================
   SITE SPESIFIC SECTIONAL STYLES
   ========================================================================== */
   /* ABOUT */
   #about {position: relative;}
   #about .letterW {position:absolute; left:-1%; top:13%; width:31.25rem; height:31.25rem; z-index:-1; opacity: .5; background-image: url(../../files/images/layout/general/bg-w.webp); background-repeat:no-repeat; animation: zoom-fade 3s linear infinite;}
   #about .section-bg.right {overflow: hidden;}
   #about .section-bg.right .img-container {position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
   #about .section-bg.right .img-container img {width: 1024px; height: auto;}

   /* WHY */
   #whychoose {position: relative;}
   #whychoose .letterW {position:absolute; right:0; bottom:-1%; width:8.25rem; height:11.875rem; z-index:0; opacity: .5; background-image: url(../../files/images/layout/general/bg-dotted.png); background-repeat:no-repeat; animation: floating 5s linear infinite;}
   #whychoose .card:before, #whychoose .card .title, #whychoose .icon-box, #whychoose .icon-box:before, #whychoose .icon-box span {transition: all 500ms ease;}
   #whychoose .card {position: relative; display: block; z-index: 1; transition: all 500ms ease;}
   #whychoose .card:before {position: absolute; content: ''; background: var(--bs-dark); width: 100%; height: 100%; left: 0; top: 0; transform: scaleX(0); transform-origin: center; z-index: -1;}
   #whychoose .card-body {padding:1.5rem;}
   #whychoose .card .title {font-size:1.5rem;}
   #whychoose .card p {margin-bottom: 0;}
   #whychoose .card:hover .title, #whychoose .card:hover p {color: var(--bs-white);}
   #whychoose .card .icon-box {display: flex; justify-content: center; align-items: center; width: 3.5rem; height: 3.5rem; border-radius: 2.5rem; background-color: var(--bs-primary); text-align: center; line-height: 5rem; position: relative; margin: 1rem .5rem 1.5rem;}
   #whychoose .card .icon-box:before {position: absolute; content: ""; width: 4.375rem; height: 4.375rem; border: 2px dashed var(--bs-primary); top: -7px; left: -7px; border-radius: 50%; animation: rotateit 15s linear infinite;}
   #whychoose .card .icon-box span {color:var(--bs-white); font-size: 1.5rem;}
   #whychoose .card:hover {box-shadow: 0px 10px 70px 0px rgba(0, 0, 0, 0.20);}
   #whychoose .card:hover:before {transform: scaleX(1);}
   #whychoose .card:hover .icon-box {background-color: var(--bs-white);}
   #whychoose .card:hover .icon-box:before {border-color: var(--bs-white);}
   #whychoose .card:hover .icon-box span {color: var(--bs-dark);}
   #whychoose .lSSlideOuter .lSPager.lSpg {margin-top: 1.5rem!important;}
   #whychoose .lSSlideOuter .lSPager.lSpg > li a {background-color: var(--bs-white);}
   #whychoose .lSSlideOuter .lSPager.lSpg > li.active a {background-color: var(--bs-accent1);}

   #qualifications figure img {filter: grayscale(1); transition: all 500ms ease;}
   #qualifications figure:hover img {filter: grayscale(0);}
   #qualifications .btn-circle {position: absolute; right: -1rem; bottom: -.5rem;}
   #qualifications .btn-circle::after {animation: none;}
   #qualifications .btn-circle h2 {font-size: 1.25rem; margin: 0; color: var(--bs-white); text-align: center;}
   #qualifications .btn-circle .text {position: absolute; top: 15px; left: 15px; display: grid;}
   #qualifications .btn-circle .spinning-text {position: relative; border-radius: 100%; animation: rotatingText 8s infinite linear; color: var(--bs-white); font-size: .875rem;}
   #qualifications .btn-circle .spinning-text span {position: absolute; transform-origin: top left;}

   #how .icony {margin: 0;}
   #how .introduction {padding: 4.5rem 0 9.5rem;}
   #how .explanation {position: relative; margin-bottom: 7.5rem;}
   #how .explanation:before {position: absolute; content: ''; right: 0; top: 0; height: 100%; width: 30%;  background: var(--bs-secondary); z-index: -2;}
   #how .explanation .pattern, #how .resume .pattern {position: absolute; max-width: 30rem; top: 0; right: 0; z-index: 10; opacity: .25;}
   #how .explanation .pattern img, #how .resume .pattern img {width: 100%;}
   #how .explanation .image {margin-right: -6.25rem; margin-top: -6.25rem;}
   #how .explanation .image img {width: 100%;}
   #how .explanation .support {padding: 5.625rem 0 6.25rem 6.25rem; margin-left: -2rem; position: relative; z-index: 9;}
   #how .explanation .support:before {position: absolute; content: ''; left: 0; top: 0; height: 100%; width: 100%; background: var(--bs-secondary); z-index: -1;}
   #how .explanation .card {z-index: 100;}
   #how .explanation .card-body {padding: 2.5rem;}
   #how .explanation .card:not(:last-child) {margin-bottom: 2rem;}
   #how .resume {position: relative; padding: 4.5rem 0; overflow: hidden;}
   #how .resume .pattern {left: 0; z-index: 0; opacity: .125;}
   #how .resume .card {position: relative; padding: 2rem; z-index: 1; transition: all 500ms ease;}
   #how .resume .card:hover {box-shadow: 0px 10px 70px 0px rgba(0, 0, 0, 0.20);}
   #how .resume .card .number {position: absolute; top: 0; left: 0; display: flex; background-color: var(--bs-dark); color: var(--bs-white); font-size: 1.25rem; justify-content: center; align-items: center; width: 2rem; height: 2rem;}
   #how .resume .card h3 {font-size: 1.25rem; margin-bottom: .75rem; color: var(--bs-dark);}

   #contact .bg-image {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: repeat-x; animation: slide 60s linear infinite; -webkit-animation: slide 60s linear infinite; z-index: 0;}
   #contact .container {position: relative; z-index: 1;}
		
   /* FOOTER */
   footer {font-size: .75rem; color:rgba(255,255,255,.6); background-color: var(--bs-dark); border-top: 1px dashed var(--bs-light);}
   footer h2 {font-size: 0.875rem; color:#FFFFFF;}
	footer a {color:rgba(255,255,255,1);}
	footer a:hover {color:var(--bs-accent1);}

   .responsive-slider .card {display: block; height: 100%;}