/* responsive nav bar stuff */
/* Works in conjunction with nav-bar.js
See html Snippets at Bottom */
.topnav {
margin: 0;
overflow: hidden;
background-color: #6F42C1;
box-shadow: 0 0 2px rgb(111 66 193 / 90%), 0 0 4px rgb(111 66 193 / 40%), 0 0 1rem rgb(111 66 193 / 30%), 0 0 4rem rgb(111 66 193 / 10%);
}
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.topnav a:hover {
background-color: #ddd;
color: black;
}
.topnav a.active {
background-color: #2F9BCB;
color: white;
text-shadow: 0 0 1px rgb(229 250 255 / 90%), 0 0 2px rgb(255 255 255 / 90%), 0 0 5px rgb(255 255 255 / 90%);
}
.topnav .icon {
display: none;
}
@media screen and (max-width: 600px) {
.topnav a:not(:first-child) {display: none;}
.topnav a.icon {
float: right;
display: block;
}
}
@media screen and (max-width: 600px) {
.topnav.responsive {position: relative;}
.topnav.responsive .icon {
position: absolute;
right: 0;
top: 0;
}
.topnav.responsive a {
float: none;
display: block;
text-align: left;
}
}
/* THIS IS HAMBURGER LINK(fa-bars) AND HTML FOR MENU
*/