/*
    plagiarism (noun)

        - Cambridge Dictionary:
        the process or practice of using another person's ideas or work and pretending that it is your own

        - Merriam-Webster:
        the act of using another person's words or ideas without giving credit to that person
    
        See also: https://www.plagiarism.org/article/what-is-plagiarism

    Please do NOT copy, redistribute or use any part of my work without permission,
    be it content or design, including texts, graphics and code.
    Any resources used in making this site are listed and credited at the end of the site in the credits section.
    If you have questions, ask.
*/

@font-face {
	font-family: "ZallmanCaps";
	src: url(zallmancaps.ttf);}

::-webkit-scrollbar {
	width: 13px;
	height: 13px;}

::-webkit-scrollbar-thumb {
	background: #2e2c55;}

::-webkit-scrollbar-track {
	background: #000;}

::selection {
	color: #d5d0ea;
	background: #565377;}

::-moz-selection {
	color: #d5d0ea;
	background: #565377;}

/* -----------------------
FRAME
----------------------- */

body {
	margin: 0;
	background: #0c1423 url(bg.jpg);}

#frame {
	width: 750px;
	margin: 0 auto;
	padding: 0 40px;

	border-right: 30px solid #000;
	border-left: 30px solid #000;

	background: #e5e5e5 url(bgcontent.jpg);
	color: #667289;
	font-family: "Noto Serif", serif;
	font-size: 14px;
	line-height: 26px;
	text-align: left;}

header {
	height: 500px;
	background: url(gwendolyn.png) no-repeat top center;}

nav {
	margin-top: -10px;
	margin-bottom: -20px;
	line-height: 40px;
	text-align: center;}

nav ul li {
	display: inline;
	list-style-type: none;
	padding-right: 40px;}

nav a {
	color: #9447b1;
	font-family: "Quando", serif;
	font-size: 17px;
	font-weight: normal;
	text-decoration: none;
	text-transform: uppercase;
	transition: 0.5s;}

nav a:hover {
	color: #15225a !important;}

footer {
	padding-top: 40px;
	padding-bottom: 20px;
	text-align: center;}

/* -----------------------
DESIGN
----------------------- */

h1 {
	margin: 50px auto 25px;

	color: #0e183c;
	font-family: "Quando", serif;
	font-size: 30px;
	font-weight: normal;
	letter-spacing: 1px;
	text-align: center;}

h2 {
	margin: 50px auto 25px;

	color: #3f2a76;
	font-family: "Quando", serif;
	font-weight: normal;
	font-size: 24px;
	letter-spacing: 1px;
	text-align: center;}

p:first-of-type::first-letter {
	float: left;
	margin-left: -2px;
	padding: 9px 5px 0 0;

 	color: #0b1222;
    font-family: "ZallmanCaps", serif;
	font-size: 48px;
	font-weight: normal !important;}

p {
	margin-bottom: 20px}

b, strong {
	color: #193665;}

i, em {
	color: #3147b9;}

u {
	color: #5c7eb4;
	text-decoration: none;}

u:before {
	content: "\2039";}

u:after {
	content: "\203A";}

.def {
    border-bottom: 2px dotted #8b52c2;}

a {
	color: #8b52c2;
	text-decoration: none;
	transition: 0.8s;}

a:hover {
	color: #be2cc4;}

.tooltip {
	display: none;
	position: absolute;

	background: url(frame.jpg);
	border-radius: 5px;
	padding: 5px 14px;
	color: #9da3d0;
	font-family: "Vollkorn", serif;
	font-size: 15px;
	max-width: 200px;}

/* -----------------------
SUBNAVIGATION
----------------------- */

table.index {
	margin: 30px auto;
	padding: 10px 30px;
	width: 90%;

	background: url(bgquote.jpg);
	border-style: solid;
	border-width: 0 20px;
	border-image: url(frame.jpg) 0 30 repeat;}

.lnav {
	width: 40%;
	text-align: right;
	vertical-align: top;}

.rnav {
	width: 55%;
	text-align: left;
	vertical-align: top;}

.next {
	margin: 40px auto auto;
	padding-right: 20px;

	font-size: 15px;
	font-style: italic;
	text-align: right;}

/* -----------------------
INSERTS
----------------------- */

.poem {
	color: #4a5ab1;
	font-family: "Vollkorn", serif;
	font-size: 17px;
	text-align: center;}

.poems {
	display: block;
	margin: 15px auto 25px;

	color: #7b4db6;
	font-size: 16px;
	font-style: italic;}

.poems:before {
	content: "\2014 \2009";}

.poems:after {
	content: "\2009 \2014";}

blockquote {
	margin: 30px auto;
	padding: 10px 30px;
	width: 70%;
	
	background: url(bgquote.jpg);
	color: #8d73c7;
	font-weight: normal;
	line-height: 26px;

	border-style: solid;
	border-width: 0 20px;
	border-image: url(frame.jpg) 0 30 repeat;}

blockquote b {
	color: #0e183c;
	font-weight: bold;}

.source {
	display: block;
	margin: 10px auto auto;

	color: #000;
	font-size: 12px;
	text-align: right;}

.source:before {
	content: "\2014 \2009";}

#content > ul {
	width: 70%;
	margin: 30px auto;
	padding: 10px 10px 10px 50px;

	list-style-type: circle;

	background: url(bgquote.jpg);
	border-style: solid;
	border-width: 0 0 0 20px;
	border-image: url(frame.jpg) 0 30 repeat;}

ul#profile {
	width: 38%;
	margin: 30px auto 30px 81px;
	padding: 10px 10px 10px 50px;

	list-style-type: circle;

	background: url(bgquote.jpg);
	border-style: solid;
	border-width: 0 0 0 20px;
	border-image: url(frame.jpg) 0 30 repeat;}

img#profile {
	float: right;
	margin: 10px 83px auto 15px;
	padding: 14px;

	background: url(frame.jpg);}

/* -----------------------
TABLES
----------------------- */

table#skill, table#ability {
	margin: 20px auto;
	padding: 10px 20px;
	width: 100%;

	border-spacing: 5px;}

table#skill td, table#ability td {
	padding: 1px 10px;
	background: url(bgquote.jpg);}

th.when {
	padding: 0 10px;
	background: url(frame.jpg);
	color: #9da3d0;
	font-weight: normal;
	letter-spacing: 1px;
	text-transform: uppercase;}

td.name  {
	color: #193665;
	font-weight: bold;
	vertical-align: top;}

td.blank {
	background: none !important;}

td.no {
	width: 24%;}

td.adescrip {
	width: 72%;}

/* -----------------------
IMAGES
----------------------- */

img.left {
	float: left;
	margin: 7px 15px auto 0;
	padding: 14px;

	background: url(frame.jpg);}

img.right {
	float: right;
	margin: 7px 0 auto 15px;
	padding: 14px;

	background: url(frame.jpg);}

img.display {
	padding: 14px;
	background: url(frame.jpg);}

.center {
	margin: 30px auto 20px;
	letter-spacing: 20px;
	text-align: center;}

.gallery {
	margin: 30px auto 20px;
	width: 550px;
	letter-spacing: 10px;
	line-height: 39px;
	text-align: left;}

.gallery img {
	padding: 8px;
	background: url(frame.jpg);
	width: 80px;
	height: 185px;}

.gallery a:focus {
    outline: 0 !important;}

img.buttons {
	background: url(bgquote.jpg);
	padding: 4px;}

img.linkout {
	float: left;
	margin: 0 10px auto 0;

	background: url(bgquote.jpg);
	padding: 5px;}

img.linkout:hover {
	background: url(frame.jpg);}