@font-face {
    font-family: 'DejaVuSans';
    src: url('dejavusans-webfont.eot');
    src: url('dejavusans-webfont.eot?#iefix') format('embedded-opentype'),
         url('dejavusans-webfont.woff2') format('woff2'),
         url('dejavusans-webfont.woff') format('woff'),
         url('dejavusans-webfont.ttf') format('truetype'),
         url('dejavusans-webfont.svg#dejavu_sansbook') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DejaVuSansMono';
    src: url('dejavusansmono-webfont.eot');
    src: url('dejavusansmono-webfont.eot?#iefix') format('embedded-opentype'),
         url('dejavusansmono-webfont.woff2') format('woff2'),
         url('dejavusansmono-webfont.woff') format('woff'),
         url('dejavusansmono-webfont.ttf') format('truetype'),
         url('dejavusansmono-webfont.svg#dejavu_sans_monobook') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* --- Stellarium-style jQuery UI Theme for some objects ---*/

/* Base stuff */

.ui-widget-content {
	border: none;
	color: rgb(3,3,3);
	background: linear-gradient(rgb(86, 87, 90),rgb(48, 49, 52));
}

/* Tab customization */
.ui-tabs {
    padding: 0;
    background: rgb(31,31,31);
    border-width: 0;
}

.ui-tabs .ui-widget-header {
    background: transparent;
    border: none;
    border-radius: 0;
}

.ui-tabs .ui-widget-header .ui-state-default a {
    font-weight: bold;
    color: rgb(170, 173, 164);
}

.ui-tabs .ui-widget-header .ui-state-active a {
    color: rgb(220, 223, 214);
}

div#srch_tab_object {
    border-radius: 0;
}

.ui-tabs .ui-tabs-nav {
    padding-left: 0;
    background: transparent;
    border-width: 0 0 1px;
    border-radius: 0;
}

.ui-tabs .ui-tabs-nav .ui-corner-top {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.ui-tabs .ui-tabs-nav .ui-state-default {
    background: transparent;
    border: none;
}

.ui-tabs .ui-tabs-nav .ui-state-active {
    background: linear-gradient(rgb(68, 69, 72),rgb(86, 87, 90));
    border: none;
}

.ui-tabs .ui-tabs-panel {
    color: rgb(3,3,3);
    background: linear-gradient(rgb(86, 87, 90),rgb(48, 49, 52));
    border-width: 0;
    border-radius: 0;
}

/* Large vertical spinners */
.ui-spinner {
    display: inline-block;
    overflow: hidden;
    padding: 0;
    position: relative;
    vertical-align: middle;
	background: linear-gradient(rgb(180, 180, 183),rgb(93, 95, 98));
	border-radius: 0;
}

.ui-spinner-button {
	border-radius: 0;
}

.ui-spinner a.ui-spinner-button {
	border-top: none;
	border-bottom: none;
	border-right: none;
	border-left: none;
}

.ui-spinner-button.ui-spinner-up {
    background: linear-gradient(rgb(97, 97, 92),rgb(74, 74, 75));
}

.ui-spinner-button.ui-spinner-down {
    background: linear-gradient(rgb(68, 68, 69),rgb(40, 40, 40));
}

#timewidget .ui-spinner-input {
    margin: 22px 0.2em;
    text-align: center;
}

#timewidget .ui-spinner a.ui-spinner-button {
    border: medium none;
}

#timewidget .ui-spinner-button {
    height: 20px;
    left: 0;
    width: 100%;
    cursor: default;
    display: block;
    font-size: 0.5em;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    text-align: center;
}

#timewidget .ui-spinner .ui-icon {
    left: 50%;
    margin-left: -7px;
    margin-top: -3px;
    top: 0;
    position: absolute;
}

/* Autocomplete */
.ui-autocomplete {
	max-height: 200px;
	overflow-y: auto;
	/* prevent horizontal scrollbar */
	overflow-x: hidden;
}

* html .ui-autocomplete {
	height: 200px;
}

/* fix for a 1px discrepancy when using a different background */
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    margin-bottom: 0;
    padding-bottom: 0;
}

