/*

Enhancements Style

• Contains usability enhancements on Active Areas (AAs)
• Visually hides headings for visual purposes
• Contains styles of functionalities
• Contains Generic CSS Variables

*/





/* ------------------ Variables ------------------ */
.html
{
    /* Level 1: Absolutes - see default.css */
    
    
    /* ------------ Level 2: Generics ------------ */
    
    /* Main Color */
    --main-color--pri: var(--color--superhero-blue);
    --main-color--sec: var(--color--uhog-green);
    
    /* Accent Color */
    --accent-color--pri: var(--color--panda-blue);
    --accent-color--sec: var(--color--chikka-orange);
    
    /* Background Color */
    --bg-color: var(--dash-of-darkness--color);
    
    /* Foreground Color */
    --fg-color: var(--color--off-black);
    
    /* Image Placeholder Color */
    --image-placeholder--bg-color: var(--color--off-black-a);
    
    
    /* Foreground Color - Reverse (use with a dark background) */
    --fg-color--reverse: var(--color--white);
    
    /* Faint Color */
    --faint-color--pri: var(--color--transparent-black);
    
    /* Border Color */
    --border-color: var(--black-half--color-a);
    
    /* Gutter */
    --gutter-x--base: 1rem;
    --gutter-x--xsm--multiplier: .25;
    --gutter-x--sm--multiplier: .5;
    --gutter-x--md--multiplier: 1;
    --gutter-x--lg--multiplier: 1.5;
    
    --gutter-x--xsm: calc( var(--gutter-x--base) * var(--gutter-x--xsm--multiplier) );
    --gutter-x--sm: calc( var(--gutter-x--base) * var(--gutter-x--sm--multiplier) );
    --gutter-x--md: calc( var(--gutter-x--base) * var(--gutter-x--md--multiplier) );
    --gutter-x--lg: calc( var(--gutter-x--base) * var(--gutter-x--lg--multiplier) );
    
    /* Spacing */
    --spacing-y--base: 1rem;
    --spacing-y--xsm--multiplier: .25;
    --spacing-y--sm--multiplier: .5;
    --spacing-y--md--multiplier: 1;
    --spacing-y--lg--multiplier: 1.5;
    
    --spacing-y--xsm: calc( var(--spacing-y--base) * var(--spacing-y--xsm--multiplier) );
    --spacing-y--sm: calc( var(--spacing-y--base) * var(--spacing-y--sm--multiplier) );
    --spacing-y--md: calc( var(--spacing-y--base) * var(--spacing-y--md--multiplier) );
    --spacing-y--lg: calc( var(--spacing-y--base) * var(--spacing-y--lg--multiplier) );
    
    --spacing-relative-y--base: 1em;
    
    --spacing-relative-y--sm: calc( var(--spacing-relative-y--base) * var(--spacing-y--sm--multiplier) );
    --spacing-relative-y--md: calc( var(--spacing-relative-y--base) * var(--spacing-y--md--multiplier) );
    --spacing-relative-y--lg: calc( var(--spacing-relative-y--base) * var(--spacing-y--lg--multiplier) );
    
    /* Font Size */
    
    --font-size--sm: .875em;
    --font-size--md: 1.125em;
    --font-size--lg: 1.5em;
    
    /* Element Dimensions */
    --elem-dimension--md: var(--dimension--md);
    
    /* Transition */
    --transition--generic: all .125s ease-in-out;
    
    /* Aspect Ratio */
    --aspect-ratio--hd: var(--ratio--16-9);
    
    /* Buttons */
    --button--pri--bg-color: var(--accent-color--pri);
    --button--pri--fg-color: var(--fg-color--reverse);
    
    --button--padding: .5em 1em;
    --button--min-width: 10em;
    
    
    /* ------------ Level 3 - Specifics ------------ */
    
    /* Main Header - Colors */
    --main-header--bg-color: var(--main-color--pri);
    
    /* Button - Colors */
    --button--bg-color: var(--accent-color--pri);
    --button--fg-color: var(--fg-color--reverse);
    
    /* Selection - Colors */
    --selection--bg-color: var(--main-color--sec);
    --selection--fg-color: var(--fg-color--reverse);
    
    /* Section - Spacing */
    --section--spacing: var(--spacing-y--md) var(--gutter-x--md);
    --section--spacing-x: var(--gutter-x--md);
    --section--spacing-y: var(--spacing-y--md);
    
    /* Content - Spacing */
    --content--spacing: .75em var(--gutter-x--md);
    --content--spacing-x: var(--gutter-x--md);
    --content--spacing-y: var(--spacing-relative-y--sm);
    
    /* Object - Spacing */
    --object--spacing-x: var(--gutter-x--md);
    --object--spacing-y: var(--spacing-y--md);
    --object--spacing-y--sm: var(--spacing-y--sm);
    --object--spacing--md: var(--spacing-y--md) var(--gutter-x--md);
    
    /* Component - Spacing */
    --component--spacing-x: var(--gutter-x--md);
    --component--spacing-y: var(--spacing-y--md);
    --component--spacing--md: var(--spacing-y--md) var(--gutter-x--md);
    
    /* Content - Font Size */
    --content--font-size: var(--font-size--md);
    
    /* Caption - Font Size */
    --caption--font-size: var(--font-size--sm);
    
    /* Copyright Info - Colors */
    --copyright-info--fg-color: var(--faint-color--pri);
    
    /* Generic Text - Colors */
    --generic-text--fg-color: var(--main-color--sec);
    
    /* List - Spacing */
    --list--spacing--xsm: var(--spacing-y--xsm) var(--gutter-x--xsm);
    --list--spacing-y--xsm: var(--spacing-y--xsm);
    
    /* Table - Spacing */
    --table--spacing: var(--spacing-y--md) var(--gutter-x--md);
    
    /* Web Product - Colors */
    --wbp--bg-color: var(--bg-color);
    --wbp--fg-color: var(--fg-color);
    
    /* Links - Colors */
    --links--fg-color: var(--accent-color--pri);
    
    /* Main Nav */
    --main-nav--bg-color: var(--color--white);
    
    /* Sub Nav - Toggle Button - Colors */
    --sub-nav-func-root--toggle-button--fg-color: var(--fg-color);
    --sub-nav-func-branches--toggle-button--fg-color: var(--fg-color);
    
    /* Main Header Aside - Colors */
    --main-header-aside--bg-color: var(--wbp--bg-color);
    
    /* Main Menu - Colors */
    --main-menu-func--fg-color: var(--wbp--fg-color);
    
    /* Go to Start Nav - Colors */
    --go-start-nav-func--fg-color: var(--wbp--fg-color);
    
    /* Input Text - Border Color */
    --input-text--border-color: var(--border-color);
    
    /* Image - Color */
    --image--bg-color: var(--image-placeholder--bg-color);
    
    /* Element Dimensions */
    --elem--width--md: var(--elem-dimension--md);
    --elem--height--md: var(--elem-dimension--md);
    --elem--dimension: var(--elem-dimension--md);
    
    /* Active Area Dimensions */
    --active-area--dimension--md: var(--elem-dimension--md);
    --active-area--width--md: var(--elem-dimension--md);
    --active-area--height--md: var(--elem-dimension--md);
    
    /* Main Logo - Dimensions */
    --main-logo--height: 2.25rem;
    
    /* Label - Spacing */
    --glabel--spacing: var(--gutter-x--md);
    
    /* Author Avatar - Dimensions */
    --author-avatar--width: var(--elem-dimension--md);
    --author-avatar--height: var(--elem-dimension--md);
    
    /* Commenter Avatar - Dimensions */
    --commenter-avatar--width: calc( var(--elem-dimension--md) - 1rem );
    --commenter-avatar--height: calc( var(--elem-dimension--md) - 1rem );
    
    /* Dismiss Icon - Dimensions */
    --dismiss-icon--width: .75rem;
    --dismiss-icon--height: .75rem;
    
    /* Text Spacing */
    --glabel--between--spacing: .3em;
    
    /* Overlays */
    --overlay--light: var(--color--white);
    --overlay--dark: var(--color--black);
    
    /* Note */
    --note--font-size: var(--font-size--sm);
    --note--fg-color: var(--font-size--sm);
    
    /* Go to Content Nav */
    --go-content-nav--bg-color: var(--button--pri--bg-color);
    --go-content-nav--fg-color: var(--button--pri--fg-color);
    
    /* Easy Access Nav - Main Nav - Colors */
    --easy-access-nav-func--main-nav--fg-color: var(--color--black);
    
    /* Sub Nav - Colors */
    --easy-access-nav-func--sub-nav--bg-color: var(--color--white);
    --easy-access-nav-func--sub-nav--fg-color: var(--color--black);
    
    /* Easy Access Nav - Sub Nav - Indicator - Colors */
    --easy-access-nav-func--navi--root--indicator: var(--black-eighth--color);
    
    --easy-access-nav-func--navi--current-ancestor--indicator: var(--black-fourth--color);
    --easy-access-nav-func--navi--branch--indicator: var(--black-eighth--color);
    
    /* Easy Access Nav - Sub Nav - Border Color */
    --easy-access-nav-func--sub-nav--border-color: var(--black-eighth--color);
    
    /* Easy Access Nav - Indicator - Dimensions */
    --easy-access-nav-func--indicator--height: .125rem;
    --easy-access-nav-func--indicator--width: .125rem;
    
}





