/* FAQ style rules.
 */

.faq-page .entry-title {
	margin-top: 60px;
	margin-bottom: 20px;
}

.faq__container {
	margin-top: 60px;
}

.faq__title {
	position: relative;
	padding-top: 30px;
	padding-bottom: 15px;
	margin-top: 15px;
	margin-bottom: 0;
	border-top: 1px solid var( --ct-color-middle-gray );
	font-weight: 500;
	font-size: 2rem;
	line-height: 1.5;
}

.faq__title:first-child {
	padding-top: 0;
	margin-top: 0;
	border-top-width: 0;
}

.faq__title:hover {
	cursor: pointer;
}

.faq__title::after {
	content: url( ../images/icons/cross.svg );
	position: absolute;
	/* plus half of top padding and minus bottom padding */
	top: calc( 50% + 30px / 2 - 15px / 2 );
	right: 0;
	transform: translateY( -50% ) rotate( 45deg );
	transition: transform .3s;
}

.faq__title:first-child::after {
	top: 50%;
}

.faq__title.ui-state-active::after {
	transform: translateY( -50% ) rotate( 0deg );
}

.faq__content {
	font-size: 1.6rem;
	line-height: 1.5;
}