/****************************
 * Global style
*****************************/
/* Main sections */
.site-sticky {position:fixed; z-index:40; top:0; left:0; right:0;}
.site-header {position:relative; z-index:20;}
.site-content {position:relative; z-index:30;}
.site-footer {position:relative; z-index:10;}

/* Container */
.container, .container-small {
    position:relative; width:100%; max-width:calc(var(--vii-container) + var(--vii-gap-container) * 2);
    margin-right:auto; margin-left:auto;
    padding-right:var(--vii-gap-container); padding-left:var(--vii-gap-container);
}
.container-small {max-width:calc(768px + var(--vii-gap-container) * 2);}

/* Footer stick to bottom */
html, body {min-height:100vh;}
body {
    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;
    -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between;
}


/* Admin bar */
body.admin-bar [data-menu*="sticky"] {top:32px;}
@media screen and (max-width:782px) {
    html.has-admin-bar {margin-top:0 !important;}
    body.admin-bar [data-menu*="sticky"] {top:46px;}
}

/* Admin bar can cause conflict with Woocommerce Selector (select-2 dropdown) */
/* Move a little bit, equal with wp-admin bar height */
body.admin-bar .select2-container--open .select2-dropdown {margin-top:-32px;}


/****************************
 * Editor style
****************************/
p:empty {display:none;}

/* Button group */
p.vii-button-group {display:flex; flex-wrap:wrap; gap:8px 11px;}
p[style*="text-align:center"].vii-button-group,
p[style*="text-align: center"].vii-button-group {justify-content:center;}

/* Force white text color */
.txt_color_white {
    --vii-color-heading:var(--vii-color-white);
    --vii-color-permalink:var(--vii-color-white);
    --vii-color-permalink-highlight:var(--vii-color-red);
}

/* Text color */
.main_content .txt_color_primary {color:var(--vii-color-primary);}

/* Text size */
.main_content .txt_24px {font-size:var(--vii-size-24) !important;}
.main_content .txt_16px {font-size:var(--vii-size-16);}

/* Text alignment */
.txt_inline_block {display:inline-block;}
.txt_right {text-align:right; display:block;}
.txt_center {text-align:center; display:block;}
.txt_italic {font-style:italic;}
.txt_center_justify {text-align:justify; -moz-text-align-last:center; text-align-last:center; display:block;}

/* Button */
.txt_color_white [class*="btn_download"] {
    --btn-color:#fff;
}
.bg-red [class*="btn_download"] {--btn-color-hover:var(--vii-color-blue);}
.bg-blue [class*="btn_download"] {--btn-color-hover:var(--vii-color-red);}

/* Button in red background */
.txt_color_white[class*="bg-red"] [class*="btn_primary"] {
    --btn-bg-color:var(--vii-color-blue);
}

/* Text in red background */
.txt_color_white[class*="bg-red"] [class*="btn_download"] {
    --btn-color:var(--vii-color-white);
    --btn-color-hover:var(--vii-color-blue);
}

@media only screen and (min-width:1024px) {
    .paragraph-has-solid-bg p {
        background:var(--vii-color-primary);
        padding:4px 8px;
    }
}

/* Button in red background */
.txt_color_white[class*="bg-red"] [class*="btn_primary"] {
    --btn-bg-color:var(--vii-color-blue);
}

/* Ordered list */
.main_content ol li:last-child {padding-bottom:0;}


/****************************
 * Spacing
****************************/
/* the last element in a text block will have no spacing */
.wpb_text_column :last-child {margin-bottom:0;}

/* Spacing: Custom */
.no-margin-bottom {margin-bottom:0 !important;}
.margin-bottom-default {margin-bottom:var(--vii-spacing-default) !important;}
.margin-bottom-heading {margin-bottom:var(--vii-spacing-heading) !important;}
.margin-bottom-114px {margin-bottom:var(--vii-spacing-114) !important;}
.margin-bottom-90px {margin-bottom:var(--vii-spacing-90) !important;}
.margin-bottom-45px {margin-bottom:var(--vii-spacing-45) !important;}
.margin-bottom-30px {margin-bottom:var(--vii-spacing-30) !important;}
.margin-bottom-20px {margin-bottom:var(--vii-spacing-20) !important;}
.margin-bottom-15px {margin-bottom:var(--vii-spacing-15) !important;}
.margin-bottom-10px {margin-bottom:var(--vii-spacing-10) !important;}

.pt-default {padding-top:var(--vii-spacing-default);}
.pt-heading {padding-top:var(--vii-spacing-heading);}


