/* override styles when printing */
@media print { }

/* ------------------------------------------------------------- General / Reset -------------*/

html, body {

	min-height: 100%;
	max-height: 100%;
	height: 100%;
}

.pointer {
	cursor: pointer;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select: none;
}

.cjs_pointer {
	cursor: pointer;
}

ul {
	padding-left: 30px;
	margin: 0px;
}
li {
	margin-bottom: 4px;
	padding: 4px 0px;
}

a, u {
	text-decoration: underline;
}

#mainBody {

	background: #000000;
	font-size: 14px;
	margin: 0px auto;
	width: 100%;

	/* https://www.w3.org/Style/Examples/007/scrollbars.en.html */
	scrollbar-face-color: ThreeDFace !important;
	scrollbar-shadow-color: ThreeDDarkShadow !important;
	scrollbar-highlight-color: ThreeDHighlight !important;
	scrollbar-3dlight-color: ThreeDLightShadow !important;
	scrollbar-darkshadow-color: ThreeDDarkShadow !important;
	scrollbar-track-color: Scrollbar !important;
	scrollbar-arrow-color: ButtonText !important;

	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
}


#mainBody_fullWidth { /* Gleiche den Bildlauf auf der rechten Seite (4px) aus */
	width: calc( 100% - 4px );
	margin-left: 4px;
}


#fixedHeader {
	overflow-y: hidden;
	width: 100%;
	margin: 0px auto;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-start;
	z-index: 10;
	background: #000000;
	justify-content: center;
}

#pageContent_container {
	overflow-y: scroll;
	height: 100%;
	flex-grow : 1;
	flex-shrink : 1;
	flex-basis : 0;
}

#pageContent {
	max-width: 320px;
	margin: 0 auto;
	z-index: 0;
}

#pageContent.main__fullContent {
	overflow: hidden;
	position: absolute;
	max-width: 100%;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
}

#impressumWrapper {
	font-size: 12px;
	width: 100%;
	z-index: 10;

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: flex-end;
	justify-content: center;

	background: #000;
}


#footerContent,
#headerContent {
	width: 100%;
	max-width: 320px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
}

#impressumWrapper a,
#bot_impressumWrapper a {
	padding: 10px 6px 10px 6px;
	display: inline-block;
	text-decoration: none;
}

span.paraMargin {
	margin: 10px 0;
	display: block;
}

#planetInfo {
	position: relative;
	font-size: 12px;
  color: #FF8000;
	height: auto;
	overflow: hidden;
  padding: 5px 10px;
}
#hiPlanetID {
	color: #9470a5;
	float: left;
}

.messageWrapper {
    position: fixed;
    bottom: 40px;
    left: 20px;
    right: 20px;
    display: block;
    text-align: center;
    background: #141E2D;
    padding: 6px 10px;
}

.successMessage {
	border: 2px solid green;
}

.errorMessage {
	border: 2px solid red;
}

#connectionOutput, #sPlanetConnections {
	margin: 10px 0px;
	width: 100%;
	height: auto;
	overflow: hidden;
	display: block;
}

.connectionFound, .createConnection, .removeConnection {
  padding: 5px 10px;
  border: 1px solid #ffffff;
  color: #ffffff;
  font-size: 14px;
  cursor: pointer;
  display: block;
  float: left;
  margin: 4px 4px;
}

.createConnection {
	border: 1px solid #FF8000;
	color: #FF8000;
}

.selectConnection {
	background: #ffffff;
}

#mainFooter {
	display: block;
	position: fixed;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background: #333333;
	text-align: center;
	z-index: 2000;
}

#enableMarkers, #mainFooter a {
	display: inline-block;
	padding: 4px 20px;
	cursor: pointer;
}

.cjs_customSelect_wrapper,
.cjs_customSelect_label,
.customInput_wrapper_v3,
.customInput_label_v3,
.cjs_customInput_wrapper,
.cjs_customInput_label {
	width: 100%;
	margin-bottom: 4px;
	display: flex;
	align-items: stretch;
	justify-content: flex-start;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
}

.cjs_customInput_label,
.cjs_customSelect_label {
	margin-bottom: 0px;
}

.customInput_display_v3,
.cjs_customInput_display {
	font-size: 12px;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	flex-wrap: wrap;
	align-content: center;
}

.cjs_customInput {
	width: 120px;
}

.customInput_label {
	display: block;
	margin-bottom: 4px;
	height: auto;
  overflow: hidden;
  position: relative;
}

.customInput_label .customInput {
  /* float: left; */
	-moz-box-sizing: content-box;
	-webkit-box-sizing:content-box;
	box-sizing:content-box;
}

.customInput_display {
	float: left;
  position: absolute;
  bottom: 7px;
	font-size: 12px;
}

.customInput_dot_v3,
.cjs_customInput_dot {
	margin: 0px 6px;
}

.customInput_dot {
	margin: 0px 6px;
	float: left;
}

.customDisplay {
	font-size: 12px;
	float: left;
}

.ac_createReturn {
	display: none;
	 margin-top: 10px;
}




.cA {
	background:red !important;
	color:#fff;
}
div.input_errorClass {
	background:red;
	padding:4px 0;
}
.floatRight {
	float:right;
}
.floatLeft {
	float:left;
}

.ajaxLoader {
	text-align: center;
	background: #cc0000;
	width: 100%;
	display: block;
	padding: 10px 0;
	margin: 0 0 10px 0;
}

/* Start Sounds */
#toggleSounds {
	z-index:10000;
	display:inline-block;
	width:80px;
	height:20px;
	color:#fff;
	font-size:14px;
	padding:2px 20px;
	text-align:center;
	line-height:20px;
	cursor:pointer;

/*	-moz-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);

	transform: rotate(270deg);*/
}

.searchForm_temp {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}

.audioController, .audioName {
	margin:0 auto;
	width:100%;
	color:#333;
	text-align:center;
	display:block;
	font-size:12px;
	margin-top:4px;
}

.audioName .toggleLoop {
	height:auto;
	padding:0;
	height:11px;
	background:#333;
	display:inline-block;
	cursor:pointer;
	padding:2px 10px 4px;
	text-transform:uppercase;
}
.audioController {
	margin-top:10px;
}
#contentSounds {
	z-index:1100;
	position:absolute;
	top:24px;
	left:0px;
	bottom:0px;
	background:#fff;
	width:100%;
}
#editSounds {
	color:#333;
	padding:4px 0;
	background:#ccc;
	text-align:center;
	cursor:pointer;
	font-size:12px;
	display:inline-block;
	width:100%;
}
#closeSounds {
	width:100%;
	position:absolute;
	bottom:0px;
	height:20px;
	background:#333;
	text-align:center;
	cursor:pointer;
	padding-top:10px;
}

.displaySound {
	max-width:600px;
	width:calc(100% - 20px);
	border:1px solid #fff;
	border-radius:4px;
	min-height:24px;
	font-size:14px;
	text-align:center;
	margin:0 auto;
	margin-bottom:4px;
	cursor:pointer;
	line-height:24px;
}

/* End Sounds */

.selfNote {
	font-size:12px;
	display:inline-block;
	margin-left:8px;
}
div.ClearAll {
	clear:both;
}
div.FloatLeft {
	float: left;
}

.darkColor {
	color:#333;
}
#returnData {
	margin:20px 0;
}

#SiteName a svg {
	max-width:100%;
}

.calShip {
	margin-top:10px;
	font-size:14px;
	clear:both;
}

.yearChapter {
	display:block;
	margin:20px 0 20px;
	text-transform:uppercase;
	font-weight:bold;
	border:1px solid #ffffff;
	padding:6px 0 4px 10px;
	text-align:center;
	font-size:14px;
}

.sD {
	width:100%;
	padding-bottom:6px;
	border-bottom:1px solid #FFF;
	margin-bottom:20px;
	display:inline-block;
}
.calDay {
	float:left;
	width:40px;
}
.calTop {
	display:block;
}
.calNote {
	float:left;
}
#insertDay, .submitEdit, .abortEdit {
	float:right;
	margin-top:10px;
}
.editDay, .blockedEdit {
	cursor:pointer;
	float:right;
	font-size:12px;
	padding:10px 0 0 10px;
}
.dayEnd {
	width:100%;
	padding-bottom:11px;
	border-bottom:1px solid #FFF;
	margin-bottom:12px;
	display:inline-block;
}
.calEntry {
	width:100%;
	display:inline-block;
}
#insertDayMask {
	margin:0 0 20px;
}
#dayNote, .editNote {
	width:100%;
	padding:0px;
}
#dayDetails, .editDetails {
	color:#000;
	resize:none;
	width:100%;
	height:68px;
}
.active {
	background:red;
}
.inactive {
	background:#333;
}
.disabled {
	display:none;
}
.enabled {
	display:block;
	position:absolute;
	top:0px; left:0px;
	width:100%;
	height:100%;
	z-index:10;
}

.setMarker {
	display: block;
	position: absolute;
	background: red;
	text-align: center;
	width: 20px;
	height: 20px;
	z-index: 2000;
}


.moveMarker {
	display:block;
	position:absolute;
	background:red;
	text-align:center;
}


.MissingEntry {
	width:15px;
	height:15px;
	background:red;
	position:relative;
	display:block;
	top:-40px;
	right:0px;
	text-align:center;
	font-weight:bold;
	font-size:12px;
	line-height:15px;
}

#AddUserForm option {
	color:#333;
}

#ShipImage, #ShipImage img {
	width:340px;
	height:auto;
	margin:0px;
	float:right;
	padding:0 0 30px 30px;
}

/* Debug */
.missingData {
	position:absolute;
	top:0px;
	left:-6px;
	color: red;
	font-weight: bold;
	font-size: 18px;
	padding:2px;
	background:#FFF;
	text-align:center;
	width:6px;
	display:inline-block;
	height:18px;
}

.ShipCheckBox {
	width:30px;
	height:30px;
}
/* ------------------------------------------------------------- PLAYER / USER -------------*/
#PlayerDetails {
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	height:30px;
	background:#333;
	color:#fff;
}
#PlayerName, #PlayerCredits, #PlayerShip, #PlayerLogOut {
	height:30px;
	line-height:30px;
	float:left;
	display:block;
	padding:0 20px;
	margin:0 10px;
	cursor:pointer;
}
#PlayerName {
	margin:0 10px 0 0;
}

