﻿/* ----- Requirements for the system page ----- */
.style1 {
	background-color: #FFFFFF;
}
.style2 {
	color: #000000;
}
.style3 {
	color: #0000FF;
	text-align: left;
	width: 50%;
}
.style4 {
	color: #FF0000;
}
.style5 {
	color: #000080;
}
.style6 {
	color: #0000FF;
	width: 50%;
}
.style7 {
	text-align: center;
}
.style8 {
	font-family: Tahoma;
}
/* ----- End rRequirements for the system page See below for rollover actions ----- */
/* ----- Requirements for other computer sites page ----- */
.style9 {
	text-align: left;
}
/* ----- End requirements for other computer sites page ----- */
/* ----- Requirements for the photothumb page ----- */
.style10 {
	text-align: center;
}
.style11 {
	border-width: 4px;
	border-color: #FFFFFF;
	border-style: solid;
}
.style12 {
	border-width: 2px;
	border-color: #808080;
}
.style13 {
	text-align: right;
}
/* ----- End requirements for the photothumb page ----- */
/* ----- Requirements for the index page ----- */
.style14 {
	color: #FFFFFF;
	font-size: small;
}
.style20 {
	font-size: x-small;
	text-decoration: line-through;
}
.marquee1 {
	height: 50px;	
	overflow: hidden;
	position: relative;
 	text-align: center;
	font-size: xx-large;
	color: #FFCC00;
	font-family: 'Times New Roman', Arial, Helvetica, sans-serif; 
}
.marquee1 h1 {
	margin-top: -15px;
	margin-left: -15px;
	position: absolute;
	width: 100%;
	height: 100%;
	margin: 0;
	line-height: 50px;

	 /* Apply animation to this element */;
	-moz-animation: marquee1 10s ease-out;
	-webkit-animation: marquee1 10s ease-out;
	animation: marquee1 10s ease-out;
}
/* Move it (define the animation) */
@-moz-keyframes marquee1 {
 0%   { -moz-transform: translateX(200%); }
 100% { -moz-transform: translateX(0%); }
}
@-webkit-keyframes marquee1 {
 0%   { -webkit-transform: translateX(200%); }
 100% { -webkit-transform: translateX(0%); }
}
@keyframes marquee1 {
 0%   { 
 -moz-transform: translateX(200%); /* Firefox bug fix */
 -webkit-transform: translateX(200%); /* Firefox bug fix */
 transform: translateX(200%); 		
 }
 100% { 
 -moz-transform: translateX(0%); /* Firefox bug fix */
 -webkit-transform: translateX(0%); /* Firefox bug fix */
 transform: translateX(0%); 
 }
}
/* ----- End requirements for the index page ----- */
/* ----- Requirements for sub pages ----- */
.style15 {
	background-color: #000;
	text-align: center;
}
.style16 {
	color: #FFFFFF;
	font-size: x-small;
	font-family: "Script MT Bold", Arial, Helvetica, sans-serif;
}
.style17 {
	color: #FFFFFF;
	font-size: medium;
	font-family: "Script MT Bold", Arial, Helvetica, sans-serif;
}
.style18 {
	background-color: #000;
}
.style21 {
	text-align: center;
	border-left: 8px solid #333;
	border-top: 8px solid #444;
	border-right: 8px solid #FFF;
	border-bottom: 8px solid #FFF;
}
/* ----- End requirements for sub pages ----- */
/* ----------- picture rollover action -------------- */

