/*
Theme Name: Camp Keff
Description: A <a href='http://codex.wordpress.org/Child_Themes'>Child Theme</a> for the Enfold Wordpress Theme. If you plan to do a lot of file modifications we recommend to use this Theme instead of the original Theme. Updating wil be much easier then.
Version: 1.0
Author: Kriesi
Author URI: http://www.kriesi.at
Template: enfold
*/

@import url("https://use.typekit.net/npc7vhp.css");

@import url("https://use.typekit.net/ktd5uxz.css");

@import url("https://use.typekit.net/tvd0gxb.css");


@font-face {
font-family: 'sourcepro';
font-style: normal;
font-weight: normal;
src: local('sourcepro'), url('fonts/sourcecodepro.woff') format('woff');
}


@font-face {
font-family: 'Hand Of Sean';
font-style: normal;
font-weight: normal;
src: local('Hand Of Sean'), url('fonts/handsean.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Regular';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Regular'), url('fonts/MYRIADPRO-REGULAR.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Condensed';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Condensed'), url('fonts/MYRIADPRO-COND.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Semibold Italic';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Semibold Italic'), url('fonts/MYRIADPRO-SEMIBOLDIT.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Semibold';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Semibold'), url('fonts/MYRIADPRO-SEMIBOLD.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Condensed Italic';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Condensed Italic'), url('fonts/MYRIADPRO-CONDIT.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Bold Italic';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Bold Italic'), url('fonts/MYRIADPRO-BOLDIT.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Bold Condensed Italic';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Bold Condensed Italic'), url('fonts/MYRIADPRO-BOLDCONDIT.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Bold Condensed';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Bold Condensed'), url('fonts/MYRIADPRO-BOLDCOND.woff') format('woff');
}


@font-face {
font-family: 'Myriad Pro Bold';
font-style: normal;
font-weight: normal;
src: local('Myriad Pro Bold'), url('fonts/MYRIADPRO-BOLD.woff') format('woff');
}



@font-face {
    font-family: 'akaaka';
    src: url('fonts/aka-webfont.eot');
    src: url('fonts/aka-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/aka-webfont.woff2') format('woff2'),
         url('fonts/aka-webfont.woff') format('woff'),
         url('fonts/aka-webfont.ttf') format('truetype'),
         url('fonts/aka-webfont.svg#akaaka') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
font-family: 'Star Jedi';
font-style: normal;
font-weight: normal;
src: local('Star Jedi'), url('fonts/starjedi-webfont.woff') format('woff');
}

    
@font-face {
font-family: 'Capture It';
font-style: normal;
font-weight: normal;
src: local('Capture It'), url('fonts/captureit2-webfont.woff') format('woff');
}

@font-face {
font-family: 'Borders';
font-style: normal;
font-weight: normal;
src: local('Borders'), url('fonts/bordersdivide-webfont.woff') format('woff');
}




/* ***************************************** Main Menu ******************************************************************************* */

#main {box-shadow: 1px 1px 1px 2px #F8F8F8;}

.menu-item > a {
	font-family: 'Myriad Pro Regular'!important;	
}

/* section of code noted out on 12/16/18 by II to test what is in use, look like old styles */

.textwidget {text-align:left;}
.textwidget img{width:50%;}
#menu-sidebar-menu {line-height:60%;}

