* {
	outline: none;
}
html, body {
	margin: 0;
	min-height: 100vh;
	background-color: #fafafa;
	color: #000000;
	overflow: auto;
	font-family: Montserrat, sans-serif;
	font-weight: 400;
	font-size: 14px;
}

html{
	height: 100vh;
}

a {
	text-decoration: none;
	color: #25477a;
}

select {
	margin-left: -4px;
}

select:-moz-focusring { 
	color: transparent; 
	text-shadow: 0px 0px 0px #000000; 
}

input:focus:invalid, select:focus:invalid, textarea:focus:invalid {
	box-shadow: none;
}

input:invalid, select:invalid, textarea:invalid, .sphereEditable.invalid {
  box-shadow: 0 4px 5px calc(5px*-1) #ef0000;
}

div:not( '.editor' ) ul {
	margin: 0;
	padding: 0;
}

img{
	display: block;
}

table ul {
	margin: 0;
}

tr .sp-button{
	white-space: nowrap;
}

mark {
	margin: 0 -0.4em;
	padding: 0.1em 0.4em;
	border-radius: 0.8em 0.3em;
	background: transparent;
	background-image: linear-gradient(
		to right,
		rgba(255, 225, 0, 0.1),
		rgba(255, 225, 0, 0.7) 4%,
		rgba(255, 225, 0, 0.3)
	);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

.splwrapper{
	width: 100%;
	height: 100vh;
	position: fixed;
	z-index: 10000;
	background: #fafafa82;
	display: none;
}

.sploader{
	border: 5px solid #25477aab;
	border-top: 5px solid #25477a;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	animation: spin 1.5s linear infinite;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.sp-menu-item{
	color: #25477a;
	cursor: pointer;
}

.sp-menu-item:hover .sp-menu-item-nested{
	visibility: visible;
	opacity: 1;
}

.sp-menu-item-nested{
	position: absolute;
	list-style-type: none;
	padding: 15px;
	margin: 0;
	background: #fffffff7;
	visibility: hidden;
	opacity: 0;
	transition: 0.6s ease all;
}

.sp-menu-item-nested .sp-menu-item-label{
	margin: 0;
}

.sp-menu-item-nested li{
	margin: 0 0 5px;
}

.sp-menu-item-nested li:last-child{
	margin: 0;
}

[data-fiscode]{
	text-transform: uppercase;
}

[data-page]{
	cursor: pointer !important;
}

[data-mailto]{
	cursor: pointer;
}

::selection{
	color: #ffffff;
	background-color: #25477a;
}

[data-orderable] {
	cursor: pointer;
	transition: all 0.5s ease;
	white-space: nowrap;
}

.sp-text-h{
	min-height: 2rem;
}

.sphereEditable{
	min-height: 150px;
	overflow: auto;
	padding: 5px;
	resize: vertical;
	outline: none;
	transition: all 0.5s ease;
}

.sp-pagination{
	margin: 15px 0;
}

.sp-buttons-list ul{
	margin: 0;
	padding: 5px 0 0;
	list-style-type: none;
	display: flex;
}
/*
.sp-buttons-list li{
	margin-right: 5px;
}

.sp-buttons-list li:last-child{
	margin-right: 0;
}
*/

.sp-dropdown{
	position: relative;
}

.sp-dropdown ul{
	display: none;
	list-style-type: none;
	opacity: 0;
	position: absolute;
	border: 1px solid lightgrey;
	background-color: #ffffff;
	padding: 5px 0;
	transition:  all 0.5s ease;
	overflow-y: auto;
	overflow-x: hidden;
	max-height: 350px;
	z-index: 1;
}

.sp-dropdown li{
	padding: 5px 15px;
	cursor: pointer;
}

.sp-dropdown li:hover{
	background-color: #eee;
}

.sp-dropdown .sp-button .up{
	display: none;
}

.sp-dropdown .sp-button.drop .up{
	display: inline;
}

.sp-dropdown .sp-button .down{
	display: inline;
}

.sp-dropdown .sp-button.drop .down{
	display: none;
}

.sp-table-container{
	overflow-x:auto;
}

.sp-table-status{
	width: 20%;
	z-index: 0 !important;
}

.sp-table{
}

.sp-table table{
	border-collapse: collapse;
	cursor: default;
}

.sp-table table td, .sp-table table th{
	padding: 5px 0;
	border-bottom: 1px solid #ddd;
	max-width: 20%;
}

.sphere-dialog .sp-table table td, .sphere-dialog .sp-table table th{
	padding: 5px;
}

.sp-table table.contrast thead tr{
	background-color: #fafafa;
	color: #25477a;
}

.sp-table table.contrast th{
	font-weight: normal;
	font-size: 1.3rem;
	text-shadow: 0 0;
}

.sp-table table.contrast th[data-orderable]:hover{
	color: #67a2be;
	transform: scale(1.05);
}

.sp-table table.contrast th[data-orderable]:hover .sp-text-primary{
	color: #67a2be;
}

.sp-table table tr:nth-child(even){
	background-color: #eee;	
}

.sp-table table tbody tr:hover {
	background-color: #ddd;
}

.sp-table-filters > div:not(:last-child), .sp-chart-filters > div:not(:last-child){
	margin-right: 5px;
}

.sphere-app{
	padding: 5px; 
}

.console{
	background: rgba(0,0,0,0.4);
	height: 100%;
	padding: 5px calc(5px*2); 
	box-shadow: 0 0 4px rgba(0,0,0,0.5);
}

.c-com{
	border: none;
	padding: 0;
	background: transparent;
	color: #ffffff;
	caret-color: transparent;
	width: 100%;
}

.console ::-moz-placeholder{
	
}

#sphere-main-controller {
	height: 100vh;
	width: [CONTROLLER-WIDTH];
	flex-shrink: 0;
	transition: all 0.5s ease, opacity 0.3s 0.2s ease;
}

