:root {
  --fs-primary-color: #5dc5f2;
  --fs-primary-color-dark: #3695bd;
  --fs-secondary-color: #9c88ff;
  --fs-white-color: #fff;
  --fs-gray-color-100: #f8f9fa;
  --fs-gray-color-200: #e9ecef;
  --fs-gray-color-300: #dee2e6;
  --fs-gray-color-400: #ced4da;
  --fs-gray-color-500: #adb5bd;
  --fs-gray-color-550: #99a1aa;
  --fs-gray-color-600: #6c757d;
  --fs-gray-color-700: #495057;
  --fs-gray-color-800: #343a40;
  --fs-gray-color-900: #212529;
  --fs-black-color: #000;
  --fs-starburst-color-1: #f5d952; 
  --fs-starburst-color-2: #fdc24e; 
  --fs-green-color: #1abc9c; 
  --fs-green-color-dark-1: #17927a;
  --fs-green-color-dark-2: #0f6c5a;
  --fs-green-blue-color: #67e6dc;
  --fs-blue-color: #3498db; 
  --fs-red-color: #dc3545; 
  --fs-pink-color: #fd79a8;
  --fs-cyan-color: #74b9ff;
  --fs-yellow-color: #ffc107;
  --fs-bronze-color: #CD7F32;
  --fs-orange-color: #f39c12;
  --fs-dark-orange-color: #d35400;
  --fs-light-blue-color: #74b9ff; 
  --fs-light-green-color: #dafdf6; 
  --fs-light-red-color: #f7d9dc; 
}

[data-bs-theme="dark"] {
    --fs-primary-color:  #3bb3e7;
    --fs-white-color: #000;
    --fs-gray-color-100: #212529;
    --fs-gray-color-200: #343a40;
    --fs-gray-color-300: #495057;
    --fs-gray-color-400: #6c757d;
    --fs-gray-color-600: #ced4da;
    --fs-gray-color-700: #dee2e6;
    --fs-gray-color-800: #e9ecef;
    --fs-gray-color-900: #f8f9fa;
    --fs-black-color: #fff;
}


/* -- STANDARD -- */
* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    -ms-overflow-style: visible !important;
}

@media (min-width: 992px) {
    * {
      -ms-overflow-style: none !important;
    }
}

html{
    transition: all 0.3s linear 0s;
    min-height: 100%;
    background-color: #f8f9fa;
}

#fs-topbar{
    background-image: url('../img/smartco-singapore-topbar.png');
    height: 15px;
    display: block;
    width: 100%;
    background-color: #01afee;
    z-index: 1;
}

.card, #fs-nav-top{
    transition: all 0.3s linear 0s;
}

[data-bs-theme="dark"] {
    background-color: #000;
}

body{
    background-color: transparent;
    margin: 0;
    /*background-color: #bacde1*/
    word-wrap: break-word;
    text-overflow: ellipsis;
    text-align:center;
}

a{
    transition: all 0.25s linear 0s;
    text-decoration:none !important;
    color: var(--fs-primary-color);
    cursor: pointer;
}

a:hover, a:focus, a:active, a:focus:hover{
    color: var(--fs-primary-color-dark);
}

a[disabled] { 
    pointer-events: none; 
}

img{
    /*image-rendering: optimizeQuality;*/
    interpolation-mode: bicubic;
}

input[type="radio"]:checked { 
    background:#fff !important;
    border: 5px solid var(--fs-primary-color-dark);
}

.form-check-input:checked{
    background-color: var(--fs-primary-color);
    border-color: var(--fs-gray-color-500);
}

.fs-input-error{
    border-color: #ea5e50 !important;
}

/* -- OVERWRITE BS -- */
.dropdown-item:hover{ 
    background-color: var(--fs-gray-color-300);
}

.dropdown-item:focus, .dropdown-item:active, .dropdown-item:focus:hover{ 
    background-color: var(--fs-gray-color-400);
}

.btn{
    border-radius: 1.5rem;
    padding: 0.5rem 1.5rem;
    font-family: 'Varela Round', sans-serif;
    text-transform: uppercase;
}

.fs-disabled{
    cursor: default;
}

.fs-btn-black-border{
    border: 3px solid #000;
    color: #000;
}

.fs-display{
    font-family: 'Varela Round', sans-serif;
}

