/**
* Layers DevKit Custom Main CSS
*/
/*--------------------------------------------------------------
1. Layout
2. Typography
3. Header
4. Single post page
5. Footer
6. Homepage Settings (overlayed hero)
7. About page Settings
8. News and other Archive pages
9. Contact Us page
10. 404, search sidebar pages
--------------------------------------------------------------*/



/*--------------------------------------------------------------
1. Layout
--------------------------------------------------------------*/

.grid-cols {
    -webkit-column-gap: 3rem;
    -moz-column-gap: 3rem;
    column-gap: 3rem;
    row-gap: 3rem;
}

/*some margin on top of single post content*/ 
.single-post .content-area {
margin-top: 2rem;
}

.content-area {
	margin-bottom: 6rem;
    margin-top: 2rem;
}

.page-title, .archive-title {
	max-width: 784px;
	margin: auto;
}

/*this is needed for no search results page*/ 
.content-bg, body.content-style-unboxed .site {
	background-color: #fafafa; 
}

/*make sure news grid backgrounds are white*/ 
.content-bg, body.content-style-unboxed .site {
    background-color: #ffffff;
}



/*--------------------------------------------------------------
2. Typography
--------------------------------------------------------------*/

/*
.site .page-title h1 {
	color: rgba(31,33,35,.45)
}
*/

p {
	font-size: 1.125rem;
	line-height: 1.5;
	opacity: 0.9;
}

.kicker {
    font-weight: 700;
    word-wrap: break-word;
    font-style: normal;
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: 4px;
    text-transform: uppercase;
	padding-bottom: 8px;
	opacity: .45;
}

.cta-link {
	color: #1F2123;
}

.cta-link:hover {
	color: #3E8BC1;
}

.cta-link::after {
	content: "→";
	margin-left: 4px;
	display: inline-block;
	position: absolute;
	text-decoration: none;
	transition: all 0.2s ease;
}


.cta-link:hover::after {
	content: "→";
	margin-left: 8px;
	position: absolute;
}

a.post-more-link {
    font-weight: normal;
    letter-spacing: 0;
    text-transform: capitalize;
    text-decoration: underline;
    color: inherit;
    font-size: 1rem;
}

.post-more-link::after {
	content: "→";
	margin-left: 8px;
	display: inline-block;
	text-decoration: none;
	transition: all 0.2s ease;
}

.post-more-link:hover::after {
	content: "→";
	margin-left: 12px;
}

.kadence-arrow-right-alt-svg {
	display: none;
}

a.post-more-link .kadence-svg-iconset {
    margin-left: -0.5rem;
}

blockquote p {
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.5;
}

blockquote {
    padding-left: 1em;
    border-left: 4px solid #959697;
}




/*--------------------------------------------------------------
3. Header
--------------------------------------------------------------*/

.main-navigation .primary-menu-container > ul > li.menu-item > a {
	color: #1F2123;
}

.site-header {
	margin: 16px 0;
}

/*test to see if I can style stick menu items differently*/ 
.page-id-81 .item-is-fixed .main-navigation a {
	color: #1F2123!important;	
}



.page-id-81 .item-is-fixed .site-title {
	color: #1F2123;
}

.page-id-81 .item-is-fixed  .header-button {
	background-color: #2372b1;
	color: #ffffff;
}

/*--------------------------------------------------------------
4. Single post page
--------------------------------------------------------------*/


/*white background on similar post post backgrounds*/ 
.carousel-item .entry-content-wrap {
background-color: #ffffff;
}


.post-title {
	max-width: 784px;
	margin: auto;
}


.post .single-content {
	margin-top: 2rem!important;
	max-width: 784px;
	margin: auto;
}

/*--------------------------------------------------------------
5. Footer
--------------------------------------------------------------*/

.footer-widget-area h4 {
	color: #ffffff;
	margin-bottom: 1rem;
}

.footer-widget-area p {
	margin: 0;
}


