/*
**************************************************
Featured layout
**************************************************
 */
.news-featured-block {
  padding: 1rem 0;
}
@media screen and (max-width: 991px){
  .news-featured-block { padding:2rem 0 1rem; }
}

/*
**************************************************
Full (default) layout
**************************************************
 */
.feat-news-title {
  padding-top: 0.875rem;
}
.styled-news-container{
  margin-top:1em;
  margin-bottom:1em;
}

 #s4-workspace h2.news-module-heading {
     font-size: 2rem;
     display: inline-block;
     float: left;
     margin-right: 3rem;
     color: #333;
     font-family: "Montserrat","Open Sans",Helvetica,Arial,sans-serif;
     font-weight: 800;
     margin-top: 0.875rem;
     margin-left: 0.75rem;
 }

#s4-workspace h2.news-module-no-left-margin {
  margin-left:0;
}
#s4-workspace .news-titlebar-full-layout {
  margin-bottom: 15px;
  border-bottom: 1px solid #eee;
}
#s4-workspace .news-module-heading-sublink {
  margin-top: 1.5em;
}

@media screen and (max-width: 768px) {
  #s4-workspace .news-module-heading-sublink {
    margin-top: 0;
    margin-bottom: 1.25em;
  }
}

#s4-workspace .all-news-link:hover, #s4-workspace .all-news-link:active, #s4-workspace .all-news-link:focus {
  color:#FFF !important;
}

.news-group-container{
  padding: 1.5rem 1.75rem 0.5rem 1.75rem;
}
.news-container {
  margin-bottom: 15px;
  overflow: auto;
	min-height: 110px;
}
.news-summary > p.small {
  font-size: 1rem !important;
}
@media screen and (min-width: 1200px) {
  .news-group-container{
    padding: 1rem 2rem 0 2rem;
  }
  .news-container {
    margin-bottom: 1.125em;
  }
  .news-summary > p.small {
    font-size: .875rem !important;
  }
}

.news-summary-home *{
	font-size:1em !important;
}

.news-thumb {
    float: left;
}
.news-thumb img {
  display: block;
	width : 125px !important;
	float: left;
  border-radius: 2px;
  border: 2px solid;
  padding: 1px;
  background-color: #fff;
}

.news-thumb-home {
    float: left
}

.news-text{
	margin-left: 140px;
  padding-right: 10px;
}

#s4-workspace .news-title h3{
  margin-top:0px !important;
  margin-bottom: 0.5rem;
}

/*.news-title h3{
  margin-top:5px !important;
  margin-bottom:0px !important;
}
*/

@media screen and (max-width: 1200px){
  .news-thumb img {
  	width : 100px !important;
  }
  .news-text{
  	margin-left: 115px;
  }
}
@media screen and (max-width: 576px){
  .news-thumb img {
    width : 80px !important;
    margin-right: 15px;
  }
  .news-summary {
    clear:both;
  }
  .news-text{
  	margin-left: 0;
  }
  #s4-workspace .news-title h3 {
    font-size: 1.25rem;
  }
}


/*
**************************************************
List layout
**************************************************
 */

#s4-workspace .news-list-title {
  display: list-item;
  margin:0;
}
.news-list-img-container{
  margin-left: 0.25rem;
}
.news-list-content {
  margin: 0;
}
#s4-workspace .news-list-img-container li {
  margin: 1.5rem 0 0 0;
}
.news-list-thumb {
  float:left;
  margin-right:15px;
}
.news-list-thumb img {
  width:75px;
  border-radius: 2px;
  padding-top: 0.25rem;
}
#s4-workspace .news-list-summary {
  line-height: 1.5em;
  margin-top: .25rem;
}
.news-list-border {
  padding-top: 0.5rem;
  clear:both;
}



/*
**************************************************
News Landing Page
**************************************************
 */

#newsDisplay{
	margin-top:15px;
}

.StoryList{
   list-style-type:none;
}
.story-container {
  margin-bottom: 15px;
  overflow: auto;
	min-height: 110px;
}
.story-summary-home *{
	font-size:1.0em !important;
}

