/**
 *  Extra CSS file for MkDocs and the neoteroi.timeline extension.
 *
 *  https://github.com/Neoteroi/mkdocs-plugins
**/
:root {
    --nt-color-0: #CD853F;
    --nt-color-1: #B22222;
    --nt-color-2: #000080;
    --nt-color-3: #4B0082;
    --nt-color-4: #3CB371;
    --nt-color-5: #D2B48C;
    --nt-color-6: #FF00FF;
    --nt-color-7: #98FB98;
    --nt-color-8: #FFEBCD;
    --nt-color-9: #2E8B57;
    --nt-color-10: #6A5ACD;
    --nt-color-11: #48D1CC;
    --nt-color-12: #FFA500;
    --nt-color-13: #F4A460;
    --nt-color-14: #A52A2A;
    --nt-color-15: #FFE4C4;
    --nt-color-16: #FF4500;
    --nt-color-17: #AFEEEE;
    --nt-color-18: #FA8072;
    --nt-color-19: #2F4F4F;
    --nt-color-20: #FFDAB9;
    --nt-color-21: #BC8F8F;
    --nt-color-22: #FFC0CB;
    --nt-color-23: #00FA9A;
    --nt-color-24: #F0FFF0;
    --nt-color-25: #FFFACD;
    --nt-color-26: #F5F5F5;
    --nt-color-27: #FF6347;
    --nt-color-28: #FFFFF0;
    --nt-color-29: #7FFFD4;
    --nt-color-30: #E9967A;
    --nt-color-31: #7B68EE;
    --nt-color-32: #FFF8DC;
    --nt-color-33: #0000CD;
    --nt-color-34: #D2691E;
    --nt-color-35: #708090;
    --nt-color-36: #5F9EA0;
    --nt-color-37: #008080;
    --nt-color-38: #008000;
    --nt-color-39: #FFE4E1;
    --nt-color-40: #FFFF00;
    --nt-color-41: #FFFAF0;
    --nt-color-42: #DCDCDC;
    --nt-color-43: #ADFF2F;
    --nt-color-44: #ADD8E6;
    --nt-color-45: #8B008B;
    --nt-color-46: #7FFF00;
    --nt-color-47: #800000;
    --nt-color-48: #20B2AA;
    --nt-color-49: #556B2F;
    --nt-color-50: #778899;
    --nt-color-51: #E6E6FA;
    --nt-color-52: #FFFAFA;
    --nt-color-53: #FF7F50;
    --nt-color-54: #FF0000;
    --nt-color-55: #F5DEB3;
    --nt-color-56: #008B8B;
    --nt-color-57: #66CDAA;
    --nt-color-58: #808000;
    --nt-color-59: #FAF0E6;
    --nt-color-60: #00BFFF;
    --nt-color-61: #C71585;
    --nt-color-62: #00FFFF;
    --nt-color-63: #8B4513;
    --nt-color-64: #F0F8FF;
    --nt-color-65: #FAEBD7;
    --nt-color-66: #8B0000;
    --nt-color-67: #4682B4;
    --nt-color-68: #F0E68C;
    --nt-color-69: #BDB76B;
    --nt-color-70: #A0522D;
    --nt-color-71: #FAFAD2;
    --nt-color-72: #FFD700;
    --nt-color-73: #DEB887;
    --nt-color-74: #E0FFFF;
    --nt-color-75: #8A2BE2;
    --nt-color-76: #32CD32;
    --nt-color-77: #87CEFA;
    --nt-color-78: #00CED1;
    --nt-color-79: #696969;
    --nt-color-80: #DDA0DD;
    --nt-color-81: #EE82EE;
    --nt-color-82: #FFB6C1;
    --nt-color-83: #8FBC8F;
    --nt-color-84: #D8BFD8;
    --nt-color-85: #9400D3;
    --nt-color-86: #A9A9A9;
    --nt-color-87: #FFFFE0;
    --nt-color-88: #FFF5EE;
    --nt-color-89: #FFF0F5;
    --nt-color-90: #FFDEAD;
    --nt-color-91: #800080;
    --nt-color-92: #B0E0E6;
    --nt-color-93: #9932CC;
    --nt-color-94: #DAA520;
    --nt-color-95: #F0FFFF;
    --nt-color-96: #40E0D0;
    --nt-color-97: #00FF7F;
    --nt-color-98: #006400;
    --nt-color-99: #808080;
    --nt-color-100: #87CEEB;
    --nt-color-101: #0000FF;
    --nt-color-102: #6495ED;
    --nt-color-103: #FDF5E6;
    --nt-color-104: #B8860B;
    --nt-color-105: #BA55D3;
    --nt-color-106: #C0C0C0;
    --nt-color-107: #000000;
    --nt-color-108: #F08080;
    --nt-color-109: #B0C4DE;
    --nt-color-110: #00008B;
    --nt-color-111: #6B8E23;
    --nt-color-112: #FFE4B5;
    --nt-color-113: #FFA07A;
    --nt-color-114: #9ACD32;
    --nt-color-115: #FFFFFF;
    --nt-color-116: #F5F5DC;
    --nt-color-117: #90EE90;
    --nt-color-118: #1E90FF;
    --nt-color-119: #7CFC00;
    --nt-color-120: #FF69B4;
    --nt-color-121: #F8F8FF;
    --nt-color-122: #F5FFFA;
    --nt-color-123: #00FF00;
    --nt-color-124: #D3D3D3;
    --nt-color-125: #DB7093;
    --nt-color-126: #DA70D6;
    --nt-color-127: #FF1493;
    --nt-color-128: #228B22;
    --nt-color-129: #FFEFD5;
    --nt-color-130: #4169E1;
    --nt-color-131: #191970;
    --nt-color-132: #9370DB;
    --nt-color-133: #483D8B;
    --nt-color-134: #FF8C00;
    --nt-color-135: #EEE8AA;
    --nt-color-136: #CD5C5C;
    --nt-color-137: #DC143C
}

