* {
  box-sizing: border-box;
}


[w100] {
    width:100%;
}

[line] {
    border-bottom:solid 1px var(--border-color);
    margin:15px 0;
}
[line][sm] {
    border-bottom:solid 1px var(--border-color);
    margin:10px 0;
}
[line][xs] {
    border-bottom:solid 1px var(--border-color);
    margin:5px 0;
}
[invert] {
    filter: invert(1) brightness(2);
}

[user-img] {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}

[user][sm] [user-img] {
    width: 25px;
    height: 25px;
}

[user][xs] [user-img] {
    width: 20px;
    height: 20px;
}

    [user-img] img {
        vertical-align: middle;
        object-fit: cover;
        object-position: center;
    }

    [user-img] div{
        background-color:red;
        position: absolute;
        width:100%;
        height: 100%;
        color:#fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size:18px;
        font-weight: 600;
    }

    [user][sm] [user-img] div {
        font-size:14px;
    }

    [user][xs] [user-img] div {
        font-size:12px;
    }



[text-main] {
    color:var(--main-color);
}



[b-b] {
    border-bottom:solid 1px var(--border-color);
}



[show-900] {
    display:none;
}
@media (max-width: 900px) {
    [show-900] {
        display:block;
    }
}




/* Column system
__________________________________________________________*/


.row,[row] {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	width:100%;
}

.row.justify-content {
	justify-content: space-between;
}


	.row.full {
		justify-content: space-between;
	}



.row.fluid {
	display: flex;
	align-items: flex-start;
    flex-wrap: nowrap;
	width:100%;
    gap:100px;
}

.row-fluid > div {

}


.row.gap-50 {
    gap:50px;
}

.row .col-12,
[row] [col-12]{
	flex: 0 0 auto;
	width:100%;
}

.row .col-11,
[row] [col-11] {
	flex: 0 0 auto;
	width: 91.6666666667%;
}
	
	.row.full .col-11 {
		flex: 0 0 auto;
		width: calc(91.6666666667% - 0.5em);
	}

.row .col-10,
[row] [col-10] {
	flex: 0 0 auto;
	width: 83.3333333333%;
}

	.row.full .col-10 {
		flex: 0 0 auto;
		width: calc(83.3333333333% - 0.5em);
	}

.row .col-9,
[row] [col-9] {
	flex: 0 0 auto;
	width: 75%;
}

	.row.full .col-9 {
		flex: 0 0 auto;
		width: calc(75% - 0.5em);
	}

.row .col-8,
[row] [col-8]{
	flex: 0 0 auto;
	width: 66.6666666667%;
}

	.row.full .col-8 {
		flex: 0 0 auto;
		width: calc(66.6666666667% - 0.5em);
	}

.row .col-7,
[row] [col-7] {
	flex: 0 0 auto;
	width: 58.3333333333%;
}

	.row.full .col-7 {
		flex: 0 0 auto;
		width: calc(58.3333333333% - 0.5em);
	}

.row .col-6,
[row] [col-6] {
	flex: 0 0 auto;
	width: 50%;
}

	.row.full .col-6 {
		flex: 0 0 auto;
		width: calc(50% - 0.5em);
	}

    .row.gap-50 .col-6,
    [row][gap-50] [col-6] {
        width: calc(50% - 50px);
    }

.row .col-5-5 {
	flex: 0 0 auto;
	width: 45.83333333335%;
}

	.row.full .col-5-5 {
		flex: 0 0 auto;
		width: calc(45.83333333335% - 0.5em);
	}

    

.row .col-5,
[row] [col-5] {
	flex: 0 0 auto;
	width: 41.6666666667%;
}

	.row.full .col-5 {
		flex: 0 0 auto;
		width: calc(41.6666666667% - 0.5em);
	}

    .row.gap-50 .col-5,
    [row][gap-50] [col-5] {
        width: calc(41.6666666667% - 50px);
    }

.row .col-4,
[row] [col-4] {
	flex: 0 0 auto;
	width: 33.3333333333%;
}

	.row.full .col-4 {
		flex: 0 0 auto;
		width: calc(33.3333333333% - 0.5em);
	}

    .row.gap-50 .col-4,
    [row][gap-50] [col-4] {
        width: calc(33.3333333333% - 50px);
    }

.row .col-3,
[row] [col-3] {
	flex: 0 0 auto;
	width: 25%;
}

	.row.full .col-3 {
		flex: 0 0 auto;
		width: calc(25% - 0.5em);
	}

    .row.gap-50 .col-3,
    [row][gap-50] [col-3] {
        width: calc(25% - 50px);
    }


.row .col-2,
[row] [col-2] {
	flex: 0 0 auto;
	width: 16.6666666667%;
}

	.row.full .col-2 {
		flex: 0 0 auto;
		width: calc(16.6666666667% - 0.5em);
	}

    .row.gap-50 .col-2,
    [row][gap-50] [col-2] {
        width: calc(16.6666666667% - 50px);
    }

.row .col-1,
[row] [col-1] {
	flex: 0 0 auto;
	width: 8.3333333333%;
}

	.row.full .col-1 {
		flex: 0 0 auto;
		width: calc(8.3333333333% - 0.5em);
	}


/* LG */
@media (max-width: 1600px) { 
	.row .col-lg-12 {		width:100%!important;	}
	.row .col-lg-11 {		width: 91.6666666667%!important;	}
	.row .col-lg-10 {		width: 83.3333333333%!important;	}
	.row .col-lg-9 {		width: 75%!important;	}
	.row .col-lg-8 {		width: 66.6666666667%!important;	}
	.row .col-lg-7 {		width: 58.3333333333%!important;	}
	.row .col-lg-6 {		width: 50%!important;	}
	.row .col-lg-5-5 {		width: 45.83333333335%!important;	}
	.row .col-lg-5 {		width: 41.6666666667%!important;	}
	.row .col-lg-4 {		width: 33.3333333333%!important;	}
	.row .col-lg-3 {		width: 25%!important;	}
	.row .col-lg-2 {		width: 16.6666666667%!important;	}
	.row .col-lg-1 {		width: 8.3333333333%!important;	}
    .order-lg-1    {        order:1; }
    .order-lg-2    {        order:2; }
    .order-lg-3    {        order:3; }
}

/* MD */
@media (max-width: 1200px) { 
	.row .col-md-12 {		width:100%!important;	}
	.row .col-md-11 {		width: 91.6666666667%!important;	}
	.row .col-md-10 {		width: 83.3333333333%!important;	}
	.row .col-md-9 {		width: 75%!important;	}
	.row .col-md-8 {		width: 66.6666666667%!important;	}
	.row .col-md-7 {		width: 58.3333333333%!important;	}
	.row .col-md-6 {		width: 50%!important;	}
	.row .col-md-5-5 {		width: 45.83333333335%!important;	}
	.row .col-md-5 {		width: 41.6666666667%!important;	}
	.row .col-md-4 {		width: 33.3333333333%!important;	}
	.row .col-md-3 {		width: 25%!important;	}
	.row .col-md-2 {		width: 16.6666666667%!important;	}
	.row .col-md-1 {		width: 8.3333333333%!important;	}
    .order-md-1    {        order:1; }
    .order-md-2    {        order:2; }
    .order-md-3    {        order:3; }
}

/* SM */
@media (max-width: 992px) { 
	.row .col-sm-12 {		width:100%!important;	}
	.row .col-sm-11 {		width: 91.6666666667%!important;	}
	.row .col-sm-10 {		width: 83.3333333333%!important;	}
	.row .col-sm-9 {		width: 75%!important;	}
	.row .col-sm-8 {		width: 66.6666666667%!important;	}
	.row .col-sm-7 {		width: 58.3333333333%!important;	}
	.row .col-sm-6 {		width: 50%!important;	}
	.row .col-sm-5-5 {		width: 45.83333333335%!important;	}
	.row .col-sm-5 {		width: 41.6666666667%!important;	}
	.row .col-sm-4 {		width: 33.3333333333%!important;	}
	.row .col-sm-3 {		width: 25%!important;	}
	.row .col-sm-2 {		width: 16.6666666667%!important;	}
	.row .col-sm-1 {		width: 8.3333333333%!important;	}
    .order-sm-1    {        order:1; }
    .order-sm-2    {        order:2; }
    .order-sm-3    {        order:3; }
}

/* XS */
@media (max-width: 768px) {
	.row .col-xs-12 {		width:100%!important;	}
	.row .col-xs-11 {		width: 91.6666666667%!important;	}
	.row .col-xs-10 {		width: 83.3333333333%!important;	}
	.row .col-xs-9 {		width: 75%!important;	}
	.row .col-xs-8 {		width: 66.6666666667%!important;	}
	.row .col-xs-7 {		width: 58.3333333333%!important;	}
	.row .col-xs-6 {		width: 50%!important;	}
	.row .col-xs-5-5 {		width: 45.83333333335%!important;	}
	.row .col-xs-5 {		width: 41.6666666667%!important;	}
	.row .col-xs-4 {		width: 33.3333333333%!important;	}
	.row .col-xs-3 {		width: 25%!important;	}
	.row .col-xs-2 {		width: 16.6666666667%!important;	}
	.row .col-xs-1 {		width: 8.3333333333%!important;	}
    .order-xs-1    {        order:1; }
    .order-xs-2    {        order:2; }
    .order-xs-3    {        order:3; }
}


/* Breakpoint XS */
@media (max-width: 768px)
{
    .hidden-xs,.hidden-xs-down, .hidden-sm-down, .hidden-md-down, .hidden-lg-down, .hidden-xl-down, 
    .hidden-xs-up, 
    .hidden-unless-sm, .hidden-unless-md, .hidden-unless-lg, .hidden-unless-xl
    {
        display: none !important;
    }

}

/* Breakpoint SM */
@media (min-width: 769px) and (max-width: 1024px)
{
    .hidden-sm,.hidden-sm-down, .hidden-md-down, .hidden-lg-down, .hidden-xl-down, 
    .hidden-xs-up, .hidden-sm-up, 
    .hidden-unless-xs, .hidden-unless-md, .hidden-unless-lg, .hidden-unless-xl
    {
        display: none !important;
    } 
}

/* Breakpoint MD */
@media (min-width: 1025px) and (max-width: 1200px)
{


    .hidden-md,.hidden-md-down, .hidden-lg-down, .hidden-xl-down, 
    .hidden-xs-up, .hidden-sm-up, .hidden-md-up, 
    .hidden-unless-xs, .hidden-unless-sm, .hidden-unless-lg, .hidden-unless-xl,.hidden-md
    {
        display: none !important;
    }
    
	
}

/* Breakpoint LG */
@media (min-width: 1201px) and (max-width: 1600px)
{
    

    .hidden-lg,.hidden-lg-down, .hidden-xl-down, 
    .hidden-xs-up, .hidden-sm-up, .hidden-md-up, .hidden-lg-up, 
    .hidden-unless-xs, .hidden-unless-sm, .hidden-unless-md, .hidden-unless-xl
    {
        display: none !important;
    } 

    
    
}

/* Breakpoint XL */
@media (min-width: 1601px)
{

    .hidden-xl,.hidden-xl-down, 
    .hidden-xs-up, .hidden-sm-up, .hidden-md-up, .hidden-lg-up, .hidden-xl-up, 
    .hidden-unless-xs, .hidden-unless-sm, .hidden-unless-md, .hidden-unless-lg,.hidden-xl
    {
        display: none !important;
    } 

    
    
    
}




/* Margins
__________________________________________________________*/

[m-l] {
  margin-left: 15px!important;
}
[m-l-auto] {
	margin-left: auto!important;
}
[m-l-none] {
  margin-left: 0!important;
}
[m-l-xxxs] {
  margin-left: 1px!important;
}
[m-l-xxs] {
  margin-left: 3px!important;
}
[m-l-xs] {
  margin-left: 5px!important;
}
[m-l-sm] {
  margin-left: 10px!important;
}
[m-l-lg] {
  margin-left: 20px!important;
}
[m-l-xl] {
  margin-left: 30px!important;
}
[m-l-xxl] {
  margin-left: 40px!important;
}
[m-l-n] {
  margin-left: -15px!important;
}
[m-l-n-xxs] {
  margin-left: -1px!important;
}
[m-l-n-xs] {
  margin-left: -5px!important;
}
[m-l-n-sm] {
  margin-left: -10px!important;
}
[m-l-n-lg] {
  margin-left: -20px!important;
}
[m-t] {
  margin-top: 15px!important;
}
[m-t-none] {
  margin-top: 0!important;
}
[m-t-xxxs] {
	margin-top: 1px!important;
}
[m-t-xxs] {
  margin-top: 3px!important;
}
[m-t-xs] {
	margin-top: 5px!important;
}
[m-t-sm] {
  margin-top: 10px!important;
}
[m-t-lg] {
  margin-top: 20px!important;
}
[m-t-xl] {
  margin-top: 30px!important;
}
[m-t-xxl] {
  margin-top: 40px!important;
}
[m-t-xxxl] {
  margin-top: 60px!important;
}
[m-t-n] {
  margin-top: -15px !important;
}
[m-t-n-xxs] {
  margin-top: -1px!important;
}
[m-t-n-xs] {
  margin-top: -5px!important;
}
[m-t-n-sm] {
  margin-top: -10px!important;
}
[m-t-n-lg] {
  margin-top: -20px!important;
}
[m-t-n-xl] {
  margin-top: -30px!important;
}
[m-r] {
  margin-right: 15px!important;
}
[m-r-none] {
  margin-right: 0!important;
}
[m-r-xxxs] {
  margin-right: 1px!important;
}
[m-r-xxs] {
  margin-right: 3px!important;
}
[m-r-xs] {
  margin-right: 5px!important;
}
[m-r-sm] {
  margin-right: 10px!important;
}
[m-r-lg] {
  margin-right: 20px!important;
}
[m-r-xl] {
  margin-right: 30px!important;
}
[m-r-xxl] {
  margin-right: 40px!important;
}
[m-r-n] {
  margin-right: -15px!important;
}
[m-r-n-xxs] {
  margin-right: -1px!important;
}
[m-r-n-xs] {
  margin-right: -5px!important;
}
[m-r-n-sm] {
  margin-right: -10px!important;
}
[m-r-n-lg] {
  margin-right: -20px!important;
}
[m-b] {
  margin-bottom: 15px!important;
}
[m-b-none] {
  margin-bottom: 0!important;
}
[m-b-xxxs] {
  margin-bottom: 1px!important;
}
[m-b-xxs] {
  margin-bottom: 3px!important;
}
[m-b-xs] {
  margin-bottom: 5px!important;
}
[m-b-sm] {
  margin-bottom: 10px!important;
}
[m-b-lg] {
  margin-bottom: 20px!important;
}
[m-b-xl] {
  margin-bottom: 30px!important;
}
[m-b-xxl] {
  margin-bottom: 40px!important;
}
[m-b-xxxl] {
  margin-bottom: 60px!important;
}
[m-b-n] {
  margin-bottom: -15px!important;
}
[m-b-n-xxs] {
  margin-bottom: -1px!important;
}
[m-b-n-xs] {
  margin-bottom: -5px!important;
}
[m-b-n-sm] {
  margin-bottom: -10px!important;
}
[m-b-n-lg] {
  margin-bottom: -20px!important;
}

