/**
 * In some parts the code from the book "Node.js in Action" is used,
 * (c) 2014 Manning Publications Co.
 *
 */

/* Font designed by Andrey V. Panov */
/* FontFace Generated by FontPro */

@font-face {
    font-family: 'IstokWeb-Bold';
    src: url('/fonts/IstokWeb-Bold.eot');
    src: url('/fonts/IstokWeb-Bold.eot?#iefix') format('embedded-opentype'),
    url('/fonts/IstokWeb-Bold.ttf') format('truetype'),
    url('/fonts/IstokWeb-Bold.svg#IstokWeb-Bold') format('svg');
}

@font-face {
    font-family: 'IstokWeb-Regular';
    src: url('/fonts/IstokWeb-Regular.eot');
    src: url('/fonts/IstokWeb-Regular.eot?#iefix') format('embedded-opentype'),
    url('/fonts/IstokWeb-Regular.ttf') format('truetype'),
    url('/fonts/IstokWeb-Regular.svg#IstokWeb-Regular') format('svg');
}

:root {
    --body-text-color: #000;
    --graph-background: #f0ecec;
    --menu-text-color: #000;

    --analytics-button-font: #cbae2a; /* #ebce48; #00B7FF */ 
    --analytics-button-opacity: 0.6;
    --analytics-button-background: #ebce48; /* #ebce48; */
    --analytics-button-background-hover: #ebce48; /* #ebce48; */
    --analytics-button-url: url('/images/chart-bars.svg');
    --analytics-button-border: 1px solid #d0d0d0;

    --helper-button-font: #b24ded;
    --helper-button-background: #cc71ff; /*#bd5ef1; /*#d5d5d5; #d78fff*/
    --helper-button-border: 1px solid #d0d0d0;
    --helper-button-on: #cc71ff; /*#bd5ef1; */

    --entry-background: rgba(250, 250, 250, 0.9); 
    --entry-box-shadow: 0px 1px 1px 2px #f3f4f6;
    --entry-text-color: #000;
    --analytics-pane-background: rgba(250, 250, 250, 1);
    --entrymenu-pane-background: rgba(250, 250, 250, 1);
    --projectnotes-pane-background: rgba(250, 250, 250, 1);
    --helper-pane-background: rgba(250, 250, 250, 0.9);
    --entry-form-background: rgba(250, 250, 250, 0.9);
    --addnode-input-background: rgba(255, 255, 255, 0.9);
    --addnode-input-border: 1px solid rgba(141, 141, 141, 0.2);
    --addnode-input-shadow: inset 0 0 3px rgba(141, 141, 141, 0.2);
    --addnode-input-color: #333;
    --addnode-background: url('/images/add.png');
    --addnode-opacity: 1;
    --statement-background: rgb(250, 250, 250);
    --statement-border: 1px solid rgba(141, 141, 141, 0.2);
    --statement-box-shadow: inset 0 0 3px rgba(141, 141, 141, 0.2);
    --statement-border-focus: 1px solid rgba(0, 174, 255, 0.6);
    --statement-box-shadow-focus: inset 0 0 3px rgba(141, 141, 141, 0.6);
    --statement-color: #000;
    --go-next-opacity: 0.7;
    --go-next-background-image: url('/images/binoculars.svg'); /* url('/images/magnifier_eye.svg'); */

    --analytics-toggle-opacity: 0.7;
    --analytics-toggle-background-image: url('/images/insertChart.svg'); /* url('/images/magnifier_eye.svg'); */

    --reset-button-opacity: 0.5;
    --reset-button-background-image: url('/images/undo_all.svg');

    --reload-button-opacity: 0.5;
    --reload-button-background-image: url('/images/refresh.svg');


    --zoom-in-opacity: 0.5!important;
    --zoom-in-background-image: url('/images/plus-circle.svg')!important;
    --zoom-out-opacity: 0.5!important;
    --zoom-out-background-image: url('/images/circle-minus.svg')!important;

    --deleted-nodes-opacity: 0.7;
    --deleted-nodes-background-image: url('/images/eye-hide.svg');
    --undo-nodes-background-image: url('/images/undo.png');

    --slice-graph-off-opacity: 0.7;
    --slice-graph-off-background-image: url('/images/layers.svg'); /*spotlights.svg*/

    --ai-buttons-color: #b161ff;

    --taginput-background: rgba(255, 255, 255, 1)!important;
    --taginput-border: 1px solid rgba(141, 141, 141, 0.2);
    --taginput-boxshadow: none;
    --taginput-color: #aaaab5;
    --taginput-height: 26px;

    --globalsearch-background: url('/images/search.svg');
    --globalsearch-opacity: 1;
    --addnode-opacity: 1;

    --addplus-background: url('/images/addplus.svg');
    --addplus-opacity: 0.6;

    --globalsearchremove-opacity: 1;
    --globalsearchremove-background: url('/images/remove.png');
    --addnode-opacity: 1;

    --scroll-color: #888;

    --expla-background: rgba(250, 250, 250, 0.8); 
    --expla-color: #444;

    --firstentry-background: #ffffff;
    --firstentry-opacity: 0.9;

    --childrenmenu-background: rgb(245, 240, 240, 0.9);
    --childrenmenu-opacity: 0.9;

    --live-link-image: url('/images/toggle-off.svg');
    --live-link-opacity: 0.9;

    --warning-background: #fff;
    --warning-close-button: #000;

    --cluster-close-button: rgb(30, 30, 30, 0.8);

    --remove-opacity: 1;
    --remove-background: url('/images/remove-gray.png');

    --back-to-graph-opacity: 0.8;
    --back-to-graph-background: url('/images/backtograph.svg');

    --undo-opacity: 0.8;
    --undo-background: url('/images/undo.svg');

    --link-opacity: 0.8;
    --link-background: url('/images/link.svg');

    --unlink-opacity: 0.8;
    --unlink-background: url('/images/unlink.svg');

    --save-stopwords-opacity: 0.7;
    --save-stopwords-background: url('/images/enter-down.svg');

    --atom-close-opacity: 0.8;
    --atom-close-background: url('/images/cross-circle.svg');

    --selected-menu: #fffcfc;

    --table-background: rgba(255, 255, 255, 1);
    --table-text: #000;
    --table-black: rgba(0,0,0,0);
    --table-transparent: rgba(0,0,0,0.2);

    --table-color: white;

    --graph-favorite-background-image: url('/images/star.svg');
    --graph-favorite-opacity: 0.8;

    --loading-image: url('/images/hourglass.svg');

    --biasindex-border: #a0a0a0;
    --biasindex-font: #666666;

    --inform-table-background: #dddddd;
    
    --abutton-background: #fff;
    --abutton-border-color: #ccc;

    --cluster-label-background: rgb(255,255,255,0.3);

    --search-selector-background-color: #fff;
    --search-selector-font-color: #333!important;

    --filter-view-image: url('/images/filter.svg')!important;

    --remove-stopwords-opacity: 0.8;
    --remove-stopwords-background: url('/images/eye-show.svg')!important;

    --eye-show-opacity: 0.9;
    --eye-show-background: url('/images/eye-show.svg')!important;

    --menu-border-color: rgb(200,200,200,0.8);

    --tag-opacity: 0.8;
    --tag-background: url('/images/tag.svg');

    --graph-find-opacity: 0.8;
    --graph-find-background: url('/images/graph.svg');
    --graph-find-activated: url('/images/graph-activated.svg');

    --helper-text-color: #000000;

    --variability-schema: url('/images/variability-schema.svg')!important;
    --variability-arrow: url('/images/variability-arrow.svg')!important;

    --variability-uniform-symbol: url('/images/uniform.svg')!important;
    --variability-regular-symbol: url('/images/regular.svg')!important;
    --variability-fractal-symbol: url('/images/fractal.svg')!important;
    --variability-complex-symbol: url('/images/complex.svg')!important;

    --google-logo: url('/images/google-logo-gradation.png')
}
:root[theme='dark'] {
    --body-text-color: #aaaab5;
    --graph-background: #111111;

    --analytics-button-font: #cfb330; /* #ebce48; #00B7FF */ 
    --analytics-button-background: #cfb330; /* #ebce48; #00B7FF */ 
    --analytics-button-opacity: 0.9;
    --analytics-button-url: url('/images/chart-bars.svg');
    --analytics-button-background-hover: #cfb330; /* #ebce48; */
    --analytics-button-border: 1px solid #444444;


    --helper-button-font: #b142f1;
    --helper-button-background: #620a93; /* #bd5ef1; /* #444444; */
    --helper-button-border: 1px solid #444444;
    --helper-button-on:#620a93; /* #bd5ef1;*/

    --entry-background: rgba(30, 30, 30, 0.9); 
    --entry-box-shadow: 0px 0px 0px 0px #000000;
    --entry-text-color: #aaaab5;
    --menu-text-color: #afafaf;
    --analytics-pane-background: rgba(30, 30, 30, 1);
    --entrymenu-pane-background: rgba(30, 30, 30, 1);
    --projectnotes-pane-background: rgba(60, 60, 60, 1);
    --helper-pane-background: rgba(45, 45, 45, 0.9);
    --entry-form-background: rgba(30, 30, 30, 0.9);
    --addnode-input-background: rgba(250, 250, 250, 0.2);
    --addnode-input-border: none;
    --addnode-input-shadow: none;
    --addnode-input-color: #aaaab5;
    --addnode-background: url('/images/add-white.png');
    --addnode-opacity: 0.6;
    --statement-background: rgba(250, 250, 250, 0.2);
    --statement-border: 1px solid rgba(141, 141, 141, 0.0);
    --statement-box-shadow: inset 0 0 3px rgba(141, 141, 141, 0.0);
    --statement-box-shadow-focus: inset 0 0 3px rgba(141, 141, 141, 0.0);
    --statement-color: #ebebeb;
    --go-next-opacity: 0.7;
    --go-next-background-image: url('/images/binoculars-white.svg'); /* url('/images/magnifier_eye_white.svg'); */
    
    --analytics-toggle-opacity: 0.7;
    --analytics-toggle-background-image: url('/images/insertChart-white.svg'); /* url('/images/magnifier_eye.svg'); */

    --reload-button-opacity: 0.6;
    --reload-button-background-image: url('/images/refresh_white.svg');

    --reset-button-opacity: 0.6;
    --reset-button-background-image: url('/images/undo_all_white.svg');

    --zoom-in-opacity: 0.6!important;
    --zoom-in-background-image: url('/images/plus-circle_white.svg')!important;
    --zoom-out-opacity: 0.6!important;
    --zoom-out-background-image: url('/images/circle-minus_white.svg')!important;

    --deleted-nodes-opacity: 0.8;
    --deleted-nodes-background-image: url('/images/eye-hide-white.svg');
    --undo-nodes-background-image: url('/images/undo-white.png');


    --slice-graph-off-opacity: 0.7;
    --slice-graph-off-background-image: url('/images/layers-white.svg');

    --ai-buttons-color: #8c04ff;

    --taginput-background: rgba(250, 250, 250, 0.2);
    --taginput-border: none;
    --taginput-boxshadow: none;
    --taginput-color: #aaaab5;
    --taginput-height: 26px;

    --globalsearch-background: url('/images/search-white.svg');
    --globalsearch-opacity: 0.8;
    --addnode-opacity: 0.6;

    --addplus-background: url('/images/addplus-white.svg');
    --addplus-opacity: 1;

    --globalsearchremove-opacity: 0.6;
    --globalsearchremove-background: url('/images/remove.png');
    --addnode-opacity: 0.6;

    --scroll-color: #333;

    --expla-background: rgba(30, 30, 30, 0.8); 
    --expla-color: #aaa;

    --firstentry-background:#333;
    --firstentry-opacity: 0.9;

    --childrenmenu-background: rgb(0, 0, 0, 0.7);
    --childrenmenu-opacity: 0.9;

    --warning-background: #333;
    --warning-close-button: #ccc;

    --cluster-close-button: rgb(224, 224, 224, 0.8);

    --remove-opacity: 0.9;
    --remove-background: url('/images/remove-white.png');

    --back-to-graph-opacity: 0.7;
    --back-to-graph-background: url('/images/backtograph-white.svg');

    --save-stopwords-opacity: 0.7;
    --save-stopwords-background: url('/images/enter-down-white.svg');

    --undo-opacity: 0.8;
    --undo-background: url('/images/undo-white.svg');

    --link-opacity: 0.8;
    --link-background: url('/images/link-white.svg');

    --unlink-opacity: 0.8;
    --unlink-background: url('/images/unlink-white.svg');

    --atom-close-opacity: 0.7;
    --atom-close-background: url('/images/cross-circle-white.svg');

    --selected-menu: #666666;

    --table-background: rgba(0, 0, 0, 1);
    --table-text: #aaa;

    --table-black: rgba(255,255,255,0);
    --table-transparent: rgba(255,255,255,0.2);
    --table-color: black;

    --graph-favorite-background-image: url('/images/star-white.svg');
    --graph-favorite-opacity: 0.6;

    --loading-image: url('/images/hourglass-white.svg');

    --biasindex-border: #606060;
    --biasindex-font: #eee;

    --inform-table-background: #444444;

    --abutton-background: #999999;
    --abutton-border-color: #444;

    --cluster-label-background: rgb(0,0,0,0.3);

    --search-selector-background-color: #444;
    --search-selector-font-color: #ccc!important;

    --filter-view-image: url('/images/filter-white.svg')!important;

    --remove-stopwords-opacity: 0.8;
    --remove-stopwords-background: url('/images/eye-show-white.svg')!important;

    --eye-show-opacity: 0.9;
    --eye-show-background: url('/images/eye-show-white.svg')!important;

    --menu-border-color: rgb(150,150,150,0.6);

    --tag-opacity: 0.8;
    --tag-background: url('/images/tag-white.svg');

    --graph-find-opacity: 0.8;
    --graph-find-background: url('/images/graph-white.svg');
    --graph-find-activated: url('/images/graph-activated.svg');

    --helper-text-color: #ffffff;

    --variability-schema: url('/images/variability-schema-white.svg')!important;
    --variability-arrow: url('/images/variability-arrow.svg')!important;

    --variability-uniform-symbol: url('/images/uniform-white.svg')!important;
    --variability-regular-symbol: url('/images/regular-white.svg')!important;
    --variability-fractal-symbol: url('/images/fractal-white.svg')!important;
    --variability-complex-symbol: url('/images/complex-white.svg')!important;

    --google-logo: url('/images/google-logo-gradation.png')
}

.pure-menu li:not(.app-context-link) a  {
    color: var(--menu-text-color);
}

.signupbtn {
    display: none;
    position: fixed;
    top: 8px;
    left: 400px;
    font-size: .5rem;
    padding: .5rem 1rem .4rem 1rem;
    text-transform: uppercase;
    letter-spacing: .03rem;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    border: 0 solid transparent;
    font-size: 1rem;
    line-height: 1;
    border-radius: 50rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; 
    z-index: 2000000!important;
}

/* .signupbtn {
  -moz-transform:rotate(90deg);
  -ms-transform:rotate(90deg);
  -o-transform:rotate(90deg);
  -webkit-transform:rotate(90deg); 
} */


  .ui-gradient-green {
    background: -moz-linear-gradient(45deg, #19d9b4 0%, #92d275 100%);
    background: linear-gradient(45deg, #19d9b4 0%, #92d275 100%);
  }
  .signupbtn.ui-gradient-green {
    color: #FFF;
  }


body {
    font: 16px 'IstokWeb-Bold',sans-serif;
    color: var(--body-text-color);
}

label {
    color: var(--body-text-color)!important;
}

a {
    color: #00B7FF;
}

#parsed_csv_list {
    display: block;
    margin-bottom: 35px!important;
}

.table-extended {
    position: relative;
    max-width: 600px;
}

#importtable {
    display: table;
    white-space: nowrap;
    background: #fff;
    max-height: 350px;   
}
.import_column {
    background: #f5f5f5;
    cursor: pointer;
    vertical-align: top;
    border: 1px solid gray;
    max-width: 300px;
    max-height: 150px;
}
.csv_column {
    vertical-align: top;
    border: 1px solid gray;
    max-width: 300px;
    max-height: 150px;
    overflow: hidden;
}
.selected_column {
    background: #d0d0ff;
}

.csv-table-wrapper {
      width: 600px;
      overflow: auto;
      max-height: 350px;
  }

.csv-table-wrapper::-webkit-scrollbar {
    height: 8px;
    background: #d0d0d0; 
}

.table-wrapper::-webkit-scrollbar {
    height: 4px;
 
}

.inside_import_column {
    max-height: 150px!important;
}

#wrapper {
    position: fixed;
    left: 0;
    top: 48px;
    right: 0;
    bottom: 0;
    width: 100%;
    overflow-y:hidden; 
    overflow-x:hidden; 
}

#wrapperService {
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    width: 100%;
    background: var(--graph-background);
    margin: 48px auto 0;
    overflow: scroll;
}


#statement,#statement_interpret,#statementMeta,#mindmap_input {
    background-color: var(--statement-background);
    border: var(--statement-border);
    box-shadow: var(--statement-box-shadow);
    -moz-box-shadow: var(--statement-box-shadow);
    -webkit-box-shadow: var(--statement-box-shadow);
    color: var(--statement-color);
    height: 120px!important;
}


#stimulateVariabilityLabel {
    display: none;
}


#statement_interpret,#statementMeta,#mindmap_input {
    height: 120px!important;   
}

#statement:focus,#statement_interpret:focus,#statementMeta:focus,#mindmap_input:focus {
    border: var(--statement-border-focus);
    box-shadow: var(--statement-box-shadow-focus);
    -moz-box-shadow: var(--statement-box-shadow-focus);
    -webkit-box-shadow: var(--statement-box-shadow-focus);
}

#helper_google_search_query {
    margin-top: 10px;
    margin-bottom: 10px;
}


