/*
	Theme Name:   Jannah Child
	Theme URI:    http://jannah.tielabs.com/
	Description:  Jannh Child Theme
	Author:       TieLabs
	Author URI:   https://tielabs.com
	Template:     jannah
	Version:      1.0.0
	License:      license purchased
	License URI:  http://themeforest.net/licenses/regular_extended
	Tags:         Tags: two-columns, buddypress, left-sidebar, right-sidebar, custom-menu, editor-style, featured-images, full-width-template, microformats, rtl-language-support, sticky-post, threaded-comments, translation-ready
	Text Domain:  jannah-child
*/


/* write custom css after this line */

@import url(https://rsms.me/inter/inter.css);


/** GLOBALS **/
/* Base */
:root {
    --grid: 8px;

    --max-width:1376px;

    --spacing-1: var(--grid);
    --spacing-2: calc(var(--grid) * 2);
    --spacing-3: calc(var(--grid) * 3);
    --spacing-4: calc(var(--grid) * 4);
    --spacing-5: calc(var(--grid) * 5);
    --spacing-6: calc(var(--grid) * 6);
    --spacing-7: calc(var(--grid) * 7);
    --spacing-8: calc(var(--grid) * 8);


    /* Elevations */
    --elevation-1: 0px 1px 10px rgba(16, 28, 47, 0.06), 1px 0px 10px rgba(16, 28, 47, 0.06);
    --elevation-2: 0px 10px 30px rgba(16, 28, 47, 0.08), 0px 8px 22px rgba(16, 28, 47, 0.06), 0px 5px 10px rgba(16, 28, 47, 0.04);
    --elevation-3: 0px 25px 50px rgba(16, 28, 47, 0.1), 0px 15px 40px rgba(16, 28, 47, 0.08), 0px 8px 20px rgba(16, 28, 47, 0.06);


    /* Radius */
    --radius-1: var(--grid);
    --radius-2: calc(var(--grid) * 2);
    --radius-3: calc(var(--grid) * 3);
    --radius-4: calc(var(--grid) * 4);
    --radius-5: calc(var(--grid) * 5);
    --radius-6: calc(var(--grid) * 6);
    --radius-7: calc(var(--grid) * 7);
    --radius-8: calc(var(--grid) * 8);
    --radius-full: 9999px;


    /* Typography */
    --font-family: 'Inter', sans-serif;

    --p-size: 16px;
    --p-lineheight: 24px;
    --p-letterspacing: -0.011px;
    --p-weight: 300;

    --p-lg-size: 18px;
    --p-lg-lineheight: 24px;
    --p-lg-letterspacing: -0.014px;
    --p-lg-weight: 300;

    --p-sm-size: 14px;
    --p-sm-lineheight: 20px;
    --p-sm-letterspacing: 0px;
    --p-sm-weight: 300;

    --p-xs-size: 10px;
    --p-xs-lineheight: 16px;
    --p-xs-letterspacing: -0.01px;
    --p-xs-weight: 300;

    --h0-size: 72px;
    --h0-lineheight: 80px;
    --h0-letterspacing: -2.52px;
    --h0-weight: 900;

    --h1-size: 40px;
    --h1-lineheight: 44px;
    --h1-letterspacing: -0.022px;
    --h1-weight: 800;

    --h2-size: 34px;
    --h2-lineheight: 40px;
    --h2-letterspacing: -0.022px;
    --h2-weight: 800;

    --h3-size: 28px;
    --h3-lineheight: 32px;
    --h3-letterspacing: -0.021px;
    --h3-weight: 800;

    --h4-size: 24px;
    --h4-lineheight: 32px;
    --h4-letterspacing: -0.019px;
    --h4-weight: 700;

    --h5-size: 18px;
    --h5-lineheight: 24px;
    --h5-letterspacing: -0.017px;
    --h5-weight: 700;

    --h6-size: 16px;
    --h6-lineheight: 20px;
    --h6-letterspacing: -0.011px;
    --h6-weight: 700;

    /* Colors */
    --color-brand-primary-darkest: #00008b;
    --color-brand-primary-darker: #0033cf;
    --color-brand-primary: #0066ff;
    --color-brand-primary-lighter: #3385ff;
    --color-brand-primary-lightest: #66a3ff;

    --color-neutral-lowest: #ffffff;
    --color-neutral-low: #f6f7f7;
    --color-neutral-low-med: #e7eaef;
    --color-neutral-med: #3f4d62;
    --color-neutral-med-high: #27364c;
    --color-neutral-high: #101c2f;
    --color-neutral-highest: #000000;

    --contextual-destructive-darker:#800d04;
    --contextual-destructive:#b11206;
    --contextual-destructive-lightest:#ebc9c7;
}

/* Tablet */
@media (min-width: 768px) {
    :root {
        /* Typography */
        --h0-size: 104px;
        --h0-lineheight: 112px;
        --h0-letterspacing: -3.52px;

        --h1-size: 48px;
        --h1-lineheight: 56px;
        --h1-letterspacing: -0.022px;

        --h2-size: 40px;
        --h2-lineheight: 48px;
        --h2-letterspacing: -0.022px;

        --h3-size: 32px;
        --h3-lineheight: 40px;
        --h3-letterspacing: -0.021px;

        --h4-size: 24px;
        --h4-lineheight: 32px;
        --h4-letterspacing: -0.019px;

        --h5-size: 20px;
        --h5-lineheight: 24px;
        --h5-letterspacing: -0.017px;

        --h6-size: 16px;
        --h6-lineheight: 20px;
        --h6-letterspacing: -0.011px;
    }
}

/* Desktop */
@media (min-width: 1024px) {
    :root {
        /* Typography */
        --h0-size: 112px;
        --h0-lineheight: 114px;
        --h0-letterspacing: -4.52px;

        --h1-size: 60px;
        --h1-lineheight: 72px;
        --h1-letterspacing: -0.022px;

        --h2-size: 46px;
        --h2-lineheight: 56px;
        --h2-letterspacing: -0.022px;

        --h3-size: 436px;
        --h3-lineheight: 40px;
        --h3-letterspacing: -0.021px;

        --h4-size: 28px;
        --h4-lineheight: 32px;
        --h4-letterspacing: -0.019px;

        --h5-size: 20px;
        --h5-lineheight: 24px;
        --h5-letterspacing: -0.014px;

        --h6-size: 16px;
        --h6-lineheight: 20px;
        --h6-letterspacing: -0.011px;
    }
}

/** SYMANTIC **/
/* Base */
:root {

    --section-spacing: 56px;

    /* Background */
    --color-bg-body: var(--color-neutral-lowest);
    --color-bg-shade: var(--color-neutral-low);
    --color-bg-primary: var(--color-brand-primary);
    --color-bg-reverse: var(--color-neutral-high);

    /* Text */
    --color-text-header: var(--color-neutral-high);
    --color-text-body: var(--color-neutral-med);
    --color-text-muted: var(--color-neutral-low-med);
    --color-text-link: var(--color-brand-primary);
    --color-text-link-hover: var(--color-brand-primary-darker);
    --color-text-header-reverse: var(--color-neutral-low);
    --color-text-bod-reverse: var(--color-neutral-low);


    /* Borders */
    --color-border: var(--color-neutral-med);
    --color-border-muted: var(--color-neutral-low-med);

    /* Hero Banners */
    --hero-eyebrow-size: var(--h5-size);
    --hero-eyebrow-lineheight: var(--h5-lineheight);
    --hero-eyebrow-letterspacing: var(--h5-letterspacing);
    --hero-eyebrow-weight: var(--h5-weight);
    --hero-eyebrow-color: var(--color-brand-primary);

    --hero-title-size: var(--h1-size);
    --hero-title-lineheight: var(--h1-lineheight);
    --hero-title-letterspacing: var(--h1-letterspacing);
    --hero-title-weight: var(--h1-weight);
    --hero-title-color: var(--color-text-header);

    --hero-subtitle-size: var(--p-lg-size);
    --hero-subtitle-lineheight: var(--p-lg-lineheight);
    --hero-subtitle-letterspacing: var(--p-lg-letterspacing);
    --hero-subtitle-weight: var(--p-lg-weight);
    --hero-subtitle-color: var(--color-text-body);


    /* Section headers */
    --section-header-title-size: var(--h2-size);
    --section-header-title-lineheight: var(--h2-lineheight);
    --section-header-title-letterspacing: var(--h2-letterspacing);
    --section-header-title-weight: var(--h2-weight);
    --section-header-title-color: var(--color-text-header);

    --section-header-subtitle-size: var(--p-lg-size);
    --section-header-subtitle-lineheight: var(--p-lg-lineheight);
    --section-header-subtitle-letterspacing: var(--p-lg-letterspacing);
    --section-header-subtitle-weight: var(--p-lg-weight);
    --section-header-subtitle-color: var(--color-text-body);

    /* Cards */
    /* Default */
    --card-default-corner: var(--radius-2);
    --card-default-padding: 0;
    --card-default-body-padding: var(--spacing-3);
    --card-default-bg-color: var(--color-neutral-highest);
    --card-default-eyebrow-color: var(--color-neutral-med);
    --card-default-title-color: var(--color-neutral-highest);
    --card-default-desc-color: var(--color-neutral-highest);
    --card-default-image-corner: 0;

    /* Unstyled */
    --card-unstyled-corner: 0;
    --card-unstyled-padding: 0;
    --card-unstyled-body-padding: var(--spacing-3);
    --card-unstyled-bg-color: var(--color-neutral-highest);
    --card-unstyled-eyebrow-color: var(--color-neutral-med);
    --card-unstyled-title-color: var(--color-neutral-highest);
    --card-unstyled-desc-color: var(--color-neutral-highest);
    --card-unstyled-image-corner: var(--radius-2);


    /* Text */
    /* Eyebrow */
    --card-eyebrow-size: var(--p-size);
    --card-eyebrow-weight: var(--p-weight);
    --card-eyebrow-lineheight: var(--p-lineheight);
    --card-eyebrow-letterspacing: var(--p-letterspacing);

    --card-eyebrow-size-sm: var(--p-sm-size);
    --card-eyebrow-weight-sm: var(--p-sm-weight);
    --card-eyebrow-lineheight-sm: var(--p-sm-lineheight);
    --card-eyebrow-letterspacing-sm: var(--p-sm-letterspacing);

    /* Title */
    --card-title-size: var(--h4-size);
    --card-title-weight: var(--h4-weight);
    --card-title-lineheight: var(--h4-lineheight);
    --card-title-letterspacing: var(--h4-letterspacing);

    --card-title-size-lg: var(--h2-size);
    --card-title-weight-lg: var(--h2-weight);
    --card-title-lineheight-lg: var(--h2-lineheight);
    --card-title-letterspacing-lg: var(--h2-letterspacing);

    --card-title-size-md: var(--h3-size);
    --card-title-weight-md: var(--h3-weight);
    --card-title-lineheight-md: var(--h3-lineheight);
    --card-title-letterspacing-md: var(--h3-letterspacing);

    --card-title-size-sm: var(--h5-size);
    --card-title-weight-sm: var(--h5-weight);
    --card-title-lineheight-sm: var(--h5-lineheight);
    --card-title-letterspacing-sm: var(--h5-letterspacing);

    --card-title-size-xs: var(--h6-size);
    --card-title-weight-xs: var(--h6-weight);
    --card-title-lineheight-xs: var(--h6-lineheight);
    --card-title-letterspacing-xs: var(--h6-letterspacing);


    /* Description */
    --card-desc-size: var(--p-size);
    --card-desc-weight: var(--p-weight);
    --card-desc-lineheight: var(--p-lineheight);
    --card-desc-letterspacing: var(--p-letterspacing);

    --card-desc-size-sm: var(--p-sm-size);
    --card-desc-weight-sm: var(--p-sm-weight);
    --card-desc-lineheight-sm: var(--p-sm-lineheight);
    --card-desc-letterspacing-sm: var(--p-sm-letterspacing);












    /* Buttons */
    /* Primary*/
    --button-primary-bg: var(--color-brand-primary);
    --button-primary-border: var(--color-brand-primary);
    --button-primary-content: var(--color-neutral-low-med);
    --button-primary-bg-hover: var(--color-brand-primary-darker);
    --button-primary-border-hover: var(--color-brand-primary-darker);
    --button-primary-content-hover: var(--color-neutral-low-med);

    /* Regular */
    --button-radius: var(--radius-2);
    --button-padding: 12px var(--spacing-3);
    --button-font-size: var(--p-size);
    --button-lineheight: var(--p-lineheight);
    --button-letterspacing: var(--p-lineheight);


    /* Links */
    /* Primary*/
    --links-primary-color: var(--color-brand-primary);
    --links-primary-color-hover: var(--color-brand-primary-darker);

    /* Regular */
    --links-font-size: var(--p-size);
    --links-lineheight: var(--p-lineheight);
    --links-letterspacing: var(--p-lineheight);



    /* Images */
    --img-radius: var(--spacing-2);




    /* Forms */

    --form-label-size: var(--p-size);
    --form-label-color: var(--color-text-body);


    /* Input Text/Select */
    --input-bg:var(--color-neutral-lowest);
    --input-border: 1px solid var(--color-border);
    --input-radius: var(--radius-1);

    /* Regular */
    --input-padding:  12px var(--spacing-2);
    --input-text-size: var(--p-size);
    --input-text-lineheight: var(--p-lineheight);
    --input-text-letterspacing: var(--p-letterspacing);
    --input-text-weight-sm: var(--p-weight);

    /* Small */
    --input-sm-padding:  var(--spacing-1) 12px;
    --input-sm-text-size: var(--p-sm-size);
    --input-sm-text-lineheight: var(--p-sm-lineheight);
    --input-sm-text-letterspacing: var(--p-sm-letterspacing);
    --input-sm-text-weight-sm: var(--p-sm-weight);

}

/* Tablet */
@media (min-width: 768px) {
    :root {
        --section-spacing: 64px;

    }
}

/* Desktop */
@media (min-width: 1024px) {
    :root {
        --section-spacing: 128px;

        /* Cards */
        /* Default */
        --card-default-padding: 0;
        --card-default-body-padding: var(--spacing-4);


        /* Unstyled */
        --card-unstyled-padding: 0;
        --card-unstyled-body-padding: var(--spacing-4);

    }
}

/* Largest */
@media (min-width: 1375px) {
    :root {
        --section-spacing: 128px;
    }
}


/* Text */
.header0{
    font-size: var(--h0-size) !important;
    line-height: var(--h0-lineheight) !important;
    letter-spacing: var(--h0-letterspacing) !important;  
    font-weight: var(--h0-weight)!important;
}
.header1{
    font-size: var(--h1-size) !important;
    line-height: var(--h1-lineheight) !important;
    letter-spacing: var(--h1-letterspacing) !important;  
    font-weight: var(--h1-weight)!important;
}
.header2{
    font-size: var(--h2-size) !important;
    line-height: var(--h2-lineheight) !important;
    letter-spacing: var(--h2-letterspacing) !important;  
    font-weight: var(--h2-weight)!important;
}
.header3{
    font-size: var(--h3-size) !important;
    line-height: var(--h3-lineheight) !important;
    letter-spacing: var(--h3-letterspacing) !important;  
    font-weight: var(--h3-weight)!important;
}
.header4{
    font-size: var(--h4-size) !important;
    line-height: var(--h4-lineheight) !important;
    letter-spacing: var(--h4-letterspacing) !important;  
    font-weight: var(--h4-weight)!important;
}
.header5{
    font-size: var(--h5-size) !important;
    line-height: var(--h5-lineheight) !important;
    letter-spacing: var(--h5-letterspacing) !important;  
    font-weight: var(--h5-weight)!important;
}
.header6{
    font-size: var(--h6-size) !important;
    line-height: var(--h6-lineheight) !important;
    letter-spacing: var(--h6-letterspacing) !important;  
    font-weight: var(--h6-weight)!important;
}




/* Button */
.button {
    margin: 0 !important;
    border-radius: var(--button-radius) !important;
    padding: var(--button-padding) !important;
    font-size: var(--button-font-size) !important;
    line-height: var(--button-lineheight) !important;
    letter-spacing: var(--button-letterspacing) !important;
}

.btn-primary-reg {
    margin: 0 !important;
    border-radius: var(--button-radius) !important;
    padding: var(--button-padding) !important;
    font-size: var(--button-font-size) !important;
    line-height: var(--button-lineheight) !important;
   
    background-color: var(--button-primary-bg)!important;
    border-color: var(--button-primary-border)!important;
    color: var(--button-primary-content)!important;
}

.btn-primary-reg:hover {
    background-color: var(--button-primary-bg-hover)!important;
    border-color: var(--button-primary-border-hover)!important;
    color: var(--button-primary-content-hover)!important;
}


/* Arrow Link */
.link {
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    color: var(--links-primary-color) !important;
    font-size: var(--links-font-size) !important;
    line-height: var(--links-lineheight) !important;
    letter-spacing: var(--links-letterspacing) !important;
}

.link:hover {
    color: var(--links-primary-color-hover) !important;
}

.link:after {
    content: '→';
    margin-left: 4px;
    font-family: var(--font-family);
}


/* Typographhy */
p {
    font-size: var(--p-size) !important;
    line-height: var(--p-lineheight) !important;
    letter-spacing: var(--p-letterspacing) !important;
    color: var(--color-text-body) !important;
    margin: 0 0 var(--spacing-2) 0 !important;
}


/* Main Nav */
.main-menu-wrapper {
    position: static;
}

#main-nav-menu.header-menu .menu .menu-item {
    color: var(--color-text-header) !important;
    font-size: var(--p-size) !important;
    letter-spacing: var(--p-letterspacing) !important;
    font-weight: var(--p-weight) !important;
}

