/* You can add global styles to this file, and also import other style files */
/* color: #D40000; Rosso Corsa  is an official Ferrari racing color. Other Ferrari colors are silver and black */

body {
  margin: 0;
  font-family: Arial, serif;
  font-size: 16pt;
  background: #EFEFEF url("/images/red-themed-hex-matrix-0.25x.jpg") repeat;
}

* {
  margin: 0;
  padding: 0;
  border: 0;
}


h1              { font-size: 2em; margin: .67em 0; text-align: center; }
h2              { font-size: 1.5em; margin: .75em 0; text-align: center; }
h3              { font-size: 1.17em; margin: .83em 0; text-align: center; }
h4              { font-size: 1em; margin: 1.12em 0; text-align: left; }
h5              { font-size: .83em; margin: 1.5em 0; text-align: left; }
h6              { font-size: .75em; margin: 1.67em 0; text-align: left; }
div, p, li, a   {
  font-size: 1em;
  text-align: left;
	margin: 1em 0;
}

#content p {
	padding: 1em;
}

.bigtext {
	font-size: 10em;
	text-align: left;
	margin: 1em 0;

}

#top-decoration {
	margin: 0;
	width: 100%;
	height: 8px;
	background-color: blue;
	display: block;
}

#frame {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}

#logo {
	margin: 0 auto 0 0;
	width:fit-content;
    height:fit-content; 
	padding: 0;
	border: none;
}

#pagetitle {
	margin: 0 auto;
	width:fit-content;
    height:fit-content; 
	padding: 0.25em;
	border: medium solid black;
	background-color: white;
}

#navigation {
	margin-top: 0;
	margin-bottom: 0;
	background-color: transparent;
	color: black;
}

#navigation a {
	margin-top: 0;
	margin-bottom: 0;
	margin-right: 1em;
	background-color: white;
	color: black;
	font-size: 0.75em;
}

#content {
	margin-top: 0;
	margin-bottom: 0;
	background-color: transparent;
	color: black;
}

#content iframe {
  position: relative;
  width: 95%;
  min-height: 100em;
  margin: 0;
  padding: 0;
  scroll-behavior: auto;
}

#footer {
	min-height: 8px;
	margin-top: 0;
	margin-bottom: 0;
	background-color: blue;
	color: white;
}

.imagebox img {
	max-width: 100%;
}

.authbuttons {
    position:absolute;
    top:0;
    right:0;
    width:auto;
}

.authbuttons div {
    margin:0;
}

.g-signout, .g-signout span {
    display: none;
    background-color: white;
}

.g-id-popup span {
    display: none;
    background-color: white;
}

.whiteonblack {
	background-color: black;
	color: white;
}

@media (max-width : 770px) {
	body{font-size: 14pt;}
}

@media (max-width : 600px) {
	body{font-size: 12pt;}
}

@media (max-width : 480px) {
	body{font-size: 12pt;}
}

@media (max-width : 320px) {
	body{font-size: 12pt;}
}

/*
These animations are setup to work on an "a" tag.
The tag contents will move from left to center as
the page loads.
 */

@keyframes trythis1
{
	from {
		left: 0;
	}
	to {
		left: 100%;
	}
}

@keyframes trythis2
{
	0% {
		left: -20%;
	}
	100% {
		left: 100%;
	}
}

#makethistagmove {
	position: relative;
	background-color: transparent;
	animation-name: trythis2;
	animation-duration: 15s;
	animation-iteration-count: infinite;
	animation-direction: reverse;
}
