.bgslidemenu {font-family: Arial, Helvetica, sans-serif; font: 14px; position: relative; width: 1300px; margin: auto;}
.bgslidemenu:after { /* clear menu */ content: ''; clear: both; display: block;}
.bgslidemenu ul { /* Top Level Menu */ z-index: 100; margin: 0; padding: 0; position: relative; list-style: none; float: left; /* change to "left" to left align menu */}
.bgslidemenu ul li {/* Top level list items */ position: relative; display: inline; margin-right: 20px; /* spacing between each top level menu item */ float: left;}
.bgslidemenu ul li a {/* Top level menu items link style */ display: block; position: relative; color: white; padding: 6px 6px; color: black; text-decoration: none;}
.bgslidemenu ul li a:link, .bgslidemenu ul li a:visited {color: white;}
.bgslidemenu ul li:hover > a {/* Top level menu items link style on hover */color: purple !important;}
.bgslidemenu ul li > a {/* LIs links with a sub UL style */ /* add padding to accomodate arrow inside LIs */ padding-right: 25px;}
.bgslidemenu ul li > a:only-child {/* LIs links with NO sub UL style */ /* undo padding for non submenu LIs */ padding-right: 25px;}
.bgslidemenu ul li > a:after {/* add arrow inside LIs */ content: ""; position: absolute; height: 0; width: 0; border: 5px solid transparent;border-top-color: white; top: 50%; transform: translateY(-20%); right: 8px;}
.bgslidemenu ul li > a:only-child:after {/* LIs links with NO sub UL pseudo class */ /* undo arrow for non submenu LIs */ display: none;}
.bgslidemenu ul li ul {/* Sub ULs style */
position: absolute; left: -5000px; top: auto; opacity: 0; width: 290px; /* width of drop down menus */ visibility: hidden; padding-top: 5px; /* Add large top padding to drop down menu */ z-index: -1;

background: rgb(0,0,0);
background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(237,28,36,1) 50%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(237,28,36,1) 50%, rgba(0,0,0,1) 100%);
background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(237,28,36,1) 50%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);

transform: translateY(50px); -webkit-transition: opacity .3s, transform .5s, visibility 0s .3s, left 0s .3s; border: 2px solid #000000; 
transition: opacity .3s, transform .5s, visibility 0s .3s, left 0s .3s;}
.bgslidemenu ul li:hover > ul {/* Sub UL style on hover */ visibility: visible; left: -30px; transform: translateY(5px); /* move drop down menu upwards (should be smaller than padding-top value above) */
opacity: 1; -webkit-transition: opacity 1s, transform .5s; transition: opacity 1s, transform .5s;}
.bgslidemenu ul li ul li {/* Sub level Menu list items (alters style from Top level List Items) */ display: list-item; float: none; overflow: hidden;}
.bgslidemenu ul li ul li:after {/* Add animated line to sub menu item on Mouseover */ content: ''; position: absolute; width: 30px; height: 5px; background: #308fce; left: 0; top: 50%; transform: translate3d(-100%, -50%, 0); transition: transform .3s;}
.bgslidemenu ul ul li:hover:after {transform: translate3d(0, -50%, 0);}
.bgslidemenu ul ul li:hover > a {/* Sub Levels link style on hover and when active */ color: purple !important;}
.bgslidemenu ul li ul li a { /* Sub level menu links style */ font-family:Arial, Helvetica, sans-serif padding: 10px; padding-left: 40px; color: black;/* Add left padding to sub menu links to accommodate animated line */ position: relative; margin: 0;}
@media (max-width: 700px) {
.bgslidemenu ul {float: none;}
.bgslidemenu ul li {position: relative;display: block;width: 100%;}
.bgslidemenu ul li ul {width: 100%;position: relative;border-top: 2px solid #eee; /* change menu reveal type from "visibility" to "display". Former seems to cause browser to jump to top of page sometimes when menu header is tapped on */display: none;}
.bgslidemenu ul li:hover > ul {display: block; padding-top: 0; transform: none; z-index: 10000; left: 0 !important; top: auto;}
.bgslidemenu ul ul li:hover > ul {left: 0 !important; top: auto;}}

.menuext{
position: relative; 
float: inherit; 
top: 30px; 
margin-bottom: auto; 
margin-right: auto; 
margin-left: auto;	
clear: none; 
width:1300px; 
border: 2px solid #000000; 
background: rgb(0,0,0);
background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(237,28,36,1) 50%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(237,28,36,1) 50%, rgba(0,0,0,1) 100%);
background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(237,28,36,1) 50%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
}