:root {
    --nt-group-0-main: #000000;
    --nt-group-0-dark: #FFFFFF;
    --nt-group-0-light: #000000;
    --nt-group-0-main-bg: #F44336;
    --nt-group-0-dark-bg: #BA000D;
    --nt-group-0-light-bg: #FF7961;
    --nt-group-1-main: #000000;
    --nt-group-1-dark: #FFFFFF;
    --nt-group-1-light: #000000;
    --nt-group-1-main-bg: #E91E63;
    --nt-group-1-dark-bg: #B0003A;
    --nt-group-1-light-bg: #FF6090;
    --nt-group-2-main: #FFFFFF;
    --nt-group-2-dark: #FFFFFF;
    --nt-group-2-light: #000000;
    --nt-group-2-main-bg: #9C27B0;
    --nt-group-2-dark-bg: #6A0080;
    --nt-group-2-light-bg: #D05CE3;
    --nt-group-3-main: #FFFFFF;
    --nt-group-3-dark: #FFFFFF;
    --nt-group-3-light: #000000;
    --nt-group-3-main-bg: #673AB7;
    --nt-group-3-dark-bg: #320B86;
    --nt-group-3-light-bg: #9A67EA;
    --nt-group-4-main: #FFFFFF;
    --nt-group-4-dark: #FFFFFF;
    --nt-group-4-light: #000000;
    --nt-group-4-main-bg: #3F51B5;
    --nt-group-4-dark-bg: #002984;
    --nt-group-4-light-bg: #757DE8;
    --nt-group-5-main: #000000;
    --nt-group-5-dark: #FFFFFF;
    --nt-group-5-light: #000000;
    --nt-group-5-main-bg: #2196F3;
    --nt-group-5-dark-bg: #0069C0;
    --nt-group-5-light-bg: #6EC6FF;
    --nt-group-6-main: #000000;
    --nt-group-6-dark: #FFFFFF;
    --nt-group-6-light: #000000;
    --nt-group-6-main-bg: #03A9F4;
    --nt-group-6-dark-bg: #007AC1;
    --nt-group-6-light-bg: #67DAFF;
    --nt-group-7-main: #000000;
    --nt-group-7-dark: #000000;
    --nt-group-7-light: #000000;
    --nt-group-7-main-bg: #00BCD4;
    --nt-group-7-dark-bg: #008BA3;
    --nt-group-7-light-bg: #62EFFF;
    --nt-group-8-main: #000000;
    --nt-group-8-dark: #FFFFFF;
    --nt-group-8-light: #000000;
    --nt-group-8-main-bg: #009688;
    --nt-group-8-dark-bg: #00675B;
    --nt-group-8-light-bg: #52C7B8;
    --nt-group-9-main: #000000;
    --nt-group-9-dark: #FFFFFF;
    --nt-group-9-light: #000000;
    --nt-group-9-main-bg: #4CAF50;
    --nt-group-9-dark-bg: #087F23;
    --nt-group-9-light-bg: #80E27E;
    --nt-group-10-main: #000000;
    --nt-group-10-dark: #000000;
    --nt-group-10-light: #000000;
    --nt-group-10-main-bg: #8BC34A;
    --nt-group-10-dark-bg: #5A9216;
    --nt-group-10-light-bg: #BEF67A;
    --nt-group-11-main: #000000;
    --nt-group-11-dark: #000000;
    --nt-group-11-light: #000000;
    --nt-group-11-main-bg: #CDDC39;
    --nt-group-11-dark-bg: #99AA00;
    --nt-group-11-light-bg: #FFFF6E;
    --nt-group-12-main: #000000;
    --nt-group-12-dark: #000000;
    --nt-group-12-light: #000000;
    --nt-group-12-main-bg: #FFEB3B;
    --nt-group-12-dark-bg: #C8B900;
    --nt-group-12-light-bg: #FFFF72;
    --nt-group-13-main: #000000;
    --nt-group-13-dark: #000000;
    --nt-group-13-light: #000000;
    --nt-group-13-main-bg: #FFC107;
    --nt-group-13-dark-bg: #C79100;
    --nt-group-13-light-bg: #FFF350;
    --nt-group-14-main: #000000;
    --nt-group-14-dark: #000000;
    --nt-group-14-light: #000000;
    --nt-group-14-main-bg: #FF9800;
    --nt-group-14-dark-bg: #C66900;
    --nt-group-14-light-bg: #FFC947;
    --nt-group-15-main: #000000;
    --nt-group-15-dark: #FFFFFF;
    --nt-group-15-light: #000000;
    --nt-group-15-main-bg: #FF5722;
    --nt-group-15-dark-bg: #C41C00;
    --nt-group-15-light-bg: #FF8A50;
    --nt-group-16-main: #FFFFFF;
    --nt-group-16-dark: #FFFFFF;
    --nt-group-16-light: #000000;
    --nt-group-16-main-bg: #795548;
    --nt-group-16-dark-bg: #4B2C20;
    --nt-group-16-light-bg: #A98274;
    --nt-group-17-main: #000000;
    --nt-group-17-dark: #FFFFFF;
    --nt-group-17-light: #000000;
    --nt-group-17-main-bg: #9E9E9E;
    --nt-group-17-dark-bg: #707070;
    --nt-group-17-light-bg: #CFCFCF;
    --nt-group-18-main: #000000;
    --nt-group-18-dark: #FFFFFF;
    --nt-group-18-light: #000000;
    --nt-group-18-main-bg: #607D8B;
    --nt-group-18-dark-bg: #34515E;
    --nt-group-18-light-bg: #8EACBB
}

