#webgl-container {
     opacity: 0
 }
 
 #hm-nav ul {
     padding: 0;
 }
 
 .hm-subtitle {
     font: normal 18px/23px 'Lexend Deca', sans-serif;
     color: #668DD5;
     will-change: opacity, transform;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none
 }
 
 .hm-subtitle p {
     padding: 0;
     font: normal 18px/23px 'Lexend Deca', sans-serif;
 }
 
 .hm-subtitle div {
     will-change: opacity, transform
 }
 
 .hm-title {
     will-change: opacity, transform;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     color: #fff;
     font-size: 54px;
     line-height: 62px;
     font-family: 'Palanquin Dark', sans-serif;
     text-transform: uppercase;
     font-weight: 600;
 }
 
 .hm-title p {
     padding: 0;
     color: #fff;
     font-size: 54px;
     line-height: 62px;
     font-family: 'Palanquin Dark', sans-serif;
     text-transform: uppercase;
     font-weight: 600;
 }
 
 .hm-title div {
     will-change: opacity, transform
 }
 
 .page-container {
     height: 100%;
     height: 100vh;
     z-index: 1;
     overflow: hidden;
 }
 
 #webgl-container-wrapper {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     width: 100%;
 }
 
 #hm-nav {
     position: absolute;
     right: 10%;
     bottom: 11%;
     opacity: 0 !important;
     cursor: default;
     z-index: 2
 }
 
 #hm-nav li {
     opacity: 0;
     transition: all 0.5s;
 }
 
 #hm-nav li:nth-child(2) {
     opacity: 0;
     transition: all 0.5s;
     transition-delay: 4s;
 }
 
 #hm-nav li:nth-child(3) {
     opacity: 0;
     transition: all 0.5s;
     transition-delay: 6s;
 }
 
 #hm-nav li:nth-child(4) {
     opacity: 0;
     transition: all 0.5s;
 }
 
 #hm-nav.hm-nav-visib {
     opacity: 1 !important;
 }
 
 #hm-nav li {
     padding-left: 40px;
 }
 
 #hm-nav.hm-nav-visib li {
     padding-left: 20px;
     padding-right: 20px;
 }
 
 #hm-nav.hm-nav-visib li:nth-child(1) {
     opacity: 1;
     transition: all 0.5s;
     transition-delay: 0.5s;
 }
 
 #hm-nav.hm-nav-visib li:nth-child(2) {
     opacity: 1;
     transition: all 0.5s;
     transition-delay: 1s;
 }
 
 #hm-nav.hm-nav-visib li:nth-child(3) {
     opacity: 1;
     transition: all 0.5s;
     transition-delay: 1.5s;
 }
 
 #hm-nav.hm-nav-visib li:nth-child(4) {
     opacity: 1;
     transition: all 0.5s;
     transition-delay: 2s;
 }
 
 #hm-nav.allow-action .hm-nav-item {
     display: inline-block;
     transition: all 1s;
     position: relative;
 }
 
 #hm-nav.allow-action .hm-nav-item .hm-nav-item-txt {}
 
 #hm-nav.allow-action .hm-nav-item .hm-nav-item-txt {
     -webkit-transition: color .5s cubic-bezier(.25, .46, .45, .94), opacity .5s cubic-bezier(.25, .46, .45, .94), -webkit-transform .5s cubic-bezier(.165, .84, .44, 1);
     transition: color .5s cubic-bezier(.25, .46, .45, .94), opacity .5s cubic-bezier(.25, .46, .45, .94), -webkit-transform .5s cubic-bezier(.165, .84, .44, 1);
     transition: color .5s cubic-bezier(.25, .46, .45, .94), opacity .5s cubic-bezier(.25, .46, .45, .94), transform .5s cubic-bezier(.165, .84, .44, 1);
     transition: color .5s cubic-bezier(.25, .46, .45, .94), opacity .5s cubic-bezier(.25, .46, .45, .94), transform .5s cubic-bezier(.165, .84, .44, 1), -webkit-transform .5s cubic-bezier(.165, .84, .44, 1);
     cursor: pointer;
     padding: 5px;
     display: inline-block;
 }
 
 #hm-nav.allow-action .hm-nav-item.active .hm-nav-item-txt,
 #hm-nav.allow-action .hm-nav-item .hm-nav-item-txt:hover {
     background: #668DD5;
     border-radius: 50%;
 }
 
 #hm-nav.allow-action .hm-nav-item .hm-nav-item-txt:before {
     content: "";
     position: absolute;
     height: 3px;
     left: 0%;
     top: 50%;
     margin-top: -2px;
     margin-left: -5px;
     width: 9px;
     border-radius: 2.5px;
     background-color: #668DD5;
 }
 
 #hm-nav.allow-action .hm-nav-item:first-child .hm-nav-item-txt:before {
     display: none;
 }
 
 #hm-nav ul {
     display: block;
 }
 
 .hm-nav-item {
     font: 500 16px/12px Roboto, sans-serif;
     color: #fff;
     text-transform: uppercase;
     letter-spacing: 1px;
     will-change: opacity, transform
 }
 
 .hm-nav-item:not(:nth-child(1)) {
     margin-top: 18px
 }
 
 .hm-prog-nb-container {
     position: relative;
     width: 8px
 }
 
 .hm-prog-nb {
     display: none;
     position: absolute;
     right: 0;
     top: 0
 }
 
 .hm-prog-nb-total {
     position: relative;
     padding-left: 50px;
     color: #4f5d8d;
     opacity: 0;
     -webkit-transform: translateX(-20px);
     transform: translateX(-20px)
 }
 
 .hm-prog-nb-total:before {
     content: '';
     position: absolute;
     left: 20px;
     top: 2px;
     width: 10px;
     height: 10px;
     border-radius: 50%;
     background-color: #fff;
     opacity: 0;
     -webkit-transform: translateX(-20px);
     transform: translateX(-20px)
 }
 
 .hm-prog-nb-total.show,
 .hm-prog-nb-total.show:before {
     opacity: 1;
     -webkit-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition: opacity .5s cubic-bezier(.25, .46, .45, .94), -webkit-transform .5s cubic-bezier(.165, .84, .44, 1);
     transition: opacity .5s cubic-bezier(.25, .46, .45, .94), -webkit-transform .5s cubic-bezier(.165, .84, .44, 1);
     transition: opacity .5s cubic-bezier(.25, .46, .45, .94), transform .5s cubic-bezier(.165, .84, .44, 1);
     transition: opacity .5s cubic-bezier(.25, .46, .45, .94), transform .5s cubic-bezier(.165, .84, .44, 1), -webkit-transform .5s cubic-bezier(.165, .84, .44, 1)
 }
 
 #hm-slider,
 .hm-slide {
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%
 }
 
 #hm-slider {
     opacity: 0;
     top: 50%;
     transform: translateY(-50%);
 }
 
 .hm-slide {
     visibility: hidden
 }
 
 .hm-slide-content {
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -webkit-flex-direction: column;
     -ms-flex-direction: column;
     flex-direction: column;
     position: absolute;
     left: 7%;
     top: 50%;
     transform: translateY(-50%);
     max-width: 910px;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     padding-right: 340px;
 }
 
 .hm-slide-txt {
     font: 300 16px/24px 'Palanquin', sans-serif;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     color: #fff;
     padding-top: 10px;
 }
 
 .hm-slide-btn {
     -webkit-align-self: flex-start;
     -ms-flex-item-align: start;
     align-self: flex-start;
     position: relative;
     padding: 13px 29px;
     margin-top: 20px;
     color: #fff;
     text-decoration: none;
     border: 2px solid #668DD5;
     border-radius: 30px;
     -webkit-transition: background .5s cubic-bezier(.25, .46, .45, .94);
     transition: background .5s cubic-bezier(.25, .46, .45, .94);
     overflow: hidden;
     font-family: 'Lexend Deca', sans-serif;
     font-size: 12px;
     line-height: 15px;
 }
 
 a.hm-slide-btn:empty {
     opacity: 0 !important;
 }
 
 .hm-slide-btn:hover {
     background: #668DD5;
     color: #fff;
 }
 
 .hm-slide-btn:hover:after {
     -webkit-transform: translateY(0);
     transform: translateY(0)
 }
 
 .scroll .hm-intro {
     position: fixed
 }
 
 .scroll .hm-slide {
     height: auto;
     padding: 100px 0 40px 0
 }
 
 .scroll .hm-slide-content {
     position: static;
     left: 0;
     top: 0;
     margin: 0 auto !important;
     -webkit-transform: translateY(0) !important;
     transform: translateY(0) !important
 }
 
 .scroll #hm-scroll {
     display: none
 }
 
 .single-object #hm-nav,
 .single-object .hm-slide-txt,
 .single-object .hm-slide-btn,
 .two-object #hm-nav,
 .two-object .hm-slide-txt,
 .two-object .hm-slide-btn,
 .hideforall,
 .three-object #hm-nav,
 .three-object .hm-slide-txt,
 .three-object .hm-slide-btn,
 .four-object #hm-nav,
 .four-object .hm-slide-txt,
 .four-object .hm-slide-btn {
     position: absolute;
     width: 0;
     height: 0;
     overflow: hidden;
     opacity: 0 !important;
     padding: 0;
     margin: 0;
 }
 
 @media(min-width:992px) and (max-width:1199px) {
     .hm-slide-content {
         left: 15px;
     }
     #webgl-container canvas {
         margin-right: 20px;
     }
     #hm-nav {
         right: 10px;
     }
 }
 
 @media(min-width:768px) and (max-width:991px) {
     header {
         padding: 0;
         left: 20px;
         width: 100%;
         width: calc(100% - 40px);
         top: 20px;
     }
     header .main-logo {
         width: 100px;
         height: 30px;
         background-size: 100%;
     }
     .video-wrap .container-fluid {
         padding-left: 0;
         padding-right: 0;
     }
     .hm-slide-content {
         padding-right: 70px;
         left: 15px;
     }
     .get-in-touch-wrap .container-fluid {
         padding: 0;
     }
     #hm-nav {
         left: 50%;
         transform: translateX(-50%);
         width: 410px;
     }
 }
 
 @media (max-width:767px) {
     .page-container.fullheigt canvas {
         height: calc(100vh - 60px) !important;
     }
     .page-container canvas {
         height: calc(100vh - 0px) !important;
     }
     .hm-title,
     .hm-title p {
         font-size: 36px;
         line-height: 40px;
     }
     .hm-subtitle {
         font-size: 12px;
         line-height: 15px;
     }
     #webgl-container-wrapper {
         opacity: 0.5;
     }
     #hm-nav ul li {
         position: relative;
         width: 30px;
         height: 30px;
         position: relative;
         padding: 0;
     }
     #hm-nav.hm-nav-visib li {
         padding-left: 0px;
         padding-right: 0px;
     }
     #hm-nav ul li:before {
         content: "";
         position: absolute;
         width: 14px;
         height: 14px;
         opacity: 0.4;
         left: 50%;
         top: 50%;
         transform: translateY(-50%) translateX(-50%);
         border-radius: 50%;
         background-color: #668DD5;
     }
     #hm-nav ul li.active:before {
         opacity: 1;
     }
     #hm-nav ul li .hm-nav-item-txt {
         display: none !important;
     }
     #hm-slider {
         left: 15px;
         width: calc(100% - 30px);
     }
     #hm-nav {
         bottom: 0;
     }
     /*    #webgl-container-wrapper,
     #hm-slider,
     #hm-nav {
         position: relative;
         top: auto;
         left: auto;
         transform: translateY(0);
     }

     canvas { 
         height: auto !important;
         width:100% !important
     }

     .page-container {
         height: auto;
     } */
 }