/****************************
 * Miscellaneous
****************************/
/* Visibility Classes */
.hidden-mobile, .hidden-tablet-v, .hidden-tablet-h, .hidden-touch-devices {display:block;}
.show-mobile, .show-tablet-v, .show-tablet-h, .show-touch-devices {display:none;}

/* Placeholder */
body ::-webkit-input-placeholder {font-family:inherit; font-weight:inherit; font-size:inherit; color:var(--vii-color-placeholder); transition:var(--vii-transition);}
body ::-moz-placeholder {font-family:inherit; font-weight:inherit; font-size:inherit; color:var(--vii-color-placeholder); transition:var(--vii-transition);}
body :-ms-input-placeholder {font-family:inherit; font-weight:inherit; font-size:inherit; color:var(--vii-color-placeholder); transition:var(--vii-transition);}
body :-moz-placeholder {font-family:inherit; font-weight:inherit; font-size:inherit; color:var(--vii-color-placeholder); transition:var(--vii-transition);}

/* Loading (woocommerce selectors could be remove) */
.loading, .woocommerce .blockUI.blockOverlay, .woocommerce .loader {position:relative;}
.woocommerce .blockUI.blockOverlay:before, .woocommerce .loader:before,
.loading:before {
    content:""; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2;
    background-color:rgba(255, 255, 255, 0.7);
}
.loading:after,
body .xwc--pf-loader-overlay:after,
.woocommerce .blockUI.blockOverlay:after,
.woocommerce .loader:after {
    --loading-size:35px;
    content:""; position:absolute; top:50%; left:50%; z-index:3;
    width:var(--loading-size); height:var(--loading-size);
    margin:calc(-0.5 * var(--loading-size)) 0 0 calc(-0.5 * var(--loading-size));
    border-radius:50%; border:2px dashed transparent;
    border-bottom-color:var(--vii-color-primary);
    border-right-color:var(--vii-color-primary);
    animation:spinner .6s linear infinite;
    box-sizing:border-box;
}
@keyframes spinner {
    to {transform:rotate(360deg);}
}

/* Full width */
.vii-full-width {margin-left:calc(-1 * var(--vii-gap-side) - 0.5px); margin-right:calc(-1 * var(--vii-gap-side));}

/* Background color */
.vii-bg-gray {background-color:var(--vii-color-gray);}
.vii-bg-primary {background-color:var(--vii-color-primary); color:var(--vii-color-on-primary);}

/* A11y focus */
a:focus-visible,
button:focus-visible,
.a11y-focus:focus-visible {outline:2px solid var(--vii-color-primary); border-radius:3px; transition:none;}

/* disabled focus visible */
.a11y-disable a:focus-visible,
.a11y-disable button:focus-visible,
.a11y-disable:focus-visible {outline:none; border-radius:0;}

/* spacing x */
.pl24 {padding-left:24px;}
.pr24 {padding-right:24px;}

/*********************************************
 * RMIT Mask
 * required classes: img-rmit-mask with-red-solid img-wrapper-cover ab-full-b
**********************************************/
.img-rmit-mask {
    --img-data:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1NTkgNTYwIj4KICAgIDxwYXRoIGQ9Ik01NTksMFYxODYuNDRsLTkyLjcxLDkzLjU2LDkyLjcxLDkzLjU2djE4Ni40NGgtMTg2LjgxbC05Mi42OS05Mi4xOS05Mi43MSw5Mi4xOUgwdi0xODcuODFsOTIuNzEtOTIuODhMMCwxODcuODFWMEgxODcuNDhsOTIuMDIsOTIuODhMMzcyLjksMGgxODYuMVoiLz4KPC9zdmc+");
    --solid-offset:23px;

    aspect-ratio:1;
    position:relative;
}

.img-rmit-mask img {z-index:2; position:relative;}
.img-rmit-mask:before {
    display:none;
    right:var(--solid-offset); bottom:var(--solid-offset);
    background-color:var(--vii-color-red);

    --offset:calc(var(--solid-offset) + 3px);
    transform:translate(var(--offset), var(--offset)) scale(.997);
}

.img-rmit-mask img,
.img-rmit-mask:before {
    -webkit-mask-image:var(--img-data);
    mask-image:var(--img-data);
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
}

/* with red solid */
.img-rmit-mask.with-red-solid {
    padding:0 var(--solid-offset) var(--solid-offset) 0;
}
.img-rmit-mask.with-red-solid:before {display:block;}