.nt-pastello {
    --nt-group-0-main: #000000;
    --nt-group-0-dark: #000000;
    --nt-group-0-light: #000000;
    --nt-group-0-main-bg: #EF9A9A;
    --nt-group-0-dark-bg: #BA6B6C;
    --nt-group-0-light-bg: #FFCCCB;
    --nt-group-1-main: #000000;
    --nt-group-1-dark: #000000;
    --nt-group-1-light: #000000;
    --nt-group-1-main-bg: #F48FB1;
    --nt-group-1-dark-bg: #BF5F82;
    --nt-group-1-light-bg: #FFC1E3;
    --nt-group-2-main: #000000;
    --nt-group-2-dark: #000000;
    --nt-group-2-light: #000000;
    --nt-group-2-main-bg: #CE93D8;
    --nt-group-2-dark-bg: #9C64A6;
    --nt-group-2-light-bg: #FFC4FF;
    --nt-group-3-main: #000000;
    --nt-group-3-dark: #000000;
    --nt-group-3-light: #000000;
    --nt-group-3-main-bg: #B39DDB;
    --nt-group-3-dark-bg: #836FA9;
    --nt-group-3-light-bg: #E6CEFF;
    --nt-group-4-main: #000000;
    --nt-group-4-dark: #000000;
    --nt-group-4-light: #000000;
    --nt-group-4-main-bg: #9FA8DA;
    --nt-group-4-dark-bg: #6F79A8;
    --nt-group-4-light-bg: #D1D9FF;
    --nt-group-5-main: #000000;
    --nt-group-5-dark: #000000;
    --nt-group-5-light: #000000;
    --nt-group-5-main-bg: #90CAF9;
    --nt-group-5-dark-bg: #5D99C6;
    --nt-group-5-light-bg: #C3FDFF;
    --nt-group-6-main: #000000;
    --nt-group-6-dark: #000000;
    --nt-group-6-light: #000000;
    --nt-group-6-main-bg: #81D4FA;
    --nt-group-6-dark-bg: #4BA3C7;
    --nt-group-6-light-bg: #B6FFFF;
    --nt-group-7-main: #000000;
    --nt-group-7-dark: #000000;
    --nt-group-7-light: #000000;
    --nt-group-7-main-bg: #80DEEA;
    --nt-group-7-dark-bg: #4BACB8;
    --nt-group-7-light-bg: #B4FFFF;
    --nt-group-8-main: #000000;
    --nt-group-8-dark: #000000;
    --nt-group-8-light: #000000;
    --nt-group-8-main-bg: #80CBC4;
    --nt-group-8-dark-bg: #4F9A94;
    --nt-group-8-light-bg: #B2FEF7;
    --nt-group-9-main: #000000;
    --nt-group-9-dark: #000000;
    --nt-group-9-light: #000000;
    --nt-group-9-main-bg: #A5D6A7;
    --nt-group-9-dark-bg: #75A478;
    --nt-group-9-light-bg: #D7FFD9;
    --nt-group-10-main: #000000;
    --nt-group-10-dark: #000000;
    --nt-group-10-light: #000000;
    --nt-group-10-main-bg: #C5E1A5;
    --nt-group-10-dark-bg: #94AF76;
    --nt-group-10-light-bg: #F8FFD7;
    --nt-group-11-main: #000000;
    --nt-group-11-dark: #000000;
    --nt-group-11-light: #000000;
    --nt-group-11-main-bg: #E6EE9C;
    --nt-group-11-dark-bg: #B3BC6D;
    --nt-group-11-light-bg: #FFFFCE;
    --nt-group-12-main: #000000;
    --nt-group-12-dark: #000000;
    --nt-group-12-light: #000000;
    --nt-group-12-main-bg: #FFF59D;
    --nt-group-12-dark-bg: #CBC26D;
    --nt-group-12-light-bg: #FFFFCF;
    --nt-group-13-main: #000000;
    --nt-group-13-dark: #000000;
    --nt-group-13-light: #000000;
    --nt-group-13-main-bg: #FFE082;
    --nt-group-13-dark-bg: #CAAE53;
    --nt-group-13-light-bg: #FFFFB3;
    --nt-group-14-main: #000000;
    --nt-group-14-dark: #000000;
    --nt-group-14-light: #000000;
    --nt-group-14-main-bg: #FFCC80;
    --nt-group-14-dark-bg: #CA9B52;
    --nt-group-14-light-bg: #FFFFB0;
    --nt-group-15-main: #000000;
    --nt-group-15-dark: #000000;
    --nt-group-15-light: #000000;
    --nt-group-15-main-bg: #FFAB91;
    --nt-group-15-dark-bg: #C97B63;
    --nt-group-15-light-bg: #FFDDC1;
    --nt-group-16-main: #000000;
    --nt-group-16-dark: #000000;
    --nt-group-16-light: #000000;
    --nt-group-16-main-bg: #BCAAA4;
    --nt-group-16-dark-bg: #8C7B75;
    --nt-group-16-light-bg: #EFDCD5;
    --nt-group-17-main: #000000;
    --nt-group-17-dark: #000000;
    --nt-group-17-light: #000000;
    --nt-group-17-main-bg: #EEEEEE;
    --nt-group-17-dark-bg: #BCBCBC;
    --nt-group-17-light-bg: #FFFFFF;
    --nt-group-18-main: #000000;
    --nt-group-18-dark: #000000;
    --nt-group-18-light: #000000;
    --nt-group-18-main-bg: #B0BEC5;
    --nt-group-18-dark-bg: #808E95;
    --nt-group-18-light-bg: #E2F1F8
}

