.head-wrapper { height: 65px; box-shadow: 0 -1px 0 #e7e2ee inset; background: #fff; } header { display: flex; justify-content: space-between; @include constrain_wide; .left { float: left; a { display: inline-block; padding-left: 0; } } .right { margin-top: 4px; float: right; } .nologin { margin-top: -2px; } } .logo { display: block; margin: 3px 0 0 0; width: 60px; height: 60px; background: #fff url('/media/img/logo-sm.svg') no-repeat; //background: #fff url('/media/img/logo-blk.svg') no-repeat; //background: #fff url('/media/img/logo-org.svg') no-repeat; background-size: 60px 60px; text-align: center; } nav { letter-spacing: 1px; margin: 0 0 10px; ul { list-style-type: none; padding: 0; li { display: inline; } } a { @include fancy-sans-bold; @include fontsize(16); text-decoration: none; color: lighten(#444, 15); font-weight: 600; padding: 6px; &:visited { color: lighten(#444, 15); } &:hover { color: $link_color; } } .btn { display: inline-block; background: transparent; color: $link_color !important; border: 1px solid $link_color; border-radius: 4px; &:hover { color: white !important; border-color: $link_color; background-color: $link_color; } } } .dropmenu { outline: white; position: absolute; z-index: 10; margin-top: 4px; margin-left: 4rem; background: #fff; color: #60516E; padding: 10px; border-radius: 4px; border: 1px solid rgba(0,0,0,0.05); filter: drop-shadow(0 0px 4px rgba(0,0,0,0.08)); &:after { top: unset; left: unset; margin-left: unset; border-top-color: unset; content: ""; position: absolute; border: 10px solid transparent; bottom: 100%; left: 50%; margin-left: -10px; border-bottom-color: white; } a, a:visited { @include fancy-sans; font-weight: 400; color: lighten($body_font_color, 15); } a:hover { color: $body_font_color; } .menu-divider { border-top: 1px solid #e7e2ee; padding: 8px 16px 0; margin: 8px -10px 0; } li { margin-top: 4px; margin-bottom: 4px; } } #user-menu { margin-left: 8rem; } .circle{ width: 26px; height: 20px; border-radius: 100%; position: relative; margin: -4px 8px 0 0; display: inline-block; vertical-align: middle; background: $link_color; text-indent: -3000em; } .circle:hover{ background: $link_color; } .circle:active{ background: $link_color; } .circle:before, .circle:after{ content:'';position:absolute;top:0;left:0;right:0;bottom:0; } /* PLUS */ .circle.plus:before, .circle.plus:after { background: white; } .circle.plus:before{ width: 2px; margin: 10px auto; } .circle.plus:after{ margin: auto 10px; height: 2px; box-shadow: none; }