Template:UConn/css/nav

header { position:relative; width:100%; background:#333; }

.logo { position:relative; z-index:123; padding:10px; font:18px; color:#6DDB07; float:left; width:15%; }

.logo a { color:#6DDB07; }

nav { position:relative; max-width:2048px; margin:0 auto; }

1. cssmenu {

background:#333; width: 100%; font-size: 15px; position: fixed !important; z-index: 9999; }

1. cssmenu .imagelink {

padding: 0; }

1. cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #head-mobile {

border:0; list-style:none; line-height:1; display:block; position:relative; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }

1. cssmenu:after,#cssmenu > ul:after {

content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0; }

1. cssmenu #head-mobile {

display:none; }

1. cssmenu img:hover {

opacity: .6; }

1. cssmenu > ul > li {

float:left; text-align: center; }

1. cssmenu > ul > li > a {

padding:17px; letter-spacing:1px; line-height: 18px; text-decoration:none; color:#ddd; text-align: center; }

1. cssmenu > ul > li:hover > a,#cssmenu ul li.active a {

color:#fff; }

1. cssmenu > ul > li:hover,#cssmenu ul li.active:hover,#cssmenu ul li.active,#cssmenu ul li.has-sub.active:hover {

background:#333!important; -webkit-transition:background .3s ease; -ms-transition:background .3s ease; transition:background .3s ease; }

1. cssmenu > ul > li.has-sub > a {

} /**

1. cssmenu > ul > li.has-sub > a:after {

position:absolute; top:22px; right:11px; width:8px; height:2px; display:block; background:#ddd; content:; }

1. cssmenu > ul > li.has-sub > a:before {

position:absolute; top:19px; right:14px; display:block; width:2px; height:8px; background:#ddd; content:; -webkit-transition:all .25s ease; -ms-transition:all .25s ease; transition:all .25s ease; }

• • /

1. cssmenu > ul > li.has-sub:hover > a:before {

top:23px; height:0; }

1. cssmenu ul ul {

position:absolute; left:-9999px; }

1. cssmenu ul ul li {

height:0; -webkit-transition:all .25s ease; -ms-transition:all .25s ease; transition:all .25s ease; }

1. cssmenu li:hover > ul {

left:auto; }

1. cssmenu li:hover > ul > li {

height:35px; }

1. cssmenu ul ul ul {

margin-left:100%; top:0; }

1. cssmenu ul ul li a {

border-bottom:1px solid rgba(150,150,150,0.15); padding:11px 5px; display: block; background: #333; text-decoration:none; color:#ddd; text-align: center; }

1. cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a {

border-bottom:0; }

1. cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover {

color:#fff; }

1. cssmenu ul ul li.has-sub > a:after {

position:absolute; top:16px; right:11px; width:8px; height:2px; display:block; background:#ddd; content:; }

1. cssmenu ul ul li.has-sub > a:before {

position:absolute; top:13px; right:14px; display:block; width:2px; height:8px; background:#ddd; content:; -webkit-transition:all .25s ease; -ms-transition:all .25s ease; transition:all .25s ease; }

1. cssmenu ul ul > li.has-sub:hover > a:before {

top:17px; height:0; }

1. cssmenu ul ul li.has-sub:hover,#cssmenu ul li.has-sub ul li.has-sub ul li:hover {

background:#363636; }

1. cssmenu ul ul ul li.active a {

border-left:1px solid #333; }

1. cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active> a {

border-top:1px solid #333; }

@media screen and (max-width:760px){ .logo { position:absolute; top:0; left:0; width:100%;

text-align:left; padding:5px 0 0 0; float:none; background: #333; }

.logo img { width: 75px; padding: 0px 0px 0px 4px; } .logo2 { display:none; }

nav { width:100%; }

1. cssmenu {

width:100%; }

1. cssmenu .narrow img{

display: none; }

1. cssmenu .narrow, #cssmenu .wide {

padding-top: 0px!important; }

1. cssmenu .wide img{

display: none; }

1. cssmenu .narrow, #cssmenu .wide {

padding-top: 20px; }

1. cssmenu ul {

width:100%; display:none; }

1. cssmenu ul li {

width:100%; text-align: center; }

1. cssmenu ul li:hover {

background:#363636; }

1. cssmenu ul ul li,#cssmenu li:hover > ul > li {

height:auto; }

1. cssmenu ul li a,#cssmenu ul ul li a {

width:100%; border-bottom:0; }

1. cssmenu > ul > li {

float:none; }

1. cssmenu ul ul li {

background:#333!important; font-size: 12.5px; }

1. cssmenu ul ul li:hover {

background:#363636!important; }

1. cssmenu ul ul ul li a {

padding-left:35px; }

1. cssmenu ul ul li a {

color:#ddd; background:none; }

1. cssmenu ul ul li:hover > a,#cssmenu ul ul li.active > a {

color:#fff; }

1. cssmenu ul ul,#cssmenu ul ul ul {

position:relative; left:0; width:100%; margin:0; text-align:left; }

1. cssmenu > ul > li.has-sub > a:after,#cssmenu > ul > li.has-sub > a:before,#cssmenu ul ul > li.has-sub > a:after,#cssmenu ul ul > li.has-sub > a:before {

display:none; }

1. cssmenu #head-mobile {

display:block; padding:23px; color:#ddd; }

.button { width:55px; height:46px; position:absolute; right:0; top:0; cursor:pointer; z-index: 12399994; }

.button:after { position:absolute; top:23.5px; right:20px; display:block; height:5px; width:20px; border-top:2px solid #dddddd; border-bottom:2px solid #dddddd; content:; }

.button:before { -webkit-transition:all .3s ease; -ms-transition:all .3s ease; transition:all .3s ease; position:absolute; top:16px; right:20px; display:block; height:2px; width:20px; background:#ddd; content:; }

.button.menu-opened:after { -webkit-transition:all .3s ease; -ms-transition:all .3s ease; transition:all .3s ease; top:23px; border:0; height:2px; width:21px; background:#fff; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); }

.button.menu-opened:before { top:23px; background:#fff; width:21px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); }

1. cssmenu .submenu-button {

position:absolute; z-index:99; right:0; top:0; display:block; border-left:1px solid #444; height:46px; width:46px; cursor:pointer; }

1. cssmenu .submenu-button.submenu-opened {

background:#262626; }

1. cssmenu ul ul .submenu-button {

height:34px; width:34px; }

1. cssmenu .submenu-button:after {

position:absolute; top:22px; right:19px; width:7.5px; height:2px; display:block; background:#ddd; content:; }

1. cssmenu ul ul .submenu-button:after {

top:15px; right:13px; }

1. cssmenu .submenu-button.submenu-opened:after {

background:#fff; }

1. cssmenu .submenu-button:before {

position:absolute; top:19px; right:22px; display:block; width:2px; height:8px; background:#ddd; content:; }

1. cssmenu ul ul .submenu-button:before {

top:12px; right:16px; }

1. cssmenu .submenu-button.submenu-opened:before {

display:none; }

1. cssmenu ul ul ul li.active a {

border-left:none; }

1. cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active > a {

border-top:none; } }

@media all and (min-width: 761px){

1. cssmenu .narrow img{

width: 45px; }

1. cssmenu .wide img{

width: 89px; }

1. cssmenu .narrow, #cssmenu .wide {

padding-top: 15px; }

1. cssmenu .item {

padding-top: 12px; padding-bottom: 12px; }

.wide { width: 16.6%; }

.narrow { width: 13.9%; }

.logo img{

 	display:none;

}

.logo {

   padding: 0px;

}

1. cssmenu ul ul li a { /*This affects the menu width*/

width:27vw; margin-left: -6.6vw; text-align: center; }

}

 @media all and (min-width: 761px) and (max-width: 970px){

1. cssmenu > ul > li.has-sub > a:after {

   height: 0px;

}

1. cssmenu > ul > li.has-sub > a:before {

   height: 0px;

} }

@media all and (min-width: 1000px){

1. cssmenu ul ul li a {

width:21vw; margin-left: -3.5vw; }

}

@media all and (min-width: 1300px){

1. cssmenu ul ul li a {

width:17vw; margin-left: -1.5vw; }

}

@media all and (min-width: 2049px){

1. cssmenu ul ul li a {

 width: 300px;
 margin-left: 0px;

}

1. cssmenu {

 width: 2048px;
 display: block;
 margin: 0 auto !important;
 }

1. cssmenu .logo {

 width: 20.8%;
 }

1. cssmenu .narrow {

 width: 13.2%;
 }

1. cssmenu ul ul li a {

 width: 270px;

}

}