textarea {
    font: 16px 'IstokWeb-Bold',sans-serif;
    position: relative;
    resize: vertical!important;
    width: 92%;
    max-height: 35vh;
    /* overflow: vertical!important; /* 1 */
    overflow-y: scroll!important;
    vertical-align: top; /* 2 */
    padding: 0.5em 0.6em;
    display: block;
    margin: 0.25em 0;
    border: 1px solid #e6e6e6;
    box-shadow: inset 0 1px 3px #e6e6e6;
    border-radius: 6px;
    -webkit-transition: 0.3s linear border;
    -moz-transition: 0.3s linear border;
    -ms-transition: 0.3s linear border;
    -o-transition: 0.3s linear border;
    transition: 0.3s linear border;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    z-index: 10;
}

textarea:focus {
    outline: 0;
    border-color: #129FEA;
}

.loading {
    background-image: url('/images/loading-icon.svg')!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    opacity: 0.5!important;
}

.deleteloading {
    background-image: url('/images/loading-icon.svg')!important;
    background-size: 20px;
    background-repeat:no-repeat!important;
    background-position:center!important;
}

.loadingwheel {
    background-image: url('/images/loadingwheel.gif')!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    opacity: 1!important;
}

.loadingWithText {
    background-image: url('/images/loading-icon.svg')!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    opacity: 0.5!important;
}

.loadingWithText:after {
    content: 'loading...';
}



#search {
    float: right;
    /* visibility: hidden; */
    z-index:99;
    background-color: var(--addnode-input-background);
    border: var(--addnode-input-border);
    box-shadow: var(--addnode-input-shadow);
    color: var(--addnode-input-color);
    
}

#search:disabled {
    background-color: #dfdfdf;
}


#searchSource {
    height: 32px!important;
    font-size: 12px!important;
    margin-right: 5px;
    margin-left: 5px;
    background-color: var(--search-selector-background-color);
    color: var(--search-selector-font-color);
    border: none;
    opacity: 0.9;
}

#firstentry, #firstentry-niche, #firstentry-kwrds, #firstentry-google-app, #firstentry-twitter-app, #firstentry-twitter-app-social, #firstentry-notes-app, #firstentry-surveys-app, #firstentry-reviews-app {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
    padding: 0; 
    vertical-align: middle; 
    z-index: 100;
    background-color: var(--firstentry-background);
    opacity: var(--firstentry-opacity);
    
}
 

#firstentryform {
    width: 400px;
    height: 100px; 
    margin: 0 auto;  
    padding: 0;
    font-size: 12px;  
    position: relative; 
    left: 50%; 
    margin-left: -200px; 
    top: 30%; 
    margin-top: -50px;
    font: 18px 'IstokWeb-Bold',sans-serif;
}

.firstentry-warning {
    padding-top: 20px;
    font: 16px 'IstokWeb-Bold',sans-serif;
}

#language-google {
    float: left;
    margin-bottom: 5px;
    margin-right: 10px;
}

.ui-autocomplete {
    font: 16px 'IstokWeb-Bold',sans-serif;
}

.ui-menuitem {
    font: 16px 'IstokWeb-Bold',sans-serif;
}

.warning {
    position: relative;
    top: 0;
    padding-left: 25px;
    padding-right: 25px;
    display: inline;
    color: #4b9dff;
    z-index: 110005;
}

.resmessages {
    top: 0px;
    padding: 15px;
    left: 15%;
    position: fixed;
    text-align: center;
    display: block;
    background-color: var(--warning-background);
    width: 70%;
    max-height: 60px;
    /* animation-name: resMesAnimation;
    animation-duration: 7000ms;
    animation-fill-mode: forwards; */
    z-index: 1100000!important;
    opacity: 0.8;
    border-radius: 6px;
}





.resmesclose {
    position:relative;

    color: var(--warning-close-button);
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 110005;
}

.helperidea {
    top: 0;
    padding: 10px 20px 10px 20px;
    left: 380px;
    position: fixed;
    text-align: left;
    display: block;
    background-color: var(--warning-background);
    width: 30%;
    max-height: 110px;
    /* animation-name: resMesAnimation;
    animation-duration: 7000ms;
    animation-fill-mode: forwards; */
    z-index: 110000;
    opacity: 0.8;
    border-radius: 6px;
}

.helperclose {
    position:relative;
    color: var(--warning-close-button);
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 26px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 110005;
}


.ideaclose {
    position:relative;
    color: var(--warning-close-button);
    font-weight: bold;
    float: right;
    margin-top: 4px;
    margin-right: -3px;
    /* margin-top: 18px; */

    font-size: 22px;
    line-height: 26px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 110005;
}

.panelclose {
    position:relative;
    color: var(--warning-close-button);
    font-weight: bold;
    float: right;
    margin-top: 4px;
    margin-right: -3px;
    /* margin-top: 18px; */

    font-size: 22px;
    line-height: 26px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 110005;
}

.analyticsPanelClose {
    position:relative;
    color: var(--warning-close-button);
    font-weight: bold;
    float: right;
    width: 22px;
    height: 22px;
    text-align: center;
    margin-top: 12px;
    margin-right: 6px;
    border-radius: 16px; 
    border: 1px solid;
    border-color: var(--warning-close-button);
    font-size: 22px;
    line-height: 26px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 110005;
}

.graphClusterClose,.nodeHighlightClose,.gapClusterClose {
    position:absolute;
    color: var(--cluster-close-button);
    font-weight: bold;
    float: right;
    top: 0px;
    right: 5px;
    font-size: 18px;
    line-height: 26px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 110005;
    pointer-events: auto;
}


.graphClusterText, #gapClusterText {
    cursor: pointer;
    z-index: 110005;
    pointer-events: auto;
}



.panelmove {
    position:relative;
    color: var(--warning-close-button);
    opacity: 0.7!important;
    font-weight: normal;
    float: right;
    margin-top: 2px;
    margin-right: 2px;
    margin-left: 2px;
    /* margin-top: 18px; */

    font-size: 18px;
    line-height: 26px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 110005;
}
.helperp {
    position: relative;
    top: 0;
    display: inline;
    color: #4b9dff;
    z-index: 110005
}


@keyframes resMesAnimation{
    0%{
      opacity: 0.8;
    }
    70%{
      opacity: 0.8;
    }
    100%{
      display: none;
      opacity: 0;
    }
}



#warnings {
    display: none;
    clear:both;
}

.entry,.entryIncoming {
    font: 17px 'IstokWeb-Bold',sans-serif;
    color: #000;
    width: 85%;
    text-align:left;
    float: left;
    display: inline-block;
    margin-bottom:25px;
    padding: 0px 10px;
    min-width: 160px;
    min-height: 10px;
    margin-left: 2px;
    background-color: var(--entry-background);
    border-radius: 5px;
    box-shadow: var(--entry-box-shadow);
    word-wrap: break-word;
    pointer-events: auto!important;
}
.entryIncoming {
    height: 80px;
    float: right!important;
    width: 100px!important;
}

.alien {
    margin-left: 30px;
    width: 82%;
}


.entry-text {
    font: 17px 'IstokWeb-Bold',sans-serif;
    color: var(--entry-text-color);
    max-width: 95%;
}


.gray {
    opacity: 0.5;
   /* padding-left: 50px;*/
}

.summary {

    font: 14px 'IstokWeb-Regular',sans-serif;
    color: #333;
    padding-top: 5px;
    color: #999999;
    text-align: left;
    font-style: italic;
}

.entry-info {

    font: 15px 'IstokWeb-Bold',sans-serif;
    color: #333;
    padding-top: 0px;
    color: #999999;
    text-align: left;
}


#explanation {
  float: none;
  position: relative;
  max-width: 320px;
  display: none;
  top: 0;
  left: 50px;
}

#expsummary {
    display: none;    
}

#expinsight {
    display: none;
}

#expideas {
    display: none;
}

#expmissing {
    display: none;
}

#expsummary a {
    color: inherit;
    text-decoration: none;
}

#expsummary a:hover {
    color: #0089E0!important;
    text-decoration: underline!important;
}


.nounderline {
    text-decoration: none!important;
    color: var(--body-text-color)!important;
}

.explintro {
    margin-bottom:25px;
    padding: 10px 10px;
    min-width: 160px;
    min-height: 10px;
    margin-left: 2px;
    background-color: var(--expla-background);
    border-radius: 5px;
    box-shadow: var(--entry-box-shadow);  
    top: 0;
    max-width: 280px;
    font: 14px 'IstokWeb-Regular',sans-serif;
    font-style: italic;
    padding-bottom: 15px;
    color: var(--expla-color);
    position: relative;
    font-style: normal!important;
}

.underlinelink {
    color: #0089E0!important;
    text-decoration: underline!important;
}


.entry-by {
    float: left;
    font: 14px 'IstokWeb-Regular',sans-serif;
    color: #444;
    margin-top: -1em;
    margin-bottom: 2em;
    color: #999999;
}
.entry-date {
    float: left;
    font: 14px 'IstokWeb-Regular',sans-serif;
    color: #444;
    margin-top: 0em;
    margin-left: 0px;
    margin-bottom: 0em;
    color: #999999;
}
.entry-menu {
    float: left;
    font: 14px 'IstokWeb-Regular',sans-serif;
    color: #444;
    margin-top: 0em;
    margin-bottom:0em;
    color: #999999;
    display:none;

}

.explmenu {
    float: right;
    margin-top: -11px;
    margin-right: -6px;
    cursor: pointer!important;
    font: 14px 'IstokWeb-Regular',sans-serif;
}

.info_helper_no_padding {
    margin: 0px;
    font: 14px 'IstokWeb-Regular',sans-serif;
    border: 1px solid;
    border-color: #888888;
}

.info_helper {
    margin-left: 6px;
    margin-right: 44px;
    font: 14px 'IstokWeb-Regular',sans-serif;
    padding: 7px;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
 
    border: 1px solid;
    border-color: #888888;
  
}

#projectNotesDetails {
  margin-top: 10px;

}

.noborder {
    border: 0px;
}

#text_analytics {
    margin-top: 5px;
    margin-bottom: 20px;
}
#textanalytics {
    margin-left: -3px;
    margin-top: 0px;
}
.bolder {
    font: 14px 'IstokWeb-Bold',sans-serif;
}
.textSettingString {
    margin-top: 5px;
    margin-bottom: 10px;
    display: block;
}


#graph_info_panel {
    margin-left: -2px;
    margin-right: 0px;
    margin-bottom: 0px;
}

#graph_info {
    margin-bottom: 15px;
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    min-height: 130px!important;
    max-height: 50vh; 
    width: 100%;
    font: 16px 'IstokWeb-Bold',sans-serif;
    background-color: var(--statement-background);
    border: var(--statement-border);
    box-shadow: var(--statement-box-shadow);
        -moz-box-shadow: var(--statement-box-shadow);
        -webkit-box-shadow: var(--statement-box-shadow);
    color: var(--statement-color);

}
#mergednodesinfo {
    width: 150px;
    float: right;
    margin-right: 10px;
    font: 14px 'IstokWeb-Bold',sans-serif;
    background-color: var(--statement-background);
    border: var(--statement-border);
    box-shadow: var(--statement-box-shadow);
        -moz-box-shadow: var(--statement-box-shadow);
        -webkit-box-shadow: var(--statement-box-shadow);
    color: var(--statement-color);
    overflow: visible!important;
    height: 60px;
    max-height: 60px;
    display: inline;
}

#stopnodesinfo {
    width: 150px;
    float: right;
    margin-right: 10px;
    font: 14px 'IstokWeb-Bold',sans-serif;
    background-color: var(--statement-background);
    border: var(--statement-border);
    box-shadow: var(--statement-box-shadow);
        -moz-box-shadow: var(--statement-box-shadow);
        -webkit-box-shadow: var(--statement-box-shadow);
    color: var(--statement-color);
    overflow: visible!important;
    height: 60px;
    max-height: 60px;
    display: inline;
}

.textSettingsElements {
    float: right;
    margin-right: 10px;
    
    font: 13px 'IstokWeb-Regular',sans-serif;
    display: inline;
}

#graph_info:focus {
    border: var(--statement-border-focus);
    box-shadow: var(--statement-box-shadow-focus);
    -moz-box-shadow: var(--statement-box-shadow-focus);
    -webkit-box-shadow: var(--statement-box-shadow-focus);
}


#graph_settings_panel {
    margin-top: 10px;
    padding: 10px;
    /* display: inline-block; */
    clear: both;
}

#graph_info_panel_switch {
    text-decoration: underline;
    cursor: pointer;
}

.smallerlink {
    font-size: 13px;
    line-height: 12px!important;
    ;
}

#graph_settings_panel_switch {
    text-decoration: underline;
    cursor: pointer;
}

#unmergeall {
    text-decoration: underline;
    cursor: pointer;
}

#graph-favorite {
    position: relative;
    grid-column: 1;
    text-align: left;
    font-size: 32px; /*   this value to increase/decrease button size */
    width: 25px;
    height: 25px;
    /* float: right; */
    margin: 1px 2px 10px 10px;
    z-index: 10;

    pointer-events: auto!important;
    background-image: var(--graph-favorite-background-image);
    opacity: var(--graph-favorite-opacity); 
    background-repeat: no-repeat!important;
    background-position: center;

    /* pointer-events: auto!important;   */
}


#update_graph_info {
    padding-bottom: 5px;
}




.graph-favorite-on {
    background-image: url('/images/star-selected-orange.svg')!important;
    background-repeat: no-repeat!important;
    background-position: center;
    display: inline-block;
}

#graph_info_submit {
    position: relative;
    top: 0px!important;
    font: 15px 'IstokWeb-Regular',sans-serif;

}

#version_default {

    margin-top: 4px!important;
    
    

}

.filterControlBtn {
    margin-bottom: 5px;
}

#interpret_announcement {
    display: none;
    font: 15px 'IstokWeb-Bold',sans-serif;
    margin-bottom: 15px;
}

.edit_helper {
    margin-left: 15px;
    margin-right: 50px;
    padding-right: 20px;
    font: 14px 'IstokWeb-Regular',sans-serif;
}
.edit_helper_editor {
    font: 14px 'IstokWeb-Regular',sans-serif;
    margin-left: 15px;
    margin-right: 50px;
    margin-top: 0px;
    padding-bottom: 10px;
}
.editor-wrapper {
    display: flex;
    flex-wrap: wrap;
}
.import_helper_editor {
    font: 14px 'IstokWeb-Regular',sans-serif;
    margin-left: 10px;
    margin-right: 20px;
    margin-top: -10px;
    margin-bottom: 20px;
}
#templateLoading {
    margin-top: 10px;
    margin-bottom: 10px;
}
#context_switcher_helper,#context_switcher_helper_interpret {
    margin-top: 8px;
    display: block;
    font: 13px 'IstokWeb-Regular',sans-serif;
}
#mindmap_helper {
    display: block;
    margin-top: 5px;
    margin-left: 15px;
    margin-right: 50px;
    margin-bottom: 20px;
    padding-right: 20px;
    font: 14px 'IstokWeb-Regular',sans-serif;
}

#context_switcher_helper_toggle, #mindmap_helper_toggle  {
    cursor: pointer;
}


.intro {
    font: 19px 'IstokWeb-Bold',sans-serif;
    color: #000;
    max-width: 95%;
}

h1 {
    font: 40px 'IstokWeb-Bold',sans-serif;
    color: #000;
    max-width: 95%;
}

h2 {
    font: 25px 'IstokWeb-Bold',sans-serif;
    color: #000;
    max-width: 95%;
}

a.app-concept-link {
    text-decoration: none;
    color: var(--body-text-color);

}
a:hover.app-concept-link {
    text-decoration: underline;
    
}

a.app-wikilink-link {
    text-decoration: none!important;
    color: var(--body-text-color);
}
a:hover.app-wikilink-link {
    text-decoration: underline;
}

a.app-context-link {
    text-decoration: none;
    color: #999;
    font: 'IstokWeb-Regular',sans-serif;

}
a:hover.app-context-link {
    text-decoration: underline;
    color: #666;
}

a.app-url-link {
    text-decoration: none;
    color: #555;

}
a:hover.app-url-link {
    text-decoration: underline;
    color: #4b9dff;
}

a.app-more-link {
    text-decoration: none;
    color: #555;

}
a:hover.app-more-link {
    text-decoration: underline;
    color: #4b9dff;
}


#addToContextsLabel {
    margin: 16px 5px -10px 0px;
    float: left;
}

#addToCategoryLabel,#addToCategoryLabelMeta {
    margin: 16px 5px -10px 0px;
    float: left;
}




#addToContextsLabelGoogle {
    margin: 16px 5px -10px 0px;
    float: left;
}

.contexts {
    font: 17px 'IstokWeb-Bold',sans-serif;
    color: #666;
}

.contexts a {
    text-decoration: none;
    color: #999;
}
.contexts a:hover {
    text-decoration: underline;
    color: #4b9dff;
}

#concepts {
    font: 17px 'IstokWeb-Bold',sans-serif;
    color: #666;
}

#concepts a {
    text-decoration: none;
    color: #999;
}
#concepts a:hover {
    text-decoration: line-through;
    color: #f00;
}


#messages {
    position: absolute;
    top: 0px;
    margin-top: 14px;
    right: 200px;
    font: 17px 'IstokWeb-Bold',sans-serif;
    color: #4b9dff;
    margin-right: 20px;
    z-index: 100000!important;
    clear: both;
}
.loading_message {
   float: right;
   padding-right: 60px;
    
}

#graphTags {
    position: absolute;
    top: 0px;
    right: 50px;
    text-align: right;
    font: 17px 'IstokWeb-Bold',sans-serif;
    color: #4b9dff;
    z-index: 1;
    margin-right: 24px;
    margin-left: 32px;
    margin-top: 12px;
}


.tags{
    float: right;
    margin:0;
    padding:0;
    list-style:none;
}

.tags li, .tags a{
    float:right;
    height:24px;
    line-height:24px;
    position:relative;
    font-size:11px;
    padding:0px 0px 10px 0px;
}

.tagsend {
    clear:both;
}