#main-nav-menu.header-menu .menu .menu-item:hover:after {
    background-color: var(--color-brand-primary);
    border-top-left-radius: var(--spacing-1);
    border-top-right-radius: var(--spacing-1);
    content: "";
    display: block;
    height: var(--spacing-1);
    width: 100%;
    margin-top: -8px !important;
}

#main-nav-menu.header-menu .menu .menu-item>a {
    padding: 0 var(--spacing-1) !important;
}

#main-nav-menu.header-menu .menu .menu-item:hover>a {
    background: none !important;
    color: var(--color-text-header) !important;
}

#main-nav-menu.header-menu .menu .menu-item>a:before {
    display: none !important;
}

#main-nav-menu.header-menu .menu .menu-item.current-menu-item {
    border: 0 !important;
}

#main-nav-menu.header-menu .menu .menu-item.current-menu-item>a:after {
    display: none !important;
}

#main-nav-menu.header-menu .menu .menu-item.current-menu-item>a {
    background: none !important;
    color: var(--color-text-header) !important;
}

#main-nav-menu.header-menu .menu .menu-item .mega-menu-block {
    border: 0px !important;
    background: var(--color-bg-shade);
    box-shadow: var(--elevation-2) !important;
    overflow: hidden;
}

#main-nav-menu.header-menu .menu .menu-item .mega-menu-block .mega-cat-sub-categories {
    background: var(--bg-default);
}

