xeps/xmpp.css

1758 lines
34 KiB
CSS

/**
* "Yet Another Multicolumn Layout" - YAML CSS Framework
*
* (en) YAML core stylesheet
* (de) YAML Basis-Stylesheet
*
* Don't make any changes in this file!
* Your changes should be placed in any css-file in your own stylesheet folder.
*
* @copyright © 2005-2013, Dirk Jesse
* @license CC-BY 2.0 (http://creativecommons.org/licenses/by/2.0/),
* YAML-CDL (http://www.yaml.de/license.html)
* @link http://www.yaml.de
* @package yaml
* @version 4.1.2
*/
@media all {
/**
* @section Normalisation Module
*/
/* (en) Global reset of paddings and margins for all HTML elements */
/* (de) Globales Zurücksetzen der Innen- und Außenabstände für alle HTML-Elemente */
* {
margin: 0;
padding: 0;
}
/* (en) Correction: margin/padding reset caused too small select boxes. */
/* (de) Korrektur: Das Zurücksetzen der Abstände verursacht zu kleine Selectboxen. */
option {
padding-left: 0.4em;
}
select {
padding: 1px;
}
/*
* (en) Global fix of the Italics bugs in IE 5.x and IE 6
* (de) Globale Korrektur des Italics Bugs des IE 5.x und IE 6
*
* @bugfix
* @affected IE 5.x/Win, IE6
* @css-for IE 5.x/Win, IE6
* @valid yes
*/
* html body * {
overflow: visible;
}
/*
* (en) Fix for rounding errors when scaling font sizes in older versions of Opera browser
* Standard values for colors and text alignment
*
* (de) Beseitigung von Rundungsfehler beim Skalieren von Schriftgrößen in älteren Opera Versionen
* Vorgabe der Standardfarben und Textausrichtung
*/
body {
font-size: 100%;
background: #fff;
color: #000;
text-align: left;
}
/* (en) avoid visible outlines on DIV and h[x] elements in Webkit browsers */
/* (de) Vermeidung sichtbarer Outline-Rahmen in Webkit-Browsern */
div:target,
h1:target,
h2:target,
h3:target,
h4:target,
h5:target,
h6:target {
outline: 0 none;
}
/* (en) HTML5 - adjusting visual formatting model to block level */
/* (de) HTML5 - Elements werden als Blockelemente definiert */
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section,
summary {
display: block;
}
/* (en) HTML5 - default media element styles */
/* (de) HTML5 - Standard Eigenschaften für Media-Elemente */
audio,
canvas,
video {
display: inline-block;
}
/* (en) HTML5 - don't show <audio> element if there aren't controls */
/* (de) HTML5 - <audio> ohne Kontrollelemente sollten nicht angezeigt werden */
audio:not([controls]) {
display: none;
}
/* (en) HTML5 - add missing styling in IE & old FF for hidden attribute */
/* (de) HTML5 - Eigenschaften für das hidden-Attribut in älteren IEs und FF nachrüsten */
[hidden] {
display: none;
}
/* (en) Prevent iOS text size adjust after orientation change, without disabling user zoom. */
/* (de) Verdindert die automatische Textanpassung bei Orientierungswechsel, ohne Zoom zu blockieren */
html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
/* (en) set correct box-modell in IE8/9 plus remove padding */
/* (de) Setze das richtige Box-Modell im IE8/9 und entferne unnötiges Padding */
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
padding: 0;
}
/* (en) force consistant appearance of input[type="search"] elements in all browser */
/* (de) Einheitliches Erscheinungsbild für input[type="search"] Elemente erzwingen */
input[type="search"] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/* (en) Correct overflow displayed oddly in IE 9 */
/* (de) Korrigiert fehlerhafte overflow Voreinstellung des IE 9 */
svg:not(:root) {
overflow: hidden;
}
/* (en) Address margin not present in IE 8/9 and Safari 5 */
/* (en) Ergänzt fehlenden Margin in IE 8/9 und Safari 5 */
figure {
margin: 0;
}
/* (en) Clear borders for <fieldset> and <img> elements */
/* (de) Rahmen für <fieldset> und <img> Elemente löschen */
fieldset,
img {
border: 0 solid;
}
/* (en) new standard values for lists, blockquote, cite and tables */
/* (de) Neue Standardwerte für Listen, Zitate und Tabellen */
ul,
ol,
dl {
margin: 0 0 1em 1em;
}
li {
line-height: 1.5em;
margin-left: 0.8em;
}
dt {
font-weight: bold;
}
dd {
margin: 0 0 1em 0.8em;
}
blockquote {
margin: 0 0 1em 0.8em;
}
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/**
* @section Float Handling Module
*/
/* (en) clearfix method for clearing floats */
/* (de) Clearfix-Methode zum Clearen der Float-Umgebungen */
.ym-clearfix:before {
content: "";
display: table;
}
.ym-clearfix:after {
clear: both;
content: ".";
display: block;
font-size: 0;
height: 0;
visibility: hidden;
}
/* (en) alternative solutions to contain floats */
/* (de) Alternative Methoden zum Einschließen von Float-Umgebungen */
.ym-contain-dt {
display: table;
table-layout: fixed;
width: 100%;
}
.ym-contain-oh {
display: block;
overflow: hidden;
width: 100%;
}
.ym-contain-fl {
float: left;
width: 100%;
}
/**
* @section Column Module
*
* default column config:
* |-------------------------------|
* | col1 | col3 | col2 |
* | 20% | flexible | 20% |
* |-------------------------------|
*/
.ym-column {
display: table;
table-layout: fixed;
width: 100%;
}
.ym-col1 {
float: left;
width: 20%;
}
.ym-col2 {
float: right;
width: 20%;
}
.ym-col3 {
width: auto;
margin: 0 20%;
}
.ym-cbox {
padding: 0 10px;
}
.ym-cbox-left {
padding: 0 10px 0 0;
}
.ym-cbox-right {
padding: 0 0 0 10px;
}
/* (en) IE-Clearing: Only used in Internet Explorer, switched on in iehacks.css */
/* (de) IE-Clearing: Benötigt nur der Internet Explorer und über iehacks.css zugeschaltet */
.ym-ie-clearing {
display: none;
}
/**
* @section Grid Module
*/
.ym-grid {
display: table;
table-layout: fixed;
width: 100%;
list-style-type: none;
padding-left: 0;
padding-right: 0;
margin-left: 0;
margin-right: 0;
}
.ym-gl {
float: left;
margin: 0;
}
.ym-gr {
float: right;
margin: 0 0 0 -5px;
}
.ym-g20 {
width: 20%;
}
.ym-g40 {
width: 40%;
}
.ym-g60 {
width: 60%;
}
.ym-g80 {
width: 80%;
}
.ym-g25 {
width: 25%;
}
.ym-g33 {
width: 33.333%;
}
.ym-g50 {
width: 50%;
}
.ym-g66 {
width: 66.666%;
}
.ym-g75 {
width: 75%;
}
.ym-g38 {
width: 38.2%;
}
.ym-g62 {
width: 61.8%;
}
.ym-gbox {
padding: 0 10px;
}
.ym-gbox-left {
padding: 0 10px 0 0;
}
.ym-gbox-right {
padding: 0 0 0 10px;
}
.ym-equalize {
overflow: hidden;
}
.ym-equalize > [class*="ym-g"] {
display: table-cell;
float: none;
margin: 0;
vertical-align: top;
}
.ym-equalize > [class*="ym-g"] > [class*="ym-gbox"] {
padding-bottom: 10000px;
margin-bottom: -10000px;
}
/**
* @section Form Module
*/
/** Vertical-Forms - technical base (standard)
*
* |-------------------------------|
* | form |
* |-------------------------------|
* | label |
* | input / select / textarea |
* |-------------------------------|
* | /form |
* |-------------------------------|
*
* (en) Styling of forms where both label and input/select/textarea are styled with display: block;
* (de) Formulargestaltung, bei der sowohl label als auch input/select/textarea mit display: block; gestaltet werden
*/
.ym-form,
.ym-form fieldset {
overflow: hidden;
}
.ym-form div {
position: relative;
}
.ym-form label,
.ym-form .ym-label,
.ym-form .ym-message {
position: relative;
line-height: 1.5;
display: block;
}
.ym-form .ym-message {
clear: both;
}
.ym-form .ym-fbox-check label {
display: inline;
}
.ym-form input,
.ym-form textarea {
cursor: text;
}
.ym-form .ym-fbox-check input,
.ym-form input[type="image"],
.ym-form input[type="radio"],
.ym-form input[type="checkbox"],
.ym-form select,
.ym-form label {
cursor: pointer;
}
.ym-form textarea {
overflow: auto;
}
.ym-form input.hidden,
.ym-form input[type=hidden] {
display: none !important;
}
.ym-form .ym-fbox:before,
.ym-form .ym-fbox-text:before,
.ym-form .ym-fbox-select:before,
.ym-form .ym-fbox-check:before,
.ym-form .ym-fbox-button:before {
content: "";
display: table;
}
.ym-form .ym-fbox:after,
.ym-form .ym-fbox-text:after,
.ym-form .ym-fbox-select:after,
.ym-form .ym-fbox-check:after,
.ym-form .ym-fbox-button:after {
clear: both;
content: ".";
display: block;
font-size: 0;
height: 0;
visibility: hidden;
}
.ym-form .ym-fbox-check input:focus,
.ym-form .ym-fbox-check input:hover,
.ym-form .ym-fbox-check input:active,
.ym-form input[type="radio"]:focus,
.ym-form input[type="radio"]:hover,
.ym-form input[type="radio"]:active,
.ym-form input[type="checkbox"]:focus,
.ym-form input[type="checkbox"]:hover,
.ym-form input[type="checkbox"]:active {
border: 0 none;
}
.ym-form input,
.ym-form textarea,
.ym-form select {
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 70%;
}
.ym-form .ym-fbox-check input,
.ym-form input[type="radio"],
.ym-form input[type="checkbox"] {
display: inline;
margin-left: 0;
margin-right: 0.5ex;
width: auto;
height: auto;
}
.ym-form input[type="image"] {
border: 0;
display: inline;
height: auto;
margin: 0;
padding: 0;
width: auto;
}
.ym-form label,
.ym-form .ym-label {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.ym-form .ym-fbox-button input {
display: inline;
overflow: visible;
width: auto;
}
.ym-form .ym-inline {
display: inline-block;
float: none;
margin-right: 0;
width: auto;
vertical-align: baseline;
}
/* default form wrapper width */
.ym-fbox-wrap {
display: table;
table-layout: fixed;
width: 70%;
}
.ym-fbox-wrap input,
.ym-fbox-wrap textarea,
.ym-fbox-wrap select {
width: 100%;
}
.ym-fbox-wrap input[type="image"] {
width: auto;
}
.ym-fbox-wrap input[type="radio"],
.ym-fbox-wrap input[type="checkbox"] {
display: inline;
width: auto;
margin-left: 0;
margin-right: 0.5ex;
}
.ym-fbox-wrap label,
.ym-fbox-wrap .ym-label {
display: inline;
}
.ym-full input,
.ym-full textarea,
.ym-full select {
width: 100%;
}
.ym-full .ym-fbox-wrap {
width: 100%;
}
/**
* Columnar forms display - technical base (optional)
*
* |-------------------------------------------|
* | form |
* |-------------------------------------------|
* | |
* | label | input / select / textarea |
* | |
* |-------------------------------------------|
* | /form |
* |-------------------------------------------|
*
* (en) Styling of forms where label floats left of form-elements
* (de) Formulargestaltung, bei der die label-Elemente nach links fließen
*/
.ym-columnar input,
.ym-columnar textarea,
.ym-columnar select {
float: left;
margin-right: -3px;
}
.ym-columnar label,
.ym-columnar .ym-label {
display: inline;
float: left;
width: 30%;
z-index: 1;
}
.ym-columnar .ym-fbox-check input,
.ym-columnar .ym-message {
margin-left: 30%;
}
.ym-columnar .ym-fbox-wrap {
margin-left: 30%;
margin-right: -3px;
}
.ym-columnar .ym-fbox-wrap .ym-message {
margin-left: 0%;
}
.ym-columnar .ym-fbox-wrap label {
float: none;
width: auto;
z-index: 1;
margin-left: 0;
}
.ym-columnar .ym-fbox-wrap input {
margin-left: 0;
position: relative;
}
.ym-columnar .ym-fbox-check {
position: relative;
}
.ym-columnar .ym-fbox-check label,
.ym-columnar .ym-fbox-check .ym-label {
padding-top: 0;
}
.ym-columnar .ym-fbox-check input {
top: 3px;
}
.ym-columnar .ym-fbox-button input {
float: none;
margin-right: 1em;
}
.ym-fbox-wrap + .ym-fbox-wrap {
margin-top: 0.5em;
}
/* global and local columnar settings for button alignment */
.ym-columnar fieldset .ym-fbox-button,
fieldset.ym-columnar .ym-fbox-button {
padding-left: 30%;
}
/**
* @section Accessibility Module
*
* (en) skip links and hidden content
* (de) Skip-Links und versteckte Inhalte
*/
/* (en) classes for invisible elements in the base layout */
/* (de) Klassen für unsichtbare Elemente im Basislayout */
.ym-skip,
.ym-hideme,
.ym-print {
position: absolute;
top: -32768px;
left: -32768px;
}
/* (en) make skip links visible when using tab navigation */
/* (de) Skip-Links für Tab-Navigation sichtbar schalten */
.ym-skip:focus,
.ym-skip:active {
position: static;
top: 0;
left: 0;
}
/* skiplinks:technical setup */
.ym-skiplinks {
position: absolute;
top: 0px;
left: -32768px;
z-index: 1000;
width: 100%;
margin: 0;
padding: 0;
list-style-type: none;
}
.ym-skiplinks .ym-skip:focus,
.ym-skiplinks .ym-skip:active {
left: 32768px;
outline: 0 none;
position: absolute;
width: 100%;
}
}
@media print {
/**
* @section print adjustments for core modules
*
* (en) float containment for grids. Uses display: table to avoid bugs in FF & IE
* (de) Floats in Grids einschließen. Verwendet display: table, um Darstellungsprobleme im FF & IE zu vermeiden
*
* @bugfix
* @since 3.0
* @affected FF2.0, FF3.0, IE7
* @css-for all browsers
* @valid yes
*/
.ym-grid > .ym-gl,
.ym-grid > .ym-gr {
overflow: visible;
display: table;
table-layout: fixed;
}
/* (en) make .ym-print class visible */
/* (de) .ym-print-Klasse sichtbar schalten */
.ym-print {
position: static;
left: 0;
}
/* (en) generic class to hide elements for print */
/* (de) Allgemeine CSS Klasse, um beliebige Elemente in der Druckausgabe auszublenden */
.ym-noprint {
display: none !important;
}
}
/**
* "Yet Another Multicolumn Layout" - YAML CSS Framework
*
* (en) Uniform design of standard content elements
* (de) Einheitliche Standardformatierungen für die wichtigten Inhalts-Elemente
*
* @copyright © 2005-2013, Dirk Jesse
* @license CC-BY 2.0 (http://creativecommons.org/licenses/by/2.0/),
* YAML-CDL (http://www.yaml.de/license.html)
* @link http://www.yaml.de
* @package yaml
* @version 4.1.2
*/
@media all {
/*
* @section global typography settings
*
* vertical rhythm settings (based on em-unit)
* -------------------------------------------
* basefont-size: 14px (87.5%)
* line-height : 21px (factor: 1.5) */
/* (en) reset font size for all elements to standard (16 Pixel) */
/* (de) Alle Schriftgrößen auf Standardgröße (16 Pixel) zurücksetzen */
html * {
font-size: 100%;
}
/**
* (en) reset monospaced elements to font size 16px in all browsers
* (de) Schriftgröße von monospaced Elemente in allen Browsern auf 16 Pixel setzen
*
* @see: http://webkit.org/blog/67/strange-medium/
*/
textarea,
pre,
code,
kbd,
samp,
var,
tt {
font-family: Consolas, "Lucida Console", "Andale Mono", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
}
/* font-size: 14px; */
body {
font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif;
/* font-size: 87.5%; */
color: #444444;
}
/*--- Headings | Überschriften ------------------------------------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Droid Sans", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #161e21;
margin: 0;
}
h1 {
/* font-size: 48px; */
font-size: 342.85714%;
line-height: 0.875;
margin: 0 0 0.4375em 0;
}
h2 {
/* font-size: 32px; */
font-size: 228.57143%;
line-height: 1.3125;
margin: 0 0 0.65625em 0;
}
h3 {
/* font-size: 24px; */
font-size: 171.42857%;
line-height: 0.875;
margin: 0 0 0.875em 0;
}
h4 {
/* font-size: 21px; */
font-size: 150%;
line-height: 1;
margin: 0 0 1em 0;
}
h5 {
/* font-size: 18px; */
font-size: 128.57143%;
line-height: 1.16667;
margin: 0 0 1.16667em 0;
}
h6 {
/* font-size: 14px; */
font-size: 100%;
font-weight: bold;
line-height: 1.5;
margin: 0 0 1.5em 0;
}
/* --- Lists | Listen -------------------------------------------------------------------------------- */
ul,
ol,
dl {
font-size: 100%;
line-height: 1.5;
margin: 0 0 1.5em 0;
}
ul {
list-style-type: disc;
}
ol {
list-style-type: decimal;
}
ul ul {
list-style-type: circle;
margin-top: 0;
}
ol ol {
list-style-type: lower-latin;
margin-top: 0;
}
ol ul {
list-style-type: circle;
margin-top: 0;
}
li {
font-size: 100%;
line-height: 1.5;
margin-left: 1.2em;
}
dt {
font-weight: bold;
}
dd {
margin: 0 0 1.5em 0.8em;
}
/* --- general text formatting | Allgemeine Textauszeichnung ------------------------------------------ */
p {
font-size: 100%;
line-height: 1.5;
margin: 0 0 1.5em 0;
}
blockquote,
cite,
q {
font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif;
font-style: italic;
}
blockquote {
background: transparent;
color: #666666;
margin: 1.5em 0 0 1.5em;
}
strong,
b {
font-weight: bold;
}
em,
i {
font-style: italic;
}
big {
/* font-size: 16px; */
font-size: 114.28571%;
line-height: 1.3125;
}
small {
/* font-size: 12px; */
font-size: 85.71429%;
line-height: 1.75;
}
pre,
code,
kbd,
tt,
samp,
var {
font-size: 100%;
}
pre {
font-size: 100%;
line-height: 1.5;
margin: 0 0 1.5em 0;
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}
pre,
code {
color: #880000;
}
kbd,
samp,
var,
tt {
color: #666666;
font-weight: bold;
}
var,
dfn {
font-style: italic;
}
acronym,
abbr {
border-bottom: 1px #aaa dotted;
font-variant: small-caps;
letter-spacing: .07em;
cursor: help;
}
sub,
sup,
.super {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup,
.super {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
mark {
background: yellow;
color: black;
}
hr {
color: #fff;
background: transparent;
margin: 0 0 0.75em 0;
padding: 0 0 0.67857em 0;
border: 0;
border-bottom: 1px #eeeeee solid;
}
/*--- Links ----------------------------------------------------------------------------------------- */
a {
color: #4d87c7;
background: transparent;
text-decoration: none;
}
a:active {
outline: none;
}
/* (en) maximum constrast for tab focus - change with great care */
/* (en) Maximaler Kontrast für Tab Focus - Ändern Sie diese Regel mit Bedacht */
a:hover,
a:focus {
background-color: #4d87c7;
color: white;
text-decoration: none;
}
/* --- images ------------------ */
img,
figure {
margin: 0;
}
.flexible {
margin-bottom: 1.5em;
max-width: 100%;
height: auto;
}
/* IE6 workaround - 2% space for possible borders */
* html .flexible {
width: 98%;
}
.bordered {
margin-bottom: 1.5em;
border: 2px #eee solid;
border: 2px white solid;
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
}
/**
* ----------------------------------------------------------------------- #
*
* Generic Content Classes
*
* (en) standard classes for positioning and highlighting
* (de) Standardklassen zur Positionierung und Hervorhebung
*
* @section content-generic-classes
*/
.highlight {
color: #cc3300;
}
.dimmed {
color: #888888;
}
.box {
border-radius: 0.3em;
border-width: 1px;
border-style: solid;
border-color: #888;
border-color: rgba(0, 0, 0, 0.3);
-webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.2);
box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.2);
color: #444;
color: rgba(0, 0, 0, 0.8);
padding: 1.42857em;
margin: 0 0 1.5em 0;
}
.box > *:last-child {
margin-bottom: 0;
}
.label {
font-family: Verdana, Geneva, sans-serif;
padding: 1px 6px 2px;
display: inline-block;
vertical-align: middle;
letter-spacing: normal;
white-space: nowrap;
border-radius: 3px;
background: #06C;
color: #fff;
font-size: 10px;
line-height: 12px;
}
.info {
background: #f4f4f4;
}
.success {
background: #88cc88;
}
.warning {
background: #cccc88;
}
.error {
background: #cc8888;
}
.float-left {
float: left;
display: inline;
margin: 0 1em 1.5em 0;
}
.float-right {
float: right;
display: inline;
margin: 0 0 1.5em 1em;
}
.center {
display: block;
text-align: center;
margin: 0 auto 1.5em auto;
}
/**
* ------------------------------------------------------------------------------------------------- #
*
* Tables | Tabellen
*
* (en) Generic classes for table-width and design definition
* (de) Generische Klassen für die Tabellenbreite und Gestaltungsvorschriften für Tabellen
*
* @section content-tables
*/
table {
width: 100%;
border-collapse: collapse;
color: #444444;
border-top: 1px #ccc solid;
border-bottom: 1px #ccc solid;
margin: 0 0 1.35714em 0;
}
table.narrow {
margin: 0 0 1.42857em 0;
}
table.narrow th,
table.narrow td {
padding: 0 0.5em;
line-height: 1.42857;
}
table.fixed {
table-layout: fixed;
}
table.bordertable {
border: 1px #ccc solid;
}
table.bordertable thead th {
background: #e0e0e0;
border-right: 1px #ccc solid;
border-bottom: 1px #ccc solid;
}
table.bordertable tbody th[scope="row"] {
background: #f0f0f0;
}
table.bordertable tbody th {
border-right: 1px solid #ccc;
}
table.bordertable tbody td {
border-right: 1px solid #ccc;
}
caption {
font-variant: small-caps;
}
th,
td {
line-height: 1.5em;
vertical-align: top;
padding: 0.71429em 0.5em;
}
th *:first-child,
td *:first-child {
margin-top: 0;
}
th.nowrap,
td.nowrap {
white-space: nowrap;
}
thead th {
text-align: left;
color: #000;
border-bottom: 2px #000 solid;
}
tbody {
/* highlight row on mouse over */
}
tbody th {
text-align: left;
border-top: 1px solid #ccc;
}
tbody td {
text-align: left;
border-top: 1px solid #ccc;
}
tbody tr:hover th,
tbody tr:hover td {
background: #f8f8f8;
}
}
@media screen {
body {
padding-top: 1.5em;
padding-bottom: 1.5em;
margin-left: auto;
margin-right: auto;
max-width: 60rem;
font-family: "Droid Sans", Arial, Helvetica, sans-serif;
}
a.standardsButton {
padding: 0.1em;
padding-left: 0.5em;
padding-right: 0.5em;
border: 1px solid rgba(19, 181, 234, 1.0);
background-color: rgba(19, 181, 234, 0.2);
color: black;
border-radius: 2px;
}
a.standardsButton:hover,
a.standardsButton:focus {
border: 1px solid rgba(19, 181, 234, 1.0);
background-color: rgba(19, 181, 234, 0.7);
color: black;
}
ul, ol {
padding-left: 1.5em;
}
dl.compact {
display: grid;
grid-template-columns: auto 1fr;
margin-bottom: 1.5em;
}
dl.compact > dt {
grid-column: 1;
margin-bottom: 0;
padding-right: 0.5em;
}
dl.compact > dd {
grid-column: 2;
margin-bottom: 0;
}
div#status-notice {
/* margin: 1.5em;
padding: 1.5em; */
}
div#status-notice.active,
div#status-notice.final,
div#status-notice.draft {
color: green;
}
div#status-notice.deferred,
div#status-notice.deprecated,
div#status-notice.experimental,
div#status-notice.obsolete,
div#status-notice.proposed,
div#status-notice.protoxep,
div#status-notice.rejected,
div#status-notice.retracted {
color: red;
}
ol.toc-appendices {
padding: 0;
list-style-type: upper-alpha;
list-style-position: inside;
}
a {
color: #328627 /* #c4410a */;
background: transparent;
}
a:hover,
a:focus {
background-color: #328627 /* #c4410a */;
color: white;
}
figure {
margin-top: 1.5em;
margin-bottom: 1.5em;
}
figure.code,
figure.code-example,
figure.example {
/* margin: 1.5em; */
padding: 1.5em;
border: 1px solid rgba(19, 181, 234, 1.0);
}
figure.cve {
padding: 1.5em;
border: 5px solid rgba(180, 0, 0, 1.0);
}
figure > figcaption {
margin-bottom: 0.5em;
font-weight: bold;
}
figure.code-example > figcaption {
font-weight: normal;
}
figure > *:last-child {
margin-bottom: 0;
}
a.anchor-link {
opacity: 0.3;
margin-left: 0.5em;
margin-right: 0.5em;
}
a.anchor-link > abbr {
text-decoration: none;
border: none;
}
h1 > a.anchor-link,
h2 > a.anchor-link,
h3 > a.anchor-link,
h4 > a.anchor-link,
h5 > a.anchor-link,
h6 > a.anchor-link,
div.revision-head > a.anchor-link {
break-before: auto;
visibility: hidden;
}
h1:hover > a.anchor-link,
h2:hover > a.anchor-link,
h3:hover > a.anchor-link,
h4:hover > a.anchor-link,
h5:hover > a.anchor-link,
h6:hover > a.anchor-link,
div.revision-head:hover > a.anchor-link {
visibility: visible;
}
pre.prettyprint {
white-space: pre;
overflow-x: auto;
}
ul.authors {
display: inline-block;
list-style-type: none;
margin-bottom: 0;
margin-left: 0;
padding-left: 0;
}
ul.authors > li {
margin: 0;
padding: 0;
display: inline;
}
ul.authors > li:before {
content: ', ';
}
ul.authors > li:first-child:before {
content: '';
}
ol.toc,
ol.toc ol {
counter-reset: item;
list-style-type: none;
padding-left: 0.5em;
}
ol.toc {
padding-left: 0;
}
ol.toc li:before {
content: counters(item, ".") ". ";
counter-increment: item;
}
ol.revision-history {
list-style-type: none;
padding-left: 0;
}
ol.revision-history > li {
margin-left: 0;
}
div.revision-head {
font-weight: bold;
font-size: 128.57143%;
}
div.revision-author {
text-align: right;
margin-bottom: 1.5em;
}
p + div.revision-author,
ul + div.revision-author {
margin-top: -1.5em;
}
div.revision-author:before {
content: "— ";
}
div.docmeta-wrap {
margin-left: 1.5em;
margin-right: 1.5em;
padding: 1.5em;
border-left: 1px solid rgba(19, 181, 234, 1.0);
display: flex;
}
div.docmeta-wrap > dl#docmeta {
flex: 1 1 auto;
}
div.docmeta-wrap > div.timeline-wrap {
flex: 1 0 auto;
padding-left: 1.5em;
}
div.timeline-head {
margin-right: 0.5em;
font-size: 100%;
font-weight: bold;
line-height: 1.5;
margin: 0 0 1.5em 0;
}
ol.timeline {
text-align: right;
list-style-type: none;
margin: 0;
padding: 0;
border-right: 0.1em solid black;
}
ol.timeline > li {
margin: 0;
padding: 0;
position: relative;
padding: 0.5em;
padding-right: 0;
}
ol.timeline > li::after,
ol.timeline > li::before {
display: none;
position: relative;
top: -0.1em;
width: 0.4em;
height: 0.4em;
background: black;
border-radius: 50%;
content: "";
}
ol.timeline > li::after {
display: inline-block;
margin-right: -0.25em;
margin-left: 0.5em;
}
ol.timeline > li::before {
margin-left: -0.25em;
margin-right: 0.5em;
}
ol.timeline > li.current {
font-weight: bold;
}
pre {
font-size: 87.5%;
}
.box {
border-radius: 0;
}
}
@media screen and ( min-width: 75em ) {
html {
padding-left: 17rem;
}
nav#toc {
position: fixed;
left: 0;
top: 0;
bottom: 0;
width: calc((100vw - 45rem) / 2 - 2rem);
max-width: 20rem;
padding: 0.5em;
overflow-y: scroll;
}
nav#toc > a > h2 {
font-size: 128.57143%;
line-height: 1.16667;
margin: 0 0 1.16667em 0;
}
nav#toc > a {
font-size: inherit;
display: block;
}
nav#toc > a:hover,
nav#toc > a:focus {
background-color: transparent;
}
nav#toc h2:before {
display: block;
font-size: 125%;
background: #333;
color: white;
margin: -0.333333em;
margin-bottom: 1em;
padding: 0.3333333em;
padding-left: 2.1666667em;
background-image: url('https://xmpp.org/images/logos/xmpp-logo.svg');
background-repeat: no-repeat;
background-size: 1.5em;
background-position: 0.3em 0.1em;
}
nav#toc ol,
nav#toc li {
margin-left: 0;
padding-left: 0;
margin-bottom: 0;
}
nav#toc ol.toc li {
background-color: rgba(0, 0, 0, 0.1);
}
nav#toc ol.toc li:before {
content: '';
counter-increment: none;
}
nav#toc > ol.toc {
margin-left: -0.5em;
margin-right: -0.5em;
}
nav#toc ol.toc li a {
display: block;
padding: 0.5em;
}
nav#toc ol.toc li a:before {
content: counters(item, ".") ". ";
counter-increment: item;
color: #444444;
}
nav#toc ol.toc li a:hover:before {
color: white;
}
}
@media screen and ( max-width: 60em ) {
body {
padding: 1.5em;
}
h1 {
font-size: 1.5em;
}
dl#docmeta > dd {
margin-left: 0;
padding-left: 0;
}
nav#toc > h2 {
font-size: 1.25em;
}
}
@media screen and ( max-width: 40em ) {
ul, ol {
padding-left: 0;
}
h2 {
font-size: 171.42857%;
line-height: 0.875;
margin: 0 0 0.875em 0;
}
h3 {
font-size: 150%;
line-height: 1;
margin: 0 0 1em 0;
}
h4 {
font-size: 128.57143%;
line-height: 1.16667;
margin: 0 0 1.16667em 0;
}
h5 {
font-size: 100%;
font-weight: bold;
line-height: 1.5;
margin: 0 0 1.5em 0;
}
h6 {
font-size: 100%;
font-weight: bold;
line-height: 1.5;
margin: 0 0 1.5em 0;
}
h2,h3,h4,h5,h6 {
text-indent: -1em;
margin-left: 1em;
}
div.docmeta-wrap {
display: block;
margin-left: 0;
margin-right: 0;
}
div.docmeta-wrap > div.timeline-wrap {
padding-left: 0;
}
ol.timeline {
border-left: 0.1em solid black;
border-right: none;
text-align: left;
margin-left: 1.5em;
}
ol.timeline > li {
padding-left: 0;
padding-right: 0.5em;
}
ol.timeline > li::after {
display: none;
}
ol.timeline > li::before {
display: inline-block;
}
img {
max-width: calc(100vw - 1em);
}
div.docmeta-wrap {
border-left: none;
padding-left: 0;
padding-right: 0;
}
dl#docmeta {
display: block;
}
dl#docmeta > dd {
margin-left: 1.5em;
}
}
@media screen and ( prefers-color-scheme: dark ) {
body {
background-color: #161616;
color: #ccc;
}
h1, h2, h3, h4, h5, h6 {
color: #eee;
}
table {
color: #eee;
}
tbody td {
border-top: 1px solid #333;
}
tbody tr:hover th,
tbody tr:hover td {
background-color: #282828;
}
pre, code {
color: red;
}
figure.code,
figure.code-example,
figure.example {
background-color: #282828;
}
figure.cve {
border: 5px solid rgba(120, 0, 0, 1.0);
}
.box {
color: #ccc;
background-color: #282828;
}
nav#toc ol.toc li {
background-color: rgba(255, 255, 255, 0.05);
}
nav#toc ol.toc li a:before {
color: #ccc;
}
a {
color: #4b3;
}
a.standardsButton {
color: #eee;
}
ol.timeline {
border-right: 0.1em solid #ccc;
}
ol.timeline > li::after,
ol.timeline > li::before {
background: #ccc;
}
}
@media print {
a.anchor-link {
display: none;
}
}