.footer-widget-area small {
	color: #ffffff;
	font-size: 0.875rem;
	line-height: 2.5;
}

.footer-widget-area small a {
	color: #ffffff!important;
}

.site-middle-footer-inner-wrap {
    padding-top: 96px;
    padding-bottom: 48px;
    grid-column-gap: 48px;
    grid-row-gap: 48px;
}

.site-bottom-footer-inner-wrap {
	border-top: 1px solid #ffffff;
    padding-top: 24px;
    padding-bottom: 96px;
    grid-column-gap: 48px;
}

.site-bottom-footer-inner-wrap .site-footer-section {
	margin-bottom: 24px;
}


.site-bottom-footer-inner-wrap .footer-html {
	margin: 0;
}

/*copyright info*/ 
#colophon .footer-html p {
    font-style: normal;
    font-size: 0.75rem;
    line-height: 1.5;
	color: #ffffff;
}

/*support icons*/
.supporter-icon {
	margin: 0 0 16px 16px;
}

.supporter-icon-container {
	display: flex;
	justify-content: space-between;/*maybe change this to margin of 24px and flex end*/ 
	flex-wrap: wrap;
}

/*--------------------------------------------------------------
6. Homepage Settings (overlayed hero)
--------------------------------------------------------------*/

/*
.page-id-81 .main-navigation a {
	color: #ffffff!important;	
}


.page-id-81 .site-title {
	color:#ffffff;
}

.page-id-81 .mobile-toggle-open-container {
	color: #ffffff;
}

.page-id-81 .menu-toggle-open {
	color: #ffffff;
}
*/

.page-id-81 .header-button {
	background-color: #ffffff;
	color: #1F2123;
}

.homepage-hero {
	max-width: 1200px;
	min-height: calc(100vh - 228px);
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #1F2123;
	background-size: cover;
}

