Beiträge von Firefox_94.0.1

Firefox_94.0.1

Zitat von .DeJaVu

Nochmal rübergeschaut, das sind ja keine Klassen oder ID, das sind Schalter, ähnlich wie in Firefox, die auf true|false stehen, in diesem Fall leer "". Ich denke, das wird auf dieser Basis nichts.
Wenn du was machen willst, dann versuch es ohne, aber du wirst wohl ohne Ketten nicht weiterkommen:
div > .class1 > .class2 > #id3 bzw. div .class1 .class2 #id3 usw., ggf. kombiniert mit/ohne >

Könntest du mir hier anhand der obersten Zeile im Kalender ein Beispiel liefern, wie das mit den Ketten funktionieren kann?

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

noch per individueller User-CSS

du hast das aus Beitrag Nr. 6 zumindest mal getestet?

Ja. Bewirkt aber nichts. Hätte mich aber auch gewundert, warum das jetzt nach 2? Jahren Probleme machen sollte.

Firefox_94.0.1

Zitat von .DeJaVu
Das hat hier jetzt keine Minute gedauert im Inspector.
Code
.cal_title[_ngcontent-qrh-c70]
Und vermutlich dürft es an anderen Stellen ebenso sein. Und genau das folgende habe ich mir gedacht für den Reload:
Code
.cal_title[_ngcontent-whv-c70]
haha, sehr witzig. Freunde dich mal mit Wildcards für CSS an
https://www.geeksforgeeks.org/wildcard-selec…ss-for-classes/
Also ich werd das für diesen Wust an CSS nicht durchexerzieren. Und ob man Wildcards kombinieren kann, kann ich dir auch nicht sagen. Falls doch, wird das echt heftige Schlacht mit reichlich Schachteln.

Wenn ich dich richtig verstehe: Das Problem liegt jetzt darin, dass die jetzt in die Bezeichnungen zwischen "_ngcontent" und "c-NUMMER" drei Buchstaben eingebaut haben, welche sich immer ändern? Wenn ja: Kann man dann überhaupt noch per individueller User-CSS den Style vernünftig anpassen? Wenn nein, muss ich mich wohl oder übel nach einem anderen Kalender umsehen, welchen ich dann als iFrame nutze.

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

Ich habe gerade wieder etwas getestet:

Ohne deine .html Datei und deinen CSS Code zu kennen, wird Hilfe wohl kaum möglich sein.

Zitat von Firefox_94.0.1

mit einem geänderterten Element durchgeführt

Evtl. ein Zeichen im Code vergessen!?

Ich habe einen Testkalender erstellt. Für diesen wird nachfolgende css genutzt:

CSS

