@charset "UTF-8";

@font-face {
	font-family: 'roboto';
	src: url('Roboto-Regular.ttf');
}


@font-face {
	font-family: 'roboto-bold';
	src: url('Roboto-Bold.ttf');
}

body {
    -webkit-user-select: none;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    margin: 0px 0px 0px 0px;
    padding: 5px 3px 5px 3px;
    font-family: roboto;
    color: #3E3D40;
    font-size: 17px;
    word-spacing: 1px;
    text-align: left;
}


/*-----------------------Splitt Mark within Content------------------------*/

p.html-page-end-here {
    color: #F00;
    font-size: 14px;
}


/*-----------------------Standard Text Definition------------------------*/

p {
    margin: 2px;
    line-height: normal;
}

.indent {
    margin-left: 10px;
    line-height: normal;
}

p.text {
    margin-bottom: 5px;
}


/*-----------------------Headline Definition - 4 Level (Note: Display: none! Exception Level 4 clarify behavior with Editor)------------------------*/

p.h1:first-child {
    margin-top: 0px;
}

p.h1 {
    color: #08338f;
    font-size: 17px;
    line-height: 1.4em;
    font-family: roboto-bold;
    margin: 10px 0px 3px 2px;
    display: none;
}

p.h2 {
    color: #298A08;
    font-size: 16px;
    line-height: 1.4em;
    font-family: roboto-bold;
    margin: 5px 0px 0px 2px;
    display: none;
}

p.h3 {
    color: #FF8000;
    font-size: 15px;
    line-height: 1.4em;
    font-family: roboto-bold;
    margin: 5px 0px 0px 2px;
    display: none;
}

p.h4 {
    color: #585858;
    font-size: 16px;
    line-height: 1.3em;
    font-family: roboto-bold;
    margin: 2px 0px 0px 2px;
    display: none;
}


/*-----------------------Enumeration with Bullet Points - First Level------------------------*/

p.listlevel1:before {
    content: "\2022";
    margin-right: 0.5em;
    color: #58585A;
}

p.listlevel1 {
    margin: 0px;
    text-indent: -0.9em;
    margin-left: 1.15em;
    line-height: 1.3em;
    text-align: left;
}


/*-----------------------Enumeration with Hyphen - Second Level------------------------*/

p.listlevel2:before {
    content: "\2212";
    margin-right: 0.4em;
}

p.listlevel2 {
    margin: 0px;
    text-indent: -0.9em;
    margin-left: 2em;
    line-height: 1.3em;
}
p.listlevel2-new:before {
    content: "\2212";
    margin-right: 0.1em;
}

p.listlevel2-new {
    margin: 0px;
    text-indent: -0.9em;
    margin-left: 0.8em;
    line-height: 1.3em;
}

p.listlevel3:before {
    content: "\2212";
    margin-right: 0.3em;
}

p.listlevel3 {
    margin: 0px;
    text-indent: -0.5em;
    margin-left: 2.3em;
    /*1.15em;*/
    line-height: 1.4em;
}


/*-----------------------Numbered List, first and second Level Note: also latin, small/big letters ------------------------*/

ol.enum1 {
    margin-top: 5px;
    margin-bottom: 10px;
    padding-left: 1.7em;
    list-style-position: outside;
}

li.enum1 {
    margin: 0px 2px 0px 3px;
    text-align: left;
    line-height: 1.2em;
}

ol.enum2 {
    margin: 5px 0px 5px 0px;
    padding-left: 3.2em;
    list-style: lower-latin;
    list-style-position: outside;
}

li.enum2 {
    margin: 0px 2px 0px 2px;
    text-align: left;
    line-height: 1.2em;
}


/* -----------------Ordered list---------------        */

p.list:before {
    content: "";
    margin-right: 0.8em;
}

p.list {
    margin: 0px;
    text-indent: -1.999em;
    margin-left: 1.5em;
    margin-bottom: 0.40em;
    margin-top: 0.05em;
    color: #2e2d30;
}