.tags a{
    margin-left:20px;
    padding:0 10px 0 12px;
    background:#0089e0;
    color:#fff;
    text-decoration:none;
    -moz-border-radius-bottomright:4px;
    -webkit-border-bottom-right-radius:4px;
    border-bottom-right-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-top-right-radius:4px;
    border-top-right-radius:4px;
}

.tags a:before{
    content:"";
    float:left;
    position:absolute;
    top:0;
    left:-12px;
    width:0;
    height:0;
    border-color:transparent #0089e0 transparent transparent;
    border-style:solid;
    border-width:12px 12px 12px 0;
}

.tags a:after{
    content:"";
    position:absolute;
    top:10px;
    left:0;
    float:left;
    width:4px;
    height:4px;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
    background:#fff;
    -moz-box-shadow:-1px -1px 2px #004977;
    -webkit-box-shadow:-1px -1px 2px #004977;
    box-shadow:-1px -1px 2px #004977;
}

.tags a.notfound{
    background: #666666;
    opacity: 0.2;
}

.tags a.notfound:before{
    border-color:transparent #666666 transparent transparent;
}

.tags a.deleted{
    background: #ff0000;
    opacity: 0.5;
}
.tags a.deleted:before{
    border-color:transparent #ff0000 transparent transparent;
}


.tags a:hover{
    background:#666;
    opacity: 0.2;
}

.tags a:hover:before{
    border-color:transparent #555 transparent transparent;
}

#tagInputBox {
    background-color: var(--taginput-background);
    border: var(--taginput-border);
    box-shadow: var(--taginput-boxshadow);
    color: var(--taginput-color);
    height: var(--taginput-height);
    max-width: 100px;
}


#content {
    position: relative;
    top: 0px;
/*
    max-width: 320px;
*/
    margin: 0 0 0 0;
    line-height: 1.6em;
    z-index: 1;
    height: 100%;
}

#statements {
    position: absolute;
    bottom: 0px;
    border-radius: 10px;
    margin-left: 38px;
    padding-bottom: 0px;
    max-height: 85vh;
    background-color: rgba(255, 255, 255, 0);
    max-width: 400px;
    padding-left: 10px;
    z-index: 10;
    overflow: hidden;
/*    pointer-events: none;*/
}

#info-panel {
    min-height: 20px;
    padding-bottom: 0px;
}

#search-panel {
    min-height: 20px;
    padding-bottom: 0px;
}

#mindmap-panel {
    min-height: 20px;
    padding-bottom: 20px;
}



::-webkit-scrollbar {
    width: 6px;
    height: 0px;
    background: transparent;  /* optional: just make scrollbar invisible */
}
/* optional: show position indicator in red */
::-webkit-scrollbar-thumb {
    background: var(--scroll-color);
}

.invisible {
    display: none;
}



.hide-entries {
   display: none!important;
}

.hide-menu {
    display: none!important;
}

#entries {
    position: relative;
    top: 0;
    left: 55px;
    padding-left: 0px;
    padding-top: 10px;
    /* height: 100%; */
    z-index: 5;
    max-width: 360px;
    -webkit-overflow-scrolling: touch;
    overflow: scroll;
    /* -webkit-mask:linear-gradient(#fff 5% 90%, transparent 95%);
          mask:linear-gradient(#fff 5% 90%, transparent 95%); */
}

#react-wrapper {
    position: absolute;
    top: 500px;
    left: 600px;
    max-width: 340px;
    -webkit-overflow-scrolling: touch;
    overflow: scroll;
}

#entryform {
    position: relative;
    background-color: var(--entry-form-background);
    width: 360px;
    border-radius: 10px;
    /* border-top-left-radius: 0px!important; */
    padding-top: 10px;
    height: 100%;
    padding-bottom: 20px;
    padding-left: 10px;
    margin-left: 0px;
    margin-bottom: 0px;
    z-index: 10!important;
    display: block;
}


#analytics {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: fixed;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    right: 0px;
    width: 355px;
    top: 48px;
    bottom: 0;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    clear: both;
    /* border-radius: 12px; */
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 11214421322!important;
    background-color: var(--analytics-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display: none;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}

.addBottomToAnalyticsPanel {
    /* bottom: 85px; */
}

.addBottomToGraphInfoPanel {
    bottom: 85px;
}

.addBottomToPanel {
    bottom: 24px;
}

#variabilityPanel {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    right: 120px;
    width: 360px;
    max-height: 85%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 12!important;
    background-color: var(--analytics-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}

.addBottomToVariability {
   bottom: 85px;
}



#analytics a, #variabilityPanel a {
    color: inherit;
    text-decoration: none;
}

#analytics a:hover, #variabilityPanel a:hover {
    color: #0089E0!important;
    text-decoration: underline!important;
}

#resetgraph a {
      text-decoration: underline!important;
}

#arrowfold {
  /* display: inline-block; */
  float: left;
  position: relative;
  text-align: center;
  vertical-align: top;
}
#mainanalytics {
    margin-top: 10px;
    padding: 10px;
    /* display: inline-block; */
    clear: both;

}
#topicalClusters,#structuralGapClusters,#latentNodesClusters,#sentimentAnalysisCluster,#relatedNodesCluster,#emergingKeywordsCluster,#emergingTopicsCluster,#textStatisticsCluster,#textNetworkStatisticsCluster,#discourseStructureCluster {
    margin-top: 20px;
    display: block;
    position: relative;
}

#narrativeInfluenceCluster{
    margin-top: 10px;
    margin-bottom: 80px;
    display: block;
    position: relative;
}

#relationsExcerpts {
    margin-top: 20px;
    display: block;
    position: relative;
}

#addcontext_stats,#seocontext_stats {
    margin-top: 20px;
    display: block;
    position: relative;
}
#topInfluentialNodes {
    margin-top: 10px;
    display: block;
    position: relative;
}
#analyticsCaption {
    font: 18px 'IstokWeb-Bold',sans-serif;
    position: relative;
    display:inline;
    margin-top: 4px;
    padding: 10px 10px 0px 10px;
    display: inline-block;
    clear: both;
}

#mainnetworkstructure {
    padding: 0px 0px 0px 0px;
    display: inline-block;
    

}

#variabilityContainer {
    padding: 0px 10px 10px 10px;
    display: inline-block;
    margin-top: -15px;   
}

#variabilitySchema {
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: -15px;
    display: block;
    width: 350px;
    height: 225px;
    background-image: var(--variability-schema);
    background-repeat:no-repeat;
    background-position:center;
    cursor: pointer;
}

#variabilityState {
    position: absolute;
    opacity: 0.35;
    width: 135px;
    height: 80px;
}

#variabilityNextState {
    position: absolute;
    width: 135px;
    height: 30px;
    background-image: var(--variability-arrow);
    background-repeat:no-repeat;
    background-position:center;
}

#variabilityHistoryContainer {
    position: relative;
    max-width: 320px;
    max-height: 45px;
    display: flex;
    
}

#variabilityInfo {
    position: relative;
    margin-top:50px;
    
}

#variabilityHistory {
    position: relative;
    width: 100%;
    max-height: 45px;
    vertical-align: top;  
    text-align: left;
    float: right;
    display: flex; 
    overflow-x: scroll;
}

#variabilityRecommendation {
    position: relative;
    width: 100%;
    max-height: 45px;
    vertical-align: top;  
    text-align: left;
    float: right;
    display: flex; 
    overflow-x: scroll;
    color: var(--body-text-color)!important;
    font: 13px 'IstokWeb-Regular',sans-serif;
}

#variabilityHistory::-webkit-scrollbar {
    height: 4px!important;     
    scrollbar-color: dark;
}

  
#variabilityHistory::-webkit-scrollbar-track {
    border-radius: 0;
    
}
  
#variabilityHistory::-webkit-scrollbar-thumb {
    border-radius: 0;
    width: 20px;
}


.alphaimage-uniform {
    display: inline-block;   
    background-image: var(--variability-uniform-symbol);
    background-repeat:no-repeat;
    background-position:center;

}
.alphaimage-regular {
    display: inline-block;   
    background-image: var(--variability-regular-symbol);
    background-repeat:no-repeat;
    background-position:center;
 
}
.alphaimage-fractal {
    display: inline-block;   
    background-image: var(--variability-fractal-symbol);
    background-repeat:no-repeat;
    background-position:center;
  
}
.alphaimage-complex {
    display: inline-block;   
    background-image: var(--variability-complex-symbol);
    background-repeat:no-repeat;
    background-position:center;
   
}
.alphaimage-medium {
    background-size: 20px;
    width: 20px;
    height: 20px;
}

.alphaimage-small {
    background-size: 15px;
    width: 15px;
    height: 15px;
}




#insightanalytics {
    display: none;
    padding: 10px;
    margin-top: 10px;
    /* display: inline-block; */
    clear: both;

}

#trendsanalytics {
    display: none;
    padding: 10px;
    margin-top: 10px;
    /* display: inline-block; */
    clear: both;

}

#occurrence-chart-container {
    clear: both;
    position: relative;
    height: 300px!important;
}
#sentiment-chart-container {
    clear: both;
    position: relative;
    height: 200px!important;
    margin-top: 5px;
    margin-bottom: 5px;
}

#occurrence-controls {
    display: flex;
    position: relative;
    float: left;
    width: 100%;
}

#filter-occurrence {
    position: relative;
    width: 85%;
    margin-left: 10px;
}

#degree-dist-chart-container {
    display: none;
    height: 190px!important;
}

#alpha-chart-container {
    display: none;
    height: 250px!important;
}
#dfa-chart-container {
    position: relative;
    height: 250px!important;
}
#dfa-chart,#alpha-chart {
    height: 250px!important;
}

#alphachart {
    cursor: pointer;
}

#searchanalytics {
    display: none;
    padding: 10px;
    /* display: inline-block; */
    clear: both;

}

#mininganalytics,#sentimentanalytics,#relationsanalytics {
    display: none;
    padding: 10px;
    /* display: inline-block; */
    clear: both;
    margin-top: 10px;
}

.stats_nodes {
    cursor: pointer;
}

#statsanalytics {
    display: none;
    padding: 10px;
    clear: both;
    margin-top: 10px;
}

#networkStructureAnalytics {
    display: none;
    padding: 10px;
    clear: both;
    margin-top: 10px;
}

#emergingtopics {
    display: none;
}

.clusterLabel {
    padding: 15px;
    background-color: var(--cluster-label-background);
    border-width: 2px;
    border-style: dashed;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    pointer-events: none;
    
}

.gapLabel {
    padding: 15px;
    background-color: none;
    border-width: 2px;
    border-style: dashed;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    pointer-events: none;
    border-color: #ff007f;
    font-size: 12px;
    color: var(--body-text-color);
    line-height: 13px;
}

.nodeHighlightLayer {
    padding: 15px;
    background-color: none;
    opacity: 1;
    border-width: 2px;
    border-style: dashed;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    pointer-events: none;
    
}

.community_cluster {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 5px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
    position: relative;
}



/* .community_cluster:hover {
    opacity: var(--eye-show-opacity);
    background-image: var(--eye-show-background);
    background-size: 20px 20px;
    background-repeat:no-repeat;
    background-position-x: calc(100% - 5px);
    background-position-y: calc(50%);
} */

.influence_cluster {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 8px;
    margin-bottom: 5px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
    position: relative;
}
#maintopics,#recommendedquestion {
    margin-top: 8px;
}

.related_cluster {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 5px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
    position: relative;
}

#termsLDA {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 5px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
}

.LDATopic {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 5px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
}
.influence_node,.related_node {
    display: inline;
}

.emerging_cluster {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 5px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
}

.seo_missing_cluster {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 10px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
    
}

.top_missing_analytics {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 10px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
}

.top_merge_analytics {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-top: 3px;
    margin-bottom: 10px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
}

#structureadvice {
    display: none;
    margin-top: 15px;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:-10px;
    font: 14px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;
}


#structurehelpadvice,#diversityhelpadvice,#degreedisthelpadvice,#kstesthelpadvice,#dfahelpadvice,#immunityhelpadvice,#influencehelpadvice,#essencepanelhelpadvice,#variabilityScoreAdvice,#variabilityMapAdvice,#diagnosisAdvice {
    display: none;
    margin-top: 10px;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:10px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;
}

#downloadButtons {
    top: 5px;
    position: relative;
    
}


#variabilityScore {
    position: relative;
    margin-top: 5px;
    margin-bottom: 10px;
}
#variabilityScoreAdvice {
    width: 80%;
    margin-bottom: 10px;
}

#variabilityMapAdvice, #diagnosisAdvice {
    width: 80%;
    margin-bottom: 10px;
}

#variabilityPhasesToExplore {
    margin-top: 10px;
    margin-bottom: 10px;
}

#influentialadvice,#relatedadvice {
    display: none;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:15px;
    margin-top: 5px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;

}

#stopwordshelpinfo, #mergednodeshelpinfo, #lemmatizerhelpinfo {
    display: none;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-top: 15px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;
}

 

#latentadvice,#evolutionadvice {
    display: none;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:15px;
    margin-top: 5px;
    font: 14px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;

}
#topicsadvice,#ldatopicsadvice,#sentimentadvice {
    display: none;
    margin-top: 5px;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:15px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;

}

#topicsadvice a {
    text-decoration: underline!important;
    color: var(--body-text-color)!important;
}

.analytics_caption {
    font: 13px 'IstokWeb-Regular',sans-serif;
    line-height: 14px!important;
}
.analytics_caption a {
    text-decoration: underline!important;
    color: var(--body-text-color)!important;
}



#gapadvice {
    display: none;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:15px;
    margin-top: 5px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;

}

#bigramsadvice {
    display: none;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:15px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;

}


#insightadvice {
    display: none;
    margin-top: 5px;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    margin-bottom:-10px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;
    margin-bottom: 15px;
}

#variabilityAdviceHelper {
    display: none;
    
    max-width: 80%;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: 15px;
    
    font: 13px 'IstokWeb-Regular',sans-serif;
    border: 1px solid #ccc;
    
    margin-top: 25px;
    margin-bottom: 0px;
}

#graphadvice {
    display: none;
    margin-top: 10px;
}

.open_missing {
    text-decoration: underline!important;
    font: 14px 'IstokWeb-Bold',sans-serif;
}

.informtable {
    background-color: var(--inform-table-background);
    vertical-align: top;
}



.table-wrapper {
    overflow: auto;
      max-width: 100%;
      max-height: 400px;
      background:
          linear-gradient(to right, var(--table-color) 30%, var(--table-background)),
          linear-gradient(to right, var(--table-background),var(--table-color) 70%) 0 100%,
          radial-gradient(farthest-side at 0% 50%, var(--table-transparent), var(--table-black)),
          radial-gradient(farthest-side at 100% 50%, var(--table-transparent), var(--table-black)) 0 100%;
      background-repeat: no-repeat;
      background-color: var(--table-background);
      background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
      background-position: 0 0, 100%, 0 0, 100%;
      background-attachment: local, local, scroll, scroll;
  }
  .table-wrapper.cutshort {
      max-height: 200px;
  }

  .table-wrapper.cutmedium {
    max-height: 300px;
}

  #topics_table {
      margin-bottom: 20px!important;
  }

  #topicsstats {
      display: none;
  }

  .topindent {
      margin-top: 5px;
      margin-bottom: -10px;
  }

  

  .bottomindent {
      margin-bottom: 5px;
  }



  .wider {
      width: 45%; 
  }

  .small-table-wrapper {
    overflow: auto;
      max-width: 100%;
      max-height: 400px; 
      background-color: transparent;
      background-attachment: local, local, scroll, scroll;
  }
  #modularity_table {
      width: 100%;
  }
  
  table {
    border-collapse: collapse;
  }


  tr {
    border-bottom: 1px solid #aaa;
  }

  tr.strict {
    border: 1px solid #aaa;
    border-radius: 3px;
  }
  
  tr.strict > th  {
    
    background-color: transparent;
    color: var(--table-text);
    white-space: nowrap;
    cursor: pointer;
    vertical-align: top;
  }
  
  th {
    background-color: #ccc;
    color: #333333;
    white-space: nowrap;
    cursor: pointer;
    vertical-align: top;
  }
  
  th,
  td {
    font-size: 13px;
    text-align: left;
    padding: 0.3em 0.4em;
  }
  
  .numeric {
    text-align: right;
  }

button {
  font-size: 12px;
  background: #e0e0e0;
  border: 1px solid #ccc;
  padding: 5px 10px;
  border-radius: 3px;
  cursor: pointer;
}

button:hover {
    background: #e0e0e0;

  }

.abutton {
        font: 12px 'IstokWeb-Regular',sans-serif!important;
        background: #fff;
        border: 1px solid #ccc;
        padding: 4px 7px;
        border-radius: 3px;
        cursor: pointer;
        text-decoration: none!important;
        color: #000!important;
}
.abutton_darker {
    background: var(--abutton-background);
    border: 1px solid;
    border-color: var(--abutton-border-color) 
}

.abutton a {
    text-decoration: none!important;

}
.abutton:hover {
    color: #333!important;
    background-color: #e0e0e0!important;
    
}

.indentop {
   line-height: 40px!important;
}




#analyticsbutton {
  position: absolute;
  bottom: 15px;
  width: 55px;
  height: 55px;
  right: 15px; /* "#menu width" */
  font-size: 11px; /* change this value to increase/decrease button size */
  /* width: 2em;
   height: auto;*/
  z-index: 10;
  background-image: var(--analytics-button-url);
  background-repeat:no-repeat;
  background-size: 25px;
  background-position:center;
  content: attr(data-before);
  border: var(--analytics-button-border);
  border-radius: 30px;
  vertical-align: middle;
  background-color: var(--analytics-button-background);
  box-shadow: 0 3px 15px rgba(0,0,0,.16);
  -webkit-box-shadow: 0 3px 15px rgba(0,0,0,.16);


}

#analyticsbutton:hover {
    background-color: var(--analytics-button-background-hover);
}