#UserData {
	width:100%;
	background:#333;
	height:24px;
	color:#FFF;
	margin:0 0 5px;
	position:fixed;
	left:0px;
	text-align:center;
	z-index:9999;
}
#UserData a {
	width:auto;
	font-size:14px;
	line-height:24px;
	height:24px;
	padding:4px 20px;
}
/* ------------------------------------------------------------- Character -------------*/
#createCharacter {
	cursor:pointer;
	margin:20px auto 0;
	display:table;
	background:#FFF;
	color:#00005C;
	padding:4px 10px;
	text-align:center;
}
.cSb, .icSb {
	width:20px;
	height:20px;
	display:inline-block;
	color:#ffffff;
	background:none;
	text-align:center;
	line-height:inherit;
	cursor:pointer;
	border:1px solid #ffffff;
}
.icSb {
	color:#ccc;
	border:1px solid #ccc;
}
.skillName {
	width:160px;
	display:inline-block;
}
.charSkill, #charHelmsmanCurrent {
	height:22px;
	line-height:22px;
	display:block;
	margin-bottom:12px;
}
.charCurrentSkill {
	display:inline-block;
	margin:0 4px;
	padding:0 10px;
}
/* ------------------------------------------------------------- COMBAT -------------*/
#CombatData {
	background:red;
}
label {
	white-space: nowrap;
}
.ShipData {
	width:60px;
}
.pilotEscape {
	display:inline-block;
	cursor:pointer;
}
.pilotChecked {
	display:inline-block;
	width:22px;
	height:14px;
	margin-left:8px;
}
.notChecked {
	background:#FFF;
}
.isChecked {
	background:#8499b3;
}
#SelectShipOneMenu, #SelectShipTwoMenu, #sSO, #sST {
	width:100%;
	text-align:center;
	height:30px;
	line-height:30px;
	background:#333;
	margin:10px 0;
	cursor:pointer;
}
#sSOm, #sSTm {
	margin-bottom:20px;
}
#SelectShipOne, #SelectShipTwo {
	height:200px;
	overflow:auto;
	display:none;
}
.SelectShip {
	min-height:40px;
	background:#333;
	width:100%;
	cursor:pointer;
	margin-bottom:4px;
	display:block;
	float: left;
}
.SelectShip:last-of-type {
	margin-bottom: 0px;
}
.SelectShip img {
	margin-right:20px;
	margin-left: 10px;
	float:left;
}
.ShipName {
	height:40px;
	line-height:45px;
	display:block;
	float:left;
	margin-right: 10px;
	margin-left: 10px;
}
.sSI {
	height: 32px;
	margin: 4px 0;
}
#sSOm {
	float: left;
	clear: both;
}


/* ------------------------------------------------------------- GENERAL -------------*/

textarea,
textarea:focus,
textarea:active {
	background: #000;
	border: 1px solid rgb(255, 255, 255);
	font-size: 14px;
	padding: 4px 8px;
	width: calc(100% - 18px);
	resize: vertical;
	min-height: 120px;
	outline: none;
	display: block;
}

/*
#inputTextarea,
#inputTextarea:focus,
#inputTextarea:active
*/
#inputTextarea {
height: 350px;
}

.customInput, input, input:focus, input:active,
.glossar_textareaEdit,
.glossar_textareaEdit:focus,
.glossar_textareaEdit:active {
  padding: 5px 10px;
  display: inline-block;
  border: 1px solid #ffffff;
  background: none;
  outline: none;
  /* color: #ffffff; */
	border-radius:0px;
	font-size: 14px;
}

option {
	color:#333;
}

input::-webkit-input-placeholder { color: #ccc; }
input::-moz-placeholder { color: #ccc; } /* firefox 19+ */
input:-ms-input-placeholder { color: #ccc; } /* ie */
input:-moz-placeholder { color: #ccc; }

#currentAmmo {
	text-align:center;
}
#ammoWrapper {
	margin-top:30px;
}
.ammoButton {
	width:calc(100% / 2 - 32px - 3px);
	text-align:center;
}
.DontSelect, .cjs_blockSelection {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* https://www.w3schools.com/csSref/css3_pr_pointer-events.asp */
.cjs_disablePointer {
	pointer-events: none
}

.inlineButton {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.outlinedElement,
.outlinedLink,
.outlinedList,
.cjs_textEditor_button,
.outlinedEquipment,
.customInput_burger_v3,
.outlinedBlock,
.outlinedSVG,
.outlinedSVG_wide,
.outlinedSVG_COM {
	text-decoration:none;
	color: #ffffff;
	background:none;
	font-size:14px;
	outline: none;
	padding:5px 10px;
	border: 1px solid #ffffff;
	display:inline-block;
	margin: 5px 8px 5px 0px;
}

.fullWidth {
	margin: 5px 0px;
	/* margin: 5px 0 !important; */
	/* width: calc( 100% - 22px); */
	text-align:center;
	display: block;
}

.outlinedElement,
.outlinedLink,
.outlinedList,
.cjs_textEditor_button,
.outlinedEquipment,
.customInput_burger_v3,
.outlinedBlock,
.outlinedSVG,
.outlinedSVG_wide,
.outlinedSVG_COM {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor:pointer;
}

#glossar_dataLINK_button,
#glossar_index_button,
.index_button {
	text-decoration: underline;
	cursor: pointer;
	padding: 2px 0px 10px;
}

.outlinedSVG,
.outlinedSVG_wide,
.outlinedSVG_COM {
	padding: 0px;
	border: 0px;
	width: 30px;
	min-width: 30px;
	height: 30px;
	min-height: 30px;
	/* display: block; */
}

.scroll_top_button.outlinedSVG {
	/* padding: 0px;
	border: 0px;
	margin: 0px;
	margin-left: 8px; */
	margin-right: 0px;
}

#menu__right_container {
	margin-left: auto;
	margin-right: 0px;
}

.outlinedSVG_wide {
	width: 68px;
	min-width: 68px;
}

.outlinedSVG_COM {
	width: 44px;
	min-width: 44px;
	margin-right: 0px;
}

.outlinedSVG svg *,
.outlinedSVG_COM svg * {
	fill: #fff;
}

.outlinedSVG.orangeSVG svg *,
.outlinedSVG_COM.orangeSVG svg * {
	fill: #FF8000;
}

.outlinedCreate {
	text-decoration:none;
	border: 1px solid #FF8000;
	color: #FF8000;
}

.outlinedList {
	margin: 5px 8px 5px 0px;
}

.outlinedBlock {
	margin: 5px 0px;
}

.outlinedEquipment,
.outlinedMarginless {
	text-decoration:none;
	margin: 5px 0px;
	display: block;
}

.outlinedLink .fullWidth,
.outlinedList .fullWidth {
	width: calc( 100% - 8px - 2px );
}

.customInput_burger_v3  {
	margin: 5px 8px 5px 0px;
}

.menuLink {
	margin: 5px;
}

.inlineLink {
	margin: 0px;
}

a.outlinedLink:active, a.a:active {
	text-decoration:none;
	background:none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	outline: 0;
}
.ColorBlue {
	color:#8499b3;
}

.FullButton, .FullButton a, input.FullButton {
	width:100%;
	height:30px;
	color:#00005C;
	background:#FFF;
	display:block;
	line-height:30px;
	text-align:center;
	border: solid 1px #333;
	font-size:14px;
	margin:5px 0;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	outline: 0;
}
.FullButton a:active, input.FullButton:active {
	background:#8499b3;
	color:#333;
}
.FloatLeft {
	float:left;
}

/* ------------------------------------------------------------- COMBAT NEW -------*/

.sb_label {
	display: inline-block;
	width: 100%;
	margin: 10px 0px 10px 0px;
}

.sb_label > *,
.sb_label > input:active,
.sb_label > input:focus {
	font-size: 20px;
	text-align: center;
}


.sb_submit,
.sb_submit:active,
.sb_submit:focus {
	display: block;
	width: 100%;
	margin: 20px 0px 10px;
	cursor: pointer;
}

/* .sb_clear,
.sb_clear:active,
.sb_clear:focus {
	display: block;
	width: 100%;
	margin: 20px 0px 0px;
	cursor: pointer;
	font-size: 12px;
} */

#sb_centerNote,
#sb_back {
	flex: 0 0 100%; /* Let it fill the entire space horizontally */
	margin: 15px 0px 0px 0px;
	margin: 0px 0px 30px 0px;
}

#sb_back {
	margin: 0;
	font-size: 12px;
	padding: 4px 0px 4px;
	cursor: pointer;
	position: fixed;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background: #333;
	text-align: center;
}

.sb_clearShip,
.sb_clearShip:active,
.sb_clearShip:focus {
	display: inline-flex;
	cursor: pointer;
}

.sb_displayRoll {
	font-size: 14px;
	margin: 0px 0px 20px 0px;
}


#sb_commands {
	display: flex;
	width: 320px;
	justify-content: center;
	flex-direction: column;
	font-size: 34px;
	padding: 40px 0px 40px 0px;
}

#sb_commands a {
	font-size: 26px;
	text-align: center;
}

.sb_commandTitle {
	font-size: 28px;
	margin: 0px 0px 20px 0px;
}

.sb_iniSubmit,
.sb_iniSubmit:active,
.sb_iniSubmit:focus {
	margin: 10px 0px;
	cursor: pointer;
	font-size: 20px;
}

.hr {
	display: block;
	width: 100%;
	height: 1px;
	background: #ffffff;
}

.sb_shipName {
	font-size: 20px;
	margin: 0px 0px 30px 0px;
}

#sb_leftShip,
#sb_rightShip {
	display: flex;
	width: 100%; max-Width: 320px;
	justify-content: flex-start;
	flex-direction: column;
}

#sb_rightShip .sb_inputLabel {
	text-align: center;
}

#sb_leftShip .sb_inputLabel {
	text-align: center;
}

.sb_shipInput {
	text-align: center;
	width: 30px;
	margin: 0 0 10px;
}

.sb_shipImage {
	width: 400px;
	height: 240px;
	display: flex;
	margin: 0px auto 40px;
	background: #cccccc;
}

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

.sb_shipSubmit {
	cursor: pointer;
}

.sb_baseValues {
	display: flex;
	justify-content: space-between;
	margin: 0px 0px 30px 0px;
}