.story-thumb img {
  display: block;
	box-shadow: 0px 1px 3px rgba(0,0,0,0.12), 0px 1px 2px rgba(0,0,0,0.24);
	border-radius: 2px;
}

.story-thumb-home {
    float: left
}

.story-text{
	margin-left: 170px;
}

#s4-workspace .story-title h2{
  margin-top:0px !important;
  margin-bottom:0px !important;
  font-size: 1.25rem;
}

.story-title h3{ /* unused*/
  margin-top:5px !important;
  margin-bottom:0px !important;
}


input[type=checkbox], input[type=radio] {
    margin: 0 0 4px 0;
}


/****************************
 Filter stuff
 *****************************/

#filterlisting input {
  position: absolute;
  left: -9999px;
}

#filterlisting label {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 15px 20px 15px 52px;
  line-height: 1.25em;
  border-radius: 20px;
  user-select: none;
  /*transition: background-color .2s, box-shadow .2s;*/
  font-size:1.0rem;
}

#filterlisting input:checked + label { background-color:#e52626; }
#filterlisting input:checked + label::before { text-shadow: none; }

/* school accent left border color - matches program tag in content divs */
#filterlisting label.school-business{  border-left: 11px solid #249E31; }
#filterlisting label.school-arts{ border-left: 11px solid #C00D1E; }
#filterlisting label.school-education{ border-left: 11px solid #93328E; }
#filterlisting label.school-health{ border-left: 11px solid #248ED8; }
#filterlisting label.school-law{ border-left: 11px solid #1E22AA; }
#filterlisting label.school-manufacturing{ border-left: 11px solid #95614D; }
#filterlisting label.school-stem{ border-left: 11px solid #FF7500; }

#filterlisting label::before {
  display: block;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 14px;
  width: 30px;
  height: 30px;
	padding: 4px 0 0 3px;
  font-size: 1.5rem;
  margin: auto 0;
  border-radius: 16px;
  color: #f5f5f5;
  line-height: 1em;
  font-weight: bold;
  background-color: #f5f5f5;
  transition: background-color .2s;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.1);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f00c";
	/*  content: attr(data-before); - changed to FA */
}

/* blue outline on checkbox and label focus (must separate to work) for accessibility */
#filterlisting input[type="checkbox"]:focus + label::before {
    outline: rgb(59, 153, 252) solid 2px;
}
#filterlisting input[type="checkbox"]:focus + label {
	outline: none;
	-webkit-box-shadow: 0 0 0 0.0825rem #fff, 0 0 0.0625rem 0.225rem rgba(77,144,254,0.5);
	box-shadow: 0 0 0 0.0825rem #fff, 0 0 0.0625rem 0.225rem rgba(77,144,254,0.5);
}

#filterlisting input:checked + label::before {
  color: #6D0000;/*#333;*/
  background-color: #ffffff;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.6);
	outline: transparent solid 2px !important; /* don't visibly show outline on inner checkbox when checked */
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f00c";
	/*content: '\2713'; -- entity for ✓ checkmark */
}

#filterlisting input:checked:hover + label, #filterlisting input:checked:active + label, #filterlisting input:checked:focus + label {
    outline: none;
    -webkit-box-shadow: 0 0 0 0.0825rem #fff, 0 0 0.0625rem 0.225rem rgb(229 38 38 / 50%) !important;
    box-shadow: 0 0 0 0.0825rem #fff, 0 0 0.0625rem 0.225rem rgb(229 38 38 / 50%) !important;
}

#filterlisting {
  border-top: 1px solid #111;
}
#filterlisting .finputwrap {
	margin: 6px;
  border-radius:20px;
  display:inline-block;
}

#s4-workspace .story-title h2 {
	/*font-size: 1.375rem;*/
	margin-bottom: 5px !important;
}
#s4-workspace .story-job {
	font-size:1rem;
	font-weight:bold;
}
.program-tag-wrap { margin-top: 1.1875em; }
@media screen and (max-width: 768px){
	#s4-workspace .story-title { text-align: center; }
	#s4-workspace .story-job { text-align: center; }
	.program-tag-wrap { text-align: center; }
	.program-tag { margin: 10px 3px 0 3px !important; font-size: 1rem !important; } /* negate 'small' font class on sm/xs */
}
.story-container {
	padding:25px;
}

