/*
        Theme Name: divi-child
        Theme URI: 
        Description: Child Theme for Divi
        Author: Rachel ArceJaeger
        Author URI: 
        Template: Divi
        Version: 1.0

        NOTE: // is not a valid comment here!
*/

@import url("../Divi/style.css");

 
/* ###########################   ALL SITE   ########################### */

/* GLOBAL VARIABLES */
html {
    
    --blue_dark: #3562a7;
    --blue_medium: #8aa8d9;
    --blue_light: #7bb3e1;
    --blue_link: #3069BA;

    --green_medium: #BBD175;
    --green_normal: #c5d96b;
    --green_light: #EFEFEF;

    --grey_dark: #171719;
    --grey_medium: #888888;
    
    --light_text: #FFFFFF;
    --dark_text: #000000; /* Orig #666666 */
    
    --margin_normal: 1em;
    --margin_half_normal: 0.5em;
    
    --padding_normal: 1em;
      
    --corners_normal: 4px;
    --corners_small: 2px;
      
    /* Use vh to make size more readable as screen gets smaller/thinner */
    --font_size_normal: 16px; /*2.3vh; 16px*/
    --font_size_h1: 40px;     /*5.6vh; 40px*/
    --font_size_h2: 36px;     /*4.5vh; 36px*/

    --line_height_normal: 3.7vh; /* 26x */
  
    --start_from_top: 3.5em;
}  


/* FONT FAMILY */

body {
    color: var(--dark_text);
}

body, p, h1, h2, h3, h4, h5, h6, a {
	font-family: 'Open Sans', Arial, sans-serif !important;
}

p:lang(zh), h1:lang(zh), h2:lang(zh), h3:lang(zh), h4:lang(zh), h5:lang(zh), h6:lang(zh), body:lang(zh), input:lang(zh), textarea:lang(zh), select:lang(zh) {
	font-family: 'Open Sans', Arial, sans-serif !important;
}

.et_one_font_languages h1, .et_one_font_languages h2, .et_one_font_languages h3, .et_one_font_languages h4, .et_one_font_languages h5, .et_one_font_languages h6, .et_one_font_languages body, .et_one_font_languages input, .et_one_font_languages textarea, .et_one_font_languages select { 
	font-family: 'Open Sans', Arial, sans-serif !important; 
}

.mfn_news pre {
    font-family: 'Open Sans', Arial, sans-serif !important;
}


/* FONT SIZE */

p, p a, div, div a, span, span a {
    font-size: max(var(--font_size_normal), 16px) !important;
    line-height: 1.7 !important;  /* Multiplies current font size by 1.7 */
}

h4 {
    font-size: max(var(--font_size_normal), 18px) !important;
    line-height: 1.7 !important;  /* Multiplies current font size by 1.7 */
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-size: inherit !important;
    line-height: inherit !important;
}

h1 p, h2 p, h3 p, h4 p, h5 p, h6 p {
    font-size: inherit !important;
    line-height: inherit !important;
}

h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {
    font-size: inherit !important;
    line-height: inherit !important;
}


/* LINE SPACING */

p, h1, h2, h3, h4, h5, h6, div {
    line-height: 1.7 !important;  /* Multiplies current font size by 1.7 */
}


/* LINKS */
/* Since use "#main-content" to distinguish it from nav bar, must use #main-content whenever changing link color of other elements or it won't update */

#main-content a {     /* Starts dark blue, ends light blue */
    color: var(--blue_link);   /* Don't use !important or else it will override all following link color info */
}
#main-content a:hover {    
    color: var(--blue_light);  
}

#main-content a.link_white_darkblue {    /* Starts white, ends dark blue */
    color: var(--light_text) !important;
}
#main-content a.link_white_darkblue:hover {
    color: var(--blue_dark) !important;
}

#main-content a.link_white_lightblue {    /* Starts white, ends light blue */
    color: var(--light_text) !important;
}
#main-content a.link_white_lightblue:hover {
    color: var(--blue_light) !important;
}

#main-content a.link_darkblue_white {    /* Normal dark blue link but hover is white */
    color: var(--blue_dark) !important;
}
#main-content a.link_darkblue_white:hover {
    color: var(--light_text) !important;
}

#main-content a.link_darkblue_lightblue {    /* Normal dark blue link but hover is light blue*/
    color: var(--blue_dark) !important;
}
#main-content a.link_darkblue_lightblue:hover {
    color: var(--blue_light) !important;
}

#main-content a.link_lightblue_mediumblue {     /* Starts light blue, ends medium blue (non-standard color) */
    color: var(--blue_light) !important;
}
#main-content a.link_lightblue_mediumblue:hover {
    color: var(--blue_medium) !important;
}

#main-content a.link_white_grey {    /* Starts white, ends grey */
    color: var(--light_text) !important;
}
#main-content a.link_white_grey:hover {
    color: lightgrey !important;
}

#main-content a.link_black_darkblue {    /* Starts black, ends dark blue */
    color: #000000 !important;
}
#main-content a.link_black_darkblue:hover {
    color: var(--blue_dark) !important;
}

#main-content a.link_black_white {    /* Starts black, ends white */
    color: #000000 !important;
}
#main-content a.link_black_white:hover{
    color: #FFFFFF !important;
}

