body{margin:0px;touch-action: none;}
            main{position:fixed;top:0px;left:0px;z-index:-1}
            * {
                box-sizing: border-box;
              }
              
              body {
                padding: 0;
                margin: 0;
                font-size: 26px; 
                overflow-y: scroll; 
                font-family:Verdana, Sans-serif;
              }
              .scrollable{
                margin-top:10px;
                padding-top:0px;
                overflow-y: auto;
                overflow-wrap: break-word;
                overflow-x: hidden;
                max-height:70vh;
              }
              canvas {
                display: block;
                background-image: url("../asset/bg.jpg");
                background-size: contain;
                background-repeat: no-repeat;
              }
              .viewer {
                width: 100vw;
                height: 100vh;
                overflow-y: scroll;
                /*scroll-snap-type: y mandatory;*/
                z-index:99;
              }
              
              .slide {
                width: 100vw;
                height: 100vh;
                padding: 4rem;
                color: white;
              
                z-index:99;
                /* align center 
                display: flex;*/
                justify-content: center;
                align-items: center;
                flex-direction: column;
              
                /* scroll-snap
                scroll-snap-align: start;
                scroll-snap-stop: normal; */
              }
              
              body::-webkit-scrollbar {
                display: none; /* for Chrome, Safari, and Opera */
              }
              .content{
                  color:white;
              }
              .ai{
                  position:absolute;
                  top:50%;
                  left:50%;
              }
              h1,a{
                  color: #44bea0 !important;
                  font-weight: bold !important;
              }
              .loader-holder{
                  z-index:9999;
                  background:rgb(0,0,0);
                  height:100vh;
                  width:100vw;
                  position:fixed;
                  top:0px;
                  left:0px;
                  text-align:center;
              }
              .lds-hourglass{
                position: relative;
                margin:0 auto;
                top: 50%;
                -ms-transform: translateY(-50%);
                transform: translateY(-50%);
              }
              .logo{
                  height:10%;
                  width:10%;
                  padding-bottom:20px;
                  transition: transform .2s;
              }
              .logo:hover{
                transform: scale(1.5)
              }
              .custom-tooltip {
                --bs-tooltip-bg: var(--bs-primary);
              }

              .tableSideNav{
                  position:fixed;
                  top:85%;
                  width:100vw;
                  text-align:center;
                  float:left;
                  transition: all 0.3s ease-in-out;
              }
              .tableSideNav li{
                position: relative;
                display: block;
                float: left;
                margin-right: 16px;
                width: 10px;
                height: 10px;
                cursor: pointer;
              }
              .tableSideNav a{
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                outline: none;
                border-radius: 50%;
                text-indent: -999em;
                cursor: pointer;
                position: absolute;
                overflow: hidden;
                background-color: transparent;
                box-shadow: inset 0 0 0 2px white;
                -webkit-transition: all 0.3s ease;
                transition: all 0.3s ease;
                -webkit-transform: scale3d(1, 1, 1);
                transform: scale3d(1, 1, 1);
              }
              .cell {
                display: table-cell;
                vertical-align: middle;
                margin: auto;
                text-align: center;
              }
              .active {
                
                position: absolute;
                bottom: 0;
                height: 0;
                left: 0;
                width: 100%;
                background-color: #44bea0 !important;
                box-shadow: 0 0 1px #fff;
                -webkit-transition: height 0.3s ease;
                transition: height 0.3s ease;
             
            }
            .padding10{
              padding:10%;
            }
            .padding9{
              padding:9%;
            }
            .bgBlack{
              background:rgba(255,255,255,.1);
            }