#ia1f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/HnQp0Y6Z/ia1f.jpg') no-repeat 0 0;
}
#ia1f:hover {
	background-position: 0 -0px;
}
#ia1f:active {
	background-position: 0 -600px;
}
#ia1f span {
	display: none;
}
#ia2f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/8zk1WVM4/ia2f.jpg') no-repeat 0 0;
}
#ia2f:hover {
	background-position: 0 -0px;
}
#ia2f:active {
	background-position: 0 -600px;
}
#ia2f span {
	display: none;
}
#ia3f {
	display: block;
	width: 1104px;
	height: 736px;
	background: url('https://i.postimg.cc/gkS7S91N/ia3f.jpg') no-repeat 0 0;
}
#ia3f:hover {
	background-position: 0 -0px;
}
#ia3f:active {
	background-position: 0 -736px;
}
#ia3f span {
	display: none;
}
#ia4f {
	display: block;
	width: 1104px;
	height: 736px;
	background: url('https://i.postimg.cc/vm9SZ4TN/ia4f.jpg') no-repeat 0 0;
}
#ia4f:hover {
	background-position: 0 -0px;
}
#ia4f:active {
	background-position: 0 -736px;
}
#ia4f span {
	display: none;
}
#ib1f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/BbBNdwpZ/ib1f.jpg') no-repeat 0 0;
}
#ib1f:hover {
	background-position: 0 -0px;
}
#ib1f:active {
	background-position: 0 -600px;
}
#ib1f span {
	display: none;
}
#ib2f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/xd70z6Kd/ib2f.jpg') no-repeat 0 0;
}
#ib2f:hover {
	background-position: 0 -0px;
}
#ib2f:active {
	background-position: 0 -600px;
}
#ib2f span {
	display: none;
}
#ib3f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/QMBDhcRZ/ib3f.jpg') no-repeat 0 0;
}
#ib3f:hover {
	background-position: 0 -0px;
}
#ib3f:active {
	background-position: 0 -600px;
}
#ib3f span {
	display: none;
}
#ib4f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/mZ3sLL6k/ib4f.jpg') no-repeat 0 0;
}
#ib4f:hover {
	background-position: 0 -0px;
}
#ib4f:active {
	background-position: 0 -600px;
}
#ib4f span {
	display: none;
}
#ic1f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/26tMT5Gd/ic1f.jpg') no-repeat 0 0;
}
#ic1f:hover {
	background-position: 0 -0px;
}
#ic1f:active {
	background-position: 0 -600px;
}
#ic1f span {
	display: none;
}
#ic2f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/J0kr5vNn/ic2f.jpg') no-repeat 0 0;
}
#ic2f:hover {
	background-position: 0 -0px;
}
#ic2f:active {
	background-position: 0 -600px;
}
#ic2f span {
	display: none;
}
#ic3f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/4dhyWYZs/ic3fa.jpg') no-repeat 0 0;
}
#ic3f:hover {
	background-position: 0 -0px;
}
#ic3f:active {
	background-position: 0 -600px;
}
#ic3f span {
	display: none;
}
#ic3fb {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/NG6fLqjJ/ic3fb.jpg') no-repeat 0 0;
}
#ic3fb:hover {
	background-position: 0 -0px;
}
#ic3fb:active {
	background-position: 0 -600px;
}
#ic3fb span {
	display: none;
}
#ic4f {
	display: block;
	width: 900px;
	height: 600px;
	background: url('https://i.postimg.cc/SRk4cRxZ/ic4f.jpg') no-repeat 0 0;
}
#ic4f:hover {
	background-position: 0 -0px;
}
#ic4f:active {
	background-position: 0 -600px;
}
#ic4f span {
	display: none;
}
/* ----------- end picture rollover action -------------- */
/* ----- Requirements for cycling page ----- */
.style19 {
	color: #2F4F4F;
	font-size: 15px;
	font-family: "Arial, Helvetica, sans-serif, Script MT Bold";
	background-color: #FFFDF1;
	table-layout: fixed;
	width: 290px; 
}
/* ----- End requirements for cycling page ----- */
/* ----- Requirements for bike nights page ----- */
.marquee2 {
 height: 50px;	
 overflow: hidden;
 position: relative;
}
.marquee2 h2 {
	margin-top: -15px;
	position: absolute;
	width: 100%;
	height: 100%;
	margin: 0;
	line-height: 50px;
	text-align: center;
	font-size: xx-large;
	color: #FFCC00;
	font-family: 'Times New Roman', Arial, Helvetica, sans-serif; 
	/* Apply animation to this element */;
	-moz-animation: marquee2 10s ease-out;
	-webkit-animation: marquee2 10s ease-out;
	animation: marquee2 10s ease-out;
}
/* Move it (define the animation) */
@-moz-keyframes marquee2 {
 0%   { -moz-transform: translateX(200%); }
 100% { -moz-transform: translateX(0%); }
}
@-webkit-keyframes marquee2 {
 0%   { -webkit-transform: translateX(200%); }
 100% { -webkit-transform: translateX(0%); }
}
@keyframes marquee2 {
 0%   { 
 -moz-transform: translateX(200%); /* Firefox bug fix */
 -webkit-transform: translateX(200%); /* Firefox bug fix */
 transform: translateX(200%); 		
 }
 100% { 
 -moz-transform: translateX(0%); /* Firefox bug fix */
 -webkit-transform: translateX(0%); /* Firefox bug fix */
 transform: translateX(0%); 
 }
}
/* ----- End requirements for bike nights page ----- */
/* ----- end pages ----- */