.smc-collapsed {
	transform: rotate3d(0, 1, 0, +0.5turn);
	margin-left: -[CONTROLLER-WIDTH];
	opacity: 0;
	transition: all 0.5s ease, opacity 0.3s ease !important;
}

#sphere-main-interface {
	height: 100vh;
	transition: all 0.5s ease;
}

#sphere-main-interface > *{
	flex: 1 100%;
}

.sphere-controller-toggler {
	cursor: pointer;
}

#sphere-logo {
	border-bottom: 1px solid grey;
	padding: 15px 0;
	font-size: 22px;
}

#sphere-logo > div{
	padding:0 15px;
}

#ucaret {
	margin-left: 5px;
}

#sphere-head {
	padding: 5px;
}

footer {
	align-self: flex-end;
	padding: 5px calc(5px*2); 
	background-color: #eee;
	box-shadow: 0 0 4px rgba(0,0,0,0.15);
}

.sp-footer-menu-image img{
	max-height: 50px;
}

#sphere-main-container {
	background-color: #eee;
	overflow-y: auto;
}

#sphere-main-container *{
	/*
	position: relative;
	*/
	z-index: 1;
}

#sp-canvas-bg{
	position: absolute;
	z-index: 0;
}

#sphere-user-panel {
	height: 0;
	/*
	display: none;
	*/
	/*margin-top: -5px;*/
	transition: all 0.5s ease;
}

#sp-date{
	font-size: 1.1em;
	text-shadow: 0 0;
}

#sp-date .sphere-time{
	font-size: 1.3em;
}

.disable-selection{
	-moz-user-select: none;
	-ms-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
}

.sp-main-title{
	font-size: 38px;
	line-height: 26px;
	text-align:center;
}

img.sphere-user-controller{
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
}

.sphere-user-controller{
	cursor: pointer;
}
.sphere-user-controller:hover{
	color: #fff;
}

#sphere-main-shelf{
	margin-right: -100%;
	position: fixed;
	bottom: 0;
	right: 0;
	padding: 5px calc(5px*2);
	background-color: rgba(30, 38, 44, 0.7);
	z-index: 1;
	opacity: 0.1;
	font-size: 2em;
	transition: all 0.5s ease;
}

#sphere-main-shelf > *{
	margin-right: 5px;
}
#sphere-main-shelf > *:last-child{
	margin-right: 0;
}

.sphere-dialog{
	opacity: 0;
	min-width: 40%;
	max-width: 100%;
	z-index: 1;
	background: #fafafa;
	box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.2);
	overflow: hidden;
	transition: transform 0.1s ease, opacity 0.2s ease, height 0.1s ease, width 0.1s ease;
	resize: both;
	min-height: 10%;
}

#sp-dialog {
	display: none;
}

.sp-dialog-handle{
	cursor: move;
}

.pause-drag .sp-dialog-handle{
	cursor: default;
}
.sp-dialog-header{
	text-shadow: 0 0;
	background: #436e95;
	color: #ffffff;
	padding: 5px;
}

.sphere-dialog-title{	
}

.sphere-dialog-head{
}

.sphere-icon-large{
	font-size: 30px;
}

.sphere-dialog-blank{
	background: none;
	box-shadow: none;
}

.sphere-dialog-dash{
	box-shadow: none;
}

.sphere-dialog-controls{
	color: #ffffff;
}

.sphere-dialog-controls > *{
	margin: 0 5px;
	cursor: pointer;
}

.sphere-dialog-controls > *:first-child{
	margin: 0 5px 0 0;
}

.sphere-dialog-controls > *:last-child{
	margin: 0 0 0 5px;
}

.sphere-dialog-controls > *:hover{
	color: #00fff8;
}

.sphere-dialog-content{
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	max-height: 90vh;
	/*
	padding: 5px calc(5px*2);
	*/
}

.sphere-dialog-dash .sphere-dialog-content{
	max-height: 100%;
}

.sphere-dialog-max .sphere-dialog-content{
	max-height: 98vh;
}

.sphere-dialog-max{
	transform: none !important;
}

.sphere-dialog-content > *{
	box-sizing: border-box;
}

.sphere-dialog-icon, .sphere-panel-icon{
	margin-right: 5px;
}

.sp-modal{
	position: fixed;
	width: 100%;
	background: rgba(0,0,0,0.8);
	top: 0;
	opacity: 0;
	transition: all 0.5s ease;
	z-index: 100;
}

.sp-modal-close{
	position: absolute;
	padding: 15px;
	color: #fff;
	top: 0;
	right: 0;
	cursor: pointer;
}

.sp-main-content-content ~ .sp-des-page {
  margin-top: calc(-30px*3);
  margin-bottom: calc(30px*3);
}

.sp-modal-content{
	height: 100%;
	overflow: auto;
}

.sp-modal-content > img{
	max-height: 90vh;
}

.sp-modal-content > .sp-main-content-content, .sp-modal-content > .sp-des-page{
	background-color: #ffffff;
	margin: 0 calc(30px*10);
	padding: 30px calc(30px*5);
}

.sp-modal-content > .sp-main-content-content ~ .sp-des-page {
	margin-top: 0;
}

.sp-modal-content > .sp-main-content-content{
	padding-bottom: 0px;
}

.sp-modal-content .sp-main-content-content h1{
	margin-bottom: 30px;
}

