﻿/*last updated 11/17/2023*/
/* Sticky footer styles-------------------------------------------------- */
html {
	position: relative;
	min-height: 100%;
	scroll-behavior: smooth;
}
body {
	/* Margin bottom by footer height */
	color: rgba(0,0,0,.9);
	/*margin-bottom: 60px;
	*/
}
a, .navbar-light .navbar-nav .nav-link, .fa-home:before {
	/*color: #0F9D58;
	*/
	border-width: 0px;
	border-color: transparent;
	border-style: solid;
	text-decoration: none;
	transition: all 0.2s ease-in-out;
}
a:hover {
	color: #4871b7;
	border-bottom: 1px #4871b7 solid;
	text-decoration: none;
	transition: all 0.2s ease-in-out;
}

.text-justify {text-align: justify;}
.dropdown { 
	position: static !important; 
} 
.dropdown:hover>.dropdown-menu {
	display: block;
  }
.dropdown-menu { 
	box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15)!important; 
	margin-top: 0px !important; 
	width: 100% !important; 
} 
.navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:hover,.navbar-light .navbar-nav .nav-link,.nav-link:hover,.navbar a:hover,.nav-item,.nav-item a,.navbar-light .navbar-brand:hover,.navbar i:hover,.navbar a i:hover,.fa-home:before:hover {
	color: #003366 !important;
	border-bottom: none !important;
	transition: all 0.3s ease-in-out;
}
.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
	color: #0f9d58;
	border-bottom: none !important;
	transition: all 0.3s ease-in-out;
}
.navbar-toggler, .navbar-toggler:focus, .navbar-toggler:focus-visible {
	border: none;
	outline: none;
}
.navbar-nav .dropdown-menu {
	border-top: 2px #095932 solid !important;
	border: 1px #095932 solid;
	transition: all 0.3s ease-in-out;
}
.navbar-light .navbar-nav .nav-link, .fa-home:before {
	/*color: #0F9D58;
	*/
	transition: all 0.2s ease-in-out;
}
.navbar-light .navbar-nav .nav-link:hover {
	color: #003366;
	font-weight: 700;
	transition: all 0.2s ease-in-out;
}
.dropdown-item, .dropdown-item:hover, .dropdown-item a, .dropdown-item a:hover {
	transition: all 0.3s ease-in-out;
}
.footer {
	width: 100%;
	height: 60px;
	position: fixed;
	bottom: 0px;
	line-height: 60px;
	color: #095932;
	background-color: #f5f5f5;
}
.footer p.copyright {
	color: #095932;
}
.footer p.disclaimer {
	background: #0F9D58;
	color: #fff;
	border-radius: 50px;
}
.footer p.disclaimer > a {
	background: #0F9D58;
	color: #fff;
	border-right: 1px #fff solid;
	border-left: 1px #fff solid;
	padding: 0 20px;
}
.footer p.disclaimer > a:hover {
	background: #0F9D58;
	color: #095932;
	border-radius: 50px;
	border-bottom: 1px transparent solid;
}
.footer p.disclaimer {
	color: #212529;
	line-height: normal;
}
.footer p.disclaimer a:first-child,.footer p.disclaimer a:last-child {
	border: none;
	padding: 0px;
}
.footer > .container {
	width: 100%;
}
.homeboxtitle {
	min-height: 75px;
	font-size: calc(12px + 3 * ((60vw - 100px) / 400));
	color: #ffffff;
	font-weight: 700;
}
.homeboxslogan {
	font-size: 1em;
	color: #ffffff;
}
p.card-body {
	padding: 0.25em;
}
.error {
	color: #f93939;
	font-weight: 400;
}
.maxwidth1800 {
	max-width: 1800px;
}
.maxwidth1200 {
	max-width: 1800px;
}
/* NEEDED FOR NEW NAV */
.nomobile {
	display: none;
}
.threebtn li {
	width: auto;
}
.fourbtn li {
	width: auto;
}
.fivebtn li {
	width: auto;
}
/* END NEEDED FOR NEW NAV */
.anchor {
	padding-top: 90px;
}
h1, h2, h3, h4, h5, h6 {
	color: #095932;
}
h3 {
	font-size: 1.5rem;
}
h4 {
	font-size: 1.3rem;
}
label {
	color: #0F9D58;
	font-weight: 700;
}
.ribbon {
	padding: 3px;
	display: block;
	max-height: 4px !important;
	line-height: 0.2;
	border-right: 3px #f8f9fa solid;
	border-left: 2px #f8f9fa solid;
}
div.ribbon:first-child {
	border-left:none;
}
.ribbon:last-child {
	border-right:none;
}
.modal-full {
	min-width: 80%;
	margin: auto;
}
.jumbotron.vertical-center {
	margin-bottom: 0;
	/* Remove the default bottom margin of .jumbotron */
}
.vertical-center {
	min-height: 100%;
	/* Fallback for vh unit */
	min-height: 100vh;
	/* You might also want to use'height' property instead.Note that for percentage values of'height' or 'min-height' properties,the 'height' of the parent elementshould be specified explicitly.In this case the parent of '.vertical-center'is the <body> element */
	/* Make it a flex container */
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	/* Align the bootstrap's container vertically */
	-webkit-box-align : center;
	-webkit-align-items : center;
	-moz-box-align : center;
	-ms-flex-align : center;
	align-items : center;
	/* In legacy web browsers such as Firefox 9we need to specify the width of the flex container */
	width: 100%;
	/* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsershence the bootstrap's container won't be aligned to the center anymore.Therefore, we should use the following declarations to get it centered again */
	-webkit-box-pack : center;
	-moz-box-pack : center;
	-ms-flex-pack : center;
	-webkit-justify-content : center;
	justify-content : center;
}
.homeslogan {
	color:#ffffff;
	text-decoration:none;
	transition: all 0.3s ease-in-out;
}
.homeslogan:hover {
	color: #0F9D58;
	text-decoration: none;
	border-bottom:none;
	transition: all 0.3s ease-in-out;
}
.homeslogan p, .homeslogan a {
	background-color: rgba(85 129 59 / 0.35);
	margin: 0;
	color: #fff;
	border: 1px #fff solid;
	transition: all 0.3s ease-in-out;
}
.homeslogan p:hover, .homeslogan a:hover {
	background-color: rgba(0 89 179 / 0.5);
	margin: 0;
	color: #fff;
	border: 1px #fff solid;
	transition: all 0.3s ease-in-out;
}
.homeplaybutton {
	font-size:6em;
	z-index:9999;
	padding:10px;
}
.homesloganline1{
	font-size:2em;
	line-height:1;
}
.homesloganline2{
	font-size:2em;
	line-height:1;
}
.homesloganline3{
	font-size:1.5em;
	line-height:1.5;
}
/*.carousel,.item,.active{
	height:100%;
}
*/
/*.carousel-inner{
	height:100%;
}
*/
.carousel-inner{
	/*max-height:75vh;
	*/
}
.carousel-playbutton {
	position: absolute;
	display: block;
	margin: auto;
	z-index: 15;
}
.carousel-playbutton {
	width: 70%;
	display: inline-block !important;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	z-index: 15;
	-ms-flex-pack: center;
	justify-content: center;
	padding-left: 0;
	list-style: none;
	color: #FFF;
}
.carousel-playbutton i:hover {
	color:#0F9D58;
}
/** MAY NOT BE NEEDED **/
.carousel-inner > .item > img {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 100%;
	height: 500px;
}
.carousel-inner > .carousel-item > img {
	opacity: 0.5;
}
/** PROJECT PAGE CAROUSEL **/
#ProjectPageCcarousel .carousel-indicators{
	position: relative;
	top:5px;
	left:0px;
	height:105px;
	width: 100%;
	margin-left: 0;
	justify-content: left;
}
#ProjectPageCcarousel .carousel-inner > .carousel-item > img {
	opacity: 1.0;
}
#ProjectPageCcarousel .carousel-indicators li{
	text-indent:0;
	display:inherit;
	float:left;
	width: 100px;
	height: 100px;
	margin:5px 0px;
}
#ProjectPageCcarousel .carousel-indicators li img{
	width: 95%;
	/* height: 120px;
	*/
	border:2px solid #CCCCCC;
	padding: 2px;
}
#ProjectPageCcarousel .carousel-indicators .active img{
	border:2px solid #4871b7;
}
#ProjectPageCcarousel .carousel-indicators .active{
	margin:5px 0px;
	width: 10%;
	height: 100px;
}
#ProjectPageCcarousel .carousel-indicators .active {
	opacity: 0.5;
}
#ProjectPageCcarousel .carousel-control.right,#ProjectPageCcarousel .carousel-control.left{
	background-image: none;
}
.top-left {
	position: absolute;
	top: 8px;
	left: 16px;
}
.homebox:hover {
	opacity: 0.5;
}
.carousel-caption {
	background: rgb(9 89 50 / 85%);
}
#ccrscarousel-info {background: #FFF; padding-bottom: 4rem;}