#helperbutton {
    position: absolute;
    bottom: 15px;
    width: 55px;
    height: 55px;
    right: 380px; /* "#menu width" */
    font-size: 11px; /* change this value to increase/decrease button size */
    /* width: 2em;
     height: auto;*/
    z-index: 10;
    background-image: url('/images/idea-insight.png');
    background-repeat:no-repeat;
    background-position:center;
    content: attr(data-before);
    border: var(--analytics-button-border);
    border-radius: 30px;
    vertical-align: middle;
    background-color: var(--helper-button-background);
    box-shadow: 0 3px 15px rgba(0,0,0,.16);
    -webkit-box-shadow: 0 3px 15px rgba(0,0,0,.16);
  
  
}

#helperbutton:hover {
    background-color: var(--helper-button-background);
    color:#3cc6fc;
}


.helperbutton-on {
    
    background-color: var(--helper-button-on)!important;
}

.helperbutton-caption:after {
    font-size: 13px;
    line-height: 15px;
    right: 65px;
    text-align: right;
    position: absolute;
    color: var(--helper-button-font); /* #00B7FF; */
    width: 50px;
    bottom: 12px;
    content: 'AI insights';
}

.helperbutton-caption:hover {
    color:#3cc6fc!important;
}

.percentage, .nodecount {
    pointer-events: none;
}
.nodecount {
    font-size: 14px;
}

#helperpanel {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    right: 450px;
    width: 460px;
    max-height: 80%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 11!important;
    background-color: var(--helper-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}

.addBottomToHelper {
    bottom: 17px;
}

.moveHelperToMiddle {
    bottom: 45%;
    left: 50%;
    margin-left: -210px;

}

.moveHelperToMiddle #helpermessage {
    margin-top: 10px!important;
}

.adjustHelperBottom {
    bottom: 35%!important;
}

.adjustHelperHeight {
    max-height: 60%!important;
}

#helperpanel a {
    color: inherit;
    text-decoration: none;
}

#helperpanel a:hover {
    color: #0089E0;
    text-decoration: underline!important;
}
  
#helpermessage {
    padding: 5px 10px 0px 5px;
    font: 16px 'IstokWeb-Bold',sans-serif;
    margin: 46px 12px 10px 0px;
}

#biasindex {
  position: absolute;
  bottom: 12px;
  width: 175px;
  height: 60px;
  right: 170px; /* "#menu width" */
  font-size: 14px; /* change this value to increase/decrease button size */
  /* width: 2em;
   height: auto;*/
  z-index: 1!important;
  display: flex;
  color: var(--biasindex-font);
  cursor: pointer;

  border-radius: 10px; 
  border: 1px solid;
  border-color: var(--biasindex-border);
}

#typeofinf {
    display: inline;
}

#typeofemerging {
    display: inline;
}

#analbutton {
    background: #ffffff;
}

#searbutton {
    background: #ededed;
}


#resetgraph {
    background: #ededed;
}




#graphsettings {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    top: 265px;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    right: 50px;
    width: 300px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--analytics-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}



#filtergraph {
    margin-top: 10px;
    padding: 10px;
    /* display: inline-block; */
    clear: both;
}

#settingsgraph {
    margin-top: 10px;
    padding: 10px;
    /* display: inline-block; */
    clear: both;
}


#languageProcessingPanel {
    margin-top: -10px;
    padding: 0 10px 10px 10px;
    display: inline-block;
    clear: both;
    line-height: 19px;
}


#aiStatementsPanel {
    margin-top: -10px;
    padding: 0 10px 10px 10px;
    display: inline-block;
    clear: both;
    line-height: 19px;
}


#downloadgraphpanel {
    margin-top: -10px;
    padding: 0 10px 10px 10px;
    display: inline-block;
    clear: both;
    line-height: 19px;
}

#timergraphdatapanel {
    margin-top: -10px;
    padding: 0 10px 10px 10px;
    display: inline-block;
    clear: both;
    line-height: 19px;
}

#sharegraphpanel {
    padding: 0 10px 10px 10px;
    margin-top: 15px;
}

#savegraphpanel {
    padding: 0 10px 10px 10px;
    margin-top: 15px;
}

#deletegraphpanel {
    padding: 0 10px 10px 10px;
    margin-top: 15px;
}

#graphsettings a:hover {
    color: #0089E0!important;
    text-decoration: underline!important;
}



#downloadgraphdata {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 350px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--entrymenu-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}

#sharegraphdata {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    top: 200px;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 250px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--entrymenu-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    align-items: top;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}

#timergraphdata {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    top: 170px;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 300px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--entrymenu-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    align-items: top;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}


#languageProcessingData {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    top: 170px;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 320px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--entrymenu-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    align-items: top;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}

#aiStatementsData {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    top: 60px;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 320px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--entrymenu-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    align-items: top;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}


#update_graph_settings {
    margin-top: 20px;
}


#savegraphdata {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 290px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--entrymenu-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    align-items: top;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}


#deletegraphdata {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    top: 310px;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 290px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--entrymenu-pane-background);
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    align-items: top;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
}

#graphInfoData {
    font: 15px 'IstokWeb-Regular',sans-serif;
    position: absolute;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    left: 45px;
    width: 400px;
    clear: both;
    border-radius: 12px;
    padding: 0px 10px 10px 10px;
    margin-right: 0px;
    z-index: 14;
    background-color: var(--projectnotes-pane-background);
    opacity: 1!important;
    /* box-shadow: 0px 1px 1px 2px #f3f4f6; */
    word-wrap: break-word;
    display:none;
    align-items: top;
    box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
    -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;

    
}
#graphInfoPanel {
    padding: 0 10px 10px 10px;
    margin-top: 15px;
    
}

#graphInfoHeader {
    padding-top: 5px;
    display: block;
    padding-bottom: 5px;
}

#graphInfoContent {
    
    margin-left: 15px;
    margin-right: 50px;
    padding-right: 20px;
    font: 14px 'IstokWeb-Regular',sans-serif;
}


#downloadProjectNotes,#copyProjectNotes {
    position: relative;
    left: 0; /* "#menu width" */
    text-align: center;
    padding-top: 7px;
    padding-bottom: 6px;
    padding-left: 6px;
    padding-right: 6px;
    margin-left: 5px;
    background-color: #f5f5f5;
    color: #666;
    font: 13px 'IstokWeb-Regular',sans-serif;
    /* width: 32px;
    height: 32px;
    float: right; */
    z-index: 10;
    display: inline-block;
    min-width: 15px;
    float: right;
    /* pointer-events: auto!important;   */
}

#addAnalyticsToNotes {
    position: relative;
    display: block;
    float: right;
    background-color: #f5f5f5;
    margin-bottom: 10px;
    margin-top: 5px;
}


#aiStatementsData a:hover {
    color: #0089E0!important;
    text-decoration: underline!important;
}

#downloadgraphdata a:hover {
    color: #0089E0!important;
    text-decoration: underline!important;
}

#sharegraphdata a:hover, #savegraphdata a:hover, #deletegraphdata a:hover, #timergraphdata a:hover {
    color: #0089E0!important;
    text-decoration: underline!important;
}




#search_queries_kwrds_page {
    margin-left: 10px;
}

#livehint {
    position: fixed;
    top: 110px;
    text-align: left;
    width: 250px;
    height: 15px;
    left: 60px; /* "#menu width" */
    font-size: 14px; /* change this value to increase/decrease button size */
    line-height: 15px;
    /* width: 2em;
     height: auto;*/
    z-index: 1!important;
    color: #666666;
    font-size: 13px;
    float:left;
    padding-right: 20px;
    display: inline-block;
    display: none; 
  
  }

  #reversehint {
    position: fixed;
    top: 155px;
    text-align: left;
    width: 250px;
    height: 15px;
    left: 60px; /* "#menu width" */
    font-size: 14px; /* change this value to increase/decrease button size */
    line-height: 15px;
    /* width: 2em;
     height: auto;*/
    z-index: 1!important;
    color: #666666;
    font-size: 13px;
    float:left;
    padding-right: 20px;
    display: inline-block;
    display: none; 
  
  }


#livetext {
  position: absolute;
  top: 170px;
  text-align: right;
  width: 250px;
  height: 15px;
  right: 60px; /* "#menu width" */
  font-size: 14px; /* change this value to increase/decrease button size */
  line-height: 15px;
  /* width: 2em;
   height: auto;*/
  z-index: 1!important;
  color: #666666;
  font-size: 13px;
  float:right;
  padding-right: 20px;
  display: inline-block;
  display: none; 

}


#liveupdate {
    position: absolute;
    top: 150px;
    text-align: left;
    height: 20px;
    width: 55px;
    right: 78px; /* "#menu width" */
    font-size: 14px; /* change this value to increase/decrease button size */
    line-height: 26px;
    z-index: 1;
    color: #666666;
    font-size: 13px;
    padding-right: 18px;
    display: inline-block;
    opacity: var(--live-link-opacity);
    background-image: var(--live-link-image);
    background-repeat:no-repeat;
    background-position:right;
  }

  .liveblink {
      position: relative;
      display: inline;
        animation:blinkingText 1.5s infinite;
  }

  @keyframes blinkingText{
    0%{     color: #666;    }
    40%{    color: #666; }
    70%{    color: #666; }
    90%{    color: transparent; }
    99%{    color:transparent;  }
    100%{   color: #666;    }
}


#livetext em {
  color: #444444;
}

#livetext span {
  height: 15px;
  margin-bottom: -4px;
  width: 2px;
  color: #666666;
  background: #666666;
  opacity: 0;
  display: inline-block;
  animation: blink 0.5s linear infinite alternate;
}

@keyframes blink {
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

#biasslider {
    padding-right: 8px;
    padding-top: 18px;
    cursor: pointer;
}
#biassliderAnaytics {
    cursor: pointer; 
}

.slidercaption {
  padding: 8px 0px 8px 8px;
  position: relative;
  width: 75px;
  line-height: 15px;
  color: #666666;
  font-size: 13px;
}

.slidercontainer {
  position: relative;

  width: 95px;
  float: left;
}
.slidercontainerAnalytics {
    position: relative;
    display: inline-block;
    width: 95px;
    margin-left: 5px;
    margin-right: 5px;
    top: 6px;

}

.slider {
  position: relative;

  -webkit-appearance: none;
  width: 95px;
  height: 20px;
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;

}

.slider:hover {
  opacity: 1;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background: #999999;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 20px;
  height: 20px;
  background: #4CAF50;
  cursor: pointer;
}

.biasedslider::-webkit-slider-thumb {
    background-color: red;
}
.biasedslider::-moz-range-thumb {
    background-color: red;
}
.focusedslider::-webkit-slider-thumb {
    background-color: yellow;
}
.focusedslider::-moz-range-thumb {
    background-color: yellow;
}
.diversedslider::-webkit-slider-thumb {
    background-color: lightgreen;
}
.diversedslider::-moz-range-thumb {
    background-color: lightgreen;
}
.dispersedslider::-webkit-slider-thumb {
    background-color: violet;
}
.dispersedslider::-moz-range-thumb {
    background-color: violet;
}

.analyticsbutton-dark {
  border: 1px solid #444444!important;
}

#menu_with_tags {
    position: absolute;
    width: 100%;
    max-height: 400px;
    z-index: 1000;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: var(--childrenmenu-background);
    border-radius: 12px;
}


#analyticscaption {

  position: absolute;
  text-align: right;
  font-size: 13px; /* change this value to increase/decrease button size */
  line-height: 26px;
  right: 67px;
  top: 17px;
   width: 80px;
   color: var(--analytics-button-font);/*#00B7FF; /*#c0a31d; */
}

#analyticscaption:hover {
    color: var(--analytics-button-font);/*#3cc6fc;*/
}


.analytics-on {
    opacity: var(--atom-close-opacity);
    background-image: var(--atom-close-background)!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
}


.headline {
  font: 16px 'IstokWeb-Bold',sans-serif;
  display:inline;
}

.community_category {
    font: 15px 'IstokWeb-Bold',sans-serif;
    display:block;
    pointer-events: none;
}



.subline {
    font: 14px 'IstokWeb-Bold',sans-serif;
    display:inline;
}

.sublineSmall {
    font: 13px 'IstokWeb-Bold',sans-serif;
    display:inline;
}

.inlinesquare {
  display: inline-block;
  background-color: #ff9999;
  width: 10px;
  height: 10px;
  position: relative;

}



.helpersquare {
    display: inline-block;
    background-color: #ff9999;
    width: 10px;
    height: 10px;
    position: relative;
  
  }

  .helperrect {
    display: inline-block;
    background-color: #ff9999;
    width: 30px;
    height: 10px;
    position: relative;
    cursor: pointer;
  
  }
  .aiHelperCommunity{
    cursor: pointer;
  }

  .inlinerect {
    display: inline-block;
    background-color: #ff9999;
    width: 30px;
    height: 10px;
    position: relative;
    cursor: pointer;
  
  }

  .inlinerect:hover {
    opacity: var(--eye-show-opacity);
    background-image: var(--eye-show-background);
    background-size: 12px 12px;
    background-repeat:no-repeat;
    background-position-x: calc(50%);
    background-position-y: calc(50%);
  }

.helper_nodes,.helper_top {
    font: 16px 'IstokWeb-Regular',sans-serif!important;

}

.helper_proceed {
    display: block;
    margin-top: 5px;
    font-size: 15px;
    float: right;
    margin-right: 10px;
    height: 34px;
}
.helper_proceed_left {
    
    float: left!important;
}



.generate_idea {
    float: left;
    display: inline;
    margin-top: 5px;
    height: 30px;
    font-size: 13px;
    margin-left: 10px;
    margin-bottom: 12px;
}


.helper_selector {
    float: right;
    display: block;
    margin-top: 7px;
    margin-left: 10px;
    margin-right: 10px;
}
.helper_inline_selector {
    padding: 5px;
}
.helper_import_panel {
    clear: both;
    display: block;
    padding-top: 5px;
 
}
.helper_import_text {
    margin-top: 10px;
    margin-right: 5px;
    display: block;
    float: right;
    font: 12px 'IstokWeb-Regular',sans-serif!important;
}

.helper_intro {
    display: block;
    margin-bottom: 15px;
    margin-top: 5px;
    font: 20px 'IstokWeb-Bold',sans-serif!important;
    color: var(--body-text-color);
}



.helper_teaser {
    
    display: block;
    margin-top: 5px;
    font: 16px 'IstokWeb-Bold',sans-serif!important; 
    /* color: var(--body-text-color); */
}
.helper_teaser::first-letter {
    text-transform:capitalize;
}

.insideAnswer {
    display: inline;
    float: right;
}

.helper_help_link {
    float: left;
    display: block;
    margin-top: 20px;
    margin-right: 10px;
    font: 12px 'IstokWeb-Regular',sans-serif!important;
    /* background: #eee; */
    border: 1px solid #ccc;
    padding: 4px 7px;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none!important;
    color: var(--body-text-color);
}

.helper_skip_link {
    float: left;
    display: block;
    margin-top: 10px;
    margin-right: 10px;
    font: 12px 'IstokWeb-Regular',sans-serif!important;
    /* background: #eee; */
    border: 1px solid #ccc;
    padding: 4px 7px;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none!important;
    color: var(--body-text-color);
}

.import_button_reset {
    position: relative;
    display: block;
    clear: both;
}

.helper_intro_button  {
    float: left;
    display: block;
    margin-top: 5px;
    margin-right: 20px;
    margin-bottom: 5px;
    width: 95px;
    height: 95px;
    font: 16px 'IstokWeb-Bold',sans-serif!important;
    /* background: #eee; */
    border: 1px solid #ccc;
    padding: 10px 10px;
    border-radius: 10px;
    cursor: pointer;
    text-decoration: none!important;
    color: var(--body-text-color)!important;
}

.import_button {
    
    
    margin-top: 5px;
    margin-right: 15px;
    margin-bottom: 5px;
    width: 75px;
    height: 40px;
    font: 14px 'IstokWeb-Bold',sans-serif!important;
    /* background: #eee; */
    border: 1px solid #ccc;
    padding: 10px 10px;
    border-radius: 10px;
    cursor: pointer;
    text-decoration: none!important;
    color: var(--body-text-color)!important;
}

.import_button_bigger {
    float: left;
    display: block;
    margin-top: 5px;
    margin-right: 15px;
    margin-bottom: 5px;
    width: 95px;
    height: 75px;
    font: 16px 'IstokWeb-Bold',sans-serif!important;
    /* background: #eee; */
    border: 1px solid #ccc;
    padding: 10px 10px;
    border-radius: 10px;
    cursor: pointer;
    text-decoration: none!important;
    color: var(--body-text-color)!important;
}

.helper_intro_button a, .import_button a, .import_button_bigger a {
    color: var(--body-text-color)!important;
}

.helper_intro_button:hover, .import_button:hover, .import_button_bigger:hover {
    background-color: #6688ff;
    border-color: #6688ff;
    color: #fff!important;
    
}

.helper_intro_footprint {
    display: block!important;
    font: 13px 'IstokWeb-Regular',sans-serif!important;
    margin-top: 10px;
    
}
.helper_service_text_caption {
    display: block;
    clear: both;
    float: left;
    font: 13px 'IstokWeb-Bold',sans-serif!important;
    color: var(--body-text-color)!important;
    padding-top: 8px;
    padding-right: 8px;

}
#helper_service_caption {
    position: absolute;
    /* clear: both; */
    float: right;
    font: 13px 'IstokWeb-Bold',sans-serif!important;
    color: var(--body-text-color)!important;
    padding-top: 8px;
    padding-right: 8px;
    /* cursor: pointer; */
    right: 0px;
    top: -30px;
    /* right: -10px;
    bottom: -20px; */
}

#helper_import_caption {
    position: absolute;
    float: left;
    font: 13px 'IstokWeb-Bold',sans-serif!important;
    color: var(--body-text-color)!important;
    padding-top: 8px;
    padding-right: 8px;
    /* cursor: pointer; */
    left: 0px;
    top: -25px;
}

