* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background-color: white ;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

#top_header {
  text-align: center;
}

#icon {
  font-family: STD;
  font-size: 36pt;
  color: white;
  vertical-align: middle;
  text-align: center;
}

#page_title {
  vertical-align: middle;
  font-family: GEP;
  font-size: 36pt;
  letter-spacing: 4px;
  font-weight: normal;
  color: white;
  text-shadow: 2px 2px #000000;
}

#tagline {
  font-family: AGR;
  font-size: 16pt;
  text-align: center;
  font-weight: normal;
  color: white;
  text-shadow: 2px 2px #000000;
  padding: 0px 0px;
  vertical-align: middle;
  margin: 0px 0px;
}

h1 {
  font-family: GEP;
  font-size: 36pt;
  letter-spacing: 4px;
  font-weight: normal;
  color: white;
  text-shadow: 2px 2px #000000;
  padding: 0px 0px;
}

h2 {
  color: white;
  /*text-shadow: 2px 2px #000000;*/
  padding: 0px 0px;
  letter-spacing: 2px;
}

/* Set Star Trek Fonts and Other Fonts */
@font-face {
    font-family: GEP;
    src: url(../fonts/EdgeOfTheGalaxyPoster.ttf);
}

@font-face {
    font-family: AGR;
    src: url(../fonts/AGENCYR.TTF);
}

@font-face {
    font-family: AGB;
    src: url(../fonts/AGENCYB.TTF);
}

@font-face {
    font-family: STD;
    src: url(../fonts/Trekbats.ttf);
}

@font-face {
    font-family: KDF;
    src: url(../fonts/Klingon.ttf);
}

@font-face {
    font-family: LMR;
    src: url(../fonts/LemonMilkRegular-X3XE2.otf);
}

@font-face {
    font-family: WEBD;
    src: url(../fonts/webdings.ttf);
}

@font-face {
    font-family: GGSR;
    src: url("../fonts/gg sans Regular.ttf");
}

@font-face {
    font-family: GGSB;
    src: url("../fonts/gg sans Bold.ttf");
}

@font-face {
    font-family: 'Inconsolata Regular';
    src: url('../fonts/Inconsolata-Regular.ttf') format('truetype');
}

/* Style the header */
.header {
  background-color: #f1f1f1;
  margin: 0px 0px;
  width: 100%;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

div.cn {
  position: relative;
  width: 100%;
  height: 150px;
}

div.inner {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  padding: 2rem;
  width: 1200px;
}

.default_page_container {
  display: table-cell;
  width: 90%;
  vertical-align: top; 
  background-color: white;
  opacity: 0.85;
  padding-top: 50px;
  padding-right: 80px;
  padding-left: 80px;
  padding-bottom: 30px;
  margin-right: 15px;
  border-radius: 5px;
  border: 1px solid navy;
}

.logo_holder {
  width: 1200px;
  text-align: center;
}

/* Style the top navigation bar */
.topnav {
  overflow: hidden;
  background-color: #333;
  font-family: AGB;
}

/* Style the topnav links */
div.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* Change color on hover */
.topnav a:hover, a:active {
  background-color: #ddd;
  color: black;
}

.divSearchBox {
  float: right;
  vertical-align: middle;
  padding-top: 14px;
  padding-right: 16px;
}

.divFleetSelect {
  left: 40%;
  right: 60%;
  width: 400px;
  text-align: center;
  vertical-align: middle;
  position: absolute;
  padding-top: 14px;
  padding-right: 16px;
}

/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 25%;
  padding: 15px;
  font-family: AGR;
}

div.row {
  margin-top: 0px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
  background-image: url(../images/555.jpg);
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width:600px) {

  .column {
    width: 100%;
  }
}
div.divNews {
	z-index: 1;
}
div.blueTable {
  border: 1px solid #1C6EA4;
  background-color: #EEEEEE;
  opacity: 0.9;
  width: 100%;
  text-align: left;
  border-collapse: collapse;
}

