@media (min-width: 1200px) {
    * {
        -ms-overflow-style:-ms-autohiding-scrollbar;
        scrollbar-width: thin;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch
    }

    .scroll-style::-webkit-scrollbar {
        width: 8px;
        background-color: #bebebe
    }

    .scroll-style::-webkit-scrollbar-thumb {
        background-color: #8a8b94
    }

    .scroll-style::-webkit-scrollbar-thumb:hover {
        background-color: #9cb9fd
    }

    .scroll-style *::-webkit-scrollbar {
        width: 8px;
        background-color: #bebebe
    }

    .scroll-style *::-webkit-scrollbar-thumb {
        background-color: #8a8b94
    }

    .scroll-style *::-webkit-scrollbar-thumb:hover {
        background-color: #9cb9fd
    }
}

@keyframes slider {
	0%,30%,to {
		opacity: 0
	}
	
	24%,6% {
		opacity: 1
	}
}

@keyframes bounce {
	0%,to {
		transform: translateY(-5px)
	}
	
	50% {
		transform: translateY(5px)
	}
}

@keyframes rotate {
	to {
		transform: rotate(360deg)
	}
}

*,:after,:before {
	box-sizing: border-box
}

body {
	background-color: #f5f5f5;
	color: #000000;
	font: 13px Inter, Helvetica, Arial, sans-serif;
	height: 100vh;
	margin: auto;
	overflow-x: hidden;
	overflow-y: auto;
	width: 100vw
}

a {
	background-color: transparent;
	color: #2d2c2c;
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
}

a:hover {
	color: #505050;
}

p {
	font-size: 13px;
	margin-bottom: 0;
	margin-top: 0
}

hr {
	margin: 10px 0
}

img {
	border-style: none;
	vertical-align: middle
}

pre {
	background-color: var(--addon-color);
	color: var(--addon-text);
	font-size: 15px;
	margin: 0;
	overflow-x: auto;
	padding-left: 10px;
	padding-right: 10px;
	white-space: pre
}

blockquote {
	border-left: 5px solid var(--addon-color);
	font-size: 17px;
	margin: auto;
	padding-left: 5px
}

ol,ul {
	margin-bottom: auto;
	margin-top: auto
}

button,input,select,textarea {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit
}

h1,h2,h3,h4,h5,h6 {
	font-weight: 600;
	margin: 0
}

h1 {
	font-size: 20px
}

h2 {
	font-size: 18px
}

h3 {
	font-size: 16px
}

h4 {
	font-size: 14px
}

h5 {
	font-size: 12px
}

h6 {
	font-size: 10px
}

.text-left {
	text-align: left!important
}

.text-right {
	text-align: right!important
}

.text-center {
	text-align: center!important
}

.text-justify {
	text-align: justify!important
}

.text-lowercase {
	text-transform: lowercase!important
}

.text-uppercase {
	text-transform: uppercase!important
}

.text-capitalize {
	text-transform: capitalize!important
}

.text-line {
	text-decoration: line-through!important
}

.text-overline {
	text-decoration: overline!important
}

.text-underline {
	text-decoration: underline!important
}

.float-left {
	float: left!important
}

.float-right {
	float: right!important
}

.float-none {
	float: none!important
}

.word-all {
	word-break: break-all!important
}

.word-word {
	word-break: break-word!important
}

.word-normal {
	word-break: normal!important
}

.white-pre {
	white-space: pre!important
}

.white-nowrap {
	white-space: nowrap!important
}

.white-normal {
	white-space: normal!important
}

.vertical-middle {
	vertical-align: middle!important
}

.vertical-top {
	vertical-align: top!important
}

.vertical-bottom {
	vertical-align: bottom!important
}

.vertical-baseline {
	vertical-align: baseline!important
}

.position-absolute {
	position: absolute!important
}

.position-relative {
	position: relative!important
}

.position-fixed {
	position: fixed!important
}

.position-static {
	position: static!important
}

.position-sticky {
	position: sticky!important
}

.overflow-hidden {
	overflow: hidden!important
}

.overflow-visible {
	overflow: visible!important
}

.overflow-auto {
	overflow: auto!important
}

.top-auto {
	top: auto!important
}

.bottom-auto {
	bottom: auto!important
}

.left-auto {
	left: auto!important
}

.right-auto {
	right: auto!important
}

.top-0 {
	top: 0!important
}

.bottom-0 {
	bottom: 0!important
}

.left-0 {
	left: 0!important
}

.right-0 {
	right: 0!important
}

.margin-auto {
	margin: auto!important
}

.margin-top-auto {
	margin-top: auto!important
}

.margin-bottom-auto {
	margin-bottom: auto!important
}

.margin-left-auto {
	margin-left: auto!important
}

.margin-right-auto {
	margin-right: auto!important
}

.margin-0 {
	margin: 0!important
}

.margin-top-0 {
	margin-top: 0!important
}

.margin-bottom-0 {
	margin-bottom: 0!important
}

.margin-left-0 {
	margin-left: 0!important
}

.margin-right-0 {
	margin-right: 0!important
}

.padding-0 {
	padding: 0!important
}

.padding-top-0 {
	padding-top: 0!important
}

.padding-bottom-0 {
	padding-bottom: 0!important
}

.padding-left-0 {
	padding-left: 0!important
}

.padding-right-0 {
	padding-right: 0!important
}

.background-color-transparent {
	background-color: transparent!important
}

.border-color-transparent {
	border-color: transparent!important
}

.color-transparent {
	color: transparent!important
}

.background-color-inherit {
	background-color: inherit!important
}

.border-color-inherit {
	border-color: inherit!important
}

.color-inherit {
	color: inherit!important
}

.background-color-white {
	background-color: #fff!important
}

.border-color-white {
	border-color: #fff!important
}

.color-white {
	color: #fff!important
}

.background-color-black {
	background-color: #000!important
}

.border-color-black {
	border-color: #000!important
}

.color-black {
	color: #000!important
}

.display-block {
	display: block!important
}

.display-inline-block {
	display: inline-block!important
}

.display-flex {
	display: flex!important
}

.display-inline-flex {
	display: inline-flex!important
}

.display-table {
	display: table!important
}

.display-inline-table {
	display: inline-table!important
}

.display-table-row {
	display: table-row!important
}

.display-table-cell {
	display: table-cell!important
}

.display-inline {
	display: inline!important
}

.display-none {
	display: none!important
}

.visibility-visible {
	visibility: visible!important
}

.visibility-hidden {
	visibility: hidden!important
}

.rounded {
	border-radius: 5px
}

.circle {
	border-radius: 50%
}

.thumbnail {
	border: 5px solid var(--addon-color);
	border-radius: 5px;
	padding: 5px
}

.roll {
	display: flex;
	margin-left: -10px;
	margin-right: -10px;
	overflow-x: auto;
	padding-left: 5px;
	padding-right: 5px
}

.row {
	display: block;
	font-size: 0;
	margin-left: -5px;
	margin-right: -5px;
	margin-bottom: 30px;
	margin-top: 30px;
}

