/*
Theme Name: College of Textiles Directory
Theme URI: https://design.oit.ncsu.edu
Description: Hillsborough child theme for the College of Textiles
Author: Brian DeConinck, OIT Design
Author URI: https://design.oit.ncsu.edu/
Template: hillsborough
Version: 0.1.3
*/

/* Include missing NC State Directory styles */

div.directory_entry.row:after,div.leadership,div.leadership:after{clear:both}h2.letter{font-size:4em!important;display:block;float:left;padding-left:18px}div.directory_entry.row:after,div.directory_entry.row:before,div.leadership:after,div.leadership:before{display:table;content:" "}div.leadership h2{margin-left:18px}div.directory_entry.row{margin:0;padding:1.25em;clear:both}div.directory_entry.row .person_info{float:left;width:30%}@media (max-width:767px){div.leadership h2{font-size:1.7em!important}div.directory_entry.row .person_info{width:100%}}div.directory_entry.row div.subgroups{float:right;margin-right:15%;margin-top:36px;width:30%}@media (max-width:767px){div.directory_entry.row div.subgroups{width:100%;margin-top:0;margin-right:0}div.directory_entry.row .initials{display:none}}div.directory_entry.row div.subgroups p{text-align:left}div.directory_entry.row .initials{width:30%;max-width:150px;font-size:2.5em;font-family:UniversCondensed,Arial,sans-serif;text-align:center;background-color:#ddd;margin-bottom:0;margin-right:24px;padding-bottom:39px;padding-top:39px;float:left}div.directory_entry.row p{margin:0;font-size:16px}div.directory_entry.row p.name{font-size:24px}div.directory_entry.row p.title{font-weight:700;font-family:UniversRoman,arial,sans-serif}div.directory_entry.row img{max-width:150px;float:left;margin-right:24px}@media (max-width:767px){div.directory_entry.row .initials{width:60%;padding-bottom:40%;padding-top:20%}div.directory_entry.row img{display:none}div.directory_entry.grid .person_info{float:left;display:block;clear:left}}div.directory_entry.grid{margin-bottom:1em;min-height:28em!important;float:left;width:100%;position:relative;padding-left:15px;padding-right:15px}@media (min-width:768px){div.directory_entry.grid{float:left;width:50%}}@media (min-width:992px){div.directory_entry.grid{float:left;width:33.33333%}}@media (min-width:1200px){div.directory_entry.grid{float:left;width:29.16667%}}div.directory_entry.grid p{margin:0!important}#person,#person .bio,.alphabet,.section-txt .controls:after{clear:both}div.directory_entry.grid img{margin-bottom:30px}div.directory_entry.grid .initials{width:100%;height:0;padding-bottom:70%;padding-top:30%;font-size:3em;font-family:UniversCondensed,Arial,sans-serif;text-align:center;background-color:#ddd;margin-bottom:28px}#person .person_info p.title,.alphabet p{font-weight:700;font-family:UniversRoman,arial,sans-serif}#directory-index .index-nav{clear:both;text-align:center}@media (max-width:767px){div.directory_entry.grid img{max-width:60%;float:left;display:block}div.directory_entry.grid .initials{width:60%;padding-bottom:40%;padding-top:20%}#person{margin-left:5px}#person h1{padding-left:15px;margin-bottom:20px}}#person img{position:relative;min-height:1px;padding-left:0;padding-right:30px}#person .bio,#person .person_info{min-height:1px;padding-right:15px;position:relative}@media (min-width:768px){#person img{float:left;width:25%}#person .person_info{float:left;width:50%}}@media (max-width:767px){#person img{width:50%;padding-left:15px;margin-bottom:15px;max-width:200px}}#person .person_info{padding-left:0}@media (max-width:767px){#person .person_info{padding-left:18px}}#person .person_info p{margin:0}#person .bio{padding-left:15px}@media (min-width:992px){#person .bio{float:left;width:83.33333%}}.text-mod.bio{margin-top:2rem}ul.publications li a:hover{text-decoration:underline}.section-txt .controls{background-color:#f2f2f2;margin-bottom:4em}.section-txt .controls:after,.section-txt .controls:before{content:" ";display:table}.section-txt .controls form{width:50%;float:left}@media (max-width:767px){.text-mod.bio{margin-left:5px}.section-txt .controls form{width:100%}.section-txt .controls input{width:80%}}.section-txt .controls input{padding:16px;margin:1em 0 1em 1em;height:16px;border:1px solid #999;-webkit-box-sizing:content-box}.section-txt .controls input:focus{border:2px solid #666}.section-txt .controls .search-submit{text-transform:none;width:50px!important;height:50px!important;margin:-2px 0 0 -6px;padding:0}.section-txt .controls .search-submit .glyphicon{margin-left:0;top:2px}.section-txt .controls .category-dropdown{position:relative;float:right;width:30%}@media (max-width:767px){.section-txt .controls .search-submit{margin-top:-1px}.section-txt .controls .category-dropdown{width:100%}}.section-txt .controls .category-dropdown .category-dropdown-button{background-color:#e2e2e2;padding:1rem;height:86px;margin:0;width:100%;text-align:left;font-size:16px;border:none}.section-txt .controls .category-dropdown .category-dropdown-button .glyphicon{float:right;margin-top:4px}.section-txt .controls .category-dropdown .category-dropdown-button:focus,.section-txt .controls .category-dropdown .category-dropdown-button:hover{background-color:#d2d2d2}.section-txt .controls .category-dropdown .category-dropdown-button:focus{outline:0}.section-txt .controls .dropdown-menu{background-color:#e2e2e2;width:100%;border:none;margin:0}.section-txt .controls .dropdown-menu li>a{padding:1rem;white-space:normal}.section-txt .controls .dropdown-menu li>a:focus,.section-txt .controls .dropdown-menu li>a:hover{background-color:#d2d2d2}.alphabet{margin:1em 18px 3em}.alphabet p{width:100%;display:block;margin-bottom:12px!important;text-transform:uppercase;font-size:14px}.alphabet .links a{font-size:1.2em;padding-right:.5em;text-decoration:none;display:inline-block}.alphabet .links a:hover,a.back-to-top:hover{text-decoration:underline}a.back-to-top{display:block;float:right;margin-top:60px}@media (max-width:767px){.alphabet .links{margin-left:-11px;margin-right:-11px}.alphabet .links a{font-size:1.7em;padding-right:0;text-align:center;width:40px}a.back-to-top{margin-right:18px}}

/* Child theme styles */

button .right-arrow {
	position:absolute;
	top: 0;
	right: 0;
}
button .right-arrow svg {
	position:absolute;
	left:0;
	-webkit-transition:left .2s ease;
	transition:left .2s ease;
	width:1.5em;
	height:1.5em;
	margin-left:.25em;
	margin-right:.5em;
}
button .left-arrow {
	position:relative;
}
button .left-arrow svg {
	position:absolute;
	right:0;
	-webkit-transition:right .2s ease;
	transition:right .2s ease;
	width:1.5em;
	height:1.5em;
	margin-right:.25em;
	margin-left:.5em;
}
button:active .right-arrow svg, button:focus .right-arrow svg, button:hover .right-arrow svg {
	left:.25em;
	-webkit-transition:left .2s ease;
	transition:left .2s ease;
}
button:active .left-arrow svg, button:focus .left-arrow svg, button:hover .left-arrow svg {
	right:.25em;
	-webkit-transition:right .2s ease;
	transition:right .2s ease;
}

#directory-index .controls {
	display: block;
	float: left;
	width: 100%;
	margin-bottom: 3rem;
	background-color: #f2f2f2;
}

