styles/1/euphorik.css

   1 /* coding: utf-8 */
   2
   3 @import url(pageMinichat.css);
   4 @import url(pageAdmin.css);
   5 @import url(pageProfileRegister.css);
   6 @import url(pageAbout.css);
   7
   8 * {
   9         padding: 0px;
  10         margin: 0px;
  11 }
  12
  13 body {
  14         font-family: sans-serif;
  15         font-size: 12px;
  16         color: #841919;
  17         background-color: #f6dfc2;
  18 }
  19
  20 #container {
  21         height: auto;
  22         margin: 0px;
  23 }
  24
  25 /***** Une barre de progression s'affichant lors des communications entre le client et le serveur *****/
  26 #waitbar {
  27         text-align: center;
  28         height: 16px;
  29         width:100%;
  30         position: fixed;
  31         left: 0px;
  32         top: 0px;
  33         z-index: 500;
  34 }
  35 #waitbar .image {
  36         background-image: url(../../img/waitbar.gif);
  37         margin-top: 3px;
  38         margin-right: 3px;
  39         float: right;
  40         height: 13px;
  41         width: 105px;
  42 }
  43
  44 /***** Textile *****/
  45 em.leger {
  46         font-style: italic
  47 }
  48 em.fort {
  49         font-style: normal;
  50         font-weight: bold
  51 }
  52
  53 /***** Menu *****/
  54 ul#menu {
  55         background-image: url(img/logo_fond.png);
  56         height:129px;
  57         width: 100%;
  58         font-size: 11px;
  59         list-style-type:none;
  60 }
  61 #menu li:first-child {
  62         margin-left: 340px;
  63 }
  64 #menu li {
  65         margin-top: 47px;
  66         font-size: 14px;
  67         text-align: center;
  68         cursor: pointer;
  69         height:30px;
  70         z-index: 20;
  71         float: left;
  72         min-width: 60px;
  73         background-color: #f6dfc2;
  74         line-height: 32px;
  75 }
  76 #menu li.courante {
  77         background-color: #ffffff;
  78         background-image: url(img/triangle.png);
  79         background-repeat: no-repeat;
  80         background-position: center bottom
  81 }
  82 #menu li:hover {
  83         background-color: #ffffff;
  84 }
  85
  86 /***** Le menu pour le choix de la CSS *****/
  87 #menuCss {
  88         position: absolute;
  89         z-index: 10;
  90         left: 550px;
  91         top:0px;
  92         font-size: 9px;
  93 }
  94
  95 /***** Le style du contenu des pages *****/
  96 #page {
  97         font-size: 12px;
  98         background-color: #f6dfc2;
  99         padding: 10px 10px 15px 10px;
 100 }
 101 #page > h1 {
 102         margin-top: 10px;
 103         margin-left: 0px;
 104         font-size: 18px;
 105 }
 106 #page > h2 {
 107         margin-top: 10px;
 108         margin-left: 10px;
 109         font-size: 16px;
 110 }
 111 #page > h3 {
 112         margin-top: 10px;
 113         margin-left: 20px;
 114         font-size: 14px;
 115         background-color : #FFFFFF
 116 }
 117 #page > h4 {
 118         margin-top: 10px;
 119         margin-left: 25px;
 120         font-size: 12px;
 121 }
 122 #page > p {
 123         margin-top: 3px;
 124         margin-left: 35px;
 125 }
 126 #page > ul {
 127         margin-top: 3px;
 128         margin-left: 45px;
 129 }
 130 #logo {
 131         z-index: 10;
 132         background-image: url(img/logo.png);
 133         background-repeat: no-repeat;
 134         width: 304px;
 135         height: 129px;
 136         position: absolute;
 137 }
 138 #logo.ekMaster {
 139         background-image: url(img/logo_ek_master.png);
 140 }
 141
 142 /***** Le pied de page *****/
 143 #footer {
 144         background-color: #e19671;
 145         text-align: right;
 146         font-size: 9px;
 147         padding: 2px
 148 }
 149 #footer a img{
 150         border-style: none;
 151         vertical-align: middle;
 152         margin-right: 5px;
 153 }
 154 #footer span{
 155         margin-right: 10px;
 156 }
 157
 158 /***** La boite d'information (s'apparente à une MessageBox) *****/
 159 div#info {
 160         text-align: center;
 161         width:100%;
 162         position: fixed;
 163         left: 0px;
 164         top: 0px;
 165         background-color: #841919;
 166         border-bottom: 1px solid #FFFFFF;
 167         z-index: 100;
 168         color: #f0df95
 169 }
 170 div#info div.fermer {
 171         float:right;
 172         cursor: pointer;
 173         height:16px;
 174         width: 16px;
 175         background-image: url(../../img/fermer.gif)
 176 }
 177 div#info #icone {
 178         float:left;
 179         height:16px;
 180         width: 16px;
 181 }
 182 div#info #icone.interrogation {
 183         background-image: url(../../img/interrogation.gif)
 184 }
 185 div#info #icone.information {
 186         background-image: url(../../img/information.gif)
 187 }
 188 div#info #icone.exclamation {
 189         background-image: url(../../img/exclamation.gif)
 190 }
 191 div#info .boutons {
 192         padding: 1px;
 193 }
 194 div#info .boutons div {
 195         cursor: pointer;
 196         background-color: #c62929;
 197         display: inline;
 198         padding: 0px 5px 0px 5px;
 199         margin: 0px 5px 0px 5px;
 200 }
 201 div#info .boutons div:hover {
 202         background-color: #e84747;
 203 }
 204
 205 /***** Les infos bulles *****/
 206 #flecheBulle {
 207         position: absolute;
 208         z-index: 50;
 209         display: none
 210 }
 211 .flecheBulleHaut {
 212         background-image: url(img/fleche_bulle_haut.png);
 213         width: 15px;
 214         height: 8px;
 215 }
 216 .flecheBulleDroite {
 217         background-image: url(img/fleche_bulle_droite.png);
 218         width: 8px;
 219         height: 15px;
 220 }
 221 .flecheBulleBas {
 222         background-image: url(img/fleche_bulle_bas.png);
 223         width: 15px;
 224         height: 8px;
 225 }
 226 .flecheBulleGauche {
 227         background-image: url(img/fleche_bulle_gauche.png);
 228         width: 8px;
 229         height: 15px;
 230 }
 231 #messageBulle {
 232         position: absolute;
 233         z-index: 50;
 234         color: #ffffff;
 235         background-color: #841919;
 236         display: none;
 237         font-size: 10px;
 238 }
 239 #messageBulle p {
 240         padding: 3px 6px;
 241 }
 242
 243 /***** Le faux captcha *****/
 244 .captcha {
 245         display:none;
 246 }
 247
 248 /***** Les formulaires *****/
 249 form input,
 250 form button,
 251 form select {
 252         color: #841919;
 253         background-color: #f0df95;
 254         border: #841919 1px solid;
 255 }
 256 form input:hover, form input:focus,
 257 form button:hover, form button:focus,
 258 form select:hover, form select:focus {
 259         background-color: #ffffff;
 260 }
 261 form input,
 262 form select {
 263         font-size: 12px;
 264 }
 265 form button {
 266         font-size: 11px;
 267 }
 268 form input[readonly] {
 269         background-color: #d0c9aa
 270 }
 271
 272 /***** Les liens *****/
 273 .lien, a {
 274         text-decoration: underline;
 275         color: #c62929;
 276 }
 277 .lien {
 278         cursor: pointer
 279 }
 280 a:link, a:visited {
 281         color: #c62929;
 282 }
 283 .lien:hover, .lien:active, a:hover, a:active {
 284         color: #e84747;
 285 }