#main-nav-menu .mega-menu-content {
    max-width: var(--max-width);
    margin: 0 auto !important;
    float: none!important;
}

#main-nav-menu div>div>div>ul>li>a {
    padding: 0 0 var(--spacing-1) !important;
    color: var(--color-text-header) !important;
    font-size: var(--p-size) !important;
    letter-spacing: var(--p-letterspacing) !important;
    font-weight: var(--p-weight) !important;
}

#main-nav-menu div>div>div>ul>li>a:hover {
    color: var(--color-text-body) !important;
    text-decoration: underline;
}

#main-nav-menu div>div>div>ul>li>a.is-active {
    background-color: transparent !important;
    color: var(--color-text-body) !important;
    text-decoration: underline;
}

#main-nav-menu .mega-menu-post .post-thumb,
#main-nav-menu .mega-menu-post .post-thumb img,
#main-nav-menu .mega-recent-post .post-thumbnail img {
    border-radius: var(--img-radius) !important;
    margin: 0 !important;
}

#main-nav-menu .mega-menu-post .post-details {
    padding-top: var(--spacing-1) !important;
    display: flex;
    flex-direction: column-reverse;
}
#main-nav-menu .mega-menu-post .post-details .mega-menu-link {
    color: var(--card-unstyled-title-color) !important;
    font-size: var(--card-title-size-xs) !important;
    letter-spacing: var(--card-title-letterspacing-xs) !important;
    font-weight: var(--card-title-weight-xs) !important;
    line-height: var(--card-title-lineheight-xs) !important;
}
#main-nav-menu .mega-menu-post .post-details .post-meta {
    color: var(--card-unstyled-eyebrow-color) !important;
    font-size: var(--card-eyebrow-size-sm) !important;
    letter-spacing: var(--card-eyebrow-letterspacing-sm) !important;
    font-weight: var(--card-eyebrow-weight-sm) !important;
    line-height: var(--card-eyebrow-lineheight-sm) !important;
    margin: 0 0 4px 0 !important;
}
#main-nav-menu .mega-menu-post .post-details .post-meta .date:before {
    display: none !important;
}