.blurb_title_link_white_lightblue a {
    color: var(--light_text) !important;
}
.blurb_title_link_white_lightblue a:hover {
    color: var(--blue_light) !important;
}


/* BUTTONS */

#main-content .button_light a {
    color: var(--blue_medium) !important;
    border-color: var(--blue_medium) !important;
}

#main-content .button_white a {
    color: var(--light_text) !important;
    border-color: var(--light_text) !important;
}

#main-content .button_lightWhite a {
    color: var(--light_text) !important;
	background-color: var(--blue_medium) !important;
    border-color: var(--light_text) !important;
}

.button_blue {
    border-color: lightcyan;
    background: var(--blue_link) !important;
    color:  var(--light_text) !important;
}


/* ###########################   HEADER & NAV   ########################### */


/* LOGO */

#logo {
    max-height: 70% !important;
}


/* NAV MENU TEXT SIZE */

#et-top-navigation {
    font-weight: lighter !important;
    padding-left: 300px !important; /* to prevent overlap with logo on smaller screens */
}

@media (min-width: 1500px){
    #et-top-navigation a {
        font-size: 20px !important;
    }
}


/* To accommodate too many items in menu currently */
/* Note: 660 is Point where switches to hamburger menu */

@media (min-width: 1030px){ 
    #logo {
        max-width: 10vw;
    }
    
    #et-top-navigation {
        padding-left: 15vw !important;
    }
}



/* CURRENT NAV TAB (Needed since change link color above) */
/* Use et-top-navigation for nav before scroll down page.
   For after scroll, need to set "Active Primary Menu Link Color" in 
   Theme Customizer -> Header & Navigation -> Fixed Nav */

#et-top-navigation .current_page_item a {
    color: var(--blue_dark) !important;
    font-weight: normal !important;
}


/* MENU ICON WHEN SCREEN IS SMALLER THAN NORMAL */

.mobile_menu_bar:before {
    color: var(--blue_medium) !important;
    content: "\2630" !important;
}


/* NAV DROP-DOWN MENU WHEN SCREEN IS SMALLER THAN NORMAL */

.et_mobile_menu {
    border-top-color: var(--blue_medium) !important;
}


/* SECONDARY (VERY TOP) HEADER */

#et-info-phone, #et-info-email {
    display: none !important;h
}

body.et_fixed_nav.et_secondary_nav_enabled #main-header {
    top: 18px;
}

#top-header {
    background: var(--blue_medium) !important; /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(left, #c5d96b, #7bb3e1, #3562a7) !important; /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(left, #c5d96b, #7bb3e1, #3562a7) !important; /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(left, #c5d96b, #7bb3e1, #3562a7) !important; /* For Firefox 3.6 to 15 */
	background: radial-gradient(left, #c5d96b, #7bb3e1, #3562a7) !important; /* Standard syntax */
    
    /* BLUE-BLACK */
    /*
    background: #000000 !important; 
	background: -webkit-linear-gradient(left, #000000, #002C70, #8aa8d9) !important; 
	background: -o-radial-gradient(left, #000000, #002C70, #8aa8d9) !important; 
	background: -moz-radial-gradient(left, #000000, #002C70, #8aa8d9) !important;
	background: radial-gradient(left, #000000, #002C70, #8aa8d9) !important;
    */
}


/* KEEPS PAGES FROM FLASHING WHITE BAR WHEN SWITCHING PAGES */

@media (min-width: 980px){
    .et_fixed_nav.et_show_nav #page-container {
        padding-top: 91px !important; /* PROBLEM: Gets overwritten by index */
    }
}

@media (max-width: 980px){
    .et_fixed_nav.et_show_nav #page-container {
        padding-top: 110px !important; /* PROBLEM: Gets overwritten by index */
    }
    
    .fit_img_mobile img {
        max-width: 100% !important;
        min-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }
}

/* CUSTOM HEADER ROW */