/*-----------------------Standard Source Code with div box------------------------*/

p.reference {
    font-size: 16px;
    line-height: 18px;
    margin-bottom: 5px;
}

div.ref {
    background: #E6E8FA;
    /*or #f5f5f5 very light bg*/
    border: 1px solid #FFF;
    padding: 5px 2px 2px 2px;
    margin: 7px 1px 13px 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .4);
}


/*-----------------------Standard footnote with div container------------------------*/

p.footnote {
    font-size: 16px;
    font-style: italic;
    line-height: 18px;
    margin-bottom: 5px;
}

div.footn {
    background: #D9D9F3;
    /*or #f5f5f5 very light bg*/
    border: 1px solid #D9D9F3;
    padding: 2px 2px 0px 2px;
    margin: 7px 1px 10px 5px;
    border-radius: 5px;
    -moz-border-radius: 1px;
    -webkit-border-radius: 1px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .4);
}


/*----------Standard Image Declaration with div container - use div container for Images and Algorithm-----------*/

.img-anchor {
    font-color: red;
    font-family: roboto-bold;
}

div.legend {
    width: 100%;
    margin-top: 7px;
    margin-bottom: 7px;
    margin-left: 1px;
    padding: -1px;
    border: 0px solid #a6003a;
    color: #58585a;
    /* gray 80% */
}

img {
    width: 100%;
}


/*-----------------------Standard Image/Algorithm caption------------------------*/

p.fig-caption {
    font-family: roboto-bold;
    color: #3E3D40;
    text-align: left;
    margin-top: 12px;
}


/*-------------------------------Images------------------------------------*/

@media screen and (max-height: 568px) {
    Div.imge img {
        max-width: 310px;
    }
}

@media screen and (max-height: 310px) {
    Div.img img {
        max-width: 555px;
    }
}

@media screen and (max-width: 448px) {
    Div.img img {
        max-width: 437px;
    }
}

@media screen and (max-width: 320px) {
    Div.img img {
        max-width: 310px;
    }
}


/*--------------------------Standard Table Declaration------------------------*/

table.table+table.table {
    margin-top: 15px;
}

table.table {
    width: 100%;
    table-layout: fixed;
    border-top: 1px solid #bfbfbf;
    border-collapse: collapse;
    margin: 0px 0px 3px 1px;
}
table.table1 {
    width: 100%;
    table-layout: fixed;
    border-top: 1px solid #bfbfbf;
    border-collapse: collapse;
    margin: 0px 0px 3px 1px;
	vertical-align:top;
}


/*------------------------------Caption----------------------------*/

caption {
    margin: 0px 2px 3px 2px;
    text-align: left;
}


/*-----------Standard Table head declaration, first, second Level and third Level----------*/

th.table-header1 {
    background-color: #0060F8;
    padding: 3px 2px 3px 2px;
    vertical-align: top;
}

th.table-header2 {
    background-color: #D8E8FD;
    padding: 3px 2px 3px 2px;
    vertical-align: top;
}

th.table-header3 {
    background-color: #EBEBEB;
    /*#D5D4D4; */
    padding: 3px 2px 3px 2px;
    vertical-align: top;
}

th.table-header4 {
    background-color: #9AB3FF;
    /*#D5D4D4; */
    padding: 3px 2px 3px 2px;
    vertical-align: top;
}


/*---------------Border behavior of table header---------------	*/

th.table-header1:first-child {
    border-bottom: 1px solid #E5E5E5;
}

th.table-header1+th.table-header1 {
    border-left: 1px solid #E5E5E5;
}

th.table-header2+th.table-header2 {
    border-left: 1px solid #E5E5E5;
}

th.table-header3+th.table-header3 {
    border-left: 1px solid #bfbfbf;
}


/*----------Standard Table Header Text declaration---------------*/

p.table-title1 {
    color: #ffffff;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.7px;
    text-align: left;
    margin-left: 5px;
    font-family: roboto-bold;
}

