/* Bitte nehmen Sie keine Änderungen an dieser Datei vor! Passen Sie Ihre Wünschen in der CSS-Datei des gewählten Skins an. */ /* Sektionen */ section.bloqzSection {position: relative;} /* Bearbeitungsbuttons der Seite/Sektionen */ .bloqzButtons .buttons {float:left; background-color: #fafafa;height: 45px;border-radius: 4px;box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35);overflow: hidden;margin-right: 10px;} .bloqzButtons .buttons button {background-color: transparent;min-width: 50px;height: 45px;padding:0 15px;margin:0 0 0 -1px;border:none;color: #595959;position: relative;float: left;transition:background-color 0.15s, color 0.15s;cursor: pointer} .bloqzButtons .buttons button:hover {background-color: #141414;color: #fafafa} .bloqzButtons .buttons button:before {position: absolute;left:1px;top: 0;line-height: 46px;width: 100%;text-align: center;transform: scale(1);-ms-transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);font-size: 16px;} .bloqzButtons .buttons button:after {content:'';height:30px;width:1px;background-color:#C5C5C5;position: absolute; right: 0; top: 7px;transition:background-color 0.15s} .bloqzButtons .buttons button:hover:after {background-color: transparent} .bloqzButtons .buttons button:last-of-type:after {display: none} .bloqzButtons .buttons button[type="submit"]:hover {background-color: #1cc61c} .bloqzButtons .buttons button[type="reset"]:hover {background-color: #a00909} .bloqzButtons .buttonsToggle {float: left;} .bloqzButtons .buttonsToggle .bloqzToggler {float:left;background-color:#141414;width: 45px;height: 45px;border-radius: 4px;margin:0 15px 0 0;box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35);position: relative;cursor: pointer} .bloqzButtons .buttonsToggle .bloqzToggler:before {color: #fafafa;line-height: 46px;width: 45px; text-align: center;display: block;} .bloqzButtons .buttonsToggle .bloqzToggler:after {content: '';border: 6px solid transparent;border-left-color: #141414;width: 0px;height: 0px;display: block;position: absolute;right: -12px;top: 18px} .bloqzButtons .buttonsToggle .buttons {display: none;transition:opacity 0.15s;} .bloqzButtons .buttonsToggle:hover > .buttons {display: block} .bloqzButtonsInline {display: none;padding-bottom: 10px;position: absolute;z-index: 500} .bloqzButtonsInline:before {content: '';border: 6px solid transparent;border-top-color: #9a9a9a;width: 0px;height: 0px;display: block;position: absolute;left:50%;bottom:-3px;margin-left: -5px;} .bloqzButtonsInline:after {content: '';border: 6px solid transparent;border-top-color: #fafafa;width: 0px;height: 0px;display: block;position: absolute;left:50%;bottom:-2px;margin-left: -5px;} .bloqzButtonsInline.arrowRight:before {border-top-color: transparent;border-left-color: #9a9a9a;right: -12px;left: auto;bottom: 50%;margin-left: 0;margin-bottom: -3px;} .bloqzButtonsInline.arrowRight:after {border-top-color: transparent;border-left-color: #fafafa;right: -12px;left: auto;bottom: 50%;margin-left: 0;margin-bottom: -3px;} .bloqzButtonsInline.arrowLeft:before {border-top-color: transparent;border-right-color: #9a9a9a;left:-12px;bottom: 50%;margin-left: 0;margin-bottom: -3px;} .bloqzButtonsInline.arrowLeft:after {border-top-color: transparent;border-right-color: #fafafa;left:-12px;bottom: 50%;margin-left: 0;margin-bottom: -3px;} .bloqzButtonsInline.bloqzButtons .buttons {margin: 0} .bloqzButtonsPage {z-index: 410;position: fixed; left: 20px; bottom: 20px; } .bloqzButtonsPage[data-status="offline"] .bloqzToggler:before {color: #c83535}/* TODO: Offline-Seiten durch anderes Icon kennzeichnen? */ .bloqzButtonsSection {z-index: 400;position: absolute; right: 20px; top: 20px;} .bloqzButtonsSection .buttonsToggle .bloqzToggler {float: right;margin:0 0 0 15px; } .bloqzButtonsSection .buttonsToggle .bloqzToggler:after {border-left-color: transparent;border-right-color: #141414;right: auto;left: -12px} .bloqzButtonsSection .buttonsToggle .buttons {float: right;margin: 0 0 0 10px} /* Bearbeitungsbutton in Article-Liste */ .list-button-edit-site {position:absolute;left:10px;top:10px;z-index:100;height:40px;width:40px;border-radius:4px;box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35);overflow: hidden;background-color:#141414;color:#fafafa;border:0;margin:0px;font-size: 18px;line-height:40px;padding:0;opacity: 0;transition: all 0.2s;text-align:center;} .list-button-edit-site:before {top:2px;} *:hover > .list-button-edit-site {opacity:0.5;} *:hover > .list-button-edit-site:hover {opacity: 1} /* Darstellung und Bearbeitung von Texten */ text {display: block;} text > * {min-height: 1rem !important;} /* Mindesthöhe für Tags im pflegbaren Bereich, damit man innerhalb eines leeren Tags klicken kann */ *[data-contenteditable="true"] {/* outline: 1px solid #1cc61c; box-shadow: -3px 0px 0px rgba(28, 199, 28, 0.5);*/min-height: 30px;} *[contenteditable="true"] {outline: 1px solid rgba(28, 156, 199, 1);box-shadow: 0px 0px 4px rgba(28, 156, 199, 0.65);-webkit-nbsp-mode: space;} *[contenteditable="true"][data-edit="true"] {outline: 1px solid rgba(28, 199, 28, 1);box-shadow: 0px 0px 4px rgba(28, 199, 28, 0.65)} /* Editmask Open */ html.editMaskOpen body {overflow: hidden} /* zentriert, wie bei "Sektion hinzufügen" */ #bloqzEditorOverlay h1 {font-size:46px;line-height:140%;margin:-5px 0 25px 0;letter-spacing:0;font-weight:bold;} #bloqzEditorOverlay h2 {font-size:36px;line-height:140%;margin:-5px 0 25px 0;letter-spacing:0;font-weight:bold;} #bloqzEditorOverlay h3 {font-size:22px;line-height:140%;margin:-5px 0 25px 0;letter-spacing:0;font-weight:bold;} #bloqzEditorOverlay h4 {font-size:16px;line-height:140%;margin:-5px 0 25px 0;letter-spacing:0;font-weight:bold;} #bloqzEditorOverlay h5 {font-size:16px;line-height:140%;margin:-5px 0 25px 0;letter-spacing:0;font-weight:bold;} #bloqzEditorOverlay h6 {font-size:16px;line-height:140%;margin:-5px 0 25px 0;letter-spacing:0;font-weight:bold;} #bloqzEditorOverlay button {cursor: pointer} #bloqzEditorOverlay .bloqzHeadline {color:#757575;font-family:Helvetica, arial, sans-serif} #bloqzEditorOverlay .bloqzHeadline_var1 {text-align:center;} #bloqzEditorOverlay {text-align:left;display:none;position: fixed;left:0;top:0;z-index: 2000; width: 100%;height: 100%; background-color:#f3f5f7;box-sizing: border-box;font-family:Helvetica, arial, sans-serif !important;font-size: 14px;} #bloqzEditorOverlay .overlayOuter > header {color:#757575;position:absolute;z-index:2;height:62px;line-height:62px;left:0;right:0;top:0;padding:0 20px;background-color:#fff;font-weight:bold;text-transform:uppercase;/* border-bottom:1px solid #d5dbdf */} #bloqzEditorOverlay header .title {float:left;} #bloqzEditorOverlay .overlayInfo {margin-bottom:50px;} #bloqzEditorOverlay header .buttons {float:right;} #bloqzEditorOverlay header .buttons button {display:none;float:right; background: none; border: none; margin: 0; padding: 0; width: auto; overflow: visible;line-height:62px; font-size:20px; margin-left:5px;color:#757575; outline:none;text-transform:uppercase;} #bloqzEditorOverlay footer {color:#757575;position:absolute;z-index:2;height:62px;line-height:62px;left:0;right:0;bottom:0;padding:0 20px;background-color:#fff;font-weight:bold;text-transform:uppercase;/* border-top:1px solid #d5dbdf */} #bloqzEditorOverlay .overlayOuter {height:100%;margin:0 auto;width: 100%;box-shadow: 0px 1px 70px rgba(0, 0, 0, 0.1);box-sizing: border-box;position: relative;overflow:hidden;} #bloqzEditorOverlay .overlayInner {width: 100%;margin-top:62px;height:calc(100% - (2 * 62px));padding: 80px 100px;box-sizing:border-box;position: absolute;z-index: 1;overflow: scroll;} #bloqzEditorOverlay[data-closeEditmask="true"] button[data-type="closeEditmask"] {display:block;} #bloqzEditorOverlay[data-submitFunction="submitForm"] button[data-type="submitForm"] {display:block;} #bloqzEditorOverlay[data-closeEditmask="true"] button[data-type="closeEditmask"] {display:block;} #bloqzEditorOverlay[data-submitFunction="saveAndReload"] button[data-type="saveAndReload"] {display:block;} #bloqzEditorOverlay[data-submitFunction="saveDraftAndReload"] button[data-type="saveDraftAndReload"] {display:block;} /* Darstellung von Formularen im Overlay */ #bloqzEditorOverlay form {overflow: hidden;text-align:center;} #bloqzEditorOverlay form fieldset {display:inline-block;width:40%;box-sizing: border-box;margin:0;vertical-align:top;margin:0 20px;padding:0 25px 25px 25px;border:none;background:#fff;border-radius:4px;overflow:hidden;} #bloqzEditorOverlay form > * {text-align:left;} #bloqzEditorOverlay form legend {display:none;} #bloqzEditorOverlay form header {position:relative;margin:0 -25px 25px -25px;padding:20px 25px;background:#c6ccd2;font-size:22px; box-sizing:border-box;color:#fff} /* Darstellung von Eingabefeldern in Editor-Formularen */ .bloqzFormEditor .elementLabel, .bloqzFormEditor .elementLabel label {font-weight:600;font-size:16px;margin-bottom:5px;} .bloqzFormEditor .elementLabel span {font-weight:normal;} .bloqzFormEditor .formElement {position:relative;} .bloqzFormEditor .formElement input, .bloqzFormEditor .formElement select, .bloqzFormEditor .formElement textarea {font-size:14px;display:block;margin-bottom: 12px;background:#fff; border-radius:4px; border:1px solid #ddd !important; color: #878787;} .bloqzFormEditor .formElement .invalid {background-color: rgba(250, 67, 60, 0.3);} .bloqzFormEditor .formElementCheckbox {margin-bottom: 12px;} .bloqzFormEditor .formElementCheckbox label {position:relative;padding-left:25px;line-height: 26px;display: block;} .bloqzFormEditor .formElementCheckbox input[type="checkbox"] {position:absolute;left:0;top:7px;height:auto;} .bloqzFormEditor .formElement input {height:45px;line-height:45px; padding: 0 15px;} .bloqzFormEditor .formElement select {background:#fff; height:45px; line-height:45px; width: 100%; -webkit-appearance: none; font-weight: normal; font-size: 13px; padding-left: 15px; cursor: pointer; outline: none; z-index: 2; position: relative; padding-right: 55px;} .bloqzFormEditor .formElement input[type="radio"] {width:auto;border:none;background-color:transparent;height:auto;margin:0 5px 0 1px;display:inline-block} .bloqzFormEditor .formElement input[type="checkbox"] {width:auto;border:none;background-color:transparent;height:auto;margin:0 5px 0 1px;display:inline-block} /* TODO: Sinnvoll gestalten! Wird z.B. verwendet beim Anlegen neuer Seiten */ .bloqzFormEditor .formElement *[readonly="readonly"] {opacity: 0.7} .bloqzFormEditor .formElementSelect:before {content: ''; position: absolute; z-index: 5; right: 15px; top: 7px; border: 5px solid transparent; border-bottom-color: #878787;} .bloqzFormEditor .formElementSelect:after {content: '';position: absolute;z-index: 5;right: 15px;top: 20px;border: 5px solid transparent;border-top-color: #878787;} .bloqzFormEditor .formElementUploadImage {width: 100%;height: 0px;padding-bottom:40%;background-color: #eceff4; margin-bottom:15px; border-radius:4px;background-size: cover; background-position:center center;} .bloqzFormEditor .formElementUploadImage input[type="file"] {position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 0;z-index: 4;cursor: pointer} .bloqzFormEditor .formElementUploadImage button {position: absolute;right: 4px;top: 4px;z-index: 5;border:none;width:30px;height:30px;padding:0;box-sizing:border-box;border-radius:4px;background:#fff;color:#777777;transition: 0.3s all} .bloqzFormEditor .formElementUploadImage button:hover {background-color:#a00909;color: #FFF;} .bloqzFormEditor .formElementUploadImage button:before {font-size: 16px;transform: scale(1);-ms-transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1)} .bloqzFormEditor .formElementUploadImage .progress {display:none;position: absolute;left: 0;top: 75%;margin:-5px 0 0 25%;width:50%;height: 10px;z-index: 5;border-radius: 10px;border:2px solid white;overflow: hidden} .bloqzFormEditor .formElementUploadImage .progress > div {background-color: #44de44;height: 10px;width:0%;} .bloqzFormEditor .formElementUploadImage:after {content:"\e939";font-family:bloqz;font-size:60px;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);left:50%;top:50%;position:absolute;color:#d4d7dc;} .bloqzFormEditor .formElementUploadImages {margin: 0 -5px;overflow: hidden} .bloqzFormEditor .formElementUploadImages .thumbnail {float: left; width: 100px; height: 100px; margin: 5px;background-color: #eceff4;background-size: cover; background-position:center center; background-repeat: no-repeat; position: relative;-webkit-user-select:none;-ms-user-select:none;-webkit-user-select:none;-moz-user-select:none;cursor:default;border-radius:4px;border: 1px solid #eceff4;} .bloqzFormEditor .formElementUploadImages .thumbnail button {position: absolute;left: 4px;top: 4px;z-index: 5;border:none;width:30px;height:30px;padding:0;box-sizing:border-box;border-radius:4px;background:#fff;color:#777777;transition: 0.3s all} .bloqzFormEditor .formElementUploadImages .thumbnail button:hover {background-color:#a00909;color: #FFF} .bloqzFormEditor .formElementUploadImages .thumbnail button:before {font-size: 16px;transform: scale(1);-ms-transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1)} .bloqzFormEditor .formElementUploadImages .thumbnail .progress {position: absolute;left: 50%;top: 75%;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);width:50%;height: 10px;z-index: 5;border-radius: 10px;border:2px solid white;overflow: hidden} .bloqzFormEditor .formElementUploadImages .thumbnail .progress > div {background-color: #44de44;height: 10px;width:0%;} .bloqzFormEditor .formElementUploadImages .uploader {float: left; width: 100px; height: 100px; margin: 5px;background-color: #eceff4;position: relative;border-radius:4px;} .bloqzFormEditor .formElementUploadImages .uploader input[type="file"] {position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 0;z-index: 4;cursor: pointer} .bloqzFormEditor .formElementUploadImages .uploader:after {content:"\e939";font-family:bloqz;font-size:30px;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);left:50%;top:50%;position:absolute;color:#d4d7dc;} .bloqzFormEditor .formElementUploadImages .thumbnail.not-found:after {content:"\e91b";font-family:bloqz;font-size:30px;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);left:50%;top:50%;position:absolute;color:#d4d7dc;} .bloqzFormEditor .formElementUploadImages input[type="file"] {cursor:pointer} /* Sektions Bibliothek */ #sectionLibrary {margin-right:-40px} #sectionLibrary .section {margin:0 0 40px 0;transition:all 0.15s;width:20%;float:left;} #sectionLibrary .section:nth-of-type(5n+1) {clear:left;} #sectionLibrary .section .inner {margin-right:40px;text-align:center;} #sectionLibrary .section .sectionThumbail {box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35);margin:0 0 10px 0} #sectionLibrary .section .sectionName {font-weight:600;color:#757575} #sectionLibrary .section .sectionDescription {display:none} #sectionLibrary .section:hover .inner .sectionThumbail {cursor: pointer;} #sectionLibrary .section .sectionThumbail img {border: none;max-width: 100%;height: auto;margin: 0px;vertical-align: middle;} #sectionLibrary .section.selected .sectionThumbail {position:relative} #sectionLibrary .section.selected .sectionThumbail:after {content:"\e90a";font-family:bloqz;text-align:center;display:block;position:absolute;width:30px;height:30px;line-height:30px;background:#2bb24c;color:#fff;right:10px;bottom:10px;box-sizing:border-box;border-radius:50%;} #sectionLibrary .section[data-section-status="off"] {opacity: 0.3} /* Fehlermeldungen */ .qMessageError {background-color: #fce4e4;border: 1px solid #fcc2c3;padding: 20px 30px;margin:10px auto;color:#cc0033;font-size:12px;line-height:16px;font-family: Helvetica, Arial, sans-serif;max-width: 90vw;box-sizing: border-box;} @media only screen and (max-width: 1900px){ #sectionLibrary .section {width:25%;} #sectionLibrary .section:nth-of-type(5n+1) {clear:none;} #sectionLibrary .section:nth-of-type(4n+1) {clear:left;} } @media only screen and (max-width: 1400px){ #sectionLibrary .section {width:33.33%;} #sectionLibrary .section:nth-of-type(4n+1) {clear:none;} #sectionLibrary .section:nth-of-type(3n+1) {clear:left;} #bloqzEditorOverlay .overlayInner {padding:40px;} } @media only screen and (max-width: 980px){ #sectionLibrary .section {width:50%;} #sectionLibrary .section:nth-of-type(3n+1) {clear:none;} #sectionLibrary .section:nth-of-type(2n+1) {clear:left;} } @media only screen and (max-width: 767px){ #bloqzEditorOverlay #formEditmaskSection fieldset {width:100%; float:none; margin-bottom:20px; margin-left: 0; margin-right: 0} } @media only screen and (max-width: 540px){ #sectionLibrary {margin-right:0} #sectionLibrary .section .inner {margin-right:0} #sectionLibrary .section {width:100%;} #sectionLibrary .section:nth-of-type(2n+1) {clear:none;} #bloqzEditorOverlay .overlayInner {padding:20px;} } /* 2025-08-23 07:22:00 source: /bloqz/ui/styles/ui.css */