@-moz-document url(https://kalender.digital/3ff6becc91f26c438dc1?iframe=true){
/*Text markieren*/
::selection { background: #0001ba; color: #fff800; }
/*Footer entfernen*/
.container[_ngcontent-c41] {
 background-color: #fafafa;
 height: 25px;
 display: none !important;
 align-items: center;
}
/*Kalendernamenzeile*/
.left[_ngcontent-c36] {
 display: flex;
 align-items: center;
 padding-left: 10px;
 background-color: #00016e !important;
}
.center[_ngcontent-vof-c61] {
 flex-grow: 1;
 display: flex;
 align-items: center;
 justify-content: center;
 background-color: #00016e !important;
 color: #ffd700 !important;
}
.right[_ngcontent-c36] {
 display: flex;
 align-items: center;
 padding-right: 10px;
 background-color: #00016e !important;
}

/*Rolle (Bearbeiter)*/
.cal_user_role[_ngcontent-c5] {
 display: flex;
 align-items: center;
 white-space: nowrap;
 color: #9c1818 !important;
}

.fa-link::before {
 content: "\f0c1";
 color: #9c1818 !important;
}
/*Menüschaltflächen rechts (Lupe + 3 Striche)*/
.fa-search:hover::before {
 content: "\f002";
 color: red !important;
}
.fa-search::before {
 content: "\f002";
 color: #ffd700 !important;
}
.cal-ctrl-btn-active[_ngcontent-c5] {
 background-color: #9f2323 !important;
 border-color: #9f2323 !important;
}
.fa-bars:hover::before {
 content: "\f0c9";
 color: red !important;
}
.fa-bars::before {
 content: "\f0c9";
 color: #ffd700 !important;
}
/*Zeile mit Monatsangabe*/
###########################################################
.cal_title[_ngcontent-jkf-c70] {
 flex-grow: 1;
 text-overflow: ellipsis;
 overflow: hidden;
 padding: 10px;
 white-space: nowrap;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 font-size: 20px;
 background-color: #00016e !important;
 color: #ffd700 !important;
 border: 5px solid #00016e !important;
}
.displayFlex[_ngcontent-c34] {
 display: flex;
 color: #ffd700 !important;
 background-color: #00016e !important;
 border: none !important;
}
.fixed_box[_ngcontent-c5] {
 position: absolute;
 display: flex;
 align-items: center;
 width: 100%;
 height: 100%;
 background-color: #00016e !important;
 color: #ffd700 !important;
}
/*alter Code*/
/* .displayFlex[_ngcontent-c32] {
 display: flex;
 color: #ffd700 !important;
 background-color: #00016e !important;
} */
.calDateString[_ngcontent-c34] {
 display: flex;
 color: #ffd700 !important;
 background-color: #00016e !important;
 margin-left: 80px !important;
}

.calDateString[_ngcontent-c32]:hover {
 font-size: 20px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 cursor: pointer;
 color: red !important;
}
.content[_ngcontent-c4] {
 display: flex;
 flex-grow: 1;
 border-top: 0px solid #dadce0 !important;
}
.mobile_time_display[_ngcontent-c34] {
 align-items: center;
 justify-content: center;
 cursor: pointer;
 background-color: #fafafa;
 border-bottom: 0px solid #fff !important;
 padding-top: 5px;
 padding-bottom: 5px;
 display: none;
}
###########################################################
.displayFlex[_ngcontent-c31] {
 display: flex;
 background-color: #00016e !important;
 color: #ffd700 !important;
}

.calDateString[_ngcontent-c31]:hover {
 font-size: 20px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 cursor: pointer;
 color: red !important;
}
.content[_ngcontent-c3] {
 display: flex;
 flex-grow: 1;
 border-top: 0px solid #dadce0 !important;
}
.mobile_time_display[_ngcontent-c31] {
 align-items: center;
 justify-content: center;
 cursor: pointer;
 background-color: #fafafa;
 border-bottom: 0px solid #fff !important;
 padding-top: 5px;
 padding-bottom: 5px;
 display: none;
}
/*Zeile mit versch. Schaltflächen*/
#############################################
.btn[_ngcontent-c34] {
 background-color: #5575a7;
 color: #fff;
 border: none !important;
}
.btn[_ngcontent-c34] {
 border: 0px solid #d8d8d8 !important;
 background: #f7f7f7;
 background-color: rgb(247, 247, 247);
 display: flex;
 align-items: center;
 justify-content: center;
 color: #686868;
 cursor: pointer;
 padding-left: 5px;
 padding-right: 5px;
 height: 28px;
 position: relative;
}
.container[_ngcontent-c34] {
 background-color: #00016e !important;
 height: 40px;
 display: flex;
}
.toggle_btn[_ngcontent-c34] {
 font-size: 18px;
 background-color: #00016e !important;
 color: red !important;
}
.toggle_btn[_ngcontent-c34]:hover {
 font-size: 18px;
 background-color: #00016e !important;
 color: #ffd700 !important;
}

.lens_btn[_ngcontent-c34], .print_btn[_ngcontent-c34], .refresh_btn[_ngcontent-c34] {
 margin-left: 5px;
 font-size: 16px;
 background-color: #00016e !important;
 color: red !important;
}
.lens_btn[_ngcontent-c34]:hover, .print_btn[_ngcontent-c34]:hover, .refresh_btn[_ngcontent-c34]:hover {
 margin-left: 5px;
 font-size: 16px;
 background-color: #00016e !important;
 color: #ffd700 !important;
}
.fa-angle-left {
 content: "\f104";
 color: #ffd700 !important;
}
.fa-angle-left:hover {
 content: "\f104";
 color: red !important;
}
.fa-angle-right {
 content: "\f105";
 color: #ffd700 !important;
}
.fa-angle-right:hover {
 content: "\f105";
 color: red !important;
}
.today_btn[_ngcontent-c36] {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 background-color: #00016e !important;
   border-radius: 5px !important;
}
.today_btn[_ngcontent-c36]:hover {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: red !important;
 background-color: #00016e !important;
 border-radius: 5px !important;
}
.square[_ngcontent-c36] {
 height: 28px;
 width: 28px;
 padding: 0;
 color: red !important;
 background-color: #00016e !important;
}
.view_select_btn[_ngcontent-c36] {
 margin-left: 5px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 background-color: #00016e !important;
}
.view_select_btn[_ngcontent-c34]:hover {
 margin-left: 5px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #00016e !important;
 background-color: #ffd !important;
}
.view_select_btn_active[_ngcontent-c34] {
 background-color: lime !important;
 color: red !important;
}
#############################################
.btn[_ngcontent-c31] {
 background-color: #5575a7;
 color: #fff;
 border: none !important;
}
.btn[_ngcontent-c31]:hover {
 background-color: #5575a7;
 color: #fff;
 border: none !important;
}
.btn[_ngcontent-c31] {
 border: 0px solid #d8d8d8 !important;
 background: #f7f7f7;
   background-color: rgb(247, 247, 247);
 display: flex;
 align-items: center;
 justify-content: center;
 color: #686868;
 cursor: pointer;
 padding-left: 5px;
 padding-right: 5px;
 height: 28px;
 position: relative;
}
.container[_ngcontent-c31] {
 background-color: #00016e !important;
 height: 40px;
 display: flex;
}
.toggle_btn[_ngcontent-c31] {
 font-size: 18px;
 background-color: #00016e !important;
 color: red !important;
}
.toggle_btn[_ngcontent-c31]:hover {
 font-size: 18px;
 background-color: #00016e !important;
 color: #ffd700 !important;
}

.lens_btn[_ngcontent-c31], .print_btn[_ngcontent-c31], .refresh_btn[_ngcontent-c31] {
 margin-left: 5px;
 font-size: 16px;
 background-color: #00016e !important;
 color: red !important;
}
.lens_btn[_ngcontent-c31]:hover, .print_btn[_ngcontent-c31]:hover, .refresh_btn[_ngcontent-c31]:hover {
 margin-left: 5px;
 font-size: 16px;
 background-color: #00016e !important;
 color: #ffd700 !important;
}
.fa-angle-left {
 content: "\f104";
 color: #ffd700 !important;
}
.fa-angle-left:hover {
 content: "\f104";
 color: red !important;
}
.fa-angle-right {
 content: "\f105";
 color: #ffd700 !important;
}
.fa-angle-right:hover {
 content: "\f105";
 color: red !important;
}
.today_btn[_ngcontent-c31] {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 background-color: #00016e !important;
}
.today_btn[_ngcontent-c31]:hover {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: red !important;
 background-color: #00016e !important;
}

.square[_ngcontent-c31] {
 height: 28px;
 width: 28px;
 padding: 0;
 color: red !important;
 background-color: #00016e !important;
}
.view_select_btn[_ngcontent-c31] {
 margin-left: 5px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 background-color: #00016e !important;
}
.view_select_btn[_ngcontent-c31]:hover {
 margin-left: 5px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #00016e !important;
 background-color: #ffd !important;
}
.view_select_btn_active[_ngcontent-c31] {
 background-color: lime !important;
 color: red !important;
}
/*Kalender - Tagesansicht*/
#########################################
.container[_ngcontent-c37] {
 background-color: #00016e !important;
 height: 0px !important;
 display: flex;
 align-items: center;
}
.dhx_cal_container {
 position: relative;
 overflow: hidden;
 background-color: #00016e !important;
 font-family: Arial,san-serif;
 font-size: 12px;
 border-right: 0px solid !important;
}
.contentWrapper {
 flex-grow: 1;
 position: relative;
 display: flex;
 flex-direction: column;
 border-top: 0px solid #133475 !important;
}
.dhx_cal_header {
 border-top: 0px solid #9C1818 !important;
 border-right: 0px solid #9C1818 !important;
}
.dhx_cal_data {
 border-top: 0px solid #fff !important;
}
#scheduler {
 width: 100%;
 flex-grow: 1;
 border-left: 0px solid #cecece !important;
 border-bottom: 0px solid #cecece !important;
}
.dhx_scale_hour {
 border-bottom: 1px solid #9C1818 !important;
 background-color: #9c1818 !important;
 text-align: center;
 line-height: 44px;
 color: #ffd700 !important;
 font-size: 18px !important;
 font-weight: inherit;
 overflow: hidden;
}
.dhx_scale_holder_now {
 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAsCAYAAACkJ9JhAAAC93pUWHRSYXcgcHJvZmlsZSB0eXBlIGV4aWYAAHjarZVtttsoDIb/s4pZApIQEsvBfJwzO+jy5wWT3CTtTNs5NbHBQpaEHkHC+Pb3DH/hokg5JDXPJeeIK5VUuGLg8b7KflJM+xnP26N/kwduZ4IhEvRyv1o9+hVy/frg4YOud3nwM8N+DNHT8L5keV7j/hok5HzLKR1DZdyDXNxeQ72OoXYUdyjnTv6+zPUe3gSGLHWFI2EeQhL30+8I5L4rJIwni0KPJGOMmbBFD2NIyNvyHn2Mrwl6T76epX1m/zn6SD7XI5ePXOaHofzjCdIPuTzd8KtjOaMA8dtEowev75M8Z/c5x726mjIymk9F7WTTwwwUL6Rc9mcZzXArxrZbQfNY4SuhGFq80BoVYlCZgRJ1qjRp7L5RQ4iJBxt65sayZS7GhZssTmk1mmxSpIsDVuMRRCDmZyy0/Zbtr5HDcyeoMsHYwv6vLfzX5O+0MOfabETRT7p1AeaVcISxyK0ntACE5uGmO8GPdvDHl/pBqYKg7jQ7FljjdZu4lL5qSzZngZ6iv7cQBevHAFIE34pgSEAgZhKlTNGYjQh5dACqiJwl8QUCpModQXISyRyMnZdvfGO0dVk58xLjbAIIxW4ysClSASslRf1YctRQVdGkqllNPWjRmiWnrDlny+uQqyaWTC2bmVux6uLJ1bObuxevhYvgDNSSixUvpdTKocJRha0K/QrJxZdc6dIrX3b5Va7aUD4tNW25WfNWWu3cpeOY6Llb9156HRQGToqRho48bPgoo07U2pSZps48bfossz6p0dm2n+03qNGhxpvU0rMnNUiD2cMEreNEFzMQ40QgbosACpoXs+iUEi9yi1ksjE2hjCB1sQmdFjEgTINYJz3ZfZH7JW5B/Ze48c/IhYXuT5ALQPc9tx9Q6+t/rm1i9y5cOY2C3TctV/ZQ+WpdUsQYv/i/+/ATBSoDq5lTOtkUeAW/ipjrVcdIEzuXkpL2GJDBNUzrqOj4Gw3/AI2fziHZLEhfAAABg2lDQ1BJQ0MgcHJvZmlsZQAAeJx9kTtIA0EURU+iokgkhSlULLZQKwOiIpYSRREUQozgr3B3Y6KQXcNugo2lYCtY+GmMWthYa2thKwiCHxArSytFGwnrmySQIMaBYQ535t558wb8+bRpufV9YNlZJzYR0ebmF7TGVwK0EwSGdNPNTM+Mx6k5vu7xqfUurLJqn/tztCRWXBN8mvCImXGywsvq3o1sRvG+cMhc1RPC58K9jhQo/Kh0o8RvilNF9qvMkBOPjQqHhLVUFRtVbK46lvCgcFfCsiXfP1fihOJNxVY6Z5brVC8MrNizM0qX2ckEk0wTRcMgxxppsoRltUVxicl+pIa/o+iPissQ1xqmOMZYx0Iv+lF/8Lu3bnKgv5QUiEDDi+d9dEPjLhR2PO/72PMKJ1D3DFd2xb+eh+FP0XcqWtcRBLfg4rqiGXtwuQ1tTxnd0YtSnUx/MgnvZ/JN89B6C82Lpb6V9zl9gLj0auoGDg6hJyXZSzXe3VTdt3/PlPv3A5MkcrSpYdcqAAAABmJLR0QA/gD7APQNBv93AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5AwZDwIUilD34gAAABlJREFUCNdj+P3r8n8mBgYGhuFFPH3GywAAYf0F9jnvRKoAAAAASUVORK5CYII=);
 filter: invert(18%) sepia(9%) saturate(659%) hue-rotate(358deg) brightness(102%) contrast(104%) !important;
}
#########################################
.container[_ngcontent-c36] {
 background-color: #00016e !important;
 height: 0px !important;
 display: flex;
 align-items: center;
}
.dhx_cal_container {
 position: relative;
 overflow: hidden;
 background-color: #00016e !important;
 font-family: Arial,san-serif;
 font-size: 12px;
 border-right: 0px solid !important;
}
.contentWrapper {
 flex-grow: 1;
 position: relative;
 display: flex;
 flex-direction: column;
 border-top: 0px solid #133475 !important;
}
.dhx_cal_header {
 border-top: 0px solid #9C1818 !important;
 border-right: 0px solid #9C1818 !important;
}
.dhx_cal_data {
 border-top: 0px solid #fff !important;
}
#scheduler {
 width: 100%;
 flex-grow: 1;
 border-left: 0px solid #cecece !important;
 border-bottom: 0px solid #cecece !important;
}
.dhx_scale_hour {
 border-bottom: 1px solid #9C1818 !important;
 background-color: #9c1818 !important;
 text-align: center;
 line-height: 44px;
 color: #ffd700 !important;
 font-size: 18px !important;
 font-weight: inherit;
 overflow: hidden;
}
.dhx_scale_holder_now {
 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAsCAYAAACkJ9JhAAAC93pUWHRSYXcgcHJvZmlsZSB0eXBlIGV4aWYAAHjarZVtttsoDIb/s4pZApIQEsvBfJwzO+jy5wWT3CTtTNs5NbHBQpaEHkHC+Pb3DH/hokg5JDXPJeeIK5VUuGLg8b7KflJM+xnP26N/kwduZ4IhEvRyv1o9+hVy/frg4YOud3nwM8N+DNHT8L5keV7j/hok5HzLKR1DZdyDXNxeQ72OoXYUdyjnTv6+zPUe3gSGLHWFI2EeQhL30+8I5L4rJIwni0KPJGOMmbBFD2NIyNvyHn2Mrwl6T76epX1m/zn6SD7XI5ePXOaHofzjCdIPuTzd8KtjOaMA8dtEowev75M8Z/c5x726mjIymk9F7WTTwwwUL6Rc9mcZzXArxrZbQfNY4SuhGFq80BoVYlCZgRJ1qjRp7L5RQ4iJBxt65sayZS7GhZssTmk1mmxSpIsDVuMRRCDmZyy0/Zbtr5HDcyeoMsHYwv6vLfzX5O+0MOfabETRT7p1AeaVcISxyK0ntACE5uGmO8GPdvDHl/pBqYKg7jQ7FljjdZu4lL5qSzZngZ6iv7cQBevHAFIE34pgSEAgZhKlTNGYjQh5dACqiJwl8QUCpModQXISyRyMnZdvfGO0dVk58xLjbAIIxW4ysClSASslRf1YctRQVdGkqllNPWjRmiWnrDlny+uQqyaWTC2bmVux6uLJ1bObuxevhYvgDNSSixUvpdTKocJRha0K/QrJxZdc6dIrX3b5Va7aUD4tNW25WfNWWu3cpeOY6Llb9156HRQGToqRho48bPgoo07U2pSZps48bfossz6p0dm2n+03qNGhxpvU0rMnNUiD2cMEreNEFzMQ40QgbosACpoXs+iUEi9yi1ksjE2hjCB1sQmdFjEgTINYJz3ZfZH7JW5B/Ze48c/IhYXuT5ALQPc9tx9Q6+t/rm1i9y5cOY2C3TctV/ZQ+WpdUsQYv/i/+/ATBSoDq5lTOtkUeAW/ipjrVcdIEzuXkpL2GJDBNUzrqOj4Gw3/AI2fziHZLEhfAAABg2lDQ1BJQ0MgcHJvZmlsZQAAeJx9kTtIA0EURU+iokgkhSlULLZQKwOiIpYSRREUQozgr3B3Y6KQXcNugo2lYCtY+GmMWthYa2thKwiCHxArSytFGwnrmySQIMaBYQ535t558wb8+bRpufV9YNlZJzYR0ebmF7TGVwK0EwSGdNPNTM+Mx6k5vu7xqfUurLJqn/tztCRWXBN8mvCImXGywsvq3o1sRvG+cMhc1RPC58K9jhQo/Kh0o8RvilNF9qvMkBOPjQqHhLVUFRtVbK46lvCgcFfCsiXfP1fihOJNxVY6Z5brVC8MrNizM0qX2ckEk0wTRcMgxxppsoRltUVxicl+pIa/o+iPissQ1xqmOMZYx0Iv+lF/8Lu3bnKgv5QUiEDDi+d9dEPjLhR2PO/72PMKJ1D3DFd2xb+eh+FP0XcqWtcRBLfg4rqiGXtwuQ1tTxnd0YtSnUx/MgnvZ/JN89B6C82Lpb6V9zl9gLj0auoGDg6hJyXZSzXe3VTdt3/PlPv3A5MkcrSpYdcqAAAABmJLR0QA/gD7APQNBv93AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5AwZDwIUilD34gAAABlJREFUCNdj+P3r8n8mBgYGhuFFPH3GywAAYf0F9jnvRKoAAAAASUVORK5CYII=);
 filter: invert(18%) sepia(9%) saturate(659%) hue-rotate(358deg) brightness(102%) contrast(104%) !important;
}
/*Kalender - Wochenansicht*/
.dhx_scale_bar {
 border-left: 0px solid #912f2f !important;
 color: #ffd700 !important;
 background-color: #9C1818 !important;
 font-size: 20px !important;
}
.dhx_multi_day_icon, .dhx_multi_day_icon_small {
 border-right: 0px solid #fff !important;
 background-color: #9C1818 !important;
}
.dhx_cal_event div {
 line-height: normal;
 color: red !important;
 font-size: 15px !important;
}
.dhx_scale_holder {
    background-color: #ffd !important;
}
.dhx_multi_day {
 position: absolute;
 background-color: #9C1818 !important;
 border-right: none;
 box-shadow: none;
 border-top: 0px !important;
 width: 1625px !important;
}
/*Kalender - Monatsansicht*/
/*Anfang des nächsten Monats*/
.notInRangeTableCell > .dhx_month_body, .notInRangeTableCell > .dhx_month_head {
 background: #ffd !important;
 color:##00016e82 !important;
}
/*Wochendend*/
.weekendTableCell > .dhx_month_body, .weekendTableCell > .dhx_month_head {
 background: #4d6b74 !important;
}
/* restl. Werktage des akt. Monat*/
.dhx_month_head {
    background-color: #ffd700  !important;
}
.dhx_month_body {
    background-color: #ffd700  !important;
}
/*aktuller Tag*/
.todayTableCell > .dhx_month_body, .todayTableCell > .dhx_month_head {
    background-color: #a72020 !important;
    color: #fff !important;
}
/*Termin*/
.dhx_cal_event_clear, .dhx_cal_event_line_start, .dhx_cal_event_line_end, .eventBgColor_0 {
    height: 25px !important;
    font-size: 15px !important;
    text-align: center !important;
    margin-left: 2px !important;
}
/*Kalender- Jahresansicht*/
.monthName {
    background-color: #9C1818 !important;
    color: #ffd700 !important;
    font-size: 15px !important;
}
/*Kalender- Listenansicht*/
  .btn[_ngcontent-c37] {
   border: 1px solid #00016e !important;
   background: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   color: #000;
   cursor: pointer;
   padding-left: 5px;
   padding-right: 5px;
   height: 28px;
   position: relative;
   margin-left: 10px;
   color: #ffd700 !important;
   background-color: #00016e !important;
}


