/* Variables */

:root {
	--link-color: #7b775f; 		/* Text Dark */ 
	--link-hover: #dfac57; 		/* Text Light */
	--link-current: #ba8b3d;	/* Text Medium */
}


/* Textual Navigation */

a:link { 
	font-family: P22Stickley2-TextBold, Georgia, serif;
	color: var(--link-color-dark);
	text-decoration: none;
	transition: 0.5s;
	}

a:visited { 
	font-family: P22Stickley2-TextBold, Georgia, serif;
	color: var(--link-color-dark);
	text-decoration: none;
	}

a:hover { 
	color: var(--link-color-light);
	text-decoration: none;
	border-bottom: none;
	text-shadow: 0px 0px 5px white;
	}

a:active { 
	color: var(--link-hover);
	text-decoration: none;
	}

a.current { 
	color: var(--link-current);
	text-decoration: none;
	transition: 0.5s;
	}

a:current.hover { 
	color: var(--link-hover);
	text-decoration: none;
	text-shadow: 0px 0px 5px white;
	}

a.currentalt { 
	color: var(--link-current);
	text-decoration: none;
	}

a:hover.currentalt { 
	color: var(--link-hover);
	text-decoration: none;
	text-shadow: 0px 0px 5px white;
	}

a.linkbright:link {
	color: #a6d7de;
}

a.linkbright:visited {
	color: #a6d7de;
}

a.linkbright:hover {
	color: #acacac;
}








/* Button Highlight */



.btn {
	width: 93%;
	border: 1px solid rgba(var(--text-color-dark), var(--alpha-00));
	padding: 4px 0px 0px 16px;
	margin: 0% 0% 0% 0%;
	font-size: 1.0em;
	cursor: pointer;
	border-radius: 8px;
	float: left;
	transition: 0.3s ease-out;
}


/* Link */

.link {
/*		background-color:  rgba(var(--text-color-dark), var(--alpha-00)); */
/*		border: 1px solid rgba(var(--text-color-dark), var(--alpha-10)); */
	color: rgba(var(--text-color-dark), var(--alpha-80));
}

.link:hover {
	background-color:  rgba(var(--text-color-light), var(--alpha-50)); 
	border: 1px solid rgba(var(--text-color-dark), var(--alpha-20));
	color: rgba(var(--text-color-dark), var(--alpha-100));
/*	box-shadow: 0px 2px 8px rgba(0, 0, 0, .05); */
}















/* Nav Menu Control Button */

.collapsible-menu {
	width: 40px;
	
	margin: 0 16px 0 0;
	
/*	background-color: rgba(var(--fill-color-light), var(--alpha-50)); */
/*	backdrop-filter: blur(20px); */
/*	-webkit-backdrop-filter: blur(20px); */

/*	box-shadow: 1px 2px 3px rgba(0,0,0,0.1);  */
	text-align: left;

	z-index: 20; /* Ensures the nav is on top of other content */

	border: 0px solid rgba(var(--background-color), var(--alpha-100));

	color: rgba(var(--text-color-dark), var(--alpha-80));
	border-radius: 8px;

	float: right;
    display: block;

}



.collapsible-menu label {
	height: 40px;

/*	
	font-family: P22Stickley2-Text, Georgia, serif;
    font-weight: regular;
    font-style: regular;
	text-transform: uppercase;
	text-align: left;
    font-size: 1.21em;
 */

    display: block;
    cursor: pointer;
    background: url("../images/menu.svg") no-repeat left center;
	background-size: cover;
    padding: 0px 0px 0px 0px; /* Pushes MENU button away from margin */
    margin: 0px 0px 0px 0px; /* Pushes MENU button away from margin */

	background-color: rgba(var(--fill-color-light), var(--alpha-30));


}




/* Pop Out Menu Container */

.menu-content {
	width: 240px;
    max-height: 0;
    overflow: hidden;

	font-size: 1.21em;
	text-decoration: none;

	margin-top: 0px;  /* Pushes content away from MENU button */
    padding: 0px 0px 0px 0px;  /* Links left margin aligment */
 
	background-color: rgba(var(--fill-color-light), var(--alpha-50));

	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(16px);

	border: red solid 0px;
	border-radius: 8px;
    box-shadow: 2px 4px 5px rgba(0,0,0,0.2);

	float: right;

}




/* Pop Out Menu UL Items */


.collapsible-menu ul {
    list-style-type: none;
    padding: 0;

}


/* Actual Menu Links */

.collapsible-menu a {
    display: block;
    margin: 6px 0px 6px 0px; /* Spacing between Menu Items */
    padding: 10px 0px 10px 0px; /* Spacing inside Menu Items */
    
    text-decoration: none;
	color: var(--text-color-dark);
    border: red solid 0px;



}





/* Menu Icons */


input#menu {
    display: none;
}



input:checked +label {
    background-image: url("../images/close.svg");
}




/* Toggle Effect */
input:checked ~ label {
    background-image: url("../images/close.svg");
}



input:checked ~ .menu-content {
    max-height: 100%;
}