.avia_iconbox_title{
    font-family: 'Myriad Pro Bold'!important;text-transform:uppercase;color:#111;}
	
	
.smooth_slider {margin:0 auto;min-height:150px!important;}
#smooth_slider_2 > div.smooth_sliderb > div > h2 > a {color:#008da8!important;}
.slider_thumbnail {border:1px solid #fff!important;}
.widget {text-align:left;}


.ls-l{text-shadow: 1px 1px 3px rgba(150, 150, 150, 1)!important;}
#top #wrap_all .social_bookmarks_yelp:hover a {background-color:#a72b1d;color:#fff;}

#after_layer_slider_1 > div > div > div > div > div.flex_column.av_one_half.first.avia-builder-el-9.el_after_av_hr.el_before_av_one_half > div.hr.hr-invisible.avia-builder-el-11.el_after_av_heading.el_before_av_sidebar {height:60px!important;}
#after_layer_slider_1 > div > div > div > div > div.flex_column.av_one_half.avia-builder-el-13.el_after_av_one_half.el_before_av_one_fourth > div.hr.hr-invisible.avia-builder-el-15.el_after_av_heading.el_before_av_codeblock{height:60px!important;}

#input_1_3 , #input_1_2 {border:1px solid #ddd!important;}

#gform_submit_button_1 {background-color:#83a83d!important;}
.gfield_label {display:none!important;}
#footer .widget {margin-bottom:0px!important;}
.avia-promocontent h2 {font-size:20px!important;}
#input_1_4_6_container > label {display:none!important;}
#input_1_4_3_container > label {display:none!important;}
#input_1_4_3, #input_1_4_6 , #input_1_6 {border:1px solid #eee!important; width:100%!important; min-width:180px!important; float:left!important; }
.flex_column av_one_fifth > #gform_widget-2 > #gform_wrapper_1 > #gform_1 > .gform_body > #gform_fields_1 > #field_1_4 > #input_1_4 > #input_1_4_3_container > #input_1_4_3 {width:180px!important;}
.flex_column av_one_fifth > #gform_widget-2 > #gform_wrapper_1 > #gform_1 > .gform_body > #gform_fields_1 > #field_1_4 > #input_1_4 > #input_1_4_6_container > #input_1_4_6 {width:180px!important;}

*/

/* *********************** Tool Tip ******************************** */
.tooltip {
  position: relative;
  background-color: rgba(0,0,0,0.3);
  padding: 5px;
  border-radius: 100%;
  cursor: help;
}

.tooltip::before, .tooltip:after {
  position: absolute;
  left: 50%;
}

.tooltip::after{
  content: attr(data-tooltip);
  background-color: rgba(0,0,0,0.3);
  border: 2px solid rgba(0,0,0,0.3) transparent transparent transparent;

}

/* *********************** Today At Camp ******************************** */
.campresult {
    
}

#resulttable {border: "0" solid black;vertical-align: bottom;}
#resulttable tr {border: "0";vertical-align: bottom;}
#resulttable td {border: "0";vertical-align: top;}

.nohover { border: none;}

#right.widget-area {
    padding-left: 20px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}




/*all code below this line added 12/20/17*/

/*code for removing the border along menu bar added 12/20/17*/
.main_color{ border-color: #e1e1e100;}

/*code for sub menu buttons added 12/20/17*/
#top .av-subnav-menu li a {
	padding: 10px;
	color: #ffffff;
	background-color: #008da8;
	border-radius: 5px;
	width: 290px!important;
	text-align: center;
	font-size: 16px!important;
	font-weight: bold;
	margin-right: 20px;
}


/*Tab section style added 12/21/17*/

div .main_color .tabcontainer .active_tab_content { 
background-color: white; 
opacity:1; 
}
 div .main_color .tabcontainer .active_tab { 
background-color: #ffd400!important; 
opacity: 1!important; 
color: #e1261c!important; 
font-size: 18px!important;
}

.tab {
color: black!important;
font-size: 1vw!important;
}

.main_color .tabcontainer .tab { 
background-color: white; 
opacity: .75; font-size: 18px!important; 
}

.main_color .tab_content p, .main_color .tab_content strong, .main_color .tab_content li{
color: #26245c;
}

.main_color .tab_content h3{
font-family:houschka-rounded!important;
color: #008ca8!important;
}


/*style for pagination buttons 12/21/17*/
.pagination a {
	background-color: #008da8!important;
	color: white!important; 
	font-weight: bold;
}

/*removes the default green circle and white arrow icon on image hover, added 12/21/17*/
span.image-overlay-inside:before {
    display: none;
}





/*style for Summer Camp Page Template added 12/23/17*/

.entry-content-wrapper .post-title {
      pointer-events: none;
}


/*custom sidebar style added 1/1/18*/
/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; 
    border-radius: 10px;
    margin-right: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    background: #008da8; 
    border-radius: 10px;
    box-shadow: inset 0 0 7px black;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #0a72bf; 
}


/* Hand of Sean Heading Removed on 1/2/18 to make all headings Montserrat in theme-Advanced styling
*/

p{
    font-family: 'Myriad Pro Regular'!important;
}