.fs-display-bold{
    font-family: 'Bungee', cursive;
}

.modal-content{
    border-radius: 1.5rem;
}

.modal-header{
    /*
    border-top-left-radius: calc(1.5rem - 1px);
    border-top-right-radius: calc(1.5rem - 1px);
    */
}

.modal-content{
    overflow: hidden;
}

.table td, .table th{
    padding-bottom: 18px;
    padding-top: 18px;
}

.btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active, .btn-outline-secondary:focus:hover{
    color: #fff;
}

[data-bs-theme="dark"] .btn-outline-secondary{
    background-color: var(--fs-gray-color-200);
    color: #fff;
}

[data-bs-theme="dark"] .btn-outline-secondary:hover, [data-bs-theme="dark"] .btn-outline-secondary:focus, [data-bs-theme="dark"] .btn-outline-secondary:active, [data-bs-theme="dark"] .btn-outline-secondary:focus:hover{
    background-color: var(--fs-gray-color-300);
    color: #fff;
}

.fs-btn-outline-special{
    border-width: 2px;
    font-weight: 700;
    background-color: transparent;
    border-color: var(--fs-primary-color);
    color: var(--fs-primary-color);
}

.fs-btn-outline-special:hover, .fs-btn-outline-special:focus, .fs-btn-outline-special:active, .fs-btn-outline-special:focus:hover{
    color: #fff;
    background-color: var(--fs-primary-color);
}



/* -- CUSTOMISE CSS -- */

/* SIZE */
.fs-display-0{
    font-size: 8rem;
}

/* COLORS */
.fs-bg-white{
    background-color: var(--fs-white-color);
}
.fs-bg-gray-100{
    background-color: var(--fs-gray-color-100);
}
.fs-bg-gray-200{
    background-color: var(--fs-gray-color-200);
}
.fs-bg-gray-300{
    background-color: var(--fs-gray-color-300);
}
.fs-bg-gray-400{
    background-color: var(--fs-gray-color-400);
}
.fs-bg-gray-500{
    background-color: var(--fs-gray-color-500);
}
.fs-bg-gray-600{
    background-color: var(--fs-gray-color-600);
}
.fs-bg-gray-700{
    background-color: var(--fs-gray-color-700);
}
.fs-bg-gray-800{
    background-color: var(--fs-gray-color-800);
}
.fs-bg-gray-900{
    background-color: var(--fs-gray-color-900);
}
.fs-bg-black{
    background-color: var(--fs-black-color);
}

.fs-text-white{
    color: var(--fs-white-color);
}
.fs-text-gray-100{
    color: var(--fs-gray-color-100);
}
.fs-text-gray-200{
    color: var(--fs-gray-color-200);
}
.fs-text-gray-300{
    color: var(--fs-gray-color-300);
}
.fs-text-gray-400{
    color: var(--fs-gray-color-400);
}
.fs-text-gray-500{
    color: var(--fs-gray-color-500);
}
.fs-text-gray-600{
    color: var(--fs-gray-color-600);
}
.fs-text-gray-700{
    color: var(--fs-gray-color-700);
}
.fs-text-gray-800{
    color: var(--fs-gray-color-800);
}
.fs-text-gray-900{
    color: var(--fs-gray-color-900);
}
.fs-text-black{
    color: var(--fs-black-color);
}

.fs-text-secondary{
    color: var(--fs-secondary-color);
}

.fs-bg-green{
    background-color: var(--fs-green-color) !important;
}

.fs-bg-blue{
    background-color: var(--fs-blue-color);
}

.fs-bg-red{
    background-color: var(--fs-red-color);
}

.fs-bg-cyan{
    background-color: var(--fs-cyan-color);
}

.fs-bg-secondary{
    background-color: var(--fs-secondary-color);
}


.fs-text-green{
    color: var(--fs-green-color) !important;
}

.fs-text-blue{
    color: var(--fs-blue-color);
}

.fs-text-red{
    color: var(--fs-red-color);
}

.fs-text-cyan{
    color: var(--fs-cyan-color);
}

.fs-text-yellow{
    color: var(--fs-yellow-color);
}

.fs-text-special{
    color: var(--fs-primary-color);
}

.fs-text-bronze{
    color: var(--fs-bronze-color);
}