.sp-des-page {
	padding: 0 calc(30px*10);
}
.sp-gal-nav{
	padding: 15px;
	color: #fff;
	cursor: pointer;
	font-size: 3rem;
	z-index: 1;
}

.sp-gal-prev{
	position: absolute;
	left: 0;
}

.sp-gal-next{
	position: absolute;
	right: 0;
}

.sp-gal-in{
	opacity: 0;
}

[data-galcur]{
	transition: all 0.5s ease;
	position: absolute;
}

#dashboard {
	perspective: 1000px;
	height: 100%;
}

.cube{
	width: 100%;
	transition: transform 0.5s;
	transform-style: preserve-3d;
}

.sphere-dash{
	transition: transform 0.5s;
	overflow:auto;
	position: absolute;
	width: 100%;
}


[data-index="0"]{ 
	transform: rotateY(0deg);
}
[data-index="1"]{ 
	transform: rotateY(90deg);
}
[data-index="2"]{ 
	transform: rotateY(180deg); 
}
[data-index="3"]{ 
	transform: rotateY(270deg); 
}

#sphere-panel{
	position: fixed;
	background: rgba(0,0,0,0.8);
	height: 100vh;
	width: calc( 100% - [CONTROLLER-WIDTH] - 2*5px);
	top: 0;
	right: -100%;
	z-index: 999;
	transition: all 0.5s ease;
}

.sp-panel{
	padding: 5px;
}

.sp-panel-content{
	height: 100%;
}

[data-sphere], [data-control], [data-panel], [data-desk], [data-callback]{
	cursor: pointer;
}

.sp-virtual-desk{
	width: 50px;
	height: 35px;
	box-shadow: 0 0 4px rgba(0,0,0,0.3) inset;
	background: rgba(0,0,0,0.1);
	margin-right: calc(5px*2);
	transition: all 0.2s ease;
	text-shadow: 0px 0px 4px rgba(0,0,0,0.5);
	
}

[draggable] > .sphere-dialog-head{
	cursor: move;
}

.sp-apps{
	height: 100%;
}

.sp-app{
	background: rgba(0,0,0,0.7);
	padding: 5px;
	box-shadow: 0px 0px 4px;
	transition: all 0.2s ease;
}

.sp-app:hover{
	transform: scale(1.05);
}

.sp-app:active{
	transform: scale(1);
}

.sp-app-icon{
	font-size: 3em;
}

.context-menu{
	transition: opacity 0.5s ease;
	opacity: 0;
	display: none;
	position: fixed;
	z-index: 999;
}

.context-item, .context-center{
	opacity: 0;
	background: rgba(0,0,0,0.5);
	color: white;
	padding: 5px 6px;
	border-radius: 50%;
	font-size: 1.5em;
	box-shadow: 0 0 4px;
}

.context-item{
	transition: opacity 0.8s ease;
}

.context-center{
	transition: opacity 0.2s ease;
	opacity: 1;
	font-size: 1em;
	padding: 10px;
}

.u-data{
	font-size: 1.2em;
}

.sp-scale {
	transition: all 0.2s ease;
}

.sp-scale:hover {
	transform: scale(1.05);
}

.sp-preview {
	max-width: 100px;
	max-height: 50px;
	display: inline-block;
}

.sp-preview:hover {
	transform: scale(2);
}

#sphere-user-panel li:hover i{
	color: #25477a;
}

.sp-des-title{
	font-size: 1.2rem;
	padding-bottom: 5px;
}

.fen{
	position: relative;
	margin-right: 15px;
	font-size: 1.2rem;
	padding: 0 0 calc(5px*2);
}

.fen-radio-item{
	position: relative;
	margin-top: 5px;
	margin-right: 15px;
	font-size: 1.2rem;
	margin-bottom: 15px;
}

.fen.disabled{
	opacity: 0.5;
}

.fen:last-child{
	margin-right: 0;
}

.fen > i{
	position: absolute;
	right: 1rem;
	top: 2px;
	color: #25477a;
	transition: all 0.28s ease;
}

.fen-helper{
	font-size: 0.9rem;
	color: #25477a;
	transition: opacity 0.5s ease;
}

.fen-helper-full{
	display: none;
	font-size: 1rem;
	background-color: #fafafa;
	color: #ffffff;
	text-align: center;
	border-radius: 6px;
	padding: 5px calc(5px*2);
	position: absolute;
	z-index: 100;
	opacity: 0;
	transition: all 0.5s ease;
}

.fen-helper-full::after {
	content: "";
	position: absolute;
	bottom: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent black transparent;
}

.fen-1-1{
	width: calc(100%);
}

.fen-1-2{
	width: calc(50% - (15px/2));
}

.sp-20u{
	width: calc(15px*20);
}

.fen-field {
	line-height: 1.5rem;
	padding: 0 0 5px;
	outline: none;
	background: transparent;
	font-size: 1rem;
	border: none;
	width: 100%;
	color: #000000;
	opacity: 0;
	transition: all 0.28s ease;
}

.fen-file{
	outline: none;
}

.fen-file-preview > *{
	max-width: 100px;
	transition: all 0.28s ease;
}

.fen-file-preview > *:hover{
	position: fixed;
	z-index: 100;
	transform: scale(4);
	box-shadow: 0 0 4px rgba(0,0,0,0.5);
}

.jfen-field{
	line-height: 1.5rem;
	padding: 0 0 5px;
	outline: none;
	background: transparent;
	font-size: 1rem;
	border: none;
	color: #25477a;
	transition: all 0.28s ease;
}

.jfen-field:focus{
	color: #67a2be;
}

.fen-auto{
	width: auto;
	margin-right: 15px;
}

