/* open-sans-300 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: url('../fonts/opensans/open-sans-v34-latin-300.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-300.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-300italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
src: url('../fonts/opensans/open-sans-v34-latin-300italic.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-300italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-300italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: url('../fonts/opensans/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
src: url('../fonts/opensans/open-sans-v34-latin-italic.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-500 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: normal;
font-weight: 500;
src: url('../fonts/opensans/open-sans-v34-latin-500.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-500.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-500.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-500italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: italic;
font-weight: 500;
src: url('../fonts/opensans/open-sans-v34-latin-500italic.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-500italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-500italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: url('../fonts/opensans/open-sans-v34-latin-600.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-600.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
src: url('../fonts/opensans/open-sans-v34-latin-600italic.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-600italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-600italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: url('../fonts/opensans/open-sans-v34-latin-700.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-700.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
src: url('../fonts/opensans/open-sans-v34-latin-700italic.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-700italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-700italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
src: url('../fonts/opensans/open-sans-v34-latin-800.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-800.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Open Sans';
font-style: italic;
font-weight: 800;
src: url('../fonts/opensans/open-sans-v34-latin-800italic.eot'); /* IE9 Compat Modes */
src: url('../fonts/opensans/open-sans-v34-latin-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/opensans/open-sans-v34-latin-800italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-800italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/opensans/open-sans-v34-latin-800italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/opensans/open-sans-v34-latin-800italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
html, body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans','Helvetica', 'Arial', sans-serif;
    font-size: 16px;
    font-weight: normal;
    line-height: 1.3;
    height: 100%;
}

html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