[m-none] {
    margin: 0!important;
}



/* Spacing
__________________________________________________________*/

.spacing-xxxxl, [spacing-xxxxl] {
	height:80px;
	overflow:auto;
	clear:both;	
}


.spacing-xxxl, [spacing-xxxl] {
	height:60px;
	overflow:auto;
	clear:both;	
}

.spacing-xxl, [spacing-xxl] {
	height:50px;
	overflow:auto;
	clear:both;	
}

.spacing-xl, [spacing-xl] {
	height:40px;
	overflow:auto;
	clear:both;	
}

.spacing-lg, [spacing-lg] {
	height:30px;
	overflow:auto;
	clear:both;	
}

.spacing, [spacing] {
	height:20px;
	overflow:auto;
	clear:both;	
}

.spacing-sm, [spacing-sm] {
	height:10px;
	overflow:auto;
	clear:both;	
}

.spacing-xs, [spacing-xs] {
	height:5px;
	overflow:auto;
	clear:both;	
}


/* Font weight
__________________________________________________________*/


[font-300] {
    font-weight: 300!important;
}
[font-400] {
    font-weight: 400!important;
}
[font-500] {
    font-weight: 500!important;
}
[font-600] {
    font-weight: 600!important;
}
[font-700] {
    font-weight: 700!important;
}
[font-800] {
    font-weight: 800!important;
}

/* Text align
__________________________________________________________*/

[text-center] {
    text-align: center;
}
[text-left] {
    text-align: left;
}
[text-right] {
    text-align: right;
}


/* Text sizing
__________________________________________________________*/

[text-xxxs] {
	font-size:0.6rem!important;
}

[text-xxs] {
	font-size:0.7rem!important;
}
[text-xs] {
	font-size:0.8rem!important;
}
[text-sm] {
	font-size:0.9rem!important;
}
[text-md] {
	font-size:1rem!important;
}
[text-lg] {
	font-size:1.1rem!important;
}
[text-xl] {
	font-size:1.2rem!important;
}
[text-xxl] {
	font-size:1.3rem!important;
}



/* Text Opacity
__________________________________________________________*/


[text-o-xxxs] {
  opacity:0.9;
}
[text-o-xxs] {
  opacity:0.8;
}
[text-o-xs] {
  opacity:0.7;
}
[text-o-sm] {
  opacity:0.6;
}
[text-o] {
  opacity:0.5;
}
[text-o-lg] {
  opacity:0.4;
}
[text-o-xl] {
  opacity:0.3;
}
[text-o-xxl] {
  opacity:0.2;
}
[text-o-xxxl] {
  opacity:0.1;
}
[text-o-xxxxl] {
  opacity:0.05;
}


/* Line height
__________________________________________________________*/


[line-height-0] {
    line-height: 0;
}
[line-height-1] {
    line-height: 1;
}
[line-height-1-1] {
    line-height: 1.1;
}
[line-height-1-2] {
    line-height: 1.2;
}
[line-height-1-3] {
    line-height: 1.3;
}
[line-height-1-4] {
    line-height: 1.4;
}
[line-height-1-5] {
    line-height: 1.5;
}
[line-height-1-6] {
    line-height: 1.6;
}
[line-height-1-7] {
    line-height: 1.7;
}
[line-height-1-8] {
    line-height: 1.8;
}
[line-height-1-9] {
    line-height: 1.9;
}
[line-height-2] {
    line-height: 2;
}


/* Toast
__________________________________________________________*/

.toast {
	background: #d6d8d9;
	border-radius: 3px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, .1);
	cursor: default;
	margin-bottom: 20px;
	/*opacity: 0;*/
	position: fixed;
	padding: 12px 20px;
	/*transition: opacity .5s ease-in-out, transform .5s ease-in-out;*/
	width: auto;
	will-change: opacity, transform;
	z-index: 999999999;
	font-size:0.9rem;
	will-change: transform;
	-moz-animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
    font-weight: 600;
    z-index:9999;
	
} 

.toast i {
	margin-right:5px;
}

.toast.center:not(.top):not(.bottom) {
	top:50%;
	left:50%;
	transform: translate3d(-50%,-50%,0);
	-webkit-animation: toastCenter 0.25s linear;
	animation: toastCenter 0.25s linear;
}