/* responsive */
@media only screen and (max-width:1024px) {
    .img-rmit-mask {
        --solid-offset:14px;
    }
}

/* 2025 mask */
.vii-rmit-mask {
    mask-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODUwIiBoZWlnaHQ9Ijg1MCIgdmlld0JveD0iMCAwIDg1MCA4NTAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0wLjAyOTMzOTEgNC40NzIxMmUtMDVMMC4wMjkzNTE1IDI4My4zMzNMMTQxLjgxOSA0MjQuODY4TC0xLjIzODM2ZS0wNSA1NjYuNjk2TDAgODUwTDI4My4zMTQgODUwTDQyNC45NTYgNzA4LjM0OEw0MjUuMDE1IDcwOC4zNDhMNTY2LjY4NiA4NTBMODQ5Ljk3MSA4NTBMODQ5Ljk3MSA1NjYuNjk2TDcwOC40NzUgNDI1LjEzMkw4NTAgMjgzLjMzM0w4NTAgNy41Njc3OGUtMDZMNTY2LjY1NyAxLjk5NTMxZS0wNUw0MjQuOTg1IDE0MS42ODFMMjgzLjM0MyAzLjIzMzcxZS0wNUwwLjAyOTMzOTEgNC40NzIxMmUtMDVaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K");
    mask-size:cover;
    mask-repeat:no-repeat;
    mask-position:center center;
}

/*********************************************
 * Background grid
**********************************************/
.bg-grid {
    background-image:linear-gradient(to right, var(--grid-color) 1px, rgba(0, 0, 0, 0) 1px),
    linear-gradient(to bottom, var(--grid-color) 1px, rgba(0, 0, 0, 0) 1px);
    background-size:var(--grid-size) var(--grid-size);
    background-position:var(--grid-pos-x) var(--grid-pos-y);
}

/* remove grid on mobile */
@media only screen and (max-width:1023px) {
    body.bg-grid {background-image:unset;}
}


/*********************************************
 * Float animation
**********************************************/
@keyframes float {
    0% {
        transform:translatey(0px);
    }
    50% {
        transform:translatey(-20px);
    }
    100% {
        transform:translatey(0px);
    }
}
.vii-floating-anim {
    --anim-d:6s;
    /*animation:float var(--anim-d) ease-in-out infinite;*/
    pointer-events:none; z-index:2;
}

/* custom scrollbar */
/* Works on Chrome, Edge, and Safari */
body::-webkit-scrollbar,
.vii-custom-scroll-bar::-webkit-scrollbar {width:var(--vii-scroll-bar-width);}
body::-webkit-scrollbar-track,
.vii-custom-scroll-bar::-webkit-scrollbar-track {background:var(--vii-color-gray);}
body::-webkit-scrollbar-thumb,
.vii-custom-scroll-bar::-webkit-scrollbar-thumb {background-color:var(--vii-color-blue);}

/* custom hover effect */
.custom-hover-effect [class*="btn_arrow"] {
    --btn-bg:var(--vii-color-primary);
    --btn-bg-hover:var(--vii-color-blue);
    --btn-color:var(--vii-color-on-primary);
    --btn-color-hover:var(--vii-color-on-primary);

    background:var(--btn-bg); padding:8px 34px 8px 12px;
    display:inline-block;
}
.custom-hover-effect [class*="btn_arrow"]:before {display:none;}
.custom-hover-effect [class*="btn_arrow"]::after {transform:translate(-12px, -50%);}
.custom-hover-effect [class*="btn_arrow"]:hover,
.custom-hover-effect [class*="btn_arrow"]:focus,
.custom-hover-effect.trigger-hover:hover [class*="btn_arrow"],
.custom-hover-effect.trigger-hover:focus [class*="btn_arrow"] {
    padding-left:12px; padding-right:34px;
    background:var(--btn-bg-hover);
}
.custom-hover-effect [class*="btn_arrow"]:hover:after,
.custom-hover-effect [class*="btn_arrow"]:focus:after,
.custom-hover-effect.trigger-hover:hover [class*="btn_arrow"]:after,
.custom-hover-effect.trigger-hover:focus [class*="btn_arrow"]:after {transform:translate(-9px, -50%);}

.txt_color_white .custom-hover-effect [class*="btn_arrow"] {
    --btn-bg:var(--vii-color-white);
    --btn-bg-hover:#F1CF32;
    --btn-color:var(--vii-color-blue);
    --btn-color-hover:var(--vii-color-blue);
}