#helper_service_expand {
    position: absolute;
    /* clear: both; */
    float: right;
    font: 13px 'IstokWeb-Bold',sans-serif!important;
    color: var(--body-text-color)!important;
    cursor: pointer;
    top: 10px;
    right: 4px;
    width: 10px;
    height: 18px;
}
#helper_buttons_html {
    display: block;
}

#helper_import_buttons_html {
    display: block;
}

.helper_explore_text {
    display: block;
    clear: both;
    float: left;
    font: 15px 'IstokWeb-Bold',sans-serif!important;
    color: var(--body-text-color)!important;
    padding-top: 8px;
    padding-right: 8px;
}

#helper_analyze_import {
    float: right;
    margin-top: 16px;
    background-image: var(--file-import-background-image);
    opacity: var(--file-import-link-opacity); 
    background-repeat: no-repeat!important;
    display: block;
    width: 90px;
    background-position: 5px 10px; 
    left: 0; /* "#menu width" */
    text-align: right;
    padding-top: 10px;
    padding-bottom: 6px;
    padding-left: 22px;
    padding-right: 6px;
    margin-left: 5px;
    margin-right: 5px;
    height: 24px;
    background-color: #f5f5f5;
    color: #666;
    font: 14px 'IstokWeb-Regular',sans-serif!important;
    height: 20px;
}

#helper_analyze_import_general {
    float: right;
    margin-top: 16px;
    opacity: var(--file-import-link-opacity); 
    background-repeat: no-repeat!important;
    display: block;
    width: 70px;
    background-position: 5px 10px; 
    left: 0; /* "#menu width" */
    text-align: right;
    padding-top: 10px;
    padding-bottom: 6px;
    padding-left: 22px;
    padding-right: 6px;
    margin-left: 5px;
    margin-right: 5px;
    height: 24px;
    background-color: #f5f5f5;
    color: #666;
    font: 14px 'IstokWeb-Regular',sans-serif!important;
    height: 20px;
}


.helper_service_button  {
    float: left;
    display: block;
    margin-right: 10px;
    margin-bottom: 10px;
    height: 16px;
    font: 13px 'IstokWeb-Regular',sans-serif!important;
    /* background: #eee; */
    background: #e0e0e0;
    border: 1px solid #ccc;
    padding: 4px 8px;
    border-radius: 2px;
    cursor: pointer;
    color: #000!important;
    text-decoration: none!important
}

.helper_service_selected {

    background-color: var(--ai-buttons-color);
    border-color: var(--ai-buttons-color);
    color: #fff!important;
    text-decoration: none!important;
}


.helper_service_button a:hover {
    color: #fff!important;
    text-decoration: none!important;
}

.helper_service_button:hover {
    background-color: var(--ai-buttons-color);
    border-color: var(--ai-buttons-color);
    color: #fff!important;
}

#google_helper_button {
    /* background-image: var(--google-logo);
    background-repeat:no-repeat;
    background-position:center;
    width: 24px; */
}

#save_gpt3_phrases, #save_google_results {
    float: right;
    background-color: #6688ff;
    border-color: #6688ff;
    color: #fff!important;
    text-decoration: none!important;
    line-height: 12px;
}
#save_gpt3_phrases:hover, #save_google_results:hover {
    background-color: #33aaff;
    border-color: #33aaff;
    color: #fff!important;
    text-decoration: none!important;
}

#addGPT3QuestionToStatements, #addGoogleResultToProjectNotes {
    float: right;
    background-color: var(--info-background-color);
    border-color: var(--info-background-color);
    color: #fff!important;
    text-decoration: none!important;
    line-height: 12px;
}

#addGPT3QuestionToStatements:hover, #addGoogleResultToProjectNotes:hover {
    float: right;
    background-color: #19d9b4;
    border-color: #19d9b4;
    color: #fff!important;
    text-decoration: none!important;
    line-height: 12px;
}




.blinking {
    animation: blinker 1s linear infinite;
}

@keyframes blinker {
    10% {
      opacity: 0;
    }
    50% {
        opacity: 0.7;
    }
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
    10% {
        opacity: 0;
    }
}

.helper_import_button  {
    float: left;
    display: block;
    margin-right: 10px;
    margin-bottom: 10px;
    height: 20px;
    font: 15px 'IstokWeb-Regular',sans-serif!important;
    /* background: #eee; */
    border: 1px solid #ccc;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    color: var(--body-text-color);
    text-decoration: none!important
}



.helper_import_button:hover, .helper_import_selected {
    background-color: #6688ff;
    border-color: #6688ff;
    color: #fff!important;
    text-decoration: none!important;
}


.helper_import_button a:hover {
    color: #fff!important;
    text-decoration: none!important;
}




.bigger-input {
    margin-bottom: 10px!important;
    font-size: 120%!important;
}
.helper_apps_container {
    position: relative;
    clear: both;
    display: block;
    margin-bottom: 10px!important;
    height: 100%;
}
#helper_intro_container {
    height: 100%!important;
}
.helper_buttons_container {
    position: relative;
    /* clear: both; */
    display: inline-block;
    /* margin-bottom: 10px!important; */
    margin-top: 18px;
    height: 100%;
    width: 92%;
    border: 1px solid #ccc;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 7px;
    margin-left: 0px;
    margin-right: 25px;
}
.helper_import_container {
    position: relative;
    /* clear: both; */
    display: inline-block;
    /* margin-bottom: 10px!important; */
    margin-top: 18px;
    height: 100%;
    width: 90%;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 7px;
    margin-left: -10px;
    margin-right: 20px;
}

#helper_search_submit, #helper_abstract_submit, #helper_analyze_submit {
    margin-left: 10px;
    margin-right: 34px;
    top: 10px!important;
    margin-top: 15px;
    float: right;
}
 
#helper_search_query {
    width: 92%;
    margin-bottom: 10px;
}

#helper_manual_query {
    width: 100%;
    margin-top: 10px;

}


#helper_elaborate_query {
    width: 100%;
    margin-top: 10px;
    font: 14px 'IstokWeb-Bold',sans-serif!important;

}

.helper-form {
    display: block;
    position: relative!important;
    clear: both;
    padding-top: 10px!important;
}

.helper_return_intro {
    position: absolute;
    float: left;
    cursor: pointer;
    bottom: 28px;
    left: 17px;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 0px 4px 0px 4px;
    height: 20px;
    opacity: 0.6;
    font-size: 15px;
}

.helper_return {
    position: relative;
    float: left;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px 6px 2px 6px;
    height: 20px;
    font-size: 13px;
    margin-right: 15px;
}

.helper_play {
    position: relative;
    float: left;
    cursor: pointer;
    margin-right: 15px;
    border: 1px solid #aaa;
    border-radius: 5px;
    padding: 5px 6px 2px 6px;
    height: 20px;
    font-size: 13px;
    
}

.helper_search {
    position: relative;
    float: left;
    cursor: pointer;
    margin-right: 15px;
    border: 1px solid #aaa;
    border-radius: 5px;
    padding: 5px 6px 2px 6px;
    height: 20px;
    font-size: 13px;
    line-height: 19px;
    
}

.helper_import_link {
    float: right;
    display: block;
    margin-top: 5px;
    margin-right: 10px;
    font: 12px 'IstokWeb-Regular',sans-serif!important;
    background: #dfdfdf;
    border: 1px solid #ccc;
    padding: 4px 7px;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none!important;
    color: #000!important;
}

button:hover {
    background-color: #cccccc;
}
.panelControlBtn:hover {
    background-color: #cccccc!important;
}
#helper_intro_container {
    clear: both;
    display: inline-block;
    margin-right: -25px;
    margin-top: 5px;
    padding-bottom: 0px;
}
#helper_study_container, #helper_develop_container, #helper_analyze_container {
    clear: both;
    display: block;
    margin-right: -25px;
    margin-top: 5px;
    padding-bottom: 10px;
}

#helperdiv {
    clear: both;
    position: absolute;
    display: block;
    top: 12px;
    left: 12px;
}

#helperdiv > .helper_return, #helperdiv > .helper_search, #helperdiv > .helper_play {
    margin-top: 0px;
    margin-bottom: 5px;
}

#saveInputToStatementsLabel {
    display: block;
}

#helper_import_options {
    clear: both;
    display: block;
    margin-right: -10px;
    margin-top: 10px;
    padding-bottom: 0px; 
}

#helper_abstract_query, #helper_analyze_query {
    font: 18px 'IstokWeb-Regular',sans-serif!important;
}
#helper_abstract_query {
    margin-bottom: 10px;
}
 



.helper_ideas_container {
    clear: both;
    display: block;
    font-style: italic;
    padding-top: 15px;
    
}

.helper_ideas {
    display: block;
    padding-bottom: 15px;
    border: 1px solid #999;
    padding: 8px;
    border-radius: 10px;
    margin-bottom: 10px;
    background-color: var(--statement-background);
    color: var(--helper-text-color);
    max-height: 400px!important;
    overflow-y: scroll;
}

.helper_ideas_text {
    display: inline;
    opacity: 0.8;
    margin-right: 20px;
    font-size: 15px;
}

#expandtopics {
    cursor: pointer;
    position: relative;
    display: none;
    
}


.controlicon {
    border: 1px solid;
    border-radius: 3px;
    border-color: #aaaaaa;
    text-align: center;
    width: 16px;
    height: 18px;
    font-size: 12px;
    padding: 1px 3px 0px 3px;
    bottom: -2px!important;
    position: relative;
    display: inline-block; 
    cursor: pointer;
} 

.controlicon_inline {
    width: 13px;
    height: 14px;
    margin-left: 2px;
    bottom: -1px!important;
}

.controliconbutton {
    border: 1px solid;
    border-radius: 3px;
    border-color: #aaaaaa;
    text-align: center;
    height: 18px;
    padding: 1px 5px 0px 5px;
    bottom: -2px!important;
    position: relative;
    display: inline-block; 
    font-size: 12px;
    cursor: pointer;
}

.activeControlIconButton {
    border: 0px!important;
}

.activeControlIconButton:hover {
    
        color: #fff!important;
    
}

a.controliconbutton {
    color: var(--body-text-color)!important;
}

.inlineiconbutton {
    border: 1px solid;
    border-radius: 3px;
    border-color: #aaaaaa;
    text-align: top;
    height: 12px;
    padding: 1px 4px 0px 3px;
    bottom: -2px!important;
    position: relative;
    display: inline-block;
    font-size: 10px;
    cursor: pointer;
    top: -2px;
    margin-left: 5px;
}

.insideHelperAnswer {
    border: 1px solid;
    border-radius: 3px;
    border-color: #aaaaaa;
    text-align: top;
    height: 13px;
    padding: 2px 3px 2px 3px;
    
    position: relative;
    display: inline;
    font-size: 11px;
    cursor: pointer;
    
    margin-right: 10px;
}

.insideHelperAnswer:hover {
    color:#0089e0!important;
}

.addGPT3QuestionToStatements,.addGPT3QuestionToGraph,.addContextPhraseToGraph,.addGoogleResultToProjectNotes, .continueanswer,.answerquestion {
    display: inline;
    padding-left: 5px;
    padding-right: 5px;
}
.expandCommunity,.expandInsightNodes,#expandRelated,#expandinfluential {
    display: none;
    border: 1px solid;
    border-radius: 3px;
    border-color: #aaaaaa;
    text-align: top;
    height: 20px;
    padding: 1px 4px 0px 3px;
    bottom: 4px;
    
    font-size: 10px;
    cursor: pointer;
    float: right;
    font-weight:bold;
    margin-top: 2px;
    position: absolute;
    right: 4px;
    z-index:100;
}



.expandCommunity,.expandInsightNodes,#expandRelated,#expandinfluential {
    width: 16px!important;
    height: 16px!important;
    font-size: 12px!important;
    bottom: 4px!important;
    padding: 2px!important;
}
#exporttopics {
    cursor: pointer;
    position: relative;
    display: none;
  
}
#saveInfluentialToNotes,#saveTopicsToNotes {
    cursor: pointer;
    position: relative;
    display: none;
}

#showcategories,#revealundo,#removeinfluential,#showinsight,#reloadinsight, #highlightLatent, #resetSelectedLatent {
    cursor: pointer;
    position: relative;
    display: none;
    background-color: #6688ff;
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 6px;
    padding-bottom: 5px;
}




#generateSummary,#AIExploreTopicButton,#generateSummaryFromGraph,#generateGraphOutline,#showquestion,#showGapContent,#showoutline,#showlatent,#showRelated {
    cursor: pointer;
    position: relative;
    display: none;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
}


#visibleStatementsSummary, #essentialStatementsSummary,#serendipitousStatementsSummary {
    cursor: pointer;
    position: relative;
    display: inline-block;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
    margin-top: 10px;
}

#visibleStatementsSummaryBlock {
    cursor: pointer;
    position: relative;
    display: inline-block;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    font: 13px 'IstokWeb-Regular',sans-serif!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
    top: -4px;
    margin-left: 10px;
}

#showRelated {
    margin-right: 10px;
}

#summarizeRelated {
    cursor: pointer;
    position: relative;
    display: inline-block;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
}





#show_seo_missing,#show_seo_question {
    cursor: pointer;
    position: relative;
    background-color: #6688ff;
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
}

#generateOutlineFromNotes,#generateSummaryFromNotes,#generateContentFromSelected {
    cursor: pointer;
    position: relative;
    display: inline-block;
    /* display: -ms-inline-grid; */
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
    margin-bottom: 15px;
    
}

#generateAiVariability {
    cursor: pointer;
    position: relative;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
    top: 10px;
}

#developStructureAI {
    cursor: pointer;
    position: relative;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
    top: 10px;
    display: inline-block;
    margin-bottom: 25px;
}

#developTopicalState {
    cursor: pointer;
    position: relative;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
    top: 10px;
    display: inline-block;
    margin-bottom: 25px;
}

#generateAiPhases {
    cursor: pointer;
    position: relative;
    background-color: var(--ai-buttons-color);
    border-color: #aaaaaa!important;
    color: #fff!important;
    text-decoration: none!important;
    border: 1px solid;
    border-radius: 3px;
    padding-bottom: 5px;
    top: -2px;
    margin-left: 10px;
}

#generateBasedOnGraphLabel {
    display: inline-block;
    font-size: 12px;
}

#stimulateVariabilityLabel {
    display: none;
    font-size: 12px;
}

#doNotSaveGraphLabel {
    display: none;
    font-size: 12px;
}

#stimulateVariability {
    position: relative;
    top: 2px;
}

#generateBasedOnGraphForPinned {
    position: relative;
    top: 2px;
}
#generateBasedOnGraph {
    position: relative;
    top: 2px;
}

#generateBasedOnGraphForCommunities {
    position: relative;
    top: 2px;
}

#generateBasedOnGraphForCommunitiesLabel {
    display: block;
    font-size: 12px;
}
#saveInputToStatements {
    position: relative;
    top: 2px;
}


#showcategories:hover,#revealundo:hover,#removeinfluential:hover, #generateSummary:hover,#AIExploreTopicButton:hover, #generateSummaryFromGraph:hover, #generateOutlineFromNotes:hover,#generateSummaryFromNotes:hover, #showGapContent:hover, #showquestion:hover, #show_seo_missing:hover, #show_seo_question:hover, #showoutline:hover, #showlatent:hover, #showRelated:hover,#summarizeRelated:hover {
    color: #fff!important;
}

#visibleStatementsSummary:hover,#essentialStatementsSummary:hover, #serendipitousStatementsSummary:hover {
    color: #fff!important;
}

#visibleStatementsSummaryBlock:hover {
    color: #fff!important;
}

#exportrelations {
    cursor: pointer;
    position: relative;
    display: none;
}
#exportbigrams {
    cursor: pointer;
    position: relative;
    display: none;
}

#exportinfluential,#exportrelatednodes,#saveSelectedNodesToNotes {
    cursor: pointer;
    position: relative;
    display: none;
  
}

#introFormSelector {
    display: block;
    margin-top: 10px;
}

#overlapnodes {
    cursor: pointer;
    position: relative;
    display: none; 
    margin-bottom: 8px;
}

/* #removeinfluential {
    cursor: pointer;
    position: relative;
    display: none;
} */

#showinsight, #reloadinsight,#resetSelectedLatent {
    cursor: pointer;
    position: relative;
    display: none;
}

#showquestion, #showGapContent, #showoutline, #showlatent,#showRelated {
    cursor: pointer;
    position: relative;
    display: none;
    margin-top: 10px;
}

#summarizeRelated {
    cursor: pointer;
    position: relative;
    margin-top: 10px;
}



#show_seo_missing,#show_seo_question {
    cursor: pointer;
    position: relative;
    
    margin-top: 10px;
}

#revealmissing {
    cursor: pointer;
    margin-top: 2px;
    margin-bottom: 4px;
}

#revealcommon {
    cursor: pointer;
    margin-top: 2px;
    margin-bottom: 4px;

}


/* #revealundo {
    cursor: pointer;
    position: relative;
    display: none;
} */

#insightundo {
    cursor: pointer;
    position: relative;
    display: none;
}

#influentialhelp,#relatedhelp {
    cursor: pointer;
    position: relative;
    display: none; 
}
#latenthelp {
    cursor: pointer;
    position: relative;
    display: none; 
}
#evolutionhelp {
    cursor: pointer;
    position: relative;
    display: none; 
}
#topicshelp {
    cursor: pointer;
    position: relative;
    display: none; 
}
#bigramshelp {
    cursor: pointer;
    position: relative;
    display: none; 
}
#insighthelp {
    cursor: pointer;
    position: relative;
    display: none; 
}
#structurehelp,#degreedisthelp,#kstesthelp,#dfahelp,#dfachart,#alphachart, #degreedistswitch {
    cursor: pointer;
    position: relative;
}

#kstesthelp,#dfahelp,#dfachart,#alphachart,#degreedistswitch {
    display: inline-block;
    top: -4px!important;
}

#entries_table {
    display: none;
}
#entries_export {
    display: none;
}