.nt-error {
    border: 2px dashed darkred;
    padding: 0 1rem;
    background: #faf9ba;
    color: darkred;
}

.nt-timeline {

    margin-top: 30px;

    .nt-timeline-title {
        font-size: 1.1rem;
        margin-top: 0;
    }

    .nt-timeline-sub-title {
        margin-top: 0;
    }

    .nt-timeline-content {
        font-size: 0.8rem;
        border-bottom: 2px dashed #ccc;
        padding-bottom: 1.2rem;
    }

    &.horizontal {
        .nt-timeline-items {
            flex-direction: row;
            overflow-x: scroll;

            >div {
                min-width: 400px;
                margin-right: 50px;
            }
        }

        &.reverse {
            .nt-timeline-items {
                flex-direction: row-reverse;
            }
        }

        &.center {
            .nt-timeline-before {
                background-image: linear-gradient(rgba(252, 70, 107, 0) 0%, rgba(252, 70, 107, 1) 100%);
                background-repeat: no-repeat;
                background-size: 100% 2px;
                background-position: 0 center;
            }

            .nt-timeline-after {
                background-image: linear-gradient(180deg, rgba(252, 70, 107, 1) 0%, rgba(252, 70, 107, 0) 100%);
                background-repeat: no-repeat;
                background-size: 100% 2px;
                background-position: 0 center;
            }

            .nt-timeline-items {
                background-image: radial-gradient(circle, rgba(63, 94, 251, 1) 0%, rgba(252, 70, 107, 1) 100%);
                background-repeat: no-repeat;
                background-size: 100% 2px;
                background-position: 0 center;
            }
        }

        .nt-timeline-dot {
            left: 50%;

            &:not(.bigger) {
                top: calc(50% - 4px);
            }

            &.bigger {
                top: calc(50% - 15px);
            }
        }
    }

    &.vertical {
        .nt-timeline-items {
            flex-direction: column;
        }

        &.reverse {
            .nt-timeline-items {
                flex-direction: column-reverse;
            }
        }

        &.center {
            .nt-timeline-before {
                background: linear-gradient(rgba(252, 70, 107, 0) 0%, rgba(252, 70, 107, 1) 100%) no-repeat center/2px 100%;
            }

            .nt-timeline-after {
                background: linear-gradient(rgba(252, 70, 107, 1) 0%, rgba(252, 70, 107, 0) 100%) no-repeat center/2px 100%;
            }

            .nt-timeline-items {
                background: radial-gradient(circle, rgba(63, 94, 251, 1) 0%, rgba(252, 70, 107, 1) 100%) no-repeat center/2px 100%;
            }

            .nt-timeline-dot {
                left: calc(50% - 10px);

                &:not(.bigger) {
                    top: 10px;
                }

                &.bigger {
                    left: calc(50% - 20px);
                }
            }
        }

        &.left {
            padding-left: 100px;

            .nt-timeline-item {
                padding-left: 70px;
            }

            .nt-timeline-sub-title {
                left: -100px;
                width: 100px;
            }

            .nt-timeline-before {
                background: linear-gradient(rgba(252, 70, 107, 0) 0%, rgb(252, 70, 107) 100%) no-repeat 30px/2px 100%;
            }

            .nt-timeline-after {
                background: linear-gradient(rgba(252, 70, 107, 1) 0%, rgba(252, 70, 107, 0) 100%) no-repeat 30px/2px 100%;
            }

            .nt-timeline-items {
                background: radial-gradient(circle, rgba(63, 94, 251, 1) 0%, rgba(252, 70, 107, 1) 100%) no-repeat 30px/2px 100%;
            }

            .nt-timeline-dot {
                left: 21px;
                top: 8px;

                &.bigger {
                    top: 0px;
                    left: 10px;
                }
            }
        }

        &.right {
            padding-right: 100px;

            .nt-timeline-sub-title {
                right: -100px;
                text-align: left;
                width: 100px;
            }

            .nt-timeline-item {
                padding-right: 70px;
            }

            .nt-timeline-before {
                background: linear-gradient(rgba(252, 70, 107, 0) 0%, rgba(252, 70, 107, 1) 100%) no-repeat calc(100% - 30px)/2px 100%;
            }

            .nt-timeline-after {
                background: linear-gradient(rgba(252, 70, 107, 1) 0%, rgba(252, 70, 107, 0) 100%) no-repeat calc(100% - 30px)/2px 100%;
            }

            .nt-timeline-items {
                background: radial-gradient(circle, rgba(63, 94, 251, 1) 0%, rgba(252, 70, 107, 1) 100%) no-repeat calc(100% - 30px)/2px 100%;
            }

            .nt-timeline-dot {
                right: 21px;
                top: 8px;

                &.bigger {
                    top: 10px;
                    right: 10px;
                }
            }
        }
    }
}