.sb_select {
	color: #333;
	font-size: 18px;
}

.sb_selectValue {
	font-size: 18px;
}

/* ------------------------------------------------------------- MAIN -------------*/


/* hide scrollbar but allow scrolling */
/* #mainBody { */
	/* -ms-overflow-style: none; * for Internet Explorer, Edge */
	/* scrollbar-width: none; for Firefox */
	/* overflow-y: scroll;  */
/* } */

/* #mainBody::-webkit-scrollbar { */
	/* display: none; for Chrome, Safari, and Opera */
/* } */



/* Der Seitenlauf der Seite ist deaktiviert */
#mainBody.no-scroll {
	overflow-y: hidden;
}

#SiteName {
	text-align: center;
	max-width: 320px;
	width: 100%;
	margin: 0px auto;
}
div#SiteName a {
	text-decoration: none;
	font-size: 35px;
	display: block;
	padding: 10px 0;
	width:100%;
}
div#SiteName a img {
	width:100%;
}
#mainNav {
	height: auto;
	overflow: hidden;
}
#mainNav a:first-child {
	margin-left:0px;
}

#mainNav a:last-child {
	margin-right:0px;
}

/* ------------------------------------------------------------- PLANETS -------------*/
.StatusError {
	background: red;
}
.StatusValid {
	background: greenyellow;
	color:#333;
}
.StatusErrorName, .StatusErrorX, .StatusErrorY, .StatusErrorFaction {
	display:none;
	background:red;
	height:30px;
	width:30px;
	float:left;
	margin-right:10px;
}
.StatusValidName, .StatusValidX, .StatusValidY, .StatusValidFaction {
	display:none;
	background:greenyellow;
	height:30px;
	width:30px;
	float:left;
	margin-right:10px;
}
.FoundSystems {
	list-style: none;
	background: none;
	height:auto;
	overflow: auto;
	width: 100%;
	float:left;
	margin: 10px 0 20px;
}
div#StarPlanetCords, div#TargetPlanetCords {
	float: left;
	width: 300px;
	margin: 20px 0 0;
}

div.PlanetAddSuccess, div.PlanetAddFail {
	background: yellowgreen;
	color: #FFF;
	display:block;
	height:auto;
	padding: 10px 0 5px;
	text-align: center;
	font-weight: bold;
	margin: 0 0 20px;
}
div.PlanetAddFail {
	background: red;
}
.PlanetLetter {
	margin: 0 0 10px 0;
}
.PlanetList {
	width: auto;
	height:30px;
	white-space: nowrap;
	float:left;
	padding: 0 10px;
	background:#FFF;
	margin: 0 5px 5px;
}
.PlanetList a {
	line-height:30px;
	color:#00005C;
}
#PlanetImage {
	width:250px;
	height:250px;
	display:flex;
	float:right;
	margin:0 0 30px 30px;
}

/* ------------------------------------------------------------- MAP -------------*/
#mapWrapper {
	position: absolute;
	overflow: hidden;
	left: 20px;
	right: 20px;
	background: #333;
	min-height: 200px;
}

.mapContainer {
	width: 4500px;
	height: 4500px;
	overflow: visible;
	outline: #ccc;
	position: absolute;
	display: block;
	background-image: url("/assets/images/g2.jpg");
}

.map_bZoom {
  position: relative;
  z-index: 200;
  width: 50px;
  height: 50px;
  display: inline-block;
  background: #333;
}

.map_planetMarker {
	width: 12px;
  height: 12px;
  position: absolute;
}

.map_planetFaction {
	width: 8px;
	height: 8px;
	background: blue;
	border: 2px solid orange;
	position: absolute;
	top: 0px;
	left: 0px;
	border-radius: 6px;
	z-index: 9;
}

.map_planetName {
	display: block;
	font-size: 10px;
	white-space: nowrap;
	color: #FF9900;
	padding: 1px 8px 2px 8px;
	margin: 1px 0 0;
	z-index: 500;
	line-height: 100%;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	cursor: pointer;
	z-index: 4;
	width: auto;
	position: absolute;
	background: #5A0000;
	border: 1px solid #FF9900;
}

div.MapButton {
	background-color:rgba(0, 51, 102, 0.4);
	filter:Alpha(Opacity=40);
	z-index:4000;
	position:absolute;
}
#MoveTop { width:100%; height:30px; top:0px; }
#MoveRight { height:100%; width:30px; top:0px; right:0px; }
.Line {
	position:absolute;
	width:2px;
	background:#D13E87;
	transform-origin: 1px 0;
	-webkit-transform-origin: 1px 0;

}
.Gate {
	border-radius:0px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}
div.Marker {
	width:12px;
	height:12px;
	position:absolute;

}
div.MarkerToggle {
	width:8px;
	height:8px;
	background:blue;
	border:2px solid orange;
	position:absolute;
	top:0px;
	left:0px;
	border-radius:6px;
	z-index:9;
}
div#Line1, div#Line2 {
	width:2px;
	height:100%;
	position: absolute;
	left:2250px;
	display:block;
	background:#FF9900;

}
div#Line2 {
	width:100%;
	height:2px;
	top:2250px;
	left:0px;
}
div.MarkerDetails {
	width:auto;
	position:absolute;
	background:#5A0000;
	border: 1px solid #FF9900;
	z-index:2;

}
div.MarkerDetailsLine {
	width:100%;
	height:1px;
	display:flex;
	background:#FF9900;
	position:absolute;
	top:32px;
	left:0px;
	z-index:2000;
}
a.MarkerDetailLink  {
	text-align:center;
	display: block;
	width: 100%;
	font-size:10px;
	white-space: nowrap;
	color:#FF9900;
	padding: 1px 0px 2px 0px;
	margin:1px 0 0;
	z-index:500;
	line-height:100%;
}
.MarkerLine {
	padding:0 8px;
	white-space: nowrap;
	color:#FF9900;
}
#DisplayTarget {
	display:none;
}

/* ------------------------------------------------------------- LOGIN -------------*/
#LogInMessage {
	width:100%;
	min-height:30px;
	line-height:30px;
	text-align:center;
	padding: 30px 0 0;
	font-size: 30px;
}
#LogForm {
	margin:30px 0;
	width:100%;
}
.LogFormLine {
	text-align:center;
}
.LogFormType {
	width: 200px;
	height:40px;
	line-height:40px;
	display:inline-block;
	text-align:left;
}
.LogInFormFill {
	width:300px;
	border:none;
	background:#666;
	color:#FFF;
}
#LogInButton {
	margin:20px auto;
	max-width: 500px;
	width:100%;
	text-align:center;
}

/* ------------------------------------------------------------- GUESTBOOK -------------*/

#GuestMessage {
	max-width: 100%;
	min-width:100%;
	width:100%;
	max-height:140px;
	min-height:140px;
	height:140px;
	color:#333;
}
#GuestBook {
	margin:30px 0 0;
}
.FactionTerr {
	position:absolute;
	font-size:34px;
	z-index:40000;
	clear:both;
	float:none;
	white-space:nowrap;
}
.FactionSub {
	margin-top:5px;
	text-align:center;
	font-size:16px;
	clear:both;
	float:none;
}
#IGA {
	top:2839px;
	left:2894px;
}

#mainNav_b {
	color: #ffffff;
	outline: 1px solid #ffffff;
	outline-offset: -1px;
	width: 100%;
	height: 30px;
	line-height: 30px;
	cursor: pointer;
}

/* 700 */

@media screen and ( max-width: 740px ) {

/*	#toggleSounds {
	top:190px;
	right:-36px;
}*/

	#SiteName a {
		height:auto;
	}
	#SiteName a img {
		width:100%;
	}
}

/* ------------------------------ */

#single-page-application-background {
	position: fixed;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	background: #000000;
	z-index: -10;
}

.hidden,
.cjs_hidden {
	display: none!important;
}

.cjs_block {
	display: block;
}

.cjs_buried {
	position: absolute;
	z-index: -1000;
	width: 320px;
}
.display {
	display: block;
}
.clearAll {
	clear: both;
	float: none;
	width: 100%;
	height: 0px;
	display: block;
}
.DummyDIV {
	padding:4px;
	background:#333;
	color:#FFF;
	cursor:pointer;
}
#ContentData {
	position:relative;
}
#ContentOverlay {
	position:absolute;
	top:0px; right:0px; bottom:0px; left:0px;
	background: rgba(13, 13, 13, 1.0);
	padding:8px;
	height:auto;
}
@media screen and (max-width: 640px) {
	#PlanetImage {
		margin:0 auto 20px;
		float:none;
	}
}

@media screen and (max-width: 381px) {
	a.thumbnail img {
		margin:0 auto;
		display:block;
	}
	span.nscInfo {
		margin:0 auto;
	}
	.thumbnail {
		display:block !important;
	}
	.fullWidth {
		margin:5px 0 !important;
		width: calc(100% - 22px);
		text-align:center;
	}
	#updateImage {
		margin:0 auto;
		display:block !important;
		text-align:center;
	}
	#groupImage {
		display:block;
    margin:0 auto;
	}
}


/*
* NSCs
*/

span.nscInfo {
	font-size:12px;
	padding-bottom:8px;
	display:block;
	text-align:center;
	max-width:160px;
	width:100%;
}
.displayValue {
	display:block;
	font-size:14px;
	margin-left:46px;
}
.nsc_valueCount {
	display:inline-block;
	width:44px;
	text-align:center;
}
.nsc_valueName {
	display:inline-block;
	margin-left:6px;
}
#lable_reUpload {
	height:auto;
}

span.nameAffix {
	font-size:12px;
	display:inline-block;
	position:relative;
	bottom:3px;
}
span.editItem, span.updateItem, span.closeEdit, span#addItem, span.insertItem, span#addNSC, span.insertNSC, span.editNSC, span.updateNSC, span.button, span.deleteFigure, #confirm, #cancel, #updateImage, #closeUpdate {
	font-size:12px;
	cursor:pointer;
	display:inline-block;
	border:1px solid #fff;
	padding:2px 10px;
	margin-top:4px;
}
#updateName, #updateNameAffix, #updateType, #updateSkill {
	width:204px;
	border:0;
	min-height:17px;
}
#updateSkill {
	padding:0;
}
div#editThis {
	position:fixed;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	height:100%;
	background:rgba(0, 0, 0, 0.7);
	z-index:1000;
}