.roll>.col-1,.roll>.col-1-lg,.roll>.col-1-sm,.roll>.col-10,.roll>.col-10-lg,.roll>.col-10-sm,.roll>.col-11,.roll>.col-11-lg,.roll>.col-11-sm,.roll>.col-12,.roll>.col-12-lg,.roll>.col-12-sm,.roll>.col-2,.roll>.col-2-lg,.roll>.col-2-sm,.roll>.col-3,.roll>.col-3-lg,.roll>.col-3-sm,.roll>.col-4,.roll>.col-4-lg,.roll>.col-4-sm,.roll>.col-5,.roll>.col-5-lg,.roll>.col-5-sm,.roll>.col-6,.roll>.col-6-lg,.roll>.col-6-sm,.roll>.col-7,.roll>.col-7-lg,.roll>.col-7-sm,.roll>.col-8,.roll>.col-8-lg,.roll>.col-8-sm,.roll>.col-9,.roll>.col-9-lg,.roll>.col-9-sm {
	padding-left: 5px;
	padding-right: 5px
}

.row>.col-1,.row>.col-1-lg,.row>.col-1-sm,.row>.col-10,.row>.col-10-lg,.row>.col-10-sm,.row>.col-11,.row>.col-11-lg,.row>.col-11-sm,.row>.col-12,.row>.col-12-lg,.row>.col-12-sm,.row>.col-2,.row>.col-2-lg,.row>.col-2-sm,.row>.col-3,.row>.col-3-lg,.row>.col-3-sm,.row>.col-4,.row>.col-4-lg,.row>.col-4-sm,.row>.col-5,.row>.col-5-lg,.row>.col-5-sm,.row>.col-6,.row>.col-6-lg,.row>.col-6-sm,.row>.col-7,.row>.col-7-lg,.row>.col-7-sm,.row>.col-8,.row>.col-8-lg,.row>.col-8-sm,.row>.col-9,.row>.col-9-lg,.row>.col-9-sm {
	padding-bottom: 10px;
	padding-left: 5px;
	padding-right: 5px
}

.col-1-lg,.col-1-sm,.col-10-lg,.col-10-sm,.col-11-lg,.col-11-sm,.col-12-lg,.col-12-sm,.col-2-lg,.col-2-sm,.col-3-lg,.col-3-sm,.col-4-lg,.col-4-sm,.col-5-lg,.col-5-sm,.col-6-lg,.col-6-sm,.col-7-lg,.col-7-sm,.col-8-lg,.col-8-sm,.col-9-lg,.col-9-sm {
	display: inline-block;
	font-size: 13px;
	font-weight: 400;
	max-width: 100%;
	min-height: 1px;
	min-width: 100%;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	vertical-align: top;
	white-space: normal;
	width: 100%;
	word-break: normal
}

.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9 {
	display: inline-block;
	font-size: 13px;
	font-weight: 400;
	min-height: 1px;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	vertical-align: top;
	white-space: normal;
	word-break: normal
}

.col-12 {
	max-width: 100%!important;
	min-width: 100%!important;
	width: 100%!important
}

.col-11 {
	max-width: 91.66666667%!important;
	min-width: 91.66666667%!important;
	width: 91.66666667%!important
}

.col-10 {
	max-width: 83.33333333%!important;
	min-width: 83.33333333%!important;
	width: 83.33333333%!important
}

.col-9 {
	max-width: 75%!important;
	min-width: 75%!important;
	width: 75%!important
}

.col-8 {
	max-width: 66.66666667%!important;
	min-width: 66.66666667%!important;
	width: 66.66666667%!important
}

.col-7 {
	max-width: 58.33333333%!important;
	min-width: 58.33333333%!important;
	width: 58.33333333%!important
}

.col-6 {
	max-width: 50%!important;
	min-width: 50%!important;
	width: 50%!important
}

.col-5 {
	max-width: 41.66666667%!important;
	min-width: 41.66666667%!important;
	width: 41.66666667%!important
}

.col-4 {
	max-width: 33.33333333%!important;
	min-width: 33.33333333%!important;
	width: 33.33333333%!important
}

.col-3 {
	max-width: 25%!important;
	min-width: 25%!important;
	width: 25%!important
}

.col-2 {
	max-width: 16.66666667%!important;
	min-width: 16.66666667%!important;
	width: 16.66666667%!important
}

.col-1 {
	max-width: 8.33333333%!important;
	min-width: 8.33333333%!important;
	width: 8.33333333%!important
}

.divider {
	background-color: var(--addon-color);
	display: block;
	height: 0px;
	margin-left: -10px;
	margin-right: -10px
}

.name {
	display: block;
	font-size: 0;
	line-height: 20px;
	min-height: 20px;
	word-break: break-word
}

.clearfix {
	display: block;
	overflow: auto
}

.clearfix:after {
	clear: both
}

.clearfix:after,.clearfix:before {
	content: '';
	display: block
}

.bold {
	font-weight: 600
}

.focus {
	opacity: .7
}

.model {
	display: block;
	font-size: 0;
	height: 20px;
	line-height: 20px;
	overflow: hidden;
	white-space: nowrap
}

.custom {
	display: none;
	font-size: 0;
	height: 0;
	margin: 0;
	opacity: 0;
	padding: 0;
	width: 0
}

.form {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: transparent;
	border: 0;
	color: inherit;
	font-size: 13px;
	line-height: 20px;
	margin: 0;
	overflow-x: hidden;
	overflow-y: auto;
	resize: vertical
}

.form:not(.small):not(.media) {
	border-radius: 10px;
	min-height: 40px;
	padding: 5px 15px 7px 15px;
	background: #a7a1a16b;
	border: rgb(209 213 219);
	transition: box-shadow .25s;
}

.form.media:not(.small) {
	min-height: 40px;
	padding: 10px 0
}

.form.small:not(.media) {
	border-radius: 5px;
	min-height: 20px;
	padding: 0 10px;
	transition: box-shadow .25s
}

.form.media.small {
	min-height: 20px;
	padding: 0
}

select.form {
	background-image: url(content/select.png);
	background-origin: content-box;
	background-position: 100%;
	background-repeat: no-repeat;
	background-size: 10px
}

.form:not(:focus):not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media) {
	background-color: #a7a1a16b !important;!i;
}

.form:focus:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media) {
	background-color: #a7a1a180 !important;!i;
}

.form:not(:focus).info {
	box-shadow: inset 0 0 5px 0 #00bcd4
}

.form:focus.info {
	box-shadow: inset 0 0 10px 0 #008fa1
}

.form:not(:focus).success {
	box-shadow: inset 0 0 5px 0 #4caf50
}

.form:focus.success {
	box-shadow: inset 0 0 10px 0 #3d8b40
}

.form:not(:focus).warning {
	box-shadow: inset 0 0 5px 0 #ff9800
}

.form:focus.warning {
	box-shadow: inset 0 0 10px 0 #cc7a00
}

.form:not(:focus).error {
	border: 1px solid #f44336;
}

.form:focus.error {
	border: 1px solid #f44336;
}

.form:not(:focus).default {
	box-shadow: inset 0 0 5px 0 #7c7c7c
}

.form:focus.default {
	box-shadow: inset 0 0 10px 0 #6c6c6c
}

.form:not(:focus).second {
	box-shadow: inset 0 0 5px 0 transparent
}

.form:focus.second {
	box-shadow: inset 0 0 10px 0 rgba(var(--focus-rgb),.1)
}

