.site-header { background-color: rgba(0, 0, 0, 0.2); z-index: 2; }
.home.transparent-header .site-header {
position: absolute;
top: 0;
left: 0;
}
#site-banner-main,
.banner-right {
position: relative;
}
#site-banner-main {
width: 100%;
z-index: 10;
}
.banner-right {
z-index: 1;
} #site-banner {
max-width: 980px;
margin: auto;
z-index: 5;
position: relative;
text-align: left;
}
.menusize-fullwidth #site-banner {
padding-left: 20px;
padding-right: 20px;
}
#site-banner > * {
display: inline-block;
zoom: 1; *display: inline;
vertical-align: middle;
}
#site-banner-main {
display: table;
vertical-align: middle;
position: relative;
z-index: 0;
}
#site-banner.no-brand #site-banner-main { margin-left: -10px; }
#site-banner-main > * {
display: table-cell;
vertical-align: middle;
height: 100%;
padding: 0;
margin: 0;
}
#masthead .site-branding {
display: table-cell;
width: 1px;
white-space: nowrap;
position: relative;
z-index: 1;
vertical-align: middle;
}
#masthead .site-logo, #masthead .site-title {
margin: 0;
margin-right: 20px;
}
#site-banner.blogname .site-title {
display: table;
}
.site-logo a,
.site-title a {
display: block;
}
#site-banner.blogname .site-title a {
display: table-cell;
width: 1px;
white-space: nowrap;
}
.site-logo img {
height: 40px;
max-width: inherit;
display: block;
}
.site-title a {
display: block;
line-height: 28px;
padding: 0;
}
.site-title a:hover {
color: #199cd8;
} #mobile-navigation,
#mobile-navigation-jquery { display: none; }
.top-navigation {
display: table-cell;
width: 100%;
vertical-align: middle;
}
#header-right-menu {
display: inline-block;
zoom: 1; *display: inline;
vertical-align: middle;
margin-right: -10px;
}
.top-navigation > .menu ul li,
#site-branding > *,
.top-navigation ul li,
#header-right-menu ul li  {
display: inline-block;
zoom: 1; *display: inline;
vertical-align: middle;
}
.top-navigation ul li a,
#header-right-menu ul li a {
line-height: 24px;
display: block;
}
.top-navigation ul,
#header-right-menu ul {
list-style: none;
margin: 0;
padding-left: 0;
line-height: 1;
}
.top-navigation li,
#header-right-menu li {
position: relative;
}
.top-navigation a,
#header-right-menu a {
color: #fff;
display: block;
font-weight: 300;
line-height: 16px;
text-decoration: none;
}
.top-navigation a:hover,
#header-right-menu a:hover {
color: #199cd8;
}
.top-navigation ul ul,
.top-navigation ul li > h2,
#header-right-menu ul ul,
#header-right-menu ul li > h2 {
float: left;
position: absolute;
left: -999em;
z-index: 99999;
top: auto;
opacity: 0;
transition: opacity 0.2s ease-in;
}
.top-navigation ul ul ul,
#header-right-menu ul ul ul {
left: -999em;
padding-top: 0;
top: 0;
}
.top-navigation ul ul a,
#header-right-menu ul ul a {
background-color: #f0f0f0;
display: block;
color: #fff;
text-transform: none;
width: 200px;
}
.top-navigation ul ul li,
#header-right-menu ul ul li {
text-align: left;
display: block;
}
.top-navigation ul ul li > a,
#header-right-menu ul ul li > a {
padding: 0 10px;
}
.top-navigation ul ul li:first-child > a,
#header-right-menu ul ul li:first-child > a {
padding-top: 9px;
box-shadow: inset 0 1px 0px 0 rgba(255, 255, 255, .2);
}
.top-navigation ul ul li:last-child > a,
#header-right-menu ul ul li:last-child > a {
padding-bottom: 9px;
-webkit-border-bottom-right-radius: 3px;
-webkit-border-bottom-left-radius: 3px;
-moz-border-radius-bottomright: 3px;
-moz-border-radius-bottomleft: 3px;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
.top-navigation ul li,
#header-right-menu ul li {
display: inline-block;
zoom: 1; *display: inline;
}
.top-navigation ul li a,
#header-right-menu ul li a {
padding: 0 10px;
}
.top-navigation ul li:hover > ul,
#header-right-menu ul li:hover > ul {
left: auto;
opacity: 1;
}
#header-right-menu ul li:hover > ul {
right: 0;
}
.top-navigation > ul > li:hover > ul,
#header-right-menu > ul > li:hover > ul {
padding-top: 9px;
}
.top-navigation ul ul li:hover > ul,
#header-right-menu ul ul li:hover > ul {
left: 100%;
} .banner-right {
line-height: 40px;
text-align: right;
z-index: 1;
}
.banner-right.menu {
line-height: 1.8;
}
#site-banner-left { width: 60%; }
#site-banner-left-inner {
display: table;
width: 100%;
}
#site-banner-right {
width: 40%;
text-align: right;
}
.social-wrapper,
.banner-right .search-wrapper {
float: none;
display: inline-block;
zoom: 1; *display: inline;
vertical-align: middle;
height: 100%;
}
.hr-social {
display: table;
list-style-type: none;
list-style-position: inside;
padding: 0;
margin: 0;
float: left;
vertical-align: middle;
height: 100%;
}
.hr-social li {
display: table-cell;
vertical-align: middle;
box-sizing: content-box;
padding: 0 6px;
}
.hr-social li:last-child {
padding-right: 0;
}
.hr-social li a {
display: block;
height: 24px;
}
.hr-social > li a img {
width: 24px;
height: 24px;
max-width: inherit;
}
.banner-right .search-form {
height: 100%;
display: table;
vertical-align: middle;
}
.banner-right .search-form label {
display: table-cell;
float: none;
vertical-align: middle;
}
.banner-right .search-form input[type="search"] {
display: inline-block;
padding: 8px 10px;
height: 34px;
box-sizing: border-box;
}
#header-button-container {
display: inline-block;
zoom: 1; *display: inline;
text-align: left;
float: none;
vertical-align: middle;
}
#header-button-container-inner {
width: 100%;
display: table-cell;
vertical-align: middle;
text-align: right;
}
#header-button-container-inner > * {
display: inline-block;
zoom: 1; *display: inline;
vertical-align: middle;
margin: -2px 0 0 10px;
text-align: center;
}
#header-button-container-inner > *:first-child {
margin-left: 0;
}
#header-button-container-inner p,
#header-button-container-inner h1,
#header-button-container-inner h2,
#header-button-container-inner h3,
#header-button-container-inner h4,
#header-button-container-inner h5,
#header-button-container-inner h6 {
padding: 0;
line-height: 60px;
}
#mobile-menu-trigger-wrap { display: none; }
@media screen and (max-width: 980px) {
#site-banner { padding: 0 20px;	}
}
@media screen and (max-width: 768px) {
#site-banner-main {
text-align: center;
width: 100%;
}
.site-logo, .site-title {
margin-right: 0;
}
#masthead .site-logo,
#masthead .site-title {
margin-right: 0;
}
#site-banner-main .site-branding {
display: inline-block;
zoom: 1; *display: inline;
width: auto;
position: relative;
z-index: 1;
}
#site-banner-right > *,
#site-navigation {
display: none;
}
#site-banner-left { width: 100%!important; }
#site-banner-right {
position: absolute;
right: 0;
display: inline-block;
width: auto!important;
height: 48px;
top: 50%;
margin-top: -24px;
}
#mobile-menu-trigger-wrap {
margin-left: -20px;
position: absolute;
top: 50%;
left: 0;
display: table-cell;
float: none;
height: 36px;
margin-top: -18px;
}
.menu-open,
.dashicons.menu-open,
.menu-close,
.dashicons.menu-close {
display: table-cell;
line-height: 36px;
width: 36px!important;
height: 36px!important;
padding: 0 12px;
box-sizing: content-box;
font-size: 36px!important;
cursor: pointer;
color: black;
z-index: 9999;
vertical-align: middle;
}
.menu-open:before {
content: "\f333";
}
.menu-close:before {
content: "\f158";
}
}