body { font-size: 19px; line-height: 31px; font-weight: 400; font-family: 'Droid Sans', sans-serif; color: #000; text-align: center; }

h1, h2, h3, h4, h5, h6 { font-weight: 700; font-family: 'Droid Sans', sans-serif; }

p { margin: 0; font-size: 19px; line-height: 31px; }
p + p,
p + h3 { margin-top: 31px; }
p a:hover { text-decoration: underline;        }

div.wrapper { max-width: 1024px; text-align: center; margin: 0 auto; }

header {  color: #fff; text-align: center; padding-top: 35px; padding-bottom: 60px; background: url('../images/top_image.jpg') no-repeat 50% 50%; background-size: cover; }
header h1 { font-size: 60px; line-height: 61px; color: #fff; }
header h5 { font-size: 19px; line-height: 31px; color: #c6c6c5; margin-bottom: 1.5em; }
header h6 { font-weight: 400; font-size: 36px; line-height: 44px; color: #fff; margin-bottom: 1.5em; }

a.button { font-size: 16px; line-height: 20px; font-weight: 700; display: inline-block; color: #FFF; height: 50px; margin: 0 10px 1.5em 10px; text-decoration: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
a.button-1:focus,
a.button-1 { background: #eb0029; width: 200px;  }
a.button-1:hover { background: #ac0029 }
a.button-2:focus,
a.button-2 { background: #006ff0; margin: 0 20px; }
a.button-2:hover { background: #00308e }
a.button.disabled { background: rgba(0,0,0,.5); opacity: 1; }
a.button.disabled:hover { background:  rgba(0,0,0,.5);  }

.illustration-top { position: absolute; z-index: 100; margin-top: -60px; width: 960px; text-align: right;}

main .content { padding: 60px 0; }
main .content h2 { font-size: 33px; line-height: 40px;  }
main .content h2 + h3 { line-height: 40px;  }
main .content h3 { font-size: 22px; line-height: 31px; }
main #qualified h2 {  }
main .content[data-color="yellow"] { background: #ffe83e; }
main .content[data-color="yellow"] p a,
main .content[data-color="white"] p a { color: #eb0029 }
main .content[data-color="gray"] { background: #3b3b3a; color: #FFF;}
main .content[data-color="gray"] p a { color: #ffe83e }

main .content[data-color="yellow"] p a:hover,
main .content[data-color="white"] p a:hover { color: #ac0029 }

main .content .book .row:first-child .columns a:first-child { display: block; text-align: center; min-height: 417px;  }
main .content .book .columns:nth-child(odd) img { margin-top: 60px; }
main .content .book .columns .button { margin-top: 30px; }

main .content#authors img { max-width: 90%; }
main .content .authors p { font-size: 16px; line-height: 24px; }

footer { background: #1d1d1b; border-top: #565655; padding: 1.5em 0 1em 0; text-align: center; }
footer span { display: block; color: #9c9b9b; margin-bottom: 10px; }
footer a:focus,
footer a { color: #9c9b9b; }
footer a:hover { color: #fff; }
footer a img { display: inline; margin: 0 5px 15px 5px; opacity: 0.5; filter: alpha(opacity=50); }
footer a:hover img { opacity: 1; filter: alpha(opacity=100); }

@media screen and (max-width: 64em) {
	.illustration-top { width: 95%; text-align: right; }
}

/* iPad Portrait */
@media screen and (max-width: 64em) and (orientation:portrait) {
	a.button { height: auto; min-height: 50px; width: auto; }
	.illustration-top { width: 728px;  }
	.illustration-top img { width: 150px; }

	main .content .book .row:first-child .columns a:first-child { min-height: 245px; }
}

/* MOBILE */
@media only screen and (max-width: 40em) {
	a.button { height: auto; min-height: 50px; }

	div.wrapper { width: 100%; text-align: center; margin: 0 auto; }
	.illustration-top { display: none;  }

	header {  height: auto;}
	header section { padding-top: 60px; padding-bottom: 60px; }
	header h1 { font-size: 40px; line-height: 46px; color: #fff; }
	header h5 { font-size: 19px; line-height: 31px; color: #c6c6c5; margin-bottom: 1.5em; }
	header h6 { font-weight: 400; font-size: 26px; line-height: 34px; color: #fff; margin-bottom: 1.5em; }

	main .content .authors h2 { margin-top: 60px; }

	main .content .book { margin-top: 30px; }
	main .content .book .row + .row,
	main .content .book .columns:nth-child(even) img { display: none; }
	main .content .book .columns:nth-child(odd) img { margin-top: 0px; }
	main .content .book .columns:nth-child(3) img { margin-top: 60px; }
	main .content .book .row:first-child .columns a:first-child { min-height: 0;  }
	main .content .book .columns .button { margin-top: 30px; }
}