/* ------------------ Visually Hidden ------------------ */
.visually-hidden,

/* Main Menu */
.main-menu-tog---b_l .show-hide---txt,
.sub-nav-tog---b_l .show-hide---txt,
.main-nav---h,

/* Main Search */
.main-search-tog---b_l .show-hide---txt,
.main-search-func .search-form-search-axn .go---txt,
.main-search-func .search-form-reset-axn .reset---txt,
.applicator--main-search--active .main-name,
.applicator--main-search--active .main-logo,
.applicator--main-search--active .main-description,

/* Go to Start Nav */
.go-start-nav-func .go-to-start---txt,

/* Go to Content Nav */
.go-content-nav--inactive,

/* Name and Logo */
.web-product-main-name-description--disabled .main-name,
.web-product-main-name-description--disabled .main-description,

/* Main Content Heading */
.blog .main-content-heading,
.single-post .main-content-heading,
.attachment .main-content-heading,
.page .main-content-heading,
.view--multisite-directory .main-content-heading,

/* Nav */
.page-nav---h,
.entry-nav---h,
.post-nav---h,
.breadcrumbs-nav---h,
.comments-nav---h,

/* Comments */
.comments---h,
.comment-content---h,

/* Widgets */
.widget---h,
.widget-content---h,
.widget .screen-reader-text,

/* Search */
.post-content .search-form-reset-axn,
.aside .search-form-reset-axn,

/* Main Media Banner */
.main-media-banner img,

/* Comments */
.applicator--comments .post-header-aside .comments-actions-snippet .comments-population,
.applicator--comments .comments-actions-snippet.comments-population--empty .add-comment-axn,
.applicator--comments--active .comments-toggle .comments-count---txt,

/* Page Nav */
.applicator--page-nav .adjacent-navi---l
{
    position:absolute;margin:-1px;padding:0;width:1px;min-width:auto;height:1px;min-height:auto;overflow:hidden;clip:rect(0,0,0,0);border:0;word-wrap:normal;
}





/* ------------------ Unlist ------------------ */
.unlist,
.entry-nav---grp,
.page-nav ul,
.post-nav---grp,
.comments-nav---grp,
.breadcrumbs-nav---grp,
.main-nav ul,
.widget_nav_menu ul,
.widget_pages ul
{
    list-style: none;
    margin: 0;
    padding: 0;
}





/* ------------------ HTML ------------------ */
.html
{
    text-rendering: geometricPrecision;
    
    background-color: var(--wbp--bg-color);
    color: var(--wbp--fg-color);
}





/* ------------------ Overlay ------------------ */

/* Overlay Inactive */
.applicator--main-menu .overlay--main-menu-func,
.applicator--main-menu .overlay--go-content-nav-func
{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 100%;
    
    background-color: black;
    background-color: var(--overlay--dark);
    
    opacity: 0;
    
    transition: opacity .3s, bottom 0s .3s;
}

/* Overlay Active */
.applicator--main-menu--active .overlay--main-menu-func,
.applicator--go-content-nav--active .overlay--go-content-nav-func
{
    bottom: 0%;
    opacity: .75;
    transition: opacity .3s;
    
    z-index: 99;
}

.applicator--main-menu .overlay--go-content-nav-func
{
    
    background-color: white;
    background-color: var(--overlay--light);
}





/* ------------------ Highlight ------------------ */
::-moz-selection {
    background: var(--selection--bg-color);
    color: var(--selection--fg-color);
    
    text-shadow: none;
}

::selection {
    background: var(--selection--bg-color);
    color: var(--selection--fg-color);
    
    text-shadow: none;
}





/* ------------------ Active Area (AA) ------------------ */
.active-area,
.comments-count-axn---a_l,
.entry-navi---a_l,
.main-post-title---a_l,
.input-text,
.b_l,
input[type="text"],
input[type="password"],
input[type="submit"],
.comment-form-submit-axn---b,
.go-start-navi---a_l,
.go-ct-navi---a_l,
.main-post-title---h_l,
.copyright---g_l,
.post-pub-d-stamp-dtstamp---a_l,
.post-pub-t-stamp-dtstamp---a_l,
.post-mod-d-stamp-dtstamp---a_l,
.post-mod-t-stamp-dtstamp---a_l,
.author-name---a_l,
.add-com-axn---a_l,
.comment-title---a_l,
.comment-pub-d-stamp-dtstamp---a_l,
.comment-pub-t-stamp-dtstamp---a_l,
.commenter-name---a_l,
.comment-reply-axn---a_l,
.adjacent-navi---a_l,
.page-navi---a_l,
.show-more-axn---a_l,
.edit-post-axn---a_l,
.post-navi---a_l,
.post-navi---g_l,
.edit-com-axn---a_l,
.signed-in-account-name---a_l,
.account-log-out-axn---a_l,
.comments-navi---a_l,
.type-attachment .post-navi a,
.show-more-glabel---g_l,
.breadcrumbs-navi---a_l,
.breadcrumbs-navi---g_l,
.comment-reply-cancel-axn---a_l,
.comment-subscription-form .subscribe-label,
.main-description--empty .main-name---a,
.site-main-name---a_l,
.site-main-desc---a_l
{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    
    min-width: var(--elem--width--md);
    min-height: var(--elem--height--md);
}







