:root {
    --lips-bordeau: #6f2d2f!important;
    --eyes-blue: #2f4960!important;
    --skin-lighter: #8f6c4e!important;
    --skin-dark: #60462f!important;

    /*hiliting*/
    --green: #b6e54d;
    --red: #e54d6a;
    --blue: #4de5c8;
    --purple: #8e67e6; /*original - #7c4de5;*/
    --orange: #dda032;

    --dark_gray: #343233; /*code blocks - not used*/

    --ref_body: #48534e; /* dark green - html body & nav hover */
    --side_nav_main: #91a79d; /* medium green - */
    --side_nav_sub: #6d7d76;   /* light green */

    --border-radius: 8px;
    --base-padding: 8px;
}

body {
    background-color: #dfc7c7;
    background-image:url(../pics/plants_stall.jpg);
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-attachment: fixed;
    margin: 0;
    border: 1px solid #dfc7c7;
    background-position: bottom right;
    background-size: 25%;
}

.content {
    max-width: 1200px;
    position: relative;
    margin: auto;
}

.lookup, #backlinks {
    float: left;
    top: 100px;
    width: 19.99%;
    padding: 8px;
}

.article {
    float: left;
    width: 59.99%;
    padding: 8px 16px;
    color: var(--skin-dark);
    /* font-weight: bold; */
}

.non_topic_title_wrap {
    padding-top: var(--base-padding);
    padding-left: var(--base-padding);
    margin: 0 0 -8px;
}

a {
    text-decoration: none;
}

img {
    max-width: 100%;
    border-radius: var(--border-radius);
}

nav > a, nav .link {
    display: block;
    width: 100%;
    color: var(--skin-lighter);
}

nav > a, nav .link, option {
    padding: var(--base-padding);
}

.link > a {
    color: var(--skin-lighter);
}

h1 {
    color:var(--lips-bordeau);
}

h2 {
    color:#2d2f6f; /*blue - triadic to lips*/
}

h3 {
    color:#2f6f2d; /*green - triadic to lips*/
}

p {
    text-align: justify;
}

a {
    color: var(--red);
}

a:hover {
    color: red;
}

pre {
    border-radius: var(--border-radius);
    overflow-x: auto;
    padding: var(--base-padding);
}

pre *, p > code {
    font-family: monospace, monospace!important;
}

.ok_btn {
    background-color: var(--lips-bordeau);
    border-color: var(--lips-bordeau);
    color: white;
    min-width: 3em;
}

.enabled>* {
    color: green!important;
}

input, select, .ok_btn {
    padding: var(--base-padding);
    border-radius: 5px;
}

#search {
    width: 100%;
}

input, select, textarea {
    background-color:rgba(0,0,0, .1);
    color: var(--skin-dark);
}

input {
    cursor: url(../pics/type.png),auto;
}


/*add page*/
textarea {
    width: 100%;
    height: 600px;
    margin-top: 8px;
    cursor:url(../pics/type.png),auto;
    border-radius: 5px;
    padding: var(--base-padding);
}

#confirmer {
    color: var(--lips-bordeau);
}

select, option, input, p, textarea, pre, button {
    font-size:1em;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 200px;
}


/*********************/
/* code highlighting */
/*********************/

.var, .casting {
    color: var(--red);
}

.g_var,.bracket {
    color: white;
}

.method {
    color: var(--blue);
}

.quotes {
    color: var(--green);
}

.function {
    color: aqua;
}

.comment,.comment * {
    color: gray!important;
}

.number,.type {
    color: var(--orange);
}

.reserved {
    color: var(--purple);
}

.import_line, .import_line>* {
    color: white!important;
}

.code {
    background-color: rgba(43, 42, 40, .9);
    padding:16px;
    width: 100%;
    border-radius: 5px;
    color: white;
    font-weight: normal;
}

@media screen and (max-width: 600px) {

    body {
        background-image:url();
    }

}