#main-nav-menu .mega-recent-featured .mega-check-also .mega-menu-post .post-details {
    display: flex;
    padding:0!important;
}
#main-nav-menu .mega-recent-featured .mega-recent-post .post-meta {
    color: var(--card-unstyled-eyebrow-color) !important;
    font-size: var(--card-eyebrow-size-sm) !important;
    letter-spacing: var(--card-eyebrow-letterspacing-sm) !important;
    font-weight: var(--card-eyebrow-weight-sm) !important;
    line-height: var(--card-eyebrow-lineheight-sm) !important;
    margin: 0 0 4px 0 !important;
}
#main-nav-menu .mega-recent-featured .mega-recent-post .mega-menu-link {
    color: var(--card-unstyled-title-color) !important;
    font-size: var(--card-title-size-sm) !important;
    letter-spacing: var(--card-title-letterspacing-sm) !important;
    font-weight: var(--card-title-weight-sm) !important;
    line-height: var(--card-title-lineheight-sm) !important;
}




/* Desktop */
@media (min-width: 1024px) {
    #main-nav-menu.header-menu .menu .menu-item>a {
        padding: 0 var(--spacing-2) !important;
    }
}



/* Mobile Menu */

#mobile-menu-icon {
    margin: 0 !important;
    padding: 0 !important;
    width: var(--spacing-4) !important;
    height: var(--spacing-4) !important;
}

#mobile-menu-icon>span.tie-mobile-menu-icon.nav-icon.is-layout-1:before,
#mobile-menu-icon>span.tie-mobile-menu-icon.nav-icon.is-layout-1,
#mobile-menu-icon>span.tie-mobile-menu-icon.nav-icon.is-layout-1:after {
    background-color: var(--color-neutral-high) !important;
    margin-right: auto !important;
    left: 0 !important;
    ;
}

#mobile-menu-icon>span.tie-mobile-menu-icon.nav-icon.is-layout-1:before {
    width: var(--spacing-3) !important;
    transform: translateY(-8px) !important;
}

#mobile-menu-icon>span.tie-mobile-menu-icon.nav-icon.is-layout-1 {
    width: var(--spacing-4) !important;
}

#mobile-menu-icon>span.tie-mobile-menu-icon.nav-icon.is-layout-1:after {
    width: var(--spacing-3) !important;
    transform: translateY(8px) !important;
}

