@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=EB+Garamond&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css");

/*************************************/
 /**********    HEADERS/TEXT  *******/
/*************************************/
#page-wrap h1 {
	margin-top: 13px;
	font-family: 'EB Garamond', serif;
	font-size: 25pt;
	font-kerning: 10px;
	font-weight: 100;
}
#header h1 {
	margin-top: 13px;
	font-family: 'EB Garamond', serif;
	font-size: 25pt;
	font-kerning: 10px;
	font-weight: 100;
}
#page-wrap h3 {
	font-family: 'Open Sans', sans-serif;
	font-size: 22pt;
	padding-bottom: 6px;
}
#page-wrap p {
	font-family: 'Open Sans', sans-serif;
	font-size: 11pt;
}
#header hr {
	margin-top: 7px;
	margin-bottom: 3px;
}
#featuredimage h1 {
	font-family: 'Open Sans', sans-serif;
	font-size: 22pt;
	padding-top: 10px;
}
#featuredimage h3, #mainmedia h1 {
	font-family: 'Open Sans', sans-serif;
	font-size: 13pt;
}
#featuredimage hr {
	margin-top: 7px;
	border-top: .5px solid #767676;
}
#mainmedia .bodytext {
	padding-top: 10px;
}
.main-image span {
	font-size: 9pt;
	margin-top: 0px;
}
#mainmedia .more {
	font-family: 'Open Sans', sans-serif;
	font-size: 14pt;
	padding: 20px;
	max-width: 100%;
	background-color: aliceblue;
	text-align: left;
	margin: 8px auto;
}
#mainmedia .mediadate{
	color:#2E2E2E;
	font-size: 9pt;
}

#overviews .active {
	color: #000;
	font-weight: 800;
}
/*************************************/












/*************************************/
/*************  MMG/OTHER ************/
/*************************************/
.main-image {
	position: relative;
	float: left;
	padding-right: 15px;
	padding-bottom: 10px;
}
.main-audio {
	width: 350px; 
	height: 220px; 
	float: left;
	padding-right: 15px;
	padding-bottom: 10px;
}
.main-audio .audioinsertion {
	font-size: 8pt;
	margin-top: 0px;
}

.multicon {
	float: left;
	alignment-baseline: text-top;
}
#mainmedia {
	padding: 25px 75px;
	text-align: left;
}

#mainmedia .overviewsearchicon {
	line-height: 1.2;
}

#mainmedia .overviewsearchicon img {
	height: 45px; 
	vertical-align: middle;
}








/*************************************/
/****** FEATURED IMAGE ON MAIN *******/
/*************************************/
#featuredimage {
	background-color: #e2e5e5;
	padding: 25px 100px;
	text-align: left;
	border-radius: 10px;
}
.featured-image .fimage {
	position: relative;
	float: left;
	padding-right: 18px;
	padding-bottom: 10px;
}
.featured-image .fover-image {
	position: absolute;
	background-color: rgba(109,109,109,0.60);
	border-radius: 3px;
	float: left;
	top: 220px;
	left: 305px;
	padding: 4px;
}
/*************************************/












/*************************************/
/********* Overviews Section *********/
/*************************************/
#overviews {
	margin-top: 12px;
	margin-bottom: 12px;
}

#overviews li {
	text-decoration: none;
	display: inline-block;
	text-align: center;
	width: 75px;
	vertical-align: top;
	margin-right: 8px;
}

#overviews li img {
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 8px;
}

#overviews li p {
	font-size: 10pt;
}

/*************************************/











/*************************************/
/****** SEARCH/ADVANCED SEARCH *******/
/*************************************/
.mmgsearch {
	margin-top: -10px;
}

.search {
	float: left;
}
.toggle-box-region {
	background-color:#fff;
	text-align: center;
	margin-top: -5px;;
}

.toggle-box {
	display:none;
}

.toggle-box + label {
	color:#555;
	cursor:pointer;
	font-weight:bold;
	line-height:23px;
	padding:.3em 0 .3em 26px;
	position:relative;
}

.toggle-box + label + div {
	display: none; 
	margin: 0 0 14px;
}

.toggle-box:checked + label:nth-child(n) + div {
	display: block;
}

.toggle-box + label:before {
	position:absolute;
	content:"\f0fe";
	font-family:FontAwesome;
	top:.3em;
	left:0px;
	color:#0085a6;
}

.toggle-box:checked + label {
	color:#0085a6;
}

.toggle-box:checked + label:before {
	content:"\f146";
}

.toggle-box-content { 
	color:#000; 
	padding:2px 1em .6em 28px;
}

.researchareas {
	margin-top: -7px;
}
/*************************************/







/************************************/
/****** MMG GRID AND OVERLAYS *******/
/************************************/
.content {
  	position: relative;
  	width: 350px;
  	padding: 2px !important;
	margin-top: 4px;
	margin-bottom: 4px;
  	overflow: hidden;
	}

.content h3 {
	font-family: 'Open Sans', sans-serif;
	font-size: 13pt !important;
	padding: 5px 5px 20px 5px;
	font-weight: bold;
}

.series-name {
	height: 65px;
}

.content .content-overlay {
	background: linear-gradient(to top, transparent -5%, black 75%);
	position: absolute;
	height: 220px;
	width: 350px;
	left: 0px;
	top: 2px;
	bottom: 0;
	right: 0;
	opacity: 0;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
}


.content:hover .content-overlay{
 	opacity: 1;
}

.content-image {
 	width: 350px;
	margin-left: 4px;
	margin-right: 4px;
}

.over-image{
    position: absolute;
    top: 170px;
    left: 285px;
	background-color: rgba(109,109,109,0.60);
	border-radius: 3px;
	padding: 4px;
}