.nt-timeline-items {
    display: flex;
    position: relative;

    >div {
        min-height: 100px;
        padding-top: 2px;
        padding-bottom: 20px;
    }
}

.nt-timeline-before {
    content: "";
    height: 15px;
}

.nt-timeline-after {
    content: "";
    height: 60px;

    margin-bottom: 20px;
}

.nt-timeline-sub-title {
    position: absolute;
    width: 50%;
    top: 4px;
    font-size: 18px;
    color: var(--nt-color-50);
}

[data-md-color-scheme="slate"] .nt-timeline-sub-title {
    color: var(--nt-color-51);
}

.nt-timeline-item {
    position: relative;
}

.nt-timeline.vertical.center {
    &:not(.alternate) {
        .nt-timeline-item {
            padding-left: calc(50% + 40px);

            .nt-timeline-sub-title {
                left: 0;
                padding-right: 40px;
                text-align: right;
            }
        }
    }

    &.alternate {
        .nt-timeline-item {
            &:nth-child(odd) {
                padding-left: calc(50% + 40px);

                .nt-timeline-sub-title {
                    left: 0;
                    padding-right: 40px;
                    text-align: right;
                }

            }

            &:nth-child(even) {
                text-align: right;
                padding-right: calc(50% + 40px);

                .nt-timeline-sub-title {
                    right: 0;
                    padding-left: 40px;
                    text-align: left;
                }
            }
        }
    }
}