.page_oneliner_header_section {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.page_oneliner_header_section h1 {
    font-size: min(45px, 7vw, 10vh);
    padding-bottom: min(24px, 5vw);
}

.page_header_light_shadow h1 {
    text-shadow: 1px 2px 10px rgba(51, 51, 51, 0.5);
}

.page_header_medium_shadow h1 {
    text-shadow: 1px 2px 4px #333;
}

/* SUBMENU UNDER A HEADER ROW */

.menu_under_header.et_pb_section {
    background-color: var(--green_medium) !important;
    margin: 0px;
    padding: 0px;
}

.menu_under_header_blue.et_pb_section {
    background-color: var(--blue_medium) !important;
}

.menu_under_header .et_pb_row  {
    width: 100%;
    max-width: 100%;
    margin: 0px;
    padding: 0px;
    background-color: inherit;
}

.menu_under_header .et_pb_module {
    width: 100% !important;
    max-width: 100% !important;
    background-color: inherit !important;
}

.menu_under_header .et_pb_module, .menu_under_header .et_pb_module ul, .menu_under_header .et_pb_module .et_pb_menu_inner_container, .menu_under_header .et_pb_module .et_pb_menu__wrap, .menu_under_header .et_pb_module .et_pb_menu__menu, .menu_under_header .et_pb_module .et-menu-nav {
    width: 100%;
    max-width: 100%;
}

.menu_under_header .et_pb_module .et_mobile_nav_menu {
    padding-bottom: 10px;
}

.menu_under_header .et_pb_module ul {
    margin: 0px !important;
}

.menu_under_header .et_pb_module ul li {
    margin-right: 10px;
    margin-left: 10px;
}

.menu_under_header .et_pb_module ul li a:hover {
    transition-duration: 0s;
    color: #3D4F00 !important;
}

.menu_under_header .et_pb_module ul li a {
    color: #000000 !important;
    font-size: 18px; /* To match other submenus */
}

.menu_under_header .et_pb_module ul li.current-menu-item a {
    color: #5D7700 !important;
}

.menu_under_header_blue .et_pb_module ul li a:hover {
    transition-duration: 0s;
    color: #666666 !important;
}

.menu_under_header_blue .et_pb_module ul li a {
    color: #FFFFFF !important;
    font-size: 18px; /* To match other submenus */
}

.menu_under_header_blue .et_pb_module ul li.current-menu-item a {
    color: #000000 !important;
}

/* HIDES MOBILE HAMBURGER SUBMENU (SO SHOWS LIKE NORMAL MENU) */

.menu_under_header .et_pb_module .et_pb_menu__menu { /* Shows normal menu */
    display: flex !important; 
} 

.menu_under_header .et_pb_module .et_mobile_nav_menu { /* Hides hamburger menu */
    display: none !important;
}


/* ###########################   ROWS     ########################### */

.et_pb_row {
    max-width: 2000px !important; /* better support external displays. Orig is 1080px */
}




/* ###########################   FOOTER   ########################### */

.et-social-icons {
    display: none;
}


/* ###########################   SIDEBAR   ########################### */


.menu .current_page_item a {
    color: #000000 !important;
}


/* Hides sidebar on default pages */

#main-content .container:before {
    display: none;  /* Hides vertical sidebar line */
}

#sidebar {
    display: none; /* Hides sidebar */
}

#left-area {
    width: 100%;
    padding-right: 0px !important;
}


/* ###########################   CONTENT   ########################### */

/* VERTICAL CENTERING */

.align_vertical_column {
    display: flex;
    flex-direction: column;
}
  
.align_vertical_module {
    flex: 1;
    /* Governs text alignment */
    align-self: center;
    display: flex;
    align-items: center;
    justify-items: center;
}


/* FULL WIDTH VIDEO */

#FullVideo { 
    width: 100% !important;
    max-width: 100% !important;
    padding: 0px !important;
    margin: 0px !important;
}


/* THREE COLUMN BLURB */

#blurb_three img {
    height: 190px !important;
}


/* BLURB WITH MIDDLE-ALIGNED TEXT */

#blurb_vertMid, #blurb_vertMid .et_pb_blurb_container { 
    vertical-align: middle !important;
}


/* ZOOM BLURB IMG */

.blurb_zoom img {
    transition: transform 0.2s; /* Animation */
}

.blurb_zoom img:hover {
    transform: scale(1.25);
}

.blurb_zoom .et_pb_image_wrap {
    overflow: unset;
}


/* SYNOPSIS BLURB / SYNOPSIS TEXT */

@media (min-width: 980px){

    .synopsis_blurb p, .synopsis_text p {
        font-size: 1.25em !important;
        line-height: 2em !important;
    }
}

@media (max-width: 980px){

    .synopsis_blurb p, .synopsis_text p {
        font-size: max(calc(var(--font_size_normal) + 2px), 18px) !important;
    }
}

.synopsis_blurb p a, .synopsis_text p a {
    font-size: inherit !important;
}

@media (min-width: 980px){

    .synopsis_text {
        display: flex !important;
        justify-content: center !important;
    }

    .synopsis_text .et_pb_text_inner {
        max-width: 600px !important;
    }
}

@media (min-width: 1500px){

    .synopsis_text {
        display: flex !important;
        justify-content: center !important;
    }

    .synopsis_text .et_pb_text_inner {
        max-width: 800px !important;
    }
}


/* PLAY SYMBOL ON VIDEOS */

.et_pb_video_play {
    color: var(--light_text) !important;
    text-shadow: 1px 1px 5px black !important;
}
.et_pb_video_play:hover {
    color: var(--blue_light) !important;
    text-shadow: 1px 1px 5px black !important;
}


/* CODE */

.et_pb_code_inner { /* Need to make same size as parent row */
    width: 100% !important;
    height: 100% !important;
}

/* BACKGROUND VIDEOS */

.centered_bkg_video .et_pb_section_video_bg   { /* Centers video vertically - give class centered_bkg_video */

    display: flex !important;
    flex-direction: column;
    justify-content: center;

}

.bottom_bkg_video .et_pb_section_video_bg .mejs-video { /* Aligns videos to bottom - give class bottom_bkg_video */
    bottom: 0px; /* makes the video bottom-positioned */
}


/* ###########################   MODULE: TABS   ########################### */


/* MAIN BODY */

#main-content .et_pb_all_tabs { 
    background-color: #D6D6D6 !important;
}

#main-content .et_pb_all_tabs ul { 
    padding-bottom: 0px !important;
}

#main-content .et_pb_all_tabs a {
    color: #002154 !important;
}


/* NON-ACTIVE TABS */

