.dashboard .topbar ul { zoom: 1; margin: 0 !important; padding: 0 !important; list-style: none; }
.dashboard .topbar ul:before,
.dashboard .topbar ul:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; }

.dashboard .toolbar ul li span,
.dashboard .topbar span.icon { display: block; background-image: url(/Environments/Dashboard/Base/Sprites/Sprite.png); background-repeat: no-repeat; }
.dashboard .topbar ul li { background-image: none !important; padding: 0 !important; }

.dashboard .toolbar ul { margin: 0; width: 60px; overflow: hidden; background-color: #fbfbfb; }
.dashboard .toolbar ul li { background-image: none; padding: 0; }
.dashboard .toolbar ul li a { display: block; padding-left: 60px; padding-right: 60px; height: 28px; padding-top: 12px; font-family: "RexBold"; border-bottom: solid 1px #f2f2f2; text-decoration: none; font-size: 1.2em; white-space: nowrap; position: relative; }
.dashboard .toolbar ul li span { position: absolute; height: 28px; width: 60px; left: 0; top: 0; }
.dashboard .toolbar ul li.active a,
.dashboard .toolbar ul li a:hover { color: #39bced; background-color: white; }
.dashboard .toolbar ul li.general span { background-position: -70px 0; }
.dashboard .toolbar ul li.general.active span { background-position: -270px 0; }
.dashboard .toolbar ul li.layout span { background-position: -70px -40px; }
.dashboard .toolbar ul li.layout.active span { background-position: -270px -40px; }
.dashboard .toolbar ul li.studio span { background-position: -70px -80px; }
.dashboard .toolbar ul li.studio.active span { background-position: -270px -80px; }
.dashboard .toolbar ul li.logic span { background-position: -70px -120px; }
.dashboard .toolbar ul li.logic.active span { background-position: -270px -120px; }
.dashboard .toolbar ul li.advanced span { background-position: -70px -160px; }
.dashboard .toolbar ul li.advanced.active span { background-position: -270px -160px; }
.dashboard .toolbar ul li.overview span { background-position: -70px -824px; }
.dashboard .toolbar ul li.overview.active span { background-position: -270px -824px; }

.dashboard .topbar { background-color: #ff6b36; margin-bottom: 1em; }
.dashboard .topbar li { float: left; position: relative; }
.dashboard .topbar li.page a,
.dashboard .topbar li.page span { background-position: -675px 0; }
.dashboard .topbar li.page a:hover,
.dashboard .topbar li.page a:hover span,
.dashboard .topbar li.page span:hover,
.dashboard .topbar li.page span:hover span { background-position: -475px 0; }
.dashboard .topbar li.section a span { background-position: -675px -444px; }
.dashboard .topbar li.section a:hover span { background-position: -475px -444px; }
.dashboard .topbar li.image a span { background-position: -675px -492px; }
.dashboard .topbar li.image a:hover span { background-position: -475px -492px; }
.dashboard .topbar li.page a span { background-position: -675px -0px; }
.dashboard .topbar li.page a:hover span { background-position: -475px -0px; }
.dashboard .topbar li.singleline a span { background-position: -675px -540px; }
.dashboard .topbar li.singleline a:hover span { background-position: -475px -540px; }
.dashboard .topbar li.multiline a span { background-position: -675px -588px; }
.dashboard .topbar li.multiline a:hover span { background-position: -475px -588px; }
.dashboard .topbar li.note a span { background-position: -675px -636px; }
.dashboard .topbar li.note a:hover span { background-position: -475px -636px; }
.dashboard .topbar li.checkbox a span { background-position: -675px -684px; }
.dashboard .topbar li.checkbox a:hover span { background-position: -475px -684px; }
.dashboard .topbar li.radio a span { background-position: -675px -732px; }
.dashboard .topbar li.radio a:hover span { background-position: -475px -732px; }
.dashboard .topbar li.dropdown a span { background-position: -675px -780px; }
.dashboard .topbar li.dropdown a:hover span { background-position: -475px -780px; }
.dashboard .topbar li.folderAdd a span { background-position: -675px -876px; }
.dashboard .topbar li.folderAdd a:hover span { background-position: -475px -876px; }
.dashboard .topbar li.add a span { background-position: -735px -876px; }
.dashboard .topbar li.add a:hover span { background-position: -535px -876px; }
.dashboard .topbar li.folderDelete a span { background-position: -675px -924px; }
.dashboard .topbar li.folderDelete a:hover span { background-position: -475px -924px; }
.dashboard .topbar li.upload a span { background-position: -675px -972px; }
.dashboard .topbar li.upload a:hover span { background-position: -475px -972px; }
.dashboard .topbar li.refresh a span { background-position: -675px -1020px; }
.dashboard .topbar li.refresh a:hover span { background-position: -475px -1020px; }
.dashboard .topbar li.text a span { background-position: -735px -444px; }
.dashboard .topbar li.text a:hover span { background-position: -535px -444px; }
.dashboard .topbar li.formulaAdd a span { background-position: -735px -635px; }
.dashboard .topbar li.edit a span { background-position: -795px -444px; }
.dashboard .topbar li.edit a:hover span { background-position: -595px -444px; }
.dashboard .topbar li.formulaAdd a:hover span { background-position: -535px -635px; }
.dashboard .topbar li.drawing a span { background-position: -734px -588px; }
.dashboard .topbar li.drawing a:hover span { background-position: -534px -588px; }
.dashboard .topbar li.function { float: right; background-color: #39bced; }
.dashboard .topbar li.function > a { border-left-color: #0dade9; border-right-color: #58c5ee; }
.dashboard .topbar li.function > a:hover { background-color: #ffffff; color: #39bced; }
.dashboard .topbar li.preview a span { background-position: -675px -300px; border-right: none; }
.dashboard .topbar li.preview a:hover span { background-position: -275px -300px; }
.dashboard .topbar li.listview a span { background-position: -675px -205px; border-right: none; }
.dashboard .topbar li.listview a:hover span { background-position: -275px -205px; }
.dashboard .topbar li.blockview a span { background-position: -675px -120px; border-right: none; }
.dashboard .topbar li.blockview a:hover span { background-position: -275px -120px; }
.dashboard .topbar li.fullscreen a span { background-position: -735px -492px; }
.dashboard .topbar li.fullscreen a:hover span { background-position: -335px -492px; }
.dashboard .topbar li.fsedit a span { background-position: -795px -444px; }
.dashboard .topbar li.fsedit a:hover span { background-position: -395px -444px; }
.dashboard .topbar li.delete a span { background-position: -795px -492px; }
.dashboard .topbar li.delete a:hover span { background-position: -595px -492px; }
.dashboard .topbar li.fsdownload a span { background-position: -795px -538px; }
.dashboard .topbar li.fsdownload a:hover span { background-position: -395px -538px; }
.dashboard .topbar li.box a span { background-position: -735px -780px; }
.dashboard .topbar li.box a:hover span { background-position: -534px -780px; }

/*.dashboard .topbar li.first a:hover { border-left: none; }
.dashboard .topbar li.last a:hover { border-right: none; }*/

.dashboard .topbar span.icon { display: block; height: 50px; width: 50px; position: absolute; left: 0; top: 0; }


.dashboard .topbar a,
.dashboard .topbar a:hover {
     border-right: solid 1px #fd8256; border-left: solid 1px #ff4a0a;
     font-weight: normal; text-decoration: none; font-size: 1em; padding-top: 12px; height: 28px; white-space: nowrap;
      padding-right: 10px;
}
.dashboard .topbar a { /* @extend %sprite; */ color: white; display: block; padding-left: 50px; -ms-transition: background-color 0.5s ease-out, width 0.5s ease-out; -moz-transition: background-color 0.5s ease-out, width 0.5s ease-out; -webkit-transition: background-color 0.5s ease-out, width 0.5s ease-out; transition: background-color 0.5s ease-out, width 0.5s ease-out; }
.dashboard .topbar a:hover { /*width: 100px;*/ width: auto; background-color: white; color: #ff6b36; }


.dashboard .topbar ul ul {
    position: absolute;
    background-color: #ff6b36;
    z-index: 1;
  	display: none;
}

.dashboard .topbar li:hover ul {
    display: inline;
}