/* ------------------ Forms, Active Objects ------------------ */
.input-text,
input[type="password"],
input[type="submit"],
select,
.b
{
    /* Reset */
    padding: 0;
    margin: 0;
    border: 0;
    background-color: transparent;
    
    width: 100%;
}




/* ------------------ Forms ------------------ */

/* Textboxes */
.input-text,
input[type="text"],
input[type="password"],
select
{
    padding: .5em;
    width: 100%;
    border: 1px solid var(--input-text--border-color);
}

.input-text--textarea
{
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/* Buttons */
.b_l,
input[type="submit"]
{
    padding: .5em 1em;
    width: 100%;
    background-color: var(--button--pri--bg-color);
    color: var(--button--pri--fg-color);
}

select
{
    height: 3rem;
}





/* ------------------ Focusing, Tap Highlight ------------------ */
.tab-key--inactive .input-text:focus,
.tab-key--inactive .b:focus
{
    outline: none;
}

.input-text,
.b
{
    -webkit-tap-highlight-color: transparent;
}





/* ------------------ Data Format ------------------ */
.data-format
{
    padding-left: 0;
    padding-right: 0;
    
    overflow-x: auto;
}





/* ------------------ Data Format - <img> ------------------ */
.window--unloaded .post-content img
{
    visibility: hidden;
}

.data-format img
{
    width: 100%;
}





/* ------------------ Data Format - <pre> ------------------ */
.data-format > pre
{
    padding: var(--content--spacing);
}

.data-format--pre
{
    overflow-y: hidden;
}





/* ------------------ Data Format - <iframe> ------------------ */
.data-format iframe[src*="youtube.com/"]
{
    width: 100vw;
    height: calc( var(--aspect-ratio--hd) * 1vw );
}





/* ------------------ Main Nav ------------------ */
.main-nav---cr
{
    background-color: var(--main-nav--bg-color);
}

.main-nav---ct_cr > .menu > ul
{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.main-nav---ct_cr > .menu > ul > li > a
{
    display: flex;
    justify-content: center;
}

.main-nav---ct_cr > .menu > ul > li > a > .main-navi---a_l
{
    justify-content: center;
}

.main-nav a
{
    color: var(--easy-access-nav-func--main-nav--fg-color);
    
    white-space: nowrap;
}


/* ------------ Sub-Nav ------------ */
.main-nav .sub-nav--active
{
    z-index: 99;
}

.main-nav .page_item_has_children > .children,
.main-nav .menu-item-has-children > .sub-menu
{
    position: absolute;
    top: 100%;
    z-index: 99;
}

.main-nav .sub-nav-toggle:hover .icon--vector
{
    width: calc( .75rem + .1rem );
    height: calc( .75rem + .1rem );
}

/* Root Nav Item Indicator */
.main-nav---ct_cr > .menu > ul > li > a > .main-navi---a_l:hover
{
    position: relative;
}

/* Root Nav Item Indicator */
.main-nav---ct_cr > .menu > ul > li > a > .main-navi---a_l:hover::before
{
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    
    width: 100%;
    height: var(--easy-access-nav-func--indicator--height);
    
    background-color: var(--easy-access-nav-func--navi--root--indicator);
}

/* Root Nav Item - Current Indicator */
.main-nav---ct_cr > .menu > ul > .current_page_item > a > .main-navi---a_l
{
    position: relative;
}

/* Root Nav Item -Current Indicator */
.main-nav---ct_cr > .menu > ul > .current_page_item > a > .main-navi---a_l::before
{
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    
    width: 100%;
    height: var(--easy-access-nav-func--indicator--height);
    
    background-color: var(--easy-access-nav-func--navi--current-ancestor--indicator);
}

/* Root Nav Item - Current Ancestor Indicator */
.main-nav---ct_cr > .menu > ul > .current_page_ancestor > a > .main-navi---a_l
{
    position: relative;
}

/* Root Nav Item - Current Ancestor Indicator */
.main-nav---ct_cr > .menu > ul > .current_page_ancestor > a > .main-navi---a_l::before
{
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    
    width: 100%;
    height: var(--easy-access-nav-func--indicator--height);
    
    background-color: var(--easy-access-nav-func--navi--current-ancestor--indicator);
}

/* Branch Nav Item - Current Indicator */
.main-nav---ct_cr > .menu > ul > .page_item_has_children > .children .current_page_item > a,
.main-nav---ct_cr > .menu > ul > .menu-item-has-children > .sub-menu .current-menu-item > a
{
    position: relative;
}

/* Branch Nav Item - Current Indicator */
.main-nav---ct_cr > .menu > ul > .page_item_has_children > .children .current_page_item > a::before,
.main-nav---ct_cr > .menu > ul > .menu-item-has-children > .sub-menu .current-menu-item > a::before
{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    
    width: var(--easy-access-nav-func--indicator--width);
    height: 100%;
    
    background-color: var(--accent-color--pri);
}

/* Branch Nav Item - Current Indicator - Hover */
.main-nav---ct_cr > .menu > ul > .page_item_has_children > .children .current_page_item > a:hover::before,
.main-nav---ct_cr > .menu > ul > .menu-item-has-children > .sub-menu .current-menu-item > a:hover::before
{
    background-color: var(--accent-color--pri);
}

/* Branch Nav Item Indicator */
.main-nav---ct_cr > .menu > ul > .page_item_has_children > .children a:hover,
.main-nav---ct_cr > .menu > ul > .menu-item-has-children > .sub-menu a:hover
{
    position: relative;
}

/* Branch Nav Item Indicator */
.main-nav---ct_cr > .menu > ul > .page_item_has_children > .children a:hover::before,
.main-nav---ct_cr > .menu > ul > .menu-item-has-children > .sub-menu a:hover::before
{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    
    width: var(--easy-access-nav-func--indicator--width);
    height: 100%;
    
    background-color: var(--easy-access-nav-func--navi--branch--indicator);
}

/* Branch Nav Item - Current Indicator */
.main-nav---ct_cr > .menu > ul > .page_item.current_page_item > a > .main-navi---a_l::before,
.main-nav---ct_cr > .menu > ul > .menu-item.current-menu-item > a > .main-navi---a_l::before
{
    background-color: var(--accent-color--pri);
}

/* Branch Nav Item */
.main-nav .page_item_has_children > .children > .page_item,
.main-nav .menu-item-has-children > .sub-menu > .menu-item
{
    padding-left: initial;
    
    background-color: var(--easy-access-nav-func--sub-nav--bg-color);
}

/* Sub-Menu */
.main-nav .children,
.main-nav .sub-menu
{   
    /* Specific width */
    max-width: 30rem;
    min-width: 100%;
}

/* Sub-Menu of Nav Item */
.main-nav .page_item_has_children .children,
.main-nav .menu-item-has-children .sub-menu
{
    transform: translate( .5rem, -.5rem );
}

/* Root Sub-Menu */
.main-nav---ct_cr > .menu > ul > .page_item_has_children > .children,
.main-nav---ct_cr > .menu > ul > .menu-item-has-children > .sub-menu
{
    transform: translate( 0, -.5rem );
}

.main-nav .page_item_has_children > .children > .page_item > a,
.main-nav .menu-item-has-children > .sub-menu > .menu-item > a
{
    border: 1px solid var(--easy-access-nav-func--sub-nav--border-color);
    border-top: 0;
    border-bottom: 0;
}

.main-nav .page_item_has_children > .children > .page_item:first-child > a,
.main-nav .menu-item-has-children > .sub-menu > .menu-item:first-child > a
{
    border: 1px solid var(--easy-access-nav-func--sub-nav--border-color);
}

.main-nav .page_item_has_children > .children > .page_item:first-child.sub-nav--inactive > a,
.main-nav .menu-item-has-children > .sub-menu > .menu-item:first-child.sub-nav--inactive > a
{
    border-bottom: 0;
}

.main-nav .page_item_has_children > .children > .page_item:last-child > a,
.main-nav .menu-item-has-children > .sub-menu > .menu-item:last-child > a
{
    border: 1px solid var(--easy-access-nav-func--sub-nav--border-color);
    border-top: 0;
}

.main-nav .page_item_has_children > .children > .page_item:only-child > a,
.main-nav .menu-item-has-children > .sub-menu > .menu-item:only-child > a
{
    border: 1px solid var(--easy-access-nav-func--sub-nav--border-color);
}

.main-nav .page_item_has_children > .children > .page_item.current_page_item > a,
.main-nav .menu-item-has-children > .sub-menu > .menu-item.current-menu-item > a
{
    border-left-color: var(--accent-color--pri);
}





/* ------------------ Sub-Navigation ------------------ */
.main-nav a,
.main-navi---a_l,
.widget_nav_menu a,
.widget_pages a
{
    display: inline-flex;
    align-items: center;
    
    min-width: var(--elem--width--md);
    min-height: var(--elem--height--md);
}

.main-nav a,
.widget_nav_menu a,
.widget_pages a
{   
    padding-left: var(--content--spacing-x);
    padding-right: var(--content--spacing-x);
    
    text-decoration: none;
}

.page_item_has_children > .children > .page_item,
.menu-item-has-children > .sub-menu > .menu-item
{
    padding-left: 1rem;
}






/* ------------------ Media Banner ------------------ */
.main-media-banner---g
{
    padding-bottom: calc( var( --aspect-ratio--16-9 ) );
    
    width: 100%;
    height: 0;
    
    background-size: cover;
    background-position: center;
    
    overflow: hidden;
}

.main-media-banner img
{
    width: 100%;
    height: auto;
}





/* ------------------ Edit Post ------------------ */
.edit-post-action
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}





/* ------------------ Edit Comment ------------------ */
.edit-comment-action
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}





