/************ Directory ************/

.directory-teaser {
	font-size: 1em;
	}

/*** Alumni ***/

.alumni .fas {
	color: #FEBC11; /* UCSB Gold */
	}

.alumni h2 {
	margin: 0 0 20px 0;
	}

/*** Directory Icons ***/

.directory-fa-icons a {
	color: #FEBC11;
	}

.directory-fa-icons a:hover,
.directory-fa-icons a:focus {
	color: #e5b53d;
	}
	
.page-node-type-people .region-content .fab,
.page-node-type-people .region-content .fas,
.page-node-type-people .region-content .icon {
	color: #FEBC11; /* UCSB Gold */
	}

/*** Directory Button ***/

.directory-button a {	/* Button layout */
	border-radius: 4px;
	font-size: .75em !important;
	text-decoration: none !important;
	float: left;
	padding: 2px 4px !important;
	margin: 2px 4px 2px 0 !important;
	}
 	
.directory-button a { 
  	color: #000 !important;
  	background: #DCE1E5; /* Default background color */
  	text-decoration: none;
 	}

.directory-button a:hover,
.directory-button a:focus {
	border: none;
	color: #fff !important;
  	background: #5E707E; /* Hover background color */
	text-decoration: none;
	}

/*** Views ***/

/* Alumni */

.alumni {
  	overflow-wrap: break-word;
	}

.alumni .views-row {
	padding: 10px 0;
	border-bottom: 1px solid #DCE1E5;
	overflow: hidden;
	clear: both;
	}
	
.alumni .views-row:last-of-type {
	padding: 10px 0;
	border-bottom: none;
	}

/* Directory Teaser */

.directory-teaser {
  	overflow-wrap: break-word;
	}

.directory-teaser .views-row {
	padding: 10px 0;
	border-bottom: 1px solid #DCE1E5;
	overflow: hidden;
	clear: both;
	}
	
.directory-teaser .views-row:last-of-type {
	padding: 10px 0;
	border-bottom: none;
	}

/* Grid Teaser */	

.grid-teaser .views-field-title {
	padding: 6px 0 0 0;
	margin: 0;
	}
	
/* People Teaser */	

.people-teaser .views-row {
	padding: 10px 0;
	}
	
.people-teaser .field--name-body p,
.people-teaser .field--name-field-job-title {
	padding: 0;
	margin: 0;
	}	

/****** Begin breakpoint: desktop ******/
  
@media all and (min-width: 60.0625em) {

/* Alumni View */

.alumni .views-view-grid .views-col {
	float: left;
    width: 25%;  	
  	margin: 0;
    padding: 4px 4px 4px 4px;
	}

/* Directory Teaser */

.directory-teaser .group-first {
	float: left;
    width: 10%;  	
  	margin: 0;
    padding: 4px 8px 4px 4px;
	}

.directory-teaser .group-second {
	float: left;
    width: 18%;  	
   	margin: 0;
    padding: 4px;
	}
	
.directory-teaser .group-third {
	float: left;
    width: 42%;  	
  	margin: 0;
    padding: 4px;
	}
	
.directory-teaser .group-fourth {
	float: left;
    width: 30%;  	
  	margin: 0;
    padding: 4px;
	}

/* Grid Teaser */

.grid-teaser .views-col .views-field-field-image {
	width: 96%;
	}

.grid-teaser .views-col {
  	width: 25%;
	}

.grid-teaser .views-col {
  	margin-bottom: 20px;
	}

/* People Teaser */

.people-teaser .group-left {
	width: 10%;
  	margin: 0;
    padding: 0;
	}

.people-teaser .group-right {
    width: 90%;  	
  	margin: 0;
    padding: 0 0 0 10px; 
	}
	
/* People Node */	

.page-node-type-people .ds-2col-stacked .group-left {
  	float: left;
    width: 30%;  	
  	margin: 0;
    padding: 0 0 20px 0; 
	}

.page-node-type-people .ds-2col-stacked .group-right {
  	float: left;
  	width: 70%;
  	margin: 0;
    padding: 0 0 20px 20px; 
	}

}
/****** End breakpoint: desktop ******/

