/* Widget area styles */

/*--- Default and small screens ---*/

/* Style widget areas */
ul.sidebar-homepage, ul.sidebar-internal-page {
    list-style-type:none;
    margin:0;
    padding:0;
    color: #333;
}

/* Style widget area top-level list items */
ul.sidebar-homepage > li, ul.sidebar-internal-page > li {
    margin:0;
    padding:1em;
}

/* Style banner widget area */
ul#sidebar-homepage-banner, ul#sidebar-internal-page-banner {
    position: relative; /* so we can set a z-index */
    z-index: 1; /* so it overlaps the semi-transparent background shadow */
    color:white; /* as this content will go over the background-image, we want the text to be visible */
}

/* Style regular (not banner) homepage widget item titles */
ul.sidebar-homepage:not(#sidebar-homepage-banner) > li h2.widget-title,
ul.sidebar-homepage:not(#sidebar-homepage-banner) > li h3.widget-title {
    margin:0 1em 0.5em;
    text-align: center;
    letter-spacing: 0.025em;
    padding: 20px 0px;
    color:#005239;
}

/* Style widget item subtitles */
li.widget p.widget-title-sub {
    text-align:center;
    margin-top:-1em;
    margin-bottom: 2em;
    font-size:1.3em;
}

/* Style banner widget item titles */
ul#sidebar-homepage-banner li.widget h3.widget-title, ul#sidebar-internal-page-banner li.widget h3.widget-title {
    font-weight:600;
}

/* Style banner widget item subtitles */
ul#sidebar-homepage-banner li.widget p.widget-title-sub, ul#sidebar-internal-page-banner li.widget p.widget-title-sub {
    text-align:left;
    margin-top:0;
    margin-left: 0.75em;
}

/* Style custom HTML widgets used on widget areas (not homepage banner) */
ul.sidebar-homepage:not(#sidebar-homepage-banner) > li div.textwidget, ul.sidebar-internal-page:not(#sidebar-internal-page-banner) > li div.textwidget {
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
}

/* Style top and bottom widget areas */
ul#sidebar-homepage-top, ul#sidebar-homepage-bottom, ul#sidebar-internal-page-top, ul#sidebar-internal-page-bottom {
    width: calc(100% - 4rem);
    margin-left: auto;
    margin-right: auto;
    max-width:120rem;
}

/* Style top widget areas */
ul#sidebar-homepage-top {
    margin-bottom:1em;
}

/* Style top and bottom widget areas list items*/
ul#sidebar-homepage-top li, ul#sidebar-homepage-bottom li, ul#sidebar-internal-page-top li, ul#sidebar-internal-page-bottom li {
    padding-left:0;
    padding-right:0;
}

/* Style internal page top widget items */
ul#sidebar-internal-page-top > li {
    padding-top:0;
}

/* Style homepage top widget area */
ul#sidebar-homepage-top, ul#sidebar-internal-page-top {
    position: relative; /* so that we can set a z index */
    z-index: 1; /* so that it will overlap the shadow from the site header */
    background-color:white;
}

/* Style widget items in the main page content */
div.entry-content li.widget {
    margin-bottom:1em;
}

/* 400+ pixels */
@media screen and (min-width: 400px) {

    /* Style regular (not banner) widget item titles */
    ul.sidebar-homepage:not(#sidebar-homepage-banner) > li h3.widget-title, ul.sidebar-internal-page:not(#sidebar-internal-page-banner) > li h3.widget-title {
        position: relative;
        z-index: 1;
    }

}

/*--- 700+ pixels ---*/
@media screen and (min-width: 700px) {

	/* Style banner widget item titles */
	ul#sidebar-homepage-banner > li h3.widget-title, ul#sidebar-internal-page-banner > li h3.widget-title {
	    font-size:3.5rem;
	    margin-bottom:2.5rem;
	    margin-left:0.5em;
	}

	/* Style top and bottom widget areas */
	ul#sidebar-homepage-top, ul#sidebar-homepage-bottom, ul#sidebar-internal-page-top, ul#sidebar-internal-page-bottom {
	    width: calc(100% - 8rem);
	}

}

/*--- 1,000+ pixels ---*/
@media screen and (min-width: 1000px) {

	/* Style banner widget area */
	ul#sidebar-homepage-banner, ul#sidebar-internal-page-banner {
	    position: unset; /* unset the relative position set in the default stylesheet */
	}

	/* Style homepage banner widget area */
	ul#sidebar-homepage-banner {
	    margin-top: 7em;
	}

	/* search form - standard WordPress search widget in homepage widget area */
	ul.sidebar-homepage li.widget_search form.search-form, ul.sidebar-internal-page li.widget_search form.search-form {
		justify-content: center;
	}

	/* search form title */
	ul.sidebar-homepage li.widget_search form.search-form label, ul.sidebar-internal-page li.widget_search form.search-form label {
		width:50%;
	}

}