home
 
 
 
CSS Menu Style (light background)
/*
												CSS Menu Style (light background)
												© System
												http://qdl.scs-inc.us/?top=14064
											*/
											/* http://www.script-tutorials.com/demos/87/index.html */
											 
											/* main menu styles */
											#qdlMenu {
											display: inline-block;
											width: 100%;
											margin:  0px 0px 0px -10px;
											padding: 0;
											padding-right: 5px;
											background: #335599 url("../../1stParty/Imgs/Miscellany/MenuBackGround.png") repeat-x 0 -110px;
											z-index: 2;
											position:  fixed;
											top:  0px;
											font-size: 80%;
											border-bottom: 1px black solid;
											}
											 
											#qdlMenu li {
											float: left;
											position: relative;
											list-style: none;
											}
											 
											#qdlMenu a {
											font-weight: bold;
											color: #e7e5e5;
											text-decoration: none;
											display: block;
											padding: 6px 9px;
											 
											border-radius: 10px; /*some css3*/
											-moz-border-radius: 10px;
											-webkit-border-radius: 10px;
											text-shadow: 0 2px 2px rgba(0,0,0, .7);
											}
											 
											/* selected menu element */
											#qdlMenu li:hover > a {
											background: #7788aa url("../../1stParty/Imgs/Miscellany/MenuBackGround.png") repeat-x 0 -20px;
											color: #000;
											 
											box-shadow: 0 2px 2px rgba(0,0,0, .7); /*some css3*/
											-moz-box-shadow: 0 2px 2px rgba(0,0,0, .7);
											-webkit-box-shadow: 0 2px 2px rgba(0,0,0, .7);
											text-shadow: 0 2px 2px rgba(255,255,255, 0.7);
											}
											 
											/* sublevels */
											#qdlMenu ul li:hover a, #qdlMenu li:hover li a {
											background: none;
											border: none;
											color: #000;
											}
											 
											#qdlMenu ul li a:hover {
											background: #335599 url("../../1stParty/Imgs/Miscellany/MenuBackGround.png") repeat-x 0 -100px;
											color: #fff;
											 
											border-radius: 10px; /*some css3*/
											-moz-border-radius: 10px;
											-webkit-border-radius: 10px;
											text-shadow: 0 2px 2px rgba(0,0,0, 0.7);
											}
											 
											#qdlMenu ul li: first-child > a {
											-moz-border-radius-topleft: 10px; /*some css3*/
											-moz-border-radius-topright: 10px;
											-webkit-border-top-left-radius: 10px;
											-webkit-border-top-right-radius: 10px;
											}
											 
											#qdlMenu ul li: last-child > a {
											-moz-border-radius-bottomleft: 10px; /*some css3*/
											-moz-border-radius-bottomright: 10px;
											-webkit-border-bottom-left-radius: 10px;
											-webkit-border-bottom-right-radius: 10px;
											}
											 
											/* drop down */
											#qdlMenu li:hover > ul {
											opacity: 1;
											visibility: visible;
											}
											 
											#qdlMenu ul {
											visibility: hidden;
											padding: 0;
											width: 22ch;
											position: absolute;
											z-index: 2;
											background: #fff;
											border: 1px solid #7788aa;
											 
											border-radius: 10px; /*some css3*/
											-moz-border-radius: 10px;
											-webkit-border-radius: 10px;
											box-shadow: 0 2px 2px rgba(0,0,0, .5);
											-moz-box-shadow: 0 2px 2px rgba(0,0,0, .5);
											-webkit-box-shadow: 0 2px 2px rgba(0,0,0, .5);
											 
											-moz-transition: opacity .25s linear, visibility .1s linear .1s;
											-webkit-transition: opacity .25s linear, visibility .1s linear .1s;
											-o-transition: opacity .25s linear, visibility .1s linear .1s;
											transition: opacity .25s linear, visibility .1s linear .1s;
											}
											 
											#qdlMenu ul li {
											float: none;
											margin: 0;
											}
											 
											#qdlMenu ul a {
											font-weight: normal;
											text-shadow: 0 2px 2px rgba(255,255,255, 0.7);
											}
											 
											#qdlMenu ul ul {
											left: 20ch;
											top: 0px;
											}
											 
											#qdlMenu ul ul a {
											padding: 6 15;
											}
											 
											.grayMenuItem {
											color: gray;
										}
↑ UP Powered by Quick Disclosure Lite
© 2010~2021 SCS-INC.US 		UP ↑