.tempRow {
	display:block;
	margin-bottom:12px;
}
.tempInput, .addInput {
	width:40px;
	text-align:center;
	margin-left:10px;
}

.thumbnail {
	display:inline-block;
	margin:0 3px;
	vertical-align:text-top;
	position:relative;
}

.boldNSC {
	font-size:14px;
}
.thumbnail img {
	width:154px;
}

span#editOrder {
	font-size:12px;
	color:#ccc;
	display:inline-block;
	margin-left:10px;
	cursor:pointer;
}

span.button {
	font-size:12px;
	cursor:pointer;
	display:inline-block;
	border:1px solid #fff;
	padding:2px 10px;
	margin-top:4px;
}
.button {
	margin-left:10px;
}

/* Mercs */

	.pageInactive {
		color:#ccc;
	}
	pre {
		display: inline-block;
	}
	span.mercRow {
		display:block;
		min-height:20px;
		padding-bottom:4px;
		border-bottom:1px solid #8499b3;
		margin-bottom:6px;
		clear:both;
	}
	span.mercRow:hover {
		border-bottom:1px solid #ffffff;
/*					cursor:pointer;*/
	}
	.clearFloat {
		clear:both;
	}
	span.mercRow > span {
		float:left;
	}
	span.mercName {
		width:100%;
		display:block;
	}
	span.mercID {
		width:360px;
	}
	span.mercRank {
		width:180px;
	}
	span.mercAge {
		width:60px;
	}
	span.mercState {
		width:100px;
	}

	span.mercLeft {
		width:360px;
		display:inline-block;
	}

	span.mercPush {
		margin:4px 0 8px;
		width:100%;
	}

	span.mercRight {
		/*width:calc(100% - 360px);*/
		display:inline-block;
	}

	span.mercButton {
		width:30px;
		border:1px solid #fff;
		display:inline-block;
		text-align:center;
		margin:0 10px;
		cursor:pointer;
	}
	span.mercButton:hover {
		border:1px solid #ffffff;
		color:#ffffff;
	}

	div#sug_assignCharacter, div#requiredSuggestions, div#categorySuggestions, div#originSuggestions, div#sug_selectAmmo, div#sug_selectWeapon, div#sug_selectRange {
		position:absolute;
		width:192px;
		background:#141E2D;
		z-index:1000;
	}
	span.output_searchReult {
		width:calc(100% - 26px);
		display:block;
		cursor:pointer;
		padding:4px 12px;
		margin:0 0 4px 0px;
		font: 13.3333px Arial;
		border:1px solid #ffffff;

	}

	.originFound, .categoryFound {
		display:block;
		cursor:pointer;
		padding:4px 12px;
		margin:0 0 4px 0px;
		font: 13.3333px Arial;
		border:1px solid #ffffff;
	}

	#lable_reIcon, #lable_reImage {
		height: auto;
	}

	span.thumbnailInfo {
		font-size:12px;
		padding-bottom:8px;
		display:block;
		text-align:center;
		max-width:154px;
		width:100%;
	}

	.itemImage {
		/*width:calc(100% - 40px);*/
		margin:30px 0 0;
		/*display:block;*/
	}


	.searchSelected {
		color:#ffffff;
		background:white;
	}


	.frame_click {
		border: 1px solid #ffffff;
		padding: 6px 8px;
		cursor: pointer;
		margin:0 4px;
		font-size:12px;
	}
	.frame_cluster {
		padding: 4px 0px;
	}
	.frame_line {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}

	.frame_block {
		display: flex;
		flex-direction: column;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.frame_frame {
		margin-right:20px;
	}
	.thisClick {
		color:red;
	}
	.frameKey {
		display:block;
	}
	span.frame_currentLine, span.frame_line {
		color:#e6e6e6;
	}

	.frame_click:first-child {
		margin-left: 0px;
	}

	.frame_click:last-child {
		margin-right: 0px;
	}


	.frame_currentLine {
		color:#333;
	}
	.frame_currentLine .frame_click:hover,
	.frame_currentLine .frame_click:active {
		text-decoration: underline;
	}

	.frame_locked {
		color:#FF8000;
		text-decoration:underline;
	}

	div#characterLeft, div#characterRight {
		display:block;
		float:left;
	}

	div#characterLeft {
		width:50%;
		background:#333;
	}
	div#characterRight {
		width:50%;
		background:#ccc;
	}

/*
	Impressums */

.globalInput_select {
	color: #fff;
	background: none;
	outline: 0px;
	border: 1px solid #ffffff;
	padding: 5px 10px;
	cursor: pointer;
}

.globalInput_select.fullWidth {
	width: calc( 100% );
}

.listContainer {
	margin: 0px 0px 10px 0px;
}

#coordinationType {
	font-size: 30px;
	display: block;
	margin-bottom: 10px;
}


#openCombat {
	margin: 0px 0px 20px 0px;
}


.items_typeName {
	font-size: 34px;
}

.items_categoryName {
	font-size: 26px;
}

.item_searchType_create,
.item_searchCategory_create,
.glossar_category_searchParts_create {
	border: 1px solid #FF8000;
	color: #FF8000;
}

.glossar_searchCategory_empty {
	border: 1px solid #cc0000;
	color: #cc0000;
}

.glossar_activeInput {
	background: #333333;
	padding: 0px 10px;
	outline: none;
	display: inline-block;
}

.glossar_categoryName,
.glossar_entryName {
	font-size: 30px;
	display: block;
	margin-top: 20px;
}

.glossar_textareaEdit {
	resize: vertical;
	width: 100%;
	min-height: 120px;
}

.outlinedLink.white,
.outlinedList.white {
	text-decoration:none;
	border: 1px solid #fff;
	color: #fff;
}

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

#ship_infoData,
#ship_componentsData {
	margin: 20px 0px;
}

#category_part_current {
	width: 100%;
}

.category_part_entry {
	width: calc( 100% - 22px );
	text-align: left;
	margin: 5px 0px;
}



.components_componentWrapper {
	margin: 10px 0px;
	padding: 10px 10px 0px 10px;
	border: 1px solid #ffffff;
}


.components_componentWrapper.damaged {
	border: 1px solid #cccccc;
}

.components_partEntry.damaged,
.components_partEntry.damaged .components_partName,
.components_partEntry.damaged .components_partPercentage_current,
.components_partEntry.damaged .components_partPercentage span,

.components_componentWrapper.damaged .components_categoryName,
.components_componentWrapper.damaged .components_componentName,
.components_componentWrapper.damaged .components_componentPercentage_current,
.components_componentWrapper.damaged .components_componentPercentage span {
	color: #cccccc;
}


.components_componentWrapper.critical {
	border: 1px solid #FF8000;
}

.components_partEntry.critical,
.components_partEntry.critical .components_partName,
.components_partEntry.critical .components_partPercentage_current,
.components_partEntry.critical .components_partPercentage span,

.components_componentWrapper.critical .components_categoryName,
.components_componentWrapper.critical .components_componentName,
.components_componentWrapper.critical .components_componentPercentage_current,
.components_componentWrapper.critical .components_componentPercentage span {
	color: #FF8000;
}


.components_componentWrapper.offline {
	border: 1px solid #cc0000;
}

.components_partEntry.offline,
.components_partEntry.offline .components_partName,
.components_partEntry.offline .components_partPercentage_current,
.components_partEntry.offline .components_partPercentage span,

.components_componentWrapper.offline .components_categoryName,
.components_componentWrapper.offline .components_componentName,
.components_componentWrapper.offline .components_componentPercentage_current,
.components_componentWrapper.offline .components_componentPercentage span {
	color: #cc0000;
}




.components_categoryName {
	font-size: 14px;
	word-break: break-word;
}

.components_componentName,
.components_partName,
.components_partPercentage_current,
.components_componentPercentage_current {
	/* font-size: 18px; */
	word-break: break-word;
	float: left;
}

.components_partName,
.components_partPercentage_current,
.components_componentPercentage_current {
	font-size: 14px;
}

.components_componentPercentage,
.components_partPercentage {
	float: right;
}

.components_componentValue,
.components_componentValue span {
	clear: both;
}
.components_componentContent {
	margin: 20px 0px 0px;
}

.components_partEntry {
	margin: 4px 0px;
}

.components_partEntry:last-of-type {
	margin: 4px 0px 20px;
}

.components_componentParts_extend,
.components_componentParts_collapse {
	text-align: center;
	text-transform: uppercase;
	padding: 10px 10px;
	font-size: 14px;
	cursor: pointer;
}

.planets__errorList {
	clear: both;
	font-size: 12px;
	padding-left: 20px;
	margin: 4px 0px;
}


#pageNavigation {
	position: relative;
	margin: 0px auto;
	width: 100%;
	max-width: 320px;
	padding: 0px 0px 10px 0px;

	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}


.components_smallDetails {
	color: #888;
	font-size: 12px;
}


.components_partEntry_edit {
	cursor: pointer;
}

.components_partEntry_repair {
	margin: 10px 0px 0px;
	border-bottom: 1px solid #ffffff;
	padding: 0px 0px 10px 0px;
}

#components_resetWrapper {
	margin: 20px 0px;
}

.story_contentWrapper {
	margin: 20px 0px 0px;
}

.story_smallNote,
.story_smallNote * {
	color: #888888;
	font-size: 12px;
	text-decoration: none;
	line-height: normal
}

/* .story_smallNote * {
	color: inherit;
	font-size: inherit;
} */

#story_storyDetails {
	margin: 0px 0px 30px 0px;
}

#story_storyEdit {
	margin: 30px 0px 0px;
}

.avatar_skillsWrapper {
	margin: 0px 0px 0px 0px;
}

.avatar_skillsTopic_input,
.avatars_skillsSpecializations_input {
	width: 42px;
	margin: 0px 0px 0px 0px;
}

.avatars_skillsSpecializations {
	padding: 0px 0px 0px 20px;
}

.avatar_skillsDescription {
	margin: 10px 0px 0px 0px;
}


#avatar_skillDescription_display,
#avatar_skillDescription_hide {
	cursor: pointer;
}

.avatar_imageLabel {
	margin: 0px;
}


