/*Border colors as need to be defined after border exists so put at bottom of page*/
.border-red{
border-color: #d60000;
}
.border-pink{
border-color: #d600c9;
}
.border-bright-pink{
border-color: #fd24c7;
}
.border-light-pink{
border-color: #d98a9a;
}
.border-violet{
border-color: #a020e0;
}
.border-blue{
border-color: #0034d1;
}
.border-dark-blue{
border-color: #02024a;
}
.border-royal-blue{
border-color: #0028c8;
}
.border-light-blue{
border-color: #2a8fb3;
}
.border-teal{
border-color: #2a8fa0;
}
.border-purple{
border-color: #5e03b5;
}
.border-bright-purple{
border-color: #8c00d6;
}
.border-turquoise{
border-color: #00b8cc;
}
.border-green{
border-color: #009a17;
}
.border-light-green{
border-color: #00a82f;
}
.border-dark-green{
border-color: #146a1a;
}
.border-yellow{
border-color: #c7c900;
}
.border-orange{
border-color: #d65f00;
}
.border-brown{
border-color: #6a2400;
}
.border-black{
border-color: #000000;
}
/* Hover--------------------------------------------------------------------------------------------------*/
/* Check if device supports hovering before use as otherwise css stays in hovered state */
/* https://drafts.csswg.org/mediaqueries-4/#mf-interaction */

@media (hover:hover){
	/*Master section---------------------------------*/
	.main-navigation-link.home-link:hover{
	background-color: #e6ffff;
	}
	.main-navigation-link.about-link:hover{
	background-color: #ffccff;
	}
	.main-navigation-link.books-link:hover{
	background-color:#ffff99;
	}
	.main-navigation-link.blog-link:hover{
	background-color: #ccffcc;
	}
	.main-navigation-link.christmas-link:hover{
	background-color: #ffe6e6;
	}
	.main-navigation-link.extras-link:hover{
	background-color: #dfabff;
	}
	.main-navigation-link.contact-link:hover{
	background-color:#a5fff8;
	}
	/* Wave Buttons----------------------------------- */
	.wave4{ /*set opacity of wave4 to 1 in resting state*/
	opacity: 1;
	}
	.wave2{ /*set opacity of wave2 to 0 in resting state: wave4 will show*/
	opacity: 0;
	}
	.wave:hover .wave4{ /*wave4 does not show in 'hover' state or 'active' state*/
	opacity: 0;
	}
	.wave:hover .wave2{ 
	opacity: 1;
	}
	.wave:hover .wave2,
	.wave:hover .wave3{ 
	/*transform: scale(1.2,1.2);  /*makes harrison bigger when in hover and active states*/
	}
	/*end of Wave Buttons----------------------------- */
	/*End of Master Section------------------------- */
	/*Extras Pages------------------------- */
	.extras-box:hover{
	border-style: dotted;
	}
	/*End of Extras Pages------------------------- */	
	/* Images */
	.extras-thumbnail:hover,
	.books-page-image:hover,
	.book-bar-image:hover,
	.blog-bar-image:hover,
	.features-image:hover{
	border-style: dotted;
	}
	/* ----------------------------------------------- */
	/*Bookhtml pages---------------------------------- */
	#pdf-link:hover{
	background-color: #bfff80;
	border-style:dotted;
	}
	#bookhtml-nav-toggle:hover{
	background-color: #ffff99;
	border-right-style:dotted;
	}
	#bookhtml-l-arrow:hover{
	background-color: #ffe0cc;
	border-style:dashed;
	}
	#bookhtml-r-arrow:hover{
	background-color: #99ff99;
	border-style:dashed;
	}
	#bookhtml-r-arrow-start:hover{
	background-color: #ccffff;
	border-style:dashed;
	}
	#bookhtml-read-again:hover{
	background-color: #ccffff;
	border-style:dashed;
	}
	.jumpto:hover{
	background:#ffcfed;
	}
	/* Active page should override hover*/
	.jumpto.active:hover{
	background:#fff30d;
	}	
	/*end of Bookhtml pages---------------------------------- */
}
/*End Hover--------------------------------------------------------------------------------------------------*/
/*Active--------------------------------------------------------------------------------------------------*/
/* Active must come after Hover! https://www.w3schools.com/css/css_link.asp */
/*Master section----------------------------*/
.main-navigation-link.home-link:active{
background-color:  #e6ffff;
}
.main-navigation-link.about-link:active{
background-color: #ffccff;
}
.main-navigation-link.books-link:active{
background-color:#ffff99;
}
.main-navigation-link.blog-link:active{
background-color: #ccffcc;
}
.main-navigation-link.christmas-link:active{
background-color:#ffe6e6;
}
.main-navigation-link.extras-link:active{
background-color: #dfabff;
}
.main-navigation-link.contact-link:active{
background-color:#a5fff8;
}
/* Wave Buttons----------------------------------- */
.wave:active .wave4 { /*wave4 does not show in 'hover' state or 'active' state*/
opacity: 0;
}
.wave:active .wave2 { 
opacity: 1;
}
.wave:active .wave2,
.wave:active .wave3 { 
/*transform: scale(1.2,1.2);  /*makes harrison bigger when in hover and active states*/
}
/*end of Wave Buttons----------------------------- */
/*End of Master Section------------------------- */
/*Extras Pages------------------------- */
.extras-box:active{
border-style: dotted;
}
/*End of Extras Pages------------------------- */	
/* Images */
.extras-thumbnail:active,
.books-page-image:active,
.book-bar-image:active,
.blog-bar-image:active,
.features-image:active{
border-style: dotted;
}
/* ----------------------------------------------- */
/*Bookhtml pages---------------------------------- */
#pdf-link:active{
background-color: #bfff80;
border-style:dotted;
}
#bookhtml-nav-toggle:active{
background-color: #ffff99;
border-right-style:dotted;
}
#bookhtml-read-again:active{
background-color: #ccffff;
border-style:dashed;
}
#bookhtml-l-arrow:active{
background-color: #ffe0cc;
border-style:dashed;
}
#bookhtml-r-arrow:active{
background-color: #99ff99;
border-style:dashed;
}
#bookhtml-r-arrow-start:active{
background-color: #ccffff;
border-style:dashed;
}
.jumpto:active {
 background:#ffcfed;
}
/* Active page should override hover + active */
.jumpto.active:active {
background:#fff30d;
}
/*end of Bookhtml pages---------------------------------- */
/*End Active--------------------------------------------------------------------------------------------------*/