
:root {
    --offcanvas-width: 280px;
    --settings_offcanvas-width: 220px;
    --topNavbarHeight: 0px;
    --borderroundness: 4px;
    --goldColor: #e39318;
    --silverColor: #8f8f8f;
    --bronzeColor: #a05c17;
    --bgCol: var(--bs-body-bg);
    --darkCol: var(--bs-dark);
    --secCol: var(--bs-secondary);
    --fa-counter-background-color: none;
    --fa-counter-scale: 0.7;
    --fa-counter-border-radius: 1;
    --pinc-oauth-ui-panel-bg-color: var(--darkCol) !important;
    --pinc-oauth-ui-panel-text-color: white !important;
    --pinc-oauth-ui-panel-light-text-color: #8E95AB !important;
    --pinc-oauth-ui-panel-hover-bg-color: rgba(232, 232, 232, 0.6) !important;
}

.table {
    --bs-table-striped-bg: rgba(12, 12, 14, 0.1) !important;
}

.clickable {
    cursor: pointer;
}

.notifications_dropdown {
    width: 350px;
}

.notifications_height {
    overflow-y: scroll;
    max-height: 400px;
      -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.notifications_height::-webkit-scrollbar {
  display: none;
}

.pull-right {
    position: absolute;
    right: 1.5em;
}

.grabbable {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

 /* (Optional) Apply a "closed-hand" cursor during drag operation. */
.grabbable:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}

.grabbable:focus {  
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}

.btn-primary:focus {
    box-shadow: none !important;
}

.form-control {
    background: var(--secCol);
}

.form-select {
    background-color: var(--secCol);
}

.oldTheme {
    --bgColOld: #131316;
    --darkColOld: #1C1C21;
    --secColOld: #272D3F;
}

span.ripple {
  position: absolute; /* The absolute position we mentioned earlier */
  border-radius: 50%;
  transform: scale(0);
  animation: ripple 600ms linear;
  background-color: rgba(255, 255, 255, 0.6);
}

@keyframes ripple {
  to {
    transform: scale(4);
    opacity: 0;
  }
}

.mirror {
transform: scaleX(-1);
}

#app {
    padding-right: 0px !important;
    /* This setting because page shifts, need to find the original cause still */
}

html {
    overflow-y: scroll;
}

.over_h {
    overflow: hidden;
}

body .modal-open {
    overflow-y: hidden !important;
}

.form-label {
    color: #dedede;
    font-size: 1em;
    margin-bottom: .2em;
}

.conicborder {
  --angle: 0deg;
  border-bottom: 3px solid;
  border-image: conic-gradient(from var(--angle), #9f05c9, #bd1d32, #c9912d, #0d8760, #0576c9, #9f05c9) 1;
  
  animation: 5s rotate linear infinite;
}

@keyframes rotate {
  to {
    --angle: 360deg;
  }
}

@property --angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

.border-conic-gradient {
    background: conic-gradient(
    #9f05c999 0deg 72deg,
    #bd1d3299 82deg 104deg,
    #c9912d99 114deg 236deg,
    #0d876099 256deg 268deg,
    #0576c999 278deg 285deg,
    #9f05c999 310deg 360deg
  );
    /* background: conic-gradient(#9f05c999, #bd1d3299, #c9912d99, #0d876099, #0576c999, #9f05c999); */
    border-image-slice: 1;

}


.table-custom {
    background-color: rgba(0,0,0,.05);
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.modal-lg {
    max-width: 700px !important;
}

.modal-xl {
    max-width: 900px !important;
}


.message_bubble {

	position: relative;
	max-width: 30em;
	
	background-color: #0576c9;
	padding: 1.125em 1.5em;
	font-size: 1.25em;
	border-radius: var(--borderroundness);
}

.message_bubble::before {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	bottom: 100%;
	left: 1.5em;

	border: .75rem solid transparent;

	border-top: none;

	border-bottom: .75rem solid #0576c9;
	filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, .1));
}


