/* global */
:root { --black: #000; --green: #006651; --green-light: #F3EDE5; --grey-dark: #282F36; --white: #FFF }
html { scroll-behavior: smooth }
body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; background-color: var(--white); color: var(--black); font-family: "proxima-soft", sans-serif }
	body.no-scroll { overflow: hidden }
#overlay-sidebar { background-color: rgba(0, 0, 0, 0.7); display: none; height: 100vh; opacity: 0; position: fixed; transition: all 0.5s ease-in-out; width: 100vw; z-index: 999 }
	#overlay-sidebar.open { display: block; opacity: 1 }
a { text-decoration: none !important }
header { background-color: var(--green); padding: 20px }
    header #btn-sidebar { color: var(--white); display: block; font-size: 30px; margin-top: 9px; text-align: right; text-transform: uppercase }
        header #btn-sidebar i { padding-left: 5px }
#footer-modal { background-image: url("/img/home/curly-banner.webp"); background-position: center; background-repeat: no-repeat; background-size: cover; height: 350px; text-align: center }
    #footer-modal .container, #footer-modal .container .row { height: 100% }
    #footer-modal #footer-modal-content { background-color: rgba(243, 237, 229, 0.85); height: 300px; text-align: center; margin: 25px 10px }
        #footer-modal #footer-modal-content h4, #footer-modal #footer-modal-content h5 { font-size: 32px; margin-bottom: 40px; text-transform: uppercase }
        #footer-modal #footer-modal-content a { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; background-color: var(--green); color: var(--white); font-size: 20px; padding: 7px 100px; text-transform: uppercase; transition: 0.3s }
        #footer-modal #footer-modal-content a:hover { background-color: var(--white); color: var(--green) }
footer { background-color: var(--green); color: var(--white); padding: 50px 0 45px 0 }
    footer #footer-left { padding-right: 120px }
        footer #footer-left h4 { font-size: 30px; font-weight: 700; margin-bottom: 30px; text-transform: uppercase }
        footer #footer-left p { font-size: 18px; padding-top: 20px }
        footer #footer-left #footer-social a { color: var(--white); font-size: 36px; padding-right: 10px }
    footer #footer-address { padding-right: 20px }
        footer #footer-address h5, footer #footer-hours h5 { font-size: 26px; margin-bottom: 30px }
        footer #footer-address address { font-size: 18px; margin-bottom: 0 }
        footer #footer-address a { color: var(--white); display: block; font-size: 18px; margin-top: 10px }
    footer #footer-hours { padding-left: 20px }
        footer #footer-hours p { font-size: 18px }
#footer-bottom { font-size: 14px; }
#footer-bottom #footer-legal { margin-top: 40px; text-align: center }
    #footer-bottom a { color: var(--green) }
    #footer-bottom #footer-legal span { padding: 0 5px }
#footer-bottom .funded { padding-top: 30px }
#footer-bottom .council { padding: 10px 0 }
#footer-bottom p #legal { font-size: 14px!important; }
#footer-bottom p #legal a { #000 }

/* sidebar */
#sidebar { -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); -moz-transition: 0.5s all ease; -o-transition: 0.5s all ease; -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); -webkit-transition: 0.5s all ease; background-color: var(--grey-dark); box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); height: 100vh; right: -275px; overflow: auto; padding-bottom: 120px; position: fixed; top: 0; transition: 0.5s all ease; width: 275px; z-index: 1000 }
	#sidebar.open { right: 0 }
	#sidebar h6 { color: var(--white); font-size: 29px; font-weight: 300; margin: 18px 0 0 15px; text-transform: uppercase }
	#sidebar #btn-sidebar-close { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; background-color: var(--white); border: none; color: var(--black); display: block; font-size: 29px; height: 45px; margin: 15px 15px 0 0; padding: 0 0 0 0; transition: 0.3s; width: 45px !important }
	#sidebar #btn-sidebar-close:hover { background-color: var(--green); color: var(--white) }
	#sidebar ul { font-size: 18px; list-style: none; margin: 25px 0 0 0; padding: 0 }
		#sidebar ul li a { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; color: var(--white); display: block; font-weight: 300; padding: 5px 15px; position: relative; transition: 0.3s }
		#sidebar ul li a:hover { background-color: var(--green); color: var(--white) }
		#sidebar ul ul { margin: 0 }
			#sidebar ul ul li a { padding-left: 30px }

/* standard pages */
#inner-banner { background-image: url("/img/layout/inner-banner.webp"); background-position: center; background-repeat: no-repeat; background-size: cover; height: 300px; text-align: center }
    #inner-banner .container, #inner-banner .container .row { height: 100% }
    #inner-banner h1, #inner-banner h2 { background-color: rgba(243, 237, 229, 0.85); color: var(--black); display: inline-block; font-size: 30px; padding: 20px 50px; text-transform: uppercase; font-weight: 800 }
#inner-text { margin: 70px 0 }
    #inner-text h1 { font-size: 32px; margin-bottom: 30px }
    #inner-text h2 { font-size: 28px; font-weight: 800; margin-top: 30px }
    #inner-text p, #inner-text ul, #inner-text address { font-size: 18px; margin-bottom: 0; margin-top: 20px }
        #inner-text p a, #inner-text ul a, #inner-text address a { color: var(--black) }
    #inner-text #inner-text-content { margin-left: 24px; margin-bottom: 60px; }
        #inner-text #inner-text-content a { color: var(--green); font-size: 24px; font-weight: 800; }
    #inner-text #education-02 { margin-top: 100px }
    #inner-text #education-03, #inner-text #education-04 { margin-top: 24px }
    #inner-text #education-contact { background-color: var(--green); color: var(--green-light); font-size: 26px; margin: 70px 0 0 0; padding: 20px 5px 22px 5px; text-align: center }
        #inner-text #education-contact a { color: var(--white) }
        #inner-text #education-contact a:hover { color: var(--green-light) }
    #inner-text .nav-item a { border-bottom: 3px solid #F2F2F2; border-radius: 0; background-color: #F8F8F8; color: #6A6A6A; font-size: 18px; font-weight: 600; margin: 0 10px; padding-bottom: 10px; text-transform: uppercase }
        #inner-text .nav-item a:hover, #inner-text .nav-item a.active { border-bottom: 3px solid #6d8a87; border-radius: 0; color: #6A6A6A }