#newsTable {
	padding-top: 8px;
	padding-bottom: 20px;
	width: auto !important;
}
#newsTable_filter{
	float: right;
	margin-bottom: 10px;
	/*padding-right: 10px;*/
}
#newsTable_length{
	display: inline-block;
	margin-top: 2px;
}
#newsTable_length label{
	/*margin-bottom:0;*/
}
.dt_pageSel {
	width:auto;
	display: inline-block;
	padding: 6px 0px 6px 6px;
	margin: 0 3px;
	height:auto;
}
#dt_searchTxt{
	background: #fff;
	border: 1px solid #003385;
	padding: 4px 12px;
	border-radius: 4px;
	font-family: "Montserrat";
	font-weight:normal;
}
#dt_searchTxt .dt-search-bar__button{
	border-radius: 0 4px 4px 0;
	padding-left: .5em;
	padding-right: .5em;
	width: 2.125rem;
}

#newsTable_filter input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #003385;
	font-family: 'Open Sans',Arial,Helvetica,sans-serif;
	font-weight:normal;
	opacity: 1; /* Firefox */
}
#newsTable_filter input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #003385;
	font-family: 'Open Sans',Arial,Helvetica,sans-serif;
	font-weight:normal;
}
#newsTable_filter input::-ms-input-placeholder { /* Microsoft Edge */
	color: #003385;
	font-family: 'Open Sans',Arial,Helvetica,sans-serif;
	font-weight:normal;
}

.dataTables_wrapper .dataTables_filter input {
	margin: 0;
	color:#444;
	font-weight:normal;
}

/*********************************************************
The following emulates both bg-cgrey-05 and shadow-3. Has to be a separate element due to jQuery datatables handling all striping dynamically,
and applying those existing classes to table rows. However they need to be added to the container div within each cell, so doing so here.
**********************************************************/
.bg-experience-row-striped .story-container {
	background-color: #E9F2FF;
	color: #000;
	-webkit-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
	-moz-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
	-ms-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
	-o-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
	box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}
.bg-experience-row .story-container {
	-webkit-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
	-moz-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
	-ms-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
	-o-box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
	box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}

.story-text {
		margin-left: 0;
}
.story-thumb {
	padding: 0 5px 0 0 !important;
	text-align: center;
	margin: 0 auto;
}
#newsTable .thumbnail {
	background-color: transparent;
	padding:1px;
}
.story-thumb img {
	width:150px;
	margin:0 auto;
}
/*
@media screen and (min-width: 768px) and (max-width: 1549px) { .story-thumb img { width: 100%; }}
@media screen and (min-width: 1550px) and (max-width: 1879px) { .story-thumb img { width: 90%; }}
@media screen and (min-width: 1880px) { .story-thumb img { width: 75%; }}
@media screen and (min-width: 992px) { #schoolExperienceRow .story-thumb img { width: 75%; }}
*/


.filter-tag-hidden, .filter-cat-hidden {
	display:none;
}
#s4-workspace .story-summary {
	padding-top:3px;
}
#s4-workspace .story-summary p {
		margin: 0 0 0.5rem;
}
.category-tag {
	padding: 5px 12px;
	display: inline-block;
	color: #FFF;
	border-radius: 6px;
	margin: 3px 5px 2px 0;
	text-shadow: 1px 1px 4px rgba(0,0,0,0.5);
}
a.category-tag-link span:hover {
	outline: none;
	-webkit-box-shadow: 0 0 0 0.0825rem #fff, 0 0 0.0625rem 0.225rem #4D90FE;
	box-shadow: 0 0 0 0.0825rem #fff, 0 0 0.0625rem 0.225rem #4D90FE;
}

#storyMain .h3, #storyMain .h4{
	margin-top: 0;
}

/* override top of datatable*/
table.dataTable thead th, table.dataTable thead td {
		border-top: 1px solid #111;
		border-bottom:0;
}
