@import url(proton2.css);


/* mezzoblue 'proton' style - regular */

/* -- main nav -- */
#siteInfo {background: url(/i/pro/bg2.gif) top right no-repeat; height: 65px; margin: 0; position: relative;}
#siteInfo li {position: absolute; top: -27px; right: 0; display: inline;}
#siteInfo li li {top: 0;}
#siteInfo li a {display: block; height: 25px; font-size: 1px; text-indent: -5000px; background: #ddd url(/i/pro/panel-nav2.gif) 0 0 no-repeat; text-decoration: none;}
#siteInfo .li0 {right: 161px; width: 198px;}
#siteInfo .li1 {right: 114px; width: 47px;}
#siteInfo .li2 {right: 60px; width: 54px;}
#siteInfo .li3 {right: 0; width: 60px;}
#siteInfo .li0 a:hover, 
  #siteInfo .li0 a:focus {background-position: 0 -26px;}
#siteInfo .li1 a {background-position: -198px 0;}
#siteInfo .li1 a:hover, 
  #siteInfo .li1 a:focus {background-position: -198px -26px; position: relative; top: 1px;}
#siteInfo .li2 a {background-position: -245px 0;}
#siteInfo .li2 a:hover, 
  #siteInfo .li2 a:focus {background-position: -245px -26px;}
#siteInfo .li3 a {background-position: -299px 0;}
#siteInfo .li3 a:hover, 
  #siteInfo .li3 a:focus {background-position: -299px -26px;}

/* -- drop-downs -- */
.li1:hover #sec1, .li2:hover #sec2 {position: absolute; display: block; width: 360px; height: 23px; right: -114px; background: #B2D8F8 url(/i/pro/panel-nav-about.gif) 1px 0 no-repeat;}
.li2:hover #sec2, .li2:focus #sec2 {right: -60px; background: #B2D8F8 url(/i/pro/panel-nav-weblog.gif) 1px 0 no-repeat;}

#sec1, #sec2, #sec3 {display: none; z-index: 1;}

/* -- about -- */
#sec1 li a {width: 120px; height: 23px; background: #B2D8F8 url(/i/pro/panel-nav-about.gif) 0 0 no-repeat;}
#sec1 .li1 {right: 313px;}
#sec1 .li2 {right: 186px;}
#sec1 .li3 {right: 60px;}
#sec1 .li1 a {background-position: 0 0;}
#sec1 .li1 a:hover {background-position: 0 -24px;}
#sec1 .li2 a {background-position: -120px 0;}
#sec1 .li2 a:hover {background-position: -120px -24px;}
#sec1 .li3 a {background-position: -240px 0;}
#sec1 .li3 a:hover {background-position: -240px -24px;}

/* -- weblog -- */
#sec2 li a {width: 72px; height: 23px; background: #B2D8F8 url(/i/pro/panel-nav-weblog.gif) 0 0 no-repeat;}
#sec2 .li1 {right: 312px;}
#sec2 .li1 a {background-position: 0px 0;}
#sec2 .li1 a:hover {background-position: 0 -24px;}
#sec2 .li2 {right: 233px;}
#sec2 .li2 a {background-position: -72px 0;}
#sec2 .li2 a:hover {background-position: -72px -23px;}
#sec2 .li3 {right: 155px;}
#sec2 .li3 a {background-position: -144px 0;}
#sec2 .li3 a:hover {background-position: -144px -23px;}
#sec2 .li4 {right: 71px;}
#sec2 .li4 a {background-position: -216px 0;}
#sec2 .li4 a:hover {background-position: -216px -23px;}
#sec2 .li5 {right: 0px;}
#sec2 .li5 a {background-position: -287px 0;}
#sec2 .li5 a:hover {background-position: -287px -23px;}


/* -- descriptions -- */
#siteInfo p {width: 357px; height: 40px; margin: 0; border: solid 1px #E9F3FA; background: url(/i/pro/desc-white.png); visibility: hidden; position: absolute;}
.li1 p {right: -312px;}
.li2 p {right: -185px;}
.li3 p {right: -59px;}
#sec2 .li1 p {right: -311px;}
#sec2 .li2 p {right: -232px;}
#sec2 .li3 p {right: -154px;}
#sec2 .li4 p {right: -70px;}
#sec2 .li5 p {right: 1px;}

#sec1 .li1 p a:hover, #sec1 .li2 p a:hover, #sec1 .li3 p a:hover {background-position: 0 -1px;}
#sec2 .li2 p a:hover, #sec2 .li3 p a:hover, #sec2 .li4 p a:hover, #sec2 .li5 p a:hover {background-position: 0 0;}
#sec2 .li1 p a:hover {background-position: 0 -1px;}

#sec1 p a, #sec2 p a {width: 357px; height: 40px;}
#sec1 .li1 p a {background: transparent url(/i/pro/desc-about-dave.gif) 0 0 no-repeat;}
#sec1 .li2 p a {background: transparent url(/i/pro/desc-about-mezzoblue.gif) 0 0 no-repeat;}
#sec1 .li3 p a {background: transparent url(/i/pro/desc-about-faq.gif) 0 0 no-repeat;}
#sec2 .li1 p a {background: transparent url(/i/pro/desc-weblog-current.gif) 0 0 no-repeat;}
#sec2 .li2 p a {background: transparent url(/i/pro/desc-weblog-archives.gif) 0 0 no-repeat;}
#sec2 .li3 p a {background: transparent url(/i/pro/desc-weblog-dailies.gif) 0 0 no-repeat;}
#sec2 .li4 p a {background: transparent url(/i/pro/desc-weblog-essentials.gif) 0 0 no-repeat;}
#sec2 .li5 p a {background: transparent url(/i/pro/desc-weblog-rss.gif) 0 0 no-repeat;}

#sec1 .li1:hover p,
 #sec1 .li2:hover p,
 #sec1 .li3:hover p,
 #sec2 .li1:hover p,
 #sec2 .li2:hover p,
 #sec2 .li3:hover p,
 #sec2 .li4:hover p,
 #sec2 .li5:hover p {visibility: visible; z-index: 1;}