#directory-index .controls form {
	width: 100%;
	float: left;
}

#directory-index .controls input {
	padding: 16px;
    margin: 1em 0 1em 1em;
    height: 48px;
    border: 1px solid #999;
}

#directory-index .controls .dropdown-menu {
	background-color: #e2e2e2;
    width: 100%;
    border: none;
    margin: 0;
}

#directory-index .alphabet p {
	font-size: 1.75rem;
	margin: 4rem 0 0 0;
}

#directory-index .alphabet .links a {
	font-size: 2.5rem;
	padding: 0 1.25rem;
}

#directory-index .section-txt {
	display: block;
	width: 100%;
	float: left;
}

#directory-index .section-head {
	font-size: 5.5rem;
	display: block;
	float: left;
	width: 100%;
}

#directory-index .section-head .h4 {
	display: block;
	float: left;
	width: 100%;
}

#directory-index .people-no-results {
	margin: 4rem 0;
}

#directory-index .controls .category-dropdown {
	position: relative;
	font-family: 'UniversRoman', arial, sans-serif;
	font-weight: bold;
	width: 100%;
	float: left;
}

#directory-index .controls .category-dropdown .category-dropdown-button {
    background-color: #e2e2e2;
    padding: 1rem;
    height: 84px;
    margin: 0;
    width: 100%;
    text-align: left;
    font-size: 16px;
    border: none;
}