.fs-border-special{
    border-color: var(--fs-primary-color);
}

#fs-myModal .modal-header{
    background-color: var(--fs-gray-color-300);
}

.fs-text-shadow{
   text-shadow: 2px 2px #000; 
}

/* BTN */
.fs-btn-quiz-1, .fs-btn-quiz-4{
    border-radius: 0.5rem;
    padding: 0.5rem 1.0rem;
    text-transform: none;
}

.fs-btn-special {
    border-color: transparent;
    background-color: var(--fs-primary-color);
    color: #fff;
}

.fs-btn-special:hover, .fs-btn-special:focus, .fs-btn-special:active, .fs-btn-special:focus:hover{
    background-color: var(--fs-primary-color-dark) !important;
    color: #fff;
}

.fs-btn-secondary{
    border-color: transparent;
    background-color: var(--fs-gray-color-400);
    color: #fff;
}

.fs-btn-secondary:hover, .fs-btn-secondary:focus, .fs-btn-secondary:active, .fs-btn-secondary:focus:hover{
    background-color: var(--fs-gray-color-500) !important;
    color: #fff;
}


.fs-disabledBtn, .fs-disabledBtn:focus, .fs-disabledBtn:active, .fs-disabledBtn:focus:hover{
    /*border: none !important;*/
    background-color: transparent !important;
    background-image: url("https://smartco.s3.ap-southeast-1.amazonaws.com/takecharge/preloader.png") !important;
    background-position: center center;
    background-repeat: no-repeat;
    border-color: transparent !important;
    color: transparent !important;
    cursor: default;
    outline: medium none;
    pointer-events: none;
    transition: none 0s ease 0s ;
}

@media (hover: none) {
    .fs-disabledBtn, .fs-disabledBtn:hover, .fs-disabledBtn:focus, .fs-disabledBtn:active, .fs-disabledBtn:focus:hover{
        background-color: transparent !important;
        border-color: transparent !important;
        color: transparent !important;
    }
}

.fs-disabledBtn i{
    color: transparent !important;
}

/* ALERT STYLE */
#fs-alertdiv {
    bottom: 0;
    display: none;
    z-index: 1024000;
    border-radius: 0;
    margin-bottom: 0;
}

.fs-alert-error {
    background-color: #ff7675;
    border: medium none;
    color: #fff;
    display: block;
    position: fixed;
    text-align: center;
    width: 100%;
}
.fs-alert-success {
    background-color: #00cec9;
    border: medium none;
    color: #fff;
    display: block;
    position: fixed;
    text-align: center;
    width: 100%;
}

/* ANIMATION */
.fs-ani-gelatine {
  animation: fs-gelatine 0.5s infinite;
}

@keyframes fs-gelatine {
  from, to { transform: scale(1, 1); }
  25% { transform: scale(0.9, 1.1); }
  50% { transform: scale(1.1, 0.9); }
  75% { transform: scale(0.95, 1.05); }
}

.fs-btn-gelatine:hover{
    animation: fs-gelatine 0.5s forwards;
}

.fs-ani-quick{
  -moz-transition: transform 0.2s;
  -webkit-transition: transform 0.2s;
  transition: transform 0.2s;
}

.fs-ani-flip {
  transform: rotate(-180deg);
}

.fs-ani-zoomout{
  animation: fs-zoomout 0.4s ease-out forwards;
}

@-webkit-keyframes fs-zoomout {    
  0% {
      transform: scale(0.6);
  }
  100% {
      transform: scale(1.0);
  }
}

.fs-ani-bounce{
  animation: fs-bounce 0.3s ease-out forwards;
}

@-webkit-keyframes fs-bounce {    
  0% {
      transform: scale(1.0);
  }
  30% {
      transform: scale(1.2);
  }
  100% {
      transform: scale(1.0);
  }
}

@-webkit-keyframes fs-bounce-less {    
  0% {
      transform: scale(1.0);
  }
  30% {
      transform: scale(1.1);
  }
  100% {
      transform: scale(1.0);
  }
}


.fs-btn-bounce:hover{
    animation: fs-bounce-less 0.5s forwards;
}


.fs-ani-shake{
  animation: fs-shake 0.4s ease-out forwards;
  position: relative;
}