#main-content .et_pb_tabs_controls li {
    background-color: #3762a6 !important;
}

#main-content .et_pb_tabs_controls li a {
    color: var(--light_text) !important;
}


/* ACTIVE TAB */

#main-content .et_pb_tabs_controls .et_pb_tab_active {
    background-color: var(--blue_medium) !important;
}

#main-content .et_pb_tabs_controls .et_pb_tab_active a {
    color: var(--grey_dark) !important;
}


/* ###########################   MODULE: TESTIMONIAL   ########################### */


/* LINK IN TESTIMONIAL WHEN HAS DARK BKG (use class testimonial_darkBkg) */

#main-content .testimonial_darkBkg .et_pb_testimonial_meta a {
    color: #ADCFFF !important;
}


/* ###########################   MODULE: PEOPLE   ########################### */


.et_pb_member_position {
	color: #4D4D56 !important;
}



/* ###########################     MODULE: TEXT     ########################### */


/* LINK IN TEXT WHEN HAS DARK BKG (use class text_darkBkg) */

#main-content .text_darkBkg a {
    color: #ADCFFF !important;
}


/* ###########################     MODULE: BAR COUNTERS     ########################### */

.et_pb_counter_amount {
    background-color: var(--blue_dark) !important;
}

.et_pb_counter_amount.overlay {
    color: var(--grey_dark) !important;
}


/* ###########################     MODULE: CONTACT FORM     ########################### */

.et_pb_contact p input, .et_pb_contact p textarea, .et_pb_contact_message p input {
    background-color: var(--light_text) !important;
}


/* ###########################     MODULE: DIVI SUPREME CARD     ########################### */

.supreme_card_blue {
    background-color: #7bb3e1;
    border: 1px solid lightgrey;
    border-radius: 8px;
}

/* Same as button blue 
.supreme_card_blue a.et_pb_button, .supreme_card_blue a.et_pb_more_button { 
    border-color: lightcyan;
    background: var(--blue_link) !important;
    color:  var(--light_text) !important;
}*/

.supreme_card_blue a.et_pb_button, .supreme_card_blue a.et_pb_more_button { 
    border-color: white;
    background: inherit !important;
    color:  white !important;
}

.supreme_card_blue .dsm_card_badge_text {
    color: #000000;
}

.supreme_card_blue h1, .supreme_card_blue h2, .supreme_card_blue h3, .supreme_card_blue h4,
.supreme_card_blue h5, .supreme_card_blue h6, .supreme_card_blue p{
    color: var(--light_text);
}

.supreme_card_blue .dsm_card_subtitle {
    color: var(--light_text);
}

.supreme_card_blue .dsm_card_image_wrapper {
    border-radius: 8px 8px 0 0;
}


/* ###########################     SECTION     ########################### */

.et_pb_section .last_section {
	padding-bottom: 0px !important;
}



/* ###########################   BLOG POSTS   ########################### */


#main-content #left-area {
    padding-bottom: 0px !important;
}

.post {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}


/* ADDS SPACE BELOW BLOG PAGE EXCEPTS */

.et_pb_post .post-content {
    padding-bottom: 18px; 
}

/* ADDS SPACE ABOVE OLDER/NEWER ENTRIES PAGE BUTTON */

.pagination {
    padding-top: 18px;
}

/* KEEPS FEATURED IMAGE FROM BEING TOO BIG */

.et_post_meta_wrapper {
   text-align: center;
}

.et_post_meta_wrapper img, .et_pb_post img {
    max-width: 600px !important;
    width: 100%;
}

.entry-featured-image-url img { /* images on archive pages */
    display: none;
}

/* HIDES TAGS & AUTHOR BUT KEEPS DATE UNDER TITLE (TAKES A BIT OF WORK-AROUND) */

.et_pb_post .post-meta {
   color: white !important;
}

.et_pb_post .post-meta .published {
    color: var(--dark_text);
    padding-left: 12px;
}

.et_pb_post .post-meta :not(.published), .et_pb_post .post-meta #text {
    display: none;
}

/* BLOG GRID*/

.et_pb_blog_grid .et_pb_image_container img {
    min-width: 100%;
    max-width: 100%;
    max-height: 350px;
    object-fit: cover;
    border-start-start-radius: 12px;
    border-start-end-radius: 12px;
    outline: 1px solid var(--blue_light);
}
  
.et_pb_blog_grid .et_pb_post {
    border-radius: 12px;
    outline: 1px solid var(--blue_light);
    margin-bottom: 15% !important;
    background: var(--blue_light) !important;
 }
  
.et_pb_blog_grid .et_pb_post p {
    color: #FFFFFF !important;
    margin-bottom: 16px; /* for Learn More button */
  }
  
.et_pb_blog_grid .et_pb_post a {
    color: #FFFFFF !important;
  }
  
.et_pb_blog_grid .et_pb_post a:hover {
    color: var(--blue_dark) !important;
  }
  
a.more-link {
    font-size: 20px;
}

/* PLAIN GRID (NORMAL BLOG) AND FILTERABLE BLOG (PORTFOLIO ITEMS) */