.nt-timeline-dot {
    position: relative;
    width: 20px;
    height: 20px;

    border-radius: 100%;
    background-color: #fc5b5b;
    position: absolute;
    top: 0px;
    z-index: 2;

    display: flex;
    justify-content: center;
    align-items: center;

    box-shadow: 0 2px 1px -1px rgb(0 0 0 / 20%), 0 1px 1px 0 rgb(0 0 0 / 14%), 0 1px 3px 0 rgb(0 0 0 / 12%);
    border: 3px solid white;

    &:not(.bigger) {
        .icon {
            font-size: 10px;
        }
    }

    &.bigger {
        width: 40px;
        height: 40px;

        padding: 3px;
    }

    .icon {
        color: white;
        position: relative;
        top: 1px;
    }
}

/* Fix for webkit (Chrome, Safari) */
@supports not (-moz-appearance:none) {

    /*
    This fix is necessary, for some reason, to render the timeline properly
    inside `details` elements used by pymdownx. Firefox doesn't need this fix,
    it renders elements properly.
    */
    details {

        .nt-timeline.vertical.center.alternate .nt-timeline-item:nth-child(odd) .nt-timeline-sub-title,
        .nt-timeline.vertical.center:not(.alternate) .nt-timeline-item .nt-timeline-sub-title {
            left: -40px;
        }

        .nt-timeline.vertical.center.alternate .nt-timeline-item:nth-child(even) .nt-timeline-sub-title {
            right: -40px;
        }

        .nt-timeline.vertical.center .nt-timeline-dot {
            left: calc(50% - 12px);
        }

        .nt-timeline-dot.bigger {
            font-size: 1rem !important;
        }
    }
}

