/* CSS Document */

html, body{
font-family: Calibri, Calibri Light;
margin: 0;
padding: 0;
top: 0;
left: 0;
}

.menu a:link {
font-family: Calibri, Calibri Light;
	color: #FFCC66;
	text-decoration: none;
}
.menu a:visited {
font-family: Calibri, Calibri Light;
	color: #CC6600; 
	text-decoration: none;
}
.menu a:hover, a:active{
font-family: Calibri, Calibri Light;
	color: #CC6600;
	text-decoration: none;
}
h1 {
font-family: Calibri, Calibri Light;
font-size: 1.6em;
color: #333333;
Style: bold;
border-bottom: 2px dashed gray;
}
h2 {
font-family: Calibri, Calibri Light;
font-size: 1em;
color: #333333;
}
h2.getInvolved {
font-family: Calibri, Calibri Light;
font-size: 1em;
color: #003300;
}
img.logo{
float: right;
margin-left: 6px;
margin-bottom: 5px;
margin-right: 4px;
margin-top: 4px;
}
div.topmenu {
background-color: #003300;
position: relative;
left: 0;
right: 0;
height: 12px;
font-family: Calibri, Calibri Light;
font-weight: bold;
}
.topmenu {
font-family: Calibri, Calibri Light;
	color: #FFCC66;
	font-size: 10px;
}

img.leadership {
padding: 1px 1px 1px 1px;
margin: 0px 6px 20px 6px;
border: 1px double gray;
width: 959 px;
height: 310 px;
font-family: Calibri, Calibri Light;
}

#shadow_l
{
	width: 10px;
	background: url(images_2/shadow_l.png) repeat-y top right;
	text-align: right;
	vertical-align: bottom;
}

#shadow_r
{
	width: 10px;
	background: url(images_2/shadow_r.png) repeat-y top left;
	text-align: left;
	vertical-align: bottom;
}

P.bio {
	font-family: Calibri, Calibri Light;
	font-size:14px;
 	font-weight: normal;
 	    margin-right: 50px;
}
br.bio2 {
	font-family: Calibri, Calibri Light;
	font-size:12px;
 	font-weight: normal;
}

.row {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
    padding: 0 4px;
	
}

/* Create four equal columns that sits next to each other */
.column {
    -ms-flex: 100%; /* IE10 */
    flex: 100%;
    max-width: 100%;
    padding: 0 4px;

}

.column img {
    margin-top: 8px;
    vertical-align: middle;
	
}



/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 10000px) {
    .column {
        -ms-flex: 100%;
        flex: 100%;
        max-width: 100%;
    }

}

/* set the opacity of the elements to 0 */
.fadeIn {
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

/* when the element is in view, set opacity to 1 */
.fadeIn.is-visible {
  opacity: 1;
}