/*@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,300);*/ @charset "UTF-8"; /* Base Styles */ #cssmenu, #cssmenu ul, #cssmenu li, #cssmenu a { margin: 0; padding: 0; border: 0; list-style: none; font-weight: normal; text-decoration: none; line-height: 1; font-family: 'Open Sans', sans-serif; font-size: 1em; position: relative; } #cssmenu a { line-height: 1.5; } #cssmenu { /* width: 100%; background: #fff; */ } #cssmenu > ul { /* border: 1px solid #000000; -moz-box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.2); -webkit-box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.2); box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.2); background: #565656; background: -moz-linear-gradient(#565656 0%, #323232 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #565656), color-stop(100%, #323232)); background: -webkit-linear-gradient(#565656 0%, #323232 100%); background: linear-gradient(#565656 0%, #323232 100%); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; */ } #cssmenu > ul:after { clear: both; content: ''; display: table; } @media all and (max-width: 480px) { #cssmenu > ul { max-height: 32px; overflow: hidden; -webkit-transition: max-height 0.5s; transition: max-height 0.5s; } #cssmenu.expand ul { max-height: 900px; } } #cssmenu > ul > li { border-right: 1px solid #000000; -moz-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2); -webkit-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2); box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2); /* float: left; */ float: right; } #cssmenu > ul > li.mobile { display: none; } #cssmenu > ul > li.active { background: #444444; background: -moz-linear-gradient(#444444 0%, #323232 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #444444), color-stop(100%, #323232)); background: -webkit-linear-gradient(#444444 0%, #323232 100%); background: linear-gradient(#444444 0%, #323232 100%); } @media all and (max-width: 480px) { #cssmenu > ul > li { border-right: 0 none; -moz-box-shadow: 0 0 0 transparent; -webkit-box-shadow: 0 0 0 transparent; box-shadow: 0 0 0 transparent; display: block; float: none; } #cssmenu > ul > li.mobile { display: block; } #cssmenu > ul > li.mobile i { float: right; -style: normal; } } #cssmenu > ul > li:last-child { border-right: 0 none; -moz-box-shadow: 0 0 0 transparent; -webkit-box-shadow: 0 0 0 transparent; box-shadow: 0 0 0 transparent; -webkit-border-radius: 0 4px 4px 0; -moz-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; } #cssmenu > ul > li:last-child ul { left: auto; right: 0; } #cssmenu > ul > li.mobile { border-right: 0 none; -moz-box-shadow: 0 0 0 transparent; -webkit-box-shadow: 0 0 0 transparent; box-shadow: 0 0 0 transparent; } #cssmenu > ul > li > a { margin: 0 0 2px 0; font-size: 12px; display: block; color: #ffffff; text-shadow: 0 1px 1px #000; } #cssmenu > ul > li > a > span { display: block; padding: 6px 10px; font-weight: bold; background-color: #505050; } #cssmenu > ul > li > a:hover { text-decoration: none; } #cssmenu > ul > li.active { border-bottom: none; } #cssmenu > ul > li.active > a { color: #fff; text-shadow: 0 1px 1px #000; } /* Sub menu */ #cssmenu ul ul { background: #f9f9f9; border: 1px solid #cccccc; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.25); box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.25); padding: 5px 12px; display: none; position: absolute; top: 33px; left: 0; width: 200px; z-index: 1; } @media all and (max-width: 480px) { #cssmenu ul ul { position: relative; top: 0; width: 100%; } } #cssmenu ul ul li { padding: 3px 0; } #cssmenu ul ul a { color: #999999; display: block; font-size: 1em; font-weight: bold; } #cssmenu ul ul a:hover { color: #444444; }