#directory-index .controls .category-dropdown form {
	padding: 2rem;
}

#directory-index .controls .category-dropdown form ul {
	padding-left: 0;
}

#directory-index .controls .category-dropdown label {
	display: flex;
	flex-direction: row;
	font-size: 1.5rem;
	font-family: 'UniversRoman', arial, sans-serif;
	font-weight: normal;
}

#directory-index .controls .category-dropdown label span {
	margin: auto 1rem;
	display: block;
}

#directory-index .controls .filter-subgroup, #directory-index .controls .filter-expertise {
	column-count: 2;
	column-gap: 2rem;
}

#directory-index .controls .filter-subgroup li, #directory-index .controls .filter-expertise li {
	-webkit-column-break-inside: avoid; /* Chrome, Safari */
	page-break-inside: avoid;           /* Theoretically FF 20+ */
	break-inside: avoid-column; 
}

#directory-index .controls .filter-button {
	width: 100%;
	margin: 0.75rem 0;
	clear: both;
	text-transform: uppercase;
	font-family: 'UniversCondensed', arial, sans-serif;
	padding: 0;
	font-size: 2rem;
}

#directory-index .controls fieldset legend {
	margin: 1.25rem 0 0.25rem 0;
	font-size: 1.5rem;
}

#directory-index .controls .filter-subgroup input, #directory-index .controls .filter-expertise input {
	height: auto;
}

#directory-index .controls .filter-reset {
	font-family: 'UniversRoman', arial, sans-serif;
	font-weight: normal;
	font-size: 1.75rem;
	text-decoration: underline;
	display: block;
	margin: 0.5rem 0;
}

#directory-index .controls .clear-search {
	height: 82px;
	line-height: 6rem;
	margin: auto auto;
	padding: 1rem;

}

#directory-index .controls .filter-reset:hover, #directory-index .controls .filter-reset:focus, #directory-index .controls .filter-reset:active {
	text-decoration: none;
}

#directory-index .controls .search-submit {
	text-transform: none;
    width: 48px!important;
    height: 48px!important;
    margin: -4px 0 0 -6px;
    padding: 0;
}

#directory-index .controls .search {
	margin-bottom: 0;
}

#directory-index .controls .search input {
	width: 75%;
}

@media screen and (min-width: 992px) {
	#directory-index .controls .category-dropdown {
		width: 50%;
		float: right;
	}

	#directory-index .controls .search {
		width: 50%;
		float: left;
	}
}

#directory-index .current-group {

}

#directory-index .directory_entry {
	width: 100%;
	height: auto;
}

#directory-index .directory_entry.row {
	padding-left: 0;
	padding-right: 0;
}

#directory-index .directory_entry.directory_compact_entry {
	margin-bottom: 2em;
}

@media screen and (min-width: 768px) {
	#directory-index .directory_entry.directory_compact_entry {
		max-width: 33.3333333%;
	}
}

@supports (::focus-within) {
/*	@media screen and (min-width: 768px) {*/

		#directory-index .directory_entry.row {
			height: 220px;
			overflow: hidden;
			position: relative;
		}

		#directory-index .directory_entry.row:after {
			content: '';
			position: absolute;
			z-index: 1;
			bottom: 0;
			left: 0;
			pointer-events: none;
			background-image: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255, 1) 95%);
			width: 100%;
			height: 4em;
		}

		#directory-index .directory_entry.row:hover {
			min-height: 220px;
			height: auto;
			overflow: visible;
		}

		#directory-index .directory_entry.row:hover:after {
			display: none;
		}

	/*}*/
}



#directory-index div.directory_entry .initials {
	font-family: 'UniversLight', arial, sans-serif;
	width: 150px;
	height: 150px;
	background-color: #ccc;
	text-align: center;
	display: flex;
	padding-bottom: 0;
    
}

#directory-index.compact div.directory_entry .initials, #directory-index.compact .directory_entry img {
	float: left;
	margin-right: 2rem;
	font-size: 1em;
	padding-top: 0;
}

#directory-index div.directory_entry .initials .dashicons {
	font-size: 2.5em;
	width: 100%;
	height: 100%;
	line-height: 0.75em;
	color: #666;
	margin: auto;
}

#directory-index.compact div.directory_entry .initials .dashicons {
	font-size: 6em;
	padding-top: 0.35em;
}

