body.entity-ccontact {
    background-color: #c4dde9;
}

body.entity-ccaccount {
    background-color: #dddfd1;
}

body.entity-cclead {
    background-color: #ddd0e2;
}

body.entity-ccopportunity {
    background-color: #b5dccd;
}

body.entity-ctask {
    background-color: #d6c9f0;
}

/* transition */
body {
    transition: background-color 0.4s ease-in-out;
}





/* Smooth fade */
ul.nav.navbar-nav.navbar-right {
    transition: background-color 0.4s ease-in-out;
}

body.entity-ccontact ul.nav.navbar-nav.navbar-right {
    background-color: #c4dde9 !important;
}
body.entity-ccontact .stick-sub {
    background-color: #c4dde9 !important;
}

body.entity-ccaccount ul.nav.navbar-nav.navbar-right {
    background-color: #dddfd1 !important;
}
body.entity-ccaccount .stick-sub {
    background-color: #dddfd1 !important;
}

body.entity-cclead ul.nav.navbar-nav.navbar-right {
    background-color: #ddd0e2 !important;
}
body.entity-cclead .stick-sub {
    background-color: #ddd0e2 !important;
}

body.entity-ccopportunity ul.nav.navbar-nav.navbar-right {
    background-color: #b5dccd !important;
}
body.entity-ccopportunity .stick-sub {
    background-color: #b5dccd !important;
}

body.entity-ctask ul.nav.navbar-nav.navbar-right {
    background-color: #d6c9f0 !important;
}
body.entity-ctask .stick-sub {
    background-color: #d6c9f0 !important;
}


/* changelog arrow */
.vertical-arrow {
    display: flex;
    justify-content: left;
    position: relative;
    margin-left: 20px;
    margin-top: 20px;
}

/* The vertical line */
.vertical-arrow .line {
    width: 5px;              /* line thickness */
    height: 800px;           /* line length */
    position: relative;

    background: repeating-linear-gradient(
        to bottom,
        #999,
        #999 12px,
        transparent 6px,
        transparent 18px
    );
}

/* Arrow head */
.vertical-arrow .line::after {
    content: "";
    position: absolute;
    top: -18px;           /* moves arrow head above the line */
    left: 50%;
    transform: translateX(-50%);

    width: 0;
    height: 0;

    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 18px solid #999; /* arrow color */
}

