@media screen and (max-width : 1420px) {
	.wrapper {width: 100%; padding: 0 20px;}
	
	.hero-content {padding: 0 50px 0 0;}
	
	#about-the-book .row-2 .row .content {padding: 0 50px;}
	
	#about-the-book .row-3 {padding-left: 50px; padding-right: 50px;}
	
	.testimonials-grid {padding: 0 10px;}
	
	#about-the-author .content {padding: 0 50px 0 0;}
}

@media screen and (max-width : 1199px) {
	.hero-cover {padding: 0 50px 0 0;}
	
	#about-the-book .row-2 .row .image-1 {width: 60px;}
	#about-the-book .row-2 .row .image-2 {width: 320px;}
	
	.menu-item.icon + .icon {margin: 0 0 0 15px;}
	
	.social-nav p {margin: 0 15px 0 0;}
}

@media screen and (max-width : 1023px) {
	.padding-content {padding: 50px 0;}
	
	#header .content {height: 90px;}
	
	.padding-from-header {padding: 90px 0 0 0;}
	
	.hero-align {height: auto; margin: 140px 0 0 0;}
	.hero-cover {padding: 0;}
	.hero-content {padding: 0;}
	.hero-bg {background-size: auto 100%;}
	
	h1, .h1 {font-size: 4em;}
	
	#about-the-book .row-2 .row + .row {margin: 50px 0 0 0;}
	#about-the-book .row-2 .row .image-2 {width: 220px;}
	#about-the-book .row-2 .row .content {padding: 0 0 0 50px;}
	#about-the-book .row-2 .row:nth-child(2n) .content {padding: 0 50px 0 0;}
	#about-the-book .row-3 {padding-left: 0; padding-right: 0;}
	
	.testimonials-grid {padding: 0;}
	.testimonials-grid-item {width: calc(50% - 50px); margin: 0 25px 50px 25px; padding: 40px 30px;}
}

@media screen and (max-width : 940px) {
	#about-the-author .content {width: 100%; order: 2; padding: 50px 0 0 0;}
	#about-the-author .image {width: 100%;}
	#about-the-author .im {width: 100%;}
}

@media screen and (max-width : 820px) {
	.hero-align {display: block; margin: 110px 0 0 0; padding: 0; text-align: center;}
	.hero-cover {width: 100%; margin: 0 0 30px 0;}
	.hero-cover img {width: 500px;}
	.hero-content {width: 100%;}
	.hero-bg {background-size: 100% auto; background-position: right calc(100% + 300px);}
}

@media screen and (max-width : 767px) {
	h1, .h1 {font-size: 3em; line-height: 120%;}
	h2, .h2 {font-size: 2.5em; line-height: 130%;}
	h3, .h3 {font-size: 1.875em;}
	
	.hero-bg {display: none;}
	.hero-cover img {width: 400px;}
	
	#about-the-book .row-2 .row {display: block;}
	#about-the-book .row-2 .row .images {width: 100%;}
	#about-the-book .row-2 .row .content {width: 100%; padding: 50px 0 0 0 !important;}
	#about-the-book .row-2 .row .image-1 {width: 20%;}
	#about-the-book .row-2 .row .image-2 {width: 60%;}
	#about-the-book .row-3 .button-group > div {display: block;}
	#about-the-book .row-3 .button-group > div + div {margin: 30px 0 0 0;}
	#about-the-book .row-3 .button-group a {min-width: 220px;}
	#about-the-book .row-3 .content {padding: 50px 20px;}
	#about-the-book .row-3 .content:before {background-size: auto 50%;}
	
	.testimonials-grid-item {width: 100%; margin: 0 0 50px 0;}
}

@media screen and (max-width : 680px) {
	.in-middle {width: 100%;}
}

@media screen and (max-width : 567px) {
	.site-logo em {display: block; margin: 5px 0 0 0;}
}

@media screen and (max-width : 467px) {
	.site-logo a {font-size: 1rem;}
	
	#main-menu .button > a {line-height: 50px; padding: 0 20px; font-size: 0.875rem;}
	.mac #main-menu .button > a, .ios #main-menu .button > a {line-height: 64px;}
	#main-menu .order-dropdown .sub-menu a {padding-left: 20px; padding-right: 20px; font-size: 0.875rem;}
	
	#hero .button-group > div {display: block;}
	#hero .button-group > div + div {margin: 30px 0 0 0;}
	#hero .button-group .button > a, #hero .button-group a.button {width: 100%;}
	
	.social-nav p {display: block; margin: 0 0 15px 0;}
}

@media screen and (max-width : 374px) {
	#main-menu {display: none;}
}