#directory-index .directory_entry .person-more-details {
	width: 100%;
	float: left;
	background: none;
	border: none;
	text-align: left;
	text-transform: uppercase;
	font-weight: bold;
	color: #cc0000;
	padding: 0 1.5rem;
	text-decoration: underline;
}

#directory-index .directory_entry .person-more-details .glyphicon {
	margin-left: 0.75rem;
}

#directory-index .directory_entry .person-more-details:hover, #directory-index .directory_entry .person-more-details:focus, #directory-index .directory_entry .person-more-details:active {
	color: #990000;
	text-decoration: none;
}

#directory-index .directory_entry .directory-info {
	color: #000;
	margin-bottom: 2rem;
}

#directory-index .directory_entry .directory-info a[href]::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

#directory-index .directory_entry .directory-info-text {
	float: left;
	max-width: 350px;
}

#directory-index .directory_entry .directory-info .name {
	text-decoration: underline;
	font-size: 3rem;
	color: #cc0000;
}

#directory-index .directory_entry.directory_compact_entry .directory-info .name {
	font-size: 1.25em;
}

#directory-index .directory_entry .directory-info .initials {
	color: #cc0000;
}

#directory-index .directory_entry .directory-info:hover .name, #directory-index .directory_entry .directory-info:focus .name, #directory-index .directory_entry .directory-info:active .name, #directory-index .directory_entry .directory-info:hover .initials, #directory-index .directory_entry .directory-info:focus .initials, #directory-index .directory_entry .directory-info:active .initials {
	color: #990000;
	text-decoration: none;
}

#directory-index .directory_entry .directory-info .title {
	font-size: 1.75rem;
	/*font-weight: bold; */
	font-family: 'UniversRoman', arial, sans-serif;
}

#directory-index.compact .directory_entry .directory-info .title {
	font-size: 1em;
}

#directory-index .directory_entry .directory-info .subgroups {
	float: left;
	max-width: 350px;
}

#directory-index .directory_entry .directory-info .subgroups .affiliations {
	float: left;
	width: 100%;
	margin-bottom: 1.5rem;
	text-transform: uppercase;
}

#directory-index .directory_entry .expertise {
	margin-top: 2.5rem;
}

#directory-index .directory_entry .contact {
	margin-top: 2.5rem;
} 

.directory_entry .person-section-heading {
	font-family: 'UniversRoman', arial, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	margin: 2rem 0 1rem 0;
}

.directory_details {
	padding-top: 0;
}

.directory_details li.collaborator a {
	width: 12rem;
}

.directory_details li.collaborator img {
	width: 8rem;
	height: 8rem;
	margin: 0 auto;
}

.directory_details li.collaborator .initials {
	width: 8rem;
	height: 8rem;
	background-color: #f2f2f2;
	border: solid 1px #ccc;
	display: flex;
	margin: auto;
	padding: 0;
}

.directory_details li.collaborator .initials .initials-text {
	font-size: 3rem;
}

.directory_details li.collaborator .initials .initials-text .dashicon {
	font-size: 2.5em;
	width: auto;
	height: auto;
	line-height: 0.75em;
	color: #666;
}

.directory_details li.collaborator a:hover .initials, .directory_details li.collaborator a:focus .initials, .directory_details li.collaborator a:active .initials {
	background-color: #ccc;
}

.directory_details li a .initials span.initials-text {
	margin: auto;
	display: block;
	font-size: 4rem;
}

.directory_details .contact-details {
	padding-left: 0;
}

.people-alpha-block {
	display: block;
	width: 100%;
	float: left;
	padding: 2rem 0;
	border-bottom: solid 1px #ccc;
	margin: 2rem 0;
}

.people-alpha-block a, .directory_entry li a {
	text-decoration: underline;
}

.people-alpha-block a:hover, .people-alpha-block a:focus, .people-alpha-block a:active, .directory_entry li a:hover, .directory_entry li a:focus, .directory_entry li a:active {
	text-decoration: none;
}

button.people-similar {
	color: #cc0000;
	border: none;
	background: none;
	padding: 0;
	position: relative;
}

button.people-similar:hover, button.people-similar:focus, button.people-similar:active {
	color: #990000;
}

button.people-similar svg {
	fill: #cc0000;
}

button.people-similar:hover svg, button.people-similar:active svg, button.people-similar:focus svg {
	fill: #990000;
}

.person-single {
	margin-top: 4rem;
	margin-bottom: 8rem;
}

.person-single section#person-header {
	padding-bottom: 4rem;
	border-bottom: solid 1px #ccc;
}

.person-single section {
	margin-bottom: 4rem;
}