#ccrscarousel {max-height: 800px; transition: all 0.15s ease-in-out;}

.carousel-indicators.ccrscarousel {bottom: 0;}

.carousel-caption {top: 0; bottom: auto; transition: all 0.15s ease-in-out;}

.ccrscarousel .slidescss {
	background-size: cover !important;
	width: 100%;
	height: 100vh;
/*	height: 70vh;*/
	background-repeat: no-repeat !important;
	background-attachment: fixed !important;
	background-position: bottom !important;
	transition: all 0.15s ease-in-out;
}

.ccrscarousel .carousel-item {
	-webkit-background-attachment: fixed !important;
	-moz-background-attachment: fixed !important;
	background-attachment: fixed !important;
/*	background-position: center top !important;*/
	transition: all 0.15s ease-in-out;
}

.carousel-fade .active.carousel-item-left, 
.carousel-fade .active.carousel-item-prev, 
.carousel-fade .carousel-item-next, 
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active {
	-webkit-transform: none;
	transform: none;
}

a .carousel-caption:hover {
	border: 1px #212529 solid !important;
	color: #111 !important;
	--bs-bg-opacity: 0.9;
	background-color: rgba(var(--bs-light-rgb),var(--bs-bg-opacity))!important;
}

.carousel-indicators {
	height: fit-content;
	margin-top: 2em;
	top: 0;
	transition: all 0.15s linear;
}

