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