.person-single .name {
	font-size: 5.5rem;
}

.person-single .title {
	margin: 1rem 0;
	font-family: 'UniversRoman', arial, sans-serif;
}

.person-single .subgroups {
	margin-bottom: 1.5rem;
	padding-bottom: 1.5rem;
}

.person-single #person-pic {
	padding: 0;
}

.person-single #person-pic img {
	margin: 0 2rem 1rem 2rem;
	width: 100%;
	max-width: 300px;
}

@media screen and (min-width: 992px) {
	.person-single #person-pic img {
		margin: 0 0 1rem 0;
		width: 100%;
		max-width: 100%;
	}
}

@media screen and (min-width: 992px) {
	.person-single .contact-details {
		column-count: 2;
		column-gap: 6rem;
	}
}

.person-single .contact-details {
	margin-top: 2rem;
	margin-bottom: 1.5rem;
	padding-bottom: 1.5rem;
	padding-left: 0;
}

#directory-index .contact-details {
	padding-left: 0;
}

.contact-details li:before {
	display: none;
}

.contact-details a {
	text-decoration: underline;
}

.contact-details a:hover, .contact-details a:focus, .contact-details a:active {
	text-decoration: none;
}

.person-single .person-nav-container {
	line-height: 1rem;
	padding: 1rem 0 2rem 0;
	margin-bottom: 2rem;
}

.person-single .person-nav {
	display: inline-block;
	padding-left: 1rem;
	margin-bottom: 0;
}

.person-single .person-nav-label {
	float: left;
	display: block;
	padding: 1rem 0rem;
	text-transform: uppercase;
	font-size: 0.9em;
	font-weight: bold;
}

.person-single .person-nav li {
	float: left;
}

.person-single .person-nav li:before {
	display: none;
}

.person-single .courses {
}

.person-single .courses li, .person-single .orgs li, .person-single .degrees li {
	margin: 0.5rem 0;
}

.person-single .courses li:before, .person-single .orgs li:before, .person-single .degrees li:before, .collaborators li:before {
	display: none;
}

.person-single li a {
	text-decoration: underline;
}

.person-single li a:hover, .person-single li a:focus, .person-single li a:active {
	text-decoration: none;
}

.person-single .course_number {
	font-weight: bold;
	font-family: 'UniversRoman', arial, sans-serif;
}

.person-single .person-section-heading {
	font-size: 1.75rem;
	font-family: 'UniversRoman', arial, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	margin: 2rem 0 1rem 0;
}

.person-single .degree_type {
	font-weight: bold;
	font-family: 'UniversRoman', arial, sans-serif;
}

.person-single .org_name {
	font-weight: bold;
	font-family: 'UniversRoman', arial, sans-serif;
}

ul.collaborators {
	display: block;
	width: 100%;
	padding-left: 0;
	/*column-count: 4;
	column-gap: 2rem; */
}

li.collaborator {
	display: block;
	text-align: center;
}

li.collaborator a {
	display: flex;
	flex-direction: column;
	float: left;
	width: 15rem;
	text-align: center;
	margin: 1rem 0;
	text-decoration: none;
}

@media screen and (min-width: 992px) {
	.person-single li.collaborator a {
		width: 50%;
	}
}

@media screen and (min-width: 1200px) {
	.person-single li.collaborator a {
		width: 33.333333%;
	}
}

li.collaborator img {
	width: 10rem;
	height: 10rem;
	background-color: #f2f2f2;
	margin: auto;
}

.person-single .initials {
	width: 10rem;
	height: 10rem;
	background-color: #f2f2f2;
	border: solid 1px #ccc;
	display: flex;
	margin: auto;
}

.person-single li.collaborator a:hover .initials, .person-single li.collaborator a:focus .initials, .person-single li.collaborator a:active .initials {
	background-color: #ccc;
}

.person-single li a .initials span.initials-text {
	margin: auto;
	display: block;
	font-size: 4rem;
}

.person-single li a .initials span.initials-text .dashicons {
	font-size: 1.5em;
	width: auto;
	height: auto;
	line-height: 0.75em;
	color: #666;
}

li.collaborator a .collaborator-name {
	text-decoration: underline;
	display: block;
	margin-top: 1rem;
}

li.collaborator a:hover .collaborator-name, li.collaborator a:focus .collaborator-name, li.collaborator a:active .collaborator-name {
	text-decoration: none;
}

.compact_toggle {
	padding: 1rem;
}

div.directory_entry {
	min-height: 12em !important;
}