/* ----- standard body and text elements ----- */

body{background-color:#475763}
body{font-family:tahoma}
body{font-size:8pt}
body{color:white}
body{font-weight:normal}

p{font-family:tahoma}
p{font-size:8pt}
p{color:white}
p{font-weight:bold}

h1{font-size:20pt}
h1{font-weight:normal}

h2{font-size:15pt}
h2{font-weight:normal}

h3{font-size:15pt}
h3{font-weight:bold}
h3{letter-spacing: 0.025cm}

/* ----- hypertext elements ----- */

a{text-decoration:none}
a{font-size:8pt}
a{font-weight:bold}
a{color:#C0C0C0}

a:hover{text-decoration:underline}
a:hover{color:#FF0000}
/* a:hover{color:#ffa24a} --- alternate color choice */

a.sort{font-size:8pt}
a.sort:hover{color:white}

a.stats{font-size:8pt}
a.download{font-size:8pt}

                    
/* ----- table elements ----- */

table{border-spacing:2pt}
/* table{border:2px solid #C0C0C0}/*  ----- optional border around entire table ----- */

/* ----- table headers ----- */

th{background-color:black}
th{white-space:nowrap}
th{font-family:tahoma}
th{font-size:7pt}
th{font-weight:bold}
th{color:white}
th{padding:5px 10px 5px 10px}
th{border:0.5px solid white}
th{vertical-align:top}

/* --- specific table headers --- */

th.name{background-color:black}
th.header{background-color:black}
th.header{border:0.0px solid white}
th.header{padding: 5px 0px 0px 0px}
th.line{background-color:#48555e}
th.line{border:0.0px solid white}
th.website{background-color:black}
th.e-mailaddress{background-color:black}
th.download{background-color:black}
th.number{background-color:black}
th.date{background-color:black}
th.bytes{background-color:black}
th.percent{background-color:black}
th.infolink{background-color:black}
th.venue{background-color:black}
th.cell{background-color:black}
th.extra{background-color:black}

/* ----- table headers specific to stats.html ----- */

th.ip{background-color:black}
th.connected{background-color:black}

/* ----- alternating table rows on index.html ----- */

tr.even{font-weight:bold}
tr.odd{font-weight:bold}
tr.even{background-color:#3B4751}
tr.odd{background-color:#384856}
tr.pic{color:#FFCC00}
tr.pic{border-color:#FFCC00}

/* ----- table data ----- */

td{font-size:8pt}
td{padding: 5px 0px 5px 5px}
td{white-space:normal}
td{empty-cells:show}

td.frame{padding: 0px 0px 0px 0px}
td.frame{border-left: 4px solid #C0C0C0}
td.frame{border-top: 4px solid #808080}
td.frame{text-align: center}
td.frame{border-right-style: solid}
td.frame{border-right-width: 4px}
td.frame{border-bottom-style: solid}
td.frame{border-bottom-width: 4px}

td.hash{font-size:8pt}

td.name{font-size:8pt}
td.name{white-space:nowrap} /* change to normal to wrap long lines */
td.cell{font-size:8pt}
td.cell{white-space:normal} /* change to nowrap to wrap long lines */

td.download{text-align:center}

td.number{text-align:center}
td.number{font-size:8pt}

td.number_red{color:red}
td.number_red{text-align:center}
td.number_red{font-size:8pt}
td.number_red{border:1px solid black}

td.number_yellow{color:#ffa24a}
td.number_yellow{text-align:center}
td.number_yellow{font-size:8pt}
td.number_yellow{border:1px solid black}

td.number_green{color:green}
td.number_green{text-align:center}
td.number_green{font-size:8pt}
td.number_green{border:1px solid black}

td.percent{text-align:center}
td.percent{font-size:8pt}

td.date{font-size:8pt}
td.date{white-space:nowrap}

td.bytes{font-size:8pt}
td.bytes{text-align:right}
td.bytes{white-space:nowrap}

td.infolink{font-size:8pt}
td.infolink{text-align:center}
td.infolink{white-space:nowrap}

/* ----- table data specific to stats.html ----- */

td.com_body{text-align:left}
td.path{text-align:left}
td.ip{text-align:center}
td.connected{text-align:right}

/* ----- table data specific to comments.html ----- */

code{font-family:tahoma}
code{font-size:8pt}

tr.com_body{background-color:#495763}
tr.com_header{background-color:#384856}

/* ----- miscellaneous ----- */

span.pipe{color:white}
span.nowrap{white-space:normal}

span.username{color:red}

/* ----------- button action -------------- */

#bh
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/h.gif') no-repeat 0 0;
}
#bh:hover
{ 
  background-position: 0 -27px;
}
#bh span
{
  display: none;
}

#bbn
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/bn.gif') no-repeat 0 0;
}
#bbn:hover
{ 
  background-position: 0 -27px;
}
#bbn span
{
  display: none;
}

#bmj
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/mj.gif') no-repeat 0 0;
}
#bmj:hover
{ 
  background-position: 0 -27px;
}
#bmj span
{
  display: none;
}

#bb
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/b.gif') no-repeat 0 0;
}
#bb:hover
{ 
  background-position: 0 -27px;
}
#bb span
{
  display: none;
}

#bow
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/ow.gif') no-repeat 0 0;
}
#bow:hover
{ 
  background-position: 0 -27px;
}
#bow span
{
  display: none;
}

#bmd
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/md.gif') no-repeat 0 0;
}
#bmd:hover
{ 
  background-position: 0 -27px;
}
#bmd span
{
  display: none;
}

#bpi
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/pi.gif') no-repeat 0 0;
}
#bpi:hover
{ 
  background-position: 0 -27px;
}
#bpi span
{
  display: none;
}

#bpii
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/pii.gif') no-repeat 0 0;
}
#bpii:hover
{ 
  background-position: 0 -27px;
}
#bpii span
{
  display: none;
}

#bpiii
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/piii.gif') no-repeat 0 0;
}
#bpiii:hover
{ 
  background-position: 0 -27px;
}
#bpiii span
{
  display: none;
}

#bpiv
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/piv.gif') no-repeat 0 0;
}
#bpiv:hover
{ 
  background-position: 0 -27px;
}
#bpiv span
{
  display: none;
}

#bpv
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/pv.gif') no-repeat 0 0;
}
#bpv:hover
{ 
  background-position: 0 -27px;
}
#bpv span
{
  display: none;
}

#bpvi
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/pvi.gif') no-repeat 0 0;
}
#bpvi:hover
{ 
  background-position: 0 -27px;
}
#bpvi span
{
  display: none;
}

#bpvii
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/pvii.gif') no-repeat 0 0;
}
#bpvii:hover
{ 
  background-position: 0 -27px;
}
#bpvii span
{
  display: none;
}