.side-aside.dark-skin {
    background-color: var(--color-bg-shade) !important;
}

.side-aside.dark-skin>div {
    margin: 0 !important;
    padding: var(--spacing-8) 0 0 !important;
}

.side-aside.dark-skin>div>a.close-side-aside {
    left: var(--spacing-5) !important;
    top: 20px !important;
}

.side-aside.dark-skin>div>a.close-side-aside:before {
    color: var(--color-text-header) !important;
}

.side-aside.dark-skin #mobile-container {
    padding: 0 !important;
}

.side-aside.dark-skin #mobile-container #mobile-menu {
    border-bottom: 1px solid var(--color-neutral-low-med) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.side-aside.dark-skin #mobile-container #mobile-menu li a {
    color: var(--color-text-header) !important;
    font-size: var(--h5-size) !important;
    letter-spacing: var(--h5-letterspacing) !important;
    font-weight: var(--h5-weight) !important;
    line-height: var(--h5-lineheight) !important;
    padding: var(--spacing-2) var(--spacing-2) var(--spacing-2) var(--spacing-4) !important;
    border-top: 1px solid var(--color-neutral-low-med) !important;
}

.side-aside.dark-skin #mobile-container #mobile-menu li a:hover {
    color: var(--color-text-link) !important;
}

.side-aside.dark-skin #mobile-container #mobile-social-icons {
    padding: var(--spacing-2) var(--spacing-2) var(--spacing-2) var(--spacing-4) !important;
    margin: 0 !important;
    border-bottom: 1px solid var(--color-neutral-low-med) !important;
}

.side-aside.dark-skin #mobile-container #mobile-social-icons ul {
    display: flex;
    gap: var(--spacing-1);
}

.side-aside.dark-skin #mobile-container #mobile-social-icons ul a:not(:hover) .tie-social-icon {
    color: var(--color-text-header) !important;
}

.side-aside.dark-skin #mobile-container #mobile-search {
    padding: var(--spacing-3) var(--spacing-4) var(--spacing-3) var(--spacing-4) !important;
    margin: 0 !important;
}

.side-aside.dark-skin #mobile-container #mobile-search>form {
    margin: 0 !important;
}

.side-aside.dark-skin #mobile-container #mobile-search .search-field {
    border-color: var(--color-border-muted) !important;
    border-radius: var(--radius-1);
    background-color: var(--color-bg-body);
    color: var(--color-text-body);
    padding: 12px var(--spacing-2) !important;
}

.side-aside.dark-skin #mobile-container #mobile-search .search-field::placeholder {
    color: var(--color-text-body);
}

.side-aside.dark-skin #mobile-container #mobile-search .search-submit {
    height: 100% !important;
}

.side-aside.dark-skin #mobile-container #mobile-search .search-form:after {
    color: var(--color-text-body) !important;
    line-height: var(--spacing-4) !important;
    width: var(--spacing-4) !important;
    top: var(--spacing-1) !important;
}




/* Slider */

.centered-title-slider .thumb-overlay .container{
    text-align: left!important;
}
.centered-title-slider .post-cat{
    background: var(--color-bg-primary) !important;
    padding: var(--spacing-1) 12px !important;
    font-size: var(--p-sm-size) !important;
    line-height: 1em !important;
    letter-spacing: var(--p-sm-letterspacing) !important;
    border-radius: var(--spacing-1);
}
.centered-title-slider .thumb-title{
    margin: 0!important;
    padding: var(--spacing-1) var(--spacing-2);
    background: var(--color-bg-reverse);
    border-radius: var(--radius-2);
}

/* Mag Title */
.mag-box-title {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    display: flex;
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: var(--spacing-4);
}

.mag-box-title h3 {
    color: var(--color-text-header) !important;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-4);
    margin: 0 !important;
}

.mag-box-title .mag-box-options {
    justify-content: space-between !important;
}

@media (min-width: 768px) {
    .mag-box-title {}
}

@media (min-width: 1024px) {
    .mag-box-title {
        flex-direction: row !important;
        align-items: flex-end !important;
    }

    .mag-box-title .mag-box-options {
        justify-content: flex-end !important;
    }
}



/* Filter links */
.mag-box-filter-links {
    overflow: visible !important;
    height: auto !important;
    padding: 0 !important;
}

.mag-box-filter-links li a {
    margin: 0 0 0 var(--spacing-2) !important;
    border: var(--color-neutral-low) 1px solid;
    padding: var(--spacing-1) var(--spacing-3) !important;
    border-radius: var(--radius-full);
    color: var(--color-text-body) !important;
    font-size: var(--p-sm-size) !important;
    line-height: var(--p-sm-lineheight) !important;
    letter-spacing: var(--p-sm-letterspacing) !important;
}

.mag-box-filter-links li a:hover {
    background: var(--color-neutral-low) !important;
    color: var(--color-text-body) !important;
    border-color: var(--color-neutral-low) !important;
}

.mag-box-filter-links li a.active {
    background: var(--color-brand-primary) !important;
    color: var(--color-neutral-lowest) !important;
}

.mag-box-filter-links.is-flex-tabs>li>ul.flexMenu-popup {
    transform: translateX(32px) translateY(32px) !important;
    padding: var(--spacing-2) !important;
    border-radius: var(--radius-2) !important;
    z-index: 5 !important;
}

.mag-box-filter-links.is-flex-tabs>li>ul.flexMenu-popup li a {
    border: none !important;
}

.mag-box-filter-links.is-flex-tabs>li>ul.flexMenu-popup li:first-child {
    border: none !important;
}

.mag-box-filter-links.is-flex-tabs>li>ul.flexMenu-popup li a:hover {
    background: var(--color-neutral-lowest) !important;
    color: var(--color-text-link) !important;
}

.mag-box-filter-links.is-flex-tabs>li>ul.flexMenu-popup li a.active {
    background: var(--color-neutral-lowest) !important;
    color: var(--color-text-link) !important;
}

