@charset "UTF-8";
/* CSS Document */
Theme Name: FPARC
Theme URI: https://www.fparc.uk
Description: D. G. M. CSS
Author: David G Millhouse M7LLH
Author URI: http://www.davidmillhouse.com
*/
/*	F O N T S   B Y   D .  G .  M .   T Y P O G R A P H I C S ™   www.davidmillhouse.com	*/
body {
	background-color: #202020;
	background-image: repeating-linear-gradient(to right, #000000,  #202020, #000000);
	margin:0;
	color:#FFFFFF;
	font-family: 'Monylop-Regular';
	font-size: 6.5px;
	animation: BGcolour .38s linear;
	line-height:23.5px;
	letter-spacing:0;
	word-spacing:0;
}
.fader {
	padding: 0; margin: 0;
-webkit-animation: fadein 1.33s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1.33s; /* Firefox < 16 */
    -ms-animation: fadein 1.33s; /* Internet Explorer */
    -o-animation: fadein .1.33s; /* Opera < 12.1 */
    animation: fadein 1.33s;
}
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
::selection {
	color:#FFFFFF; background-color: #F93030;
}
@font-face {
  src: url('fonts/Monylop-Regular.woff') format('woff');
  font-family: 'Monylop-Regular';
  font-style: normal;
}
@font-face {
  src: url('fonts/Monylop-Italic.woff') format('woff');
  font-family: 'Monylop-Italic';
  font-style: normal;
}
@font-face {
  src: url('fonts/Monylop-Black.woff') format('woff');
  font-family: 'Monylop-Black';
  font-style: normal;
}
@font-face {
  src: url('fonts/Portsea-Italic.woff') format('woff');
  font-family: 'Portsea-Italic';
  font-style: normal;
}
@font-face {
  src: url('fonts/Hellsch-Regular.woff') format('woff');
  font-family: 'Hellsch';
  font-style: normal;
}
@font-face {
  src: url('fonts/FPARC.woff') format('woff');
  font-family: 'FPARC';
  font-style: normal;
}
.blk {
	font-family: 'Monylop-Black';
	text-decoration:none;
}
.ital{
	font-family: 'Monylop-Italic';
	text-decoration:none;
}
#link {
	font-family: 'Monylop-Italic';
	text-decoration:none;
	font-style: normal;
	cursor: pointer;
	color: #3FC3FC;
}
#link:hover {
	font-family: 'Monylop-Regular';
	text-decoration:none;
	font-style: normal;
	cursor: pointer;
}
a {	
	color: #FFFFFF;
	text-decoration:none;
}
a:active {
	color: #FFFFFF;
	font-family: 'Monylop-Regular';
}
a:hover {
	color: #FFFFFF;
	cursor: hand;
	text-decoration:none;
	font-family: 'Monylop-Regular';
}
a:link {
	color: #FFFFFF;
	text-decoration:none;
	font-family: 'Monylop-Regular';
}
a:visited {
	color: #FFFFFF;
	text-decoration:none;
	font-family: 'Monylop-Regular';
}
.logo-brick {
	width: 24.4%; text-align: center; vertical-align: middle; display: inline-block; background-color: #202648; margin-top: 52px;
	}
#FPARClogoTop {
	height: 25.5px; margin-top: 14px;
}
#menu {
	font-size: 12.5px; line-height: 29px; 
	cursor: hand; border: none; color: #FFFFFF; background-color: #000000; height: 100px; width: 100%; padding-top: 10px; margin: 0px; display: block; text-align: center; height: 16px; border-top: 0.5px solid #70E9E7; padding-bottom:25px; -webkit-animation: invert 2.9s; animation: breatha .82s forwards; border-bottom: none; cursor: e-resize
}
#menu:hover {
	cursor: hand;
	text-decoration:none;
	animation: breathb 1s forwards;
	border-bottom: 0.6px solid #000000; color: #000000;
	}
@keyframes breathb { 
	0% { color: #70E9E7; font-family: 'Monylop-Italic';
	}25% {  font-family: 'Monylop-Regular'}
	50% {  background-color: #70E9E7; color: #000000; 
	}
	100% { background-color: #70E9E7; color: #000000;
	}}
@keyframes breatha { 
	0% { color: #FFFFFF; color: #000000;
	}
	50% {  background-color: #000000; color: #FFFFFF;
	}
	100% { background-color: #000000; color: #FFFFFF;
	}}
.Title {
	font-size: 23.5px; line-height: 17.5px; font-family: Hellsch; color: #FFFFFF; padding-top: 78px; width: 100%; text-align: center;
	}