.background_gradient {
    background: linear-gradient(-45deg, #c9912d, #9f05c9, #0576c9, #0d8760);
    animation: gradient 8s ease-in-out infinite;
    background-size: 200% 200%;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.background_test {
    background-color: #0576c970;
}



.dropdown-toggle::after {
    content: none;
}

.achievement_settings_picker {
    background-color: var(--darkCol);
}

.wheelArea img {
    width: 100%;
    height: 400px;
}

.achievement_settings_picker:hover {
    background-color: #0576c9;
    cursor: pointer;
}

em-emoji-picker {
        --background-rgb: #1B1B22;
        --border-radius: rgba(0, 0, 0, 0.1);
        --color-border-hover: rgba(0, 0, 0, 0.1);
        --color-border: rgba(0, 0, 0, 0.05);
        --rgb-background: var(--darkCol);
        --shadow: 5px 5px 15px -8px var(--secCol);
      }

.profile_pic {
    border: 3px solid #8e95ab80;
}

#Profile_offcanvas {
    margin-right: -10px;
}

.switch {
    transform: scale(2);
    transform-origin: left;
    background-color: rgba(255, 255, 255, 0.205);
}

img {
    background-size: cover !important;
    object-fit: cover;

      -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

::-webkit-scrollbar-track {
    background-color: var(--secCol);
	border-radius: 10px;
}

::-webkit-scrollbar
{
	width: 10px;
	background-color: var(--secCol);
}

::-webkit-scrollbar-thumb
{
	border-radius: var(--borderroundness);
    background-color: var(--darkCol);
}

.noscroller::-webkit-scrollbar-track
{
	background-color: var(--darkCol);
	border-radius: var(--borderroundness);
}

.noscroller::-webkit-scrollbar
{
	width: var(--borderroundness);
	background-color: var(--darkCol);
}

.noscroller::-webkit-scrollbar-thumb
{
	border-radius: var(--borderroundness);
    background-color: var(--darkCol)50;
}

.noscroller::-webkit-scrollbar-thumb:hover
{
	border-radius: var(--borderroundness);
    background-color: var(--darkCol);
}


main {

    }

/* Search function */

.searchbar {
    border-width: 0px 0px 0px 1px;
    border-color: rgba(177, 177, 177, 0);
    border-radius: var(--borderroundness);
    background-color: var(--darkCol);
    color: #fff;
    width: 300px;
}

.searchicon {
    color: #626A82;
    margin-right: 10px;
    -webkit-transition-duration: 0.6s;
            transition-duration: 0.6s;
}

/* Columns and rows inside the app */

.lightcol {
    border-radius: var(--borderroundness);
    padding: 1.5em;
}

.targetcol {
    margin: 0px;
}

/* Heart Like Animation */

.heart {
  width: 100px;
  height: 100px;
  transform: translate(-50%, -50%);
  background: url(https://cssanimation.rocks/images/posts/steps/heart.png) repeat;
  background-position: 0 0;
  cursor: pointer;
}
.heart-active {
  background-position: -2800px 0;
  transition: background 1s steps(28);
}
@keyframes fave-heart {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -2800px 0;
  }
}

/* Heart Like Animation END */


/* sidebars and header */

.topbar {
    background-color: var(--bgCol);
}

.offcanvas_left {
    width: var(--offcanvas-width);
    background-color: var(--bgCol);
    z-index: 20;
}

.offcanvas_settings {
    margin-left: var(--offcanvas-width);
    background-color: var(--bgCol);
    width: var(--settings_offcanvas-width);
    z-index: 19;

    border-right: solid;
    border-right-color: var(--darkCol);
    border-right-width: 3px;
}

@media (min-width: 992px) {
    main {
        margin-left: var(--offcanvas-width);
        margin-top: 4px;
    }
    .offcanvas_left {
        -webkit-transform: none;
                transform: none;
        visibility: visible !important;
    }
    .offcanvas-backdrop::before {
        display: none;
    }
    .offcanvas-header_left .btn-close {
        visibility: hidden;
    }
    .topbar {
        margin-left: var(--offcanvas-width);}

.col {
        clear: left;
    }

.col.first_place_column {
        background-color: hsla(225, 28%, 20%, 0.5);
    }

.trophy {
        color: rgba(246, 208, 6, 0.5);
        margin-left: 10px;
    }  
}

.left_sidebar_icon {
    width: 28px;
    margin-right: 10px;
    color: var(--bs-gray-300);
    --fa-secondary-opacity: 0.6;
    }

.nav-item:hover .left_sidebar_icon {
    color: #0576c9;
}

.active .left_sidebar_icon {
    color: #0576c9;
}

.gemicon {
    color: #0576c9;
}

.xp_icon {
    color: #6666FF;
}

.blop {
	-webkit-transform: scale(1);
	        transform: scale(1);
	-webkit-animation: pulse 2s infinite;
	        animation: pulse 2s infinite;
}

@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale(0.95);
		        transform: scale(0.95);
    }
	70% {
		-webkit-transform: scale(1.00);
		        transform: scale(1.00);
	}

	100% {
		-webkit-transform: scale(0.95);
		        transform: scale(0.95);
	}
}

@keyframes pulse {
	0% {
		-webkit-transform: scale(0.95);
		        transform: scale(0.95);
    }
	70% {
		-webkit-transform: scale(1.00);
		        transform: scale(1.00);
	}

	100% {
		-webkit-transform: scale(0.95);
		        transform: scale(0.95);
	}
}

