/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 29.12.2015, 12:28:05
    Author     : Jakub
*/

.login-page {
    background:url('../images/login_back.jpg') no-repeat center top;
}

.login-logo a {
    color:#fff;
}

.btn-primary:hover, .btn-primary:active, .btn-primary.hover {
    background-color: #605CA8;
}

.form-horizontal .form-group {
    margin-right: 0;
    margin-left: 0;
}

.slider .tooltip.top .tooltip-arrow {
    border-width: 0 5px 5px 5px;
    border-bottom-color: #000;
    bottom:28px;
}

.slider .tooltip-inner {
    margin-top:22px;
}

.checkbox label {
    padding-left: 0;
}

.checkbox .icheckbox_square-blue {
    margin-right:10px;
    margin-top:-4px;
}

.checkbox ins {
    width:100% !important;
    height:100% !important;
}

.checkbox .icheckbox_square-blue.disabled {
    cursor: not-allowed;
}

form .required label {
    color: maroon;
}

form .required label:after {
    content:'\f005';
    font: normal normal normal 12px/1 FontAwesome;
    left:2px;
    top:-4px;
    position: relative;
}

.info-box {
    position:relative;
    color:#fff;
}

.info-box a {
    color:#fff;
}

.info-box .controls {
    position:absolute;
    right:4px;
    top:4px;
}

.info-box .controls a {
    display:inline-block;
    padding:4px 8px;
}

.info-box .controls a:hover {
    
    background:#1a2226;
}

.pagination .disabled {
    opacity:0.6;
}

.info-box-icon.is_image {
    font-size: 1%;
}

.info-box-number {
    padding-right:120px;
}

.gpspicker-search {
    margin-top:10px;
}

.slider {
    display: block;
}

.slider.slider-horizontal {
    width: 100%;
}

.slider .tooltip-inner {
    margin-top: 0;
}


#red .slider-selection {
    background: #f56954;
}

#blue .slider-selection {
    background: #3c8dbc;
}

#green .slider-selection {
    background: #00a65a;
}

#yellow .slider-selection {
    background: #f39c12;
}

#aqua .slider-selection {
    background: #00c0ef;
}

#purple .slider-selection {
    background: #932ab6;
}

.skin-z-agency .slider .slider-selection, .skin-z-agency .slider .slider-track-high {
    background-color: #f1f1f1;
    border: 1px solid #cccccc;
}

.skin-z-agency .slider .slider-handle {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    background-image: none;
}

.skin-z-agency .slider .tooltip-arrow {
    border-bottom-color: #269c7e;
}

.skin-z-agency .slider .tooltip-inner {
    background-color: #269c7e;
}

.form-group .slider.slider-horizontal {
    margin-bottom: 3ex;
} 

.grido .head th {
    color: black;
}

/* TEMPORARY until event-create form rendered in new style */
.skin-z-agency .content form.event-create input[type=checkbox] {
    display: inherit;
}

.skin-z-agency .content form.event-create .checkbox label {
    padding-left: 20px;
}

.animatedlist-item {
  transition: all 0.3s;
}
.animatedlist-enter, .animatedlist-leave-to {
  opacity: 0;
  transform: translateY(30px);
}
.animatedlist-leave-active {
  position: absolute;
}

.trans-fade-enter-active, .trans-fade-leave-active {
  transition: opacity .5s
}

.trans-fade-enter, .trans-fade-leave-to {
  opacity: 0
}

.xdsoft_datetimepicker {
	box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.506);
	background: #fff;
	border-bottom: 1px solid #bbb;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	color: #333;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	padding: 8px;
	padding-left: 0;
	padding-top: 2px;
	position: absolute;
	z-index: 9999;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: none;
}
.xdsoft_datetimepicker.xdsoft_rtl {
	padding: 8px 0 8px 8px;
}

.xdsoft_datetimepicker iframe {
	position: absolute;
	left: 0;
	top: 0;
	width: 75px;
	height: 210px;
	background: transparent;
	border: none;
}

/*For IE8 or lower*/
.xdsoft_datetimepicker button {
	border: none !important;
}

.xdsoft_noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}

.xdsoft_noselect::selection { background: transparent }
.xdsoft_noselect::-moz-selection { background: transparent }

.xdsoft_datetimepicker.xdsoft_inline {
	display: inline-block;
	position: static;
	box-shadow: none;
}

.xdsoft_datetimepicker * {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

.xdsoft_datetimepicker .xdsoft_datepicker, .xdsoft_datetimepicker .xdsoft_timepicker {
	display: none;
}

.xdsoft_datetimepicker .xdsoft_datepicker.active, .xdsoft_datetimepicker .xdsoft_timepicker.active {
	display: block;
}

.xdsoft_datetimepicker .xdsoft_datepicker {
	width: 224px;
	float: left;
	margin-left: 8px;
}
.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_datepicker {
	float: right;
	margin-right: 8px;
	margin-left: 0;
}

.xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_datepicker {
	width: 256px;
}

.xdsoft_datetimepicker .xdsoft_timepicker {
	width: 58px;
	float: left;
	text-align: center;
	margin-left: 8px;
	margin-top: 0;
}
.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker {
	float: right;
	margin-right: 8px;
	margin-left: 0;
}

.xdsoft_datetimepicker .xdsoft_datepicker.active+.xdsoft_timepicker {
	margin-top: 8px;
	margin-bottom: 3px
}

.xdsoft_datetimepicker .xdsoft_monthpicker {
	position: relative;
	text-align: center;
}

.xdsoft_datetimepicker .xdsoft_label i,
.xdsoft_datetimepicker .xdsoft_prev,
.xdsoft_datetimepicker .xdsoft_next,
.xdsoft_datetimepicker .xdsoft_today_button {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAeCAYAAADaW7vzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Q0NBRjI1NjM0M0UwMTFFNDk4NkFGMzJFQkQzQjEwRUIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Q0NBRjI1NjQ0M0UwMTFFNDk4NkFGMzJFQkQzQjEwRUIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDQ0FGMjU2MTQzRTAxMUU0OTg2QUYzMkVCRDNCMTBFQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDQ0FGMjU2MjQzRTAxMUU0OTg2QUYzMkVCRDNCMTBFQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PoNEP54AAAIOSURBVHja7Jq9TsMwEMcxrZD4WpBYeKUCe+kTMCACHZh4BFfHO/AAIHZGFhYkBBsSEqxsLCAgXKhbXYOTxh9pfJVP+qutnZ5s/5Lz2Y5I03QhWji2GIcgAokWgfCxNvcOCCGKqiSqhUp0laHOne05vdEyGMfkdxJDVjgwDlEQgYQBgx+ULJaWSXXS6r/ER5FBVR8VfGftTKcITNs+a1XpcFoExREIDF14AVIFxgQUS+h520cdud6wNkC0UBw6BCO/HoCYwBhD8QCkQ/x1mwDyD4plh4D6DDV0TAGyo4HcawLIBBSLDkHeH0Mg2yVP3l4TQMZQDDsEOl/MgHQqhMNuE0D+oBh0CIr8MAKyazBH9WyBuKxDWgbXfjNf32TZ1KWm/Ap1oSk/R53UtQ5xTh3LUlMmT8gt6g51Q9p+SobxgJQ/qmsfZhWywGFSl0yBjCLJCMgXail3b7+rumdVJ2YRss4cN+r6qAHDkPWjPjdJCF4n9RmAD/V9A/Wp4NQassDjwlB6XBiCxcJQWmZZb8THFilfy/lfrTvLghq2TqTHrRMTKNJ0sIhdo15RT+RpyWwFdY96UZ/LdQKBGjcXpcc1AlSFEfLmouD+1knuxBDUVrvOBmoOC/rEcN7OQxKVeJTCiAdUzUJhA2Oez9QTkp72OTVcxDcXY8iKNkxGAJXmJCOQwOa6dhyXsOa6XwEGAKdeb5ET3rQdAAAAAElFTkSuQmCC);
}

.xdsoft_datetimepicker .xdsoft_label i {
	opacity: 0.5;
	background-position: -92px -19px;
	display: inline-block;
	width: 9px;
	height: 20px;
	vertical-align: middle;
}

.xdsoft_datetimepicker .xdsoft_prev {
	float: left;
	background-position: -20px 0;
}
.xdsoft_datetimepicker .xdsoft_today_button {
	float: left;
	background-position: -70px 0;
	margin-left: 5px;
}

.xdsoft_datetimepicker .xdsoft_next {
	float: right;
	background-position: 0 0;
}