.collapse {
	margin-left: -10px;
	margin-right: -10px;
	overflow: hidden;
	padding-left: 10px;
	padding-right: 10px
}

.switch {
	border-radius: 10px;
	display: inline-block;
	height: 20px;
	position: relative;
	transition: background-color .25s;
	vertical-align: top;
	width: 40px
}

input:not(:checked)+.switch {
	background-color: #cfcfcf;
}

input:checked+.switch {
	background-color: #3fcb4a;
}

.switch:before {
	border-radius: 5px;
	content: '';
	display: block;
	height: 10px;
	position: absolute;
	top: 5px;
	transition: all .25s;
	width: 10px
}

input:not(:checked)+.switch:before {
	background-color: var(--hover-color);
	left: 5px
}

input:checked+.switch:before {
	background-color: #ffffff;
	left: 25px
}

.radio {
	border: 1px solid var(--addon-color);
	border-radius: 50%;
	display: inline-block;
	height: 20px;
	position: relative;
	vertical-align: top;
	width: 20px
}

.radio:before {
	background-color: var(--addon-color);
	border-radius: 50%;
	content: '';
	display: block;
	height: 16px;
	left: 1px;
	position: absolute;
	top: 1px;
	transition: all .25s;
	width: 16px
}

.half {
	max-height: 50%;
	max-width: 50%
}

.full {
	max-height: 100%;
	max-width: 100%
}

.caption {
	background-color: rgba(var(--focus-rgb),.5);
	bottom: 0;
	color: var(--focus-text);
	display: block;
	left: 0;
	padding: 10px;
	position: absolute;
	width: 100%;
	z-index: 1000
}

.check {
	display: inline-block;
	position: relative;
	vertical-align: top
}

.center {
	display: block;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%)
}

.carousel {
	display: block;
	height: 100%;
	overflow: hidden;
	position: relative;
	width: 100%
}

.carousel>.carousel-item {
	height: 100%;
	transition: left .25s;
	width: 100%
}

.carousel>.carousel-item:not(.next),.carousel>.carousel-item:not(.prev) {
	position: relative
}

.carousel>.carousel-item.next,.carousel>.carousel-item.prev {
	display: block;
	position: absolute;
	top: 0
}

.carousel>.carousel-item.active:not(.left):not(.right),.carousel>.carousel-item.next.left,.carousel>.carousel-item.prev.right {
	left: 0
}

.carousel>.carousel-item.active.left,.carousel>.carousel-item.prev:not(.right) {
	left: -100%
}

.carousel>.carousel-item.active.right,.carousel>.carousel-item.next:not(.left) {
	left: 100%
}

.indicator {
	background-image: radial-gradient(circle,#00000080 0,#0000 75%);
	color: #fff;
	cursor: pointer;
	display: block;
	height: 40px;
	margin-top: -20px;
	position: absolute;
	text-align: center;
	top: 50%;
	width: 40px
}

.indicator:before {
	display: block;
	font: 24px/40px Material-Design-Iconic-Font
}

.indicator:not(.next) {
	left: 10px
}

.indicator:not(.next):before {
	content: '\f2fa'
}

.indicator.next {
	right: 10px
}

.indicator.next:before {
	content: '\f2fb'
}

.checkbox {
	border: 1px solid var(--addon-color);
	border-radius: 5px;
	display: inline-block;
	height: 20px;
	position: relative;
	vertical-align: top;
	width: 20px
}

.checkbox:before {
	background-color: var(--addon-color);
	border-radius: 4px;
	color: var(--addon-text);
	content: '\f26b';
	display: block;
	font: 18px/20px Material-Design-Iconic-Font;
	height: 20px;
	left: -1px;
	position: absolute;
	text-align: center;
	top: -1px;
	transition: all .25s;
	width: 20px
}

.inner {
	display: block;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative;
	width: 100%
}

.alert.media {
	display: block;
	padding-bottom: 10px;
	padding-top: 10px
}

.alert:not(.media) {
	border-radius: 10px;
	display: block;
	padding: 0 10px 0 5px;
	transition: all .25s
}

.alert.hover:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):not(.active):not(:hover),.alert:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):not(.active):not(.hover):not(a),a.alert:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):not(.active):not(:hover) {
	background-color: #2a2a2a;
	border-left: 2px solid #6e84f5;
	color: #ffffff;
}

.alert.active:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media),.alert.hover:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):hover,a.alert:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):hover {
	background-color: #2a2a2aed;
	border-left: 2px solid var(--addon-color);
	color: #ffffff;
}

.alert.info:not(.active) {
	background-color: #00bcd4;
	border-left: 5px solid #008fa1;
	color: #fff
}

.alert.hover.info:hover,.alert.info.active,a.alert.info:hover {
	background-color: #008fa1;
	border-left: 5px solid #00bcd4;
	color: #fff
}

.alert.success:not(.active) {
	background-color: #4caf50;
	border-left: 5px solid #3d8b40;
	color: #fff
}

.alert.hover.success:hover,.alert.success.active,a.alert.success:hover {
	background-color: #3d8b40;
	border-left: 5px solid #4caf50;
	color: #fff
}

.alert.warning:not(.active) {
	background-color: #ff9800;
	border-left: 5px solid #cc7a00;
	color: #fff
}

.alert.hover.warning:hover,.alert.warning.active,a.alert.warning:hover {
	background-color: #cc7a00;
	border-left: 5px solid #ff9800;
	color: #fff
}

.alert.error:not(.active) {
	background-color: #f44336;
	border-left: 5px solid #ea1c0d;
	color: #fff
}

.alert.error.active,.alert.hover.error:hover,a.alert.error:hover {
	background-color: #ea1c0d;
	border-left: 5px solid #f44336;
	color: #fff
}

.alert.default:not(.active) {
	background-color: #7c7c7c;
	border-left: 5px solid #6c6c6c;
	color: #fff
}

.alert.default.active,.alert.hover.default:hover,a.alert.default:hover {
	background-color: #6c6c6c;
	border-left: 5px solid #7c7c7c;
	color: #fff
}

.alert.second:not(.active) {
	background-color: transparent;
	border-left: 5px solid rgba(var(--focus-rgb),.1);
	color: inherit
}

.alert.hover.second:hover,.alert.second.active,a.alert.second:hover {
	background-color: rgba(var(--focus-rgb),.1);
	border-left: 5px solid transparent;
	color: inherit
}

.app {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 720px
}

.fade {
	transition: all .25s
}

.fade:not(.in) {
	opacity: 0;
	visibility: hidden
}

.fade.in {
	opacity: 1;
	visibility: visible
}

.online {
	bottom: 0;
	display: block;
	position: absolute;
	right: 0
}

.handle {
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	overflow-x: hidden;
	overflow-y: auto;
	padding-left: 10px;
	padding-right: 10px;
	position: relative
}

.progress {
	background-color: var(--addon-color);
	border-radius: 5px;
	display: block;
	height: 20px;
	overflow: hidden
}

.progress>i {
	background-color: var(--hover-color);
	display: block;
	height: 100%;
	transition: width .25s;
	width: 0
}

.above,.over {
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	padding-left: 10px;
	padding-right: 10px;
}

.above:not(:first-child) {
	margin-top: 5px
}

.over:not(:first-child) {
	margin-top: 10px;
}

.above:not(:last-child) {
	margin-bottom: 5px
}