/* ------------------ Table ------------------ */
.post-content table
{
    width: 100%;
    
    word-break: normal;
}





/* ------------------ Iframe ------------------ */
.post-content iframe
{
    width: 100%;
    height: auto;
}





/* ------------------ Embed ------------------ */
.post-content embed
{
    width: 100%;
    height: auto;
}





/* ------------------ Figure ------------------ */
.post-content figure
{
    margin: 0;
}





/* ------------------ Headings ------------------ */
h1, h2, h3, h4, h5, h6
{
    margin: 0;
}





/* ------------------ Categories ------------------ */
.apl-categories .categories---cr
{
    padding-top: calc( var(--component--spacing-y) / 2 );
    padding-bottom: calc( var(--component--spacing-y) / 2 );
}

.post-categories-glabel
{
    padding: var(--object--spacing--md);
}





/* ------------------ Tags ------------------ */
.post-tags---cr
{
    padding-top: var(--component--spacing-y);
    padding-bottom: var(--component--spacing-y);
}

.post-tags-glabel
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}





/* ------------------ Search ------------------ */
.aside .search-form-reset-axn---b_l,
.post-content .search-form-reset-axn---b_l
{
    background-color: var(--sec-axn-bg-color);
    color: var(--sec-axn-fg-color);
}

.post-content .search-term-crt-search-text-input,
.post-content .search-form-search-axn,
.post-content .search-form-reset-axn,
.aside .search-term-crt-search-text-input,
.aside .search-form-search-axn,
.aside .search-form-reset-axn
{
    padding-top: var(--object--spacing-y--sm);
    padding-bottom: var(--object--spacing-y--sm);
}





/* ------------------ Main Content ------------------ */
.main-content a
{
    color: hsl(215, 100%, 45%);
    color: var(--links--fg-color);
}

.main-content a:hover
{
    text-decoration: none;
}

.main-content-heading
{
    padding: var(--object--spacing--md);
}

.main-content-heading---h_l
{
    word-break: break-word;
}





/* ------------------ Main Post Title ------------------ */
.main-post-title---h_l
{
    word-break: break-word;
}

.main-post-title---a_l
{
    display: inline;
    
    word-break: break-word;
}

.main-post-title
{
    padding: var(--object--spacing--md);
}





/* ------------------ Multisite Directory ------------------ */
.site-main-name
{
    padding: var(--object--spacing--md);
}

.site-main-description
{
    padding: var(--object--spacing--md);
}





/* ------------------ General Content ------------------ */
.post-content,
.post-excerpt,
.comment-content
{
    font-size: var(--content--font-size);
}

.post-content,
.post-excerpt,
.comment-content,
.widget-content
{
    word-break: break-word;
}

.post-content---ct_cr > *,
.post-excerpt---ct_cr > *,
.comment-content---ct_cr > *,
.widget-content---ct_cr > *
{
    margin: 0;
    padding: var(--content--spacing);
    
    line-height: 1.6;
}

.post-content---ct_cr > ul,
.post-content---ct_cr > ol,
.post-excerpt---ct_cr > ul,
.post-excerpt---ct_cr > ol,
.comment-content---ct_cr > ul,
.comment-content---ct_cr > ol,
.widget-content---ct_cr > ul,
.widget-content---ct_cr > ol
{
    padding-left: 2.25em;
}

.post-content---ct_cr li,
.post-excerpt---ct_cr li,
.comment-content---ct_cr li,
.widget-content---ct_cr li
{
    padding-top: var(--list--spacing-y--xsm);
    padding-bottom: var(--list--spacing-y--xsm);
}

.widget-content---ct_cr > select
{
    margin: var(--content--spacing);
}

.widget-content---ct_cr > img
{
    padding: 0;
}

.post-content input,
.post-content button
{
    font-size: initial;
}

.post-content .twitter-tweet
{
    margin: 0 !important;
    width: 100% !important;
}

/* Gallery */
.post-content---ct_cr > .gallery
{
    padding-left: 0;
    padding-right: 0;
}

.post-content---ct_cr .gallery-item
{
    padding-top: var(--content--spacing-y);
    padding-bottom: var(--content--spacing-y);
}

/* Caption */
.post-content---ct_cr .wp-caption-text
{
    padding: var(--content--spacing);
    
    font-size: var(--caption--font-size);
}

.post-content---ct_cr .content--table,
.comment-content---ct_cr .content--table
{
    padding-left: 0;
    padding-right: 0;
}

.post-content td,
.post-content th,
.comment-content td,
.comment-content th
{
    padding: .5rem 1rem;
}

/* Content Image */
.content--image
{
    padding-left: 0;
    padding-right: 0;
}

.post-content---ct_cr > figure
{
    padding-left: 0;
    padding-right: 0;
}

/* WP Audio Shortcode */
.post-content---ct_cr > .wp-audio-shortcode
{
    padding: 0;
}

.post-content---ct_cr blockquote > *
{
    margin: 0;
    padding-top: var(--content--spacing-y);
    padding-bottom: var(--content--spacing-y);
}