.plain_grid .et_pb_blog_grid .et_pb_image_container img, .plain_grid_dark_bkg .et_pb_blog_grid .et_pb_image_container img {
    min-width: 100%;
    max-width: 100%;
    max-height: 350px;
    object-fit: cover;
    border-start-start-radius: 12px;
    border-start-end-radius: 12px;
    outline: 0px !important;
    border: 0px !important;
}


.plain_grid .et_pb_blog_grid .et_pb_post, .plain_grid .et_pb_grid_item, .plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post, .plain_grid_dark_bkg .et_pb_grid_item {
    border-radius: 12px;
    margin-bottom: 15% !important;
    text-align: center;
    outline: 0px !important;
    border: 0px !important;
 }

.plain_grid .et_pb_blog_grid .et_pb_post, .plain_grid .et_pb_grid_item {
    background: #FFFFFF !important;
}

.plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post, .plain_grid_dark_bkg .et_pb_grid_item {
    background: none !important;
}
  
.plain_grid .et_pb_blog_grid .et_pb_post p, .plain_grid .et_pb_grid_item p {
    color: #333!important;
    margin-bottom: 16px; /* for Learn More button */
  }

.plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post p, .plain_grid_dark_bkg .et_pb_grid_item p {
    color: white !important;
    margin-bottom: 16px; /* for Learn More button */
}

.plain_grid .et_pb_blog_grid .et_pb_post a.more-link::after, .plain_grid .et_pb_grid_item a.more-link::after, .plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post a.more-link::after, .plain_grid_dark_bkg .et_pb_grid_item a.more-link::after{
    content: " ❯";
}

.plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post p.post-meta, .plain_grid_dark_bkg .et_pb_grid_item p.post-meta{
    color: #DDDDDD !important;
}
  
.plain_grid .et_pb_blog_grid .et_pb_post a, .plain_grid .et_pb_grid_item a {
    color: var(--blue_dark) !important;
}
  
.plain_grid .et_pb_blog_grid .et_pb_post a:hover, .plain_grid .et_pb_grid_item a:hover {
    color: var(--blue_light) !important;
}

.plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post a, .plain_grid_dark_bkg .et_pb_grid_item a {
    color: white !important;
}
  
.plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post a:hover, .plain_grid_dark_bkg .et_pb_grid_item a:hover {
    color: var(--blue_light) !important;
}
  
.plain_grid .et_pb_blog_grid .et_pb_post .entry-title a, .plain_grid .et_pb_grid_item .entry-title a {
    color: #333 !important;
}
  
.plain_grid .et_pb_blog_grid .et_pb_post .entry-title a:hover, .plain_grid .et_pb_grid_item .entry-title a:hover {
    color: var(--blue_dark) !important;
}
  
.plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post .entry-title a, .plain_grid_dark_bkg .et_pb_grid_item .entry-title a {
    color: white !important;
}
  
.plain_grid_dark_bkg .et_pb_blog_grid .et_pb_post .entry-title a:hover, .plain_grid_dark_bkg .et_pb_grid_item .entry-title a:hover {
    color: var(--blue_light) !important;
}

.plain_grid .et_pb_portfolio_items, .plain_grid_dark_bkg .et_pb_portfolio_items {
    display: flex;
    justify-content: center;
    align-items: baseline;
}

@media (max-width: 600px) {
    .plain_grid .et_pb_portfolio_items, .plain_grid_dark_bkg .et_pb_portfolio_items {
        flex-direction: column;
    }
}

.plain_grid .et_pb_portfolio_item, .plain_grid_dark_bkg .et_pb_portfolio_item {
    flex: 1;
    margin-bottom: 0px !important;
}

.plain_grid .et_pb_portfolio_filters, .plain_grid_dark_bkg .et_pb_portfolio_filters, .et_pb_portfolio_filters {
    display: none !important;
}

.et_pb_portofolio_pagination {
    margin-top: 30px;
}

.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul {
    text-align: left;
}

.et_pb_filterable_portfolio .et_pb_portfolio_item.active, .et_pb_dpfilterable_blog {
    animation: none !important;
}

.et_pb_portofolio_pagination ul li a.active{
    font-weight: bold !important;
}

/* PUTS FEATURED IMAGE TO LEFT OF POST EXCERPT (LIST OF POSTS) */

@media (min-width: 980px) {
	.left_image_list .et_pb_posts .et_pb_post img,
	.left_image_list .et_pb_posts .et_overlay {
		width: 38%;
		height: 180px !important;
		margin-right: 4%;
		float: left;
                object-fit: cover;
	}

        /*
	.left_image_list .et_pb_posts .entry-title,
	.left_image_list .et_pb_posts .post-meta,
	.left_image_list .et_pb_posts .post-content { 
	    float: right; 
	    width: 58%; 
	}
        */

	.left_image_list body.rtl .et_pb_posts .et_pb_post img,
	.left_image_list body.rtl .et_pb_posts .et_overlay {
		float: right;
		margin-left: 4%;
		margin-right: 0;
	}
	.left_image_list body.rtl .et_pb_posts .entry-title,
	.left_image_list body.rtl .et_pb_posts .post-meta,
	.left_image_list body.rtl .et_pb_posts .post-content { 
	    float: left; 
	}
}

/* ADD SPACING BETWEEN POSTS IN MFN LIST */