@-webkit-keyframes fs-shake {    
  0% {
      left: 0px;
  }
  12% {
      left: -8px;
  }
  25% {
      left: 0px;
  }
  37% {
      left: -8px;
  }
  50% {
      left: 0px;
  }
  62% {
      left: -8px;
  }
  75% {
      left: 0px;
  }
  87% {
      left: -8px;
  }
  100% {
      left: 0px;
  }
}




/* max-width */
.fs-mw-100{
    max-width: 100px;
}

.fs-mw-150{
    max-width: 150px;
}

.fs-mw-200{
    max-width: 200px;
}

.fs-mw-250{
    max-width: 250px;
}

.fs-mw-300{
    max-width: 300px;
}

.fs-mw-400{
    max-width: 400px;
}

.fs-mw-500{
    max-width: 500px;
}

.fs-mw-600{
    max-width: 600px;
}

/* LOGO */
#fs-logo-thumb{
    width: 80px;
    height: auto;
    content:url('../img/smartco-logo-light.png');
}

[data-bs-theme="dark"] #fs-logo-thumb{
    content:url('../img/smartco-logo-dark.png');
}

#fs-logo-nav{
    width: 60px;
    height: auto;
    margin-top: 10px;
    content:url('../img/cloud-logo-light.png');
}

[data-bs-theme="dark"] #fs-logo-nav{
    content:url('../img/cloud-logo-dark.png');
}

#fs-logo-footer{
    width: 80px;
    height: auto;
    content:url('../img/smartco-logo-light.png');
}

/* NAV */
#fs-nav-top{
    /*box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.05);*/
    border-bottom: 1px solid var(--fs-gray-color-500);
}

.fs-nav-spacer{
    height: 71px;
}

/* PROFILE */
#fs-profile-pic-nav{
    border: 3px solid var(--fs-primary-color);
    margin-top: 8px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    font-size: 22px;
    color: #fff;
    transition: filter 0.25s linear 0s;
}

#fs-profile-pic-nav:hover{
    filter: brightness(80%);
}

#fs-profile-name-nav{
    vertical-align: middle;
    width: 150px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

@media (min-width: 768px) {
    #fs-profile-name-nav{
        width: 200px;
    }
}

@media (min-width: 992px) {
    #fs-profile-name-nav{
        width: 300px;
    }
}

#fs-profile-dropdown i{
    width: 15px;
    text-align: center;
}

#fs-profile-pic-profile{
    height: 100px;
    width: 100px;
    border-radius: 50%;
    font-size: 65px;
    color: #fff;
    transition: all 0.25s linear 0s;
}

/* LOGIN */
/*
#fs-html-auth-login{
    background-color: #F0F2F5;
    background-image: url(../img/cloud.jpg);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
*/
/* LAYOUT */
#fs-panel{
    max-width: 100%;
}

@media (min-width: 576px) {
    #fs-panel{
        max-width: 380px;
    }
}

/* COURSE */
.fs-icon{
    background-color: var(--fs-gray-color-500);
    overflow: hidden;
}

.fs-icon-lg{
    height: 75px;
    width: 75px;
    border-radius: 7.5px;
}

.fs-icon-md{
    height: 50px;
    width: 50px;
    border-radius: 5px;
}

.fs-icon-sm{
    height: 35px;
    width: 35px;
    border-radius: 3.5px;
}

.fs-icon-md-wrapper{
    width: 65px;
}

.fs-dashboard-bullet{
    font-size: 12px;
    color: var(--fs-gray-color-500);
    position: relative;
    top: -3px;
}

.fs-action-subheader p{
    border-radius: 10px;
    background-color: rgba(255, 255, 255, 0.5);
}

#fs-action-container .card{
    background-position: center;
    background-size: cover;
    min-height: 350px;
}

#fs-achievement-container .fs-achievement-timestamp{
   background-color: var(--fs-gray-color-200); 
}

#fs-progression-container .card{
    min-height: initial;
}

@media (min-width: 768px) {
    #fs-progression-container .card{
        min-height: 130px;
    }
}

/* MODULE */
.fs-module-box{
    margin-top: 10px;
    background-color: var(--fs-gray-color-100);
}

.fs-extension-box{
    margin-top: 30px;
}

[data-bs-theme="dark"] .fs-module-box{
    background-color: var(--fs-gray-color-200);
}

