/* General */
h1 { font: 700 28pt 'Arial Rounded', 'Arial', sans-serif; text-shadow: none; text-transform: none; margin: 18px auto 50px; color: #434343; }
main { margin: 0 0 80px; }

/* Search */
#search-holder p { font-weight: 600; text-align: center; font-size: 14pt; }
#search-holder p:last-of-type { margin: 11px 0 0; }
#reminder p { color: #42bfb5; font-weight: 400; font-size: 13pt; }
#search { border: 1.5px solid #959595; width: 310px; position: relative; background: #fff; border-radius: 21px/23px; margin: auto; padding: 0 31px 0 0; box-sizing: border-box; max-width: 90%; }
#search:after { content: '\e803'; color: #42bfb5; display: block; font: 13pt 'halza', sans-serif; position: absolute; right: 12px; top: 10px; }

/* Results */
main section { max-width: 90%; width: 960px; margin: 50px auto 0; }
main h2 { color: #42bfb5; border-bottom: 2px solid #42bfb5; font-size: 14pt; padding: 15px 20px; margin: 0; }
main section div { border-bottom: 1px solid #42bfb5; }
main h3 { position: relative; font: 400 13pt 'Arial', sans-serif; padding: 13px 43px 13px 20px; cursor: pointer; }
main h3:after { content: ' '; position: absolute; width: 14px; height: 24px; background: no-repeat url( '../../images/pages/faq/bg/arrow.png' ); transform-origin: 50%; transition: all .4s; display: block; right: 17px; top: 12px; }
main h3.active:after { transform: rotateZ( 90deg ); }
main aside { background: #d3eee8; padding: 13px 20px; display: none; }
main aside > *:last-child { margin: 0; }

@media (max-width: 550px) {
	h1 { margin: 18px auto 30px; font-size: 19pt; text-align: center; }
	
	#search-holder p { font-size: 13pt; }
	#reminder p { font-size: 11pt; }
	#search { width: 250px; }
	
	main section { margin: 30px auto 0; }
}

@media (max-width: 440px) {
	main { margin: 0 0 50px; }
	
	#search-holder p { font-size: 12pt; }
	
	main h2 { font-size: 13pt; }
	main h3, main aside { font-size: 11pt; }
}