/*************************************************/ /* beg of */ /* LESS: projekt_typo.less */ /* */ /* Enthält die Variablen und */ /* MUSS von JEDEM .less importiert werden. */ /* */ /* @import "project_settings.less"; */ /* */ /*************************************************/ /*************************************************/ /* beg of */ /* LESS: project_settings.less */ /* */ /* Enthält die Variablen und */ /* MUSS von JEDEM .less importiert werden. */ /* */ /* @import "project_settings.less"; */ /* */ /*************************************************/ /* Importiere für ...*/ /*************************************************/ /* beg of */ /* LESS: boxcommon.less */ /* */ /* Enthält Variablen und Grundeinstellungen */ /* */ /* Wird in project_settings.less importiert */ /* */ /*************************************************/ #boxcommon { position: fixed; z-index: 11; width: inherit; height: 0px; overflow: visible; border: 0px dotted red; } /* RAL 6009 */ /* RAL 6010 */ /* RAL 6038 */ /* RAL 9010 */ /* RAL 9011 */ /* #444444 */ /* hellstes weiss */ /* dunkelstes schwarz */ /* RAL 9010 transparent */ /* RAL 9011 transparent */ /* #444444 transparent */ /* project_header_menu */ /* In project_content.less/css */ /* base_classes.css #Column Shortcodes class="one_half floatleft break4tablet" class="one_half last_column floatleft break4tablet" */ @media only screen and (min-width: 30cm) { /* dummy */ } @media only screen and (min-width: 10cm) and (max-width: 20cm) { .break4handhelds { float: none; margin: 0 auto 0 auto; width: 100% !important; 1background-color: yellow; } } @media only screen and (max-width: 10cm) { .break4handhelds { float: none; margin: 0 auto 0 auto; width: 100% !important; 1background-color: red; } } /* In project_header.less/css */ #header_container_horizontal { /* Container für Header Inhalte */ 1position: absolute; 1left: 16em; 1right: 1em; 1max-width: 960px; height: 100%; /* beg debug */ 1margin: -1px -2px -2px -1px; /* t r b l border Xpx ausgleichen. NUR wenn oben KEIN margin-xyz ist */ 1border: 1px dotted red; /* end debug */ } .tmbBottomCommonBaseline { /* Abstand zum "header" */ bottom: 0.5em; border: 0px dotted red; } #container_vertical { /* div zum VERTIKALEN Positionieren (Weite orientiert sich an #container_horizontal) */ top: 1rem; bottom: 1rem; /* beg debug */ border: 0px dotted white !important; /* end debug */ } /*************************************************/ /* end of */ /* LESS: project_settings.less */ /*************************************************/ /* Diese css gilt auch für den ckEditor !!! */ /* #Typography =================================================*/ /* Fontsizes should be relative ! */ /* Globale Standard-Bezeichnungen (Mal sehen, ob ich sie übernehme) */ .sans-serif { font-family: sans-serif; } /* */ .serif { font-family: serif; } /* */ .cursive { font-family: cursive; } /* Schreibschrift */ .fantasy { font-family: fantasy; } /* ungewöhnliche Schrift */ .monospace { font-family: monospace; } /* dicktengleich (monospaced), */ /* Projekt Typo */ body { font-family: 'fNormal', Helvetica, sans-serif; font-size: 1rem; /* Schriftgröße */ line-height: 1.2rem; /* Zeilenhöhe (Eine Prozentangabe für die Zeilenhöhe bezieht sich dabei auf den Wert der Schriftgröße. ) */ color: #dcdcdc; /* NORMAL: Text color */ -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; } p { margin: 1em 0 1em 0; /* Extra Abstand für neue Absätze */ } br { margin: 0 0 0 0; /* Kein Extra Abstand für neue Zeile */ } /* Links Textfarbe normal (Kann in Menüs anders sein -> project_header_menu)*/ a, a:visited { color: #dcdcdc; text-decoration: none; /* underline; */ outline: 0; } a:hover, a:focus { color: #ffffff; } a:hover h1, a:focus h1, a:hover h2, a:focus h2, a:hover h3, a:focus h3, a:hover h4, a:focus h4, a:hover h5, a:focus h5, a:hover h6, a:focus h6 { color: #ffffff; } h1, h2, h3, h4, h5, h6 { font-weight: normal; color: #dcdcdc; border: 0px dotted gray; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; } h1 { font-size: 140%; line-height: 160%; margin: 0 0 0 0; } h2 { font-size: 130%; line-height: 150%; margin: 0 0 0 0; } h3 { font-size: 120%; line-height: 140%; margin: 0 0 0 0; } h4 { font-size: 90%; line-height: 130%; margin: 0 0 0 0; } h5 { font-size: 80%; line-height: 120%; margin: 0 0 0 0; } h6 { font-size: 70%; line-height: 110%; margin: 0 0 0 0; } .subheader { color: #777; } /* Textauszeichnungen (https://wiki.selfhtml.org/wiki/HTML/Textauszeichnung) */ em { font-style: italic; } /* emphasized betont*/ strong { font-weight: bold; color: inherit; } /* small { display: inline-block; font-size: 80%; line-height: 90%; margin-top:2px} */ small { display: unset; font-size: 80%; line-height: unset; margin-top: 0px; } /* Blockquotes */ blockquote, blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; } blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; } blockquote cite { display: block; font-size: 12px; color: #555; } blockquote cite:before { content: "\2014 \0020"; } blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; } hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; } /* #Links ================================================== */ /* #Lists ================================================== */ /* #Tables ================================================== */ /* #Images ================================================== */ p img { margin: 0; } /* #Misc ================================================== */ /* #Font-Face ================================================== */ /* This is the proper syntax for an @font-face file Just create a "fonts" folder at the root, copy your FontName into code below and remove comment brackets */ /* @font-face { font-family: 'FontName'; src: url('../fonts/FontName.eot'); src: url('../fonts/FontName.eot?iefix') format('eot'), url('../fonts/FontName.woff') format('woff'), url('../fonts/FontName.ttf') format('truetype'), url('../fonts/FontName.svg#webfontZam02nTh') format('svg'); font-weight: normal; font-style: normal; } Beispiel @font-face { font-family: 'meine-schrift'; src: url('pfad/zu/meinerschrift.woff2') format('woff2'), url('pfad/zu/meinerschrift.woff') format('woff'); } p { font-family: meine-schrift, arial, sans-serif; } MS: SIL: Arial Liberation Sans Times New Roman Liberation Serif Courier New Liberation Mono Calibri Carlito oder Chivo */ /* ICH WILL NICHT MEHR AUF ALLE BROWSER RÜCKSICHT NEHMEN. ES WERDEN NUN (2022) NUR NOCH .WOFF2 UND .TTF BERÜCKSICHTIGT. NUR NOCH ZU BESONDEREN SITUATIONEN, WERDE ICH AUCH ANDERE, Z.B. .SVG VERWENDEN. */ /*************************************************/ /* beg of */ /* LESS: projekt_font_Fontname.less */ /* */ /*************************************************/ /* #Font-Face ================================================== */ /* This is the proper syntax for an @font-face file Just create a "fonts" folder at the root, copy your FontName into code below and remove comment brackets */ /* @font-face { font-family: 'FontName'; src: url('../fonts/FontName.eot'); src: url('../fonts/FontName.eot?iefix') format('eot'), url('../fonts/FontName.woff') format('woff'), url('../fonts/FontName.ttf') format('truetype'), url('../fonts/FontName.svg#webfontZam02nTh') format('svg'); font-weight: normal; font-style: normal; } Beispiel @font-face { font-family: 'meine-schrift'; src: url('pfad/zu/meinerschrift.woff2') format('woff2'), url('pfad/zu/meinerschrift.woff') format('woff'); } p { font-family: meine-schrift, arial, sans-serif; } MS: SIL: Arial Liberation Sans Times New Roman Liberation Serif Courier New Liberation Mono Calibri Carlito oder Chivo */ .font-LiberationSans-Regular { src: url('fonts/Liberation/LiberationSans-Regular.woff2') format('woff2'), url('fonts/Liberation/LiberationSans-Regular.ttf') format('truetype'); } .font-LiberationSans-Italic { src: url('fonts/Liberation/LiberationSans-Italic.woff2') format('woff2'), url('fonts/Liberation/LiberationSans-Italic.ttf') format('truetype'); } .font-LiberationSans-Bold { src: url('fonts/Liberation/LiberationSans-Bold.woff2') format('woff2'), url('fonts/Liberation/LiberationSans-Bold.ttf') format('truetype'); } .font-LiberationSans-BoldItalic { src: url('fonts/Liberation/LiberationSans-BoldItalic.woff2') format('woff2'), url('fonts/Liberation/LiberationSans-BoldItalic.ttf') format('truetype'); } .font-LiberationSerif-Regular { src: url('fonts/Liberation/LiberationSerif-Regular.woff2') format('woff2'), url('fonts/Liberation/LiberationSerif-Regular.ttf') format('truetype'); } .font-LiberationSerif-Italic { src: url('fonts/Liberation/LiberationSerif-Italic.woff2') format('woff2'), url('fonts/Liberation/LiberationSerif-Italic.ttf') format('truetype'); } .font-LiberationSerif-Bold { src: url('fonts/Liberation/LiberationSerif-Bold.woff2') format('woff2'), url('fonts/Liberation/LiberationSerif-Bold.ttf') format('truetype'); } .font-LiberationSerif-BoldItalic { src: url('fonts/Liberation/LiberationSerif-BoldItalic.woff2') format('woff2'), url('fonts/Liberation/LiberationSerif-BoldItalic.ttf') format('truetype'); } .font-LiberationMono-Regular { src: url('fonts/Liberation/LiberationMono-Regular.woff2') format('woff2'), url('fonts/Liberation/LiberationMono-Regular.ttf') format('truetype'); } .font-LiberationMono-Italic { src: url('fonts/Liberation/LiberationMono-Italic.woff2') format('woff2'), url('fonts/Liberation/LiberationMono-Italic.ttf') format('truetype'); } .font-LiberationMono-Bold { src: url('fonts/Liberation/LiberationMono-Bold.woff2') format('woff2'), url('fonts/Liberation/LiberationMono-Bold.ttf') format('truetype'); } .font-LiberationMono-BoldItalic { src: url('fonts/Liberation/LiberationMono-BoldItalic.woff2') format('woff2'), url('fonts/Liberation/LiberationMono-BoldItalic.ttf') format('truetype'); } /*************************************************/ /* end of */ /* LESS: projekt_font-Fontname.less */ /*************************************************/ /*************************************************/ /* beg of */ /* LESS: projekt_font_ExoYEM.less */ /* */ /* .font-ExoYEM-Regular */ /* .font-ExoYEM-Light */ /*************************************************/ /* #Font-Face ================================================== */ /* This is the proper syntax for an @font-face file Just create a "fonts" folder at the root, copy your FontName into code below and remove comment brackets */ /* @font-face { font-family: 'FontName'; src: url('../fonts/FontName.eot'); src: url('../fonts/FontName.eot?iefix') format('eot'), url('../fonts/FontName.woff') format('woff'), url('../fonts/FontName.ttf') format('truetype'), url('../fonts/FontName.svg#webfontZam02nTh') format('svg'); font-weight: normal; font-style: normal; } Beispiel @font-face { font-family: 'meine-schrift'; src: url('pfad/zu/meinerschrift.woff2') format('woff2'), url('pfad/zu/meinerschrift.woff') format('woff'); } p { font-family: meine-schrift, arial, sans-serif; } MS: SIL: Arial Liberation Sans Times New Roman Liberation Serif Courier New Liberation Mono Calibri Carlito oder Chivo */ .font-ExoYEM-Regular { src: url('fonts/ExoYEM/ExoYEM-Regular.woff2') format('woff2'), url('fonts/ExoYEM/ExoYEM-Regular.ttf') format('truetype'); } .font-ExoYEM-Light { src: url('fonts/ExoYEM/ExoYEM-Light.woff2') format('woff2'), url('fonts/ExoYEM/ExoYEM-Light.ttf') format('truetype'); } /*************************************************/ /* end of */ /* LESS: projekt_font-ExoYEM.less */ /*************************************************/ /* Lege hier die Standards fest: font-family aber auch Größe und Aussehen */ /* */ /* fNormal */ /* fMenu */ /* fCode */ /* fHandschrift */ @font-face { font-family: 'fNormal'; font-weight: normal; font-style: normal; src: url('fonts/Liberation/LiberationSans-Regular.woff2') format('woff2'), url('fonts/Liberation/LiberationSans-Regular.ttf') format('truetype'); } @font-face { font-family: 'fMenu'; font-weight: normal; font-style: normal ; } @font-face { font-family: 'fCode'; font-weight: normal; font-style: normal; src: url('fonts/Liberation/LiberationMono-Regular.woff2') format('woff2'), url('fonts/Liberation/LiberationMono-Regular.ttf') format('truetype'); } @font-face { font-family: 'fHandschrift'; font-weight: normal; font-style: normal; } @font-face { font-family: 'fSymbol'; font-weight: normal; font-style: normal; } @media only screen and (min-width: 0px) { body { font-size: 0.7rem; /* Schriftgröße */ line-height: 0.9rem; /* Zeilenhöhe (Eine Prozentangabe für die Zeilenhöhe bezieht sich dabei auf den Wert der Schriftgröße. ) */ } } @media only screen and (min-width: 576px) { body { font-size: 0.7rem; /* Schriftgröße */ line-height: 0.9rem; /* Zeilenhöhe (Eine Prozentangabe für die Zeilenhöhe bezieht sich dabei auf den Wert der Schriftgröße. ) */ } } @media only screen and (min-width: 992px) { body { font-size: 1rem; /* Schriftgröße */ line-height: 1.2rem; /* Zeilenhöhe (Eine Prozentangabe für die Zeilenhöhe bezieht sich dabei auf den Wert der Schriftgröße. ) */ } } @media only screen and (min-width: 1200px) { /*Weite indirekt durch left und right gesetzt: */ left: 15.5em; right: 1em; max-width: 100%; } /*************************************************/ /* end of */ /* LESS: projekt_typo.less */ /*************************************************/