/* CSS Document */
body {
	background: #000;
	text-align: center;
	color: black !important;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
body {
	background-color: #ffff00;


}

img {
	border: 0;
}

a {
	color: #FFF;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

#box {
	background-color: #222;
	border: #AAA thin solid;
	padding: 10px;
}

.contents h3 {
	color: #F00;
	margin: 0;
	padding: 0;
}

.contents {
	text-align: left;
	background-color: #ffff00 !important;
	border: 3px solid black;
}

#footer {
	margin-top: 10px;
}

#footer a {
	font-weight: bold;
}
@-webkit-keyframes greenPulse {
  from { background-color: #749a02; -webkit-box-shadow: 0 0 9px #333; }
  50% { background-color: #91bd09; -webkit-box-shadow: 0 0 18px #91bd09; }
  to { background-color: #749a02; -webkit-box-shadow: 0 0 9px #333; }
}
a.green.button {
  -webkit-animation-name: greenPulse;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
}

.redbutton {
	-webkit-animation-name: redPulse;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	transition: all 0s 9999999s;
}
span:active ~ .redbutton {
    transition: all 0s;
    color: red;
}



.greenbutton {
	-webkit-animation-name: greenPulse;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	transition: all 0s 9999999s;
}

.realRedButton {
	-webkit-animation-name: realredPulse;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	transition: all 0s 9999999s;
}

.silverButton {
	-webkit-animation-name: silverPulse;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	transition: all 0s 9999999s;
}

.yellowButton {
	-webkit-animation-name: yellowPulse;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	transition: all 0s 9999999s;
}

.purpleButton {
	-webkit-animation-name: purplePulse;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	transition: all 0s 9999999s;
}

.goldButton {
	-webkit-animation-name: goldPulse;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	transition: all 0s 9999999s;
}
.bigblack {
font-size: 2em;
color: white;
background-color: black;

}
.bigblack:hover {
border-bottom: 2px solid blue;
border-top: 2px solid red;
border-left: 2px solid white;
border-right: 2px solid green;
}

@-webkit-keyframes realredPulse {
	  from { background-color: #ff3300; -webkit-box-shadow: 0 0 9px #333; }
	  50% { background-color: #e60000; -webkit-box-shadow: 0 0 18px #2daebf; }
	  to { background-color: #990033; -webkit-box-shadow: 0 0 9px #333; }
}

@-webkit-keyframes silverPulse {
	  from { background-color: #cccccc; -webkit-box-shadow: 0 0 9px #333; }
	  50% { background-color: #ccccff; -webkit-box-shadow: 0 0 18px #2daebf; }
	  to { background-color: #bfbfbf; -webkit-box-shadow: 0 0 9px #333; }
}

@-webkit-keyframes yellowPulse {
	  from { background-color: #ffff00; -webkit-box-shadow: 0 0 9px #333; }
	  50% { background-color: #ff9900; -webkit-box-shadow: 0 0 18px #2daebf; }
	  to { background-color: #cc3300; -webkit-box-shadow: 0 0 9px #333; }
}

@-webkit-keyframes purplePulse {
	  from { background-color: #cc00cc; -webkit-box-shadow: 0 0 9px #333; }
	  50% { background-color: #cc0099; -webkit-box-shadow: 0 0 18px #2daebf; }
	  to { background-color: #ff66ff; -webkit-box-shadow: 0 0 9px #333; }
}

@-webkit-keyframes goldPulse {
	  from { background-color: #cccc00; -webkit-box-shadow: 0 0 9px #333; }
	  50% { background-color: #cc9900; -webkit-box-shadow: 0 0 18px #2daebf; }
	  to { background-color: #999900; -webkit-box-shadow: 0 0 9px #333; }
}




@-webkit-keyframes redPulse {
	  from { background-color: #007d9a; -webkit-box-shadow: 0 0 9px #333; }
	  50% { background-color: #2daebf; -webkit-box-shadow: 0 0 18px #2daebf; }
	  to { background-color: #007d9a; -webkit-box-shadow: 0 0 9px #333; }
}



ul li {
		padding-left:8px;
		list-style:none;
		margin-bottom:6px;
		text-align: center;
		text-indent: -12px;
		}
		li:before{
			padding-right: 4px;
			content: url("images/list.png");
		}
		
		
		.rainbow:hover {
-webkit-animation:rainbow 1s infinite;
-ms-animation:rainbow 1s infinite;
-o-animation:rainbow 1s infinite;
animation:rainbow 1s infinite;
}
@-webkit-keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}
@-ms-keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}
@-o-keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}
@keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}