.post-content---ct_cr blockquote > *:only-child
{
    padding-top: 0;
    padding-bottom: 0;
}

/* Pre */
.post-content pre
{
    margin: 0;
}





/* ------------------ Post ------------------ */
.post---cr
{
    padding-top: var(--component--spacing-y);
    padding-bottom: var(--component--spacing-y);
}




/* ------------------ Post Excerpt ------------------ */
.post-excerpt---ct_cr
{
    padding: var(--content--spacing);
}

.post-excerpt---ct_cr > *
{
    padding: 0;
}

.show-more-glabel
{
    padding-top: var(--object--spacing-y);
    padding-bottom: var(--object--spacing-y);
}





/* ------------------ Author Avatar ------------------ */

.author-avatar-default--blank .author-avatar,
.author-avatar-default--blank .post-author---ct_cr > .space---sep,

.commenter-avatar-default--blank .commenter-avatar,
.commenter-avatar-default--blank .commenter---ct_cr > .space---sep
{
    display: none;
}





/* ------------------ Main Header ------------------ */
.main-header---cr
{
    min-height: var(--elem--height--md);
    background-color: var(--main-header--bg-color);
}





/* ------------------ Main Info ------------------ */
.main-info---cr
{
    min-height: var(--elem-dimension--md);
    
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}

/* With Main Search */
.applicator--main-search .main-info---cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--elem-dimension--md);
}

/* With Main Menu */
.applicator--main-menu.main-header-aside--enabled .main-info---cr
{
    padding-left: var(--elem-dimension--md);
}

/* With Main Logo */
.main-logo--enabled .main-info---cr
{
    padding-left: var(--component--spacing-x);
}

.main-info---ct_cr
{
    position: relative;
    
    min-height: var(--elem-dimension--md);
}

/* With Main Logo and Main Name, Main Description */
.main-logo--enabled .main-name,
.main-logo--enabled .main-description
{
    padding-left: calc( var(--main-logo--height) + .5rem );
}

/* With Main Menu */
.applicator--main-menu.main-header-aside--enabled .main-name---a_l,
.applicator--main-menu.main-header-aside--enabled .main-desc---a_l
{
    padding-left: 0;
}

/* With Main Logo */
.main-logo--enabled .main-name---a_l,
.main-logo--enabled .main-desc---a_l
{
    padding-left: 0;
}

/* With Main Search */
.applicator--main-search .main-name---a_l,
.applicator--main-search .main-desc---a_l
{
    padding-right: 0;
}

/* With Main Search and No Logo and Main Menu */
.applicator--main-search.main-header-aside--disabled.main-logo--disabled .main-name---a_l,
.applicator--main-search.main-header-aside--disabled.main-logo--disabled .main-desc---a_l
{
    padding-left: 0;
    padding-right: 0;
}

/* Text Truncate */
.main-name---h,
.main-desc---g
{
    max-width: 100%;
}

/* Text Truncate */
.main-name---a_l,
.main-desc---a_l
{
    display: block;
    /*
    padding-left: var(--glabel--spacing);
    padding-right: var(--glabel--spacing);
    */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}





/* ------------------ Post Nav ------------------ */
.post-nav---grp
{
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
}

.type-post .post-navi,
.type-page .post-navi
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}

.parent-post-navigation-glabel
{
    display: inline-block;
    vertical-align: middle;
    
    margin-right: var(--glabel--between--spacing);
}

.type-attachment .post-navi
{
    display: inline-block;
    vertical-align: middle;
}

.type-attachment .post-nav---cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}





/* ------------------ Entry Nav ------------------ */
.entry-nav---cr
{
    padding-top: var(--component--spacing-y);
    padding-bottom: var(--component--spacing-y);
}





/* ------------------ Breadcrumbs Nav ------------------ */
.breadcrumbs-navi--ancestor
{
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
}

.breadcrumbs-navi---a
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}

.breadcrumbs-navi--current
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}




/* ------------------ Main Name ------------------ */
.main-name
{
    display: flex;
    
    max-width: 100%;
    
    transform: translateY( .25rem );
}

.main-name---h
{
    /* Reset */
    font-weight: normal;
    
    font-size: 1.125rem;
}

.main-description--empty .main-name
{
    align-items: center;
    height: var(--elem-dimension--md);
    transform: translateY( 0 );
}

.main-name---a
{
    color: var(--pri-fg-reverse-color);
    
    text-decoration: none;
}

.main-description--empty .main-name---a
{
    display: flex;
}





/* ------------------ Main Description ------------------ */
.main-description
{
    display: flex;
    
    max-width: 100%;
    
    transform: translateY( .125rem );
}

.main-desc---a
{
    text-decoration: none;
    
    color: hsla( 100, 100%, 100%, .75 );
}

.main-desc---a_l
{
    font-size: .75rem;
}





/* ------------------ Main Logo  ------------------ */
.main-logo
{
    position: absolute;
    left: 0;
    top: 50%;
    
    margin-top: calc( ( var(--main-logo--height) / 2 ) * -1 );
    
    max-width: 100%;
    height: var(--main-logo--height);
    
    z-index: 1;
}

.main-logo .custom-logo-link
{
    display: inline-block;
    
    height: 100%;
}

.main-logo .custom-logo
{
    width: auto;
    max-width: none;
    height: 100%;
}





/* ------------------ Copyright Info ------------------ */
.window--unloaded .copyright
{
    visibility: hidden;
    min-height: 3rem;
}

.copyright
{
    padding-left: var(--section--spacing-x);
    padding-right: var(--section--spacing-x);
}
.copyright---g
{
    text-align: center;
}

.copyright---g_l
{
    font-size: .75rem;
}

.applicator--go-start-nav--active .copyright
{
    padding-left: var(--spacing--toggle-allowance);
    padding-right: var(--spacing--toggle-allowance);
}

.page--short .copyright
{
    position: fixed;
    left: 0;
    bottom: 0;
    
    width: 100%;
}





/* ------------------ Image Captions ------------------ */
.wp-caption
{
    width: auto !important;
    max-width: 100%;
}

.wp-caption img[class*="wp-image-"]
{
    display: block;
    
    width: 100%;
}





/* ------------------ Raster Icons ------------------ */
.icon--raster
{
    background-image: url( ../img/raster-icons.png );
    background-size: auto 32px;
    background-repeat: no-repeat;
}

.icon--raster.burger-icon
{
    background-position: -32px -16px;
}

.icon--raster.search-icon
{
    background-position: -64px -16px;
}

.icon--raster.arrow-icon
{
    background-size: auto 24px;
    background-position: 0 0;
}

.icon--raster.dismiss-icon
{
    background-size: auto 24px;
    background-position: -36px 0;
}

.main-search-func .icon--raster.dismiss-icon
{
    background-position: -36px -12px;
}

.icon--raster.arrow-up-2-icon
{
    background-position: -16px 0;
}





/* ------------------ Entry Nav ------------------ */
.entry-navi
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}





/* ------------------ Comments ------------------ */
.comment---cr
{
    padding-top: var(--component--spacing-y);
    padding-bottom: var(--component--spacing-y);
}

.published-comment-glabel
{
    display: inline-block;
    vertical-align: middle;
    
    margin-right: var(--glabel--between--spacing);
}

.comment-published-date-and-time-stamp
{
    display: inline-block;
    vertical-align: middle;
}

