Syntaxhervorhebung / Syntax-Highlighting

default.css StyleSheet (33,52 kByte) 23.05.2021 17:15
/* coding: utf-8 */
/*! Created by: Udo Schmal | https://www.gocher.me/ */
@font-face {
  font-family:'FontAwesome'; font-weight:normal; font-style:normal; font-display:swap;
  src:url('../fonts/fontawesome-webfont.eot');
  src:url('../fonts/fontawesome-webfont.eot#iefix') format('embedded-opentype'),
      url('../fonts/fontawesome-webfont.woff2') format('woff2'),
      url('../fonts/fontawesome-webfont.woff') format('woff'),
      url('../fonts/fontawesome-webfont.ttf') format('truetype'),
      url('../fonts/fontawesome-webfont.svg#fontawesomeregular') format('svg');
}

div, footer, form {padding:0; margin:0;}
object, a {outline:none;}
canvas {border:1px solid #000;}
strong {font-weight:bold;}
img {border:none;}
td, th {vertical-align:top;}

body {-webkit-font-smoothing:antialiased;}
h1, h2, h3, h4, h5, h6, p, li, dl, dt, dd, label, legend, td, th, input, button, div, header, footer, form, figure, details, summary {font-family:Arial,sans-serif;}
tt, pre, code {font-family:Consolas,monospace;}
h1, h2, h3, h4, h5, h6, p.description, label, legend, dt, summary, span.label {font-weight:bold;}
h4:first-child, h5:first-child, h6:first-child, p:first-child {margin-top:0;}
h1, h2, h3, h4, h5, a:link, a:visited, a:active, a:before, p.description, legend, span.found {color:#832025;}
sub, sup {font-size:75%; position:relative; vertical-align:baseline;}
sup {top:-0.5em;}
sub {bottom:-0.25em;}
p {margin-bottom:0;}
table {border-collapse:collapse; border-spacing:0;}
li, dd, blockquote {padding-top:0.25em; padding-bottom:0.25em;}
hr {border-bottom:none; border-left:none; border-right:none; border-top:1px solid #832025; height:1px; clear:both; text-align:center;}
fieldset {border:1px solid #832025; margin-top:5px;}

ul.dot {list-style-type:none; display:table;}
ul.dot > li {position:relative;}
ul.dot > li::before {position:absolute; left:-1.1em; content:"\2022"; font-weight:bold; color:#832025;}

ol {margin-left:1em; padding-left:1em;}
ol.counter {margin:0; padding-left:3.5em; list-style-type:none; counter-reset:css-counters 0;}
ol.counter > li {position:relative; font-weight:bold;}
ol.counter > li * {font-weight:normal;}
ol.counter > li:before {position: absolute; left:-3.5em; counter-increment:css-counters; content:counters(css-counters,".")" ";}
ol.counter ol.counter {padding-left:0;}
ol.counter ol.counter > li {font-weight:normal;}

.break {page-break-after:always;}
.pagebreak {page-break-before:always;}
.nowrap {white-space:nowrap;}
.clear {clear:both;}
.clearfix::after {content:""; display:table; clear:both;}
.source {font-style:italic;}
.alert {color:red; font-weight:bold;}
p.hyphenate {-ms-word-wrap:break-word; word-wrap:break-word; -webkit-hyphens:auto; -ms-hyphens:auto; hyphens:auto;}
p.info {clear:both; text-align:right; font-variant:small-caps; margin-right:20px;}
pre.spam {color:red;}
ul.float {margin-left:0; padding-left:1.5em; overflow:hidden; height:auto; display:table;}
span.marker {background-color:yellow;}
.hidden, .accessibility {display:none !important;}
input[type="button"], input[type="submit"], select {cursor:pointer;}

span.cmsButton {
  display:inline-block; margin:0 2px 0 0; padding:4px 2px; min-width:18px;
  font:normal normal normal 14px/1 FontAwesome; color:#832025; background-color:#fff;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-align:center; border:1px solid #832025; border-radius:2px;
}

/*REGION ' - boxes - '*/
details {margin-top:5px;}
div.boxLeft, div.boxRight, div.boxFull, div.boxCenter/*, div.boxRelated*/ {box-sizing:border-box; padding:5px; border:1px solid #832025;}
div.boxLeft {float:left; margin:5px 5px 0 0; width:49%;}
div.boxRight {float:right; margin:0 0 5px 5px; width:49%;}
div.boxFull h3, div.boxLeft h3 {margin:0; padding:2px 0;}
div.box {border:1px solid #832025;}

/*REGION ' - images - '*/
img.right {float:right; margin-left:15px; padding:5px;}
img.left {float:left; margin-right:15px; padding:5px;}
div.imageLeft {float:left; margin:0 11px 4px 0;}
div.imageRight {float:right; margin:0 0 4px 11px;}
div.imageRight::after {content:""; display:table; clear:both;}
div.boxFull, div.imageFull {clear:both; margin:0 0 4px 0;}
div.boxCenter, div.imageCenter {clear:both; text-align:center; margin:0 auto 4px auto;}
div.imageLeft p, div.imageRight p, div.imageFull p, div.imageCenter p {font-size:90%; margin:4px 0 0 0;}

/*REGION ' - tables - '*/
table.grid {border:1px solid #386b5a; padding:0; margin:5px 0; empty-cells:show;}
table.grid th, table.grid td {border:1px solid #000; padding:3px;}
table.grid th {background-color:#832025; color:#fff;}
table.grid td {background-color:#fffbf5;}
table.grid th a {color:#fff;}

table.noBorder {border-style:none; border-width:0; margin-bottom:0.8em; border:medium none; margin:0; padding:0;}
table.noBorder td, table.noBorder th {border-style:none; border-width:0; padding:3px;}

/*REGION ' - symbols - '*/
a.filePDF::before, a.fileDOC::before, a.fileXLS::before, a.filePPT::before, a.fileZIP::before, a.fileELSE::before, a.code::before,
a.email::before, a.web::before, a.phone::before, span.fax::before, a.mobile::before, a.sms::before, a.whatsapp::before,
a.googleplus::before, a.instagram::before, a.vcard::before {
  font:normal normal normal 14px/1 FontAwesome; width:18px; display:inline-block; text-decoration:none;}
span.fontawesome {font:normal normal normal 14px/1 FontAwesome;}
a.filePDF::before {content:"\f1c1";}
a.fileDOC::before {content:"\f1c2";}
a.fileXLS::before {content:"\f1c3";}
a.filePPT::before {content:"\f1c4";}
a.fileZIP::before {content:"\f1c6";}
a.fileELSE::before {content:"\f016";}
a.code::before {content:"\f1c9";}
a.email::before {content:"\f003";}
a.web::before {content:"\f0ac";}
a.phone::before {content:"\f095";}
span.fax::before {content:"\f02f";}
a.mobile::before {content:"\f10b";}
a.googleplus::before {content:"\f0d5";}
a.instagram::before {content:"\f16d";}
a.sms::before {content:"\f0e5";}
a.whatsapp::before {content:"\f232";}
a.vcard::before {content:"\f2bc";}

/*REGION ' - form - '*/
label {width:100px; margin:3px 5px 0 0; text-align:left;}
label.inlinecheck {display:inline-block; width:230px; text-align:left; float:inherit;}
input[type="checkbox"], input[type="radio"] {vertical-align:baseline;}
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="submit"], button, textarea {
  box-sizing:border-box; margin:3px 0; max-width:100%; border-radius:4px; padding:5px; font-family:inherit;
  font-size:1.2em;
}
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="submit"], textarea {
  color: #333; background-color:#fff; width:300px; border:1px solid #C8CED0;
}
form select {
  width:300px; max-width:100%; font:inherit; padding:0.5em 3.5em 0.5em 1em; margin:5px 0; box-sizing:border-box;
  border:1px solid #C8CED0; border-radius:4px;
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  background:url("data:image/svg+xml;utf8,<svg fill='black' height='24' width='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M 0,0 L 0,23 L 1,23 L 1,0 Z'/><path d='M0 0h24v24H0z' fill='none'/></svg>") white no-repeat 100% 6px;
}
form button, form input[type="submit"] {color:#fff; width:auto; border:1px solid #832025; background-color:#832025; cursor:pointer;}
form button[type="submit"], form input[type="submit"] { width:300px;}
div.buttons {margin-top:10px;}

#content-form {clear:both; margin:0 auto; width:100%;}
#content-form form {min-width:310px; max-width:380px; margin:0 auto;}
#content-form .boxes {width:auto;}
#content-form .required {font-weight:bold;}
#content-form #edit img {border:0 !important;}
#content-form br {clear:both;}
#content-form h6 {margin:5px 0 0 0;}
#content-form img {border:0;}
#content-form p select {float:none;}
#content-form p input {width:auto;}

/*REGION ' - Gallery - '*/
div.gallery::after {content:""; display:block; clear:both;}
figure.galleryImage {position:relative; width:104px; height:104px; float:left; margin:0 1px 1px 0; overflow:hidden;}
figure.galleryImage a {display:block; border:1px solid #832025; width:100px; height:100px; background-color:#000; text-align:center; line-height:98px; overflow:hidden;}
figure.galleryImage img {vertical-align:middle; border:none; max-height:100px; max-width:100px;}

/*REGION ' - Blog - '*/
div.blogItem {margin-top:10px; clear:both; border-bottom:1px solid #c89c9e;}

/*REGION ' - Tabsheets - '*/
ul.tabs, ul.tabsheets {position:relative; margin:0; width:100%; list-style:none;}
ul.tabs {padding-left:0;}
ul.tabsheets.running > li {display:none;}
ul.tabsheets .sheet-header {display:none;}
ul.tabs > li {position:relative; float:left; display:block; color:#666; font-weight:bold; border:1px solid #ccc; border-bottom:none; border-radius:4px 4px 0px 0px; padding:3px 5px 2px; top:2px; z-index:1; background-color:#eee;}
ul.tabs > li:not(.active):hover {background-color:#fff; cursor:pointer;}
ul.tabs > li.active {padding:4px 5px 3px; top:1px; z-index:10; background-color:#fff;}
ul.tabsheets {padding:0 0 10px 0; clear:both;}
ul.tabsheets > li {padding:10px 10px 10px 10px; border:1px solid #ccc; border-radius:0 5px 5px 5px;}
ul.tabsheets > li::after {content:"."; clear:both; display:block; visibility:hidden; height:0;}
ul.tabsheets.running > li.active {display:block;}

/*REGION ' - Accordion - '*/
ul.accordion {position:relative; margin:0; padding:0; list-style:none; list-style-type:none;}
ul.accordion > li {margin:0 0 1px 0; padding:7px 10px 1px 10px; border:1px solid #C8CED0; background-color:#fff; border-radius:4px; max-height:24px; overflow:hidden; transition:max-height 0.25s ease-out;}
ul.accordion > li:not(.active):hover {cursor:pointer;}
ul.accordion > li.active {height:auto; max-height:1200px; padding-bottom:7px; box-sizing:border-box; transition:max-height 0.25s ease-in; overflow:hidden;}
ul.accordion > li .sheet-header {display:flex; flex-wrap:wrap; justify-content:space-between; color:#666; font-weight:bold;}
ul.accordion > li .sheet-header::after{content:"\f078"; font-family:FontAwesome;}
ul.accordion > li.active .sheet-header::after{content:"\f141"/*"\f077"*/;}

/*REGION ' - Tree - '*/
ul.tree, ul.tree ul {list-style:none; list-style-type:none; margin:0; padding:0;}
ul.tree li {padding:0; margin:0;}
ul.tree ul {display:none;}
ul.tree ul.visible {display:block;}
ul.tree .focus {background-color:navy; color:#fff;}
ul.tree .nextPlus, ul.tree .lastPlus, ul.tree .nextMinus, ul.tree .lastMinus,
ul.tree .cont, ul.tree .next, ul.tree .blank, ul.tree .last {float:left; display:block; width:18px; height:18px; background:transparent url(images/branch.png) no-repeat 0 0; margin:0 2px 0 0; padding:0}
ul.tree .blank {background-position:0 0;}
ul.tree .cont {background-position:-18px 0;}
ul.tree .next {background-position:-36px 0;}
ul.tree .last {background-position:-54px 0;}
ul.tree .nextPlus {background-position:-72px 0; cursor:pointer;}
ul.tree .lastPlus {background-position:-90px 0; cursor:pointer;}
ul.tree .nextMinus {background-position:-108px 0; cursor:pointer;}
ul.tree .lastMinus {background-position:-126px 0; cursor:pointer;}

/*REGION ' - Code - '*/
figure.code {border:1px solid #C5DBF7; width:100%; margin:0;}
figure.code figcaption {padding:5px; border-bottom:1px solid #C5DBF7; margin:0;}
pre {color:black; padding:5px; margin:0; position:relative; white-space:pre-wrap; word-wrap:break-word;}

/* SYN HTML, JS, CSS */
code {font-family:Consolas,monospace; overflow:scroll;}
code span.comment, code span.commentvalue {color:#077; font-style:italic;}
code span.directive, code span.conditionalcomment, code span.conditionvalue {color:#077; font-weight:bold;}
code span.important {color:#f00; font-weight:bold;}
code span.symbol, code span.operator, code span.literal {color:#000;}
code span.object, code span.class {color:#b4c; font-weight:bold;}
code span.method, code span.identifier {color:#d4a;}
code span.pi, code span.doctype, code span.tag, code span.tagname, code span.keyword {color:#008;}
code span.pi, code span.doctype, code span.tagname, code span.keyword {font-weight:bold;}
code span.attrname, code span.name {color:#00f;}
code span.attrvalue, code span.value, code span.string, code span.number {color:#800;}
code span.rule {color:#f0d;}
code span.section {color:#f0d;}
code span.definition {color:#f0d;}
code span.id {color:#fd0;}
code span.pseudo {color:#09f;}
code span.function {color:#b0f;}
code span.param {color:#b0f;}
code span.asm, code span.cdata {color:#f0f;}
object.sample, iframe {width:100%; border:1px solid #FFFF50; background-color:#FFFFC0;}

/*REGION ' - search - '*/
div.rankbg, div.rank {font:normal normal normal 14px/1 FontAwesome;}
div.rankbg {position:relative; width:65px;}
div.rank {position:absolute; top:0; left:0; color:#832025; overflow:hidden;}
div.rankbg::after {content:"\f006\f006\f006\f006\f006";}
div.rank::after {content:"\f005\f005\f005\f005\f005";}
span.found {font-weight:bold;}
table#searchResults tr.row1 td {padding-top:10px;}
table#searchResults tr.row2 td {padding-top:0;}
table#searchResults tr.row2 td {padding-bottom:10px;}

/*REGION ' - youtube - '*/
div.youtube {position:relative; background-repeat:no-repeat; background-size:cover; background-position:center; width:100%; height:0; padding-top:56.25%; margin:5px;}
div.youtube .title, div.youtube .text {position:absolute; left:10%; right:10%; font-family:Arial, Helvetiva, sans-serif; text-align:center;}
div.youtube .title {top:15px; color:#fff; text-shadow:1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;}
div.youtube .text {bottom:5px; background-color: #fff; color:red; padding:5px; text-shadow:1px 1px 2px white, 0 0 1em white, 0 0 0.2em white;}
div.youtube .play {background:#333; border-radius:50% / 10%; color:#fff; font-size:2em; height:1.5em; width:2em; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); cursor:pointer;}
div.youtube .play:hover {background:red;}
div.youtube .play::before {background:inherit; border-radius:5% / 50%; bottom:9%; content:""; left:-5%; position:absolute; right:-5%; top:9%;}
div.youtube .play::after {border-style: solid; border-width:1em 0 1em 1.732em; border-color:transparent transparent transparent rgba(255, 255, 255, 0.75);
  content:" "; font-size:0.35em; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:0;}
#overlay {z-index:100; position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.8);}
#popup-content {position:absolute; top:50%; left:50%; max-width:100%; transform:translate(-50%, -50%);}
.popup-close {position:absolute; top:30px; right:30px; cursor:pointer;}
.popup-close::before {display:inline-block; content:"\00d7"; color:#fff; font-size:42px; font-weight:bold; text-shadow:1px 1px 2px black, 0 0 1em black, 0 0 0.2em black; cursor:pointer;}

/*REGION ' - external - '*/
.external {position:relative; background-repeat:no-repeat; background-size:cover; background-position:center; width:640px; width:100%; height:0; padding-top:56.25%; margin:5px;}
.external iframe {width:100%; height:100%; border:0; position: absolute; top: 0;}
.external .text {font-family:Arial, Helvetiva, sans-serif; text-align:center; position:absolute; top:45px; width:100%; color:red; text-shadow:1px 1px 2px white, 0 0 1em white, 0 0 0.2em white;}
.external .play {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); margin-top:-32px; border-radius:50%; background-color:#a61315; border:16px solid #e2442f; width:16px; height:16px;}
.external .play::after {position:absolute; content:''; width:0px; height:0px; bottom:-60px; left:-12px; border:20px solid transparent; border-top:34px solid #e2442f;}
.external .play:hover {background-color:#fff; cursor:pointer; border-color:red;}
.external .play:hover::after {border-top-color:red;}
.external .hidden {display:none;}

#footer-container {position:relative; width:100%;}
#copyright p {text-align:right;}

/*REGION ' - smooth scroll - '*/
@media screen {
  html {scroll-behavior:smooth;}
  section {scroll-snap-align:start;}
  *[id] {scroll-margin-top:50px; scroll-snap-margin-top:50px;/*safari*/}
}
@media screen and (min-width:768px) {
  *[id] {scroll-margin-top:80px; scroll-snap-margin-top:80px;/*safari*/}
}

/*REGION ' - sticky - '*/
@media screen {
  #toolbar {position:sticky; position:-webkit-sticky; top:0;}
  #toolbar.sticky {position:fixed;}
}
@media screen and (min-width:768px) {
  #nav-container {position:sticky; position:-webkit-sticky; top:40px;}
  #nav-container.sticky {position:fixed;}
}

@media screen {
  #content-nav {clear:both;}
  html, body {height:100%; margin:0; padding:0;}
  body {overflow-y:auto; position:absolute; top:0; bottom:0; left:0; right:0;}
  .message {margin-bottom:5px; padding:1px; border:1px solid #832025; background-color:#ffeccb;}
  .message h5 {margin:0; padding:5px;}
  .message p {padding:5px;}
  .sessionValues {margin-bottom:5px; height:150px; overflow:auto;}
  #header {width:100%; margin:0; padding:0 0 30%; position:relative; background-position:center center; background-size:cover;}
  #sitelogo {position:absolute; top:40px; left:40px; width:20%;}
  #sitelogo img{width:100%; height:auto;}
  #page-container, #main-container, #boxes-container {position:relative;}
  #page-container::after, #content-container::after, #content::after, #nav-container::after, #boxes-container::after, #footer::after, footer::after {position:relative; content:""; display:table; clear:both;}
  #content {width:100%;}

  /*REGION ' - toolbar - '*/
  #toolbar {z-index:999; height:40px; width:100%; background:#832025; white-space:nowrap; border-bottom:1px solid #fff;}
  #toolbar-left {display:inline-block;}
  #functions {display:inline-block;}
  #toolbar-right {float:right;}
  #toolbar a, #toolbar span, #toolbar button {position:relative; display:inline-block; margin:2px; padding:9px 8px; font:normal normal normal 16px/1 FontAwesome; color:#fff; text-decoration:none; cursor:pointer;}
  #toolbar button {width:32px;}
  #toolbar a.cmd-install{display:none;}
  #toolbar a::before {color:#fff;}
  #toolbar a.cmd-home::before {content:"\f015";}
  #toolbar .cmd-user::before {content:"\f007";}
  #toolbar .cmd-analyze::before {content:"\f201";}
  #toolbar .cmd-dropbox::before {content:"\f16b";}
  #toolbar .cmd-protected::before {content:"\f132";}
  #toolbar .cmd-notvalid::before {content:"\f056";}
  #toolbar .cmd-notfound::before {content:"\f06a";}
  #toolbar .cmd-imprint::before {content:"\f003";}
  #toolbar .cmd-refresh::before {content:"\f021";}
  #toolbar a.cmd-login::before {content:"\f090";}
  #toolbar a.cmd-logoff::before {content:"\f08b";}
  #toolbar a.cmd-history::before {content:"\f1da";}
  #toolbar a.cmd-sendlink::before {content:"\f1fa";}
  #toolbar a.cmd-download::before {content:"\f019";}
  #toolbar a.cmd-install::before {content:"\f019";}
  #toolbar a.cmd-calendar::before {content:"\f073";}
  #toolbar button.cmd-search::before {content:"\f002";}
  #toolbar span.cmd-login::before {content:"\f090";}
  #toolbar span.cmd-login.active::before {content:"\f08b";}
  #toolbar span.cmd-contact::before {content:"\f044";}
  #toolbar span.func-btn {margin-right:12px;}
  #fullscreenButton::before {content:"\f065"}
  #fullscreenButton.active::before {content:"\f066"}
  #searchfrm {float:left; margin:0 20px;}
  #searchfrm input.searchfield {box-sizing:border-box; float:left; border:1px solid #832025; border-radius:5px; padding:4px 2px; font-family:Arial,sans-serif; font-size:1.2em; width:160px;}

  .communication {position:fixed; z-index:950; top:41px; right:10px; width:300px; background-color:#fff; padding:25px 5px 5px; box-sizing:border-box; border: 1px solid #832025;}

  /*REGION ' - content-nav - '*/
  #content-nav {width:100%; clear:both;}
  #content-nav ul {list-style-type:none; border-width:3px 1px 1px; border-color:#832025; border-style:solid; background:#ffeccb; margin:5px; padding:0 5px 0 25px;}
  #content-nav ul ul {border:none; margin:0;}
  #content-nav h5, #content-nav h6 {margin:0; padding:0; color:#832025;}
  #content-nav ul > li::before {position: absolute; left:-1.1em; content:"\2022"; font-weight:bold; color:#832025;}
  #content-nav ul li {position:relative; padding-bottom:5px; clear:both;}
  #content-nav ul li li {padding-bottom:0;}

  /*REGION ' - breadcrumbs - '*/
  #breadcrumbs {position:relative; margin:0 0 13px;}
  ul.breadcrumbs, #breadcrumbs ul {list-style:none outside none; margin:0; padding:0; width:100%; color:#832025; white-space:nowrap; content:""; display:table; clear:both;}
  ul.breadcrumbs li , #breadcrumbs ul li {float:left; display:inline; padding:0 0 0 5px;}
  ul.breadcrumbs a, #breadcrumbs ul a {text-decoration:none; white-space:nowrap; margin:0 6px; line-height: 24px;}
  ul.breadcrumbs li::before, #breadcrumbs li::before {content:"ยป";}
  #breadcrumbs ul li:first-child:before {content:"";}
  #breadcrumbs ul li a#breadcrumbs-home::before {font:normal normal normal 18px/1 FontAwesome; content:"\f015";}
  #breadcrumbs ul a:hover {text-decoration:underline;}

  /*REGION ' - gallery overlay - '*/
  #overlay {position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; background-color:#222; z-index:999;}
  #imagebox {height:100%; position:absolute; top:0;}
  #image, #temp {position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; max-width:100%; max-height:100%; width:auto; height:auto;}
  #caption {position:absolute; left:36px; right:36px; bottom:0; margin:0;}
  #caption p {position:relative; margin:0 auto; padding:0; text-align:center; opacity:0.5; background-color:#222; color:#999;}
  #overlay .previous, #overlay .next, #overlay .fullscreen, #overlay .close, #overlay .slideshow, #overlay .download {
    position:absolute; display:block; cursor: pointer; color:#999; text-align:center; font:normal normal normal 35px/1 FontAwesome;}
  #overlay .previous {left:10px; top:50%;}
  #overlay .previous::before {content:"\f0a8";}
  #overlay .next {right:10px; top:50%;}
  #overlay .next::before {content:"\f0a9";}
  #overlay .close {right:10px; top:10px;}
  #overlay .close::before {content:"\f057";}
  #overlay .slideshow {left:10px; bottom:10px;}
  #overlay .slideshow::before {content:"\f01d";}
  #overlay .slideshow.active::before {content:"\f045";}
  #overlay .fullscreen {left:10px; top:10px;}
  #overlay .fullscreen::before {content:"\f065";}
  #overlay .fullscreen.active::before {content:"\f066";}
  #overlay .hd {position:absolute; display:block; font-family:Arial,sans-serif; text-decoration:none; background-color:#999999; text-align:center; font-weight:bold;
    right:10px; bottom:55px; padding:7px; color:#222222; border-radius:7px;}
  #overlay .hd::before {content:" HD ";}
  #overlay .hd.active::after {position:absolute; content:""; left:3px; top:50%; right:3px; border-top:2px solid; border-color:inherit; transform:rotate(-15deg);}
  #overlay .download {right:10px; bottom:10px;}
  #overlay .download::before {content:"\f019";}

  /* article downloads */
  .articleButtons {margin:0; padding:0 0 0 10px; float:right;}
  .articleButtons a, .articleButtons span {float:left; padding:0 2px; text-decoration:none; color:#832025; margin:2px 6px; text-align:center;
    display:block; height:16px; font:normal normal normal 18px/1 FontAwesome; margin-right:5px; cursor: pointer;}
  .articleButtons a.file-pdf::before {content:"\f1c1";}
  .articleButtons a.file-rtf::before {content:"\f1c2";}
  .articleButtons a.file-tex::before {content:"\f016";}
  .articleButtons a.file-html5::before {content:"\f13b";}
  .articleButtons a.file-archive::before {content:"\f1c6";}
  .articleButtons a.file-txt::before {content:"\f0f6";}
  .articleButtons .print::before {content:"\f02f";}

  /* HiRes Image Zoom */
  a.hires {position:relative; display:block;}
  a.hires img {position:relative;}
  span.zoom {display:block; margin:0; border:0; padding:4px; width:20px; height:20px;
    font:normal normal normal 16px/1 FontAwesome; background:#80827F; color:#fff;
    text-decoration:none; text-align:center; opacity:0.7; border-radius:5px;
    position:absolute; top:4px; left:3px;}
  span.zoom::before {content:"\f00e";}
  a.hires:hover span.zoom {background:#832025;}

  /*REGION ' - social bookmarks - '*/
  #socialbookmarks {position:relative; width:100%; padding:5px 0; clear:both;}
  #socialbookmarks span.label {float:left; color:#832025; margin-right:10px;}
  #socialbookmarks span.splitter {float:left; margin:0 2px; width:0; height:32px; display:inline-block; border-right:1px dashed silver;}
  #socialbookmarks span.socialbookmark {color:#fff; background-color:#832025; font:normal normal normal 26px/1 FontAwesome; text-align:center; border-radius:8px; width:38px; margin:0 4px 2px 0; padding:8px 3px; display:inline-block; cursor:pointer;}
  #socialbookmarks span.twitter::before {content:"\f099";}
  #socialbookmarks span.facebook::before {content:"\f09a";}
  #socialbookmarks span.xing::before {content:"\f168";}
  #socialbookmarks span.whatsapp::before {content:"\f232";}
  #socialbookmarks span.native::before {content:"\f1e0";}
  #socialbookmarks span.pinterest::before {content:"\f0d2";}
  #socialbookmarks span.email::before {content:"\f003";}

  /*REGION ' - boxes - '*/
  #boxes-container {position:relative; width:100%;}
  div.box-area {position:relative;}
  div.box, div.box-head {position:relative;}
  .box-head {background-color:#832025;}
  div.box-head h4 {margin:0; padding:2px 5px 2px 12px; color:white; font-weight:bold;}
  div.box-content {padding:8px; background-color:#ffeccb; position:relative;}
  div.box-content table, div.box-content tr, div.box-content td {margin:0; padding:0;}
  div.box-content li {font-weight:normal; margin-bottom:0; margin-top:0;}
  div.box-content ol, div.box-content ul {padding-bottom:0; padding-top:0;}
  div.box-content form label {display:none;}
  div.box-content a:link, div.box-content a:visited, div.box-content a:active {color:#832025;}
  div.box-content span.value {display:inline-block; padding-left:10px;}
  div.person {margin:0; padding:10px; border:1px solid #C8CED0; background-color:#fff; border-radius:4px;}
  div.person::after{position:relative; content:""; display:table; clear:both;}
  p.person-info {display:table; float:left; min-width:200px;}

  /*REGION ' - footer - '*/
  #footer-container {margin-top:10px; padding:5px; background-color:#832025; box-sizing:border-box;}
  #footer * {color:white;}
  #footer a {text-decoration:none;}
  #footer-nav ul {margin:0; list-style:square;}
  #footer-nav ul li {float:left; margin:0 15px; padding-left:5px;}
  #copyright {clear:both; float:right; width:auto; margin:10px 15px;}

  table td.label {text-align:right; width:8em; font-weight:bold;}
  div.list {width:880px; max-height:470px; overflow:auto; background-color:#fbfbfa; border:1px solid #b0aaa5;}
  div.checklist {width:350px; max-height:250px; overflow:auto; background-color:#fbfbfa; border:1px solid #b0aaa5;}
  div.list table, div.checklist table {width:100%; background-color:#fbfbfa; padding:0;}
  table.list tbody tr:last-child {height:auto !important;}
  table.list tbody tr:nth-child(odd) td, table.foldlist tbody tr:nth-child(odd) td {background-color:#f0f0f0;}
  table.list tbody tr:nth-child(even) td, table.foldlist tbody tr:nth-child(even) td {background-color:transparent;}
  table.list tbody tr, table.foldlist tbody tr {height:20px;}
  table.list td {padding:2px;}
  table.foldlist th {padding:3px 10px; text-align:center; font-weight:bold; background-color:#000000; color:#ffffff;}
  table.foldlist td {padding:3px 10px; text-align:right;}
  table.foldlist tbody tr.parent td {font-weight:bold; background-color:#e0e0e0;}
  table.foldlist tbody tr.parent, table.foldlist tbody tr.open {display:table-row;}
  table.foldlist tbody tr {display:none;}
  table.checklist {table-layout:fixed;}
  table.checklist td {overflow:hidden;}
  table.checklist tr.listEntryHead {background-color:#ffffcc;}
  table.checklist tr.listEntryDark {background-color:#f0f0f0;}
  table.checklist tr.listEntryLight {background-color:transparent;}
  table.list input {width:inherit !important; height:13px;}
}

#header {background-image:url(/media/gocher_head~640.jpg);}
@media screen and (min-width:641px) {
  #header {background-image:url(/media/gocher_head~1024.jpg);}
}
@media screen and (min-width:1025px) {
  #header {background-image:url(/media/gocher_head~1280.jpg);}
}
@media screen and (min-width:1281px) {
  #header {background-image:url(/media/gocher_head~1920.jpg);}
}
@media screen and (min-width:1921px) {
  #header {background-image:url(/media/gocher_head~1921.jpg);}
}

@media only screen and (max-width:460px){
  div.imageLeft, div.imageRight, div.imageFull, div.imageCenter{float:none; margin-top:5px;}
}

@media only screen and (max-width:767px) {
  * {/*cursor:default;*/ -webkit-nbsp-mode:space; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-touch-callout:none; -webkit-transform-style:preserve3d; -webkit-user-select:none;}
  html {min-width:320px; -webkit-text-size-adjust:100%;}
  html, body, .boxFull, .boxLeft, .boxRight, .boxCenter {width:100%;}
  body {font-family:Arial,sans-serif; background:#fff; color:#000; -webkit-user-select:none; -webkit-text-size-adjust:none;}
  div.boxFull, div.boxLeft, div.boxRight, div.boxCenter {width:100%;}
  div.imageLeft img, div.imageRight img, div.imageFull img, div.imageCenter img, object, embed, video, div.video-js {max-width:100%; height:auto;}
  div.video-js, div.vjs-poster {background-color:#fff;}
  input, textarea {-webkit-user-select:auto;}
  #content {padding:2px 5px; box-sizing:border-box;}
  #content p, #content table {margin-left:0;}
  #content ul.tabs {padding:0; margin:0;}
  #content ul.tabsheets {padding:0; margin:10px 0;}
  div.boxLeft, div.boxRight {width:95%;}
  #content div.boxLeft, #content div.boxRight, #content div.boxFull, #content div.boxCenter {border-width:1px 0 0 0;}
  #content div.boxLeft:last-child {border-width:1px 0;}

  /*REGION ' - nav - '*/
  .func-btn::before {content:"\f142";}
  .func-btn.active::before {content:"\f00d";}
  #functions {display:none;}
  #functions.active {display:inline-block;}
  #searchfrm.inactive {display:none;}
  #menu-btn::before {content:"\f0c9"; display:block;}
  #menu-btn.active::before {content:"\f00d";}
  #nav-container {position:fixed; top:41px; left:0; bottom:0; display:flex; width:350px; background-color:#fff; color:#000;
    z-index:999; visibility:hidden; overflow-x:hidden; overflow-y:auto; flex-direction:column; will-change:visibility;
    transform:translateX(-100%);
  }
  #nav-container.inactive {
    transform:translateX(-100%); transition:all .3s ease-in-out;
  }
  #nav-container.active {visibility:visible; box-shadow:0 0 16px rgba(0,0,0,.28);
    transform:translateX(0); transition:all .3s ease-in-out;
  }
  #nav {display:block;}
  #nav ul {list-style:none; margin:0; padding:0;}
  #nav ul ul {border-bottom:1px solid #C8CED0;}
  #nav ul ul, #nav ul li {margin:0; padding:0;}
  #nav ul li a {color:#000; display:block; font-weight:bold; padding:6px; text-decoration:none;}
  #nav ul ul li a {font-weight:normal; margin-top:0;}

  /*REGION ' - gallery - '*/
  #imagebox {left:0; right:0;}
}
*:fullscreen {width:100%; height:100%;}

@media screen and (min-width:768px) {
  #page-container {margin:10px;}
  #content-container {padding:20px 0 0;}

  /*REGION ' - TabSheets - '*/
  ul.tabs > li {padding:3px 25px 2px;}
  ul.tabs > li.active {padding:4px 25px 3px;}

  /*REGION ' - searcharea - '*/
  #searcharea input, #searcharea h5, #searcharea a:link, #searcharea a:visited, #searcharea a:active {white-space:nowrap; margin:0;}

  /*REGION ' - nav - '*/
  #menu-btn {display:none;}
  .func-btn {display:none;}
  #functions {display:inline-block;}
  #nav-container {width:100%; border-top:1px solid #fff; border-bottom:1px solid #fff; z-index:888;}
  #nav-container, #nav ul li.selected, #nav ul li ul li.selected, #nav ul li ul li:hover {background:#832025;}
  #nav {position:relative; float:left;}
  #nav * {color:white;}
  #nav ul {margin:0; padding:0; list-style-type:none; list-style-image:none; list-style:none;}
  #nav ul li {margin:0; padding:0; float:left; border-left:1px solid #832025; border-right:1px solid #c89c9e;}
  #nav ul li a {display:block; margin:0; padding:4px 6px; text-decoration:none; white-space:nowrap;}
  #nav ul li:hover {background-color:#63636f;}
  #nav ul ul {display:none; position:absolute; border-color:#4f4f59; border-style:solid; border-width:1px 1px 0 1px; background-color:#63636f; z-index:500;}
  #nav ul li ul li {float:none; border-bottom:1px solid #4f4f59; border-width:0 0 1px 0;}
  #nav ul li:hover ul {display:block;}
  #nav ul li ul li a {padding:3px 8px;}

  /*REGION ' - gallery - '*/
  #imagebox {left:50px; right:50px;}
}

/*REGION ' - boxes - '*/
@media screen and (min-width:1001px) {
  #content {float:left; width:75%; box-sizing:border-box;}
  #boxes-container {float:left; width:25%; padding:0 0 0 10px; box-sizing:border-box;}
  .box-area {width:100%; margin:0 0 8px;}
}
@media screen and (max-width:1000px) {
  #boxes-container {display:flex; flex-wrap:wrap; box-sizing:border-box;}
  .box-area {display:flex; padding:0.5em; width:33.33%; box-sizing:border-box;}
  .box {display:flex; flex-direction:column; width:100%;}
  .box-content {flex:1 0 auto; padding:5px;}
}
@media screen and (min-width:601px) and (max-width:1000px) {
  .box-body {position:relative; /*top:50%; left:50%; transform:translate(-50%, -50%);*/}
}
@media screen and (max-width:768px) {
  .box-area {width:50%;}
}
@media screen and (max-width:600px) {
  .box-area {width:100%;}
}

@media print {
  #toolbar, #header, #boxes-container, #breadcrumbs, #content-nav, #contentForm, #socialbookmarks, #nav-container,
  .articleButtons, #content div.zoom, span.zoom, #footer-nav, span.accessibility, .tabs {display:none;}
  ul.tabsheets > li, ul.accordion > li {display:block;}
  .boxFull {width:99%;}
  #footer {margin:15px; padding:0 0 10px;}
  #copyright {clear:both; float:right; width:auto; margin-top:10px;}
  div.imageRight a[href]::after, div.imageLeft a[href]::after, div.imageCenter a[href]::after, div.imageFull a[href]::after {content:"\a("attr(href)") "; white-space:pre; font-size:90%;}
  a[href]::after {content:" ("attr(href)") ";}
  a[hreflang]::after {content:" ("attr(hreflang)") ";}
  a[name]::after {content:" ["attr(name)"] ";}
}

published: , last modified:

Service Infos

CMS Info Product Name:
UDOs Webserver
Version:
0.5.0.93
Description:
All in one Webserver
Copyright:
Udo Schmal
Compilation:
Sat, 19. Jun 2021 14:07:06
Development Info Compiler:
Free Pascal FPC 3.3.1
compiled for:
OS:Linux, CPU:x86_64
System Info OS:
Ubuntu 20.04.2 LTS (Focal Fossa)
Hardware Info Model:
Hewlett-Packard HP Pavilion dv7 Notebook PC
CPU Name:
Intel(R) Core(TM) i5-2450M CPU @ 2.50GHz
CPU Type:
x86_64, 1 physical CPU(s), 2 Core(s), 4 logical CPU(s), 2928.939 MHz