/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 23.12.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/


.defaultpagemainsection a {
  /* color:#0b7dda !important; */
  color: blue !important;
}


/* -- leftnavmenu styling */

@media (min-width: 481px) {
  #leftnavmenu .collapsebutton {
    display: none !important;
  }
  
  #leftnavmenu .collapsecontent {
	  display: block;
  }
}

@media only screen and (min-device-width : 320px) and (max-device-width : 770px) {
	#leftnavmenu .collapsecontent {
		display: none;
	}

  #leftnavmenu .collapsebutton {
		display: block;
	}
}

#leftnavmenu .collapsebutton {
	background-color: #777;
	color: white;
	cursor: pointer;
	padding: 18px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
}

/* remove base styling */
#leftnavmenu ul {
    list-style: outside none none;
    margin-left: 0;
    padding-left: 0;
}

/* edit positioning ul */
#leftnavmenu ul li {
    padding: 2px 0 2px 25px;
    position: relative;
    
}

/* add arrow */
#leftnavmenu ul li::before {
    color: #ffab1f;
    content: "\f101";
    display: inline-block;
    font-family: FontAwesome;
    font-size: 15px;
    left: 0;
    margin-left: 5px;
    margin-right: 8px;
    position: absolute;
}

/* -- end leftnavmenu styling */

#calendar .fc-toolbar h2 {
	font-size: 1.25em;
}

#fullcalendar_controls, #fullcalendar_controls a {
	color: white;
}



.elementor-location-footer a, .elementor-location-footer a:link, .elementor-location-footer a:visited, .elementor-location-footer a:active {
	color: white;
}

.n2-ss-item-content a {color:#FFC521;}
.n2-ss-item-content a:hover {color:#ffe499;}


form.search-container input[type=text] {
  padding: 10px;
  font-size: 17px;
  border: 1px solid grey;
  float: left;
  width: 85%;
  background: #f1f1f1;
  height: 100%;
}

form.search-container button {
  float: left;
  width: 15%;
  padding: 5px;
  background: #2196F3;
  color: white;
  font-size: 17px;
  border: 1px solid grey;
  border-left: none;
  cursor: pointer;
  height: 100%;
}

form.search-container button:hover {
  background: #0b7dda;
}

form.search-container {
  margin: 0;
	height: 30px;
	margin-right: 20px;
}

form.search-container::after {
  content: "";
  clear: both;
  display: table;
}

/* #about-sub-menu ul ul{
  display:none;
}

#staff-sub-menu ul ul{
  display:none;
}

#students-and-families-sub-menu{
  display:block;
}

#students-and-families-sub-menu ul ul{
  display:none;

}

#students-and-families-sub-menu ul ul ul{
  display:none;
  
} */


/* Forces all links in posts to display blue */
.elementor-widget-theme-post-content a{
  color:#393db8;
}

.plus-megamenu-content .menu li.menu-item:before {
	content: "\f04b"; /* FontAwesome Unicode */
	color: #FFC52F;
	font-family: FontAwesome;
	display: inline-block;
	margin-left: -1.3em; /* same as padding-left set on li */
	width: 1.3em; /* same as padding-left set on li */
	font-size: 0.7em;
}



.mega-menu-menu-slusd-break ul > li{
  display: block !important;
}
.ul-break ul > li::after{
  content: "<br>\n  ";
  opacity: 0%;
}
.ul-break-business ul > li::after{
  content: "<br />\n   ";
  opacity: 0%;
  list-style: none;
}
.ul-break ul > li{
  display: block;
  list-style-type: none;
}
.ul-break ul > li > a{
  color:white
}
.mega-menu-menu-slusd-break ul > li::after{
  content: "<br>\n  ";
  opacity: 0%;
}
.mega-menu-menu-slusd-break ul > li > a{
  color: white;
}
.mega-menu-menu-slusd ul > li > a{
  color: white;
}

.mega-menu-menu ul > li{
  display: block !important;

}
.mega-menu-menu ul > li >a {
  
  color: white;
}
.mega-menu-menu ul ul li {
  list-style-type: none;
  font-weight: 400;
  text-decoration: none;


}

/* Frontpage Nav Float Left */
#side-nav{
  transition : transform 0.34s ease
  }

#side-nav .menu-item:hover > a{
  text-align: ;
}
.headerup{
  width: 100%;
  transform: translateX(-110px); /*adjust this value to the height of your header*/
  }