.divTable.blueTable .divTableCell, .divTable.blueTable .divTableHead {
  border: 1px solid #AAAAAA;
  padding: 3px 3px;
}

.divTable.blueTable .divTableBody .divTableCell {
  font-family: Verdana;
  font-size: 11px;
}

.divTable.blueTable .divTableRow:nth-child(even) {
  background: #D0E4F5;
}

.divTable.blueTable .divTableHeading {
  background: #1C6EA4;
  background: -moz-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  border-bottom: 2px solid #444444;
}

.divTable.blueTable .divTableHeading .divTableHead {
  font-family: Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #FFFFFF;
  border-left: 2px solid #D0E4F5;
  text-decoration: none;
}

.divTableHead a:link {
  text-decoration: none;
  font-family: Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #FFFFFF;
}

.divTableHead a:visited {
  text-decoration: none;
  font-family: Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #FFFFFF;
}

.divTable.blueTable .divTableHeading .divTableHead:first-child {
  border-left: none;
}

.blueTable .tableFootStyle {
  font-size: 14px;
}

.blueTable .tableFootStyle .links {
	 text-align: right;
}

.blueTable .tableFootStyle .links a{
  display: inline-block;
  background: #1C6EA4;
  color: #FFFFFF;
  padding: 2px 8px;
  border-radius: 5px;
}

.blueTable.outerTableFooter {
  border-top: none;
}

.blueTable.outerTableFooter .tableFootStyle {
  padding: 3px 5px; 
}

div.tfd_header {
  text-align: center;
  padding: 15px 0px 15px 0px;
}

.divTable.tfd_header .divTableCell, .divTable.tfd_header .divTableHead {
  padding: 0px 0px;
}

.divTableCell {
  top: 50%;
  left: 50%;
  height: 25px;
  vertical-align: middle;
}

.divTableCell a {
	color: #006496;
	text-decoration: none;
}

.blueTable .tableFootStyle {
  background: #1C6EA4;
  background: -moz-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  border-bottom: 2px solid #444444;
}

.blueTable .tableFootStyle .links {
	 text-align: right;
}

.blueTable .tableFootStyle .links a{
  display: inline-block;
  background: #1C6EA4;
  color: #F5FF7F;
  padding: 2px 8px;
  border-radius: 5px;
}

.blueTable.outerTableFooter {
  border-top: none;
}

.blueTable.outerTableFooter .tableFootStyle {
  padding: 3px 5px; 
}

.divTable{
  display: table;
}

.divTableRow {
  display: table-row;
}

.divTableHeading {
  display: table-header-group;
}

.divTableCell, .divTableHead {
  display: table-cell;
}

.divTableHeading {
  display: table-header-group;
}

.divTableFoot {
  display: table-footer-group;
}

.divTableBody {
  display: table-row-group;
}

/* Google Pie Charts Style */
.pie-chart {
  margin: 0 auto;
}

.graphs {
  opacity: 0.9 ;
}

.float_graph {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 15px;
}

.cell_right {
  text-align: right;
}

div.boundry {
  position: relative;
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 15px;
}

div.tablebox {
  position: relative;
}

/* Create Fleet Information Box*/
div.fleet-info {
  position: relative;
  width: 100%;
  font-family: AGB;
  background-color: dimgray;
  background-image: url(../images/black-50.png);
  padding-left: 15px;
  padding-right: 15px;
}

div.f_column {
  position: relative;
  float: left;
  width: 16%;
  font-family: AGB;
  color: white;
  text-shadow: 2px 2px #000000;
  padding: 0px 0px;
}

div.footer {
  position: relative;
}

div.sub-footer {
  font-family: AGR;
  position: relative;
  text-align: center;
  color: white;
  font-weight: normal;
  padding-top: 5px;
  padding-bottom: 5px;
}