#awards { margin-bottom: -24px }
    #awards img { margin-bottom: 24px; width: 100% }
#faqs { margin: 70px 0 }
    #faqs h3 { margin: 30px 0 15px 0 }
    #faqs .accordion-button:not(.collapsed) { background-color: rgba(162, 190, 166, 0.85); color: var(--black) }
    #faqs .acordian-item h2 { margin-top: 0 !important; font-size: 30px !important }
    #faqs .accordion-button:focus { -mox-box-shadow: none; -webkit-box-shadow: none; border-color: rgba(0, 102, 81, 0.85); box-shadow: none }

@media (max-width: 1399px) {
    /* global */
    footer { padding: 90px 0 85px 0 }
        footer #footer-left h4 { font-size: 26px; margin-bottom: 25px }
        footer #footer-left p { font-size: 16px }
        footer #footer-left #footer-social a { font-size: 32px; padding-right: 9px }
        footer #footer-address h5, footer #footer-hours h5 { font-size: 24px; margin-bottom: 25px }
        footer #footer-address address { font-size: 16px }
        footer #footer-address a { font-size: 16px }
        footer #footer-hours p { font-size: 16px }
    #footer-bottom #footer-legal { margin-top: 35px }
    #footer-bottom .funded { padding-top: 25px }
    
    /* standard pages */
    #inner-text #education-02 { margin-top: 80px }
    #inner-text #education-contact { font-size: 24px; padding: 20px 5px }
}

@media (max-width: 1199px) {
    /* global */
    footer { padding: 80px 0 75px 0 }
        footer #footer-left h4 { font-size: 24px; margin-bottom: 20px }
        footer #footer-left p { font-size: 14px }
        footer #footer-left #footer-social a { font-size: 28px; padding-right: 8px }
        footer #footer-address { padding-right: 0 }
            footer #footer-address h5, footer #footer-hours h5 { font-size: 22px; margin-bottom: 20px }
            footer #footer-address address { font-size: 14px }
            footer #footer-address a { font-size: 14px }
            footer #footer-hours p { font-size: 14px }
    #footer-bottom #footer-legal { margin-top: 28px }
    #footer-bottom .funded { padding-top: 23px }

    /* standard pages */
    #inner-banner { height: 250px }
        #inner-banner h1, #inner-banner h2 { font-size: 26px; padding: 16px 45px }
    #inner-text { margin: 60px 0 }
        #inner-text h1 { font-size: 28px; margin-bottom: 20px }
        #inner-text h2 { font-size: 24px; margin-top: 20px }
        #inner-text p, #inner-text ul, #inner-text address { font-size: 16px; margin-top: 16px }
        #inner-text #inner-text-content { margin-left: 12px }
        #inner-text #education-02 { margin-top: 60px }
        #inner-text #education-contact { font-size: 20px; margin-top: 60px; padding: 20px 5px 22px 5px }
    #faqs { margin: 60px 0 }
}

@media (max-width: 991px) {
    /* global */
    header { padding: 30px 15px }
        header #header-logo { display: block; width: 360px }
        header #btn-sidebar { font-size: 28px; margin-top: 0 }
    footer { padding: 70px 0 65px 0 }
        footer #footer-left { padding-bottom: 50px }
            footer #footer-left #footer-logo { display: block; width: 75% }
        footer #footer-address { padding-right: 50px }
    #footer-bottom #footer-legal { margin-top: 20px }

    /* standard pages */
    #inner-banner h1, #inner-banner h2 { font-size: 22px; padding: 12px 40px }
    #inner-text { margin-top: 50px }
        #inner-text #inner-text-content { margin-left: 0 }
        #inner-text #education-01, #inner-text #education-02 { margin-top: 30px; width: 100% }
        #inner-text #education-contact { margin-top: 50px }
    #faqs { margin: 50px 0 }
}

@media (max-width: 767px) {
    /* global */
    #footer-modal { height: auto }
        #footer-modal #footer-modal-content { height: 200px;  margin: 15px 5px }
            #footer-modal #footer-modal-content h4, #footer-modal #footer-modal-content h5 { font-size: 26px; margin-bottom: 20px }
            #footer-modal #footer-modal-content a { font-size: 16px; padding: 7px 50px }
    footer #footer-left #footer-logo { width: 100% }
    footer #footer-address { padding-right: 0 }
    #footer-bottom .funded { padding-top: 30px }
    
    /* standard pages */
    #inner-banner { height: 200px }
}

@media (max-width: 575px) {
    /* global */
    header { padding: 30px 15px 15px 15px }
        header #header-logo { width: 100% }
        header #btn-sidebar { margin-top: 20px; text-align: center }
    footer { padding: 60px 20px; text-align: center }
        footer img { width: 350px }
        footer #footer-left { padding-right: 0 }
        footer #footer-hours { padding: 50px 0 0 0 }
        footer #footer-legal { text-align: center }
    #footer-bottom .funded { padding-top: 7vw }

    /* standard pages */
    #inner-text .nav { margin-bottom: 24px }
    #inner-text .nav-item { display: block; width: 100% }
        #inner-text .nav-item a { margin: 0; text-align: center }
}