.headerup li:hover{
      background-color: var(--e-global-color-primary) !important;
      transform: translateX(75px);
      width: 75%;
  }
/* Testing classes $ IDs */
#about-sub-menu2 ul ul{
  display:block;
  border-bottom: 10px;
}
#about-sub-menu2 ul ul li{
  color:red;
  display:block;
  border-bottom: 10px;
}

/* Areapage Dropdown Menu Start */

/* Root used for color variables */
:root{
  /* --slusd-yellow: limegreen; */
  
  /* --clild-link-color: black;
  --slusd-blue: rgba(255,197,47,.95);
  --slusd-yellow: rgb(42,45,124); */
  
  /* NOT CURRENTLY USED Menu Colors */
  /* --menu-primary: var(--e-global-color-e3feae0);
  --menu-secondary: var(--e-global-color-340c731);
  --menu-accent: var(--e-global-color-5ac0463); */
  
  /* Other color variables */
  --child-link-color: white; /*var(--e-global-color-accent); /*white;*/
  --slusd-blue:rgb(42,45,124);
  --slusd-yellow: rgba(255,197,47,.95);
  --current-page-family-tree: rgba(255,197,47,.50); /*rgba(255, 47, 193,1);*/
  --children-background: var(--slusd-blue);
  --menu-width: 300px;
  --half-menu-width: calc(var(--menu-width)/5);
  --children-margin: 10px; 
  --unselected-font-weight: 600;
  --unselected-top-font-weight: 600;
  --selected-font-weight: 700;
  --transition-delay: 100s;
  --mega-menu-min-height: 20px;


}

/* Start Left Nav CSS */

#areapage-dropdown {
margin: 0;
padding: 0;
font-family: sans-serif;
list-style: none;
text-decoration: none;
list-style:none;
text-decoration:none;
position: relative;
}

#areapage-dropdown-ul {
  width: var(--menu-width);
  border-radius: 30px;
  overflow: hidden;
}
#areapage-dropdown-ul  ul > li > ul  li {
  border-bottom: rgb(92, 92, 92) 1px solid;
}

#areapage-dropdown-ul li > ul > li{
  text-decoration: none;
  list-style:none; 
  border-bottom: darkslategray 1px solid;
}
/* Menu Title */
#areapage-dropdown-ul>li>a{
font-weight: var(--unselected-font-weight);
text-decoration: none;
position: relative;
margin-left: var(--half-menu-width)
}

#areapage-dropdown-ul .children{
  background-color: var(--children-background);
  overflow: hidden;
  max-height: 0; /* this should be 0 */
}

#areapage-dropdown-ul .children li a{
  color: var(--child-link-color);
  display: block;
  padding: 5px 16px;
  font-size: 14px;
  margin-left: var(--children-margin);
  position: relative;
  text-decoration:none
}

#areapage-dropdown-ul li.current_page_item>a::before{
  content: "";
  width: 10px;
  height: 100%;
  position: absolute;
  background: var(--slusd-yellow);
  left: calc((var(--children-margin)*-.50)); 
  top: 0;
}
body > main > div > h2 > a {
  color: blue;
}
/* Left side hover selector bar */
/* #areapage-dropdown-ul{
   background-color: var(--slusd-blue) !important; 
} */
#areapage-dropdown-ul .children li>a::before{
  content: "";
  width: 10px;
  height: 100%;
  position: absolute;
  background: var(--slusd-yellow);
  left: calc((var(--children-margin)*-.50)); 
  top: 0;
  transition: 0.1s ease;
  opacity: 0;
}



li.current_page_item > a:link,
li.current_page_item > a:visited {
	border-bottom: solid 3px var(--slusd-blue);
	font-weight: var(--selected-font-weight);
}

