@import "styles_Navigation.css";

html, body {
    height:      100%;
    width:       100%;
    margin:      0px;
    padding:     0px;
    box-sizing:  border-box;
    font-family: Verdana,sans-serif;
}




/*********************************************************************************************************************
 *********************************************************************************************************************
 **   Wrapper
 *********************************************************************************************************************
 *********************************************************************************************************************/
 
.wrapper {
	min-width:  100%;
    min-height: 100%;
    box-sizing: border-box;
}
 
 
/*********************************************************************************************************************
 *********************************************************************************************************************
 **   Header (.page-header)
 *********************************************************************************************************************
 *********************************************************************************************************************/

.page-header {
    position:         fixed;
    top:              0px;
    height:           50px;
    width:            100%;
    z-index:          100;
/*    background-color: rgb(238 232 170 / 0.4); */ /* palegoldenrod */
    background-color: rgb(238 232 170); /* palegoldenrod */
    display:          flex;
    flex-direction:   row;
    align-items:      center;
    justify-content:  space-between;
}


/*------------------------------------------------------
 *   Language selection
 *-----------------------------------------------------*/

#section_LanguageSelection {
    display:       flex;
  }


#section_LanguageSelection table {
    width:         100px;
    margin-left:   auto;
    margin-right:  30px; 
    margin-right:  30px; 
}


/*********************************************************************************************************************
 *********************************************************************************************************************
 **   Main content (.page-body)
 *********************************************************************************************************************
 *********************************************************************************************************************/

.page-body {
    position: fixed; 
    top: 100px;
    bottom: 50px;
    width: 100%;
    z-index: 1;
    overflow:auto;
}

@media print {
    .page-body {
        position: static; 
        width: 100%;
        z-index: 1;
        overflow:auto;
	}
}

/**********************************************************************
 * Highlight targeted notes or definition terms:
 **********************************************************************/
main :target {
  background: gold;
}


/*********************************************************************************************************************
 *********************************************************************************************************************
 **   Footer (.page-footer)
 *********************************************************************************************************************
 *********************************************************************************************************************/

.page-footer {
    position:         fixed;
    bottom:           0px; 
    width:            100%;
    height:           50px;
    z-index:          100;
    background-color: rgb(238 232 170); /* palegoldenrod */
}

.page-footer p {
    text-align:center;
    font-size:10px;
}

@media print {
	.page-header {
		display: none;
	}
	
	.page-footer {
	    display: none;
	}
}



/*********************************************************************************************************************
 *********************************************************************************************************************
 **   Page Body
 *********************************************************************************************************************
 *********************************************************************************************************************/
 
 
/*********************************************************************************************************************
 **   Special paragraph styles within PAF generated files
 *********************************************************************************************************************/
 
 .paf_table {
    border: none;
    border-spacing: 5px;
 }
 
 
 .paf_table td {
    border: none
 }
 
 
 

/*********************************************************************************************************************
 **   Paragraph styles
 *********************************************************************************************************************/
 

.page-headline {
	flex:         10 1 auto; 
	text-align:   center; 
    font-weight:  normal;
    font-style:   normal;
    font-size:    24px;
    color:        rgb(175 35 35);
}


h1,h2,h3,p,ul,ol,dt {
    margin-right:20px;
    margin-left:20px;
}

h1 {
    font-weight:normal;
    font-style:normal;
    font-size:17px;
    line-height:1.5em;
    color:rgb(175 35 35);
    border-bottom:rgb(175 35 35) solid 1px;
    padding-bottom:5px;
    padding-left:25px;
    margin-top:20px;
}

h2 {
    font-weight:bold;
    font-style:normal;
    font-size:13px;
    line-height:1.5em;
    color:rgb(175 35 35);
    border-bottom:rgb(175 35 35) solid 1px;
    padding-bottom:3px;
    padding-left:25px;
    margin-top:20px;
    width: max-content
}

h3 {
    font-weight:bold;
    font-style:normal;
    font-size:12px;
    line-height:1.5em;
    color:rgb(175 35 35);
    padding-bottom:3px;
    padding-left:25px;
    margin-top:20px;
}