.fen-auto:last-child{
	margin-right: 0;
}

.fen-field:-ms-input-placeholder {
	color: #25477a;
	transform: scale(0.9);
	transform-origin: left top;
}

.fen-field::placeholder {
	color: #25477a;
	transform: scale(0.9);
	transform-origin: left top;
}

.fen-file ~ .fen-label {
	transform: translateY(-100%) translateY(-0.5em) scale(0.9);
	cursor: pointer;
	pointer-events: auto;
}

.fen-field:focus ~ .fen-bar::after {
	transform: rotateY(0deg);
}

.fen-field:focus ~ .fen-label {
	color: #25477a;
}

input.fen-field:focus {
	opacity: 1;
}

select.fen-field{
	-moz-appearance: none;
	cursor: pointer;
}

.fen-field:focus ~ .fen-label {
	transform: translateY(-100%) translateY(-0.5em) scale(0.9);
	cursor: pointer;
	pointer-events: auto;
}

input.fen-field:not(:placeholder-shown),textarea.fen-field:not(:placeholder-shown), .sphereEditable:not(:empty), .sphereEditable.invalid {
  opacity: 1;
}

input.fen-field:not(:placeholder-shown) ~ .fen-label,textarea.fen-field:not(:placeholder-shown) ~ .fen-label, .sphereEditable.fen-field ~ .fen-label {
  transform: translateY(-100%) translateY(-0.5em) scale(0.9);
  cursor: pointer;
  pointer-events: auto;
}

.fen-label.fen-fixed{
	transform: translateY(-100%) translateY(-0.5em) scale(0.9);
	cursor: pointer;
	pointer-events: auto;
}

select.fen-field.selected{
	opacity: 1;
}

select.fen-field.selected ~ .fen-label {
  transform: translateY(-100%) translateY(-0.5em) scale(0.9);
  cursor: pointer;
  pointer-events: auto;
}

input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
	width: auto;
	opacity: 0;
	position: absolute;
	left: 0.25rem;
	top: 0.25rem;
	margin: 0;
	padding: 0;
	transition: height 0.28s ease;
}

.fen > i ~ .fen-field{
	width: calc(100% - 1.7rem);
}

.fen-label, .main-fen-label {
	position: absolute;
	top: 0.75rem;
	line-height: 1.5rem;
	pointer-events: none;
	z-index: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #25477a;
	transform: translateY(-50%);
	transform-origin: left center;
	transition: transform 0.28s ease, color 0.28s linear, opacity 0.28s linear;
}

.main-fen-label {
	top: -0.75rem;
	pointer-events: auto;
}

.jfen-label{
	line-height: 1.5rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #25477a;
}

.fen-title, .des-title {
	line-height: 1.5rem;
	pointer-events: none;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: #25477a;
}

.des-title {
	font-size: 1.2rem;
	color: #67a2be;
}

.fen-bar{
	position: relative;
	height: 1px;
	background: #25477a;
	display: block;
}

.fen-bar::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: #25477a;
	height: 1px;
	display: block;
	transform: rotateY(90deg);
	transition: transform 0.28s ease;
}

.fen-view-label{
	font-weight: bold;
	color: #25477a;
	font-size: 1.1rem;
}

.fen-view-val{
	line-height: 2rem;
}

.sp-table .fen-bar{
	background: #ddd;
}

.sp-table .fen > i{
	color: #ddd;
}
.sp-table .fen:hover > i{
	color: #25477a;
}

.fen-check, 
.fen-radio{
	position: absolute;
	color: #25477a;
	top: 0.40rem;
	width: 1rem;
	height: 1rem;
	z-index: 0;
	border: 0.125rem solid currentColor;
	border-radius: 0.0625rem;
	transition: color 0.28s ease;
}

.fen-switch{
	position: absolute;
	top: 0.25rem;
	box-shadow: 0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);
	box-sizing: border-box;
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 50%;
	pointer-events: none;
	color: #ffffff;
	background-color: currentColor;
	transition: all 0.28s ease;
}

.fen-switch-track{
	position: absolute;
	top: 0.4rem;
	width: 2.2rem;
	height: 1rem;
	box-sizing: border-box;
	border-radius: 7px;
	transition: opacity 90ms cubic-bezier(.4,0,.2,1),background-color 90ms cubic-bezier(.4,0,.2,1),border-color 90ms cubic-bezier(.4,0,.2,1);
	color: #25477a;
	background-color: currentColor;
	transition: color 0.28s ease;
	opacity: 0.4;
}

.fen-radio{
	border: none;
}

.fen-check:hover, .fen-radio:hover, .fen-switch:hover{
	color: #25477a;
}

.fen-check::before, .fen-check::after {
	position: absolute;
	height: 0;
	width: 0.2rem;
	background-color: #25477a;
	border-radius: 0.25rem;
	content: "";
	transition: opacity 0.28s ease, height 0s linear 0.28s;
	transform-origin: left top;
	opacity: 0;
	z-index: 0;
}

.fen-radio::before, .fen-radio::after {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 1rem;
	height: 1rem;
	transition: transform 0.28s ease, color 0.28s ease;
	border-radius: 50%;
	border: 0.125rem solid currentColor;
}

.fen-check::before {
	width: 0.18rem;
	top: 0.90rem;
	left: 0.40rem;
	transform: rotate(-135deg);
}

.fen-check::after {
	top: 0.55rem;
	left: 0;
	transform: rotate(-45deg);
}

.fen-radio::after {
	transform: scale(0);
	background-color: #25477a;
	border-color: #25477a;
}

.fen-check-label, 
.fen-radio-label{
	position: relative;
	cursor: pointer;
	padding-left: 1.6rem;
	transition: color 0.28s ease;
	z-index: 1;
}

