@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@300;400;500;600;700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
a, a:hover, .panel-title>a, .panel-title>small>a, .panel-title>.small>a {
    color: #007878; 
}
.navbar a {font-size: 16px; line-height: 24px;}
.btn-success, .navbar-app .dropdown-menu { 
    background-color: #007878; 
}
.navbar.navbar-sliver { 
    background: none repeat scroll 0 0 rgba(1, 0, 0, 0.7); 
} 
@media (min-width: 769px) { body { background: #ffffff url(https://earlylearning.ehawaii.gov/img/bg-image.jpg) no-repeat top center fixed; background-size:cover; } } 
.site-header  h1 {color: #ffffff; }
.site-header  h2 {color: #ffffff; }

#queueAppSwitcher {display:none;}

.testSite {padding: 8px 16px;
    border-radius: 0px; 
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
    text-align: center;
}
/* EOEL new styles */
.container {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}
.wf_formbuilder_admin .content {
    /* */
}
.wf-iframe, .wf_formbuilder_form .content, .wf_manage_site .content {
    /* max-width: 1200px;
    margin: 0 auto;
    padding: 2em 0;  */ 
}
.wf_formbuilder_admin > .container, .wf_manage_site >  .container {
    /*  background: #fff; */ 
}
.container .containerActionBar, .wf_formbuilder_form {
    /* background: #fff !important; */
}

body {background-color: #fff; font-size: 18px; background-image: none;}
#applogo {display:none;}
.content {background-color: transparent;}
.content-area {margin: 0 auto;}
#main-content-area.content {padding: 0; min-height: 300px;}
.band .inner {padding-top: 20px;}
.band .inner p, .inner h1, .inner h3 {padding-left: 20px;}
.normal_header .content {padding: 0;}
.navbar.navbar-app {background: none repeat scroll 0 0 #007878; } 
.ehawaii_logo {display:none;}
.ehawaii_brand {font-family: 'Fredoka', sans-serif; font-style: normal;}
#stateseal {margin-right: 12px; margin-bottom: 12px}
body, .nav, nav a {font-family: 'Poppins', sans-serif; font-style: normal;}
h1, h2, h3, h4, h5, h6, .siteTitle, header .siteTitle, .panel-heading {font-family: 'Fredoka', sans-serif; font-weight: 600;}
.container .containerHeader {padding: 2em;}
.container .containerHeader h1 {font-size: 2em;}
.panel-title>a {font-family: 'Fredoka', sans-serif; font-weight: 500; font-size: 18px;}
p, dl, ol, ul, td, footer, a, button, .btn, .siteEntity {font-family: 'Fredoka', sans-serif; font-weight: 400;}
footer p {color: #eee;}
footer a {color: #fff;}
footer a:hover {color: #eee;}
.text-light {color: white;}
.form-control {font-weight: 500;}
.navbar.navbar-app {background-color: #0F5670;}
.navbar-app .dropdown-menu {
    background-color: #0F5670;
}
.big-background {
    background-image: url('https://earlylearning.ehawaii.gov/wf/imgdoc/0/keiki-group.jpg/');
    background-color: #008080; 
    background-position: top center;
    background-size: cover;
    padding-top: 70px;
}
.feature-background {
    background-image: url('https://earlylearning.ehawaii.gov/wf/imgdoc/0/keiki-class.jpg/');
    background-color: #008080; 
    background-position: center center;
    background-size: cover;
}
.row {margin-right: 0; margin-left: 0;}
.formbuilder .container .containerBody {padding: 1.5em 35px;}
.light-background {background-color: #F0EA97;}
.navbar-brand a {color: white;}
.new_header {background: transparent; color: #fff;}
.normal_header {padding-top: 70px; padding-bottom: 20px; background-color: #008080; color: #fff;} /* light-teal 008080 2f5e7a 1c3f52 */
header .siteTitle, header .siteEntity { color: #fff;}
.bannerbox {display: inline-block; position: relative; top: 150px; left: 50%;}
.quotebox {display: inline-block; position: relative; background-color: rgba(0,0,0,0);}
.quotebox p {color: #fff !important; font-weight: 500; font-size: 18px;}
.btn-primary {background-color: #706A0F;}
.footer_app {background-color: #0F5670 !important; padding: 2em;}
strong, .text-bold {font-weight: 600;}
.btn-outline-light {border: 1px solid white; background: transparent; color: white;}
.btn-outline-light:hover {background: white; color: black;}
.btn-outline-dark {border: 1px solid #111; background: transparent; color: #111;}
.btn-outline-dark:hover {background: #111; color: black;}
.btn-outline-red {border: 1px solid #700F25; background: transparent; color: #700F25;}
.btn-outline-red:hover {background: #700F25; color: white;}
.btn-danger {background-color: #700F25; border-color: #700F25;}
.btn-bright {background-color: #F0EA97; border-color: #700F25; color: #700F25; font-weight: 600;}
.btn-bright:hover {background-color: transparent; border-color: #F0EA97; color: #F0EA97;}
.text-reddirt, .text-reddirt:hover {color: #700F25;}
.sliver-logo {height: 12px; padding-right: 2px; margin-right: 2px;}
.processStep .panel {min-height: 200px; text-align: center;}
.processStep .panel .panel-body p {line-height: 1.1;}
.processStep .fa {font-size: 3em; margin-top: 12px; margin-bottom: 4px;}
.big_button a:hover, .big_button a:focus {background-color: #395878;}
.big_button .thumbnail:hover, .big_button .thumbnail:focus {background-color: #008080;}

.panel-heading {padding: 0 0;}
footer {
    color: #eee;
    bottom: 0;
    margin-bottom: 0 !important;
}
.footer_app {margin-top: 0;}
header .siteTitle {margin-top: 3px; margin-bottom: 0px;}
header .siteEntity {margin-top: 3px; margin-bottom: 0px;}

.badge {
   background-color: #002e3f;
}
footer span {
    color:#eee;
}
.container>.navbar-header, .container>.navbar-collapse, .container-fluid>.navbar-header, .container-fluid>.navbar-collapse {
    margin-right: 0;
    margin-left: 0;
}
@media screen and (min-width:1px){
    body {padding-top: 0px !important;}
    .content-area {max-width: 100%;}
    .big-background {min-height: 540px;}
    #stateseal, #titleGroup {display: block;}
    header .siteTitle {font-size: 1.75em; line-height: 1.1;}
    header .siteEntity {font-size: 1.1em;}
    .feature-background {min-height: 270px;}
    .new_header {position: relative;}
    .quotebox {width: 99%; top: 90px; float: right; padding: 1em;}
    .quotebox p {font-size: 1.2em}
    .navbutton {float:none; display: block; margin-top: 4px; margin-bottom: 15px; }
    .text-big {font-size: 2em;}
    .btn-xl {font-size: 18px; padding: 16px 18px;}
    .quotebox p {font-size: 1.3em;}
}
@media screen and (min-width:600px){
    .content-area {max-width: 100%;}
    .big-background {min-height: 600px;}
    .feature-background {min-height: 360px;}
    .quotebox {width: 90%; top: 170px; right: 20px; padding: 1.5em;}
    .quotebox p {font-size: 1.25em}
    .navbutton {margin-bottom: 15px; }
    .text-big {font-size: 2.25em;}
}

@media screen and (min-width:768px){
    .content-area {max-width: 720px;}
    .big-background {min-height: 600;}
    header .siteTitle {font-size: 1.8em; line-height: 1.2;}
    header .siteEntity {font-size: 1.2em;}
    .feature-background {min-height: 380px;}
    .quotebox {width: 85%; top: 160px; right: 20px; padding: 1.5em;}
    .quotebox p {font-size: 1.25em}
    .text-big {font-size: 2.5em;}
}
@media screen and (min-width:992px){
    .content-area {max-width: 860px;}
    .big-background {min-height: 600px;}
    .feature-background {min-height: 400px;}
    .quotebox {width: 75%; top: 170px; right: 30px; padding: 1.5em;}
    .navbutton {float:right; margin-top: 4px; margin-bottom: 0px; }
    .quotebox p {font-size: 1.3em}
    .text-big {font-size: 2.75em;}
    .btn-xl {font-size: 20px; padding: 18px 20px;}
}
@media screen and (min-width:1080px){
    #stateseal, #titleGroup {display: inline-block;}
    .content-area {max-width: 960px;}
     .big-background {max-height: 640px;}
    header .siteTitle {font-size: 2em;}
    header .siteEntity {font-size: 1.3em;}
    .feature-background {min-height: 420px;}
    .quotebox {width: 67%; top: 180px; right: 30px; padding: 1.5em;}
    .quotebox p {font-size: 1.3em}
    .content-area {min-height: 600px;}
}
@media screen and (min-width:1280px){
    .content-area {max-width: 1080px;}
     .big-background {min-height: 680px; max-height: 870px;}
    header .siteTitle {font-size: 2.5em; line-height: 1.2;}
    header .siteEntity {font-size: 1.4em;}
    .feature-background {min-height: 440px;}
    .quotebox {width: 51%; top: 240px; right: 30px; padding: 2em;}
    .quotebox p {font-size: 1.4em}
    .content-area {min-height: 600px;}
}
@media screen and (min-width:1400px){
    .content-area {max-width: 1280px;}
     .big-background {min-height: 700px; max-height: 900px;}
    header .siteTitle {font-size: 2.5em; line-height: 1.2;}
    header .siteEntity {font-size: 1.4em;}
    .feature-background {min-height: 440px;}
    .quotebox {width: 51%; top: 250px; right: 30px; padding: 2em;}
    .quotebox p {font-size: 1.5em}
    .content-area {min-height: 600px;}
}
@media screen and (min-width:1600px){
    .content-area {max-width: 1400px;}
     .big-background {min-height: 800px; max-height: 960px;}
    header .siteTitle {font-size: 2.5em; line-height: 1.2;}
    header .siteEntity {font-size: 1.4em;}
    .feature-background {min-height: 440px;}
    .quotebox {width: 51%; top: 250px; right: 30px; padding: 2em;}
    .quotebox p {font-size: 1.6em}
    .content-area {min-height: 600px;}
}
/* end new styles */