.xdsoft_datetimepicker .xdsoft_next,
.xdsoft_datetimepicker .xdsoft_prev ,
.xdsoft_datetimepicker .xdsoft_today_button {
	background-color: transparent;
	background-repeat: no-repeat;
	border: 0 none;
	cursor: pointer;
	display: block;
	height: 30px;
	opacity: 0.5;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	outline: medium none;
	overflow: hidden;
	padding: 0;
	position: relative;
	text-indent: 100%;
	white-space: nowrap;
	width: 20px;
	min-width: 0;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next {
	float: none;
	background-position: -40px -15px;
	height: 15px;
	width: 30px;
	display: block;
	margin-left: 14px;
	margin-top: 7px;
}
.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker .xdsoft_prev,
.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker .xdsoft_next {
	float: none;
	margin-left: 0;
	margin-right: 14px;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev {
	background-position: -40px 0;
	margin-bottom: 7px;
	margin-top: 0;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box {
	height: 151px;
	overflow: hidden;
	border-bottom: 1px solid #ddd;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div {
	background: #f5f5f5;
	border-top: 1px solid #ddd;
	color: #666;
	font-size: 12px;
	text-align: center;
	border-collapse: collapse;
	cursor: pointer;
	border-bottom-width: 0;
	height: 25px;
	line-height: 25px;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div > div:first-child {
	border-top-width: 0;
}

.xdsoft_datetimepicker .xdsoft_today_button:hover,
.xdsoft_datetimepicker .xdsoft_next:hover,
.xdsoft_datetimepicker .xdsoft_prev:hover {
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.xdsoft_datetimepicker .xdsoft_label {
	display: inline;
	position: relative;
	z-index: 9999;
	margin: 0;
	padding: 5px 3px;
	font-size: 14px;
	line-height: 20px;
	font-weight: bold;
	background-color: #fff;
	float: left;
	width: 182px;
	text-align: center;
	cursor: pointer;
}

.xdsoft_datetimepicker .xdsoft_label:hover>span {
	text-decoration: underline;
}

.xdsoft_datetimepicker .xdsoft_label:hover i {
	opacity: 1.0;
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select {
	border: 1px solid #ccc;
	position: absolute;
	right: 0;
	top: 30px;
	z-index: 101;
	display: none;
	background: #fff;
	max-height: 160px;
	overflow-y: hidden;
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_monthselect{ right: -7px }
.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_yearselect{ right: 2px }
.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover {
	color: #fff;
	background: #ff8000;
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option {
	padding: 2px 10px 2px 5px;
	text-decoration: none !important;
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current {
	background: #33aaff;
	box-shadow: #178fe5 0 1px 3px 0 inset;
	color: #fff;
	font-weight: 700;
}

.xdsoft_datetimepicker .xdsoft_month {
	width: 100px;
	text-align: right;
}

.xdsoft_datetimepicker .xdsoft_calendar {
	clear: both;
}

.xdsoft_datetimepicker .xdsoft_year{
	width: 48px;
	margin-left: 5px;
}

.xdsoft_datetimepicker .xdsoft_calendar table {
	border-collapse: collapse;
	width: 100%;

}

.xdsoft_datetimepicker .xdsoft_calendar td > div {
	padding-right: 5px;
}

.xdsoft_datetimepicker .xdsoft_calendar th {
	height: 25px;
}

.xdsoft_datetimepicker .xdsoft_calendar td,.xdsoft_datetimepicker .xdsoft_calendar th {
	width: 14.2857142%;
	background: #f5f5f5;
	border: 1px solid #ddd;
	color: #666;
	font-size: 12px;
	text-align: right;
	vertical-align: middle;
	padding: 0;
	border-collapse: collapse;
	cursor: pointer;
	height: 25px;
}
.xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_calendar td,.xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_calendar th {
	width: 12.5%;
}

.xdsoft_datetimepicker .xdsoft_calendar th {
	background: #f1f1f1;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_today {
	color: #33aaff;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_highlighted_default {
	background: #ffe9d2;
	box-shadow: #ffb871 0 1px 4px 0 inset;
	color: #000;
}
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_highlighted_mint {
	background: #c1ffc9;
	box-shadow: #00dd1c 0 1px 4px 0 inset;
	color: #000;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default,
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_current {
	background: #33aaff;
	box-shadow: #178fe5 0 1px 3px 0 inset;
	color: #fff;
	font-weight: 700;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month,
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled,
.xdsoft_datetimepicker .xdsoft_time_box >div >div.xdsoft_disabled {
	opacity: 0.5;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	cursor: default;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month.xdsoft_disabled {
	opacity: 0.2;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
}

.xdsoft_datetimepicker .xdsoft_calendar td:hover,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div:hover {
	color: #fff !important;
	background: #ff8000 !important;
	box-shadow: none !important;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current.xdsoft_disabled:hover,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box>div>div.xdsoft_current.xdsoft_disabled:hover {
	background: #33aaff !important;
	box-shadow: #178fe5 0 1px 3px 0 inset !important;
	color: #fff !important;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled:hover,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_disabled:hover {
	color: inherit	!important;
	background: inherit !important;
	box-shadow: inherit !important;
}

.xdsoft_datetimepicker .xdsoft_calendar th {
	font-weight: 700;
	text-align: center;
	color: #999;
	cursor: default;
}

.xdsoft_datetimepicker .xdsoft_copyright {
	color: #ccc !important;
	font-size: 10px;
	clear: both;
	float: none;
	margin-left: 8px;
}

.xdsoft_datetimepicker .xdsoft_copyright a { color: #eee !important }
.xdsoft_datetimepicker .xdsoft_copyright a:hover { color: #aaa !important }

.xdsoft_time_box {
	position: relative;
	border: 1px solid #ccc;
}
.xdsoft_scrollbar >.xdsoft_scroller {
	background: #ccc !important;
	height: 20px;
	border-radius: 3px;
}
.xdsoft_scrollbar {
	position: absolute;
	width: 7px;
	right: 0;
	top: 0;
	bottom: 0;
	cursor: pointer;
}
.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_scrollbar {
	left: 0;
	right: auto;
}
.xdsoft_scroller_box {
	position: relative;
}

.xdsoft_datetimepicker.xdsoft_dark {
	box-shadow: 0 5px 15px -5px rgba(255, 255, 255, 0.506);
	background: #000;
	border-bottom: 1px solid #444;
	border-left: 1px solid #333;
	border-right: 1px solid #333;
	border-top: 1px solid #333;
	color: #ccc;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box {
	border-bottom: 1px solid #222;
}
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box >div >div {
	background: #0a0a0a;
	border-top: 1px solid #222;
	color: #999;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_label {
	background-color: #000;
}
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_label > .xdsoft_select {
	border: 1px solid #333;
	background: #000;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover {
	color: #000;
	background: #007fff;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current {
	background: #cc5500;
	box-shadow: #b03e00 0 1px 3px 0 inset;
	color: #000;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_label i,
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_prev,
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_next,
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_today_button {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAeCAYAAADaW7vzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QUExQUUzOTA0M0UyMTFFNDlBM0FFQTJENTExRDVBODYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QUExQUUzOTE0M0UyMTFFNDlBM0FFQTJENTExRDVBODYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBQTFBRTM4RTQzRTIxMUU0OUEzQUVBMkQ1MTFENUE4NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBQTFBRTM4RjQzRTIxMUU0OUEzQUVBMkQ1MTFENUE4NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pp0VxGEAAAIASURBVHja7JrNSgMxEMebtgh+3MSLr1T1Xn2CHoSKB08+QmR8Bx9A8e7RixdB9CKCoNdexIugxFlJa7rNZneTbLIpM/CnNLsdMvNjM8l0mRCiQ9Ye61IKCAgZAUnH+mU3MMZaHYChBnJUDzWOFZdVfc5+ZFLbrWDeXPwbxIqrLLfaeS0hEBVGIRQCEiZoHQwtlGSByCCdYBl8g8egTTAWoKQMRBRBcZxYlhzhKegqMOageErsCHVkk3hXIFooDgHB1KkHIHVgzKB4ADJQ/A1jAFmAYhkQqA5TOBtocrKrgXwQA8gcFIuAIO8sQSA7hidvPwaQGZSaAYHOUWJABhWWw2EMIH9QagQERU4SArJXo0ZZL18uvaxejXt/Em8xjVBXmvFr1KVm/AJ10tRe2XnraNqaJvKE3KHuUbfK1E+VHB0q40/y3sdQSxY4FHWeKJCunP8UyDdqJZenT3ntVV5jIYCAh20vT7ioP8tpf6E2lfEMwERe+whV1MHjwZB7PBiCxcGQWwKZKD62lfGNnP/1poFAA60T7rF1UgcKd2id3KDeUS+oLWV8DfWAepOfq00CgQabi9zjcgJVYVD7PVzQUAUGAQkbNJTBICDhgwYTjDYD6XeW08ZKh+A4pYkzenOxXUbvZcWz7E8ykRMnIHGX1XPl+1m2vPYpL+2qdb8CDAARlKFEz/ZVkAAAAABJRU5ErkJggg==);
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td,
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar th {
	background: #0a0a0a;
	border: 1px solid #222;
	color: #999;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar th {
	background: #0e0e0e;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_today {
	color: #cc5500;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_highlighted_default {
	background: #ffe9d2;
	box-shadow: #ffb871 0 1px 4px 0 inset;
	color:#000;
}
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_highlighted_mint {
	background: #c1ffc9;
	box-shadow: #00dd1c 0 1px 4px 0 inset;
	color:#000;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_default,
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_current,
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_current {
	background: #cc5500;
	box-shadow: #b03e00 0 1px 3px 0 inset;
	color: #000;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td:hover,
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box >div >div:hover {
	color: #000 !important;
	background: #007fff !important;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar th {
	color: #666;
}

.xdsoft_datetimepicker.xdsoft_dark .xdsoft_copyright { color: #333 !important }
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_copyright a { color: #111 !important }
.xdsoft_datetimepicker.xdsoft_dark .xdsoft_copyright a:hover { color: #555 !important }

.xdsoft_dark .xdsoft_time_box {
	border: 1px solid #333;
}

.xdsoft_dark .xdsoft_scrollbar >.xdsoft_scroller {
	background: #333 !important;
}
.xdsoft_datetimepicker .xdsoft_save_selected {
    display: block;
    border: 1px solid #dddddd !important;
    margin-top: 5px;
    width: 100%;
    color: #454551;
    font-size: 13px;
}
.xdsoft_datetimepicker .blue-gradient-button {
	font-family: "museo-sans", "Book Antiqua", sans-serif;
	font-size: 12px;
	font-weight: 300;
	color: #82878c;
	height: 28px;
	position: relative;
	padding: 4px 17px 4px 33px;
	border: 1px solid #d7d8da;
	background: -moz-linear-gradient(top, #fff 0%, #f4f8fa 73%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(73%, #f4f8fa));
	/* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #fff 0%, #f4f8fa 73%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #fff 0%, #f4f8fa 73%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, #fff 0%, #f4f8fa 73%);
	/* IE10+ */
	background: linear-gradient(to bottom, #fff 0%, #f4f8fa 73%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#f4f8fa',GradientType=0 );
/* IE6-9 */
}
.xdsoft_datetimepicker .blue-gradient-button:hover, .xdsoft_datetimepicker .blue-gradient-button:focus, .xdsoft_datetimepicker .blue-gradient-button:hover span, .xdsoft_datetimepicker .blue-gradient-button:focus span {
  color: #454551;
  background: -moz-linear-gradient(top, #f4f8fa 0%, #FFF 73%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4f8fa), color-stop(73%, #FFF));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #f4f8fa 0%, #FFF 73%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #f4f8fa 0%, #FFF 73%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #f4f8fa 0%, #FFF 73%);
  /* IE10+ */
  background: linear-gradient(to bottom, #f4f8fa 0%, #FFF 73%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f8fa', endColorstr='#FFF',GradientType=0 );
  /* IE6-9 */
}

/*!
Chosen, a Select Box Enhancer for jQuery and Prototype
by Patrick Filler for Harvest, http://getharvest.com

Version 1.8.7
Full source at https://github.com/harvesthq/chosen
Copyright (c) 2011-2018 Harvest http://getharvest.com

MIT License, https://github.com/harvesthq/chosen/blob/master/LICENSE.md
This file is generated by `grunt build`, do not edit it by hand.
*/

/* @group Base */
.chosen-container {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  font-size: 13px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.chosen-container * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.chosen-container .chosen-drop {
  position: absolute;
  top: 100%;
  z-index: 1010;
  width: 100%;
  border: 1px solid #aaa;
  border-top: 0;
  background: #fff;
  -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
          box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
  clip: rect(0, 0, 0, 0);
  -webkit-clip-path: inset(100% 100%);
          clip-path: inset(100% 100%);
}

.chosen-container.chosen-with-drop .chosen-drop {
  clip: auto;
  -webkit-clip-path: none;
          clip-path: none;
}

.chosen-container a {
  cursor: pointer;
}

.chosen-container .search-choice .group-name, .chosen-container .chosen-single .group-name {
  margin-right: 4px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: normal;
  color: #999999;
}

.chosen-container .search-choice .group-name:after, .chosen-container .chosen-single .group-name:after {
  content: ":";
  padding-left: 2px;
  vertical-align: top;
}

/* @end */
/* @group Single Chosen */
.chosen-container-single .chosen-single {
  position: relative;
  display: block;
  overflow: hidden;
  padding: 0 0 0 8px;
  height: 25px;
  border: 1px solid #aaa;
  border-radius: 5px;
  background-color: #fff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #fff), color-stop(50%, #f6f6f6), color-stop(52%, #eee), to(#f4f4f4));
  background: linear-gradient(#fff 20%, #f6f6f6 50%, #eee 52%, #f4f4f4 100%);
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 3px #fff inset, 0 1px 1px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 3px #fff inset, 0 1px 1px rgba(0, 0, 0, 0.1);
  color: #444;
  text-decoration: none;
  white-space: nowrap;
  line-height: 24px;
}

.chosen-container-single .chosen-default {
  color: #999;
}

.chosen-container-single .chosen-single span {
  display: block;
  overflow: hidden;
  margin-right: 26px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chosen-container-single .chosen-single-with-deselect span {
  margin-right: 38px;
}

.chosen-container-single .chosen-single abbr {
  position: absolute;
  top: 6px;
  right: 26px;
  display: block;
  width: 12px;
  height: 12px;
  background: url("../images/chosen-sprite.png") -42px 1px no-repeat;
  font-size: 1px;
}

.chosen-container-single .chosen-single abbr:hover {
  background-position: -42px -10px;
}

.chosen-container-single.chosen-disabled .chosen-single abbr:hover {
  background-position: -42px -10px;
}

.chosen-container-single .chosen-single div {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 18px;
  height: 100%;
}

.chosen-container-single .chosen-single div b {
  display: block;
  width: 100%;
  height: 100%;
  background: url("../images/chosen-sprite.png") no-repeat 0px 2px;
}

.chosen-container-single .chosen-search {
  position: relative;
  z-index: 1010;
  margin: 0;
  padding: 3px 4px;
  white-space: nowrap;
}

.chosen-container-single .chosen-search input[type="text"] {
  margin: 1px 0;
  padding: 4px 20px 4px 5px;
  width: 100%;
  height: auto;
  outline: 0;
  border: 1px solid #aaa;
  background: url("../images/chosen-sprite.png") no-repeat 100% -20px;
  font-size: 1em;
  font-family: sans-serif;
  line-height: normal;
  border-radius: 0;
}

.chosen-container-single .chosen-drop {
  margin-top: -1px;
  border-radius: 0 0 4px 4px;
  background-clip: padding-box;
}

.chosen-container-single.chosen-container-single-nosearch .chosen-search {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  -webkit-clip-path: inset(100% 100%);
          clip-path: inset(100% 100%);
}

/* @end */
/* @group Results */
.chosen-container .chosen-results {
  color: #444;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  margin: 0 4px 4px 0;
  padding: 0 0 0 4px;
  max-height: 240px;
  -webkit-overflow-scrolling: touch;
}

.chosen-container .chosen-results li {
  display: none;
  margin: 0;
  padding: 5px 6px;
  list-style: none;
  line-height: 15px;
  word-wrap: break-word;
  -webkit-touch-callout: none;
}

.chosen-container .chosen-results li.active-result {
  display: list-item;
  cursor: pointer;
}

.chosen-container .chosen-results li.disabled-result {
  display: list-item;
  color: #ccc;
  cursor: default;
}

.chosen-container .chosen-results li.highlighted {
  background-color: #3875d7;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #3875d7), color-stop(90%, #2a62bc));
  background-image: linear-gradient(#3875d7 20%, #2a62bc 90%);
  color: #fff;
}

.chosen-container .chosen-results li.no-results {
  color: #777;
  display: list-item;
  background: #f4f4f4;
}

.chosen-container .chosen-results li.group-result {
  display: list-item;
  font-weight: bold;
  cursor: default;
}

.chosen-container .chosen-results li.group-option {
  padding-left: 15px;
}

.chosen-container .chosen-results li em {
  font-style: normal;
  text-decoration: underline;
}

/* @end */
/* @group Multi Chosen */
.chosen-container-multi .chosen-choices {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 0 5px;
  width: 100%;
  height: auto;
  border: 1px solid #aaa;
  background-color: #fff;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #eee), color-stop(15%, #fff));
  background-image: linear-gradient(#eee 1%, #fff 15%);
  cursor: text;
}

.chosen-container-multi .chosen-choices li {
  float: left;
  list-style: none;
}

.chosen-container-multi .chosen-choices li.search-field {
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
  margin: 1px 0;
  padding: 0;
  height: 25px;
  outline: 0;
  border: 0 !important;
  background: transparent !important;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #999;
  font-size: 100%;
  font-family: sans-serif;
  line-height: normal;
  border-radius: 0;
  width: 25px;
}

.chosen-container-multi .chosen-choices li.search-choice {
  position: relative;
  margin: 3px 5px 3px 0;
  padding: 3px 20px 3px 5px;
  border: 1px solid #aaa;
  max-width: 100%;
  border-radius: 3px;
  background-color: #eeeeee;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), to(#eee));
  background-image: linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
  background-size: 100% 19px;
  background-repeat: repeat-x;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  color: #333;
  line-height: 13px;
  cursor: default;
}

.chosen-container-multi .chosen-choices li.search-choice span {
  word-wrap: break-word;
}

.chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
  position: absolute;
  top: 4px;
  right: 3px;
  display: block;
  width: 12px;
  height: 12px;
  background: url("../images/chosen-sprite.png") -42px 1px no-repeat;
  font-size: 1px;
}

.chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover {
  background-position: -42px -10px;
}

.chosen-container-multi .chosen-choices li.search-choice-disabled {
  padding-right: 5px;
  border: 1px solid #ccc;
  background-color: #e4e4e4;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), to(#eee));
  background-image: linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
  color: #666;
}

.chosen-container-multi .chosen-choices li.search-choice-focus {
  background: #d4d4d4;
}

.chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close {
  background-position: -42px -10px;
}

.chosen-container-multi .chosen-results {
  margin: 0;
  padding: 0;
}

.chosen-container-multi .chosen-drop .result-selected {
  display: list-item;
  color: #ccc;
  cursor: default;
}

/* @end */
/* @group Active  */
.chosen-container-active .chosen-single {
  border: 1px solid #5897fb;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.chosen-container-active.chosen-with-drop .chosen-single {
  border: 1px solid #aaa;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #eee), color-stop(80%, #fff));
  background-image: linear-gradient(#eee 20%, #fff 80%);
  -webkit-box-shadow: 0 1px 0 #fff inset;
          box-shadow: 0 1px 0 #fff inset;
}

.chosen-container-active.chosen-with-drop .chosen-single div {
  border-left: none;
  background: transparent;
}

.chosen-container-active.chosen-with-drop .chosen-single div b {
  background-position: -18px 2px;
}

.chosen-container-active .chosen-choices {
  border: 1px solid #5897fb;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.chosen-container-active .chosen-choices li.search-field input[type="text"] {
  color: #222 !important;
}

/* @end */
/* @group Disabled Support */
.chosen-disabled {
  opacity: 0.5 !important;
  cursor: default;
}

.chosen-disabled .chosen-single {
  cursor: default;
}

.chosen-disabled .chosen-choices .search-choice .search-choice-close {
  cursor: default;
}

/* @end */
/* @group Right to Left */
.chosen-rtl {
  text-align: right;
}

.chosen-rtl .chosen-single {
  overflow: visible;
  padding: 0 8px 0 0;
}

.chosen-rtl .chosen-single span {
  margin-right: 0;
  margin-left: 26px;
  direction: rtl;
}

.chosen-rtl .chosen-single-with-deselect span {
  margin-left: 38px;
}

.chosen-rtl .chosen-single div {
  right: auto;
  left: 3px;
}

.chosen-rtl .chosen-single abbr {
  right: auto;
  left: 26px;
}

.chosen-rtl .chosen-choices li {
  float: right;
}

.chosen-rtl .chosen-choices li.search-field input[type="text"] {
  direction: rtl;
}

.chosen-rtl .chosen-choices li.search-choice {
  margin: 3px 5px 3px 0;
  padding: 3px 5px 3px 19px;
}

.chosen-rtl .chosen-choices li.search-choice .search-choice-close {
  right: auto;
  left: 4px;
}

.chosen-rtl.chosen-container-single .chosen-results {
  margin: 0 0 4px 4px;
  padding: 0 4px 0 0;
}

.chosen-rtl .chosen-results li.group-option {
  padding-right: 15px;
  padding-left: 0;
}

.chosen-rtl.chosen-container-active.chosen-with-drop .chosen-single div {
  border-right: none;
}

.chosen-rtl .chosen-search input[type="text"] {
  padding: 4px 5px 4px 20px;
  background: url("../images/chosen-sprite.png") no-repeat -30px -20px;
  direction: rtl;
}

.chosen-rtl.chosen-container-single .chosen-single div b {
  background-position: 6px 2px;
}

.chosen-rtl.chosen-container-single.chosen-with-drop .chosen-single div b {
  background-position: -12px 2px;
}

/* @end */
/* @group Retina compatibility */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi), only screen and (min-resolution: 1.5dppx) {
  .chosen-rtl .chosen-search input[type="text"],
  .chosen-container-single .chosen-single abbr,
  .chosen-container-single .chosen-single div b,
  .chosen-container-single .chosen-search input[type="text"],
  .chosen-container-multi .chosen-choices .search-choice .search-choice-close,
  .chosen-container .chosen-results-scroll-down span,
  .chosen-container .chosen-results-scroll-up span {
    background-image: url("../images/chosen-sprite@2x.png") !important;
    background-size: 52px 37px !important;
    background-repeat: no-repeat !important;
  }
}

/* @end */

body, html {
	height: 100%;
}

.grido .ckeditgrido tr.active td {
	background-color: inherit !important;
}

.grido .grid-header-message {
    max-width: 120ex;
}

.grido td.grid-cell-message {
    max-width: 120ex;
    overflow: auto;
}

.applogs form.grido {
	max-width: 100%;
    overflow: auto;
}

.applogs .grid-cell-url, .applogs .grid-cell-uuid {
	word-break: break-all;
}

/** VUE component styles */
.image-control {
	max-width: 6em;
	max-height: 6em;

  cursor: zoom-in;
}

.image-dialog-delete {
  position: absolute;
  color: red;
  right: 80px;
  top: 20px;
  width: 60px;
  height: 60px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  transition: 300ms ease-out;
  outline: none;
}

.image-dialog-replace {
  position: absolute;
  right: 140px;
  top: 20px;
  width: 60px;
  height: 60px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  transition: 300ms ease-out;
  outline: none;
}

.image-dialog-replace:hover {
  border: 1px solid;
}

.image-dialog-close {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 60px;
  height: 60px;
  padding: 0;
  background: none;
  border: none;
  cursor: zoom-out;
  transition: 300ms ease-out;
  outline: none;
}

.image-dialog-close::before, .image-dialog-close::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -0.5px;
  margin-left: -20px;
  width: 40px;
  height: 1px;
  background-color: #000;
}
.image-dialog-close::before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.image-dialog-close::after {
  -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
}
.image-dialog-close:hover {
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg);
}

.image-dialog-background {
  overflow: auto;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  padding: 80px 40px;
  background-color: rgba(255, 255, 255, 0.9);
  text-align: center;
  cursor: zoom-out;
  z-index: 9999;
}

.image-dialog-animate {
  display: none;
  position: absolute;
  -webkit-transform-origin: left top;
          transform-origin: left top;
}
.image-dialog-animate.loading {
  display: block;
}

.dialog-enter-active, .dialog-leave-active {
  transition: background-color 300ms ease-out;
}
.dialog-enter, .dialog-leave-to {
  background-color: rgba(255, 255, 255, 0);
}
.dialog-enter-active .image-dialog-animate, .dialog-leave-active .image-dialog-animate {
  display: block;
  transition: -webkit-transform 300ms cubic-bezier(1, 0, 0.7, 1);
  transition: transform 300ms cubic-bezier(1, 0, 0.7, 1);
  transition: transform 300ms cubic-bezier(1, 0, 0.7, 1), -webkit-transform 300ms cubic-bezier(1, 0, 0.7, 1);
}
.dialog-enter-active .image-dialog-full, .dialog-leave-active .image-dialog-full {
  visibility: hidden;
}

.area-hidden {
  min-height: 0;
  border: none;
  margin: 1ex 0ex;
}

.modal-mask {
  position: fixed;
  z-index: 9998;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  transition: opacity 0.3s ease;
}

.modal-wrapper {
  display: block;
  vertical-align: middle;

  width: 80%;
  max-width: 80%;
  
  height: 600px;
  max-height: 80%;
  
  position: fixed;
  
  left: 50%;
  top: 50%;
  
  /* Use this for centering if unknown width/height */
  transform: translate(-50%, -50%);
}

.modal-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  padding: 20px 50px 20px 20px;

  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);
  transition: all 0.3s ease;
  font-family: Helvetica, Arial, sans-serif;
}

.modal-header h3 {
  margin-top: 0;
  color: #42b983;
}

.modal-body {
  margin: 20px 0;
}

.modal-default-button {
  float: right;
}

.modal-enter {
  opacity: 0;
}

.modal-leave-active {
  opacity: 0;
}

.modal-enter .modal-container,
.modal-leave-active .modal-container {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

/*
 * Skin: z-agency
 * --------------
 */

/* Skin core */
:root {

    /* Color palette */
    /* Use in CSS only if specific color is needed */
    /* Otherwise use specific variables */
    --white: #FFFFFF;
    --red: #CC1D1D;
    --amber: #ee9c1c;
    --lightgreen: #418176;
    --green: #004C3F;
    --gray: #2E3433;
    --black: #000000;


    /* Master colors used in styles */
    --main: var(--green);
    --main-dark: #002721;
    --main-darker: #00201B;
    --main-light: var(--lightgreen);
    --main-lighter: #DEF2EE;
    --main-disabled: var(--gray);

    /* Branding logo - used mainly for backgrounds and watermarks. */
    /* SVG must have dark (e.g. black) and light (e.g. white) fill colors and real tint has to defined by fill-opacity */
    /* as an addon overlay to its underlaying elements resulting into lighter or darker tint in shape of logo */
    --logo-svg-light: url(/images/terrahunt-logo-light.svg);
    --logo-svg-dark: url(/images/terrahunt-logo-dark.svg);

    /* Portal wide default font family */
    --font-family: "Open Sans", 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    /* Used for default text color */
    --text-color: var(--main);
    --text-color-light: var(--main-lighter);
    /* Base font size, other standard text and header font sizes are relative to this base using percentage increase or decrease */
    --font-size-base: 14px;

    /* Headline text color, used with h1, h2, ... */
    --headline-color: var(--text-color);

    --link-color: var(--text-color); /* Anchor links text color */
    --link-color-hover: var(--black); /* Anchor links text color on hover */

    --line-dark-color: var(--main-light); /* Used e.g. with table header */
    --line-light-color: var(--main-lighter); /* Used e.g. as delimiter between table rows */

    /* Table coloring - should be from master color palette, but using transparency */
    --tr-default: #269C7E00; /* Default table row color */
    --tr-default-hover: #269C7E0F; /* Highlight of table row you're hovering over */
    --tr-selected: #E5F6F2; /* Selected table row (if selectable). Used e.g. within event details */
    --tr-penalty: #ee9c1c1F; /* Penalty row */
    --tr-penalty-hover: #ee9c1c33; /* Penalty row hover */
    --tr-deleted: #CC1D1D13; /* Deleted row */
    --tr-deleted-hover: #CC1D1D1F; /* Deleted row hover */

    /* Button is applied to button tag or elements with .button class */
    --button-color: var(--text-color); /* Button text color */
    --button-background: var(--main-lighter); /* Button background color */
    --button-color-hover: var(--white); /* Button text color when hovered over */
    --button-background-hover: var(--main-light); /* Button background color when hovered over */
    
    /* Applied to main button in given view, e.g. search button, save, action buttons, etc. */
    --button-main-color: var(--white); /* Main button text color */
    --button-main-background: var(--main-light); /* Main button background color */
    --button-main-color-hover: var(--white); /* Main button text color when hovered over */
    --button-main-background-hover: var(--main); /* Main button background color when hovered over */
    

    /* Applied to option */
    --select-option-color: var(--text-color); /* Select box option item text color */
    --select-option-background: var(--button-background); /* Select box option item background color */

    --menu-background-primary: var(--main-dark);
    --menu-background-secondary: var(--text-color);
    --menu-title-background: var(--main-darker);
    --menu-title-color-: var(--main-darker);
    --menu-text-color: var(--main-light);
    --menu-text-color-hover: var(--main-lighter);

    --tag-standard-background: transparent;
    --tag-standard-color: var(--text-color);
    --tag-standard-border-color: var(--text-color);
    --tag-special-color: var(--white);
    --tag-special-background: var(--amber);
    --tag-important-background: var(--red);
    --tag-important-color: var(--white);
    --tag-disabled-background: var(--white);
    --tag-disabled-color: var(--main-disabled);
}
/*
 * Skin: z-agency
 * ------------
 */

 .skin-z-agency {
    font-family: "Open Sans", 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-weight: 300;
    font-style: normal;
    /* font-size: 14px;  */
}

.skin-z-agency .main-header .navbar {
    background-color: #ffffff;
    min-height: 50px;
    max-height: 50px;
    height: 50px;
}

.skin-z-agency .main-header .navbar .nav>li>a {
    color: #004c3f;
}

.skin-z-agency .main-header .navbar .nav>li>a:hover,
.skin-z-agency .main-header .navbar .nav>li>a:active,
.skin-z-agency .main-header .navbar .nav>li>a:focus,
.skin-z-agency .main-header .navbar .nav .open>a,
.skin-z-agency .main-header .navbar .nav .open>a:hover,
.skin-z-agency .main-header .navbar .nav .open>a:focus,
.skin-z-agency .main-header .navbar .nav>.active>a {
    background: #ffffff;
    color: #002721;
}

.skin-z-agency .main-header .nav>li>a {
    padding-right: 5px;
    padding-left: 5px;
}

.skin-z-agency .main-header .navbar .sidebar-toggle {
    color: var(--menu-background-primary);
}

.skin-z-agency .main-header .navbar .sidebar-toggle:hover {
    color: #002721;
    background: #ffffff;
}

@media (max-width: 767px) {
    .skin-z-agency .main-header .navbar .dropdown-menu li.divider {
        background-color: rgba(255, 255, 255, 0.1);
    }
    .skin-z-agency .main-header .navbar .dropdown-menu li a {
        /* color: #fff; */
    }
    .skin-z-agency .main-header .navbar .dropdown-menu li a:hover {
        /* background: #00332a; */
    }
}

.main-header .navbar-custom-menu {
    padding-right: 20px;
    width: 300px;
}

.main-header .navbar-custom-menu .user-title {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.main-header .main-toggle,
.main-header .nav-toggle {
    position: absolute;
    z-index: 200;
    width: 45px;
}

.main-header .main-title,
.main-header .nav-title {
    display: inline-block;
    padding-left: 40px;
    box-sizing: border-box;
    width: calc(100% - 300px);
}

.main-header .language .dropdown-toggle {
    padding: 13px;
}

@media (max-width: 991px) {
    .main-header .main-title {
        width: calc(100% - 120px);
    }
    .main-header .navbar-custom-menu {
        width: 120px;
    }
}

.skin-z-agency .main-header .logo {
    background-color: #004c3f;
    color: #ffffff;
    border-bottom: 0 solid transparent;
}

.skin-z-agency .main-header .logo:hover {
    background-color: #00473b;
}


.skin-z-agency .main-header li.user-header {
    background-color: #004c3f;
}

.skin-z-agency .main-header a.back-link {
    /* color: #468378; */
}

.skin-z-agency .content-header {
    background: transparent;
}

.skin-z-agency .wrapper,
.skin-z-agency .main-sidebar,
.skin-z-agency .left-side {
    font-weight: 400;
    background-color: var(--menu-background-primary);
}

.skin-z-agency .sidebar-menu>li.header {
    color: #086454;
    background: #00201B;
    text-transform: uppercase;
    font-weight: bold;
}

.skin-z-agency .sidebar-menu>li>a {
    border-left: 3px solid transparent;
}

.skin-z-agency .sidebar-menu>li:hover>a {
    color: var(--menu-text-color-hover);
}

.skin-z-agency .sidebar-menu>li.active>a {
    border-left-color: #269C7E;
}

.treeview.active i.fa-angle-left,
.treeview:not(.active) i.fa-angle-down {
    display: none;
}

.skin-z-agency .sidebar-menu>li>.treeview-menu {
    background: #004137;
}

.skin-z-agency .sidebar-menu .treeview-menu li:hover>a {
    color: var(--menu-text-color-hover);
}

.skin-z-agency .sidebar-menu .treeview-menu li.active > a {
  border-left: 2px solid #269C7E;
}

.skin-z-agency .sidebar a {
    color: var(--menu-text-color);
    background: #002721;
    border-bottom: 1px solid #001d18;
}

.skin-z-agency .sidebar a:hover {
    text-decoration: none;
}

.skin-z-agency .navbar-nav>.user-menu>a>.user-title {
    float: left;
    color: #81938F;
    background: #fff;
}

.skin-z-agency .navbar-nav>.user-menu>a>.user-title>span {
    text-decoration: underline;
}

.skin-z-agency .content input::placeholder {
    color: #81938F;
}

.skin-z-agency .content {
    padding-left: 30px;
    padding-right: 30px;
    color: #276459;
}

.skin-z-agency .content-wrapper {
    background: #f9fbfb;
}

.skin-z-agency .content .z-button {
    color: #269c7e;
    background: #e8f5f2;
    border: 3px;
    padding: 10px;
    border-radius: 3px;
    cursor: pointer;
}

.skin-z-agency .content .form-group .z-button {
    height: 40px;
    /* padding: 0px 10px; */
    box-sizing: border-box;
}

.skin-z-agency .content .z-button:hover {
    color: #ffffff;
    background: #269c7e;
}

.skin-z-agency .content .z-button-search {
    position: relative;
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    padding: 0px;
}

.skin-z-agency .content .z-button-highlighted {
    color: #ffffff;
    background: #269c7e;
    border: 3px;
    padding: 10px;
    border-radius: 3px;
    cursor: pointer;
    box-sizing: border-box;
    height: 40px;
}

.skin-z-agency .content .z-button-highlighted:hover {
    color: #ffffff;
    background: #269c7e;
}

.skin-z-agency .content table.z-table {
    width: 100%;
}

.z-table a {
    color: var(--link-color);
    text-decoration: underline;
}

.z-table a:hover {
    text-decoration: underline;
}

.skin-z-agency .z-table th,
.skin-z-agency .z-table td {
    height: 42px;
    padding: 4px;
}

.skin-z-agency .z-table th {
    color: #075B45;
    font-weight: bolder;
    vertical-align: middle;
}

.skin-z-agency .z-table {
    border-top: 2px solid var(--line-dark-color);
}

/* .skin-z-agency .z-table thead th, */
.skin-z-agency .z-table thead tr
{
    border-bottom: 2px solid var(--line-dark-color);
}

#team_results .selected {
    border-top: 1px solid var(--line-dark-color);
    background-color: var(--tr-selected);
}

#team_results .team-details {
    border-bottom: 1px solid var(--line-dark-color);
    background-color: var(--tr-selected);
}

.skin-z-agency .content table td {
    vertical-align: middle;
}
.skin-z-agency table tr {
    border-top: 1px solid rgba(38, 156, 126, 0.1);
}

.z-table>tbody textarea,
.z-table>tbody input[type="text"] {
    width: 100%;
}

.z-table>tbody input.z-order {
    width: 35px;
    height: 35px;
    text-align: center;
}

.skin-z-agency .team-details .details {
    padding-left: 40px;
}

.skin-z-agency .team-details table tr {
    border: none;
}

.skin-z-agency .team-details table td,
.skin-z-agency .team-details table th {
    padding: 2px;
    height: unset;
}

.skin-z-agency div.game-type {
    background-color: grey;
    color: #fff;
    font-weight: 800;
    font-size: 16px;
    font-style: normal;
    height: 30px;
    width: 30px;
    min-width: 30px;
    max-width: 30px;
    border-radius: 2px;
    text-transform: uppercase;
    text-align: center;
    line-height: 30px;
}

.skin-z-agency div.game-type.small {
    height: 20px;
    width: 20px;
    min-width: 20px;
    max-width: 20px;
    line-height: 20px;
    font-size: 14px;
}

.skin-z-agency div.game-type.green {
    background-color: #046459;
}

.skin-z-agency div.game-type.yellow {
    background-color: #EEB21C;
}

.skin-z-agency div.game-type.red {
    background-color: #C82463;
}

/* .skin-z-agency .content table.z-table>tbody>tr.penalty>td,
.skin-z-agency .content table.z-table>tbody>tr.penalty>td * {
    color: #269C7E !important;
} */

.skin-z-agency .content table.z-table span.checkable {
    vertical-align: middle;
    display: inline-block;
    width: 19px;
    height: 19px;
    /* background-image: url('../images/input-bg.png'); */
    box-shadow: 0px 8px 6px -8px inset rgba(0,0,0,0.2);
    border: 1px solid #ccc;
    border-radius: 2px;
    background-repeat-y: no-repeat;
}

.skin-z-agency .content table.z-table span.checked {
    border-color: #269C7E;
    background-image: url('../images/checked.png');
}

.skin-z-agency .content label {
    /* color: #81938F; */
    font-weight: normal;
}

.skin-z-agency .content input:not([type="submit"]):not([type="button"]),
.skin-z-agency .content select,
.skin-z-agency .content textarea,
.skin-z-agency .content label span {
    /* background-image: url('../images/input-bg.png'); */
    box-shadow: 0px 8px 6px -8px inset rgba(0,0,0,0.2);
    border-radius: 2px;
    border: 1px solid #ccc;
    background-repeat-y: no-repeat;
}

.skin-z-agency textarea {
    resize: vertical;
}

.skin-z-agency .content input[type="number"],
.skin-z-agency .content input[type="text"],
.skin-z-agency .content input[type="password"],
.skin-z-agency .content input[type="date"],
.skin-z-agency .content input[type="email"],
.skin-z-agency .content select {
    padding-left: 6px;
    height: 36px;
    box-sizing: border-box;
}

.skin-z-agency .content input[type="checkbox"] {
    display: none;
}

.skin-z-agency .content input[type="checkbox"]+label span {
    margin: -2px 10px 0 0;
    cursor: pointer;
    vertical-align: middle;
    display: inline-block;
    width: 19px;
    height: 19px;
}

.skin-z-agency .content input[type="checkbox"]:checked+label span {
    border-color: #269C7E;
    background-color: #FFFFFF;
    background-image: url('../images/checked.png');
}

.skin-z-agency .content .action-buttons button>* {
    display: block;
    float: left;
    background-color: #E8F5F2;
    margin: 2px;
    cursor: pointer;
    min-width: 40px;
    height: 40px;
    color: #0f795e;
    font-size: 20px;
    line-height: 40px;
}

.skin-z-agency .content .action-buttons button>*:hover {
    background-color: #269C7E;
    color: #FFF;
}

.skin-z-agency .content .action-buttons a.edit {
    background-image: url('../images/icons.png');
    background-position: 0 0;
}

.skin-z-agency .content .action-buttons a.edit:hover {
    background-position: 0 40px;
}

.skin-z-agency .content .action-buttons a.map {
    background-image: url('../images/icons.png');
    background-position: -40px 0;
}

.skin-z-agency .content .action-buttons a.map:hover {
    background-position: -40px 40px;
}

.skin-z-agency .content .action-buttons a.penalty {
    background-image: url('../images/icons.png');
    background-position: 40px 0;
}

.skin-z-agency .content .action-buttons a.penalty:hover {
    background-position: 40px 40px;
}

.skin-z-agency .content .action-buttons a.play {
    background-image: url('../images/icons-play.png');
    background-position: 0 0;
}

.skin-z-agency .content .action-buttons a.play:hover {
    background-position: 0 40px;
}

.skin-z-agency .content .action-buttons button {
    padding: 0px;
    border: none;
    background-color: inherit;
    margin: 0px;
    float: right;
}

.skin-z-agency .content .z-form input[type="text"],
.skin-z-agency .content .z-form input[type="password"],
.skin-z-agency .content .z-form input[type="email"],
.skin-z-agency .content .z-form select,
.skin-z-agency .content .z-form textarea {
    width: 100%;
}

/* .skin-z-agency .content h1 {
    display: block;
    color: #468378;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 800;
    border-bottom: 2px solid #468378;
}

.skin-z-agency .content h2 {
    font-style: normal;
    display: block;
    color: #468378;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 400;
    padding-bottom: 3px;
    border-bottom: 2px solid #468378;
}

.skin-z-agency .content h3 {
    font-style: normal;
    display: block;
    color: #468378;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: bold;
    padding-bottom: 3px;
} */

.skin-z-agency .main-footer {
    color: #002721;
}

.skin-z-agency .iwBackground>div:nth-child(2) {
    border-radius: 10px !important;
}

.skin-z-agency .iwBackground>div:nth-child(3)>div:nth-child(1)>div,
.skin-z-agency .iwBackground>div:nth-child(3) div:nth-child(2)>div {
    background-color: #269C7E !important;
}

.skin-z-agency .iwBackground>div:nth-child(4) {
    background-color: #269C7E !important;
    border-radius: 10px !important;
}

.skin-z-agency .gm-style-iw {
    color: white;
    font-size: 16px;
    font-weight: 300;
    padding: 12px !important;
    background-color: #269C7E !important;
}

.skin-z-agency .gm-style-iw-d {
    overflow: hidden !important;
}

.skin-z-agency .gm-style-iw a {
    color: white !important;
}

.skin-z-agency .gm-style-iw a:hover {
    text-decoration: underline !important;
}

.skin-z-agency .gm-style .gm-style-iw-t::after {
    background-color: #269C7E !important;
}

.skin-z-agency .alert .close {
    color: #fff;
    opacity: 1;
}

.skin-z-agency .form-control {
    color: inherit;
}

.skin-z-agency nav.z-agency-navbar {
    color: #468378;
}

.skin-z-agency nav.z-agency-navbar li {
    margin: 2px;
}

.skin-z-agency nav.z-agency-navbar .icon-bar {
    background-color: #468378;
}

.skin-z-agency nav.z-agency-navbar .navbar-header button.navbar-toggle {
    float: left;
}

.skin-z-agency nav.z-agency-navbar {
    min-height: 35px;
}

.skin-z-agency nav.z-agency-navbar .navbar-header,
.skin-z-agency nav.z-agency-navbar .navbar-header>* {
    height: 35px;
    line-height: 35px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.skin-z-agency .image-dialog-full {
    max-width: 100%;
}

.z-inline-content>* {
    display: inline-block;
}

.z-align-top {
    vertical-align: top;
}

.profile-photo {
    text-align: center;
}

.profile-photo img {
    width: 100%;
    max-width: 160px;
}

img.img-small {
    position: relative;
    display: block;
}

img.img-small,
img.img-small.alt-img:before {
    width: 40px;
    height: 40px;
}

.user-image.alt-img:before {
    width: 24px;
    height: 24px;
}

.alt-img {
    position: relative;
    display: inline-block;
}

.alt-img:before {
    content: '';
    display: inline-block;
    position: absolute;
    background-image: url('https://public.terrahunt.com/images/admin/user2-160x160.jpg');
    background-size: cover;
}

.user-header>img.alt-img:before {
    width: 84px;
    height: 84px;
    top: 0px;
    left: 0px;
}

.img-circle:before {
    border-radius: 50%;
}

.info span {
    font-style: italic;
    font-size: smaller;
}

*::placeholder {
    opacity: 0.5;
}

@media (max-width: 767px) {
    .skin-z-agency nav.z-agency-navbar {
        border: 1px solid #ccc;
        background-color: #e8f5f2;
    }
    .skin-z-agency nav.z-agency-navbar .z-button {
        width: 100%;
        height: 40px;
        text-align: left;
    }
    .skin-z-agency nav.z-agency-navbar select {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .skin-z-agency nav.z-agency-navbar .container-fluid,
    .skin-z-agency nav.z-agency-navbar .navbar-collapse,
    .skin-z-agency nav.z-agency-navbar .form-group {
        padding-left: 0px;
        padding-right: 0px;
    }
    .transpose-mobile-table td:before {
        display: none;
    }
    .gallery {
        /* margin-top: 20px; */
    }
    .gallery .media {
        margin: 6px;
    }
    .gallery img {
        height: 160px;
    }
    .filters {
        line-height: 30px;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 767px) {
    .skin-z-agency .content {
        padding: 15px;
    }
    .skin-z-agency .content td.z-name {
        font-weight: bold;
    }
    .table-responsive {
        border: none;
    }
    table.transpose-mobile-table,
    table.transpose-mobile-table thead,
    table.transpose-mobile-table tbody,
    table.transpose-mobile-table th,
    table.transpose-mobile-table td,
    table.transpose-mobile-table tr {
        display: block;
    }
    .table-responsive>table.transpose-mobile-table>tbody>tr>td,
    .table-responsive>table.transpose-mobile-table>tbody>tr>th,
    .table-responsive>table.transpose-mobile-table>tfoot>tr>td,
    .table-responsive>table.transpose-mobile-table>tfoot>tr>th,
    .table-responsive>table.transpose-mobile-table>thead>tr>td,
    .table-responsive>table.transpose-mobile-table>thead>tr>th {
        white-space: normal;
    }
    .transpose-mobile-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    table.transpose-mobile-table {
        /* border-width: 2px 0px;
    border-style: solid;
    border-color: #004c3f; */
        /* box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2); */
    }
    table.transpose-mobile-table tbody tr {
        border-width: 5px 0px;
        border-style: solid;
        border-color: #276358;
        /* margin: -2px 0px; */
        background-color: #FFF;
        /* border: none; */
        margin: 10px 0px;
        box-shadow: 0 0 12px -3px rgba(0, 0, 0, 0.3);
        border-radius: 13px;
        padding: 0px 5px;
        transition: background-color, box-shadow, transform;
        transition-duration: 0.1s;
        overflow: hidden;
    }
    table.transpose-mobile-table tbody tr:hover {
        box-shadow: 0px 3px 12px 0px rgba(0, 0, 0, 0.3);
        transform: scale(1.01);
    }
    .skin-z-agency .content table.transpose-mobile-table td {
        border: none;
        position: relative;
        padding: 4px 8px 4px 30%;
        height: unset;
        min-height: 30px;
        line-height: 14px;
        z-index: 9;
    }
    .skin-z-agency .content table.transpose-mobile-table td.z-select {
        z-index: 10;
        padding-left: 8px;
    }
    .transpose-mobile-table td::before {
        position: absolute;
        left: 4px;
        top: 4px;
        width: calc(30% - 8px);
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        font-size: 10px;
    }
    .transpose-mobile-table tr:nth-of-type(odd) {
        /* background: #e8f5f2;  */
    }
    .transpose-mobile-table td,
    .transpose-mobile-table th {
        text-align: left;
    }
    .skin-z-agency .transpose-mobile-table .action-buttons button,
    .skin-z-agency .transpose-mobile-table .action-buttons input[type="button"] {
        float: unset;
    }
    .skin-z-agency .transpose-mobile-table .action-buttons button>*,
    .skin-z-agency .transpose-mobile-table input[type="button"] {
        border-radius: 5px;
        box-shadow: 0px 2px 5px -2px rgba(0, 0, 0, 0.5);
    }
    .gallery .media {
        margin: 10px 15px 10px 15px;
        width: calc(100% - 30px);
    }
    .gallery .media img {
        width: 100%;
    }
}

.userStatusIcons {
    min-height: 30px;
}

.userStatusIcons div {
    float: left;
    padding: 2px;
    font-size: 22px;
}

.question-icon-correct,
.question-icon-wrong,
.question-icon-total {
    font-size: 18px;
}

.question-icon-wrong,
.userStatusIcons .banned {
    color: #ff5511;
}

.userStatusIcons .online,
.question-icon-correct {
    color: #269c7e;
}

.question-icon-total {
    color: #004c3f;
}

.userStatusIcons .offline {
    color: gray;
}

.selectable_rows tbody tr {
    cursor: pointer;
}

.selectable_rows tbody tr:hover {
    background-color: #e8f5f2;
}

.selectable_rows tbody .selected {
    background-color: #269c7e;
    color: #FFF;
}

.selectable_rows tbody .selected:hover {
    background-color: #269c7ecc;
    color: #FFF;
}

.gallery .section {
    margin-bottom: 15px;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.1);
    transition: all 0.3s;
}

.gallery .section:hover {
    background-color: white;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
}

.gallery .section-header {
    transition: all 0.3s;
    background-color: transparent;
}

.gallery .section:hover .section-header {
    /* background-color: #e8f5f2; */
    border-color: #269c7e;
}

.gallery .section-header {
    padding: 5px;
    height: 30px;
    border-style: solid;
    border-width: 2px 0px;
    border-color: #e8f5f2;
    line-height: 30px;
    box-sizing: content-box;
}

.gallery .section-actions div {
    width: 30px;
    height: 30px;
    background-color: #e8f5f2;
    display: inline-block;
    text-align: center;
    color: #269c7e;
}

.gallery .section-actions div:hover {
    background-color: #269c7e;
    color: #e8f5f2;
}

.gallery .section-title span {
    font-family: 'Source Sans Pro', sans-serif;
    font-style: normal;
    color: #468378;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 700;
}

.gallery .section-header .gallery-name {
    margin-left: 10px;
}

.gallery .section-media {
    padding: 15px;
}

.gallery .media {
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);
    transition: all 0.2s;
    float: left;
}

.gallery .media:hover {
    box-shadow: 0px 7px 10px 1px rgba(0, 0, 0, 0.5);
    transform: scale(1.03);
    opacity: 0.9;
}

.gallery .download-icon, .gallery .delete-icon {
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    position: absolute;
    /* background-color: #FFFFFF33; */
    background-color: #00000055;
    bottom: 15px;
    right: 15px;
    opacity: 0.8;
    transform: scale(0, 0);
    color: #FFF;
    transition: background-color, transform 0s;
    transition-delay: 0s;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
}

.gallery .delete-icon {
    right: 55px;
}

.gallery .media:hover .download-icon, .gallery .media:hover .delete-icon {
    transform: scale(1, 1);
    transition: transform 0.3s;
    transition-delay: 0.5s;
}

.gallery .download-icon:hover, .gallery .delete-icon:hover {
    opacity: 1;
    /* background-color: #FFFFFF55; */
    background-color: #00000088;
    transform: scale(1.01) translate(0px, -2px);
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.5);
}

a.disabled,
a.disabled * {
    background-color: #EEE !important;
    color: #AAA !important;
    cursor: not-allowed;
}

.sign-in>div {
    height: 100%;
}

.sign-in-ad {
    position: fixed;
}

.sign-in-logo {
    position: absolute;
    top: 12%;
    right: 50px;
    width: 500px;
}

.sign-in-picture {
    position: absolute;
    top: 15%;
    right: -60px;
    height: 70%;
}

.sign-in-text {
    font-size: 30px;
    color: #AAA;
    font-weight: 300;
}

.sign-in-box {
    margin: 10px 0px;
}

.sign-in-logo-small {
    background-color: #046459;
    padding: 10px 25px;
    height: 64px;
}

.sign-in-facebook {
    background-color: #236fc9;
    color: #FFF;
}

.sign-in-facebook:hover {
    background-color: #2e7edc;
    color: #FFF;
}

.sign-in-email {
    background-color: #00695c;
    color: #FFF;
}

.sign-in-email:hover {
    background-color: hsla(173, 100%, 24%, 1);
    color: #FFF;
}

.sign-in .checkbox {
    margin-left: 20px;
}

.get-mobile-logo * {
    width: 100%;
    height: 100%;
}

.sign-in .get-mobile-logo {
    padding: 10px 10%;
}

.sign-in-more {
    color: #999;
    text-align: center;
    font-weight: 400;
    font-size: 16px;
}

.sign-in-main {
    padding: 10px;
    margin: 10px;
}

.sign-in hr {
    height: 1px;
    color: #DDD;
    width: 120%;
    margin-left: -10%;
}

@media (min-width: 768px) and (max-width: 991px) {
    .sign-in-main {
        width: 300px;
        margin: 20px auto 10%;
    }
}

@media (min-width: 992px) {
    .sign-in-main {
        margin: 10px;
        position: absolute;
        left: 150px;
        width: 300px;
        top: 100px;
    }
}

.game-type-icons div {
    margin: 1px;
    float: left;
}

.game-type-icons div svg {
    height: 60%;
    width: 60%;
    margin: 20%;
    fill: #FFF;
}

#accessDetails .code {
    font-size: 24px;
    font-weight: bold;
    color: #468378;
}

#accessDetails .qr img {
    width: 60%;
    margin-left: 20%;
}

#accessDetails .modal-body {
    margin: 0px;
}

.eventdetail .header {
    line-height: 30px;
}

.eventdetail .header .game-type {
    margin-right: 10px;
    position: absolute;
}

.eventdetail .header .name {
    padding-left: 40px;
}

.skin-z-agency .content .flex-header {
    display: inline-flex;
    width: 100%;
    justify-content: space-between;
    align-items: flex-end;
}

.skin-z-agency .content .flex-header .small-action-buttons button {
    padding: 0px;
    border: none;
    background-color: inherit;
    margin: 0px;
    float: right;
}

.skin-z-agency .content .flex-header .small-action-buttons button>*:hover {
    color: #ffffff;
    background: #269c7e;
}


.skin-z-agency .content .flex-header .small-action-buttons button>* {
    display: block;
    float: left;
    background-color: #E8F5F2;
    margin: 2px;
    cursor: pointer;
    min-width: 30px;
    height: 30px;
    color: #0f795e;
    font-size: 16px;
    line-height: 30px;
    border-radius: 5px;
}

.event-finished {
    font-style: italic;
}

.event-finished:not(:hover) {
    background-color: #DDDDDD66;
}


.sortable span {
    cursor: pointer;
    text-decoration: underline;
}

.sortable span::after {
    padding-left: 3px;
    content: '\21F5';
}

.sorted.asc span::after {
    content: '\25B2';
}

.sorted.desc span::after {
    content: '\25BC';
}

.sign-in .language {
    float: right;
    margin: 20px 10px;
}

.user-title {
    line-height: 14px;
    position: relative;
    top: -4px;
    text-align: right;
    padding-right: 8px;
}

.user-title span {
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
}

.user-title .user-name {
    font-size: 14px;
    font-weight: bold;
}

.user-title .user-role {
    font-size: 12px;
}

.public-logo {
    position: absolute;
    top: 12%;
    left: -130px;
    width: 600px;
}

.skin-z-agency .tooltip-inner {
    background-color: #004c3f !important;
    color: white !important;
    font-size: 12px !important;
}

.skin-z-agency .tooltip-arrow {
    border-top-color: #004c3f !important;
}

.dropdown-element {
    background-color: rgb(232, 245, 242);
    box-shadow: rgba(0, 39, 33, 0.5) 0px 10px 20px -10px;
    border-width: 0px 1px 1px 1px;
    padding: 10px;
    border-color: #d2d6de;
    border-style: solid;
    border-radius: 0px 0px 5px 5px;
}

.tag {
    float: left;
    margin: 2px 2px;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: bold;
    padding: 2px 5px;
    border-radius: 3px;
    background-color: #269c7e;
    border: 1px solid #004c3f;
}

.tags-view-container {
    padding-right: 40px;
    height: 100%;
}

.tags-view {
    min-height: 24px;
    max-width: fit-content;
}

.tag-toggle,
.tag-toggle:active,
.tag-toggle:focus {
    width: 30px;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    padding: 3px;
    border: none;
    background-color: #e8f5f2;
    border-radius: 0px;
    color: black;
}

.tag-toggle:hover {
    background-color: #269c7e;
    color: white;
}

.pagination .active a,
.pagination .active a:hover {
    background-color: #046459;
    border-color: #046459;
}

.resultsCount * {
    color: #046459;
    font-size: 12px;
}

.resultsCount a.selected {
    font-weight: bold;
}
/*
 * Main CSS for Terrahunt
 * ----------------------
 */


/***** TAGS *****/
/* TAGS > CORE */
    body {
        font-family: var(--font-family);
        font-weight: 300;
        font-style: normal;
        font-size: var(--font-size-base);
    }
/* TAGS > Headers */
    h1, h2, h3 {
        display: block;
        color: var(--headline-color);
    }

    :is(h1, h2, h3).underline {
        border-bottom: 2px solid var(--headline-color);
    }

    /* Used as main headline which is typicaly breadcrumb, unless it is some section specific like modal window */
    h1 {
        font-size: calc(var(--font-size-base) + 6px);
        text-transform: uppercase;
        font-weight: 800;
    }

    /* Typically used as main header used on content views */
    h2 {
        font-style: normal;
        font-size: calc(var(--font-size-base) + 2px);
        text-transform: uppercase;
        font-weight: bold;
        padding-bottom: 3px;
    }

    /* Used only in case of specific subsection related to already used h2 headline */
    h3 {
        font-style: normal;
        font-size: calc(var(--font-size-base) + 2px);
        text-transform: capitalize;
        font-weight: bold;
        padding-bottom: 3px;
    }

    /* Any anchor color unless any specific design applies, e.g. .button */
    a {
        color: var(--link-color);
    }

    /* Any anchor hover color unless any specific design applies, e.g. .button:hover */
    a:hover {
        color: var(--link-color-hover);
    }

    /* Only fallback, anchor inside button shall be avoided */
    button a {
        background-color: var(--button-background);
        color: var(--button-color);
    }

/* TAGS > Tables */
    table {
        width: 100%;
    }

    table td,
    table th {
        padding: 5px 4px;
    }

    table thead tr {
        border-bottom: 2px solid var(--line-dark-color) !important;
        border-top: 2px solid var(--line-dark-color) !important;
    }

    table tbody tr:not(:first-of-type) {
        border-top: 1px solid var(--line-light-color);
    }

    table tbody tr {
        background-color: var(--tr-default);
    }

    table tbody tr:hover {
        background-color: var(--tr-default-hover);
    }

    table tbody tr.penalty {
        background-color: var(--tr-penalty);
    }

    table tbody tr.penalty:hover {
        background-color: var(--tr-penalty-hover);
    }

    table tbody tr.deleted {
        background-color: var(--tr-deleted);
    }

    table tbody tr.deleted:hover {
        background-color: var(--tr-deleted-hover);
    }

/* TAGS > Options */
    select option {
        color: var(--select-option-color);
        background-color: var(--select-option-background);
    }

/* SCROLLBAR */

    ::-webkit-scrollbar {
        width: 8px;
        border-radius: 10px;
        background-color: transparent;
    }

    ::-webkit-scrollbar:hover {
        width: 10px;
    }
  
    ::-webkit-scrollbar-track {
        border-radius: 10px;
        background-color: var(--main-lighter);
    }
   
    ::-webkit-scrollbar-thumb {
        background: var(--main-light); 
        border-radius: 10px;
    }
  
    ::-webkit-scrollbar-thumb:hover {
        background: var(--main); 
    }


/***** IMPORTANT CLASSES *****/
/* IMPORTANT CLASSES>ALIGNMENT */
    .justify-space {
        justify-content: space-between !important;
    }

    .justify-left {
        justify-content: flex-start !important;
    }

    .justify-right {
        justify-content: flex-end !important;
    }

    .justify-center {
        justify-content: center !important;
    }

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

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

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

    .ellipsis {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .spacer {
        height: 10px !important;
        width: 100% !important;
    }


/* IMPORTANT CLASSES>COLORS */


    
/* IMPORTANT CLASSES>SHAPES */
    .no-radius-left {
        border-top-left-radius: 0px !important;
        border-bottom-left-radius: 0px !important;
    }

/* IMPORTANT CLASSES>BACKGROUND */
    .bg-logo-light {
        background-image: var(--logo-svg-light) !important;
    }
    .bg-logo-dark {
        background-image: var(--logo-svg-dark) !important;
    }

/* IMPORTANT CLASSES>TEXT*/
    .text-large {
        font-size: 150%;
        font-weight: 800;
    }

    .text-small {
        font-size: 75%;
    }


/***** SUPPORT CLASSES *****/
    .flex {
        display: flex;
        width: 100%;
        align-items: center;
    }

    .flex-inline {
        display: inline-flex;
    }

    .min-w-0 {
        min-width: 0px;
    }

    .no-margin {
        margin: 0px;
    }

    .flex.nowrap {
        flex-wrap: nowrap;
        display: inline-flex;
    }

    .nowrap {
        white-space: nowrap;
    }

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

    .flex.fit {
        flex-basis: fit-content;
    }


/***** ELEMENT CLASSES *****/
/* ELEMENT CLASSES > BUTTONS */
    .button {
        display: inline-block;
    }
    .navbar-nav a.button, /* override for Bootstrap styling */
    .button {
        border: 0px;
        height: 36px;
        line-height: 36px;
        padding: 0px 10px;
        border-radius: 3px;
        font-weight: 800;
        background-color: var(--button-background);
        color: var(--button-color);
        cursor: pointer;
        text-align: center;
        text-decoration: none !important;
    }

    .navbar-nav a.button { /* override for Bootstrap styling */
        text-align: left;
        display: block;
    }

    .navbar-nav a.button:hover, /* override for Bootstrap styling */
    .button:hover {
        background-color: var(--button-background-hover);
        color: var(--button-color-hover);
    }

    .navbar-nav a.button.main, /* override for Bootstrap styling */
    .button.main,
    .button.action-button {
        color: var(--button-main-color);
        background-color: var(--button-main-background);
    }

    .navbar-nav a.button.main:hover, /* override for Bootstrap styling */
    .button.main:hover,
    .button.action-button:hover {
        color: var(--button-main-color-hover);
        background-color: var(--button-main-background-hover);
    }

    .button.action-button {
        height: 30px;
        width: 30px;
        min-width: 30px;
        line-height: 30px;
        font-weight: normal;
        padding: 0px;
        border: none;
        float: right;
        border-radius: 5px;
        overflow: hidden;
        text-decoration: none;
        font-size: 18px;
        margin: 1px;
    }

    .button.disabled,
    .button.disabled * {
        background-color: #EEE !important;
        color: #AAA !important;
        pointer-events: none !important;
    }

    .button.danger {
        background-color: #dd4b39;
        color: #FFF;
        border-color: #d73925;
    }

    .button.danger:hover,
    .button.danger:active {
        background-color: #d73925;
    }

/* ELEMENT CLASSES > PHOTOS */
    .photo {
        position: relative;
        margin: 2px;
    }

    .photo img {
        height: 120px;
        box-sizing: border-box;
    }

    /* Photo thumbnails on <SM devices as smaller squares */
    @media (max-width: 991px) {
        .photo img {
            height: 80px;
            width: 80px;
            object-fit: cover;
        }
    }

    /* Hover effect for photo */
    .photo:hover img {
        opacity: 0.9;
    }

    /* Photo actions is by default hidden wrapper for action buttons */
    .photo .actions {
        bottom: 3px;
        right: 3px;
        position: absolute;
        transform: scale(0, 0);
    }


    /* Action button style for photos */
    .photo .button.action-button {
        width: 26px;
        min-width: 26px;
        height: 26px;
        line-height: 26px;
        text-align: center;
        background-color: #00000055;
        opacity: 1;
        color: #FFF;
        box-shadow: 0px 1px 2px 0px rgb(0 0 0 / 20%);
    }

    /* Show otherwise hidden action buttons on photo */
    .photo:hover .actions {
        transform: scale(1, 1);
        transition: transform 0.3s;
        transition-delay: 0.5s;
    }

    /* Photo action button hover effect */
    .photo .button.action-button:hover {
        background-color: #00000099;
    }

/* ELEMENT CLASSES > EVENT TAGS */
    .event-tag {
        border-radius: 13px;
        height: 26px;
        font-size: 12px;
        font-weight: bold;
        line-height: 12px;
        padding: 5px;
        box-sizing: border-box;
        margin: 5px;
        border-style: solid;
        border-width: 2px;
        white-space: nowrap;
    }

    .event-tag.special {
        background-color: var(--tag-special-background) !important;
        color: var(--tag-special-color) !important;
        border-color: transparent !important;
    }

    .event-tag.standard {
        background-color: var(--tag-standard-background) !important;
        color: var(--tag-standard-color) !important;
        border-color: var(--tag-standard-border-color) !important;
    }

    .event-tag.important {
        background-color: var(--tag-important-background) !important;
        color: var(--tag-important-color) !important;
    }

/* ELEMENT CLASSES > INFO BOX */
    .info {
        display: inline-block;
        padding: 10px;
        font-style: italic;
        background-color: #EAEFEF;
        color: #2E3433;
        text-align: center;
        vertical-align: middle;
        border-radius: 5px;
    }

    .dropzone {
        border-width: 2px;
        border-style: dotted;
        min-height: 100px;
    }

/* ELEMENT CLASSES > LANGUAGE ICONS */
    .lang-icon {
        height: 25px;
        width: 25px;
    }

/* ELEMENT CLASSES > STORE LOGOS */
    .store-logo {
        margin: 5px;
        height: 50px;
    }

/* ELEMENT CLASSES > INFO ICONS */
    .info-icon {
        background-color: grey;
        color: #fff;
        font-weight: 800;
        font-size: 16px;
        font-style: normal;
        height: 30px;
        width: 30px;
        min-width: 30px;
        max-width: 30px;
        border-radius: 2px;
        text-transform: uppercase;
        text-align: center;
        line-height: 30px;
        margin: 1px;
        cursor: pointer;
    }

    .info-icon svg {
        height: 60%;
        width: 60%;
        margin: 20%;
        fill: #FFF;
    }

    .info-icon.small {
        height: 20px;
        width: 20px;
        min-width: 20px;
        max-width: 20px;
        line-height: 20px;
        font-size: 14px;
    }

    .info-icon.green {
        background-color: var(--green);
    }
    
    .info-icon.yellow {
        /* background-color: #EEB21C; */
        background-color: var(--amber);
    }
    
    .info-icon.red {
        /* background-color: #C82463; */
        background-color: var(--red);
    }

/* ELEMENT CLASSES > MAP */

    #map {
        height: 350px;
        width: 100%;
    }

    #map.large {
        height: 100%;
	    min-height: 800px;
    }

    #map.resizeable {
        resize: vertical;
    }

    #map svg {
        height: 100%;
        display: block;
        margin: 0px auto;
        fill: #004c3f;
        fill-opacity: 0.1;
    }

/* ELEMENT CLASSES > DASHBOARD */
    .dashboard {
        width: 100%;
        height: 100%;
        display: flex;
        flex-wrap: wrap;
    }

    .widget-wrapper {
        padding: 5px;
        box-sizing: border-box;
    }

    .dashboard .widget-wrapper {
        height: 300px;
    }

    .widget {
        border-radius: 10px;
        background-color:#FFF;
        box-shadow: 2px 2px 10px 1px rgba(0, 0, 0, 0.1);
        box-sizing: border-box;
        padding: 20px;
        display: flex;
        flex-direction: column;
    }

    .widget .widget-content {
        overflow: auto;
        height: auto;
        padding: 0px 10px;
    }

    .dashboard .widget {
        margin: 0px;
        height: 290px;
    }

/***** CONTEXTUAL *****/
/* CONTEXTUAL > MAIN HEADER */
    .main-header .breadcrumb-navigation {
        display: block;
        color: var(--headline-color);
        font-size: 20px;
        text-transform: uppercase;
        font-weight: 800;
    }

    .main-header a.back-link {
        color: var(--headline-color);
    }

/* CONTEXTUAL > MAIN SIDEBAR */
    .main-sidebar.bg-logo-light,
    .main-sidebar.bg-logo-dark {
        background-repeat: no-repeat;
        background-position-y: 80px;
        background-size: 600px;
        background-position-x: -100px;
    }

    .content-wrapper.bg-logo-dark {
        background-repeat: no-repeat;
        background-size: 1300px auto;
        background-position-x: center;
        background-position-y: 30px;
    }

/* CONTEXTUAL > CONTENT */
    .content a {
        text-decoration: underline;
    }

/* CONTEXTUAL > CONTENT > NAVBAR*/
    .content .navbar-nav a.button {

    }

/* CONTEXTUAL > GPSPICKER*/
    #frm-createGameForm-position > div,
    #frm-position > div {
        resize: vertical;
    }

/***** BOOTSTRAP *****/
/* BOOTSTRAP > MODAL */
    .modal-content .modal-body {
        margin-top: 0px;
        margin-bottom: 0px;
}


/***** COMPONENTS *****/
/* COMPONENTS > PHOTO UPLOAD STATUS */
.photo-upload-status .record {
    position: relative;
    margin: 2px;
    width: calc(100% - 4px);
    padding: 5px;
}

.photo-upload-status .record .preview {
    width: 60px;
    height: 60px;
    background-color: var(--main-lighter);
    border-radius: 10px;
    overflow: hidden;
}

.photo-upload-status .record .preview img {
    width: 100%;
    height: 100%;
}

.photo-upload-status .record .record-body {
    margin-left: 20px;
    width: calc(100% - 60px - 20px);
}

.photo-upload-status .record-status {
    font-size: 16px;
    font-weight: bold;
}

.photo-upload-status .record-name {
    font-size: 12px;
}

.photo-upload-status .record-progress-bar {
    height: 12px;
    border: 1px solid var(--main-dark);
    border-radius: 10px;
    overflow: hidden;
}

.photo-upload-status .record-progress {
    height: 100%;
    background-color: var(--gray);
}

.photo-upload-status .record-progress.success {
    background-color: var(--lightgreen);
}

.photo-upload-status .record-progress.error,
.photo-upload-status .record-progress.timeout {
    background-color: var(--red);
}

.photo-upload-status .record.error,
.photo-upload-status .record.timeout {
    color:var(--red);
}
body.sign {
    padding: 30px;
}

.sign .sign-body {
    background-color: #00312e;
    border-radius: 14px;
    width: 100%;
    min-height: 100%;
    padding: 20px;
}

.sign-body {
    color: var(--text-color-light);
}

.sign .error-message {
    color: red;
    min-height: 20px;
}

.sign .sign-content > * {
    margin: 10px 0px;
}

.sign .sign-area {
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
}

.sign .sign-area > * {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.sign .logo {
    margin-top: 40px;
    margin-bottom: 20px;
}

.sign .logo img {
    display: block;
    margin: auto;
    width: 120px;
    height: 141px;
}

.sign .sign-input {
    position: relative;
    height: 60px;
    margin-bottom: 15px;
}

.sign .sign-input.error {
    height: 70px;
}

.sign .sign-input.error input,
.sign .sign-input .input-error {
    transition: all .2s;
}

.sign .sign-input.error input {
    border-radius: 14px 14px 0px 0px !important;
    border-color: #ea4639 !important;
    height: 55px;
    width: 100%;
}

.sign .sign-input .input-error {
    display: block;
    color: #FFF;
    line-height: 12px;
    font-weight: bold;
    background-color: #ea4639;
    border-radius: 0px 0px 14px 14px;
    font-size: 12px;
    text-align: center;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}

.sign .sign-input.error .input-error {
    height: 15px;
    width: 100%;
}

.sign .sign-input:not(.error) .input-error {
    width: 0%;
    height: 0px;
}

.sign .sign-input input {
    border: 2px solid #39E7E133;
    border-radius: 14px;
    width: 100%;
    height: 100%;
    outline: none;
    text-align: left;
    letter-spacing: 0px;
    color: #FFFFFF;
    background-color: transparent;
    font-size: 16px;
    padding: 0px 20px;
    transition: border-color 0.5s;
}

.sign .sign-input input:hover {
    border: 2px solid #39E7E166;
}

.sign .sign-input input:focus {
    border: 2px solid #39e7e1;
}

.sign .sign-input label {
    font-size: 12px;
    display: inline-block;
    position: absolute;
    left: 10px;
    top: -7px;
    color: #FFFFFF;
    padding: 0px 7px;
    background-color: #00312e;
    transition: color 0.5s;
}

.sign input:focus + label {
    color: #39e7e1;
}

.sign .sign-button {
    width: 100%;
    height: 50px;
    margin-bottom: 10px;
    border-radius: 10px;
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    border: none;
    padding: 0px 20px;
    transition: 0.2s;
}

.sign .button-group .sign-button:not(:first-child) {
    margin-left: 25px;
}

.sign .links a {
    display: block;
    font-weight: bold;
    color: #FFFFFF;
    text-decoration: underline;
    margin: 5px 0px;
}

.sign .sign-pwd .sign-button {
    height: 60px;
}

.sign-area .sign-button:hover {
    box-shadow: -1px 5px 8px -3px rgb(0 0 0 / 70%);
    transform: translate(0px, -1px);
}

.sign .sign-button.main {
    background-color: #DB4437;
    color: #FFFFFF;
    fill: #FFFFFF;
}

.sign .sign-button.google {
    background-color: #FFFFFF;
    color: #333333;
    fill: #333333;
}

.sign .sign-button.apple {
    background-color: #000000;
    color: #FFFFFF;
    fill: #FFFFFF;
}

.sign .sign-button.facebook {
    background-color: #3B5998;
    color: #FFFFFF;
    fill: #FFFFFF;
}

.sign .language {
    float: right;
}

.sign .icon {
    width: 24px;
    height: 24px;
}

.sign .firebaseui-tos {
    color: #FFFFFF80;
}

.sign .firebaseui-tos a {
    color: #FFFFFF80;
    text-decoration: underline;
}

.sign #snippet-flashMessages-flashes {
    position: fixed;
    top: 10px;
    left: 10px;
    display: block;
    z-index: 9999;
}

.sign #snippet-flashMessages-flashes .alert {
    display: block;
    box-shadow:0px 0px 10px 1px #00000066;
    width: fit-content;
    min-width: 300px;
    margin-right: 10px;
}

.sign .verify {
    max-width: 600px;
    color: var(--main-darker);
    background-color: var(--white);
    border-radius: 20px;
    border: 5px solid var(--main-darker);
    padding: 10px;
    font-weight: bold;
    font-size: var(--base-font-size);
}

@media (max-width: 767px) {
    body.sign {
        padding: 0px;
    }

    .sign .sign-body {
        border-radius: 0px;
        border: none;
    }
}