.over:not(:last-child) {
	margin-bottom: 10px;
}

.classic {
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	overflow: hidden;
	padding-left: 10px;
	padding-right: 10px
}

.classic:first-child {
	margin-top: -10px
}

.classic:last-child {
	margin-bottom: -10px
}

.popover {
	display: flex;
	max-height: 360px;
	max-width: 360px;
	padding-top: 5px;
	position: absolute
}

.popover:after {
	border-color: transparent transparent var(--color);
	border-style: solid;
	border-width: 0 5px 5px;
	content: '';
	display: block;
	height: 0;
	left: 50%;
	margin-left: -5px;
	position: absolute;
	top: 0;
	width: 0
}

.definition {
	display: block;
	height: 180px;
	margin-left: -10px;
	margin-right: -10px;
	overflow: hidden;
	position: relative
}

.definition>img {
	left: 50%;
	min-height: 100%;
	min-width: 100%;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%)
}

.definition>span {
	background-color: rgba(var(--focus-rgb),.5);
	color: var(--focus-text);
	display: block;
	font-size: 12px;
	height: 20px;
	line-height: 20px;
	max-width: calc(100% - 20px);
	overflow: hidden;
	padding-left: 10px;
	padding-right: 10px;
	position: absolute;
	right: 10px;
	top: 10px;
	white-space: nowrap
}

.bounce {
	animation: bounce ease-in-out 1s infinite;
	display: block;
	padding-bottom: 10px;
	padding-top: 10px
}

.dropdown {
	display: flex;
	font-size: 13px;
	font-weight: 400;
	position: fixed;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	white-space: normal;
	word-break: normal;
	z-index: 1300
}

.dimension {
	display: block;
	font-size: 0;
	height: 180px;
	margin-left: auto;
	margin-right: auto;
	width: 180px
}

.dimension>i {
	cursor: pointer;
	display: inline-block;
	transition: all .25s;
	vertical-align: top
}

.dimension>i:not(.active):not(:hover) {
	background-color: var(--addon-color);
	border: 1px solid var(--hover-color)
}

.dimension>i.active,.dimension>i:hover {
	background-color: var(--hover-color);
	border: 1px solid var(--addon-color)
}

.content {
	display: block;
	margin-bottom: 10px;
	margin-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
}

.counter {
	display: block;
	position: absolute;
	right: 0;
	top: 0
}

.container {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 1440px;
}

.tooltip {
	display: flex;
	font-size: 13px;
	font-weight: 400;
	max-height: 360px;
	max-width: 360px;
	position: fixed;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	white-space: normal;
	word-break: normal;
	z-index: 1100
}

.tooltip.top {
	padding-bottom: 5px
}

.tooltip.bottom {
	padding-top: 5px
}

.tooltip.left {
	padding-right: 5px
}

.tooltip.right {
	padding-left: 5px
}

.tooltip>.tooltip-arrow {
	border-color: transparent;
	border-style: solid;
	display: block;
	height: 0;
	position: absolute;
	width: 0
}

.tooltip.top>.tooltip-arrow {
	border-top-color: var(--color);
	border-width: 5px 5px 0;
	bottom: 0;
	margin-left: -5px
}

.tooltip.bottom>.tooltip-arrow {
	border-bottom-color: var(--color);
	border-width: 0 5px 5px;
	margin-left: -5px;
	top: 0
}

.tooltip.left>.tooltip-arrow {
	border-left-color: var(--color);
	border-width: 5px 0 5px 5px;
	margin-top: -5px;
	right: 0
}

.tooltip.right>.tooltip-arrow {
	border-right-color: var(--color);
	border-width: 5px 5px 5px 0;
	left: 0;
	margin-top: -5px
}

.backdrop {
	background-color: rgba(var(--focus-rgb),.5);
	bottom: 0;
	display: block;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 1200
}

.menu {
	display: block;
	border-radius: 10px;
	padding: 0 10px 0 10px;
	transition: background-color .25s;
	margin-bottom: 5px;
}

.menu.active,.menu.hover:hover,a.menu:hover {
	background-color: rgba(var(--focus-rgb),.1);
}

.menu.active i,
.menu.hover:hover i,
a.menu:hover i {
    color: rgb(0, 0, 255);
    transition: color 0.3s ease-in-out;
}



.sidebar {
	background-color: #e9e9e9d4;
	color: var(--text);
	display: block;
	height: 100%;
	left: 0;
	max-width: 360px;
	overflow-x: hidden;
	overflow-y: auto;
	position: fixed;
	top: 0;
	width: 18%;
	z-index: 1300
}

.sidebar.fade:not(.in) {
	transform: translateX(-100%)
}

.sidebar.fade.in {
	transform: translateX(0)
}

.modal {
	display: flex;
	font-size: 13px;
	font-weight: 400;
	left: 50%;
	max-height: calc(100vh - 20px);
	max-width: 720px;
	position: fixed;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	top: 50%;
	transform: translate(-50%,-50%);
	white-space: normal;
	width: calc(100vw - 20px);
	word-break: normal;
	z-index: 1300
}

.toggle {
	display: inline-block;
	height: 20px;
	position: relative;
	vertical-align: top;
	width: 20px
}

.toggle:after,.toggle:before {
	display: block;
	font: 18px/20px Material-Design-Iconic-Font;
	left: 50%;
	position: absolute;
	text-align: center;
	top: 50%;
	transition: transform .25s
}

.toggle:before {
	content: '\f278'
}

.toggle:after {
	content: '\f273'
}

.toggle.active:before,.toggle:not(.active):after {
	transform: translate(-50%,-50%) scale(0)
}

.toggle.active:after,.toggle:not(.active):before {
	transform: translate(-50%,-50%) scale(1)
}

.figure {
	background-color: var(--color);
	border-radius: 5px;
	color: var(--text);
	display: block;
	padding: 10px
}

.tab {
	margin-left: -10px;
	margin-right: -10px;
	padding-left: 10px;
	padding-right: 10px
}

.widget {
	margin-top: 5px;
	border-radius: 10px;
	background: #ebebeb;
	border: 1px solid #0000001f;
	display: block;
	padding: 15px;
}

.navigate {
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	padding-left: 10px;
	padding-right: 10px;
	position: relative
}

.detail {
	background-color: rgba(var(--focus-rgb),.5);
	bottom: 0;
	color: var(--focus-text);
	display: block;
	font-size: 13px;
	font-weight: 400;
	left: 0;
	overflow-x: hidden;
	overflow-y: auto;
	position: fixed;
	right: 0;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	top: 0;
	white-space: normal;
	word-break: normal;
	z-index: 1300
}

.gallery {
	left: 50%;
	max-height: 100%;
	max-width: 100%;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%)
}

.forward {
	background-color: rgba(var(--focus-rgb),.1);
	border-radius: 5px;
	display: block;
	padding: 10px
}

.miniature {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 360px
}

.expand {
	background-color: rgba(var(--focus-rgb),.5);
	color: var(--focus-text);
	display: block;
	left: 0;
	padding: 10px;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1000
}

.table {
	background-color: transparent;
	border-collapse: collapse;
	border-spacing: 0;
	display: table;
	width: 100%
}