.carousel-indicators [data-bs-target] {
	width: auto;
	height: auto;
	border: 2px #FFF solid;
	background-color: #C6FFDD;
	padding: 5px;
	transition: all 0.15s linear;
}
.carousel-indicators [data-bs-target]:hover {
	border: 2px #C6FFDD solid;
	background-color: #00B74A;
	box-shadow: 0 0px 5px 2px rgb(250 250 250 / 100%) !important;
	transition: all 0.15s linear;
}

.carousel-indicators [data-bs-target].active {
	border: 2px #C6FFDD solid;
	background-color: #00B74A;
	box-shadow: 0 0px 5px 1px rgb(250 250 250 / 100%) !important;
	pointer-events: none;
	transition: all 0.15s linear;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
	position: absolute;
	padding: 2em;
	background-color: rgb(0 0 0 / 25%);
	box-shadow: 0px 0px 10px 5px rgb(0 0 0 / 50%);
	filter: invert(0%);
	transition: all 0.15s ease-in-out !important;
}
.carousel-control-next-icon:hover,
.carousel-control-prev-icon:hover {
	background-color: rgb(0 0 0 / 95%);
	box-shadow: 0px 0px 15px 5px rgb(255 255 255 / 50%);
	filter: invert(100%);
	transition: all 0.2s ease-in-out !important;
}

.carousel-control-next-icon:active,
.carousel-control-prev-icon:active {
	transform: scale(0.8);
	transition: all 0.2s ease-in-out !important;
}

#ccrscarousel .carousel-control-prev {left: 1em;}

#ccrscarousel .carousel-control-next {right: 1em;}

@media screen and (max-width: 992px) {
	#ccrscarousel, #ccrscarousel .carousel-item, .slidescss {/*max-height: 500px;*/}
	#ccrscarousel .carousel-inner {padding-bottom: 15em;}
	.carousel-caption { top: 6em !important; }
	.carousel-control-prev, .carousel-control-next {height: 50%;}
}

@media screen and (max-width: 700px) {
	/*#ccrscarousel .carousel-caption {margin-left: 25px;}*/
}

@media screen and (min-height: 992px) {
	#ccrscarousel .carousel-inner {max-height: 800px;}
	#ccrscarousel .carousel-caption {top: 30% !important;}
}

@media screen and (max-height: 992px) {
	#ccrscarousel .carousel-inner {max-height: 500px;}
	#ccrscarousel .carousel-caption {top: 26% !important;}
}

@media (min-height: 993px) and (max-height: 1250px) {
	#ccrscarousel .carousel-inner {max-height: 800px;}
	#ccrscarousel .carousel-caption {top: 25% !important;}
}

@media (min-height: 1251px) and (max-height: 1400px) {
	#ccrscarousel .carousel-inner {max-height: 800px;}
	#ccrscarousel .carousel-caption {top: 22% !important;}
}