@media (min-width: 768px) {
    .mag-box-filter-links.is-flex-tabs>li>ul.flexMenu-popup {
        transform: translateX(-110%) translateX(32px) !important;
    }

}

/* Slider Arrow Nav */
.slider-arrow-nav {
    flex: 0 0 auto !important;
    align-self: center;
}

.slider-arrow-nav a {
    border: none !important;
    width: var(--spacing-4) !important;
    height: var(--spacing-4) !important;
    border-radius: 100px !important;
    font-size: var(--p-lg-size) !important;
    line-height: var(--p--lg-lineheight) !important;
    letter-spacing: var(--p-lg-letterspacing) !important;
    background: var(--color-brand-primary) !important;
    color: var(--color-neutral-lowest) !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.slider-arrow-nav a:hover {
    background: var(--color-brand-primary-darker) !important;
}

.slider-arrow-nav a.pagination-disabled {
    background: var(--color-neutral-low) !important;
    color: var(--color-text-body) !important;
}




/* Post items */
.posts-items {
    margin: 0 !important;
}

.posts-items li {
    padding: 0 !important;
    margin: 0 !important;
}

.posts-items li .post-thumb {
    height: auto;
    margin: 0 !important;
    overflow: hidden;
}

.posts-items li .post-thumb img {
    border-radius: var(--spacing-2) !important;

}

.posts-items li .post-thumb .post-cat-wrap {
    top: var(--spacing-1) !important;
    left: var(--spacing-1) !important;

}

.posts-items li .post-thumb .post-cat-wrap .post-cat {
    background: var(--color-neutral-high) !important;
    padding: var(--spacing-1) 12px !important;
    font-size: var(--p-sm-size) !important;
    line-height: 1em !important;
    letter-spacing: var(--p-sm-letterspacing) !important;
    border-radius: var(--spacing-1);
}

.posts-items li .post-details {}

.posts-items li .post-details .post-meta {
    font-size: var(--p-sm-size) !important;
    line-height: var(--p-sm-lineheight) !important;
    letter-spacing: var(--p-sm-letterspacing) !important;
    font-weight: var(--p-sm-weight) !important;
    margin: 0 0 var(--spacing-2) 0 !important;
    color: var(--color-text-body) !important;
}

.posts-items li .post-details .post-meta a {
    color: var(--color-text-body) !important;
}

.posts-items li .post-details .post-title {
    font-size: var(--h4-size) !important;
    line-height: var(--h4-lineheight) !important;
    letter-spacing: var(--h4-letterspacing) !important;
    font-weight: var(--h4-weight) !important;
    margin: 0 0 var(--spacing-2) 0 !important;
    color: var(--color-text-header) !important;
}

.posts-items li .post-details .post-excerpt {
    font-size: var(--p-size) !important;
    line-height: var(--p-lineheight) !important;
    letter-spacing: var(--p-letterspacing) !important;
    font-weight: var(--p-weight) !important;
    margin: 0 0 var(--spacing-3) 0 !important;
    color: var(--color-text-body) !important;
}

.posts-items li .post-details .more-link {
    color: var(--color-brand-primary) !important;
    background: none !important;
    padding: 0 !important;
    font-size: var(--p-size) !important;
    line-height: var(--p-lineheight) !important;
    letter-spacing: var(--p-letterspacing) !important;
    margin: auto 0 0 !important;
    align-self: flex-start;
}

.posts-items li .post-details .more-link:after {
    content: '→';
    margin-left: 4px;
    font-family: var(--font-family);
}



/*Big posts-box */
.big-posts-box {
    padding-bottom: var(--section-spacing);
    margin: 0 !important;
}

.big-posts-box .mag-box-title {
    padding: 0 0 var(--spacing-8) 0 !important;
}

.big-posts-box .mag-box-title h3:before {
    background-color: var(--color-brand-primary);
    border-top-left-radius: var(--spacing-1);
    border-top-right-radius: var(--spacing-1);
    content: "";
    display: block;
    height: var(--spacing-1);
    width: 192px;
}

.big-posts-box .mag-box-title h3 {
    font-size: var(--section-header-title-size) !important;
    line-height: var(--section-header-title-lineheight) !important;
    letter-spacing: var(--section-header-title-letterspacing) !important;
    font-weight: var(--section-header-title-weight) !important;
    color: var(--section-header-title-color) !important;
}




.big-posts-box .posts-items {
    display: flex !important;
    gap: var(--spacing-4) !important;
    margin: 0 !important;
    flex-direction:column;

}
.big-posts-box .posts-items li {
    border-radius: var(--radius-2);
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: var(--elevation-1);
    display: flex;
    flex-direction: column;
}
.big-posts-box .posts-items li .post-thumb img {
    border-radius: 0 !important;
}
.big-posts-box .posts-items li .post-details {
    padding: var(--spacing-4) !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    flex-grow: 1;
}

@media (min-width: 768px) {
    .big-posts-box .posts-items {
        flex-direction:row;
    }
}




/* has-first-big-post */
.mag-box.has-first-big-post {
    margin-bottom: 0 !important;
}
.mag-box.has-first-big-post>div>.mag-box-title {
    margin-bottom: var(--spacing-2) !important;
}
.mag-box.has-first-big-post.second-half-box {
    padding-top: var(--spacing-4)!important;
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:nth-child(1) .post-details {
    padding: var(--spacing-2) 0 0;
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:nth-child(1).tie-thumb {
    width: 100% !important;
    display: flex;
    flex-direction: row;
    gap: var(--spacing-2) !important;

}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:nth-child(1).tie-thumb .post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:not(:first-child) {
    display: grid !important;
    grid-template-columns: 150px auto;
    gap: var(--spacing-2) !important;
    flex-direction: row !important;
    margin-top: var(--spacing-4) !important;
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:not(:first-child) .post-thumb {
    width: 150px !important;
    float: none !important;
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:not(:first-child) .post-thumb img {
    width: 100% !important;
    max-width: 100% !important;
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:not(:first-child) .post-details {
    padding-left: 0 !important
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:not(:first-child) .post-details .post-meta {
    margin-bottom: 0 !important
}
.mag-box.has-first-big-post>div>div.mag-box-container.clearfix>ul>li:not(:first-child) .post-details .post-title {
    font-size: var(--h5-size) !important;
    line-height: var(--h5-lineheight) !important;
    letter-spacing: var(--h5-letterspacing) !important;
    font-weight: var(--h5-weight) !important;
    margin-bottom: 0 !important
}

@media (min-width: 768px) {
    .mag-box.has-first-big-post.second-half-box {
        padding-top: 0px!important;
    }
}

/* News & Events */
#tie-block_923>div>div.mag-box-title.the-global-title {
    padding: var(--section-spacing) 0 var(--spacing-4) 0 !important;
}

#tie-block_923>div>div.mag-box-title.the-global-title>h3:before {
    background-color: var(--color-brand-primary);
    border-top-left-radius: var(--spacing-1);
    border-top-right-radius: var(--spacing-1);
    content: "";
    display: block;
    height: var(--spacing-1);
    width: 192px;
}

#tie-block_923>div>div.mag-box-title.the-global-title>h3 {
    font-size: var(--section-header-title-size) !important;
    line-height: var(--section-header-title-lineheight) !important;
    letter-spacing: var(--section-header-title-letterspacing) !important;
    font-weight: var(--section-header-title-weight) !important;
    color: var(--section-header-title-color) !important;
}

/* Masonry grid */
.masonry-page-content {
    margin-top: var(--section-spacing);
}

.masonry-page-content .post-element {
    border-radius: var(--spacing-2) !important;
}

.masonry-page-content .post-element .thumb-overlay {
    border-radius: var(--spacing-2) !important;
    padding: var(--spacing-2) !important;
}
.masonry-page-content .post-element .thumb-overlay:after {
    background: linear-gradient(0deg, var(--color-bg-reverse) 0%, var(--color-bg-reverse) 30%, transparent 100%)!important;
    height: 100%!important;


}
.masonry-page-content .post-element .thumb-overlay .post-cat {
    background: var(--color-neutral-high) !important;
    padding: var(--spacing-1) 12px !important;
    font-size: var(--p-sm-size) !important;
    line-height: 1em !important;
    letter-spacing: var(--p-sm-letterspacing) !important;
    border-radius: var(--spacing-1);
}

.masonry-page-content .show-more-button {
    border-radius: var(--button-radius) !important;
    padding: var(--button-padding) !important;
    font-size: var(--p-size) !important;
    line-height: var(--p-lineheight) !important;
    letter-spacing: var(--p-letterspacing) !important;
    margin: 0 auto !important;
    background: var(--button-primary-bg) !important;
    color: var(--button-primary-content) !important;
    border-color: var(--button-primary-border) !important;
}

.masonry-page-content .show-more-button:hover {
    background: var(--button-primary-bg-hover) !important;
    color: var(--button-primary-content-hover) !important;
    border-color: var(--button-primary-border-hover) !important;
}


/* Content*/
#content {
    margin-top: var(--section-spacing) !important;
}

/* Page title */
#main-content-row>div>header {
    padding: 0 0 var(--spacing-4) 0 !important;
}

#main-content-row>div>header>.page-title {
    font-size: var(--section-header-title-size) !important;
    line-height: var(--section-header-title-lineheight) !important;
    letter-spacing: var(--section-header-title-letterspacing) !important;
    font-weight: var(--section-header-title-weight) !important;
    color: var(--section-header-title-color) !important;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-4);
    margin: 0 !important;
}

