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