#activate-page > p {display:none;}
#activate-page > .bp-template-notice{display:none!important;}
.error p {display:block!important;}
.sidebar-button  {float:none!important;}
#input_1_4_3 ,#input_1_4_6, #input_1_6{background-color:#eee!important;}
.orange {font-family: 'Hand Of Sean'!important;color:#ff9000!important;}
.phone-link a,
.phone-link a:link,
.phone-link a:visited,
.phone-link a:hover,
.phone-link a:active,
.phone-link a:focus {
    color: white;
}
.teen {font-family: 'Capture It'!important;color:#ff9000!important;}
.ece{font-family: 'Borders'!important;color:#ff9000!important;}

.button2 {
    background-color: #ffffff;
    border-color: #008da8;
    border-radius: 6px;
    padding: 5px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 40px;
    margin: 4px 2px;
    cursor: pointer;
font-family: 'Borders'!important;
color:#ff9000;
}
.button2:hover {
    background-color: #008da8;
    font-family: 'Borders'!important;
    color: #ffffff;
}
.button4 {
    background-color: #502d81;
    border-color: #000000;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    margin: 4px 2px;
    cursor: pointer;
    font-family: 'Myriad Pro Regular'!important;
    font-weight: bold;
    color: white;
    float: left;
}
.button4:hover {
    background-color: #500380;
}
.button6 {
    background-color: #f15924;
    border-color: #000000;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    margin: 4px 2px;
    cursor: pointer;
    font-family: 'Myriad Pro Regular'!important;
    font-weight: bold;
    color: white;
    float: left;
}
.button6:hover {
    background-color: #cb5924;
}
#top .avia-post-nav { display: none; }







/*button style for today at camp in menu added 1/2/18 and noted out on 3/21/18
#menu-item-16059 span.avia-menu-text {
    color: #ffffff!important;
background-color: #f37023!important;
border-radius: 15px;
padding: 5px 10px;
}
*/
/*button style for phone number in menu added 1/2/18 and noted out on 3/21/18
#menu-item-23851 span.avia-menu-text {
border: 2px solid;
padding: 5px 10px;
cursor: default;
}
*/
/*class set for Early Bird Discount added 1/8/18*/
.eb{
color:#008da8!important;
font-style: italic;
}

/*set up for caption on staff photos so caption at bottom added 1/27/18 */
.av-image-caption-overlay-center {
vertical-align: bottom !important;
}

/*sub menu width style added 1/27/18, though I don't really like it so I noted it out
#top #sub_menu1 .container {
    max-width: 1180px;
}
*/

/* makes tab headers blue*/
.main_color strong{
	color:#008ca8
}

/* ************************************************************** New Code For 2019 Starting 12/3/18  by II ********************************************************************************* */

.main_color h3{
color: green!important;
}

h1, h2, h3, h4, h5, h6{
font-family: ratio;
}

.single_toggle{
background-color: beige;
}

/* Set For Mobile Media Query*/
/* only show phone number in main nav on mobile */
@media only screen and (min-width: 480px) {
    #menu-item-23851{
    display: none;
    }
}

/* ******** Footer Logos and Medals ********* */
.foot-logo-wrap{
display: flex;
width: 100%;
margin-top:20px;
}

.foot-logo{
width:50%; 
text-align: center;
display: inline-block;
font-size: .7em;
line-height: 1.2em;
}

.foot-aca{
display: inline-block;
font-size: .55em;
line-height: 1.5em;
color:black;
}

/* ******** Reg Buttons ************** */
.keff-reg-but{
border-radius: 20px;
border:3px solid #f26739;
background-color: white;
text-align: center;
box-shadow: 1px 1px 4px black;
font-family: ratio, sans-serif;
vertical-align: middle;
color: #008da8;
width: 50%;
padding: 10px;
cursor:pointer;
}

.keff-reg-but-cont{
text-align: center;
margin: 0 auto;
}

.keff-reg-but-cont a{
text-decoration: none;
}


/* ******** Sub Page Text Blocks ************ */
.text-block{
background-color: white;
padding: 20px;
}

.text-block h2, .text-block h4{
color: #008da8!important;

}


/* ******** Keff Home Intro ********* */
@media only screen and (max-width: 480px) {
.keff-wrap{
flex-direction: column;
}

.keff-intro, .keff-home{
width: 100%!important;
}
}

.keff-wrap{
display: flex;
width: 100%;
}

.keff-intro, .keff-home{
margin: 10px;
display: inline-block;
width: 49%;
}

.keff-intro h2{
color: #008da8!important;
font-family: ratio!important;
font-size: 2.2em;
}

.keff-intro p{
color: #008da8!important;
font-family: myriad pro!important;
font-size: 1em;
}

.keff-home h1{
color: #008da8!important;
font-family: ratio!important;
font-size: 8em;
transition: transform 1.5s ease-in;
}

.keff-home:hover h1{
color: #008da8!important;
font-family: ratio!important;
font-size: 8em;
transform: rotate(720deg)
}

.keff-home h2{
color: #008da8!important;
font-family: ratio!important;
font-size: 5em;
}

.keff-home h3{
color: white!important;
font-family: ratio!important;
font-size: 4em;
background-color: #008da8;
padding: 15px;
}

.keff-home h4{
color: white!important;
font-family: ratio!important;
font-size: 3em;
background-color: #008da8;
padding-right: 1.5em;
padding-left: 1.5;
transform: rotate(-90deg);
}

.keff-home div{
width: 5%;
}

/* ******************** Keff Home Early Bird ************** */
.keff-eb-wrap{
text-align: center;
margin-bottom: 40px;
}

.keff-eb{
display: inline-block;
background-color: #e02926;
border: 2px dashed white;
padding: 20px;
}

.keff-eb h1, .keff-eb h2{
color: white!important;
font-family: active!important;
}

/* **************FAQ Tables ************** */

.faq-table td{
background-color: #26245c!important; 
border: 3px solid white!important; 
border-collapse: collapse!important;
color:white!important; 
}

.faq-table strong{
color:white!important; 
}

/* ************ About Us Resource Button ********** */

.avia_iconbox_title{
color: white!important;
}







.keff-sub-head{
text-align:center;
}

.keff-sub-head h1{
color: white!important;
font-family: ratio!important;
font-size: 7vw;
}

.keff-sub-head h2{
color: white!important;
font-family: ratio!important;
font-size: 4vw;
}

.keff-head{
background-color: #f26739;
padding: 20px;
text-align: center;
width: 100%;
margin: 0 auto;
filter: drop-shadow(10px 10px #000);
vertical-align: middle;
}

.keff-head h1{
color: white!important;
font-family: ratio!important;
font-size: 4vw;
}

.keff-head h2{
color: white!important;
font-family: ratio!important;
font-size: 2vw;
}

.keff-head-ece, .keff-head-k6, .keff-head-teen{
border: 3px solid white;
padding: 10px;
margin: 10px;
font-size: 1.5vw;
vertical-align: middle;
width: 60%;
margin: 10px auto;
}

.keff-head-ece:hover, .keff-head-k6:hover, .keff-head-teen:hover{
border: 3px solid black;
}

.keff-head-ece:hover h3, .keff-head-k6:hover h3, .keff-head-teen:hover h3, .keff-head:hover a{
color: black!important;
text-decoration: none;
}

.keff-head-ece h3{
font-family: active!important;
font-size: 2em;
color: white!important;
text-decoration: none;
}

.keff-head-k6 h3{
font-family: ratio!important;
font-size: 2em;
color: white!important;
text-decoration: none;
}

.keff-head-teen h3{
font-family: flood-std!important;
font-size: 2em;
color: white!important;
text-decoration: none;
}

/* ********** Teens Grid Tiles ************** */
.teen-tiles { 
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 2.25em;
  margin: 0;
}

@media screen and (max-width: 480px) {
 .details-cont-teen{
  max-height: 80%!important;
  margin: 0px!important;
}

.teen-79-camps-details table td{
   width: 100%!important;
}

.teen-heading{
width: 100%!important;
}


}

.teen-79-camps-details { 
  border: 3px solid white;
  border-radius: 2.25em;
  padding: 1.25rem;
  background-color: #26245c;
}

.teen-79-camps { 
  display: flex;
  flex-flow: column;
  border: 3px solid white;
  border-radius: 2.25em;
  padding: 1.25rem;
  background-color: #26245c;
  cursor: pointer;
}

.teen-79-camps h2, .teen-79-camps-details h2{
  margin-top: 20px;
  color: #ffd400!important;
}

.teen-79-camps h3, .teen-79-camps-details h3{
  margin-top: 0px;
  color: #e1261c!important;
}

.teen-79-camps span, .teen-79-camps-details span{
  color: #e1261c!important;
        font-size: 1em;
}

.teen-79-camps p, .teen-79-camps strong, .teen-79-camps-details p, .teen-79-camps-details strong{
  margin-top: 5px;
  color: #cccaca!important;
}

.teen-79-camps i, .teen-79-camps-details i{
  color: #cccaca!important;
}

.teen-79-camps img{
  align-self: center;
  width: 50%;
}

.teen-79-camps-details table td{
  color: #cccaca!important;
  border: 3px solid white!important;
  border-collapse: collapse!important;
  vertical-align:top!important;
  padding: 10px!important;
  background-color: #26245c!important;
}



.teen-mac-camps-details { 
  border: 3px solid white;
  border-radius: 2.25em;
  padding: 1.25rem;
  background-color: #ffd400;
}

.teen-mac-camps { 
  display: flex;
  flex-flow: column;
  border: 3px solid white;
  border-radius: 2.25em;
  padding: 1.25rem;
  background-color: #ffd400;
  cursor: pointer;
}

.teen-mac-camps h2, .teen-mac-camps-details h2{
  margin-top: 20px;
  color: #26245c!important;
}

.teen-mac-camps h3, .teen-mac-camps-details h3{
  margin-top: 0px;
  color: #e1261c!important;
}

.teen-mac-camps span, .teen-mac-camps-details span{
  color: #e1261c!important;
  font-size: 1em;
}

.teen-mac-camps p, .teen-mac-camps strong, .teen-mac-camps-details p, .teen-mac-camps-details strong{
  margin-top: 5px;
  color: #26245c!important;
}

.teen-mac-camps img{
  align-self: center;
  width: 50%;
}

.teen-jc-camps-details { 
  border: 3px solid white;
  border-radius: 2.25em;
  padding: 1.25rem;
  background-color: #b75f12;
}

.teen-jc-camps { 
  display: flex;
  flex-flow: column;
  border: 3px solid white;
  border-radius: 2.25em;
  padding: 1.25rem;
  background-color: #b75f12;
  cursor: pointer;
}

.teen-jc-camps h2, .teen-jc-camps-details h2{
  margin-top: 20px;
  color: #ffd400!important;
}

.teen-jc-camps h3, .teen-jc-camps-details h3{
  margin-top: 0px;
  color: #26245c!important;
}

.teen-jc-camps span, .teen-jc-camps-details span{
  color: #26245c;
  font-size: 1em;
}

.teen-jc-camps p, .teen-jc-camps strong, .teen-jc-camps-details p, .teen-jc-camps-details strong{
  margin-top: 5px;
  color: white!important;
}

.teen-jc-camps img{
  align-self: center;
  width: 50%;
}

.new-camp{
  position: relative;
  transform: rotate(-30deg);
  top:-3rem;
  left: -1.3rem;
  font-size: 2em;
  margin-bottom: -1.45rem;
}

.details-teen{
  display: none; 
  position: fixed; 
  z-index: 1; 
  padding-top: 100px; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto; 
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.6); 
}

.details-cont-teen{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 100%;
  max-height: 50%;
  width: 80%;
  padding: 20px;
  text-align: left;
  overflow: auto;
  margin:4rem 0;
}

.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
  border: 2px solid white;
  margin: 10px;
  padding: 0 8px;
  text-align: center;
}

span .close {
color: white!important;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  border: 2px solid black;
}



/* ********** Teens Heading ************** */

.teen-heading{
margin-bottom: 20px;
display: inline-block;
padding: 10px;
width: 49%;
}

.teen-heading h1{
color: white!important;
font-family: flood-std!important;
font-size: 3.5em!important;
}

.teen-heading h2{
font-size: 2.5em!important;
}

.teen-heading h3{
font-size: 2em!important;
display: inline-block;
}

.teen-heading h4{
font-size: 1.5em!important;
display: inline-block;
}

.teen-heading h2, .teen-heading h3, .teen-heading h4, .teen-intro h2{
color: white!important;
font-family: fira-mono!important;
font-weight: 200!important;
}

/* ********** Teens Heading ************** */
.teen-photos:
margin-bottom: 20px;
}