p.table-title2 {
    color: #3E3D40;
    ;
    /*#3E3D40;*/
    font-size: 16px;
    font-family: roboto-bold;
    line-height: 18px;
    word-spacing: 1px;
    text-align: left;
    margin-left: 5px;
}

p.table-title3 {
    color: #3E3D40;
    /*#3E3D40;*/
    font-size: 16px;
    font-weight: 450;
    line-height: 18px;
    word-spacing: 1px;
    text-align: left;
    margin-left: 5px;
    font-family: roboto-bold;
}

p.table-title4 {
    color: #3E3D40;
    /*#3E3D40;*/
    font-size: 16px;
    font-weight: 450;
    line-height: 18px;
    word-spacing: 1px;
    text-align: left;
    margin-left: 5px;
    font-family: roboto-bold;
}


/*---------Table columns and table rows border behavior----------*/

tr:first-child {
    border-bottom: 1px solid #bfbfbf;
}

tr+tr {
    border-bottom: 1px solid #bfbfbf;
}

td+td {
    border-left: 1px solid #bfbfbf;
}

td {
    padding: 3px 2px 3px 2px;
    background: #ffffff;
    vertical-align: top;
}


/*-------------------Standard Table Text----------------------*/

p.table-text {
    color: #3E3D40;
    font-family: roboto;
    font-size: 16px;
    line-height: 18px;
    margin-left: 3px;
    text-align: left;
}

p.table-text-smaller {
    color: #3E3D40;
    font-family: roboto;
    font-size: 10px;
    line-height: 18px;
    margin-left: 3px;
    text-align: left;
}

p.table-text-white {
    color: #ffffff;
    font-family: roboto;
    font-size: 16px;
    line-height: 18px;
    margin-left: 3px;
    text-align: left;
}

p.table-text-blue {
    color: #0060F8;
    font-family: roboto;
    font-size: 16px;
    line-height: 18px;
    margin-left: 3px;
    text-align: left;
}


/*------------------------------------Additional Table Declarations/Exceptions -----------------------------------*/


/*---------Standard Table Header Text Centered----------*/

p.table-title1-cent {
    color: #FFFFFF;
    font-family: roboto-bold;
    font-size: 16px;
    line-height: 18px;
    word-spacing: 1px;
    letter-spacing: -0.5px;
    margin: 3px 2px 0px 2px;
    text-align: center;
}

p.table-title2-cent {
    color: #3E3D40;
    font-family: roboto-bold;
    font-size: 16px;
    line-height: 18px;
    word-spacing: 1px;
    letter-spacing: -0.5px;
    margin: 3px 2px 0px 2px;
    text-align: center;
}

p.table-title3-cent {
    color: #3E3D40;
    font-family: roboto-bold;
    font-size: 16px;
    line-height: 18px;
    word-spacing: 1px;
    letter-spacing: -0.5px;
    margin: 3px 2px 0px 2px;
    text-align: center;
}


/*-------------------Standard Table Text centered----------------------*/

p.table-text-cent {
    color: #3E3D40;
    font-family: Arial;
    font-size: 16px;
    line-height: 18px;
    margin-left: 3px;
    text-align: center;
}



/*---------Table Cell Declaration Background any color----------*/


/*---------Column background gray  ----------*/

td.col-gray1 {
    background-color: #D2D2D2;
    vertical-align: middle;
    padding: 5px 2px 5px 2px;
}

td.col-gray2 {
    background-color: #E7E7E7;
    vertical-align: middle;
    padding: 5px 2px 5px 2px;
}

td.col-gray3 {
    background-color: #CCCCCC;
    padding: 5px 2px 5px 2px;
}


/*---------Column background blue  ----------*/

td.col-blue1 {
    background-color: #D4DCF0;
    text-align: left;
    padding: 5px 2px 5px 2px;
}

td.col-blue2 {
    background-color: #BDC9FA;
    text-align: left;
    padding: 5px 2px 5px 2px;
}

