/*
 Theme Name:   WCR
 Theme URI:    
 Description:  Twenty Twenty One Child Theme
 Author:       Ellen C
 Author URI:   
 Template:     twentytwentyone
 Version:      
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         
 Text Domain:  twentytwentyonechild
*/

.site-header {
	width: 100% !important;
	max-width: 100% !important;
	background: rgb(242,240,239) !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-top: calc(0.5 * var(--global--spacing-vertical)) !important;
	padding-top: 0 !important;
	padding-bottom: calc(0.5 * var(--global--spacing-vertical)) !important;
	padding-left: calc(03.0 * var(--global--spacing-horizontal)) !important;
	padding-right: calc(3.0 * var(--global--spacing-horizontal)) !important;
}
#site-navigation {
	position: fixed;
	top: 0;
	width: 100% !important;
	max-width: 100% !important;
	background-color: rgb(0,0,153) !important;
	margin-left:0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	padding-left: calc(03.0 * var(--global--spacing-horizontal)) !important;
	padding-right: calc(3.0 * var(--global--spacing-horizontal)) !important;
}
.primary-navigation .primary-menu-container {
	border-bottom: solid rgb(242,240,239) 2px !important;
}
.primary-navigation .primary-menu-container > ul > .menu-item > a {
	font-size: 0.9rem;
}
.menu-wrapper {
	float: right;
}
.site-header > .site-logo {
	//max-width: var(--branding--logo--max-width);
	//max-height: var(--branding--logo--max-height);
	display: inline-block !important;
	width: 20% !important;
	height: auto;
	margin-bottom: calc(var(--global--spacing-vertical) * 0.1) !important;
	padding-bottom: calc(var(--global--spacing-vertical) * 0);
	padding-top: calc(var(--global--spacing-vertical) * 0.5);
    }
.site-header .site-logo img, .site-logo .custom-logo img {
	display: inline-block !important;
	max-width: 180px !important;
	//width: 180px !important;
	max-height: 190px !important;
	//height: 190px !important;
	padding-top: calc(var(--global--spacing-vertical) * 0.8);
	padding-bottom: calc(var(--global--spacing-vertical) * 0);
}
.site-branding {
	width: 80% !important;
	color: black !important;
}
.site-title {
	display: inline-block !important;
	width: 60% !important;
}
h1.site-title, .site-title {
	font-size: 2.0rem !important;
	color: black !important;
}
.site-description {
	font-style: italic !important;
}
.entry-header {
	border-bottom: none !important;
	padding-bottom: calc(1 * var(--global--spacing-vertical)) !important;
	margin-bottom: calc(1.0 * var(--global--spacing-vertical)) !important;
}
h1.entry-title {
	font-size: 2.3rem !important;
	font-family: Garamond, serif !important;
}
.site-content {
	padding-top: 20px !important;
}
.entry-footer {
	padding-bottom: calc(.2 * var(--global--spacing-vertical)) !important;
	margin-bottom: calc(.2 * var(--global--spacing-vertical)) !important;	
}
.widget-area {
	margin-top: calc(.2 * var(--global--spacing-vertical)) !important;
	margin-bottom: calc(.2 * var(--global--spacing-vertical)) !important;
	border-top: 3px solid rgb(230,190,20) !important;
}
#block-10 img {
	max-width: 60px;
}
.site-footer .site-info {
	border-top: 3px solid rgb(65,205,115) !important;
	border-top: 3px solid rgb(230,190,20) !important;
}
h2 {
	font-size: 1.8rem !important;
}
.indent {
	background: rgb(243,240,239);
	padding: 5px 5%;
	color: black;
}
.lt-background {
	background: rgb(243,240,239);
	color: black;
}
.button-background {
	background: rgb(230,190,20);
	border: solid 1px rgb(230,190,20);
	border-radius: 5px;
	padding: 10px;
}

@media only screen and (max-width: 800px) {
	h1.site-title, .site-title {
		font-size: 1.5rem !important;
		color: black !important;
@media only screen and (max-width: 600px) {
	.site-header {		
		padding-left: calc(01.0 * var(--global--spacing-horizontal)) !important;
		padding-right: calc(1.0 * var(--global--spacing-horizontal)) !important;
	}
    .site-header .site-logo img, .site-logo .custom-logo img {
        width: 100% !important;
        //max-height: var(--branding--logo--max-height);
        height: auto;
        width: auto;
    }
	h1.site-title, .site-title {
		font-size: 1.8rem !important;
	}
}
@media only screen and (max-width: 482px) {
	.site-header {		
		padding-left: calc(01.0 * var(--global--spacing-horizontal)) !important;
		padding-right: calc(1.0 * var(--global--spacing-horizontal)) !important;
	}
    .site-header .site-logo img, .site-logo .custom-logo img {
        width: 100% !important;
        //max-height: var(--branding--logo--max-height);
        height: auto;
        width: auto;
    }
	h1.site-title, .site-title {
		font-size: 1.5rem !important;
		color: black !important;
	}
}