/* COMPATIBILITY */
@-webkit-viewport   { width: device-width; }
@-moz-viewport      { width: device-width; }
@-ms-viewport       { width: device-width; }
@-o-viewport        { width: device-width; }
@viewport           { width: device-width; }

/*@import url('https://fonts.googleapis.com/css2?family=Oxygen:wght@300&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Oxygen&display=swap');
/*@import url('https://fonts.googleapis.com/css2?family=Oxygen:wght@700&display=swap');*/

/* COMMON STYLES */
html, body {
	width: 100%;
	height: 100%;
	/*font-family: "Comic Sans MS", cursive, sans-serif;*/
	font-family: 'Oxygen', 'Comic Sans MS', sans-serif, cursive;
}

/*
@font-face {
	font-family: "Glyphicons Halflings";
	src: url("../fonts/bootstrap/glyphicons-halflings-regular.eot");
	src: url("../fonts/bootstrap/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/bootstrap/glyphicons-halflings-regular.woff2") format("woff2"), url("../fonts/bootstrap/glyphicons-halflings-regular.woff") format("woff"), url("../fonts/bootstrap/glyphicons-halflings-regular.ttf") format("truetype"), url("../fonts/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg");
}

.glyphicon {
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: "Glyphicons Halflings";
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}*/

.panel .panel-heading .panel-title {
    text-align: left;
}

.glyphicon {
	-webkit-text-stroke: 10px #73b2e5;
}

.mx-center {
	margin-left: auto;
	margin-right: auto;
	max-width: 1200px;
}


.CareBlue {
	background: #73b2e5 !important;
}

.dark-cyan-bkgrnd {
	background: #2883a4 !important;
}

.dark-cyan-font {
	color: #2883a4;
}

.dark-cyan-border {
	border-color: #2883a4;
}



.bordered-img {
	border: 2px solid #73b2e5;
	padding: 4px;
}

#team-img {
	border: 2px solid #73b2e5;
	padding: 4px;
}

#meet-our-team-list {
	font-weight: bold;
	font-size: 16px;
}

#meet-our-team-list .list-group-item {
	border: 0px;
	padding:1px 15px;
}

#meet-our-team-info-panel {
	position: relative;
	left: -50px;
	top: -2px;
	border: 1px solid #73b2e5;
	padding: 2px;
	margin-bottom: 35px;
	background: #ffffff !important;
	max-width: 500px;
}

#meet-our-team-info-panel div {
	font-size: 16px;
	color: #ffffff;
	padding: 7px;
	padding-left: 20px;
	background: #73b2e5 !important;
}

.youth-panel div div h2 { margin-bottom: 0px; }

.youth-panel div div h2 a.youth-court-header-bg {
	border-color: #009933 !important;
	background-color: #009933 !important;
}

.youth-panel div div a.youth-court-body-bg {
	border-color: #e0ebeb !important;
	background-color: #e0ebeb !important;
}

.youth-panel div div h2 a.advisory-board-header-bg {
	border-color: #cccc00 !important;
	background-color: #cccc00 !important;
}

.youth-panel div div h2 a.project-roots-header-bg {
	border-color: #85adad !important;
	background-color: #85adad !important;
}

.youth-panel div div a.advisory-board-body-bg,
.youth-panel div div a.project-roots-body-bg {
	border-color: #f0f5f5 !important;
	background-color: #f0f5f5 !important;
}

.youth-panel div div h2 a.youth-court-header-bg,
.youth-panel div div h2 a.advisory-board-header-bg,
.youth-panel div div h2 a.project-roots-header-bg {
	color: #ffffff;
}

.youth-panel div div a,
.youth-panel div div a,
.youth-panel div div a {
	line-height: 1.7;
}

.ifab-panel div div a,
.ifab-panel div div h2 a {
	line-height: 1.7;
}

.ifab-panel div div h2 a {
	font-size: 20px;
	color: #73b2e5;
}

.ifab-panel .list-group-item {
	border: 0px;
	font-weight: bold;
}

.ifab-panel .cultural-awareness { }

.ifab-panel .cultural-awareness .cultural-awareness-header {
	border: 0px;
	font-weight: bold;
}