#deletenodes {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    margin-left: 5px;
    height: 22px;
    padding: 0px 10px 0px 5px;
    z-index: 10;
    
    display: none;
}

.deletenodes-on {
    opacity: var(--deleted-nodes-opacity);
    background-image: var(--deleted-nodes-background-image)!important;
    background-repeat:no-repeat;
    background-position:center;
}

.loading-button span {
    height: 23px;
    margin-bottom: -4px;
    width: 10px;
    color: #999999;
    background: #999999;
    opacity: 0;
    display: inline-block;
    animation: blink 0.5s linear infinite alternate;
}

.loading-dots span {
    position: inherit;
    height: 23px;
    width: 20px;
    color: inherit;
    opacity: 0;
    display: inline;
    animation: blinker 0.5s linear infinite alternate;
}

#interpret-panel {
    display: none;
}


#undo {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    height: 22px;
    padding-top: 0px;
    padding-bottom: 0px; 
    padding-right: 10px; 
    padding-left: 5px;
    z-index: 10;
    display: none;
}

.undo-on {
    opacity: var(--undo-opacity);
    background-image: var(--undo-background);
    background-repeat:no-repeat;
    background-position:center;
}

#link-pinned {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    height: 22px;
    padding-top: 0px;
    padding-bottom: 0px; 
    padding-right: 10px; 
    padding-left: 10px;
    z-index: 10;
    display: none;
}

#go_next {
    float: right;
    font-size: 14px; 
    width: 2em;
    height: 22px;
    padding-top: 0px;
    padding-bottom: 0px; 
    padding-right: 0px; 
    padding-left: 10px;
    z-index: 10;
    display: none;
    opacity: var(--go-next-opacity); 
    background-image: var(--go-next-background-image);
    background-repeat:no-repeat;
    background-position:center;
  }

#tag-statements {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    height: 22px;
    padding-top: 0px;
    padding-bottom: 0px; 
    padding-right: 10px; 
    padding-left: 10px;
    z-index: 10;
    display: none;
}

#savePinnedToNotes {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    height: 22px;
    padding-top: 0px;
    padding-bottom: 0px; 
    padding-right: 10px; 
    padding-left: 10px;
    z-index: 10;
    display: none;
}

#graph-find-icon {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    height: 22px;
    padding-top: 0px;
    padding-bottom: 0px; 
    padding-right: 10px; 
    padding-left: 10px;
    z-index: 10;
    display: none;
}

.graph-find-on {
    opacity: var(--graph-find-opacity);
    background-image: var(--graph-find-background);
    background-repeat:no-repeat;
    background-position:center;
}

.graph-find-activated {
    background-image: var(--graph-find-activated);
}

.tag-statements-on {
    opacity: var(--tag-opacity);
    background-image: var(--tag-background);
    background-repeat:no-repeat;
    background-position:center;
}

.savePinnedToNotes-on {
    opacity: var(--tag-opacity);
    background-image: var(--tag-background);
    background-repeat:no-repeat;
    background-position:center;
}

.link-pinned-on {
    opacity: var(--link-opacity);
    background-image: var(--link-background);
    background-repeat:no-repeat;
    background-position:center;
}

.link-pinned-unlink {
    opacity: var(--unlink-opacity);
    background-image: var(--unlink-background);
    background-repeat:no-repeat;
    background-position:center;
}


#stopsave {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    height: 22px;
    z-index: 10;
    padding: 0em 2em 0em 1em;
    display: none;
}

#removestopwords {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 2em;
    height: 22px;
    z-index: 10; 
    padding: 0em 1em 0em 0em;
    margin-right: -3px;
    display: none;
    
}

#sliceGraphLayerOff {
    float: right;
    width: 22px;
    height: 22px;
    z-index: 10; 
    padding: 0px 2px 2px 2px;
    margin-right: 4px;
    margin-left: 16px;
    opacity: var(--slice-graph-off-opacity);
    background-image: var(--slice-graph-off-background-image);
    background-repeat:no-repeat;
    background-position:center;
}

.stopsave-on {
    
    opacity: var(--save-stopwords-opacity);
    background-image: var(--save-stopwords-background);
    background-repeat:no-repeat;
    background-position:center;
    display: none;
}
.stopsave-dark {
    /* opacity: 0.5!important;
    background-image: url('/images/save-white.png'); */
    opacity: var(--save-stopwords-opacity);
    background-image: var(--save-stopwords-background);
    background-repeat:no-repeat;
    background-position:center;
    
}

.removestopwords-on {
    
    opacity: var(--remove-stopwords-opacity);
    background-image: var(--remove-stopwords-background);
    background-repeat:no-repeat;
    background-position:center;
    
}


#addnode {
    display: block;
    margin-left: 15px;
    margin-top: 10px;
    
}

#globalsearchbutton {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 23px;
    height: 23px;
    padding: 0px 10px 0px 5px;
    z-index: 10;
    opacity: var(--globalsearch-opacity);
    background-image: var(--globalsearch-background);
    background-repeat:no-repeat;
    background-position:center;
    
}

#mergenodesbutton {
    display: none;
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 20px;
    height: 20px;
    padding: 0px 10px 0px 5px;
    z-index: 10;
    opacity: var(--addplus-opacity);
    background-image: var(--addplus-background);
    background-repeat:no-repeat;
    background-position:center;
    
}

#resetsearchbutton {
    display: none;
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 20px;
    height: 20px;
    padding: 0px 10px 0px 5px;
    z-index: 10;
    opacity: var(--undo-opacity);
    background-image: var(--undo-background);
    background-repeat:no-repeat;
    background-position:center;
    -webkit-transform: rotate(90deg); /* Safari and Chrome */
    -moz-transform: rotate(90deg);   /* Firefox */
    -ms-transform: rotate(90deg);   /* IE 9 */
    -o-transform: rotate(90deg);   /* Opera */
    transform: rotate(90deg);
}

#globalsearchremove {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 23px;
    height: 23px;
    padding: 0em 0em 0em 0em;
    margin-right: -10px;
    z-index: 10;
    opacity: var(--globalsearchremove-opacity);
    background-image: var(--globalsearchremove-background);
    background-repeat:no-repeat;
    background-position:center;
    display: none;
    
}

#loadingsearch {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 23px;
    height: 23px;
    padding: 0em 0em 0em 0em;
    margin-right: -10px;
    z-index: 10;
    background-image: url('/images/loading-circle-small.svg')!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    opacity: 1!important;
    display: none;
   
    
}

#filterGraphView {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 23px;
    height: 23px;
    padding: 0em 0em 0em 0em;
    margin-right: 0px;
    z-index: 10;
    background-image: var(--filter-view-image);
    background-repeat:no-repeat!important;
    background-position:center!important;
    opacity: 0.7!important;
    display: inline;
}

#filterGraphViewSelector {
    margin-right: 10px;
    z-index: 10;
    display: inline;
}

#filterGraphViewPanel {
    display: none;
    
}

#filterGraphViewContainer {
    font-size: 14px;
    color: var(--search-selector-font-color);
    font-family: 'IstokWeb-Regular', Arial, Helvetica, sans-serif;
    z-index: 10;
    display: inline;
    float: right;
    z-index:99;
    padding: 0px 85px 0px 5px;
    margin: -3px;
    
}




.addnode-on {
  opacity: 1!important;
  background-image: url('/images/add-blue.png')!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
}
.addnode-dark {
  opacity: var(--addnode-opacity);
  background-image: var(--addnode-background);
}

#analyticsToggle {
    position: relative;
    grid-column: 1;
    background: none;
    text-align: left;
    font-size: 14px!important;
    width: 30px;
    height: 30px;
    pointer-events: auto!important;
    margin: 2px 4px 5px 6px;
    z-index: 11;
    opacity: var(--analytics-toggle-opacity); 
    background-image: var(--analytics-toggle-background-image);
    background-repeat:no-repeat;
    background-position:center;
  }



#resetbutton {
    position: relative;
    grid-column: 1;
    background: none;
    text-align: left;
    font-size: 14px!important;
    width: 26px;
    height: 26px;
    pointer-events: auto!important;
    margin: 16px 4px 5px 6px;
    z-index: 11;
  opacity: var(--reset-button-opacity);
  background-image: var(--reset-button-background-image);
  background-repeat:no-repeat;
  background-position:center;
}

#reloadbutton {
    position: relative;
    grid-column: 1;
    background: none;
    text-align: left;
    font-size: 14px!important;
    width: 26px;
    height: 26px;
    pointer-events: auto!important;
    margin: 2px 8px 5px 8px;
    z-index: 11;
  opacity: var(--reload-button-opacity);
  background-image: var(--reload-button-background-image);
  background-repeat:no-repeat;
  background-position:center;
}


#zoom-in {
    position: relative;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 24px;
    height: 24px;
    margin: 2px 8px 0px 3px;
    z-index: 10;
    display: block;
  opacity: var(--zoom-in-opacity);
  background-image: var(--zoom-in-background-image);
  background-repeat:no-repeat;
  background-position:center;
}



#zoom-out {
    position: relative;
  font-size: 8px; /* change this value to increase/decrease button size */
  width: 24px;
  height: 24px;
  
  display: block;
  margin: 6px 8px 0px 3px;
  z-index: 10;
  opacity: var(--zoom-out-opacity);
  background-image: var(--zoom-out-background-image);
  background-repeat:no-repeat;
  background-position:center;
}


#searchnode {
    float: right;
    font-size: 8px; /* change this value to increase/decrease button size */
    width: 23px;
    height: 23px;
    padding: 0px 10px 0px 5px;
    z-index: 10;
    opacity: var(--globalsearch-opacity);
    background-image: var(--globalsearch-background);
    background-repeat:no-repeat;
    background-position:center;
}
.searchnode-on {
  opacity: 1!important;
  background-image: url('/images/search-blue.png')!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
}

#pinnednodeslist,#stopnodeslist {
  display: none;
  float: right;
  padding: 5px;
  border: 1px solid rgb(155, 155, 155, 0.7);
  border-radius: 5px;
  max-width: 350px;
  height: 38px;
  overflow-x: auto;
  overflow-y: none;
  white-space: nowrap;
  margin-top: -5px;
  margin-left: 10px;
  /* margin-bottom: 15px; */
}

#pinnednodeslist {
    max-width: 240px!important; 
}

#pinnednodeslist:after {
    position: absolute;
    line-height: 15px;
    font: 12px 'IstokWeb-Regular',sans-serif;
    color: var(--body-text-color);
    bottom: -12px;
    opacity: 0.6;
    content: 'selected nodes';
    z-index: 10;
}
#stopnodeslist:after {
    position: absolute;
    line-height: 15px;
    font: 12px 'IstokWeb-Regular',sans-serif;
    color: var(--body-text-color);
    bottom: -12px;
    opacity: 0.6;
    content: 'hidden nodes';
    z-index: 10;
}


#graphstats {
  
  padding-bottom: 10px;
  margin-top: 15px;
}

#structure_info {
    display: inline-block;
    padding-bottom: 5px;
    
    position: relative;
  }

#addcontextstats {
  display: inline-block;
}

#contextcontrol {
    clear: both;
}

#totalnodescount, #graph_density, #average_degree, #graph_density, #average_degree, #diversity_score, #diversity_caption, #insight_action, #modularity_score, #nodesintoptopic, #top_components_length, #communities_number, #num_nodes_component, #influence_dispersal, #weighed_bc, #variability_action{
    display: inline;
}

#diversity_score,#diversity_score_a,#diversity_caption {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    padding-left: 6px;
    padding-right: 6px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
    margin-top:5px!important;
    display: inline-block;
}

#diversity_score:hover,#diversity_score_a:hover,#diversity_caption:hover {
    color: #ffffff;
    background: #288fd4; /* #105bfb; */
}
#diversity_score_a_a {
    top: -1px;
    position: relative;
}

#recommendedaction {
    margin-top: 5px;
    margin-bottom: 15px;
    display: block;
}

#recommendedVariabilityAction {
    margin-top: 10px;
    margin-bottom: 15px;
    display: block;
}
#variabilityCluster {
    margin-top: 10px;
    margin-bottom: 10px;
}

#insight_action {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    padding-left: 6px;
    padding-right: 6px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
}

#insight_action:hover {
    color: #ffffff;
    background: #288fd4; /* #105bfb; */
}

#variability_action {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    padding-left: 6px;
    padding-right: 6px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
    margin-top: 5px;
    display: inline-block;
}

#variability_action:hover {
    color: #ffffff;
    background: #288fd4; /* #105bfb; */
}

#recommendedDiagnosis {
    margin-top: 5px;
    margin-bottom: 3px;
}

#currentDiagnosis {
    margin-top: 5px;
    margin-bottom: 0px;
}

.diagnosisScore {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 4px;
    margin-left: -2px;
    margin-right: 4px;
    margin-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    border: 1px solid;
    border-color: #888888;
    cursor: pointer;
    margin-top: 5px;
    display: inline-block;
}

.diagnosisScore:hover {
    color: #ffffff;
    background: #288fd4; /* #105bfb; */
}

#submenu {
    position: fixed;
    bottom: 15px;
    right: 15px;
    font-size: 12px;
    z-index: 5;
    text-align: right;
    color: #666;
}

#submenu a {
    text-decoration: none;
    color: #999;
}
#submenu a:hover {
    text-decoration: underline;
    color: #9999cc;
}

/* Sigma.Js style */

#graph-container {
    top: 0;
    bottom: 0;
    left: -50px;
    right: 0;
    position: absolute;
    z-index: -1;
    padding-left: 40px;
    padding-right: 40px;
    overflow:hidden;
    height: 100%;
    
/*
    background-color: #e9e9e6;
*/

    background-color: var(--graph-background);
   
    
}

.graph-loading {
    position: relative;
    background-image: url('/images/loading.svg')!important;
    background-repeat:no-repeat;
    background-position: center center;
    margin-left: 50px;
}


.small-caption {
  font-size: 13px;
  line-height: 15px;
}


.medium-caption {
  font-size: 16px;
  line-height: 22px;
  color: #555555;
}

.large-caption {
  font-size: 17px;
  line-height: 24px;
}

.larger-caption {
    font-size: 19px;
    line-height: 25px;
}
  

#introduction {
    position: relative;
    margin: 35px 0px 0px 30px;
}


.intro {
    font: 20px 'IstokWeb-Bold',sans-serif;
    color: #000;
    max-width: 95%;

}

.intro a {
    font: 18px 'IstokWeb-Bold',sans-serif;
    color: #000;
    max-width: 95%;
    text-decoration: none;

}


.intro a:hover {
    font: 18px 'IstokWeb-Bold',sans-serif;
    color: #0089E0;
    max-width: 95%;
    text-decoration: underline;
}


.graphshowcase{
    width: 240px;
    height: 290px;
    display: inline-block;
    background-color: white;
    margin: 20px 20px 10px 0px;
}

.graphwindow {
    width: 240px;
    height: 260px;
    border: solid 1px #d9d9de;
    background-color: white;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
    text-align: center;

}

.graphwindow img {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    vertical-align: middle;
}

/*handles the vertical centering*/
.Centerer
{
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}


#footer {
    padding-right: 20px;
}

/* Buttons, Forms, and Menus PureCSS */

/* http://yui.github.io/skinbuilder/?mode=pure

   Border radius: 150%
   Vert. padding: 72%
   Master color: C8C6C6
   */



#addcontextbutton {
    float: left;
}
#addcontextinput {
    visibility: hidden;
    z-index:99;
    margin: -20px 0px 0px 10px !important;

}

#renamecontextinput {
    visibility: hidden;
    z-index:99;
    margin: 0px 0px 10px 0px !important;
    background: #333;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 10px;
}

#globalsearchform {
  float: right;
  display: inline;
  z-index:99;
  padding: 0px 10px 0px 20px;
  margin: -5px;

}

#searchform {
    float: right;
    display: inline;
    z-index:99;
    padding: 0px 10px 0px 20px;
    margin: -5px;
}

#editorsearchform {
    float: left;
    display: inline;
    z-index:99;
    padding: 0px 10px 20px 20px;
    margin: -5px;

}
#editorsearch {
    margin-left: -13px;
}

#pinnedNodesContainer, #stopNodesContainer {
  
  padding: 2px 0px 0px 0px;
  
  max-width: 100%;
  height: 48px;
  position: relative;
  margin-bottom: 32px;
}

#pinnedNodesContainer {
    display: none;
}

#globalsearchinput {
  float: right;
  /* visibility: hidden; */
  z-index:99;
  background-color: var(--addnode-input-background);
  border: var(--addnode-input-border);
  box-shadow: var(--addnode-input-shadow);
  color: var(--addnode-input-color);
}

#importpane,#importpane-google,#importpane-twitter {
    position: relative;
    display: block; /* show this only on small screens */
    padding-right: 30px;
    font: 13px 'IstokWeb-Regular',sans-serif;
    float: right;
    padding-top: 2px;
}
#importpane-firstentry, #importpane-firstentry-surveys, #importpane-firstentry-reviews {
    position: relative;
    display: inline; /* show this only on small screens */
    right: 32px;
    font: 13px 'IstokWeb-Regular',sans-serif;
}
.indent-right:before {
    content: ""!important;
    margin-left: 70px!important;
}

.indent-bottom {
    padding-bottom: 10px;
}


#importpane::before { 
    content: "import:";
    padding-right: 0px;
    margin-right: 0px;
    line-height: 34px;
  }

#importpane-google::before { 
    content: "import:";
    padding-right: 3px;
    margin-right: 3px;
    line-height: 34px;
  }

  #importpane-twitter::before { 
    content: "import:";
    padding-right: 3px;
    margin-right: 3px;
    line-height: 34px;
  }


#switcher-selector {
    pointer-events: auto!important;
    position: relative!important;
    float: left;
}


#switcher-panel {
    pointer-events: auto!important;
    position: relative!important;
    clear: both;
}

#adds-content {
    pointer-events: auto!important;
    position: relative!important;

}
#finds-content {
    pointer-events: auto!important;
    position: relative!important;
}


