/*---  Hauptstruktur  ---*/
body {
	background-color:#242529;
	color:#aeb1b7;
	color:#c0c0c1;
}
body a {
	color:#c0c0c1;
}

body#lost:before {
	border-bottom:0px;
}
h1 {
	color:#fff;
}

footer {
	background-color:#242529;
	border-top: 1px solid #3e3f42;
}


/*---  Header mit Logo  ---*/
header #logo {
	background-color:#242529;
}
header #boxName {
	background-image: url(assetsBlack/box.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
header #boxName:hover,
header #boxName:focus,
header #boxName:active {
	background-image: url(assetsBlack/boxactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
header #boxName.error,
header #boxName.error:hover,
header #boxName.error:focus,
header #boxName.error:active {
	background-image: url(assetsBlack/boxactive.svg), linear-gradient(to bottom, #ff003c 0%,#ff003c 100%);
	border-color: #ff003c;
	color:#fff;
}

header ul#menu > li:active a,
header ul#menu > li:hover a,
header ul#menu > li:focus a,
header ul#menu > li.selected a{
	color:#fff;
}
header ul#menu > li  > ul > li > a{
	color:#c0c0c1;
}
header ul#menu > li > ul > li:active a,
header ul#menu > li > ul > li:hover a,
header ul#menu > li > ul > li:focus a,
header ul#menu > li > ul > li.selected a{
	color:#c0c0c1;
}


/*---  LoadingScreen ---*/
#loadingScreen .sk-folding-cube .sk-cube {
	border-color:#3e3f42;
}

/*---  .twoColumnContainer    ---*/
.twoColumnContainer #listEditContainer {
	border-top:1px solid #3e3f42;
}


.twoColumnContainer .addToListButton {
	background-image: url(assetsBlack/pfeilLinks.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

.twoColumnContainer .addToListButton:focus,
.twoColumnContainer .addToListButton:hover {
	background-image: url(assetsBlack/pfeilLinksactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
	cursor:pointer;
}
.twoColumnContainer .addToListButton.close {
	background-image: url(assetsBlack/pfeilRechts.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.twoColumnContainer .addToListButton.close:focus,
.twoColumnContainer .addToListButton.close:hover {
	background-image: url(assetsBlack/pfeilRechtsactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

.twoColumnContainer #listButtons ul {
	background:#2b2e31;
	box-shadow: inset 0px 2px 2px 0px rgba(0, 0, 0, 0.5),inset 0px 2px 2px 0px rgba(255, 255, 255, 0.1);
} 
 
#listButtons {
    background: rgba(36, 37, 41, 0.5);
} 
.twoColumnContainer #listButtons ul li button  {
	padding: 9px 9px;
	width:100%;
	background: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
	border-bottom: 1px solid #4e4e4e;
	border-left: 1px solid #3e3f42;
	border-right: 1px solid #3e3f42;
	border-top:0;
	cursor:Pointer;
	height:auto;
	margin:0;
	box-shadow:none;
}

.twoColumnContainer #listButtons ul li button:hover ,
.twoColumnContainer #listButtons ul li button:focus   {
	background-color: #3d4046;
	color: #fff;
	border-bottom: 1px solid #626469;
}

.twoColumnContainer #listButtons ul li button:focus {
	border:transparent;
}
.twoColumnContainer #listButtons ul li button.disabled {
	background:red;
}
.twoColumnContainer #listButtons ul li button:disabled {
	
}


.twoColumnContainer #listButtons ul li button.disabled:hover,
.twoColumnContainer #listButtons ul li button.disabled:focus,
.twoColumnContainer #listButtons ul li button:disabled:hover,
.twoColumnContainer #listButtons ul li button:disabled:focus,
.twoColumnContainer #listButtons #editButtonList:disabled:hover,
twoColumnContainer #listButtons #editButtonList button:disabled:focus {
	/* 
	color: #bdbdbd;
	border-bottom: 1px solid #4e4e4e;
	cursor:auto;
 */
	pointer:none;
	pointer-events:none;
}