#fs-page-card ol, #fs-page-card ul{
    margin-top: 10px;
    line-height: 1.6em;
}
#fs-page-card li{
    margin-bottom: 0.8em;
}

#fs-page-card .progress{
    height: 30px !important;
    border: 1.5px solid var(--fs-black-color);
}

#fs-page-card .progress-bar{
    background-color: var(--fs-cyan-color);
}

#fs-collapseNav-div .fs-progress-div-label{
    color: var(--fs-gray-color-500);
}

.fs-menu-fa-icon{
    font-size: 10px;
    width: 18px;
}

.fs-dot-sm{
    height: 5px;
    width: 5px;
    margin-right: 5px;
    margin-bottom: 2px;
    border-radius: 50%;
    display: inline-block;
}

/* MODULE SCOLLBAR */
/*Set the row height to the viewport*/
/*
.row-height{
  height: auto;
}
*/

/*Set up the columns with a 100% height, body color and overflow scroll*/
#fs-module-nav{
    max-width: initial;
    height: auto;
    overflow-y: visible;
    position: relative;
}

/*Remove the scrollbar from Chrome, Safari, Edge and IE*/
/*
 #fs-html-courses-course ::-webkit-scrollbar {
    width: auto;
    background: auto;
}

#fs-html-courses-course body{
    height: auto;
}
*/


@media (min-width: 992px) {

    /*
    .row-height{
      height: 100vh;
    }
    */

    #fs-module-nav{
        max-width: 400px;
        height: 100%;
        overflow-y: auto;
        position: fixed;
    }
    /*
    #fs-html-courses-course ::-webkit-scrollbar {
        width: 0px;
        background: transparent;
    }
    */

    /*
    #fs-html-courses-course body{
        height: 100%;
    }
    */
    
}


@media (min-width: 992px) {
    .collapse.fs-dont-collapse-sm {
        display: block;
        height: auto !important;
        visibility: visible;
    }
}

#fs-module-nav a, #fs-module-nav a:focus{
    color: var(--fs-gray-color-550);
}

#fs-module-nav a:hover{
    color: var(--fs-gray-color-900);
}

#fs-module-nav .active, #fs-module-nav .active:hover, #fs-module-nav .active:focus{
    color: var(--fs-gray-color-900);
}

#fs-page-card{
    min-height: 400px;
}

#fs-page-reload{
    margin-top: 170px;
}

#fs-page-loader{
    margin-top: 160px;
    width: 120px;
    height: 50px;
}

#fs-page-content .fs-page-content-text{
    line-height: 1.8em;
}

#fs-page-content{
    font-size: 1.0rem;
}

@media (min-width: 768px) {
    #fs-page-content{
        font-size: 1.1rem;
    }
}

#fs-page-content .fs-content-img{
    max-width: 100%;
}

#fs-page-content iframe{
    max-width: 100%;
    display: block;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

#fs-poll-div{
    min-height: 200px;
}

#fs-menu-icon-div{
    width: 19px;
    text-align: left;
}

#fs-menu-icon-div .fa-xmark{
    font-size: 20px;
    padding-bottom: 2px;
    padding-right: 1px;
}

/* QUIZ */
.fs-score-div-red{
    color: var(--fs-red-color);
    background-color: var(--fs-gray-color-100);
}

.fs-score-div-green{
    color: var(--fs-green-color);
    background-color: var(--fs-gray-color-100);
}

[data-bs-theme="dark"] .fs-score-div-red, [data-bs-theme="dark"] .fs-score-div-green{
    background-color: var(--fs-gray-color-200);
}


/* ACTIVITY/EXTENSION */
#fs-extension-header{
    font-family: 'Varela Round', sans-serif;
    font-size: 1.2em;
}

#fs-activity-ready{

}

.fs-activity-go-ani{
  animation: fs-act-zoomout 1.0s ease-out forwards;
}

.fs-activity-ready-ani{
  animation: fs-act-zoomin 3.0s ease-out forwards;
}

.fs-activity-timesup-ani{
  animation: fs-act-zoomout-smooth 0.3s ease-out forwards;
}

@-webkit-keyframes fs-act-zoomout-smooth {   
  0% {
      transform: scale(1.0);
  }
  100% {
      transform: scale(1.5);
  }
}