/* https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.frame_vanatiInputs {
	width: 10px;
	text-align: center;
}

#frame_vanatiSubmit {
	display: block;
	text-align: center;
}

.frame_successElement {
	color: #FF8000;
	text-decoration: underline;
}

.frame_missedElement {
	color: #888888;
}

.frame_wrongElement {
	color: #cc0000;
}

.frame_vanatiBlock {
	display: block;
	margin: 0px 0px 4px 0px;
}

#frame_vanatiHelp {
	margin: 10px 0px 10px;
}

.glossar_ammunitionMagazin {
	width: 60px;
}

#glossar_entryAmmunition {
	margin: 0px 0px 4px 0px;
}

.glossar_magazinWrapper {
	display: flex;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
}

.glossar_magazinWrapper .cjs_customInput_wrapper {
	margin: 0px;
}

.glossar_ammunition {
	margin: 4px 0px 0px;
}

.glossar_ammunitionDelete  {
	margin: 0px 8px 5px 0px;
}

#frames_selectOverview {
	margin: 0px 0px 40px;
}

.glossar_skillWrapper {
	display: block;
}

.glossar_skillInput {
	width: 60px;
}

#story_storyDescription,
#story_storyHeroes {
	margin: 15px 0px;
}

.avatar_skillsBONUS {
	color: #FF8000;
}

.avatar_skillsMALUS {
	color: #cc0000
}

.equipmentState {
	float: left;
	border: 1px solid #ffffff;
	height: 100%;
}

.inventoryEntry,
.equipmentEntry,
.cardsEntry {
	height: auto;
	overflow: hidden;
	margin: 10px 0px;
}

.inventoryEntry:first-of-type,
.equipmentEntry:first-of-type,
.cardsEntry:first-of-type {
	margin: 0px 0px 10px;
}

.inventoryEntry {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: flex-start;
}

.inventoryData {
	width: 100%;
}

.equipmentOptions,
.cardsOptions {
	float: left;
}

.equipmentData,
.cardsData {
	float: right;
}

.equipmentChange_SET {
	border: 1px solid #FF8000;
	color: #FF8000;
}

.equipmentChange_UNSET {
	border: 1px solid #888888;
	color: #888888;
}



.cjs_overlayContainer,
.cjs_overlayBackground,
.cjs_centerNote_wrapper {
	display: block;
	position: fixed;
	left: 0px; top: 0px; right: 0px; bottom: 0px;
}

.cjs_overlayContainer {
	z-index: 23000;
}

.cjs_overlayBackground {
	background: #000000;
	opacity: 0.85;
	bottom: inherit;
}

#cjs_overlayHeader {
	display: flex;
    justify-content: flex-end;
    flex-direction: row;
    padding: 0px 0px 10px 0px;
	width: 100%;
	background: #000;
}

#cjs_overlay_editButton {
	margin: 0px 10px 0px 0px;
}

#cjs_overlayClose {
	margin: 0px;
	position: fixed;
	right: 0px;
	background: #000;
	top: -35px;
}


/* https://www.w3schools.com/howto/howto_css_hide_scrollbars.asp */
/* https://www.w3schools.com/howto/howto_css_center-vertical.asp */

	.cjs_overlayWrapper {
		width: 320px;
		margin: auto;
		position: fixed;
		right: 0px; left: 0px;
		background: #000000;

		top: 50%;
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);

		height: calc( 100% - 40px );
		max-height: 555px;
		
	}

	.cjs_overlayContent {
		overflow-y: scroll; /* Add the ability to scroll */
		height: 100%;
	}

	.cjs_noUnderline {
		text-decoration: none;
	}

	.cjs_bottomNote {
		position: fixed;
		left: 0px; right: 0px; bottom: 36px;
		padding: 10px;
		margin: auto;
		width: calc( 100% - 20px );
		max-width: 320px;
	}

	.cjs_buttomNote_message {
		width: 100%;
		max-width: 300px;
		text-align: center;
	}

	.cjs_underline {
		text-decoration: underline;
	}


	.planets_weaponsORIGIN_category {
		padding: 0px 0px 0px 20px;
	}

	.imageManager_content {
		outline: 1px solid #ffffff;
		padding: 4px 8px;
		width: calc( 100% - 20px );
		max-width: 300px;
		margin: 0px auto;
	}

	#imageManager_header {
		height: auto;
		overflow: hidden;
	}

	.imageManager_displayImage {
		text-align: left;
	}

.combat_wrapperSection {
	margin: 0px 0px 20px 0px;
}

.combat_wrapperCharacter,
.combat_wrapperCharacter_wrapper {
	height: auto;
	overflow: hidden;
}

.combat_wrapperCharacter_wrapper {
	margin: 0px 0px 10px 0px;
}

.combat_inputCharacter {
	width: calc( 50% - 32px );
	float: left;
}

.combat_outputCharacter .combat_inputCharacter {
	width: calc( 50% );
}

.combat_spaceCharacter,
.combat_fightCharacter,
.combat_getINI {
	width: 40px;
	text-align: center;
	float: left;
	padding: 5px 0px;
	margin: 0px 0px;
}

.combat_inputCharacter_left {
	float: left;
	width: calc( 50% - 32px );
	text-align: left;
}

.combat_inputCharacter_right {
	float: right;
	width: calc( 50% - 32px );
	text-align: right;
}

.combat_left_input,
.combat_leftCharacter {
	width: calc( 100% - 22px );
	float: left;
}
.combat_right_input,
.combat_rightCharacter  {
	width: calc( 100% - 22px );
	float: right;
}

.combat_displayCharacters,
.combat_displayRepresentative,
.combat_wrapperCharacter_wrapper {
	height: auto;
	overflow: hidden;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.combat_displayCharacters,
.combat_wrapperRepresentative,
.combat_inputCharacter_wrapper {
	margin: 5px 0px 5px 0px;
	height: auto;
	overflow: hidden;
	float: left;
	width: 100%;
}

.combat_outputCharacter {
	clear: both;
	height: auto;
	overflow: hidden;
}

/* https://stackoverflow.com/questions/7546389/css-overflow-only-1-line-of-text */
.combat_leftCharacter_link,
.combat_rightCharacter_link {
	overflow: hidden; 
	white-space: nowrap;
	max-width: 100%;
	display: block;
	margin: 0px;
}


.combat_dropdown_representatives {
	width: 100%;
}

.combat_wrapperRepresentative {
	float: none;
}


#combat_dropdown_participantWeapon {
	width: 100%;
}

#combat_weaponMagazine span {
	color: inherit;
}


.redText {
	color: #cc0000;
}

.input_greyText {
	color: #888888;
}

.whiteText {
	color: #ffffff;
}

.orangeText,
.components_selected {
	color: #FF8000;
}


.combat_sectionHeader {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	align-items: flex-start;
}

.greyText * {
  color: #888888;
}

.sub_categories {
	padding: 0px 0px 0px 10px;
}

.hierarchy_categoryWrapper {
	margin: 0px 0px 20px 0px;
}

.noPadding,
.cjs_noPadding {
	padding: 0px;
}

.sub_category {
	margin: 0px 0px 10px 0px;
}

.glossar_clearSearch {
	border: 1px solid #ffffff;
	margin: 0px 8px 0px 0px;
	padding: 5px 10px;
	cursor: pointer;
}


.planets__alchemy_wrapper {
	display: flex;
    align-items: flex-start;
}

.planets__alchemy_areaINPUT {
	margin: 5px 0px;
	width: calc( 100% - 22px );
}

.planets__alchemy_ingredients {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.planets__alchemy_ingredientLABEL  {
	display: flex;
    flex-direction: column;
	width: calc( ( 100% / 4 ) - 4px );
}
.planets__alchemy_ingredientLABEL:first-child {
	margin: 0px 2px 0px 0px;
}
.planets__alchemy_ingredientLABEL:last-child {
	margin: 0px 0px 0px 2px;
}

.planets__alchemy_ingredientINPUT {
	text-align: center;
}


.character_currencySummary {
	margin: 0px 0px 6px 0px;
}


.credits_currentAmount {
	color: inherit;
}

.credits_setAmountINPUT  {
	margin: 5px 0px 0px 0px;
}

.__main_xhrOutput {
	position: relative;
}

.__main_preLoader,
.cjs_preloader_wrapper {
	display: flex;
	align-items: center;
}

#cjs_preloader_inline {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: flex-start;
}

.cjs_preloader_outlinedButton {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
}

.cjs_preloader_wrapper {
	position: fixed;
	top: 0px; right: 0px; bottom: 0px; left: 0px;
	max-width: 320px;
	margin: auto;
	z-index: 23;
	display: flex;
    justify-content: center;
}

.cjs_preloader_content {
	position: absolute;
	display: flex;
	align-items: center;
    flex-direction: row;
	z-index: 10;
}

.cjs_preloader_background {
	background-color: #000;
	width: 100%;
	height: 100%;
	opacity: 0.85;
}

/* https://www.w3schools.com/howto/howto_css_loader.asp */

.__main_preloader_spinner,
.cjs_preloader_spinner {
	border: 2px solid #fff;
	border-radius: 50%;
	border-top: 2px solid #000;
	width: 8px;
	height: 8px;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate( 0deg ); }
	100% { -webkit-transform: rotate( 360deg ); }
}

@keyframes spin {
	0% { transform: rotate( 0deg ); }
	100% { transform: rotate( 360deg ); }
}

.__main_preLoader_text,
.cjs_preloader_text {
	margin: 0px 0px 0px 6px;
}

.map_entryIcon {
	height: 10px;
	width: 10px;
	position: absolute;

	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select: none;
	outline: 0;

	font-size: 0px;
}

.map_entriesContainer {
	width: 0px;
	height: 0px;
}

.map_entryWrapper_name {
	position: absolute;
	width: max-content;
    color: #fff;
    padding: 0px 4px;
    font-size: 11px;
	text-decoration: none;
}

#map_editMarker_display {
	display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

.map_editMarker {
	width: calc( 50% - 2px);
    margin: 0px;
    padding: 0px;
	text-align: center;
    padding: 4px 0px;
}

.admin_userList_users {
	margin: 0px 0px 20px 0px;
}

.admin_userList_SL,
.admin_userList_participant {
	padding: 0px 0px 0px 10px;
}

.admin_userList_SL ul,
.admin_userList_participant ul {
	margin: 0px 0px 4px 0px;
	padding: 0px 0px 0px 20px;
}