/*Menüleiste*/
.options[_ngcontent-c37] {
 border-bottom: 0px solid #cecece !important;
 display: inline-block;
 width: 100%;
 background-color: #9C1818 !important;
 font-size: 14px;
 color: #ffd700 !important;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
}
/*Felder in Menüleiste*/
div.btn.square.rounded.toggle_btn[_ngcontent-c35] {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}
div.btn.square.rounded.toggle_btn[_ngcontent-c35]:hover {
 background-color: #ffd700 !important;
 color: red !important;
 border-color: #ffd700 !important;
}

div.btn.square.rounded.refresh_btn[_ngcontent-c35] {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}
div.btn.square.rounded.refresh_btn[_ngcontent-c35]:hover {
 background-color: #ffd700 !important;
 color: red !important;
 border-color: #ffd700 !important;
}

div.btn.square.rounded.print_btn[_ngcontent-c35] {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}
div.btn.square.rounded.print_btn[_ngcontent-c35]:hover {
 background-color: #ffd700 !important;
 color: red !important;
 border-color: #ffd700 !important;
}

div.btn.square.left-rounded.back_btn[_ngcontent-c36] {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}
div.btn.square.left-rounded.back_btn[_ngcontent-c36]:hover {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}

div.btn.today_btn[_ngcontent-c35] {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
 border-radius: 5px !important;
}
div.btn.today_btn[_ngcontent-c35]:hover {
 background-color: #ffd700 !important;
 color: red !important;
 border-color: #ffd700 !important;
 border-radius: 5px !important;
}