@-webkit-keyframes fs-act-zoomout {    
  0% {
      transform: scale(1.0);
      opacity: 1;
  }
  10% {
      transform: scale(2.0);
      opacity: 1;
  }
  50% {
      transform: scale(1.5);
      opacity: 1;
  }
  70% {
      transform: scale(1.5);
      opacity: 1;
  }
  100% {
      transform: scale(1.0);
      opacity: 0;
  }
}

@-webkit-keyframes fs-act-zoomin {    
  0% {
      transform: scale(1.0);
  }
  100% {
      transform: scale(0.8);
  }
}

.fs-center-div{
    width: 100%;
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#fs-myActivityModal{
    background-color: rgba(0, 0, 0, 0.7);
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}

#fs-myActivityModal .modal-content{
    min-height: 500px;
}

#fs-myActivityModal .modal-content-no-height{
    min-height: initial;
}

#fs-myActivityModal .fs-secondary-modal{
    min-height: initial;
    width: 90%;
    margin-right: auto;
    margin-left: auto;  
}


#fs-myActivityModal .fs-close-modal-btn{
    position: absolute;
    right: 10px;
    top: 5px;
    z-index: 10;
    color: #000;
}

#fs-myActivityModal .fs-close-modal-btn:hover{
    opacity: 0.4 !important;
    /*color: var(--fs-primary-color-dark);*/
}

#fs-activity-hint{
    border-radius: 10px;
    padding: 20px 40px 20px 40px;
    color: var(--fs-black-color);;
    background-color: var(--fs-white-color);
}

.fs-activity-ending{
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
}

.fs-close-modal-btn-default{
    position: absolute;
    right: 15px;
    top: 7.5px;
    z-index: 10;
    color: var(--fs-black-color);
}

.fs-close-modal-btn-default:hover{
    opacity: 0.5;
    color: var(--fs-black-color);
}

/*
#fs-myActivityModalContent, .fs-activity-div{
    min-height: 500px;
}
*/
/* OVERLAY */
 #fs-achievement-overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /*background-color: rgba(0,0,0,0.8);*/ /* Black background with opacity */
    z-index: 2000; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
} 

#fs-achievement-center{
    position: absolute;
    top: 50%;
    width: 100%;
    color: black;
    transform: translate(0%,-50%);
    -ms-transform: translate(0%,-50%);
}

#fs-achievement-center h1{
    color: #000;
}

.fs-achievement-div img{
    max-width: 120px;
}

@media (min-width: 768px) {

    .fs-achievement-div img{
        max-width: 150px;
    }

}

#fs-achievement-hint{
    bottom: 20px;
    left: 0;
    right: 0;
    margin-right: auto;
    margin-left: auto;
    z-index: 2001;
    color: #000;
}

.fs-card-default-icon{
    max-width: 200px;
}

.fs-card-trophy-icon{
    max-width: 30px;
}

/* STARBURST */
.fs-starburst {
    width: 100%;
    height: 100%;
    display: flex;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    background: var(--fs-starburst-color-1);
}

.fs-starburst .fs-outer {
    width: 200vw;
    height: 100%;
    position: relative;
    animation: rotate infinite linear 2s;
}

.fs-starburst .fs-ray {
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    border-width: 12vw 100vw;
    border-color: transparent var(--fs-starburst-color-2);
    border-style: solid;
    margin: -12vw -100vw;
}

.fs-starburst .fs-ray:nth-child(1) { transform:rotate(20deg); }
.fs-starburst .fs-ray:nth-child(2) { transform:rotate(40deg); }
.fs-starburst .fs-ray:nth-child(3) { transform:rotate(60deg); }
.fs-starburst .fs-ray:nth-child(4) { transform:rotate(80deg); }
.fs-starburst .fs-ray:nth-child(5) { transform:rotate(100deg); }
.fs-starburst .fs-ray:nth-child(6) { transform:rotate(120deg); }
.fs-starburst .fs-ray:nth-child(7) { transform:rotate(140deg); }
.fs-starburst .fs-ray:nth-child(8) { transform:rotate(160deg); }
.fs-starburst .fs-ray:nth-child(9) { transform:rotate(180deg); }
@keyframes rotate {
from { transform: rotate(0deg); }
to   { transform: rotate(20deg); }
}

/* fancy box */
.fancybox__container{
    z-index: 1060 !important;
}