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