/* Asciidoctor default stylesheet | MIT License | http://asciidoctor.org */
 @import "https://fonts.googleapis.com/css?family=Noto+Sans:300,600italic,400,400italic,600,600italic%7CNoto+Serif:400,400italic,700,700italic%7CDroid+Sans+Mono:400,700";
 @import "asciidoctor.css";
/* Default asciidoc style framework - important */
 @import url('https://rsms.me/inter/inter-ui.css');

/* CUSTOMISATIONS */
/* Change the values in root for quick customisation. If you want even more fine grain... venture further. */
/* EDIT HERE FOR WHITE LABEL PARAMETERS*/
 :root{
     --fontfamily: "Inter UI",sans-serif
     --maincolor:#ffffff;
     --primarycolor:#22a652ff;
     --secondarycolor:#22a652cc;
     --tertiarycolor:#22a65299;
     --sidebarbackground:#2f3d4d;
     --linkcolor:#7531ffff;
     --linkcoloralternate:#7531ffcc;
     --white:#FFFFFF;
     --black:#000000;
}
/* END OF WHITE LABEL PARAMETERS
/* Text styles */

body{
    font-family:var(--fontfamily) !important;
}

.sectionbody {
    padding-top: 1px;
}

h1{
    color:var(--primarycolor) !important;
}

 h2,h3,h4,h5,h6{
    color:var(--secondarycolor) !important;
}
/* adding !important to a style gives more weight in this case for overriding bootstrap css style, see https://stackoverflow.com/questions/20721248/how-can-i-override-bootstrap-css-styles */
h1 {
    font-size: 28px !important;
    padding-top: 114px !important;
    margin-top: -114px!important;
}

h2 {
    font-size: 25px !important;
    padding-top: 114px !important;
    margin-top: -114px!important;
}

h3 {
    font-size: 22px !important;
    padding-top: 114px !important;
    margin-top: -114px!important;
}

h4 {
    font-size: 19px !important;
    padding-top: 114px !important;
    margin-top: -114px!important;
}

h5 {
    font-size: 17.5px !important;
    padding-top: 114px !important;
    margin-top: -114px!important;
}

h6 {
    font-size: 16px !important;
    padding-top: 114px !important;
    margin-top: -114px!important;
}

h7 {
    font-size: 15px !important;
    font-weight: bold !important;
	line-height: 2.0em !important;
}

h8 {
    font-size: 14px !important;
    font-weight: bold !important;
	line-height: 2.0em !important;
	color: #22a652 !important;
}

 .title{
    color:var(--tertiarycolor) !important;
    font-family:"Inter UI var",sans-serif !important;
    font-style: normal !important;
    font-weight: normal !important;
}
 p{
    font-family: "Inter UI",sans-serif !important
}
/* Table styles */
 th{
    font-family: "Inter UI",sans-serif !important
}
/* Responsiveness fixes */
 video {
     max-width: 100%;
}
 @media all and (max-width: 600px) {
     table {
         width: 55vw!important;
         font-size: 3vw;
    }
}
 #dot{
     width:30px;
     height:30px;
     border-radius:15px;
     font-size:15px;
     font-family: Arial;
     color:#fff;
     line-height:30px;
     text-align:center;
     background:#22a652
}
 #wrapper {
     border: 1px solid blue;
}
 #div1 {
     display: inline-block;
     width:120px;
     height:120px;
     border: 1px solid red;
}
 #div2 {
     display: inline-block;
     width:160px;
     height:160px;
     border: 1px solid green;
}



.table_danger {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

.table_danger td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

.table_danger th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}

#header {
    position: fixed;
    top: 0;
    z-index: 1;
    max-width: 70%;
    width: 70%;
    background: #fff;
    text-align: right;
}

#content {
    margin-top: 6.25em;
    position: relative;
    left: 0em;
}

@media only screen and (max-width: 1265px) {
    #header {
        position: fixed;
        top: 0;
        z-index: 1;
        max-width: 100%;
        width: 100%;
        background: #fff;
        text-align: right;
    }
    #content {
        margin-top: 6.25em;
        position: relative;
        left: 17em;
    }
    img {
	    max-width: 100%;
	    width: auto;
	    height: auto
    }
}

@media only screen and (max-width: 865px) {
    #header {
        position: fixed;
        top: 0;
        z-index: 1;
        max-width: 100%;
        padding-right: 8em;
        margin-left: 11em;
        width: 93%;
        background: #fff;
        text-align: right;
        }
    #content {
        margin-top: 6.25em;
        position: relative;
        left: 17em;
    }
    img {
	    max-width: 100%;
	    width: auto;
	    height: auto
    }
}

@media only screen and (max-width: 768px) {
    #header {
            position: fixed;
            top: 0;
            z-index: 1;
            max-width: 100%;
            padding-right: 1em;
            margin-left: 0em;
            width: 98%;
            background: #fff;
            text-align: right;
    }
    #content {
            margin-top: 6.25em;
            position: relative;
            left: 0em;
            }
     img {
    	    max-width: 100%;
    	    width: auto;
    	    height: auto
        }
}