div.btn.square.right-rounded.forward_btn[_ngcontent-c36] {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}
div.btn.square.right-rounded.forward_btn[_ngcontent-c36]:hover {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}

div.btn.rounded.view_select_btn[_ngcontent-c35] {
 background-color: #00016e !important;
 color: red !important;
 border-color: #00016e !important;
}
div.btn.rounded.view_select_btn[_ngcontent-c35]:hover {
 background-color: #ffd700 !important;
 color: red !important;
 border-color: #ffd700 !important;
}

div.btn.rounded.view_select_btn.view_select_btn_active[_ngcontent-c35] {
 background-color: #ffd700 !important;
 color: #red !important;
}

Terminfeld
.list[_ngcontent-c38] {
 padding: 10px;
 display: flex;
 flex-direction: column;
 background-color: #9C1818;
 color: #ffd700 !important;
}
.list-item[_ngcontent-c38] {
 padding: 10px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 border-radius: 5px;
 margin-bottom: 10px;
 background: #9C1818 !important;
 cursor: pointer;
}
.list-box {
    background-color: #9c1818 !important;
    color: #ffd700 !important;
}
.list-item-head-spacer, .eventBgColor_0 {
    border-radius:15px !important;
}

/*Neuen Termin hinzufügen / neuer Termin*/
/*Hintergrund gesamt*/
.container[_ngcontent-c10] {
 background-color: #9C1818 !important;
 height: 75%;
 width: 50%;
 border-radius: 8px;
 box-shadow: 3px 3px 22px -3px rgba(0,0,0,.75);
 padding: 10px;
 display: flex;
 flex-direction: column;
 z-index: 6;
 position: relative;
}
/*Zeilenüberschriften*/
.form_grp_title[_ngcontent-c10] {
 display: flex;
 align-items: center;
 font-size: 22px !important;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 background-color: #9C1818 !important;
}
/*Symbole vor Überschriften*/
.form_grp_icon[_ngcontent-c10] > i[_ngcontent-c10] {
 font-size: 23px;
 color: #00016e !important;
}
/* .fa-tag::before {
 content: "\f02b";
 color: #00016e !important;
}
.fa-edit::before {
 content: "\f044";
 color: #00016e !important;
}
.fa-clock::before {
 content: "\f017";
 color: #00016e !important;
}
.fa-calendar::before {
 content: "\f133";
 color: #00016e !important;
}
.fa-users::before {
 content: "\f0c0";
 color: #00016e !important;
}
.fa-map-marker-alt::before {
 content: "\f3c5";
 color: #00016e !important;
}
*/
/*Eingabefelder*/
.form_input[_ngcontent-c10] {
 outline: 0;
 border: 1px solid #00016e !important;
 border-radius: 6px;
 padding: 5px;
 font-size: 18px !important;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 -webkit-appearance: none;
 background-color: #00016e !important;
 margin-top: 15px !important;
 color: #ffd700 !important;
}
/*Link hinzufügen-Feld*/
.input-field-action-btn[_ngcontent-c10] {
    background-color: #00016e !important;
    color: #ffd700 !important;
    font-size: 16px !important;
    border-radius: 15px !important;
    border-color:#00016e !important;
}
.input-field-action-btn[_ngcontent-c10]:hover {
    background-color: #ffd700 !important;
    color: #9C1818 !important;
    font-size: 16px !important;
    border-radius: 15px !important;
    border-color: #ffd700 !important;
}
.fa-link::before {
 content: "\f0c1";
 color: #9C1818 !important;
}
/*Zeitraum*/
.date_prelude[_ngcontent-c24] {
 width: 45px;
 color: #ffd700 !important;
 font-size: 17px !important;
}
.date_input_box[_ngcontent-c24] {
 font-size: 16px !important;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 background-color: #00016e !important;
 border-color: #00016e !important;
 color: #ffd700 !important;
}
.date_input_box[_ngcontent-c24]:hover {
 font-size: 16px !important;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 background-color: #ffd700 !important;
 border-color: #ffd700 !important;
 color: #9C1818 !important;
}
.form_input[_ngcontent-c24] {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 font-size: 16px !important;
 background-color: #00016e !important;
 border-color: #00016e !important;
 color: #ffd700 !important;
}
.form_input[_ngcontent-c24]:hover {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 font-size: 16px !important;
 background-color: #ffd700 !important;
 color: #9c1818 !important;
 border-color: #ffd700 !important;
}
.prelude_text[_ngcontent-c24] {
 width: 100px;
 color: #ffd700 !important;
 font-size: 18px !important;
}
.switch[_ngcontent-c24=""] {
    background-color: #00016e !important;
}
.switch_square[_ngcontent-c24] {
 width: 20px;
 height: 20px;
 background-color: #ffd700 !important;
 margin-left: 5px;
 border-radius: 5px !important;
}
.flatpickr-time input {
 background-color: #ffd700 !important;
 box-shadow: none;
 border-radius: 0;
 text-align: center;
 margin: 0;
 padding: 0;
 height: inherit;
 line-height: inherit;
 color: #00016e !important;
 font-size: 16px !important;
 position: relative;
 box-sizing: border-box;
 -webkit-appearance: textfield;
 -moz-appearance: textfield;
 appearance: textfield;
}
.flatpickr-time, .time24hr[tabindex="-1"] {
    background-color:#ffd700 !important;
    color: #00016e !important;
    border: none !important;
}
.flatpickr-calendar.hasTime .flatpickr-time {
 height: 40px;
 border-top: none !important;
 border-bottom: none !important;
}
/*Unterkalender*/
.calendars_box[_ngcontent-c24] {
 font-size: 16px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 border-color: #00016e !important;
 background-color: #00016e !important;
}
/*3 Symbole links*/
.misc-action-btn[_ngcontent-c10] {
 display: flex;
 align-items: center;
 padding-left: 10px;
 padding-right: 10px;
 font-size: 20px;
 border-radius: 5px;
 background-color: #9c1818 !important;
 cursor: pointer;
 border: 1px solid #9c1818 !important;
 color: #ffd700 !important;
 margin-right: 10px;
}
.misc-action-btn[_ngcontent-c10]:hover {
 display: flex;
 align-items: center;
 padding-left: 10px;
 padding-right: 10px;
 font-size: 20px;
 border-radius: 5px;
 background-color: #00016e !important;
 cursor: pointer;
 border: 1px solid #00016e !important;
 color: #ffd700 !important;
 margin-right: 10px;
}
/*Pop-up hinter Symbol ganz links (Legende)*/
.ctrl_box[_ngcontent-c7] {
 padding: 10px;
 display: flex;
 flex-direction: column;
 width: 100%;
 background-color: #9c1818 !important;
 color: #ffd700 !important;
}
.subCalIconInfo[_ngcontent-c7]:hover {
 background-color: #ffd700 !important;
 color: #9c1818 !important;
 border-radius: 25px;
 height: 20px !important;
}


