html, body {
    height:100%;
} 

body {
	background-image: url("pix/back.png");
	background-attachment: fixed;
	background-color: #03183c; /* dark navy */
	color: rgb(253, 254, 254 ); /* silver */
	font-family: 'PT Serif', serif;
}

.pt-serif-regular {
  font-family: "PT Serif", serif;
  font-weight: 400;
  font-style: normal;
}

.pt-serif-bold {
  font-family: "PT Serif", serif;
  font-weight: 700;
  font-style: normal;
}

.pt-serif-regular-italic {
  font-family: "PT Serif", serif;
  font-weight: 400;
  font-style: italic;
}

.pt-serif-bold-italic {
  font-family: "PT Serif", serif;
  font-weight: 700;
  font-style: italic;
}

a:link {
    color: #40085e;
	text-decoration: none;
}

a:visited {
    color: rgb(253, 254, 254); /* silver */
	text-decoration: none;
}

a:hover {
    color: rgb(253, 254, 254); /* silver */
    font-weight: bold;
	text-decoration: none;
}

a:active {
    color: rgb(253, 254, 254); /* silver */
    font-weight: bold;
	text-decoration: none;
}
a:focus {
    color: rgb(253, 254, 254); /* silver */
    font-weight: bold;
	text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
 color: rgb(253, 254, 254);
 font-family: 'PT Serif', serif;
  text-shadow: 0px 0px 5px #301b44, 0px 0px 10px #301b44, 0px 0px 5px #301b44,
    0px 0px 10px #301b44;
}

img {
	max-width: 100%;
}

.grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: auto auto auto auto;
    grid-template-areas: 
        'head head'
		'links links'
        'title1 title2'
        'main col1'
        'foot foot';
    max-width: 1410px;
    margin: 0 auto;
    background-image: url("pix/back2.png");
    border: 5px solid rgb(253, 254, 254); /* silver */
    box-shadow: inset -1px 3px 8px 5px #7c56a1, 2px 5px 16px 0px #5a3a7b, 3px 9px 25px 14px rgb(253, 254, 254);
}

@media (max-width: 768px) {
    .grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-template-areas: 
            'links'
			'head'
            'title1'
            'main'
			'title2'
            'col1'
            'foot';
    }
}

.head, .main, .col1, .title1, .title2, .foot, .links {
    text-align: left;
    font-size: medium;
    color: rgb(253, 254, 254); /* silver */
    border: 5px solid rgb(253, 254, 254); /* silver */
    padding: 10px;
    overflow: hidden;
}

.head { grid-area: head; }
.foot { grid-area: foot; }
.main { grid-area: main; }
.links { grid-area: links; }
.col1 { grid-area: col1; }
.title1 { grid-area: title1; }
.title2 { grid-area: title2; }

.head p {
	text-align: left;
	margin-top: 2em;
	font-size: large;
	font-weight: bold;
}

@media (min-width: 1025px) {
  .head p {
    text-align: center;
  }
}

.links {
	color: #40085e;
	text-align: center;
	font-size: x-large;
}

.links a:link {
    color: rgb(253, 254, 254); /* silver */
	text-decoration: none;
}

.links a:hover {
    color: #40085e;
	text-decoration: none;
}

@media (min-width: 1025px) {
  .links {
    display: none;
  }
}

@media (max-width: 1025px) {
  .title1 {
    display: none;
  }
}

.col1 p {
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}

.col1 p {
  overflow-wrap: break-word;
  word-wrap: break-word;
  hyphens: auto;
}

.foot-contents {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	width: auto;
	text-align: center;
	position: relative;
}

.bigboxgrid {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas: 
        'head2'
        'bigbox'
        'foot';
    max-width: 1410px;
    margin: 0 auto;
    background-image: url("pix/back2.png");
    border: 5px solid rgb(253, 254, 254); /* silver */
    box-shadow: inset -1px 3px 8px 5px #7c56a1, 2px 5px 16px 0px #5a3a7b, 3px 9px 25px 14px rgb(253, 254, 254);
}

.bigbox {
	grid-area: bigbox;
    text-align: left;
    font-size: medium;
    color: rgb(253, 254, 254); /* silver */
    border: 5px solid rgb(253, 254, 254); /* silver */
    padding: 20px;
    overflow: hidden;
}

.head2 {
	grid-area: head2;
	text-align: center;
    border: 5px solid rgb(253, 254, 254); /* silver */
    padding: 0px;
    overflow: hidden;
}

.chaphead img {
    margin: 0; 
    padding: 0; 
    display: block; 
    width: 100%; 
    height: auto; 
}

.pull-quote {
    padding: 20px;
	border: 3px solid #8A2BE2;
    box-shadow: 0 0 10px rgb(253, 254, 254 );
    border-radius: 10px;
    background: linear-gradient(to bottom, #5729d6, #40085e);
    line-height: 1.5;
	width: 70%;
	justify-content: center;
	margin: 0 auto;
}

@media screen and (max-width: 1439px) {
    .pull-quote {
        width: 90%;
    }
}

.pull-quote2 {
    padding: 20px;
	border: 3px solid #8A2BE2;
    box-shadow: 0 0 10px rgb(253, 254, 254 );
    border-radius: 10px;
    background: linear-gradient(to bottom, #5729d6, #40085e);
    line-height: 1.5;
	width: 50%;
	justify-content: center;
	margin: 0 auto;
}

@media screen and (max-width: 1439px) {
    .pull-quote2 {
        width: 90%;
    }
}

.large-letter {
    font-size: 32px;
}

.buybutt {
      margin-left: 10px;
      padding: 10px 20px;
      background-color: #4d1c85;
      color: #FFFFFF;
      text-decoration: none;
      border-style: solid;
      border-width: 2px;
      border-color: #FFFFFF;
      border-radius: 5px;
      font-size: 16px;
      cursor: pointer;
      font-family: 'Roboto Slab', serif;
      transition: background-color 0.3s ease;
    }

    .buybutt:hover {
      background-color: #8c52ff;
    }
	
	.flex-container {
	display: flex;
	justify-content: space-between;
	}
	
	@media screen and (max-width: 1439px) {
    .flex-container {
        flex-direction: column;
    }
	
	.flex	{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
    
    .cov {
        order: -1;
    }
}

.cov2 {
	display: flex;
	justify-content: center;
	text-align: center;
}

.biglinks {
    padding: 0px;
	margin: 0px;
	font-size: x-large;
	font-family: 'Roboto Slab', serif;
    }
	
.biglinks a {
  color: rgb(253, 254, 254);
  background-image: url("pix/links.png");
  background-repeat: no-repeat;
  background-size: 100% 0.2em;
  background-position: 0 88%;
  transition: background-size 0.25s ease-in;
}

.biglinks a:hover {
	background-size: 100% 88%;
		}
		
.swamp-container {
	margin-right: auto;
}

.cc-container {
	margin: 0 auto;
}

.stamp-container {
	margin-left: auto;
}

/* Scroll Bar Width */
::-webkit-scrollbar {
  width: 10px;
}
/* Scroll Bar Track */
::-webkit-scrollbar-track {
  background: #5729d6;
}
 
/* Scroll Bar Handle */
::-webkit-scrollbar-thumb {
  background: #40085e;
}

/* Scroll Bar Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background-image: url(pix/links.png);
}