.progress {
    background-color: #dedede;}

.seeprogress {
    margin-bottom: 0px;
    transition: all .1s ease-in-out;
}


.smallicon {
    margin-right: 10px;
    color: #626A82;
}

.bigicon {
    color: #626A82;}

.home_leaderboard {
    position: -webkit-sticky;
    position: sticky;
    height: calc(100vh - 54px);
    top: 54px; 
}

.latest_sales {

}

.latest_sales.home_leaderboard:hover {
        overflow-y: scroll !important;
}


.login_row {
    height: 100vh;
}


/* Appear Animation */

.fadein {
    transition:visibility 10s linear,opacity 10s linear;
}


.searchbar:focus {
    color: #fff;
    background: none;
    background-color: rgba(0, 0, 0, 0);
    border: 0px solid #626a82;
    border-left-width: 2px;
    border-radius: 0px;
}

.delete_button {
    color: #626A82;}

.feed_message_input {
    background-color: var(--secCol);
    height: 43px;
    font-size: large;
      -webkit-transition: 0.1s ease-in-out;
  transition: 0.1s ease-in-out;
  }

.notificati {
    z-index: 9999;
}

.comments_col {
    text-indent: 0px;
}

.small_timesince {
    font-size: 12px;}

.col.lightcol.overview_top {
    background-image: url("../assets/images/race.svg");
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.tablehead {
    border-width: 3px;
    border-color: rgba(0, 0, 0, 0);
    color: #626A82;
}

thead, tbody, tr, th  {
    border-style: none !important;
}

#chart {
  max-width: 650px;
  margin: 35px auto;
  color: black;
}

.chartbutton {
      background: none;
      border: none;
      color: #8E95AB;
      margin-left: 20px;
      font-size: 0.8em;
    }

.chartbutton:hover {
      color: #f2f2f2;
    }

.title_icons {
    color: #8E95AB;
    margin-right: 10px;}

td:first-child,
th:first-child {
  border-radius: var(--borderroundness) 0 0 var(--borderroundness);
}

td:last-child,
th:last-child {
  border-radius: 0 var(--borderroundness) var(--borderroundness) 0;
}

.mycell {
    background-color: #0576c9;
}

.col.lightcol.stripedback {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1000%26quot%3b)' fill='none'%3e%3cpath d='M1536 560L0 560 L0 287.89Q33.48 249.37%2c 72 282.84Q129.15 267.99%2c 144 325.14Q192.22 253.36%2c 264 301.58Q314.77 232.35%2c 384 283.12Q435.56 262.68%2c 456 314.24Q528.87 267.11%2c 576 339.97Q614.63 258.6%2c 696 297.22Q725.64 254.86%2c 768 284.5Q820.98 265.48%2c 840 318.46Q918.18 276.64%2c 960 354.83Q992.83 267.65%2c 1080 300.48Q1106.09 254.56%2c 1152 280.65Q1205.25 261.9%2c 1224 315.16Q1249.21 268.37%2c 1296 293.58Q1379.14 256.72%2c 1416 339.86Q1447.44 251.3%2c 1536 282.74z' fill='rgba(22%2c 27%2c 40%2c 1)'%3e%3c/path%3e%3cpath d='M1464 560L0 560 L0 350.42Q75.57 306%2c 120 381.57Q187.42 328.99%2c 240 396.41Q315.51 351.92%2c 360 427.43Q374.56 369.99%2c 432 384.55Q500.97 333.52%2c 552 402.49Q596.66 327.15%2c 672 371.81Q716.21 344.02%2c 744 388.24Q800.24 372.48%2c 816 428.71Q839.64 380.35%2c 888 403.98Q927.99 323.97%2c 1008 363.96Q1093.72 329.68%2c 1128 415.4Q1177.7 393.11%2c 1200 442.81Q1223.03 345.84%2c 1320 368.87Q1350.32 327.19%2c 1392 357.5Q1440.73 334.23%2c 1464 382.96z' fill='rgba(29%2c 35%2c 51%2c 1)'%3e%3c/path%3e%3cpath d='M1464 560L0 560 L0 503.69Q43.43 427.12%2c 120 470.54Q144.5 423.04%2c 192 447.54Q238.59 374.13%2c 312 420.72Q373.3 410.02%2c 384 471.32Q423.93 391.25%2c 504 431.17Q578.1 385.26%2c 624 459.36Q652.47 415.83%2c 696 444.3Q753.42 429.72%2c 768 487.14Q833.89 433.03%2c 888 498.93Q915.56 406.49%2c 1008 434.04Q1052.22 406.26%2c 1080 450.48Q1168.94 419.42%2c 1200 508.36Q1245.08 433.44%2c 1320 478.51Q1350.05 436.56%2c 1392 466.6Q1415.78 418.38%2c 1464 442.16z' fill='%23356cb1'%3e%3c/path%3e%3cpath d='M1488 560L0 560 L0 550.58Q46.48 525.06%2c 72 571.53Q89.46 516.99%2c 144 534.45Q213.9 484.36%2c 264 554.26Q306.15 524.41%2c 336 566.56Q404 514.55%2c 456 582.55Q477.38 483.93%2c 576 505.32Q622.65 479.98%2c 648 526.63Q708.93 515.56%2c 720 576.49Q748.8 485.29%2c 840 514.08Q865.24 467.32%2c 912 492.56Q968.38 476.95%2c 984 533.33Q1052.85 482.18%2c 1104 551.03Q1154.51 529.54%2c 1176 580.05Q1228.31 512.36%2c 1296 564.66Q1335.55 484.21%2c 1416 523.76Q1445.67 481.43%2c 1488 511.11z' fill='rgba(22%2c 27%2c 40%2c 1)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1000'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
background-position: bottom;
background-repeat: no-repeat;
background-size: cover;
}

.stripedback {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1000%26quot%3b)' fill='none'%3e%3cpath d='M1536 560L0 560 L0 287.89Q33.48 249.37%2c 72 282.84Q129.15 267.99%2c 144 325.14Q192.22 253.36%2c 264 301.58Q314.77 232.35%2c 384 283.12Q435.56 262.68%2c 456 314.24Q528.87 267.11%2c 576 339.97Q614.63 258.6%2c 696 297.22Q725.64 254.86%2c 768 284.5Q820.98 265.48%2c 840 318.46Q918.18 276.64%2c 960 354.83Q992.83 267.65%2c 1080 300.48Q1106.09 254.56%2c 1152 280.65Q1205.25 261.9%2c 1224 315.16Q1249.21 268.37%2c 1296 293.58Q1379.14 256.72%2c 1416 339.86Q1447.44 251.3%2c 1536 282.74z' fill='rgba(22%2c 27%2c 40%2c 1)'%3e%3c/path%3e%3cpath d='M1464 560L0 560 L0 350.42Q75.57 306%2c 120 381.57Q187.42 328.99%2c 240 396.41Q315.51 351.92%2c 360 427.43Q374.56 369.99%2c 432 384.55Q500.97 333.52%2c 552 402.49Q596.66 327.15%2c 672 371.81Q716.21 344.02%2c 744 388.24Q800.24 372.48%2c 816 428.71Q839.64 380.35%2c 888 403.98Q927.99 323.97%2c 1008 363.96Q1093.72 329.68%2c 1128 415.4Q1177.7 393.11%2c 1200 442.81Q1223.03 345.84%2c 1320 368.87Q1350.32 327.19%2c 1392 357.5Q1440.73 334.23%2c 1464 382.96z' fill='rgba(29%2c 35%2c 51%2c 1)'%3e%3c/path%3e%3cpath d='M1464 560L0 560 L0 503.69Q43.43 427.12%2c 120 470.54Q144.5 423.04%2c 192 447.54Q238.59 374.13%2c 312 420.72Q373.3 410.02%2c 384 471.32Q423.93 391.25%2c 504 431.17Q578.1 385.26%2c 624 459.36Q652.47 415.83%2c 696 444.3Q753.42 429.72%2c 768 487.14Q833.89 433.03%2c 888 498.93Q915.56 406.49%2c 1008 434.04Q1052.22 406.26%2c 1080 450.48Q1168.94 419.42%2c 1200 508.36Q1245.08 433.44%2c 1320 478.51Q1350.05 436.56%2c 1392 466.6Q1415.78 418.38%2c 1464 442.16z' fill='%23356cb1'%3e%3c/path%3e%3cpath d='M1488 560L0 560 L0 550.58Q46.48 525.06%2c 72 571.53Q89.46 516.99%2c 144 534.45Q213.9 484.36%2c 264 554.26Q306.15 524.41%2c 336 566.56Q404 514.55%2c 456 582.55Q477.38 483.93%2c 576 505.32Q622.65 479.98%2c 648 526.63Q708.93 515.56%2c 720 576.49Q748.8 485.29%2c 840 514.08Q865.24 467.32%2c 912 492.56Q968.38 476.95%2c 984 533.33Q1052.85 482.18%2c 1104 551.03Q1154.51 529.54%2c 1176 580.05Q1228.31 512.36%2c 1296 564.66Q1335.55 484.21%2c 1416 523.76Q1445.67 481.43%2c 1488 511.11z' fill='rgba(22%2c 27%2c 40%2c 1)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1000'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
}

.newsale {
background-color: #000000;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 800'%3E%3Cg %3E%3Ccircle fill='%23000000' cx='400' cy='400' r='600'/%3E%3Ccircle fill='%23230046' cx='400' cy='400' r='500'/%3E%3Ccircle fill='%232f0052' cx='400' cy='400' r='400'/%3E%3Ccircle fill='%233b075e' cx='400' cy='400' r='300'/%3E%3Ccircle fill='%2348156a' cx='400' cy='400' r='200'/%3E%3Ccircle fill='%23552277' cx='400' cy='400' r='100'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover;
}

.coins_icon {
    color: #e39318;
}

.modalheader {
    background-color: #202638;
}

.dmxDropzone {
    background-color: var(--secCol) !important;
    border: 2px dashed #626a82 !important;
}

.dmxDropzoneMessage {
    color: #8E95AB !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.dmx-slideshow-slides-container {
    border-radius: var(--borderroundness) !important;
}

.tooltip-inner {
    z-index: 999999999;
    max-width:500px;
    padding:3px 8px;
    font-weight: bold;
    color:#fff;
    text-align:center;
    border-radius: var(--borderroundness);
    font-size: 0.8rem;
    background: linear-gradient(-45deg, #c9912d, #9f05c9, #0576c9, #0d8760);
    animation: gradient 15s ease infinite;
    background-size: 400% 400%;
}
.tooltip-arrow {

}

.tooltip {
    z-index: 999999999;
}

/* '/assets/companyfiles/'+userdetails.data.query[0].Company+'/rewards/'+RewardID+'/small/'+ImageName */

.rewardimages {
    overflow: none;
    height: 200px;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}


.daterangepicker td.available:hover, .daterangepicker th.available {
    background-color: #8E95AB !important;
}

.daterangepicker td.available:hover, .daterangepicker th.available:hover {
    background-color: var(--secCol);
}

.daterangepicker td.available:hover {
    background-color: var(--secCol);
}

.daterangepicker td.in-range {
    background-color: var(--secCol);
    color: #dedede;
}

.daterangepicker td.off {
    background-color: var(--darkCol) !important;
}

.daterangepicker td.active {
    background-color: var(--bs-primary);
}

.calendar-table {
    background-color: var(--darkCol) !important;
    border: none !important;
}


.daterangepicker {
    border-color: var(--secCol) !important;
    z-index: 999999999 !important;
    color: #dedede !important;
    background-color: var(--darkCol) !important;
}

.daterangepicker .calendar-table {
    border-color: var(--darkCol);
    background-color: var(--darkCol);
}

.daterangepicker .ranges li:hover {
    background-color: var(--secCol) !important;
}

.daterangepicker select.ampmselect, .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect {
    border: none;
    background: #8E95AB;
}

.applyBtn {
    background-color: #0576c9;
}

.cancelBtn {
    background-color: var(--secCol);
    color: #dedede;
}

.cancelBtn:hover {
    background-color: var(--darkCol);
}

.sales_datepicker {
    background-color: var(--darkCol);
    border-radius: var(--borderroundness);
    border-style: none;
    color: white;
    width: 200px;
    padding: 5px 10px;
}

.sales_datepicker::-webkit-input-placeholder {
    color: #626A82;
}

.toast1 {
    color: #000 !important;
    background-color: #ba6060 !important;
}

.newsalemodal {

}

.nav-item {
    border-radius: var(--borderroundness);
}

.nav-item:hover {
    background-color: var(--darkCol);
}

.navlm {
    margin-bottom: 5px;
}

.navlm.active {
    background-color: var(--darkCol);
}

.nav-link.comp.active {
    background-color: var(--secCol) !important;
}



/* Confetti
----------------------
*/
.bg-confetti-animated {
    
    background-repeat: repeat-x;
    background-position: top -10px center;
    background-image: url("data:image/svg+xml,%3Csvg width='auto' height='auto' viewBox='0 0 600 90' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='42' y='-10' width='6' height='10'/%3E%3Crect x='84' y='-10' width='6' height='10'/%3E%3Crect x='126' y='-13' width='5' height='13'/%3E%3Crect x='168' y='-13' width='5' height='13'/%3E%3Crect x='210' y='-10' width='6' height='10'/%3E%3Crect x='252' y='-13' width='5' height='13'/%3E%3Crect x='294' y='-10' width='6' height='10'/%3E%3Crect x='336' y='-13' width='5' height='13'/%3E%3Crect x='378' y='-13' width='5' height='13'/%3E%3Crect x='420' y='-10' width='6' height='10'/%3E%3Crect x='462' y='-10' width='6' height='10'/%3E%3Crect x='504' y='-13' width='5' height='13'/%3E%3Crect x='546' y='-10' width='6' height='10'/%3E%3Cstyle type='text/css'%3E rect %7B opacity: 0; %7D rect:nth-child(1) %7B transform-origin: 45px 5px; transform: rotate(-145deg); animation: blast 700ms infinite ease-out; animation-delay: 88ms; animation-duration: 631ms; %7D rect:nth-child(2) %7B transform-origin: 87px 5px; transform: rotate(164deg); animation: blast 700ms infinite ease-out; animation-delay: 131ms; animation-duration: 442ms; %7D rect:nth-child(3) %7B transform-origin: 128px 6px; transform: rotate(4deg); animation: blast 700ms infinite ease-out; animation-delay: 92ms; animation-duration: 662ms; %7D rect:nth-child(4) %7B transform-origin: 170px 6px; transform: rotate(-175deg); animation: blast 700ms infinite ease-out; animation-delay: 17ms; animation-duration: 593ms; %7D rect:nth-child(5) %7B transform-origin: 213px 5px; transform: rotate(-97deg); animation: blast 700ms infinite ease-out; animation-delay: 122ms; animation-duration: 476ms; %7D rect:nth-child(6) %7B transform-origin: 255px 6px; transform: rotate(57deg); animation: blast 700ms infinite ease-out; animation-delay: 271ms; animation-duration: 381ms; %7D rect:nth-child(7) %7B transform-origin: 297px 5px; transform: rotate(-46deg); animation: blast 700ms infinite ease-out; animation-delay: 131ms; animation-duration: 619ms; %7D rect:nth-child(8) %7B transform-origin: 338px 6px; transform: rotate(-65deg); animation: blast 700ms infinite ease-out; animation-delay: 85ms; animation-duration: 668ms; %7D rect:nth-child(9) %7B transform-origin: 380px 6px; transform: rotate(13deg); animation: blast 700ms infinite ease-out; animation-delay: 128ms; animation-duration: 377ms; %7D rect:nth-child(10) %7B transform-origin: 423px 5px; transform: rotate(176deg); animation: blast 700ms infinite ease-out; animation-delay: 311ms; animation-duration: 508ms; %7D rect:nth-child(11) %7B transform-origin: 465px 5px; transform: rotate(108deg); animation: blast 700ms infinite ease-out; animation-delay: 108ms; animation-duration: 595ms; %7D rect:nth-child(12) %7B transform-origin: 506px 6px; transform: rotate(62deg); animation: blast 700ms infinite ease-out; animation-delay: 105ms; animation-duration: 375ms; %7D rect:nth-child(13) %7B transform-origin: 549px 5px; transform: rotate(16deg); animation: blast 700ms infinite ease-out; animation-delay: 149ms; animation-duration: 491ms; %7D rect:nth-child(odd) %7B fill: %2365BB5C; %7D rect:nth-child(even) %7B z-index: 1; fill: %2333AAFF; %7D rect:nth-child(4n) %7B animation-duration: 1400ms; fill: %23F23B14; %7D rect:nth-child(3n) %7B animation-duration: 1750ms; animation-delay: 700ms; %7D rect:nth-child(4n-7) %7B fill: %232A2F6A; %7D rect:nth-child(6n) %7B fill: %23FBBA23; %7D @keyframes blast %7B from %7B opacity: 0; %7D 20%25 %7B opacity: 1; %7D to %7B transform: translateY(90px); %7D %7D %3C/style%3E%3C/svg%3E%0A");
}

/* Confetti End
----------------------
*/

.closebutton_white {
    color: white !important;
    background-color: var(--bs-gray-300);
    position: absolute;
    right: 1.5em;
    margin: 0 !important;
}

.text-wrapping {
    border-radius: var(--borderroundness);
}

.image-wrapping {
    border: 10px solid #0576c9 !important;
}

.visibleanimation {
  visibility: visible;
  opacity: 1;
  -webkit-transition: opacity 2s linear;
  transition: opacity 2s linear;
}

.hideanimation{
  visibility: hidden;
  opacity: 0;
  -webkit-transition: visibility 0s 2s, opacity 2s linear;
  transition: visibility 0s 2s, opacity 2s linear;
}

.image-wrapping-small {
    border: 1px solid rgba(255, 255, 255,);}

.announcement_close {
    color: #fff;
    background-color: #fff;
}

.ach-column {
    background-color: var(--secCol);
}

.ach-column:hover {
    cursor: pointer;
    background-color: #0576c9;
}

.form_step_dot {
    background-color: #626A82;
    width: 50px;
    height: 5px;
}


.form_badge_section {
    background-color: var(--secCol);}

.badge_col:hover {
    cursor: pointer;
}

.badge_col {}

.button_icon {
    color: #8E95AB;
}


.tablerow_detail {}

.tablerow_detail:hover {
    cursor: pointer;
}

.input_height {
    height: 38px;
}

.input_dark {
    background-color: var(--darkCol);
}

.input_message_row {
    position: sticky;}

.greencolor {
    border-radius: var(--borderroundness);
    color: #002217;}

.hearticon {
    margin-left: 5px !important;
    color: #d93f3f;
    font-weight: bold;
    }

.commenticon {
    margin-left: 10px !important;
    }

.hearticon:hover {
    font-size: large;
}

.commenticon:hover {
    font-size: large;
}

.dmxDropzone.post_message_dropzone {
    background-color: var(--bgCol) !important;
    border: 2px dashed var(--secCol) !important;
}

.input_message_button {
    float: right;
    top: 15%;
}

.latestsales_column {}

.clickable_pointer {
    cursor: pointer !important;
}

.user_select_table {
    height: 250px !important;
}

.removeall-disabled {
    opacity: 0;
}

.no_prizes_column {
    padding-top: 20px;
    padding-bottom: 20px;
    border-radius: var(--borderroundness);
    background-color: #00bb7662;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpolygon fill='%23000' fill-opacity='.1' points='120 0 120 60 90 30 60 0 0 0 0 0 60 60 0 120 60 120 90 90 120 60 120 0'/%3E%3C/svg%3E");
    background-size: contain;
}

.prize_type_tabs {
    height: 400px;
    overflow-y: scroll;
    max-height: 400px;
}

.prize_choose_select {
    cursor: pointer;
    background-color: var(--secCol);
}

.prize_choose_select:hover {
    background-color: #0576c9;
}

.prize_choose_select:active {
    background-color: #242A40;
}

.dropdown_scroll {
    max-height: 250px;
    overflow: scroll;}

.competition_standing_rank {
    border-radius: var(--borderroundness);
    position: absolute;
    bottom: 0%;
    right: 0%;
    }

.standing_first {
    color: var(--goldColor) !important;
}

.standing_second {
    color: var(--silverColor) !important;
}

.standing_third {
    color: var(--bronzeColor) !important;
}

.rank_first {
    background-color: var(--goldColor) !important;
}

.rank_second {
    background-color: var(--silverColor) !important;
}

.rank_third {
    background-color: var(--bronzeColor) !important;
}

.competition_rank_participant {
    border-radius: var(--borderroundness);
    padding: 10px;
    transition: all .1s ease-in-out;
    }

.competition_rank_participant:hover {
    transform: scale(1.1);
}

.competition_standings_full {
    width: 140%;}

.progress_bar_test {
    position: absolute;
    border-radius: var(--borderroundness);
    bottom: 0px;}

.seeprogress:hover {
    transform: scale(1.05);
    cursor: pointer;
}

.stickyCol {
    position: -webkit-sticky;
    position: sticky;
    top: 80px;
}

.disabledarea {
    opacity: 0.6;
    pointer-events: none;
}

.bubbles_bg {
background-color: #034372;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='100%25' gradientTransform='rotate(173,840,471)'%3E%3Cstop offset='0' stop-color='%23034372'/%3E%3Cstop offset='1' stop-color='%230576C9'/%3E%3C/linearGradient%3E%3Cpattern patternUnits='userSpaceOnUse' id='b' width='532' height='443.3' x='0' y='0' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.05'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect x='0' y='0' fill='url(%23b)' width='100%25' height='100%25'/%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover;
}

.diamond_bg {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='540' height='450' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='.1'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/svg%3E");
    background-position: center;
    background-size: full;
}

.wave_bg {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='400' height='75' preserveAspectRatio='none' viewBox='0 0 400 75'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1028%26quot%3b)' fill='none'%3e%3cpath d='M 0%2c58 C 16%2c47.6 48%2c6.8 80%2c6 C 112%2c5.2 128%2c51.8 160%2c54 C 192%2c56.2 208%2c13.4 240%2c17 C 272%2c20.6 288%2c69.6 320%2c72 C 352%2c74.4 384%2c37.6 400%2c29L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 0.4)'%3e%3c/path%3e%3cpath d='M 0%2c18 C 13.4%2c27.4 40.2%2c65.8 67%2c65 C 93.8%2c64.2 107.2%2c15.4 134%2c14 C 160.8%2c12.6 174.2%2c54.6 201%2c58 C 227.8%2c61.4 241.2%2c33.8 268%2c31 C 294.8%2c28.2 308.6%2c49.4 335%2c44 C 361.4%2c38.6 387%2c12 400%2c4L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 1)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1028'%3e%3crect width='400' height='75' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
    background-position: top;
    background-size: cover;
}
.wave_bg2 {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='400' height='75' preserveAspectRatio='none' viewBox='0 0 400 75'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1018%26quot%3b)' fill='none'%3e%3cpath d='M 0%2c49 C 16%2c46.4 48%2c37.8 80%2c36 C 112%2c34.2 128%2c46.6 160%2c40 C 192%2c33.4 208%2c-2 240%2c3 C 272%2c8 288%2c62 320%2c65 C 352%2c68 384%2c27.4 400%2c18L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 0.4)'%3e%3c/path%3e%3cpath d='M 0%2c6 C 20%2c18.8 60%2c69.8 100%2c70 C 140%2c70.2 160%2c12.2 200%2c7 C 240%2c1.8 260%2c43.6 300%2c44 C 340%2c44.4 380%2c16 400%2c9L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 1)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1018'%3e%3crect width='400' height='75' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
    background-position: top;
    background-size: cover;
}

