@charset "UTF-8";
/* CSS Document */

@media screen and (min-width: 950px) {

	h1 {
		font-size: 4.5em;
	}
	
	p {
        font-size: 1.2em;
		max-width: 850px;
    }
	
	nav #active,
	nav .menu-btn,
	nav .close {
		display: none;
	}
	
	nav .wrapper {
		display: contents;
	}
	
	nav .wrapper ul {
		position: relative;
		float: right;
		text-align: right;
		margin-top: 50px;
		transform: none;
		top: 0;
		left: 0;
		margin-right: 50px;
	}
	
	nav .wrapper ul li {
		display: inline;
	}
	
	nav .wrapper ul li a {
		font-size: 1.2em;
		padding: 5px 10px;
		text-transform: uppercase;
	}
	
	nav .wrapper ul li a:hover {
		color: white;
		opacity: 0.6;
		transition: all 0.7s ease-in-out;
	}
	
	header {
		text-align: left;
	}
	
	header h1 {
		margin-left: 50px;
		margin-right: 100px;
	}
	
	header p {
		margin-left: 50px;
		margin-right: 100px;
	}
	
	header ul {
		justify-content: left;
		margin-left: 50px;
	}
	
	header li {
		font-size: 1.2em;
	}
	
	#books p {
		max-width: 650px;
	}
	
	#books .book-img img {
        height: 250px;
    }
	
	#books .caption {
        margin-left: 20px;
        padding-top: 20px;
        width: 250px;
        height: 230px;
    }
	
}

@media screen and (min-width: 1710px) {
	
	h1 {
		font-size: 6.5em;
	}
	
	p {
        font-size: 1.2em;
		max-width: 850px;
    }
	
	#books {
		margin-bottom: -200px;
	}
	
	#books .flex-box {
		flex-direction: row;
		justify-content: center;
		width: 1000px;
	}
	
	#books .flex-box-item {
		flex-direction: column;
		justify-content: center;
		text-align: center;
	}
	
	#books .book-img img {
		width: 250px;
        height: 375px;
    }
	
	#books .caption {
		margin-left: 0;
		padding-right: 10px;
        padding-top: 20px;
        width: 250px;
        height: 230px;
    }
	
	#books .flex-box-item .disabled-button {
		width: 135px;
		margin-top: 10px;
		margin-left: 60px;
	}
	
	#books .caption p {
		font-size: 1.1em;
	}
	
	#interview {
		margin-top: 100px;
		margin-bottom: 100px;
	}
	
}