/*   
Theme Name: StepUp Greensboro
Author: Sandlapper Creative
Author URI: http://www.sandlappercreative.com
Version: 1.0
*/

/*Reset*/
a,hr{padding:0}a,input[type=checkbox]{vertical-align:baseline}article,aside,figure,footer,header,hgroup,hr,img.aligncenter,nav,section{display:block}abbr,address,article,aside,audio,b,blockquote,body,caption,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0;margin:0;padding:0}td,td img{vertical-align:top}embed,img,object{max-width:100%;height:auto;}html{overflow-y:scroll}ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:none}a{font-size:100%;background:0 0;margin:0}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help}.alignleft,img.alignleft{float:left;margin:15px 15px 15px 0}alignright,img.alignright{float:right;margin:15px 0 15px 15px}.aligncenter,img.aligncenter{margin:15px auto}table{border-collapse:collapse;border-spacing:0;font:100%}th{vertical-align:bottom}td{font-weight:400}hr{height:1px;border:0;border-top:1px solid #ccc;margin:1em 0}input,select{vertical-align:middle}pre{white-space:pre-line;word-wrap:break-word}input,select,textarea{font:99% sans-serif}a:active,a:hover{outline:0}small{font-size:85%}strong,th{font-weight:700}sub,sup{font-size:75%;line-height:0;position:relative}sup{top:-.5em}sub{bottom:-.25em}code,kbd,pre,samp{font-family:monospace,sans-serif}.clickable,button,input[type=button],input[type=submit],label{cursor:pointer}button,input,select,textarea{margin:0}button{width:auto;overflow:visible}.ie7 img{-ms-interpolation-mode:bicubic}.ie6 html{filter:expression(document.execCommand("BackgroundImageCache",false,true))}.clearfix:after,.clearfix:before{content:"\0020";display:block;height:0;overflow:hidden}.clearfix:after{clear:both}.clearfix{zoom:1}.ie6 input,input[type=radio]{vertical-align:text-bottom}


/*Styles*/

body{}
body, select, input, textarea{ font-family: "Montserrat", "Gotham", Helvetica, Arial, sans-serif;}

a{ color: #32689c;}
a:hover, a:focus{ color: #a0bd76;}
.button, button{ -webkit-appearance: none; display: inline-block; font-size: 18px; line-height: 18px; text-transform: uppercase; font-weight: bold; letter-spacing: .05em; color: #32689c; background-color: #fada89; padding: 20px 40px; text-decoration: none;}
.button:hover, button:hover, .button:focus, button:focus{ background-color: #fff; color: #32689c;}
.screen-reader, .gform_required_legend{ position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden;}
a, img, .button, button{ transition: all .3s ease 0s;}

h1, h2, h3, h4, h5, h6{ line-height: normal; color: #32689c;}
h1{ font-size: 47px;}
h2{ font-size: 42px;}
h3{ font-size: 33px;}
h4{ font-size: 26px;}
h5{ font-size: 20px;}
h6{ font-size: 16px;}
.lede{ font-size: 18px; font-weight: bold; letter-spacing: .05em; color: #a0bd76; text-transform: uppercase;}

.page-wrap{}
.wrapper, .container{ width: 90%; max-width: 1400px; margin: 0 auto;}
.container{ display: flex;}
.wrapper:after{ content: ""; display: table; clear: both;}

nav ul{ list-style: none; position: relative; float:left; margin:0; padding:0;}
nav ul a{ display: block; line-height: 32px; text-decoration: none;}
nav ul li{ position: relative; float: left; margin: 0; padding: 0;}
nav ul li.current-menu-item a, .nav ul li:hover > a{}
nav ul ul{ display: none; position: absolute; top: 100%; left: 0; padding: 0; text-align: left;}
nav ul ul li{ float: none; width: 200px;}
nav ul ul a{ line-height: 120%;}
nav ul ul ul{ top: 0; left: 100%;}
nav ul li:hover > ul{ display: block;}

.header{ position: fixed; top: 0; left: 0; width: 100%; height: 100px; display: flex; align-items: center; justify-content: space-between; z-index: 999;}
.logged-in .header{ top: 32px;}
.header .branding{ width: 350px; height: 100%; box-sizing: border-box; display: flex; align-items: center; padding: 0 40px; background-color: #fef8e7;}
.header .logo{ max-width: 220px;}
.header .nav{ width: calc(100% - 350px); background-color: #32689c; height: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: flex-end; padding: 0 120px 0 0; font-weight: 700; font-size: 18px; letter-spacing: .025em;}
.header .nav li{ margin-left: 40px;}
.header .nav a{ color: #fff;}
.header .nav li:hover > a{ color: #fada89;}
.header:after{ content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 0; background-color: #fada89; transition: all .3s ease 0s;}
.header.scroll:after{ height: 3px; bottom: -3px; z-index: 999; transition: all .3s ease 0s;}
#rmp_menu_trigger-86{ right: 20px;}
.rmp-menu-subarrow{ font-family: "Font Awesome", FontAwesome, "Font Awesome 6 Free"; font-size: 12px;}
.mobile-only{ display: none;}

.content{ color: #333; font-size: 18px; line-height: 35px; font-weight: 400;}
.content p{ margin-top: 15px;}
.content ul{ list-style: disc; margin: 15px 0 0 30px;}
.content ol{ margin: 15px 0 0 30px;}
.meta{}

.sidebar{}

.navigation{ padding: 0; text-align: center;}
.navigation li a, .navigation li a:hover, .navigation li.active a, .navigation li.disabled{ color: #fff; text-decoration: none;}
.navigation li{ display: inline;}
.navigation li a, .navigation li a:hover, .navigation li.active a, .navigation li.disabled{ background-color: #666; cursor: pointer;}
.navigation li a:hover, .navigation li.active a{ background-color: #333;}

.search-form{}
.search-input{}
.search-submit{}

.footer{ background-color: #fef8e7; padding: 60px 0 90px; border-bottom: 10px solid #336699; font-size: 14px; color: #32689c; font-weight: 400;}
.footer .container{ justify-content: space-between;}
.footer .logo{ max-width: 220px;}
.footer .footer-branding, .footer .footer-contact{ width: 250px;}
.footer .footer-newsletter{ width: calc(100% - 630px);}
.footer .footer-signoff{ margin-top: 50px; text-align: center;}
.footer .footer-headline{ font-weight: 600;}
.footer .footer-contact p{ margin-top: 8px;}
.footer .gmb a, .footer .tel a{ text-decoration: none; color: #32689c;}
.footer .gmb a:hover, .footer .tel a:hover{ text-decoration: underline;}
.footer .footer-cta a{ color: #26aca5; text-transform: uppercase; font-weight: 500;}
.footer .footer-cta a:hover{ text-decoration: none;}
.footer .footer-signoff a{ color: #32689c; text-decoration: none;}
.footer .footer-signoff a:hover{ text-decoration: underline;}
.footer .social{ margin: 25px 0 0; list-style: none;}
.footer .social li{ display: inline-block; margin-right: 10px;}
.footer .social li a{ width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; border-radius: 200px; color: #fff; background-color: #26aca5; text-decoration: none; font-size: 20px;}
.footer .social li a:hover{ background-color: #336699;}
.footer .footer-newsletter{ background-color: #f4eede; padding: 30px 20px; box-sizing: border-box;}
.footer .footer-newsletter .gform_wrapper{ margin: 15px 0 0;}
.footer .footer-newsletter .gform_footer{ display: none !important;}
.footer .footer-newsletter .gform_body .ginput_container input{ border: none; background: none; background-color: #fff; font-size: 14px; padding: 15px !important; color: #336699; font-weight: 500;}
.footer .footer-newsletter .gform-button{ border: none; padding: 15px 55px; background-color: #336699; color: #fff;}
.footer .footer-newsletter .gform-button:hover{ color: #336699; background-color: #fada89;}

.video-wrapper{ position: relative; padding-bottom: 56.25%; height: 0;}
.video-wrapper iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.fancybox-container{ z-index: 9999999 !important;}
.fancybox-button{ background-color: #222 !important; color: #fff !important;}


/* Homepage */

.home .hero{ background-color: #fef8e7; height: calc(100vh - 132px); display: flex; align-items: center; position: relative; padding-top: 100px; box-sizing: border-box;}
.home .hero .hero-aside{ background-color: #32689c; position: absolute; top: 100px; right: 0; height: calc(100% - 100px); text-align: center; display: flex; align-items: center; box-sizing: border-box; width: 100px; justify-content: center;}
.home .hero .hero-aside a{ writing-mode: vertical-rl; color: #fff; text-decoration: none; font-size: 18px; letter-spacing: .2em; font-weight: bold; text-transform: uppercase; display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: 20px; width: 100px; height: 100%; box-sizing: border-box; padding-right: 0;}
.home .hero .hero-aside a:after{ content: ""; width: 30px; height: 30px; background-image: url(images/video.png); background-size: cover; background-position: center; display: block; flex-shrink: 0; transition: all .3s ease 0s;}
.home .hero .hero-aside a:hover:after{ width: 40px; height: 40px; transition: all .3s ease 0s; margin-top: 5px;}
.home .hero .hero-aside:hover a{ color: #fada89;}
.home .hero .hero-container{ display: flex; flex-direction: row-reverse; align-items: stretch; justify-content: space-between; width: calc(100% - 100px); height: 100%;}
.home .hero .hero-content, .home .hero .hero-visual{ width: 50%; box-sizing: border-box;}
.home .hero .hero-visual{ background-size: cover; background-position: center center;}
.home .hero .hero-content{ display: flex; justify-content: center; flex-direction: column; padding: 0 10% 0 40px; font-size: 18px; line-height: 35px;}
.home .hero .hero-content h1{ font-size: 47px; line-height: 51px; color: #32689c; font-weight: 900;}
.home .hero-cta{ height: 100px; width: calc(100% - 100px); background-color: #26aca5; box-sizing: border-box; display: flex; align-items: center; position: relative;}
.home .hero-cta:before{ content: ""; width: 100px; height: 100px; display: block; background-color: #32689c; position: absolute; top: 0; right: -100px;}
.home .hero-cta a{ color: #fff; text-decoration: none; font-size: 18px; letter-spacing: .2em; font-weight: bold; text-transform: uppercase; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; padding: 0 40px; z-index: 9;}
.home .hero-cta:after{ content: ""; display: block; width: calc(100% - 800px); height: 20px; background-size: cover; background-position: right center; background-image: url(images/hero-cta.png); position: absolute; right: 60px; transition: all .3s ease 0s;}
.home .hero-cta:hover:after{ right: -60px; width: calc(100% - 680px); transition: all .3s ease 0s;}

.content .programs{ margin: 100px 0 150px;}
.content .programs .programs-headlines{ display: flex; align-items: center;}
.content .programs .programs-headlines h2{ font-size: 47px; font-weight: 900; color: #32689c; margin-right: 40px;}
.content .programs .programs-headlines a{ font-size: 18px; text-transform: uppercase; font-weight: bold; color: #26aca5; letter-spacing: .05em; text-decoration: none; display: flex; align-items: center; margin-top: 4px;}
.content .programs .programs-headlines a:after{ content: "\f061"; font-family: "Font Awesome", FontAwesome, "Font Awesome 6 Free"; font-size: 12px; margin-left: 8px; transition: all .3s ease 0s;}
.content .programs .programs-headlines a:hover:after{ margin-left: 15px; transition: all .3s ease 0s;}
.content .programs .programs-intro{ margin-bottom: 60px;}
.content .programs .programs-intro p{ width: 50%;}
.content .programs .programs-carousel .slick-list{ padding: 0 !important;}
.content .programs .programs-carousel .slick-track{ display: flex !important;}
.content .programs .programs-carousel .slick-slide{ height: auto; display: flex;}
.content .programs .single-program{ height: 100%; display: flex; flex-direction: column;}
.content .programs .program-visual{ background-size: cover; background-position: center center; position: relative; opacity: .5; transition: all .3s ease 0s;}
.content .programs .program-visual:after{ content: ""; padding-bottom: 100%; display: block;}
.content .programs .program-visual span a{ position: absolute; bottom: 0; left: 0; font-size: 18px; line-height: 18px; text-transform: uppercase; font-weight: bold; letter-spacing: .05em; color: #32689c; background-color: #fada89; padding: 20px 40px; visibility: hidden; opacity: 0; display: none; text-decoration: none;}
.content .programs .program-visual span a:hover{ background-color: #fff; transition: all .3s ease 0s;}
.content .programs .single-program.slick-current .program-visual, .home .programs .single-program:hover .program-visual{ opacity: 1; transition: all .3s ease 0s;}
.content .programs .single-program.slick-current .program-visual span a, .home .programs .single-program:hover .program-visual span a{ visibility: visible; opacity: 1; display: inline-block;}
.content .programs .program-content{ padding: 50px 40px 60px; color: #fff; flex: 1; display: flex; flex-direction: column;}
.content .programs .program-content h3{ font-size: 29px; font-weight: 600; color: #fff;}
.content .programs .single-program:nth-child(3n+1) .program-content{ background-color: #a0bd76;}
.content .programs .single-program:nth-child(3n+2) .program-content{ background-color: #26aca5;}
.content .programs .single-program:nth-child(3n+3) .program-content{ background-color: #32689c;}
.content .programs .slick-dots{ margin: 0; margin-bottom: -40px;}
.content .programs .slick-dots li, .content .programs .slick-dots li button{ width: 85px;}
.content .programs .slick-dots li button::before{ content: ""; display: block; width: 85px; height: 10px; background-color: #e1e1e1; opacity: 1;}
.content .programs .slick-dots li.slick-active button::before{ background-color: #fada89;}
.content .programs .slick-arrow{ top: -60px; opacity: 1; width: 50px; height: 50px; background-size: cover; background-position: center center;}
.content .programs .slick-prev{ left: auto; right: 120px; background-image: url(images/slick-prev.png);}
.content .programs .slick-next{ right: 40px; background-image: url(images/slick-next.png);}
.content .programs .slick-prev::before, .content .programs .slick-next::before{ color: #fada89; content: "";}
.content .programs .more{ font-size: 18px; text-transform: uppercase; font-weight: bold; color: #fff; letter-spacing: .05em; text-decoration: none; display: flex; align-items: center; margin-top: 4px; display: inline-block; margin-top: 25px;}
.content .programs .more:after{ content: "\f061"; font-family: "Font Awesome", FontAwesome, "Font Awesome 6 Free"; font-size: 12px; margin-left: 8px; transition: all .3s ease 0s;}
.content .programs .more:hover:after{ margin-left: 15px; transition: all .3s ease 0s;}

.home .stats{ background-color: #fef8e7; padding: 85px 0 95px; text-align: center; margin-bottom: 100px;}
.home .stats h2{ font-size: 47px; font-weight: 900; color: #32689c; margin-bottom: 60px;}
.home .stats .stats-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 60px;}
.home .stats .stat-icon{ display: flex; align-items: center; justify-content: center; width: 150px; height: 150px; margin: 0 auto 35px;}
.home .stats .stat-icon img{ max-width: 100%; max-height: 100%; width: auto; height: auto;}
.home .stats p{ margin: 0;}
.home .stats .stat-number{ color: #a0bd76; font-weight: 900; font-size: 72px; line-height: 72px; margin-bottom: 15px;}
.home .stats .stat-label{ font-size: 28px; line-height: 28px; font-weight: 600; color: #32689c; margin-bottom: 5px;}

.home .steps{ overflow-x: hidden;}
.home .steps h2{ text-align: center; font-size: 47px; font-weight: 900; color: #32689c; margin-bottom: 60px;}
.home .steps .single-step{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 60px;}
.home .steps .step-visual, .home .steps .step-content{ width: 48%;}
.home .steps .step-visual{ background-size: cover; background-position: center center; position: relative;}
.home .steps .step-visual:after{ content: ""; padding-bottom: 100%; display: block;}
.home .steps .step-content{ padding: 0 5% 0 1%; box-sizing: border-box; background-color: #fff;}
.home .steps .step-content h3{ font-size: 29px; font-weight: bold; color: #32689c; margin-top: 10px; position: relative;}
.home .steps a{ font-size: 18px; text-transform: uppercase; font-weight: bold; color: #26aca5; letter-spacing: .05em; text-decoration: none; display: flex; align-items: center; margin-top: 4px; margin-top: 25px;}
.home .steps a:after{ content: "\f061"; font-family: "Font Awesome", FontAwesome, "Font Awesome 6 Free"; font-size: 12px; margin-left: 8px; transition: all .3s ease 0s;}
.home .steps a:hover:after{ margin-left: 15px; transition: all .3s ease 0s;}
.home .steps .single-step:nth-of-type(even){ flex-direction: row-reverse;}
.home .steps .single-step:nth-of-type(even) .step-content{ padding: 0 1% 0 5%; background: none;}
.home .steps .single-step:nth-of-type(odd) .step-visual:before{ content: ""; display: block; position: absolute; top: 20px; left: 20px; width: 100%; height: 100%; box-sizing: border-box; border:  3px solid #fada89; z-index: -1; background-color: #fff;}
.home .steps .single-step:nth-of-type(even) .step-visual:before{ content: ""; display: block; position: absolute; top: 20px; right: 20px; width: 100%; height: 100%; box-sizing: border-box; border:  3px solid #fada89; z-index: -1; background-color: #fff;}
.home .steps .single-step:nth-of-type(odd) .step-content h3:before{ content: ""; width: 100%; height: 3px; display: block; background-color: #fada89; position: absolute; top: 18px; left: -50%; z-index: -2;}
.home .steps .single-step:nth-of-type(even) .step-content h3:before{ content: ""; width: 1000%; height: 3px; display: block; background-color: #fada89; position: absolute; top: 18px; right: -1000%; z-index: -2;}
.home .steps .single-step:nth-of-type(even) .step-content h3{ display: inline-block; background-color: #fff; padding-right: 20px;}

.home .signoff{ position: relative;}
.home .signoff:after{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/home-signoff.png); background-position: center center; background-size: 80%; background-repeat: no-repeat;}

.home .testimonials{ text-align: center; background-color: #32689c; padding: 100px 0; margin-top: 120px;}
.home .testimonials blockquote{ font-size: 30px; line-height: 50px; font-weight: 300; color: #fff; max-width: 850px; margin: 0 auto;}
.home .testimonials .quote-source{ font-size: 18px; font-weight: bold; letter-spacing: .05em; color: #a0bd76; text-transform: uppercase; margin-top: 60px;}
.home .testimonials .slick-arrow{ opacity: 1; width: 50px; height: 50px; background-size: cover; background-position: center center; z-index: 5;}
.home .testimonials .slick-prev{ left: 5%; background-image: url(images/slick-prev.png);}
.home .testimonials .slick-next{ right: 5%; background-image: url(images/slick-next.png);}
.home .testimonials .slick-prev::before, .home .testimonials .slick-next::before{ color: #fada89; content: "";}
.home .testimonials .slick-list{ position: relative; z-index: 3;}

.home .cta{ background-color: #26aca5; color: #fff; padding: 100px 0; text-align: center;}
.home .cta .wrapper{ position: relative; z-index: 2;}
.home .cta h2{ font-size: 47px; font-weight: 900; color: #fff;}
.home .cta p{ max-width: 500px; margin: 15px auto 30px;}
.home .cta ul{ margin: 15px 0 0; list-style: none;}
.home .cta ul li{ display: inline-block; margin: 0 10px;}


/* Flexible Content */

.flex{ margin: 100px 0 0;}
.flex .page-section{ padding: 80px 0;}

.flex .hero{ background-color: #fef8e7;}
.flex .hero .hero-container{ display: flex; justify-content: space-between;}
.flex .hero .hero-content, .flex .hero .hero-visual{ width: 50%; box-sizing: border-box;}
.flex .hero .hero-visual{ background-size: cover; background-position: center center;}
.flex .hero .hero-visual:after{ content: ""; padding-bottom: 100%; display: block;}
.flex .hero .hero-content{ display: flex; justify-content: center; flex-direction: column; padding: 0 10% 0 40px; font-size: 18px; line-height: 35px; align-items: flex-start;}
.flex .hero .hero-content h1{ font-size: 47px; line-height: 51px; color: #32689c; font-weight: 900;}
.flex .hero .hero-content .button{ margin-top: 30px;}

.flex .basic-container{ background-color: #fef8e7;}
.flex .basic-container .wrapper{ max-width: 960px;}
.flex .basic-container h2, .flex .basic-container h3, .flex .basic-container h4, .flex .basic-container h5, .flex .basic-container h6, .flex .columns-container .column h2{ margin-top: 30px;}

.flex .callouts-container h2{ font-size: 29px;}
.flex .callouts-container .single-callout{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 60px;}
.flex .callouts-container .callout-visual, .flex .callouts-container .callout-content{ width: 48%;}
.flex .callouts-container .callout-visual{ background-size: cover; background-position: center center; position: relative;}
.flex .callouts-container .callout-visual:after{ content: ""; padding-bottom: 100%; display: block;}
.flex .callouts-container .callout-content{ padding: 0 5% 0 1%; box-sizing: border-box; background-color: #fff;}
.flex .callouts-container .callout-content h2{ font-size: 29px; font-weight: bold; color: #32689c; margin-top: 10px; position: relative;}
.flex .callouts-container .more{ font-size: 18px; text-transform: uppercase; font-weight: bold; color: #26aca5; letter-spacing: .05em; text-decoration: none; display: flex; align-items: center; margin-top: 4px; display: inline-block; margin-top: 25px;}
.flex .callouts-container .more:after{ content: "\f061"; font-family: "Font Awesome", FontAwesome, "Font Awesome 6 Free"; font-size: 12px; margin-left: 8px; transition: all .3s ease 0s;}
.flex .callouts-container .more:hover:after{ margin-left: 15px; transition: all .3s ease 0s;}
.flex .callouts-container .single-callout:nth-of-type(even){ flex-direction: row-reverse;}
.flex .callouts-container .single-callout:nth-of-type(even) .callout-content{ padding: 0 1% 0 5%; background: none;}
.flex .callouts-container .single-callout:nth-of-type(odd) .callout-visual:before{ content: ""; display: block; position: absolute; top: 20px; left: 20px; width: 100%; height: 100%; box-sizing: border-box; border:  3px solid #fada89; z-index: -1; background-color: #fff;}
.flex .callouts-container .single-callout:nth-of-type(even) .callout-visual:before{ content: ""; display: block; position: absolute; top: 20px; right: 20px; width: 100%; height: 100%; box-sizing: border-box; border: 3px solid #fada89; z-index: -1; background-color: #fff;}

.flex .columns-container .container{ justify-content: space-between; max-width: 960px;}
.flex .columns-container .column{ width: 46%;}
.flex .columns-container .columns-headline{ text-align: center;}

.flex .cta-container{ background-color: #26aca5; color: #fff; padding: 100px 0; text-align: center; margin: 0;}
.flex .cta-container .wrapper{ position: relative; z-index: 2;}
.flex .cta-container h2{ font-size: 47px; font-weight: 900; color: #fff;}
.flex .cta-container p{ max-width: 500px; margin: 15px auto 30px;}
.flex .cta-container ul{ margin: 0; list-style: none;}
.flex .cta-container ul li{ display: inline-block; margin: 0 10px;}

.flex .fwimg-container{ padding: 0;}

.flex .form-container .wrapper{ max-width: 960px;}
.flex .form-container h2{ margin-bottom: 20px; font-weight: 900;}
.flex .form-container .gform_body input, .flex .form-container .gform_body textarea, .form-container .gform_body select{ border: 1px solid #32689c; padding: 20px !important; background-color: #fff;}
.flex .form-container .gform_button{ border: none;}
.flex .form-container .gform_button:hover{ color: #fff; background-color: #32689c;}

.flex .giving-container{ padding: 100px 0 30px; text-align: center;}
.flex .giving-container .tiers{ display: grid; grid-template-columns: repeat(3,1fr); gap: 0;}
.flex .giving-container .single-tier{ border-right: 1px solid #32689c; border-bottom: 1px solid #32689c; padding: 30px;}
.flex .giving-container .single-tier:nth-child(3n){ border-right: none;}
.flex .giving-container .single-tier:nth-last-child(-n+3){ border-bottom: none;}
.flex .giving-container .monthly{ font-size: 21px; line-height: 25px; font-weight: 700; margin: 0; color: #32689c;}
.flex .giving-container .annual{ font-size: 16px; line-height: 20px; font-weight: 600; color: #a0bd76; margin: 0;}
.flex .giving-container .description{ font-size: 16px; line-height: 24px;}

.flex .people-container .people-grid{ display: grid; grid-template-columns: repeat(3,1fr); column-gap: 40px; row-gap: 60px; text-align: center;}
.flex .people-container h2{ font-size: 29px; font-weight: 700;}
.flex .people-container h3{ font-size: 20px; margin-bottom: 15px; color: #a0bd76;}
.flex .people-container .person-headshot{ background-size: cover; background-position: center center; margin-bottom: 20px;}
.flex .people-container .person-headshot:after{ content: ""; padding-bottom: 100%; display: block;}
.flex .people-container p{ margin: 10px 0 0; font-size: 16px; line-height: 20px;}

.flex .volunteer-container{ background-color: #32689c; color: #fff; padding: 80px 0;}
.flex .volunteer-container h2, .flex .volunteer-container h3{ color: #fff;}
.flex .volunteer-container h2{ margin-bottom: 40px; font-weight: 900;}
.flex .volunteer-container h3{ color: #fada89; transition: all .3s ease 0s;}
.flex .volunteer-container .availability{ font-weight: 600; font-size: 14px; line-height: 20px; margin-top: 20px;}
.flex .volunteer-container .opportunities-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 40px; font-size: 18px; line-height: 24px;}
.flex .volunteer-container .single-opportunity{ border: 3px solid #fada89; padding: 40px 40px 60px; transition: all .3s ease 0s;}
.flex .volunteer-container .single-opportunity:hover{ border: 3px solid #fff; transition: all .3s ease 0s;}
.flex .volunteer-container .single-opportunity:hover h3{ color: #fff; transition: all .3s ease 0s;}
.flex .volunteer-container .single-opportunity a{ color: #fada89; font-weight: bold; letter-spacing: .05em; text-transform: uppercase; font-size: 14px; text-decoration: none; margin-top: 20px; display: flex;}
.flex .volunteer-container .single-opportunity a:after{ content: "\f061"; font-family: "Font Awesome", FontAwesome, "Font Awesome 6 Free"; font-size: 12px; margin-left: 8px; transition: all .3s ease 0s;}
.flex .volunteer-container .single-opportunity a:hover{ color: #fff;}
.flex .volunteer-container .single-opportunity a:hover:after{ margin-left: 12px;}

.flex .gallery-container, .flex .logos-container{ text-align: center;}
.flex .gallery-container .gallery-intro, .flex .logos-container .logos-intro{ max-width: 960px; margin: 0 auto;}
.flex .gallery-container .gallery-grid{ display: grid; grid-template-columns: repeat(4,1fr); gap: 30px; margin-top: 45px;}
.flex .gallery-container .single-image{ background-size: cover; background-position: center center; position: relative; transition: all .3s ease 0s;}
.flex .gallery-container .single-image:after{ content: ""; padding-bottom: 100%; display: block;}
.flex .gallery-container .single-image:hover{ opacity: .85; transition: all .3s ease 0s;}
.flex .gallery-container .single-image a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.flex .logos-container{ overflow-x: hidden;}
.flex .logos-container .single-logo{ display: flex; align-items: center; justify-content: center;}
.flex .logos-container .single-logo img{ max-width: 200px; max-height: 150px; width: auto; height: auto;}
.flex .logos-container .logo-grid{ margin-top: 45px;}
.flex .logos-container .logo-grid .slick-slide{ margin: 0 40px;}
.flex .logos-container .logo-grid .slick-list{ margin: 0 -40px;}


/* News */

.blog .content{ padding: 200px 0 100px; background-color: #fef8e7; text-align: center;}
.blog .intro{ max-width: 960px; margin: 0 auto;}
.blog .article-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; text-align: left; margin-top: 45px;}
.blog .article-grid .article-content{ background-color: #fff; padding: 20px 30px 25px; font-size: 16px; line-height: 24px;}
.blog .article-grid .article-content h2{ font-size: 26px;}
.blog .article-grid .article-content h2 a{ text-decoration: none;}
.blog .article-grid .article-visual{ background-size: cover; background-position: center center; position: relative;}
.blog .article-grid .article-visual:after{ content: ""; padding-bottom: 56.25%; display: block;}
.blog .article-grid .article-visual a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.blog .article-grid .logo-visual{ background-color: #fff; display: flex; align-items: center; justify-content: center;}
.blog .article-grid .logo-visual img{ max-width: 250px; height: auto;}
.blog .facetwp-facet-post_pager{ text-align: center; margin-top: 60px;}
.blog .facetwp-facet-post_pager button{ border: none;}
.single h1{ text-align: center;}
.single .content{ padding: 200px 0 100px;}
.single .content .wrapper{ max-width: 960px;}
.single .meta{ text-align: center;}
.single .meta p{ margin: 0; font-size: 14px; text-transform: uppercase; letter-spacing: .05em; font-weight: 500;}
.single .featuredimg{ margin: 30px auto; text-align: center;}
.single h2, .single h3, .single h4, .single h5, .single h6{ margin-top: 30px;}
.single-event .entry-summary{ text-align: center;}
.single-event .entry-summary .button, .single-event .entry-content .button{ margin-top: 20px;}



/* Media queries */

@media (max-width: 1200px) {
	.header{ background-color: #fef8e7;}
	.header .nav{ display: none;}
	.mobile-only{ display: block;}
	#rmp_menu_trigger-86{ width: 100px; height: 100px; background-color: #32689c; top: 0; right: 0; border-radius: 0;}
	.hero{ height: auto;}
	.hero-container{ flex-direction: column-reverse;}
	.hero .hero-content, .hero .hero-visual{ width: 100% !important;}
	.hero .hero-visual:after{ content: ""; padding-bottom: 65% !important; display: block;}
	.home .hero .hero-content{ padding: 40px 10% 40px 40px;}
	.flex .hero .hero-container{ flex-direction: column;}
	.flex .hero .hero-content{ padding: 40px 5%;}
}

@media (max-width: 960px) {
	.home{ overflow-x: hidden;}
	.hero{ display: block;}
	.home .hero{ flex-direction: column; height: auto;}
	.home .hero .hero-container, .home .hero .hero-aside{ display: block; position: relative; width: 100%; height: auto;}
	.home .hero .hero-aside{ top: auto; bottom: auto; right: auto; left: auto; padding: 20px 0 30px;}
	.home .hero .hero-aside a{ display: block; width: auto; height: auto; writing-mode: horizontal-tb; letter-spacing: .05em;}
	.home .hero .hero-aside a::after{ width: 30px !important; height: 30px !important; margin: 5px auto 0 !important;}
	.home .hero-cta{ width: 100%; height: auto;}
	.home .hero-cta::after{ display: none;}
	.home .hero-cta a{ position: relative; display: block; padding: 30px 0; text-align: center; letter-spacing: .05em; font-size: 18px; line-height: 21px;}
	.content .programs .programs-headlines{ flex-direction: column; align-items: flex-start;}
	.content .programs .programs-intro p{ width: 100%;}
	.content .programs .programs-intro{ margin-bottom: 120px;}
	.home .stats .stats-grid{ grid-template-columns: repeat(1,1fr); gap: 40px;}
	.home .steps .single-step{ flex-direction: column !important; margin-bottom: 0;}
	.home .steps .step-visual, .home .steps .step-content, .flex .callouts-container .callout-content, .flex .callouts-container .callout-visual{ width: 100%;}
	.home .steps .single-step .step-visual:before, .home .steps .single-step .step-content h3:before, .flex .callouts-container .callout-visual:before{ display: none !important;}
	.home .steps .step-visual:after, .flex .callouts-container .flex-visual:after{ content: ""; padding-bottom: 56.25%; display: block;}
	.home .steps .step-content, .flex .callouts-container .callout-content{ padding: 40px 5% 60px !important;}
	.home .testimonials blockquote{ font-size: 21px; line-height: 28px; width: 60%; margin: 0 auto;}
	.home .cta ul li{ display: block; margin: 0 0 20px;}
	.home .cta ul li .button{ width: 100%; text-align: center; box-sizing: border-box;}
	.footer .container{ flex-direction: column; text-align: center;}
	.footer .footer-branding, .footer .footer-contact{ width: 100%;}
	.footer .footer-contact{ margin-top: 30px;}
	.footer .footer-newsletter{ width: 100%; margin-top: 30px;}
	.flex .hero .hero-content h1, .flex .page-section h2{ font-size: 36px; line-height: 40px;}
	.flex .callouts-container .single-callout{ flex-direction: column !important; margin-bottom: 0;}
	.flex .volunteer-container .opportunities-grid, .flex .people-container .people-grid, .blog .article-grid{ grid-template-columns: repeat(2,1fr);}
	.flex .giving-container .tiers{ grid-template-columns: repeat(1,1fr);}
	.flex .giving-container .single-tier{ border-right: none !important; border-bottom: 1px solid #32689c !important;}
}

@media (max-width: 600px) {
	.logged-in .header{ top: 46px;}
	.content .programs .slick-arrow{ display: none !important;}
	.flex .volunteer-container .opportunities-grid, .flex .people-container .people-grid, .blog .article-grid{ grid-template-columns: repeat(1,1fr);}
	.flex .columns-container .container{ flex-direction: column;}
	.flex .columns-container .container .column{ width: 100%;}
}