.wave_bg3 {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='400' height='75' preserveAspectRatio='none' viewBox='0 0 400 75'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1026%26quot%3b)' fill='none'%3e%3cpath d='M 0%2c71 C 13.4%2c64 40.2%2c36.6 67%2c36 C 93.8%2c35.4 107.2%2c71 134%2c68 C 160.8%2c65 174.2%2c26.2 201%2c21 C 227.8%2c15.8 241.2%2c39.4 268%2c42 C 294.8%2c44.6 308.6%2c33.4 335%2c34 C 361.4%2c34.6 387%2c42.8 400%2c45L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 0.4)'%3e%3c/path%3e%3cpath d='M 0%2c11 C 16%2c23.8 48%2c72.8 80%2c75 C 112%2c77.2 128%2c23 160%2c22 C 192%2c21 208%2c68.8 240%2c70 C 272%2c71.2 288%2c30.4 320%2c28 C 352%2c25.6 384%2c52 400%2c58L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 1)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1026'%3e%3crect width='400' height='75' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
    background-position: top;
    background-size: cover;
}

.wave_bg4 {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='400' height='75' preserveAspectRatio='none' viewBox='0 0 400 75'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1016%26quot%3b)' fill='none'%3e%3cpath d='M 0%2c23 C 13.4%2c33.4 40.2%2c78.4 67%2c75 C 93.8%2c71.6 107.2%2c10.8 134%2c6 C 160.8%2c1.2 174.2%2c45 201%2c51 C 227.8%2c57 241.2%2c37 268%2c36 C 294.8%2c35 308.6%2c47.8 335%2c46 C 361.4%2c44.2 387%2c30.8 400%2c27L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 0.4)'%3e%3c/path%3e%3cpath d='M 0%2c30 C 26.8%2c37.2 80.4%2c70.8 134%2c66 C 187.6%2c61.2 214.8%2c7.4 268%2c6 C 321.2%2c4.6 373.6%2c48.4 400%2c59L400 75L0 75z' fill='rgba(39%2c 45%2c 63%2c 1)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1016'%3e%3crect width='400' height='75' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
    background-position: top;
    background-size: cover;
}

