/* CSS Document */

main h2 { letter-spacing: -0.01em; }

#heres-how-section { margin: 100px 0; }
#heres-how-section .row .col-12 > div { width: 100%; height: 100%; background-image: url('/img/redesign/adventures_by_disney_llama.jpg'); background-size: cover; background-position: center; border-radius: 16px; }
#heres-how-section h4 { font-size: 21px; color: #1E3A74; line-height: 1.4; margin-bottom: 1.2rem; }
#heres-how-section p { font-size: 16px; font-weight: 300; line-height: 1.4; }
#heres-how-section a { font-size: 16px; font-weight: 500; line-height: 1.4; color: #A440BF; }
#heres-how-section a:hover { color: #74108F; }

#points-chart-section h2 { margin-bottom: 40px; }
#points-chart-section { padding: 0 50px; }
#points-chart-section table { margin-bottom: 50px; }
#points-chart-section table th { background: #EBDBF0; border: 1px solid #9698934D; text-align: center; vertical-align: middle; padding: 16px 10px; width: 16.666%; }
#points-chart-section table tr:first-child th { padding-top: 25px; padding-bottom: 25px; border-top: 0; }
#points-chart-section table tr:last-child th { border-bottom: 0; }
#points-chart-section table td { background: none; border: 1px solid #9698934D; text-align: center; padding: 12px 10px; }
#points-chart-section table th:first-child,
#points-chart-section table td:first-child { text-align: left; border-left: 0; padding-left: 50px; vertical-align: middle; }
#points-chart-section table th:last-child,
#points-chart-section table td:last-child { border-right: 0; }
#points-chart-section table tr:nth-child(2) td:nth-child(n+2) { font-size: 14px; line-height: 1.33; vertical-align: middle; padding-left: 14px; padding-right: 14px; }

#points-chart-section table tr:first-child th:first-child { border-radius: 16px 0 0 0; }
#points-chart-section table tr:last-child th:first-child { border-radius: 0 0 0 16px; }
#points-chart-section table tr:first-child th:last-child { border-radius: 0 16px 0 0; }
#points-chart-section table tr:last-child th:last-child { border-radius: 0 0 16px 0; }

@media ( max-width: 991px ) {
	#heres-how-section .row:first-child > div { margin-bottom: 30px; }
	#heres-how-section .row:first-child .col-12 > div { height: 40vw; background-position: top 70% center; background-size: cover; }
}
@media ( max-width: 767px ) {
	#heres-how-section .row:first-child .col-12 > div { height: 50vw; }
	#points-chart-section { padding: 0 5vw; }
	#points-chart-section h2 { margin-bottom: 40px; }
	#points-chart-section .table-scroll-x { width: 100%; overflow-x: auto; margin-bottom: 50px; }
	#points-chart-section .table-scroll-x table { width: 1200px; margin-bottom: 0; margin-top: 0; }
}