暫無描述

summary-report-email.css 5.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300
  1. /* General styles. */
  2. #outlook a {
  3. padding: 0;
  4. }
  5. .ExternalClass {
  6. width: 100%;
  7. }
  8. .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
  9. line-height: 100%;
  10. }
  11. #backgroundTable {
  12. margin: 0;
  13. padding: 0;
  14. width: 100% !important;
  15. line-height: 100% !important;
  16. }
  17. /* Prevent blue links in subject. */
  18. .stats-subject-heading a {
  19. color: inherit !important;
  20. text-decoration: none !important;
  21. }
  22. /* Mobile styles. */
  23. @media only screen and (max-width: 599px) {
  24. table.body .container {
  25. width: 94% !important;
  26. max-width: 600px !important;
  27. }
  28. .header img {
  29. width: 240px !important;
  30. height: auto !important;
  31. }
  32. .content {
  33. padding: 30px !important;
  34. }
  35. .main-heading {
  36. font-size: 16px !important;
  37. line-height: 20px !important;
  38. }
  39. .main-description {
  40. margin-bottom: 20px !important;
  41. }
  42. .stats-totals-wrapper.two .stats-totals-item-wrapper {
  43. width: 50% !important;
  44. }
  45. .stats-totals-wrapper.three .stats-totals-item-wrapper {
  46. width: 33.3% !important;
  47. }
  48. .stats-totals-wrapper.four .stats-totals-item-wrapper {
  49. width: 25% !important;
  50. }
  51. .stats-totals-wrapper {
  52. border-collapse: separate !important;
  53. border: 1px solid #DDDDDD !important;
  54. border-radius: 4px !important;
  55. }
  56. .stats-total-item {
  57. width: 100% !important;
  58. min-width: 100% !important;
  59. }
  60. .stats-total-item-inner {
  61. border: none !important;
  62. }
  63. .stats-total-item-icon-wrapper {
  64. height: 24px !important;
  65. }
  66. .stats-total-item-icon {
  67. width: 24px !important;
  68. height: 24px !important;
  69. }
  70. .stats-totals-wrapper.three .stats-total-item-title,
  71. .stats-totals-wrapper.four .stats-total-item-title {
  72. display: none !important;
  73. }
  74. .stats-total-item-value {
  75. font-size: 18px !important;
  76. line-height: 22px !important;
  77. }
  78. .stats-total-item-percent {
  79. font-size: 12px !important;
  80. line-height: 14px !important;
  81. }
  82. .stats-total-item-percent img {
  83. width: 9px !important;
  84. height: 9px !important;
  85. }
  86. .stats-heading th {
  87. display: block !important;
  88. width: 100% !important;
  89. min-width: 100% !important;
  90. padding-right: 0 !important;
  91. padding-left: 0 !important;
  92. text-align: center !important;
  93. }
  94. .stats-heading .first-col {
  95. padding-top: 20px !important;
  96. padding-bottom: 5px !important;
  97. }
  98. .stats-heading .second-col {
  99. padding-top: 0 !important;
  100. padding-bottom: 20px !important;
  101. }
  102. .stats-heading h2 {
  103. text-align: center !important;
  104. font-size: 15px !important;
  105. line-height: 18px !important;
  106. }
  107. .stats-heading a {
  108. font-size: 13px !important;
  109. line-height: 16px !important;
  110. }
  111. .stats-subject-heading {
  112. text-align: center !important;
  113. }
  114. .stats-subject-row {
  115. text-align: center !important;
  116. }
  117. .stats-subject-column.total,
  118. .stats-subject-column.sent,
  119. .stats-subject-column.confirmed,
  120. .stats-subject-column.unconfirmed,
  121. .stats-subject-column.unsent {
  122. max-width: 64px !important;
  123. }
  124. .stats-subject-column.opened,
  125. .stats-subject-column.clicked {
  126. max-width: 111px !important;
  127. }
  128. .spacer-40 {
  129. line-height: 20px !important;
  130. height: 20px !important;
  131. }
  132. .upgrade-heading {
  133. font-size: 18px !important;
  134. line-height: 22px !important;
  135. }
  136. .upgrade-text {
  137. font-size: 14px !important;
  138. line-height: 20px !important;
  139. }
  140. }
  141. @media only screen and (max-width: 360px) {
  142. .content {
  143. padding: 20px !important;
  144. }
  145. .stats-subject-column.total,
  146. .stats-subject-column.sent,
  147. .stats-subject-column.confirmed,
  148. .stats-subject-column.unconfirmed,
  149. .stats-subject-column.unsent {
  150. max-width: 61px !important;
  151. }
  152. }
  153. /* Dark Mode. */
  154. @media (prefers-color-scheme: dark) {
  155. .dark-body-bg {
  156. background: #1C1E20 !important;
  157. }
  158. .dark-content-bg {
  159. background: #23282C !important;
  160. }
  161. .dark-bg {
  162. background: #202326 !important;
  163. }
  164. .dark-white-color {
  165. color: #ffffff !important;
  166. }
  167. .dark-img {
  168. display: block !important;
  169. width: auto !important;
  170. overflow: visible !important;
  171. float: none !important;
  172. max-height: inherit !important;
  173. max-width: inherit !important;
  174. line-height: auto !important;
  175. margin-top: 0px !important;
  176. visibility: inherit !important;
  177. }
  178. .light-img {
  179. display: none;
  180. display: none !important;
  181. }
  182. .stats-total-item-inner,
  183. .stats-heading {
  184. border-color: #395360 !important;
  185. }
  186. .stats-subject-column-value,
  187. .stats-total-item-percent,
  188. .footer {
  189. color: #8C8F94 !important;
  190. }
  191. .stats-subject-column-value span {
  192. color: #4A5057 !important;
  193. }
  194. .upgrade-text {
  195. color: #8C8F94 !important;
  196. }
  197. }
  198. /* Dark Mode Outlook. */
  199. [data-ogsc] .dark-body-bg {
  200. background: #1C1E20 !important;
  201. }
  202. [data-ogsc] .dark-content-bg {
  203. background: #23282C !important;
  204. }
  205. [data-ogsc] .dark-bg {
  206. background: #202326 !important;
  207. }
  208. [data-ogsc] .dark-white-color {
  209. color: #ffffff !important;
  210. }
  211. [data-ogsc] .dark-img {
  212. display: block !important;
  213. width: auto !important;
  214. overflow: visible !important;
  215. float: none !important;
  216. max-height: inherit !important;
  217. max-width: inherit !important;
  218. line-height: auto !important;
  219. margin-top: 0px !important;
  220. visibility: inherit !important;
  221. }
  222. [data-ogsc] .light-img {
  223. display: none;
  224. display: none !important;
  225. }
  226. [data-ogsc] .stats-total-item-inner,
  227. [data-ogsc] .stats-heading {
  228. border-color: #395360 !important;
  229. }
  230. [data-ogsc] .stats-subject-column-value,
  231. [data-ogsc] .stats-total-item-percent,
  232. [data-ogsc] .footer {
  233. color: #8C8F94 !important;
  234. }
  235. [data-ogsc] .stats-subject-column-value span {
  236. color: #4A5057 !important;
  237. }
  238. [data-ogsc] .upgrade-text {
  239. color: #8C8F94 !important;
  240. }