/* Circular progress
----------------------
*/

@keyframes growProgressBar {
  0%, 33% { --pgPercentage: 0; }
}

@property --pgPercentage {
  syntax: '<number>';
  inherits: false;
  initial-value: 0;
}

div[role="circularprogressbar"] {
  --size: 8rem;
  --fg: #0576c9;
  --bg: #dedede;
  display: grid;
  place-items: center;
  font-size: calc(var(--size) / 5);
  color: white;
}

div[role="circularprogressbar"]::before {
  content:"";
  grid-area:1/1;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  animation: growProgressBar 1s 1 forwards;
  --pgPercentage: var(--value);
  -webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 12px),#000 0);
  background: conic-gradient(var(--fg) calc(var(--pgPercentage) * 1%), var(--bg) 0);
}

div[role="circularprogressbar"]::after {
  counter-reset: percentage var(--value);
  content: counter(percentage) '%';
  grid-area:1/1;
}


/* Circular progress end
----------------------
*/


.fullheightrow {
    height: 100vh;
}

.fullheightrow_minusheader {
    height: calc(100vh - 103px);
}


.leaderboard_page_height {
    height: 100vh;
    }


.right_corner_image {
    position: absolute;
    bottom: 40px;
    right: 40px;}


.leaderboard_screen_rest {
    overflow: scroll;
    max-height: 400px;
}


