
#course_wrapper_2 {
	text-size-adjust: none;
	-webkit-text-size-adjust: none;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling: touch;
    transition: opacity 0.15s;
}

#course_wrapper_2.loading {
    opacity: 0;
}


/* FONTS/TEXT SIZES AND STYLES USED IN ALL MODULES ---------------------------- */
h1, h2, h3, h4, h5, h6, p, li, span, p b {
    --max-font-size: 16;
    --min-font-size: calc(var(--max-font-size) * 0.8);
    --max-screen-width: 1400;
    --min-screen-width: 450;
    --font-size-calc: calc((var(--min-font-size) * 1px) + (var(--max-font-size) - var(--min-font-size)) * ((100vw - (var(--min-screen-width) * 1px)) / (var(--max-screen-width) - var(--min-screen-width))));
    --clamp-max: calc(var(--max-font-size) * 1px);
    --clamp-min: calc(var(--min-font-size) * 1px);
    font-size: clamp(var(--clamp-min), var(--font-size-calc), var(--clamp-max));
}

/* Different defaults since span and b tags are always nested in other tags. */
span, p b {
	--max-font-size: inherit;
    --min-font-size: inherit;
}

sup { 
    font-size: 65%;
    vertical-align: baseline;
    position: relative;
    top: -0.45em;
	line-height: normal;
	white-space: nowrap;
}


body {
    font-family: "Noto Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
        "wdth" 100;    
    text-wrap: pretty;
}

.headline {
    font-variation-settings: "wght" 900;
    letter-spacing: -0.02em;
}


.bold {font-weight: bold;}
.medium {font-weight: 500;}
.itl {	font-style: italic;}
.lte { font-weight: lighter; }


/* Keeps Korean symbols/words together */
html:lang(ko-kr) {
    word-break: keep-all;
}


/* Language Selector ---------------------- */
#language_selector {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    gap: min(8px, 1vw);
    background: #ffffff;
    padding: min(16px, 2vw);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    opacity: 0.65;
    transition: opacity 0.3s ease;
}

#language_selector label {
    font-size: clamp(0.75rem, 0.7083rem + 0.1905vw, 0.875rem);
    font-weight: 500;
    color: #333333;
    margin: 0;
}

#language_selector select {
    padding: 8px 32px 8px 12px;
    font-size: clamp(0.75rem, 0.7083rem + 0.1905vw, 0.875rem);
    border: 1px solid #cccccc;
    border-radius: 6px;
    background: #ffffff;
    cursor: pointer;
    outline: none;
    transition: border-color 0.2s ease;
    appearance: none;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path fill="%23333" d="M1.41 0L6 4.59L10.59 0L12 1.41l-6 6l-6-6z"/></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
}

#language_selector select:hover {
    border-color: #888888;
}

#language_selector select:focus {
    border-color: #0066cc;
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
}

#language_selector:hover {
    opacity: 1;
}