.comment-published-date-stamp-dtstamp
{
    display: inline-block;
    vertical-align: middle;
}

.comment-published-time-stamp-dtstamp
{
    display: inline-block;
    vertical-align: middle;
}

.comment-pub---cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}

.comments-heading
{
    padding: var(--object--spacing--md);
}

.comment-title
{
    padding: var(--object--spacing--md);
}

.commenter-comment-creation-text-input
{
    /* Correction */
    margin-bottom: -5px;
}

.comments---grp,
.comment .children
{
    /* Reset */
    list-style: none;
    margin: 0;
    padding: 0;
}

.comment .comment
{
    margin-left: 1rem;
}

.children > .comment-respond
{
    margin-left: 2rem;
}

/* Target */
#comments:target,
#comments *:target,
#respond *:target
{
    animation: fade-highlight 2s ease;
}

@keyframes fade-highlight {
    0%
    {
        background-color: hsla( 56, 100%, 50%, .125 );
    }
    100%
    {
        background-color: transparent;
    }
}

.commenter-com-crt---cr,
.commenter-name-crt---cr,
.commenter-email-crt---cr,
.commenter-url-crt---cr
{
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.comment-form .flabel
{
    padding-left: var(--content--spacing-x);
    padding-right: var(--content--spacing-x);
}

.comment-form .felem
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
    padding-top: var(--object--spacing-y--sm);
    padding-bottom: var(--object--spacing-y--sm);
}

.comment-form .form-submit
{
    margin: 0;
    padding: var(--component--spacing--md);
}

#cancel-comment-reply-link
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}

.comment-subscription-form
{
    display: flex;
    
    margin: 0;
    padding-left: var(--content--spacing-x);
    padding-right: var(--content--spacing-x);
}

.comment-subscription-form input
{
    flex: 1 2rem;
    
    width: 3rem;
    height: 3rem;
}

.comment-form .comment-subscription-form .subscribe-label
{
    flex: 1 100%;
    display: inline-flex !important;
    justify-content: normal;
    align-items: center;
}





/* ------------------ Commenter ------------------ */
.commenter-name,
.published-commenter-glabel
{
    display: inline-block;
    vertical-align: middle;
    
    margin-right: var(--glabel--between--spacing);
}

.commenter,
.commenter-avatar
{
    display: inline-block;
    vertical-align: middle;
}

.commenter-name---a_l
{
    word-break: break-word;
}

.commenter-avatar---a_l
{
    display: block;
    
    width: var(--commenter-avatar--width);
    height: var(--commenter-avatar--height);
}

.commenter-avatar .avatar
{
    display: block;
    
    width: 100%;
    height: auto;
}

.published-com-commenter---cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}

.comment-reply-axn
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}

.comment-creation-glabel
{
    padding: var(--object--spacing--md);
}

.comment-form .validity-note
{
    padding-top: 0;
    padding-bottom: 0;
}





/* ------------------ Comments Nav ------------------ */
.comments-navi
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}





/* ------------------ Signed In Account ------------------ */
.signed-in-acct---ct_cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}

.signed-in-acct---fr_cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}

.signed-in-account-glabel
{
    display: inline-block;
    vertical-align: middle;
    
    margin-right: var(--glabel--between--spacing);
}

.signed-in-account-name
{
    display: inline-block;
    vertical-align: middle;
}





/* ------------------ Post Password Form ------------------ */
.post-password-form input[type="password"]
{
    margin-top: var(--object--spacing-y--sm);
    margin-bottom: var(--object--spacing-y--sm);
}

.post-password-form input[type="submit"]
{
    margin-top: var(--content--spacing-y);
    margin-bottom: var(--content--spacing-y);
}

.post-password-form label .text-node
{
    font-size: 1rem;
}




/* ------------------ Note ------------------ */
.note
{
    padding-top: var(--object--spacing-y--sm);
    padding-bottom: var(--object--spacing-y--sm);
}

.note p
{
    margin: 0;
}

.note .g_l,
.note .l
{
    display: block;
}

.note .l > *
{
    margin: 0;
    padding: var(--content--spacing);
}




/* ------------------ Post Published, Modified ------------------ */
.post-pub---cr,
.post-mod---cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}

.post-published-date-and-time-stamp,
.post-modified-date-and-time-stamp
{
    display: inline-block;
    vertical-align: middle;
}

.post-published-glabel,
.post-modified-glabel
{
    display: inline-block;
    vertical-align: middle;
    
    margin-right: var(--glabel--between--spacing);
}





/* ------------------ Author ------------------ */
.author-name,
.post-published-by-glabel
{
    
    display: inline-block;
    vertical-align: middle;
    
    margin-right: var(--glabel--between--spacing);
}

.post-author,
.author-avatar
{
    display: inline-block;
    vertical-align: middle;
}

.published-post-author---cr
{
    padding-left: var(--component--spacing-x);
    padding-right: var(--component--spacing-x);
}

.author-name---a_l
{
    word-break: break-word;
}

.author-avatar---a_l
{
    display: block;
    
    width: var(--author-avatar--width);
    height: var(--author-avatar--height);
}

.author-avatar .avatar
{
    display: block;
    
    width: 100%;
    height: auto;
}





/* ------------------ Comments Actions Snippet ------------------ */
.comments-count-axn,
.add-comment-axn
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}





/* ------------------ Widgets ------------------ */
.widget---cr
{
    padding-top: var(--component--spacing-y);
    padding-bottom: var(--component--spacing-y);
}
.widget a
{
    color: var(--links--fg-color);
}

.widget .widget-content---ct_cr > .widget-heading
{
    padding: var(--object--spacing--md);
}

.widget a:hover
{
    text-decoration: none;
}

.widget_calendar table
{
    width: 100%;
}

.widget select
{
    width: calc( 100% - (var(--content--spacing-x) * 2) );
}

.widget_nav_menu .widget-content---ct_cr > *
{
    padding: 0;
}

#recentcomments:empty
{
    display: none;
}

.widget_media_image .widget---cr
{
    padding: 0;
}

.widget_tag_cloud a
{
    text-decoration: none;
}

.widget_tag_cloud a:hover
{
    text-decoration: underline;
}

.widget_media_image img
{
    width: 100%;
    height: auto;
}

/* Zero Length Widgets (no content or empty element is detected like <img>) */
.widget_calendar.widget--zero-length,
.widget_recent_comments.widget--zero-length
{
    display: none;
}

.widget_pages ul
{
    padding-left: 0;
}

.widget_pages li
{
    padding-top: 0;
    padding-bottom: 0;
}





/* ------------------ Go to Content Nav - Function ------------------ */
.applicator--go-content-nav.dom--unready .go-content-nav
{
    display: none;
}

.page--short .go-content-nav
{
    display: none;
}

.go-content-nav-func .go-to-content-navi
{
    position: fixed;
    left: 50%;
    top: 50%;
    
    transform: translate( -50%, -50%);
    
    transition: var(--transition--generic);
    transition-property: opacity;
}

.go-content-nav--inactive .go-to-content-navi
{
    opacity: 0;
    z-index: -1;
}

.go-content-nav--active .go-to-content-navi
{
    opacity: 1;
    z-index: 100;
}

/* Prevent Scroll on Root */
.applicator--go-content-nav--active
{
    overflow: hidden;
}

