:root{
<link rel="stylesheet" type="text/css" href="http://buchanan.neocities.org/index.html">
	--accent-color:#ffc6ec;
	--light-color:#ffffff;
	--dark-color:#000000;
	--cross-margin:-165px;
	--title-size:40px;
}

	
body{
	background-color:var(--dark-color);
	margin:150px;
}
	
*{
	padding:0; margin:0;
	-webkit-hyphens:auto;
	hyphens:auto;
}
	
p + p{margin-top:1.1em; padding:0;}
	
h1,h2{
	margin-bottom:10px;
}
	
li{
	list-style-type:none;
	list-style-position:inside;
	padding-left:15%;
}
	
li:before{
	content:'\25A0';
	display:inline-block;
	margin-right:4px;
	-webkit-transform:transform:translateX(1px) translateY(5px) rotateZ(45deg);
	-ms-transform:transform:translateX(1px) translateY(5px) rotateZ(45deg);
	transform:translateY(1px) translateX(2px) rotateZ(45deg) scale(0.7,0.7);
}
	
a{
	text-decoration:none;
	text-shadow:none;
	color:var(--accent-color);
	-webkit-transition:0.3s ease-in-out;
	transition:0.3s ease-in-out;
}
	
a:hover{
	color:var(--accent-color);
}
	
	/* containers */
	
.container{
	width:694px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	background-color:var(--light-color);
	color:var(--dark-color);
	box-shadow:0px 0px 2px 6px var(--light-color);
	font-family:segoe ui,sans serif;
}
	
.contain-first{
	height:526px;
	margin-top:10vh;
}
	
.contain-second{
	height:35px;
	margin-top:25px;
}
	
.wrap-content,.wrap-links{
	width:100%;
	height:100%;
	margin:0;
}
	
	/* main */
	
.content{
	height:100%;
	width:100%;
	display:inline-block;
}
	
.text-box{
	font-size:20px;
	height:100%;
	max-width:30%;
	text-shadow:0px 0px 1px var(--dark-color);
	overflow:hidden;
}
	
.left{float:left;}
.right{float:right;}
	
.text-box{
	display:flex;
	flex-direction:column;
	display:-ms-flexbox;
	-ms-flex-direction:column;
	display:-webkit-flex;
	-webkit-flex-direction:column;
	justify-content:center;
	-webkit-justify-content:center;
}
	
.main-title{
	display:block;
	font-size:var(--title-size);
	font-family:perpetua,serif;
	font-variant:small-caps;
	position:absolute;
	width:100%;
	text-align:center;
	top:50px;
	z-index:30;
	color:var(--dark-color);
	text-shadow:0px 0px 2px var(--light-color),0px 0px 3px var(--light-color),0px 0px 3px var(--light-color),0px 0px 3px var(--light-color);
}

	
.left-cross,.right-cross{top:-70px;}
.left-cross{left:var(--cross-margin);}
.right-cross{right:var(--cross-margin);}
	
.text-box h1,.text-box h2{
	text-align:center;
}
	
.text-box p{
	padding-left:10%;
	padding-right:10%;
	text-align:center;
}
	
.center-img{
	position:relative;
	margin-left:10px;
	margin-right:10px;
	width:auto;
	opacity:1;
	overflow:hidden;
}
	
.center-img img{
	height:100%;
	width:auto;
}
	
.img-shadow{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 85%, rgba(255,255,255, 1) 100%);
	box-shadow:0px 0px 2px 6px var(--light-color) inset;
}
	
	/* footer */
	
.wrap-links{
	overflow:hidden;
	display:-ms-flexbox;
	-ms-flex-direction:row;
	display:-webkit-flex;
	-webkit-flex-direction:row;
	justify-content:center;
	-webkit-justify-content:center;
	display:flex;
	flex-direction:row;
}
.bar-link,.bar-link-border{
	-webkit-transition:0.5s linear;
	transition:0.5s linear;
}
.bar-link{
	font-size:24px;
	text-align:center;
	margin:auto;
	height:100%;
	width:120px;
	box-shadow:0px 0px 2px 6px var(--light-color) inset;
	text-shadow:0px 0px 2px var(--light-color);
}
	
.bar-link:hover{
	background-color:var(--dark-color);
	color:var(--light-color);
	box-shadow:0px 0px 2px 6px var(--light-color) inset;
}
.bar-link-border{
	height:100%;
	width:17px;
	font-size:17px;
	text-align:center;
}
	
.bar-link-border:after{
	content:'\25A0';
	display:inline-block;
	-webkit-transform:transform:translateX(1px) translateY(5px) rotateZ(45deg);
	-ms-transform:transform:translateX(1px) translateY(5px) rotateZ(45deg);
	transform:translateX(1px) translateY(5px) rotateZ(45deg);
}
	
.bar-link-border:hover{
	color:var(--light-color);
}
	
	
@media (max-width:500px){
body {
	margin:0;
}
.container {
	min-width:310px;
	width:90%;
}
.contain-first{
	height:250px;
	margin-top:20vh;
}
.contain-second{
	height:25px;
}
.center-img {
	min-height:220px;
	margin:0;
}
.text-box{
	overflow-Y:scroll;
	font-size:12px;
}
.text-box p:first-of-type{
	padding-top:100%;
}
.text-box ul:first-of-type{
	margin-top:-100px;
}
.cross{
	display:none;
}
.bar-link {
	width:10%;
}
.main-title{
	top:-55px;color:
	var(--light-color);
}
.bar-link{
	font-size:14px;
	overflow-wrap:
	max-width:90px;
	width:20%;
}
.bar-link:hover{
	color:var(--dark-color);
	background:none;
}
.bar-link-border:after{
	content:'';
	opacity:0.2;
	width:1px;
	height:100%;
	background-color:var(--dark-color);
	-webkit-transform:none;
	-ms-transform:none;
	transform:none;
}
}