/* Responsive styles for SPARCC - Jon @ Graydian 3-17-2023 */


@media only screen and (min-width: 1200px) {
	
	.hide-on-desktop {
		display: none;
	}
	
}



@media only screen and (min-width: 992px) and (max-width: 1199px) {

	.container-lower-nav-inner {
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
	}
	
	.container-lower-nav button.dropdown-toggle {
		font-size: 15px;
	}
	
	#content {
		max-width: 95%;
	}
	
	.wrapper {
	  padding: 2rem 0;
	}

}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	
	.hide-on-tablet {
		display: none;
	}
	
	.wrapper {
	  padding: 2rem 0;
	}
	
	button.navbar-toggler {
		display: none;
	}
	
	.google-translate {
		min-width: 165px;
	}
	
	.google-translate-inner {
		padding: 0 4px;
		min-height: 31px;
	}
	
	#mega-menu .dropdown-menu {
		position: absolute;
		padding-top: 15px;
		padding-bottom: 0;
	}
	
	#mega-menu .dropdown-menu .mega-menu-container {
		margin-bottom: 15px;
	}
	
	#mega-menu h2 {
    padding-top: 10px;
    border-top: 0;
	}
	
	#mega-menu .dropdown-menu br {
		display: none;
	}
	
	#mega-menu .dropdown-menu .row:first-of-type {
		margin-bottom: 0;
	}
	
	#mega-menu .mega-menu-container ul > li {
		line-height: 1.2;
	}
	
	#mega-menu .mega-menu-container ul > li > a {
		line-height: 1.2;
		white-space: normal;
		font-size: 14px;
    display: block;
    background-color: #126994;
    margin-bottom: 7px;
    padding: 10px 22px 8px 8px;
    border-radius: 5px;
    font-weight: bold;
    position: relative;
	}
	
	#mega-menu .mega-menu-container ul > li > a:after {
		position: absolute;
		right: 10px;
		font-family: fontawesome;
		content: "\f105";
	}
	
	#mega-menu .mega-menu-container ul > li > a[target="_blank"]:after {
		content: "\f08e";
	}
	
	#mega-menu .mega-menu-container ul > li > a:hover,
	#mega-menu .mega-menu-container ul > li > a:active,
	#mega-menu .mega-menu-container ul > li > a:focus {
    background-color: #00456a;
    text-decoration: none;
	}
	
	#mega-menu .mega-menu-container ul.columns {
	  column-count: 1;
	  column-gap: none;
	  column-fill: none;
	}
	
	.container-hero-inner {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.container-hero-inner .site-logo {
	  max-width: 90%;
		margin: 0 auto 15px;
	}
	
	.container-lower-nav {
		display: none;
	}
	
	#primary {
		margin-bottom: 30px;
	}
	
	.home-news {
		margin-bottom: 30px;
	}
	
	.em-search .em-search-views {
		display: none;
	}

}

@media only screen and (min-width: 1px) and (max-width: 767px) {

	.hide-on-phone {
		display: none;
	}
	
	.wrapper {
	  padding: 2rem 0;
	}
	
	button.navbar-toggler {
		display: none;
	}
	
	.google-translate {
		border-left: 0;
		border-right: 0;
	}
	
	.google-translate-inner {
		padding: 0 8px 0 0;
		text-align: right;
		min-height: 31px;
	}
	
	#mega-menu .dropdown-menu {
		position: absolute;
		padding-top: 15px;
		padding-bottom: 0;
	}
	
	#mega-menu .dropdown-menu .mega-menu-container {
		margin-bottom: 15px;
	}
	
	#mega-menu h2 {
    padding-top: 10px;
    border-top: 0;
	}
	
	#mega-menu .dropdown-menu br {
		display: none;
	}
	
	#mega-menu .dropdown-menu .row:first-of-type {
		margin-bottom: 0;
	}
	
	#mega-menu .mega-menu-container ul > li {
		line-height: 1.2;
	}
	
	#mega-menu .mega-menu-container ul > li > a {
		line-height: 1.2;
		white-space: normal;
		font-size: 14px;
    display: block;
    background-color: #126994;
    margin-bottom: 7px;
    padding: 10px 22px 8px 8px;
    border-radius: 5px;
    font-weight: bold;
    position: relative;
	}
	
	#mega-menu .mega-menu-container ul > li > a:after {
		position: absolute;
		right: 10px;
		font-family: fontawesome;
		content: "\f105";
	}
	
	#mega-menu .mega-menu-container ul > li > a[target="_blank"]:after {
		content: "\f08e";
	}
	
	#mega-menu .mega-menu-container ul > li > a:hover,
	#mega-menu .mega-menu-container ul > li > a:active,
	#mega-menu .mega-menu-container ul > li > a:focus {
    background-color: #00456a;
    text-decoration: none;
	}
	
	#mega-menu .mega-menu-container ul.columns {
	  column-count: 1;
	  column-gap: none;
	  column-fill: none;
	}
	
	.container-hero-inner {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.container-hero-inner .site-logo {
	  max-width: 90%;
		margin: 0 auto 15px;
	}
	
	.container-lower-nav {
		display: none;
	}
	
	#primary {
		margin-bottom: 30px;
	}
	
	.home-news {
		margin-bottom: 30px;
	}
	
	.em-search .em-search-views {
		display: none;
	}
	
	.wp-block-image .alignright,
	.wp-block-image .alignleft,
	.wp-block-image .aligncenter {
	    float: none;
	    margin: 15px 0;
	}
	
	.staff-directory .card .staff-photo {
		margin-bottom: 15px;
	}
		
}