#bs
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/s.gif') no-repeat 0 0;
}
#bs:hover
{ 
  background-position: 0 -27px;
}
#bs span
{
  display: none;
}

#bem
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/em.gif') no-repeat 0 0;
}
#bem:hover
{ 
  background-position: 0 -27px;
}
#bem span
{
  display: none;
}
#bmp
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/mp.gif') no-repeat 0 0;
}
#bmp:hover
{ 
  background-position: 0 -27px;
}
#bmp:active {  
  background-position: 0 -54px;
}
#bmp span
{
  display: none;
}

#bg
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/g.gif') no-repeat 0 0;
}
#bg:hover
{ 
  background-position: 0 -27px;
}
#bg span
{
  display: none;
}
#bc
{
  display: block;
  width: 115px;
  height: 27px;
  background: url('icon/buttons/c.gif') no-repeat 0 0;
}
#bc:hover
{ 
  background-position: 0 -27px;
}
#bc span
{
  display: none;
}

/* ----------- end button action -------------- */
/* ----------- rollover action System -------------- */

#Motherboard {
	display: block;
	width: 350px;
	height: 240px;
	background: url('icon/gigabyte_mb2.png') no-repeat 0 0;
}
#Motherboard:hover {
	background-position: 0 -240px;
}
#Motherboard span {
	display: none;
}
#cpuz1 {
	display: block;
	width: 400px;
	height: 392px;
	background: url('icon/cpuz-1.jpg') no-repeat 0 0;
}
#cpuz1:hover {
	background-position: 0 -400px;
}
#cpuz1 span {
	display: none;
}
#cpuz2 {
	display: block;
	width: 400px;
	height: 392px;
	background: url('icon/cpuz-2.jpg') no-repeat 0 0;
}
#cpuz2:hover {
	background-position: 0 -400px;
}
#cpuz2 span {
	display: none;
}
#cpu {
	display: block;
	width: 400px;
	height: 392px;
	background: url('icon/cpu_1a.jpg') no-repeat 0 0;
}
#cpu:hover {
	background-position: 0 -382px;
}
#cpu span {
	display: none;
}
#fancpu {
	display: block;
	width: 297px;
	height: 240px;
	background: url('icon/fan_cpu-1.jpg') no-repeat 0 0;
}
#fancpu:hover {
	background-position: 0 -238px;
}
#fancpu span {
	display: none;
}