.ifab-panel .cultural-awareness .cultural-awareness-header,
.ifab-panel .cultural-awareness .cultural-awareness-header div,
.ifab-panel .cultural-awareness .cultural-awareness-header div div,
.ifab-panel .cultural-awareness .cultural-awareness-header div div a,
.ifab-panel .cultural-awareness .cultural-awareness-header div div img,
.ifab-panel .cultural-awareness .cultural-awareness-header div div h2,
.ifab-panel .cultural-awareness .cultural-awareness-header div div h2 a {
	margin: 0px;
	padding: 0px;
}

.who-we-are-panel div h4 {
	margin-top: 15px;
}

.who-we-are-panel .list-group-item ul {
	padding-left: 20px;
}

.who-we-are-panel .list-group-item ul li {
	line-height: 1.7;
	font-size: 14px;
}

.who-we-are-panel .list-group-item {
	border: 0px;
	font-weight: bold;
	padding: 2px 0px;
	line-height: 1.7;
}

.receptacle {
    padding: 7px;
}

.showcase-container {
    text-align: center;
    padding-top: 3em;
    padding-bottom: 3em;
    box-sizing: border-box;
}

.showcase-panel {
}

.showcase-groupbox {
    margin: 0px;
    padding: 0px;
    padding-bottom: 5px;
}

.banner-block {
    overflow: hidden;
}

.banner-block .banner-wrap {
    z-index: 1;
    padding: 1px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 331px;
}

.banner-block .showcase-wrap {
    padding: 1px;
    background-position: 50% 50%;
    min-height: 355px;
}

.banner-block .banner-wrap:after {
    content: "";
    position: absolute;
    top: -40px;
    right: -50px;
    opacity: .2;
    box-shadow: inset 0 0 174px #4d5b69;
    width: 100%;
    height: 60%;
    filter: blur(10px);
    z-index: -1;
    border-radius: 50%;
    opacity: 0.1;
}


.banner-block .banner-wrap .banner-image {
	min-height: 330px;
}

.banner-block .banner-wrap .banner-image img {
	/* max-height: 250px; */
	height: 100%;
	width: 100%;
	/* object-fit: contain */
}

.banner-block .banner-wrap .banner-message {
	font-size: 13px
}

.banner-block .banner-wrap .banner-message .banner-message-panel {
	display: flex;
	align-items: center;
	/*padding: 10px;*/
	height: 330px;
	margin: 0;
	padding: 0;
	font-weight: bold;
}

/*.banner-block .banner-wrap .banner-message .banner-message-panel .banner-message-sub-panel { }*/

.carousel-description {
	font-size: 3.0rem;
	/*font-size: 20px;*/
	font-weight: bolder;
	color: #ffffff;
	/* background: linear-gradient(rgba(0, 0, 0, 0), rgb(0, 1, 1)); */
	position: absolute;
	/*margin: 250px 45px 0px 0px;*/
	margin: -60px 0px 0px 0px;
	padding: 0px;
	width: 100%;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
	/*  */
}

.carousel-description .header {
	text-align: center;
	/* background-color: yellow; */
	/*width: 80%;*/
}

.transbox {
	font-size: 12px;
	font-weight: bolder;
	color: #ffffff;
	background: linear-gradient(rgba(0, 0, 0, 0), rgb(0, 1, 1));
	position: absolute;
	margin: 210px 13px 0px 0px;
	padding-left: 10px;
	width: 93%;
}

.transbox .header {
    text-align: left;
}

.transbox a {
    color: #b3b300;
}

.transbox hr {
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
}

.transbox .horizontal {
    height: 8px;
    border-width: 0;
    color: gray;
    width: 50%;
    float: left;
}

.transbox .purple {
    background-color: #6600cc;
}

.transbox .orange {
    background-color: #ff9933;
}

.transbox .yellow {
    background-color: #ffff00;
}

.transbox .text_region {
    float: left;
    text-align: left;
    font-weight: normal;
}

.panel-adjuster {
	width: 65px;
	margin: auto;
	padding: 25px 10px 0px 10px;
}

.carousel .carousel-inner .item img {
    height: 350px;
    padding: 0px;
    margin: 0px;
}

.carousel .carousel-inner .item {
	cursor: pointer;
}

.virtual-fair div iframe {
	width: 270px;
	height: 210px;
}


.o-container {

}

.o-container .o-row {
}

.o-container .o-row .o-col1 {
	text-align: left;
}

.o-container .o-row .o-col2 {
}