#areapage-dropdown-ul>li>ul>li>a {
  display: block;
  padding: 5px 10px;
  
  background:  var(--slusd-yellow);
  color: var(--slusd-blue);
  position: relative;
  font-weight: var(--unselected-top-font-weight);
  transition: 100ms ease;
 } 

 #areapage-dropdown-ul>li>ul>li>a:hover {
  /* text-decoration: underline; */
  border-bottom: solid 2px var(--slusd-blue);
  /* font-weight: var(--selected-font-weight); */
 }

 #areapage-dropdown-ul .page_item_has_children>.children{
   max-height: 0;
   /* transition: 500ms ease; */

 }

/* Class used by jQuery to expand left hand click menu */
.menu-max-height{
  max-height: 100%;
}
 /* For devices with a pointer-hover ability (PC) */
 @media (hover:hover){
  #areapage-dropdown-ul .children li:hover>a::before,
  #areapage-dropdown-ul .current_page_ancestor>a::before,
  #areapage-dropdown-ul .current_page_parent>a::before
  {
  opacity:1;
  
  }

/* #areapage-dropdown-ul .page_item_has_children:hover>a::after,
#areapage-dropdown-ul .page_item_has_children:active>a::after,
#areapage-dropdown-ul .current_page_ancestor>a::after, 
#areapage-dropdown-ul .current_page_parent>a::after{
  transform: rotate(-45deg);
} */
#areapage-dropdown-ul .page_item_has_children:hover>a,
#areapage-dropdown-ul .page_item_has_children:active>a{
  box-shadow: inset 0 -1px 0 0 var(--slusd-yellow);
}

/* Uncomment block below 423-429 to reenable hover menu */
/* 
#areapage-dropdown-ul .page_item_has_children:hover>.children,
#areapage-dropdown-ul .page_item_has_children:active>.children, 
.current_page_item .children{
  max-height: 100%;

} */


 }
/* #areapage-dropdown-ul .page_item_has_children:hover

#areapage-dropdown-ul .page_item_has_children:hover .children
  {  
    max-height: 100%;
    list-style: none;
    transition: max-height 1s;
    transition-delay: 10s;
 } */

/* Additional Items chevron */
#areapage-dropdown-ul .page_item_has_children::before>a{
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  background: var(--slusd-yellow);
  left: 19px;
  bottom: -7px;
  transform: rotate(45deg);
  opacity: 0;
  /* transition: 0.2s ease; */
}

/* chevron if item has children */
#areapage-dropdown-ul .page_item_has_children>a::after{
	content: "";
  border-style: solid;
	border-width: 0.25em 0.25em 0 0;
	display: inline-block;
	height: 0.45em;
	position: absolute;
	left: 95%;
	top: 40%;
	vertical-align: top;
  width: 0.45em;
  transform: rotate(135deg);
  /* transition: 0.2s; */
}


#areapage-dropdown-ul .page_item_has_children>a {
  font-weight: var(--unselected-font-weight);
  box-shadow: none;
  /* transition: 0.2s ; */
}



#areapage-dropdown-ul .current_page_item>a{
  box-shadow: inset 0 -1px 0 0 var(--current-page-family-tree);
  font-weight: var(--selected-font-weight);
}
#areapage-dropdown-ul li.current_page_item>a{
  /* text-decoration: underline; */
  font-weight: var(--selected-font-weight);
  box-shadow: inset 0 -4px 0 0 var(--current-page-family-tree)
}

/* Mark parent dropdowns of current page */
#areapage-dropdown-ul .children>.current_page_parent>a,
#areapage-dropdown-ul .children>.current_page_ancestor>a
{
  box-shadow: inset 0 -1px 0 0 var(--current-page-family-tree); /* inset 0px 3px 0px -2px var(--current-page-family-tree);*/
}

/* Display area if on currently active page */
#areapage-dropdown-ul .current_page_ancestor>.children,
#areapage-dropdown-ul > li > ul > li.page_item_has_children.current_page_item > ul.children{
  max-height: 100%;
}
/* Rotates "item had children" chevron for current page */
/* #areapage-dropdown-ul > li > ul > li.page_item_has_children.current_page_item>a::after{
  transform: rotate(-45deg)
} */

/* End left nav css */