#main-content-row>div>header>.page-title:before {
    background-color: var(--color-brand-primary);
    border-top-left-radius: var(--spacing-1);
    border-top-right-radius: var(--spacing-1);
    content: "";
    display: block;
    height: var(--spacing-1);
    width: 192px;
}

/* Posts Container[Default] */
.posts-items[data-layout="default"]>.post-item {
    margin-bottom: var(--spacing-6) !important;
}

.posts-items[data-layout="default"]>.post-item .post-details {
    padding-left: var(--spacing-4) !important;
}


.post-item.tie-thumb{
    flex-direction: column!important;
}
@media (min-width: 768px) {
    .post-item.tie-thumb{
        flex-direction: row!important;
    }
}


/* Pagination */
#main-content-row>div>div.pages-nav>ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-4) !important;
    margin: 0 !important;
}

#main-content-row>div>div.pages-nav>ul>li {
    margin: 0 !important;
    height: var(--spacing-4) !important;
}

#main-content-row>div>div.pages-nav>ul>li>a,
#main-content-row>div>div.pages-nav>ul>li>span {
    border: 0px !important;
    font-size: var(--p-size) !important;
    line-height: var(--spacing-4) !important;
    letter-spacing: var(--p-letterspacing) !important;
    font-weight: var(--p-weight) !important;
    padding: 0 !important;
}

#main-content-row>div>div.pages-nav>ul>li>a {
    color: var(--color-text-link) !important;
}

#main-content-row>div>div.pages-nav>ul>li>a:hover {
    color: var(--color-text-link-hover) !important;
    text-decoration: none !important;
}

#main-content-row>div>div.pages-nav>ul>li.current>span {
    border: 0px !important;
    color: var(--color-neutral-high) !important;
    background: none !important;
    font-weight: bold !important;
}

#main-content-row>div>div.pages-nav>ul>li.the-prev-page>a,
#main-content-row>div>div.pages-nav>ul>li.the-next-page>a {
    background: var(--color-brand-primary);
    color: var(--color-neutral-lowest) !important;
    width: var(--spacing-4) !important;
    line-height: var(--spacing-4) !important;
    text-align: center !important;
    border-radius: 100px;
}

#main-content-row>div>div.pages-nav>ul>li.the-prev-page>a:hover,
#main-content-row>div>div.pages-nav>ul>li.the-next-page>a:hover {
    text-decoration: none !important;
    background: var(--color-brand-primary-darker);
}