/*Abbrechen-Feld*/
.ctrl_btn[_ngcontent-c10] {
 border-radius: 4px;  
 border-color: #bc0a0a !important;
 background-color: #00016e !important;
 color: #ffd700 !important;
 margin-left: 10px;
 cursor: pointer;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 font-size: 20px;
 border: 1px solid #c9cace;
 padding: 5px 10px;
}
.ctrl_btn[_ngcontent-c10]:hover {
 border-radius: 4px;  
 border-color: #bc0a0a !important;
 background-color: #bc0a0a !important;
 color: #fff !important;
 margin-left: 10px;
 cursor: pointer;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 font-size: 20px;
 border: 1px solid #c9cace;
 padding: 5px 10px;
}

.fa-times::before {
 content: "\f00d";
 color: #fff !important;
}
/*Löschen-Feld*/
.ctrl_btn[_ngcontent-c10]
.fa-trash-alt::before {
 content: "\f2ed";
 color: #0028ff !important;
}
/*Speichern-Feld*/
.save_btn[_ngcontent-c10] {
 background-color: #00016e !important;
 color: #ffd700 !important;
 border: none;
}
.save_btn[_ngcontent-c10]:hover {
 background-color: #0F0 !important;
 color: #9C1818 !important;
 border: none;
}
.fa-check::before {
 content: "\f00c";
 color: #34c7e9 !important;
}
/*Bearbeitungsfenster*/

/*Suchfenster (Lupe)*/
.search-view-headline[_ngcontent-c36] {
 flex-grow: 1;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 20px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 background-color: #00016e !important;
}
.options[_ngcontent-c38] {
 border-bottom: 1px solid #cecece;
 display: inline-block;
 width: 100%;
 background-color: #9C1818 !important;
 font-size: 14px;
 color: #ffd700 !important;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
}
.hiddenInput[_ngcontent-bjl-c34], .ng-untouched, .ng-pristine, .ng-valid, .flatpickr-input {
    background-color: #ffd700 !important;
    color: #9C1818 !important;
   border-color: #ffd700 !important;
    font-size: 15px !important;
}  
.btn[_ngcontent-c38] {
 border: 1px solid #00016e !important;
 background: #00016e !important;
 display: flex;
 align-items: center;
 justify-content: center;
 color: #ffd700 !important;
 cursor: pointer;
 padding-left: 5px;
 padding-right: 5px;
 height: 28px;
 position: relative;
 margin-left: 10px;
 font-size: 15px !important;
}
.btn[_ngcontent-c38]:hover {
 border: 1px solid #ffd700 !important;
 background: #ffd700 !important;
 display: flex;
 align-items: center;
 justify-content: center;
 color: #9C1818 !important;
 cursor: pointer;
 padding-left: 5px;
 padding-right: 5px;
 height: 28px;
 position: relative;
 margin-left: 10px;
 font-size: 15px !important;
}

.btn[_ngcontent-c36] {
 border: 1px solid #00016e !important;
 background: #00016e !important;
 display: flex;
 align-items: center;
 justify-content: center;
 color: #ffd700 !important;
 cursor: pointer;
 padding-left: 5px;
 padding-right: 5px;
 height: 28px;
 position: relative;
 margin-left: 10px;
 font-size: 15px !important;
}
.btn[_ngcontent-c36]:hover {
 border: 1px solid #ffd700 !important;
 background: #ffd700 !important;
 display: flex;
 align-items: center;
 justify-content: center;
 color: #9C1818 !important;
 cursor: pointer;
 padding-left: 5px;
 padding-right: 5px;
 height: 28px;
 position: relative;
 margin-left: 10px;
 font-size: 15px !important;
}
.switch_active[_ngcontent-c33] {
 background-color: #00016e !important;
}
.switch_square[_ngcontent-c33] {
 width: 15px;
 height: 15px;
 background-color: #ffd700 !important;
 margin-left: 5px;
 border-radius: 15px !important;
}
.searchEventsBtn[_ngcontent-c38] {
 color: #ffd700 !important;
 background-color: #00016e !important;
 border-radius: 5px;
 cursor: pointer;
 padding: 5px 10px;
 font-size: 15px !important;
}
.searchEventsBtn[_ngcontent-c38]:hover {
 color: #9C1818 !important;
 background-color: #ffd700 !important;
 border-radius: 5px;
 cursor: pointer;
 padding: 5px 10px;
 font-size: 15px !important;
}
.closeViewBtn[_ngcontent-c38] {
 border: 1px solid #00016e !important;
 background: #00016e !important;
 border-radius: 5px;
 cursor: pointer;
 padding: 5px 10px;
 font-size: 15px !important;
}
.closeViewBtn[_ngcontent-c38]:hover {
 border: 1px solid #ffd700 !important;
 background: #ffd700 !important;
 color:#9c1818 !important;
 border-radius: 5px;
 cursor: pointer;
 padding: 5px 10px;
 font-size: 15px !important;
}
/*Suchergebnisse*/
.list-item[_ngcontent-c33] {
 padding: 10px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 border-radius: 5px;
 margin-bottom: 10px;
 background: #00016e !important;
 cursor: pointer;
 color: #ffd700 !important;
}
.list-item[_ngcontent-c33]:hover {
 opacity: 80%;
 background-color: #9c1818 !important;
 color: #00016e !important;
}