.welcomemessage {
    position: relative;
    left: 14px;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0);
    max-width: 275px;
    padding-left: 0px;
    padding-top: 5px;
    padding-right: 50px;
    margin-bottom: 20px;
    margin-right: 75px;
    z-index: 1;
    opacity: 0.9;
    float: left;
/*    pointer-events: none;*/
}

#appsWelcomeMessage {
    position: relative;
    left: 14px;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0);
    max-width: 50%;
    padding-left: 0px;
    padding-top: 5px;
    padding-right: 1em;
    margin-bottom: 20px;
    z-index: 1;
    opacity: 0.9;
    float: left;
    display: inline;
}

.topintro {
    padding-top: 5px;
    font-size: 16px;
}

#welcomemessage {
    position: relative;
    left: 14px;
    bottom: 0;
    height: 100%;
    background-color: rgba(255, 255, 255, 0);
    max-width: 275px;
    padding-left: 50px;
    padding-top: 5px;
    padding-right: 10px;
    margin-bottom: 20px;
    z-index: 1;
    opacity: 0.9;
/*    pointer-events: none;*/
}


.appsHeader {
    position: relative;
    left: 14px;
    background-color: rgba(255, 255, 255, 0);
    margin-top: 20px;
    padding-left: 0px;
    padding-top: 20px;
    padding-right: 50px;
    margin-bottom: 20px;
    z-index: 1;
    opacity: 0.9;
    display: block;
    clear: both;
    font-size: 20px;
/*    pointer-events: none;*/
}


.welcometitle {
    position: relative;
    left: 14px;
    background-color: rgba(255, 255, 255, 0);
    max-width: 275px;
    padding-left: 0px;
    padding-top: 20px;
    padding-right: 50px;
    margin-bottom: 10px;
    z-index: 1;
    opacity: 0.9;
    display: block;
    clear: both;
    font: 15px 'IstokWeb-Regular',sans-serif;
    
    
/*    pointer-events: none;*/
}

#settingsmain {
    position: relative;
    left: 14px;
    bottom: 0;
    height: 100%;
    background-color: rgba(255, 255, 255, 0);
    max-width: 400px;
    padding-left: 50px;
    padding-top: 5px;
    padding-right: 10px;
    margin-bottom: 20px;
    z-index: 1;
    opacity: 0.9;
/*    pointer-events: none;*/
}

#importmain {
    position: relative;
    left: 14px;
    bottom: 0;
    height: 100%;
    background-color: rgba(255, 255, 255, 0);
    max-width: 400px;
    padding-left: 50px;
    padding-top: 5px;
    padding-right: 10px;
    margin-bottom: 20px;
    z-index: 1;
    
/*    pointer-events: none;*/
}

#appsContent {
    position: relative;
    top: 0;
    bottom: 0;
    height: 100%;
    background: var(--graph-background);
    /* max-width: 700px; */
    padding-left: 50px;
    z-index: 1;
/*    pointer-events: none;*/
}

.appbox {
    position: relative;
    display:flex;
    /* align-items:center; */
    background-color: rgba(255, 255, 255, 0.6);
    width: 110px;
    height: 110px;
    border-radius: 8px;
    padding-top: 10px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    margin-right: 20px;
    margin-bottom: 20px;
    float: left;
    text-align:left;
    text-decoration: none!important;
    color: #555555;!important
}
.appbox:hover {
    background-color: rgba(255, 255, 255, 0.3);

}
.appbox_image {
  display:block;
  margin-top: 0;
  top: 0;
  margin-left: auto;
  margin-right: auto;
  width: 48px;

  text-align: left!important;
  float:none!important;
  clear:both!important;
}
.appbox_text {
  position:absolute;
  width: 110px;
  bottom: 0;
  left: 15px;
  padding-bottom: 10px;
  padding-right: 20px;
  font-size: 13px;
  line-height: 16px;
  text-align: left!important;
  float:none!important;
  clear:both!important;

}


.appbox:hover {

      color: #00B7FF;

}

.teaser {
  position: relative;
  padding-left: 14px;
  width: 275px;
  float: left;
}

.appTeaser {
    position: relative;
    width: 450px;
    float: left;
    padding-right: 40px;
  }

.appsExplainer {
    font: 15px 'IstokWeb-Regular',sans-serif;
    line-height: 17px!important;
}

.appsContainer {
    padding-left: 16px;
    margin-top: 40px;
}
.teaser_full {
    position: relative;
    padding-left: 14px;
    width: 275px;
   float: left;
}

.info_field {
    padding-top: 30px;
    clear: both;
}

.legend {
    display: block;
    width: 100%;
    font-size: 125%;
    color: #262626;
}
.indentup {
    padding-top: 10px;
}
.bluebackground {
    
    
        background-color:  rgb(168, 230, 255);
    
}
.twitter_news {
    position: relative;
    margin-right: 80px;
    float: right;
    padding-left: 40px;
    max-width: 240px;
    font-size: 90%;
}

.bigbutton {
  position: relative;
  display:flex;
  align-items:center;
  background-color: rgba(215, 215, 215, 0.6);
  width: 240px;
  height: 25px;
  border-radius: 8px;
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 15px;
  padding-right: 15px;
  margin-top: 15px;
  margin-right: 25px;
  margin-bottom: 25px;
  float: left;
  text-decoration: none!important;
  color: #555555!important;
}

.twitterTop {
    position: relative;
    display: inline-block;
 
    height: 25px;

    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 10px;
    margin-right: 50px;
    margin-bottom: 10px;
    text-align: right;
    text-decoration: none!important;
    color: #555555!important;
}
.bigbuttontop {
    position: relative;
    display: inline-block;
    background-color: rgba(255, 255, 255, 0.4);
    height: 25px;
    border-radius: 8px;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 10px;
    margin-right: 25px;
    margin-bottom: 10px;
    text-align: right;
    text-decoration: none!important;
    color: #555555!important;
  }

  .bigbuttontop:hover {
    position: relative;
    display: inline-block;
    background-color: rgba(255, 255, 255, 1)!important;
  }

  .subscriptionButton {
    position: relative;
    display: inline-block;
    background-color: rgba(250, 250, 250, 1)!important;
    color: #00B7FF!important;
  }

  .subscriptionButton:hover {
    
    background-color: rgba(255, 255, 255, 1)!important;
    
  }



  .introtop {
      position: relative;
      float: none;
      display: inline-block;
      
      
  }

  #appsHelperItems {
    text-align: right;
    margin-right: 20px;
    float: right;
    max-width: 40%;
    min-width: 280px;
  }

  .appslist {
      position: relative;
      clear: both;
      z-index: 10;
      display: block;
      min-width: 350px!important;
  }


.bigbutton:hover {

    color: #00B7FF;

}

.bigbuttontop:hover {

    color: #00B7FF!important;

}

input#googlesubmit {
    margin-top: 3px;!important
}



.indent-vertical {
    margin-top: 15px!important;
}
button.button-adjust {
    vertical-align: middle!important;
    line-height: 15px!important;
    margin-left: 15px!important;
}


.hidden {display:none}


@media (max-width: 800px) {
  
    #filterGraphViewPanel {
        clear: both!important;
        margin-top: 10px;
        bottom: 150px;
        position: fixed;
        left: 15px;
        
    }
    #filterGraphViewContainer {
        
        margin-right: 0px!important;
        display: inline;
        padding: 0px 0px 0px 0px;
    }

    #filterGraphView {
        margin-right: 10px;
        margin-left: 0px;
    }

    

    #entries {

        max-width: 340px;
    }
    #filterCaption {
        display: none;
    }
  
    .helper_selector {
        margin-left: 0px!important;
    }

    #helperbutton {
        right: 15px;
        bottom: 100px;
    }

    .helperbutton-caption:after {
        font-size: 14px;
       right: 65px;
        text-align: right;
        position: absolute;
        color: #00B7FF;
        width: 100px;
        bottom: 12px;
        content: '⌘ ai';
    }
}

@media (max-width: 460px) {
    #helperpanel {
        position:absolute;
        top: 100px;
        bottom: unset;
        left: 20px;        
        margin-left: 20px;
        width: 80%!important;
        max-height: 65%;
        z-index: 100!important;
    }
    .helperidea {
        top: 50px;
        padding: 10px 20px 10px 20px;
        left: 50px;
        position: fixed;
        text-align: left;
        display: block;
        background-color: var(--warning-background);
        width: 70%;
        max-height: 30%;
        animation-name: resMesAnimation;
        animation-duration: 7000ms;
        animation-fill-mode: forwards;
        z-index: 110000;
        opacity: 0.8;
        border-radius: 6px;
    }

    .helper_service_text {
        display: none;
    }


    #helper_search_query {
        width: 90%;
    }
    .helper_intro_button {
        height: unset;
    }
    .helper_intro_footprint {
        display: none!important;
    }


    #graphInfoData {
     
        left: 45px;
        width: 80%;
     
        
    }

    #analytics {
        
        width: 90%
        
    }

    #variabilityPanel {
        right: 70px;
        width: 280px;
        max-height: 400px;
    }
    

    #biasindex {
        right: 50px;
        display: none;
    }

    .pure-menu-selected-main {
        
        width: 220px!important;
        
        
    }

    #livetext {
        top: auto;
        bottom: 40px;
    }
}


@media   (max-width: 900px) { /* and*/
    
    #pinnednodeslist,#stopnodeslist {
        margin-bottom: 10px!important;
        clear: both;
        max-height: 28px;
        max-width: 70%!important;
        margin-top: 8px;
    }

    #graphTags {
        margin-top: 63px;
    }
    #statement-firstentry-notes {
        height: 200px!important;
    }


    #removestopwords {
        clear: both;
    }


 

.appTeaser {
    position: relative;
    max-width: 240px;
    float: left;
    padding-right: 40px;
  }
  .appsHeader {
    margin-top: 0px;
  }

#appsContent {
    max-width: 300px;
}

.hideOnMobile {
    display: none;
}

        .community_cluster,
        .expandCommunity,
        #expandRelated,
        #expandinfluential {
            position:inherit;
        }

    #pinnednodeslist:after, #stopnodeslist:after {
        display: none;
        position: relative;
        content: '';
    }
    
  
    .helperidea {
        top: 50px;
        padding: 10px 20px 10px 20px;
        left: 50px;
        position: fixed;
        text-align: left;
        display: block;
        background-color: var(--warning-background);
        /* width: 70%; */
        max-height: 30%;
        animation-name: resMesAnimation;
        animation-duration: 7000ms;
        animation-fill-mode: forwards;
        z-index: 110000;
        opacity: 0.8;
        border-radius: 6px;
    }

    .helper_service_text {
        display: none;
    }


    #helper_search_query {
        width: 90%;
    }
    .helper_intro_button {
        height: unset;
    }
    .helper_intro_footprint {
        display: none!important;
    }





    #variabilityPanel {
        right: 70px;
        width: 280px;
        max-height: 400px;
    }
    

    #biasindex {
        right: 50px;
        display: none;
    }

    .appbox {
        padding-left: 15px;
        padding-right: 15px;
        margin-right: 15px;
        margin-bottom: 15px;
        float: left;
        text-align:left;
        text-decoration: none!important;
        color: #555555!important;
    }

    .welcometitle {
       top: 20px!important;
       margin-bottom: 30px;
    }




    #analyticsbutton:after {
        display:none;
    }

    #analyticscaption {
        display: none!important;
    }


    #firstentryform {
        width: 320px;
        height: 100px; 
        margin: 0 auto;  
        padding: 0;
        font-size: 12px;  
        position: relative; 
        left: 50%; 
        margin-left: -160px; 
        top: 40%; 
        margin-top: -50px;
        font: 18px 'IstokWeb-Bold',sans-serif;
    }

    #seo_submit_button, #niche_submit_button, #google_submit_button {
        margin-top: 20px;
        clear: both;
    }


    .helper_return {
        position: relative;
        float: left;
        cursor: pointer;
        border: 1px solid #ccc;
        border-radius: 5px;
        padding: 5px 6px 2px 6px;
        height: 18px;
        font-size: 11px;
        margin-right: 15px;
    }
    
    .helper_play {
        position: relative;
        float: left;
        cursor: pointer;
        margin-right: 15px;
        border: 1px solid #aaa;
        border-radius: 5px;
        padding: 5px 6px 2px 6px;
        height: 18px;
        font-size: 11px;
    }
    
    .helper_search {
        position: relative;
        float: left;
        cursor: pointer;
        margin-right: 15px;
        border: 1px solid #aaa;
        border-radius: 5px;
        padding: 5px 6px 2px 6px;
        height: 18px;
        font-size: 11px;
        line-height: 19px;
    }
    



}


body {
    background-color: #ffffff;
    height:100%; padding:0; margin:0;
}

.highlight { background-color: yellow }

/* from PURE buttons-core.css */
.pure-button {
    /* Structure */
    display: inline-block;
    font: 16px 'IstokWeb-Bold',sans-serif;
    *display: inline; /*IE 6/7*/
    zoom: 1;
    line-height: normal;
    white-space: nowrap;
    vertical-align: baseline;
    text-align: center;
    cursor: pointer;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


/* Firefox: Get rid of the inner focus border */
.pure-button::-moz-focus-inner{
    padding: 0;
    border: 0;
}
/* end from PURE buttons-core.css */
/* from PURE buttons.css */
/*csslint unqualified-attributes:false*/

.pure-button {
    font-size: 100%;
    font: 17px 'IstokWeb-Regular',sans-serif;

    *font-size: 90%; /*IE 6/7 - To reduce IE's oversized button text*/
    *overflow: visible; /*IE 6/7 - Because of IE's overly large left/right padding on buttons */
    padding: 0.36em 1.5em 0.36em;
    color: #373434; /* rgba not supported (IE 8) */
    /* color: rgba(0, 0, 0, 0.80); rgba supported */
    /* *color: #444; IE 6 & 7 */
    border: 1px solid #d7d5d5; /*IE 6/7/8*/
    border: none rgba(0, 0, 0, 0); /*IE9 + everything else*/
    background-color: #e6e5e5;
    text-decoration: none;
    border-radius: 3px;
    -webkit-font-smoothing: antialiased;
    /* Transitions */
    -webkit-transition: 0.1s linear -webkit-box-shadow;
    -moz-transition: 0.1s linear -moz-box-shadow;
    -ms-transition: 0.1s linear box-shadow;
    -o-transition: 0.1s linear box-shadow;
    transition: 0.1s linear box-shadow;
}

.pure-button-hover,
.pure-button:hover {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#00000000', GradientType=0);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0,0,0, 0.05)), to(rgba(0,0,0, 0.05)));
    background-image: -webkit-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.15));
    background-image: -moz-linear-gradient(top, rgba(0,0,0, 0.05) 0%, rgba(0,0,0, 0.05));
    background-image: -ms-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.15));
    background-image: -o-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.05));
    background-image: linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.05));
}

.pure-button:focus {
    outline: 0;
}
.pure-button-active,
.pure-button:active {
    box-shadow: 0 0 0 1px rgba(0,0,0, 0.15) inset, 0 0 6px rgba(0,0,0, 0.20) inset;
}

.pure-button[disabled],
.pure-button-disabled,
.pure-button-disabled:hover,
.pure-button-disabled:active {
    border: none;
    background-image: none;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    filter: alpha(opacity=40);
    -khtml-opacity: 0.40;
    -moz-opacity: 0.40;
    opacity: 0.40;
    cursor: not-allowed;
    box-shadow: none;
}

.pure-button-hidden {
    display: none;
}

/* Firefox: Get rid of the inner focus border */
.pure-button::-moz-focus-inner{
    padding: 0;
    border: 0;
}

.pure-button-primary,
.pure-button-selected,
a.pure-button-primary,
a.pure-button-selected {
    background-color: C8C6C6;
    color: #030202;
}

/*! Copyright 2013 Yahoo! Inc. http://yuilibrary.com/license/ */
/* This page lists core form styles adopted from Normalize.css. */
/*! Copyright (c) Nicolas Gallagher and Jonathan Neal */

/*! normalize.css v1.1.0 | MIT License | git.io/normalize */

/* This page has Normalize.css form-specific style rules applied to a .yui3-form context */

/* ==========
Forms Core
=========*/


/*
 * Corrects margin displayed oddly in IE 6/7.
 */

.pure-form {
    margin: 0;
}

/* Define consistent border, margin, and padding.*/


.pure-form fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/*
 * 1. Corrects color not being inherited in IE 6/7/8/9.
 * 2. Corrects text not wrapping in Firefox 3.
 * 3. Corrects alignment displayed oddly in IE 6/7.
 */

.pure-form legend {
    border: 0; /* 1 */
    padding: 0;
    white-space: normal; /* 2 */
    *margin-left: -7px; /* 3 */
}

.topcaption {
    display: block;
    width: 100%;
    margin-top: 10px!important;
    padding: 0.3em 0;
    margin-bottom: 0.3em;
    font-size: 125%;
    color: #262626;
    border-bottom: 1px solid #ededed;
}

/*
 * 1. Corrects font size not being inherited in all browsers.
 * 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5,
 *    and Chrome.
 * 3. Improves appearance and consistency in all browsers.
 */

.pure-form button,
.pure-form input,
.pure-form select,
.pure-form textarea {
    font-size: 100%; /* 1 */
    margin: 0; /* 2 */
    vertical-align: baseline; /* 3 */
    *vertical-align: middle; /* 3 */
    border: 1px solid #ccc; /* Green */
}

/*
 * Addresses Firefox 3+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

.pure-form button,
.pure-form input {
    line-height: normal;
}

/*
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Corrects inability to style clickable `input` types in iOS.
 * 3. Improves usability and consistency of cursor style between image-type
 *    `input` and others.
 * 4. Removes inner spacing in IE 7 without affecting normal text inputs.
 *    Known issue: inner spacing remains in IE 6.
 */

.pure-form button,
.pure-form input[type="button"], /* 1 */
.pure-form input[type="reset"],
.pure-form input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
    *overflow: visible;  /* 4 */
}