.et_pb_portfolio_item.mfn_news:not(:first-child) {
    padding-top: 30px;
}

/* ###########################   FOOTER   ########################### */

/*
#main-footer {
    display: none !important;
}
*/

#footer-bottom {
    background-color: var(--light_text) !important;   
}

#footer-info {
    color: var(--grey_dark) !important;   
}

#footer-bottom .container {
    width: 100%;
    max-width: 100%;
}

#footer_english ul, #footer_chinese ul {
    list-style-type: none !important;
}

#footer_english img, #footer_chinese img {
    width: auto !important;
}



/* ###########################   PLUGIN: CATLIST   ########################### */

.lcp_catlist_no_bullets li {
  list-style: none;
  margin-bottom: 12px;
}


/* ###########################   PLUGIN: L EVENTS CALENDAR   ########################### */

#loicalendar {
    border: 2px solid #3762a6 !important;
}


#loicalendar .calendar-nav {
    color: #3762a6 !important;
}

#loicalendar .calendar-nav svg {
    fill: #3762a6 !important;
}

#loicalendar .calendar-row .calendar-column .column-date.currentDate {
    color: #3762a6 !important;
    border-color: #3762a6 !important;
}

#loicalendar .calendar-row .individual-event {
    background-color: #3762a6 !important;
}

#main-content .calendar-column .individual-event a {
    color: var(--light_text) !important;
}

#loicalendar .binders {
	display: none !important;
}


/* ###########################   SPECIAL MOBILE   ########################### */

/* IGNORE BOTTOM PADDING ON MOBILE ONLY */

@media (max-width: 980px) {
    .mobile_no_bottom_padding {
        padding-bottom: 0px !important;
    }
    
    .mobile_no_top_padding {
        padding-top: 0px !important;
    }
    
    .mobile_10vw_bottom_padding {
        padding-bottom: 10vw;
    }
}

/* ###########################   SPECIAL MODULES   ########################### */

/* HAVE MORE THAN 4 COLUMNS IN A SECTION */
/* Percent is 100 divided by # of columns */
/* Label the ROW itself (e.g. the image, blurb, etc) */

.three_columns_row .et_pb_module {
    padding-bottom: 20px;
}