/*Suchkalender*/
/*Hintergrund Titelleiste*/
.flatpickr-months .flatpickr-month {
 background-color: #00016e !important;
 color: rgba(0,0,0,.9);
 fill: rgba(0,0,0,.9);
 height: 34px;
 line-height: 1;
 text-align: center;
 position: relative;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 overflow: hidden;
 flex: 1;
}
/*Hintergund Wochentage*/
.flatpickr-weekdays {
 background: 0 0;
 text-align: center;
 overflow: hidden;
 width: 100%;
 display: flex;
 align-items: center;
 height: 28px;
 background-color: #00016e !important;
}

/*Name Wochentage*/
span.flatpickr-weekday {
 cursor: default;
 font-size: 90%;
 background: 0 0;
 color: #ffd700 !important;
 line-height: 1;
 margin: 0;
 text-align: center;
 display: block;
 flex: 1;
 font-weight: bolder;
}
/*Hintergrung Tage*/
.dayContainer {
 padding: 0;
 outline: 0;
 text-align: left;
 width: 307.875px;
 min-width: 307.875px;
 max-width: 307.875px;
 box-sizing: border-box;
 display: inline-block;
 display: flex;
 flex-wrap: wrap;
 -ms-flex-wrap: wrap;
 justify-content: space-around;
 -webkit-transform: translate3d(0,0,0);
 transform: translate3d(0,0,0);
 opacity: 1;
 background-color: #00016e !important;
 border-color: #00016e !important;
}
/*Tage aktueller Monat*/
.flatpickr-current-month > .numInputWrapper > .cur-year, .flatpickr-day, .flatpickr-time {
    color: #ffd !important;
    width: 307.87px !important;
    font-size: 18px !important
}
/*Tage nächster Monat*/
.flatpickr-current-month > .numInputWrapper > .cur-year, .nextMonthDay, .flatpickr-time {
    color: #c91818 !important;
    width: 307.87px !important;
    font-size: 18px !important
}
/*aktueller Tag*/
.flatpickr-day.selected{
 background-color: #A72020 !important;
 box-shadow: none;
 color: #fff;
 border-color: #A72020 !important;
 color: #FFFFDD !important;
}
/*Auswahlmenü Monat*/
.flatpickr-current-month .flatpickr-monthDropdown-months {
 appearance: menulist;
 background-color: #9C1818 !important;
 color: #ffd700 !important;
 border: none;
 border-radius: 5px !important;
 box-sizing: border-box;
 color: inherit;
 cursor: pointer;
 font-size: 18px !important;
 font-family: inherit;
 font-weight: 500 !important;
 text-align: center !important;
 height: auto ;
 line-height: inherit;
 margin: -1px 0 0;
 outline: 0;
 padding: 0 0 0 .5ch;
 position: relative;
 vertical-align: initial;
 -webkit-box-sizing: border-box;
 -webkit-appearance: menulist;
 -moz-appearance: menulist;
 width: auto;
}
/*:hover über Tage*/
.flatpickr-day:hover {
    background-color: #ffd700 !important;
    color: #00016e !important;
    border-color: #ffd700 !important;
}
/*Auswahlmenü Jahr*/
.flatpickr-current-month > .numInputWrapper > .cur-year {
 color: #ffd700 !important;
}
.numInput, .cur-year {
 background-color: #9C1818 !important;
 border-radius: 5px !important;
 font-size: 18px !important;
 font-weight: 500 !important;
 position:relative !important;
 left: 10px !important;
 height: auto;
}
 
/*Pfeiltasten rechts + links*/
.flatpickr-months .flatpickr-next-month:hover svg, .flatpickr-months .flatpickr-prev-month:hover svg {
 fill: #9C1818 !important;
}
.flatpickr-months .flatpickr-next-month svg, .flatpickr-months .flatpickr-prev-month svg {
 fill: #ffd700 !important;
}
.flatpickr-months .flatpickr-next-month.flatpickr-next-month, .flatpickr-months .flatpickr-prev-month.flatpickr-next-month {
 right: 0;
 background-color: #00016e !important;
}
/*Termin bestätigen*/
.overlay-box[_ngcontent-c1] {
 width: 30%;
 background-color: #9C1818 !important;
 border: 1px solid #9C1818 !important;
 border-radius: 5px;
 padding: 20px;
}
.overlay-title[_ngcontent-c1] {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 font-size: 14px;
}
.overlay-text[_ngcontent-c1] {
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #ffd700 !important;
 font-size: 20px;
}
/*OK-Button*/
.okBtn[_ngcontent-c1] {
 border-radius: 5px;
 border: 1px solid #00016e !important;
 background-color: #00016e !important;
 color: #ffd700 !important;
}
.okBtn[_ngcontent-c1]:hover {
 border-radius: 5px;
 border: 1px solid #50eb24 !important;
 background-color: #50eb24 !important;
 color: #fff !important;
}
/*Abbrechen-Button*/
.cancelBtn[_ngcontent-c1] {
 background-color: #00016e !important;
 border-radius: 5px;
 border: 1px solid #00016e !important;
 color: #ffd700 !important;
}
.cancelBtn[_ngcontent-c1]:hover {
 background-color: #BC0A0A !important;
 border-radius: 5px;
 border: 1px solid #BC0A0A !important;
 color: #fff !important;
}
/*3 striche untereinander - Menü*/
.box--mobile[_ngcontent-c43]{
 padding: 13px;
 position: absolute;
 top: 50px;
 right: 10px;
 background-color: #9C1818 !important;
 border: 1px solid #9C1818 !important;
 border-radius: 4px;
 box-shadow: none !important;
 min-width: 620px;
 max-width: 640px;
 font-size: 16px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 color: #212529;
 text-align: left;
 display: flex;
 flex-direction: column;
}
.close-btn[_ngcontent-c43] {
 border-radius: 4px;
 padding: 6px 12px;
 text-align: center;
 cursor: pointer;
 border: 1px solid #ffd !important;
 background-color: #ffd !important;
 color:#00016e !important;
}
.close-btn[_ngcontent-c43]:hover {
 border-radius: 4px;
 padding: 6px 12px;
 text-align: center;
 cursor: pointer;
 border: 1px solid #00016e !important;
 background-color: #00016e !important;
 color:#ffd700 !important;
}
.option[_ngcontent-c43] {
 font-size: 16px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 text-align: left;
 background-color: #ffd700 !important;
 border-color: #ffd700 !important;
 color: #00016e !important;
}
.option[_ngcontent-c43]:hover {
 font-size: 16px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 text-align: left;
 background-color: #00016e !important;
 border-color: #00016e !important;
 color: #ffd700 !important;
}
.nav-tab[_ngcontent-c43] {
 font-size: 16px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 text-align: left;
 background-color: #ffd700 !important;
 border-color: #ffd700 !important;
 color: #00016e !important;
}
.nav-tab[_ngcontent-c43]:hover {
 font-size: 16px;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 text-align: left;
 background-color: #00016e !important;
 border-color: #00016e !important;
 color: #ffd700 !important;
}
.switch_square[_ngcontent-c35] {
 width: 20px;
 height: 20px;
 background-color: #ffd700 !important;
 margin-left: 5px;
 border-radius: 5px !important;
}
.switch[_ngcontent-c35] {
 background-color: #9c1818 !important;
 min-width: 60px;
 max-width: 60px;
 height: 30px;
 display: flex;
 align-items: center;
 cursor: pointer;
 border-radius: 5px !important;
}
.event-size-btn--inactive[_ngcontent-c43] {
 background-color: #9c1818 !important;
 color: #ffd !important;
}
.event-size-btns[_ngcontent-c43] > div[_ngcontent-c43]:nth-child(2) {
 background-color: #00016e !important;
 color: #ffd !important;
}
.event-duration-dropdown[_ngcontent-c43] {
 color: #000;
 cursor: pointer;
 background-color: #9c1818 !important;
 color: #fff !important;
 border-color: #9c1818 !important;
}