.table>tbody>tr>td,.table>tfoot>tr>td,.table>thead>tr>td {
	border: 1px solid var(--addon-color);
	padding: 9px;
	text-align: left;
	vertical-align: middle
}

.table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>th {
	background-color: rgba(var(--focus-rgb),.1);
	border: 1px solid var(--hover-color);
	font-weight: 400;
	padding: 9px;
	text-align: left;
	vertical-align: middle
}

.responsive {
	display: block;
	margin-left: -15px;
	margin-right: -15px;
	overflow-x: auto
}

.section {
	display: block;
	padding-left: 10px;
	padding-right: 10px
}

.slider {
	animation-iteration-count: infinite;
	animation-name: slider;
	animation-timing-function: linear;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	display: block;
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 100%
}

.preview {
	display: block;
	font-size: 0;
	margin-left: -11px;
	margin-right: -10px;
	margin-top: -1px
}

.preview>.preview-item {
	display: inline-block;
	margin-left: 1px;
	margin-top: 1px;
	position: relative;
	vertical-align: top
}

.preview>.preview-item:first-child:nth-last-child(4)~.preview-item:nth-child(4),.preview>.preview-item:only-child {
	width: calc(100% - 1px)
}

.preview>.preview-item:first-child:nth-last-child(2),.preview>.preview-item:first-child:nth-last-child(2)~.preview-item,.preview>.preview-item:first-child:nth-last-child(5)~.preview-item:nth-last-child(-n+2) {
	width: calc(50% - 1px)
}

.preview>.preview-item:first-child:nth-last-child(3),.preview>.preview-item:first-child:nth-last-child(3)~.preview-item,.preview>.preview-item:first-child:nth-last-child(4),.preview>.preview-item:first-child:nth-last-child(4)~.preview-item:not(:last-child),.preview>.preview-item:first-child:nth-last-child(5),.preview>.preview-item:first-child:nth-last-child(5)~.preview-item:not(:nth-last-child(-n+2)),.preview>.preview-item:first-child:nth-last-child(6),.preview>.preview-item:first-child:nth-last-child(6)~.preview-item,.preview>.preview-item:first-child:nth-last-child(7)~.preview-item:nth-last-child(-n+3) {
	width: calc(33.33333333% - 1px)
}

.preview>.preview-item:first-child:nth-last-child(7),.preview>.preview-item:first-child:nth-last-child(7)~.preview-item:not(:nth-last-child(-n+3)),.preview>.preview-item:first-child:nth-last-child(n+8),.preview>.preview-item:first-child:nth-last-child(n+8)~.preview-item {
	width: calc(25% - 1px)
}

.preview>.preview-item>img {
	height: 100%;
	width: 100%
}

.preview>.preview-item>span {
	background-color: rgba(var(--focus-rgb),.5);
	border-radius: 5px;
	bottom: 10px;
	color: var(--focus-text);
	display: block;
	font-size: 12px;
	height: 20px;
	line-height: 20px;
	max-width: calc(100% - 20px);
	overflow: hidden;
	padding-left: 10px;
	padding-right: 10px;
	position: absolute;
	right: 10px;
	white-space: nowrap
}

.farbtastic {
	cursor: crosshair;
	display: block;
	height: 195px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	width: 195px
}

.farbtastic>.farbtastic-overlay {
	background-image: url(content/overlay.png);
	background-repeat: no-repeat;
	display: block;
	height: 101px;
	left: 47px;
	position: absolute;
	top: 47px;
	width: 101px
}

.farbtastic>.farbtastic-wheel {
	background-image: url(content/wheel.png);
	background-repeat: no-repeat;
	display: block;
	height: 195px;
	position: absolute;
	width: 195px
}

.farbtastic>.farbtastic-color {
	display: block;
	height: 101px;
	left: 47px;
	position: absolute;
	top: 47px;
	width: 101px
}

.farbtastic>.farbtastic-marker {
	background-image: url(content/marker.png);
	background-repeat: no-repeat;
	display: block;
	height: 17px;
	margin: -8.5px 0 0 -8.5px;
	position: absolute;
	width: 17px
}

.preloader {
	animation: rotate 1s linear infinite;
	border-color: var(--addon-color) var(--addon-color) transparent transparent;
	border-radius: 50%;
	border-style: solid;
	border-width: 5px;
	display: inline-block;
	height: 40px;
	vertical-align: top;
	width: 40px
}

.card {
	display: block;
	height: 360px;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative
}

.btn {
	font-size: 0;
	margin: 0;
	max-width: 100%;
	overflow: hidden;
	text-align: center;
	white-space: nowrap
}