@-webkit-keyframes toastCenter {
	from {
		transform: translate3d(-50%,-50%,0) scale3d(2,2,2);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-50%,-50%,0) scale3d(1,1,1);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastCenter {
	from {
		transform: translate3d(-50%,-50%,0) scale3d(2,2,2);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-50%,-50%,0) scale3d(1,1,1);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}



/* TOP */
.toast.top {
	top:0;
	left:50%;
	right:auto;
	transform: translate3d(-50%,-100px,0);
	-webkit-animation: toastTop 0.25s linear;
	animation: toastTop 0.25s linear;
	
	-moz-animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


.toast.top.out {
	-webkit-animation: toastTopOut 0.25s linear;
	animation: toastTopOut 0.25s linear;
}

@-webkit-keyframes toastTop {
	from {
		transform: translate3d(-50%,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastTop {
	from {
		transform: translate3d(-50%,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}

@-webkit-keyframes toastTopOut {
	from {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);
	}
	to {
		transform: translate3d(-50%,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}
@keyframes toastTopOut {
	from {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
	to {
		transform: translate3d(-50%,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}






.toast.top.left {
	top:0;
	left:0;
	transform: translate3d(-10px,-100px,0);
	-webkit-animation: toastTopLeft 0.25s linear;
	animation: toastTopLeft 0.25s linear;
	
	-moz-animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


.toast.top.left.out {
	-webkit-animation: toastTopLeftOut 0.25s linear;
	animation: toastTopLeftOut 0.25s linear;
}

@-webkit-keyframes toastTopLeft {
	from {
		transform: translate3d(10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastTopLeft {
	from {
		transform: translate3d(10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}

@-webkit-keyframes toastTopLeftOut {
	from {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);
	}
	to {
		transform: translate3d(10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}
@keyframes toastTopLeftOut {
	from {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
	to {
		transform: translate3d(10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}




.toast.top.right {
	top:0;
	right:0;
	left: auto;
	transform: translate3d(-10px,-100px,0);
	-webkit-animation: toastTopRight 0.25s linear;
	animation: toastTopRight 0.25s linear;
	
	-moz-animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


.toast.top.right.out {
	-webkit-animation: toastTopRightOut 0.25s linear;
	animation: toastTopRightOut 0.25s linear;
}

@-webkit-keyframes toastTopRight {
	from {
		transform: translate3d(-10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastTopRight {
	from {
		transform: translate3d(-10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}

@-webkit-keyframes toastTopRightOut {
	from {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);
	}
	to {
		transform: translate3d(-10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}
@keyframes toastTopRightOut {
	from {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
	to {
		transform: translate3d(-10px,-100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}







/* BOTTOM */
.toast.bottom {
	bottom:0;
	left:50%;
	right:auto;
	transform: translate3d(-50%,100px,0);
	-webkit-animation: toastBottom 0.25s linear;
	animation: toastBottom 0.25s linear;
	
	-moz-animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


.toast.bottom.out {
	-webkit-animation: toastBottomOut 0.25s linear;
	animation: toastBottomOut 0.25s linear;
}

@-webkit-keyframes toastBottom {
	from {
		transform: translate3d(-50%,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastBottom {
	from {
		transform: translate3d(-50%,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}

@-webkit-keyframes toastBottomOut {
	from {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);
	}
	to {
		transform: translate3d(-50%,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}
@keyframes toastBottomOut {
	from {
		transform: translate3d(-50%,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
	to {
		transform: translate3d(-50%,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}




















.toast.bottom.left {
	bottom:0;
	left:0;
	transform: translate3d(-10px,100px,0);
	-webkit-animation: toastBottomLeft 0.25s linear;
	animation: toastBottomLeft 0.25s linear;
	
	-moz-animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


.toast.bottom.left.out {
	-webkit-animation: toastBottomLeftOut 0.25s linear;
	animation: toastBottomLeftOut 0.25s linear;
}

@-webkit-keyframes toastBottomLeft {
	from {
		transform: translate3d(10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastBottomLeft {
	from {
		transform: translate3d(10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}

@-webkit-keyframes toastBottomLeftOut {
	from {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);
	}
	to {
		transform: translate3d(10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}
@keyframes toastBottomLeftOut {
	from {
		transform: translate3d(10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
	to {
		transform: translate3d(10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}








.toast.bottom.right {
	bottom:0;
	right:0;
	left: auto;
	transform: translate3d(-10px,100px,0);
	-webkit-animation: toastBottomRight 0.25s linear;
	animation: toastBottomRight 0.25s linear;
	
	-moz-animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


.toast.bottom.right.out {
	-webkit-animation: toastBottomRightOut 0.25s linear;
	animation: toastBottomRightOut 0.25s linear;
}

@-webkit-keyframes toastBottomRight {
	from {
		transform: translate3d(-10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastBottomRight {
	from {
		transform: translate3d(-10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}

@-webkit-keyframes toastBottomRightOut {
	from {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);
	}
	to {
		transform: translate3d(-10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}
@keyframes toastBottomRightOut {
	from {
		transform: translate3d(-10px,10px,0);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
	to {
		transform: translate3d(-10px,100px,0);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
}



.toast.success {
	background: var(--color-green);
	color:#fff;
}

.toast.warning {
	background: var(--color-yellow);
	color:#fff;
}

.toast.info {
	background: var(--color-blue);
	color:#fff;
}

.toast.error {
	background: var(--color-red);
	color:#fff;
}

.toast.show {
  opacity: 1;
  transition: opacity .5s ease-in-out, transform .5s ease-in-out;
}



.toast .close {
	cursor: pointer;
	font-size: 24px;
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translate3d(0,-50%,0);
	width: 16px;
	line-height: 1;
}



#toast-mask {
	position: fixed;
	top:0;
	left: 0;
	bottom:0;
	right:0;
	background-color:rgba(0,0,0,0.6);
	z-index:99999999;
	transition: opacity 0.5s ease-out;
	transform: translate3d(0,0,0);
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}




/* Breakpoint MD Down */
@media (max-width: 991px)
{
	
	.toast {
		width:93%!important;
		left:0!important;
		right:0!important;
		transform: translate3d(3%,0,0)!important;
		-webkit-animation: toastResponsive 0.35s linear!important;
		animation: toastResponsive 0.35s linear!important;
	}
	
	.toast.bottom {
		bottom:0!important;
	}
	.toast.top {
		top:auto!important;
		bottom:0!important;
	}
	
}


@-webkit-keyframes toastResponsive {
	from {
		transform: translate3d(3%,0,0) scale3d(2,2,2);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(3%,0,0) scale3d(1,1,1);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}
@keyframes toastResponsive {
	from {
		transform: translate3d(3%,0,0) scale3d(2,2,2);
		opacity:0;
		-webkit-filter: blur(5px);
		filter: blur(5px);	
	}
	to {
		transform: translate3d(3%,0,0) scale3d(1,1,1);
		opacity:1;
		-webkit-filter: blur(0);
		filter: blur(0);	
	}
}



/* Label
__________________________________________________________*/


[label] {
    border-radius:10px;
    font-size:12px;
    font-weight: 500;
    padding:5px 10px;
    background-color:var(--bg-color-alt);
    color:var(--text-color-alt);
    position: relative;
    border:solid 1px transparent;
}

[label][sm] {
    font-size:11px;
}
[label][xs] {
    font-size:10px;
    padding: 2px 6px;
}
[label][xxs] {
    font-size:9px;
    padding: 1px 6px;
}

[label][default] {
    background-color:transparent;
    border-color:var(--border-color-light);
    color:var(--text-color-opacity-half);
}

[label][green] {
    background-color:#e3f8ea;
    color:#4fc075;
}
[label][red] {
    background-color:#EA4335;
    color:#fff;
}
[label][blue] {
    background-color:#eff5ff;;
    color:#3985ff;
}
[label][main] {
    background-color: var(--bg-color);
    color: var(--main-color);
    border-color:solid 1px var(--main-color)
}

[label][new] {
    background-color:#ffd401;
    color:#000;
    font-weight: 700;
    text-transform: uppercase;
}

[label][new][week] {
    background-color: var(--bg-color-active);
    color: var(--main-color);
}



[label] [label-icon] {
    position: absolute;
    top:0;
    right:0;
    border-left:solid 1px #000;
    height: 100%;
    width:20px;
}

[label] [label-icon] i {
    position: absolute;
    top:50%;
    right:0;
    padding:0 5px;
    transform: translateY(-50%);
}




/* Filter
__________________________________________________________*/


[filter] {
    border-radius:10px;
    font-size:12px;
    font-weight: 500;
    background-color:var(--bg-color-alt);
    color:rgba(0,0,0.8);
    position: relative;
    border:solid 1px rgba(0,0,0,0.1);
    margin-right:5px;
    margin-bottom:5px;
    overflow: hidden;
    display:inline-flex;
    align-items: center;
    gap:5px;
    line-height: 1;
    box-shadow: 0 0 5px 2px rgba(0,0,0,0.05);
}

[filter] > * {
    padding:6px 8px;
}
[filter][green] {
    background-color:#e3f8ea;
    color:#4fc075;
}
[filter][blue] {
    background-color:#eff5ff;;
    color:#3985ff;
}
[filter][main] {
    background-color:#eceaff;
    color:#5b4be7;
}
[filter][white] {
    background-color:#fff;
    color:var(--text-color);
}

[filter]:hover {
    cursor:pointer;
}

[filter]  i {
    padding-right:0;   
}


[filter]  i[filter-action] {
    position: relative;
    font-size:10px;
    border-left:solid 1px rgba(0,0,0,0.1);
    padding-right:8px;
}

[filter] i[filter-action][hover]:hover  {
    background-color:rgba(0,0,0,0.05);
}



/* Images
__________________________________________________________*/

img {
    max-width:100%;
}

.img-fit {
	object-fit: cover;
	object-position: center;
}

.img-fit-left {
	object-fit: cover;
	object-position: left;
}

.img-fit-full {
	object-fit: cover;
	object-position: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.img-circle {
	object-fit: cover;
	object-position: center;
	border-radius:50%;
	display:inline-block;
	vertical-align: middle;
}



img.img-xxxxs {
	width:15px!important;
	height: 15px!important;
}

img.img-xxxs {
	width:20px!important;
	height: 20px!important;
}

img.img-xxs {
	width:25px!important;
	height: 25px!important;
}

img.img-xs {
	width:30px!important;
	height: 30px!important;
}

img.img-sm {
	width:40px!important;
	height: 40px!important;
}

img.img-md {
	width:50px!important;
	height: 50px!important;
}

img.img-lg {
	width:60px!important;
	height: 60px!important;
}

img.img-xl {
	width:80px!important;
	height: 80px!important;
}

img.img-xxl {
	width:100px!important;
	height: 100px!important;
}

img.img-xxxl {
	width:120px!important;
	height: 120px!important;
}


img.img-hover {
    opacity:0.5;
}

img.img-hover:hover {
    opacity:1;
    cursor:pointer;
}



.imgs-overlap {
    display:flex;
    align-items: center;
}

.imgs-overlap > * {
    margin-left:-8%;
    border:solid 3px var(--bg-color);
}


/* Ratings
__________________________________________________________*/

.rating {
	position: relative;
	line-height: 1;
	display:inline-block;
    --rating-empty-color:rgba(0,0,0,0.15);
    height: 14px;
}

body.dark-mode .rating {
    --rating-empty-color:rgba(255,255,255,0.15);
}

.rating:after,
.rating:before {
    content:"";
    width:14px;
    height:14px;
    background-repeat: repeat-x;
    background-size:14px 14px;
    display:inline-block;
}



.rating.lg:after,
.rating.lg:before {
	font-size:13px;
}

.rating.xl:after,
.rating.xl:before {
	font-size:15px;
}

.rating.xxl:after,
.rating.xxl:before {
	font-size:17px;
}

.rating.mono:after,
.rating.mono:before {
	color: var(--color-text);
}

.rating.sm:after,
.rating.sm:before {
	font-size:10px;
}

.rating.xs:after,
.rating.xs:before {
	font-size:9px;
}

.rating.xxs:after,
.rating.xxs:before {
	font-size:8px;
}


/* 0
__________________________________________________________*/

.rating.stars-0:before {
	display:none;
}
.rating.stars-0:after {	
    width:70px;
    background-image: url("../img/icons/star-empty.svg");
}



/* 1
__________________________________________________________*/

.rating.stars-1:before {
    background-image: url("../img/icons/star.svg");
    width:14px;
}
.rating.stars-1:after {
	background-image: url("../img/icons/star-empty.svg");
    width:56px;
}

.rating.stars-1-half:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star-half.svg");
    background-size: 14px 14px, 14px 14px;
    background-position: center left, center right;
    background-repeat: no-repeat, no-repeat;
    width:28px;
}
.rating.stars-1-half:after {
	background-image: url("../img/icons/star-empty.svg");
    width:42px;
}

.rating.stars-half:before {
    background-image: url("../img/icons/star-half.svg");
    width:14px;
}
.rating.stars-half:after {
	background-image: url("../img/icons/star-empty.svg");
    width:56px;
}


/* 2
__________________________________________________________*/



.rating.stars-2:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star.svg");
    background-size: 14px 14px, 14px 14px;
    background-position: center left, center right;
    background-repeat: no-repeat, no-repeat;
    width:28px;
}

.rating.stars-2:after {
    background-image: url("../img/icons/star-empty.svg");
    width:42px;
}

.rating.stars-2-half:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star-half.svg");
    background-size: 14px 14px;
    background-position: 0 0, 14px 0, 28px 0, 42px 0;
    background-repeat: no-repeat, no-repeat;
    
    width:42px;
}

.rating.stars-2-half:after {
    background-image: url("../img/icons/star-empty.svg");
    width:28px;
}
/* 3
__________________________________________________________*/

.rating.stars-3:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg");
    background-position: 0 0, 14px 0, 28px 0, 42px 0;
    background-repeat: no-repeat, no-repeat, no-repeat;
    width:42px;
    
}

.rating.stars-3:after {
    background-image: url("../img/icons/star-empty.svg");
    width:28px;
}

.rating.stars-3-half:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star-half.svg");
    background-size: 14px 14px;
    background-position: 0 0, 14px 0, 28px 0, 42px 0, 56px 0;
    background-repeat: no-repeat, no-repeat;
    height: 14px;
    width:56px;
}

.rating.stars-3-half:after {
    background-image: url("../img/icons/star-empty.svg");
    width:14px;
}
/* 4
__________________________________________________________*/

.rating.stars-4:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg");
    background-position: 0 0, 14px 0, 28px 0, 42px 0, 56px 0;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    width:56px;
}

.rating.stars-4:after {
    background-image: url("../img/icons/star-empty.svg");
    width:14px;
}

.rating.stars-4-half:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star-half.svg");
    background-size: 14px 14px;
    background-position: 0 0, 14px 0, 28px 0, 42px 0, 56px 0, 70px 0;
    background-repeat: no-repeat, no-repeat;
    
    width:70px;
}

.rating.stars-4-half:after {
    display:none;
}
/* 5
__________________________________________________________*/
.rating.stars-5:before {
    background-image: url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg"), url("../img/icons/star.svg");
    background-size: 14px 14px;
    background-position: 0 0, 14px 0, 28px 0, 42px 0, 56px 0, 70px 0;
    background-repeat: no-repeat, no-repeat;
    width:70px;
}
.rating.stars-5:after {
    display:none;
}





/* Rating select
__________________________________________________________*/

[rating-select] {
    font-size:30px;
    text-align: center;
    color:#fbc332;
    display:flex;
    justify-content:center;
    align-items: center;
    gap:0;
}

[rating-select] li {
    padding:5px;
}



/* Width Fixed
__________________________________________________________*/

.fixed-w10	 	{	width:10px!important;}
.fixed-w15	 	{	width:15px!important;}
.fixed-w16	 	{	width:16px!important;}
.fixed-w20	 	{	width:20px!important;}
.fixed-w25	 	{	width:25px!important;}
.fixed-w30	 	{	width:30px!important;}
.fixed-w35	 	{	width:35px!important;}
.fixed-w40	 	{	width:40px!important;}
.fixed-w45	 	{	width:45px!important;}
.fixed-w50	 	{	width:50px!important;}
.fixed-w55	 	{	width:55px!important;}
.fixed-w60	 	{	width:60px!important;}
.fixed-w65	 	{	width:65px!important;}
.fixed-w70	 	{	width:70px!important;}
.fixed-w75	 	{	width:75px!important;}
.fixed-w80	 	{	width:80px!important;}
.fixed-w85	 	{	width:85px!important;}
.fixed-w90	 	{	width:90px!important;}
.fixed-w95	 	{	width:95px!important;}
.fixed-w100 	{	width:100px!important;}
.fixed-w105 	{	width:105px!important;}
.fixed-w110 	{	width:110px!important;}
.fixed-w115 	{	width:115px!important;}
.fixed-w120 	{	width:120px!important;}
.fixed-w125 	{	width:125px!important;}
.fixed-w130 	{	width:130px!important;}
.fixed-w135 	{	width:135px!important;}
.fixed-w140 	{	width:140px!important;}
.fixed-w145 	{	width:145px!important;}
.fixed-w150 	{	width:150px!important;}
.fixed-w160 	{	width:160px!important;}
.fixed-w170 	{	width:170px!important;}
.fixed-w180 	{	width:180px!important;}
.fixed-w190 	{	width:190px!important;}
.fixed-w200 	{	width:200px!important;}
.fixed-w210 	{	width:210px!important;}
.fixed-w220 	{	width:220px!important;}
.fixed-w230 	{	width:230px!important;}
.fixed-w240 	{	width:240px!important;}
.fixed-w250 	{	width:250px!important;}
.fixed-w260 	{	width:260px!important;}
.fixed-w270 	{	width:270px!important;}
.fixed-w280 	{	width:280px!important;}
.fixed-w290 	{	width:290px!important;}
.fixed-w300 	{	width:300px!important;}



/* Height Fixed
__________________________________________________________*/

.fixed-h10	 		{	height:10px!important;}
.fixed-h11	 		{	height:11px!important;}
.fixed-h12	 		{	height:12px!important;}
.fixed-h13	 		{	height:13px!important;}
.fixed-h14	 		{	height:14px!important;}
.fixed-h15	 		{	height:15px!important;}
.fixed-h16	 		{	height:16px!important;}
.fixed-h17	 		{	height:17px!important;}
.fixed-h18	 		{	height:18px!important;}
.fixed-h19	 		{	height:19px!important;}
.fixed-h20	 		{	height:20px!important;}
.fixed-h25	 		{	height:25px!important;}
.fixed-h30	 		{	height:30px!important;}
.fixed-h40	 		{	height:40px!important;}
.fixed-h50	 		{	height:50px!important;}
.fixed-h60	 		{	height:60px!important;}
.fixed-h70	 		{	height:70px!important;}
.fixed-h80	 		{	height:80px!important;}
.fixed-h90	 		{	height:90px!important;}
.fixed-h100 		{	height:100px!important;}
.fixed-h110 		{	height:110px!important;}
.fixed-h120 		{	height:120px!important;}
.fixed-h130 		{	height:130px!important;}
.fixed-h140 		{	height:140px!important;}
.fixed-h150 		{	height:150px!important;}


/* LG */
@media (max-width: 1600px) { 
	.fixed-h10-lg	 	{	height:10px!important;}
	.fixed-h11-lg	 	{	height:11px!important;}
	.fixed-h12-lg	 	{	height:12px!important;}
	.fixed-h13-lg	 	{	height:13px!important;}
	.fixed-h14-lg	 	{	height:14px!important;}
	.fixed-h15-lg	 	{	height:15px!important;}
	.fixed-h16-lg	 	{	height:16px!important;}
	.fixed-h17-lg	 	{	height:17px!important;}
	.fixed-h18-lg	 	{	height:18px!important;}
	.fixed-h19-lg	 	{	height:19px!important;}
	.fixed-h20-lg	 	{	height:20px!important;}
	.fixed-h25-lg	 	{	height:25px!important;}
	.fixed-h30-lg	 	{	height:30px!important;}
	.fixed-h40-lg	 	{	height:40px!important;}
	.fixed-h50-lg	 	{	height:50px!important;}
	.fixed-h60-lg	 	{	height:60px!important;}
	.fixed-h70-lg	 	{	height:70px!important;}
	.fixed-h80-lg	 	{	height:80px!important;}
	.fixed-h90-lg	 	{	height:90px!important;}
	.fixed-h100-lg 		{	height:100px!important;}
	.fixed-h110-lg 		{	height:110px!important;}
	.fixed-h120-lg 		{	height:120px!important;}
	.fixed-h130-lg 		{	height:130px!important;}
	.fixed-h140-lg 		{	height:140px!important;}
	.fixed-h150-lg 		{	height:150px!important;}
}

/* MD */
@media (max-width: 1200px) { 
	.fixed-h10-md	 	{	height:10px!important;}
	.fixed-h11-md	 	{	height:11px!important;}
	.fixed-h12-md	 	{	height:12px!important;}
	.fixed-h13-md	 	{	height:13px!important;}
	.fixed-h14-md	 	{	height:14px!important;}
	.fixed-h15-md	 	{	height:15px!important;}
	.fixed-h16-md	 	{	height:16px!important;}
	.fixed-h17-md	 	{	height:17px!important;}
	.fixed-h18-md	 	{	height:18px!important;}
	.fixed-h19-md	 	{	height:19px!important;}
	.fixed-h20-md	 	{	height:20px!important;}
	.fixed-h25-md	 	{	height:25px!important;}
	.fixed-h30-md	 	{	height:30px!important;}
	.fixed-h40-md	 	{	height:40px!important;}
	.fixed-h50-md	 	{	height:50px!important;}
	.fixed-h60-md	 	{	height:60px!important;}
	.fixed-h70-md	 	{	height:70px!important;}
	.fixed-h80-md	 	{	height:80px!important;}
	.fixed-h90-md	 	{	height:90px!important;}
	.fixed-h100-md 		{	height:100px!important;}
	.fixed-h110-md 		{	height:110px!important;}
	.fixed-h120-md 		{	height:120px!important;}
	.fixed-h130-md 		{	height:130px!important;}
	.fixed-h140-md 		{	height:140px!important;}
	.fixed-h150-md 		{	height:150px!important;}
}

/* SM */
@media (max-width: 992px) { 
	.fixed-h10-sm	 	{	height:10px!important;}
	.fixed-h11-sm	 	{	height:11px!important;}
	.fixed-h12-sm	 	{	height:12px!important;}
	.fixed-h13-sm	 	{	height:13px!important;}
	.fixed-h14-sm	 	{	height:14px!important;}
	.fixed-h15-sm	 	{	height:15px!important;}
	.fixed-h16-sm	 	{	height:16px!important;}
	.fixed-h17-sm	 	{	height:17px!important;}
	.fixed-h18-sm	 	{	height:18px!important;}
	.fixed-h19-sm	 	{	height:19px!important;}
	.fixed-h20-sm	 	{	height:20px!important;}
	.fixed-h25-sm	 	{	height:25px!important;}
	.fixed-h30-sm	 	{	height:30px!important;}
	.fixed-h40-sm	 	{	height:40px!important;}
	.fixed-h50-sm	 	{	height:50px!important;}
	.fixed-h60-sm	 	{	height:60px!important;}
	.fixed-h70-sm	 	{	height:70px!important;}
	.fixed-h80-sm	 	{	height:80px!important;}
	.fixed-h90-sm	 	{	height:90px!important;}
	.fixed-h100-sm 		{	height:100px!important;}
	.fixed-h110-sm 		{	height:110px!important;}
	.fixed-h120-sm 		{	height:120px!important;}
	.fixed-h130-sm 		{	height:130px!important;}
	.fixed-h140-sm 		{	height:140px!important;}
	.fixed-h150-sm 		{	height:150px!important;}
}

/* XS */
@media (max-width: 768px) {
	.fixed-h10-xs	 	{	height:10px!important;}
	.fixed-h11-xs	 	{	height:11px!important;}
	.fixed-h12-xs	 	{	height:12px!important;}
	.fixed-h13-xs	 	{	height:13px!important;}
	.fixed-h14-xs	 	{	height:14px!important;}
	.fixed-h15-xs	 	{	height:15px!important;}
	.fixed-h16-xs	 	{	height:16px!important;}
	.fixed-h17-xs	 	{	height:17px!important;}
	.fixed-h18-xs	 	{	height:18px!important;}
	.fixed-h19-xs	 	{	height:19px!important;}
	.fixed-h20-xs	 	{	height:20px!important;}
	.fixed-h25-xs	 	{	height:25px!important;}
	.fixed-h30-xs	 	{	height:30px!important;}
	.fixed-h40-xs	 	{	height:40px!important;}
	.fixed-h50-xs	 	{	height:50px!important;}
	.fixed-h60-xs	 	{	height:60px!important;}
	.fixed-h70-xs	 	{	height:70px!important;}
	.fixed-h80-xs	 	{	height:80px!important;}
	.fixed-h90-xs	 	{	height:90px!important;}
	.fixed-h100-xs 		{	height:100px!important;}
	.fixed-h110-xs 		{	height:110px!important;}
	.fixed-h120-xs 		{	height:120px!important;}
	.fixed-h130-xs 		{	height:130px!important;}
	.fixed-h140-xs 		{	height:140px!important;}
	.fixed-h150-xs 		{	height:150px!important;}
}


/* Max Height Fixed
__________________________________________________________*/

.max-fixed-h10	 	{	max-height:10px!important;}
.max-fixed-h15	 	{	max-height:15px!important;}
.max-fixed-h20	 	{	max-height:20px!important;}
.max-fixed-h30	 	{	max-height:30px!important;}
.max-fixed-h40	 	{	max-height:40px!important;}
.max-fixed-h50	 	{	max-height:50px!important;}
.max-fixed-h60	 	{	max-height:60px!important;}
.max-fixed-h70	 	{	max-height:70px!important;}
.max-fixed-h80	 	{	max-height:80px!important;}
.max-fixed-h90	 	{	max-height:90px!important;}
.max-fixed-h100 		{	max-height:100px!important;}
.max-fixed-h110 		{	max-height:110px!important;}
.max-fixed-h120 		{	max-height:120px!important;}
.max-fixed-h130 		{	max-height:130px!important;}
.max-fixed-h140 		{	max-height:140px!important;}
.max-fixed-h150 		{	max-height:150px!important;}


/* LG */
@media (max-width: 1600px) { 
	.max-fixed-h10-lg	 	{	max-height:10px!important;}
	.max-fixed-h15-lg	 	{	max-height:15px!important;}
	.max-fixed-h20-lg	 	{	max-height:20px!important;}
	.max-fixed-h30-lg	 	{	max-height:30px!important;}
	.max-fixed-h40-lg	 	{	max-height:40px!important;}
	.max-fixed-h50-lg	 	{	max-height:50px!important;}
	.max-fixed-h60-lg	 	{	max-height:60px!important;}
	.max-fixed-h70-lg	 	{	max-height:70px!important;}
	.max-fixed-h80-lg	 	{	max-height:80px!important;}
	.max-fixed-h90-lg	 	{	max-height:90px!important;}
	.max-fixed-h100-lg 		{	max-height:100px!important;}
	.max-fixed-h110-lg 		{	max-height:110px!important;}
	.max-fixed-h120-lg 		{	max-height:120px!important;}
	.max-fixed-h130-lg 		{	max-height:130px!important;}
	.max-fixed-h140-lg 		{	max-height:140px!important;}
	.max-fixed-h150-lg 		{	max-height:150px!important;}
}

/* MD */
@media (max-width: 1200px) { 
	.max-fixed-h10-md	 	{	max-height:10px!important;}
	.max-fixed-h15-md	 	{	max-height:15px!important;}
	.max-fixed-h20-md	 	{	max-height:20px!important;}
	.max-fixed-h30-md	 	{	max-height:30px!important;}
	.max-fixed-h40-md	 	{	max-height:40px!important;}
	.max-fixed-h50-md	 	{	max-height:50px!important;}
	.max-fixed-h60-md	 	{	max-height:60px!important;}
	.max-fixed-h70-md	 	{	max-height:70px!important;}
	.max-fixed-h80-md	 	{	max-height:80px!important;}
	.max-fixed-h90-md	 	{	max-height:90px!important;}
	.max-fixed-h100-md 		{	max-height:100px!important;}
	.max-fixed-h110-md 		{	max-height:110px!important;}
	.max-fixed-h120-md 		{	max-height:120px!important;}
	.max-fixed-h130-md 		{	max-height:130px!important;}
	.max-fixed-h140-md 		{	max-height:140px!important;}
	.max-fixed-h150-md 		{	max-height:150px!important;}
}

/* SM */
@media (max-width: 992px) { 
	.max-fixed-h10-sm	 	{	max-height:10px!important;}
	.max-fixed-h15-sm	 	{	max-height:15px!important;}
	.max-fixed-h20-sm	 	{	max-height:20px!important;}
	.max-fixed-h30-sm	 	{	max-height:30px!important;}
	.max-fixed-h40-sm	 	{	max-height:40px!important;}
	.max-fixed-h50-sm	 	{	max-height:50px!important;}
	.max-fixed-h60-sm	 	{	max-height:60px!important;}
	.max-fixed-h70-sm	 	{	max-height:70px!important;}
	.max-fixed-h80-sm	 	{	max-height:80px!important;}
	.max-fixed-h90-sm	 	{	max-height:90px!important;}
	.max-fixed-h100-sm 		{	max-height:100px!important;}
	.max-fixed-h110-sm 		{	max-height:110px!important;}
	.max-fixed-h120-sm 		{	max-height:120px!important;}
	.max-fixed-h130-sm 		{	max-height:130px!important;}
	.max-fixed-h140-sm 		{	max-height:140px!important;}
	.max-fixed-h150-sm 		{	max-height:150px!important;}
}

/* XS */
@media (max-width: 768px) {
	.max-fixed-h10-xs	 	{	max-height:10px!important;}
	.max-fixed-h15-xs	 	{	max-height:15px!important;}
	.max-fixed-h20-xs	 	{	max-height:20px!important;}
	.max-fixed-h30-xs	 	{	max-height:30px!important;}
	.max-fixed-h40-xs	 	{	max-height:40px!important;}
	.max-fixed-h50-xs	 	{	max-height:50px!important;}
	.max-fixed-h60-xs	 	{	max-height:60px!important;}
	.max-fixed-h70-xs	 	{	max-height:70px!important;}
	.max-fixed-h80-xs	 	{	max-height:80px!important;}
	.max-fixed-h90-xs	 	{	max-height:90px!important;}
	.max-fixed-h100-xs 		{	max-height:100px!important;}
	.max-fixed-h110-xs 		{	max-height:110px!important;}
	.max-fixed-h120-xs 		{	max-height:120px!important;}
	.max-fixed-h130-xs 		{	max-height:130px!important;}
	.max-fixed-h140-xs 		{	max-height:140px!important;}
	.max-fixed-h150-xs 		{	max-height:150px!important;}
}




/* Wrappers
__________________________________________________________*/
.wrapper {
  padding: 20px;
}
.wrapper-xxs {
  padding: 5px;
}
.wrapper-xs {
  padding: 10px;
}
.wrapper-sm {
  padding: 15px;
}
.wrapper-lg {
  padding: 30px;
}
.wrapper-xl {
  padding: 50px;
}
.wrapper-xxl {
  padding: 60px;
}
.wrapper-xxxl {
  padding: 70px;
}
.wrapper-xxxxl {
  padding: 80px;
}
.wrapper-none {
  padding: 0px;
}

/* LG */
@media (max-width: 1600px) { 
	.wrapper-lg-xxs {		padding: 5px; }
	.wrapper-lg-xs {		padding: 10px; }
	.wrapper-lg-sm {		padding: 15px; }
	.wrapper-lg-md {		padding: 20px; }
	.wrapper-lg-lg {		padding: 30px; }
	.wrapper-lg-xl {		padding: 50px; }
	.wrapper-lg-xxl {		padding: 60px; }
	.wrapper-lg-xxxl {		padding: 70px; }
	.wrapper-lg-xxxxl {		padding: 80px; }
	.wrapper-lg-none {		padding: 0; }
}

/* MD */
@media (max-width: 1200px) { 
	.wrapper-md-xxs {		padding: 5px; }
	.wrapper-md-xs {		padding: 10px; }
	.wrapper-md-sm {		padding: 15px; }
	.wrapper-md-md {		padding: 20px; }
	.wrapper-md-lg {		padding: 30px; }
	.wrapper-md-xl {		padding: 50px; }
	.wrapper-md-xxl {		padding: 60px; }
	.wrapper-md-xxxl {		padding: 70px; }
	.wrapper-md-xxxxl {		padding: 80px; }
	.wrapper-md-none {		padding: 0; }
}

/* SM */
@media (max-width: 992px) { 
	.wrapper-sm-xxs {		padding: 5px; }
	.wrapper-sm-xs {		padding: 10px; }
	.wrapper-sm-sm {		padding: 15px; }
	.wrapper-sm-md {		padding: 20px; }
	.wrapper-sm-lg {		padding: 30px; }
	.wrapper-sm-xl {		padding: 50px; }
	.wrapper-sm-xxl {		padding: 60px; }
	.wrapper-sm-xxxl {		padding: 70px; }
	.wrapper-sm-xxxxl {		padding: 80px; }
	.wrapper-sm-none {		padding: 0; }
}

/* XS */
@media (max-width: 768px) {
	.wrapper-xs-xxs {		padding: 5px; }
	.wrapper-xs-xs {		padding: 10px; }
	.wrapper-xs-sm {		padding: 15px; }
	.wrapper-xs-md {		padding: 20px; }
	.wrapper-xs-lg {		padding: 30px; }
	.wrapper-xs-xl {		padding: 50px; }
	.wrapper-xs-xxl {		padding: 60px; }
	.wrapper-xs-xxxl {		padding: 70px; }
	.wrapper-xs-xxxxl {		padding: 80px; }
	.wrapper-xs-none {		padding: 0; }
}



/* Padding
__________________________________________________________*/

.padder-t-none {
  padding-top: 0px!important;
}
.padder-t {
  padding-top: 15px!important;
}
.padder-t-xs {
  padding-top: 5px!important;
}
.padder-t-sm {
  padding-top: 10px!important;
}
.padder-t-lg {
  padding-top: 20px!important;
}
.padder-t-xl {
  padding-top: 30px!important;
}
.padder-t-xxl {
  padding-top: 40px!important;
}
.padder-t-xxxl {
  padding-top: 60px!important;
}
.padder-b {
  padding-bottom: 15px!important;
}
.padder-b-none {
  padding-bottom: 0!important;
}
.padder-b-xs {
  padding-bottom: 5px!important;
}
.padder-b-sm {
  padding-bottom: 10px!important;
}
.padder-b-lg {
  padding-bottom: 20px!important;
}
.padder-b-xl {
  padding-bottom: 30px!important;
}
.padder-b-xxl {
  padding-bottom: 40px!important;
}
.padder-b-xxxl {
  padding-bottom: 60px!important;
}
.padder-l {
  padding-left: 15px!important;
}
.padder-l-xs {
  padding-left: 5px!important;
}
.padder-l-sm {
  padding-left: 10px!important;
}
.padder-l-lg {
  padding-left: 20px!important;
}
.padder-l-xl {
  padding-left: 30px!important;
}
.padder-l-xxl {
  padding-left: 40px!important;
}
.padder-l-xxxl {
  padding-left: 50px!important;
}
.padder-r {
  padding-right: 15px!important;
}
.padder-r-xs {
  padding-right: 5px!important;
}
.padder-r-sm {
  padding-right: 10px!important;
}
.padder-r-lg {
  padding-right: 20px!important;
}
.padder-r-xl {
  padding-right: 30px!important;
}
.padder-r-xxl {
  padding-right: 40px!important;
}
.padder-r-xxxl {
  padding-right: 50px!important;
}

.no-padder {
  padding: 0 !important;
}
.padder-l-none {
  padding-left: 0 !important;
}
.padder-r-none {
  padding-right: 0 !important;
}
.padder-t-none {
  padding-top: 0 !important;
}
.padder-b-none {
  padding-bottom: 0 !important;
}



/* LG */
@media (min-width: 1601px) { 
	.no-padder-xl 	{	padding:0!important;}
	.padder-xl-l 	{	padding-left: 15px!important; }
	.padder-xl-l-lg {	padding-left: 20px!important; }
	.padder-xl-l-xl {	padding-left: 30px!important; }
	.padder-xl-r 	{	padding-right: 15px!important; }
}

/* LG */
@media (max-width: 1600px) { 
	.no-padder-lg 	{	padding:0!important;}
	.padder-lg-l 	{	padding-left: 15px!important; }
	.padder-lg-l-lg {	padding-left: 20px!important; }
	.padder-lg-l-xl {	padding-left: 30px!important; }
	.padder-lg-r 	{	padding-right: 15px!important; }
}

/* MD */
@media (max-width: 1200px) { 
	.no-padder-md 	{	padding:0!important;}
	.no-padder-t-md {	padding-top:0!important;}
	.padder-md-l 	{	padding-left: 15px!important; }
	.padder-md-l-lg {	padding-left: 20px!important; }
	.padder-md-l-xl {	padding-left: 30px!important; }
	.padder-md-r 	{	padding-right: 15px!important; }
}

/* SM */
@media (max-width: 992px) { 
	.no-padder-sm 	{	padding:0!important;}
	.no-padder-l-sm {	padding-left:0!important;}
	.no-padder-b-sm {	padding-bottom:0!important;}
	.padder-sm-l 	{	padding-left: 15px!important; }
	.padder-sm-l-lg {	padding-left: 20px!important; }
	.padder-sm-l-xl {	padding-left: 30px!important; }
	.padder-sm-r 	{	padding-right: 15px!important; }
}

/* XS */
@media (max-width: 768px) {
	.no-padder-xs 	{	padding:0!important;}
	.no-padder-l-xs {	padding-left:0!important;}
	.padder-xs-l 	{	padding-left: 15px!important; }
	.padder-xs-l-lg {	padding-left: 20px!important; }
	.padder-xs-l-xl {	padding-left: 30px!important; }
	.padder-xs-r 	{	padding-right: 15px!important; }
}


/* Sticky
__________________________________________________________*/

.sticky-container {
	overflow: hidden;
	position: relative;
}
	
.sticky {
	position: relative;
	z-index:10;
}		
	
.sticky.sticked {
	position: fixed;
	transform: translate3d(0,0,0);
}	
.sticky.absolute {
	position: absolute;
}	

.sticky-placeholder {

}	


/* Breakpoint SM */
@media (max-width: 992px)
{
	.sticky {
		background-color:var(--bg-color);
		left:0;
		width:100%;
		height:var(--header-height);
		overflow: hidden;
		display:flex;
		align-items: center;
		
		border-top:solid 1px var(--border-color);
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.06);
		box-shadow:         0 0 10px rgba(0,0,0,0.06);
		
		
	}
	
	.sticky ul {
		overflow-x:auto;
		white-space: nowrap;
	}
	
	
	.sticky ul li {
		display:inline-block;
	}
	
	.sticky ul li a {
		border-radius:30px;
		font-weight: 600;
	}
	
	.sticky.sticked {
		padding:0;
	}
	
}




/* Word Animation
__________________________________________________________*/

[word-animation] {

    vertical-align: top;
    position: relative;
    display:inline-block;
}

[word-animation] > span {
    opacity: 0;
    top: .2em;

    display: inline-block;
    position: absolute;
    white-space: nowrap;
    left: 0;
    top: 0;    
    
}




[word-animation].activated > span.is-visible {
  top: 0;
  opacity: 1;
  -webkit-animation: WordAnimationSlideIn 0.6s;
  -moz-animation: WordAnimationSlideIn 0.6s;
  animation: WordAnimationSlideIn 0.6s;
}
[word-animation].activated > span.is-hidden {
  -webkit-animation: WordAnimationSlideOut 0.6s;
  -moz-animation: WordAnimationSlideOut 0.6s;
  animation: WordAnimationSlideOut 0.6s;
}


@-webkit-keyframes WordAnimationSlideIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
  }
  60% {
    opacity: 1;
    -webkit-transform: translateY(20%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes WordAnimationSlideIn {
  0% {
    opacity: 0;
    -moz-transform: translateY(-100%);
  }
  60% {
    opacity: 1;
    -moz-transform: translateY(20%);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@keyframes WordAnimationSlideIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  60% {
    opacity: 1;
    -webkit-transform: translateY(20%);
    -moz-transform: translateY(20%);
    -ms-transform: translateY(20%);
    -o-transform: translateY(20%);
    transform: translateY(20%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@-webkit-keyframes WordAnimationSlideOut {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
  60% {
    opacity: 0;
    -webkit-transform: translateY(120%);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(100%);
  }
}
@-moz-keyframes WordAnimationSlideOut {
  0% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
  60% {
    opacity: 0;
    -moz-transform: translateY(120%);
  }
  100% {
    opacity: 0;
    -moz-transform: translateY(100%);
  }
}
@keyframes WordAnimationSlideOut {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  60% {
    opacity: 0;
    -webkit-transform: translateY(120%);
    -moz-transform: translateY(120%);
    -ms-transform: translateY(120%);
    -o-transform: translateY(120%);
    transform: translateY(120%);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
  }
}





.text-o-xxxs {
  opacity:0.9!important;
}
.text-o-xxs {
  opacity:0.8!important;
}
.text-o-xs {
  opacity:0.7!important;
}
.text-o-sm {
  opacity:0.6!important;
}
.text-o {
  opacity:0.5!important;
}
.text-o-lg {
  opacity:0.4!important;
}
.text-o-xl {
  opacity:0.3!important;
}
.text-o-xxl {
  opacity:0.2!important;
}



/*
=======================================
TESTIMONIALS
=======================================
*/


.testimonials .testimonial-box {
	background-color:var(--bg-color);
	padding:30px;
	-webkit-box-shadow: 0 0 100px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0 0 100px 0px rgba(0,0,0,0.1);
	box-shadow: 0 0 100px 0px rgba(0,0,0,0.1);
	border-radius:6px;
	color:var(--text-color-alt);
	font-size:14px;
    line-height: 1.5;
    margin:20px auto;
    max-width:600px;
    border: solid 1px var(--border-color);
}

	.testimonials .testimonial-box .testimonial-user {
		margin-bottom:20px;
        display:flex;
        align-items: center;
	}


		.testimonials .testimonial-box .testimonial-user .testimonial-user-img {
			width:35px;
			height: 35px;
			background-position: top center;
			background-size:cover;
			border-radius:50%;
			vertical-align: middle;
            object-fit: cover;
            flex-shrink: 0;
		}

		.testimonials .testimonial-box .testimonial-user .testimonial-user-info {
			margin-left:8px;
			vertical-align: middle;
		}

			.testimonials .testimonial-box .testimonial-user .testimonial-user-info .testmonial-user-info-name {
				font-weight: 600;
				font-size:14px;
				color:var(--text-color);
			}

			.testimonials .testimonial-box .testimonial-user .testimonial-user-info .testmonial-user-info-title {
				font-weight: 400;
				font-size:14px;
				color:var(--text-color-alt);
			}

        .testimonials .testimonial-box .testimonial-user .rating {
			margin-left:auto;
		}


@media (max-width: 1050px) {
    .testimonials .testimonial-box {
        padding:20px;   
    }
}



/* Tabs

__________________________________________________________*/

ul.tab-links{
	overflow: visible;
    border-bottom:solid 1px var(--border-color);
}

ul[tab-links]{
	overflow: visible;
    display:flex;
    gap:3px;
    
}

	ul.tab-links li {
		display:inline-block;
		padding:10px 25px;
		line-height: 1;
		font-size:14px;
        font-weight: 600;
        
        color: var(--text-color);
        opacity:0.6;
        
        position: relative;
        

        border-radius:6px;
        
	}


        ul.tab-links li.active {
            opacity:1;

        }

        ul.tab-links li:after {
            position: absolute;
            content:"";
            width:100%;
            height:2px;
            background-color:var(--main-color);
            bottom:-2px;
            left:0;
            display:none;
        }

	ul.tab-links li:hover {
		cursor:pointer;
	}

	ul.tab-links li.active {
        color: var(--main-color);
	}

        ul.tab-links li.active:after {
            display:block;
        }





ul.tabs,
ul[tabs]{
	overflow: visible;
	white-space: nowrap;
}

	ul.tabs li.tab,
    ul[tabs] li[tab]{
		display:none;
		width:100%;
		white-space:normal;
		vertical-align: top;
	}

	ul.tabs li.tab.active,
    ul[tabs] li[tab].active{
		display:inline-block;
        overflow:visible;
	}

	ul.tabs li.tab:hover {
		cursor:auto!important;
		background-color:transparent!important;
	}


@media (max-width: 1200px) {
    ul.tab-links {
        display: flex;
        gap: 5px;
        flex-wrap: wrap;
    }
    
    ul.tab-links li {
        font-size: 12px;
        padding: 10px 10px;
    }
}




[progress] {
    background-color:#e2e5ea;
    border-radius:10px;
    width:100%;
    min-width: 300px;
    height: 5px;
    overflow: hidden;
}

[progress] div {
    background-color:var(--main-color);
    height:100%;
}



/* Modal
__________________________________________________________*/



.modal-mask {
	position: fixed;
	top:0;
	left: 0;
	bottom:0;
	right:0;
	background-color:rgba(0,0,0,0.8);
	z-index:1000;
	transition: opacity 0.5s ease-out;
	transform: translate3d(0,0,0);
	-webkit-backdrop-filter: blur(3px) grayscale(25%);
	backdrop-filter: blur(3px) grayscale(25%);
	opacity:0;
	transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
	.modal-mask.in {
		opacity:1;
	}


.modal {
	position: fixed;
	top:50%;
	left:50%;
	transform: translate3d(-50%,-50%,0) scale3d(0.65,0.65,0.65);
	transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
	z-index:1005;
	background-color:var(--bg-color);
	border-radius:10px;
	min-width:300px;
	max-width:100%;
	min-height: 150px;
	max-height: 90%;
	
	height:760px;
	width:1200px;
	
	overflow: hidden;
	
	opacity:0;
	-webkit-filter: blur(5px);
	filter: blur(5px);	
}
	
	.modal.in {
		transform: translate3d(-50%,-50%,0) scale3d(1,1,1);
		-webkit-filter: blur(0);
		filter: blur(0);	
		opacity:1;
	}


	.modal .modal-content {
		padding:60px 60px 60px 60px;
	}

		.modal .modal-content {
			padding:60px 30px 60px 30px;
		}

	.modal .modal-header {		
		position: absolute;
		line-height: 1;
		z-index:100;		
		border-bottom: solid 1px var(--border-color);
		height: 40px;
		background-color: var(--bg-color);
		width:100%;
		left:0;
		top:0;
		right:0;
		overflow: hidden;
		display:block;
	}


    .modal .modal-header .modal-close {
        position: absolute;
        top:50%;
        transform: translate3d(0,-50%,0);
        right:20px;
        width:50px;
    }

        .modal .modal-header .modal-close:hover {
            cursor:pointer;
        }


		.modal .modal-header .modal-close:after {
			position: absolute;
			content: "";
            right:0;
			top:50%;
			transform: translate3d(0,-50%,0);
            
            width:16px;
            height:16px;
            background-repeat: no-repeat;
            background-position: center center;
            background-size:16px 16px;

            background-image: url("../img/icons/times.png");
            
            
		}


        body.dark-mode .modal .modal-header .modal-close:after {
            background-image: url("../img/icons/times.white.png");
		}

	
	.modal .modal-title {
		position: absolute;
		top:50%;
		transform: translate3d(0,-50%,0);
		left:20px;
		z-index:105;
		font-size:12px;
	}
	
	.modal .modal-title i {
		font-size:10px;
		margin-left:5px;
		margin-right:5px;
	}




.modal .modal-button {
	background-color: #f8f9fd;
	color:#152438;
	font-weight: 700;
	display:inline-block;
	padding:15px;
	border-radius:10px;
}

	.modal .modal-button:hover {
		-webkit-filter: brightness(98%);
		filter:brightness(98%);
		cursor: pointer;	
	}

	.modal .modal-button.button-accept {
		background-color:#106fdf;
		color:#fff;
		margin-left:10px;
	}

		.modal .modal-button.button-accept:hover {
			-webkit-filter: brightness(110%);
			filter:brightness(110%);
			cursor: pointer;	
		}

.modal-wrapper {
	position: absolute;
	height: calc(100% - 40px);
	margin-top:40px;
	width:100%;
    top:0;
    overflow-y:auto;
}

.modal-content {
	position: relative;
	height: calc(100% - 60px);
	margin-top:40px;
	width:100%;
    overflow-y:auto;
}

.modal .modal-scroll {
	overflow:auto;
	height: calc(100% - 60px);
	position: relative;
}

.modal .modal-bottom {
	border-top:solid 1px var(--border-color);
    display:flex;
    padding:20px;
    height: 60px;
    align-items: center;
}

.modal #modal-loader {
	position: absolute;
	top:0;
	left: 0;
	background-color:rgba(255,255,255,0.5);
	width:100%;
	height: 100%;
	z-index:500;
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	display:none;
}



/* SM */
@media (max-width: 992px) { 
	
	.modal-mask.in {
		opacity:0;
	}
	
	.modal {
		max-width:100%;
		min-width:100%;
		min-height: 100%;
		max-height:100%;
		border-radius:0;
		overflow: hidden;
		transition: all 0.3s ease;
		transform: translate3d(100%,0,0);
		top:0;
		left:0;
		
		opacity:1;
		-webkit-filter: blur(5px);
		filter: blur(5px);

	}
	
	.modal.in {
		transform: translate3d(0,0,0);
	}
	
	.modal .modal-content {
		padding:30px;	
	}
	
	
	.modal .modal-title {
		left:35px;
	}
    
    .modal .modal-header .modal-close {
        display:none;
    }


	.modal .modal-header:after {
        position: absolute;
		content: "";
		left:15px;
		right:auto;
		top:50%;
		transform: translate3d(0,-50%,0);
        
        
        width:16px;
        height:16px;
        background-repeat: no-repeat;
        background-position: center center;
        background-size:16px 16px;

        background-image: url("../img/icons/arrow-left.png");
        
	}
    
    body.dark-mode .modal .modal-header:after {
        background-image: url("../img/icons/arrow-left.white.png");
    }

	
	
	.modal-wrapper {
		margin-top:40px;
		overflow:auto;
		/*height: calc(100% - 107px);*/
	}
	
	.modal-wrapper.full {
		height: calc(100% - 40px);
	}
	
	.modal .swiper-slide {
		overflow-y:auto;
	}
	
	
	.modal-bottom {
		width: calc(100% - 40px);
		margin:0;
		padding:15px 20px;
		background-color:var(--bg-color-default);
		width:100%;
		border-top: solid 1px #e5e5e5;
	}
	
	.modal .modal-button {
		padding:10px 15px;
		font-size:14px;
	}
	
	
	.modal .modal-scroll {
		overflow:hidden;
		height: auto;
		position: relative;
	}

	
	.modal #UploadImage {
		height: calc(100% - 50px);
	}
	
	.modal #UploadImage .input {
		width:auto;
	}
	
	
	
}


/* Blur
__________________________________________________________*/

.blur-xxxxxl {
	-webkit-filter: blur(20px);
	filter: blur(20px);	
}


.blur-xxxxl {
	-webkit-filter: blur(15px);
	filter: blur(15px);	
}

.blur-xxxl {
	-webkit-filter: blur(10px);
	filter: blur(10px);	
}

.blur-xxl {
	-webkit-filter: blur(5px);
	filter: blur(5px);	
}

.blur-xl {
	-webkit-filter: blur(3px);
	filter: blur(3px);	
}

.blur-lg {
	-webkit-filter: blur(2.5px);
	filter: blur(2.5px);	
}

.blur {
	-webkit-filter: blur(2px);
	filter: blur(2px);	
}

.blur-sm {
	-webkit-filter: blur(1.5px);
	filter: blur(1.5px);	
}

.blur-xs {
	-webkit-filter: blur(1px);
	filter: blur(1px);	
}


/* Lists
__________________________________________________________*/

ul.list {
  overflow:hidden
}
ul.list {
  padding:0;
  margin:0 0 0 50px;
  vertical-align:middle;
  margin-left:auto
}
ul.list>li {
  list-style:none;
  padding:0;
  margin:0;
  display:block
}
ul.list.oddeven>li:nth-child(even) {
  background-color:var(--bg-faded-more)
}
ul.list.border>li {
  border-bottom:solid 1px var(--color-border);
  padding:5px 0
}

ul.numbers {
  counter-reset: NumbersCounter;
}
ul.numbers > li {
  counter-increment: NumbersCounter;
}

ul.list > li, 
ul.numbers > li {
  color: #66666a;
  padding-left: 25px;
  position: relative;
  line-height: 1.8;
    font-size:13px;
}

ul.list li::before, 
ul.numbers li::before {
  position: absolute;
  left: 0;
  top: 0;
  line-height: 1.7;
}

ul.list > li::before {
    /*content: "\f111";
    font-family: "Font Awesome 5 Pro";
    font-style: normal;
    font-weight: 900;*/
    font-size: 6px;
    position: absolute;
    line-height: 30px;
}

ul.numbers > li::before {
  content: counter(NumbersCounter) ". ";
}

ul[list-check] > li {
  color: var(--text-color);
  padding:5px 0 5px 45px;
  position: relative;
  line-height: 1.8;
    font-size:13px;
}

ul[list-check] > li::before {
    content: "";
    position: absolute;
    left:10px;
    top: 5px;
    color:var(--main-color);
    
    width:20px;
    height:20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:11px 11px;
    
    background-image: url("../img/icons/check.color.png");
    
    
    
    background-color:var(--bg-color-active);
    line-height: 22px;
    border-radius:50%;
    text-align: center;
}


ol[list-numbers] {
    counter-reset: item;
    margin:0;
    padding:0;
}

ol[list-numbers] > li {
    color: var(--text-color);
    padding:5px 0 5px 35px;
    position: relative;
    line-height: 1.8;
    font-size: 13px;
}


ol[list-numbers] li::before {
    content: counter(item);
    font-size: 12px;
    position: absolute;
    left:0;
    top: 5px;
    counter-increment: item;
    background-color: var(--bg-color-active);
    color: var(--main-color);
    width:25px;
    height: 25px;
    line-height: 25px;
    border-radius:50%;
    text-align: center;
    font-weight: 600;
}











[swiper-title] {
    border-bottom: solid 1px rgba(0,0,0,0.1);
    padding:10px;
    font-size:13px;
    font-weight: 600;
}
[swiper-title][b-t] {
    border-top: solid 1px rgba(0,0,0,0.1);
}






.swiper [title] {
    font-weight: 600;
    font-size:14px;
    margin-bottom:6px;
    display:flex;
    gap:5px;
    align-items: center;
    color:var(--text-color);
}

.swiper [title] img {
    border-radius:4px;
    width: 20px;
}


.swiper [description] {
    font-size:13px;
    opacity:0.8;
    line-height: 1.4;
    margin-bottom:4px;
}

.swiper [swiper-item-buttons] {
    margin-top:7px;
}

.swiper a[active] [description] {
    opacity:1;
}

.swiper [img] {
    border-radius:6px;
    box-shadow: 0 0 25px 2px rgba(0,0,0,0.05);
    width:100%;
    margin-bottom:10px;
}


.swiper [item-content] [favicon] {
    width:16px;
    height: 16px;
    border-radius:6px;
}


.swiper-button-next, 
.swiper-button-prev {
    height: calc(100% + 30px);
    top: 0;
    width: 40px;
    color: var(--text-color);
    background-color: var(--bg-color);
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.075);
    z-index:300;
}

.swiper-button-prev {
    left: 0;
    border-right: solid 1px rgba(0,0,0,0.1);
}
.swiper-button-next {
    right: 0;
    border-left: solid 1px rgba(0,0,0,0.1);
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    pointer-events:auto;
    opacity:1;
}

.swiper-button-next:after, 
.swiper-button-prev:after {
    font-size:20px;
}

.swiper-button-next.swiper-button-disabled:after, 
.swiper-button-prev.swiper-button-disabled:after {
    opacity:0.1;
}


.swiper {
    padding-bottom:60px;
}

.swiper-pagination {
    bottom:25px!important;
}


.swiper-pagination-bullet {
    background: var(--swiper-pagination-bullet-inactive-color,var(--text-color))!important;
}


[skeleton-swiper] {
    padding: 30px 80px 50px;
    display:flex;
    overflow:hidden;
    flex-wrap: nowrap;
    gap:30px;
}

[skeleton-swiper] li {
    flex: 0 0 calc(14% - 15px);
}

[skeleton-swiper] li div[skeleton-img] {
    aspect-ratio: 16 / 9;
    width:100%;
    margin-bottom: 10px;
}

@media (max-width: 2300px)
{
    [skeleton-swiper] li {
        flex: 0 0 calc(20% - 15px);
    }
}
@media (max-width: 1920px)
{
    [skeleton-swiper] li {
        flex: 0 0 calc(25% - 15px);
    }
}
@media (max-width: 1500px)
{
    [skeleton-swiper] li {
        flex: 0 0 calc(33.33% - 15px);
    }
}
@media (max-width: 1300px)
{
    [skeleton-swiper] li {
        flex: 0 0 calc(50% - 15px);
    }
}
@media (max-width: 1100px)
{
    [skeleton-swiper] li {
        flex: 0 0 calc(83.33333333333333% - 15px);
    }
}

@media (max-width: 1050px)
{
    .swiper [swiper-item-buttons] {
        display:none;
    }
    

    .swiper-button-next, .swiper-button-prev{
        display:none!important;
    }
}





/* Skeleton
__________________________________________________________*/

.skeleton-block {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    /*margin-bottom: 0.6em;*/

    border-radius: 3px;
    background-image: linear-gradient(90deg, rgba(0,0,0,0.05) 0px, rgba(0,0,0,0.1) 40px, rgba(0,0,0,0.05) 80px);
    background-size: 300% 50px;
    animation: skeleton 1.6s infinite linear;
}

body.dark .skeleton-block,
.skeleton-block.dark{
	background-image: linear-gradient(90deg, rgba(255,255,255,0.05) 0px, rgba(255,255,255,0.1) 40px, rgba(255,255,255,0.05) 80px);
}

.skeleton-block.m-auto {
    /*margin: 0 auto 0.6em!important;*/
}

.skeleton-block.center {
	margin-left: auto!important; 
	margin-right: auto!important; 
}


.skeleton-block.avatar.xxl {
    width: 120px;
    height: 120px;
    border-radius: 50%;
}

.skeleton-block.avatar {
    width: 45px;
    height: 45px;
    border-radius: 50%;
}
.skeleton-block.avatar.xs {
    width: 30px;
    height: 30px;
}
.skeleton-block.avatar.xxs {
    width: 16px;
    height: 16px;
}

.skeleton-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}


.skeleton-bg-image {

    background-color:rgba(0,0,0,0.25);



    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}






@keyframes skeleton {
  from {background-position: 100% 0}
    to {background-position: -80% 0}
}










 /* Customize the label (the container) */
.custom-checkbox {
  display: inline-flex;
    align-items: center;
  position: relative;
  cursor: pointer;
  font-size: 13px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
    gap:5px;
}

/* Hide the browser's default checkbox */
.custom-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.custom-checkbox span {
    order:2;
}

/* Create a custom checkbox */
.custom-checkbox .checkmark  {
  position: relative;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  
    display: inline-block;
  font-size: 0.875em;
  padding: 0.2em 0.6em;
  max-width: 150px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: -0.5em;
  background-color: #fff;
  border: 1px solid #aaa;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  cursor: default;
    order:1;

    
}

/* On mouse-over, add a grey background color */
.custom-checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.custom-checkbox input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.custom-checkbox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.custom-checkbox .checkmark:after {
    top:50%;
    left: 50%;
    transform: translate3d(-50%,-50%,0);
} 


.checkbox {
    font-size:13px;
}


[price-slider] {
    width:200px;
    padding:15px;
}

[price-slider] input {
    max-width:75px;
}

[price-slider] [slider] {
    flex-shrink: 0;
    width:100%;
    position: relative;
}

[price-slider] [price-slider-amount] {
    font-size:13px;
}

.ui-slider .ui-slider-range {
    z-index:0;
}

.ui-slider .ui-slider-handle {
    z-index:0;    
}





.dropdown:not(.filter-multi-select) {
  display: inline-block;
  font-size: 13px;
  padding: 3px 30px 3px 6px;
  white-space: nowrap;
  text-overflow: ellipsis;
  background-color: var(--bg-color);
  border: 1px solid var(--border-color-dark);
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  cursor: default;
    position: relative;
    min-width: 100px;
    z-index:400;
}

.dropdown.in {
    z-index:500;
}

.dropdown.no-arrow {
    padding: 3px 6px;
}

.dropdown:not(.filter-multi-select):hover {
    background-color:var(--bg-color-alt);
    cursor:pointer;
}

.dropdown:not(.filter-multi-select) > span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100px;
    display:block;
}

.dropdown:not(.filter-multi-select) > span[w-auto] {
    width: auto;
}


.dropdown:not(.filter-multi-select) > span::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.4em 0.4em 0 0.4em;
  border-color: #999 transparent transparent transparent;
  margin-left: 0.4em;
  vertical-align: 0.1em;
    position: absolute;
    right:10px;
    top:50%;
    transform: translateY(-50%);
}

.dropdown.no-arrow > span::after {
    display:none;
}


.dropdown-content {
    position: absolute;
    left: 0;
    top: 15px;
    z-index: 1;
    float: left;
    min-width: 100%;
    background: var(--bg-color);
    margin: 1em 0;
    border: 1px solid var(--border-color-dark);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    display:none;
}

.dropdown-content.right {
    left: auto;
    right:0;
}

.dropdown-inner {
    overflow-x:hidden;
    overflow-y:auto;
    scrollbar-width: thin;
    padding:10px;
}

.dropdown-close {
    margin:10px;
    text-align: center;
    background-color: var(--bg-color);
    border: 1px solid var(--border-color-dark);
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    padding:5px;
}
.dropdown-close:hover {
    cursor:pointer;
    background-color:var(--bg-color-alt);    
}

.dropdown.in .dropdown-content {
    display:block;
}

.dropdown:not(.filter-multi-select) > [price-slider-amount] {
    width:75px!important;
}


/* SAFARI FIXES */

body.safari ul.tab-links li {
    white-space: nowrap;
}

body.safari .swiper [item-content] [favicon] {
    margin-right:10px;
}






ul[items-focus] {
    display:flex;
    gap:40px;
    width:100%;
    overflow: hidden;
}


ul[items-focus] li {
    width:calc(33.33% - 40px);
    flex-shrink: 0;
}

ul[items-focus] [subline],
[item-focus] [subline]{
    font-weight: 600;
    color:var(--main-color);
    text-transform: uppercase;
    font-size:12px;
}
ul[items-focus] [title],
[item-focus] [title]{
    font-weight: 600;
    font-size:18px;
    margin:5px 0;
}
ul[items-focus] [description],
[item-focus] [description]{
    font-weight: 500;
    font-size:14px;
    opacity:0.6;
    margin-bottom:20px;
}
ul[items-focus] [screenshot],
[item-focus] [screenshot]{
    border-radius:10px;
    border: solid 1px var(--border-color-alt);
    box-shadow: 0 0 4px 2px rgba(0,0,0,0.05);
    aspect-ratio: 16 / 9;
    width:100%;
}


@media (max-width: 1920px)
{
    ul[items-focus] [title],
    [item-focus] [title]{
        font-size:16px;
    }
    
    ul[items-focus] [description],
    [item-focus] [description]{
        font-size:13px;
    }
}


@media (max-width: 800px)
{
    ul[items-focus] [title],
    [item-focus] [title]{
        font-size:15px;
    }
    
    ul[items-focus] [description],
    [item-focus] [description]{
        font-size:12px;
    }
}




ul[item-row] {
    display:flex;
    gap:30px;
    flex-wrap: wrap;
    align-items: stretch;
}


ul[item-row] li {
    width:calc(25% - 30px);
    display:flex;
    gap:10px;
    line-height: 1.4;
    margin-bottom:20px;
    align-items: flex-start;
}


ul[item-row] li [favicon] {
    width: 20px;
    margin:3px 0;
    border-radius:4px;
}

ul[item-row] li [title] {
    font-weight: 600;
    font-size:14px;
    color:var(--text-color);
}

ul[item-row] li a:hover [title] {
    text-decoration: underline;
}

ul[item-row] li [description] {
    opacity:0.6;
    font-size:13px;
    display:block;
    margin-bottom:8px;
    max-width: 90%;
    font-weight: 500;
}
ul[item-row] li [cta] {
    background-color:var(--bg-color-main-faded);
    color:var(--main-color);
    border-radius: 6px;
    padding:5px 10px;
    font-size:11px;
    font-weight: 600;
    display:inline-block;
}

ul[item-row] li [cta]:hover {
    background-color:var(--bg-color-main-faded-hover);
}




@media (max-width: 1500px)
{
    ul[item-row] li {
        width:calc(33.33% - 30px);
        margin-bottom:20px;
    }
}
@media (max-width: 850px)
{
    ul[item-row] li {
        width:calc(50% - 30px);
        margin-bottom:20px;
    }
}

@media (max-width: 600px)
{
    ul[item-row] li {
        width:100%;
        margin-bottom:20px;
    }
}





[search-list] {
    position: relative;
    z-index:200;
}


[search-list].in {
    z-index:500;
}

[search-list] [search-list-result] {
    position: absolute;
    width:400px;
    max-height: 300px;
    background-color:#fff;
    border:solid 1px var(--border-color);
    display:none;
    padding:10px;
    border-radius:6px;
    display:none;
}

[search-list].in [search-list-result] {
    display: block;
}


[search-list] [result-icon] {
    position: absolute;
    left:-20px;
    top:50%;
    transform: translateY(-50%);
    font-size:11px;
    max-width: 16px;
    max-height: 16px;
}

[search-list] [search-list-result] ul li {
    font-size:13px;
    padding:5px;
    border-bottom:solid 1px var(--bg-color);
    display:flex;
    gap:10px;
    border-radius:6px;
}

[search-list] [search-list-result] ul li img {
    height: 16px;
}

[search-list] [search-list-result] ul li:hover {
    background-color:#f2f2f7;
    cursor:pointer;
}

[search-list] [search-list-result] ul li:last-child {
    border-bottom:0;
}






[collection-single] {
    position: relative;
    padding:100px 0;
    overflow: hidden;
    min-height: 600px;
}

[collection-single] [collection-single-content] {
    position: absolute;
    left:50%;
    top:50%;
    transform: translate3d(-50%,-50%,0);
    z-index:50;
    width:600px;
    max-width: 100%;
    background-color:var(--bg-color);
    border-radius:20px;
    border: solid 1px var(--border-color-alt);
    box-shadow: 0 0 4px 2px rgba(0,0,0,0.05);
}

[collection-single] [collection-single-content] [collection-single-content-item] {
    display:flex;    
    align-items:center;
    gap:15px;
    padding:30px 20px 10px;
}

[collection-single] [collection-single-content] [collection-single-content-item] [collection-single-content-item-infos] {
    display:flex;    
    align-items:center;
    gap:15px;
}





[collection-single] [collection-single-headline] {
    padding:15px 30px 40px;
    text-align: center;
    font-weight: 700;
    font-size:18px;
}

[collection-single] [favicon] {
    height: 35px;
    margin:3px 0;
}

[collection-single] [title] {
    font-weight: 600;
    font-size:14px;
    color:var(--text-color);
    margin-bottom:3px;
}

[collection-single] a:hover [title] {
    text-decoration: underline;
}

[collection-single] [description] {
    opacity:0.6;
    font-size:13px;
    display:block;
    margin-bottom:8px;
    max-width: 90%;
    font-weight: 500;
}
[collection-single] [cta] {
    background-color:#f2f2f7;
    color:var(--main-color);
    border-radius: 6px;
    padding:5px 10px;
    font-size:11px;
    font-weight: 600;
    display:inline-block;
    flex-shrink: 0;
}

[collection-single] [cta]:hover {
    background-color:#eee;
}

[collection-single] [screenshot] {
    border-radius: 20px;
    margin-top:-10px;
    transform: scale(1.1,1.1);
    box-shadow: 0 0 30px rgba(0, 0, 0, .1);
    aspect-ratio: 16 / 9;
    width:100%;
}


[collection-single] [bg] {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-filter: blur(30px) grayscale(30%);
  filter: blur(30px) grayscale(30%);
  z-index: 2;
  background-color: var(--bg-color);
  background-color: #000;
  opacity: 0.85;
  width: 200%;
  height: 200%;
  max-width: 200%;
  max-height: 200%;
  transform: translate3d(-50%,-50%,0);
    z-index:1;
    object-fit: cover;
}


@media (max-width: 680px)
{
    [collection-single] {
        padding:50px 0;
        min-height: 0;
    }

    [collection-single] [collection-single-content] {
        max-width: 80%;
        position: relative;
        top:0;
        left: 0;
        transform: none;
        margin:0 auto;
    }
    
    [collection-single] [collection-single-content] [collection-single-content-item] {
        display:block;
        padding: 30px 20px 20px;
    }
    
    [collection-single] [collection-single-content] [collection-single-content-item] [collection-single-content-item-infos] {
        align-items:flex-start;
    }
    
    [collection-single] [favicon] {
      height: 20px;
    }
    
    [collection-single] [cta] {
        margin-left: 35px;
    }

}









[collection-row],
[collection-featured],
[collection-categories]{
    padding:0 50px;
}

[collection-featured] {
    padding:20px 50px 0;
}

[collection-featured] [button] {
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 11px;
}

    
[collection-row] {
    padding-top:30px;
}

@media (max-width: 1920px)
{
    [collection-featured] {
        padding:20px 0 0;
    }
    
    [collection-featured] [hl][push] {
        padding:0 50px;
    }
    
    [collection-featured] .swiper {
        padding-right:50px;
        padding-left:50px;
    }
}

@media (max-width: 1000px)
{
    
    [collection-row],
    [collection-categories]{
        padding:0 30px;
    }
    


}

@media (max-width: 800px)
{
    
    [collection-featured] [hl][push] {
        padding:0 30px;
    }

    [collection-featured] .swiper {
        padding-right:30px;
        padding-left:30px;
    }
}



/* Toggle Switch
__________________________________________________________*/


.toggle-switch {
  display: inline-block;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.toggle-switch i {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 26px;
    background-color: var(--bg-color-featured);
    border-radius: 23px;
    vertical-align: text-bottom;
    transition: all 0.3s linear;
}

.toggle-switch.alt i {
	background-color: var(--bg-color);
}


    body.dark .toggle-switch i {
        background-color: rgba(0,0,0,1.00);
    }



    .toggle-switch.sm i {
        width: 38px;
        height: 18px;
    }



.toggle-switch i::before {
    content: "";
    position: absolute;
    left: 0;
    width: 42px;
    height: 22px;
    background-color: var(---bg-color-alt);
    border-radius: 11px;
    transform: translate3d(2px, 2px, 0) scale3d(1, 1, 1);
    transition: all 0.25s linear;
}

.toggle-switch.alt i::before {
	background-color: var(--bg-color);
}


    body.dark .toggle-switch i::before {
        background-color: rgba(0,0,0,1.00);
    }



    .toggle-switch.sm i::before {
        width: 34px;
        height: 14px;
    }


.toggle-switch i::after {
  content: "";
  position: absolute;
  left: 0;
  width: 22px;
  height: 22px;
  background-color: #fff;
  border-radius: 11px;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.24);
  transform: translate3d(2px, 2px, 0);
  transition: all 0.2s ease-in-out;
}


    .toggle-switch.sm i::after {
      width: 14px;
      height: 14px;
    }

.toggle-switch:active i::after {
  width: 28px;
  transform: translate3d(2px, 2px, 0);
}

.toggle-switch:active input:checked + i::after { transform: translate3d(7px, 2px, 0); }

.toggle-switch input { display: none!important; }

.toggle-switch input:checked + i { background-color: var(--main-color); }

.toggle-switch input:checked + i::before { transform: translate3d(18px, 2px, 0) scale3d(0, 0, 0); }

.toggle-switch input:checked + i::after { transform: translate3d(22px, 2px, 0); }

.bubble-wrap {
    overflow: hidden;
    height: 350px; /* Adjust the height as needed */
    position: absolute;
    width:100%;
    top:-100px;
}

.bubbles {
  position: relative;
  background: salmon;
}

.bubble {
  position: absolute;
  width: 152px;
  height: 152px;
  border-radius: 50%;
  box-shadow: 
    0 15px 35px rgba(0, 0, 0, 0.1),
    0 3px 10px rgba(0, 0, 0, 0.1);
  background-image: url(../img/web/logos.png);
  background-size: 1076px 1076px;
}


.bubble:after {
    position: absolute;
    width: 64%;
    height: 12%;
    left: 18%;
    border-radius: 50%;
    z-index: -1;
    bottom: 0%;
    content: "";
    box-shadow: 0 60px 30px rgba(0,0,0,0.15);
}
body.dark-mode .bubble:after {
    display:none;
}



.logo1 { background-position:   0      0; }
.logo2 { background-position:  -154px  0; }
.logo3 { background-position:  -308px  0; }
.logo4 { background-position:  -462px  0; }
.logo5 { background-position:  -616px  0; }
.logo6 { background-position:  -770px  0; }
.logo7 { background-position:  -924px  0; }
.logo8 { background-position:   0     -154px; }
.logo9 { background-position:  -154px -154px; }
.logo10 { background-position: -308px -154px; }
.logo11 { background-position: -462px -154px; }
.logo12 { background-position: -616px -154px; }
.logo13 { background-position: -770px -154px; }
.logo14 { background-position: -924px -154px; }
.logo15 { background-position:  0     -308px; }
.logo16 { background-position: -154px -308px; }
.logo17 { background-position: -308px -308px; }
.logo18 { background-position: -462px -308px; }
.logo19 { background-position: -616px -308px; }
.logo20 { background-position: -770px -308px; }
.logo21 { background-position: -924px -308px; }
.logo22 { background-position:  0     -462px; }
.logo23 { background-position: -154px -462px; }
.logo24 { background-position: -308px -462px; }
.logo25 { background-position: -462px -462px; }
.logo26 { background-position: -616px -462px; }
.logo27 { background-position: -770px -462px; }
.logo28 { background-position: -924px -462px; }
.logo29 { background-position:  0     -616px; }
.logo30 { background-position: -154px -616px; }
.logo31 { background-position: -308px -616px; }
.logo32 { background-position: -462px -616px; }
.logo33 { background-position: -616px -616px; }



@media (max-width: 1050px) {

    .bubble-wrap {
        bottom:auto;
        top:-100px;
    }

}




/* 
Hover Menu
__________________________________________________________*/

[hover-menu] {
    position: relative;
}

[hover-menu] > ul > li {
    position: relative;
    z-index:10;
}

[hover-menu] > ul > li [hover-menu-content] {
    position: absolute;
    padding:10px;
    left:50%;
    top:0;
    transform: translate3d(-55%,45px,0);
    width:auto;
    z-index:10;
    opacity:0;
    transition: all 0.2s;
    min-width:250px;
    pointer-events: none;
}


[hover-menu] > ul > li.next [hover-menu-content] {
    transform: translate3d(-45%,45px,0);
}


[hover-menu] > ul > li.hover [hover-menu-content] {
    opacity:1;
    transform: translate3d(-50%,45px,0);
    overflow-x:visible;
    pointer-events: all;
}


    [hover-menu] > ul > li [hover-menu-content] > ul {
        display:block;
    }

        [hover-menu] > ul > li [hover-menu-content] > ul > li {
            flex-shrink:0;
        }

             [hover-menu] > ul > li [hover-menu-content] > ul > li.w100 {
                width:100%;
                }

            [hover-menu] > ul > li [hover-menu-content] > ul > li > a {
                color:var(--text-color);
                padding:7px 10px;
                display:flex;
                align-items: center;
                font-size: 13px;
                font-weight: 500;
                border-radius: .5rem;
            }

            [hover-menu] > ul > li [hover-menu-content] > ul > li > a:hover {
                background-color:var(--bg-color-alt);
            }

            [hover-menu] > ul > li [hover-menu-content] > ul > li > a[active] {
                color: var(--main-color-alt);
            }

            [hover-menu] > ul > li [hover-menu-content] > ul > li img {
                max-width:15px;
                max-height:15px;
                margin-right:5px;
            }


[hover-menu] > [hover-menu-bg] {
    position: absolute;
    top:45px;
    z-index:1;
    transition: all 0.2s;
    transform-origin: 0 0;
    opacity:0;
    pointer-events: none;
    transform: translate3d(0,10px,0);
}

[hover-menu] > [hover-menu-bg].hover {
    opacity:1;
    transform: translate3d(0,0,0);
}

[hover-menu] > [hover-menu-bg] .content {
    position: absolute;
    width:100%;
    height: 100%;
    background-color:var(--bg-color);
    box-shadow: 0 10px 50px 0 rgba(16,24,40,.175);
    border-radius: 10px;
    padding:20px;
    top:0;
    left:50%;
    transform: translate3d(-50%,0,0);
}

[hover-menu] > [hover-menu-bg] .content:after {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #fff;
	border-width: 5px;
	margin-left: -5px;
}


@media (max-width: 1050px) {
    [hover-menu] > ul > li [hover-menu-content],
    [hover-menu] > [hover-menu-bg] {
        display:none;
    }
}





ul[faq-list] {
    
}

ul[faq-list] li {
    border-bottom:solid 1px var(--border-color);
    padding:10px 0;
}
ul[faq-list] li:hover {
    cursor:pointer;
}


ul[faq-list] li [question] {
    font-size:20px;
    font-weight: 600;
    margin-bottom:10px;
    position: relative;
}


ul[faq-list] li [question]::after {
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 12px 12px;
    background-image: url("../img/icons/arrow-down.png");
    top:50%;
    transform: translateY(-50%);
    right:10px;
}

ul[faq-list] li.open [question]::after {
    transform: translateY(-50%) scaleY(-1);
}


ul[faq-list] li [answer] {
    color: var(--text-color-alt);
    line-height: 1.6;
    margin: 0 0 20px;
    display:none;
}



/* Display
__________________________________________________________*/


[flex] {
    display:flex;
}
[flex-wrap] {
    flex-wrap: wrap;
}
[inline-flex] {
    display:inline-flex;
}
[align-items-center] {
    align-items: center;
}

[justify-content-center] {
    justify-content: center;
}

[justify-content-space-around] {
    justify-content: space-around;
}

[justify-content-space-between] {
    justify-content: space-between;
}
[flex-shink-0] {
    flex-shrink: 0;
}
[gap-1] {
    gap:1px;
}
[gap-2] {
    gap:2px;
}
[gap-3] {
    gap:3px;
}
[gap-4] {
    gap:4px;
}
[gap-5] {
    gap:5px;
}
[gap-6] {
    gap:6px;
}
[gap-7] {
    gap:7px;
}
[gap-8] {
    gap:8px;
}
[gap-9] {
    gap:9px;
}
[gap-10] {
    gap:10px;
}
[gap-11] {
    gap:11px;
}
[gap-12] {
    gap:12px;
}
[gap-13] {
    gap:13px;
}
[gap-14] {
    gap:14px;
}
[gap-15] {
    gap:15px;
}



/* Divider
__________________________________________________________*/

[divider] {
	position: relative;
	display:flex;
	align-items:center;
	gap:20px;
	font-size:16px;
	font-weight: 600;
}


[divider] > div {
	flex-shrink: 0;
}

[divider][center]::before {
  position: relative;
  content: "";
  background-color: var(--border-color);
  width: 100%;
  height: 1px;
  z-index: 5;
}
[divider]::after {
  position: relative;
  content: "";
  background-color: var(--border-color);
  width: 100%;
  height: 1px;
  z-index: 5;
}


/* Media Grid
__________________________________________________________*/

[media-grid] {
    display: grid;
    grid-gap: 10px;
    background-color: var(--bg-color);
    color: #444;
    margin-bottom:30px;
    margin-top:100px;
}

    [media-grid] [item] {
        position: relative;
        border-radius: 10px;
        font-size: 150%;
        overflow: hidden;
    }

    [media-grid][media-grid-3] {
        grid-template-columns: repeat(2, 1fr); /* Assuming 3 columns */
    }

    [media-grid] [item] img {
        object-fit: cover;
        width:100%;
        height: 100%;
    }


    [media-grid][media-grid-3] [item]:nth-child(1) {
        grid-column: 1; /* Span from column 1 to column 4 (75%) */
        grid-row: 1 / 4; /* Span 3 rows */
    }

    [media-grid][media-grid-3] [item]:nth-child(2) {
        grid-column: 2; /* Start from column 4 */
        grid-row: 1 / 2; /* Span first row */
    }

    [media-grid][media-grid-3] [item]:nth-child(3) {
        grid-column: 2; /* Start from column 4 */
        grid-row: 2 / 4; /* Span the remaining two rows */
    }


    [media-grid][media-grid-4] [item]:nth-child(1) {
        grid-column: 1;
        grid-row: 1;
    }
    [media-grid][media-grid-4] [item]:nth-child(2) {
        grid-column: 2 ;
        grid-row: 1;
    }
    [media-grid][media-grid-4] [item]:nth-child(3) {
        grid-column: 1 ;
        grid-row: 2;
    }
    [media-grid][media-grid-4] [item]:nth-child(4) {
        grid-column: 2 ;
        grid-row: 2;
    }





[media-grid] [item] img {
    transition: all 0.3s ease;
    transform: scale(1,1);
}


[media-grid]:not([skeleton]) [item]:hover img {
    transform: scale(1.1,1.1);
    filter:brightness(110%);
}

[media-grid] [item] [item-content] {
    position: absolute;
    bottom:30px;
    left: 30px;
    max-width:65%;
    z-index:20;
    color:#fff;

}


[media-grid] [item]:nth-child(2) [item-content],
[media-grid] [item]:nth-child(3) [item-content]{
    max-width: calc(100% - 60px);
}


[media-grid]:not([skeleton]) [item]::after {
  background-image: linear-gradient(21deg, rgba(0,0,0,0.65) 26%, rgba(0,0,0, 0) 51%);
  position: absolute;
  left: 0;
  bottom: 0%;
  width: 100%;
  height: 100%;
  z-index: 8;
  content: "";
}


[media-grid] [item] [title] {

    font-weight: 700;
    line-height: 1;
    font-size:40px;
    color:#fff;
    
}


[media-grid] [item] [description] {

    font-weight: 500;
    line-height: 1.3;
    font-size:16px;
    color:#fff;
    margin-top:6px;
    display:none;
    
}

[media-grid] [item] [description-truncated] {

    font-weight: 500;
    line-height: 1.3;
    font-size:16px;
    color:#fff;
    margin-top:6px;
    
}


[media-grid][media-grid-3] [item]:nth-child(2) [title],
[media-grid][media-grid-3] [item]:nth-child(3) [title] {
    font-size:26px;
}


[media-grid] [blogpost-author] {
    display:flex;
    gap:20px;
    align-items: center;
    padding-top:5px;
    line-height: 1.4;
    display:none;
    border-top: solid 1px var(--border-color);
    padding-top: 10px;
    margin-top: 5px;
}

[media-grid] [blogpost-author] > div {
    display:flex;
    align-items: center;
    gap:8px;
}

[media-grid] [blogpost-author] img {
    width:20px;
    height: 20px;
    border-radius:50%;
    object-fit: cover;
    object-position: center;
}

[media-grid] [blogpost-author] [name] {
    font-weight: 600;
    margin-bottom:0;
    font-size:13px;
}

[media-grid] [blogpost-author] [details] {
    font-size:12px;
}

@media (max-width: 1300px) {
    [media-grid] [item] [description-truncated] {
        display:none;
    }
    
    [media-grid][media-grid-3] [item]:nth-child(1) [description-truncated]{
        display:block;
    }
    
    
    [media-grid][media-grid-3] [item]:nth-child(2) [description],
    [media-grid][media-grid-3] [item]:nth-child(3) [description]{
        display:block;
        color:var(--text-color);
        display:none;
    }
}


@media (max-width: 1000px) {
    
    
    [media-grid][media-grid-3] [item]:nth-child(1) {
        grid-column: 1 / 3; /* Span from column 1 to column 4 (75%) */
        grid-row: 1; /* Span 3 rows */
    }

    [media-grid][media-grid-3] [item]:nth-child(2) {
        grid-column: 1 / 2; /* Start from column 4 */
        grid-row: 2; /* Span first row */
    }

    [media-grid][media-grid-3] [item]:nth-child(3) {
        grid-column: 2; /* Start from column 4 */
        grid-row: 2; /* Span the remaining two rows */
    }
    
    
    [media-grid] [item]:hover img {
        transform: scale(1,1);
        filter: brightness(100%);
    }
    
    
    
    

    
    
    

    
}


@media (max-width: 800px) {
    
    [media-grid] [item]:nth-child(2)::after,
    [media-grid] [item]:nth-child(3)::after{
        display:none;
    }
    
    
    [media-grid][media-grid-3] [item]:nth-child(2),
    [media-grid][media-grid-3] [item]:nth-child(3){
        display:grid;   
        margin-top:15px;
    }
    
    

    [media-grid][media-grid-3] [item]:nth-child(2) [item-content],
    [media-grid][media-grid-3] [item]:nth-child(3) [item-content]{
        position: relative;
        bottom:auto;
        left: auto;
        max-width:100%;
        z-index:20;
        color:var(--text-color);
        order:2;
        

    }

    [media-grid][media-grid-3] [item]:nth-child(2) [title],
    [media-grid][media-grid-3] [item]:nth-child(3) [title]{
        color:var(--text-color);
        margin:15px 0;
    }

    [media-grid] [item] img {
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }
    

    [media-grid][media-grid-3] [item]:nth-child(1) [description-truncated]{
        display:block;
    }
    
    
    [media-grid][media-grid-3] [item]:nth-child(2) [description],
    [media-grid][media-grid-3] [item]:nth-child(3) [description]{
        color:var(--text-color);
        display:block;
    }
    
}


@media (max-width: 660px) {
    
    [media-grid] {
        margin-top:80px;
        display:block;
    }
    
    [media-grid][media-grid-3] {
        grid-template-columns: repeat(1, 1fr); /* Assuming 3 columns */
    }
    
    [media-grid] [item]::after {
        display:none;
    }
    
    [media-grid][media-grid-3] [item] {
        display:flex;   
        flex-wrap: wrap;
        margin-top:15px;
    }
    
    [media-grid][media-grid-3] [item] > img{
        order:1;
        flex: 0 0 100%;
        transform: scale(1,1)!important;
    }
    
    
    
    [media-grid][media-grid-3] [item] [item-content]{
        position: relative;
        bottom:auto;
        left: auto;
        max-width:100%;
        z-index:20;
        color:var(--text-color);
        order:2;
        flex: 0 0 100%;
    }
    
    [media-grid] [blogpost-author] {
        display:flex;
        margin-bottom:15px;
    }
    
    [media-grid][media-grid-3] [item] [title]{
        color:var(--text-color);
        margin:15px 0;  
        font-size: 40px!important;
    }
    
    [media-grid][media-grid-3] [item] [description-truncated]{
        display:none!important;
    }

    
    [media-grid][media-grid-3] [item] [description]{
        color:var(--text-color);
        display:block;
        line-height: 1.6;
        font-size:18px;
    }
    
    
    [media-grid][media-grid-3] [item]:nth-child(2) {
        grid-column: 1 / 3; /* Start from column 4 */
        grid-row: 2; /* Span first row */
    }

    [media-grid][media-grid-3] [item]:nth-child(3) {
        grid-column: 1 / 3; /* Start from column 4 */
        grid-row: 3; /* Span the remaining two rows */
    }
    
}









[input] {
    margin-bottom: 30px;
}

[input] [title] {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 14px;
}



/* Form and Inputs
__________________________________________________________*/

input,select,textarea {
    font-family:var(--main-font);
    border:solid 2px var(--border-color);
    background-color:var(--bg-color);
    font-size:16px;
    border-radius:10px;
    padding:15px 20px;
    display:block;
    color:var(--text-color);
}


input[type="checkbox"],
input[type="radio"]{
    display:inline-block;
}




/* Multi Preview Upload

__________________________________________________________*/


[multi-prevew-upload] [files] {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	width: 100%;
}

[multi-prevew-upload] [files] > li {
	flex: 0 0 auto;
	width: 33.3333333333%;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

/* MD */
@media (max-width: 1200px) {

	[multi-prevew-upload] [files] > li {
		width: 50%;
	}
	
}

/* MD */
@media (max-width: 992px) {

	[multi-prevew-upload] [files] > li {
		width: 100%;
	}
	
}


[multi-prevew-upload] [files] > li > div {
	background-color: var(--bg-color);
	border:solid 1px var(--border-color);
	padding:30px;
	margin-bottom:10px;
	
	box-shadow: 0 0 2px 0 rgba(0,0,0,.15),0 0 50px 0 rgba(16,24,40,.05);

	border-radius:10px;
	overflow: hidden;
	position: relative;
	
}

[multi-prevew-upload] [files] > li > div img {
	height: 100px;
}


[multi-prevew-upload] [files] > li.upload > div {
	height:230px;
	position: relative;
	background-color:var(--main-color);
}

	[multi-prevew-upload] [files] > li.upload > div:hover {
		filter: brightness(115%);
		cursor:pointer;
	}

	[multi-prevew-upload] [files] > li.upload > div > div {
		position: absolute;
		top:50%;
		left: 50%;
		transform: translate3d(-50%,-50%,0);
		pointer-events: none;
		color:#fff;
		font-size:12px;
		font-weight: 600;
	}

		[multi-prevew-upload] [files] > li.upload > div > div > i {
			font-size:40px;
			margin-bottom:5px;
		}


[multi-prevew-upload] [files] > li > div > .title {
	text-align: center;
	font-weight: 600;
	font-size:12px;
}

[multi-prevew-upload] [files] > li > div > .button[remove] {
	background-color:rgba(0, 0, 0, 0.075);
	border:0;
	font-size:11px;
	margin-top:15px;
}

	[multi-prevew-upload] [files] > li > div > .button[remove]:hover {
		background-color:rgba(0, 0, 0, 0.15);
	}



@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
[clock] {
  width: 24px;
  height: 24px;
  background-color: rgba(0, 0, 0, 0);
  box-shadow: inset 0px 0px 0px 2px #333;
  border-radius: 50%;
  position: relative;
}
[clock]:after,
[clock]:before {
  position: absolute;
  content: "";
  transform-origin: 1px 1px;
  background-color: #333;
  height: 2px;
  top: 11px;
  left: 11px;
}
[clock]:before {
  width: 10px;
  animation: spin 2000ms linear infinite;
}
[clock]:after {
  width: 8px;
  animation: spin 8000ms linear infinite;
}


[clock][white] {
    box-shadow: inset 0px 0px 0px 2px #fff;
}
[clock][white]:after,
[clock][white]:before {
    background-color: #fff;
}



/*
================================================================================================
STICKY
================================================================================================
*/	

.sticky-container {
	overflow: hidden;
	position: relative;
}
	
.sticky {
	position: relative;
	z-index:10;
}		
	
.sticky.sticked {
	position: fixed;
	transform: translate3d(0,0,0);
}	
.sticky.absolute {
	position: absolute;
}	

.sticky-placeholder {

}	


/* Breakpoint XL */
@media (max-width: 1200px)
{
	.sticky {
		background-color:var(--bg-color);
		left:0;
		width:100%;
	}
	
	.sticky.sticked {
		padding:0;
	}
	
}