.fen-switch ~ .fen-check-label{
	padding-left: 2.7rem;
}

.fen-check-label:hover ~ .fen-check, 
.fen-check-label:hover ~ .fen-switch-track, 
.fen-radio-label:hover ~ .fen-radio{
	color: #25477a;
}

input[type="checkbox"]:focus ~ .fen-check, 
input[type="checkbox"]:focus ~ .fen-switch-track, 
input[type="radio"]:focus ~ .fen-radio{
	color: #25477a;
}

input[type="checkbox"]:checked ~ .fen-check::after, input[type="checkbox"]:checked ~ .fen-check::before{
	opacity: 1;
	transition: height 0.28s ease;
}

input[type="checkbox"]:checked ~ .fen-check::after {
	height: 0.5rem;
}

input[type="checkbox"]:checked ~ .fen-check::before {
	height: 1rem;
	transition-delay: 0.2s;
}

input[type="checkbox"]:checked ~ .fen-switch-track {
	color: #25477a;
	opacity: 0.5;
}

input[type="checkbox"]:checked ~ .fen-switch {
	color: #25477a;
	transform: translateX(1.2rem);
}

input[type="radio"]:checked ~ .fen-radio::after {
  transform: scale(0.5);
}

.fen-constraint .fen-helper, .fen-constraint .fen-label{
	color: #ef0000;
}

.sp-button, .sp-buttons-list li{
	-moz-user-select: none;
	-ms-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	background: #25477a;
	color: #fff;
	border: none;
	position: relative;
	font-size:1.3rem;
	padding: 5px calc(5px*2);
	cursor: pointer;
	transition: 0.6s ease all;
	outline: none;
	margin-left: calc(5px*2);
}

.sp-button:first-child, .sp-buttons-list li:first-child{
	margin-left: 0;
}

.sp-button:hover, .sp-buttons-list li:hover{
	background: transparent;
	color: #25477a;
	transform: scale(1.05);
}
.sp-button:before,.sp-button:after, .sp-buttons-list li:before, .sp-buttons-list li:after{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	height: 1px;
	width: 0;
	background: #67a2be;
	transition: 0.4s ease all;
}
.sp-button:after, .sp-buttons-list li:after{
	right: inherit;
	top: inherit;
	left: 0;
	bottom: 0;
}
.sp-button:hover:before,.sp-button:hover:after, .sp-buttons-list li:hover:before, .sp-buttons-list li:hover:after{
	width: 100%;
	transition: 0.6s ease all;
	transform: scale(1.05);
}
.sp-button:active:before,.sp-button:active:after, .sp-buttons-list li:active:before, .sp-buttons-list li:active:after{
	width: 0%;
	transition: 0.2s ease all;
	transform: scale(0.95);
}
.sp-button:active, sp-buttons-list li:active{
	background: #25477a;
	color: #fff;
	transition: 0.2s ease all;
	transform: scale(0.95);
}

.sp-editor-button {
	-moz-user-select: none;
	-ms-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	border: none;
	position: relative;
	font-size: 0.8em;
	padding: calc(5px/2) 5px;
	cursor: pointer;
	transition: 0.4s ease all;
	outline: none;
	margin-left: calc(5px/2);
}

.sp-editor-button:hover {
	background: lightgrey;
}

.sp-editor-separator {
	cursor: default;
	margin: 0 15px;
}

.sp-pager{
	
}

.sp-pager.sp-button:not(:first-child){
	margin-left: 5px;
}

.sp-pager.sp-button.current{
	background: transparent;
	color: #25477a;
	transform: scale(1);
}

.sp-button.current:before,.sp-button.current:after{
	width: 100%;
	transform: scale(1);
}

.sp-button.sp-text-muted{
	background: #eee;
	transform: scale(1);
	cursor: default;
	box-shadow: 0 0 4px rgba(0,0,0,0.3) inset;
}

.sp-button.sp-text-muted:hover{
	color: #25477a;
	transform: scale(1);
}

.sp-button.sp-text-muted:before,.sp-button.sp-text-muted:after{
	width: 0%;
	transform: scale(1);
}

.sp-button.sp-text-muted:hover:before,.sp-button.sp-text-muted:hover:after{
	width: 0%;
	color: #25477a;
	transform: scale(1);
}
.sp-button.sp-text-muted:active:before,.sp-button.sp-text-muted:active:after{
	width: 0%;
	transform: scale(1);
}
.sp-button.sp-text-muted:active{
	color: #25477a;
	transform: scale(1);
}

/*
.sp-button-danger{
	background: #e33551;
}

.sp-button-danger:active{
	background: #e90328;
}
*/

.sp-switch {
	width: 20px;
	height: 20px;
	border-radius: 100%;
	background: #25477a;
	opacity: 0.7;
	transition: 0.5s ease all;
	text-align: center;
}

.sp-switch.on{
	border: none;
	background: #25477a;
	padding: 5px;
	opacity: 1;
}

.sp-switch.danger{
	background: #ef0000;
}

.sp-switch.warning{
	background: [WARNING-COLOR];
}

.sp-switch.success{
	background: [SUCCESS-COLOR];
}

.sp-switch.safe {
    background: [SAFE-COLOR];
}

.sp-switch.pink {
    background: [PINK-COLOR];
}

.sp-full-width {
	width: 100%;
}

.sp-half-width {
	width: 50%;
}

.sp-text-primary {
	transition: 0.5s ease all;
	color: #25477a;
}

.sp-text-secondary {
	transition: 0.5s ease all;
	color: #67a2be;
}