/* default colors */
.nt-timeline-item:nth-child(0) .nt-timeline-dot {
    background-color: var(--nt-color-0);
}

.nt-timeline-item:nth-child(1) .nt-timeline-dot {
    background-color: var(--nt-color-1);
}

.nt-timeline-item:nth-child(2) .nt-timeline-dot {
    background-color: var(--nt-color-2);
}

.nt-timeline-item:nth-child(3) .nt-timeline-dot {
    background-color: var(--nt-color-3);
}

.nt-timeline-item:nth-child(4) .nt-timeline-dot {
    background-color: var(--nt-color-4);
}

.nt-timeline-item:nth-child(5) .nt-timeline-dot {
    background-color: var(--nt-color-5);
}

.nt-timeline-item:nth-child(6) .nt-timeline-dot {
    background-color: var(--nt-color-6);
}

.nt-timeline-item:nth-child(7) .nt-timeline-dot {
    background-color: var(--nt-color-7);
}

.nt-timeline-item:nth-child(8) .nt-timeline-dot {
    background-color: var(--nt-color-8);
}

.nt-timeline-item:nth-child(9) .nt-timeline-dot {
    background-color: var(--nt-color-9);
}

.nt-timeline-item:nth-child(10) .nt-timeline-dot {
    background-color: var(--nt-color-10);
}

.nt-timeline-item:nth-child(11) .nt-timeline-dot {
    background-color: var(--nt-color-11);
}

.nt-timeline-item:nth-child(12) .nt-timeline-dot {
    background-color: var(--nt-color-12);
}

.nt-timeline-item:nth-child(13) .nt-timeline-dot {
    background-color: var(--nt-color-13);
}

.nt-timeline-item:nth-child(14) .nt-timeline-dot {
    background-color: var(--nt-color-14);
}

.nt-timeline-item:nth-child(15) .nt-timeline-dot {
    background-color: var(--nt-color-15);
}

.nt-timeline-item:nth-child(16) .nt-timeline-dot {
    background-color: var(--nt-color-16);
}

.nt-timeline-item:nth-child(17) .nt-timeline-dot {
    background-color: var(--nt-color-17);
}

.nt-timeline-item:nth-child(18) .nt-timeline-dot {
    background-color: var(--nt-color-18);
}

.nt-timeline-item:nth-child(19) .nt-timeline-dot {
    background-color: var(--nt-color-19);
}

.nt-timeline-item:nth-child(20) .nt-timeline-dot {
    background-color: var(--nt-color-20);
}