td.col-blue3 {
    background-color: #A4D7FF;
    text-align: left;
    padding: 5px 2px 5px 2px;
}

td.col-yellow {
    background-color: #FFDC25;
    text-align: left;
    padding: 5px 2px 5px 2px;
}

td.col-green1 {
    background-color: #BDE4E0;
    text-align: left;
    padding: 5px 2px 5px 2px;
}

td.col-green2 {
    background-color: #74CCC4;
    text-align: left;
    padding: 5px 2px 5px 2px;
}


/*---------Border Right and Left are Hidden----------*/

td.col-hidden {
    background-color: #ffffff;
    padding: 5px 2px 5px 2px;
    border-right: hidden;
    border-left: hidden;
}


/*---------Border bottom Hidden----------*/

td.col-bohidden {
    background-color: #ffffff;
    padding: 5px 2px 5px 2px;
    border-bottom: hidden;
}


/*---------Border TOP Hidden----------*/

td.col-tophidden {
    padding: 5px 2px 5px 2px;
    border-top: hidden;
}

th.col-tophidden {
    padding: 5px 2px 5px 2px;
    border-top: hidden;
}

td.col-bothidden {
    padding: 5px 2px 5px 2px;
    border-bottom: hidden;
}


/*----------------------------Different Text Highlighting Character styles---------------------------*/


/*---------Bold Text black----------*/

span.bold {
    font-family: roboto-bold;
    /*color:#000000; */
}

span.normal {
    font-weight: normal;
}


/*---------Bold Text any color----------*/

span.bold-color {
    font-family: roboto-bold;
    color: #1A60B3;
}


/*---------Bold Text and Underlined----------*/

span.bold-underline {
    font-family: roboto-bold;
    color: #f06e00;
    text-decoration: underline;
}


/*---------Italic Text--------------*/

span.italic {
    font-style: italic;
}


/*---------Italic Text and Underlined--------------*/

span.italic-underline {
    text-decoration: underline;
    font-style: italic;
}


/*--------------Text Underlined--------------*/

span.underline {
    text-decoration: underline;
}


/*--------------Text font white--------------*/

span.text-white {
    color: #ffffff;
}

span.math-b {
    font-style: normal;
}

span.math-c {
    font-style: normal;
}

span.symbol {
    font-style: normal;
}


/*--------------Text/Number/Sign superscripted/subscripted--------------*/

span.text-sup {
    vertical-align: top;
    font-size: 0.7em;
    margin-left: 1px;
    margin-right: 1px;
    line-height: 100%;
}

span.text-sub {
    vertical-align: bottom;
    font-size: 0.7em;
    margin-left: 1px;
    margin-right: 1px;
    line-height: 100%;
}

text-sub,
text-sup {
    line-height: 0.6em;
}


/*----------------------------------Linking extern within HTML Pages (intern)-----------------------*/


/*--------------Linking intern-------------*/


/* unvisited link */

a.inter-ref:link {
    color: #4BC851;
    text-decoration: none;
}


/* visited link */

a.inter-ref:visited {
    color: #008000;
}


/* mouse over link */

a.inter-ref:hover {
    color: #B7C3D0;
}


/*--------------Linking extern-------------*/


/* unvisited link */

a.exter-ref:link {
    color: #4971DD;
    font-style: italic;
}


/* visited link */

a.exter-ref:visited {
    color: #0345F7;
}


/* mouse over link */

a.exter-ref:hover {
    color: #0345F7;
}


/* selected link 
.exter-ref:active 		{
    					color: #0000FF;
						}*/


/*--------------Table footnote link-------------*/

div.footnote-ref:link {
    color: #8B8878;
    font-style: italic;
    font-size: 16px;
}

div.footnote-ref {
    background: #EEE9BF;
    /*or #f5f5f5 very light bg*/
    border: 1px solid #FFF;
    padding: 5px 2px 2px 2px;
    margin: 10px 1px 13px 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .4);
}


