/* CSS for Project X */
.center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.container_01 {
    /*width: 320px;*/
    /*height: 180px;*/
    text-align: center;
    border: solid 1px green;
}
.loading_block {
    height: 470px;
    width: 350px;
    background: rgba(255, 255, 255, 0.8);
}
.notes_container {
    margin-top: 15px;
    margin-bottom: 25px;
}
.note_body {
    height: 155px;
    padding-bottom: 10px !important;
    overflow-y: auto;
}
.color_cube {
    height: 18px;
    width: 18px;

    display: inline-block;

    position: relative;
    top: 4px;
}

/* Some decors */
.txt_underline {
    text-decoration: underline;
}
/* ----------- */

/* Fonts */
.txt_small_1 {
    font-size: 8px;
}
.txt_small_2 {
    font-size: 10px;
}

.txt_medium_1 {
    font-size: 12px;
}
.txt_medium_2 {
    font-size: 14px;
}

.txt_large_1 {
    font-size: 16px;
}
.txt_large_2 {
    font-size: 18px;
}
.txt_large_3 {
    font-size: 20px;
}
.txt-bold {
    font-weight: bold;
}
.txt_bold {
    font-weight: bold;
}
.txt_bold_2 {
    font-weight: 500;
}
.distinct_txt_1 {
    color: #0d95e8;
    font-weight: bold;
}
.distinct_txt_2 {
    color: #f600ff;
    font-weight: bold;
}
/* ----- */

/* Standard colors */
.green_1 {
    color: green;
}
.orange_1 {
    color: orange;
}
.blue_1 {
    color: #60b0f4;
}
.grey_1 {
    color: #CCC;
}

.bg_orange_1 {
    background-color: orange;
}
/* --------------- */

/* Positioning related */
.float_notes_left {
    display: inline-block;
    margin-right: 10px;
}
/* ------------------- */

.hover_bg div:hover {
    background: #f4f3f3;
}
#cred_blocks div:hover {
    background: #f4f3f3;
}
.pointer {
    cursor: pointer;
}
.link {
    /*color: #0c5460;*/
    text-decoration: none !important;
}
.link_active {
    text-decoration: underline;
}
.lang_link a {
    color: #60b0f4;
}
.lang_link a:hover {
    color: #227bff;
}
.table_style tr:hover {
    background-color: #e7efeb;
}
.table_style tr:nth-child(even) {
    background: #f1eeee;
}
.table_style tr:nth-child(even):hover {
    background: #e7efeb;
}

/* Copy indicator animation */
.copy_ok_btn_en {
    width: 150px;
}
.copy_ok_btn_ka {
    width: 190px;
}
.copy_ok_btn_ru {
    width: 177px;
}

/* The animation code */
@keyframes fade_away {
    0% { opacity: 1.0; }
    99% { opacity: 0; }
    100% { display: none; }
}

/* The element to apply the animation to */
.copy_ok_btn_ani {
    opacity: 1.0;
    animation-name: fade_away;
    animation-duration: 1s;
}
/* ------------------------------------- */

/* ------------------------ */



/* Testing CSS */
.scaled {
    transform: scale(0.25); /* Equal to scaleX(0.25) scaleY(0.25) */
}