.content-details {
	position: absolute;
	text-align: left;
	padding-left: 1em;
	padding-right: 2em;
	width: 350px;
	top: 50%;
	left: 50%;
	opacity: 0;/*
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-transition: all 0.3s ease-in-out 0.2s;
	-moz-transition: all 0.3s ease-in-out 0.2s;
	transition: all 0.3s ease-in-out 0.2s;*/
}

.content:hover .content-details{
	top: 9%;
	left: 2%;
	opacity: 1;
}

.content-details p{
	font-family: 'Open Sans', sans-serif;
	color: #fff;
	font-size: 11pt;
}

.content .discimg {
	padding-right: 8px;
}








/*************************************/
/****** MEDIA SIZES *******/
/*************************************/

@media screen and (max-width: 1200px) and (min-width: 1000px),  {
	#featuredimage {
	padding: 25px 75px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 25px 75px;
	}
	.content-details {
	padding-right: 7em;
}
	.over-image{
    top: 125px;
    left: 225px;
}
	.content .content-overlay {
	height: 180px;
}
}
@media screen and (max-width: 999px) and (min-width: 900px),  {
	#featuredimage {
	padding: 25px 75px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 25px 75px;
	}
	.content-details {
	padding-right: 10em;
}
	.over-image{
    top: 125px;
    left: 220px;
}
	.content .content-overlay {
	height: 180px;
}
}
@media screen and (max-width: 899px) and (min-width: 800px),  {
	#featuredimage {
	padding: 25px 30px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 25px 30px;
	}
	#featuredimage h1 {
	font-size: 13pt;
}
	#featuredimage h3, .content h3, #mainmedia h3 {
	font-size: 10pt !important;
}
	#header h1 {
	font-size: 20pt;
}
	.content-details {
	padding-left: 1em;
	padding-right: 9em;
	top: 50%;
	left: 50%;
}
	.over-image{
    top: 110px;
    left: 190px;
}
	#mainmedia .more {
	font-size: 10pt;
	padding: 10px;
	margin: 8px auto;
}
	.content .content-overlay {
	height: 140px;
}
}
@media screen and (max-width: 799px) and (min-width: 768px),  {
	#featuredimage {
	padding: 25px 30px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 25px 30px;
	}
	#featuredimage h1 {
	font-size: 13pt;
}
	#featuredimage h3, .content h3, #mainmedia h3 {
	font-size: 10pt !important;
}
	#header h1 {
	font-size: 20pt;
}
	.content-details {
	padding-left: 1em;
	padding-right: 9em;
	top: 50%;
	left: 50%;
}
	.over-image{
    top: 95px;
    left: 160px;
}
	#mainmedia .more {
	font-size: 10pt;
	padding: 10px;
	margin: 8px auto;
}
	.content .content-overlay {
	height: 140px;
}
}
@media screen and (max-width: 767px) and (min-width: 701px),  {
	#featuredimage {
	padding: 25px 10px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 25px 10px;
	}
	#featuredimage h1 {
	font-size: 13pt;
}
	#featuredimage h3, .content h3, #mainmedia h3 {
	font-size: 10pt !important;
}
	#header h1 {
	font-size: 20pt;
}
	.content-details {
	padding-left: 12em;
	padding-right: .1em;
}
	.over-image{
    top: 180px;
    left: 430px;
}
	#mainmedia .more {
	font-size: 10pt;
	padding: 10px;
	margin: 8px auto;
}
}
@media screen and (max-width: 700px) and (min-width: 667px),  {
	#featuredimage {
	padding: 25px 10px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 25px 10px;
	}
	#featuredimage h1 {
	font-size: 13pt;
}
	#featuredimage h3, .content h3, #mainmedia h3 {
	font-size: 10pt !important;
}
	#header h1 {
	font-size: 20pt;
}
	.content-details {
	padding-left: 10em;
	padding-right: 1em;
	top: 50%;
	left: 50%;
}
	.over-image{
    top: 182px;
    left: 405px;
}
	#mainmedia .more {
	font-size: 10pt;
	padding: 10px;
	margin: 8px auto;
}
}
@media screen and (max-width: 666px) and (min-width: 500px),  {
	#featuredimage {
	padding: 25px 10px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 25px 10px;
	}
	#mainmedia img{
		margin: 0 auto;
		display: block;
		left: 50%;
	}
	#featuredimage h1 {
	font-size: 13pt;
}
	#featuredimage h3, .content h3, #mainmedia h3 {
	font-size: 10pt !important;
}
	#header h1 {
	font-size: 18pt;
}
	.content-details {
	padding-left: 9em;
	padding-right: 2em;
	top: 50%;
	left: 50%;
}
	.over-image{
    top: 175px;
    left: 325px;
}
	
	#mainmedia .more {
	font-size: 10pt;
	padding: 10px;
	margin: 8px auto;
}
}
@media screen and (max-width: 499px) and (min-width: 300px),  {
	#featuredimage {
	padding: 25px 10px;
	border-radius: 10px;
}
	#mainmedia {
		padding: 10px 0px;
	}
	.content .content-overlay {
	height: 190px;
}
	#featuredimage h1 {
	font-size: 13pt;
}
	#featuredimage h3, .content h3, #mainmedia h3 {
	font-size: 10pt !important;
}
	.featured-image .fover-image {
	top: 140px;
	left: 200px;
}
	#header h1 {
	font-size: 18pt;
}
	.content-details {
	padding-left: 1em;
	padding-right: 4em;
	top: 30%;
	left: 60%;
}
	.over-image{
    top: 142px;
    left: 235px;
}
	
	#mainmedia .more {
	font-size: 10pt;
	padding: 10px;
	margin: 8px auto;
}
}