@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('fonts/stylesheet.css');
body{
    /*font-family: "Montserrat";*/
    font-family: 'Open Sauce Two', sans-serif;
    height: 100%
}

.wrapper{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

footer.footer{
    flex-shrink: 0;
    --bulma-footer-padding: 1.5rem 1.5rem 1.5rem;
}

.background-img-class{
    z-index: 3;
    /*background-image: url("boxback.jpg");
    background-size: 105%;
    min-height: 92vh;
    position:static;*/
    background-image: url("home/background_new.png");
    background-repeat: no-repeat;
    background-attachment: fixed;
    flex: 1;
}

.black-background-img-class{
    z-index: 3;
    background-image: image(black);
    background-repeat: no-repeat;
    background-attachment: fixed;
    flex: 1;
}

#home-page-hero{
    background-image: url("home/HOMEPAGERENDER1.png");
    background-position: center;
    background-size: cover;
}

.hero{
    --bulma-hero-body-padding-large: 25rem 6rem; /* for desktop */
    --bulma-hero-body-padding: 10rem 6rem; /* for mobile */
}

#home-text{
    /*background-image: url("home/background_new.png");*/
    /*background-color: #011518;*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
}

#pricing-text{
    background-image: url("home/background_new.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100vh;
}

#login-reg-text{
    background-image: url("home/background_new.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100vh;
}

#faqs-text{
    background-image: url("home/background_new.png");
    background-repeat: no-repeat;
    background-size: cover;
}

#support-master-text{
    background-image: url("home/background_new.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100vh;
}

.navbar{
    --bulma-navbar-background-color: hsla(220, 13%, 9%, 0.93);
    --bulma-navbar-burger-color: #15e8e3
}


ul{
    list-style-type: none !important;
}

.pricing-hr{
    background-color: unset!important;
    background-image: linear-gradient(to right, #285b5b, #038c8c, #285B5BFF)!important;
}

.button.is-primary{
    background-color: #15e8e3 !important;
}

.button.is-primary:hover{
    background-color: #54f3ed !important;
}

.zoa-box{
    --bulma-box-shadow: 0 0.5em 1em -0.125em hsla(175, 98%, 49%, 0.1), 0 0px 0 1px hsla(0deg, 0%, 63%, 0.02);
    background-size: 200%;
    background-position: right;
    border-color: #6affff63;
    border-style: solid;
    border-width: 0.01rem;
}

.pricing-box{
    background-image: none;
    background: rgba(0, 0, 0, 0.25);
    border-color: rgba(21, 232, 227, 0.7);
    border-width: 0.15rem;
    border-radius: 1.5rem;
    transition: height 0.3s ease;
    overflow: hidden;
}

.tabs{
    --bulma-tabs-toggle-link-active-background-color: #15e8e3;
    --bulma-tabs-toggle-link-active-color: rgb(0, 0, 0);
    --bulma-tabs-toggle-link-active-border-color: #15e8e3;
    --bulma-tabs-toggle-link-border-color: #057e7c;
    --bulma-tabs-toggle-link-hover-background-color: rgba(0, 255, 196, 0.16);
    --bulma-tabs-toggle-link-hover-border-color: rgba(5, 168, 164, 0.82);
    --bulma-tabs-link-color: #11aba6;
}

.tabs li{
    /*padding-inline: 0.5vw;*/
}

#standard-tab-monthly{
    padding-right: 0;
}

#standard-tab-annually{
    padding-left: 0;
}

#api-tab-monthly{
    padding-right: 0;
}

#api-tab-annually{
    padding-left: 0;
}



.accordion-button{
    background: transparent; border-color: transparent
}
.accordion-content {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease;
}

.accordion-box{
    background: rgba(0, 0, 0, 0.25);
    border-color: rgba(21, 232, 227, 0.7);
    border-width: 0.15rem;
    border-radius: 1.5rem;
    transition: height 0.3s ease;
    overflow: hidden;
    border-style: solid;
}

.faq-page-custom-button{
    /*--bulma-box-link-hover-shadow: 0 0.5em 1em -0.125em hsla(221, 14%, 4%, 0.1), 0 0 0 1px hsla(233, 100%, 63%, 1);*/
    /*--bulma-link: #15e8e3;*/
    --bulma-link: #15e8e3;
    background: rgba(0, 0, 0, 0.25);
    transition: 0.3s ease;
    border-width: 0.15rem;
    border-radius: 1.5rem;
    border-color: rgba(21, 232, 227, 0.7);
    color: #15e8e3;
}

.faq-page-custom-button:hover{
    background: #15e8e3;
    color: #012826;
    transition: 0.3s ease;
}

.faq-page-custom-button .faqimage{
    zoom: 24%;
    visibility: visible;
    transition: 0.3s ease;
}

.faq-page-custom-button .faqdark {
    display: none;
    transition: 0.3s ease;
}

/* On hover, swap images */
.faq-page-custom-button:hover .faqwhite {
    display: none;
    transition: 0.3s ease;
}
.faq-page-custom-button:hover .faqdark {
    display: inline-block;  /* or block, depending on your layout needs */
    transition: 0.3s ease;
}

.edu{
    /*zoom: 24%!important;*/
}

.account-box{
    background: rgba(5, 87, 85, 0.06);
    border-color: rgba(21, 232, 227, 0.7);
    border-width: 0.15rem;
    border-radius: 1.5rem;
    transition: height 0.3s ease;
    overflow: hidden;
    border-style: solid;
}

.spoiler {
    cursor: pointer;
    color: #15e8e3; /* Bulma's primary color */
    position: relative;
}

.spoiler-text {
    visibility: hidden;
    color: transparent;
    transition: color 0.3s ease, visibility 0.3s ease;
}

.spoiler.revealed .spoiler-text {
    visibility: visible;
    color: inherit;
}

.spoiler.revealed::before {
    content: " ";
    display: none;
}

.table{
    border-radius: 1.5rem;
}