.go-ct-navi---a
{
    color: var(--go-content-nav--fg-color);
    
    text-decoration: none;
}

.go-ct-navi---a_l
{
    padding: .5em 1em;
    
    min-width: 10rem;
    
    background-color: var(--go-content-nav--bg-color);
}





/* ------------------ Go to Start Nav - Function ------------------ */
.applicator--go-start-nav.dom--unready .go-start-nav
{
    display: none;
}

.go-start-nav-func .go-to-start-navi
{   
    position: fixed;
    right: 0;
    bottom: 0;
    
    transition: var(--transition--generic);
    transition-property: opacity transform;
}

.go-start-nav--inactive .go-to-start-navi
{
    transform: translateY( 100% );
    
    opacity: 0;
    z-index: -1;
}

.go-start-nav--active .go-to-start-navi
{
    transform: translateY( 0 );
    
    opacity: 1;
    z-index: 100;
}

.go-start-nav-func .go-start-navi---a
{   
    display: block;
    
    color: var(--go-start-nav-func--fg-color);
    
    text-decoration: none;
}





/* ------------------ Comments - Function ------------------ */
.applicator--comments.dom--unready .comment-md---ct
{
    display: none;
}

.applicator--comments .comment-md---ct
{
    display: none;
}

.applicator--comments--active .comment-md---ct
{
    display: block;
}

.applicator--comments--inactive .comment-md---ct
{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 100%;
}

.applicator--comments .comments-toggle---b
{
    width: auto;
}

.applicator--comments .comments-toggle---b_l
{
    background-color: transparent;
    color: var(--links--fg-color);
}

.applicator--comments .show-hide---l
{
    margin-right: var(--glabel--between--spacing);
    
    text-decoration: underline;
}

.applicator--comments .comments-toggle---b:hover .show-hide---l
{
    text-decoration: none;
}




/* ------------------ Main Search - Function ------------------ */
.applicator--main-search.dom--unready .main-actions---ct_cr > .search
{
    display: none;
}

/* Main Search Positioning */
.main-search-func
{
    position: absolute;
    right: 0;
    top: 0;
}

.main-search--active
{   
    width: 100%;
    min-height: var(--elem--height--md);
}

/* Buttons */
.main-search-func .b_l
{
    padding: 0;
    background-color: transparent;
}

/* Hide Main Search Toggle - Right Spacing */
.main-search--active .main-search-toggle
{
    margin-right: var(--elem--dimension);
}

/* Main Search - Input Text */
.main-search-func .input-text
{
    /* Reset */
    padding: 0;
    border: 0;
    border-radius: 0;
    
    color: white;
}

/* Main Search - Input Text - Allowance for the actions */
.applicator--main-search.applicator--main-menu.main-header-aside--enabled .main-search-func .search-term-crt-search-text-input
{
    padding-left: var(--elem--dimension);
}

.applicator--main-search.applicator--main-menu.main-header-aside--disabled .main-search-func .search-term-crt-search-text-input
{
    padding-left: var(--content--spacing-x);
}

.main-search-func .search-term-crt-search-text-input
{
    padding-right: calc( var(--elem--dimension) * 2 );
}

/* Input Text - Hidden */
.main-search-func .search-term-crt-search-text-input
{
    position: fixed;
    left: 100%;
    right: 0;
    
    width: 100%;
    
    opacity: 0;
    
    transition: var(--transition--generic);
    transition-property: opacity;
}

/* Input Text - Visible */
.main-search--active .search-term-crt-search-text-input
{
    left: auto;
    opacity: 1;
}

/* Main Search Form Actions */
.main-search--inactive .search-form-axns
{
    z-index: 0;
}

.main-search-func .search-form-axns
{
    position: absolute;
    right: 0;
    top: 0;
}

.main-search--inactive .search-form-axns
{
    display: none;
}

/* Main Search Action Items */
.main-search-func .search-form-axns---ct_cr
{
    display: flex;
}

/* Main Search Action Items - Swap Positions of Search and Reset buttons */
.main-search-func .search-form-search-axn
{
    order: 1;
}

/* Main Search Toggle - Put Toggle on top if input is empty */
.main-search--active.main-search-input--empty .search---hr
{
    position: relative;
    z-index: 1;
}

/* Main Search Toggle */
.main-search-func .main-search-toggle
{
    position: absolute;
    right: 0;
    top: 0;
}

/* Icons */
.main-search-func .icon
{
    pointer-events: none;
}

/* Dismiss icons */
.main-search-func .dismiss-icon
{
    width: var(--dismiss-icon--width);
    height: var(--dismiss-icon--height);
}

/* Placeholder Text */
.main-search-func .search-term-crt-search---input-text::-webkit-input-placeholder
{
    color: var(--placeholder-reverse-color);
}

.main-search-func .search-term-crt-search---input-text::-moz-placeholder
{
    color: var(--placeholder-reverse-color);
}

.main-search-func .search-term-crt-search---input-text:-moz-placeholder
{
    color: var(--placeholder-reverse-color);
}

.main-search-func .search-term-crt-search---input-text:-ms-input-placeholder
{
    color: var(--placeholder-reverse-color);
}

/* Background color reset */
.applicator--main-search .main-actions---ct_cr > .search
{
    background-color: transparent;
}

.main-actions---ct_cr > .search
{
    background-color: white;
}

.main-search-toggle .search-icon
{
    transition: var(--transition--generic);
    transition-property: opacity;
}

.applicator--main-menu--active .main-search-toggle .search-icon
{
    opacity: 0;
}





/* ------------------ Main Menu - Function ------------------ */
.applicator--main-menu.dom--unready .main-header-aside
{
    display: none;
}

.main-menu-func
{
    /* Variables */
    --main-menu-func--height: 100vh;
    --main-menu-func--max-width: 30rem;
    
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    
    margin-right: var(--active-area--dimension--md);
    
    width: calc( 100% - var(--active-area--dimension--md) );
    max-width: var(--main-menu-func--max-width);
    height: var(--main-menu-func--height);
    
    transition: var(--transition--generic);
    transition-duration: .3s;
    transition-property: transform;
}

/* Hide the Main Menu */
.main-menu--inactive
{
    transform: translateX(-100%);
}

.main-menu--active
{
    z-index: 100;
}

.main-menu-func .main-hr-aside---cr
{
    height: var(--main-menu-func--height);
}

.main-menu-func .main-hr-aside---ct
{   
    height: var(--main-menu-func--height);
}

/* Scroll Area */
.main-menu-func .main-hr-aside---ct_cr
{   
    width: 100%;
    height: var(--main-menu-func--height);
    
    background-color: var(--main-header-aside--bg-color);
    
    overflow-y: auto;
    
    /*
    cursor: initial;
    */
}