body {
    margin: 0;
    padding: 20px;
    background-color: #280046;
    color: #fff;
    background: linear-gradient(45deg, #280046, #00508a);
    min-height: 100%;
    position: relative;
    letter-spacing: normal;
}

h1,h2,h3,h4,h5,h6 {
    margin:0px 0px 16px 0px;
    padding: 0;
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: normal;
}

h1 {
    font-size: 32px;
}

h2 {
    font-size: 28px;
}

h3 {
    font-size: 22px;
}

h4,h5,h6 {
    font-size: 16px;
}

a, a:link, a:visited, a:active {
    color: #0095ff;
    text-decoration: none;
}

a:hover {
    color: #0061a6;
    text-decoration: underline;
    text-underline-offset: 2px;
}

label {
    font-size: 14px;
    line-height: 1.8;
}
button,
input,
optgroup,
textarea,
input {
    all: unset;
    border:none;
    background-image:none;
    background-color:transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    box-sizing: border-box;
}

textarea, input[type="text"], input[type="email"], input[type="password"] {
    color: #333;
    background-color: #f4f4f4;
    padding: 6px 12px;
    border-radius: 6px;
    font-weight: normal;
    border:1px solid #666;
    width: 100%;
}
textarea {
    resize: vertical;
}
textarea:focus, input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus {
    background-color: #fff;
}

button, input[type="submit"] {
    color: #fff;
    background-color: #333333;
    padding: 6px 12px;
    border-radius: 6px;
    font-weight: 600;
}

input[type="reset"]:hover, input[type="email"]:hover, input[type="password"]:hover {
    cursor: pointer;
}
button:hover, input[type="submit"]:hover {
    cursor: pointer;
    background-color: #757575;
}

button:focus, textarea:focus, input:focus {
    /* outline: #ff9900 0px auto; */
    outline: none;
}

button:disabled, input[type="submit"]:disabled, input[type="reset"]:disabled, input[type="email"]:disabled, input[type="password"]:disabled {
    background-color: #e6e6e6;
    color: #666;
    border-color: #d4d4d4;
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: all !important;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent;
    background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSdibGFjaycgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0JyB3aWR0aD0nMjQnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zyc+PHBhdGggZD0nTTcgMTBsNSA1IDUtNXonLz48cGF0aCBkPSdNMCAwaDI0djI0SDB6JyBmaWxsPSdub25lJy8+PC9zdmc+);
    background-image: url("data:image/svg+xml;utf8,<svg fill='blue' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
    background-repeat: no-repeat;
    background-position-x: 100%;
    background-position-y: 5px;
    background-color: #f4f4f4;
    font-family: inherit;
    font-size: inherit;
    cursor: pointer;
    line-height: inherit;
    margin: 0;
    width: 100%;
    min-width: 15ch;
    max-width: 30ch;
    outline: none;
    border: 1px solid #666;
    border-radius: 6px;
    padding: 6px 12px;
}
select:focus {
    background-color: #fff;
}

select::-ms-expand {
  display: none;
}

.logincontainer {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 0;
    width: 100%;
    height: 100%;
}
.login {
    background-color: #fff;
    color: #333;
    text-align: center;
}
.padding {
    padding: 20px;
}
.content {
    margin:0px auto;
    padding: 0px;
    max-width: 1440px;
    background-color: #fff;
    color: #333;
}
.shadow {
    box-shadow: 3px 3px 18px 3px #09092e;
}
.borderradius {
    border-radius: 22px;
}
.navigation {
    background-color: #280046;
    background: linear-gradient(45deg, #00101c, #00508a);
    border-radius: 20px 20px 0 0;
    color: #fff;
    padding: 0px 20px 20px 20px;
    margin: 0;
    position: sticky;
    top: 0px;
    z-index: 999;
}
.sticky {
    border-radius: 0 !important;
}
.navigation ul {
    margin: 0;
    padding: 0;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start:0;
    margin-inline-end: 0;
    padding-inline-start: 0;
    list-style-type: none;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    gap: 10px 10px;
}
.navigation ul li {
    background-color: #00508a;
    padding: 0;
    border-radius: 0px 0px 12px 12px;
    font-weight: 700;
}
.navigation ul li:hover {
    background-color: #0092fc;
}
.navigation ul li.active {
    background-color: #ff5e00;
    padding: 0;
    line-height: 2.2;
}
.navigation ul li.active:hover {
    background-color: #ff5e00;
}
.navigation ul li a {
    color: #fff;
    padding: 20px;
    line-height: 2.2;
}
.navigation ul li a:hover {
    color: #fff;
    text-decoration: none;
}
.navigation ul li i {
    margin-right: 0.5em;
}
#messagebox {
    display: block;
    margin:20px 0 0 0;
    font-size: 14px;
    min-height: 30px;
}
#message {
    display: block;
    background-color: #fffff0;
    color: #333;
    border: 2px solid #e6d600;
    padding: 5px;
    border-radius: 6px;
}
.container {
    display: flex;
    flex-direction: row; /* row | row-reverse | column | column-reverse*/
    flex-wrap: nowrap; /* nowrap | wrap | wrap-reverse;*/
    justify-content: flex-start; /* flex-start | flex-end | center | space-between | space-around | space-evenly | start | end | left | right ... + safe | unsafe; */
    align-items: flex-start; /* stretch | flex-start | flex-end | center | baseline | first baseline | last baseline | start | end | self-start | self-end + ... safe | unsafe; */
    gap: 20px 20px; /* row-gap column gap */
}
.col {
    flex-grow: 0;
} 
.leftcol {
    flex-grow: 1;
    order: 0;
}
.rightcol {
    order: 1;
}
.headline {
    font-weight: bold;
    margin: 0 0 1em 0;
}
.formarea {
    padding: 20px;
    border-radius: 20px;
    background-color: #e4f2f7;
    border:3px solid #92c4d4;
    width: 300px;
    display: block;
}
#results {
    padding: 20px;
    border-radius: 20px;
    background-color: #e4f2f7;
    border:3px solid #92c4d4;
    width: 300px;
    display: block;
    margin-top: 25px;
}
.placeholder {
    min-width: 300px;
}
.message {
    margin: 10px 0;
    font-size: 14px;
}
.projects {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
    gap: 10px 10px;

}
.element {
    padding: 5px 40px 5px 5px;
    background-color: #fafafa;
    border:2px solid #dedede;
    width: calc(50% - 10px);
    line-height: 1.3;
    position: relative;
    white-space: normal;
    word-break: break-all;
    border-radius: 6px;
    font-weight: 500;
}
.element i {
    position: absolute;
    top: 8px;
    right: 5px;
    color: #0092fc;
}
.element:hover {
    background-color: #ebf6ff;
    border:2px solid #0069bf;
}
.row {
    display: block;
    margin: 0 0 20px 0;
}
.error,.success,.notice {
    padding: 5px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 12px;
}
.error {
    background-color: #fff0f0;
    color: #8c0000;
    border: 2px solid #8c0000;
}
.success {
    background-color: #f0fff4;
    color: #154221;
    border: 2px solid #154221;
}
.notice {
    background-color: #fffff0;
    color: #333;
    border: 2px solid #e6d600;
}
.showelements:hover {
    cursor: pointer;
}
.delproject {
    margin-top:120px;
}
.delproject input[type="submit"] {
    background-color: #ff5e00;
}
.delproject input[type="submit"]:hover {
    background-color: red;
}
.promptform label {
    display: block;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 12px;
}
.more {
    font-size: 26px;
    text-align: right;
}
.more:hover {
    cursor: pointer;
}
.flexrow {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
    gap: 20px;
    margin-bottom: 20px;
}
.formset {
    width: 100%;
}
.formset label {
    display: block;
}
.forminput {
    position: relative;
    padding-right: 90px;
}
.counter {
    position: absolute;
    top: 30px;
    right: 5px;
}
form#playground input[type="text"], form#playground select {
    min-width: 100%;
    max-width: 100%;
    width: 100%;
}
form#playground textarea {
    height: 200px;
}
i#addc:hover {
    cursor: pointer;
}
table {
    width: 100%;
    margin: 30px 0px;
    border-collapse: collapse;
    border: 0px;
    font-size: 0.8rem;
}
thead, tfoot {
    background-color: #00508a;
    color: #fff;
}
tbody {
    background-color: #f4f4f4;
}
td, th {
    border: 1px solid #999;
    padding: 5px 10px;
}
.addtoautoload {
    background-color: #00508a;
    color: #fff;
    padding: 5px 10px;
    border-radius: 12px;
    margin: 12px 0;
}
.addtoautoload a {
    color: yellow;
    font-weight: bold;
}
.chatrow {
    margin: 0 0 20px 0;
    display: block;
    width: 100%;
} 
.chat_system {
    background-color: #f5f5f5;
    padding: 5px;
    color: #333;
    border-radius: 12px;
    font-size: 11px;
    display: none;
}
.chat_user {
    background-color: #f5f5f5;
    padding: 15px;
    color: #333;
    border-radius: 12px;
    margin-right:30%;
}
.chat_assistant {
    background-color: #545454;
    padding: 15px;
    color: #fff;
    border-radius: 12px;
    margin-left:30%;
}
.chatrowanim {
    display: block;
    margin: 0px 0px 20px 0px;
    width: 100%;
}
.pulsate {
    -webkit-animation: pulsate 3s ease-out;
    -webkit-animation-iteration-count: infinite; 
    opacity: 0.5;
    background-color: #545454;
    color: #fff;
    border-radius: 12px;
    padding: 15px;
    margin-left:30%;
}
.chatrow pre {
    font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
    overflow-x: auto;
    background-color: #000;
    color: #fff;
    border-radius: 12px;
    padding: 15px;
    font-size: 14px;
}
.cleft, .cright {
    width: 50%;
}
#imageresults {
    width: 100%;
    padding:0 20px;
}
.clefta, .crighta {
    width: auto;
}
.clefta {
    flex-grow: 1;
    padding-bottom: 1200px;
}
.crighta {
    max-width: 50%;
    position: sticky;
    top: 120px;
}
.orgcontent {
    margin-bottom:10px;
}
.orgcontentm {
    padding: 10px;
    background-color: #f4f4f4;
    margin-bottom: 10px;
}
textarea.ok, input[type="text"].ok {
    background-color: #e5ffde;
}
textarea.notok, input[type="text"].notok {
    background-color: #ffdfde;
}
button.ok {
    background-color: green;
}
button.notok {
    background-color: red;
}
.showimages {
    margin: 20px 0px;
    background-color: #1c1c1c;
    color: #fff;
    padding: 10px;
    border-radius: 12px;
}
img.onlyshow {
     max-width: 256px;
    max-height: 256px;   
}
img.preview {
    max-width: 256px;
    max-height: 256px;
}
img.preview:hover {
    cursor: pointer;
}
.imgclicked {
    opacity: 0.2;
}
#doexport {
    position: fixed;
    right: 80px;
    top: 20px;
    z-index: 99999;
    font-size: 24px;
}
@-webkit-keyframes pulsate {
    0% { 
        opacity: 0.5;
    }
    50% { 
        opacity: 1.0;
    }
    100% { 
        opacity: 0.5;
    }
}
@media only screen and (min-width: 1025px) {
    .content {
        max-width: 100%;
    }
    .element {
        width: calc(33% - 10px);
    }
}
@media only screen and (max-width: 1024px) {
    body {
        padding: 0;
    }
    .logincontainer {
        align-items: center;
    }
    .login {
        width: 100%;
    }
    .borderradius {
        border-radius: 0;
    }
    .content {
        margin:0;
        max-width: 100%;
    }
    .navigation {
        border-radius: 0;
        position: relative;
        top: auto;
    }
    .navigation ul li a {
        padding: 0;
    }
    .navigation ul li span {
        display: none;
    }
    .navigation ul li i {
        padding: 20px 20px;
        margin: 0;
        display: block;
    }
    .container {
        flex-direction: column;
        justify-content: flex-start; 
        align-items: flex-start;
    }
    .leftcol {
        order: 1;
        width: 100%;
    }
    
    .rightcol {
        order: 0;
        width: 100%;
    }
    .formarea,#results {
        width: 100%;
        margin-top: 0;
    }
    .projects {
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .element {
        width: 100%;
    }
    .cleft, .cright {
        width: 100%;
    }
    .clefta, .crighta {
        width: 100%;
    }
    .crighta {
        position: relative;
        max-width: 100%;
        top: auto;
    }
    .clefta {
        padding: 0;
    }
}
@media only screen and (max-width: 640px) {
    .chat_user {
        margin-right:15%;
    }
    .chat_assistant {
        margin-left:15%;
    }
}