/* ********** Teens Intro ************** */

.teen-intro{
background-color: rgba(225,38,28,.7)!important;
padding: 25px;
margin-bottom: 20px;
}

.teen-intro p{
color: white;
font-family: sourcepro!important;
font-size: 1.1em;
}

/* ************ Remove ACA Logo on ECE Page ************* */
.postid-611 #aca{
display: none;
}

/* ********** Ece Heading ************** */
.ece-head{
margin-bottom: 20px;
text-align:center;
}

.ece-head h1{
font-family: active!important;
color: #e02926!important;
font-size: 6em!important;
margin: 0;
display: inline;
}

.ece-head h2{
font-family: active!important;
color: white!important;
font-size: 4em!important;
margin: 0;
display: inline;
}

.ece-head h3{
font-family: active!important;
color: #e02926!important;
font-size: 3em!important;
font-weight: 500;
margin: 0;
display: inline;
}

.ece-head h4{
font-family: active!important;
color: white!important;
font-size: 2em!important;
margin: 0;
font-weight: 500;
display: inline;
}

.ece-head h5{
font-family: active!important;
color: #e02926!important;
font-size: 5.5em!important;
margin: 0;
display: inline;
}


/* ********** Ece Notepad************** */
.ece-note{
background-color:white;
padding: 0 20px 20px 20px;
margin-bottom:40px;
}

