
.tinypics {
	width: 59px; height: 59px;
}

.tinypicfigs {
	margin: 0 0 0 16px;font-size: .65rem;
}

.pinkybrown h3 {
	font-size: 1.75em;
}

.pinkybrown {
	 background-color: rgb(116, 109, 101); 
	 border: solid gray 10px;
	 border-radius: 10px;
	 width: 100%;
	 padding: 24px;
	 color: white;
 }
 
a.menulinks:link { color: yellow;}
a.menulinks:visited { color: yellow;}
a.menulinks:hover { color: gray; font-weight: bold;}
a.menulinks:active { color: blue;}

a.whitewords:link {color: white;}
a.whitewords:visited {color: white;}
a.whitewords:hover {color: white;}
a.whitewords:active {color: white;}
 
#timey {background: url(../images/hgwells_time_machine.jpg) right top no-repeat #DDCCBA;}

.prevnextleft {margin-right: 0;}
 
.spacer {
    border-bottom: solid gray 1px; margin-bottom: 8px;
} 

/*audio buttons*/

.button {
  display: inline-block;
  border-radius: 4px;
  background-color: gray;
  text-align: center;
  font-size: 32px;
  margin: 32px;
  width: 200px;
  height: 137px;
  cursor: pointer;
  border: solid yellow 1px; 
  vertical-align: middle;
}

.button span {
  cursor: pointer;
  display: inline-block;
}

.button1:hover span {
  background-color: red;
}

.button2:hover span {
  background-color: aqua;
}

.button1 {background: url(../images/granny.jpg) center top no-repeat;}
.button2 {background: url(../images/angeltoots.jpg) center top no-repeat;}

.transbutt {
	background-color: gray;
	font-weight: bold;
} 

.buttpad {
	padding: 0 2px;
}

/*spinning Tesla graphic controls*/

.spintesla {
  display: none;
}

.twirl-outside {
    animation-name: rotsky;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	}
	
.twirl-middle {
    animation-name: rotsky;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	animation-direction: reverse;
	}

.twirl-inside {
    animation-name: rotsky;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear; 
}

@keyframes rotsky {
    0% {transform: rotate(0deg);
    } 
    100% {transform: rotate(360deg);
    }
}

/*for the airman screenplay link*/

#airman {
	background-image: url(images/time_jump.jpg);
	display:block;		
	width:289px;
	height:183px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	position: absolute; top: 0; right: 0;
}

#airman:hover {
	background: url(../images/time_jump_hover.jpg) no-repeat;
}

/*for callforfamilyrecords.htm gets rid of the big background pic #timey on a small screen*/

@media screen and (max-width: 765px) {
    body {font-size: .75rem;}
    #timey {background: url(../images/hgwells_time_machinexx.jpg) #DDCCBA;}
	.biggle {display: none;}
    .widdle {display: block;}
	
}




