/* Accessible at /account/  */

.profile-header {
	text-align: center;
	margin-bottom: 60px;
}

.profile-header-container {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

@media (max-width: 991px) {
	.profile-header-container {
		flex-direction: column;
	}
}

@media (min-width: 768px) {
	.profile-header-container {
		margin: 4rem 4rem 2rem;
	}
}

@media (min-width: 769px) {
	.profile-header-container {
		margin: 4rem 10rem 2rem;
	}
}

.profile-header .page-title {
	margin-bottom: 40px;
	word-wrap: break-word;
}

.profile-header .participant-info {
	margin-top: 25px;
}

.profile-header .user-bio {
	margin-bottom: 15px;
}

.profile-header .follow-button {
	padding: 10px 40px;
	border-color: #ee283c;
	background-color: transparent;
	text-transform: uppercase;
	font-weight: 600;
}

.profile-header .follow-button:hover {
	background-color: #ee283c;
	color: white;
}

.profile-header .avatar img {
	border-radius: 50%;
	width: 260px;
	height: 260px;
}

@media (max-width: 900px) and (min-width: 767px) {
	.profile-header .avatar {
		width: auto;
		margin-left: 10px;
		margin-right: 0;
	}
}

.can-access-interview-list h3,
.private-interview-list h3 {
	margin-bottom: 30px;
}

.can-access-interview-list h3 span,
.private-interview-list h3 span {
	font-weight: 400;
}

/* Account utilities */
.account-utilities {
	font-size: 25px;
}

.account-utilities li {
	position: relative;
}

.account-utilities .glyphicon {
	background: #d8e0e1;
	border-radius: 50%;
	padding: 10px;
	color: white;
}

.account-utilities a:hover .glyphicon {
	color: #8b99a1;
}

.utilities-toggle.-open {
	position: relative;
}

.utilities-toggle.-open .glyphicon {
	color: #ee283c;
	border-radius: 50% 0 0 50%;
}

.utilities-toggle.-open .glyphicon:before {
	content: "\e014";
}

.extra-utilities {
	display: none;
	position: absolute;
	width: 250px;
	top: 1px;
	left: 40px;
	background: #d8e0e1;
	padding: 0 10px 10px;
	margin: 0;
	z-index: 10;
	animation: slideInLeft 200ms;
}

.extra-utilities a {
	font-size: 16px;
	width: 100%;
	border-bottom: 1px solid #8b99a1;
	color: #6a8290;
	padding-bottom: 5px;
}

.extra-utilities a:hover {
	color: #ee283c;
}

.extra-utilities li:last-of-type a {
	border-bottom: none;
}

.extra-utilities.-open {
	display: block;
}

/* Profile grid view */
.interview-container {
	display: flex;
	flex-wrap: wrap;
}

/*--- Create Interview Square ---*/
.create-interview-square {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #d8e0e1;
	padding-bottom: 100%;
	position: relative;
}

.create-interview-square a {
	text-align: center;
	color: #8b99a1;
	text-transform: uppercase;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	align-self: center;
	justify-content: center;
}

.create-interview-square span {
	color: red;
	width: 100%;
	font-size: 22px;
}

/* My account home grid */
.my-account-home .interview {
	margin-bottom: 40px;
}

.my-account-home .interview .edit-profile {
	text-transform: uppercase;
}

.my-account-home .community {
	margin-bottom: 30px;
}

.my-account-home .unavailable {
	display: flex;
	justify-content: center;
	align-items: center;
}

.my-account-home .unavailable p {
	margin: 0;
}

.my-account-home .tab-content > div {
	margin-bottom: 30px;
}

.message-container li a {
	cursor: pointer;
}
