/*Strip the ul of padding and list styling*/ nav { background-color:#EDDAB7; color:#000000; left: 0; /*overflow:scroll;*/ padding: 0 10vw 0 0; position: fixed; right: 0; top: 0; z-index: 999; /*font-weight: bold;*/ font-family: "Trebuchet MS", Helvetica, sans-serif; } nav ul { list-style-type:none; /*margin:0;*/ padding:0; position: absolute; margin-left:140px; } /*Create a horizontal list with spacing*/ nav li { display:inline-block; float: left; margin-right: 1px; font-weight:bold; } /*Style for menu links*/ nav li a { display:block; min-width:120px; text-align: center; height: 50px; line-height: 50px; color: #fff; background: #EDDAB7; text-decoration: none; } /*Hover state for top level links*/ nav li:hover a { /* background: #7A7A7A; */ color: #fff; background: #BDAE92; /* color: #2f3036; */ text-decoration:none; /* color: #f00; */ } /*Style for dropdown links*/ nav li:hover ul a { background: #EDDAB7; color: #2f3036; height: 40px; line-height: 40px; margin: 0; text-decoration:none; text-align: left; } /*Hover state for dropdown links*/ nav li:hover ul a:hover { background: #BDAE92; text-decoration:none; color: #fff; /* white */ } /*Hide dropdown links until they are needed*/ nav li ul { display: none; margin-left: 0px; } /*Make dropdown links vertical*/ nav li ul li { display: block; float: none; } /*increasing the width of the last li in the main menu */ nav ul li:nth-last-child(1) ul{ width:max-content; } /*Prevent text wrapping*/ nav li ul li a { width: auto; min-width: 100px; padding: 0 20px; } /*Display the dropdown on hover*/ nav ul li a:hover + .hidden, .hidden:hover { display: block; } .logo{ top:0; left:0; position: absolute; } /*Style 'show menu' label button and hide it by default*/ .show-menu { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-align: center; padding: 10px 0; display: none; margin-left: 140px; } /*Hide checkbox*/ nav input[type=checkbox]{ display: none; } /*Show menu when invisible checkbox is checked*/ nav input[type=checkbox]:checked ~ #menu{ display: block; } .menu{ display: inline; } /*nav .searchbox{ margin-right: 20px; float: right; position:relative; background-color: #EDDAB7; }*/ nav .searchbox input[type=text]{ height:25px; width:100px; border-radius:25px; color: black; background-color: #f5f5f5; } nav .searchbox{ position: relative; float:right; width:200px; padding:10px; /*background-color: #EDDAB7;*/ } nav .donate{ background-color:#F5ECDB;/*#ADA96B;*/ color:black; font-size: 16px; width:115%; margin-top: 60px; } nav .donate p{ /* gbn 20200506: font-weight:bold; */ margin-top:0px; margin-left:140px; display: inline; /*font-weight:unset;*/ } nav .donate .donbtn{ display:inline-block; cursor: pointer; } nav .donate a:link{ text-decoration: underline; } nav .donate a:hover{ background: #BDAE92; color: #fff; /* white */ } /*Responsive Styles*/ @media screen and /*(orientation: portrait)*/(max-width : 750px){ /*Make dropdown links appear inline*/ nav { height:auto; font-size:12px; position:absolute; } nav ul { position: static; display: none; } /*Create vertical spacing*/ nav li { margin-bottom: 1px; } /*Make all menu links full width*/ nav ul li, li a { width:auto; display: inline-block; } nav ul li ul{ width:auto; } nav li a{ text-align:left; } /*Display 'show menu' link*/ nav .show-menu { top:0; display:inline-block; } nav .donate p{ display: inline-block; margin-left: 0px; } nav .donate{ display: none; } /*nav .searchbox input{ margin-left: 80px; width:140px; }*/ nav .searchbox{ float:none; background-color: transparent; display:inline-block; } } /* ================================================== navigation */ /*nav { background-color:#EDDAB7; color:#000000; height: 60px; left: 0; padding: 20px 10vw 0 0; position: fixed; right: 0; top: 0; z-index: 999; } /* page links nav a { display: block; float: left; line-height: 20px; max-width: 125px; padding: 10px; text-decoration: none; width: 25%; } nav .searchbox{ display: block; float: left; line-height: 20px; max-width: 125px; padding: 10px; text-decoration: none; width: 25%; /* display: block; float: right; width: 100px; padding: 10px; */ } nav .searchbox input{ height:25px; width:200px; border-radius:25px; color: black; text-align: left; background-color: #f5f5f5; } nav li a img{ position:absolute; top: 0; left:0; } /*.logo{ height:75px; width:75px; } nav ul li{ display:inline; } nav a.page { font-weight: 700; position:relative; text-decoration: none; } nav a.page:after { background: #000000; bottom: -11px; content: ""; height: 1px; left: 5%; opacity: 0; pointer-events: none; position: absolute; right: 5%; transform: scale(0, 1); transition: all 200ms; } nav a.page:hover:after { opacity: 1; transform: scale(1, 1); } .underline { background: #000000; height: 1px; left: 5%; margin-top: 20px; position: absolute; right: 50%; } @media screen and (orientation: portrait) { .underline { right: 25%; } } nav .social { float: right; } nav .social a { height: 20px; width: 20px; } nav .donate{ background-color:#F5ECDB; color:black; font-size: 16px; width:115%; } nav .donate p{ /* gbn 20200206: font-weight:bold; */ margin-top:0px; margin-left:140px; display: inline; } nav .donate .donbtn{ display:inline-block; cursor: pointer; } nav .donate a{ float:none; display: inline; } nav .donate a:hover { color: currentColor; background:#E7E292; text-decoration: underline; } nav .donate a:link { text-decoration: underline; } nav .donate a:visited { color: #3E444D; } @media only screen and (max-width: 1000px) { nav .social a:not(:last-child) { display: none; } }*/