/* Side Shadow */
.main-menu-func .main-hr-aside---ct_cr::before
{
    /* Shadow Gradient */
    content: '';
    position: absolute;
    left: 100%;
    top: 0;
    
    width: .5rem;
    height: var(--main-menu-func--height);
    
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.25+0,0+100 */
    background: -moz-linear-gradient(left, hsla(0,0%,0%,0.25) 0%, hsla(0,0%,0%,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, hsla(0,0%,0%,0.25) 0%,hsla(0,0%,0%,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, hsla(0,0%,0%,0.25) 0%,hsla(0,0%,0%,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#40000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */
    
    transition: var(--transition--generic);
    transition-property: opacity;
}

/* Hide Side Shadow */
.main-menu--inactive .main-hr-aside---ct_cr::before
{
    opacity: 0;
}

/* Show Side Shadow */
.main-menu--active .main-hr-aside---ct_cr::before
{
    opacity: 1;
}

/* Toggle Button */
.main-menu-func .main-hr-aside---hr
{
    position: relative;
    
    margin-right: var(--active-area--dimension--md);
    
    width: 100%;
    
    max-width: var(--main-menu-func--max-width);
}

.main-menu-toggle
{
    position: absolute;
    left: 100%;
    top: 0;
    z-index: 1;
}

.main-menu-tog---b
{
    width: initial;
}

.main-menu--active .main-menu-tog---b
{
    position: relative;
    z-index: 1;
}

.main-menu-tog---b_l
{
    padding: 0;
    background-color: transparent;
}

.main-menu-toggle .icon
{
    pointer-events: none;
}

.main-menu-toggle .dismiss-icon
{
    width: var(--dismiss-icon--width);
    height: var(--dismiss-icon--height);
}

.applicator--main-menu--active
{
    /* Prevent Scroll on Root */
    overflow: hidden;
}

/* Widgets and Main Menu */
.applicator--main-menu .widget:first-of-type .widget---cr
{
    margin-top: calc( var(--component--spacing-y) * -1 );
}

.applicator--main-menu .widget_media_image:first-of-type .widget---cr
{
    margin-top: 0;
}





/* ------------------ Sub-Navigation - Function ------------------ */
.applicator--sub-nav.dom--unready .main-nav .children,
.applicator--sub-nav.dom--unready .main-nav .sub-menu,
.applicator--sub-nav.dom--unready .widget_nav_menu .sub-menu,
.applicator--sub-nav.dom--unready .widget_pages .children
{
    display: none;
}

.applicator--sub-nav .page_item_has_children > a,
.applicator--sub-nav .menu-item-has-children > a
{
    padding-right: var(--spacing--toggle-allowance);
    width: 100%;
}

.sub-nav-func .page_item_has_children,
.sub-nav-func .menu-item-has-children
{
    position: relative;
}

.sub-nav-func .sub-nav-toggle
{
    position: absolute;
    right: 0;
    top: 0;
}

.sub-nav-func a,
.sub-nav-func .main-navi---a_l
{
    display: flex;
}

.sub-nav-toggle .icon
{
    pointer-events: none;
}

.sub-nav-func .sub-nav-toggle .arrow-icon
{
    width: var(--dismiss-icon--width);
    height: var(--dismiss-icon--height);
}

.sub-nav--active > .sub-nav-toggle .arrow-icon
{
    transform: rotate( 180deg );
}

.sub-nav-func .sub-nav-toggle .icon--raster.arrow-icon
{
    background-position: 0 -12px;
}

.sub-nav--inactive > .children,
.sub-nav--inactive > .sub-menu
{
    display: none;
}


/* Sub Nav Toggle Button - Branches */
.children .sub-nav-tog---b_l,
.sub-menu .sub-nav-tog---b_l
{
    color: var(--sub-nav-func-branches--toggle-button--fg-color);
}

.widget-content---ct_cr > * > ul > li > .sub-nav-toggle .sub-nav-tog---b_l
{
    color: var(--sub-nav-func-branches--toggle-button--fg-color);
}

.sub-nav-tog---b_l
{
    padding: 0;
    background-color: transparent;
    color: black;
}

.main-nav .children .sub-nav--others--active,
.main-nav .sub-menu .sub-nav--others--active
{
    visibility: hidden;
}

.sub-nav-func.widget_nav_menu li
{
    padding-top: 0;
    padding-bottom: 0;
}





/* ------------------ Page Nav - Function ------------------ */
.dom--unready .page-nav
{
    visibility: hidden;
}

.applicator--page-nav .page-nav .adjacent-navi a
{
    color: black;
}

.applicator--page-nav .page-nav .next-page-navi .icon--vector
{
    transform: rotate( -90deg );
}

.applicator--page-nav .page-nav .prev-page-navi .icon--vector
{
    transform: rotate( 90deg );
}





/* ------------------ WordPress Admin Bar - Function ------------------ */

/* Variables */
.wp-admin-bar--enabled
{
    --wp-admin-bar-allowance--narrow: 46px;
    --wp-admin-bar-allowance--wide: 32px;
    
    margin-top: auto !important;
}

.wp-admin-bar--enabled.vp--wp-admin-bar--narrow .main-menu-func
{
    --main-menu-func--height: calc( 100vh - var(--wp-admin-bar-allowance--narrow) );
}

.wp-admin-bar--enabled.vp--wp-admin-bar--wide .main-menu-func
{
    --main-menu-func--height: calc( 100vh - var(--wp-admin-bar-allowance--wide) );
}

/* WP Admin Bar */
.wpadminbar
{
    position: absolute !important;
}

/* Go to Content Nav */
.applicator--go-content-nav--active .wpadminbar
{
    z-index: 0 !important;
}

/* ------------ WP Admin Bar - Narrow ------------ */

/* Web Product */
.wp-admin-bar--enabled.vp--wp-admin-bar--narrow .web-product
{
    margin-top: var(--wp-admin-bar-allowance--narrow);
}

/* Main Menu */
.wp-admin-bar--enabled.vp--wp-admin-bar--narrow .main-menu-func
{
    margin-top: var(--wp-admin-bar-allowance--narrow);
}

/* Main Search */
.wp-admin-bar--enabled.vp--wp-admin-bar--narrow .main-search-func
{
    margin-top: var(--wp-admin-bar-allowance--narrow);
}

/* ------------ WP Admin Bar - Wide ------------ */

/* Web Product */
.wp-admin-bar--enabled.vp--wp-admin-bar--wide .web-product
{
    margin-top: var(--wp-admin-bar-allowance--wide);
}

/* Main Menu */
.wp-admin-bar--enabled.vp--wp-admin-bar--wide .main-menu-func
{
    margin-top: var(--wp-admin-bar-allowance--wide);
}

/* Main Search */
.wp-admin-bar--enabled.vp--wp-admin-bar--wide .main-search-func
{
    margin-top: var(--wp-admin-bar-allowance--wide);
}






/* ------------------ Page Nav ------------------ */
.page-nav li
{
    display: inline-block;
    vertical-align: middle;
}

.page-navi--current
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}

.page-navi:not( .adjacent-navi )
{
    padding-left: var(--object--spacing-x);
    padding-right: var(--object--spacing-x);
}






/* ------------------ Viewport Width: 560 ------------------ */

@media only screen and ( min-width: 35em )
{

    .post-content---ct_cr > .alignleft
    {   
        margin-right: 1rem;
        margin-bottom: 1rem;
    }

    .post-content---ct_cr > .alignright
    {   
        margin-left: 1rem;
        margin-bottom: 1rem;
    }

}





/* ------------------ Viewport Width: 768 ------------------ */

@media only screen and ( min-width: 48em )
{

    .main-media-banner---g
    {
        padding-bottom: var(--aspect-ratio--16-9);

    }

}





/* ------------------ Viewport Width: 1024 ------------------ */

@media only screen and ( min-width: 64em )
{

    .main-media-banner---g
    {
        padding-bottom: calc( var(--aspect-ratio--16-9) / 2 );

    }

}