.btn.disabled:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media),.btn.hover:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):not(.active):not(:hover),.btn:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):not(.active):not(.hover):not(a):not(button),.btn[disabled]:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media),a.btn:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):not(.active):not(:hover),button.btn:not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):not(.active):not(:hover) {
	background-image: linear-gradient(195deg, #42424a 0%, #191919 100%);
	color: #ffffff !important;!i;!;
	padding: 0 25px 0 25px;
	font-weight: 600;
	box-shadow: 0 2px 2px 0 rgba(38, 38, 38, 0.1), 0 3px 1px -2px rgba(38, 38, 38, 0.18), 0 1px 5px 0 rgba(38, 38, 38, 0.15);
}

.btn.active:not(.disabled):not([disabled]):not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media),.btn.hover:not(.disabled):not([disabled]):not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):hover,a.btn:not(.disabled):not([disabled]):not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):hover,button.btn:not(.disabled):not([disabled]):not(.info):not(.success):not(.warning):not(.error):not(.default):not(.second):not(.media):hover {
	background-image: linear-gradient(195deg, #42424a 0%, #000000 100%);
	color: #b9b9b9 !important;!i;
	padding: 0px 25px 0 25px;
	font-weight: 600;
	color: #fff;
}

.btn:not(.small):not(.media) {
	border-radius: 10px;
	height: 38px;
	line-height: 20px;
	padding: 8px 10px 10px 10px;
	transition: all .25s
}

.btn.media:not(.small) {
	background-color: transparent;
	border: 0;
	border-radius: 0;
	color: inherit;
	height: 40px;
	line-height: 20px;
	padding: 10px 0;
}

.btn.small:not(.media) {
	border-radius: 5px;
	height: 20px;
	line-height: 18px;
	padding: 0 9px;
	transition: all .25s
}

.btn.media.small {
	background-color: transparent;
	border: 0;
	border-radius: 0;
	color: inherit;
	height: 20px;
	line-height: 20px;
	padding: 0
}

.btn:not(.media):not(.small)>.zmdi:first-child,.btn:not(.media):not(.small)>img:first-child {
	margin-left: -5px
}

.btn:not(.media):not(.small)>.zmdi:last-child,.btn:not(.media):not(.small)>img:last-child {
	margin-right: -5px;
}

.btn.small:not(.media)>.zmdi:first-child,.btn.small:not(.media)>img:first-child {
	margin-left: -8px
}

.btn.small:not(.media)>.zmdi:last-child,.btn.small:not(.media)>img:last-child {
	margin-right: -8px
}

.btn:not(.small)>.zmdi {
	font-size: 24px;
	vertical-align: top
}

.btn.small>.zmdi {
	font-size: 12px;
	vertical-align: top
}

.btn:not(.media):not(.small)>.zmdi {
	line-height: 30px;
	margin-bottom: -5px;
	margin-top: -5px;
	width: 30px;
}

.btn.media:not(.small)>.zmdi {
	line-height: 40px;
	margin-bottom: -10px;
	margin-top: -10px;
	width: 40px
}

.btn:not(.media):not(.small)>img {
	height: 30px;
	margin-bottom: -5px;
	margin-top: -5px;
	vertical-align: top;
	width: 30px
}

.btn.media:not(.small)>img {
	height: 40px;
	margin-bottom: -10px;
	margin-top: -10px;
	vertical-align: top;
	width: 40px
}

.btn.small:not(.media)>.zmdi {
	line-height: 14px;
	margin-bottom: 2px;
	margin-top: 2px;
	width: 14px
}

.btn.small.media>.zmdi {
	line-height: 20px;
	width: 20px
}

.btn.small:not(.media)>img {
	height: 14px;
	margin-bottom: 2px;
	margin-top: 2px;
	vertical-align: top;
	width: 14px
}

.btn.small.media>img {
	height: 20px;
	vertical-align: top;
	width: 20px
}

.btn.info.disabled,.btn.info:not(.active),.btn.info[disabled] {
	background-color: #3e403e;
	border: 1px solid #3e403e;
	color: #fff
}

.btn.hover.info:not(.disabled):not([disabled]):hover,.btn.info:not(.disabled):not([disabled]).active,a.btn.info:not(.disabled):not([disabled]):hover,button.btn.info:not(.disabled):not([disabled]):hover {
	background-color: #2b2c2b;
	border: 1px solid #2b2c2b;
	color: #fff
}

.btn.success.disabled,.btn.success:not(.active),.btn.success[disabled] {
	background-color: #4caf50;
	border: 1px solid #4caf50;
	color: #fff
}

.btn.hover.success:not(.disabled):not([disabled]):hover,.btn.success:not(.disabled):not([disabled]).active,a.btn.success:not(.disabled):not([disabled]):hover,button.btn.success:not(.disabled):not([disabled]):hover {
	background-color: #3d8b40;
	border: 1px solid #3d8b40;
	color: #fff
}

.btn.warning.disabled,.btn.warning:not(.active),.btn.warning[disabled] {
	background-color: #ff9800;
	border: 1px solid #ff9800;
	color: #fff
}

.btn.hover.warning:not(.disabled):not([disabled]):hover,.btn.warning:not(.disabled):not([disabled]).active,a.btn.warning:not(.disabled):not([disabled]):hover,button.btn.warning:not(.disabled):not([disabled]):hover {
	background-color: #cc7a00;
	border: 1px solid #cc7a00;
	color: #fff
}

.btn.error.disabled,.btn.error:not(.active),.btn.error[disabled] {
	background-color: #ef4d42;
	border: 1px solid #ef4d42;
	color: #fff
}

.btn.error:not(.disabled):not([disabled]).active,.btn.hover.error:not(.disabled):not([disabled]):hover,a.btn.error:not(.disabled):not([disabled]):hover,button.btn.error:not(.disabled):not([disabled]):hover {
	background-color: #ea1c0d;
	border: 1px solid #ea1c0d;
	color: #fff
}

.btn.default.disabled,.btn.default:not(.active),.btn.default[disabled] {
	background-color: #7c7c7c;
	border: 1px solid #7c7c7c;
	color: #fff
}

.btn.default:not(.disabled):not([disabled]).active,.btn.hover.default:not(.disabled):not([disabled]):hover,a.btn.default:not(.disabled):not([disabled]):hover,button.btn.default:not(.disabled):not([disabled]):hover {
	background-color: #6c6c6c;
	border: 1px solid #6c6c6c;
	color: #fff
}

.btn.second.disabled,.btn.second:not(.active),.btn.second[disabled] {
	background-color: transparent;
	border: 1px solid #ffffff00;
	color: inherit;
	color: #aeaeae;
}

.btn.hover.second:not(.disabled):not([disabled]):hover,.btn.second:not(.disabled):not([disabled]).active,a.btn.second:not(.disabled):not([disabled]):hover,button.btn.second:not(.disabled):not([disabled]):hover {
	background-color: rgb(255 250 250 / 7%);
	border: 1px solid transparent;
	color: inherit
	color: #eee;
}

.fill {
	display: inline-block;
	font-size: 0;
	max-width: 100%;
	overflow: hidden;
	position: relative;
	vertical-align: top;
	white-space: nowrap
}

.justified {
	display: flex;
	position: relative
}

.fill>.btn:first-child:not(:last-child):not(.addon),.fill>.fill:first-child:not(:last-child)>.addon,.fill>.fill:first-child:not(:last-child)>.btn:last-child,.fill>.fill:first-child:not(:last-child)>.form:last-child,.fill>.form:first-child:not(:last-child):not(.addon),.justified>.btn:first-child:not(:last-child):not(.addon),.justified>.fill:first-child:not(:last-child)>.addon,.justified>.fill:first-child:not(:last-child)>.btn:last-child,.justified>.fill:first-child:not(:last-child)>.form:last-child,.justified>.form:first-child:not(:last-child):not(.addon) {
	border-bottom-right-radius: 0;
	border-top-right-radius: 0
}

.fill>.addon:not(:first-child),.fill>.btn:last-child:not(:first-child),.fill>.fill:last-child:not(:first-child)>.btn:first-child,.fill>.fill:last-child:not(:first-child)>.form:first-child,.fill>.form:last-child:not(:first-child),.justified>.addon:not(:first-child),.justified>.btn:last-child:not(:first-child),.justified>.fill:last-child:not(:first-child)>.btn:first-child,.justified>.fill:last-child:not(:first-child)>.form:first-child,.justified>.form:last-child:not(:first-child) {
	border-bottom-left-radius: 0;
	border-top-left-radius: 0
}

.fill>.btn:not(:first-child):not(:last-child):not(.addon),.fill>.fill:not(:first-child):not(:last-child)>.btn,.fill>.fill:not(:first-child):not(:last-child)>.form,.fill>.form:not(:first-child):not(:last-child):not(.addon),.justified>.btn:not(:first-child):not(:last-child):not(.addon),.justified>.fill:not(:first-child):not(:last-child)>.btn,.justified>.fill:not(:first-child):not(:last-child)>.form,.justified>.form:not(:first-child):not(:last-child):not(.addon) {
	border-radius: 0
}

.navigation {
	display: flex;
	margin-left: -10px;
	margin-right: -10px;
	overflow-x: auto
}

.navigation>.navigation-item {
	display: block;
	padding: 10px;
	position: relative;
	width: 100%
}

.navigation>.navigation-item:before {
	background-color: var(--addon-color);
	bottom: 0;
	content: '';
	display: block;
	height: 5px;
	left: 0;
	position: absolute;
	width: 100%
}

.navigation>.navigation-item:after {
	background-color: var(--hover-color);
	bottom: 0;
	content: '';
	display: block;
	height: 5px;
	position: absolute;
	transition: all .25s
}

.navigation>.navigation-item.hover:not(.active):not(:hover):after,.navigation>.navigation-item:not(.active):not(.hover):not(a):after,.navigation>a.navigation-item:not(.active):not(:hover):after {
	left: 50%;
	width: 0
}

.navigation>.navigation-item.active:after,.navigation>.navigation-item.hover:hover:after,.navigation>a.navigation-item:hover:after {
	left: 0;
	width: 100%
}

.place {
	background-color: rgba(var(--focus-rgb),.5);
	color: var(--focus-text)
}

.toolbar {
	/* background-color: rgba(var(--focus-rgb),.1); */
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	padding: 10px;
}

.control {
	display: flex;
	margin-left: -5px;
	margin-right: -5px;
}

.control>.control-right {
	display: block;
	margin-bottom: auto;
	margin-left: auto;
	margin-top: auto;
	overflow: hidden;
	padding-left: 5px;
	padding-right: 5px
}

.control>.control-block {
	display: block;
	margin: auto 5px;
	overflow: hidden;
	width: 100%
}

.control>.control-center {
	display: block;
	margin: auto;
	overflow: hidden;
	padding-left: 5px;
	padding-right: 5px
}

.control>.control-addon {
	display: block;
	margin-left: 5px;
	margin-right: 5px;
}

.control>.control-left {
	display: block;
	margin-bottom: auto;
	margin-right: auto;
	margin-top: auto;
	overflow: hidden;
	padding-left: 5px;
	padding-right: 5px
}

.impression {
	background-color: rgba(var(--focus-rgb),.5);
	border: 1px solid var(--addon-color);
	color: var(--focus-text);
	display: none;
	position: absolute
}

.impression>i {
	background-color: var(--addon-color);
	border: 1px solid var(--hover-color);
	bottom: -1px;
	cursor: se-resize;
	display: block;
	height: 5px;
	position: absolute;
	right: -1px;
	width: 5px
}

.impression>span {
	bottom: 9px;
	display: block;
	font-size: 16px;
	height: 20px;
	line-height: 20px;
	max-width: calc(100% - 18px);
	overflow: hidden;
	position: absolute;
	right: 9px;
	white-space: nowrap
}

.body {
	display: block;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	position: fixed;
	width: 100%
}

.link {
	display: inline-block;
	font-size: 0;
	vertical-align: top
}

.link.hover:not(.active):not(:hover)>span,.link:not(.active):not(.hover):not(a)>span,a.link:not(.active):not(:hover)>span {
	text-decoration: underline
}

.link.active>span,.link.hover:hover>span,a.link:hover>span {
	text-decoration: none
}

.statusbar {
	background-color: var(--addon-color);
	cursor: ns-resize;
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	padding: 4px 10px
}

.statusbar:before {
	background-color: var(--hover-color);
	content: '';
	display: block;
	height: 2px
}

.logo {
	display: block;
	font-size: 0
}

.logo>.logo-content {
	display: inline-flex;
	height: 40px;
	min-width: 40px
}

.logo>.logo-content>img {
	margin: auto;
	max-height: 40px;
	max-width: 100%
}

.envelopment {
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%
}

.envelopment>.envelopment-addon {
	background-color: rgba(26, 26, 26, 1);
	display: block;
	flex: none;
	max-height: 50%;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative
}

.envelopment>.envelopment-center {
	display: block;
	margin: auto;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative;
	width: 100%
}

.envelopment>.envelopment-content {
	display: block;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative
}

.group {
	border-radius: 10px;
	display: block;
	padding: 9px;
	transition: border .25s
}

.group.hover:not(.active):not(:hover),.group:not(.active):not(.hover):not(a),a.group:not(.active):not(:hover) {
	border: 1px solid #0000001f;
}

.group.active,.group.hover:hover,a.group:hover {
	border: 1px solid #0000001f;
}

.field {
	display: block;
	height: 100%;
	left: 0;
	overflow-x: hidden;
	overflow-y: auto;
	position: absolute;
	top: 0;
	width: 100%
}

.wrap {
	display: block;
	font-size: 0;
	margin-bottom: -5px;
	margin-right: -5px
}

.wrap>.wrap-item {
	display: inline-block;
	font-size: 13px;
	margin-bottom: 5px;
	margin-right: 5px;
	vertical-align: middle
}

.footer {
	display: block;
	margin-bottom: 10px;
	margin-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	position: sticky;
	top: 75%;
}

.codable {
	background-color: var(--addon-color);
	border: 0;
	border-radius: 0;
	color: var(--addon-text);
	display: block;
	font: 14px/20px monospace;
	margin: 0 -10px;
	min-height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 10px;
	resize: none;
	width: calc(100% + 20px)
}

.listing {
	bottom: 10px;
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	padding-left: 10px;
	padding-right: 10px;
	position: sticky;
	top: 10px
}

.dragover {
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	transition: all .25s;
	width: 100%;
	z-index: 1
}

.dragover:not(.active) {
	background-color: var(--addon-color);
	color: var(--addon-text)
}

.dragover.active {
	background-color: var(--hover-color);
	color: var(--hover-text)
}

.operation {
	bottom: 10px;
	display: block;
	position: absolute;
	right: 10px
}

.window {
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative;
	width: 100%
}

.dialog {
	background-color: rgba(var(--focus-rgb),.5);
	border-radius: 5px;
	color: var(--focus-text);
	display: block;
	padding: 10px
}

.align {
	background-color: #ffffff;
	color: #615c5c;
	display: block;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	position: absolute;
	top: 0
}

.align:not(.left):not(.right) {
	width: 100%
}

.align.left,.align.right {
	/* box-shadow: 0 0 20px 0 var(--addon-color); */
}

.align.left:not(.active) {
	left: 0;
	width: 360px
}

.align.active.left {
	left: 360px;
	width: calc(100% - 360px)
}

.align.right:not(.active) {
	right: 0;
	width: 360px
}

.align.active.right {
	right: 360px;
	width: calc(100% - 360px)
}

.align.active.left.right {
	left: 360px;
	right: 360px;
	width: calc(100% - 720px)
}

.editable {
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	min-height: 100%;
	padding: 10px
}

.editable[contenteditable=true]:empty:before {
	content: attr(data-placeholder);
	opacity: .7
}

input:not(:checked)+.checkbox:before,input:not(:checked)+.radio:before {
	opacity: 0;
	transform: scale(0)
}

input:checked+.checkbox:before,input:checked+.radio:before {
	opacity: 1;
	transform: scale(1)
}

.alert:not(.media)>.classic:first-child,.dialog>.classic:first-child,.figure>.classic:first-child,.forward>.classic:first-child,.group>.classic:first-child,.widget>.classic:first-child {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px
}

.alert:not(.media)>.classic:last-child,.dialog>.classic:last-child,.figure>.classic:last-child,.forward>.classic:last-child,.group>.classic:last-child,.widget>.classic:last-child {
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px
}

.btn>span,.link>span,.model>span,.name>span {
	display: inline;
	font-size: 14px;
	vertical-align: top;
	line-height: 19px;
	font-weight: 500;
}

.btn:not(.block),.form:not(.block) {
	display: inline-block;
	vertical-align: top
}

.btn.block,.form.block {
	display: block;
	width: 100%
}

.break,.btn.disabled,.btn[disabled],.editable[contenteditable=false],.form[disabled] {
	cursor: not-allowed;
	opacity: .5
}

.hover,button.btn:not(.disabled):not([disabled]) {
	cursor: pointer
}

.dropdown>.dropdown-content,.modal>.modal-content,.popover>.popover-content,.tooltip>.tooltip-content {
	background-color: #ffffff;
	border-radius: 10px;
	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
	color: #313131;
	display: block;
	font-weight: 700;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative;
	width: 100%;
}

.carousel>.carousel-item:not(.active):not(.next):not(.prev),.collapse:not(.active),.tab:not(.active),.window:not(.active) {
	display: none
}

.carousel>.carousel-item.active,.collapse.active,.tab.active,.window.active {
	display: block
}

*,.btn:active:focus,.btn:focus,:active,:focus,:hover,a:active,a:focus,a:hover,input:active,input:focus {
	outline: 0
}

@media (max-width:719px) {
	.dropdown {
		bottom: 0!important;
		left: 0!important;
		max-height: 75%!important;
		max-width: none!important;
		min-width: 0!important;
		right: auto!important;
		top: auto!important;
		width: 100vw!important
	}
	
	.dropdown>.dropdown-content {
		border-radius: 10px 10px 0 0;
	}
	
	.align {
		z-index: 1!important
	}
	
	.align.left {
		left: auto!important
	}
	
	.align.right {
		right: auto!important
	}
	
	.align.left,.align.right {
		box-shadow: none!important;
		width: 100%!important
	}
}

@media (min-width:720px) {
	.display-block-sm {
		display: block!important
	}
	
	.display-inline-block-sm {
		display: inline-block!important
	}
	
	.display-flex-sm {
		display: flex!important
	}
	
	.display-inline-flex-sm {
		display: inline-flex!important
	}
	
	.display-table-sm {
		display: table!important
	}
	
	.display-inline-table-sm {
		display: inline-table!important
	}
	
	.display-table-row-sm {
		display: table-row!important
	}
	
	.display-table-cell-sm {
		display: table-cell!important
	}
	
	.display-inline-sm {
		display: inline!important
	}
	
	.display-none-sm {
		display: none!important
	}
	
	.visibility-visible-sm {
		visibility: visible!important
	}
	
	.visibility-hidden-sm {
		visibility: hidden!important
	}
	
	.col-12-sm {
		max-width: 100%!important;
		min-width: 100%!important;
		width: 100%!important
	}
	
	.col-11-sm {
		max-width: 91.66666667%!important;
		min-width: 91.66666667%!important;
		width: 91.66666667%!important
	}
	
	.col-10-sm {
		max-width: 83.33333333%!important;
		min-width: 83.33333333%!important;
		width: 83.33333333%!important
	}
	
	.col-9-sm {
		max-width: 75%!important;
		min-width: 75%!important;
		width: 75%!important
	}
	
	.col-8-sm {
		max-width: 66.66666667%!important;
		min-width: 66.66666667%!important;
		width: 66.66666667%!important
	}
	
	.col-7-sm {
		max-width: 58.33333333%!important;
		min-width: 58.33333333%!important;
		width: 58.33333333%!important
	}
	
	.col-6-sm {
		max-width: 50%!important;
		min-width: 50%!important;
		width: 50%!important
	}
	
	.col-5-sm {
		max-width: 41.66666667%!important;
		min-width: 41.66666667%!important;
		width: 41.66666667%!important
	}
	
	.col-4-sm {
		max-width: 33.33333333%!important;
		min-width: 33.33333333%!important;
		width: 33.33333333%!important
	}
	
	.col-3-sm {
		max-width: 25%!important;
		min-width: 25%!important;
		width: 25%!important
	}
	
	.col-2-sm {
		max-width: 16.66666667%!important;
		min-width: 16.66666667%!important;
		width: 16.66666667%!important
	}
	
	.col-1-sm {
		max-width: 8.33333333%!important;
		min-width: 8.33333333%!important;
		width: 8.33333333%!important
	}
}

@media (min-width:1440px) {
	.display-block-lg {
		display: block!important
	}
	
	.display-inline-block-lg {
		display: inline-block!important
	}
	
	.display-flex-lg {
		display: flex!important
	}
	
	.display-inline-flex-lg {
		display: inline-flex!important
	}
	
	.display-table-lg {
		display: table!important
	}
	
	.display-inline-table-lg {
		display: inline-table!important
	}
	
	.display-table-row-lg {
		display: table-row!important
	}
	
	.display-table-cell-lg {
		display: table-cell!important
	}
	
	.display-inline-lg {
		display: inline!important
	}
	
	.display-none-lg {
		display: none!important
	}
	
	.visibility-visible-lg {
		visibility: visible!important
	}
	
	.visibility-hidden-lg {
		visibility: hidden!important
	}
	
	.col-12-lg {
		max-width: 100%!important;
		min-width: 100%!important;
		width: 100%!important
	}
	
	.col-11-lg {
		max-width: 91.66666667%!important;
		min-width: 91.66666667%!important;
		width: 91.66666667%!important
	}
	
	.col-10-lg {
		max-width: 83.33333333%!important;
		min-width: 83.33333333%!important;
		width: 83.33333333%!important
	}
	
	.col-9-lg {
		max-width: 75%!important;
		min-width: 75%!important;
		width: 75%!important
	}
	
	.col-8-lg {
		max-width: 66.66666667%!important;
		min-width: 66.66666667%!important;
		width: 66.66666667%!important
	}
	
	.col-7-lg {
		max-width: 58.33333333%!important;
		min-width: 58.33333333%!important;
		width: 58.33333333%!important
	}
	
	.col-6-lg {
		max-width: 50%!important;
		min-width: 50%!important;
		width: 50%!important
	}
	
	.col-5-lg {
		max-width: 41.66666667%!important;
		min-width: 41.66666667%!important;
		width: 41.66666667%!important
	}
	
	.col-4-lg {
		max-width: 33.33333333%!important;
		min-width: 33.33333333%!important;
		width: 33.33333333%!important
	}
	
	.col-3-lg {
		max-width: 25%!important;
		min-width: 25%!important;
		width: 25%!important
	}
	
	.col-2-lg {
		max-width: 16.66666667%!important;
		min-width: 16.66666667%!important;
		width: 16.66666667%!important
	}
	
	.col-1-lg {
		max-width: 8.33333333%!important;
		min-width: 8.33333333%!important;
		width: 8.33333333%!important
	}
}

.logo_ovo {
	 width: 95px;
}

.login_but {
	width: 100%;
}

.menu_cont {
	margin: 0 5px 0 10px;
    font-size: 20px;
}

@media (min-width: 650px) {
.sm-st {
	margin-left: 400px;
	margin-right: 200px;
}}

.menu-ico {
	margin-top: -1px;
}

.opacity-5 {
  opacity: 0.5 !important;
}

li {
	list-style-type: none;
}
.menu_text {
	margin-left: 15px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.min-menu {
	display: block;
	border-radius: 10px;
	padding: 10px;
	transition: background-color .25s;
	margin-bottom: 5px;
}

.min-menu.active,.min-menu.hover:hover,a.min-menu:hover {
	background-color: rgba(var(--focus-rgb),.1);
}

.material-symbols-rounded {
	font-size: 22px !important;!i;!;
}

.mine_menu {
	padding: 5px 5px 5px 20px;
}

@media (min-width: 719px) {
	.menumobile_icon {
	display: none !important;
}}

.minmenus {
	margin-top: 3px;
}

.minmenucol {
	color: #f32d2d;
}