plop
[cl7.git] / css / style.css
1 /* coding:utf-8 */
2
3 html {
4 min-height: 100%;
5 margin-bottom: 1px;
6 }
7 body {
8 margin: 0px;
9 font-family: monospace;
10 font-size: 11px;
11 color: #ffffff;
12 background-color: #000000;
13 }
14 img {
15 border-width: 0px;
16 }
17 a {
18 color: #8888ff;
19 text-decoration: none;
20 }
21 a:hover {
22 color: #aaaaff;
23 }
24 a.externe {
25 padding-right: 12px;
26 background:transparent url(../images/lien_externe.png) no-repeat scroll right center;
27 }
28 th {
29 background-image:url(../images/fond1.png);
30 background-repeat:repeat;
31 }
32 em {
33 color: #ffff00;
34 }
35
36 #container {
37 padding-top: 50px;
38 padding-bottom: 50px;
39 margin-left: auto;
40 margin-right: auto;
41 width: 800px;
42 margin-top: 0px;
43 background-image: url(../images/bieres_fond1.jpg);
44 background-repeat: repeat-y;
45 background-position: 0px -25px;
46 }
47
48 #cadre {
49 margin-left: 100px;
50 width: 600px;
51 border: 1px solid #ffffff;
52 background-image: url(../images/bieres_fond2.jpg);
53 background-repeat: repeat-y;
54 background-position: 0px -75px;
55
56 }
57
58 #titre {
59 width: 590px;
60 padding: 5px;
61 font-size: 20px;
62 background-image: url(../images/fond1.png);
63 background-repeat: repeat;
64 }
65
66 #titre #nbPlacesRestantes {
67 font-size: 11px;
68 float: right;
69 }
70
71 ul#menu {
72 text-align: justify;
73 margin: 0px;
74 padding: 3px;
75 background-image: url(../images/fond3.png);
76 background-repeat: repeat;
77 }
78 #menu li {
79 display:inline;
80 margin-right: 10px;
81 }
82 #menu a {
83 color: #6bff6b;
84 text-decoration: none;
85 }
86 #menu a:hover,
87 #menu li.courante a {
88 color: #ffffff;
89 background-color: #00d000;
90 }
91
92 #contenu {
93 padding: 10px;
94 overflow: auto;
95 /*width: 100%*/
96 }
97 #contenu h1 {
98 margin-top: 5px;
99 margin-bottom: 5px;
100 font-size: 15px;
101 }
102 #contenu h2 {
103 margin-top: 7px;
104 margin-bottom: 3px;
105 font-size: 12px;
106 }
107 #contenu p {
108 margin-top: 2px;
109 }
110 #contenu ul {
111 margin-top: 2px;
112 padding-left: 23px;
113 }
114 #contenu .miniInfo {
115 font-size: 9px;
116 }
117 #contenu table {
118 /*table-layout: fixed*/
119 }
120 #contenu td {
121 vertical-align: top;
122 }
123 #contenu col#inscriptionColonneNom {
124 width: 30%;
125 }
126 #contenu col#inscriptionColonneValeur {
127 width: 70%;
128 }
129 #contenu #formulaireJeuxJoues .aVote {
130 color: #ffff00;
131 }
132 #contenu #formulaireInscription p {
133 margin-top: 1px;
134 margin-bottom: 0px;
135 }
136 #contenu .inscrits .participe {
137 text-align: center;
138 background-image: url(../images/fond2.png);
139 background-repeat: repeat;
140 }
141 #contenu .inscrits .participe:before {
142 content: "×";
143 }
144
145 #informations {
146 margin: 5px;
147 padding: 5px;
148 float: right;
149 background-image: url(../images/fond2.png);
150 background-repeat: repeat;
151 }
152 #informations ul {
153 padding-left: 5px;
154 }
155 #informations li {
156 list-style-type: none;
157 }
158 #informations li:before {
159 content: "» ";
160 }
161 #informations form p {
162 margin-bottom: 1px;
163 margin-top: 1px;
164 }
165
166 #pieddepage {
167 text-align: center;
168 background-image: url(../images/fond1.png);
169 background-repeat: repeat;
170 padding: 2px;
171 }
172
173 form input,
174 form button,
175 form select,
176 form textarea{
177 font-family: monospace;
178 font-size: 11px;
179 color: #ffffff;
180 background-color: transparent;
181 border: #ffffff 1px solid;
182 }
183 form input:hover, form input:focus,
184 form button:hover, form button:focus,
185 form select:hover, form select:focus,
186 form textarea:hover, form textarea:focus {
187 background-color: transparent;
188 border: #ffff00 1px solid;
189 }
190
191 /***** La boite d'information (s'apparente à une MessageBox) *****/
192 div#info {
193 text-align: center;
194 width:100%;
195 position: fixed;
196 left: 0px;
197 top: 0px;
198 background-color: #841919;
199 border-bottom: 1px solid #FFFFFF;
200 z-index: 100;
201 color: #f0df95
202 }
203 div#info div.fermer {
204 float:right;
205 cursor: pointer;
206 height:16px;
207 width: 16px;
208 background-image: url(../images/fermer.gif)
209 }
210 div#info #icone {
211 float:left;
212 height:16px;
213 width: 16px;
214 }
215 div#info #icone.interrogation {
216 background-image: url(../images/interrogation.gif)
217 }
218 div#info #icone.information {
219 background-image: url(../images/information.gif)
220 }
221 div#info #icone.exclamation {
222 background-image: url(../images/exclamation.gif)
223 }
224 div#info .boutons {
225 padding: 1px;
226 }
227 div#info .boutons div {
228 cursor: pointer;
229 background-color: #c62929;
230 display: inline;
231 padding: 0px 5px 0px 5px;
232 margin: 0px 5px 0px 5px;
233 }
234 div#info .boutons div:hover {
235 background-color: #e84747;
236 }
237
238 /* Pour la page des pizzas */
239 .pizzaHeader {
240 background-image:url(../images/fond1.png);
241 background-repeat:repeat;
242 }
243
244 tr:hover
245 {
246 background-image:url(../images/fond2.png);
247 background-repeat:repeat;
248 }
249
250 .pizzaChoisie
251 {
252 background-image:url(../images/fond2.png);
253 background-repeat:repeat;
254 }