.BodyText {
	font-family: 'Monylop-Regular'; color: #FFFFFF;
	text-align: left; width: 100%; display: inline-block; font-size:12.6px; line-height:34px; max-width: 950px;
	}
.Subtext {
	font-size: 9px; line-height: 26px;
	}
.SubtextUnderImage {
	font-family: 'Monylop-Regular';
	width: 100%; text-align: center; font-size: 7.5px; line-height: 21px; margin-top: 40px; margin-bottom: 83px; color: #FFFFFF
	}
.smallSubtext {
	font-family: 'Monylop-Regular'; color: #FFFFFF;
	font-size: 7px; line-height: 20px; margin-top: 2.5px; margin-bottom: 18px;
	}
#PageContent {
	color:#FFFFFF;
	font-family: 'Monylop-Regular';
	width: 100%; margin-top: -2px; padding-bottom: 82px; text-align: center; animation: PageContentUp .6s forwards;
	}
@keyframes PageContentUp { 
	0% { margin-top: 1.5%; opacity: 0%;
	}
	100% { margin-top: 0%; opacity: 100%;
	}}
/* ARCHIVE */
#table_ {
	width: 100%; font-size:12.6px; line-height:34px; text-align: center; background-color: #000000; border-bottom: #717171 solid 11px; border-top: 1px solid #717171;
}
.filenameH, .filesizeH {
	display: inline-block;
	word-break: keep-all;
	width: 79%;
	margin: 0%;
	padding-top: 9px;
	padding-bottom: 9px;
	margin-bottom: 3px;
	text-align: left;
	color: #FFFFFF;
	vertical-align: middle;
	background-color: #000000; font-size: 10px; line-height: 10px; border-right: 1.5px solid #FFFFFF; 
	}
.filesizeH {
	border-right: none; width: 20%;
	}
#file {
	cursor: hand;
	text-decoration:none;
	animation: inv__ .4s forwards;
	color: #000000;
	background-color: #d6fc56;
	margin-bottom: 3px;
	padding-left: 12.5px;
	}
@keyframes inv__ { 
	0% { filter: invert(100%);
	}
	100% { filter: invert(0%);
	}}
#file:hover {
	cursor: hand;
	text-decoration:none;
	animation: inv- .4s forwards; 
	}
@keyframes inv- { 
	0% { filter: invert(0%);
	}
	100% { filter: invert(100%); color: #000000;
	}}
.filename, .filesize {
	display: inline-block;
	word-break: keep-all;
	width: 79%;
	margin: 0%;
	word-break: break-all;
	padding-top: 9px;
	padding-bottom: 9px;
	margin-bottom: 3px;
	text-align: left;
	vertical-align: middle;
	}
.filesize {
	width: 19%; padding-left: 6px;
	}
.filename:hover {
	animation: fntchng .5s forwards; 
	}
.filesize:hover {
	animation: fntchng .5s forwards; 
	}
@keyframes fntchng { 
	0% { font-family: 'Monylop-Italic';
	}
	100% { font-family: 'Monylop-Regular';
	}}
/* CALENDER */
#table {
	width: 100%; font-size:12.6px; line-height:34px; text-align: center; background-color: #000000; border-bottom: #717171 solid 11px; border-top: 1px solid #717171;
}
#CalenderYear{
	font-size: 23.5px; line-height: 17.5px; font-family: Hellsch; color: #FFFFFF; padding-top: 78px; width: 100%; text-align: center;
	}
.when, .event_, .time, .where {
	display: inline-block;
	word-break: keep-all;
	width: 22.2%;
	margin: 0%;
	padding-left: 12.5px;
	padding-top: 9px;
	padding-bottom: 9px;
	margin-bottom: 3px;
	text-align: left;
	background-color: #EEEEEE;
	vertical-align: middle;
	}
.event_, .time {
	text-align: center; padding-left: 0px;
	}
.where {
	text-align: right; padding-right: 12.5px;
	}
.whenH, .event_H, .timeH, .whereH {
	display: inline-block;
	word-break: keep-all;
	width: 22.2%;
	margin: 0%;
	padding-left: 12.5px;
	padding-top: 9px;
	padding-bottom: 9px;
	margin-bottom: 3px;
	text-align: left;
	vertical-align: middle;
	background-color: #000000; font-size: 10px; line-height: 10px; border-right: 1.5px solid #FFFFFF; 
	}
.event_H, .timeH {
	text-align: center; padding-left: 0px;
	}
.whereH {
	text-align: right; padding-right: 12.5px; border-right: none;
	}