/* Additional fixes */
.contact-info a{
  color:var(--slusd-yellow);
  text-transform: none !important;
  /* text-decoration: underline; */
}
.contact-info a:hover,
.contact-info a:active{
  text-decoration: underline;
  color: var(--slusd-yellow);
}

#admin-access-link p a{
  color:grey;
  color:rgba(173, 200, 230,.15);
}

.menu>li>a{
  /* font-size: 12pt; */
  font-weight: 500;
}

.menu>li>ul>li>a{
  /* font-size:10pt; */
    font-weight: 500;
}

.menu>li>ul>li{
  list-style-type: circle;
}


/* Mega menu height styling */
#about-top .elementor-row,
#about-top .elementor-column-wrap{
  min-height: var(--mega-menu-min-height);
}

#about-bottom .elementor-row,
#about-bottom .elementor-column-wrap{
  min-height: var(--mega-menu-min-height);
}

#students-and-families-top .elementor-row,
#students-and-families-top .elementor-column-wrap{
  min-height: var(--mega-menu-min-height);
}
#students-and-families-bottom .elementor-row,
#students-and-families-bottom .elementor-column-wrap{
  min-height: var(--mega-menu-min-height);
}

#staff-top .elementor-row,
#staff-top .elementor-column-wrap{
  min-height: var(--mega-menu-min-height);
}
#staff-bottom .elementor-row,
#staff-bottom .elementor-column-wrap{
  min-height: var(--mega-menu-min-height);
}

#mega-menu-contact .elementor-row,
#mega-menu-contact .elementor-column-wrap{
  min-height: 150px;
}

.mega-menu-wrap{
  min-height: 20px;
}

/* Mega Menu sublist show/no show */
.mega-menu-wrap .sub-menu{
  display: none;
}

/* #mega-menu-wrap #mega-menu-directory li.current-menu-item{
  display: none;
  visibility: none;
} */

/* Lower nav "White boxes" styling */
@media (min-width: 769px) {
  #news{
    padding-top: .75rem;
  }
  #lower-nav{
    position:absolute;
    left: 50%;
    transform: translate(-50%);
    max-width:864px;
    min-width: 864px;
    margin-top:-80px;
    /* box-shadow: 0px 15px 15px -10px black; */
  }
  .lower-nav-item 
    > .elementor-column-wrap 
    > .elementor-widget-wrap 
    > .lower-nav-button
    ,#lower-nav > div > div.lower-nav-item > div > div.lower-nav-button{
    border-right: 1px solid #02010159;
  }
  #lower-nav
    .lower-nav-item:last-child
    .lower-nav-button
    {
      border-right: none;
    }
  
}
/**************************************/
/*** Secondary schools menu css fix ***/
/**************************************/

#menu-item-19032:hover > ul, /* SLUSD */
#menu-item-4631:hover > ul, /* SLHS */
#menu-item-13635:hover > ul, /* SLVA */
#menu-item-3109:hover > ul, /* Adult */
#menu-item-2702:hover > ul, /* Muir */
#menu-item-2419:hover > ul, /* Lincoln */
#menu-item-3605:hover > ul /* Bancroft */
{
  background-color: transparent;
  display: flex;
  justify-content: center;
}
#menu-item-19032 > ul, /* SLUSD */
#menu-item-4631 > ul, /* SLHS */
#menu-item-13635 > ul, /* SLVA */
#menu-item-3109 > ul, /* Adult */
#menu-item-2702 > ul, /* Muir */
#menu-item-2419 > ul, /* Lincoln */
#menu-item-3605 > ul /* Bancroft */
{
  display:none
}


/**************************************/
/**************************************/
/* Mobile specific CSS in Media Query */
/**************************************/
/**************************************/

