main menu
[emels.git] / emels / static / css / base.css
1 @charset "UTF-8";
2 @import url(//fonts.googleapis.com/css?family=Dosis:400,700&subset=latin,latin-ext);
3 a {
4   text-decoration: none;
5   color: #ed7831; }
6   a img {
7     border: 0;
8     padding: 0; }
9
10 body {
11   font-family: Dosis;
12   background: white;
13   color: #363a3e;
14   margin: 0; }
15
16 .clr {
17   clear: both; }
18
19 #banners {
20   margin: 0 auto;
21   width: 58.75em; }
22   #banners > a {
23     display: block;
24     width: 100%; }
25   #banners img {
26     display: block;
27     margin: 0 auto;
28     width: 100%; }
29
30 #header-wrapper {
31   background-image: url(../img/header-bar.png);
32   background-repeat: repeat-x;
33   background-position: 0 100%; }
34
35 header.main {
36   margin: 0 auto 1.4375em;
37   width: 58.75em;
38   padding: 1.8125em 0.625em 0; }
39   header.main #logo {
40     float: left;
41     margin-bottom: 1.25em; }
42     header.main #logo img {
43       vertical-align: middle; }
44   header.main #organizer {
45     float: right;
46     font-size: .75em;
47     color: #777; }
48     header.main #organizer img {
49       margin-top: .5em; }
50   header.main nav ul {
51     padding: 0;
52     position: absolute;
53     left: 15em; }
54   header.main nav li {
55     list-style: none;
56     display: inline-block;
57     text-transform: uppercase;
58     margin: 0 .5em;
59     text-align: center;
60     /*position:relative;*/ }
61   header.main nav a {
62     color: #363a3e;
63     display: block;
64     vertical-align: bottom;
65     font-size: .85em; }
66   header.main nav a:hover {
67     color: #ed7831; }
68   header.main nav a:before {
69     content: " ";
70     display: block;
71     width: 2.75em;
72     height: 2.125em;
73     text-align: center;
74     margin: auto auto .8em; }
75   header.main nav .menu-news:before {
76     background: url(../img/menu/news.png) no-repeat 0 0;
77     background-size: 100%; }
78   header.main nav .menu-about:before {
79     background: url(../img/menu/about.png) no-repeat 0 0;
80     background-size: 100%; }
81   header.main nav .menu-partners:before {
82     background: url(../img/menu/partners.png) no-repeat 0 0;
83     background-size: 100%; }
84   header.main nav .menu-publications:before {
85     background: url(../img/menu/publications.png) no-repeat 0 0;
86     background-size: 100%; }
87   header.main nav .menu-contact:before {
88     background: url(../img/menu/contact.png) no-repeat 0 0;
89     background-size: 100%; }
90   header.main nav .menu-news:hover:before {
91     background: url(../img/menu/news-active.png) no-repeat 0 0;
92     background-size: 100%; }
93   header.main nav .menu-about:hover:before {
94     background: url(../img/menu/about-active.png) no-repeat 0 0;
95     background-size: 100%; }
96   header.main nav .menu-partners:hover:before {
97     background: url(../img/menu/partners-active.png) no-repeat 0 0;
98     background-size: 100%; }
99   header.main nav .menu-publications:hover:before {
100     background: url(../img/menu/publications-active.png) no-repeat 0 0;
101     background-size: 100%; }
102   header.main nav .menu-contact:hover:before {
103     background: url(../img/menu/contact-active.png) no-repeat 0 0;
104     background-size: 100%; }
105   header.main #tagline {
106     clear: both;
107     float: left;
108     background-color: white;
109     /* Extend padded background .*/
110     padding: 0 0.625em;
111     margin-left: -0.625em;
112     font-size: .9em;
113     color: #363a3e; }
114   header.main #search {
115     float: right;
116     background-color: white;
117     /* Extend padded background .*/
118     padding: 2px 0.625em 0;
119     margin-right: -0.625em; }
120
121 #content {
122   width: 58.75em;
123   padding: 0 0.625em;
124   margin: auto;
125   position: relative; }
126
127 footer.main {
128   clear: both;
129   border-top: 1px solid #c9ccce;
130   width: 58.75em;
131   padding: 0.2em 0.625em;
132   margin: 2.5em auto 1em auto;
133   color: #9a9c9e; }
134   footer.main p {
135     font-size: .75em; }
136   footer.main .footer-item {
137     float: left;
138     margin-right: 1.25em;
139     width: 13.75em; }
140   footer.main .sponsors-column {
141     float: left;
142     margin-left: 1.25em;
143     width: 6.25em; }
144     footer.main .sponsors-column p {
145       font-size: .75em; }
146   footer.main .footer-extra p {
147     margin-top: 0; }
148
149 #search {
150   font-size: .8em; }
151   #search input, #search button {
152     font-family: Dosis;
153     font-size: .9em;
154     vertical-align: bottom;
155     border: 1px solid #c9ccce;
156     padding: 0;
157     margin: 0;
158     line-height: .9em; }
159   #search input {
160     border-right-width: 0;
161     height: 16px;
162     width: 16em;
163     padding-left: 1.3em; }
164   #search button {
165     height: 18px;
166     width: 1.8em; }
167     #search button span {
168       position: relative;
169       top: -1px; }
170   #search input::-webkit-input-placeholder {
171     text-transform: uppercase; }
172   #search input:-moz-placeholder {
173     text-transform: uppercase; }
174   #search input::-moz-placeholder {
175     text-transform: uppercase; }
176   #search input::-ms-placeholder {
177     text-transform: uppercase; }
178
179 .link-list {
180   list-style: none;
181   padding: 0; }
182   .link-list li {
183     margin-bottom: .5em; }
184   .link-list a:before {
185     content: "→";
186     margin-right: .5em; }
187   .link-list a {
188     color: #363a3e; }
189   .link-list a:hover {
190     color: #ed7831; }
191
192 .link-list-colored a {
193   color: #ed7831; }
194
195 .plain {
196   margin: 0;
197   padding: 0;
198   list-style: none; }
199   .plain li {
200     margin: 1em 0; }
201
202 .flatpage img {
203   border: 0.3125em solid #eeeeee;
204   margin: 1.3em; }