☰

QQ 邮箱简洁风

QQ 邮箱个性化样式

目前为 2021-08-14 提交的版本。查看 最新版本。

  1. @charset "UTF-8";
  2. /* ==UserStyle==
  3. @name:zh-CN     QQ 邮箱简洁风
  4. @name           FlatQQMail   
  5. @namespace      github.com/benzbrake/FlatQQMail
  6. @version        2.0.8
  7. @description:zh-CN QQ 邮箱个性化样式
  8. @description    Persnal Style For QQMail
  9. @author         Ryan
  10. @homepageURL    https://gf.qytechs.cn/scripts/408049
  11. @supportURL     https://gf.qytechs.cn/zh-CN/scripts/408049-flatqqmail/feedback
  12. @var text login-background "Login Page Background" url(https://area.sinaapp.com/bingImg?daysAgo=2)
  13. @var text left-panel-width "Left Sidebar Width" 190px
  14. ==/UserStyle== */
  15. @namespace url(http://www.w3.org/1999/xhtml);
  16. @-moz-document domain("mail.qq.com") {
  17.   html {
  18.     --main-color: #0078d4;
  19.     --main-text-color: #fff;
  20.     --navbar-height: 60px;
  21.     --search-background: rgba(255, 255, 255, .7);
  22.     --search-hover-background: #fff;
  23.     --search-border-color: #c7e0f4;
  24.     --left-panel-background: #f3f2f1;
  25.     --left-panel-hover: #edebe9;
  26.     --left-panel-active: #c7e0f4;
  27.     --left-panel-active-text-color: #005a9e;
  28.     --left-panel-text-color: #323130;
  29.     --left-panel-border-color: #edebe9;
  30.     --toolbar-background: #f3f2f1;
  31.     --toolbar-height: 44px;
  32.     --toolbar-border-color: #edebe9;
  33.     --panel-background-color: #C7E0F4;
  34.     --panel-border-color: #edebe9;
  35.     --panel-text-color: #323130;
  36.     --panel-white-background-color: #fff;
  37.     --panel-white-border-color: #d0d0d0;
  38.     --panel-gray-background-color: #faf9f8;
  39.     --btn-background: #f3f2f1;
  40.     --btn-hover-background: #edebe9;
  41.     --btn-text-color: #004578;
  42.     --btn-border-color: #edebe9;
  43.     --btn-primary-background: #0078d4;
  44.     --btn-primary-text-color: #fff;
  45.     --btn-primary-hover-background: #005a9e;
  46.     --btn-secondary-background: #eff6fc;
  47.     --btn-secondary-hover-background: #deecf9;
  48.     --btn-secondary-text-color: #005a9e;
  49.     --link-color: #2672ec;
  50.     --icon-search: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAv0lEQVQ4jc2SwQ2DMAxFGYEROEb6z1JG6AgdgREYgQ0YoSMwQkbICIzACPTi9IAIoKqH+hTF/vb3/26av4sYYwuMQAZWYJY03AJL6h2UzWyS1JvZBGxADiF0VXAIoQNWM5tijO0BqwykagOfuOzBuwGbpP6wQaF9seICjNXklVgu6KuWTHcYVGvcurWmtKTB3XicUcxAlhR34I+9ZwyL0qn47u9yUNlduD4qM3v6SjMwFkb+V7fyThStvm7w83gDIMhQYknIEDsAAAAASUVORK5CYII=);
  51.     --icon-wireless: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAtUlEQVQ4jd2SYQ3FIAyEkYCESZgEJCBhEiYBB0hAwiRMwiRMAhK+/XjH0nRvAt5rQtJej2tzEML/BLC84LOrI5AfJKB7EZGbwxKfmC24A7vyavAGbEasKN+A0wp0IOugKSMfApNqy4tjfUQowKFph/BTmyRt2tQHSF6g6mLSml29rkubE8jBFIs3SOTRG0Znw5u+mViA+GJiNSYe1sTbIPdklec/uI32f2Edk61wcKFNVo//cFxsZm+SzPAjvgAAAABJRU5ErkJggg==);
  52.     --icon-star: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA80lEQVQ4jbWSwW2FMBBEpwRKoARKSAkpgRJ8wbtHOnAJlEAJlLASHp8pwSWQAyR8fj5OgpS92NJq386MDfxr6dzC090b7lIDYYZyRZeaG9s5QGMPYYCk8Y/DVm/brYazCsoVanVZrqeDMEA5QblAY38AYw9hhqQRGnvo3J6BygXKCcIAT/fSs5/f4el2mEGYj+a2eflVWF1qoFwgDOeGMECYi5DL4cPKAKFdAj5tFjecvD3VTwqhc3tS4Kx6Alj5Z3o6KAc4q76CVa7b3ertfHje7xLTuIeUoZzQpWYPbthBVv6VGt+gHF763PIJ0Lm9BtyoD2Y3oxhUL8HuAAAAAElFTkSuQmCC);
  53.     --icon-unstar: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAvElEQVQ4jbWSwQ2DMBAEtwRKSAmUkBIoISX4g++edEAJlEAJLsESrN+UQAnJA4JCgsEgZaX92No5++6Av8n4DEoHpYPx2XmA9hWUz9nN+erCcQEIR6i/pYfX1d+Qeu+5dygdhH5VedsDJLSwXfEB4HAQ2vYiCe0FwFdjp5GlhYV+e7QpkGgYAGxXHAIsTXwalub4C30VB6Q0U0K7A6BfbZ+whrD+6UFU2j3mRXIoQ76clyGHspnuukcccEEvoT4gV5LOlygAAAAASUVORK5CYII=);
  54.     --icon-edit: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAv0lEQVRIie2UYQ3DIBBGK6ESKgEJSJgUJOBgEpAwCZNQCUhAwtsfyAgpHLsmy5LuS/jV63t3XNNl+ecbAQywA14qtIADvHBM9c4GRN7pS5rCXu5N5x4I1fM0EgCEyWupOy+SBNwkQX/EY3iJq69OLQDWvNA6EdikxkTBKbgkmIEDq0qQ4Y8GvjdwJ+7vSDADl6aXBCJcLcjdi/AzAlvBn6MlagUmS8Zfh1bwSX5KEJF/1+0Js4JSqEkCrGb6i+cFOBKaSL4ZmCkAAAAASUVORK5CYII=);
  55.     --icon-receive: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAi0lEQVRIie3UXQ2AIBSGYSMQgQhGMAJRjGAjIxjBCEYgwuuFsjkm7Bx+7nhvle/Z1DlNI2nATr4TMDWApHIkLCSumXdc2qECShA1IG0AA6gDAKuX5eMzcHUBgAXw2fOlAODCeHMAWL/jcS2ALTWeBCRF51xyNLqx+E/J85LVT0AVz2fquwEvYrsCf92tlzD9U+HLQgAAAABJRU5ErkJggg==);
  56.     --icon-contacts: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABOElEQVRIid2UsW2GMBCF/xE8AiN4BEZgBIoM4AkiNmAERmAEyr9kgBQoSpGSOtWXIs/KCWyC/9AklpB83Pm9e3dn327/fgEOaICgr7oSvAZW9itcBQ4wA15KamDU//a3BJOydwe+SvYu5ifwSll2GX8jfyM7xP1ZgtoCJPzOJgB0uWRyBP6ozkZhK3ssVRAzHDL+sCnRUjy+wCCQevPfq8GTIZuKwI2KOSoRUCfwVX16Bt4fmaI48wF4MRfsQ4C9/E/AXb7xLLg3maP6LsAb8Kp9XKvpQ69zeTV8zXcsQTgKVmxMpDUkaSWm5kUTwffT4WUvyZFVA3dTc4LASfEgu02qUCZzCbg52wOr9j7ut0ELmYt1gqCV+ioqSgUB9A8SxMfP9sFtgy4jyAX1pQ02Z53Ol93oP7E+AVmOV2PqRK2HAAAAAElFTkSuQmCC);
  57.     --icon-profile: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA8ElEQVQ4ja1SwQ3DIAy8ETJCR+gIGSEjdAQ+BT+7QUfICBkhIyDB8c4IHYE+aNJQHKmVaskSNvh82Af81YzvILGHDYPqEnsY3+nF13SGcIFwhkuT6sIZwgxL0wIIZ/1CY8kM8ad30vEOYYbj/Q3oT4UNH1UeQGETLp8MalSXJki8QWJfqO8KhKMOUMcLrulczvEG4XgMULpk2DBUjxx9mT6X5u5LgMc2+Z++YMMAR7/tvKw4b3EDsK6m6p6mWkScN4YNgKWp1iixV4V0yKAklzapmPFdmc1eSGtXYX5JdlTdpUkVVmU2DJBwOfRVG/+yJ+El7HPQij/5AAAAAElFTkSuQmCC);
  58.     --icon-read: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAyElEQVQ4jcWSQbHDMAxEDaEQCiEQCiEQCqEQetPs08EQPoRAKARDKIRAcC/K1PObuL5VMzpJet6VnFIncs6nXr0bwBVYgQpchwfN7AIUYHX3LOkekAJMXbnunuPVR9sMTMACVHfPH9Yauauk2xdbT6BKmtvCH1BGlxYKl/+AZbOxB9pqbf8HwMzOIfG5s4MSNqdDwPZSSKyS5rjKChQzO3cVtJLjIjWGl9bWECCllCTd9nYyDDiKI0CRNI9kfKo3oPE7nNtJfx8v4dADOEfYAroAAAAASUVORK5CYII=);
  59.     --icon-unread: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAuUlEQVQ4jd2SvRGDMAyFNYJHyAiMwAgp8aPxCGzCCBmBHiJ7BEbwCC4goiRNSCD8hbukybtToyd9eoWI/kPCKITRH6mOcRkDemH4tkS0d6wtEQnDC6OfAG5XfRZGaKok3ltuGWYGICJqqiQeYO/LjwN+8BYB04g6e/k6E4Yfp1sFEBEFZ5RY1MJpLpzmYlF3LjmNZzYBz77VTqx2wRk18z4BbOn7gKWYawrOqCnAanf0E4VRHE39G90BhIreKURRbZ0AAAAASUVORK5CYII=);
  60.     --icon-open: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAjUlEQVQ4jc2Syw2AIBBEpyRLoARLsAQvwh7phBIsgR5gqcMS9IAaMYJwY5I5AHmPTwD6CXkNxRuI96QAQGw+55NE2IDclDTKRRyzzQuI9xv4iuT5hG274Ia9hnRjm+AJA8ASBqiw1gnecDFvQQ6uukJp5yoBeZE9dvMjtgnYQLqxWPI6IzgX/nr92G5yAGUcu9jyutmAAAAAAElFTkSuQmCC);
  61.     --icon-remark: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA20lEQVQ4jc2RwW2EMBBFXwmU4BK2hC2BEijBl2XmSAdbgkugBEoYyYzPlEAJycEskSICUSJFmaOl/8bzPvy/idag84D6hLihviBlRPx5HX6UG+oL6hM631ELqAX63KKeEF/R+X4cVguoL/S5PV0gvvIotwOAJ3QeLn+puUPKeARYUAsA9B7rCblDc7dtrg6iNYiv54DqYNhkJvrc7lvVwleAhObuFyds5DPIq6VDiUC9299QT/tbtGZ3cNXSB8inKvDV/eYkWnMdBhB/Ir4iZfx+6DNAPf0s/NfzDiRljNr0+6LkAAAAAElFTkSuQmCC);
  62.     --icon-archive: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAnUlEQVQ4jWNgoBooOC/AUHG5gaHiynyCuOC8AKYBEM33GcqvrsePr7xnKL/Sj2lA+ZXz2CUw1PUzlF95jypYetWAoeLKf4aKyw7EefXKf4aK8wrozv9PlP8h+D+qayGCRPgfORyurkc1AEWAAMBQjywA8QpuTNiASwl4MUEDKPYCWQaUX+kn6HdMPB9hQOlVA4J+R8elVw2IdjFNAQA/HvRDaCX5CQAAAABJRU5ErkJggg==);
  63.     --icon-print: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAqklEQVQ4ja2Syw2EMAxEpwRKoARK2BIohUtid0EJlJASKCFS1j5TAiVkL/shLCRBwtI7+mWiMXD7DL7549IyyQqWeMBUFrBvwRLfkgUsy044VwrUwWgHox1s6NMkvq1LQOITPgKjXY3Ag5+PBFJXL8iRFQAAyQhSd8pprTb02cUtNvRHL69gmcEyFb/BEtMkg2++PZOMmWM6qfMnuMD+HrZdlyB1mRoruHNe5u4hWjZlUXgAAAAASUVORK5CYII=);
  64.     --icon-more: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAR0lEQVQ4jWNgGAWDEZRfOc9QcdkBQ7zisgND+ZXzDAXnBQgZ0M9QceU/iiEQze8Zyq/0E+sKhCEka0Y3hCzNyIaQrXkUEA0ARk4rJRXvtL4AAAAASUVORK5CYII=);
  65.     --icon-less: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAS0lEQVQ4jWNgGAU0BqVXDRhKrxqQr7n8ynuG8ivvSTcEprniyn6Giiv7STMEWXPBeQEGBgYG0gyB2QrTjC5OEBScF8DQjCw3CqgPABPcMBAhyIGPAAAAAElFTkSuQmCC);
  66.     --icon-ok: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAxklEQVQ4jbWTQQ3DMAxFP4RCKIRCKIRCGARf6uRYBoMwCIVQCJES51wIgbDdtqZxs2jSLPkUvW9/2wH+EuQ6zHEAC8GGBTaMINe1wTaMMOJg5VmkkXsdZiEYSSr8EXEXlV3/Fa52YuXRBL/T9WeBvVIxgf2UFWE/nQWO0A4rWw77W24xLLnA8dFIArkOJq5gIcxxKOfjb+cONnXaKqxZYCF1Zfpsdv2wrg6oyDDWbuFaxEgCC+lwaWfLrJi4lrtvieZP9GO8ALgCKoREiWXrAAAAAElFTkSuQmCC);
  67.   }
  68.  
  69.   body {
  70.     padding: 0;
  71.   }
  72.  
  73.   /** Set Font Size */
  74.   body,
  75. td,
  76. input,
  77. button,
  78. select,
  79. .f_size {
  80.     font-size: 14px;
  81.   }
  82.  
  83.   /** Remove border radius */
  84.   * {
  85.     border-radius: 0 !important;
  86.   }
  87.  
  88.   a,
  89. a:link {
  90.     outline: 0;
  91.     color: var(--link-color);
  92.     text-decoration: none;
  93.     transition: all 0.156s linear;
  94.   }
  95.  
  96.   img[src^="/cgi-bin/readtemplate"] {
  97.     display: none;
  98.   }
  99.  
  100.   /** Error Message */
  101.   .errmsg {
  102.     background: var(--panel-background-color);
  103.     color: var(--panel-text-color);
  104.   }
  105.  
  106.   /** Button */
  107.   /** Reset Gray Button Style */
  108.   .btn_gray,
  109. .qui_btn {
  110.     color: var(--btn-text-color) !important;
  111.     background: var(--btn-background) !important;
  112.     border-color: transparent !important;
  113.     border-radius: 2px !important;
  114.     transition: all 0.156s linear !important;
  115.     padding: 4px !important;
  116.     cursor: pointer !important;
  117.   }
  118.  
  119.   .currpage a.btn_gray {
  120.     color: var(--btn-text-color) !important;
  121.     font-weight: bold;
  122.   }
  123.  
  124.   .left .btn_gray {
  125.     padding: 4px 15px 4px 5px !important;
  126.   }
  127.  
  128.   /** Reset Gray Button hover/active/focus Style */
  129.   .btn_gray:hover,
  130. .btn_gray:active,
  131. .btn_gray:focus,
  132. .qui_btn:hover,
  133. .qui_btn:active,
  134. .qui_btn:focus {
  135.     background: var(--btn-hover-background);
  136.     border-color: var(--btn-border-color);
  137.     box-shadow: unset;
  138.   }
  139.  
  140.   /** Reset Primary Button Style */
  141.   .btn_primary,
  142. .qui_btn_Blue,
  143. .btn_blue {
  144.     background: var(--btn-primary-background) !important;
  145.     color: var(--btn-primary-text-color) !important;
  146.     cursor: pointer;
  147.     border-color: transparent;
  148.     padding: 4px !important;
  149.     border-radius: 2px;
  150.     transition: all 0.156s linear;
  151.   }
  152.  
  153.   .btn_primary:hover,
  154. .btn_primary:active,
  155. .btn_primary:focus,
  156. .qui_btn_Blue:hover,
  157. .qui_btn_Blue:active,
  158. .qui_btn_Blue:focus,
  159. .btn_blue:hover,
  160. .btn_blue:active,
  161. .btn_blue:focus {
  162.     background: var(--btn-primary-hover-background) !important;
  163.   }
  164.  
  165.   #composeExitAlert_QMDialog_btn_not_exit:hover {
  166.     border-color: red;
  167.     background-color: red;
  168.     color: white !important;
  169.   }
  170.  
  171.   #composeExitAlert_QMDialog_btn_exit_save:hover {
  172.     border-color: var(--btn-primary-background);
  173.     background: var(--btn-primary-background);
  174.     color: var(--btn-primary-text-color) !important;
  175.   }
  176.  
  177.   input.txt,
  178. input.txt2,
  179. textarea.txt,
  180. .txt,
  181. .qm_txt {
  182.     border: 1px solid var(--panel-white-border-color);
  183.   }
  184.  
  185.   .dialog_operate {
  186.     background: var(--panel-white-background-color);
  187.   }
  188.  
  189.   /* Popup */
  190.   .qmpanel_shadow {
  191.     box-shadow: 0 0.5rem 4rem rgba(0, 0, 0, 0.11), 0 10px 20px rgba(0, 0, 0, 0.05), 0 2px 3px rgba(0, 0, 0, 0.06);
  192.   }
  193.  
  194.   .menu_item_high {
  195.     background: var(--main-color);
  196.     color: var(--main-text-color);
  197.   }
  198.  
  199.   /** Navbar */
  200.   #topDataTd {
  201.     background: var(--main-color);
  202.     color: var(--main-text-color);
  203.     height: var(--navbar-height);
  204.   }
  205.   #topDataTd a,
  206. #topDataTd a:link,
  207. #topDataTd .addrtitle {
  208.     color: var(--main-text-color);
  209.   }
  210.   #topDataTd a.imglogo {
  211.     /** Mail Logo */
  212.     display: flex;
  213.     align-items: center;
  214.     width: 135px !important;
  215.   }
  216.   #topDataTd a.imglogo img {
  217.     /** Mail Logo Image */
  218.     background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MEJFODBCNEZDQkQ0MTFFNEE1RTZCQ0U1NDAxRUI5RUIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MEJFODBCNTBDQkQ0MTFFNEE1RTZCQ0U1NDAxRUI5RUIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowQkU4MEI0RENCRDQxMUU0QTVFNkJDRTU0MDFFQjlFQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowQkU4MEI0RUNCRDQxMUU0QTVFNkJDRTU0MDFFQjlFQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgR8ts0AAACOSURBVHja7NjBCQIxEAXQjHiNdmIDNmUDnmxgm9oGtpPdFDDi0ZtgDm58cwkEEngMfyCJzCwj1KEMUiAgICAgICAgICAgu6tjj0u21t5eZ+f7Eq91fVw+2j/VGjoC8qMVPT4f4jZ/dT6nq4507YipJewyYmqZWsIOMlJGdAQEBAQEBAQEBAQE5J8hTwEGAJxNPE8HR8BNAAAAAElFTkSuQmCC);
  219.     background-repeat: no-repeat;
  220.     background-position: center;
  221.     width: 30px;
  222.     height: 30px;
  223.     margin-left: 10px;
  224.   }
  225.   #topDataTd a.imglogo:after {
  226.     /** Mail Logo Text */
  227.     content: "QQMail";
  228.     color: var(--main-text-color);
  229.     font-size: 20px;
  230.     margin-left: 10px;
  231.   }
  232.   #topDataTd #logotips {
  233.     /** Logo Wrapper */
  234.     flex: 1;
  235.     display: flex;
  236.     width: calc(100% - 380px);
  237.     /** Clear Z-index */
  238.     z-index: unset;
  239.   }
  240.   #topDataTd #logotips .switch {
  241.     color: #fff;
  242.     margin: 5px 0 5px auto;
  243.     /** Tips Icon */
  244.   }
  245.   #topDataTd #logotips .switch .left {
  246.     color: #fff;
  247.     margin-top: 5px !important;
  248.   }
  249.   #topDataTd #logotips .switch span.addrtitle {
  250.     color: var(--main-text-color);
  251.     margin-top: 4px;
  252.     display: block;
  253.   }
  254.   #topDataTd #logotips .switch .icon_securityCenterTip {
  255.     position: relative;
  256.     background: orange;
  257.     border-radius: 50% !important;
  258.   }
  259.   #topDataTd #logotips .switch .icon_securityCenterTip::before {
  260.     content: "";
  261.     width: 4px;
  262.     height: 4px;
  263.     background: #fff;
  264.     display: block;
  265.     border-radius: 50%;
  266.     left: 4px;
  267.     position: absolute;
  268.     top: 2px;
  269.   }
  270.   #topDataTd #logotips .switch .icon_securityCenterTip::after {
  271.     content: "";
  272.     display: block;
  273.     height: 5px;
  274.     background: #fff;
  275.     width: 2px;
  276.     position: absolute;
  277.     left: 5px;
  278.     bottom: 2px;
  279.   }
  280.   #topDataTd .topdata {
  281.     /** Navbar Wrapper */
  282.     width: 100%;
  283.     height: var(--navbar-height);
  284.     display: flex;
  285.     flex-direction: row-reverse;
  286.     background: unset !important;
  287.   }
  288.   #topDataTd .topdata .topbg {
  289.     /** Search Wrapper */
  290.     background: transparent;
  291.     width: 425px;
  292.     height: var(--navbar-height) !important;
  293.     float: none;
  294.     position: relative;
  295.   }
  296.   #topDataTd .topdata .topbg .search_subject {
  297.     position: absolute;
  298.     margin: 10px;
  299.     height: 40px;
  300.     right: 0;
  301.     top: 0;
  302.     width: 170px;
  303.     display: flex;
  304.     align-items: center;
  305.   }
  306.   #topDataTd .topdata .topbg .search_subject .smartsearch {
  307.     margin: 0;
  308.     height: 30px;
  309.     line-height: 30px;
  310.     background: var(--search-background);
  311.     border-color: var(--search-border-color);
  312.     border-radius: 3px !important;
  313.     box-shadow: unset;
  314.     padding: 0;
  315.     /** Search Icon */
  316.   }
  317.   #topDataTd .topdata .topbg .search_subject .smartsearch #subject {
  318.     background: transparent;
  319.     padding: 0 21px;
  320.     height: 30px;
  321.     width: 120px !important;
  322.     transition: background 0.156s;
  323.     line-height: 30px;
  324.     border: 0;
  325.   }
  326.   #topDataTd .topdata .topbg .search_subject .smartsearch #subject:focus {
  327.     background: var(--search-hover-background);
  328.   }
  329.   #topDataTd .topdata .topbg .search_subject .smartsearch #searchIcon,
  330. #topDataTd .topdata .topbg .search_subject .smartsearch #subjectsearchLogo {
  331.     top: 8px;
  332.   }
  333.   #topDataTd .topdata .topbg .search_subject .smartsearch #searchIcon {
  334.     background: var(--icon-search);
  335.   }
  336.   #topDataTd .topdata .topbg .setinfo {
  337.     position: absolute;
  338.     bottom: 10px;
  339.     margin: unset;
  340.     left: 0;
  341.     z-index: 9;
  342.   }
  343.   #topDataTd .topdata .topbg .setinfo #sendToMobileIcon {
  344.     width: 16px;
  345.     height: 16px;
  346.     background-position: unset;
  347.     background: var(--icon-wireless) !important;
  348.   }
  349.   #topDataTd #setAliasTiprlt .newtips .arrowup {
  350.     background: transparent;
  351.     width: 0;
  352.     border-left: 5px solid transparent;
  353.     border-right: 5px solid transparent;
  354.     border-bottom: 9px solid var(--panel-border-color);
  355.     height: 0;
  356.     margin-bottom: 0;
  357.     top: -2px;
  358.   }
  359.   #topDataTd #setAliasTiprlt .newtips .contentcontainer,
  360. #topDataTd #setAliasTiprlt .newtips .content {
  361.     background: var(--panel-background-color);
  362.   }
  363.  
  364.   .bodybgbt {
  365.     position: static;
  366.     left: 0;
  367.     top: 0;
  368.     width: var(--left-panel-width);
  369.   }
  370.  
  371.   #leftPanel {
  372.     position: static;
  373.     left: 0;
  374.     top: 0;
  375.     width: var(--left-panel-width);
  376.     /** Move Leftpanel Compose Div to Navbar and Compact */
  377.     /** Compact #navMidBar */
  378.   }
  379.   #leftPanel #navBarDiv {
  380.     max-width: 500px;
  381.     position: absolute;
  382.     top: 0;
  383.     left: 150px;
  384.     height: 60px;
  385.     background: unset;
  386.   }
  387.   #leftPanel #navBarDiv .navbar {
  388.     display: flex;
  389.     background: transparent;
  390.     height: 60px;
  391.     width: auto;
  392.   }
  393.   #leftPanel #navBarDiv .navbar li {
  394.     color: var(--main-text-color);
  395.     height: 100% !important;
  396.     margin: 0;
  397.     padding: 0;
  398.     display: block;
  399.     position: relative;
  400.   }
  401.   #leftPanel #navBarDiv .navbar li input {
  402.     margin: 0;
  403.     padding: 0;
  404.     height: 24px;
  405.     width: 24px;
  406.     position: absolute;
  407.     float: none;
  408.     left: 15px;
  409.     top: 17px;
  410.     z-index: -1;
  411.   }
  412.   #leftPanel #navBarDiv .navbar li input.composebtn {
  413.     background: var(--icon-edit);
  414.   }
  415.   #leftPanel #navBarDiv .navbar li input.checkbtn {
  416.     background: var(--icon-receive);
  417.   }
  418.   #leftPanel #navBarDiv .navbar li input.addrbtn {
  419.     background: var(--icon-contacts);
  420.   }
  421.   #leftPanel #navBarDiv .navbar li a {
  422.     margin: 0;
  423.     padding: 0 10px 0 40px;
  424.     color: var(--header-text-color);
  425.     height: 60px !important;
  426.     line-height: 60px;
  427.     transition: background 0.156s;
  428.   }
  429.   #leftPanel #navBarDiv .navbar li a:hover,
  430. #leftPanel #navBarDiv .navbar li a:focus {
  431.     background: rgba(0, 0, 0, 0.3);
  432.   }
  433.   #leftPanel #navMidBar {
  434.     width: var(--left-panel-width);
  435.     top: 60px;
  436.     bottom: 0;
  437.     margin: 0 !important;
  438.     background: var(--left-panel-background);
  439.     box-sizing: border-box;
  440.     border-right: 2px solid var(--left-panel-border-color);
  441.   }
  442.   #leftPanel #navMidBar .folderDiv {
  443.     margin: 10px 0;
  444.   }
  445.   #leftPanel #navMidBar .folderDiv #OutFolder li {
  446.     padding: 0;
  447.     margin: 0;
  448.     height: auto;
  449.     position: relative;
  450.     transition: all 0.156s linear;
  451.   }
  452.   #leftPanel #navMidBar .folderDiv #OutFolder li a {
  453.     padding: 5px;
  454.     padding-left: 28px;
  455.     line-height: 22px;
  456.     display: block;
  457.   }
  458.   #leftPanel #navMidBar .folderDiv #OutFolder li a:link,
  459. #leftPanel #navMidBar .folderDiv #OutFolder li a:visited {
  460.     color: var(--left-panel-text-color);
  461.   }
  462.   #leftPanel #navMidBar .folderDiv #OutFolder li a:hover {
  463.     background-color: transparent;
  464.   }
  465.   #leftPanel #navMidBar .folderDiv #OutFolder li .empty_link {
  466.     color: var(--btn-primary-text-color) !important;
  467.     background: var(--btn-primary-background);
  468.     border-radius: 2px;
  469.     transition: background-color 0.156s ease;
  470.     margin: 0;
  471.     padding: 4px 8px;
  472.     position: absolute;
  473.     right: 10px;
  474.     top: 0;
  475.   }
  476.   #leftPanel #navMidBar .folderDiv #OutFolder li .empty_link:hover {
  477.     background: var(--btn-primary-hover-background);
  478.   }
  479.   #leftPanel #navMidBar .folderDiv #OutFolder li:hover {
  480.     background: var(--left-panel-hover);
  481.   }
  482.   #leftPanel #navMidBar .folderDiv #OutFolder li.fn,
  483. #leftPanel #navMidBar .folderDiv #OutFolder .fn_list {
  484.     background: var(--left-panel-active) !important;
  485.   }
  486.   #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep {
  487.     display: flex;
  488.     flex-direction: column;
  489.   }
  490.   #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep span {
  491.     margin: 0;
  492.     padding: 0;
  493.   }
  494.   #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a {
  495.     transition: all 0.156s linear;
  496.   }
  497.   #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a:hover,
  498. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a:active,
  499. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a:focus {
  500.     background: var(--left-panel-hover);
  501.   }
  502.   #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep:hover,
  503. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep:active,
  504. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep:focus {
  505.     background: transparent;
  506.   }
  507.   #leftPanel #navMidBar .folderDiv #OutFolder .nolinkbg {
  508.     /** Hide | */
  509.     display: none !important;
  510.   }
  511.   #leftPanel #navMidBar .folderDiv #OutFolder .icon_folderlist_star {
  512.     background: var(--icon-unstar);
  513.     width: 16px;
  514.     height: 16px;
  515.     margin: 2px;
  516.   }
  517.   #leftPanel #navBottomTd {
  518.     display: none;
  519.   }
  520.  
  521.   #sepLineTd {
  522.     display: none;
  523.   }
  524.  
  525.   .pInfoItem .itemHead {
  526.     white-space: nowrap;
  527.   }
  528.  
  529.   /** Main Frame*/
  530.   #mainFrameContainer {
  531.     top: 60px;
  532.     left: 190px;
  533.   }
  534.  
  535.   .tbody {
  536.     padding: 0;
  537.     margin: 0;
  538.   }
  539.  
  540.   /* Title */
  541.   .txt_title {
  542.     margin: 0 !important;
  543.     padding: 10px;
  544.   }
  545.  
  546.   /* Toolbar */
  547.   .toolheight {
  548.     position: fixed !important;
  549.     height: var(--toolbar-height) !important;
  550.   }
  551.  
  552.   .toolbgline {
  553.     background: var(--toolbar-background);
  554.     top: 0;
  555.     left: 0;
  556.     right: 0;
  557.     height: 35px;
  558.     padding: 0;
  559.     z-index: 9 !important;
  560.     border: 2px solid var(--toolbar-border-color);
  561.     border-width: 0 2px 2px 0;
  562.   }
  563.   .toolbgline .btn_sepline {
  564.     display: none;
  565.   }
  566.   .toolbgline .left {
  567.     /** filter .btn_back */
  568.     margin: 10px;
  569.   }
  570.  
  571.   .toolheight .right,
  572. .toolheight .qm_right {
  573.     padding: 13px !important;
  574.     margin: 0 !important;
  575.   }
  576.  
  577.   /* Make Bottom toolbar not fixed */
  578.   .list_btline ~ .toolbgline {
  579.     position: static !important;
  580.     padding: 0;
  581.   }
  582.  
  583.   #tips {
  584.     padding: 10px;
  585.   }
  586.  
  587.   /* Mail List */
  588.   table.O2 {
  589.     border: 0px;
  590.     padding: 10px;
  591.   }
  592.   table.O2 td {
  593.     background: transparent;
  594.     border: 0px;
  595.     background-color: unset;
  596.   }
  597.  
  598.   .talk {
  599.     margin: 0;
  600.     padding: 10px;
  601.   }
  602.  
  603.   table.M,
  604. table.F {
  605.     padding: 10px;
  606.     border: 0;
  607.     box-shadow: unset;
  608.   }
  609.  
  610.   /** Replace Icons */
  611.   .Rr {
  612.     background: var(--icon-read) 0 0 no-repeat;
  613.     vertical-align: middle !important;
  614.   }
  615.  
  616.   .Ru,
  617. .ico_unreads {
  618.     background: var(--icon-unread) 0 0 no-repeat;
  619.     vertical-align: middle !important;
  620.   }
  621.  
  622.   table.i td.fg.fs1 div {
  623.     width: 16px;
  624.     height: 16px;
  625.     background: var(--icon-unstar) 0 0 no-repeat;
  626.   }
  627.  
  628.   table.i td.fg div {
  629.     width: 16px;
  630.     height: 16px;
  631.     background: var(--icon-star) 0 0 no-repeat;
  632.   }
  633.  
  634.   input.s1bg,
  635. .ico_profileTips,
  636. .ico_profile_verified {
  637.     width: 16px;
  638.     height: 16px;
  639.     background: var(--icon-profile) 0 0 no-repeat;
  640.   }
  641.  
  642.   .qm_ico_reopen {
  643.     width: 16px;
  644.     height: 16px;
  645.     background: var(--icon-open) 0 0 no-repeat;
  646.   }
  647.  
  648.   .qm_ico_remarkoff {
  649.     width: 16px;
  650.     height: 16px;
  651.     background: var(--icon-remark) 0 0 no-repeat;
  652.   }
  653.  
  654.   .qm_ico_addFilter {
  655.     width: 16px;
  656.     height: 16px;
  657.     background: var(--icon-archive) 0 0 no-repeat;
  658.   }
  659.  
  660.   .qm_ico_print {
  661.     width: 16px;
  662.     height: 16px;
  663.     background: var(--icon-print) 0 0 no-repeat;
  664.   }
  665.  
  666.   .qm_ico_quickdown {
  667.     background: var(--icon-more) 0 0 no-repeat;
  668.   }
  669.  
  670.   .qm_ico_quickup {
  671.     background: var(--icon-less) 0 0 no-repeat;
  672.   }
  673.  
  674.   .mailList_sendIcon_Succeed {
  675.     width: 16px;
  676.     height: 16px;
  677.     background: var(--icon-ok) 0 0 no-repeat;
  678.   }
  679.  
  680.   .selbar_bt {
  681.     padding: 10px !important;
  682.     background: var(--panel-white-background-color);
  683.   }
  684.   .selbar_bt a {
  685.     padding: 5px;
  686.     transition: all 0.156s linear;
  687.     color: var(--btn-text-color);
  688.     background-color: var(--btn-background);
  689.   }
  690.   .selbar_bt a:hover,
  691. .selbar_bt a:focus,
  692. .selbar_bt a:active {
  693.     background-color: var(--btn-hover-background);
  694.   }
  695.  
  696.   #qqmail_mailcontainer {
  697.     margin-top: var(--toolbar-height);
  698.     position: relative;
  699.   }
  700.   #qqmail_mailcontainer .txt_title {
  701.     display: none;
  702.   }
  703.   #qqmail_mailcontainer .settingtable {
  704.     border-color: var(--toolbar-border-color);
  705.     background: var(--toolbar-background);
  706.   }
  707.   #qqmail_mailcontainer .mail_list_thumb_form {
  708.     background: var(--panel-white-background-color);
  709.   }
  710.   #qqmail_mailcontainer .qm_con_fold,
  711. #qqmail_mailcontainer .qm_con_expand {
  712.     margin: 0;
  713.   }
  714.   #qqmail_mailcontainer .toarea {
  715.     margin: 0;
  716.     padding: 0;
  717.   }
  718.   #qqmail_mailcontainer #tips_bar ~ div:first-child {
  719.     display: none;
  720.   }
  721.  
  722.   body[module=qmReadMail] {
  723.     margin: 0 !important;
  724.     padding: 0 !important;
  725.     overflow-x: hidden;
  726.   }
  727.   body[module=qmReadMail] #qqmail_mailcontainer {
  728.     margin-top: 0;
  729.     background: var(--panel-gray-background-color);
  730.   }
  731.   body[module=qmReadMail] #qqmail_mailcontainer > div {
  732.     /* Clear z-index */
  733.     z-index: unset !important;
  734.   }
  735.   body[module=qmReadMail] #qqmail_mailcontainer #mainmail {
  736.     margin-bottom: 0 !important;
  737.     padding-bottom: 10px;
  738.   }
  739.   body[module=qmReadMail] #qqmail_mailcontainer #mainmail #nextmail_top {
  740.     margin: 15px;
  741.   }
  742.   body[module=qmReadMail] #qqmail_mailcontainer .toolbgline .left {
  743.     margin: 10px 5px;
  744.     padding: 0 12px;
  745.   }
  746.   body[module=qmReadMail] #qqmail_mailcontainer .settingtable {
  747.     background: var(--panel-white-background-color);
  748.     border: 0px;
  749.     padding-left: 4px !important;
  750.     padding: 4px !important;
  751.   }
  752.   body[module=qmReadMail] #qqmail_mailcontainer .settingtable.txt_left span {
  753.     height: 20px !important;
  754.     line-height: 20px !important;
  755.   }
  756.   body[module=qmReadMail] #qqmail_mailcontainer .settingtable.txt_right > span {
  757.     vertical-align: 3px !important;
  758.   }
  759.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo {
  760.     background: var(--panel-white-background-color);
  761.     border: 1px solid var(--panel-white-border-color);
  762.     border-bottom: 0;
  763.     margin: 104px 10px 0;
  764.     padding: 10px;
  765.   }
  766.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo > table {
  767.     margin-left: 50px;
  768.   }
  769.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo .readmail_subject {
  770.     /** Mail Subject */
  771.     position: absolute;
  772.     top: -59px;
  773.     left: 0px;
  774.     width: 100%;
  775.     height: 24px;
  776.     line-height: 24px;
  777.     background: var(--panel-gray-background-color);
  778.     padding: 17px 12px !important;
  779.     margin-left: -11px;
  780.   }
  781.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo .readmail_subject #subject {
  782.     font-size: 17px;
  783.   }
  784.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo > #subjectTip ~ table {
  785.     height: auto !important;
  786.   }
  787.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo #senderInfo2 {
  788.     /** User Avatar */
  789.     position: absolute;
  790.     left: 11px;
  791.     top: 13px;
  792.     padding: 0 !important;
  793.     width: 45px;
  794.     height: 45px;
  795.     overflow: hidden;
  796.   }
  797.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo #senderInfo2 > div {
  798.     width: 42px !important;
  799.     height: 42px !important;
  800.   }
  801.   body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo #senderInfo2 > div #qqiconimg {
  802.     margin: 0 !important;
  803.   }
  804.   body[module=qmReadMail] #qqmail_mailcontainer #contentDiv {
  805.     /** Mail Content */
  806.     background: var(--panel-white-background-color);
  807.     border: 1px solid var(--panel-white-border-color);
  808.     border-top: 0;
  809.     padding: 10px !important;
  810.     margin: 0 10px;
  811.     overflow: hidden;
  812.     /** Fix attachmet style */
  813.   }
  814.   body[module=qmReadMail] #qqmail_mailcontainer #attachment {
  815.     /** Mail Attachment */
  816.     margin: 10px 10px 0;
  817.   }
  818.   body[module=qmReadMail] #qqmail_mailcontainer #pageEnd {
  819.     margin: 10px;
  820.     background: var(--panel-white-background-color);
  821.     border: 1px solid var(--panel-white-border-color);
  822.   }
  823.  
  824.   body.netdisk_multi {
  825.     padding: 0 !important;
  826.   }
  827.   body.netdisk_multi .readmailinfo {
  828.     background: var(--panel-gray-background-color);
  829.     width: 100%;
  830.     overflow: hidden;
  831.     padding-right: 10px;
  832.   }
  833.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child {
  834.     margin: 0 10px;
  835.     display: block;
  836.     border: 1px solid transparent;
  837.     box-sizing: border-box;
  838.     border-bottom-color: var(--panel-white-border-color);
  839.   }
  840.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child > td.settingtable {
  841.     width: 100%;
  842.     height: 24px;
  843.     line-height: 24px;
  844.     background: var(--panel-gray-background-color) !important;
  845.     padding: 17px 0px !important;
  846.   }
  847.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child > td.settingtable > .qm_left {
  848.     padding-bottom: 0 !important;
  849.     line-height: 17px;
  850.   }
  851.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child > td.settingtable > .qm_left .sub_title {
  852.     font-size: 17px !important;
  853.   }
  854.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) {
  855.     display: block;
  856.     background: var(--panel-white-background-color);
  857.     margin: 0 10px;
  858.     padding: 10px 0 0 10px;
  859.     border: 1px solid var(--panel-white-border-color) !important;
  860.     width: calc(100% - 20px);
  861.     border-width: 0 1px !important;
  862.     box-sizing: border-box;
  863.   }
  864.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) td {
  865.     margin: 0 !important;
  866.     padding: 0px !important;
  867.   }
  868.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) #attchshow {
  869.     margin: 0px;
  870.     padding-left: 0;
  871.     padding-bottom: 0;
  872.   }
  873.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) #attchshow ~ tr {
  874.     padding: 0;
  875.     margin: 0;
  876.   }
  877.   body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) #attchshow ~ tr > td {
  878.     padding-top: 10px !important;
  879.   }
  880.   body.netdisk_multi .readmailinfo:not(:first-child) {
  881.     border: 0px;
  882.     padding: 0 !important;
  883.   }
  884.   body.netdisk_multi .readmailinfo:not(:first-child) #quickreply {
  885.     margin: 0 10px;
  886.     background: var(--panel-white-background-color);
  887.     border: 1px solid var(--panel-white-border-color);
  888.     border-width: 0 1px;
  889.     padding: 0 10px;
  890.     position: relative;
  891.   }
  892.  
  893.   #frm[action="/cgi-bin/compose_send"] {
  894.     background: var(--panel-gray-background-color);
  895.   }
  896.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding {
  897.     background: var(--panel-white-background-color);
  898.     border: 2px solid var(--panel-white-border-color) !important;
  899.     margin: 10px;
  900.   }
  901.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding .div_txt {
  902.     border: 0px;
  903.     background: transparent;
  904.     padding: 0;
  905.     height: 36px;
  906.     line-height: 36px;
  907.     margin: 0;
  908.   }
  909.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding .content_title {
  910.     padding: 0 !important;
  911.     padding-left: 10px !important;
  912.   }
  913.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding .content_title #QMEditorArea {
  914.     border: 1px solid var(--panel-white-border-color);
  915.     position: absolute !important;
  916.     right: 2px;
  917.     left: -1px;
  918.     top: 0px;
  919.   }
  920.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding .content_title #QMEditorArea .qmEditorIfrmEditArea {
  921.     border: 0px;
  922.     position: absolute;
  923.     top: 0;
  924.     bottom: 0;
  925.     left: 0;
  926.     right: 0;
  927.   }
  928.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding #composeMoreOpt {
  929.     padding: 4px 0 !important;
  930.     border-left: 2px;
  931.     border-right: 2px;
  932.     display: flex;
  933.     align-items: flex-end;
  934.     height: 24px !important;
  935.   }
  936.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding #composeMoreOpt #otherComposeOptionCntr .qqshowbd {
  937.     margin: 0 !important;
  938.     padding: 0 !important;
  939.     height: 100%;
  940.     line-height: unset !important;
  941.     border: 0 !important;
  942.   }
  943.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding > .input_title {
  944.     padding-left: 79px;
  945.   }
  946.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding #AttList .attsep {
  947.     margin: 0;
  948.   }
  949.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding #Attlist + div {
  950.     position: relative;
  951.   }
  952.   #frm[action="/cgi-bin/compose_send"] #sendtimepadding .vue-schedule-btn {
  953.     display: none;
  954.   }
  955.   #frm[action="/cgi-bin/compose_send"] #rightArea {
  956.     margin: 0 !important;
  957.     border: 0;
  958.     border-bottom: 0;
  959.   }
  960.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp {
  961.     margin-left: -1px !important;
  962.     width: 15px !important;
  963.     padding-left: 5px;
  964.   }
  965.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div {
  966.     margin: 0 200px 0 0 !important;
  967.   }
  968.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div [clss=f_family] {
  969.     display: none !important;
  970.   }
  971.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div td:first-child > div a,
  972. #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div td:first-child > div span {
  973.     display: inline-block;
  974.     padding: 4px 10px !important;
  975.     background: var(--btn-secondary-background);
  976.     color: var(--btn-secondary-text-color);
  977.     margin: 0;
  978.   }
  979.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div tbody > tr > td:first-child {
  980.     padding: 5px;
  981.   }
  982.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div tbody > tr > td:first-child > div {
  983.     padding-right: 0 !important;
  984.     padding-top: 0 !important;
  985.   }
  986.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div > div:first-child:not([style*="68px"]) {
  987.     display: none !important;
  988.   }
  989.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div > div[style*="68px"] {
  990.     margin: 0 0 0 5px !important;
  991.   }
  992.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div > table.i {
  993.     border: 1px solid var(--panel-white-border-color);
  994.     margin-top: -1px !important;
  995.     margin-bottom: -1px !important;
  996.     margin-left: 0px !important;
  997.     border-left: 0;
  998.   }
  999.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div #trTO {
  1000.     margin-bottom: 0 !important;
  1001.     border-bottom: 1px solid var(--panel-white-border-color);
  1002.     border-right: 1px solid var(--panel-white-border-color);
  1003.   }
  1004.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div #trCC {
  1005.     margin-bottom: 0 !important;
  1006.     border-bottom: 1px solid var(--panel-white-border-color);
  1007.     border-right: 1px solid var(--panel-white-border-color);
  1008.   }
  1009.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div #trBCC {
  1010.     margin-bottom: 0 !important;
  1011.     border-bottom: 1px solid var(--panel-white-border-color);
  1012.     border-right: 1px solid var(--panel-white-border-color);
  1013.   }
  1014.   #frm[action="/cgi-bin/compose_send"] #rightAreaBtnWarp ~ div #trSC {
  1015.     margin-bottom: 0 !important;
  1016.     border-bottom: 1px solid var(--panel-white-border-color);
  1017.     border-right: 1px solid var(--panel-white-border-color);
  1018.   }
  1019.   #frm[action="/cgi-bin/compose_send"] #addrQzone ~ table.i tr:first-child {
  1020.     display: none;
  1021.   }
  1022.   #frm[action="/cgi-bin/compose_send"] .addr_base {
  1023.     height: 17px;
  1024.     line-height: 16px;
  1025.     padding: 5px !important;
  1026.     margin: 5px !important;
  1027.   }
  1028.  
  1029.   .addr_text {
  1030.     float: none !important;
  1031.     height: 36px;
  1032.     margin: 0;
  1033.     line-height: 36px;
  1034.   }
  1035.   .addr_text input {
  1036.     height: 36px;
  1037.     padding: 0;
  1038.     line-height: 36px;
  1039.   }
  1040.  
  1041.   #addrOper {
  1042.     padding: 5px;
  1043.     border-right: 1px solid var(--panel-white-border-color);
  1044.     height: 30px;
  1045.     display: flex;
  1046.     align-items: center;
  1047.   }
  1048.   #addrOper > .input_title {
  1049.     padding: 0 0 0 75px !important;
  1050.     margin: 0;
  1051.     display: flex;
  1052.   }
  1053.  
  1054.   #encrypt_mail_tips + div {
  1055.     position: relative;
  1056.   }
  1057.   #encrypt_mail_tips + div > table > tbody > tr > td:first-child {
  1058.     display: none;
  1059.   }
  1060.  
  1061.   .qmEditorBase {
  1062.     border: 0px;
  1063.   }
  1064.  
  1065.   .qmEditorContent {
  1066.     height: unset !important;
  1067.     position: relative;
  1068.   }
  1069.  
  1070.   .qmEditorToolBarDiv {
  1071.     border-bottom: 0px;
  1072.   }
  1073.  
  1074.   .composetab {
  1075.     background: var(--panel-white-background-color);
  1076.     height: 39px;
  1077.     width: 100%;
  1078.     display: block;
  1079.   }
  1080.   .composetab tr td {
  1081.     padding: 0 !important;
  1082.   }
  1083.   .composetab .composetab_img {
  1084.     display: none;
  1085.   }
  1086.   .composetab .composetab_unsel {
  1087.     background: var(--panel-white-background-color);
  1088.     overflow: hidden;
  1089.     height: 39px;
  1090.   }
  1091.   .composetab .composetab_unsel a {
  1092.     color: var(--panel-text-color);
  1093.     font-weight: 400;
  1094.     display: block;
  1095.     padding: 10px !important;
  1096.     margin: 0px;
  1097.     transition: all 0.2s linear 0s;
  1098.     width: auto;
  1099.   }
  1100.   .composetab .composetab_unsel a:hover {
  1101.     text-decoration: none;
  1102.     background: var(--btn-hover-background);
  1103.   }
  1104.   .composetab .composetab_sel {
  1105.     background: var(--panel-white-background-color);
  1106.     height: 39px;
  1107.     position: relative;
  1108.   }
  1109.   .composetab .composetab_sel div {
  1110.     padding: 10px !important;
  1111.     margin: 0px;
  1112.     cursor: pointer;
  1113.   }
  1114.   .composetab .composetab_sel div:hover {
  1115.     background: var(--btn-hover-background);
  1116.   }
  1117.   .composetab .composetab_sel:after {
  1118.     content: "";
  1119.     display: block;
  1120.     border-bottom: 5px solid var(--main-color);
  1121.     position: absolute;
  1122.     width: 60px;
  1123.     bottom: 2px;
  1124.     left: 25px;
  1125.     transition: all 0.156s linear 0s;
  1126.   }
  1127.   .composetab .composetab_sel:hover:after {
  1128.     width: 70px;
  1129.     left: 20px;
  1130.   }
  1131.  
  1132.   #toolbar .toolbg,
  1133. #toolbar .toolbg1 {
  1134.     background-color: var(--panel-background-color);
  1135.     padding: 10px;
  1136.     border: 2px solid var(--panel-border-color);
  1137.     border-width: 2px 0 0 0;
  1138.   }
  1139.   #toolbar .toolbg .right,
  1140. #toolbar .toolbg1 .right {
  1141.     margin: 0 !important;
  1142.   }
  1143.   #toolbar .toolbg .btn_space,
  1144. #toolbar .toolbg1 .btn_space {
  1145.     height: 22px;
  1146.     padding: 5px 10px;
  1147.     margin-right: 10px;
  1148.     cursor: pointer;
  1149.     display: inline-block;
  1150.     background-color: var(--btn-background);
  1151.   }
  1152.   #toolbar .toolbg .btn_space:hover,
  1153. #toolbar .toolbg1 .btn_space:hover {
  1154.     background-color: var(--btn-hover-background);
  1155.   }
  1156.  
  1157.   /* Group Mail */
  1158.   body#list #body_list {
  1159.     margin-top: 46px;
  1160.   }
  1161.   body#list .myleftbar .infobar {
  1162.     background: #ffffe9;
  1163.     border-width: 0 0 1px;
  1164.     border-bottom-color: #e3e6eb;
  1165.     line-height: 24px;
  1166.     padding: 10px !important;
  1167.     text-align: center;
  1168.   }
  1169.   body#list .mysidebar {
  1170.     top: 0 !important;
  1171.     height: 100%;
  1172.     background: #fff;
  1173.     padding: 8px;
  1174.     width: 172px;
  1175.   }
  1176.   body#list .mysidebar .sbar_padd {
  1177.     padding: 0 !important;
  1178.     margin: 0 !important;
  1179.   }
  1180.   body#list .mysidebar .sbar_padd .btn_gray {
  1181.     background: var(--btn-primary-background) !important;
  1182.     color: var(--btn-primary-text-color) !important;
  1183.     width: 140px !important;
  1184.     padding-top: 0.5em;
  1185.     padding-bottom: 0.5em;
  1186.   }
  1187.   body#list .mysidebar .sbar_padd .btn_gray:hover,
  1188. body#list .mysidebar .sbar_padd .btn_gray:active,
  1189. body#list .mysidebar .sbar_padd .btn_gray:focus {
  1190.     background: var(--btn-primary-hover-background) !important;
  1191.   }
  1192.   body#list .mysidebar li {
  1193.     transition: all 0.156s linear;
  1194.     width: 154px !important;
  1195.     margin: 0 0 5px !important;
  1196.     padding: 2px 2px 2px 10px !important;
  1197.   }
  1198.   body#list .mysidebar li a {
  1199.     display: block;
  1200.     padding: 3px 0;
  1201.     color: var(--left-panel-text-color) !important;
  1202.   }
  1203.   body#list .mysidebar li.fn {
  1204.     background: var(--left-panel-active) !important;
  1205.     height: auto;
  1206.     position: relative;
  1207.   }
  1208.   body#list .mysidebar li.fs {
  1209.     height: auto;
  1210.     position: relative;
  1211.   }
  1212.   body#list .mysidebar li.fs:hover {
  1213.     background-color: var(--left-panel-hover);
  1214.   }
  1215.   body#list .mysidebar li.fs:hover a {
  1216.     text-decoration: none;
  1217.     background: transparent;
  1218.   }
  1219.   body#list .mysidebar .bd {
  1220.     border-width: 0 !important;
  1221.     margin: 2px !important;
  1222.     background: #c1d9f3;
  1223.     color: #000;
  1224.     padding: 5px !important;
  1225.     text-align: center;
  1226.   }
  1227.   body#list .mysidebar #folder_group .g_list {
  1228.     display: flex;
  1229.     align-items: center;
  1230.     margin: 0 !important;
  1231.     padding: 0 !important;
  1232.   }
  1233.   body#list .mysidebar #folder_group .g_list a {
  1234.     color: var(--left-panel-text-color) !important;
  1235.     padding: 8px;
  1236.   }
  1237.   body#list .mysidebar #folder_group .g_list a.left {
  1238.     margin-right: auto;
  1239.   }
  1240.   body#list .mysidebar #folder_group .g_list a:hover {
  1241.     background-color: var(--left-panel-hover);
  1242.     text-decoration: none;
  1243.   }
  1244.   body#list .mysidebar #folder_group .g_list.toolbg a:hover {
  1245.     background-color: transparent;
  1246.     text-decoration: none;
  1247.   }
  1248.   body#list .mysidebar #folder_group .g_list.toolbg + .toolbg {
  1249.     margin: 0 !important;
  1250.   }
  1251.   body#list .mysidebar .gray {
  1252.     border-width: 0 !important;
  1253.     margin: 2px 2px 5px !important;
  1254.     background: #c1d9f3;
  1255.     color: #000;
  1256.     padding: 5px !important;
  1257.     text-align: center;
  1258.   }
  1259.   body#list .mysidebar #folder_group {
  1260.     padding: 2px;
  1261.   }
  1262.   body#list .mysidebar div[style="margin:0 8px"] {
  1263.     margin: 0 !important;
  1264.   }
  1265.   body#list .mysidebar div[style="margin:0 8px"] [id^=tab_group_].sbar_padd {
  1266.     padding: 0 !important;
  1267.     margin-bottom: 5px !important;
  1268.   }
  1269.   body#list .mysidebar div[style="margin:0 8px"] [id^=tab_group_].sbar_padd a {
  1270.     color: var(--left-panel-text-color) !important;
  1271.     padding: 4px 8px !important;
  1272.     display: block;
  1273.   }
  1274.   body#list .mysidebar div[style="margin:0 8px"] [id^=tab_group_].sbar_padd a:hover {
  1275.     background-color: var(--left-panel-hover);
  1276.     text-decoration: none;
  1277.   }
  1278.   body#list .mysidebar div[style="margin:0 8px"] [id^=tab_group_].sbar_padd.toolbg {
  1279.     margin-bottom: 0px !important;
  1280.   }
  1281.   body#list .mysidebar div[style="margin:0 8px"] [id^=tab_group_].sbar_padd.toolbg a:hover {
  1282.     background: transparent;
  1283.   }
  1284.   body#list .mysidebar div[style="margin:0 8px"] [id^=show_group_].toolbg {
  1285.     margin-bottom: 5px !important;
  1286.   }
  1287.   body#list .mysidebar .toolbg {
  1288.     margin: 0 2px !important;
  1289.     padding: 3px !important;
  1290.   }
  1291.  
  1292.   #postop0,
  1293. .toolbgline.barspace4 {
  1294.     display: none;
  1295.   }
  1296.  
  1297.   .settingTitle {
  1298.     padding-top: 0;
  1299.   }
  1300.  
  1301.   .settingtable,
  1302. .settingTitle .selected {
  1303.     background: var(--panel-white-background-color);
  1304.   }
  1305.  
  1306.   .settingSub {
  1307.     padding: 0 !important;
  1308.   }
  1309.   .settingSub a {
  1310.     color: var(--panel-text-color);
  1311.     display: block;
  1312.     padding: 10px;
  1313.   }
  1314.  
  1315.   .settingSub.selected {
  1316.     padding: 10px !important;
  1317.   }
  1318.  
  1319.   .toolbgline.h22 {
  1320.     /* Save Toolbar */
  1321.     bottom: 0;
  1322.     top: unset;
  1323.     display: flex;
  1324.     align-items: center;
  1325.     padding-left: 10px;
  1326.     border-top: 2px solid var(--toolbar-border-color);
  1327.   }
  1328.  
  1329.   body[onunload="changeStyle();"] .txt_title,
  1330. body.tbody .txt_title {
  1331.     display: none;
  1332.   }
  1333.  
  1334.   .myleftbar {
  1335.     margin-top: 46px;
  1336.   }
  1337.   .myleftbar .digest_item {
  1338.     border: 0px;
  1339.     margin: 0 !important;
  1340.     padding: 0 !important;
  1341.     background: transparent;
  1342.     transition: background 0.156s;
  1343.   }
  1344.   .myleftbar .digest_item .qqshowbd {
  1345.     border: 0px;
  1346.   }
  1347.   .myleftbar .digest_item_hover .digest_item_inner {
  1348.     border-width: 0px !important;
  1349.     background: #f3f3f3;
  1350.   }
  1351.  
  1352.   .mysidebar ul.navlist_max li .pos_img_top {
  1353.     top: 11px !important;
  1354.     position: absolute;
  1355.     right: 10px !important;
  1356.     left: unset !important;
  1357.   }
  1358.  
  1359.   body.ft_l_body .ft_l_wrapper .attach_type {
  1360.     height: 16px;
  1361.   }
  1362.   body.ft_l_body .ft_l_wrapper .composetab .innerTxt {
  1363.     cursor: pointer;
  1364.     padding: 10px 0;
  1365.   }
  1366.   body.ft_l_body .ft_l_wrapper .ft_l_listTopbar {
  1367.     padding: 10px;
  1368.     border-bottom: unset;
  1369.   }
  1370.   body.ft_l_body .ft_l_wrapper .ft_l_listItem {
  1371.     border-bottom: 0px;
  1372.   }
  1373.   body.ft_l_body .ft_l_wrapper .ft_l_listItemContent {
  1374.     padding: 10px;
  1375.   }
  1376.   body.ft_l_body .ft_l_wrapper .ft_l_listTitle {
  1377.     border-left-color: transparent;
  1378.   }
  1379.   body.ft_l_body .ft_l_wrapper a.button_gray_s,
  1380. body.ft_l_body .ft_l_wrapper a.button_gray_m,
  1381. body.ft_l_body .ft_l_wrapper a.button_gray_md,
  1382. body.ft_l_body .ft_l_wrapper a.button_gray_l,
  1383. body.ft_l_body .ft_l_wrapper a.button_gray_f {
  1384.     background-color: var(--btn-secondary-background);
  1385.     background-image: unset;
  1386.   }
  1387.  
  1388.   #a_newevent {
  1389.     height: 25px;
  1390.     display: flex;
  1391.     justify-content: center;
  1392.     align-items: center;
  1393.     padding: 0;
  1394.   }
  1395.   #a_newevent > .ico_addevent {
  1396.     margin-top: 0;
  1397.   }
  1398.  
  1399.   .contacts {
  1400.     margin: 0;
  1401.     padding: 5px;
  1402.     background: #fff !important;
  1403.   }
  1404.   .contacts .panel_fixed {
  1405.     height: var(--toolbar-height);
  1406.     overflow: hidden;
  1407.     background: transparent !important;
  1408.   }
  1409.   .contacts .panel_fixed .nav_list {
  1410.     height: var(--toolbar-height);
  1411.     overflow: hidden;
  1412.     padding-top: 5px !important;
  1413.     background: transparent !important;
  1414.   }
  1415.   .contacts .panel_fixed .search {
  1416.     padding-top: 5px;
  1417.   }
  1418.   .contacts .panel_list {
  1419.     padding-top: var(--toolbar-height);
  1420.   }
  1421.   .contacts .panel_groups {
  1422.     margin-top: calc(var(--toolbar-height) + 5px) !important;
  1423.   }
  1424. }
  1425. @-moz-document regexp("https?:\\/\\/mail\\.qq\\.com\\/cgi-bin\\/frame_html\\?.*t=newwin_frame.*") {
  1426.   #mainFrameContainer {
  1427.     margin: 0;
  1428.     top: 0;
  1429.     left: 0;
  1430.   }
  1431. }
  1432. @-moz-document regexp("https?:\\/\\/mail\\.qq\\.com\\/?$"),
  1433. regexp("https?:\\/\\/mail\\.qq\\.com\\/cgi-bin\\/loginpage.*") {
  1434.   body {
  1435.     background: var(--login-background);
  1436.     background-size: cover;
  1437.     margin: 0;
  1438.     position: absolute;
  1439.     left: 0;
  1440.     right: 0;
  1441.     top: 0;
  1442.     bottom: 0;
  1443.     overflow: hidden;
  1444.   }
  1445.  
  1446.   .header,
  1447. .footer {
  1448.     display: none;
  1449.   }
  1450.  
  1451.   .container {
  1452.     height: 100%;
  1453.     position: absolute;
  1454.     top: 0;
  1455.     right: 0;
  1456.     bottom: 0;
  1457.     left: 0;
  1458.     display: flex;
  1459.     justify-content: center;
  1460.     align-items: center;
  1461.     background-color: rgba(0, 0, 0, 0.3);
  1462.   }
  1463.  
  1464.   .content {
  1465.     height: 100%;
  1466.     display: flex;
  1467.     justify-content: center;
  1468.     align-items: center;
  1469.   }
  1470.   .content .content_wrapper {
  1471.     display: flex;
  1472.     justify-content: center;
  1473.     align-items: center;
  1474.   }
  1475.   .content .login_pictures {
  1476.     display: none;
  1477.   }
  1478.   .content .logout_info {
  1479.     padding: 20px;
  1480.     background: rgba(255, 255, 255, 0.75);
  1481.     border-radius: 5px !important;
  1482.   }
  1483.   .content .logout_ad {
  1484.     display: none !important;
  1485.   }
  1486. }
  1487. @-moz-document domain("aq.qq.com") {
  1488.   #mobile_tips #mobile_tips_link_default {
  1489.     top: 140px !important;
  1490.   }
  1491. }
  1492.  
  1493. /*# sourceMappingURL=flatqqmail.css.map */

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址