.title {
    font-size: 300%;
    color: black;
    font-weight:400; 
    /*   margin-left: -0.3em; */
}

h1 {
    font-size: 200%;
    color: #27c16c;
    font-weight:400;
    padding-top: 1em;
    /*   margin-left: -0.3em; */
}


h2 {
    font-size: 145%;
    font-weight: 400;
    color: black;
}

h3 {
    font-size: 120%;
    font-weight: 400;
}


.videoWrapper {
    position: relative;
    padding-bottom: 53%;
    padding-top: 25px;
    height: 0;
    border: 2px solid #CCC;
}

.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ic {
    width: 35px;
    margin: 3px;
    margin-left: -40px;
    vertical-align: top;
}

.ww {
    max-width: 850px;
}

p.clear {
    clear: both;
    margin-left: 40px
}

.nav-link {
    text-decoration: none;
    font-weight: 500;
    color:#2780e3 !important;
}

.trial-button {
    margin-top:7px !important;
    padding:3px !important;
    border-radius:3px !important
}


hr {
    border-top: 1px dashed #AAA;
    width: 50%
}

.guide-sec { 
    display: none;
    padding: 2.3em;
    padding-top: 0.8em;

}

.carousel-arrow {
    color: black;
    font-weight: bolder;
    font-size: 300%;
}
.slide {
    border: 2px solid green;
    max-width: 700px;
}  
.hide {font-size:40%}


.c-caption{
    color:black; 
    background-color: #ddd; 
    border: 2px solid black; 
    border-radius: 4px; 
    padding:3px 25px 5px
}



/* Frontapge */
#fp h1 {
    padding-top: initial;
}

.fp-reel {
    margin-left: -4px;
    padding-top: 0.2em;
    max-width: 40em;    
    border: 5px solid transparent;        
    border-radius: 12px;
    filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.5));
}

    @media (max-width: 768px) {
      .fp-reel {
        max-width: 23em;

      }
    }



/* Documentation */

#doc-main-c {
            padding-left: 0.4em;
            padding-top:4em;
        }


#doc-main h2::before, h1::before {
            display: block;
            content: " ";
            margin-top: -65px;
            height: 65px;
            visibility: hidden;
            pointer-events: none;

        }

#doc-main h1 {
      padding-top: initial;
}


#doc-main h3 {
    color: #2780e3;
    font-size: 110%;    
    margin-bottom: 0.1em
}


#doc-main table {         
   border-collapse: collapse;
   margin-bottom: 1em;
}

#doc-main table, th, td {
    border: 2px solid #CCC; 
    padding: 0px 60px 0px 60px;  
}


#doc-main-c {
            padding-left: 0.4em;
            padding-top:4em;
        }

#doc-main td p { margin: 0px 0px 0.5em 0px; }                      

                
#doc-main td {
    font-size: 85%;
}

 #toc {
            margin-top: 20px;
            margin-left: -40px;
            font-size: 90%;
            height: 90%;
        }


#toc ul {
    margin-left: -2px;
    list-style-type: none
}

#toc ul ul {
    margin-left: -20px;
    list-style-type: none
}

/*
#doc-main pre {
    white-space: pre-wrap;
    word-break: break-word;
    padding-left: 6em;
    font-family: Arial;
}
*/
#sidebar {
    --scrollbarBG: #CFD8DC;
    --thumbBG: #27c16c;
    margin-top: 2em;            
    overflow: auto;
    height: 100%;
    max-width: 300px
}

#sidebar::-webkit-scrollbar {
        width: 10px;
    }

#sidebar {
    scrollbar-width: thin;
    scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}

#sidebar::-webkit-scrollbar-track {
    background: var(--scrollbarBG);
}

#sidebar::-webkit-scrollbar-thumb {
    background-color: var(--thumbBG);
    border-radius: 6px;
    border: 3px solid var(--scrollbarBG);
}

#doc-main p:last-child {
     font-size: 90%;
     font-style: italic;
     margin-top: 2em; 
     text-align: right;        
}


#changelog { max-width: 45em;font-size: 80%; padding-top: 3em;}
#changelog p { margin-bottom: 0.2em; }




/*
.list-lev-2 {
    color:red;
}
*/