/*Pop-Up nach Terminerstellung / Änderung*/
.info-banner-box[_ngcontent-c9] {
 width: 315px;
 height: 80px;
 pointer-events: initial;
 z-index: 10;
 position: absolute;
 background-color: #00016e !important;
 border-top-left-radius: 8px;
 border-top-right-radius: 8px;
 border: none;
 box-shadow: 0 24px 38px 3px rgb(0 0 0 / 14%),0 9px 46px 8px rgb(0 0 0 / 12%),0 11px 15px -7px rgb(0 0 0 / 20%) !important;
 font-family: "Open Sans",sans-serif;
 font-weight: 400;
 font-size: 14px;
 display: flex;
 padding-left: 20px;
 padding-right: 40px;
 padding-top: 20px;
 flex-direction: column;
 color: #ffd700 !important;
}
.btn-filled[_ngcontent-c9] {
 color: #ffd700 !important;
 background-color: #9c1818 !important;
 border: 1px solid #9c1818 !important;
}
.btn-filled[_ngcontent-c9]:hover {
 color: #9c1818 !important;
 background-color: #ffd700 !important;
 border: 1px solid #ffd700 !important;
}
.btn[_ngcontent-c9] {
 background-color: #9c1818 !important;
 font-weight: 400;
 border: 1px solid #9c1818 !important;
 border-radius: 4px;
 cursor: pointer;
 padding: 4px 8px;
 color: #ffd700 !important;
}
.btn[_ngcontent-c9]:hover {
 background-color: #ffd700 !important;
 font-weight: 400;
 border: 1px solid #ffd700 !important;
 border-radius: 4px;
 cursor: pointer;
 padding: 4px 8px;
 color: #9c1818 !important;
}
.close-btn[_ngcontent-c9]:hover {
 height: 36px;
 width: 36px;
 display: flex;
 align-items: center;
 justify-content: center;
 position: absolute;
 top: 0;
 right: 0;
 cursor: pointer;
 background-color: #ffd700 !important;
}
.btn[_ngcontent-mpc-c61] {
   background-color: red !important;
   color: green !important;

}




}
}

Alles anzeigen

Diese ist ohne die gewünschten Änderungen.

Nicht mehr greifen tun u.a. der Code für die Zeile, in welcher der Kalendername (hier: "Test") steht, der Code für alles was in der Zeile darunter ist, Teile des Codes für das Fenster um einen neuen Eintrag zu erstellen, ... Man sieht ja, welche Symbole, Hintergründe, Texte nicht zum sonstigen Farbkonzept passen.

Firefox_94.0.1

Zitat von Mira_Belle

Eine lokale .html-Datei. OK.
Eingebunden wird irgendwas von einer externen Seite?
Muss dann der Code dafür nicht in die userContent.css, oder darüber eingebunden werden?
Ist nur so eine Überlegung, wirklich wissen tu’ ich das auch nicht.

Die Einbindung an sich funktioniert ja. Nur die Codeänderungen (neue Adressierung von manchen Seitenelementen) wird nicht übernommen. Die Elemente, von welchen die Adressierung nicht verändert wurde, werden weiterhin wie in meiner .css programmiert, dargestellt.

Edit:

Ich habe gerade wieder etwas getestet:

1. Css komplett geleert

2. ein Element neu eingefügt, von welchem ich weiß, dass dort nichts geändert wurde --> Änderung wird übernommen

3. Schritt 2 mit einem geänderterten Element durchgeführt --> meine Änderung wird ignoriert

Firefox_94.0.1

Ich nutze als Startseite eine selbst gebaute, lokal gespeicherte .html-Datei, in welcher ich einen Kalender als iframe eingebunden habe. Beim Kalender-css werden teilweise einzelne css-Teile immer mal wieder neu benannt. Bisher habe ich die Adressierung der jeweiligen Elemente in meiner .css dazu entsprechend geändert und mein Design wurde wieder übernommen. Jetzt gab es wieder eine Änderung. Wenn ich jedoch jetzt die neuen Adressierungen in meine .css einpflege, wird mein Design trotzdem ignoriert. Woran kann das liegen?

Ein vollständiges leeren der .css und nur der neue Code darin hat auch nichts bewirkt.

Firefox_94.0.1

Zitat von .DeJaVu
wiki ist lese und hirn-freundlich aufgebaut. Das menschliche Hirn kann nur eine bestimmte Anzahl Worte pro Zeile aufnehmen.
Wenn, dann musst du mit diesen Werten spielen:
Code
@media screen and (min-width: 1120px) {
  .mw-body {
    grid-template:
min-content min-content min-content 1fr / minmax(0,59.25rem) min-content;
}

Welche Werte müssen hier geändert werden?

Firefox_94.0.1

Zitat von .DeJaVu

Gibt es bei auch nicht mehr, schon länger nicht mehr. Aktuelles CSS. Ich nutze Stylus, funktioniert ohne Neustart :p

CSS

@-moz-document domain("wikipedia.org") {
:root
{
  --wmde-banner-height: 0 !important;
  --wmde-banner-transition-duration: 0 !important;
}

.wmde-show-banner #mw-page-base,
.wmde-show-banner #mw-mf-viewport,
.wmde-show-banner .vector-header-container,
.wmde-show-banner #mw-panel,
.wmde-show-banner #mw-head,
.wmde-show-banner #mw-mf-page-left
{
  padding-top: 0 !important;
  top: 0 !important;
}

.vector-column-end,
.vector-user-links,
#wmde-banner-app,
.vector-menu-content-list,
#ca-talk,
#p-personal
{
    display: none;
}

#mw-head-base
{
    height: 0 !important;
}


@media (min-width: 961px)
{

    .mw-editsection,
    #page-actions-watch,
    #page-actions-edit,
    #siteNotice
    {
        display: none;
    }

    .thumb,
    .thumbinner
    {
        min-width: 300px;
    }
}

@media (max-width:760px)
{
    
    /*
    html
    {
        font-size: 1.5em;
    }
    */

    [id="bodyContent"],
    .vector-body
    {
        font-size: 1.1em;
    }


    #mw-panel,
    #p-personal,
    .last-modified-bar,
    .mw-footer,
    .page-actions-menu
    {
        display: none;
    }

    .mw-body,
    #mw-data-after-content
    {
        margin-left: 0;
    }

    h2 {
        font-size: 1.1em;
    }

    .content h2, .content h3, .content h4, .content h5, .content h6
    {
        padding: 0 !important;
    }

    .client-js .collapsible-block
    {
        display: block !important;
    }

}

}

Alles anzeigen

Gibt es da auch eine Möglichkeit, dass auf der Artikelseite die Breite standardmäßig "breit" ist?

Firefox_94.0.1

Zitat von milupo

Also ich habe die Erscheinungsbild-Leiste sofort ausgeblendet.

Ich hätte noch folgendes dazu schreiben müssen: Ich nutze FF eig. immer im privaten Modus. Dadurch werden keine Cookies gespeichert und ich müsste die Einstellungen jedes Mal neu vornehmen.

ChatGPT hat mir folgendes, nicht funktionierendes, css dazu generiert:

CSS

/*Wikipedia*/
@-moz-document domain("https://de.wikipedia.org") {
/* Suche wieder rechts*/
div#p-search.vector-search-box-vue.vector-search-box-collapses.vector-search-box-show-thumbnail.vector-search-box-auto-expand-width.vector-search-box {
 margin-left: 400px !important;
}
/* Erscheinungsbild: verbergen */
#mw-panel {
   display: none; /* Versteckt das Seitenpanel */
}
/* Text: klein */
body {
   font-size: small; /* Setzt die Schriftgröße auf klein */
}
/* Breite: breit */
body {
   max-width: 1200px; /* Setzt die maximale Breite des Inhalts */
   margin: 0 auto; /* Zentriert den Inhalt */
}
}