.homepage-hero-container {
	max-width: 888px;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.homepage-hero-container h1 {
	text-align: center;
	color: #ffffff;
	font-weight: 600;
	margin-bottom: 2rem;
}

.homepage-hero-container a {
	text-align: center;
	color: #ffffff;
	font-size: 1.25rem;
}


.homepage-overview-header {
	max-width: 576px;
	margin: auto;
	text-align: center;
	margin-bottom: 3rem;
}

/*about overview on homepage*/ 
.about-overview {
	margin: 96px 0;
}

.about-overview.grid-cols {
    -webkit-column-gap: 0;
    -moz-column-gap: 0;
    column-gap: 0;
    row-gap: 0;
}

.about-overview-image {
	background-color: #1F2123;
	height: 100%;
	min-height: 650px; /*make a decision on this for mobile and tablet*/ 
	background-size: cover;
}

.about-overview-content {
	background-color: #ffffff;
	min-height: 650px;
	padding: 4rem 3rem;
}


/*blog overview on homepage*/ 
.blog-overview {
	margin: 96px 0;
}

.blog-overview .content-bg {
	background-color: #ffffff!important;
	
}

.entry-taxonomies ul li {
	display: inline;
	margin-right: 0.25rem;
    margin-bottom: 0.25rem;
}

.entry-taxonomies ul {
	list-style: none;
	margin: 0;
}

.page-id-81 .post-more-link::after {
	content: "→";
	margin-left: 12px;
}

.page-id-81 .post-more-link:hover::after {
	content: "→";
	margin-left: 16px;
}

/*testimonial overview on homepage*/
.testimonial-overview {
	margin: 96px 0;
}

.testimonial-overview.grid-cols {
    -webkit-column-gap: 0;
    -moz-column-gap: 0;
    column-gap: 0;
    row-gap: 0;
}

.testimonial-overview-image {
	background-color: #1F2123;
	height: 100%;
	min-height: 650px; /*make a decision on this for mobile and tablet*/ 
	background-size: cover;
}

.testimonial-overview-content {
	min-height: 650px;
	background-color: #ffffff;
	padding: 4rem 3rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

/*gallery overview*/ 
.gallery-overview {
	margin: 96px 0 0 0;
}

.gallery-container {
	max-width: 1296px;
	margin: auto;
}

/*donation overview on homepage*/ 
.donations-overview {
	margin: 0 0 96px 0;
}

.donations-overview.grid-cols {
    -webkit-column-gap: 0;
    -moz-column-gap: 0;
    column-gap: 0;
    row-gap: 0;
}

.donations-overview-image {
	background-color: #1F2123;
	height: 100%;
	min-height: 650px; /*make a decision on this for mobile and tablet*/ 
	background-size: cover;
}

.donations-overview-content {
	background-color: #ffffff;;
	padding: 4rem 3rem;
	min-height: 650px; /*make a decision on this for mobile and tablet*/ 
		display: flex;
	flex-direction: column;
	justify-content: center;
}


/*--------------------------------------------------------------
7. About page Settings
--------------------------------------------------------------*/

/*about page layout 2 edits*/ 
.page-id-59 .single-content {
	margin-top: 2rem!important;
	max-width: 784px;
	margin: auto;
}

/*ACF subtitle*/ 
.entry-subtitle {
	max-width: 784px;
	margin: 1rem auto;
	padding-bottom: 2rem;
	font-size: 2.125rem;
	letter-spacing: 0;
	font-weight: 600;
}


/*--------------------------------------------------------------
8. News and other Archive pages
--------------------------------------------------------------*/

.entry-taxonomies .category-style-pill a {
    color: white;
    padding: 0.25rem;
    border-radius: 0;
    margin-right: 0.25rem;
    margin-bottom: 0.25rem;
    display: inline-block;
    line-height: 1.2;
}

.archive-title {
    text-align: center;
    font-weight: 700;
    font-style: normal;
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: 4px;
    text-transform: uppercase;
}

.archive-title::after {
	content: "Learn more about the latest New Art Studio news and events";
	display: block;
	text-transform: none;
    text-align: center;
    font-style: normal;
    line-height: 1.2;
    max-width: 784px;
    margin: 1rem auto;
    padding-bottom: 2rem;
    font-size: 2.125rem;
    letter-spacing: 0;
    font-weight: 600;
	color: #1F2123;
}

/*--------------------------------------------------------------
9. Contact Us page
--------------------------------------------------------------*/

.wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), .wpcf7 textarea, .wpcf7 select {
    width: 100%;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea {
    -webkit-appearance: none;
    color: #1f2123;
    border: 1px solid #959697;
    border-radius: 0px;
    padding: 0.4em 0.5em;
    max-width: 100%;
    background: rgba(255,255,255,0);
    box-shadow: 0px 0px 0px 0px rgb(0 0 0 / 0%);
}

::-webkit-input-placeholder { /* WebKit browsers */
    color: #959697 !important;
    opacity: 1;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #959697 !important;
    opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #959697 !important;
    opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #959697 !important;
    opacity: 1;
}

/*--------------------------------------------------------------
10. 404, search sidebar pages
--------------------------------------------------------------*/

.widget_search {
	display: none;
}

.primary-sidebar.widget-area .widget {
	background-color: #ffffff;
	padding: 32px;
}


/**
* Layers DevKit Custom Tablet CSS
*/
@media only screen and (min-width: 376px) and (max-width: 768px){
	.about-overview-content {
	min-height: 500px;
	padding: 2rem 1.5rem;
}

.testimonial-overview-content {
	min-height: 500px;
	padding: 2rem 1.5rem;
}

.donations-overview-content {
	min-height: 500px;
	padding: 2rem 1.5rem;
}
}

/**
* Layers DevKit Custom Mobile CSS
*/
@media only screen and (max-width: 375px){
	.about-overview-content {
	min-height: 500px;
	padding: 2rem 1rem;
}

.testimonial-overview-content {
	min-height: 500px;
	padding: 2rem 1rem;
}

.donations-overview-content {
	min-height: 500px;
	padding: 2rem 1rem;
}
}