/* CSS for Glades Day School - GD-FL | Knecht Custom Design, April/May 2020 */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@600;700&family=Play:wght@700&family=Roboto:ital,wght@0,400;0,500;0,700;0,900;1,700&display=swap');

/* Base font size as defined by design: 22px */

/*
Fonts:

font-family: 'Oswald', sans-serif;
font-family: 'Play', sans-serif;
font-family: 'Roboto', sans-serif;

*/

html, body{ font-size: 137.5%; margin: 0 auto; padding: 0; font-family: 'Roboto', sans-serif;}
body{ overflow-y:auto; overflow-x:hidden;}

/* SM 3.0 CSS */
.tool_content, #inside_nav { font-family: 'Roboto', sans-serif;}
.sm3_header_right .account_info a{ font-weight: 500;}
#sm3_body footer{ background: none !important; padding: 0; border: none !important;}
#sm3_body .page_heading_row h1{ font-family: inherit; text-transform: none;}
#sm3_body .main-section{ border: none !important;}


body.nav_open{ overflow: hidden !important;}

h1.hidden{ visibility: hidden; position: absolute; z-index: -100;}

p, #main_container ul, #main_container ol{ font-size: 1rem; line-height: 165%;}
a{ text-decoration: none;}

a{ color: #064931; font-weight: 700; }
.inside_page a:hover{ text-decoration: underline;}

main{ padding-bottom: 11.72727272727273rem;}

#main_container p, #main_container ul, #main_container ol{ letter-spacing: 0.01em;}

fieldset{ border: none; margin: 0; padding: 0;}

h1, h2, h3, h4, h5, h6{ margin: 0; padding: 0;}

.inside_page h1{ font-size: 2.5rem; font-family: 'Oswald', sans-serif; font-weight: 700; letter-spacing: -0.01em; color: #ffc820; line-height: 135%;}
.inside_page h2{ font-size: 2rem; font-family: 'Oswald', sans-serif; font-weight: 700; letter-spacing: 0.025em; color: #064931; line-height: 135%;}
.inside_page h3{ font-size: 1.5rem; font-family: 'Roboto', sans-serif; font-weight: 700; letter-spacing: 0.075em; color: #000000; line-height: 106%;}
.inside_page h4, .tool_headline1{ font-size: 1.363636363636364rem; font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 0.1em; color: #064931; line-height: 116.666666%;}
.inside_page h5, .tool_headline2{ font-size: 1.181818181818182rem; font-family: 'Roboto', sans-serif; font-weight: 700; font-style: italic; letter-spacing: 0.025em; color: #000000; line-height: 134.6153846153846%;}
.inside_page h6{ font-size: 1.090909090909091rem; font-family: 'Roboto', sans-serif; font-weight: 700; letter-spacing: 0.075em; color: #064931; line-height: 145.8333333333333%;}

.wrapper{ margin: 0 auto; max-width: 1800px; width: 93.75%;}
.inside_page .wrapper{ max-width: 100%;}
.flex{ display: flex;}

/*** custom buttons ***/
.button{ color: #064931; font-size: 1.272727272727273rem; letter-spacing: 0.025em; font-weight: 900; text-transform: uppercase; position: relative; padding: 1rem 2rem; text-align: center; display: inline-block; z-index: 1;}
.button:after{ content:""; background: #ffc820; position: absolute; top: 0; left: 0; height: 100%; width: 100%; transform: skew(-15deg, 0deg); border: solid #fff 2px; z-index: -1;}

.button:hover{ color: #ffc820;}
.button:hover:after{ background: #064931;}

.inside_page .button{ font-size: 1rem; line-height: 100%; margin-bottom: 2rem;}
.inside_page .button:after{ box-shadow: 0 0 35px rgba(0,0,0,0.18);}

.right_content .button:before{ content:""; background: #ffc820; position: absolute; top: 0; left: 0; height: 100%; width: 1.5rem; transform: translateX(-1rem); border: solid #fff 2px; z-index: 0; border-right: none; border-left: none;}
.right_content .button:after{ border-left: none;}
.right_content .button:hover:before{ background: #064931;}

/*** blockquote ***/
blockquote{ padding: 3.363636363636364rem 2% 2rem 13%; position: relative; margin: 2.454545454545455rem 0 3.181818181818182rem auto; width: 72%; }
blockquote, blockquote *{ color: #fff !important; font-size: 1.181818181818182rem !important; line-height: 146.1538461538462% !important; letter-spacing: -0.01em !important; font-weight: 700 !important; font-style: italic !important; }
blockquote *{ margin: 0 !important; padding: 0 !important; position: relative; z-index: 1;}

blockquote:after{ content:""; position: absolute; right: 0; top: 0; background-image: url(custom/images/blockquote_bg.svg); background-size: 100% 100%; background-position: right; background-repeat: no-repeat; height: 100%; width: calc(100% + 2.818181818181818rem); transform: translateX(2.818181818181818rem);}

.right_content blockquote{ padding: 3.363636363636364rem 1rem 2rem 13% !important;}
.right_content blockquote:after{ transform: none; width: 100%;}


/** HEADER **/

header{ position: fixed; top: 0; left: 0; width: 100%; padding: 0; margin: 0; z-index: 9990;}

header ul{ margin: 0; padding: 0; list-style: none;}

.header_top{ background: #fff; border-top: solid #545454 2px; text-align: right;}

.utility_nav{ display: inline-block;}
.utility_nav li{ display: inline-block; padding: 0 1rem; position: relative; font-size: 0;}
.utility_nav li:before{ content:""; background: #000; height: 0.7272727272727273rem; width: 1px; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.utility_nav li:first-child:before{ display: none; padding-left: 0;}
.utility_nav li:last-child{ padding-right: 0;}
.utility_nav li a{ font-size: 0.9090909090909091rem; font-weight: 400; color: #000;}

ul.utility_nav.mobile{ display: none;}

.tour_button{ display: inline-block; padding: 0 0 0 3.863636363636364rem; position: relative; transform: translateY(35%); text-align: center; background-image: url( custom/images/tour_bg.svg); background-size: cover; background-position: left center; }
.tour_button a{ color: #fff; font-size: 1.327272727272727rem; font-family: 'Oswald', sans-serif; text-transform: uppercase; padding: 1rem 2.954545454545455rem 1rem 0; position: relative; display: inline-block; z-index: 2; font-weight: 700;}
.tour_button a:hover{ color: #ffc820;}
.tour_button svg{ position: absolute; left: 0; top: 0; height: 100%; z-index: 1;}
.tour_button svg, .tour_button svg *{ fill: #064931 !important;}

.tour_button.show_on_sticky{ display: none; transform: none;}
.tour_button.show_on_sticky a{ font-size: 1rem;}

.header_bottom{ width: 100%; background: #ffc820; border-top: solid #545454 2px; border-bottom: solid #545454 2px; padding: 0 0 0.25rem;}

.header_bottom > .wrapper{ justify-content: space-between; align-items: center; max-width: 100%;}

#logo{}
.logo_icon{ margin-top: -3.5rem; display: inline-block; vertical-align: middle;}
.logo_text{ transform: translateY(30%); vertical-align: inline-block;}

/** FOOTER **/

footer{ background-color: #064931; background-image: url(custom/images/footer_bg.png); background-repeat: no-repeat; background-position: right bottom; background-size: 72% auto; position: relative; width: 100%;}

footer > .wrapper{ position: relative;}

footer .wrapper{ max-width: 100%;}

#footer_logo{ width: 57%; position: absolute; left: 0; top: 0; transform: translateY(-50%) translateX(-3.88726919339164%); font-size: 0; max-width: 46.77272727272727rem;}
#footer_logo img{ display: block; width: 100%; height: auto;}

.footer_top{}

.footer_top > .flex{ justify-content: space-between;}

.footer_top .address_col{ margin-top: 7.5rem;}

.footer_top .address_col address{ font-style: normal; font-weight: 500; font-size: 1.090909090909091rem; line-height: 170%; color: #fff; }
.footer_top .address_col address a{ color: #fff;}
.footer_top .address_col .address_line{ display: block;}
.footer_top .address_col .address_line:nth-child(3){ margin-top: 0.5rem;}
.footer_top .address_col span.yellow{ color: #ffc820; font-style: italic;}

.footer_top .address_col .email{ margin-top: 2rem; align-items: center;}
.footer_top .address_col .email .email_icon svg{ width: 1.409090909090909rem; height: 1.045454545454545rem; margin-right: 10px;}
.footer_top .address_col .email a{ font-weight: 700; font-size: 1.090909090909091rem; line-height: 100%; color: #ffc820; text-transform: uppercase;}

.social_col{ margin-top: 2rem;}
ul.social{ list-style: none; margin: 0; padding: 0;}
ul.social li{ display: inline-block; margin: 0 0.5rem;}
ul.social li a svg{ height: 1.971363636363636rem; max-width: 1.971363636363636rem; display: block;}
ul.social li a svg, ul.social li a svg *{ fill: #fff !important;}
ul.social li a:hover svg, ul.social li a:hover svg *{ fill: #ffc820 !important;}

.footer_bottom{ padding-bottom: 1rem;}
.footer_bottom .copyright p{ color: #fff; font-size: 0.7272727272727273rem; letter-spacing: 0.01em; margin: 1rem 0; padding: 0;}

.footer_bottom .credt_logo{ margin-top: 10px;}
.footer_bottom .credt_logo img{ display: inline-block; max-height: 0.75rem;}

.store_button{ margin-top: 2rem; position: absolute; top: 7.409090909090909rem; right: 0; background-image: url(custom/images/footer_button_bg.png); background-repeat: no-repeat; background-size: 100% 100%; background-position: left center; height: 4.818181818181818rem; display: flex; align-items: center;}
.store_button:hover{ background-image: url(custom/images/footer_button_bg_hover.png);}
.store_button a{ text-transform: uppercase; color: #064931; font-weight: 700; padding: 0 3.125vw 0 121px; font-family: 'Oswald', sans-serif; font-size: 1.818181818181818rem; display: inline-block;}
.store_button:hover a{ color: #ffc820;}

/*********************** INSIDE PAGES *************************/

main.inside_page{ background-image: url(custom/images/inside_watermark.png); background-repeat: no-repeat; background-size: 51.45833333333333% auto; background-position: left bottom;}

/** banner - with image **/
.banner.hasimage{ width: 100%; position: relative; border-bottom: solid 3px #ffc820;}

.banner.hasimage .banner_image{ width: 65%; position: relative; z-index: 1; margin: 0 0 0 auto;}
.banner.hasimage .banner_image img{ display: block; width: 100%; height: auto;}

.banner.hasimage .banner_content{ position: absolute; top: 0; left: 0; width: 55%; height: 100%; z-index: 2; background-image: url(custom/images/banner_angle_bg_full.png); background-size: cover; background-position: right top; background-repeat: no-repeat; display: flex; flex-direction: column; justify-content: center;}

.banner.hasimage .page_title, .banner.hasimage #breadcrumbs{ padding: 0 25% 0 3.125vw;}

.page_title h1{ text-transform: uppercase;}

/* banner without photo */
.banner.noimage{ position: relative; width: 100%; background-color: #064931; background-image: url(custom/images/no_banner_watermark.png); background-size: auto 100%; background-repeat: no-repeat; background-position: left; padding: 8.409090909090909rem 0 6.136363636363636rem 0; border-bottom: solid 3px #ffc820;}

.banner.noimage .banner_content{ margin: 0 auto; text-align: center;}

/** breadcrumbs **/

#breadcrumbs{ margin-top: 1rem;}
#breadcrumbs a{ color: #fff; font-size: 0.8181818181818182rem; font-family: 'Play', sans-serif; letter-spacing: 0.075em; font-weight: 700;}
#breadcrumbs a:hover{ color: #ffc820; }

#breadcrumbs .breadcrumb_divide{ color: #fff; margin: 0 0.5rem; font-size: 0.7272727272727273rem;}

.breadcrumbs{ margin: 1rem 0; display: none;}
.breadcrumbs a{ color: #000; font-size: 0.8181818181818182rem; font-family: 'Play', sans-serif; letter-spacing: 0.075em; font-weight: 700;}
.breadcrumbs a:hover{ color: #064931; }

.breadcrumbs .breadcrumb_divide{ color: #000; margin: 0 0.5rem; font-size: 0.7272727272727273rem;}

/*** indside nav **/
.inside_nav.mobile{ display: none;}

#inside_nav, .inside_nav{ background: #064931; position: relative; margin-bottom: 4.272727272727273rem;}
#inside_nav:after{ content: ""; background-image: url(custom/images/inside_nav_bottom.svg); background-size: 100% 4.272727272727273rem; background-repeat: no-repeat; width: 100%; height: 4.272727272727273rem; display: block; position: absolute; left: 0; bottom: 1px; transform: translateY(100%);}

#inside_nav{ padding: 4.363636363636364rem 1.5rem 2.818181818181818rem;}

#menu{ }
#menu ul{ list-style: none; padding: 0; margin: 0;}

#menu ul li{ margin: 1rem 0;}
#menu ul li:last-child{ margin-bottom: 0;}
#menu > ul > li > a{ color: #fff; font-size: 1.090909090909091rem; font-family: 'Oswald', sans-serif; font-weight: 600; display: inline-block;}
#menu ul li a:hover{ color: #ffc820;}

/** level 2 **/
#menu ul li li{ padding-left: 2rem;}
#menu ul li li li{ padding-left: 2rem;}
#menu ul li li a{ font-size: 0.7727272727272727rem; font-style: italic; letter-spacing: 0.05em; color: #fff; font-weight: 400;}

.page_cat{ color: #ffc820; font-weight: 700; letter-spacing: -0.01em; font-size: 1.363636363636364rem; padding-bottom: 1rem; border-bottom: 1px solid #fff; font-family: 'Oswald', sans-serif;}
.page_cat a{ color: #ffc820; font-weight: 700;}

/** page layouts **/

.middle_column{ margin-top: 2.909090909090909rem;}
.middle_column.with_right{ width: calc(100% - 19.18181818181818rem);}

.right_column{ width: 16.36363636363636rem; margin-left: 2.818181818181818rem;}
.right_per_detail{ padding-top: 2.909090909090909rem;}

/*** tool headings ***/

/* middle */
.middle_column .toolhead_container{ display: block;}
.middle_column h3.toolhead{ color: #064931; font-size: 0.9090909090909091rem; text-transform: uppercase; letter-spacing: 0.13em; font-weight: 700; font-family: 'Oswald', sans-serif; position: relative; padding: 0.5rem 1rem; background: #ffc820; margin-right: 3.909090909090909rem; display: inline-block; margin-bottom: 1.5rem;}
.middle_column h3.toolhead:before{ content:""; position: absolute; top: 0; left: 0; width: 5000px; transform: translateX(-100%); background: #ffc820; height: 100%; display: block;}
.middle_column h3.toolhead:after{ content:""; position: absolute; top: 0; right: 0; width: 3.909090909090909rem; background-image: url(custom/images/middle_toolhead_bg.svg); background-size: cover; background-position: right; background-repeat: no-repeat; height: 100%; transform: translateX(calc(100% - 1px));}

.middle_column .detail_textgraphic img[style*="float:left;"], img.cke_image[style*="float:left"], figure.image[style*="float:left"] img.cke_image{ margin-right: 1rem !important;}
.middle_column .detail_textgraphic img[style*="float:right;"], img.cke_image[style*="float:right"], figure.image[style*="float:right"] img.cke_image{ margin-left: 1rem !important;}

.middle_column .detail_textgraphic figure{ margin-bottom: 0.5rem;}

figcaption{ font-size: 0.8rem; /* padding: 5px 0 0 0; */}

/* right toolhead */
.right_column h3.toolhead{ color: #064931; font-size: 1.363636363636364rem; text-transform: uppercase; letter-spacing: 0.075em; font-weight: 700; font-family: 'Oswald', sans-serif; margin-bottom: 1rem; text-align: left;}

/*** right sidebar ***/
.right_content{ border: solid 1px #b3b3b5; box-sizing: border-box; padding-bottom: 1.5rem;}
.right_content > img{ width: 100%; display: block; margin-bottom: 1rem;}

.right_content > *{ padding: 0 1rem !important;}
.right_content img{ padding: 0 !important; width: 100%; height: auto; display: block; margin-bottom: 2rem;}
.right_content > ul, .right_content > ol{ padding: inherit !important; margin: auto 3rem;}

/*****INSIDE PAGE TOOLS****/
.detail_minical .calendar_form .month_header,
.detail_minical .calendar_options,
.calendar_grid .calendar_grid_headings,
.detail_minical .calendar_grid td,
.calendar_nav,
.calendar_options,
.calendar_grid_day,
.calendar_list_title,
.calendar_list_date/* ,
.slideshow_caption,
.number_pager,
.cycle_overlay,
.post-activity,
.form-item,
.form-label,
.color-button,
.responsive-form input[type="file"],
.responsive-form input, .responsive-form textarea, .responsive-form select,
.news-rss,
.blog_title_all,
.blogtags,
.scrip-writein-row,
.scrip-vendor-name,
.scrip-add-cart-amount,
.scrip-add-cart-qty,
.signup-date,
.grouping-heading,
.login-menu,
.blog-row-header,
.blog-results-row,
.post-nav-left,
.blogattachment,
.header,
.dir-head-link,
.dir-head-back,
.dir-name,
.collapse-btn,
.expandme,
.group-details strong,
.back-to-top,
.profile,
.detail_profiles .staff_header .search_box input[type="text"],
.detail_profiles .popup_box .profile-name,
.detail_profiles .popup_box .profile-title,
.profile-contact,
.detail_profiles .profile-short,
.overlay_details span, .staff_sec thead tr */{font-size: 0.8rem;}

.calendar_list, .detail_minical .calendar_form{ width: calc(100% - 2rem); font-size: 1rem; line-height: 130%;}
.detail_minical table.calendar_grid{ padding: 0 !important; border-collapse: collapse; box-sizing: border-box;}

ul.category.cat-cols{ transform: translateX(-50%);}

/***************** HOME PAGE ***********************/
.home_page ul{ margin: 0; padding: 0; list-style: none;}

/** hero **/

#hero{ position: relative;}

.hero_image_slider{ width: 71%; margin: 0 0 0 auto; position: relative; z-index: 1;}
.hero_image_slider img{ display:block !important; width: 100%; height: auto;}

.hero_content_overlay{ position: absolute; top: 0; left: 0; width: 41.5%; z-index: 2; height: 100%;}

.hero_angle{ /* float: right; */ transform: translateX(75%);}
.hero_angle img{ display: block; height: 100%; width: auto;}

.hero_angle{ /* background: #fff; transform: skew( -25deg, 0deg ); */ position: absolute; width: 125%; height: 100%; right: 0; top: 0; z-index: 1;}
.hero_watermark{ position: absolute; z-index: 2; top: 0; left: 0; width: 76%;}
.hero_watermark img{ display: block; width: 100%; height: auto;}

.hero_content{ position: absolute; left: 3.125%; top: 50%; transform: translateY(-50%); width: 40%; z-index: 3;}

.hero_text_slide{ width: 100%; text-align: left;}
.hero_text_slide h2{ font-size: 2.5rem; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-weight: 700; color: #064931; line-height: 127%;}
.hero_text_slide h2 a{ color: #064931; }

.hero_buttons{ margin-top: 2rem; display: flex; justify-content: space-between;}
.hero_button{ color: #064931; font-size: 1.272727272727273rem; letter-spacing: 0.025em; font-weight: 900; text-transform: uppercase; width: calc( 50% - 0.5rem); position: relative; padding: 1rem 0; text-align: center;}
.hero_button:after{ content:""; background: #ffc820; position: absolute; top: 0; left: 0; height: 100%; width: 100%; transform: skew(-15deg, 0deg); border: solid #fff 2px; z-index: -1;}

.hero_button:hover{ color: #ffc820;}
.hero_button:hover:after{ background: #064931;}

.hero_dots{ margin-top: 2.5rem;}
.hero_dots ul{}
.hero_dots ul li{ display: inline-block; margin: 0 0.5rem;}
.hero_dots ul li:first-child{ margin-left: 0;}

.hero_dots button{ font-size: 0; background: none; border: none; border-radius: 50%; background: #064931; box-shadow: inset 0 0px 7px rgba(0,0,0,0.8),inset 0 0px 14px rgba(255,255,255,0.5); width: 23.12px; height: 23.12px;
}

.hero_dots button:hover, .hero_dots .slick-active button{ background: #ffc820;}

.hero_video{ width: 100%;}
.hero_video video{ display: block; width: 100%; height: auto;}

.overview_bg{ position: absolute; /* left:calc( 100vw * 0.2833333333333333 ); */ top: 0; z-index: -1; height: 90%; /* transform: translateX(-28.36363636363636%); */}
.overview_bg img{ height: 100%; width: auto; max-width: 1100px;}

/** overview section **/
.overview{ position: relative; z-index: 2;}

.overview > .flex{ justify-content: space-between; align-items: center;}

.overview_text{ width: 58%;}
.overview_text p{ font-size: 2.181818181818182rem; font-weight: 500; line-height: 137.5%; letter-spacing: -0.01em; margin: 0; padding: 0;}
.overview_text p span{ color: #064931; font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 0; font-weight: 700;}

.overview_logo{ max-width: 37%; transform: translateY(-30%);}
.overview_logo img{ display: block;}

/** pillars **/
.pillars{ position: relative; margin: 2rem 0 7.272727272727273rem;}

.pillars > .flex{ justify-content: space-between;}

.pillar_item{ position: relative; width: calc( 33.33333333333% - 3.272727272727273rem ); text-align: center; transition: all 0.3s;}

.pillar_item img{ position: relative; display: block; }

.pillar_content{ position: absolute; bottom: 0; left: 0; width: 100%; transition: all 0.3s; overflow: hidden;}
.pillar_content:before{ content:""; position: absolute; width: 105%; height: 200%; z-index: 0; background-color: rgba(255,200,32,0.8); transform: skew( 0deg, -5deg ); top: 0; left: 0; border-top: solid #054c2e 15px; transition: all 0.3s; top: 1rem;}

.pillar_item .hover_content{ visibility: hidden; height: 0; position: relative; z-index: 1; transition: all 0.3s; position: absolute;}

h3.pillar_title{ font-size: 1.818181818181818rem; color: #004b2e; letter-spacing: 0.025em; padding: 4rem 1.5rem 2rem; font-family: 'Oswald', sans-serif; font-weight: 700; position: relative; z-index: 1; text-transform: uppercase;}

.pillar_item:hover .hover_content{ visibility: visible; height: auto; position: relative;}
.pillar_item:hover .pillar_content:before{ background-color: rgba(5,76,46,0.8); border-color: #ffc820;}

.pillar_item:hover h3.pillar_title{ color: #ffc820;}

.pillar_item .hover_content p{ margin: 0; padding: 0 1.5rem 3rem; color: #fff; font-weight: 500; line-height: 164%;}

.pillar_button{ transform: translateY(50%) translateX(-50%); position: absolute; bottom: 0; left: 50%; display: none; text-align: center; box-shadow: 0 4px 32px rgba(0,0,0,0.18);}
.pillar_button a{ color: #064931; font-size: 1rem; letter-spacing: 0.025em; font-weight: 900; text-transform: uppercase; padding: 0.75rem 2.25rem; display: block;}
.pillar_button:after{ content:""; background: #ffc820; position: absolute; top: 0; left: 0; height: 100%; width: 100%; transform: skew(-15deg, 0deg); border: solid #fff 2px; z-index: -1;}

.pillar_button:hover a{ color: #ffc820; }
.pillar_button:hover:after{ background: #064931;}

.pillar_item:hover .pillar_button{ display: inline-block; z-index: 999;}

/** story **/

.story{ position: relative; display: flex;}

.story_img_container{ width: 65%; position: relative; z-index: 1; /* min-height: 33rem; */ background: #000;}
.story_img_container img{ width: 100%; display: block; opacity: 0.74;}

.story_img{ background-size: cover; background-position: center; position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0.74;}

.story_text_container{ position: absolute; right: 0; top: 0; width: 57%; height: 100%; background-image: url(custom/images/story_text_bg.png); background-size: cover; background-position: left center; z-index: 2; display: flex; align-items: center; justify-content: center;}

.story_content{ padding: 0 6% 0 15.5rem; text-align: left;}
h3.story_title{ color: #fff; font-size: 2.181818181818182rem; line-height: 125%; font-weight: 700; font-family: 'Oswald', sans-serif; text-transform: uppercase;}
h5.story_subhead{ font-size: 1.363636363636364rem; color: #ffc820; font-weight: bold; font-family: 'Oswald', sans-serif;}

.story_content p{ margin: 1.5rem 0 0 0; padding: 0; color: #fff; font-size: 1rem; letter-spacing: 0.01em; line-height: 155%; }

.story_button{ margin-top: 2rem; position: relative; color: #064931; font-size: 1.272727272727273rem; letter-spacing: 0.025em; font-weight: 900; text-transform: uppercase; padding: 0.75rem 2.25rem; display: inline-block; box-shadow: 0 4px 32px rgba(0,0,0,0.18);}
.story_button:after{ content:""; background: #ffc820; position: absolute; top: 0; left: 0; height: 100%; width: 100%; transform: skew(-15deg, 0deg); border: solid #fff 2px; z-index: -1;}

.story_button:hover{ color: #ffc820;}
.story_button:hover:after{ background: #064931;}

.story_play_button{ position: absolute; font-size: 0; top: 50%; left: 35%; transform: translateY(-50%); z-index: 2;}

/*** stats ***/
.stats{ padding: 0 0 4.818181818181818rem 0; background-image: url(custom/images/stats_bg.png); background-repeat: no-repeat; background-position: left bottom; background-size: auto 95%;}

.stat_container{ }

.stat_container > .slick-list{ padding: 5.909090909090909rem 0 0 0;}

.stat_container > .slick-dots{ display: flex; align-items: center; justify-content: center; margin: 1.5rem 0;}
.stat_container > .slick-dots li{ margin: 0 0.5rem;}
.stat_container > .slick-dots button{ font-size: 0; background: none; border: none; border-radius: 50%; background: #064931; box-shadow: inset 0 0px 7px rgba(0,0,0,0.8),inset 0 0px 14px rgba(255,255,255,0.5); width: 23.12px; height: 23.12px;}
.stat_container > .slick-dots button:hover, .stat_container > .slick-dots .slick-active button{ background: #ffc820;}

.stat_col{ text-align: center;}
.stat_icon{ width: 7.636363636363636rem; height: 7.636363636363636rem; display: flex; align-items: center; justify-content: center; border-radius: 50%; background-color: #ffc820; border: solid 3px #064931; margin: 0 auto; box-shadow: 0 0 38px rgba(0,0,0,0.14);}
.stat_icon img{ display: block; max-width: 65%;}

h2.stat_title{ font-family: 'Oswald', sans-serif; font-size: 3.272727272727273rem; color: #064931; font-weight: 700; margin-top: 0.75rem;}
h3.stat_subhead{ color: #064931; font-weight: 700; font-size: 1.363636363636364rem; }

.stat_col p{ font-size: 1.090909090909091rem; margin: 0.5rem auto 0; padding: 0 1.5rem; line-height: 125%;}

/** catch all **/
.catchall_slider{ transform: translateX(18%);}

.catchall_slider > .slick-list{ overflow: visible !important; }

.catchall_item{ position: relative; display: flex !important; height: 640px;}

.catchall_text_container{ position: relative; top: 0; left: 0; z-index: 2; display: flex; align-items: center; width: 38%; background: #004b2e;}

/* .catchall_text_container:before{ content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: url(custom/images/catchall_text_bg.png); background-repeat: no-repeat; background-size: cover; z-index: 0;} */

.catchall_text_container:before{ content: ""; position: absolute; left: 0; top: 0; width: 431px; height: 100%; background-image: url(custom/images/catchall_left_angle.png); background-repeat: no-repeat; background-size: cover; z-index: 0; transform: translateX(-79%); background-position: left center;}

.catchall_text_container:after{ content: ""; position: absolute; right: 0; top: 0; width: 444px; height: 100%; background-image: url(custom/images/catchall_right_angle.png); background-repeat: no-repeat; background-size: cover; z-index: 0; transform: translateX(76%); background-position: right center;}

.catchall_content{ position: relative; z-index: 1; margin: 0 auto; transform: translateY(-1rem);}

.catchall_image_container{ width: 62%; margin: 0; position: relative;}

.catchall_img{ position: absolute; top: 0; left: 0; background-size: cover; background-position: center; width: 100%; height: 100%;}

.catchall_image_container img{ display: block; width: 100%; height: auto;}

h2.catchall_title{ color: #fff; font-size: 2.181818181818182rem; line-height: 125%; font-weight: 700; font-family: 'Oswald', sans-serif; text-transform: uppercase; }
.catchall_content p{ margin: 1.5rem 0 0 0; padding: 0; color: #fff; font-size: 1rem; letter-spacing: 0.01em; line-height: 155%; }

.catchall_button{ margin-top: 2rem; position: absolute; color: #064931; font-size: 1.272727272727273rem; letter-spacing: 0.025em; font-weight: 900; text-transform: uppercase; padding: 0.75rem 2.25rem; display: inline-block; box-shadow: 0 4px 32px rgba(0,0,0,0.18); bottom: 3rem; left: 0; z-index: 1;}
.catchall_button:after{ content:""; background: #ffc820; position: absolute; top: 0; left: 0; height: 100%; width: 100%; transform: skew(-15deg, 0deg); border: solid #fff 2px; z-index: -1;}

.catchall_button:hover{ color: #ffc820;}
.catchall_button:hover:after{ background: #064931;}

.catchall .slick-dots{ display: flex; align-items: center; position: absolute; left: 30%; bottom: 3rem; z-index: 10;}
.catchall .slick-dots li{ margin: 0 0.5rem;}
.catchall .slick-dots button{ font-size: 0; background: none; border: none; border-radius: 50%; background: #ffffff; box-shadow: inset 0 0px 7px rgba(0,0,0,0.8),inset 0 0px 14px rgba(255,255,255,0.5); width: 23.12px; height: 23.12px;}
.catchall .slick-dots button:hover, .catchall .slick-dots .slick-active button{ background: #ffc820;}

.catchall_nav{ position: relative;}

.catchall_dot{ font-size: 0;}

/** section titles ***/

h2.section_title{ font-family: 'Oswald', sans-serif; font-size: 2.181818181818182rem; color: #000; margin: 0 0 1rem 0; padding: 0; text-transform: uppercase;}

/*** events section ***/

.events{ padding: 6.727272727272727rem 0; background-image: url(custom/images/events_bg.png); background-repeat: no-repeat; background-position: right top; text-align: center;}

.events h2.section_title{ text-align: center;}

.event_col{ background: #fff; box-shadow: 0 0 38px rgba(0,0,0,0.14); position: relative; padding: 0 0 4rem 0; height: 100%;}

.event_col img{ display: block; width: 100%; height: auto;}

.date_top{ background: #004b2e; text-align: center; padding: 1.5rem 0 0 0;}

.date_top .day{ color: #cecece; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 700; font-size: 1.363636363636364rem; margin: 0 0 0.5rem 0; line-height: 100%;}
.date_top .date_num{ color: #fff; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 700; font-size: 3.272727272727273rem; line-height: 100%;}

.event_list{ padding: 0 1rem; text-align: center;}

.events_slider .slick-slide > div{ margin: 0 1.35rem;}
.events_slider > .slick-list > .slick-track{ padding: 2rem 0 5rem; display: flex;}

.events_slider > .slick-list > .slick-track > .slick-slide{ height: auto;}
.events_slider > .slick-list > .slick-track > .slick-slide > div{ height: 100%;}

.event_item{ display: none; padding: 0.75rem 0;}
.event_item:first-child, .event_item:nth-child(2), .event_item:nth-child(3){ display: block;}
.featherlight-content .event_item{ display: block;}

h6.event_title{ font-size: 1.090909090909091rem; font-weight: 700; letter-spacing: -0.01em; color: #004b2e; line-height: 125%;}
h6.event_title a{ color: #004b2e;}

.event_item p.time{ margin: 0; padding: 0; color: #000; font-size: 0.8181818181818182rem; line-height: 125%; letter-spacing: -0.01em;}

.event_arrow{ display: inline-block; overflow: hidden; position: absolute; bottom: 0; right: 0; width: 57%; padding: 1rem; background-image: url(custom/images/event_arrow_bg.svg); background-size: cover; background-position: left top; text-align: right; background-repeat: no-repeat;}

.event_arrow svg{ width: 0.7272727272727273rem; height: 0.7272727272727273rem; position: relative; top: 10px; transition: all 0.2s;}
.event_arrow:hover svg{ transform: rotate(-90deg);}

.featherlight-content .event_arrow{ display: none;}

.event_col.featherlight-inner{ box-shadow: none; padding: 0;}

.events_slider .slick-dots{ display: flex; align-items: center; justify-content: center; z-index: 10;}
.events_slider .slick-dots li{ margin: 0 0.5rem;}
.events_slider .slick-dots button{ font-size: 0; background: none; border: none; border-radius: 50%; background: #004b2e; box-shadow: inset 0 0px 7px rgba(0,0,0,0.8),inset 0 0px 14px rgba(255,255,255,0.5); width: 23.12px; height: 23.12px;}
.events_slider .slick-dots button:hover, .events_slider .slick-dots .slick-active button{ background: #ffc820;}

.events .button{ margin-top: 2.5rem;}

/*** social feeds ***/

.social{ }
.social .flex{ justify-content: space-between;}
.social h2.section_title{ color: #545454; margin-bottom: 0.5rem; line-height: 100%;}

.social_username{ font-size: 1.090909090909091rem; color: #064931; font-weight: 900; margin-bottom: 1.5rem; display: inline-block;}

.facebook_container{ width: 66.4%;}

.facebook_feed{}
.facebook_feed > .facebook .social-post{ display: flex; margin: 0; padding: 0;}

.facebook_feed > .facebook .social-post .soc-pic{ width: 35%; margin-right: 2rem;}
.facebook_feed > .facebook .social-post img{ display: block; width: 100%; height: auto;}
.facebook_feed > .facebook .social-post p.post-detail{ width: calc( 65% - 2rem); margin: 0; padding: 0; font-size: 1rem; color: #000;}

.facebook_feed > .facebook .social-post .post-more{ color: #004b2e; font-weight: 700; margin-top: 2rem; display: inline-block;}
.facebook_feed > .facebook .social-post .post-more svg{ width: 0.8181818181818182rem; height: 0.7954545454545455rem; margin-left: 8px;}
.facebook_feed > .facebook .social-post .post-more svg, .facebook_feed > .facebook .social-post .post-more svg *{ fill: #004b2e !important;}

.instagram_container{ width: 26%; margin-left: 7.6%;}

.instagram_feed > .facebook{ display: flex; flex-flow: wrap; justify-content: space-between;}
.instagram_feed .social-post{ width: calc(50% - 23px); margin: 0 0 46px 0;}
.instagram_feed .social-post:last-child, .instagram_feed .social-post:nth-child(3){ margin-bottom: 0;}
.instagram_feed .social-post img{ display: block; width: 100%; height: auto;}
.instagram_feed .social-post *{ margin: 0; padding: 0;}

.instagram_feed .social-post span{ display: none;}

/************************* tool fixes/overrides ***************************/

.calendar_grid .calendar_grid_event .calendar_event_tooltip .calendar_tooltip_desc, .calendar_grid .calendar_grid_event .calendar_event_tooltip .calendar_tooltip_dt, .calendar_list *{ line-height: 130% !important;}

.detail_calendar{ font-size: 1rem;}

/**column tools**/

.multi-column-wrapper{ display: inline-block; font-size: 0; vertical-align: top;}
.multi-column-wrapper.maxcols-2{ width: calc(50% - 6px);}
.multi-column-wrapper.maxcols-3{ width: calc(33.3333333333% - 6px);}
.multi-column-wrapper.maxcols-4{ width: calc(25% - 6px);}

.multi-column{ float: none; width: auto !important; margin: 0 !important; padding: 1rem !important;}

@media all and (max-width: 960px){
	.multi-column-wrapper.maxcols-4{ width: calc(50% - 6px);}
}

@media all and (max-width: 640px){
	.multi-column-wrapper{ width: 100% !important;}
}

/*** profiles tool dropdown ***/
.detail_profiles .staff_header .profile ul li a{ color: #fff;}

.calendar_list .calendar_list_event .calendar_list_title, 


/**************** MEDIA QUERIES *******************/
/** sticky header stuff **/
@media all and ( min-width: 1100px ) {
	header.sticky .header_top{ display: none;}
	
	header.sticky .header_bottom{ padding: 0;}
	
	header.sticky .logo_icon{ margin-top: 0; max-height: 60px;}
	
	header.sticky .tour_button.show_on_sticky{ display: inline-block; padding: 0.5rem 1rem 0.5rem 3.863636363636364rem;}
	
	header.sticky .header_bottom > .wrapper{ width: 96.875%; padding: 0 0 0 3.125%; max-width: 100%;}
	
	header.sticky #topnav{ transform: none;}
	
	header.sticky .nav_container{ display: flex; align-items: center;}
}


@media all and ( max-width: 1800px ) {
	.footer_top .address_col{ margin-top: calc(100vw * 0.0885416666666667);}
}
	
@media all and ( max-width: 1600px ) {
	html, body{ font-size: 100%;}
	
	.catchall_item{ height: 500px;}
	
}
	
@media all and ( max-width: 1400px ) {
	.utility_nav li{ padding: 0 0.75rem;}
	
	.instagram_feed .social-post{ width: calc(50% - 10px); margin: 0 0 20px 0;}
}

@media all and ( max-width: 1300px ) {
	.utility_nav li{ padding: 0 0.5rem;}
	
	.header_bottom{ padding:0.25rem 0;}
	.logo_icon{ max-width: 120px; margin-top: -2rem;}
	.logo_text{ max-width: 240px; width: 60%;}
	
	.pillar_item{ width: calc( 33.33333333333% - 1.5rem );}
	
	/** sticky header stuff **/
	header.sticky .tour_button.show_on_sticky{ padding: 0.5rem 0rem 0.5rem 2.5rem;}

}

@media all and ( max-width: 1200px ) {
	.story_content{ padding: 0 6% 0 13.5rem;}
	h3.story_title,h2.catchall_title{ font-size: 1.75rem;}
	h5.story_subhead{ font-size: 1.1rem;}
	.story_content p, .catchall_content p{ margin: 1rem 0 0 0;}
	.story_button, .catchall_button{ margin-top: 1.25rem;}
}

@media all and ( max-width: 1100px ) {
	main{ margin-top: 72px;}
	
	.tour_button{ transform: none; position: fixed; left: 0; bottom: 0; width: 100%; background-image: none; background: #064931; text-align: center; padding: 0; }
	.tour_button a{ padding: 0.75rem 0;}
	
	.logo_icon{ margin-top: 0; max-height: 60px;}
	
	ul.utility_nav{ display: none;}
	ul.utility_nav.mobile{ display: block;}
	
	ul.utility_nav.mobile{ margin:2rem 0 6rem;}
	ul.utility_nav.mobile:before{ content:""; display: block; width: 100px; height: 1px; background: #ffc820; margin: 0 auto 2rem;}
	ul.utility_nav.mobile li{ display: block; padding: 0.5rem 0; text-align: center;}
	
	.utility_nav li{ text-align: center;}
	.utility_nav li:before{ display: none;}
	.utility_nav li a{ color: #fff;}
	
	.pillar_item{ width: calc( 33.33333333333% - 0.75rem );}
	
	.catchall_slider{ transform: translateX(0);}
	.catchall_text_container:before{ display: none;}
	.catchall_text_container:after{ width: 340px;}
	.catchall_text_container{ padding-left: 2rem;}
	.catchall_button{ left: 2rem;}
	
	footer{ margin-bottom: 55px;}
}

@media all and ( max-width: 960px ) {
	.pillars > .flex{ flex-direction: column; align-items: center;}
	.pillar_item{ width: 50%; margin-top: 3rem;}
	.pillar_item:first-child{ margin-top: 0;}
	.pillar_item img{ width: 100%; height: auto;}
	
	.story{ flex-direction: column;}
	.story_img_container{ width: 100%; }
	.story_text_container{ position: relative; width: 100%; height: auto; background-image: none; background-color: #064931; border-top: solid 10px #ffc820; border-bottom: solid 10px #ffc820; top: auto; right: auto;}
	.story_content{ padding: 2rem 3%; margin: 0 auto; text-align: center;}
	.story_content h3, .story_content h5, .story_content p{ text-align: left;}
	.story_play_button{ left: 50%; transform: translateY(-50%) translateX(-50%);}
	
	.page_title h1{ font-size: 1.75rem;}
}

@media all and (max-width: 767px){
	.hero_image_slider{ width: 100%; background: #000;}
	.hero_content{ width: 93%; margin: 0 auto; left: 50%; top: auto; bottom: 1rem; transform: translateX(-50%) translateY(0); text-align: center; }
	.hero_text_slide h2{ color: #fff; font-size: 1.75rem; text-shadow: 0 4px 5px rgba(0,0,0,0.75); text-align: center;}
	.hero_text_slide h2 a{ color: #fff;}
	.hero_buttons{ margin-top: 1rem; justify-content: center;}
	.hero_button{ font-size: 0.9rem; padding: 0.75rem 1.5rem; margin: 0 0.5rem; width: auto;}
	.hero_dots{ margin-top: 1rem;}
	.hero_content_overlay{display: none;}
	
	.overview{ padding: 2rem 0;}
	
	.overview > .flex{ flex-direction: column;}
	.overview_text{ width: 100%; text-align: center;}
	.overview_logo{ transform: none; max-width: 50%;}
	
	.pillar_item{ width: 75%;}
	
	.pillar_item .hover_content{ visibility: visible; height: auto; position: relative;}
	.pillar_item .pillar_content:before{ background-color: rgba(5,76,46,0.8); border-color: #ffc820;}

	.pillar_item h3.pillar_title{ color: #ffc820;}
	
	.pillar_item .pillar_button{ display: inline-block;}
	
	.catchall_item{ height: auto; flex-direction: column;}
	.catchall_text_container{ width: 100%; order: 2; padding-left: 0; background: #004b2e; flex-direction: column; padding-bottom: 6rem;}
	.catchall_image_container{ width: 100%; order: 1; height: 300px;}
	.catchall_text_container:after{ display: none;}
	
	.catchall_content{ padding: 2rem 2rem 1rem; transform: none;}
	
	.catchall_button{ position:relative; left: auto; bottom: auto; margin-top: 0; }
	
	.catchall .slick-dots{ position: absolute; left: 50%; bottom: 1rem; justify-content: center; padding: 1rem 0; transform: translateX(-50%);}
	
	.catchall_slider .slick-track{ background: #004b2e;}
	
	.events{ background-size: auto 60%;}
	
	.social .flex{ justify-content: center; flex-direction: column;}
	.facebook_container{ width: 100%;}
	.instagram_container{ width: 100%; margin-left: 0; margin-top: 4rem;}
}

@media all and (max-width: 640px){
	.pillar_item{ width: 100%;}
	
	/** footer **/
	footer{ background-size: 95% auto; background-position: center bottom;}
	
	#footer_logo{ width: 100%; left: 50%; transform: translateY(-50%) translateX(-50%);}
	.footer_bottom{ padding-bottom: 5rem;}
	
	.footer_top{}
	.footer_top > .flex{ flex-direction: column; align-items: center; justify-content: center;}
	.footer_top .address_col{ margin-top: 5rem;}
	
	ul.social{ text-align: center;}
	
	.store_button{ margin-top: 0; top: auto; position: relative; margin: 2rem auto; background: none; height: auto; display: inline-block;}
	
	.store_button a{ padding: 1rem 4rem; text-align: center; display: inline-block; z-index: 1; background-image: url(custom/images/store_button_watermark.png); background-repeat: no-repeat; background-size: auto 100%; background-position: left; position: relative; font-size: 1rem;}
	.store_button:after{ content:""; background: #ffc820; position: absolute; top: 0; left: 0; height: 100%; width: 100%; transform: skew(-15deg, 0deg); border: solid #fff 2px; z-index: 0;}

	.store_button:hover{ color: #ffc820;}
	.store_button:hover:after{ background: #064931;}
	
	/* .footer_bottom.mobile_button_margin{ margin-top: 9rem;} */
	
	.footer_top .address_col address, .footer_bottom{ text-align: center;}
	.footer_top .address_col .email{ justify-content: center;}
	
	.banner.hasimage .page_title h1{ font-size: 1.25rem;}
	.banner.hasimage #breadcrumbs{ display: none;}
	
	.breadcrumbs{ display: block;}
	
	/** inside pages **/
	#main_container > .flex{ flex-flow: wrap;}
	
	.middle_column.with_right{ width: 100%;}

	.right_column{ width: 100%; margin-top: 2.818181818181818rem; margin-left: 0; border-top: solid 15px #064931;}
	
	#inside_nav{ display: none;}
	.inside_nav.mobile{ display: block; width: calc(100% - 4rem); padding: 2rem; margin-bottom: 0;}
	
	blockquote{ width: 85%;}
	blockquote:after{ transform: none; width: 100%; background-image: url(custom/images/blockquote_bg_mobile.png);}
	
	.middle_column h3.toolhead{ max-width: calc(100% - 5.909090909090909rem); margin-right: 0;}
	.middle_column h3.toolhead::after{ background-image: url(custom/images/middle_toolhead_bg.png); background-size: 100% 100%;}
	
	.inside_page h2{ line-height: 125%;}
}