skins/default/common.css

   1 /***** RoundCube|Mail basic styles *****/
   2
   3 body
   4 {
   5   margin: 8px;
   6   background-color: #F6F6F6; /* #EBEBEB; */
   7   color: #000000;
   8 }
   9
  10 body.iframe
  11 {
  12   margin: 0px;
  13 }
  14
  15 body.extwin
  16 {
  17   margin: 10px;
  18 }
  19
  20 body, td, th, span, div, p, h3
  21 {
  22   font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
  23   font-size: 12px;
  24   color: #000000;
  25 }
  26
  27 th
  28 {
  29   font-weight: normal;
  30 }
  31
  32 h3
  33 {
  34   font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
  35   font-size: 18px;
  36   color: #000000;
  37 }
  38
  39 a, a:active, a:visited
  40 {
  41   color: #000000;
  42   outline: none;
  43 }
  44
  45 a.button, a.button:visited, a.tab, a.tab:visited, a.axislist
  46 {
  47   color: #000000;
  48   text-decoration: none;
  49 }
  50
  51 a.tab
  52 {
  53   width: 80px;
  54   display: block;
  55   text-align: center;
  56 }
  57
  58 hr
  59 {
  60   height: 1px;
  61   background-color: #666666;
  62   border-style: none;
  63 }
  64
  65 input, textarea
  66 {
  67   font-size: 9pt;
  68   font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
  69   padding: 1px;
  70   padding-left: 3px;
  71   padding-right: 3px;
  72   background-color: #ffffff;
  73   border: 1px solid #666666;
  74 }
  75
  76 input[type="checkbox"],
  77 input[type="radio"]
  78 {
  79   border: 0;
  80   padding: 0;
  81 }
  82
  83 input.button
  84 {
  85   height: 20px;
  86   color: #333333;
  87   font-size: 12px;
  88   padding-left: 8px;
  89   padding-right: 8px;
  90   background: url(images/buttons/bg.gif) repeat-x #f0f0f0;
  91   border: 1px solid #a4a4a4;
  92 }
  93
  94 input.button:hover
  95 {
  96   color: black;
  97 }
  98
  99 img
 100 {
 101   behavior: url('skins/default/pngbehavior.htc');
 102 }
 103
 104 .alttext
 105 {
 106   font-size: 11px;
 107 }
 108
 109
 110 /** common user interface objects */
 111
 112 #header
 113 {
 114   position: absolute;
 115   top: 10px;
 116   left: 20px;
 117   width: 170px;
 118   height: 40px;
 119   z-index: 100;
 120 }
 121
 122 #taskbar
 123 {
 124   position: absolute;
 125   top: 0px;
 126   right: 0px;
 127   width: 600px;
 128   height: 37px;
 129   background: url(images/taskbar.gif) top right no-repeat;
 130   padding: 10px 14px 10px 0px;
 131   text-align: right;
 132   white-space: nowrap;
 133   z-index: 2;
 134 }
 135
 136 #taskbar a,
 137 #taskbar a:active,
 138 #taskbar a:visited
 139 {
 140   font-size: 11px;
 141   color: #666666;
 142   text-decoration: none;
 143   padding: 6px 16px 6px 30px;
 144   background-repeat: no-repeat;
 145 }
 146
 147 #taskbar a:hover
 148 {
 149   color: #333333;
 150 }
 151
 152 a.button-mail
 153 {
 154   background-image: url(images/buttons/mail.gif);
 155 }
 156
 157 a.button-addressbook
 158 {
 159   background-image: url(images/buttons/addressbook.gif);
 160 }
 161
 162 a.button-settings
 163 {
 164   background-image: url(images/buttons/settings.gif);
 165 }
 166
 167 a.button-logout
 168 {
 169   background-image: url(images/buttons/logout.gif);
 170 }
 171
 172
 173 #message
 174 {
 175   position: absolute;
 176   display: none;
 177   top: -1px;
 178   left: 200px;
 179   right: 200px;
 180   z-index: 5000;
 181   opacity: 0.85;
 182 }
 183
 184 #message div
 185 {
 186   width: 400px;
 187   margin: 0px auto;
 188   height: 24px;
 189   min-height: 24px;
 190   padding: 8px 10px 8px 46px;
 191 }
 192
 193 #message div.notice,
 194 #remote-objects-message
 195 {
 196   background: url(images/display/info.png) 6px 3px no-repeat;
 197   background-color: #F7FDCB;
 198   border: 1px solid #C2D071;
 199 }
 200
 201 #message div.error,
 202 #message div.warning
 203 {
 204   background: url(images/display/warning.png) 6px 3px no-repeat;
 205   background-color: #EF9398;
 206   border: 1px solid #DC5757;
 207 }
 208
 209 #message div.confirmation
 210 {
 211   background: url(images/display/confirm.png) 6px 3px no-repeat;
 212   background-color: #A6EF7B;
 213   border: 1px solid #76C83F;
 214 }
 215
 216 #message div.loading
 217 {
 218   background: url(images/display/loading.gif) 6px 3px no-repeat;
 219   background-color: #EBEBEB;
 220   border: 1px solid #CCCCCC;
 221 }
 222
 223 .splitter
 224 {
 225   position: absolute;
 226   padding: 2px;
 227   background: url(images/dimple.png) center no-repeat;
 228 }
 229
 230 .splitter-h
 231 {
 232   cursor: n-resize;
 233   background-position: center 2px;
 234 }
 235
 236 .splitter-v
 237 {
 238   cursor: e-resize;
 239   background-position: 1px center;
 240 }
 241
 242 .boxtitle
 243 {
 244   height: 12px !important;
 245   padding: 4px 20px 3px 20px;
 246   border-bottom: 1px solid #999;
 247   color: #333;
 248   font-size: 11px;
 249   font-weight: bold;
 250   background-color: #EBEBEB;
 251   background-image: url(images/listheader_aqua.gif);
 252 }
 253
 254 .radios-left label
 255 {
 256   padding-left: 0.3em;
 257 }
 258
 259 /***** common table settings ******/
 260
 261 table.records-table thead tr td
 262 {
 263   height: 20px;
 264   padding: 0px 4px 0px 4px;
 265   vertical-align: middle;
 266   border-bottom: 1px solid #999999;
 267   color: #333333;
 268   background-color: #EBEBEB;
 269   background-image: url(images/listheader_aqua.gif);
 270   font-size: 11px;
 271   font-weight: bold;
 272 }
 273
 274 table.records-table tbody tr td
 275 {
 276   height: 16px;
 277   padding: 2px 4px 2px 4px;
 278   font-size: 11px;
 279   white-space: nowrap;
 280   border-bottom: 1px solid #EBEBEB;
 281   overflow: hidden;
 282   text-align: left;
 283 }
 284
 285 table.records-table tr
 286 {
 287   background-color: #FFFFFF;
 288 }
 289
 290 table.records-table tr.selected td
 291 {
 292   color: #FFFFFF;
 293   background-color: #CC3333;
 294 }
 295
 296 table.records-table tr.focused td
 297 {
 298 }
 299
 300 table.records-table tr.unfocused td
 301 {
 302   color: #FFFFFF;
 303   background-color: #929292;
 304 }
 305
 306
 307 /***** mac-style quicksearch field *****/
 308
 309 #quicksearchbar
 310 {
 311   position: absolute;
 312   top: 60px;
 313   right: 30px;
 314   width: 182px;
 315   height: 20px;
 316   text-align: right;
 317   background: url('images/searchfield.gif') top left no-repeat;
 318 }
 319
 320 #quicksearchbar a
 321 {
 322   position: absolute;
 323   top: 3px;
 324   right: 4px;
 325   text-decoration: none;
 326 }
 327
 328 #quicksearchbar img
 329 {
 330   vertical-align: middle;
 331 }
 332
 333 #quicksearchbox
 334 {
 335   position: absolute;
 336   top: 2px;
 337   left: 20px;
 338   width: 140px;
 339   font-size: 11px;
 340   padding: 0px;
 341   border: none;
 342 }
 343
 344
 345 /*\*/
 346 html>body*#quicksearchbar[id$="quicksearchbar"]:not([class="none"]) { background-image: none; }
 347 html>body*#quicksearchbar[id$="quicksearchbar"]:not([class="none"]) a { top: 5px; }
 348 html>body*#quicksearchbar[id$="quicksearchbar"]:not([class="none"]) #quicksearchbox { width: 180px; top:0px; right: 1px; left: auto; }
 349 /**/
 350
 351
 352 /***** roundcube webmail pre-defined classes *****/
 353
 354 #rcversion
 355 {
 356   position: absolute;
 357   top: 67px;
 358   left: 20px;
 359   width: 160px;
 360   text-align: center;
 361
 362   font-weight: normal;
 363   font-size: x-small;
 364   font-variant: small-caps;
 365
 366   color: #999999;
 367   /*border: 1px solid #308014;
 368   background-color: #b4eeb4;*/
 369 }
 370
 371 #rcmdraglayer
 372 {
 373   width: 300px;
 374   border: 1px solid #999999;
 375   background-color: #F9F9F9;
 376   padding-left: 8px;
 377   padding-right: 8px;
 378   padding-top: 3px;
 379   padding-bottom: 3px;
 380   font-size: 11px;
 381   opacity: 0.7;
 382   -moz-opacity: 0.7;
 383   filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
 384 }
 385
 386 a.rcmContactAddress
 387 {
 388   text-decoration: none;
 389 }
 390
 391 a.rcmContactAddress:hover
 392 {
 393   text-decoration: underline;
 394 }
 395
 396 #rcmKSearchpane
 397 {
 398   background-color: #F9F9F9;
 399   border: 1px solid #CCCCCC;
 400 }
 401
 402 #rcmKSearchpane ul
 403 {
 404   margin: 0px;
 405   padding: 2px;
 406   list-style-image: none;
 407   list-style-type: none;
 408 }
 409
 410 #rcmKSearchpane ul li
 411 {
 412   height: 16px;
 413   font-size: 11px;
 414   padding-left: 8px;
 415   padding-top: 2px;
 416   padding-right: 8px;
 417   white-space: nowrap;
 418 }
 419
 420 #rcmKSearchpane ul li.selected
 421 {
 422   color: #ffffff;
 423   background-color: #CC3333;
 424 }
 425