dfn, dt {
    font-weight:bold;
    font-style:normal;
    font-size:12px;
    line-height:1.5em;
    padding-bottom:3px;
    padding-left:25px;
    margin-top:20px;
}

dt {
     font-weight:bold;
    font-size:13px;
    line-height:1.5em;
    padding-left:25px;
    color:black;
}

p, dd {
    font-weight:normal;
    font-size:13px;
    line-height:1.5em;
    padding-left:25px;
    color:black;
}

blockquote {
    font-weight:normal;
    font-size:13px;
    font-style: italic;
    line-height:1.5em;
    padding-left:25px;
    color:blue;
}

table p {
    padding-left:0px;
    padding-left:0px;
}


tr, td {
    font-weight:normal;
    font-size:13px;
    line-height:1.5em;
    color:black;
}

main table {
    font-family:Verdana,sans-serif;
    margin-left:50px;
    margin-right:50px;
    margin-bottom:25px;
    border: 1px solid
    
/*    display:grid;*/
}

main th {
    font-weight:bold;
    font-size:13px;
    line-height:1.5em;
    color:black;
    padding:10px;
    border: 1px solid
/*    padding-left:25px;*/
/*    padding-top:25px;*/
/*    padding-bottom:25px;*/
}

main td {
    font-weight:normal;
    font-size:13px;
    line-height:1.5em;
    color:black;
    padding:10px;
    border: 1px solid
/*    padding-left:25px;*/
/*    padding-top:25px;*/
/*    padding-bottom:25px;*/
}

ul,ol {
    padding-left:25px;
}


li {
    font-weight:normal;
    font-size:13px;
    line-height:1.5em;
    color:black;
    margin-left:25px;
    margin-top:6px;
    margin-bottom:6px;
}

.nolist {
      list-style: none ;
}


li, p {
    margin-top:unset;
}



/*********************************************************************************************************************
 **   External Links
 *********************************************************************************************************************/

a[rel="external"]::after {
    content: url("../Resources/Img/External_Link_Icon.svg"); 
}

/*********************************************************************************************************************
 **   Figures
 *********************************************************************************************************************/

.tg_figure {
    margin: 1em; 
    clear: right; 
    float: right;
    border: 1px solid #c8ccd1;
    border-bottom: 0;
    background-color: #f8f9fa;
    display: table;
}


.tg_image {
    border: 1px solid #c8ccd1;
    background: #ffffff;
    margin: 3px;
}

.tg_figure_caption {
    border: 1px solid #c8ccd1;
    border-top: 0;
    background-color: #f8f9fa;
    display: table-caption;
    caption-side: bottom;
    text-align: left;
}

.tg_figure_caption p {
    margin: 0px;
    padding: 5px
}



/*********************************************************************************************************************
 **   Footnotes
 *********************************************************************************************************************/
 

/**********************************************************************
 * Initialiazing a `footnotes` counter on the wrapper
 *********************************************************************/
main {
  counter-reset: footnotes;
}

/**********************************************************************
 * Inline footnotes references
 * 1. Increment the counter at each new reference
 * 2. Reset link styles to make it appear like regular text
 **********************************************************************/
a[role="doc-noteref"] {
  counter-increment: footnotes;
}

/**********************************************************************
 * Actual numbered references
 * 1. Display the current state of the counter (e.g. `[1]`)
 * 2. Align text as superscript with reduced font size (see https://www.w3.org/TR/CSS21/sample.html)
 * 4. Slightly offset the number from the text
 * 5. Reset link styles on the number to show it's usable
 **********************************************************************/
a[role="doc-noteref"]::after {
  content: '[' counter(footnotes) ']';
  margin-left: 2px;
  vertical-align: super;
  font-size: .83em;
  cursor: pointer;
}


/**********************************************************************
 * Formatting footnotes:
 **********************************************************************/
a[role="doc-backlink"]::after {
  content:           '\21A9';
  cursor:            pointer;
  display:           inline-block;
  margin-left:      -2em;
}


li[role="doc-footnote"] {
    margin-top:      20px;
}


li[role="doc-footnote"] :is(p, li) {
    line-height:     1em;
    padding-left:    1em;
    margin-bottom:   6px;
}