.o-container .o-row .o-col2 ul {
	padding-left:20px;
	/*margin:0;*/
	/*padding:0;*/
}

.o-container .o-row .o-col1 img {
	border: 2px solid #73b2e5;
	padding: 4px;
}

.o-container .list-group-item {
	/*border: 0px;
	font-weight: bold;
	padding: 2px 0px;*/
}


.p-contact { 
	max-width: 650px;
	margin:auto;
}

.p-contact .row .p-address { }

.p-contact .row div .p-phone {
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: left;
}

.p-contact .row div .p-email {
	text-align: left;
}

.p-contact .row div .p-email h4, 
.p-contact .row div .p-phone h4, 
.p-contact .row div .p-phone p, 
.p-contact .row div .p-email p {
	display: inline; /* display:contents; display:initial; */
}

.p-contact .row div .p-hours {
	/*text-align: left;*/
}

.p-contact .row .p-social-media {
	padding-right: 75px;
}

.nws-ltr-panel {
	margin: 0 auto;
	max-width: 900px;
}

.nws-ltr-panel div div img {
	width: 700px;
}


/* ------------------------------------------- */


/*#home-carousel .slick-prev, #home-carousel .slick-next {
	font-size: 0;
	line-height: 0;
	position: absolute;
	top: 50%;
	display: block;
	width: 20px;
	height: 20px;
	padding: 0;
	transform: translate(0, -50%);
	cursor: pointer;
	color: transparent;
	border: none;
	outline: none;
	background: transparent;
} */




#home-carousel .slick-prev {
	left: -35px;
}

#home-carousel .slick-next {
	right: -35px;
}

	#home-carousel .slick-prev:before, #home-carousel .slick-next:before {
		font-family: 'slick';
		font-size: 40px;
		margin-left: -30px;
		padding: 20px;
		line-height: 1;
		opacity: .75;
		color: #73b2e5 !important; 
	}

#home-carousel .slick-list {
	width: 100%;
}

#home-carousel .slick-dots li button:before {
	font-size: 20px;
	line-height: 20px;
}

#home-carousel #single-item {
	padding-top: 3em;
	margin-left: 30px;
	margin-right: 30px;
}


#home-carousel #single-item .row .image-col {
	/* padding: 4px; */
	/* border: 2px solid #73b2e5; */
}

#home-carousel #single-item .row .image-col img {
	height: 100%; /* 330px; */
	width: 100%;
	object-fit: fill;  /* contain cover fill inherit initial none revert scale-down unset */
	max-height: 330px;
	/* min-height:330px; */
	border: 2px solid #eaf6fa;
	padding: 4px;
}

#home-carousel #single-item .row .description-col {
	font-size: 13px
}

#home-carousel #single-item .row .description-col .description-panel {
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	height: 100%; /* 330px; 100%; */
	font-weight: bold;
}



/* ------------------------------------------- */





/* Cleanup is in progress to gradually remove unused styles. All items above are in use. Thanks. -Sunday */




.in-page-link {
	/* Adjust with height of navbar */
	padding-top: 75px;
	margin-top: -70px;
}

a {
	color: #0000ff;	
}

.page-row {
	display: table-row;
 	height: 1px;
}

.page-row-expanded { 
	height: 100%; 
}

h1, h2, h3, h4, h5, h6,
.icon {
	text-align: center;	
}

h1{
	font-size:55px;
}

	.icon i {		
		border: 2px solid #333;
		border-radius: 100%;
		padding: 20px;
	}



.dropdown-menu > li > a {
	padding-top: 7px;
	padding-bottom: 7px;
}

.btn-primary {
    border-color: #0f75bd;
}

.btn-primary.active, .btn-primary.focus, .btn-primary:active, 
.btn-primary:focus, .btn-primary:hover, 
.open > .dropdown-toggle.btn-primary {
	background-color: #2460b8;
}

.masthead {
	margin-bottom: 0;
}
	
.section {
	padding: 20px 0;	
}

.row {
	padding-top: 10px;
}

.description,
.panel-group {
	max-width: 700px;
	margin: 0 auto;
}

.description {
	line-height: 1.75em;
	padding: 15px 0;
}

.video-img {
	width: 100%;
}

.floatRight {
	float: right;
}

