@charset "UTF-8";
/* CSS3 mod202205 ocinet.cl_CSSTopNav.css checked with CSE HTML Validator */

/* original top navigation Responsive -------- */

#myTopnav {  width: 30%; margin:auto;font-family:"Segoe UI Light",sans-serif;}

/* BACKGR BAR color original #333 #440000 - font on .topnav a,.dropdown .dropbtn */
.topnav {
    overflow: hidden;
    /*  background-color: #330000; */
    color: #440000;font-size: 1.0em;
    background:linear-gradient(180deg,rgba(255,255,255,0.8),rgba(190, 214, 92,1))!important;
}

/* text grey */
.topnav a {
    float: left;
    display: block;
    color: #440000;
    text-align: center;
    padding: 1em 16px;
    text-decoration: none;
    font-variant: small-caps;
}

/* active link bckg color red white #440000 */
.active {
    background:transparent;
    border-left: 4px solid green;
    background:linear-gradient(180deg,rgba(190, 214, 92,1),rgba(168,198,49,0.1));
}

.topnav .icon {
  display: none;
}

.dropdown {
    float: left;
    overflow: hidden;
}

.dropbtn {  font-size: 1em;
			}
/* BCKGR dropdown original #000*/
.dropdown .dropbtn {
    font-variant: small-caps;
    background: transparent;
    border: none;
    outline: none;
    color: #440000;
    padding: 1em 16px;
/*    background-color: #330000;*/
    font-family: inherit;
    margin: 0;
}
/* dropdown content bckg color original minw:160 #f5f5f5 #e8f7d4*/
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #deebad;
	background:linear-gradient(180deg,rgba(190, 214, 92,0.01),rgba(168,198,49,0.9));
    opacity: 1;filter: Alpha(opacity=90); /* IE8 and earlier */
    min-width: 120px;
    
    z-index: 1;
}

.dropdown-content a {
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
	background-color: #deebad;
}

/* bckg color hover original red white*/
.topnav a:hover, .dropdown:hover .dropbtn {text-decoration: underline;
    background: green; color: green; font-weight: 500;
    background:linear-gradient(180deg,rgba(255,255,255,1),rgba(128, 194, 36,1));
}

/* dropdown bckg color hover original #ddd*/
.dropdown-content a:hover {
	opacity: 1;filter: Alpha(opacity=100); /* IE8 and earlier */
	border: 1px solid green;
    background:linear-gradient(180deg,rgba(255,255,255,1),rgba(128, 194, 36,1));
    color: #006600;
	font-weight:bold;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.content {
  	padding: 16px;
}

@media screen and (max-width: 990px) {

  	#myTopnav {width: 83.33%; }
}
  /* Responsive at 769px icon */
@media screen and (max-width: 769px) {
    .topnav a:not(:first-child), .dropdown .dropbtn {
      display: none;
      }
    .topnav a.icon {
      float: right;
      display: block;
      }
    #myTopnav {width: 100%;}
    .topnav a .dropdown .dropbtn { font-size: 0.9em;
    }
}
  /* Responsive at 769px icon */
@media screen and (max-width: 769px) {
  	.topnav.responsive { position: relative;}
  	.topnav.responsive .icon {
    	position: absolute;
    	right: 0;
    	top: 0;
    	}

    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
        }
    .topnav.responsive .dropdown {float: none;}
    .topnav.responsive .dropdown-content {position: relative;}
    .topnav.responsive .dropdown .dropbtn {
        display: block;
        width: 100%;
        text-align: left;
        }
}

/* END maxw 600 830 */
/* END original top navigation -------- */