span.ui-selectmenu-button.ui-state-default {
	border: 1px solid black;
	border-radius: 0;
	color: rgb(3,3,3);
	background: linear-gradient(#B4B4B7, #5D5F62);
}

.ui-selectmenu-button span.ui-icon {
    /* border: 1px solid #cccccc; */
    /* background: #eeeeee url("images/ui-bg_glass_60_eeeeee_1x400.png") 50% 50%; */
}

/* End jQuery UI override */

html {
	background: #fff url("images/stars.png");
	font-size: 13px;
	font-family: DejaVuSans,Verdana,Helvetica,Arial,sans-serif;
}

::selection {
    background: rgb(253, 216, 134);
}

::-moz-selection {
    background: rgb(253, 216, 134);
}


select {
	padding: 1px 0;
	font-size: small;
}

button {
	color: rgb(0, 0, 0);
}

h1 {
	font-size: 26px;
}

h2 {
	font-size: 14px;
}

#wrapper {
	border: 1px;
	background: rgb(86, 87, 90);
	margin: 1em;
	padding: 1em;
}

.fixed-dialog{
  position: fixed;
  top: 50%;
  left: 50%;
}

.fixed-dialog .ui-dialog-titlebar-close{
  visibility: hidden;
}

.center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.bold {
	font-weight: bold;
}

.textcenter {
	text-align: center;
}

.display-block {
	display: block;
}

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

.margin-auto {
	margin: auto;
}

.margin-none {
    margin: 0;
}

.margin-block {
	margin: 10px;
}

.margin-vertical {
	margin: 10px 0 10px 0;
}

.valign-middle {
	vertical-align: middle;
}

.block {
	position: relative;
	padding: 15px;
	padding-top: 35px;
	margin-right: 10px;
	margin-left: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
	background: rgba(149, 150, 152, 0.2);
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-style: inset;
	border-radius: 10px;
	/* vertical-align: top; */
	min-width: 18em;
}

.block header {
	display: block;
	text-align: left;
	position: absolute;
	left: 17px;
	top: 10px;
	color: rgb(0,0,0);
}

.block header h2 {
	/* font-size: 14px; */
	margin: 0;
	display: inline-block;
}

.innerblock {
	position: relative;
	padding: 5px;
	padding-top: 25px;
	margin-right: 5px;
	margin-left: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	/* vertical-align: top; */
}

.innerblock > h3 {
	display: block;
	position: absolute;
	left: 10px;
	top: 2px;
	font-size: 12px;
	font-weight: bold;
	line-height: 0;
}

.smallblock {
	position: relative;
	padding: 5px;
	padding-top: 25px;
	margin-right: 5px;
	margin-left: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	background: rgba(149, 150, 152, 0.2);
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-style: inset;
	border-radius: 5px;
	/* vertical-align: top; */
	/* display: inline-block; */
}

.smallblock > h3 {
	/* vertical-align: middle; */
	margin: 0;
	padding: 0;
	display: block;
	position: absolute;
	left: 10px;
	top: 4px;
	font-size: 12px;
	font-weight: bold;
	/* line-height: 0; */
}

.relative {
	position: relative;
}

.flex {
	display: flex;
}

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

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

.flex-expand {
	flex-grow: 1;
}

.flex-noshrink {
	flex-shrink: 0;
}

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

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

.slider {
	min-width: 150px;
	margin-left: 10px;
	margin-right: 10px;
}

#loadindicator {
	position: fixed;
	width: 32px;
	height: 32px;
	bottom: 12px;
	right: 21px;
	background-image: url("images/ajax-loader.gif");
}

#loadoverlay {
	color: white;
	font-size: xx-large;
	background: #fff url("images/stars.png");
	opacity: 1.0;
	z-index: 50;
	display: table;
	/* position: absolute; */
}

.loadwrapper {
	display: table-cell;
	vertical-align: middle;
}

.loadinner {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

header h1 {
	margin-left: 1em;
	display: inline-block;
	vertical-align: middle;
}

header img {
	vertical-align: middle;
	height: 64px;
	width: 64px;
}

#timewidget {
	font-size: 14px;
	min-width: 295px;
}

.ui-tabs-panel.timetab {
	background: linear-gradient(rgb(235, 239, 249),rgb(210, 214, 224));
}

.timedisplay {
	font-family: DejaVuSansMono,"Courier New",monospace;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
}

#time_jday .timedisplay {
	text-align: right;
}

#time_jday > div {
	display: inline-block;
}

#date_year {
	width: 4em;
}

#date_month,
#date_day,
#time_hour,
#time_minute,
#time_second {
	width: 2em;
}

#input_jd,
#input_mjd{
	width: 8em;
}

#timecontrols {
	/* display: block; */
	text-align: center;
	margin-top: 10px;
	padding: 6px;
}

ul.buttonlist,
ul.button32list {
	padding: 0;
	list-style: none;
}

ul.buttonlist > li,
ul.button32list > li,
li.button32wrapper {
	overflow: hidden;
	vertical-align: middle;
}

ul.buttonlist > li {
	display: inline-block;
}

ul.button32list > li,
li.button32wrapper {
	display: inline-block;
	width: 32px;
	height: 32px;
}