@media (min-height: 1401px) and (max-height: 1600px) {
	#ccrscarousel .carousel-inner {max-height: 800px;}
	#ccrscarousel .carousel-caption {top: 19% !important;}
}

@media (min-height: 1601px) and (max-height: 1800px) {
	#ccrscarousel .carousel-inner {max-height: 800px;}
	#ccrscarousel .carousel-caption {top: 17% !important;}
}
@media screen and (min-width:980px) and (max-width:1300px){
	.homeplaybutton {
	font-size:6em;
	z-index:9999;
	padding:10px;
	}
	.homesloganline1{
	font-size:1.8em;
	}
	.homesloganline2{
	font-size:1.8em;
	}
	.homesloganline3{
	font-size:1em;
	}
	.homeboxtitle {
	font-size:calc(10px + 5 * ((50vw - 300px) / 600));
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.8em;
	color:#ffffff;
	}
	.carousel-playbutton {
	/* top: 25%;
	*/
	}
	.carousel-playbutton {
	/* top: 35%;
	*/
	}
}
@media screen and (max-width: 1200px){
	.navbar-brand img{
	max-height:42px;
	}
	.homeboxtitle {
/*	font-size:calc(12px + 10 * ((70vw - 400px) / 500));*/
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.8em;
	color:#ffffff;
	}
}
.dropdown-item {border-bottom: 1px transparent solid;}
@media screen and (max-width: 992px){
	.dropdown-menu li {width: 100% !important;}
	.navbar-nav .dropdown-menu {
	border-width: 0 0 0 0;
	transition: all 0.3s ease-in-out;
	}
	.navbar-nav > li.nav-item {
	margin: 3px 0;
	text-align: center;
	border-width: 1px !important;
	border-color: rgba(0,0,0,0.25);
	border-style: solid;
	border-bottom: 1px solid rgba(0,0,0,0.25) !important;
	background: rgb(248,249,250);
	background: -moz-linear-gradient(180deg, rgba(248,249,250,1) 0%, rgba(255,255,255,1) 50%, rgba(248,249,250,1) 100%);
	background: -webkit-linear-gradient(180deg, rgba(248,249,250,1) 0%, rgba(255,255,255,1) 50%, rgba(248,249,250,1) 100%);
	background: linear-gradient(180deg, rgba(248,249,250,1) 0%, rgba(255,255,255,1) 50%, rgba(248,249,250,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f8f9fa",endColorstr="#f8f9fa",GradientType=1);
	transition: all 0.3s ease-in-out;
	}
	.nav-link.show {
	background:#4871b7;
	/*border-top: 1px #0f9d52 solid !important;
	*/
	/*border-right: 1px #0f9d52 solid !important;
	*/
	/*border-bottom: 1px #0f9d52 solid !important;
	*/
	/*border-left: 1px #0f9d52 solid !important;
	*/
	color: #fff !important;
	font-weight: 700;
	transition: all 0.3s ease-in-out;
	}
	.nav-item > .dropdown-menu.show {
	width: 100%;
	text-align: center;
	border-top: none;
	border-right: 1px #4871b7 solid;
	border-bottom: 1px #4871b7 solid;
	border-left: 1px #4871b7 solid;
	transition: all 0.3s ease-in-out;
	}
	.nav-link.show, .nav-link a {
	width: 100%;
	transition: all 0.3s ease-in-out;
	}
	a.dropdown-item {border: none;}
	a.dropdown-item:hover {
	background: rgb(221,221,221);
	background: -moz-linear-gradient(180deg, rgba(221,221,221,0.5) 0%, rgba(248,249,250,1) 50%, rgba(221,221,221,0.5) 100%);
	background: -webkit-linear-gradient(180deg, rgba(221,221,221,0.5) 0%, rgba(248,249,250,1) 50%, rgba(221,221,221,0.5) 100%);
	background: linear-gradient(180deg, rgba(221,221,221,0.5) 0%, rgba(248,249,250,1) 50%, rgba(221,221,221,0.5) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#dddddd",endColorstr="#dddddd",GradientType=1);
	color: #16181b;
	border-bottom: none;
	transition: all 0.3s ease-in-out;
	}
	.dropdown-menu.show ul {
	border-top: none;
	border-right: none;
	border-left: none;
	transition: all 0.3s ease-in-out;
	}
	.dropdown-menu.show li {
	border-bottom: 1px #ddd dashed;
	transition: all 0.3s ease-in-out;
	}
}
@media screen and (min-width: 992px){
	/* TEST NAV */
	.nomobile {
	display:block;
	}
	.navbar-expand-lg .navbar-nav .dropdown-menu {
	/*
	position: fixed;
	left: 0;
	top: 70px;
	width: 100%;
	*/
	text-align: center;
	}
	.dropdown-item {
	white-space: normal;
	}
	.dropdown-menu {
	border: 0;
	border-radius: 0;
	}
	/*.dropdown-item {
	display: inline-block;
	width: 20%;
	padding: 0;
	margin:0 auto;
	clear: none;
	font-weight: 400;
	color: #000000;
	text-align: center;
	white-space: nowrap;
	background-color: transparent;
	border: 0;
	float: left;
	}
	*/
	/* Three image containers (use 25% for four, and 50% for two, etc) */
	.dropdown-menu li {
	float: left;
	padding: 5px;
	}
	.fivebtn li {
	width: 20%;
	}
	.foutbtn li {
	width: 25%;
	}
	.threebtn li {
	width: 33.3%;
	}
	/* Clear floats after image containers */
	.dropdown-menu::after {
	content: "";
	clear: both;
	display: table;
	}
	.dropdown-menu li a {
	position: relative;
	width: 100%;
	padding: 15px;
	overflow: hidden;
	float: left;
	/*
	min-height: 200px;
	max-height: 250px;
	*/
	}
	.dropdown-menu li a .bg-img {
	left: -2px;
	right: -2px;
	background-size: cover;
	background-position: center;
	position: absolute;
	top: 0px;
	width: 100%;
	height: 100%;
	}
	.menuoverlay {
	background: #333333;
	opacity: .3;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	}
	.dropdown-menu li a .menuoverlay {
	left: -2px;
	right: -2px;
	width: auto;
	}
	.dropdown-menu li a:hover .menuoverlay {
	opacity: .8;
	}
	.dropdown-menu li a .menutext {
	position: relative;
	/*padding: 25% 0 0 0;
	*/
	margin: 0px;
	letter-spacing: 1px;
	font-size: 20px;
	line-height: 1.15;
	text-align: center;
	color: #fff;
	font-weight: 700;
	margin-top:60px;
	}
	/* END OF TEST NAV */
	.navbar-expand-lg .navbar-nav .nav-link{
	padding-left:.75rem;
	padding-right:.75rem;
	}
	.navbar-nav > li.nav-item:not(:last-child) > a{
	border-right: 1px solid #0F9D58;
	}
	#ProjectPageCcarousel .carousel-indicators {
	position: relative;
	top: 5px;
	left: 0px;
	height: 75px;
	width: 100%;
	margin-left: 0;
	justify-content: left;
	}
	#ProjectPageCcarousel .carousel-indicators li img{
	width: 98%;
	/* height: 75px;
	*/
	border:2px solid #CCCCCC;
	padding: 2px;
	}
	#ProjectPageCcarousel .carousel-indicators{
	top:10px;
	left:0px;
	}
	#ProjectPageCcarousel .carousel-indicators li{
	width:60px;
	height:60px;
	}
	#ProjectPageCcarousel .carousel-indicators .active{
	width: 60px;
	height:60px;
	}
	.dropdown-menu li {width: 33% !important;}
}
@media screen and (min-width:768px) and (max-width:980px){
	#ProjectPageCcarousel .carousel-indicators {
	position: relative;
	top: 5px;
	left: 0px;
	height: 80px;
	width: 100%;
	margin-left: 0;
	justify-content: left;
	}
	#ProjectPageCcarousel .carousel-indicators li img{
	width: 98%;
	/* height: 60px;
	*/
	border:2px solid #CCCCCC;
	padding: 2px;
	}
	#ProjectPageCcarousel .carousel-indicators{
	top:10px;
	left:0px;
	}
	#ProjectPageCcarousel .carousel-indicators li{
	width:60px;
	height:60px;
	}
	#ProjectPageCcarousel .carousel-indicators .active{
	width:10%;
	height:60px;
	}
	.homeplaybutton {
	font-size:3em;
	z-index:9999;
	padding:10px;
	}
	.homesloganline1{
	font-size:1.5em;
	}
	.homesloganline2{
	font-size:1.5em;
	}
	.homesloganline3{
	font-size:1em;
	}
	.carousel-playbutton {
	/* top: 25%;
	*/
	}
	.homeboxtitle {
	font-size:1.0em;
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.9em;
	color:#ffffff;
	}
}
@media screen and (max-width:800px) {
	h1 {
	font-size: 1.8rem;
	}
	.homeboxtitle {
	font-size:1em;
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.8em;
	color:#ffffff;
	}
}
@media screen and (max-width:767px){
	.homeplaybutton {
	font-size:3em;
	z-index:9999;
	padding:10px;
	}
	.homesloganline1{
	font-size:1.5em;
	}
	.homesloganline2{
	font-size:1.5em;
	}
	.homesloganline3{
	font-size:0.9em;
	}
	.carousel-playbutton {
	/* top: 20%;
	*/
	}
	.homeboxtitle {
	font-size:0.8em;
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.7em;
	color:#ffffff;
	}
	#ProjectPageCcarousel .carousel-indicators {
	position: relative;
	top: 5px;
	left: 0px;
	height: 70px;
	width: 100%;
	margin-left: 0;
	justify-content: left;
	}
	#ProjectPageCcarousel .carousel-indicators li img{
	width: 98%;
	/* height: 60px;
	*/
	border:2px solid #CCCCCC;
	padding: 2px;
	}
	#ProjectPageCcarousel .carousel-indicators{
	top:10px;
	left:0px;
	}
	#ProjectPageCcarousel .carousel-indicators li{
	width:60px;
	height:60px;
	}
	#ProjectPageCcarousel .carousel-indicators .active{
	width:10%;
	height:60px;
	}
}
@media screen and (max-width:650px) {
	.homeplaybutton {
	font-size:3em;
	z-index:9999;
	padding:10px;
	}
	.homesloganline1{
	font-size:1em;
	}
	.homesloganline2{
	font-size:1em;
	}
	.homesloganline3{
	font-size:0.7em;
	}
	.carousel-playbutton {
	/* top: 25%;
	*/
	}
	.homeboxtitle {
	font-size:0.7em;
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.6em;
	color:#ffffff;
	}
}
@media screen and (max-width:582px){
	.homeplaybutton {
	font-size:3em;
	z-index:9999;
	padding:10px;
	}
	.homesloganline1{
	font-size:0.8em;
	}
	.homesloganline2{
	font-size:0.8em;
	}
	.homesloganline3{
	font-size:0.6em;
	}
	.carousel-playbutton {
	/* top: 20%;
	*/
	}
	.homeboxtitle {
	font-size:0.9em;
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.8em;
	color:#ffffff;
	}
	#ProjectPageCcarousel .carousel-indicators {
	position: relative;
	top: 5px;
	left: 0px;
	height: 65px;
	width: 100%;
	margin-left: 0;
	justify-content: left;
	}
	#ProjectPageCcarousel .carousel-indicators li img{
	width: 98%;
	/* height: 50px;
	*/
	border:2px solid #CCCCCC;
	padding: 2px;
	}
	#ProjectPageCcarousel .carousel-indicators{
	top:10px;
	left:0px;
	}
	#ProjectPageCcarousel .carousel-indicators li{
	width:10%;
	height:50px;
	}
	#ProjectPageCcarousel .carousel-indicators .active{
	width:10%;
	height:50px;
	}
}
@media screen and (max-width:500px) {
	h1 {
	font-size: 1.5rem;
	}
	#ProjectPageCcarousel .carousel-indicators {
	position: relative;
	top: 5px;
	left: 0px;
	height: 50px;
	width: 100%;
	margin-left: 0;
	justify-content: left;
	}
	#ProjectPageCcarousel .carousel-indicators li img{
	width: 98%;
	/* height: 50px;
	*/
	border:2px solid #CCCCCC;
	padding: 2px;
	}
	#ProjectPageCcarousel .carousel-indicators{
	top:10px;
	left:0px;
	}
	#ProjectPageCcarousel .carousel-indicators li{
	width:50px;
	height:50px;
	}
	#ProjectPageCcarousel .carousel-indicators .active{
	width:50px;
	height:50px;
	}
}
@media screen and (min-width: 576px){
	.modal-dialog {
	max-width:800px;
	}
	.modal-content iframe{
	width:100%;
	}
	.modal-body{
	padding:0px;
	}
	.modal-body h1{
	font-size:1.75rem;
	padding:1rem;
	}
	.modal-body p, .modal-body ul{
	padding-left:1.75rem;
	padding-right:1.75rem;
	}
	.modal-body ul{
	margin-left:1.25rem;
	}
	button.close{
	position: absolute;
	top: 1rem;
	right: 1rem;
	}
	.project-img-container{
	display:flex;
	flex-flow:row wrap;
	margin-bottom:1rem;
	}
	.project-img-container > div{
	max-height:100px;
	min-height:60px;
	max-width:200px;
	min-width:80px;
	flex-grow:1;
	margin:1px;
	background-size:cover;
	}
	/* header stuff */
	nav.navbar a.nav-link{
	/*font-family:'wood';
	*/
	font-weight:700;
	}
	.navbar-brand img{
	max-height:75px;
	}
	nav.navbar i{
	line-height:1.5;
	color:rgba(0,0,0,.5);
	}
}
@media screen and (max-width:360px) {
	.navbar-brand span.title {font-size: initial;}
	h3 {
	font-size: 1.3rem;
	}
	.meeting h4 {
	font-size: 1.0rem;
	font-weight: 700;
	}
	.meeting p {
	font-size: 0.8rem;
	}
	.homeboxtitle {
	font-size:0.8em;
	color:#ffffff;
	}
	.homeboxslogan {
	font-size:0.5em;
	color:#ffffff;
	}
	.homeplaybutton {
	font-size:2em;
	z-index:9999;
	padding:10px;
	}
	.homesloganline1{
	font-size:0.7em;
	}
	.homesloganline2{
	font-size:0.7em;
	}
	.homesloganline3{
	font-size:0.6em;
	}
	#ProjectPageCcarousel .carousel-indicators {
	position: relative;
	top: 5px;
	left: 0px;
	height: 50px;
	width: 100%;
	margin-left: 0;
	justify-content: left;
	}
	#ProjectPageCcarousel .carousel-indicators li img{
	width: 98%;
	/* height: 30px;
	*/
	border:2px solid #CCCCCC;
	padding: 2px;
	}
	#ProjectPageCcarousel .carousel-indicators{
	top:10px;
	left:0px;
	}
	#ProjectPageCcarousel .carousel-indicators li{
	width:30px;
	height:30px;
	}
	#ProjectPageCcarousel .carousel-indicators .active{
	width:30px;
	height:30px;
	}
}
/* -------------------------thumbs-------------------------*/
.brdrgreen {
	border: 3px #0F9D58 solid !important;
}
.bggreen {
	color: #fff;
	border: 1px #0F9D58 solid;
	background: #0F9D58;
}
.brdrblue {
	border: 3px #4871b7 solid !important;
}
.bgblue {
	color: #fff;
	border: 1px #4871b7 solid;
	background: #4871b7;
}
.topboxshadow {
	box-shadow: 0px -15px 10px -10px rgb(100 100 100 / 40%)!important;
}
.bottomboxshadow {
	box-shadow: 0 0.5rem 0.95rem rgba(0,0,0,.5)!important;
}
.dropboxshadow {
	box-shadow: 0 -5px 15px 10px rgba(0,0,0,0.5)!important;
}
.gridthumbs a, .gridthumbs img {
	transform: scale(1);
	transition: all 0.3s ease-in-out;
	transition: all 0.3s linear;
}
.gridthumbs a:hover, .gridthumbs a img:hover {
	box-shadow: none !important;
	border: none !important;
	text-decoration: none;
	transform: scale(1);
	transition: all 0.3s ease-in-out;
	transition: all 0.3s linear;
}
.gridthumbs a img:hover {
	transform: scale(1) !important;
}
.gridthumbs {
	margin: 0px auto;
	padding: 2px;
	display: block;
	border: 1px #4871b7 solid;
	background-color: #f8f9fa!important;
	transition: all 0.3s ease-in-out;
	box-shadow: 0px 10px 10px -8px rgb(0 0 0 / 100%);
}
.gridthumbs:hover, .gridthumbs a:hover, .gridthumbs a img:hover {
	box-shadow: 0px 10px 10px -8px rgb(0 0 0);
	/*border: 1px transparent solid;
	*/
	transition: all 0.3s ease-in-out;
	transition: all 0.3s linear;
	transform: scale(1.06);
	opacity: 1;
}
/*.ribbon:after {
	content:'';
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	right:0;
	background-color: #0059b3;
	border-right:40px solid #0F9D58;
	-webkit-transform-origin:100% 100%;
	-ms-transform-origin:100% 100%;
	transform-origin:100% 100%;
	-webkit-transform:skewX(45deg);
	-ms-transform:skewX(45deg);
	transform:skewX(45deg);
}
*/
hr {
	border: 0; 
	height: 1px; 
	background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
}
/* -------------------------hide big imgs on small screens*/
@media only screen and (max-device-width: 576px) {
	/* @media (max-width: 600px) {
	*/
	.col-xs-none {
	display:none;
	}
	.d-xs-none.d-none {
	display:none;
	}
}

