html{
  height: 100%;
  scroll-behavior: smooth;
}

body {
height: 100%;
color: #333;
font-family: Arial, Helvetica, sans-serif;
background-color:#fff;
line-height:28px;
font-size:19px;
font-weight:400;
}

.container-fluid{
width:100% !important;
margin:0 auto !important;;
padding:0 !important;
position:relative;
border:0px solid green;
}

#wrapper { 
margin: 0 auto;
max-width: 2200px !important;
padding:0;
position:relative;
border:0px solid red;
} 

.padding-row {
    padding-top: 30px;
    padding-bottom: 30px;
}

.flex-container{
width:100%;
margin:20px auto;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content:flex-start;
justify-content:center;
padding:20px 0;
clear:both;
}

.flex-container .item{
text-align:center;
max-width: 350px;
width:30%;
margin: 15px;
padding:20px;
}

#top{
width:100%;
margin:0px auto;
background-color:#f9f9f9;
background-color:#00b2e0;
background-color:#00a952;
text-align:right;
padding:0px;
font-size:85%;
color:white;
border-bottom:4px solid white;
}

#top ul.list-inline{
text-align:right;
padding:9px 5px 0 0;
margin:0;
}

#top ul.list-inline li{
margin-right:10px;
}

#top i.fa-facebook{
font-size:24px;
}

#top a{
font-size:17px;
line-height:20px;
text-decoration: none;
}

#top a.active,
#top a:link,
#top a:visited {
color: #fff;
}

#top a:hover {
color: #18519e;
font-weight:normal;
}


#header{
background-color:#fff;
width:100% !important;
max-width:100% !important;
padding:0;
/**
position: sticky;
top: 0;
left:0;
z-index:1000;
**/
position:relative;
border:0px solid blue;
}

/** 12376c **/

.blue{
color:#00b2e0;
}

.dark-blue{
color:#18519e;
}

.dark-green{
color:#00a952;
}

#header a{
font-size:17px;
line-height:20px;
text-transform: uppercase;
text-decoration: none;
}

#header a:link,
#header a:visited {
color: #11b1ea;
}

#header a.active,
#header a:hover {
color: #18519e;
font-weight:bold;
}

#header #logo{
margin:0 0 0 30px;
max-height:120px;
}

#header nav.bg-light {
position:absolute;
top:29px;
right:0px;
background-color: #fff !important;
/*
margin:27px 0 0 40px !important;
*/
padding:0;
border:0px solid red !important;
}

#header nav.bg-light li.nav-item{
text-align:center;
text-align:left;
margin-right:17px;
}

#header ul#top-boxes{
list-style-type: none;
margin:0;
padding:0;
color:white;
}

#header #top-boxes a:link,
#header #top-boxes a:visited {
color: #fff;
font-family: 'Arial Black', Gadget, sans-serif;
font-weight: 900; /* Arial Black typically has a weight of 900 */
text-transform: capitalize;
text-decoration:none;
font-size:17px;
}

#header #top-boxes a:hover {
color: #fff;
font-family: 'Arial Black', Gadget, sans-serif;
font-weight: 900; /* Arial Black typically has a weight of 900 */
text-decoration: underline;
font-size:18px;
}

#header ul#top-boxes li{
position: relative;
font-weight:bold;
}

#header ul#top-boxes li#donate{
background-color:#00a952;
height:70px;
margin-bottom:5px;
padding:0; 
}

#header ul#top-boxes li#donate a{
position: absolute;
  top: 71%;
  left: 10%;
  transform: translate(-10%, -71%);
}

#header ul#top-boxes li#newsletter{
background-color:#18519e;
height:65px;
padding:0;
}

#header ul#top-boxes li#newsletter a{
position: absolute;
  top: 25%;
  left: 25%;
  transform: translate(-25%, -25%);
}

#header ul#top-boxes li a{
position: relative;
}

#header #blue-bar{
margin:0 auto;
background-color:#18519e;
height:10px;
}

