/* Site CSS */
 .row-auto {
	 display: flex;
	 flex-wrap: wrap;
}
 .row-auto > [class*=‘col-’] {
	 display: flex;
	 flex-direction: column;
}
/* Bootstrap Clearfix for auto wrapping rows */
/* Tablet */
 @media (min-width:767px) {
	/* Column clear fix */
	 .row-auto .col-lg-1:nth-child(12n+1), .row-auto .col-lg-2:nth-child(6n+1), .row-auto .col-lg-3:nth-child(4n+1), .row-auto .col-lg-4:nth-child(3n+1), .row-auto .col-lg-6:nth-child(2n+1), .row-auto .col-md-1:nth-child(12n+1), .row-auto .col-md-2:nth-child(6n+1), .row-auto .col-md-3:nth-child(4n+1), .row-auto .col-md-4:nth-child(3n+1), .row-auto .col-md-6:nth-child(2n+1) {
		 clear: none;
	}
	 .row-auto .col-sm-1:nth-child(12n+1), .row-auto .col-sm-2:nth-child(6n+1), .row-auto .col-sm-3:nth-child(4n+1), .row-auto .col-sm-4:nth-child(3n+1), .row-auto .col-sm-6:nth-child(2n+1) {
		 clear: left;
	}
}
/* Medium Desktop */
 @media (min-width:992px) {
	/* Column clear fix */
	 .row-auto .col-lg-1:nth-child(12n+1), .row-auto .col-lg-2:nth-child(6n+1), .row-auto .col-lg-3:nth-child(4n+1), .row-auto .col-lg-4:nth-child(3n+1), .row-auto .col-lg-6:nth-child(2n+1), .row-auto .col-sm-1:nth-child(12n+1), .row-auto .col-sm-2:nth-child(6n+1), .row-auto .col-sm-3:nth-child(4n+1), .row-auto .col-sm-4:nth-child(3n+1), .row-auto .col-sm-6:nth-child(2n+1) {
		 clear: none;
	}
	 .row-auto .col-md-1:nth-child(12n+1), .row-auto .col-md-2:nth-child(6n+1), .row-auto .col-md-3:nth-child(4n+1), .row-auto .col-md-4:nth-child(3n+1), .row-auto .col-md-6:nth-child(2n+1) {
		 clear: left;
	}
}
/* Large Desktop */
 @media (min-width:1200px) {
	/* Column clear fix */
	 .row-auto .col-md-1:nth-child(12n+1), .row-auto .col-md-2:nth-child(6n+1), .row-auto .col-md-3:nth-child(4n+1), .row-auto .col-md-4:nth-child(3n+1), .row-auto .col-md-6:nth-child(2n+1), .row-auto .col-sm-1:nth-child(12n+1), .row-auto .col-sm-2:nth-child(6n+1), .row-auto .col-sm-3:nth-child(4n+1), .row-auto .col-sm-4:nth-child(3n+1), .row-auto .col-sm-6:nth-child(2n+1) {
		 clear: none;
	}
	 .row-auto .col-lg-1:nth-child(12n+1), .row-auto .col-lg-2:nth-child(6n+1), .row-auto .col-lg-3:nth-child(4n+1), .row-auto .col-lg-4:nth-child(3n+1), .row-auto .col-lg-6:nth-child(2n+1) {
		 clear: left;
	}
}
.red {
  background-color: #c10037;
    font-family: "Campton Book", sans-serif;
    color: white;
    font-weight: 300;
    padding: 10px;
    text-align: left;
}

/* Site CSS */
#home #header {
    padding: 30px 0 0px 0px;
    position: absolute;
    width: 100%;
    background-color: rgba(255,255,255,.5);
    z-index: 50;
}


 
 .rcorner-yellow {
    border-radius: 25px;
    background: #f2ca67;
    padding: 20px;
    margin-left: 15px;
}
.rcorner-red {
    border-radius: 25px;
    background: #c10037;
    padding: 5px 20px 20px 20px;
    margin-left: 15px;
    color: white;
}
.rcorner-teal {
    border-radius: 25px;
    background: #007a86;
    padding: 5px 20px 20px 20px;
    margin-left: 15px;
    color: white;
}
.rcorner-teal a {
    color: white;
    text-decoration: underline;}
    
.rcorner-teal-2 {
    border-radius: 8px;
    background: #007a86;
    padding: 10px 20px;
    margin-left: 15px;
    color: white;
    text-align: center;
}
.rcorner-teal-2 a {
    color: white;
}
.btn-teal {
    color: #fff;
    background-color: #007a86;
    border-color: #006e79;
}

.btn-teal:hover, .btn-teal:focus, .btn-teal.focus, .btn-teal:active, .btn-teal.active, .open>.dropdown-toggle.btn-teal {
    color: #fff;
    background-color: #006e79;
    border-color: #007a86;
}  

/**** Section Banners ****/

