wolnelektury/static/css/header.css

   1 #header-bg {
   2         z-index: -1;
   3         background: #191919;
   4         position: absolute;
   5         width: 50%;
   6         height: 9.4em;
   7 }
   8
   9 #header {
  10     height: 3em;
  11     padding-top: 1.9em;
  12     padding-bottom: 0;
  13     color: #989898;
  14     background: #191919;
  15 }
  16 #header a {
  17         color: #17CFDB;
  18 }
  19
  20 #half-header {
  21     padding-bottom: 0;
  22 }
  23
  24 #half-header-content {
  25     background: #191919;
  26     color: #989898;
  27 }
  28
  29
  30 #user-info {
  31     float: right;
  32     margin: 0;
  33 }
  34
  35 #logo {
  36     position: absolute;
  37     top: -1.6em;
  38     margin-left: 1.5em;
  39 }
  40
  41 #logo a {
  42     color:#f7f7f7;
  43     font-size: 2.05em;
  44     text-shadow: 0 0 10px #17CFDB;
  45 }
  46
  47 #tagline {
  48     display: inline-block;
  49     margin-left: 25.5em;
  50 }
  51 #tagline span {
  52     font-size: 1.3em;
  53     color: #bbb;
  54 }
  55
  56 #search-area {
  57     margin: 0;
  58     background: #444;
  59     color: white;
  60     margin-left: 24em;
  61     width: 73.5em;
  62 }
  63
  64 #search-field {
  65     display: inline-block;
  66     width: 63.1em;
  67     padding-left: .5em;
  68     padding-right: 0;
  69     padding-top: 0.5em;
  70     padding-bottom: 0;
  71 }
  72
  73 #search {
  74     font-size: 1.3em;
  75     padding: 0;
  76     /*height: 3.3em;
  77     width: 62.6em;
  78     padding-left: .5em;
  79     -webkit-border-radius: .5em;
  80     -moz-border-radius: .5em;
  81     border: none;
  82     border-radius: .5em;
  83     -webkit-box-shadow:0 0 .5em #444 inset;
  84     -moz-box-shadow:0 0 .5em #444 inset;
  85     box-shadow: 0 0 .5em #444 inset;*/
  86     height: 2.54em;
  87     width: 47.47em;
  88     padding-left: 1em;
  89     -webkit-border-radius: .38em;
  90     -moz-border-radius: .38em;
  91     border: none;
  92     border-radius: .38em;
  93     -webkit-box-shadow:0 0 .38em #444 inset;
  94     -moz-box-shadow:0 0 .38em #444 inset;
  95     box-shadow: 0 0 .5em #444 inset;
  96     line-height: 2.5em;
  97
  98     font-family: Georgia;
  99     background-color: #fff;
 100     color: #000;
 101     z-index: 200;
 102     position: relative;
 103 }
 104
 105 /* styling search placeholder */
 106
 107 #search:-webkit-input-placeholder
 108 {
 109     font-family: Georgia;
 110     font-style: italic;
 111     color: #767676;
 112 }
 113
 114 #search.placeholder
 115 {
 116     font-family: Georgia;
 117     font-style: italic;
 118     color: #767676;
 119 }
 120
 121 #search:-moz-placeholder
 122 {
 123     font-family: Georgia;
 124     font-style: italic;
 125     color: #767676;
 126 }
 127
 128 #search-button {
 129     display: inline-block;
 130     background: #018189;
 131     color: white;
 132     padding: 0;
 133     margin: 0;
 134     width: 9.4em;
 135     float: right;
 136 }
 137 #search-button button {
 138     font-size: 1em;
 139     height: 4.5em;
 140     border: none;
 141     background: #018189;
 142     color: white;
 143     width: 100%;
 144     padding: 0;
 145 }
 146
 147 #search-button button span {
 148     font-size: 1.1em;
 149     position:relative;
 150 }
 151
 152
 153 #nav-line {
 154     background-color: #e2e2e2;
 155     height: 4.9em;
 156 }
 157
 158 ul#menu {
 159     list-style: none;
 160     padding: 0;
 161     margin: 0 0 0 .6em;
 162 }
 163
 164 li.menu {
 165     background-color: #e2e2e2;
 166     float: left;
 167 }
 168 a.menu {
 169     display: block;
 170     padding-left: 1.4em;
 171     padding-right: 1.4em;
 172     /* must match grid-line */
 173     height: 3.1em;
 174     padding-top: 1.8em;
 175     color: #0c7076;
 176 }
 177 a.menu span {
 178     font-size: 1.1em;
 179 }
 180
 181
 182 #lang-button {
 183     color: #717171;
 184 }
 185 #lang-button:after {
 186     padding-left: 1em;
 187     content: "↓";
 188     font-family: WL-Nav;
 189     vertical-align: middle;
 190 }
 191 #lang-menu {
 192     position: relative;
 193     float: right;
 194     display: block;
 195     padding-left: 2.5em;
 196     padding-right: 2em;
 197     /* must match grid-line */
 198     height: 3em;
 199     padding-top: 1.9em;
 200     background: #f7f7f7;
 201 }
 202
 203 #lang-menu-items {
 204         z-index: 9999;
 205 }
 206
 207 #lang-menu-items button {
 208     display: none;
 209     background: #f7f7f7;
 210     color: #6f6f6f;
 211     cursor: pointer;
 212     width: 100%;
 213     border: solid #ddd;
 214     border-width: 0 0 1px 0;
 215     padding: .5em 0;
 216     margin: 0;
 217 }
 218
 219 #lang-menu:hover button {
 220     display: block;
 221 }
 222
 223 #lang-menu:hover #lang-menu-items {
 224     position: absolute;
 225     width: 100%;
 226     padding: 0;
 227     left: 0;
 228     /* must match grid-line height */
 229     top: 3.9em;
 230 }
 231
 232 #lang-menu .active {
 233     color: #000;
 234 }
 235
 236 .search-hint-label {
 237     display: inline-block;
 238     width: 25em;
 239     font-size: 1.1em;
 240     line-height: 1.636em;
 241 }
 242
 243 .search-hint-category {
 244     font-size: 1.1em;
 245     line-height: 1.636em;
 246
 247 }