#copyright {
  position: relative;
  width: 450px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 5px;
  padding-bottom: 10px;
  padding-top: 10px;
  background-color: black;
  border-radius: 5px;
  border: 1px solid white;
  opacity: .75;
  filter: alpha(opacity=75);
  color: white;
  text-align: center;
}

#copyright a {
  color: lightgreen;
  text-decoration: none;
}

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background: #1C6EA4;
  background: -moz-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  border-bottom: 2px solid #444444;
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-family: AGR;
  font-size: 18px; /* Increase font size */
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}

.divProfileLogin {
  font-family: LMR;
  font-size: 18px;
  line-height: normal;
  font-variant: small-caps;
  position: absolute;
  top: 15px;
  right: 15px;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 8px;
  padding-right: 8px;
  color: black;
  border-radius: 5px;
  text-align: right;
  vertical-align: middle;
}

.divProfileLogin a {
  color: orangered;
  text-decoration: none;
}

.loginText {
  font-size: 14px;
  line-height: normal;
}

.divFleetTime {
  font-family: AGB;
  font-size: 18px;
  line-height: normal;
  font-variant: small-caps;
  position: absolute;
  top: 15px;
  left: 15px;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 8px;
  padding-right: 8px;
  color: black;
  border-radius: 5px;
  border: 1px solid black;
  background-color: white;
  opacity: .85;
  filter: alpha(opacity=75);
  text-align: center;
  vertical-align: middle;
}

