.resumes {
	display: grid;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: auto;
	grid-column-gap: 20px;
	grid-row-gap: 15px;
}
.resume {
	border-radius : 20px;
	border : 1px solid var(--navy);
	display : flex;
	flex-direction : column;
	font-size : 1rem;
	line-height : 1.15;
}
.resume > * {
	margin-bottom : 0;
}
.resume h3 {
	border-radius : 20px 20px 0 0;
	background-color : var(--navy);
	color : #ffffff;
	margin-bottom : 0;
	padding : 30px 25px 20px 25px;
}
.resume p.job-title {
	background-color : var(--coral);
	color : #ffffff;
	padding : 10px 25px;
}

.resume .email {
	margin-top : auto;
	padding : 25px 25px 0 25px;
}
.resume .linkedin {
	display : inline-block;
	margin-top : 10px;
	margin-bottom : 10px;
	padding : 0 25px;
}
.resume .linkedin img {
	max-width : 100px;
}
.resume .phone {
	padding : 0 25px 20px 25px;
}
.resume .download-resume {
	border-radius : 0 0 20px 20px;
}
.resume > .executive-summary {
	padding : 25px 25px 0 25px;
	height : 140px;
	overflow : hidden;
	position : relative;
	transition : height 0.5s;
}
/* .resume > .executive-summary.toggled {
	height : auto;
} */
.resume > .executive-summary .read-more {
	position : absolute;
	background: linear-gradient(0deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%);
	/* background : red; */
	color : var(--coral);
	font-weight : 400;
	height : 50px;
	bottom : 0;
	z-index : 2;
	cursor : pointer;
	width : auto;
	line-height : 1;
	display : flex;
	flex-direction : column;
	justify-content : flex-end;
	left : 25px;
	right : 25px;
}
.resume > .executive-summary .read-more:hover {
	text-decoration : underline;
}
/* .resume > .executive-summary.toggled .read-more {
	display : none;
} */

.resume-filters {
	background-color: var(--white-smoke);
	padding-top : 40px;
	padding-bottom : 40px;
	position : relative;
	margin-bottom : 60px;
}
.rf-options {
	display : flex;
	flex-wrap : wrap;
	row-gap : 20px;
	column-gap : 20px;
}
.rf-options .radio-wrapper {
	position : relative;
	line-height : 0;
}
.rf-options h3 {
	margin-bottom : 0;
}
.rf-options .button {
	padding : 15px 15px;
}
.rf-options .radio-wrapper label {
	display : inline-block;
	-webkit-appearance: none;
	color : var(--navy) !important;
	font-weight : 400;
	border : 2px solid white;
	background-color : white;
	padding : 15px 15px;
	border-radius : 5px;
	line-height : 1;
	text-transform : uppercase;
	text-decoration : none !important;
	vertical-align : baseline;
	font-size : 1rem;
	text-align : center;
	cursor : pointer;
}
.rf-options .radio-wrapper input:focus + label,
.rf-options .radio-wrapper input:hover + label {
	background-color : var(--sky-blue);
	border-color : var(--navy);	
}
.rf-options .radio-wrapper input {
	position : absolute;
	width : 100%;
	height : 100%;
	top : 0;
	left : 0;
	opacity : 0;
	cursor : pointer;
}
.rf-options .radio-wrapper input:checked + label {
	background-color : var(--sky-blue);
	border-color : var(--navy);
}
@media screen and ( max-width : 1200px ){
	.resumes {
		grid-template-columns: repeat(2, 1fr);
	}	
}
@media screen and ( max-width : 720px ){
	.resumes {
		grid-template-columns: repeat(1, 1fr);
	}	
}