@media (min-width: 980px){

    .three_columns_row .et_pb_column {
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    
    .three_columns_row .et_pb_module {
        max-width: 33.33% !important; 
        width: 33.33% !important; 
    }
}

@media (max-width: 980px) {
    
    .three_columns_row .et_pb_module {
        max-width: 100% !important; 
        width: 100% !important; 
    }
    
    .three_columns_row .et_pb_module img { 
        max-width: 50vw !important;
    }
}

/* HAVE MORE THAN 4 COLUMNS IN A SECTION */
/* Percent is 100 divided by # of columns */
/* Label the CONTENT itself (e.g. the image, blurb, etc) */

@media (min-width: 980px){
    .ten-columns {max-width: 10%;  min-width: 10%; float: left;}
    .nine-columns {max-width: 11.11%;  min-width: 11.11%; float: left;}
    .eight-columns {max-width: 12.5%;  min-width: 12.5%; float: left;}
    .seven-columns {max-width: 14.28%;  min-width: 14.28%; float: left;}
    .six-columns {max-width: 16.66%;  min-width: 16.66%; float: left;}
    .five-columns {max-width: 20%; min-width: 20%; float: left;}
    .three-columns {max-width: 33.33%; min-width: 33.33%; float: left;}

    .five_columns_with_padding { max-width: 20% !important; float: left !important; padding: 3% !important; }
    
    .three_columns_with_padding {max-width: 33.33% !important; float: left !important; padding: 3% !important; }
}

@media (max-width: 980px){
    .five_columns_with_padding img, .three_columns_with_padding img { max-width: 50% !important;}
}


/* MANUAL FIVE-COLUMN LAYOUT. Means stack 5 items in a one-column layout.
   Put css name in individual item */

@media (min-width: 980px){
    
    /* First and last are designed to be blank */
    
    .five-columns-filled {
        width: 24%; float: left;
    }
    .five-columns-empty {
        width: 14%; float: left;
    }
    
    /* Second and fourth are full with thin middle */
    
    .five-columns-2-4-filled {
        width: 35%; float: left;
    }
    .five-columns-3-empty {
        width: 10%; float: left;
    }
    .five-columns-1-5-empty {
        width: 10%; float: left;
    }
    
    .investor_facts_reports_shares_section {
        display: flex !important;
    }
    
    .investor_facts_reports_shares_row_small {
        flex: 1 !important;
        margin-right: 3%;
    }
    
    .investor_facts_reports_shares_row_large {
        flex: 1.5 !important;
    }
}

@media (max-width: 980px){
    
    .investor_facts_reports_shares_section {
        width: 100% !important;
    }
    
    .investor_facts_reports_shares_row_small {
        margin-bottom: 6vw !important;
    }
}


/* SPECIAL TO ENSURE SMALL COLUMNS WHEN LEFT-ALIGNED (assumes a MANUAL four-column layout) */

@media (min-width: 980px){
    .askew_col_one {max-width: 30%; min-width: 30%; float: left;}
    .askew_col_two {max-width: 35%; min-width: 35%; float: left;}
    .askew_col_three {max-width: 25; min-width: 25%; float: left;}
    .askew_col_four {max-width: 10%; min-width: 10%; float: left;}
    
    .my_footer_logo img {
        max-width: 130px !important; /* Matches nav logo which is based on % */
    }
}
@media (max-width: 980px){
    .my_footer_logo img {
        max-width: 50% !important; /* Matches nav logo which is based on % */
    }
}


/* MORE SPECIAL COLUMNS */

@media (min-width: 980px){
    .ten_percent_width {
        max-width: 10% !important; width: 10% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .twenty_percent_width {
        max-width: 20% !important; width: 20% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .thirty_percent_width {
        max-width: 30% !important; width: 30% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .forty_percent_width {
        max-width: 40% !important; width: 40% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .fifty_percent_width {
        max-width: 50% !important; width: 50% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .sixty_percent_width {
        max-width: 60% !important; width: 60% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .seventy_percent_width {
        max-width: 70% !important; width: 70% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .eighty_percent_width {
        max-width: 80% !important; width: 80% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    .ninety_percent_width {
        max-width: 90% !important; width: 90% !important; float: left !important;
        margin: 0px !important; padding: 0px !important;
    }
    
    .ten_percent_width .et_pb_code_inner, .twenty_percent_width .et_pb_code_inner, .thirty_percent_width .et_pb_code_inner, .forty_percent_width .et_pb_code_inner, .fifty_percent_width .et_pb_code_inner, .sixty_percent_width .et_pb_code_inner, .seventy_percent_width .et_pb_code_inner, .eighty_percent_width .et_pb_code_inner, .eighty_percent_width .et_pb_code_inner { /* HELPER */
        width: 100vw !important;
    }
    
    /* Use whenever doing a one-column force format multi-column section and want to 
       vertically align. Must use in the row's column, AND each item */
       
    .vertical_align_one_col {
        display: flex !important;
        margin: auto  !important;
    }
    
    .vertical_align_one_col .et_pb_text_inner { /* HELPER */
        width: 100vw !important;
    }
}

/* THREE COLUMN CODED SECTION
   Use for a one-column force format multi-column section when dealing with coded blocks
   !! Must specify height of coded block for MOBILE in the block itself (or associated 
      style module) or it won't show !! */

@media (min-width: 980px){
    
    /* MODULE: ALL */
    
    .coded_1st_of_3_col_module_all {
        position: absolute !important;
        width: 24vw !important;
        padding-right: 3vw !important;
    }

    .coded_2nd_of_3_col_module_all {
        position: absolute !important;
        width: 24vw !important;
        padding-left: 1.5vw !important;
        padding-right: 1.5vw !important;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }

    .coded_3rd_of_3_col_module_all {
        position: absolute !important;
        width: 24vw !important;
        padding-left: 3vw !important;
        right: 0 !important;
    }
    
    /* MODULE: TEXT */

    .coded_3_col_blurb_text_module { /* When you want text to sit under an image like a blurb */
        top: 23vw;
    }
    
    .coded_3_col_blurb_text_module h1 { /* HELPER */
        font-size: 26px;
    }
}


/* TWO COLUMN CODED SECTION
   Use for a one-column force format multi-column section when dealing with coded blocks
   !! Must specify height of coded block for MOBILE in the block itself (or associated 
      style module) or it won't show !! */

@media (min-width: 980px){
    
    /* MODULE: ALL */
    
    .coded_1st_of_2_col_module_all {
        position: absolute !important;
        padding-right: 2.5vw;
        width: 35vw !important;
    }

    .coded_2nd_of_2_col_module_all {
        position: absolute !important;
        padding-left: 2.5vw;
        width: 35vw !important;
        right: 0 !important;
    }
    
    /* MODULE: TEXT */

    .coded_2_col_blurb_text_module { /* When you want text to sit under a square image like a   blurb */
        top: 38vw;
    }
}


/* FOR FOOTER MENUS - completely custom class */

.my_footer_menu {
    list-style-type: none !important;    
}


/* Other */

.product_use_case .et_pb_row {
    padding-top: 60px;
}


/* ###########################   SPECIAL SECTIONS   ########################### */

@media (max-width: 980px){
    .hide_mobile {  display: none !important; }
}

@media (min-width: 980px){
    .hide_desktop {  display: none !important; }
    
    .extra_top_margin { margin-top: 30px !important; }
}

.custom_divider {
    margin:  0 !important;
    padding: 0 !important;   
}

@media (max-width: 980px){
    .custom_divider {
        /* Needed because otherwise there's a faint clear border space around images on mobile */
        bottom: -1px;
    }    
}


/* ##########################   PASSWORD PROTECTION   ########################## */


.et_password_protected_form {
    text-align: center !important;
}

@media (min-width: 980px){
    .et_password_protected_form {
        margin-top: 100px !important;
        text-align: center !important;
    }
}

.et_password_protected_form h1 {
    display: initial !important;  
} 

.et_password_protected_form .et_submit_button {
    float: none !important;
}

.et_password_protected_form p input {
    width: 50vw !important;
}


/* ###########################   CUSTOM BACKGROUNDS   ########################### */


#bkg_blue_black_gradient {
	background: #255696 !important; /* For browsers that do not support gradients */
	background: -webkit-radial-gradient(#255696, #000000) !important; /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#255696, #000000) !important; /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#255696, #000000) !important; /* For Firefox 3.6 to 15 */
	background: radial-gradient(#255696, #000000) !important; /* Standard syntax */
}

#bkg_red_black_gradient {
	background: #FF3F49 !important; /* For browsers that do not support gradients */
	background: -webkit-radial-gradient(#FF3F49, #000000) !important; /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#FF3F49, #000000) !important; /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#FF3F49, #000000) !important; /* For Firefox 3.6 to 15 */
	background: radial-gradient(#FF3F49, #000000) !important; /* Standard syntax */
}




/* ###########################   IMAGES   ########################### */

.icons_blurb {
    width: 55%;
    height: auto;
}

.et-pb-icon {
    color: var(--blue_light) !important;
}

.et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon { /* Blurbs with images (top or side) --- changes default behavior */
    font-size: 5em !important;
}

.side_blurb .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon { /* Blurbs with side images --- must add side_blurb class to blurb */
    line-height: 90px !important;
}



/* ###########################   MODULAR FINANCE   ########################### */



@media (min-width: 980px){
    #subscription_module  {
        padding-right: 2vw;
    }
}

@media (max-width: 980px){
    #subscription_module {
        padding-right: 2vw;
        padding-left: 2vw;
    }
}

#subscription_module .mfn-sub-submit:hover:after {
    margin-left: 10px;
    content: '\276F';
    position: absolute;
    transition: all .2s;
    text-transform: none;
    font-feature-settings: "kern" off;
    font-weight: 400;
}

#subscription_module .mfn-list {
    list-style-type: none !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
    display: flex;
    flex-wrap: wrap;
}

#subscription_module .mfn-list-item {
    display: flex;
    justify-content: start;
    margin-right: 10px;
    flex: 1;
}

#subscription_module .mfn-list-item input.mfn-sub-option {
    align-self: self-start;
}

#subscription_module .mfn-info-main-1 {
    display: none;    
}

#subscription_module .mfn-field-input {
    background-color: #EEEEEE !important;
    width: 100%;
    border-width: 0;
    border-radius: 0;
    font-size: 14px;
    padding: 16px;
}

#subscription_module .mfn-sub-option, #subscription_module .mfn-sub-lang, #subscription_module .mfn-sub-approve {
    background-color: #eee;
    font-style: normal;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    margin-right: 6px;
    }

#subscription_module .mfn-policy-text {
    margin-top: 23px;
}

#subscription_module .mfn-submit {
    text-align: right;
}