/* -------------------------------- 

BACK to TOP STYLES

-------------------------------- */
.box-shadow {box-shadow:  0px 0px 0px 3px #003973, 0 0.75rem 0.75rem rgb(0 0 0 / 50%)}
#btn-back-to-top {
	width: 50px;
	height: 50px;
	position: fixed;
	bottom: 120px;
	right: 1em;
	border-width: 2px;
	display: none;
	padding: 0;
	transition: all 0.3s ease-in-out;
	z-index: 9999;
}
#btn-back-to-top span { vertical-align: initial; line-height: normal;}
.show {display: inline-block !important; opacity: 1; transition: opacity 0.3s linear;}
.hide {opacity: 0; transition: opacity 0.3s linear;}


/* --------------------------------START CHART STYLES-------------------------------- */

canvas.chart {color: rgba(0,0,0,.9);}

/* --------------------------------END CHART STYLES-------------------------------- */

/* --------------------------------IMG GALLERY / IMGs-------------------------------- */
.imgdiv {position: relative; margin: 2rem 0;}

.img-gallery img {
	display: block;
	background-color: rgb(255 255 255 / 100);
	margin: 0 auto;
	opacity: 50%;
	box-shadow: 0px 0px 0px #FFF;
	border-radius: 25rem;
	transition: all 0.2s ease-in-out;
}
.img-gallery img:hover {
	opacity: 1;
	border-radius: 0rem;
	transition: all 0.15s ease-in-out;
}