.styleA {
	/* Blue bg, white text */
	background-color: #0f75bd;
	color: #fbfbfb;
}	

.styleB {
	/* Black bg, white text */
	background-color: #333;
	color: #fbfbfb;	
}

.styleC {
	/* Gray bg, black text */
	background-color: #e2e2e2;
	color: #222;	
}

.styleA a:not(.btn), 
.styleB a:not(.btn) {
	color: #FFFF5D;
	text-decoration: underline;
}

.styleA a:hover:not(.btn), 
.styleB a:hover:not(.btn),
.styleA a:focus:not(.btn), 
.styleB a:focus:not(.btn) {
	color: #FFFFB6;
}

.styleC a:not(.btn) {
	color: #0645AD;
	text-decoration: underline;
}

.styleC a:hover:not(.btn),
.styleC a:focus:not(.btn) {
	color: #0645AD;
}

.btn.styleB,
.btn.styleC {
	border-color: #222;
}

.btn.styleB:hover, 
.btn.styleB:focus,
.btn.styleB:active {
	color: #222;
	background-color: #e2e2e2;
}

.btn.styleC:hover, 
.btn.styleC:focus,
.btn.styleC:active {
	color: #e2e2e2;
	background-color: #222;
}

.highlight {
	font-weight: bold;	
	padding: 5px;
	background: #ffeda4;
}

.emphasize {
	font-weight: bold;	
}

.language {
	font-style: italic;
}

span.highlight {
	padding: 1px;
  	box-shadow: 2px 0 0 #ffeda4, -2px 0 0 #ffeda4;  	  	  	
  	-webkit-box-decoration-break: clone;
  	box-decoration-break: clone;
}

/* Shared Styles */
.btn,
h1, h2, h3, h4, h5, h6,
.homePage .description,
.commPage .description,
.communities .row > div a,
.categories .question {
	font-weight: bold;
}


/* --Begin: styles for contact razor page-- */

.contact-container {
	padding: 5px 25px;
}

.contact-container h2,
.contact-container h3,
.contact-container h4 {
	text-align: left;
	line-height: 1.5em;
}

.contact-container address table tr { line-height: 1.5em; }

.contact-container address table tr > .col1 { width: 85px; }

.contact-container address table tr > .col2 {
	width: 250px;
	white-space: nowrap;
}


/* ----------------------------- */

.our-space {
	position: relative;
	width: 100%;
}

.our-space .row {
	margin-left: 0px;
	padding-right: 0px;
}


.our-space .row .receptacle img {
	max-width: 100%;
}

.our-space .row .ourspace-img {
	float: left;
	padding-right: 24px;
	padding-left: 0px;
}

.our-space .row .ourspace-msg {
	display: inline-block;
	width: 58%;
}

#header  .gsc-input {
	font-size: 16px;
	color: black;
}

.image-row {
	display: flex;
	justify-content: space-between; /* Spacing between images */
	flex-wrap: wrap; /* Allows wrapping on smaller screens */
	gap: 10px; /* Optional: Add some space between images */
	margin: 20px;
	margin-top:0px;
}

	.image-row img {
		width: 19%; /* 100% / 5 images = 20%, with slight adjustment for gaps */
		height: auto;
		border-radius: 10px; /* Optional: Adds rounded corners */
		box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Optional: Adds shadow */
	}



.half-circle-left {
	width: 300px;
	height: 300px;
	overflow: hidden;
	clip-path: circle(50% at 0% 50%);
	display: inline-block;
}

	.half-circle-left img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

.image-container {
	display: inline-block;
	width: 200px; /* Adjust width to fit your design */
	margin: 5px; /* Add spacing between photos */
	text-align: center; /* Center text below the image */
	vertical-align: top; /* Align containers properly */
}

	.image-container img {
		width: 100%; /* Make image fill the container */
		height: auto; /* Maintain aspect ratio */
		border-radius: 10px; /* Optional: Rounded corners for images */
		box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Optional: Image shadow */
	}

.team-name {
	margin-top: 10px; /* Add spacing between image and name */
	font-weight: bold;
	font-size: 16px;
	color: #093244; /* Adjust color as needed */
}

.image-row {
	display: flex;
	flex-wrap: wrap; /* Ensure layout adjusts on smaller screens */
	justify-content: center; /* Center the images horizontally */
	gap: 5px; /* Add spacing between image containers */
}