ul.button32list > li:hover,
li.button32wrapper:hover {
	background: url("images/icons.png") no-repeat;
	background-position: -851px 0;
}

ul.buttonlist > li > button {
	background-color: transparent;
	cursor: pointer;
	font-size: 26px;
	/* line-height: 32px; */
	/* vertical-align: middle; */
	/* text-align: center; */
	/* overflow: hidden; */
	padding: 10px;
	margin: 0;
	border-radius: 2px;
	border: 2px outset gray;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

ul.buttonlist > li > button:active{
	background-color: rgb(180, 180, 183);
	border-style: inset;
}

button.button32,
ul.button32list > li > button{
	background-color: transparent;
	cursor: pointer;
	font-size: 26px;
	width: 32px;
	height: 32px;
	line-height: 32px;
	vertical-align: middle;
	overflow: hidden;
	padding: 0;
	margin: 0;
	border-radius: 2px;
	border: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

ul.button32list > li > button:active,
button.button32:active {
	background-color: rgb(180, 180, 183);
}

.icon32 {
	background: url("images/icons.png") no-repeat;
	height: 32px;
	width: 32px;
}

.icon32.active {
	background-image: url("images/icons-active.png");
}

.icon32.btAtmosphere { background-position: 0 0; }
.icon32.btAzimuthalGrid { background-position: -37px 0; }
.icon32.btCardinalPoints { background-position: -74px 0; }
.icon32.btConstellationArt { background-position: -111px 0; }
.icon32.btConstellationLabels { background-position: -148px 0; }
.icon32.btConstellationLines { background-position: -185px 0; }
.icon32.btConstellationBoundaries { background-position: -885px 0; }
.icon32.btGotoHome { background-position: -922px 0; }
.icon32.btDSS { background-position: -222px 0; }
.icon32.btFlipHorizontal { background-position: -259px 0; }
.icon32.btEquatorialGrid { background-position: -296px 0; }
.icon32.btEquatorialMount { background-position: -333px 0; }
.icon32.btFlipVertical { background-position: -370px 0; }
.icon32.btFullScreen { background-position: -407px 0; }
.icon32.btGotoSelectedObject { background-position: -444px 0; }
.icon32.btGround { background-position: -481px 0; }
.icon32.btNebula { background-position: -518px 0; }
.icon32.btNightView { background-position: -555px 0; }
.icon32.btPlanets { background-position: -592px 0; }
.icon32.btScriptRun { background-position: -629px 0; }
.icon32.btTimeForward { background-position: -666px 0; }
.icon32.btScriptStop { background-position: -703px 0; }
.icon32.btTimeNow { background-position: -740px 0; }
.icon32.btTimeRealtime { background-position: -777px 0; }
.icon32.btTimeRewind { background-position: -814px 0; }
.icon32.glow32x32 { background-position: -851px 0; }
.icon32.btTimeRealtime.paused  { background-image: url("images/icons-active.png"); background-position: -851px 0; }

#timejumplist ul {
	list-style: none;
	padding: 0;
	display: inline-block;
	vertical-align: top;
}

#activescript {
	font-weight: bold;
}

.scrollselect {
	padding: 1px 0;
	min-height: 12em;
	/* margin-left: auto; */
	/* margin-right: auto; */
	box-sizing: border-box;
	display: block;
}

.select_selected,
.checkableaction {
	font-style: italic;
}

#loc_map {
	display: inline-block;
	position: relative;
	width: 400px;
	height: 240px;
	overflow: hidden;
}

#loc_mapimg {
	width: 100%;
	height: 100%;
}

#loc_mappointer {
	position: absolute;
	top: 10px;
	left: 10px;
}

#loc_searchlist{
	vertical-align: top;
	height: 240px;
	width: 150px;
	float: right;
}

#loc_searchlist > *{
	width: 100%;
	box-sizing: border-box;
	display: block;
}

#loc_list {
	flex: 1 1 auto;
	position: static;
	overflow-y: auto;
	overflow-x: hidden;
}

#loc_list li {
	white-space: nowrap;
	text-align: left;
}

#loc_inputs {
	text-align: left;
}

#loc_inputs > div {
	display: inline-block;
}

#loc_inputs > div label {
	width: 100px;
	display: inline-block;
}

#loc_name {
	width: 240px;
	box-sizing: border-box;
}

#loc_inputs input.custom-combobox-input {
	width: 212px;
	box-sizing: border-box;
}

#loc_inputs input.ui-spinner-input {
	width: 77px;
	box-sizing: border-box;
}