#event {
	cursor: hand;
	text-decoration:none;
	animation: inv_ .4s forwards;
	color: #000000;
	background-color: #EEEEEE;
	margin-bottom: 3px;
	}
@keyframes inv_ { 
	0% { filter: invert(100%);
	}
	100% { filter: invert(0%);
	}}
#event:hover {
	cursor: hand;
	text-decoration:none;
	animation: inv .4s forwards; 
	}
@keyframes inv { 
	0% { filter: invert(0%);
	}
	100% { filter: invert(100%); color: #ba003f;
	}}	
#DateTime {
	font-family: 'Monylop-Regular';
	position: fixed; top: 54px; right: 0%; z-index: 3; color: #3FC; font-size: 7px; line-height: 16px; background-color: #000000; padding-bottom: 2.5px; padding-top: 0.5px; padding-right: 1.2%; padding-left: 5px; border-bottom: #3FC solid 1px; animation: DateTime .33s forwards; 
	}
@keyframes DateTime { 
	0% { padding-left: 100%; opacity: 0%;
	}
	100% { padding-left: 5px; opacity: 100%;
	}}	
#BannerTopBG {
	width: 100%;  background-color: #000000; height: 52.5px; margin-top: 0px; position: fixed; opacity: 76%; margin-left: 0px; padding-left: 0px; z-index: 2; border-bottom: 1.5px solid #717171; box-shadow: 0px 0px 11px 0px #000000; animation: BannerTopBG .45s forwards; 
	}
@keyframes BannerTopBG { 
	0% { margin-top: -52.5px;
	}
	100% { margin-top: 0px;
	}}
#BannerTop {
	width: 100%; text-align: center; background-color: none; height: 52.5px; margin-top: 0px; position: fixed;  z-index: 3
	}
#FPLOGOTYPEholder {
	width: 100%; text-align: center; position: fixed; z-index: 3; margin-top: 8px;
	}
#FPLOGOTYPE {
	text-decoration: none; outline: none; color: #FFFFFF; font-family: 'FPARC'; font-size: 72px; line-height: 0px; text-shadow: #000000 0px 1px 4px;
animation: LOGO .53s forwards; 
	}
@keyframes LOGO { 
	0% { line-height: 8px; opacity: 0%;
	}
	100% { line-height: 0px; opacity: 100%;
	}}
#menubutton_ {
	position: fixed; z-index: 5; top: 19.5px; left: 18px;
	animation: inv2__ .7s forwards;
	}
@keyframes inv2__ { 
	0% { filter: invert(0%);
	}
	25% { filter: invert(47%);
	}
	50% { filter: invert(0%);
	}
	75% { filter: invert(47%);
	}
	100% { filter: invert(0%);
	}}
#menubutton {
animation: inv2_ .7s forwards;	
	}
@keyframes inv2_ { 
	0% { filter: invert(47%);
	}
	100% { filter: invert(0%);
	}}	
#menubutton:hover {
animation: inv2 .7s forwards;
	}
@keyframes inv2 { 
	0% { filter: invert(0%);
	}
	100% { filter: invert(47%);
	}}	
#backbutton {
	margin-bottom: 0%;
animation: inv2_ .7s forwards;	
	}
@keyframes inv2_ { 
	0% { filter: invert(47%);
	}
	100% { filter: invert(0%);
	}}	
#backbutton:hover {
animation: inv2 .7s forwards;
	}
@keyframes inv2 { 
	0% { filter: invert(0%);
	}
	100% { filter: invert(47%);
	}}	
.Portsea {
	color: #FFFFFF; text-align: center; width: 100%; font-size: 13px; line-height: 25px; font-family: Portsea-Italic; letter-spacing: 8.5px; margin-top: 6px;
	}
#clubCallsigns {
	position: fixed; right: 21px; top: 9.5px; font-size: 18px; line-height: 17.5px; font-family: Hellsch; color:#FFF; cursor: default; cursor: pointer;
	}
#G3CNOtopbutton {
	font-size: 18px; line-height: 17.5px; font-family: Hellsch; color:#FFFFFF; cursor: pointer; margin-bottom: 10px;
	}
#GB1PFtopbutton {
	font-size: 18px; line-height: 17.5px; font-family: Hellsch; color:#FFFFFF; cursor: pointer; 
	}
#G3CNOtopbutton:hover { animation: color-change1 .2s linear forwards;
	}
#GB1PFtopbutton:hover { animation: color-change2 .2s linear forwards;
	}