.ece-note h1{
font-family:houschka-rounded!important;
color: #13ccb4;
margin-top: 20px;
}

.ece-note img{
width: 100%;
margin-top: -.8rem;
}

.ece-note p, .ece-note strong, .ece-note li {
font-family: Myriad Pro Regular!important;
color: #26245c;
}

/* ******* Ece Early Bird *********** */
.ece-eb-wrap{
text-align: center;
}

.ece-eb{
display: inline-block;
background-color: #e02926;
border: 2px dashed white;
padding: 20px;
}

.ece-eb h1, .ece-eb h2{
color: white!important;
font-family: active!important;
}

.ece-eb-wrap-m, .ece-eb-m,.ece-eb-m h1, .ece-eb-m h2{
display:none;
}

/* ******* Ece Early Bird Mobile *********** */
@media screen and (max-width: 480px) {

.ece-eb-wrap, .ece-eb, .ece-eb h1, .ece-eb h2{
display:none;
}

.ece-eb-wrap-m{
text-align: center;
display: inline-block;
margin-bottom: 20px;
}

.ece-eb-m{
display: inline-block;
background-color: #e02926;
border: 2px dashed white;
padding: 20px;
}

.ece-eb-m h1, .ece-eb-m h2{
color: white!important;
font-family: active!important;
display: inline-block;
}

}

/* ********** Ece Hero Image************** */
.ece-hero-wrap{
text-align: center;
}

.ece-hero{
display: inline-block;
}

.ece-hero img{
width: 50%;
margin-bottom: 20px;
}

/* ********** Ece Icons************** */
.ece-icon-wrap{
text-align:center;
}

.ece-icon{
display: inline-block;
}

/* ********** K-6 Head ************** */
.k6-head-wrap{
}