@media screen and (max-width: 768px) {
  .home {
    /* background-color: var(--e-global-color-primary); */
    background-color: var(--e-global-color-primary) !important;
  }
  .elementor-element-59f0779{
    height:1px;
  }
  #lower-nav{
    margin-top: -10px;
    /* margin-left: 1rem;
    margin-right: 1rem; */
  }
  .lower-nav-button{
    border-bottom:1px solid #02010159 ;
    
  }
  #lower-nav
  > .elementor-container
  > .elementor-row
  ,#lower-nav > div.elementor-container
   { 
    max-height: 43vh;
    display: grid;
    grid-auto-flow: column;
  }
  #lower-nav
    > .elementor-container
    > .elementor-row
    > .lower-nav-item:nth-child(even)
    ,#lower-nav > div.elementor-container> .lower-nav-item:nth-child(even)
    {
    /* background-color: green; */
    grid-column: 1;
    border-right: 1px solid #02010159;
        
    }
  
  #lower-nav
    > .elementor-container
    > .elementor-row
    > .lower-nav-item:nth-child(odd)
    ,#lower-nav > div.elementor-container> .lower-nav-item:nth-child(odd)
    {
        /* background-color: orangered; */
        grid-column: 2;
    }
 
  #lower-nav
    > .elementor-container
    > .elementor-row
    > .lower-nav-item:last-child:nth-child(odd)
    ,#lower-nav > div.elementor-container> .lower-nav-item:last-child:nth-child(odd)
    {
     border-bottom: none;
     border-right: none;
     /* background-color: pink;  */
     grid-column: 1 / span 2;
    
    }

    #lower-nav
    .lower-nav-item:last-child
    .lower-nav-button
    {
      border-right: none;
      border-bottom: none;
    }

    /* Mobile site logo css */
    #SLUSD-logo{
      max-width: 15% !important;
      /* max-height: 25% !important; */
      margin-top: .2rem;
      margin-right: 25vw;
    }
    #SLUSD-logo.flip{
      transform: scaleX(-1);
    }

    /* mobile header divider */
    .main-header-wrap{
      border-bottom: 2px solid #fff;
    
    }
}

 /* For devices that do not have hover (phones) */
 @media (hover:none){
  /* #areapage-dropdown-ul .children li>a::before,
  #areapage-dropdown-ul .current_page_ancestor>a::before,
  #areapage-dropdown-ul .current_page_parent>a::before
  {
  opacity:;
  
  } */

  #areapage-dropdown-ul .page_item_has_children:active>a::after,
#areapage-dropdown-ul .page_item_has_children:active>a::after,
#areapage-dropdown-ul .current_page_ancestor>a::after, 
#areapage-dropdown-ul .current_page_parent>a::after{
  transform: rotate(-45deg);
}
#areapage-dropdown-ul .page_item_has_children:active>a,
#areapage-dropdown-ul .page_item_has_children:active>a{
  box-shadow: inset 0 -1px 0 0 var(--slusd-yellow);
}
  
   #areapage-dropdown-ul .page_item_has_children:active>.children,
   #areapage-dropdown-ul .page_item_has_children:active>.children, 
   .current_page_item .children{
    max-height: 100%;
    list-style:none; 
    /* transition-delay: var(--transition-delay) */
   } 
 }
 .bullets-square{
  list-style-type: square !important;
 }
 .bullets-square > li::before{
  content:"â– "
 }

/* Styles for "New Post" badge */
.new-post:before {
  content: "";
  z-index: -1;
  overflow: hidden;
  transform: rotate(-135deg);
  width: 120px;
  display: block; 
  background: #79A70A;
  background: linear-gradient(#9BC90D 0%, #79A70A 100%);
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 34px;
  right: -16px;
  clip-path: polygon(120px 20px, 90px -10px, 30px -10px, 0px 20px, 10px 30px,  110px 30px);
  height: 20px;
  width: 120px;
}
.new-post:after {
  content: "new!";
  z-index: 1;
  overflow: hidden;
  font-size: 10px;
  font-weight: bold;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
  line-height: 20px;
  transform: rotate(45deg);
  width: 120px;
  display: block; 
  background: #79A70A;
  background: linear-gradient(#9BC90D 0%, #79A70A 100%);
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 20px; right: -30px;
  clip-path: polygon(120px 20px, 90px -10px, 30px -10px, 0px 20px, 10px 30px,  110px 30px)
}
 

/* For Emergency Alert Lightbox */
.wpm-ea-alert-lightbox{
  border-radius: 25px;
}