/* Posts */
#the-post>header>.entry-header {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2);
    margin-bottom: var(--spacing-6) !important;
}

#the-post>header>.entry-header>.post-cat-wrap>a {
    font-size: var(--hero-eyebrow-size) !important;
    line-height: var(--hero-eyebrow-lineheight) !important;
    letter-spacing: var(--hero-eyebrow-letterspacing) !important;
    font-weight: var(--hero-eyebrow-weight) !important;
    color: var(--hero-eyebrow-color) !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#the-post>header>.entry-header>.post-title:before {
    background-color: var(--color-brand-primary);
    border-top-left-radius: var(--spacing-1);
    border-top-right-radius: var(--spacing-1);
    content: "";
    display: block;
    height: var(--spacing-1);
    width: 192px;
    margin: 0 0 var(--spacing-4) 0 !important;
}

#the-post>header>.entry-header>.post-title {
    font-size: var(--hero-title-size) !important;
    line-height: var(--hero-title-lineheight) !important;
    letter-spacing: var(--hero-title-letterspacing) !important;
    font-weight: var(--hero-title-weight) !important;
    color: var(--hero-title-color) !important;
    margin: 0 !important;
}

#the-post>header>.entry-header>.entry-sub-title {
    font-size: var(--hero-subtitle-size) !important;
    line-height: var(--hero-subtitle-lineheight) !important;
    letter-spacing: var(--hero-subtitle-letterspacing) !important;
    font-weight: var(--hero-subtitle-weight) !important;
    color: var(--hero-subtitle-color) !important;
    margin: 0 !important;
}

#the-post>div.featured-area {
    border-radius: var(--img-radius) !important;
    overflow: hidden !important;
}



/* Related Posts */
#related-posts>div.mag-box-title.the-global-title {
    margin-bottom: var(--spacing-8) !important;
}

#related-posts>div.mag-box-title.the-global-title>* {
    font-size: var(--section-header-title-size) !important;
    line-height: var(--section-header-title-lineheight) !important;
    letter-spacing: var(--section-header-title-letterspacing) !important;
    font-weight: var(--section-header-title-weight) !important;
    color: var(--section-header-title-color) !important;
}

#related-posts>div.mag-box-title.the-global-title>*:before {
    background-color: var(--color-brand-primary);
    border-top-left-radius: var(--spacing-1);
    border-top-right-radius: var(--spacing-1);
    content: "";
    display: block;
    height: var(--spacing-1);
    width: 192px;
}

#related-posts>div.related-posts-list>div>a>img {
    border-radius: var(--img-radius) !important;
}

/* Widgets */

.widget {
    margin-bottom: var(--spacing-4) !important;
}

.widget .widget-title {
    border-bottom: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.widget .widget-title .the-subtitle {
    font-size: var(--h5-size) !important;
    line-height: var(--h5-lineheight) !important;
    letter-spacing: var(--h5-letterspacing) !important;
    font-weight: var(--h5-weight) !important;
    margin-bottom: var(--spacing-2) !important;
    color: var(--color-text-header) !important;
}

.widget.social-icons-widget {
    background: var(--color-bg-shade) !important;
    padding: var(--spacing-3) !important;
    border-radius: var(--spacing-2) !important;
}

.widget.social-icons-widget>ul>li>a {
    border-radius: var(--spacing-1) !important;
}

.widget.latest-tweets-widget {
    background: var(--color-bg-shade) !important;
    padding: var(--spacing-3) !important;
    border-radius: var(--spacing-2) !important;
}

.widget.latest-tweets-widget .button {
    border-radius: var(--button-radius) !important;
    padding: var(--button-padding) !important;
    font-size: var(--p-size) !important;
    line-height: var(--p-lineheight) !important;
    letter-spacing: var(--p-letterspacing) !important;
    margin: 0 auto !important;
    background: var(--button-primary-bg) !important;
    color: var(--button-primary-content) !important;
    border-color: var(--button-primary-border) !important;
    width: auto !important;
}


.widget.latest-tweets-widget .button:hover {
    background: var(--button-primary-bg-hover) !important;
    color: var(--button-primary-content-hover) !important;
    border-color: var(--button-primary-border-hover) !important;
}

.widget.text-html {
    background: var(--bg-default) !important;
    padding: var(--spacing-3) !important;
    border-radius: var(--spacing-2) !important;
    box-shadow: var(--elevation-1) !important;
    border-top: var(--spacing-2) solid var(--color-brand-primary) !important;

}

.widget.posts-list {
    background: var(--bg-default) !important;
    padding: var(--spacing-3) !important;
    border-radius: var(--spacing-2) !important;
    box-shadow: var(--elevation-1) !important;
    border-top: var(--spacing-2) solid var(--color-brand-primary) !important;
}

.widget.posts-list .post-widget-thumbnail img {
    border-radius: var(--img-radius) !important;
}

#footer{
    background-color: var(--color-bg-shade)!important;
}
#site-info {
    background-color: transparent!important;
    margin-inline: auto!important;
    max-width: var(--max-width)!important;
    padding: 64px 0!important;
    color: var(--color-text-body)!important;
    font-size: var(--p-size) !important;
    letter-spacing: var(--p-letterspacing) !important;
    font-weight: var(--p-weight) !important;
    line-height: var(--p-lineheight) !important;
}
#site-info .tie-col-md-12{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap:var(--spacing-4);
}

@media (min-width: 1024px) {
    #site-info .tie-col-md-12{
        flex-direction: row;
        justify-content: space-between;
    }
}

#site-info a:not(:hover){
    color: var(--color-text-body)!important;
}
#site-info a:hover{
    color: var(--color-text-body)!important;
    text-decoration: underline;
}

blockquote.wp-block-quote {
    background-color: #f6f7f7 !important;
}

.big-post-top-box .posts-items li:first-child a.post-thumb {
    margin-right: 4% !important;
}
.trending-post.tie-icon-bolt {
    display: none !important;
}