.admin_storySettings {
	cursor: pointer;
}

.admin_userList_SL ul li,
.admin_userList_participant ul li {
	padding: 0px;
	margin: 0px
}

.admin_userList_SL ul li::marker,
.admin_userList_participant ul li::marker {
	content: '› ';
}

.equipmentOptions_magazineRounds {
	color: inherit;
}

#glossar_searchGlossar_wrapper {
	display: block;
	margin: 0px 0px 30px 0px;
}

#cjs_searchWrapper {
	display: inline-block;
    position: absolute;
    left: 0px;
    top: 5px;
    background: #000000;
}


.inventory_quickSelect_wrapper {
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin: 2px 0px 2px 0px;
	flex-direction: row;
    flex-wrap: wrap;
}


.participant_specializationsWrapper,
.cjs_narrowLIST_currencies_types {
	width: 100%;
	padding: 4px 0px 0px 10px;
}

.inventory_quickSelect_container {
	display: flex;
	align-items: center;
}

.inventory_objectUnits,
.inventory_magazineCount {
	margin: 0px 5px 0px 0px;
}

.inventory_entryType {
	margin: 0px 0px 0px 5px;
}

.locationPlanet {
	margin: 0px 10px 0px 0px;
}

.participant_rollDice {
	cursor: pointer;
}

.inventory_quickSelect_active,
.inventory_quickSelect_inactive,
.inventory_quickSelect_hidden,
.inventory_quickSelect_active_svg,
.inventory_quickSelect_inactive_svg,
.inventory_quickSelect_hidden_svg,
.inventory_quickSelect_external_svg,
.inventory_quickSelect_lost_svg,
.inventory_quickSelect_locked_svg,
.items__roll_dice {
	margin: 0px;
	cursor: pointer;
	width: 12px;
	height: 12px;
}

.inventory_quickSelect_active_svg,
.inventory_quickSelect_inactive_svg,
.inventory_quickSelect_hidden_svg,
.inventory_quickSelect_lost_svg,
.inventory_quickSelect_external_svg,
.inventory_quickSelect_locked_svg,
.items__roll_dice {
	display: inline-block;
	width: 22px;
	height: 22px;
	border: none;
	margin-left: 5px;
}
.inventory_quickSelect_active_svg .cjs_checkbox_color {
	fill: #FF8000;
}

.inventory_quickSelect_locked_svg .cjs_checkbox_color {
	fill: #cc0000;
}

.inventory_quickSelect_inactive_svg .cjs_checkbox_color {
	fill: #888888;
}

.items__stabilized_status.inventory_quickSelect_inactive_svg .cjs_checkbox_color {
	fill: #fff;
}

.items__roll_dice .cjs_checkbox_color {
	fill: #fff;
}

.inventory_quickSelect_hidden_svg .cjs_checkbox_color {
	fill: none;
}

.inventory_quickSelect_active {
	background: #FF8000;
}
.inventory_quickSelect_inactive {
	background: #888888;
}

.inventory_quickSelect_hidden,
.inventory_quickSelect_hidden_svg {
	color: transparent;
	cursor: default;
}


#inventory_totalRK {
	color: #888888;
}

.inventar_ammunition {
	margin: 6px 0px 0px;
}
.inventory_ammoType  {
	text-align: right;
}

.break,
.cjs_flexBreak {
	flex-basis: 100%;
	height: 0;
}

.character_baseSKILL,
.participant_baseStat,
.item_baseSKILL {
	color: #888888;
	margin-right: 4px;
	white-space: pre-wrap;
}


.combat_sectionWrapper {
	margin: 0px 0px 10px 0px;
	border-bottom: 1px solid #fff;
	padding: 0px 0px 10px 0px;
}

.combat_sectionHeader {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.combat_participant_displaySK,
.combat_participant_displaySK:focus {
	outline: 0px;
	border: 0px;
	width: 20px;
	text-align: right;
	/* background: #888; */
	padding: 0px;
	margin: 0px 0px 0px 6px;
}


.combat_participant_button {
	padding: 5px 10px;
	cursor: pointer;
	border: 1px solid #ffffff;
	margin: 0px 0px 0px 6px;
}

.combat_participant_wrapperSK {
	margin: 0px 10px 0px 0px;
}

.combat_participant_increaseSK {
	cursor: pointer;
}

.combat_participant_displaySK {
	color: inherit;
	cursor: pointer;
}

.combat_participant_controller {
	flex: none;
	padding: 0px 0px 0px 14px;
}

.combat_participant_row {
	padding: 4px 0px;

}

.combat_participant_content {
	display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: flex-start;
	padding: 5px 0px;
}

.combat_participant_nameWrapper {
	display: inline-flex;
}

.combat_participant_nameWrapper::before {
	content: '›';
	padding: 0px 6px 0px 0px;
}

.combat_displayRound {
	display: flex;
	cursor: pointer;
	align-items: center;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
}

.combat_outputMessage {
	cursor: pointer;
}

.pinnedSection h2 {
	color: #FF8000;
}

.pinnedSection {
	border-bottom: 1px solid #FF8000;
	margin: 0px 0px 20px 0px;
}

.secureID_entry,
.cjs_LIST_entry {
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
	align-items: flex-start;
}

.secureID_name,
.cjs_LIST_name {
	display: flex;
    width: 100%;
    margin: 5px 0px 5px 0px;
    align-items: baseline;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
}

.secureID_display .story_smallNote,
.cjs_LIST_name .story_smallNote {
	margin: 0px 0px 0px 10px;
}

.cjs_narrowLIST_entry {
	display: flex;
    justify-content: space-between;
    padding: 4px 0px;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
	width: 100%;
	/* font-size: 12px; */
}

.cjs_narrowLIST_controller {
    flex: none;
    padding: 0px 0px 0px 14px;
	display: flex;
    flex-direction: row;
    align-items: center;
}

.cjs_narrowLIST_buttons {
	display: flex;
	align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
	/* padding: 0px 0px 0px 10px; */
}

.cjs_narrowLIST_button,
.cjs_narrowLIST_burger,
.cjs_narrowLIST_burger_svg {
	padding: 0px;
	cursor: pointer;
	border: 1px solid #ffffff;
	margin: 0px 0px 0px 5px;
}

.cjs_narrowLIST_burger_svg {
	display: inline-block;
    width: 22px;
    height: 22px;
    border: none;
}

.cjs_narrowLIST_burger {
    padding: 0px 5px;
	margin: 0px;
}

.cjs_narrowLIST_break {
	flex-basis: 100%;
	height: 0px;
}

.inventar_ammoWrapper,
.inventory_alchemyContainer {
	display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: flex-end;
    align-items: flex-end;
    flex-basis: 100%;
	margin: 0px;
}

.inventory_alchemyContainer {
	flex-basis: unset;
}

.inventory_magazineRounds,
.inventory_applicationsWrapper_details {
	cursor: default;
}

#inventory_noteWrapper {
	margin: 0px 0px 20px 0px;
}

.cjs_underlined_input_fixed,
.cjs_underlined_input_fixed:focus,
.cjs_underlined_input_fixed:active {

	outline: 0px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	cursor: pointer;
	border-bottom: 1px solid #fff;
}

.cjs_underlined_input_fixed.narrow_input {
	width: 100px;
}

.cjs_underlined_input_fixed.center_input {
	text-align: center;
}

.cjs_narrowLIST_input,
.cjs_narrowLIST_input:focus,
.cjs_narrowLIST_input:active,

.cjs_underlined_input,
.cjs_underlined_input:focus,
.cjs_underlined_input:active,

.inventory_magazineRounds_current,
.inventory_magazineRounds_current:focus,
.inventory_magazineRounds_current:active,

.inventory_applicationsWrapper_input,
.inventory_applicationsWrapper_input:focus,
.inventory_applicationsWrapper_input:active {
	outline: 0px;
	border: 0px;
	width: 32px;
	text-align: right;
	padding: 0px;
	margin: 0px;
	cursor: pointer;
	border-bottom: 1px solid #fff;
}

.cjs_underlined_input,
.cjs_underlined_input:focus,
.cjs_underlined_input:active {
	width: unset;
}

.cjs_underlined_input.greyText,
.cjs_underlined_input.greyText:focus,
.cjs_underlined_input.greyText:active {

	border-bottom: 1px solid #888888;
}

.cjs_small_input,
.cjs_small_input:focus,
.cjs_small_input:active {
	border: 0px;
	outline: 0px;
	width: 30px;
	background: #333333;
	padding: 0px;
	text-align: center;
	cursor: pointer;
	font-size: 12px;
	color: #ffffff;
}


#cjs_textareaOVERLAY,
#glossar_textarea_OVERLAY {
	display: inline-block;
	padding: 6px 0px;
	cursor: pointer;
}

#glossar_textarea_INPUT {
	resize: none;
	flex-grow: 1;
}


#combat_changeRound > * {
	font-size: 14px;
	line-height: normal;
}

#combat_changeRound > span:last-of-type {
	margin: 0px;
}

#cjs_spaContent {
	margin: 10px 0px 0px;
}

.simulation_entryRow {
	display: flex;
	justify-content: flex-start;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-start;
}

.simulation_entryData {
	display: flex;
	width: 100%;
	margin: 5px 0px 5px 0px;
	align-items: baseline;
	justify-content: flex-start;
	flex-direction: column;
	flex-wrap: nowrap;
}

.chapterHeadline {
	display: block;
	text-transform: uppercase;
}

.inventory_magazineWrapper,
.inventory_applicationsWrapper_row {
	margin: 0px;
	padding: 0px;
}


#authenticationForm {
	display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
}

#authenticationNote {
	display: block;
	padding: 10px 20px;
	margin: 0px 0px 20px 0px
}

#authenticationWrapper {
	max-width: 320px;
    margin: 0px;
}

#authenticationConsent {
	display: block;
	margin: 0px 0px 20px;
}

#denyCookies {
	margin: 0px 0px 0px 10px;
}

.authenticationLink {
	font-size: 14px;
	text-decoration: none;
	display: block;
	width: 100%;
	padding: 6px 0;
	margin: 6px 0 0 0;
	text-align: center;
}


.location_displayEntry,
.chapter_displayEntry,
.order_displayEntry {
	text-align: left;
}


.tinyMCE_fullHeight {
    position: fixed;
    top: 0px;
    z-index: 100;
    width: 320px;
    background: #000000
}