#listButtons #deleteDetail:disabled:hover { 
	color: #bdbdbd;
	cursor:auto;
}




/*---  Kanal Detail  -  KanalLogo---*/

.twoColumnContainer .kanalLogo .drop {
	background:#303438;
	background-size:80%;
	background-position: center;
	background-repeat: no-repeat;
}
.twoColumnContainer .kanalLogo .drop.bild {
	background-image: url(assetsBlack/upload.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
	background-size:contain;
	box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.5), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.1);
    border-color: #2b2f35;
}
.twoColumnContainer .kanalLogo .drop.bild:focus,
.twoColumnContainer .kanalLogo .drop.bild:hover {
	background-image: url(assetsBlack/uploadactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
	cursor:pointer;
}
.twoColumnContainer .kanalLogo .dropText {
	background:#303438;
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#exportScreen label.uploadImportFileLabel,

.kanalLogo label.iconUploadLabel,
label.uploadImportFileLabel {
	color: #aeb1b7;
	box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.5), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.1);
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.kanalLogo label.iconUploadLabel:hover,
label.uploadImportFileLabel:hover {
	color: #fff;
}
.kanalLogo label.iconUploadLabel.disabled:hover {
	color: #aeb1b7;
	cursor: default;
}


/*---  Importscreen  ---*/
button.importButton {
	background-image: url(assetsBlack/import.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
button.importButton:focus,
button.importButton:hover {
	background-image: url(assetsBlack/importactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}


/*---  welcomeScreen  ---*/
#welcomeScreen {
	border-top: 1px solid #3e3f42;
}
.language, .section {
	border-bottom: 1px solid #3e3f42;
}


/*---  welcomeScreen  - eigene Radiobuttons ---*/

/* Create a custom radio button */
.check {
    background-color: #515558;
    border: 1px solid #787676;
}

/* On mouse-over, add a grey background color */
.radioButtonContainer:hover input ~ .check {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radioButtonContainer input:checked ~ .check {
  background-color: #983eba;
  border: 1px solid #983eba;
}

/* Style the indicator (dot/circle) */
.radioButtonContainer .check:after {
	background: white;
}


/*---  Main Screen  ---*/


/*---  linke Liste mit LayoutAuswahl, MonitorVorschau, streamControls und FavoritenSender  ---*/

#layouts rect {
	fill: rgb(53,57,61);
}

#layouts g.selected rect.slotbg {
	fill: rgb(124,62,138);
}

/*---  gesammelte Buttons und Eingabefelder   ---*/

select,
/* input, */
button,
.button {
	color:#aeb1b7;
	box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.5),inset 0px 0px 0px 1px rgba(255, 255, 255, 0.1);
	border-color: #2b2f35;
/* 	border-color:#8a8a8a; */
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

select {
	background-image: url(assetsBlack/pfeilDown.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
  background-position: center right;
}
select:hover,
select:focus {
	background-image: url(assetsBlack/pfeilDownactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

input, textarea {
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
  box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.28), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.55);
  color:#aeb1b7;
}


.active,
.button:hover, .button:focus, .button:active,
select:hover, select:focus, select:active,
button:hover, button:focus, button:active,
textarea:hover, textarea:focus, textarea:active,
input:hover, input:focus, input:active {
	color:#fff;
}


select:focus option {
	background: #2b2e31;
	color:#aeb1b7;
}
select:focus option:hover {
	background: #3d4046;
	color:#fff;
  border-bottom: 1px solid #626469;
}
select:focus option:active {
	background: #3d4046;
	color:#fff;
}
 select option{
 color:#aeb1b7;
    }

 select [disabled]{
    color:#c0c0c1;
    }
button.copied {
	background:green;
	color:#fff;
}
button.copied:hover, button.copied:focus {
	background:green;
}

/*---  topButtons  ---*/
.topButtons button.editButton {
	background-image: url(assetsBlack/edit.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.editButton:focus,
.topButtons button.editButton:hover {
	background-image: url(assetsBlack/editactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.burgerButton {
	background-image: url(assetsBlack/burger.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.burgerButton:focus,
.topButtons button.burgerButton:hover {
	background-image: url(assetsBlack/burgeractive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.lockButton {
	background-image: url(assetsBlack/lock.svg);background-color: transparent;box-shadow: none;z-index:-1;
}


.topButtons button.plusButton {
	background-image: url(assetsBlack/plus.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.plusButton:focus,
.topButtons button.plusButton:hover {
	background-image: url(assetsBlack/plusactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

.topButtons button.saveButton {
	background-image: url(assetsBlack/save.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.saveButton:focus,
.topButtons button.saveButton:hover {
	background-image: url(assetsBlack/saveactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.saveButton.apply {
	background-image: url(assetsBlack/saveactive.svg), linear-gradient(to bottom, #983eba 0%,#792d96 100%);
}
.topButtons button.saveButton.apply:focus,
.topButtons button.saveButton.apply:hover {
	background-image: url(assetsBlack/saveactive.svg), linear-gradient(to bottom, #983eba 0%,#8a34ab 100%);
}

.topButtons button.cancelButton,
button.cancelButton {
	background-image: url(assetsBlack/cancel.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.topButtons button.cancelButton:focus,
.topButtons button.cancelButton:hover,
button.cancelButton:focus,
button.cancelButton:hover {
	background-image: url(assetsBlack/cancelactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

.listEditMode  {
	background-image: linear-gradient(180deg, #242529 0%, #242529 36px,#2c2f34 36px, #2c2f34 100%);
}


/*---  Suche input checkagin  ---*/
input.searchList  {
	background-image: url(assetsBlack/search.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
  box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.28), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.55);
}
input.searchList:focus ,
input.searchList:hover  {
	background-image: url(assetsBlack/searchactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

/*---  Merken & Holen   ---*//* checkagain */
#layoutFavorites button {
	background-image: url(assetsBlack/pfeilDown.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#layoutFavorites button#defaultFavoriteButton,
#layoutFavorites button:hover:last-child {
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#layoutFavorites button:hover,
#layoutFavorites button:focus {
	background-image: url(assetsBlack/pfeilDownactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#layoutFavorites .layoutFavListe {
	background:#2b2e31;
	border-top: 1px solid #3e3f42;
	border-bottom: 1px solid #3e3f42;
	border-left: 1px solid #242529;
	border-right: 1px solid #242529;
	box-shadow: inset 0px 2px 2px 0px rgba(0, 0, 0, 0.5),inset 0px 2px 2px 0px rgba(255, 255, 255, 0.1);	
}
#layoutFavorites .layoutFavListe > li  {
	border-bottom: 1px solid #3e3f42;
}
#layoutFavorites .layoutFavListe > li:hover,
#layoutFavorites .layoutFavListe > li.ui-draggable-dragging,
#layoutFavorites .layoutFavListe > li:focus {
	background-color: #3d4046;
	color: #fff;
	border-bottom: 1px solid #626469;
}
#layoutFavorites .layoutFavListe > li.ui-draggable-dragging,
#layoutFavorites .layoutFavListe > li:focus {
	border:transparent;
}
/*---  Audio & Volbild und Zaubersteuerung   ---*/


/*---  Lautstärkeregelung   ---*/
#streamControls #soundOnOff {
	background-image: url(assetsBlack/sound.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#streamControls #soundOnOff:hover,
#streamControls #soundOnOff:focus {
	background-image: url(assetsBlack/soundactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

/*---  Stumm schalten   ---*/
#streamControls .soundContainer.mute #soundOnOff {
	background-image: url(assetsBlack/mute.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#streamControls .soundContainer.mute #soundOnOff:hover,
#streamControls .soundContainer.mute #soundOnOff.active {
	background-image: url(assetsBlack/muteactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

/* 
#streamControls span.sound.mute,
#streamControls span.sound.mute:hover,
#streamControls span.sound.mute:focus {
	background-image: url(assetsBlack/muteactive.svg), linear-gradient(to bottom, #ff003c 0%,#ff003c 100%);
	border-color: #ff003c;
}
 */
#streamControls .soundContainer.mute input {
	opacity:0.5;
}


/*---  Fullscreen   ---*/
#streamControls #fullscreenButton {
	background-image: url(assetsBlack/fullscreen.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#streamControls #fullscreenButton:hover,
#streamControls #fullscreenButton:focus,
#streamControls #fullscreenButton:active {
	background-image: url(assetsBlack/fullscreenactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#streamControls #fullscreenButton.nofullscreen {
	background-image: url(assetsBlack/notfullscreen.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#streamControls #fullscreenButton.nofullscreen:hover,
#streamControls #fullscreenButton.nofullscreen:focus,
#streamControls #fullscreenButton.nofullscreen.active {
	background-image: url(assetsBlack/notfullscreenactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

/*---  Zauberstab   ---*/
#streamControls #magicButton {
	background-image: url(assetsBlack/magic.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#streamControls #magicButton:hover,
#streamControls #magicButton:focus {
	background-image: url(assetsBlack/magicactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#streamControls #magicButton.active,
#streamControls #magicButton.active:hover,
#streamControls #magicButton.active:focus {
	background-image: url(assetsBlack/magicactive.svg), linear-gradient(to bottom, #ff003c 0%,#ff003c 100%);
	border-color: #ff003c;
}


/*---  setIP    ---*/
.setIp input {
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
	box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.28), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.55);
}
.setIp button {
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

/*---  favoritesGrid Sender in Kästchen    ---*/


#favoritesGrid  li {
	background-color: #333437;
}

#favoritesGrid li:hover {
	background:#3d4046;
}

#favoritesGrid li:after {
  background: linear-gradient(45deg, rgba(255, 255, 255, 0.3) 0%,rgba(255, 255, 255,0.15) 51%,rgba(255, 255, 255,0) 100%);
  background: linear-gradient(45deg, rgba(216, 216, 216, 0.2) 0%,rgba(148, 148, 148, 0.15) 51%,rgba(199, 199, 199, 0) 100%);
}
#favoritesGrid li:active:after {
	background: linear-gradient(45deg, rgba(202, 70, 255, 0.3) 0%,rgba(202, 70, 255,0.15) 51%,rgba(202, 70, 255,0) 100%);
	background: linear-gradient(45deg, rgba(255, 255, 255, 0.3) 0%,rgba(255, 255, 255,0.15) 51%,rgba(255, 255, 255,0) 100%);
}





/*---  links Detail   ---*/

.column.left.editMode #detailOptions {
  background-image: linear-gradient(to bottom, #2c2f34 0%,#2c2f34 100%);
}




/*---  rechte Liste mit kanälen im VIEW Mode  ---*/
ul.contentList,
ul.contentList2 {
	border-top: 1px solid #3e3f42;
}
ul.contentList2#familyUserList {
	border-top: 0;
}
ul.contentList > li,
ul.contentList2 > li {
	border-bottom: 1px solid #3e3f42;
}
ul.contentList2#familyUserList > li:last-child {
	border-bottom: 0;
}

ul.contentList > li.browser,
.editMode ul.contentList > li.active.locked.browser { background-image: url(assetsBlack/iconBrowser.png)}
ul.contentList > li.player,
.editMode ul.contentList > li.active.locked.player { background-image: url(assetsBlack/iconPlayer.png)}
ul.contentList > li.playlist,
.editMode ul.contentList > li.active.locked.playlist { background-image: url(assetsBlack/iconListe.png)}
ul.contentList > li.gadget,
.editMode ul.contentList > li.active.locked.gadget { background-image: url(assetsBlack/iconGadget.png)}
ul.contentList > li.locked span:first-child:before,
.editMode ul.contentList > li.locked.active span:first-child:before { background-image: url(assetsBlack/lock.svg)}



ul.contentList > li.separator,
ul.contentList > li.separator.active { 
	border-top: 3px solid #3e3f42;
  	padding-top: 4px;
  }

ul.contentList > li.browser:hover,
ul.contentList > li.browser.active { background-image: url(assetsBlack/iconBrowseractive.png)}
ul.contentList > li.player:hover,
ul.contentList > li.player.active { background-image: url(assetsBlack/iconPlayeractive.png)}
ul.contentList > li.playlist:hover,
ul.contentList > li.playlist.active { background-image: url(assetsBlack/iconListeactive.png)}
ul.contentList > li.gadget:hover,
ul.contentList > li.gadget.active { background-image: url(assetsBlack/iconGadgetactive.png)}


ul.contentList > li.browser.locked:hover,
ul.contentList > li.browser.locked.active { background-image: url(assetsBlack/iconBrowseractive.png), background-image: url(assetsBlack/lockactive.png)}
ul.contentList > li.player.locked:hover,
ul.contentList > li.player.locked.active { background-image: url(assetsBlack/iconPlayeractive.png), background-image: url(assetsBlack/lockactive.png)}
ul.contentList > li.playlist.locked:hover,
ul.contentList > li.playlist.locked.active { background-image: url(assetsBlack/iconListeactive.png), background-image: url(assetsBlack/lockactive.png)}
ul.contentList > li.gadget.locked:hover,
ul.contentList > li.gadget.locked.active { background-image: url(assetsBlack/iconGadgetactive.png), background-image: url(assetsBlack/lockactive.png)}
ul.contentList > li.locked:hover span:first-child:before,
ul.contentList > li.locked.active span:first-child:before,
.editMode ul.contentList > li.locked.active:hover span:first-child:before { background-image: url(assetsBlack/lockactive.svg); }



#listAddOverlay ul.contentList > li {
	border-bottom: 1px solid #5f6269;
}
ul.contentList > li:hover, 
ul.contentList > li.ui-draggable-dragging,
ul.contentList > li:focus {
	background-color: #3d4046;
	color: #fff;
	border-bottom: 1px solid #626469;
}

ul.contentList > li:focus {
	border:0;
}
ul.contentList > li[marked],
ul.contentList > li.selected {
	background-color: #7b3e89; /* panoolila */
	background-color: #626469;/* hellgrau */
	color:#fff;
}
ul.contentList .bold {
	color: #7b7b7b;
}
ul.contentList > li.active {
	background-color: #983eba;
	color: #fff;
}
.editMode ul.contentList > li.active {
	background-color: transparent;
	color:#c0c0c1;
}
.editMode ul.contentList > li.active.locked {
	background-color: transparent;
	color:grey;
}
.editMode ul.contentList > li.active.locked:hover {
	color:#fff;
	background-color:#3d4046;
}




/*---  Liste der weiteren Kanäle  ---*/
#listAddOverlay {
	background-color: #3c3f44;
}
#listAddOverlay ul.contentList {
  border-top:1px solid #4e525a;
}
#listAddOverlay ul.contentList > li {
  border-bottom:1px solid #4e525a;
}
#listAddOverlay ul.contentList > li:hover, 
#listAddOverlay ul.contentList > li.ui-draggable-dragging,
#listAddOverlay ul.contentList > li:focus {
	background-color: #4e5156;
	color: #fff;
	border-bottom: 1px solid #626469;
}



/*---  rechte Liste mit kanälen im EDIT Mode  ---*/
/* */
.column.right.editMode ul > li:before {
	background-image:url(assetsBlack/iconDrag.svg);
}

.column.right.editMode ul > li:hover:before,
.column.right.editMode ul > li.ui-draggable-dragging:hover {
	background-image:url(assetsBlack/iconDragactive.svg);
}

.column.right.editMode ul > li:after {
	background-image:url(assetsBlack/delete.svg);
}
.column.right.editMode ul > li:hover:after {
	background-image:url(assetsBlack/deleteactive.svg);
}


#familyUserList .delete  {
	background-image:url(assetsBlack/delete.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#familyUserList .delete:hover {
	background-image:url(assetsBlack/deleteactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
	background-color:yellow;
}
#familyUserList .delete:active {
	background-image:url(assetsBlack/deleteactive.svg), linear-gradient(to bottom, #983dba 0%,#983dba 100%);
}

#foundUsers button:active,
#foundUsers button:focus {
	background-image:url(assetsBlack/safeactive.svg), linear-gradient(to bottom, #983dba 0%,#983dba 100%);
	background-image:linear-gradient(to bottom, #983dba 0%,#983dba 100%);
}



/*---  SenderListeEinklappen   ---*/
#listeEinklappenButton {
	background-image: url(assetsBlack/pfeilLinks.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
#listeEinklappenButton:hover,
#listeEinklappenButton:focus,
#listeEinklappenButton.active {
	background-image: url(assetsBlack/pfeilLinksactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}


/* #InfoScreen */

.infoScreenPlayerPathSelect {
	background-image: url(assetsBlack/playerUnchecked.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.infoScreenPlayerPathSelect:hover,
.infoScreenPlayerPathSelect:focus {
	background-image: url(assetsBlack/playerUncheckedactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

.infoScreenPlayerPathSelect.checked {
	background-image: url(assetsBlack/playerChecked.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}
.infoScreenPlayerPathSelect.checked:hover,
.infoScreenPlayerPathSelect.checked:focus {
	background-image: url(assetsBlack/playerCheckedactive.svg), linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
}

/* #statusScreen */ 

.tablesorter-header {
	background-repeat: no-repeat;
}
.tablesorter-header-inner {
	display:inline-block;
	padding-right: 21px;
	background-position:right;
	background-repeat:no-repeat;
}
.tablesorter-headerDesc .tablesorter-header-inner  {
	background-image: url(assetsBlack/pfeilDown2.svg);
}
.tablesorter-headerDesc:hover .tablesorter-header-inner ,
.tablesorter-headerDesc:active .tablesorter-header-inner {
	background-image: url(assetsBlack/pfeilDown2active.svg);
}
.tablesorter-headerAsc .tablesorter-header-inner  {
	background-image: url(assetsBlack/pfeilUp.svg);
}
.tablesorter-headerAsc:hover .tablesorter-header-inner, 
.tablesorter-headerAsc .tablesorter-header-inner {
	background-image: url(assetsBlack/pfeilUpactive.svg);
}
.tablesorter-headerUnSorted .tablesorter-header-inner {
	background-image: url(assetsBlack/pfeilUnsorted.svg);
}
.tablesorter-headerUnSorted:hover .tablesorter-header-inner,
.tablesorter-headerUnSorted .tablesorter-header-inner  {
	background-image: url(assetsBlack/pfeilUnsortedactive.svg);
}
.tablesorter-header.sorter-false  .tablesorter-header-inner{
	background-image:none;
}

/* #boxScreen */


#boxGroup {
	border-top:1px solid #3e3f42;
}

#boxGroup li {
	border-bottom:1px solid #3e3f42;
}
table.detail tr:first-child td {
	border-top:1px solid #3e3f42;
}
table td {
	border-bottom:1px solid #3e3f42;
}
#boxScreenEnterBoxNameContainer input {
	background-image: linear-gradient(to bottom, #33363b 0%,#2b2e31 100%);
  box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.28), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.55);
	
}/* wie die search */

#lost div {
	background-image:url(assetsWhite/hellopanooWeiss.svg);
	background-repeat: no-repeat;
	background-position: center;
}


@media only screen and (max-width: 499px) {
	.right {
		background:#303337;
		box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2),inset 0px 0px 0px 1px rgba(255, 255, 255, 0.05);
		background-image: linear-gradient(to bottom, #2b2e31 0%,#2b2e31 100%);
	}
	.right:after {
		background-image: url(assetsBlack/pfeilrechts.svg);
	}
	.right:hover:after,
	.right:focus:after{
		background-image: url(assetsBlack/pfeilrechtsactive.svg);
	}
}