.leaderboard_screen_transparent_back {
    background-color: rgba(29, 35, 51, 0.7);
}

/** youtube background **/

.video-container{
  width: 100vw;
  height: 100vh;
}
    
#celebrationiframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 100vh;
  transform: translate(-50%, -50%);
}

@media (min-aspect-ratio: 16/9) {
  .video-container iframe {
    /* height = 100 * (9 / 16) = 56.25 */
    height: 56.25vw;
  }
}
    
@media (max-aspect-ratio: 16/9) {
  .video-container iframe {
    /* width = 100 / (9 / 16) = 177.777777 */
    width: 177.78vh;
  }
}

/** 

END
youtube background 

**/

.announcement_body {
    position: absolute;
    top: 0%;
    background: none !important;
}

.newsale_notification {
    position: absolute;
    right: 1px;
    bottom: 1px;
}

.edit_button {
    position: absolute;
    right: 0px;
    bottom: 0px;
}

.post_comments_table {
    max-height: 250px;
    overflow-y: scroll;

}

.battle_vs {

    width: 100%;
    background-color: rgba(22, 27, 40, 0.3);
}

.tagify {

}

.tag_dark {
    background-color: var(--darkCol) !important;
}

.tagify__input {
    min-width: 160px !important;
}

.custom_tagify {
    width: 100%;
    border-radius: var(--borderroundness);
}