#header #green-bar{
margin:0 auto;
height:10px;
background-color:#00a952;
}


#content{
clear:both;
width:100%;
max-width:1200px;
min-height:600px;
margin:0 auto;
padding:20px;
border:0px solid red;
}

body#home #content{
max-width:100%;
padding:0;
min-height:1px;
}

#content p{
text-align: justify;
}

#content h1{
text-align: justify;
margin:20px 0;
font-family: 'Arial Black', Gadget, sans-serif;
font-weight: 900; /* Arial Black typically has a weight of 900 */
font-size:26px;
color:#18519e;
 text-transform: uppercase;
line-height:32px;
}

#home-carousel{
position:relative;
width:100%;
border-top:5px solid #fff;
}

#home-carousel .carousel-control-next-icon ,
#home-carousel .carousel-control-prev-icon {
    width: 50px;
    height: 50px;
}
#home-carousel .carousel-item img {
overflow:hidden;
position: relative;
top: 0px;
width: 100%;
object-fit: cover;
height:800px;
}

#home-carousel .carousel-caption{
position:absolute;
top:0;
left:0;
width:100%;
border:0px solid red;
background-color:transparent;
text-align:left;
color:white;
background-size: cover;
padding:0;
line-height:21px;
font-size:19px;
}

#home-carousel .carousel-caption #carousel-bg-1{
border:0px solid red;
background-color:transparent;
text-align:left;
color:white;
background-size: cover;
padding:0;
line-height:21px;
font-size:19px;
position: absolute;
width:480px;
max-height:380px;
right: 10%;
top: 5%;
transform: translate(-10%, -5%);
/*
left: 16%;
top: 35%;
transform: translate(-16%, -35%);
*/
background-color:#302d2f;
opacity: .7;
padding:20px;
filter: brightness(80%);
}

#home-carousel .carousel-caption #carousel-bg-2{
border:0px solid red;
background-color:transparent;
text-align:left;
color:white;
background-size: cover;
padding:0;
line-height:21px;
font-size:19px;
position: absolute;
width:480px;
max-height:380px;
width:480px;
max-height:350px;
right: 10%;
top: 5%;
transform: translate(-10%, -5%);
/*
  left: 16%;
  top: 35%;
  transform: translate(-16%, -35%);
*/
background-color:#18519e;
 opacity: .6;
padding:20px;
}

#home-carousel .carousel-caption #carousel-bg-3{
border:0px solid red;
background-color:transparent;
text-align:left;
color:white;
background-size: cover;
padding:0;
line-height:21px;
font-size:19px;
position: absolute;
width:480px;
max-height:380px;  
right: 10%;
top: 5%; 
transform: translate(-10%, -5%);
/*
 left:20%;
top: 90%;
  transform: translate(-20%, -90%);
*/
background-color:#46617e;
background-color:#18519e;
 opacity: .7;
padding:20px;
}

#home-carousel .carousel-caption #carousel-bg-4{
border:0px solid red;
background-color:transparent;
text-align:left;
color:white;
background-size: cover;
padding:0;
line-height:21px;
font-size:19px;
position: absolute;
width:480px;
max-height:350px;  
right: 10%;
top: 5%; 
transform: translate(-10%, -5%);
/*
  right: 10%;
top: 95%;
  transform: translate(-10%, -95%);
*/
background-color:#4a6828;
 opacity: .7;
padding:20px;
}

#home-carousel .carousel-caption h3{
font-size:42px;
line-height:42px;
display:block;
margin:10px 0;
color:white !important;
font-weight: 900; /* Arial Black typically has a weight of 900 */
}

#home-carousel .carousel-caption hr{
border:2px solid #0c5a9e;
}

#home-carousel .carousel-caption p{
margin-bottom:12px;
}

#home-carousel .carousel-caption a{
color: white;
}

.carousel-caption a:hover {
text-decoration: none;
}

.carousel-caption #learn-more{
margin:10px auto;
border:0px solid red;
}

.carousel-caption i {
    vertical-align: middle;
    padding-bottom: 3px;
}

