.group:after {
  content: "";
  display: table;
  clear: both;
}

/* ALERTS */
.vi-alerts-container{
	width: 100%;
	background-color: #d35151;
	color: #FFF;
	padding: 5px 0;
}
.vi-alerts-container .vi-alerts{
	list-style: none;
	margin: 0;
	padding: 0;
}
.vi-alerts-container .vi-alerts a{
	color: #FFF;
}



/* OUTAGE REPORT */
.vi-outage-report{
	width: 100%;
}
.vi-outage-report.vi-outage-report-widget{
	font-size: 14px !important;
}

/* DIRECTORY */
.vi-department-container h3{
	background-color: #c6b986;
	color: #FFF;
	padding: 5px 10px;
	margin-top: 0;
	margin-bottom: 20px;
}
.vi-directory-listing{
	float: left;
	width: 33.33%;
	text-align: center;
	margin-bottom: 20px;
}
.vi-directory-info h4{
	margin-bottom: 0;
}
.vi-directory-title{
	font-style: italic;
	font-size: 12px;
}
.vi-directory-info .button{
	text-decoration: none !important;
	color: #c6b986;
	margin-top: 5px;
	display: inline-block;
}

/* BOARD OF DIRECTORS */
.vi-board-listing{
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid #ccc;
}
.vi-board-listing:last-of-type{
	border: 0;
}
.vi-board-listing h3{
	margin-top: 5px;
	margin-bottom: 5px;
}
.vi-board-photo
,.vi-board-info{
	float: left;
}
.vi-board-photo{
	width: 20%;
}
.vi-board-info{
	width: 78%;
	margin-left: 2%;
}
.vi-board-info p{
	margin-top: 15px;
}
.vi-board-info .button{
	margin-top: 10px;
	display: inline-block;
	text-decoration: none !important;
	color: #c6b986;
}

/* BOARD AGENDA */
.vi-current-agenda{
	padding: 20px;
	border: 1px solid #CCC;
	background-color: #f1f1f1;
	font-size: 18px;
	font-weight: bold;
}
.vi-current-agenda a{
	font-size: 18px;
}

/* JOB POSTINGS */
.vi-job-postings{
	margin: 20px;
	border-bottom: 1px solid #ccc;
	padding-bottom: 20px;
}
.vi-department-container .vi-job-postings:last-of-type{
	border-bottom: 0;
	padding-bottom: 0;
}

/* Credits:
    This bit of code: Exis | exisweb.net/responsive-tables-in-wordpress
    Original idea: Dudley Storey | codepen.io/dudleystorey/pen/Geprd */
  
@media screen and (max-width: 768px) {
    table {
    	width:100%;
    }
    thead {
    	display: none;
    }
    tr:nth-of-type(2n) {
    	background-color: inherit;
    }
    tr td:first-child {
    	background: #f0f0f0; 
    	font-weight:bold;
    	font-size:1.3em;
    }
    tbody td {
    	display: block;  
    	text-align:left;
    }
    tbody td:before { 
        content: attr(data-th); 
        display: block;
        text-align:center; 
        float: left;
        margin-right: 10px; 
        font-weight: bold;
    }
}