#subscription_module .mfn-sub-submit {
    color: #2ea3f2;
    font-size: 20px;
    font-weight: 500;
    padding: .3em 1em;
    line-height: 1.7em!important;
    background-color: transparent;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    border: 2px solid;
    border-radius: 3px;
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-property: all!important;
    transition-property: all!important;
}

#subscription_module .mfn-sub-submit:hover {
    border: 2px solid transparent;
    padding: .3em 2em .3em .7em;
    background-color: rgba(0,0,0,.05);
}

#subscription_module .mfn-sub-approve-text {
    margin-top: 23px;
    margin-bottom: 23px;
}

#subscription_title {
    text-align: center;
}

#subscription_module .mfn-policy-approve {
    display: block; /* Force to new line */
}

#subscription_module .mfn-alert-active, #subscription_module .mfn-sub-bad-input {
    background-color: #D6792C;
    color: white;
}

#subscription_module .mfn-sub-success {
    background-color: var(--green_normal);
}

#subscription_module input.mfn-sub-option, input.mfn-sub-lang, input.mfn-sub-approve {
    min-width: 16px !important;
    min-height: 22px !important;
}

#subscription_module .language_disclaimer {
    font-size: 12px;
}

.mfn-body {
    margin-top: 18px;
}

.mfn-footer, .mfn-attachment-link { /* imported mfn footer (any type) */
    margin-top: 18px;
}

.mfn-footer.mfn-41c857bdbee0 p { /* imported TRADEMARKS mfn footer */
    font-size: 0.9em !important;
}

.mfn-footer.mfn-41c857bdbee0 .mfn-heading-1 {
    display: none;
}

.mfn-about, .mfn-contacts { /* default (imported) footer */
    display: none !important;
}

.mfn_about_us_footer { /* Our custom footer */
    background: var(--blue_dark);
    color: #FFFFFF;
    padding: 5% 0;
    display: flex;
    justify-content: center;
}

.mfn_about_us_footer_interior {
    width: 80%;
}

.mfn_about_us_footer h1, .mfn_about_us_footer h2, .mfn_about_us_footer h3, .mfn_about_us_footer h4 {
    color: #FFFFFF;
}

.hardcoded_about_us {
    display: none;
}

.mfn_news .et_pb_post  .entry-title, .mfn_news .et_pb_post .post-meta {
    text-align: center;
}

.mfn-attachments-container .mfn-image-primary {
    display: none; /* Hides extra thumbnail at end of post if it's the featured image */
}

#footer_colored_bar {   /* For MFN custom posts, see index.php */
    background: -webkit-linear-gradient(left,#3562a7,#7bb3e1,#c5d96b)!important;
    height: 3px;
    margin-bottom: 10px; /* remove if add another section underneath */
}

