@font-face {
  font-family: 'MyFont';
  /* src: url('/fonts/bickham-script.ttf')  format('truetype');
  src: url('/fonts/allegretto-script.ttf')  format('truetype');
  src: url('/fonts/commercial-script.ttf')  format('truetype');
  src: url('/fonts/MarriageMoment.ttf')  format('truetype');
   src: url('/fonts/AlexBrush-Regular.ttf')  format('truetype');
   src: url('/fonts/AlexBrush-Regular.ttf')  format('truetype');
   src: url('/fonts/BlendaScript.otf')  format('opentype');
   src: url('/fonts/PinyonScript-Regular.ttf')  format('truetype');
   src: url('/fonts/commercial-script.ttf')  format('truetype');
  src: url('/fonts/calligraphia.ttf')  format('truetype'); */
  src: url('/fonts/calligraphia.ttf')  format('truetype');
  
}
@font-face {
  font-family: 'MyFontA';
  src: url('/fonts/Handlee-Regular.ttf')  format('truetype');
}
@font-face {
  font-family: 'MyFontG';
  src: url('/fonts/Handlee-Regular.ttf')  format('truetype');
}

html, body {
  min-width: 320px;
}
body{
    margin:0;
    padding:0;
    font-family: arial;
	position: relative;
	min-height: 99vh;
	
	align-items: center;
	display: grid;
}
.terms-content{
    padding:10px 10px 70px;
}
#main-content{
	padding:10px 15% 90px;
}
#main-content .text h1{
	color:#119;
	font-family:MyFontA;
}
#main-content .author h1{
	color:#447;
	font-family:MyFontG;
	/* font-size:medium;
	font-weight:normal; */
	text-align:center;
	font-size:36px;
	/* text-align:right;
	padding-right: 50px; */
}

#main-content .author.nr{
	width:80%;
	margin: 0 0 0 auto;
	position:relative;
}

#main-content .author.nr h1{
	text-align:left;
}
#main-content .text{
	position:relative;
}
#main-content .text h1#cited_quote_red{
	color:#77f;
}
#main-content .author h1#cited_author_red{
	color:#aad;
}
#main-content .text h1#cited_quote,
#main-content .author h1#cited_author{
	position: absolute;
	z-index: 100;
	top: 0;
	margin: 0;
}

/* 	footer {
	  position: absolute;
	  bottom: 0;
	  height: 2.5rem; 
	} */
	footer{
		position: absolute;
		bottom: 15px;
		width: 70%;
		
		margin:20px 15% 10px;
		height:30px;
	}
	footer .left{
		width:39%;
		float:left;
		vertical-align:top;
	}
	footer .right{
		width:59%;
		text-align:right;
		float:right;
	}
	footer a{
		font-size:30px;
		padding:24px;
		color:#668;
	}
	footer a:hover{
		color:#33a;
	}
	
@media (max-width: 960px) {
	
	#main-content{
		padding:10px 10% 50px;
	}
	#main-content .text h1{
		font-size: 28px;
	}
	footer{
		width: 80%;
		margin:30px 10% 10px;
	}
	footer a{
		font-size:26px;
		padding:16px;
	}
}
@media (max-width: 640px) {
	#main-content{
		padding:10px 5% 40px;
	}
	#main-content .text h1{
		font-size: 24px;
	}
	#main-content .author h1{
		padding-right: 0px;
	}
	footer{
		width: 90%;
		margin:30px 5% 10px;
	}
	footer a{
		font-size:20px;
		padding:8px;
	}
}
