/* ============================================= */
/* ===== MICROSITE THEME COLOR OVERRIDES   ===== */
/* ============================================= */
:root {
    --site-primary: #77a794;
    --site-secondary: #2b404d;
    --site-tertiary: #d5893b;
    --white: #ffffff;
    --black: #000;
    --gray-lightest: #fafafa;
    --gray-lighter: #ededed;
}

/* ======================================== */
/* ===== HOMEPAGE HERO CUSTOMIZATION  ===== */
/* ======================================== */

/* HERO BACKGROUND IMAGE + GRADIENT OVERLAY
 
 - How to Change Image: Upload Image through SiteBuilder Image Assets, ensure it has a different filename, update URL with the filename below
 - How to Change Color Gradient Overlay: use HEX to RGBA converter for the appropriate format, first rgba() value is top color, second value is bottom color, use last digit in each for opacity (.75 = 75%).
 - Example (do not remove or edit):
     .pg_Index .hero-row {
         background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.97)), url('/data/SiteBuilderAssetsOriginals/Live/Images/spectrum/hero-bg.jpg');
         background-position: center;
         background-repeat: no-repeat;
     }
 */

.pg_Index .hero-row {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.97)), url('/data/SiteBuilderAssetsOriginals/Live/Images/spectrum/hero-bg.jpg') !important;
    background-position: left;
    background-repeat: no-repeat;
    background-color: #000;
}

/*****************************/
/*****************************/
/* added 12.10.21 - mdlobik */
/*****************************/
/*****************************/

#main>section>div>div>div>div>div>div>div>div>div>div>div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0>div>div>div.widget-ArticleListNewAndPopular.widget-instance-Home_MainContentB0B0Home_Row1_ArticleNewPopularCombined,
#issueInfo-Home_MainContentB0B0home-issue-info {
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2);
}


#main>section>div>div>div>div>div>div>div>div>div>div>div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0>div>div>div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2>div>div>div>div>div.home-self-serve-editors-wrap.ta-c.bordered.pdt-1>div>a {
    background-color: var(--site-primary);
    text-decoration: none;
}

#issueInfo-Home_MainContentB0B0home-issue-info {
    color: black;
}

#issueInfo-Home_MainContentB0B0home-issue-info>div.article-issue-info>div.view-current-issue>a {
    background-color: var(--site-primary);
}

#main>section>div>div>div>div>div>div>div>div>div>div>div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0>div>div>div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2>div>div>div>div>div:nth-child(3)>div:nth-child(1) {
    
}

#issueInfo-Home_MainContentB0B0home-issue-info {
    height: 553px;
}


#main > section > div > div > div > div > div > div > div > div > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0 > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2 > div > div > div > div.widget-SelfServeContent.widget-instance-diabetes_home-self-serve-content-additions > div.btn-wrap.d-b {
        background-color: #77a794;
        text-decoration: none;
}


#main > section > div > div > div > div > div > div > div > div > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0 > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2 > div > div > div > div:nth-child(2) > div:nth-child(1) {background-image: none !important;
    border: 5px solid #77a794;
    background-color: rgb(119, 167, 148, .1);
    box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);

}

#main > section > div > div > div > div > div > div > div > div > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0 > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2 > div > div > div > div:nth-child(2) > div:nth-child(2) {
    background-image: none !important;
    border: 5px solid #77a794;
    background-color: rgb(119, 167, 148, .1);
    box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
}

#main > section > div > div > div > div > div > div > div > div > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0 > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2 > div > div > div > div:nth-child(2) > div:nth-child(1) > a {
    text-decoration: none;
    display: block;
    text-align: center;
    vertical-align: middle;
    padding-top: 50px;
    font-size: 26px;
    color: black;
}

#main>section>div>div>div>div>div>div>div>div>div>div>div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B1>div>div>div>div {
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2);
}

#main > section > div > div > div > div > div > div > div > div > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0 > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2 > div > div > div > div:nth-child(2) > div:nth-child(2) > a {
    text-decoration: none;
    display: block;
    text-align: center;
    vertical-align: middle;
    padding-top: 50px;
    font-size: 26px;
    color: black;
}

#main > section > div > div > div > div > div > div > div > div > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0 > div > div > div.widget-DynamicWidgetLayout.widget-instance-Home_MainContentB0B0B2 > div > div > div > div.widget-SelfServeContent.widget-instance-diabetes_home-self-serve-content-additions > div.btn-wrap.d-b > a {
    background-color: #77a794;
    text-decoration: none;
}