#memory {
	display: block;
	width: 450px;
	height: 320px;
	background: url('icon/mem_1a.jpg') no-repeat 0 0;
}
#memory:hover {
	background-position: 0 -320px;
}
#memory span {
	display: none;
}
#mon {
	display: block;
	width: 350px;
	height: 353px;
	background: url('icon/monitor-1.jpg') no-repeat 0 0;
}
#mon:hover {
	background-position: 0 -353px;
}
#mon span {
	display: none;
}

#hdd {
	display: block;
	width: 350px;
	height: 175px;
	background: url('icon/ssd-2.png') no-repeat 0 0;
}
#hdd:hover {
	background-position: 0 -175px;
}
#hdd span {
	display: none;
}
#video {
	display: block;
	width: 450px;
	height: 330px;
	background: url('icon/graphic-2.png') no-repeat 0 0;
}
#video:hover {
	background-position: 0 -330px;
}
#video span {
	display: none;
}
#psu {
	display: block;
	width: 450px;
	height: 400px;
	background: url('icon/psu-2.png') no-repeat 0 0;
}
#psu:hover {
	background-position: 0 -350px;
}
#psu span {
	display: none;
}
#tpm {
	display: block;
	width: 400px;
	height: 400px;
	background: url('icon/tpm-1.png') no-repeat 0 0;
}
#tpm:hover {
	background-position: 0 -400px;
}
#tpm span {
	display: none;
}
/* ----------- end rollover action System -------------- */
/* ----------- rollover action Server -------------- */

#motherboard2 {
	display: block;
	width: 350px;
	height: 316px;
	background: url('icon/p5kpl-am.png') no-repeat 0 0;
}
#motherboard2:hover {
	background-position: 0 -316px;
}
#motherboard2 span {
	display: none;
}
#cpu2 {
	display: block;
	width: 400px;
	height: 400px;
	background: url('icon/e5300.png') no-repeat 0 0;
}
#cpu2:hover {
	background-position: 0 -400px;
}
#cpu2 span {
	display: none;
}
#memory2 {
	display: block;
	width: 450px;
	height: 194px;
	background: url('icon/memory-2.png') no-repeat 0 0;
}
#memory2:hover {
	background-position: 0 -194px;
}
#memory2 span {
	display: none;
}
#mon2 {
	display: block;
	width: 350px;
	height: 262px;
	background: url('icon/dell-2.png') no-repeat 0 0;
}
#mon2:hover {
	background-position: 0 -262px;
}
#mon2 span {
	display: none;
}
#hdd2 {
	display: block;
	width: 314px;
	height: 450px;
	background: url('icon/hdd-2.png') no-repeat 0 0;
}
#hdd2:hover {
	background-position: 0 -450px;
}
#hdd2 span {
	display: none;
}
#wifi {
	display: block;
	width: 450px;
	height: 330px;
	background: url('icon/ew-7128g.png') no-repeat 0 0;
}
#wifi:hover {
	background-position: 0 -330px;
}
#wifi span {
	display: none;
}
#psu2 {
	display: block;
	width: 450px;
	height: 455px;
	background: url('icon/gmx-gp650b.png') no-repeat 0 0;
}
#psu2:hover {
	background-position: 0 -455px;
}
#psu2 span {
	display: none;
}
#tpm {
	display: block;
	width: 400px;
	height: 400px;
	background: url('icon/tpm-1.png') no-repeat 0 0;
}
#tpm:hover {
	background-position: 0 -400px;
}
#tpm span {
	display: none;
}
/* ----------- end rollover action Server -------------- */