.divArpisStatus {
  font-family: AGB;
  font-size: 18px;
  line-height: normal;
  font-variant: small-caps;
  position: absolute;
  top: 15px;
  left: 188px;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 8px;
  padding-right: 8px;
  color: black;
  border-radius: 5px;
  border: 1px solid black;
  background-color: white;
  opacity: .85;
  filter: alpha(opacity=75);
  text-align: left;
  vertical-align: top;
}
.divArpisStatus img {
  padding: 0;
  vertical-align: top;
}
.rounded {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.armada_name {
  font-family: AGB;
  font-size: 20px;
  font-variant-caps: normal;
}

.armada_name_sub {
  font-family: AGB;
  font-size: 30px;
  font-variant-caps: small-caps;
  color: #213184;
  text-shadow: 2px 2px #969799;
  margin: .1rem 0;
  letter-spacing: 4px;
}

.armada_name_sub2 {
  font-family: AGB;
  font-size: 30px;
  font-variant-caps: small-caps;
  color: darkred;
  text-shadow: 2px 2px #969799;
  margin: .1rem 0;
  letter-spacing: 4px;
}

.fleet_name {
  font-variant-caps: small-caps;
  color: white;
  text-shadow: 1px 1px black;
  margin: .1rem 0;
  letter-spacing: 4px;
}

.fleet_name2 {
  font-variant-caps: small-caps;
  color: crimson;
  text-shadow: 1px 1px gray;
  margin: .1rem 0;
  letter-spacing: 4px;
}

.fleet_name_open {
  font-variant-caps: small-caps;
  color: greenyellow;
  text-shadow: 1px 1px yellow;
  margin: .1rem 0;
  letter-spacing: 4px;
}

.armada_fleet_info {
  font-family: AGB;
  font-size: 25px;
  font-variant-caps: small-caps;
  color:  orange;
  position: relative;
  vertical-align: baseline;
}

.fleet_level {
  font-family: AGB;
  font-size: 18px;
  color: yellow;
  position: relative;
  vertical-align: middle;
}

.member_count {
  font-family: AGB;
  font-size: 18px;
  color: lightskyblue;
  position: relative;
 }

.small_info {
  font-size: 16px;
  color: lightgray;
  position: absolute;
  text-align: left;
  padding-top: 6px !important;
 }

div.div_armada_container {
  padding: 10px 10px 10px 10px;
  filter: alpha(opacity=100) !important;
  -moz-opacity: 1.00 !important;
  opacity: 1 !important;
  border-radius: 5px;
  border: 1px solid #213184;
  background-color: lightblue;
  background-image: url("../images/666.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 2;
}


div.div_armada_container2 {
  padding: 10px 10px 10px 10px;
  filter: alpha(opacity=100) !important;
  -moz-opacity: 1.00 !important;
  opacity: 1 !important;
  border-radius: 5px;
  border: 1px solid #213184;
  background-color: darkred;
  background-image: url("../images/klingon.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 2;
}

div.div_armada_container img {
  object-fit: contain;
  z-index: 2;
}

.div_armada_outer {
  display: block;
  width: 100%;
  margin: 0 auto;
  font-family: AGB;
  font-size: 26px;
  filter: alpha(opacity=100) !important;
  -moz-opacity: 1.00 !important;
  opacity: 1.0 !important;
  z-index: 1;
}

.div_armada_inner_1 {
  margin-left: 25px;
  font-family: AGB;
  font-size: 26px;
  padding: 2px;
  color: orange;
  filter: alpha(opacity=100) !important;
  -moz-opacity:1.00 !important;
  opacity: 1.0 !important;
}

.div_armada_inner_2 {
  margin-left: 75px;
  font-family: AGB;
  font-size: 26px;
  padding: 2px;
  color: orange;
}

.div_armada_inner_3 {
  margin-left: 125px;
  font-family: AGB;
  font-size: 26px;
  padding: 2px;
  color: orange;
}

.div_armada_bullet {
  color: orange;
  font-variant: small-caps;
}

.divArmadaTable{
	display: table;
	margin: 6px 6px 6px 6px;
	border-radius: 10px;
	border: 1px solid white;
/*	width: 100%;*/
}
.divArmadaTableRow {
	display: table-row;
}
.divArmadaTableHeading {
	background-color: #EEE;
	display: table-header-group;
}
.divArmadaTableCell, .divArmadaTableHead {
	border: none;
	display: table-cell;
	padding: 3px 10px;
	font-family: AGB;
	font-size: 22px;
	/*vertical-align: middle !important;*/
}
.divArmadaTableHeading {
	background-color: #EEE;
	display: table-header-group;
	font-weight: bold;
}
.divArmadaTableFoot {
	background-color: #EEE;
	display: table-footer-group;
	font-weight: bold;
}
.divArmadaTableBody {
	display: table-row-group;
}

/* ARMADA Totals Table */
.divTable_Z{
	padding: 10px 10px 10px 10px;
	border: 1px solid navy;
	border-radius: 5px;
	display: table;
	background-color: lightblue;
	background-image: url("../images/666.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 2;
}
.divTableRow_Z {
	display: table-row;
}
.divTableHeading_Z {
	background-color: #EEE;
	display: table-header-group;
}
.divTableCell_Z, .divTableHead_Z {
	display: table-cell;
	padding: 3px 10px;
	font-family: AGB;
	font-size: 20px;
	text-shadow: 1px 1px black;
	letter-spacing: 2px;
	color: white;
}
.divTableHeading_Z {
	background-color: #EEE;
	display: table-header-group;
	font-weight: bold;
}
.divTableFoot_Z {
	background-color: #EEE;
	display: table-footer-group;
	font-weight: bold;
}
.divTableBody_Z {
	display: table-row-group;
}

.admin_menu_inner a:link {
    color: white;
    text-decoration: none;
}
.admin_menu_inner a:visited {
    color: white;
    text-decoration: none;
}
.admin_menu_inner a:hover {
    color: orange;
    text-decoration: none;
}

/* Shadow Box Nav Buttons */
.refresh_button .refresh_on {
    display: none;
}
    
.refresh_button .refresh_off {
    display: block;
}

.refresh_button:hover .refresh_on {
    display: block;
}
    
.refresh_button:hover .refresh_off {
    display: none;
}
    
.close_button .close_on {
    display: none;
}
    
.close_button .close_off {
    display: block;
}

.close_button:hover .close_on {
    display: block;
}
    
.close_button:hover .close_off {
    display: none;
}