#hero {background:url(../banners/administration-banner2.jpg) center center no-repeat; background-size:cover;  padding-top: 250px;}
#home #hero {padding-top:0;}
#about #hero {background-image:url(../banners/administration-banner2.jpg);}
#administration #hero {background-image:url(../banners/administration-banner2.jpg);}
#shared-services #hero {background-image:url(../banners/administration-banner2.jpg);}
#marcomm #hero {background-image:url(../banners/administration-banner2.jpg);}
#it #hero {background-image:url(../banners/administration-banner2.jpg);}
#hr #hero {background-image:url(../banners/administration-banner2.jpg);}
#marcomm #hero {background-image:url(../banners/administration-banner2.jpg);}
#data #hero { background-size: cover;
    background-position: center;
    height: 500px; background-image:url(../banners/iss-data-team-banner.png);}

/**** Callouts ****/
.callout {
    display: block;
    padding: 10px 20px;
    margin-bottom: 15px;
    position:relative;
}
.callout:hover {
    cursor: pointer; 
    cursor: hand;    
}
.callout a {color:#fff; }

.call-col-one-one::after {
    position: absolute;
    content: "\f1ad";
    font-family: fontawesome;
    opacity: .2;
    font-size: 150px;
    bottom: 0;
    right: 10px;
    line-height: 100px;
}


.call-col-one-two::after {
    position: absolute;
    content: "\f135";
    font-family: fontawesome;
    opacity: .2;
    font-size: 150px;
    bottom: 0;
    right: 10px;
    line-height: 150px;
}

.call-col-one-three::after {
    position: absolute;
    content: "\f1fe";
    font-family: fontawesome;
    opacity: .2;
    font-size: 150px;
    bottom: 0;
    right: 10px;
    line-height: 120px;
}

.call-col-two-one::after {
    position: absolute;
    content: "\f02d";
    font-family: fontawesome;
    opacity: .2;
    font-size: 150px;
    bottom: 0;
    top: 0px;
    right: 10px;
    line-height: 120px;
}

.call-col-two-two::after {
    position: absolute;
    content: "\f080";
    font-family: fontawesome;
    opacity: .2;
    font-size: 150px;
    bottom: 0;
    right: 10px;
    line-height: 120px;
}

.call-col-two-three::after {
    position: absolute;
    content: "\f0eb";
    font-family: fontawesome;
    opacity: .2;
    font-size: 150px;
    bottom: 0;
    right: 10px;
    line-height: 120px;
}


.quote-box {
    background-color: #c10037;
    color:white;
    border-radius: 20px;
    padding-top: 40px;
    padding-bottom: 20px;
}
.quote-box a {
    color: #fff;
    text-decoration: underline; 
}

.quote-box::before {
    position: absolute;
    content: "\f10d";
    font-family: fontawesome;
    opacity: .2;
    font-size: 90px;
    top: 1px;
    left: 30px;
    line-height: 100px;
}
.quote-box::after {
    position: absolute;
    content: "\f10e";
    font-family: fontawesome;
    opacity: .2;
    font-size: 90px;
    bottom: 50px;
    right: 30px;
    line-height: 100px;
}

.breathing-room {
    margin-left: 20px;
}

#primary .single-person-entry:nth-child(4n+1) {clear:both;}
.single-person-entry img{
    border-radius: 50%;
    max-width:150px;
}

#home #upper {
    background-color: #5e5d60;
    color: #fff;
    text-align: center;
    padding-top: 20px;
}

.hmpg-title {
    border-bottom: 1px dashed #a4a3a7;
    padding-bottom: 5px;
}

/**** Callouts ****/
.callout {
    display: block;
    padding: 10px 20px 20px;
    margin-bottom: 15px;
    position:relative;
}
.callout:hover {
    cursor: pointer; 
    cursor: hand;    
}
.callout a {color:#fff;}



.who-we-are::after {
    position: absolute;
    content: "\f0c0";
    font-family: fontawesome;
    opacity: .2;
    font-size: 70px;
    bottom: 0;
    right: 10px;
    line-height: 75px;
}
.contact-us::after {
    position: absolute;
    content: "\f003";
    font-family: fontawesome;
    opacity: .2;
    font-size: 70px;
    bottom: 0;
    right: 10px;
    line-height: 75px;
}
.data-request::after {
    position: absolute;
    content: "\f29c";
    font-family: fontawesome;
    opacity: .2;
    font-size: 70px;
    bottom: 0;
    right: 10px;
    line-height: 75px;}

.mission::after {
    position: absolute;
    content: "\f1d8";
    font-family: fontawesome;
    opacity: .2;
    font-size: 70px;
    bottom: 0;
    right: 10px;
    line-height: 75px;
}

.vision::after {
    position: absolute;
    content: "\f132";
    font-family: fontawesome;
    opacity: .2;
    font-size: 70px;
    bottom: 0;
    right: 10px;
    line-height: 75px;
}



#announcements {
    padding:20px;
}

.newsitems li a {
    color: #fff;
    text-decoration: underline;
}
.newsitems li {
    margin-bottom: 10px;
    line-height: 1.2;
}

a.block-link {color:#fff; text-decoration: none; }

.did-you-know-link {
    color: #fff;
    text-decoration: underline;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 35px;
    height: 0;
    overflow: hidden;
}
.video-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}