.custom-combobox {
	/* border: 1px solid black; */
	background: linear-gradient(#B4B4B7, #5D5F62);
	overflow: hidden;
	position: relative;
	padding: 0;
	vertical-align: middle;
	display: inline-block;
}
.custom-combobox-toggle {
	position: absolute;
	margin: 0;
	bottom: 0;
	padding: 0;
	display: block;
	right: 0;
	height: 100%;
	width: 16px;
}
.custom-combobox-input {
	margin: 0.2em 22px 0.2em 0.4em;
	padding: 0;
	background: transparent;
	border: none;
}

#srch_results {
	/* text-align: left; */
	max-width: 367px;
	height: 180px;
	font-size: 14px;
	padding-left: 10px;
	padding-right: 5px;
	background: none;
	margin: 5px 0;
	border: 1px solid black;
}

#srch_results span {
	padding: 1em;
}

#srch_results span.state-selected {
	font-weight: bold;
}

#srch_greek div {
	display: flex;
}

#srch_greek button {
	width: 32px;
	margin: 0;
	padding: 0;
	flex-grow: 1;
}

#srch_greek button .ui-button-text {
	padding: 0;
}

#srch_list_objectlist {
	margin-top: 5px;
	height: 270px;
	/* width: 400px; */
}

#srch_tab_list {
	text-align: left;
}

#srch_tab_list span.custom-combobox {
	flex-grow: 1;
}

#srch_tab_list input.custom-combobox-input {
	width: 90%;
}

#quickselect {
	list-style: none;
	font-weight: bold;
}

#selection {
	position: relative;
}

#sel_infostring {
	text-align: left;
	/* white-space: nowrap; */
	/* overflow-x: hidden; */
	/* overflow-y: auto; */
	/* width: 20em; */
	/* max-height: 340px; */
	/* max-width: 100%; */
	display: inline-block;
}

#view_controls {
	display: inline-flex;
	flex-wrap: wrap;
	width: 96px;
	height: 96px;
}

.joybutton {
	background: url("images/joystick.png") no-repeat;
	cursor: pointer;
	width: 32px;
	height: 32px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

#view_up {
	background-position: -32px 0;
}

#view_left {
	background-position: 0 -32px;
}

#view_center {
	background-position: -32px -32px;
}

#view_right {
	background-position:  -64px -32px;
}

#view_down {
	background-position:  -32px -64px;
}

#view_wrapper {
	margin-top: 10px;
}

.blocklabel > label {
	display: block;
}

#vo_dsocatalog label {
	min-width: 150px;
}

.table {
	display: table;
}

.table > p {
	display: table-row;
}

.table > p > * {
	display: table-cell;
}

#tab_view .table label {
	min-width: 230px;
}

#tab_view input.spinner{
	width: 30px;
}

#vo_refraction .table label {
	min-width: 200px;
}

#vo_refraction input.spinner{
	width: 60px;
}

#vo_dsolabels label{
	min-width: 70px;
}

.landscapeblock {
	height: 30em;
}

#location {
	height: auto;
}

#srch_simbad {
	font-style: italic;
}

#srch_simbad_text{
	font-weight: bold;
}

.selectmenu + span.ui-selectmenu-button {
	display: block;
}

.joystickcontainer {
    position: relative;
    border: 1px solid black;
    box-sizing: border-box;
    border-radius: 64px;
    background: #B4B4B7;
    /* background-image: url("images/joypad.png"); */
    /* background-image: url("images/joypad.png"), radial-gradient(#B4B4B7, #5D5F62); */
    background-image: radial-gradient(#B4B4B7, #5D5F62);
    background-repeat: no-repeat;
    width: 128px;
    height: 128px;
}

.joystickbutton {
    position: absolute;
    width: 32px;
    height: 32px;
    background-image: url("images/joypad.png");
    background-repeat: no-repeat;
    cursor: pointer;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

.joystickbutton:hover {
    background-image: url("images/joypad-hover.png");
}

.joystickbutton:active {
    background-image: url("images/joypad-active.png");
}

.joystickbutton-up {
    left: 48px;
    background-position: -48px 0;
}

.joystickbutton-left {
    top: 48px;
    background-position: 0 -48px;
}

.joystickbutton-right {
    top: 48px;
    left: 96px;
    background-position: -96px -48px;
}

.joystickbutton-down {
    top: 96px;
    left: 48px;
    background-position: -48px -96px;
}

.joystick {
    border: 5px double white;
    background-color: rgb(53,53,53);
    box-sizing: border-box;
    border-radius: 16px;
    top: 48px;
    left: 48px;
    width: 32px;
    height: 32px;
    cursor: move;
}

.smallblock128 {
    max-width: 143px;
}