Alles anzeigen

Dieses habe ich per @import in meine userContent.css hinzugefügt. Kann daraus was gemacht werden?

Firefox_94.0.1

Wikipedia hat das neue Design ausgerollt. Jetzt ist rechts eine Leiste, um Anpassungen vorzunehmen. Kann man per css / Skript das ganze so festlegen, dass folgende Einstellungen automatisch geladen werden:

- Erscheinungsbild: verbergen (Leiste ist hinter Button versteckt und nimmt keinen unnötigen Platz ein)

- Text: "klein"

- Breite: "Breit"

Auch möchte ich gerne das Suchfeld wieder mehr rechts haben.

Firefox_94.0.1

Zitat von 2002Andreas
Zitat von Firefox_94.0.1

doch noch nicht gelöst

Und damit?
CSS
.tab-background[selected]  {
 background: #2b2c86 !important;
 outline-color: transparent !important;
 box-shadow: none !important;
}

Damit sieht es aktuell ganz gut aus. Hoffentlich ist das Problem dadurch gelöst.

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

das helle Theme wieder aktivere, bleibt der Rahmen trotzdem weg

Ist hier auch so, und sollte auch so sein.

Ich habe jetzt noch eine ganz seltsame Beobachtung gemacht: egal, welches Theme ich einstelle: nach einem neuen Öffnen von Firefox ist der schwarze Rahmen wieder da. Das Problem ist daher (leider) doch noch nicht gelöst...

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

ist der Rahmen weg

Gerade was getestet: wenn ich jetzt aber das helle Theme wieder aktivere, bleibt der Rahmen trotzdem weg... Keine Ahnung was da los war/ist.

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

der Rahmen ist trotzdem da:

Standard gibt es den nicht.

Also muss es einen anderen Grund dafür geben.
Wie sieht es im Fehlerbehebungsmodus vom Firefox aus?
Welches Theme nutzt du?
Beispiel hier:

Alles anzeigen

Das war es doch tatsächlich. Das Theme "Hell" war aktiviert, aber mit dem "System-Theme-Automatisch" ist der Rahmen weg. Keine Ahnung, warum da was anderes eingestellt war.

Firefox_94.0.1 · Screenshot 2024-10-15 181152.png

2002Andreas Mira_Belle

Für die Tabs nutze ich nur den oben geposteten Code. Den Hintergrund habe ich hiermit angepasst:

CSS

/********************* Tabs ********************************************/

/*Form und Hintergrundfarbe*/
.tabbrowser-tab:not(image.tab-icon-overlay[role="presentation"]) {
     color: #fff !important;
}
.tab-background[selected]  {
 background: #2b2c86 !important;
}
.tab-background:not([selected])  {
 background: #00016e !important;
}
/*:hover Hintergrund von nicht aktiven Tabs*/
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected], [multiselected]) {
 background-color: #15167a !important;
 outline: 1px solid var(--tab-hover-outline-color);
 outline-offset: -1px;
}

/*Lautsprecher (Medienwiedergabe)*/
image.tab-icon-overlay[role="presentation"]{
 background-color: #fff !important;
 color: #00016e !important;
 margin-left: 25px !important;
}
/*Tab schließen*/
.tab-close-button[fadein]:focus-visible {
fill: white !important;
background: #E81123 !important;
}

Alles anzeigen

Ansonsten habe ich mal alles, was css heißt auskommentiert und der Rahmen ist trotzdem da:

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

Auch mit deiner Änderung bekomme ich diesen Rahmen nicht weg...

Nutzt du ein Theme, wenn ja, welches?
Ansonsten habe ich hier keinen Rahmen um den aktiven Tab

Nein. Alles Eigenkreationen mit Hilfe von diesem Forum. Hier ein Bild:

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

einen schwarzen Rahmen

Teste bitte:

CSS

/*Form und Hintergrundfarbe*/
.tabbrowser-tab {
 color: #fff !important;
}
.tab-background[selected] {
 background-color: #2b2c86 !important;
 border-color: #2b2c86 !important;
 box-shadow: none !important;
}
.tab-background:not([selected]) {
 background-color: #00016e !important;
}
/*:hover Hintergrund von nicht aktiven Tabs*/
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected], [multiselected]) {
 background-color: #15167a !important;
}

Alles anzeigen

Zwecks besserer Erkennung der Hg mal in gelb:

Der schwarze Rahmen ist immer noch da.

Zitat von 2002Andreas
Zitat von Firefox_94.0.1

einen schwarzen Rahmen.

Nur mal so.
Zeile 7 in deinem Code funktioniert so nicht:

Wennn du einen Rahmen haben wollest, dann:
CSS
.tab-background[selected]  {
  border: 3px solid #2b2c86 !important;
}
Und Zeile 15 - 17 hatte hier keine Funktion.
Alles anzeigen

Das war mein Versuch, den Rahmen über die "border"-Eigenschaft zu überschreiben, welcher aber nichts bewirkt hat. Auch mit deiner Änderung bekomme ich diesen Rahmen nicht weg...

Firefox_94.0.1

Ich nutze für die Tabs aktuell folgenden css-Code:

CSS

/*Form und Hintergrundfarbe*/
.tabbrowser-tab:not(image.tab-icon-overlay[role="presentation"]) {
     color: #fff !important;
}
.tab-background[selected]  {
 background: #2b2c86 !important;
 border-color: #2b2c86 !important;
}
.tab-background:not([selected])  {
 background: #00016e !important;
}
/*:hover Hintergrund von nicht aktiven Tabs*/
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected], [multiselected]) {
 background-color: #15167a !important;
 outline: 1px solid var(--tab-hover-outline-color);
 outline-offset: -1px;
 border-color: #15167a !important;
}

Alles anzeigen

Jetzt hat der aktive Tab aber seit heute? einen schwarzen Rahmen. Wie kann ich den entfernen? Die Ergänzung "background-color" mit der gleichen Farbe wie der Hintergrund hat nichts gebracht.

Firefox_94.0.1

Zitat von 2002Andreas

Zitat von Firefox_94.0.1

auch auf das Suchen nach Drop-Down unter about:logins

Meinst du hier

Dann muss ich wohl mal genauere Ursachenforschung betreiben. Wenn ich dann noch Hilfe brauche, melde ich mich wieder.

Firefox_94.0.1

Zitat von Sören Hentzschel

Was soll „kann nicht“ bedeuten? Eine Problembeschreibung wäre schon hilfreich, um sinnvoll darauf zu antworten.

Ich lande auf einer 404-forbidden Seite.

Beiträge von Firefox_94.0.1

CSS Änderungen bewirken nichts

CSS Änderungen bewirken nichts

CSS Änderungen bewirken nichts

CSS Änderungen bewirken nichts

CSS Änderungen bewirken nichts

CSS Änderungen bewirken nichts

Wikipedia neues Layout anpassen

Wikipedia neues Layout anpassen

Wikipedia neues Layout anpassen

Wikipedia neues Layout anpassen

schwarzer Rahmen um Tabs

schwarzer Rahmen um Tabs

schwarzer Rahmen um Tabs

schwarzer Rahmen um Tabs

schwarzer Rahmen um Tabs

schwarzer Rahmen um Tabs

schwarzer Rahmen um Tabs

schwarzer Rahmen um Tabs

:hover für Kontextmenü, Ordner in Favoritenleiste und Dropdown in Menüleiste

Log-in bei Camp Firefox im privaten Fenster nicht möglich