.blink_me {
    animation: color-change .7s linear infinite;
}
@keyframes color-change {
  0% { color: #FFFFFF; }
  50% { color: #000000; }
  100% { color: #FFFFFF; }
}
@keyframes color-change1 {
  0% { color: #FFFFFF; }
  50% { color: #000000; }
  100% { color: #F93030; }
}
@keyframes color-change2 {
  0% { color: #FFFFFF; }
  50% { color: #000000; }
  100% { color: #3FC; }
}
#ContactTextHolder {
	color:#FFFFFF;
	font-family: 'Monylop-Regular';
	padding-top: 8px;
	background-color: #202648;
	padding-bottom: 23px;
	width: 100%;
}
.ContactText1 {
	text-align: right; width: 50%; padding-left: 0%; display: inline-block; font-size:10px; line-height:29px; margin-bottom: 21px;
}
.ContactText2 {
	text-align: left; width: 49%; padding-left: 0%; display: inline-block; font-size:10px; line-height:29px; margin-bottom: 21px;
}
#JoinTextHolder {
	background-color: #2E00B0; padding-bottom: 92px; animation: shiftJoin .66s forwards; text-align: center;
}
@keyframes shiftJoin { 
	0% { margin-left: 100%; background-color: #000000;
	}
	50% { margin-left: 100%; background-color: #000000;
	}
	100% { margin-left: 0%; background-color: #2E00B0; 
}}
#Map {
	position: absolute; top: 66px; right: 7.5%; background-color: none; z-index: 1; animation: mapflick 1.1s forwards;
}
@keyframes mapflick { 
	0% { opacity: 0;
	}
	50% { opacity: 0;
	}
	100% { opacity: 100%;
	}}
#figWelcomePage {
	width: 97%; padding-left: 1%; text-align: left; margin-top: 64px; margin-bottom: 3px;
}
	
@media only screen and (max-width: 800px) {
.BodyText {
	font-family: 'Monylop-Regular';
	font-size: 9px; line-height: 26px;
	text-align: left; width: 97%; padding-left: 0%; max-width: 745px; display: inline-block;
}
.ContactText1 {
	text-align: right; width: 50%; padding-left: 0%; display: inline-block; font-size: 7px; line-height: 22px; margin-bottom: 17px;
}
.ContactText2 {
	text-align: left; width: 49%; padding-left: 0%; display: inline-block; font-size: 7px; line-height: 22px; margin-bottom: 17px;
}
}
	
@media only screen and (max-width: 670px) {
#figWelcomePage {
	width: 97%; padding-left: 1%; text-align: center; margin-top: 64px; margin-bottom: 3px;
}
.BodyText {
	font-family: 'Monylop-Regular';
	font-size: 9px; line-height: 26px;
	text-align: left; width: 97%; padding-left: 0%; max-width: 745px; display: inline-block;
}
.ContactText1 {
	text-align: right; width: 50%; padding-left: 0%; display: inline-block; font-size: 6.5px; line-height: 20px; margin-bottom: 17px;
}
.ContactText2 {
	text-align: left; width: 49%; padding-left: 0%; display: inline-block; font-size: 6.5px; line-height: 20px; margin-bottom: 17px;
}
#backbutton {
	margin-bottom: 8%;
	}
#Map {
	position: absolute; top: 65px; right: 11.5px; background-color: none; z-index: 1; animation: mapflick 1.1s forwards;
}
@keyframes mapflick { 
	0% { opacity: 0;
	}
	50% { opacity: 0;
	}
	100% { opacity: 76%;
	}}
#clubCallsigns {
	position: fixed; right: 17.5px; top: 8px; font-size: 15px; line-height: 12px; font-family: Hellsch; color:#FFF; animation: color-change .42s linear forwards;
	}
#FPLOGOTYPEholder {
	width: 100%; text-align: center; position: fixed; z-index: 3; margin-top: 16px;
	}
#FPLOGOTYPE {
	text-decoration: none; outline: none; color: #FFFFFF; font-family: 'FPARC'; font-size: 38px; line-height: 0px; text-shadow: #000000 0px 1px 1px;
	}
.logo-brick {
	width: 100%; margin-top: 102px;
	}
#table {
	width: 100%; font-size:7.5px; line-height:21px; text-align: center;
}
.whenH, .event_H, .timeH, .whereH {
width: 21.75%;
}
.when, .event_, .time, .where {
width: 21.75%;
}
.filename, .filesize {
	font-size:7.5px; line-height:21px;
}
.filesizeH {
	text-align: center;
}
.filesize {
	text-align: center; padding-left: 0px;
}	
#FPARClogoTop {
	height: 13px; margin-top: 19.5px;
}
}