@import url('../theme/colors.css');


.lesson-details div {
    white-space: normal;
}

.lesson-details .parts-navigation {
    width: 20%;
    top: 20%;
    left: 2.5%;
}


.lesson-details .content h2,
.lesson-details .content h3 {
    margin: 0 0 1rem 0;
    font-weight: bold;
}

.lesson-details .content h2 {
    font-size: 1.7rem;
}

.lesson-details .content h3 {
    font-size: 1.5rem;
}

.lesson-details .content h2,
.lesson-details .content h3,
.lesson-details .content h4 {
    color: var(--text-black);
}

.lesson-details .content hr {
    margin: 0 0 2.5rem 0;
}

.lesson-details .content a:not(.btn),
.lesson-details .content li a:not(.btn) {
    color: var(--blue) !important;
}

/* link icons */
.lesson-details .content a:not(.btn)::before,
.lesson-details .content li a:not(.btn)::before {
    content: "\F470";
    font-family: bootstrap-icons !important;
    display: inline-block;
    font-style: normal;
    font-weight: 400 !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.2em;
    margin: 0 0.2em 0 0;
    -webkit-font-smoothing: antialiased;
}

.lesson-details .content ol,
.lesson-details .content ol li {
    list-style-type: decimal;
}

.lesson-details .content ul,
.lesson-details .content ul li {
    list-style-type: disc;
}

.lesson-details .content ol,
.lesson-details .content ul {
    padding-left: 2rem;
}

.lesson-details .list-group,
.lesson-details .list-group-item {
    background: none;
    color: var(--black);
    border-color: var(--dark-grey);
}

.prev-button,
.next-button {
    width: 100%;
}

@media (min-width: 768px) {

    .prev-button,
    .next-button {
        width: auto;
        min-width: 110px;
    }
}

.next-button {
    letter-spacing: .05rem;
}