.diceStatus {
	display: flex;
	width: 80px;
	height: 80px;
	color: #ffffff;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	font-size: 35px;
	margin: 20px auto 20px;
	outline: 1px solid #fff;

	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select: none;

	cursor: pointer;
}




.diceSuccess {
	background: #FF8000;
}

.diceSuccess #rollState {
	color: #000;
}

.diceFailed {
	background: #cc0000;
}

.diceSuccess #rollState {
	color: #000;
}

.diceNeutral {
	background: grey;
}

#resetButton {
	margin: 20px auto 0px;

	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select: none;

	cursor: pointer;
}

#rollEyes {
	display: block;
	margin: 4px 0px 0px;
	font-size: 12px;
	display: block;
	width: 100%;
	text-align: center;
}

#rollState {
	font-size: 35px;
	text-align: center;
}


#diceEyes {
	display: flex;
	width: 80px;
	margin: 0px auto 20px;
}


#cjs_bottomNote_wrapper {
	position: fixed;
	width: 100%;
	max-width: 320px;
	left: 0px;
	right: 0px;
	margin: auto;
	z-index: 24000;
}

.cjs_buttomNote {
	text-align: center;
	cursor: pointer;
	padding: 7px 10px;
	margin: 5px 0px 5px 0px;
}

.cjs_forceLine {
	white-space: nowrap;
}

.participant_transactionEND {
	border-bottom: 1px solid #fff;
	width: 100%;
	display: flex;
	padding: 4px 0px 6px 0px;
	justify-content: flex-end;
}

.cjs_topicMenu {
	padding: 0px 0px 4px 0px;
}


.cjs_button_small {
	display: flex;
	width: 14px;
	padding: 5px 10px 0px 0px;
	cursor: pointer;
}

.cjs_whiteSVG_wrapper,
.cjs_greySVG_wrapper {
	display: flex;
	width: 14px;
	cursor: pointer;
}

.cjs_greySVG_wrapper svg * {
	fill: #888888 !important;
}

.cjs_button_small svg *,
.cjs_whiteSVG_wrapper svg * {
	fill: #fff !important;
}


.createLIST_buttons {
	display: flex;
}

#participant_creditsWrapper:first-child h2 {
	padding-top: 0px;
}

.story_participant_topicNavigation {
	margin: 0px 0px 10px 0px;
}


#participant_psiWrapper h2 {
    padding: 0px 0px 2px 0px;
}


.cjs_image_fullWidth {
	width: 100%;
	display: block;
	margin: 10px 0px;
}



.participant_combatWrapper {
	margin: 0px 0px 20px 0px;
}


.participant_combatWrapper .cjs_button_smallToggle {
	align-items: baseline !important;
}

.participant_combatWrapper .cjs_button_small {
	width: 10px;
}



.weaponOptions_magazineWrapper {
	display: flex;
	align-items: baseline;
	margin: 10px 0px 10px 0px;
}

.weaponOptions_magazineWrapper label {
	margin: 0px;
}

.weaponOptions_magazineAssign  {
	margin: 0px;
	margin-left: auto;
}


.weaponOptions_magazineRounds,
.weaponOptions_magazineRounds:focus,
.weaponOptions_magazineRounds:active {
	text-align: right;
	background: #080808;
	margin: 0px 10px;
}

.participant_stat[calling="true"] .cjs_narrowList_name {
	color: #FF8000;
}

.cjs_narrowLIST_emptyBurger {
	width: 22px;
	height: 22px;
	margin: 0px 0px 0px 6px;
	display: inline-block;
}


.cjs_centerNote {
	position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: auto;
    z-index: 2300;
    width: 280px;
    height: fit-content;
    padding: 20px;
    text-align: center;
}

#bossfight_solution,
#bossfight_solution_input {
	font-size: 28px;
	text-align: center;
	letter-spacing: 12px;
	text-transform: uppercase;
	padding: 5px 10px;
	border: 1px solid #fff;
	width: calc( 100% - 22px );
}


.cjs_searchInput,
.cjs_searchInput:active,
.cjs_searchInput:focus {
	height: 30px;
    padding: 0px 10px;
    display: block;
}


#cjs_searchContainer {
	position: absolute;
    left: 0px;
    top: 5px;
    background: #000000;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
	cursor: pointer;
}


.damage_weaponDamage {
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
}


.leftAlign {
	text-align: left;
}

.rightAlign {
	text-align: right;
}


.news_wrapper {
	margin: 0px 0px 20px 0px;
}


.glossar_ingredientsWrapper {
	display: flex;
}

.glossar_ingredientsWrapper * input {
	margin: 0px;
}

.glossar_ingredientsWrapper label {
	margin: 0px 10px 0px 0px;
}


.cjs_multiSelect_wrapper {
	display: flex;
	flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: baseline;
}

.flowchart_wrapper {
	width: 100%;
	position: relative;
	overflow: hidden;
}


.cjs_overlayContainer_v2 {
	position: fixed;
	display: flex;
	justify-content: center;
	align-items: center;
	left: 0px; top: 0px; right: 0px; bottom: 0px;
	z-index: 2300;
}

.cjs_overlayContainer_v2_content,
.cjs_overlayContainer_v2_fullContent,
.cjs_overlayContainer_v2_centerContent,
.cjs_overlayContainer_v2_fit_content {
	width: 100%;
	max-width: 320px;
	position: absolute;
	left: 0px;
	right: 0px;
	margin: auto;
	overflow-y: scroll;
	height: 100%;
	background: #000;
}

.cjs_overlayContainer_v2_fit_content {
	height: auto;
	padding: 8px;
	width: 304px;
}

.cjs_overlayContainer_v2_centerContent {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	height: fit-content;
	top: 0px;
	bottom: 0px;
	height: calc(100% - 40px);
	/* max-height: 555px; */
}

#cjs_overlayContent_v2 {
	overflow: scroll;
}

.cjs_overlayContainer_v2_fullContent {
	max-width: unset;
	overflow: hidden;
}

.cjs_overlayContainer_v2_fullContent.center {
	display: flex;
	align-content: center;
	justify-content: center;
	flex-wrap: wrap;
	flex-direction: column;
	position: fixed;
}

.flowchart_node {
	display: flex;
	flex-direction: column;
    flex-wrap: wrap;
	align-content: stretch;

	position: absolute;
	width: 330px;
	z-index: 10;
	background: #000;
	outline: 2px solid;

	cursor: default;
}

.flowchart_node_buttons {
	display: flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
}

.flowchart_node_buttons .outlinedLink {
	margin: 10px 0px 0px;
}

.flowchart_node_mover {
	width: 100%;
	margin-top: 10px;
	padding: 4px 0px;
}

/* .flowchart_node_grabbed {
	cursor: grabbing;
} */

.flowchart_node_container {
	padding: 0px 5px 0px;
}

.flowchart_node_connection {
	display: flex;
	position: absolute;
	height: 1px;
	transform-origin: top left;
	background: #fff;
}

.flowchart_node_title {
	padding: 0px 0px 4px 0px;
	margin: 0px 0px 4px 0px;
	width: 100%;
	border-bottom: 1px solid #fff;
}

#flowchart_position {
	position: absolute;
    right: 0px;
    top: 0px;
	z-index: 2000;

	font-size: 10px;
	display: flex;
    justify-content: flex-end;
	padding: 2px 4px 2px 4px;

	background: #000;
}

.flowchart_node_details {
	display: flex;
	margin: 2px 0px 0px 0px;
	font-size: 10px;
	color: #888888;
}
.flowchart_node_position {
	margin-right: auto;
}

.flowchart_node_size {
	margin-left: auto;
}


.cjs_grabbing {
	cursor: -webkit-grabbing;
	cursor: -moz-grabbing;
	cursor: grabbing;
}

.cjs_grab {
	cursor: -webkit-grab;
	cursor: -moz-grab;
	cursor: grab;
}

.flowchart_node_selected {
	z-index: 800;
}

.flowchart_node_options {
	border-top: 6px solid #fff;
	padding: 4px 4px 4px;

	position: absolute;
    top: -120px;
    width: calc( 100% - 8px);
    background: #000;
}

.cjs_forceBreak {
	overflow-wrap: break-word;
	word-break: break-all;
}

.cjs_noBreak {
	white-space: nowrap;
}


.setStar_container {

	cursor: pointer;
}

.setStar_selector {
	padding: 0px 2px;
}


.presentWrap {
	position: absolute;
	left: 0px;
	top: 0px;
	cursor: pointer;
}


.menu_searchContainer {
	position: absolute;
	z-index: 400;
	margin-top: 5px;
	width: 100%;
	display: flex;
	flex-direction: row;
	background: #000000;
}

#menu_searchInput {
	height: 31px;
	padding: 0px 10px;
	background: #eeeeee;
	color: #000000;
	border: none;
	flex: 1;
}

#menu_searchInput_close {
	height: 31px;
	width: 31px;
	margin-left: 8px;
	background: #000000;
	cursor: pointer;
}

#menu_searchInput_execute {
	height: 31px;
	width: 31px;
	margin-left: 8px;
	background: #000000;
	cursor: pointer;
}

#menu_searchInput_overlay {
	position: fixed;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;

	background: #000000;
	opacity: 0.6;
}

/* #menu_searchInput_output {
	position: relative;
	z-index: 400;
} */


.stories_presented_container {
	padding: 0px 0px 0px 20px;
}

.cjs_dropDown_container {
	position: relative;
}

.cjs_dropDown_output {
	position: absolute;
    background: #000;
	width: 100%;
    /* max-height: 300px; */
    /* overflow-y: scroll; */
    /* overflow-x: hidden; */
}

.cjs_dropDown_padding {
	padding-bottom: 50px;
}

#story_currentDate {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	flex-wrap: wrap;
}

#story_reminder_container {
	width: 100%;
}


.roleContainer_header {
	display: flex;
	width: 100%;
	flex-direction: row;
	justify-content: center;
	align-items: flex-end;
	flex-wrap: wrap;
	margin-bottom: 4px;
	cursor: pointer;
}


.system_object,
.system_object .point {
	position: absolute;
}


.itemDATA_statsWrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 10px;
}


.fleetShip_container {
	display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
}

.fleetShip_container .outlinedList {
	margin-top: 0px;
	font-size: 10px;
}