/*------------------Table diagonal lines pattern----------------------*/

td.diagonal_lines_pattern {
    background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0, #ccc), color-stop(0.25, #ccc), color-stop(0.25, #bbb), color-stop(0.5, #bbb), color-stop(0.5, #ccc), color-stop(0.75, #ccc), color-stop(0.75, #bbb));
    background-image: -webkit-linear-gradient(left bottom, #ccc 0%, #ccc 25%, #bbb 25%, #bbb 50%, #ccc 50%, #ccc 75%, #bbb 75%);
    background-image: -moz-linear-gradient(left bottom, #ccc 0%, #ccc 25%, #bbb 25%, #bbb 50%, #ccc 50%, #ccc 75%, #bbb 75%);
    background-image: -ms-linear-gradient(left bottom, #ccc 0%, #ccc 25%, #bbb 25%, #bbb 50%, #ccc 50%, #ccc 75%, #bbb 75%);
    background-image: -o-linear-gradient(left bottom, #ccc 0%, #ccc 25%, #bbb 25%, #bbb 50%, #ccc 50%, #ccc 75%, #bbb 75%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#bbbbbb', GradientType=0);
    background-image: linear-gradient(left bottom, #ccc 0%, #ccc 25%, #bbb 25%, #bbb 50%, #ccc 50%, #ccc 75%, #bbb 75%);
    background-size: 30px 30px;
    width: 100%;
    height: 100%;
}


/*------------------Opacity----------------------*/

div+div {
    margin-top: 13px;
}

div.box-opacity {
    background-color: #D4D4D4;
    filter: alpha(opacity=20);
    /* IE 5-7 */
    opacity: 0.4;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"
}


/*------------------Opacity with background image and font black----------------------*/

div.background {
    background: url(img/flower2.jpg) repeat;
    border: 1px solid pink;
    border-radius: 15px;
}

div.transbox {
    margin: 30px;
    background-color: #ffffff;
    border: 1px solid pink;
    border-radius: 0px 25px 0px 25px;
    opacity: 0.6;
    filter: alpha(opacity=60);
    /* For IE8 and earlier */
}

div.transbox p {
    margin: 5%;
    font-family: roboto-bold;
    color: #000000;
}


/*------------------listing with brace&nbsp;=&nbsp;) https://css-tricks.com/almanac/properties/l/list-style/ ----------------------*/

ol.brace {
    /*list-style-type: lower-alpha;*/
    /*list-style-type: upper-roman;*/
    margin-top: 5px;
    margin-bottom: 10px;
    padding-left: 1.7em;
    list-style-position: outside;
}

li.brace:before {
    content: ")";
    margin-left: -11px;
    margin-right: 8px;
}

li.brace {
    margin: 0px 2px 0px 3px;
    text-align: left;
    line-height: 1.2em;
}

td.border-left {
    border-left: 1px solid #bfbfbf;
}

td.col-all-hidden {
    /*background-color:#ffffff;*/
    padding: 5px 2px 5px 2px;
    border-right: hidden;
    border-left: hidden;
    border-bottom: hidden;
    border-top: hidden;
    vertical-align: middle;
}
td.col-all-hidden1 {
    /*background-color:#ffffff;*/
    padding: 5px 2px 5px 2px;
    border-right: hidden;
    border-left: hidden;
    border-bottom: hidden;
    border-top: hidden;
    vertical-align: top;
}
th.col-all-hidden {
    /*background-color:#ffffff;*/
    padding: 5px 2px 5px 2px;
    border-right: hidden;
    border-left: hidden;
    border-bottom: hidden;
    border-top: hidden;
    vertical-align: middle;
}
.rotate{
    -webkit-transform:rotate(270deg);
    writing-mode:tb-rl;

    -moz-transform:rotate(270deg);
    -o-transform: rotate(270deg); 
    white-space:nowrap;

    display:blocking;
    margin-top:110px; 
    margin-bottom: 50px;

    padding: 5px 5px 5px 5px; 
}