/**
 * Gremmler - CSS Styling
 *
 * Set global styling definitions
 *
 * @category   content
 * @package    Gremmler
 * @author     Christian Brinkert <christian.brinkert@sector27.de>
 * @copyright  2023 sector27 GmbH
 * @version    1.0.0
 */

/* ------------------ OpenSans font integration ------------------ */


@font-face {
    font-family: 'SourceSansPro';
    src: url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/EOT/SourceSansPro-Regular.eot');
    src: url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/EOT/SourceSansPro-Regular.eot?#iefix') format('embedded-opentype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/WOFF/OTF/SourceSansPro-Regular.otf.woff') format('woff'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/TTF/SourceSansPro-Regular.ttf') format('truetype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/SVG/SourceSansPro-Regular.svg') format('svg');
    font-style: normal;
    font-weight: 400;
    font-stretch: normal;
}
@font-face {
    font-family: 'SourceSansProBold';
    src:  url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/EOT/SourceSansPro-Bold.eot');
    src:  url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/EOT/SourceSansPro-Bold.eot?#iefix') format('embedded-opentype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/WOFF/OTF/SourceSansPro-Bold.otf.woff') format('woff'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/TTF/SourceSansPro-Bold.ttf') format('truetype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/SVG/SourceSansPro-Bold.svg') format('svg');
    font-style: normal;
    font-weight: 700;
    font-stretch: normal;
}
@font-face {
    font-family: 'SourceSansProBlack';
    src:  url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/EOT/SourceSansPro-Black.eot');
    src:  url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/EOT/SourceSansPro-Black.eot?#iefix') format('embedded-opentype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/WOFF/OTF/SourceSansPro-Black.otf.woff') format('woff'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/TTF/SourceSansPro-Black.ttf') format('truetype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/SourceSansPro/SVG/SourceSansPro-Black.svg') format('svg');
    font-style: normal;
    font-weight: 700;
    font-stretch: normal;
}
@font-face {
    font-family: 'FontAwesome';
    src:  url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/FontAwesome/fonts/fontawesome-webfont.eot');
    src:  url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/FontAwesome/fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/FontAwesome/fonts/fontawesome-webfont.woff') format('woff'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/FontAwesome/fonts/fontawesome-webfont.ttf') format('truetype'),
    url('/typo3conf/ext/sc27_sitepackage/Resources/Public/Fonts/FontAwesome/fonts/fontawesome-webfont.svg') format('svg');
    font-style: normal;
    font-weight: 500;
    font-stretch: normal;
}



*{
    font-family: SourceSansPro, Arial, Helvetica, sans-serif;
}
/* some rte configs */
.htmlarea-content-body{ font-size:14px !important;}




/**
 * DEFAULLT TYPO3 and RTE CONTENT ELEMENTS / TAGS
 */


/*
 * Headers
 */
