@font-face {
  font-family: Amiri;
  src: url(Amiri.ttf);
}

@font-face {
  font-family: "PT Astra Serif";
  src: url(PT Astra Serif.ttf);
}

body {
    overflow: scroll;
    background-color: #1D1D1D;
}

hr {
    width: 70%;
}

header {
    text-align: right;
    margin-right: 20%;
    margin-top: 5%;
}

header a {
    text-decoration: none;
}

.website_name {
    font-family: "PT Astra Serif", serif;
    font-size: 230%;
    color: #20B2AA;
}

main  {
    width: 70%;
    margin-left: 15%;
    padding: 2%;
}

details summary {
    text-transform: uppercase;
    cursor: pointer;
    list-style-type: none;
    font-family: Amiri, serif;
    font-weight: bold;
    font-size: 150%;
    margin-left: 2%;
    padding-left: 2%;
    border-left: dotted;
    color: #2682B4;
}

ul {
    list-style-type: none;
    font-family: Amiri, serif;
}

ul a {
    text-decoration: none;
    color: #20B2AA;
}

ul li {
    font-size: 140%;
    line-height: 2;
    padding-left: 3%;
}

article {
    font-family: Amiri, serif;
    padding-top: 5%;
}

.book_title {
    text-transform: uppercase;
    font-family: "PT Astra Serif", serif;
    font-weight: bold;
    font-size: 180%;
    color: #2682B4;
}

.book_author {
    font-style: italic;
    font-size: 130%;
    line-height: 0.5;
    color: #198E88;
}

article blockquote {
    border-left: 1px solid;
    font-style: italic;
    font-size: 160%;
    line-height: 1.6;
    padding-left: 2%;
    margin: 7% 2%;
    color: #A5E0DD;
}

article blockquote p {
    margin-bottom: 3%;
}

footer {
    width: 50%;
    margin-left: 20%;
    margin-bottom: 2%;
    /*background-color: #808080;*/
}

footer p {
    font-family: "PT Astra Serif", serif;
    font-size: 120%;
    text-align: left;
}

footer a {
    text-decoration: none;
    color: teal;
}

/*Mobile*/
@media screen and (max-width: 700px) {

    header {
	text-align: right;
	margin-right: 15%;
	margin-top: 5%;
    }

    main  {
	width: 90%;
	margin-left: 5%;
	padding: 2%;
    }

    ul li {
    font-size: 130%;
    line-height: 1.5;
    }

    .book_title {
	font-size: 160%;
    }

    .book_author {
	font-size: 120%;
    }

    article blockquote {
	font-size: 120%;
	line-height: 1.5;
	margin: 10% 5%;
    }

    article blockquote p {
	margin-bottom: 3%;

    footer {
	width: 70%;
	margin-left: 20%;
	/*background-color: #808080;*/
    }

    footer p {
	font-family: Amiri;
	font-size: 100%;
	text-align: right;
	color: #87CEEB;
    }    
}