.fleetShips_container_buttons {
	display: flex;
}

.fleetShips_container_buttons .cjs_narrowLIST_burger_svg {
	margin-right: 10px;
}


.componente_repair {
	padding: 6px 0px 8px;
}


.system_inputs .cjs_customInput {
	width: 180px;
}

.components_toggleButton  {
	margin: 10px 0px !important
}


.cjs_multiSelect_remove {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
}


#cjs_imageViewer_buttons {
	height: 30px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-evenly;
	position: fixed;
    right: 0px;
    bottom: 0px;
}

#cjs_imageViewer_buttons svg * {
	fill: #fff !important;
}

#cjs_imageViewer_buttons .cjs_svgButton {
	background: #000;
	margin: 0px 4px;
	width: 30px;
	height: 30px;
}

.properties_wrapper {
	width: 100%;
	margin-bottom: 40px;
}

.property_container,
.property_skill_entry {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: baseline;
	justify-content: flex-start;
}

/* Das letze Eleement im Container */
.property_container .cjs_customInput_wrapper:last-of-type,
.cjs_search_fullWidth .cjs_customInput_wrapper {
	margin-bottom: 0px;
}

/* Das erste und letzte Element im Container */
.property_container .cjs_customInput_wrapper:first-of-type:last-of-type {
	margin-bottom: 4px;
}

.property_skill_entry {
	flex-direction: row;
}

.property_skill_entry .cjs_narrowLIST_input {
	margin-left: 10px;
	padding-bottom: 5px;
}

.property_container[type="category"] {
	flex-direction: row-reverse;
}

.property_container[type="entry"] {
	margin-bottom: 20px;
}

.property_container_bottom {
	display: block;
	width: 100%;
	border-color: #333;
	background-color: #333;
	color: #333;

}

.cjs_search_fullWidth {
	width: 100%;
	margin-bottom: 5px;
}

/* #degub_centerPoint {
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 2px;
	background: #cc0000;
	position: fixed;
	left: 0px; right: 0px;
	top: 0px; bottom: 0px;
	margin: auto;
	z-index: 230000;
} */

.glossar_property_label {
	display: block;
	width: 100%;
	text-align: right;
	margin: 0px 0px 10px 0px;
}

.glossar_alchemy_ingredientsWrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 100%;
}

.glossar_alchemy_ingredientsWrapper .cjs_customInput_wrapper {
	margin-right: 8px;
}

#map_setFocus {

	width: 100%;
	background: #000;
	color: #FF8800;
	max-width: 320px;

	bottom: 10px;
	z-index: 200;
	padding: 10px 0px;
	text-align: center;
}

#counter {
	color: inherit;
	font-size: inherit;
}

#counter_wrapper {
	font-size: 12px;
}

#glossar_properties {
	margin: 14px 0px 20px;
}

#glossar_properties h2 {
	padding: 0px 0px 2px 0px;
}

.cjs_processButton_v3_buttons {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
}

.cjs_processButton_v3 {
	margin: 5px 0px;
}

.cjs_processButton_v3_confirm {
	width: 100%;
}

.cjs_removeMargin {
	margin: 5px 0px;
}

.cjs_removeMargin .outlinedElement,
.cjs_removeMargin .outlinedLink {
	margin: 0px 8px 0px 0px;
}

.cjs_processButton_v3_question,
.cjs_processButton_v3_buttons .outlinedElement {
	margin: 0px;
}

.cjs_processButton_v3_buttons .cjs_processButton_v3_cancel {
	margin: 0px 6px 0px 0px;
}

.paddingLeft_10 {
	padding-left: 10px;
}

fieldset {
	padding: 0px 10px 4px;
	border: 1px solid #fff;
}

legend {
	padding: 0px 10px;
}

.outlinedElement.editableElement_flex {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: baseline;
	margin: 10px 0px;
	width: calc( 100% - 22px );
}

.editableElement_link {
	padding-left: 10px;
}

.outlinedElement.editableElement_flex a.cjs_noUnderline {
	width: 100%;
}

.cjs_overlayButtons {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: baseline;
}

.cjs_overlayButtons .outlinedSVG {
	margin-left: 10px;
}

.flex_h2, .flex_h1 {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: baseline;
}

.flex_h1 {
	padding: 4px 0px 0px 0px;
}


#items__image_select {
	width: calc( 100% - 22px );
}

#items__image {
	width: 100%;
	height: 100%;
	max-width: 320px;
	display: block;
}

.cjs_narrowLIST_indent {
	margin-left: 10px;
}


.inventories__object_quantity {
	margin: 0px 5px 0px 0px;
}

.inventories__object_count  {
	padding: 0px 6px;
	border: 1px solid #fff;
	color: #fff;
}

.inventories__ammunition_details {
	display: flex;
	margin-left: 10px;
	padding: 0px;
	flex-direction: row;
	justify-content: flex-start;
}

.inventories__ammunition_category {
	display: flex;
}

#inventories__ammunition_settings .inventories__category_container {
	padding: 0px 0px 2px 0px;
}


.fieldset_legend {
	display: flex;
	flex-direction: row;
	align-items: baseline;
	flex-wrap: nowrap;
	justify-content: flex-start;
	cursor: pointer;
}


.cjs_narrowLIST_currencies_types {
	display: block;
	width: 100%;
	padding-left: 10px;
}


.inventories_currencies_input.cjs_narrowLIST_input {
	width: 60px;
}

.note_paragraph {
	margin-top: 8px;
	margin-bottom: 8px;
	display: block;
}

.karma23_content {
	position: relative;
}

/* .karma23_content_edit {
	position: absolute;
	left: -14px;
	padding: 2px 0px 2px;
	color: #FF8800;
} */

.fieldset_container.fullWidth {
	width: calc( 100% - 24px );
}

#karma23_preview_canvas {
	width: 320px;
	height: 320px;
	background: #ccc;
}

.story__image_element {
	display: block;
	max-width: 320px;
	max-height: 320px;
	width: auto;
	height: auto;
}

.simon__container {
	width: 320px;
	height: 320px;
	position: relative;
}

.simon__square {
	background: #888888;
	width: 150px;
	height: 150px;
	position: absolute;
	cursor: pointer;
}

#simon__square_one { translate: 0px 0px; }
#simon__square_two { translate: 170px 0px; }
#simon__square_three { translate: 0px 170px; }
#simon__square_four { translate: 170px 170px; }

.simon__active_square {
	background: #FF8800
}

.simon__selected_square {
	background: #fff
}

#glossar__melee_proficiency.cjs_narrowLIST_entry,
#glossar__range_proficiency.cjs_narrowLIST_entry {
	display: block;
	padding-bottom: 8px;
}


.stories__container {
	margin-bottom: 30px;
}

.stories__container_link {
	display: flex;
	text-decoration: none;
	flex-direction: row;
	flex-wrap: nowrap;
	margin-bottom: 30px;
	position: relative;
}

.stories__image_element {
	width: 160px;
	height: 160px;
	margin-right: 20px;
}

.stories__details,
.lobby__story_details {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	height: 160px;
	justify-content: space-between;
}

.lobby__story_details {
	justify-content: flex-start;
}

.stories__name {
	font-size: 18px;
}

.stories__author {
	padding: 0px;
}

.stories__description {

	/* margin-top: 8px; */

	overflow: hidden;
	/* display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical; */
}

.line-clamp {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
  }

@media screen and ( orientation: landscape ) {

	#tinyMCE_editorButtons {
		display: flex;
		flex-direction: column;
		position: absolute;
		right: 0px;
		top: 0px;
	}
}

.combat__wrapper {
	margin-bottom: 10px;
}

.combat__protection,
.combat__damage {
	width: 60px;
	text-align: left;
}

.combat__numbers {
	display: flex;
	max-width: 320px;
	width: 100%;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	margin-top: 8px;
}

.combat__number {
	display: flex;
	width: 23px;
	height: 23px;
	border: 1px solid #fff;
	align-items: center;
	justify-content: center;
	margin: 3px;
	cursor: pointer;
}

.combat__legend {
	display: block;
	margin-bottom: 4px;
}

.combat__inputs {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
}

.combat__selected {
	color: #FF8000;
	border: 1px solid #FF8000;
}

.language__translation_word * {
	font-size: 13px;
}

.language__expand_translation {
	width: 30px;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
}

.language__wrapper_translation {
	display: flex;
	flex-direction: row;
	align-items: flex-end;
}

.languages__container_letters {
	margin: 10px 0px;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
}

#editor__select_file,
#editor__source_input,
#editor__alt_input {
	width: calc( 100% - 22px );
}

#editor__inputs_size,
#editor__inputs_margin {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	margin-top: 20px;
}

.editor__imageWrapper,
.editor__imageWrapper_viewer,
.manager__imageWrapper,
.manager__imageWrapper_viewer {
	display: flex;
	width: 150px;
	flex-direction: row;
	justify-content: center;
	align-content: center;
	flex-wrap: wrap;
}

.editor__imagePreview img,
.manager__imagePreview img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}

.editor__imageWrapper_viewer {
	width: 320px;
}

.manager__imageWrapper_viewer,
.manager__imageWrapper {
	width: 100px;
}

.editor__imagePreview,
.manager__imagePreview {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	height: 320px;
}

.editor__imagePreview {
	margin: 20px 0px;
}

.manager__imagePreview {
	height: 100px;
	width: 100px;
	background: #ccc;
}

.manager_image_container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	margin-bottom: 10px;
}

.manager__image_data {
	margin-left: 10px;
	flex: 1;
}

p.inline_flex {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
}


.stories__listview {
	position: relative;
}

.stories_loader {
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	color: #ffffff;
	padding: 10px;
	background: #000000;
	z-index: 1000;
}

.stories__display_version {
	font-size: 8px; /* Kleinere Schriftgröße für Hochzahlen */
	vertical-align: super; /* Hochstellen */
	color: inherit;
	font-weight: bold;
}

#editor__inputs_floats {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: baseline;
	flex-wrap: wrap;
}

#editor__inputs_floats > .outlinedElement {
	margin: 0px;
	padding: 5px 30px;
}

#editor__top_input,
#editor__bottom_input,
#editor__left_input,
#editor__right_input {
	width: 50px;
}

.cjs_flex_between {
	display: flex;
	justify-content: space-between;
}