/*
 * Re-set default cursor for disabled elements.
 */

.pure-form button[disabled],
.pure-form input[disabled] {
    cursor: default;
}

/*
 * 1. Addresses box sizing set to content-box in IE 8/9.
 * 2. Removes excess padding in IE 8/9.
 * 3. Removes excess padding in IE 7.
 *    Known issue: excess padding remains in IE 6.
 */

.pure-form input[type="checkbox"],
.pure-form input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
    *height: 13px; /* 3 */
    *width: 13px; /* 3 */
}

/*
 * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

.pure-form input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;
}

/*
 * Removes inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

.pure-form input[type="search"]::-webkit-search-cancel-button,
.pure-form input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/*
 * Removes inner padding and border in Firefox 3+.
 */

.pure-form button::-moz-focus-inner,
.pure-form input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*
 * 1. Removes default vertical scrollbar in IE 6/7/8/9.
 * 2. Improves readability and alignment in all browsers.
 */

.pure-form textarea {
    overflow: auto; /* 1 */
    vertical-align: top; /* 2 */
}


/* ===============  forms.css =================================*/
.pure-form input[type="text"],
.pure-form input[type="password"],
.pure-form input[type="email"],
.pure-form input[type="url"],
.pure-form input[type="date"],
.pure-form input[type="month"],
.pure-form input[type="time"],
.pure-form input[type="datetime"],
.pure-form input[type="datetime-local"],
.pure-form input[type="week"],
.pure-form input[type="number"],
.pure-form input[type="search"],
.pure-form input[type="tel"],
.pure-form input[type="color"],
.pure-form select {
    padding: 0.36em 0.6em;
    display: inline-block;
    border: 1px solid #e6e6e6;
    box-shadow: inset 0 1px 3px #e6e6e6;
    border-radius: 6px;
    -webkit-transition: 0.3s linear border;
    -moz-transition: 0.3s linear border;
    -ms-transition: 0.3s linear border;
    -o-transition: 0.3s linear border;
    transition: 0.3s linear border;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
}

.pure-form input[type="text"]:focus,
.pure-form input[type="password"]:focus,
.pure-form input[type="email"]:focus,
.pure-form input[type="url"]:focus,
.pure-form input[type="date"]:focus,
.pure-form input[type="month"]:focus,
.pure-form input[type="time"]:focus,
.pure-form input[type="datetime"]:focus,
.pure-form input[type="datetime-local"]:focus,
.pure-form input[type="week"]:focus,
.pure-form input[type="number"]:focus,
.pure-form input[type="search"]:focus,
.pure-form input[type="tel"]:focus,
.pure-form input[type="color"]:focus,
.pure-form select:focus {
    outline: 0;
    outline: thin dotted \9; /* IE6-9 */
    border-color: #129FEA;
}

.pure-form input[type="file"]:focus,
.pure-form input[type="radio"]:focus,
.pure-form input[type="checkbox"]:focus {
    outline: thin dotted #333;
    outline: 1px auto #129FEA;
}
.pure-form .pure-checkbox,
.pure-form .pure-radio {
    margin: 0.5em 0;
    display: block;
}
.pure-form input[type="text"][disabled],
.pure-form input[type="password"][disabled],
.pure-form input[type="email"][disabled],
.pure-form input[type="url"][disabled],
.pure-form input[type="date"][disabled],
.pure-form input[type="month"][disabled],
.pure-form input[type="time"][disabled],
.pure-form input[type="datetime"][disabled],
.pure-form input[type="datetime-local"][disabled],
.pure-form input[type="week"][disabled],
.pure-form input[type="number"][disabled],
.pure-form input[type="search"][disabled],
.pure-form input[type="tel"][disabled],
.pure-form input[type="color"][disabled],
.pure-form select[disabled],
.pure-form textarea[disabled] {
    cursor: not-allowed;
    box-shadow: inset 0 1px 10px #ededed;
    background-color: #ededed;
    color: #adadad;
    border-color: #e6e6e6;
}
.pure-form input[readonly],
.pure-form select[readonly],
.pure-form textarea[readonly],
.pure-form input[readonly]:focus,
.pure-form select[readonly]:focus,
.pure-form textarea[readonly]:focus {
    background: #eee; /* menu hover bg color */
    color: #777; /* menu text color */
    border-color: #ccc;
}
.pure-form input:focus:invalid,
.pure-form textarea:focus:invalid,
.pure-form select:focus:invalid {
    color: #b94a48;
    border: 1px solid #ee5f5b;
}
.pure-form input:focus:invalid:focus,
.pure-form textarea:focus:invalid:focus,
.pure-form select:focus:invalid:focus {
    border-color: #e9322d;
}
.pure-form input[type="file"]:focus:invalid:focus,
.pure-form input[type="radio"]:focus:invalid:focus,
.pure-form input[type="checkbox"]:focus:invalid:focus {
    outline-color: #e9322d;
}
.pure-form select {
    border: 1px solid #e6e6e6;
    background-color: white;
}
.pure-form select[multiple] {
    height: auto;
}
.pure-form label {
    margin: 0.5em 0 0.2em;
    color: #4f4f4f;
    font-size:90%;
}
.pure-form fieldset {
    margin: 0;
    padding: 0.35em 0 0.75em;
    border: 0;
}
.pure-form legend {
    display: block;
    width: 100%;
    padding: 0.3em 0;
    margin-bottom: 0.3em;
    font-size: 125%;
    color: #262626;
    border-bottom: 1px solid #ededed;
}

.pure-form-stacked input[type="text"],
.pure-form-stacked input[type="password"],
.pure-form-stacked input[type="email"],
.pure-form-stacked input[type="url"],
.pure-form-stacked input[type="date"],
.pure-form-stacked input[type="month"],
.pure-form-stacked input[type="time"],
.pure-form-stacked input[type="datetime"],
.pure-form-stacked input[type="datetime-local"],
.pure-form-stacked input[type="week"],
.pure-form-stacked input[type="number"],
.pure-form-stacked input[type="search"],
.pure-form-stacked input[type="tel"],
.pure-form-stacked input[type="color"],
.pure-form-stacked select,
.pure-form-stacked label,
.pure-form-stacked textarea {
    display: block;
    margin: 0.25em 0;
}

.pure-form-aligned input,
.pure-form-aligned textarea,
.pure-form-aligned select,
    /* note: pure-help-inline is deprecated. Use .pure-form-message-inline instead */
.pure-form-aligned .pure-help-inline,
.pure-form-message-inline {
    display: inline-block;
    *display: inline; /* IE7 inline-block hack */
    *zoom: 1;
    vertical-align: middle;
}

/* aligned Forms */
.pure-form-aligned .pure-control-group {
    margin-bottom: 0.5em;
}
.pure-form-aligned .pure-control-group label {
    text-align: right;
    display: inline-block;
    vertical-align: middle;
    width: 10em;
    margin: 0 1em 0 0;
}
.pure-form-aligned .pure-controls {
    margin: 1.5em 0 0 10em;
}

/* Rounded Inputs */
.pure-form input.pure-input-rounded,
.pure-form .pure-input-rounded {
    border-radius: 45px;
    padding: 0.5em 1em;
}

/* Rounded textareas */
.pure-form .pure-textarea-rounded {
    border-radius: 15px;
    padding: 0.5em 1em;
}
#statement-firstentry-notes {
    height: 280px!important;
}

/* Grouped Inputs */
.pure-form .pure-group fieldset {
    margin-bottom: 10px;
}
.pure-form .pure-group input {
    display: block;
    padding: 0.36em 0.6em;
    margin: 0;
    border-radius: 0;
    position: relative;
    top: -1px;
}
.pure-form .pure-group input:focus {
}
.pure-form .pure-group input:first-child {
    top: 1px;
    border-radius: 6px 6px 0px 0px;
}
.pure-form .pure-group input:last-child {
    top: -2px;
    border-radius: 0px 0px 6px 6px;
}
.pure-form .pure-group button {
    margin: 0.35em 0;
}

.pure-form .pure-input-1 {
    width: 100%;
}
.pure-form .pure-input-2-3 {
    width: 66%;
}
.pure-form .pure-input-1-2 {
    width: 50%;
}
.pure-form .pure-input-1-3 {
    width: 33%;
}
.pure-form .pure-input-1-4 {
    width: 25%;
}

/* Inline help for forms */
/* Note: pure-help-inline is deprecated. Use .pure-form-message-inline instead */
.pure-form .pure-help-inline,
.pure-form-message-inline {
    display: inline-block;
    padding-left: 0.3em;
    color: #adadad;
    vertical-align: middle;
    font-size: 90%;
}

/* Block help for forms */
.pure-form-message {
    display: block;
    color: #adadad;
    font-size: 90%;
}
/* note no template for forms-r.css. no skinnable properties */

/* from PURE menu-core.css */
/*csslint adjoining-classes:false, outline-none:false*/
/*TODO: Remove this lint rule override after a refactor of this code.*/

.pure-menu ul {
    position: absolute;
    visibility: hidden;
}

.pure-menu.pure-menu-open {
    visibility: visible;
    width: 100%;
    cursor: pointer!important;

}
.greish {
  color: #999!important;

}


.pure-menu ul {
    left: -10000px;
    list-style: none;
    margin: 0;
    padding: 0;
    top: -10000px;
}

.pure-menu > ul { position: relative; }

.pure-menu-open > ul {
    left: 0;
    top: 0;
    visibility: visible;
}

.pure-menu-open > ul:focus {
    outline: 0;
}

.pure-menu li {
    position: relative;
}

.pure-menu a, .pure-menu .pure-menu-heading {
    display: block;
    color: inherit;
    line-height: 1.5em;
    padding: 0.25em 1.4em;
    text-decoration: none;
    white-space: nowrap;
}

.pure-menu.pure-menu-horizontal > .pure-menu-heading {
    display: inline-block;
    *display: inline;
    zoom: 1;
    margin: 0;
    vertical-align: middle;
}
.pure-menu.pure-menu-horizontal > ul {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: middle;
    /* height: 2.4em; removed for Skin Builder */
}

.pure-menu-item {
    position: relative;
}

.pure-menu-item-portal {
    position: relative;
    border: 1px solid #e0e0e0;
    border-radius: 15px;
    margin-bottom: 4px;
    
    background-color: #e8e8eb;
}
.pure-menu-item-portal:hover {
    background-color: #ffffff!important;
}

.pure-menu-item:not(.pure-menu-has-children) {
    clear: both;
    float: left;
    padding: 0;
    margin: 0;
    height: 100%;
}
.pure-menu-has-children {
    padding: 0;
    margin: -2px;
}
.float-left {
    position: relative;
    clear: both;
    float: left;
}
.float-right {
    float: right;
}


.pure-menu li a { padding: 0.25em 0.9em; }

.pure-menu-can-have-children > .pure-menu-label:after {
    content: '\25B8';
    float: right;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'DejaVu Sans', sans-serif; /* These specific fonts have the Unicode char we need. */
    margin-right: -20px;
    margin-top: -1px;
}

.pure-menu-can-have-children > .pure-menu-label {
    padding-right: 30px;
}

.pure-menu-separator {
    background-color: #ededed;
    display: block;
    height: 1px;
    font-size: 0;
    margin: 7px 2px;
    overflow: hidden;
}

.pure-menu-hidden {
    display: none;
}

/* FIXED MENU */
.pure-menu-fixed {
    position: fixed;
    top:0;
    left:0;
    width: 100%;
}


/* HORIZONTAL MENU CODE */

/* Initial menus should be inline-block so that they are horizontal */
.pure-menu-horizontal li {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: middle;
}

/* Submenus should still be display:block; */
.pure-menu-horizontal li li {
    display: block;
}

/* Vertical Menus - show the dropdown arrow */
.pure-menu-has-children > .pure-menu-link:after {
    padding-left: 0.5em;
    content: "\25B8";
    font-size: small;
}

#filterByTags {
    padding-left: 15px;
    margin-top: 10px;
    cursor: default!important;
}


.pure-menu-movedown {
    margin-top: 35px!important;
    padding-top: 5px!important;
}

.pure-menu-item .pure-menu-item {
    display: block;
}

.pure-menu-has-children {
    padding-top: 2px;
}

.pure-menu-children {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    margin: 0;
    padding: 0;
    z-index: 10;
    background: var(--childrenmenu-background);
}

.pure-menu-horizontal .pure-menu-children {
    left: 0;
    top: auto;
    width: inherit;
}

.pure-menu-allow-hover:hover > .pure-menu-children,
.pure-menu-active > .pure-menu-children {
    display: block;
    position: absolute;
    visibility: visible;
    /* border: none!important; */
    /* border-radius: 4px; */
}

.smaller_text {
    font-size: 14px!important;
    
}

.smallest_text {
    font-size: 12px!important;
    
}

/* Horizontal Menus - show the dropdown arrow */
.pure-menu-horizontal .pure-menu-has-children > .pure-menu-link:before {
    content: "\25BE\0020";
}
/*Add extra padding to elements that have the arrow so that the hover looks nice */
.pure-menu-horizontal > .pure-menu-children > .pure-menu-can-have-children > .pure-menu-label {
    padding-right: 30px;
}

/* Adjusting separator for vertical menus */
.pure-menu-horizontal li.pure-menu-separator {
    height: 50%;
    width: 1px;
    margin: 0 7px;
}

/* Submenus should be horizontal separator again */
.pure-menu-horizontal li li.pure-menu-separator {
    height: 1px;
    width: auto;
    margin: 7px 2px;
}


/* end from yuicss/menu-core.css *******************************************/
/* from yuicss menu-paginator.css */
/*csslint box-model:false*/
/*TODO: Remove this lint rule override after a refactor of this code.*/

.pure-paginator {

    /* `pure-g` Grid styles */
    letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
    *letter-spacing: normal; /* reset IE < 8 */
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */

    /* `pure-paginator` Specific styles */
    list-style: none;
    margin: 0;
    padding: 0;
}
.opera-only :-o-prefocus,
.pure-paginator {
    word-spacing: -0.43em;
}

/* `pure-u` Grid styles */
.pure-paginator li {
    display: inline-block;
    *display: inline; /* IE < 8: fake inline-block */
    zoom: 1;
    letter-spacing: normal;
    word-spacing: normal;
    vertical-align: top;
    text-rendering: auto;
}
.pure-paginator .pure-button {
    border-radius: 0;
    padding: 0.8em 1.4em;
    vertical-align: top;
    height: 1.1em;
}
.pure-paginator .pure-button:focus,
.pure-paginator .pure-button:active {
    outline-style: none;
}
.pure-paginator .prev,
.pure-paginator .next {
    /*color: #C0C1C3; allow .pure-button to color text*/
}
.pure-paginator .prev {
    border-radius: 6px 0px 0px 6px;
}
.pure-paginator .next {
    border-radius: 0px 6px 6px 0px;
}
/* end from PURE menu-paginator.css ******************************/
/* from PURE menu.css *******************************************/
/* MAIN MENU STYLING */
/*csslint adjoining-classes:false*/
/*TODO: Remove this lint rule override after a refactor of this code.*/

.pure-menu.pure-menu-open,
.pure-menu.pure-menu-horizontal li .pure-menu-children {
    /* background: #ffffff; /* Old browsers */ 
    /* border: 1px solid #ededed; */
}

/* remove borders for horizontal menus */
.pure-menu.pure-menu-horizontal,
.pure-menu.pure-menu-horizontal .pure-menu-heading {
    border: none;
}


/* LINK STYLES */

.pure-menu a {
    border: 1px solid transparent;
    border-left: none;
    border-right: none;

}

.pure-menu a,
.pure-menu .pure-menu-can-have-children > li:after {
    color: #4f4f4f;
    
}

.pure-menu .pure-menu-can-have-children > li:hover:after {
    color: #2e2e2e;
}

/* Focus style for a dropdown menu-item when the parent has been opened */
.pure-menu .pure-menu-open {
    background: #ffffff;
}

.pure-menu li a:hover,
.pure-menu li a:focus {
    background: var(--selected-menu);
    border-radius: 16px;
    /* border: 1px solid;
    border-color: var(--menu-border-color)!important; */
}

/* DISABLED STATES */
.pure-menu li.pure-menu-disabled a:hover,
.pure-menu li.pure-menu-disabled a:focus {
    background: var(--selected-menu);
    color: #adadad;
    
}

.pure-menu .pure-menu-disabled > a {
    background-image: none;
    border-color: transparent;
    cursor: default;
}

.pure-menu .pure-menu-disabled > a,
.pure-menu .pure-menu-can-have-children.pure-menu-disabled > a:after {
    color: #adadad;
    
}

/* HEADINGS */
.pure-menu .pure-menu-heading {
    color: #262626;
/*
    text-transform: uppercase;
*/
    font-size: 90%;
    margin-top: 0.5em;
    border-bottom: solid 1px #ededed;
    
}


/* SELECTED MENU ITEM */
.pure-menu li.pure-menu-selected a {
    /* background-color: C8C6C6; */
    color: #171616;
}

/* SELECTED MENU ITEM */
.pure-menu li.pure-menu-selected-top a {
    /* background-color: #ededed!important; */
    color: #40b5ff!important;
    /* opacity: 0.!important; */
    cursor: pointer!important;
    background: var(--selected-menu);
    border-radius: 16px;
    /* border: 1px solid; */
    /* border-color: var(--menu-border-color)!important; */

}

.pure-menu-selected-main {
    color: #40b5ff!important;
    cursor: pointer!important;
    border-radius: 16px;
    max-width: 420px!important;
    overflow-x: auto;
    background: linear-gradient(to right, var(--selected-menu) 390px, transparent);
    /* border: 1px solid;
    border-color: var(--menu-border-color)!important; */
}



/* FIXED MENU */
.pure-menu.pure-menu-open.pure-menu-fixed {
    border: none;
    border-bottom: 1px solid #ededed;
}
/* end from PURE menu.css ***********************************/

#showcontextsbutton {
    margin-top: 10px;
    font-family: 'IstokWeb-Regular' !important;
}