.k6-head{
background-color: #e1261c;
padding: 20px;
text-align: center;
width: 50%;
margin: 0 auto;
filter: drop-shadow(10px 10px #000);
}

.k6-head h1{
color: white!important;
font-family: ratio!important;
font-size: 7vw;
}

.k6-head h2{
color: white!important;
font-family: ratio!important;
font-size: 4vw;
}

/* ********** K-6 Hero Image ************** */

.k6-hero-wrap{
}

.k6-hero{
text-align: center;
width: 60%;
margin: 0 auto;
}

/* ********** K-6 Details ************** */

.k6-details-wrap{
}

.k6-details{
background-color: #fed402;
padding: 20px;
margin-bottom: 20px;
}

.k6-details h2, .k6-details h3{
font-family: ratio!important;
color: #4089c6;
}

.k6-details p{
font-family: Myriad Pro Regular!important;
color: black!important;
}

/* *******************************************************************************************
*********************************Grade K-2 Program Grid **************************************
******************************************************************************************* */

.grid-k2 { 
  display: grid;
  grid-template-areas: 
    "gh1 gh1 gh2 gh3 gh4 gh4 gh4"
    "bw bw bL bL bL bL bL"
    "s1 w1 k1 y1 . sns fd"
    "s1 w2 k1 y1 . mm1 mm1"
    "s2 w3 k2 y2 . ttg ob"
    "s2 w4 k2 y2 . mm2 mm2"
    "s3 w5 k3 y3 kd sesb mcm"
    "s3 w6 k3 y3 kd mm3 mm3"
    "s4 w7 k4 y4 . ftf ftf"
    "w8 w8 ss ss ss ss ss";
/* grid-template-rows: repeat(2, auto); */
 grid-template-columns: 200px 1fr 1fr 1fr 1fr 1fr 1f; 
 grid-gap: .2em;
 background-color: black;
  margin: 0;
  padding: .2em;
  font-family: sans-serif;
  text-align: center;
}

/* Stack the layout on SMALL devices/viewports. */
@media screen and (max-width: 480px) {
  .grid-k2 { 
    grid-template-areas: 
      "gh1" 
      "gh2"
      "gh3" 
      "gh4"
      "bw"
      "bL"
      "s1" 
      "w1" 
      "k1" 
      "y1" 
      "sns" 
      "fd"
      "w2" 
      "mm1"
      "s2"
      "w3" 
      "k2" 
      "y2" 
      "ttg" 
      "ob"
      "w4" 
      "mm2"
      "s3" 
      "w5" 
      "k3" 
      "y3" 
      "kd" 
      "sesb" 
      "mcm"
      "w6" 
      "mm3"
      "s4"
      "w7" 
      "k4" 
      "y4" 
      "ftf"
      "w8" 
      "ss";
 grid-template-columns: 1fr;
 }

.s1, .s2, .s3, .s4{
  display: none;
}

.details-cont{
  max-height: 80%!important;
  margin: 0px!important;
}

}


.k2content{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  cursor:pointer;
  color: black;
}



.k2content-head{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

/*.k2content-head strong{
  color: black;
  font-size: 1.3em;
}*/

.gh1 {
  grid-area: gh1;
  background-color: #8a8a8a;
  padding: 10px;
}

.gh1 strong{
  color: white;
}

.gh2 {
  grid-area: gh2;
  background-color: #e06197;
}

.gh3 {
  grid-area: gh3;
  background-color: #ffa313;
}

.gh4 {
  grid-area: gh4;
  background-color: #008da8;
}

.bw {
  grid-area: bw;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s1 {
  grid-area: s1;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s2 {
  grid-area: s2;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s3 {
  grid-area: s3;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s4 {
  grid-area: s4;
  background-color:  #8a8a8a;
  padding: 5px;
  color: white;
}

.w1 {
  grid-area: w1;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w2 {
  grid-area: w2;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w3 {
  grid-area: w3;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w4 {
  grid-area: w4;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w5 {
  grid-area: w5;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w6 {
  grid-area: w6;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w7 {
  grid-area: w7;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w8 {
  grid-area: w8;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.k1 {
  grid-area: k1;
  background-color: #e06197;
}

.k2 {
  grid-area: k2;
  background-color: #e06197;
}

.k3 {
  grid-area: k3;
  background-color: #e06197;
}

.k4 {
  grid-area: k4;
  background-color: #e06197;
}

.y1 {
  grid-area: y1;
  background-color: #ffa313;
}

.y2 {
  grid-area: y2;
  background-color: #ffa313;
}

.y3 {
  grid-area: y3;
  background-color: #ffa313;
}

.y4 {
  grid-area: y4;
  background-color: #ffa313;
}

.kd {
  grid-area: kd;
  background-color: #008da8;
}

.bL { 
  grid-area: bL;
  background-color: #42da60;
}

.sns { 
  grid-area: sns;
  background-color:  #008da8;
}

.fd { 
  grid-area: fd;
  background-color:  #008da8;
}

.ttg { 
  grid-area: ttg;
  background-color:  #008da8;
}

.ob { 
  grid-area: ob;
  background-color:  #008da8;
}

.sesb { 
  grid-area: sesb;
  background-color:  #008da8;
}

.mcm { 
  grid-area: mcm;
  background-color:  #008da8;
}

.ftf { 
  grid-area: ftf;
  background-color:  #008da8;
}

.ss { 
  grid-area: ss;
  background-color:  #42da60;
}

.mm1 { 
  grid-area: mm1;
  background-color:  #18d1f4;
}

.mm2 { 
  grid-area: mm2;
  background-color:  #18d1f4;
}

.mm3 { 
  grid-area: mm3;
  background-color:  #18d1f4;
}

.bL:hover, .k1:hover, .y1:hover, .sns:hover, .fd:hover, .mm1:hover, .k2:hover, .y2:hover, .ttg:hover, .ob:hover, .mm2:hover, .k3:hover, .y3:hover, .kd:hover, .sesb:hover, .mcm:hover, .mm3:hover, .k4:hover, .y4:hover, .ftf:hover, .ss:hover{
  transform: scale(1.05);
  border: 2px solid black;
  background-color: white;
}

/* ***** styles for pop up ******** */
.details{
  display: none; 
  position: fixed; 
  z-index: 1; 
  padding-top: 100px; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto; 
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.6); 
}

.details-cont{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 100%;
  max-height: 50%;
  width: 80%;
  padding: 20px;
  text-align: left;
  overflow: auto;
  margin:4rem 0;
}

.details-cont table{
  margin: 20px 0;
}

.details-cont table td{
  padding: 20px;
}

.details-cont {
  color: black;
  font-family: Myriad Pro;
}

.details-cont h2{
  color: black!important;
  font-family: ratio!important;
}

.details-cont h3{
  color: black!important;
  font-family: ratio!important;
}

.details-cont h4{
  color: black!important;
  font-family: ratio!important;
}

.details-cont div{
  background-color: white;
  padding: 0 20px;
  margin: 20px 0px;
}

.cmp-green{
  background-color: #42da60;
  }

.cmp-red{
  background-color: #e06197;
  }
  
.cmp-orange{
  background-color: #ffa313;
  }
  
.cmp-blue{
  background-color:  #008da8;
  }
  
.cmp-blue-mm { 
  background-color:  #18d1f4;
}

/* The Close Button */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
  border: 2px solid white;
  margin: 10px;
  padding: 0 8px;
  text-align: center;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  border: 2px solid black;
}


/* ****************************************************************************************************************************
***************************************************** Grade 3-6 Program Calendar **********************************************
******************************************************************************************************************************* */
.grid-36 { 
  display: grid;
  grid-template-areas: 
    "gh1-36 gh1-36 gh2-36 gh3-36 gh4-36 gh4-36"
    "bw-36 bw-36 bL36 bL36 bL36 bL36"
    "s1-36 w1-36 by1 ka1 pnw mfr"
    "s1-36 w2-36 by1 ka1 mm136 mm136"
    "s2-36 w3-36 by2 ka2 fwd ftf36"
    "s2-36 w4-36 by2 ka2 mm236 mm236"
    "s3-36 w5-36 by3 ka3 u3d jmsc"
    "s3-36 w6-36 by3 ka3 mm336 mm336"
    "s4-36 w7-36 by4 ka4 acb kc"
    "w8-36 w8-36 ss36 ss36 ss36 ss36";
/* grid-template-rows: repeat(2, auto); */
 grid-template-columns: 200px 1fr 1fr 1fr 1fr 1fr ; 
 grid-gap: .2em;
 background-color: black;
  margin: 0;
  padding: .2em;
  font-family: sans-serif;
  text-align: center;
}

/* Stack the layout on SMALL devices/viewports. */
@media screen and (max-width: 480px) {
  .grid-36 { 
    grid-template-areas: 
      "gh1-36" 
      "gh2-36"
      "gh3-36" 
      "gh4-36"
      "bw-36"
      "bL36"
      "s1-36" 
      "w1-36" 
      "by1" 
      "ka1" 
      "pnw" 
      "mfr"
      "w2-36" 
      "mm136"
      "s2-36"
      "w3-36" 
      "by2" 
      "ka2" 
      "fwd" 
      "ftf36"
      "w4-36" 
      "mm236"
      "s3-36" 
      "w5-36"
      "by3" 
      "ka3"
      "u3d" 
      "jmsc" 
      "w6-36" 
      "mm336"
      "s4-36"
      "w7-36" 
      "by4" 
      "ka4" 
      "acb"
      "kc"
      "w8-36" 
      "ss36";
 grid-template-columns: 1fr;
 }

.s1-36, .s2-36, .s3-36, .s4-36{
  display: none;
}

.details-cont{
  max-height: 80%!important;
  margin: 0px!important;
}

}


.k2content{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  cursor:pointer;
  color: black;
}



.k2content-head{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.k2content-head strong{
  color: black;
  font-size: 1.3em;
}

.gh1-36 {
  grid-area: gh1-36;
  background-color: #8a8a8a;
  padding: 10px;
}

.gh1-36 strong{
  color: white;
}

.gh2-36 {
  grid-area: gh2-36;
  background-color: #e06197;
}

.gh3-36 {
  grid-area: gh3-36;
  background-color: #ffa313;
}

.gh4-36 {
  grid-area: gh4-36;
  background-color: #008da8;
}

.bw-36 {
  grid-area: bw-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s1-36 {
  grid-area: s1-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s2-36 {
  grid-area: s2-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s3-36 {
  grid-area: s3-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.s4-36 {
  grid-area: s4-36;
  background-color:  #8a8a8a;
  padding: 5px;
  color: white;
}

.w1-36 {
  grid-area: w1-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w2-36 {
  grid-area: w2-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w3-36 {
  grid-area: w3-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w4-36 {
  grid-area: w4-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w5-36 {
  grid-area: w5-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w6-36 {
  grid-area: w6-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w7-36 {
  grid-area: w7-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.w8-36 {
  grid-area: w8-36;
  background-color:  #8a8a8a;
  padding: 10px;
  color: white;
}

.by1 {
  grid-area: by1;
  background-color: #e06197;
}

.by2 {
  grid-area: by2;
  background-color: #e06197;
}

.by3 {
  grid-area: by3;
  background-color: #e06197;
}

.by4 {
  grid-area: by4;
  background-color: #e06197;
}

.ka1 {
  grid-area: ka1;
  background-color: #ffa313;
}

.ka2 {
  grid-area: ka2;
  background-color: #ffa313;
}

.ka3 {
  grid-area: ka3;
  background-color: #ffa313;
}

.ka4 {
  grid-area: ka4;
  background-color: #ffa313;
}


.bL36 { 
  grid-area: bL36;
  background-color: #42da60;
}

.pnw { 
  grid-area: pnw;
  background-color:  #008da8;
}

.mfr { 
  grid-area: mfr;
  background-color:  #008da8;
}

.fwd { 
  grid-area: fwd;
  background-color:  #008da8;
}

.ftf36 { 
  grid-area: ftf36;
  background-color:  #008da8;
}

.u3d { 
  grid-area: u3d;
  background-color:  #008da8;
}

.jmsc { 
  grid-area: jmsc;
  background-color:  #008da8;
}

.acb { 
  grid-area: acb;
  background-color:  #008da8;
}

.kc { 
  grid-area: kc;
  background-color:  #008da8;
}

.ss36 { 
  grid-area: ss36;
  background-color:  #42da60;
}

.mm136 { 
  grid-area: mm136;
  background-color:  #18d1f4;
}

.mm236 { 
  grid-area: mm236;
  background-color:  #18d1f4;
}

.mm336 { 
  grid-area: mm336;
  background-color:  #18d1f4;
}

.bL36:hover, .by1:hover, .ka1:hover, .pnw:hover, .mfr:hover, .mm136:hover, .by2:hover, .ka2:hover, .fwd:hover, .ftf36:hover, .mm236:hover, .by3:hover, .ka3:hover, .u3d:hover, .jmsc:hover, .mm336:hover, .by4:hover, .ka4:hover, .acb:hover, .kc:hover, .ss36:hover{
  transform: scale(1.05);
  border: 2px solid black;
  background-color: white;
}

/* ***** styles for pop up ******** */
.details{
  display: none; 
  position: fixed; 
  z-index: 1; 
  padding-top: 100px; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto; 
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.6); 
}

.details-cont{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 100%;
  max-height: 50%;
  width: 80%;
  padding: 20px;
  text-align: left;
  overflow: auto;
  margin:4rem 0;
}

.details-cont table{
  margin: 20px 0;
}

.details-cont table td{
  padding: 20px;
}

.details-cont {
  color: black;
  font-family: Myriad Pro;
}

.details-cont h2{
  color: black!important;
  font-family: ratio!important;
}

.details-cont h3{
  color: black!important;
  font-family: ratio!important;
}

.details-cont h4{
  color: black!important;
  font-family: ratio!important;
}

.details-cont h2 span{
  color: white!important;
}

.details-cont h3 span{
  color: white!important;
}

.details-cont div{
  background-color: white;
  padding: 0 20px;
  margin: 20px 0px;
}

.cmp-green{
  background-color: #42da60;
  }

.cmp-red{
  background-color: #e06197;
  }
  
.cmp-orange{
  background-color: #ffa313;
  }
  
.cmp-blue{
  background-color:  #008da8;
  }
  
.cmp-blue-mm { 
  background-color:  #18d1f4;
}

/* The Close Button */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
  border: 2px solid white;
  margin: 10px;
  padding: 0 8px;
  text-align: center;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  border: 2px solid black;
}

/* ********* Calendar Intro Text ********* */

.cal-intro{
margin: 40px 0 20px 0;
padding: 20px;
color: white!important;
font-family: ratio!important;
background-color: #e1261c;
filter: drop-shadow(10px 10px #000);
}

.cal-intro h2{
color: white!important;
font-family: ratio!important;
}













/* ************* Updated Header */

.second-logo{
float: left;
position: relative;
max-height: 50%;
left: 22%;
}

.second-logo img{
width: 25%;
background-color: #25245c;
padding: 10px;
}



/*button style for buttons in sub menu*/
.sub_menu{
margin-top: 10px;
}


#menu-item-23882 a{
    color: #ffffff!important;
background-color: #f37023!important;
padding: .6em 1em;
font-size: 1em;
cursor: pointer;
border-radius: 1em;
text-decoration: none;
transition: scale .4s;
}

#menu-item-23882:hover{
transform: scale(1.1);
background-color: navy;
}

#menu-item-22692 a{
    color: #ffffff!important;
background-color: #008da8!important;
padding: .6em 1em;
font-size: 1em;
cursor: pointer;
border-radius: 1em;
text-decoration: none;
transition: scale .4s;
}

#menu-item-22692:hover{
transform: scale(1.1);
}

#menu-item-31005 img{
vertical-align: middle;
}

/* To remove divider between menu and social icons */
.avia-menu.av_menu_icon_beside {
    border: none; 
}
/* ***************** End New Code For 2019 Starting 12/3/18  by II ***************** */