.p {
    padding: 0.4em 0em;

    word-wrap: anywhere;
}

.line {
    padding-top: 18px;

    border-bottom: 1px solid #aaa;

    margin-bottom: 10px;
}

.quote {
    padding: 0.6em 0.9em;

    line-height: 1.6em;

    background-color: #f2f2f2;
    border: 1px dotted #ddd;

    margin-top: 0.3em;
}

.quote::before {
    content: "»";
    display: inline-block;
    padding-right: 0.4em;

    font-size: 1.7em;
    color: #ccc;
}

.code {
    padding: 0.6em 0.9em;

    line-height: 1.4em;

    color: #333;
    background-color: #eaeaea;

    margin-top: 0.3em;

    white-space: pre-wrap;
    font-family: "Consolas", "Lucida Console", monospace;
}

.bullet {
    padding-left: 3em;
}

.bullet li {
    line-height: 1.7em;
}

.command {
    background-color: #ddd;
}

.underline {
    text-decoration: underline;
}
.italic {
    font-style: italic;
}
.strikethrough {
    text-decoration: line-through;
}

.important {
    background-color: #fdd;
}
.important2 {
    background-color: #fdd;
    font-weight: bold;
}

.highlight {
    background-color: #ddf;
}
.highlight2 {
    background-color: #ddf;
    font-weight: bold;
}

.entry_wrap {
	display: table;

	width: 100%;
}

.entry_content {
    display: flex;
    gap: 8px;

    animation: scaleUp 0.2s ease;
}

.new_entry_placeholder {
    display: table;
}

@keyframes scaleUp {
    0% {
        transform: scale(0.2);
    }
    100% {
        transform: scale(1);
    }
}

.entry_introduction {
}

.entry_left {
	width: 55px;
	min-width: 55px;
	max-width: 55px;
	height: 100%;

	display: table-cell;
}

.entry_selected .entry_left:hover {
	background-color: #ddd;
}

.entry_readonly {
    background-image: url(../img/eye-crossed-svgrepo-com.svg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 20px 20px;
}

.entry_readonly:hover {
}

.entry_display {
	width: 100%;

	position: relative;
}

.entry {
}

.entry_selected .entry_left {
	background-image: url(../img/point.svg);
	background-repeat: no-repeat;
    background-position: center 10;
    background-size: 20px 20px;

    min-width: 55px;
}

.entry_deleted {
    border: 2px dashed #666;
}

/* Images */

.file_container img {
    max-width: 50vw;
}

.file_container {
    padding: 0.4em 0 0.4em 0;
}

/* Inline */

.selector_shown {
    padding: 0.2em 1em;
    background-color: #eee;
}

.selector_shown:hover {
    cursor: pointer;
    opacity: 0.8;
}

/*
https://www.cssmatic.com/box-shadow
*/

/* Tags */

span.follows::before {
    content: '';

    padding-left: 3em;
    display: inline-block;
    min-height: 32px;

    background-image: url(../img/next-svgrepo-com.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 28px 28px;
}

span.hint_idea::before {
    content: '';

    padding-left: 3em;
    display: inline-block;
    min-height: 32px;

    background-image: url(../img/idea-svgrepo-com.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 28px 28px;
}

span.hint_remember::before {
    content: '';

    padding-left: 3em;
    display: inline-block;
    min-height: 32px;

    background-image: url(../img/tip-svgrepo-com.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 28px 28px;
}

/* Marker */

.color_red {
    border: 1px solid rgba(255,0,9,1);
}

.color_blue {
    border: 1px solid rgba(0,77,255,1);
}

.color_green {
    border: 1px solid rgba(0,235,0,1);
}

.marker_type_border.color_red {
    border: 1px solid rgba(255,0,9,1);
}

.marker_type_border.color_blue {
    border: 1px solid rgba(0,77,255,1);
}

.marker_type_border.color_green {
    border: 1px solid rgba(0,235,0,1);
}

.marker_type_background.color_red {
    background-color: rgba(255,0,9,1);
}

.marker_type_background.color_blue {
    background-color: rgba(0,77,255,1);
}

.marker_type_background.color_green {
    background-color: rgba(0,235,0,1);
}

.marker_type_shadow.color_red {
    -webkit-box-shadow: 0px 0px 3px 9px rgba(255,0,9,1);
    -moz-box-shadow: 0px 0px 3px 9px rgba(255,0,9,1);
    box-shadow: 0px 0px 3px 9px rgba(255,0,9,1);
}

.marker_type_shadow.color_blue {
    -webkit-box-shadow: 0px 0px 3px 9px rgba(0,77,255,1);
    -moz-box-shadow: 0px 0px 3px 9px rgba(0,77,255,1);
    box-shadow: 0px 0px 3px 9px rgba(0,77,255,1);
}

.marker_type_shadow.color_green {
    -webkit-box-shadow: 0px 0px 3px 9px rgba(0,235,0,1);
    -moz-box-shadow: 0px 0px 3px 9px rgba(0,235,0,1);
    box-shadow: 0px 0px 3px 9px rgba(0,235,0,1);
}

.focused {
    padding-left: 3em;
    padding-right: 3em;
}

.content_focused {
}

.focused:before {
    content: '>';
}

/* Parameters */

.indent_step1 {
    margin-left: 20px;
}
.indent_step2 {
    margin-left: 40px;
}
.indent_step3 {
    margin-left: 60px;
}

.width_percent50 {
    width: 50%;
}

/* Markers */

.background_green {
    background-color: #D9F99D;
    padding-left: 6px;
}

.background_blue {
    background-color: #BAE6FD;
    padding-left: 6px;
}

.background_red {
    background-color: #FECACA;
    padding-left: 6px;
}

.background_yellow {
    background-color: #FEF08A;
    padding-left: 6px;
}

.background_purple {
    background-color: #DDD6FE;
    padding-left: 6px;
}

.background_gray {
    background-color: #eee;
    padding-left: 6px;
}

/* Marker: darker */

.background_green.background_style_darker {
    background-color: #169645;
}

.background_blue.background_style_darker {
    background-color: #38BDF8;
}

.background_red.background_style_darker {
    background-color: #F87171;
}

.background_yellow.background_style_darker {
    background-color: #FACC15;
}

.background_purple.background_style_darker {
    background-color: #A78BFA;
}

.background_gray.background_style_darker {
    background-color: #ddd;
}

.shadow_green {
    -webkit-box-shadow: 0px 0px 3px 9px #D9F99D;
    -moz-box-shadow: 0px 0px 3px 9px #D9F99D;
    box-shadow: 0px 0px 3px 9px #D9F99D;

    margin-top: 5px;
    margin-bottom: 5px;
}

.shadow_blue {
    -webkit-box-shadow: 0px 0px 3px 9px #BAE6FD;
    -moz-box-shadow: 0px 0px 3px 9px #BAE6FD;
    box-shadow: 0px 0px 3px 9px #BAE6FD;

    margin-top: 5px;
    margin-bottom: 5px;
}

.shadow_red {
    -webkit-box-shadow: 0px 0px 3px 9px #FECACA;
    -moz-box-shadow: 0px 0px 3px 9px #FECACA;
    box-shadow: 0px 0px 3px 9px #FECACA;

    margin-top: 5px;
    margin-bottom: 5px;
}

/* Border */

.border_green {
    border: 2px solid #169645;
    padding: 3px 4px;
}

.border_blue {
    border: 2px solid #38BDF8;
    padding: 3px 4px;
}

.border_red {
    border: 2px solid #F87171;
    padding: 3px 4px;
}