.tagify__dropdown {
    z-index: 99999 !important;
    width: 250px !important;
}

.tagify__dropdown__wrapper {
    border-radius: var(--borderroundness);
    background: var(--darkCol) !important;
    border-color: var(--secCol) !important;
    max-height: 300px !important;
    overflow-y: scroll !important;
}

.chat_menu {

    overflow: scroll;

    max-height: 100%;

}
.tagify__tag img,
.tagify__dropdown img {
    border-radius: var(--borderroundness);
    width: 20px;
    height: 20px;
}

.commissions-table {

}
.commissions-table:hover {

    background-color: var(--bgCol);
}
.landing_first_section {

    height: 100vh;
}
.table_height_scroll {

    max-height: 250px;
}
.organisation_selection {

    height: calc(100vh - 240px);
    min-height: 400px;

    }
.departments_select {
    background-color: var(--darkCol);
}
.team_unselected {

    }
.select_icon {

    }
.select_icon:hover {

    background-color: #0d8760;
}
.bottom.sticky {

    position: fixed;
    bottom: 1.5em;
    z-index: 100;
    right: 0px;
    margin-right: 1.5em;
    background-blend-mode: darken;
    
    }

.wheelBg {
    background-color: #02375E;
    background-image: url(/assets/images/wheelstage.svg);
    background-size: cover;
    background-position: center;
}

.wheel_close_button {

    position: absolute;
    color: #626A82 !important;
    background-color: #626A82;
    right: 20px;
    z-index: 999999999;
}

.screen_wheel_modal {
    margin: 0;
    padding: 0;
    overflow: hidden !important;
}

.sparkline {
    overflow: hidden;
}

.apexcharts-tooltip {
    background: var(--darkCol) !important;
    color: #f2f2f2 !important;
    box-shadow: none !important;
  }

.apexcharts-tooltip-title {
    background: var(--bgCol) !important;
    color: #f2f2f2 !important;
}

.apexcharts-legend-text {
    color: #8E95AB !important;
}