.img-filter-button, .news-filter-button {
	font-size: 18px;
	border-radius: 5px;
	text-align: center;
	color: #0052A3;
}
.img-filter-button:hover, .news-filter-button:hover {
	font-size: 18px;
	border: 1px solid #00B74A !important;
	border-radius: 5px;
	text-align: center;
	color: #00B74A !important;
}

.btn-default.active, .img-filter-button.active, .news-filter-button.active {
	background-color: #DEE2E6;
	color: #333;
	pointer-events: none;
	border: 1px #999999 solid;
}
.btn-default:hover {
	background-color: transparent;
	color: #333 !important;
	border: 1px #999999 solid !important;
}

.gallery_product {margin-bottom: 30px;}
.gallery_list {margin-bottom: 5px;}

/* --------------------------------END IMG GALLERY / IMGs-------------------------------- */

/* --------------------------------YOUTBUE VIDEOS-------------------------------- */
video {max-width: 100%; height: auto;}
.video-container {overflow: hidden; position: relative;}
.video-container::after {padding-top: 56.25%; display: block; content: '';}
.video-container iframe {width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.youtube-player {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
	background: #fff;
	margin: 5px;
	border: 1px #ccc solid;
}

.youtube-player iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 100;
	background: transparent;
}

.youtube-player img {
	object-fit: cover;
	display: block;
	left: 0;
	bottom: 0;
	margin: auto;
	max-width: 1500px;
	width: 100%;
	position: absolute;
	right: 0;
	top: 0;
	border: none;
	height: auto;
	cursor: pointer;
	-webkit-transition: 0.4s all;
	-moz-transition: 0.4s all;
	transition: 0.4s all;
}

.youtube-player img:hover {-webkit-filter: brightness(75%);}

.youtube-player .play {
	height: 72px;
	width: 72px;
	left: 50%;
	top: 50%;
	margin-left: -36px;
	margin-top: -36px;
	position: absolute;
	background: url('https://charlestoncounty.org/ccrs/images/play-button.png') no-repeat;
	cursor: pointer;
}
	
@media screen and (min-width: 990px) {
	.video-container {max-width:1000px;}
}
/* --------------------------------END YOUTUBE VIDEOS-------------------------------- */

.bg-grn {background-color: rgb(15 157 88);}
.bg-dgrn {background-color: rgb(9 89 50);}
.brdr-grn {border-color: #0F9D58 !important;}
.brdr-dgrn {border-color: #095932 !important;}