/****** Begin breakpoint: tablet ******/
  
@media all and (min-width: 45.0625em) and (max-width: 60em) {

/* Alumni View */

.alumni .views-view-grid .views-col {
	float: left;
    width: 33.333%;  	
  	margin: 0;
    padding: 4px 4px 4px 4px;
	}

/* Directory Teaser */

.directory-teaser .group-first {
	float: left;
    width: 14%;   	
  	margin: 0;
    padding: 4px 8px 4px 4px;
	}

.directory-teaser .group-second {
	float: left;
    width: 26%;   	
   	margin: 0;
    padding: 4px;
	}
	
.directory-teaser .group-third {
	float: left;
    width: 60%; 	
  	margin: 0;
    padding: 4px;
	}
	
.directory-teaser .group-fourth {
	float: none;
    width: 100%;  	
  	margin: 0;
    padding: 4px;
	}

/* Grid Teaser */

.grid-teaser .views-col .views-field-field-image {
	width: 96%;
	}

.grid-teaser .views-col {
  	width: 50%;
	}

.grid-teaser .views-col {
  	margin-bottom: 20px;
	}

/* People Teaser */

.people-teaser .group-left {
	width: 20%;
  	margin: 0;
    padding: 0;
	}

.people-teaser .group-right {
    width: 80%;  	 	
  	margin: 0;
    padding: 0 0 0 10px; 
	}
	
/* People Node */	

.page-node-type-people .ds-2col-stacked .group-left {
  	float: left;
    width: 40%;  	
  	margin: 0;
    padding: 0 0 20px 0; 
	}

.page-node-type-people .ds-2col-stacked .group-right {
  	float: left;
  	width: 60%;
  	margin: 0;
    padding: 0 0 20px 20px; 
	}

}
/****** End breakpoint: tablet ******/

/****** Begin breakpoint: mobile ******/
@media all and (max-width: 45em) {

.view-directory .views-row {
	margin: 0 0 5px 0;
	}

/* Alumni View */

.alumni .views-view-grid .views-col {
	float: left;
    width: 100%;  	
  	margin: 0;
    padding: 4px 4px 4px 4px;
	}

/* Directory Teaser */

.directory-teaser .group-first {
	float: left;
    width: 28%;   	
  	margin: 0;
    padding: 4px 8px 4px 4px;
	}

.directory-teaser .group-second {
	float: left;
    width: 72%;  	
   	margin: 0;
    padding: 4px;
	}
	
.directory-teaser .group-third {
	float: none;
    width: 100%;  	
  	margin: 0;
    padding: 4px;
	}
	
.directory-teaser .group-fourth {
	float: none;
    width: 100%;  	
  	margin: 0;
    padding: 4px;
	}

/* Grid Teaser */

.grid-teaser .views-col .views-field-field-image {
	width: 100%;
	}

.grid-teaser .views-col {
	width: 100%;
	}

.grid-teaser .views-col {
  	margin-bottom: 20px;
	}

/* People Teaser */

.people-teaser .group-left {
	width: 100%;
  	margin: 0;
    padding: 0 0 10px 0; 
	}

.people-teaser .group-right {
    width: 100%;  	 	
  	margin: 0;
    padding: 0 0 0 0; 
	}
	
/* People Node */	

.page-node-type-people .ds-2col-stacked .group-left {
  	float: none;
    width: 100%;  	
  	margin: 0;
    padding: 0 0 10px 0;
	}

.page-node-type-people .ds-2col-stacked .group-right {
  	float: none;
  	width: 100%;
  	margin: 0;
    padding: 0; 
	}

}
/****** End breakpoint: mobile ******/