.sp-text-tertiary {
	transition: 0.5s ease all;
	color: #00fff8;
}

.sp-text-danger {
	transition: 0.5s ease all;
	color: #ff3030!important;
}

.sp-text-warning {
	transition: 0.5s ease all;
	color: #EDA83E!important;
}

.sp-text-center {
	text-align: center;
}

.sp-text-left {
	text-align: left;
}

.sp-text-right {
	text-align: right;
}

.sp-text-large {
	font-size: 1.5rem;
}

.sp-contrast, .sphere-desk-active {
	color: #ffffff;
}

.sp-text-bold {
	font-size: 1.05em;
	font-weight: 500;
}

.sp-text-muted {
	transition: 0.5s ease all;
	color: #25477a;
}

.sp-text-italic {
	font-style: italic;
}

.sp-padding-s{
	padding: 5px calc(5px*2);
}

.sp-padding{
	padding: 15px;
}

.sp-padding-l{
	padding: 30px calc(30px*2);
}

.sp-padding-r{
	padding-right: 15px;
}

.sp-padding-rl{
	padding-right: calc( 15px*2 );
}

.sp-no-padding-b {
	padding-bottom: 0 !important;
}

.sp-margin-b{
	margin-bottom: 15px;
}

.sp-margin-bl{
	margin-bottom: 30px;
}

.sp-margin-bs{
	margin-bottom: 5px;sp-padding-rl
}

.sp-margin-t{
	margin-top: 15px;
}

.sp-margin-tl{
	margin-top: 30px;
}

.sp-margin-tld{
	margin-top: calc(30px*2);
}

.sp-margin-tll{
	margin-top: calc(30px*2);
}


.sp-margin-ts{
	margin-top: 5px;
}

.sp-margin-r{
	margin-right: 15px;
}

.sp-margin-rl{
	margin-right: 30px;
}
.sp-margin-rs{
	margin-right: 5px;
}

.sp-margin-l{
	margin-left: 15px;
}

.sp-margin-ll{
	margin-left: 30px;
}

.sp-margin-ls{
	margin-left: 5px;
}

.sp-nav {
	padding: 5px;
}

.sp-nav > li{
	list-style-type: none;
	padding: 5px;
}

.sp-nav > li:hover{
	background-color: rgba(255,255,255,0.1);
}

.sp-nav > li[data-separator]{
	cursor: default;
	border-bottom: 1px solid #25477a;
	padding: 0;
	margin: 5px 0;
}

.sp-nav > li[data-separator]:hover{
	background-color: transparent;
}

.sp-nav a {
	color: #ffffff;
}

.sp-nav a:hover {
	color: #25477a;
}

.sp-nav-separator{
	cursor: pointer;
}

.sp-nav-separator .sp-nav-caret-up{
	display: none;
}

.sp-nav-separator ul{
	transition: all 0.2s ease;
	opacity: 0;
	display: none;
}

.sp-main-nav{
	padding: 0;
	margin-top: 5px;
	font-size: 1.2em;
}

.sp-main-nav > li{	
	transition: all 0.2s ease;
}

.sp-main-nav > li:hover{
	border-left: 4px solid #34D1EA;
}

.sp-flex {
	display: flex;
}

.sp-flex-wrap {
	flex-wrap: wrap;
}

.sp-flex-space-between {
	justify-content: space-between;
}

.sp-flex-space-evenly {
	justify-content: space-evenly;
}

.sp-flex-space-around {
	justify-content: space-around;
}

.sp-flex-center {
	justify-content: center;
}

.sp-flex-end {
	justify-content: flex-end;
}

.sp-flex-column {
	flex-direction: column;
}

.sp-flex-cross-center {
	align-items: center;
}

.sp-flex-cross-baseline {
	align-items: baseline;
}

.sp-flex-cross-start {
	align-items: flex-start;
}

.sp-flex-cross-end {
	align-items: flex-end;
}

.sp-flex-crossrows-start {
	align-content: flex-start;
}

.sp-flex-crossrows-end {
	align-content: flex-end;
}

.sp-flex-crossrows-space-between {
	align-content: space-between;
}

.sp-flex-crossrows-space-around {
	align-content: space-around;
}

.sp-flex-self-start {
	align-self: flex-start;
}

.sp-flex-self-end {
	align-self: flex-end;
}

.sp-flex-self-center {
	align-self: center;
}

.sp-flex-self-space-between {
	align-self: space-between;
}

.sp-flex-self-space-around {
	align-self: space-around;
}

.sp-flex-item-grow{
	flex-grow: 1;
}
.sp-flex-grow > *{
	flex-grow: 1;
	flex-basis: 0;
}

.sp-gap{
	gap: 2rem;
}

[data-banner]{
	background: #F4F4F4;
	z-index: 10;
	padding: 15px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: fixed;
	top: 10%;
	box-shadow: 0 0 2px 0px;
	transition: all 0.5s ease;
	left: 50%;
	transform: translateX(-50%);
}

.banner-alert {
	background: #EBCDC8;
	color: rgba( 175,26,0, 0.8 );
}

.banner-success {
	background: green;
	color: rgba(0, 98, 59, 0.6);
}

.banner-primary {
	background: light-blue;
	color: rgba(37,37,37,0.8);
	border: 1px solid rgba(0,0,0,0.08);
}

.banner-secondary {
	background: #fff;
	color: red;
	border: 1px solid rgba(0,0,0,0.08);
	font-weight: bold;
}

.sp-pages, .sp-page-setter {
	transition: all 0.2s ease;
	opacity: 0;
	box-shadow:  0 0 4px;
	background: #fff;
	padding: 5px;
	position: absolute;
	top: calc( -100% - 5px);
	left: 50%;
	transform: translateX(-50%);
	display: none;
}