h1,h2,h3,h4,h5{
    margin-bottom: .5em;
}
h1, h1 span {
    background: rgb(0,150,170);
    background-image:linear-gradient(135deg, rgb(0,150,170) 0%, rgb(0,119,133) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: SourceSansPro, sans-serif;
    font-weight: 900;
    font-size: 2.6rem;
    line-height: 125%;
    letter-spacing: 1px;
    display: inline-block;
}
h2, h2 span {
    color: rgb(0,150,170);
    font-size: 1.9rem;
    font-weight:bold;
    letter-spacing: 1px;
    font-family: SourceSansPro, sans-serif;
    line-height:2.8rem;
}
h3{
    font-family: SourceSansPro, sans-serif;
}
h4{ color:#000; font-size:1.4em; }
h5{ color:#000; font-size:1.2em;}

h1 > a:hover, h2 > a:hover, h3 > a:hover, h4 > a:hover, h5 > a:hover{
    text-decoration:none;
}
h1 > p{ margin: 0; }
h1 > p > span{ line-height: 100%; }
span.headerline{
    font-family: SourceSansPro, sans-serif;
    margin-left: 1.7rem;
}
span.headerline:first-child{
    margin-left: 0;
}
h3 span.headerline{
    display:inline-block;
    font-family: SourceSansPro, sans-serif;
    background-color: rgba(0,150,170,.7);
    color:rgb(255,255,255);
    font-size:.9em;
    padding: .4em .5em;
    letter-spacing: 2px;
    margin-bottom: 0.3em;
}
h3 span.headerline:first-child{
    font-size:1.6em;
}
h2.gremmler span { position:relative; }
h2.gremmler span:after {
    content:"\f111";
    font-family: FontAwesome, fantasy;
    color:rgb(0,150,170);
    position:absolute;
    top: -28px;
    right: -1px;
    font-size: 0.8rem;
}


/**
 * PARAGRAPHS
 */
p{ line-height: 145%; font-size:110%; color:#000; margin: .75em 0;}
p.teaser,p.seiteneinleitung{ font-size:135%; line-height:145%; margin-top:.3em; margin-bottom:.3em;}
p.subtitle,p.untertitel{ font-size:110%; line-height:125%; margin-top:.3em; margin-bottom:.3em;}
p.zitat,p.cite{ font-family: Times, serif; font-style: italic; color:#676767; font-size:145%; line-height:100%;}
p.smalltext,p.kleingedrucktes{ font-size:90%; line-height: 120%; }
p.footnote,p.fussnote{ font-size:80%; line-height: 100%; }
p.blacktext{ font-family:OpenSansBlack, sans-serif; font-weight: bold;}
p.runningtext{line-height:110%;}
p.compacttext{ line-height:100%; }

p.twoColumns{
    column-count: 2;
    column-gap: 4em;
}
p.threeColumns{
    column-count: 3;
    column-gap: 4em;
}


/* SPAN STYLES */
.white{     color: #fff; }
.lightgrey{ color: #f5f3f3;}
.grey{      color:#b5b2b2;}
.blue{      color: #286c83;}
.violett{   color: #5f02b4;}
.red{       color:rgb(149,29,2);}
.nowrap{    white-space: nowrap;}


.cke .white{ background-color:lightgrey; }

b{ color:inherit; }
p.indent, .indent, div.indent{ padding-left:15px;}

sub{ font-size:75%; line-height:0.75em; }
sup{ font-size:75%; line-height:0.75em; }





/**
 * ALIGNMENTS to various elements
 */
p.align-left,h1.align-left,h2.align-left,h3.align-left,
h4.align-left,h5.align-left,h6.align-left,td.align-left,
th.align-left,#bottomContents p.align-left{
    text-align: left;
}

p.align-center,h1.align-center,h2.align-center,h3.align-center,
h4.align-center,h5.align-center,h6.align-center,td.align-center,
th.align-center{
    text-align: center;
}

p.align-right,h1.align-right,h2.align-right,h3.align-right,
h4.align-right,h5.align-right,h6.align-right,td.align-right,
th.align-right{
    text-align: right;
}

p.align-justify,h1.align-justify,h2.align-justify,h3.align-justify,
h4.align-justify,h5.align-justify,h6.align-justify,td.align-justify{
    text-align: justify;
}

td.valign-top, th.valign-top  {
    vertical-align: top;
}

td.valign-middle, th.valign-middle{
    vertical-align: middle;
}

td.valign-bottom, th.valign-bottom{
    vertical-align: bottom;
}
/* END of alignments */






/**
 * LINKS
 */
a:hover{
    color: rgb(0,150,170);
}
p a:hover{ padding:3px 0; margin:-3px 0; }

a.mail, a.download,
a{
    text-decoration: none;
    color:#000;
    border-bottom:1px dotted rgb(0,150,170);
    font-style:italic;
}
a[target="_blank"]:after{
    transform: rotate(-45deg);
    margin-top:-.15em;
    display:inline-block;
    font-family: 'FontAwesome',fantasy;
    font-style:normal;
    font-size:80%;
    padding-left:10px;
    color:rgb(0,150,170);
    vertical-align: top;
}
a[target="_blank"]:after{
    content: "\f054";
}
.ce-uploads a[target="_blank"]:after{
    content: unset;
}
a[target="_blank"]:hover:after{
    color:rgb(0,150,170) !important;
}





/**
 * UL / OL - unsorted and sorted lists
 */

.cke_editable ul,
.frame ul{
    padding-left:0;
}
.cke_editable ul li,
.frame ul li{
    color:#000;
    list-style-type:none;
    padding:3px 0 3px 40px;
    text-indent: -24px;
    line-height:125%;
    font-size: 110%;
}
.cke_editable ul li:before,
.frame ul li:before{
    content: "\f054";
    font-family: 'FontAwesome', fantasy;
    color: rgb(0,150,170);
    margin-right:8px;
}
.cke_editable ul ul,
.frame ul ul{
    padding-top:5px;
    padding-left:15px;
}
.cke_editable ul ul li,
.frame ul ul li{
    padding-left:5px;
    margin-bottom:0;
    font-size:100%;
}


/* lined */
.cke_editable ul.lined,
.frame ul.lined{
    border-top:1px solid #f3f3f3;
}
.cke_editable ul.lined li,
.frame ul.lined li{
    padding-top:5px;
    padding-bottom:5px;
    border-bottom:1px solid #f3f3f3;
}

/* lined ok */
.cke_editable ul.ok li:before,
.frame ul.ok li:before{
    content: "\f00c";
}
/* ok big */
.cke_editable ul.okbig,
.frame ul.okbig{ margin-left:9px;}
.cke_editable ul.okbig li,
.frame ul.okbig li{
    margin-bottom:.5em;
    padding-left:42px;
    text-indent:-37px;
}
.cke_editable ul.okbig ul li,
.frame ul.okbig ul li{
    padding-left:5px;
}
.cke_editable ul.okbig li:before,
.frame ul.okbig li:before{
    content: "\f00c";
    position:relative;
    top:.15em;
}
.cke_editable ul.okbig ul li,
.frame ul.okbig ul li{
    padding-left:5px;
    margin-bottom:0;
}
/* attention */
.cke_editable ul li.attention:before,
.frame ul li.attention:before{
    content: "\f06a";
    color:rgb(0,150,170);
}





/* ordered lists */
.cke_editable ol,
.frame ol{
    margin:5px 0;
    padding: 0 0 0 15px;
}
.cke_editable ol li,
.frame ol li{
    color:#000;
    font-size:90%;
    line-height:125%;
    padding:2px 0;
}
.cke_editable ol li ol li,
.frame ol li ol li{}

.cke_editable ol.roman,
.frame ol.roman{
    list-style-type: upper-roman;
}
.cke_editable ol.roman li ol,
.frame ol.roman li ol{
    list-style-type: upper-roman;
}

.cke_editable ol.alpha,
.frame ol.alpha{
    list-style-type: lower-alpha;
}
.cke_editable ol.alpha li ol,
.frame ol.alpha li ol{
    list-style-type: lower-alpha;
}

.cke_editable ol.footnote,
.frame ol.footnote{ margin-top:0; margin-bottom:0;}
.cke_editable ol.footnote:hover,
.frame ol.footnote:hover{ color:rgb(91,92,75) }
.cke_editable ol.footnote li,
.frame ol.footnote li{
    padding: 0 0 0 0;
    margin-top:0; margin-bottom:0;
}
.cke_editable ol.footnote li ol,
.frame ol.footnote li ol{ margin-top:0; margin-bottom:0;}
.cke_editable ol li,
.frame ol li{
    padding-left:5px;
}
/* END of: Ordered and unordered lists */




/* TABLES - default table definitions */
table caption{
    padding:3px;
    margin-bottom:2px;
    font-size:83.33%;
}
table {
    border-collapse: separate;
}
table tr th {
    background-color: #efefef;
    border: 1px solid #efefef;
    padding:7px;
    font-weight:normal;
    font-family: SourceSansPro, sans-serif;
    font-size:90%;
    color:#696566;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 1)
}
table tr td.highlight {
    background-color:rgb(0,150,170);
    color:#fff;
}
table tr td {
    border: 1px solid #efefef;
    padding:7px;
    font-size:90%;
    color:#696566;
}
table tr th.hightlight {
    color:rgb(255,255,255);
}
table tr td.hightlight {
    color:rgb(255,255,255);
}


/* zebra tables, tables with alternating background colors */
table.zebra {
    border-collapse: separate;
}
table.zebra100 {
    border-collapse: separate;
    width:100%;
}
table.zebra th, table.zebra100 th{
    padding:7px;
    font-weight:normal;
    font-size:90%;
    background-color: rgb(0,150,170);
    border: 1px solid rgb(0,150,170);
    color:#fff;
    text-shadow: none;
}
table.zebra td, table.zebra100 td{
    padding:7px;
    border-width:0;
    color:#696566;
}
table.zebra tr:nth-child(2n), table.zebra100 tr:nth-child(2n) {
    background-color: #f7f7f7;
    border: 1px solid #f2f2f2;
}
table.zebra tr:nth-child(2n+1), table.zebra100 tr:nth-child(2n+1) {
    background-color: #fff;
    border: 1px solid #f2f2f2;
}
table.zebra caption, table.zebra100 caption{
    padding:3px;
    margin-bottom:0;
    font-size:83.33%;
}



/* backgrounded tables */
table.backgrounded caption{
    border:1px solid #f5f3f3;
    padding:3px;
    font-size:83.33%;
}
table.backgrounded {
    border-collapse: separate;
}
table.backgrounded tr th {
    color:#696566;
    font-weight:bold;
    font-size:90%;
    font-family: OpenSans,sans-serif;
    border: 1px solid #f5f3f3;
    padding:7px;
}
table.backgrounded tr td {
    background-color: #f5f3f3;
    border: 1px solid #f5f3f3;
    padding:7px;
    color:#696566;
}

/* blind tables */
table.blind caption{
    padding:3px;
    font-size:83.33%;
    border-width:0;
}
table.blind {
    border-collapse: collapse;
}
table.blind tr th {
    background-color: transparent;
    border: none;
    padding: 0 10px 3px 0;
    text-shadow: none;
    font-weight:normal;
    color:#696566;
}
table.blind tr td {
    background-color: transparent;
    border: none;
    padding: 0 5px 3px 0;
    color:#696566;
}
/* END OF tables */