/* ------------------ Header ------------------ */ #header { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } .header .section { position: relative; } .region-header { float: right; /* LTR */ margin: .5em 5px .75em; } [dir="rtl"] .region-header { float: left; } @media all and (min-width: 461px) and (max-width: 900px) { .region-header { margin: .5em 5px .75em; } } @media all and (min-width: 901px) { .region-header { margin: 1em 5px 1.5em; } } #logo, .site-logo { float: left; /* LTR */ padding: 4px 4px 4px 9px; /* LTR */ } [dir="rtl"] #logo, [dir="rtl"] .site-logo { padding: 4px 9px 4px 4px; } @media all and (min-width: 461px) and (max-width: 900px) { #logo, .site-logo { padding: 5px 0 0 5px; /* LTR */ } [dir="rtl"] #logo, [dir="rtl"] .site-logo { padding: 5px 5px 0 0; } } @media all and (min-width: 901px) { #logo, .site-logo { padding: 9px 4px 4px 9px; /* LTR */ } [dir="rtl"] #logo, [dir="rtl"] .site-logo { padding: 9px 9px 4px 4px; } } #name-and-slogan, .site-branding-text { float: left; /* LTR */ margin: 0; padding: 5px 10px 8px; } [dir="rtl"] #name-and-slogan, [dir="rtl"] .site-branding-text { margin: 0 15px 30px 0; } @media all and (min-width: 461px) and (max-width: 900px) { #name-and-slogan, .site-branding-text { padding: 10px 10px 8px; } } @media all and (min-width: 901px) { #name-and-slogan, .site-branding-text { padding: 26px 0 0; margin: 0 0 30px 15px; /* LTR */ } [dir="rtl"] #name-and-slogan, [dir="rtl"] .site-branding-text { margin: 0 15px 30px 0; } } #site-name, .site-name { font-size: 1.6em; color: #686868; line-height: 1; } @media all and (min-width: 901px) { #site-name, .site-name { font-size: 1.821em; } } h1#site-name, h1.site-name { margin: 0; } #site-name a, .site-name a { font-weight: normal; } #site-slogan, .site-slogan { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 0.929em; margin-top: 7px; word-spacing: 0.1em; font-style: italic; } /* Region header blocks. */ .region-header .block { font-size: 0.857em; float: left; /* LTR */ margin: 0 10px; padding: 0; } .region-header .block > h2 { /* @extend .visually-hidden */ position: absolute !important; clip: rect(1px, 1px, 1px, 1px); overflow: hidden; height: 1px; } .header .block .content { margin: 0; padding: 0; } .region-header .block ul { margin: 0; padding: 0; } .region-header .block li { list-style: none; list-style-image: none; padding: 0; } .region-header .form-text { background: #fefefe; background: rgba(255, 255, 255, 0.7); border-color: #ccc; border-color: rgba(255, 255, 255, 0.3); margin-right: 2px; /* LTR */ width: 120px; } [dir="rtl"] .region-header .form-text { margin-left: 2px; margin-right: 0; } .region-header .form-text:hover, .region-header .form-text:active, .region-header .form-text:focus { background: #fff; background: rgba(255, 255, 255, 0.8); } .region-header .form-required:after { background-image: url(../../images/required.svg); } /* Region header block menus. */ .region-header .block-menu { border: 1px solid; border-color: #eee; border-color: rgba(255, 255, 255, 0.2); padding: 0; width: 208px; } .region-header .block-menu li a { display: block; border-bottom: 1px solid; border-bottom-color: #eee; border-bottom-color: rgba(255, 255, 255, 0.2); padding: 3px 7px; } .region-header .block-menu li a:hover, .region-header .block-menu li a:active, .region-header .block-menu li a:focus { text-decoration: none; background: rgba(255, 255, 255, 0.15); } .region-header .block-menu li:last-child a { border-bottom: 0; } /* User Login block in the header region */ .region-header #block-user-login { width: auto; } .region-header #block-user-login .content { margin-top: 2px; } .region-header #block-user-login .form-item { float: left; /* LTR */ margin: 0; padding: 0; } .region-header #block-user-login div.item-list, .region-header #block-user-login div.description { font-size: 0.916em; margin: 0; } .region-header #block-user-login div.item-list { clear: both; } .region-header #block-user-login div.description { display: inline; } .region-header #block-user-login .item-list ul { padding: 0; line-height: 1; } .region-header #block-user-login .item-list li { list-style: none; float: left; /* LTR */ padding: 3px 0 1px; } .region-header #block-user-login .item-list li:last-child { padding-left: 0.5em; /* LTR */ } [dir="rtl"] .region-header #block-user-login .item-list li:last-child { padding-left: 0; padding-right: 0.5em; } .region-header #block-user-login .form-actions { margin: 4px 0 0; padding: 0; clear: both; } .region-header #block-user-login input.form-submit { border: 1px solid; border-color: #ccc; border-color: rgba(255, 255, 255, 0.5); background: #eee; background: rgba(255, 255, 255, 0.7); margin: 4px 0; padding: 3px 8px; } .region-header #block-user-login input.form-submit:hover, .region-header #block-user-login input.form-submit:focus { background: #fff; background: rgba(255, 255, 255, 0.9); } /* Search block in region header. */ .region-header #block-search-form { width: 208px; } .region-header #block-search-form .form-text { width: 154px; } /* Language switcher block in region header. */ .region-header .block-locale ul li { display: inline; padding: 0 0.5em; } [role*=banner] a { border-bottom: none; } [dir="rtl"] #logo, [dir="rtl"] .site-logo, [dir="rtl"] #name-and-slogan, [dir="rtl"] .site-branding-text, [dir="rtl"] .region-header .block, [dir="rtl"] .region-header #block-user-login .form-item, [dir="rtl"] .region-header #block-user-login .item-list li { float: right; }