.carousel-caption #learn-more a:before {
  content: "\2192";
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  float: left;
        padding-right:10px
}

#content h2 {
text-align:justify;
margin:20px 0 10px 0;
font-weight: 700;
font-size:23px;
color:#666;
text-transform: lowercase;
text-transform: capitalize;
}

body#about-story #content #timeline{
margin:30px auto; 
max-width:80%;
border:0px solid red;
}

body#about-story #content #timeline .col-md-2{
padding:10px ;
text-align:center;
font-weight:bold;
background-color:#e5e5e5;
}

body#about-story #content #timeline .col-md-10{
padding:10px 20px;
background-color:#f9f9f9;
}

body#about-story #content #timeline .fa-arrow-down-long{
font-size:38px;
display:block;
margin:25px 0;
}

body#about-progress h2{
margin:20px auto;
text-align:center;
}

body#about-progress figcaption{
font-size:90%;
text-align:center;
}
body#about-solution #solutions-video{
float:right;
max-width:700px;
margin:20px 0 20px 20px;
}

body#about #content #problem-img-1{
max-width:700px;
float:right;
padding:20px 0 20px 20px;
}

body#mailinglist #content #subscribe-instructions{
text-align:center;
}


body#allforms-1 form#myAllForm{
margin:20px 0;
}

body#team #content h2 {
text-align:center !important;
margin-bottom:0;
font-size:30px !important;
border-bottom:1px solid #666;
padding-bottom:10px;
}

body#team #team-flex{
width:100%;
margin:20px auto;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content:flex-start;
justify-content:center;
padding:20px 0;
clear:both;
}

body#team #team-flex .item{
text-align:center;
border:1px solid #ccc;
background-color: #f9f9f9;
background-color: #f0e9de;
max-width: 400px;
width:30%;
margin: 15px;
padding: 20px;
padding:20px;
}

body#team #team-flex .item .name{
display:block;
margin-bottom:0;
font-size:24px;
font-weight:bold;
text-align:center;
}

body#team #team-flex .item img{
margin:20px auto;
display:block;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
border-radius:5px;
max-width:80%;
}

body#team #team-flex .item .position{
display:block;
font-size:95%;
font-style:italic;
margin:10px auto;
}

body#team #team-flex .item .bio{
display:block;
text-align: center;
margin:10px 0;
}

body#team #team-flex .item .bio p{
text-align: center !important; 
}

#content div.next-page {
display:block;
font-size:150%;
margin:40px 0;
}

#content div.next-page a{
margin-right:25px;
}

#content div.next-page a::before {
  content: "\2192";
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  float: left;
 padding-right:10px
}


body#contact ul#contact-choices li{
margin:0 0 15px 0;
}

body#contact ul#contact-choices a:link{
font-size:130%;
}

body[id^=gallery] h2{
margin:30px auto;
text-align:center;
}

body#gallery-slides #gallery-flex-container .name{
font-size:90%;
font-weight:normal;
}

body[id^=gallery] #gallery-flex-container .item .display_date{
display:none !important;
}

body#gallery-slides .click-to-view{
display:none !important;
}


/** PAGE OF PARTNERS ***/

body#sponsors #all-partners{
margin:0 auto;
}

body#sponsors #all-partners h1{
margin-bottom:10px;
}

body#sponsors #all-partners h2{
border-bottom:3px solid #666;
font-size:28px;
}

body#sponsors #all-partners .flex-container {
margin:30px auto 40px auto;
}

body#sponsors #all-partners .flex-item {
text-align:center;
width:45%;
margin:10px
}

body#sponsors #all-partners .flex-item .name{
font-weight:bold;
margin:10px auto;
font-size:110%;
padding-right:10px;
}

body#sponsors #all-partners .flex-item .years{
font-weight:normal;
padding-right:3px;
font-size:90%;
color:#18519e;
}

body#sponsors #all-partners .flex-item .description{
display:block;
font-weight:normal;
margin:10px auto;
font-size:85% !important;
line-height:22px;
text-align: center;
}

