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