.sp-page-setter {
	top: calc( -100% - 15px);
	width: 100px;
}

.sp-page-setter .fen-field {
	padding: 5px 0;
	text-align: center;
}

.sp-pages [data-pager] {
	padding: 0 5px;
}

.sp-editor {
	transition: all 0.5s ease;
}

.sp-select-table{
	background: #ECECEC;
	transition: all 0.1s ease;
	max-height: 30vh;
	overflow-y: auto;
	padding: 15px 0;
}

.sp-select-table.active{
	display: block;
	opacity: 1;
	height: auto;
}

[data-sel-value]{
	padding: 5px 15px;
	cursor: pointer;
	transition: all 0.1s ease;
}

[data-sel-value]:hover{
	background: #ddd;
}

.sp-sel-add{
	padding: 0;
}

.sp-sel-add .sp-button{
	width: auto;
}

.sp-more{
	cursor: default;
}

.sp-sel-drop{
	cursor: pointer;
	opacity: 0;
}
.sp-main-content-content h1{
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 2.5rem;
	line-height: 2.5rem;
	margin-bottom: calc(30px*1);
}

.sp-main-content-content ul{
	padding: 0 0 0 15px;
	margin: 0;
}

.sp-main-content-content li{
	margin-bottom: 15px;
	line-height: 1.5rem;
}

.sp-boxed-item-content{
	font-size: 1.2rem;
	line-height: 2.5rem;
}

.sp-legal-menu-item{
	margin: 0 5px;
}

.sp-top-menu-item{
	margin: 0 calc(5px*2);
	cursor: pointer;
}

.sp-legal-menu-item:last-child, .sp-top-menu-item:last-child{
	margin-right: 0;
}

.sp-legal-menu-item:first-child, .sp-top-menu-item:first-child{
	margin-left: 0;
}

.sp-login-box{
	box-shadow: 0 0 1px #000000cc;
	width: 45%;
	padding: 30px;
	background: #ffffff;
}

.sp-login-title{
	font-size: 1.5rem;
	margin-bottom: 15px;
}

.sp-login-description{
	line-height: 1.5rem;
}

.sp-login-buttons{
	width: 40%;
}

.sphere-dialog .fen-label{
	font-size: 1.2rem;
}

[data-slider]{
	cursor: pointer;
}

.sp-product{
	margin: 15px 0;
	width: 30%;
}

.sp-product-title{
	font-size: 1.5rem;
}

.sp-product-price{
	font-size: 1.5rem;
	padding: 0 15px;
}

.sp-product-price > div{
	text-align: right;
}

.sp-product-helper{
	font-size: 0.8rem;
	color: #25477a;
}

.sp-product-launcher .sp-button{
	font-size: 1.2rem;
}

.sp-product big{
	font-size: 1rem;
}


.sp-login-box .fen .fen-check-label{
	font-size: 1rem;
}

.sp-login-box .fen .fen-switch-track{
	top: 0.45rem;
}

.sp-login-box .fen .fen-switch{
	top: 0.3rem;
}

.sp-fen-view .fen{
	font-size: 1rem;
}

.sp-privacy{
	padding: 0 calc(30px*10) calc(30px*3);
	font-size: 1.2rem;
	line-height: 2.4rem;
}

.sp-user-privacy{
	padding: 5px 15px;
	font-size: 1.2rem;
	line-height: 2.4rem;
}

.sp-privacy .fen .fen-switch{
	top: 0.60rem;
}

.sp-privacy .fen .fen-switch-track{
	top: 0.70rem;
}

.sp-upload {
	position: relative;
	margin: calc(15px*2) 0 15px;
}

.sp-upload-btn, input[type=file]:not(.fen-file) {
	position: absolute;
	top: 0;
	left: 0;
}

input[type=file]:not(.fen-file) {
	height: 100%;
	width: 100%;
	opacity: 0;
}

.fen-file-value {
	margin-bottom: 5px;
}

.invalid{
	color: #ef0000;
}

#sp-cookie-banner {
	display: flex;
	background-color: #436e95;
	color: #ffffff;
	justify-content: space-between;
	align-items: center;
	position: fixed;
	width: 100%;
	transform: translateY(-100%);
	transition: all 0.5s ease;
	z-index: 1;
}

#sp-cookie-banner > div {
	padding: 5px calc(5px*2); 
}

#sp-cookie-banner .sp-button{
	padding: 5px calc(5px*2);
	font-size: 1rem;
}

.nobr{ 
	white-space:nowrap; 
}

.sp-main-content-block:first-child {
	margin-top: 0;
}

.sp-main-content-block:last-child {
	margin-bottom: 0;
}

.sp-main-content-block {
	margin: 30px 0;
	height: 500px;
	-webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
	opacity: 1;
}

.sp-main-content-hcontents {
	padding: calc(30px*3) calc( 30px*5 ) ;
}

.sp-main-content-block {
	width: 100%;
}

.sp-main-content-block:nth-child(odd) .sp-main-content-block-img-container {
	order: 1;
}

.sp-main-content-block:nth-child(odd) .sp-main-content-block-desc {
	order: 2;
}

.sp-main-content-block:nth-child(even) .sp-main-content-block-img-container {
	order: 2;
}

.sp-main-content-block:nth-child(even) .sp-main-content-block-desc {
	order: 1;
}

.sp-main-content-block-img-container {
	width: 60%;	
}

.sp-main-content-block-img {
	width: 100%;
	height: 500px;
	object-fit: cover;
	/*filter: grayscale(100%);*/
	-webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}
