﻿body {
}
/*
@main-color: #9dcddb;
@border-color:#32555f;
@hover-color:#3895b0;



*/


/*#479601;
#c9f89f;*/


.button {
    margin: 10px 5px;
    padding: 5px;
    border: 3px solid #32555f;
    background-color: #9dcddb;
    width: 100%;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

    .button:hover {
        background-color: #3895b0;
    }

textarea {
    width: 100%;
    height: 400px;
    border-radius: 5px;
    border: 3px solid #32555f;
}

input {
    margin: 10px 5px;
    width: 100%;
    border-radius: 5px;
    border: 3px solid #32555f;
}

.controlBlock {
    width: 225px;
}

.captionedDiv {
    border: 1px lightgrey solid;
    width: 100%;
    display: inline-block;
    position: relative;
    margin-top: 12px;
    padding: 10px;
}

    .captionedDiv .settings-title {
        position: absolute;
        top: -12px;
        left: 0;
        padding: 0 10px;
        background: white;
    }

    .captionedDiv .settings-row {
        margin-bottom: 5px;
    }

    .captionedDiv label {
        margin-right: 10px;
    }

    .captionedDiv input {
        border: 1px solid lightgrey;
        padding: 2px;
        width: 100%;
        margin: 0;
        background: #9dcddb;
    }

    .captionedDiv p {
        margin: 0;
    }


    .captionedDiv input[type=range] {
        height: 12px;
        -webkit-appearance: none;
        margin: 0;
        width: 100%;
        border: none;
        background: transparent;
    }

        .captionedDiv input[type=range]:focus {
            outline: none;
        }

        .captionedDiv input[type=range]::-webkit-slider-runnable-track {
            width: 100%;
            height: 12px;
            cursor: pointer;
            animate: 0.2s;
            box-shadow: 1px 1px 1px #004053;
            background: #9dcddb;
            border-radius: 1px;
            border: 1px solid #32555f;
        }

        .captionedDiv input[type=range]::-webkit-slider-thumb {
            box-shadow: 3px 3px 3px #32555f;
            border: 2px solid #9dcddb;
            height: 23px;
            width: 23px;
            border-radius: 23px;
            background: #9dcddb;
            cursor: pointer;
            -webkit-appearance: none;
            margin-top: -7px;
        }

        .captionedDiv input[type=range]:focus::-webkit-slider-runnable-track {
            background: #9dcddb;
        }

        .captionedDiv input[type=range]::-moz-range-track {
            width: 100%;
            height: 12px;
            cursor: pointer;
            animate: 0.2s;
            box-shadow: 1px 1px 1px #004053;
            background: #9dcddb;
            border-radius: 1px;
            border: 1px solid #32555f;
        }

        .captionedDiv input[type=range]::-moz-range-thumb {
            box-shadow: 3px 3px 3px #32555f;
            border: 2px solid #9dcddb;
            height: 23px;
            width: 23px;
            border-radius: 23px;
            background: #9dcddb;
            cursor: pointer;
        }

        .captionedDiv input[type=range]::-ms-track {
            width: 100%;
            height: 12px;
            cursor: pointer;
            animate: 0.2s;
            background: transparent;
            border-color: transparent;
            color: transparent;
        }

        .captionedDiv input[type=range]::-ms-fill-lower {
            background: #9dcddb;
            border: 1px solid #32555f;
            border-radius: 2px;
            box-shadow: 1px 1px 1px #004053;
        }

        .captionedDiv input[type=range]::-ms-fill-upper {
            background: #9dcddb;
            border: 1px solid #32555f;
            border-radius: 2px;
            box-shadow: 1px 1px 1px #004053;
        }

        .captionedDiv input[type=range]::-ms-thumb {
            margin-top: 1px;
            box-shadow: 3px 3px 3px #32555f;
            border: 2px solid #9dcddb;
            height: 23px;
            width: 23px;
            border-radius: 23px;
            background: #9dcddb;
            cursor: pointer;
        }

        .captionedDiv input[type=range]:focus::-ms-fill-lower {
            background: #9dcddb;
        }

        .captionedDiv input[type=range]:focus::-ms-fill-upper {
            background: #9dcddb;
        }


hr {
    margin: 5px 0px;
}

p {
    margin: 0px;
    line-height: normal;
}

.pointer {
    cursor: pointer;
}

.help {
}
.archint_mainblock {
}

.border_block {
    border: 1px solid #767676;
    border-radius: 5px;
    padding: 10px;
    /*margin: 10px;*/
}

.analysis_block {
}

.caption_block {
    display: inline;
}

    .caption_block img {
        float: right;
        width: 100px;
        margin-top: 5px;
    }

.caption_analysis {
    font-size: 12px;
    font-weight: 600;
    line-height: 10px;
    margin-top: 5px;
}

.analysis_block_caption_wrapper {
    display: flex;
}

.powered_analysis {
    font-size: 9px;
    line-height: 0px;
}

.results_analysis_block {
}
.results_analysis_block p{
    line-height: 3;
}

.analysis_button {
    margin: 10px 0px;
    padding: 5px;
    /*border: 3px solid #32555f;*/
    /*background-color: DodgerBlue;*/
    background-color: #0696D7;
    font-size: 12px;
    font-weight: 600;
    color: white;
    width: 100%;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
}

.history_analysis_block {
}

.history-list p {
    margin-left: 5px;
    font-size: 13px;
}

.history-list p:hover {
    text-decoration: underline;
}

.history_button {
    font-weight: 600;
    color: #0063af;
    cursor: pointer;
    font-size: 12px;
}

.history_button:hover {
    -webkit-text-decoration: underline;
    text-decoration: underline;
}

.entire_model_button {
    float: inline-end;
    background-color: rgba(128, 128, 128, 0.25);
    border-color: transparent;
    border-radius: 4px;
    padding: 4px 6px;
    /*cursor: pointer;*/
    cursor: no-drop;
    font-size: 10px;
    color: darkgray;
}



.loader {
    min-width: 20px;
}

.circle-loader {
    width: 20px;
    min-width: 20px;
    height: 20px;
    min-height: 20px;
    display: inline-block;
    float: inline-end;
    align-items: center;
    justify-content: center;
    margin: auto;
    border-radius: 50%;

    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: circle-loader-spin 1s infinite linear;
    animation: circle-loader-spin 1s infinite linear;
}

.circle-loader-color-white {
    border-top: 3px solid rgba(255, 255, 255, 0);
    border-right: 3px solid rgb(255, 255, 255);
    border-bottom: 3px solid rgb(255, 255, 255);
    border-left: 3px solid rgb(255, 255, 255);
}
.circle-loader-color-blue {
    border-top: 3px solid rgba(255, 255, 255, 0);
    border-right: 3px solid #0696D7;
    border-bottom: 3px solid #0696D7;
    border-left: 3px solid #0696D7;
}

    @keyframes circle-loader-spin {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }

        100% {
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }

    .context_button {
    width: 100%;
    margin: 10px auto;
    padding: 3px;
    border: 1px solid #dadada;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
}

.ai-tooltip {
    position: absolute;
    background-color: rgb(53,53,53);
    color: white;
    padding: 10px;
    border-radius: 3px;
    top: 170px;
    width: 215px;
    left: 50%;
    transform: translateX(-50%);
}

    .ai-tooltip p {
        text-align:justify;
    }

    .ai-tooltip ol > li {
        margin-left: -10px;
        text-align: justify;
        font-size: 80%;
    }

/*
.loader {
    position: relative;
    margin: auto;
    width: 204px;
    color: white;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 100%;
    background: linear-gradient(180deg, #222 0, #444 100%);
    box-shadow: inset 0 5px 20px black;
    text-shadow: 5px 5px 5px rgba(0,0,0,0.3);
}

    .loader:after {
        content: "";
        display: table;
        clear: both;
    }

.loader span {
    float: left;
    height: 30px;
    line-height: 30px;
    width: 17px;
}

.loader > span {
    border-left: 1px solid #444;
    border-right: 1px solid #222;
}

.covers {
    position: absolute;
    height: 100%;
    width: 100%;
}

    .covers span {
        background: linear-gradient(180deg, #1d90ff 0, #1d90ff 100%);
        animation: up 2s infinite;
    }

@keyframes up {
    0% {
        margin-bottom: 0;
    }

    16% {
        margin-bottom: 100%;
        height: 1px;
    }

    50% {
        margin-bottom: 0;
    }

    100% {
        margin-bottom: 0;
    }
}

.covers span:nth-child(2) {
    animation-delay: .142857s;
}

.covers span:nth-child(3) {
    animation-delay: .285714s;
}

.covers span:nth-child(4) {
    animation-delay: .428571s;
}

.covers span:nth-child(5) {
    animation-delay: .571428s;
}

.covers span:nth-child(6) {
    animation-delay: .714285s;
}

.covers span:nth-child(7) {
    animation-delay: .857142s;
}

.covers span:nth-child(8) {
    animation-delay: .957142s;
}

.covers span:nth-child(9) {
    animation-delay: 1.157142s;
}

.covers span:nth-child(10) {
    animation-delay: 1.2857142s;
}
.covers span:nth-child(11) {
    animation-delay: 1.357142s;
}
.covers span:nth-child(12) {
    animation-delay: 1.4s;
}
*/