body#sponsors #all-partners .flex-item .description p{
text-align: center;
}

body#sponsors #all-partners .flex-item img{
max-height:130px;
width:auto;
margin:10px auto;
object-fit: cover
display:block;
}


#footer{
width:100%;
min-height:200px;
background-color:white;
padding:30px 20px;
margin:30px auto;
text-align:center;
color:#00b2e0;
font-size:90%;
}

#footer #footer-nav{
margin:20px auto 0px auto ;
}

#footer #copyright{
margin:0 auto ;
}

#footer a:link,
#footer a:visited {
color:#00b2e0;
text-decoration:none;
 text-transform: uppercase;
}

#footer a:hover {
color: #18519e;
text-decoration: underline;
 text-transform: uppercase;
}

@media only screen and (max-width : 1200px) {

	#header #logo{
	margin:0 0 0 20px;
	}

	#header nav.bg-light li.nav-item{
	margin-right:12px;
	}
}
@media only screen and (max-width : 992px) {

	#header{
	position: relative;
	}
	#header #logo{
	margin:0;
	}

	#header nav.bg-light {
	position:relative;
	margin:30px auto !important;
	/*
	top: 90%;
        left: 50%;
        transform: translate(-50%, -90%);
	*/
	}

	#header .navbar-collapse {
        border:1px solid #f1f1f1;
        margin:20px; 
        padding:10px;
        clear:both;
        }
	
	#header .navbar-toggler{
	margin:30px auto !important;
	}
	#header nav .navbar-toggler-icon{
	width:2.5em;
	height:2.5em;
	}
	
	body#team #team-flex .item{
        max-width: 500px;
        width:45%;
        }
}




@media only screen and (max-width : 768px) {

	#top ul.list-inline{
	text-align:center;
	}	
	#header #logo{
	margin:0 auto;
	max-height:150px;
	}

	#header [class*="col-"]{
	padding:0 !important;
	}

	/**
	#header nav.bg-light {
	position:relative;
	margin:0 auto 30px auto !important;
	padding-top:0;
	}
	**/

	#header nav.bg-light {
        margin:0 auto 30px auto !important;
        }
	
	#header .navbar-toggler{
	margin:0 auto 20px auto !important;
	}
	
	#header .navbar-collapse {
	border:1px solid #f1f1f1;
	margin:20px;
	padding:10px; 
	clear:both;
	}	
	#header ul#top-boxes li#donate a{
	top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
	}

	#header ul#top-boxes li#newsletter a{
	top: 40%;
        left: 50%;
        transform: translate(-50%, -40%);
	}

	#home-carousel{
	height:600px !important;
	border:0px solid blue;
	}

	#home-carousel .carousel-item img {
	object-fit:none; 
	height:600px;
	}

	#home-carousel .carousel-caption #carousel-bg-1,
	#home-carousel .carousel-caption #carousel-bg-2,
	#home-carousel .carousel-caption #carousel-bg-3,
	#home-carousel .carousel-caption #carousel-bg-4,
	#home-carousel .carousel-caption{
	width:85%;
  	left: 50%;
	top: 40%;
  	transform: translate(-50%, -40%);
	margin-top:0px;
	max-height:580px;
	}

	#home-carousel .carousel-caption h3{
	font-size:32px;
	line-height:38px;
	}
	#body#home content {
	border:0px solid red;
	}

	#header #top-boxes{
        margin-top:35px;
        }

	body#about-story #content #timeline .fa-arrow-down-long{
	display:none;
	}

	body#team #team-flex .item{
        max-width: 500px;
        width:90%;
        }

	body#sponsors #all-partners .flex-item {
	width:100%;
	}

	.flex-container .item{
	width:100%;
	}

}



@media only screen and (max-width : 500px) {

        #header #logo{
        margin:0 auto;
        max-height:120px;
        }

	#content h1{
	text-align: left;
	line-height:32px;
	}

	#footer{
	padding:10px 20px;
	}

}