@charset "utf-8"; @import "../initial"; .layout-header { position: relative; margin-bottom: 0; border: none; border-radius: 0; z-index: 1; .container { @extend .response-container; } .header-banner { overflow: hidden; } .header-nav { padding: 1em 0; color: $theme-color-main; font-family: $main-font; & > * { display: inline-block; margin-top: 0; margin-bottom: 0; font-size: 0.8em; color: $theme-color-main; } a { color: $theme-color-main; text-decoration: none; } @media (min-width: $screen-sm) { text-align: right; } } .navbar-header { padding: 0 0 1.25em; @media(min-width: 769px){ width: 30%; } .navbar-brand { height: unset; margin: 0.5em 0; padding-top: 0; padding-bottom: 0; line-height: 2.125em; color: $theme-color-main; font-size: 1.4em; font-family: $main-font; @media (min-width: $screen-sm) { height: unset; margin: 0.5rem 0 0; padding-left: 0; line-height: 3.75em; font-size: 1.5em; } @media (max-width: 767px) { height: 5em; } @media (max-width: 480px) { height: 3.5em; padding: 0 0.5rem; margin: 0; } .site-logo { width: auto; height: 100%; margin-right: 0.5em; float: left; } } } } .navbar-toggle { padding: 0.875em 0.625em; border-radius: 0.125em; border-width: 0.125em; border-color: #fff; .icon-bar { background-color: #fff; } &.collapsed { .icon-bar-top { top: 0; -webkit-transform: rotate(0); transform: rotate(0); } .icon-bar-middle { opacity: 1; } .icon-bar-bottom { top: 0; -webkit-transform: rotate(0); transform: rotate(0); } } // icon bar animation .icon-bar { transition: .2s all; position: relative; } .icon-bar-top { top: 0.375em; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .icon-bar-middle { opacity: 0; } .icon-bar-bottom { top: -0.375em; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } } .volunteer{ border: 1px solid #ffffff99; color: #ffffffcc; height: 30px; margin-top: -18px; border-radius: 15px; behavior: url("/assets/ie_support/PIE2/PIE.htc"); padding: 5px 15px; display: -moz-box; display: flex; -moz-box-pack: center; justify-content: center; -moz-box-align: center; align-items: center; font-size: .8rem; @media(max-width: 768px){ display: none!important; } }