/*
.sp-main-content-block:hover .sp-main-content-block-img{
	filter: grayscale( 0%);
}
*/

.sp-main-content-block-icon{
	-webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
	margin-bottom: 30px;
	font-size: 2rem;
}

.sp-main-content-block-desc {
	flex-basis: 0;
	flex-grow: 1;
	background: #25477a;
	color: #ffffff;
	flex-direction: column;
	justify-content: center;
	padding: calc(30px*2);
}

.sp-main-content-block-title {
	font-size: 2.5em;
	margin-bottom: 15px;
	text-transform: uppercase;
}

.sp-main-content-block-text {
	line-height: 2em;
}

.sp-datepicker{
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    background-color: #fff;
    padding: 10px;
    display: none;
    position: absolute;
    z-index: 1000;
}

.sp-calendar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
}

.sp-calendar-header button {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 18px;
}

.sp-calendar-header select {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 5px;
    font-size: 16px;
}

.sp-calendar-body {
    width: 100%;
    border-collapse: collapse;
}

.sp-calendar-body th, .sp-calendar-body td {
    border: 1px solid #ccc;
    padding: 5px;
    text-align: center;
    cursor: pointer;
}

.sp-calendar-body td:hover {
    background-color: #f0f0f0;
}

.sp-calendar-body td.disabled {
    color: #ccc;
    cursor: default;
}

.sp-calendar-body td.disabled:hover {
    background-color: transparent;
}

.sp-close-calendar {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 24px;
    color: #666;
    position: absolute;
    top: 0px;
    right: 5px;
}

.sp-close-calendar:hover {
    color: #333;
}

@media only screen and (max-width: 1900px) {
	#sp-cookie-banner {
		flex-wrap: wrap;
	}
	#sp-cookie-banner > div {
		flex-wrap: wrap;
		justify-content: center;
	}
	#sp-cookie-banner .sp-button{
		text-align: center;
		margin: 1px;
	}
	
	.sp-modal-content > .sp-main-content-content, .sp-modal-content > .sp-des-page{
		margin: 0 30px;
	}
	.sp-modal-content > .sp-des-page{
		padding: 0;
	}
	
	.sp-modal-content > .sp-main-content-content{
		padding: 30px;
		padding-bottom: 0px;
	}
}

 /* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	#sp-cookie-banner {
		flex-wrap: wrap;
	}
	#sp-cookie-banner > div {
		flex-wrap: wrap;
		justify-content: center;
	}
	#sp-cookie-banner .sp-button{
		width: 50%;
		text-align: center;
		margin: 1px;
	}
	.sp-des-page{
		padding: 0px;
	}
	.sp-main-content-content ~ .sp-des-page{
		margin-top: 0;
		margin-bottom: 30px;
	}
	.sp-modal-content > .sp-main-content-content, .sp-modal-content > .sp-des-page{
		padding: 0;
		margin: 0 5px;
	}
	.sp-modal-content > .sp-main-content-content{
		margin-top: 5px;
		padding: 5px 15px;
		font-size: 1rem;
		line-height: 1.3rem;
	}
	.sp-modal-content > .sp-des-page{
		padding-top: 0px;
	}
	.sp-modal-content .sp-main-content-content h1{
		font-size: 1.2rem;
		line-height: 1.5rem;
		margin-bottom: 5px;
	}
	.sp-modal-content > .sp-des-page .sp-padding{
		padding-top: 0px;
	}
	
	.sp-modal-content > .sp-des-page .des .sp-margin-t{
		margin-top: 5px;
	}
	
	.sp-main-content-block-img-container {
		width: 100%;
	}
	.sp-main-content-block-img {
		height: 100%;		
	}
	.sp-main-content-block{
		margin: 0;
		height: 100%;
	}
	.sp-main-content-block:nth-child(odd) .sp-main-content-block-img-container {
		order: 2;
	}

	.sp-main-content-block:nth-child(odd) .sp-main-content-block-desc {
		order: 1;
	}
	.sp-main-content-block-img {
	  height: 128px;
	}
	.sp-main-content-block-title {
		font-size: 1.8rem;
		margin-bottom: 5px;
	}
	.sp-main-content-block-desc{
		padding: 30px;
	}
	.sp-main-content-block-text {
	  line-height: 1.5rem;
	}
	.sp-half-width {
		width: 100%;
	}
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
	
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
	
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	
}



.sp-blink {
	-webkit-animation: 1s blink step-end infinite;
	-moz-animation: 1s blink step-end infinite;
	-ms-animation: 1s blink step-end infinite;
	-o-animation: 1s blink step-end infinite;
	animation: 1s blink step-end infinite;
}

.wobble {
	-webkit-animation: 0.3s wobble ease 1;
	-moz-animation: 0.3s wobble ease 1;
	-ms-animation: 0.3s wobble ease 1;
	-o-animation: 0.3s wobble ease 1;
	animation: 0.3s wobble ease 1;
}

.scaleInOut {
	-webkit-animation: 0.2s scaleInOut ease-in-out 1;
	-moz-animation: 0.2s scaleInOut ease-in-out 1;
	-ms-animation: 0.2s scaleInOut ease-in-out 1;
	-o-animation: 0.2s scaleInOut ease-in-out 1;
	animation: 0.2s scaleInOut ease-in-out 1;
}

.sp-fadeIn {
	-webkit-animation: 1.5s fadeIn ease-in 1;
	-moz-animation: 1.5s fadeIn ease-in 1;
	-ms-animation: 1.5s fadeIn ease-in 1;
	-o-animation: 1.5s fadeIn ease-in 1;
	animation: 1.5s fadeIn ease-in 1;
}