update both themes for communicator default theme changes up to 2011-02-13 (sync...
[themes.git] / LCARStrek / messenger / primaryToolbar.css
index 12813434a9d35630d74142d4da82c7c0be1a8c68..023536eca7f6695c02dfae245bc8a0466758a8f8 100644 (file)
@@ -13,7 +13,7 @@
  *
  * The Original Code is mozilla.org code.
  *
- * The Initial Developer of the Original Code is 
+ * The Initial Developer of the Original Code is
  * Netscape Communications Corporation.
  * Portions created by the Initial Developer are Copyright (C) 1998
  * the Initial Developer. All Rights Reserved.
@@ -22,7 +22,7 @@
  *   Robert Kaiser <KaiRo@KaiRo.at>
  *
  * Alternatively, the contents of this file may be used under the terms of
- * either the GNU General Public License Version 2 or later (the "GPL"), or 
+ * either the GNU General Public License Version 2 or later (the "GPL"), or
  * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
  * in which case the provisions of the GPL or the LGPL are applicable instead
  * of those above. If you wish to allow use of your version of this file only
 /* ::::: primary toolbar buttons ::::: */
 
 #button-getmsg {
-  list-style-image: url("chrome://messenger/skin/toolbar/getmsg.gif");
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(63px 25px 84px 0px);
 }
 
-#button-getmsg:hover,
-#button-getmsg[buttonover="true"],
-#button-getmsg[buttondown="true"],
-#button-getmsg[open="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/getmsg-hover.gif");
-} 
-
 #button-getmsg[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/getmsg-disabled.gif") !important;
+  -moz-image-region: rect(63px 50px 84px 25px);
 }
 
-#button-newmsg {
-  list-style-image: url("chrome://messenger/skin/toolbar/newmsg.gif");
+#button-getmsg:not([disabled="true"]):hover,
+#button-getmsg:not([disabled="true"]):hover:active,
+#button-getmsg[open="true"] {
+  -moz-image-region: rect(63px 75px 84px 50px);
 }
 
-#button-newmsg:hover,
-#button-newmsg:hover:active {
-  list-style-image: url("chrome://messenger/skin/toolbar/newmsg-hover.gif");
-} 
+#button-newmsg {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(105px 25px 126px 0px);
+}
 
 #button-newmsg[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/newmsg-disabled.gif") !important;
+  -moz-image-region: rect(105px 50px 126px 25px);
 }
 
-#button-reply {
-  list-style-image: url("chrome://messenger/skin/toolbar/reply.gif");
+#button-newmsg:not([disabled="true"]):hover,
+#button-newmsg:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(105px 75px 126px 50px);
 }
 
-#button-reply:hover,
-#button-reply:hover:active {
-  list-style-image: url("chrome://messenger/skin/toolbar/reply-hover.gif");
-} 
+#button-reply {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(147px 25px 168px 0px);
+}
 
 #button-reply[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/reply-disabled.gif") !important;
+  -moz-image-region: rect(147px 50px 168px 25px);
 }
 
-#button-replyall {
-  list-style-image: url("chrome://messenger/skin/toolbar/replyall.gif");
+#button-reply:not([disabled="true"]):hover,
+#button-reply:not([disabled="true"]):hover:active,
+#button-reply[open="true"] {
+  -moz-image-region: rect(147px 75px 168px 50px);
 }
 
-#button-replyall:hover,
-#button-replyall:hover:active {
-  list-style-image: url("chrome://messenger/skin/toolbar/replyall-hover.gif");
-} 
+#button-replyall {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(168px 25px 189px 0px);
+}
 
 #button-replyall[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/replyall-disabled.gif") !important;
+  -moz-image-region: rect(168px 50px 189px 25px);
 }
 
-#button-forward {
-  list-style-image: url("chrome://messenger/skin/toolbar/forward.gif");
+#button-replyall:not([disabled="true"]):hover,
+#button-replyall:not([disabled="true"]):hover:active,
+#button-replyall[open="true"] {
+  -moz-image-region: rect(168px 75px 189px 50px);
 }
 
-#button-forward:hover,
-#button-forward:hover:active {
-  list-style-image: url("chrome://messenger/skin/toolbar/forward-hover.gif");
-} 
+#button-forward {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(42px 25px 63px 0px);
+}
 
 #button-forward[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/forward-disabled.gif") !important;
+  -moz-image-region: rect(42px 50px 63px 25px);
+}
+
+#button-forward:not([disabled="true"]):hover,
+#button-forward:not([disabled="true"]):hover:active,
+#button-forward[open="true"] {
+  -moz-image-region: rect(42px 75px 63px 50px);
 }
 
 #button-file {
-  list-style-image: url("chrome://messenger/skin/toolbar/file.gif");
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(21px 25px 42px 0px);
 }
 
-#button-file:hover,
+#button-file[disabled="true"] {
+  -moz-image-region: rect(21px 50px 42px 25px);
+}
+
+#button-file:not([disabled="true"]):hover,
+#button-file:not([disabled="true"]):hover:active,
 #button-file[open="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/file-hover.gif");
-} 
+  -moz-image-region: rect(21px 75px 42px 50px);
+}
 
-#button-file[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/file-disabled.gif") !important;
+#button-goback {
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
+  -moz-image-region: rect(42px 25px 63px 0px);
 }
 
-#button-next {
-  list-style-image: url("chrome://messenger/skin/toolbar/next.gif");
+#button-goback:not([disabled="true"]):hover,
+#button-goback:not([disabled="true"]):hover:active,
+#button-goback[open="true"] {
+  -moz-image-region: rect(42px 75px 63px 50px);
+}
+
+#button-goback[disabled="true"] {
+  -moz-image-region: rect(42px 50px 63px 25px);
 }
 
-#button-next:hover,
-#button-next:hover:active {
-  list-style-image: url("chrome://messenger/skin/toolbar/next-hover.gif");
-} 
+#button-goforward {
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
+  -moz-image-region: rect(63px 25px 84px 0px);
+}
+
+#button-goforward:not([disabled="true"]):hover,
+#button-goforward:not([disabled="true"]):hover:active,
+#button-goforward[open="true"] {
+  -moz-image-region: rect(63px 75px 84px 50px);
+}
+
+#button-goforward[disabled="true"] {
+  -moz-image-region: rect(63px 50px 84px 25px);
+}
+
+#button-next {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(126px 25px 147px 0px);
+}
 
 #button-next[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/next-disabled.gif") !important;
+  -moz-image-region: rect(126px 50px 147px 25px);
 }
 
-#button-delete {
-  list-style-image: url("chrome://global/skin/icons/trash.gif");
+#button-next:not([disabled="true"]):hover,
+#button-next:not([disabled="true"]):hover:active,
+#button-next[open="true"] {
+  -moz-image-region: rect(126px 75px 147px 50px);
 }
 
-#button-delete:hover,
-#button-delete:hover:active {
-  list-style-image: url("chrome://global/skin/icons/trash-hover.gif");
-} 
+#button-delete {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(0px 25px 21px 0px);
+}
 
 #button-delete[disabled="true"] {
-  list-style-image: url("chrome://global/skin/icons/trash-disabled.gif") !important;
+  -moz-image-region: rect(0px 50px 21px 25px);
 }
 
-#button-mark {
-  list-style-image: url("chrome://messenger/skin/toolbar/mark.gif");
+#button-delete:not([disabled="true"]):hover,
+#button-delete:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(0px 75px 21px 50px);
 }
 
-#button-mark:hover,
-#button-mark[buttonover="true"],
-#button-mark[buttondown="true"],
-#button-mark[open="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/mark-hover.gif");
-} 
+toolbarpaletteitem > #button-delete {
+  display: -moz-box;
+}
+
+#button-mark {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(84px 25px 105px 0px);
+}
 
 #button-mark[disabled="true"] {
-  list-style-image: url("chrome://messenger/skin/toolbar/mark-disabled.gif") !important;
+  -moz-image-region: rect(84px 50px 105px 25px);
+}
+
+#button-mark:not([disabled="true"]):hover,
+#button-mark:not([disabled="true"]):hover:active,
+#button-mark[open="true"] {
+  -moz-image-region: rect(84px 75px 105px 50px);
 }
 
 #button-print {
-  list-style-image: url("chrome://global/skin/icons/print.gif");
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
+  -moz-image-region: rect(0px 25px 21px 0px);
 }
 
-#button-print:hover,
-#button-print[buttonover="true"],
-#button-print[buttondown="true"],
+#button-print:not([disabled="true"]):hover,
+#button-print:not([disabled="true"]):hover:active,
 #button-print[open="true"] {
-  list-style-image: url("chrome://global/skin/icons/print-hover.gif");
+  -moz-image-region: rect(0px 75px 21px 50px);
 }
 
 #button-print[disabled="true"] {
-  list-style-image: url("chrome://global/skin/icons/print-disabled.gif") !important;
+  -moz-image-region: rect(0px 50px 21px 25px);
 }
 
 #button-stop {
-  list-style-image: url("chrome://global/skin/icons/stop.gif");
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
+  -moz-image-region: rect(21px 25px 42px 0px);
 }
 
-#button-stop:hover,
-#button-stop:hover:active {
-  list-style-image: url("chrome://global/skin/icons/stop-hover.gif");
+#button-stop:not([disabled="true"]):hover,
+#button-stop:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(21px 75px 42px 50px);
 }
 
 #button-stop[disabled="true"] {
-  list-style-image: url("chrome://global/skin/icons/stop-disabled.gif") !important;
+  -moz-image-region: rect(21px 50px 42px 25px);
+}
+
+#button-junk {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons.png");
+  -moz-image-region: rect(252px 25px 273px 0px);
+}
+
+#button-junk[disabled="true"] {
+  -moz-image-region: rect(252px 50px 273px 25px);
+}
+
+#button-junk:not([disabled="true"]):hover,
+#button-junk:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(252px 75px 273px 50px);
+}
+
+#sync-button {
+  list-style-image: url("chrome://communicator/skin/sync/sync-32.png");
+}
+
+#sync-button[status=active] {
+  list-style-image: url("chrome://communicator/skin/sync/sync-32-throbber.png");
+}
+
+#locationFolders {
+  width: 22em;
+}
+
+toolbarpaletteitem[place="palette"] > #folder-location-container > #locationFolders {
+  max-width: 11em;
+}
+
+toolbarpaletteitem[place="palette"] > #search-container > #searchInput {
+  max-width: 11em;
+}
+
+toolbarpaletteitem[place="palette"] > #mailviews-container > #viewPicker {
+  max-width: 11em;
+}
+
+#viewPickerPopup > menuitem > .menu-iconic-left,
+#viewPickerPopup > menu > menupopup > menuitem > .menu-iconic-left {
+  display: -moz-box !important;
+}
+
+/* ::::: small primary toolbar buttons ::::: */
+
+toolbar[iconsize="small"] > #button-getmsg,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-getmsg {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(48px 16px 64px 0);
+}
+
+toolbar[iconsize="small"] > #button-getmsg[disabled="true"] {
+  -moz-image-region: rect(48px 32px 64px 16px);
+}
+
+toolbar[iconsize="small"] > #button-getmsg:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-getmsg:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-getmsg[open="true"] {
+  -moz-image-region: rect(48px 48px 64px 32px);
+}
+
+toolbar[iconsize="small"] > #button-newmsg,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-newmsg {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(80px 16px 96px 0);
+}
+
+toolbar[iconsize="small"] > #button-newmsg[disabled="true"] {
+  -moz-image-region: rect(80px 32px 96px 16px);
+}
+
+toolbar[iconsize="small"] > #button-newmsg:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-newmsg:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(80px 48px 96px 32px);
+}
+
+toolbar[iconsize="small"] > #button-reply,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-reply {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(112px 16px 128px 0);
+}
+
+toolbar[iconsize="small"] > #button-reply[disabled="true"] {
+  -moz-image-region: rect(112px 32px 128px 16px);
+}
+
+toolbar[iconsize="small"] > #button-reply:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-reply:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-reply[open="true"] {
+  -moz-image-region: rect(112px 48px 128px 32px);
+}
+
+toolbar[iconsize="small"] > #button-replyall,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-replyall {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(128px 16px 144px 0);
+}
+
+toolbar[iconsize="small"] > #button-replyall[disabled="true"] {
+  -moz-image-region: rect(128px 32px 144px 16px);
+}
+
+toolbar[iconsize="small"] > #button-replyall:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-replyall:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-replyall[open="true"] {
+  -moz-image-region: rect(128px 48px 144px 32px);
+}
+
+toolbar[iconsize="small"] > #button-forward,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-forward {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(32px 16px 48px 0);
+}
+
+toolbar[iconsize="small"] > #button-forward[disabled="true"] {
+  -moz-image-region: rect(32px 32px 48px 16px);
+}
+
+toolbar[iconsize="small"] > #button-forward:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-forward:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-forward[open="true"] {
+  -moz-image-region: rect(32px 48px 48px 32px);
+}
+
+toolbar[iconsize="small"] > #button-file,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-file {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(16px 16px 32px 0);
+}
+
+toolbar[iconsize="small"] > #button-file[disabled="true"] {
+  -moz-image-region: rect(16px 32px 32px 16px);
+}
+
+toolbar[iconsize="small"] > #button-file:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-file:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-file[open="true"] {
+  -moz-image-region: rect(16px 48px 32px 32px);
+}
+
+toolbar[iconsize="small"] > #button-goback,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-goback {
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
+  -moz-image-region: rect(32px 16px 48px 0);
+}
+
+toolbar[iconsize="small"] > #button-goback[disabled="true"] {
+  -moz-image-region: rect(32px 32px 48px 16px);
+}
+
+toolbar[iconsize="small"] > #button-goback:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-goback:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-goback[open="true"] {
+  -moz-image-region: rect(32px 48px 48px 32px);
+}
+
+toolbar[iconsize="small"] > #button-goforward,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-goforward {
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
+  -moz-image-region: rect(48px 16px 64px 0);
+}
+
+toolbar[iconsize="small"] > #button-goforward[disabled="true"] {
+  -moz-image-region: rect(48px 32px 64px 16px);
+}
+
+toolbar[iconsize="small"] > #button-goforward:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-goforward:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-goforward[open="true"] {
+  -moz-image-region: rect(48px 48px 64px 32px);
+}
+
+toolbar[iconsize="small"] > #button-next,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-next {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(96px 16px 112px 0);
+}
+
+toolbar[iconsize="small"] > #button-next[disabled="true"] {
+  -moz-image-region: rect(96px 32px 112px 16px);
+}
+
+toolbar[iconsize="small"] > #button-next:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-next:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-next[open="true"] {
+  -moz-image-region: rect(96px 48px 112px 32px);
+}
+
+toolbar[iconsize="small"] > #button-delete,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-delete {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(0 16px 16px 0);
+}
+
+toolbar[iconsize="small"] > #button-delete[disabled="true"] {
+  -moz-image-region: rect(0 32px 16px 16px);
+}
+
+toolbar[iconsize="small"] > #button-delete:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-delete:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(0 48px 16px 32px);
+}
+
+toolbar[iconsize="small"] > #button-mark,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-mark {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(64px 16px 80px 0);
+}
+
+toolbar[iconsize="small"] > #button-mark[disabled="true"] {
+  -moz-image-region: rect(64px 32px 80px 16px);
+}
+
+toolbar[iconsize="small"] > #button-mark:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-mark:not([disabled="true"]):hover:active,
+toolbar[iconsize="small"] > #button-mark[open="true"] {
+  -moz-image-region: rect(64px 48px 80px 32px);
+}
+
+toolbar[iconsize="small"] > #button-junk,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-junk {
+  list-style-image: url("chrome://messenger/skin/icons/messengericons-small.png");
+  -moz-image-region: rect(192px 16px 208px 0);
+}
+
+toolbar[iconsize="small"] > #button-junk[disabled="true"] {
+  -moz-image-region: rect(192px 32px 208px 16px);
+}
+
+toolbar[iconsize="small"] > #button-junk:not([disabled="true"]):hover
+toolbar[iconsize="small"] > #button-junk:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(192px 48px 208px 32px);
+}
+
+toolbar[iconsize="small"] > #button-print,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-print {
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
+  -moz-image-region: rect(0 16px 16px 0);
+}
+
+toolbar[iconsize="small"] > #button-print[disabled="true"] {
+  -moz-image-region: rect(0 32px 16px 16px);
+}
+
+toolbar[iconsize="small"] > #button-print:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-print:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(0 48px 16px 32px);
+}
+
+toolbar[iconsize="small"] > #button-stop,
+toolbar[iconsize="small"] > toolbarpaletteitem > #button-stop {
+  list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
+  -moz-image-region: rect(16px 16px 32px 0);
+}
+
+toolbar[iconsize="small"] > #button-stop[disabled="true"] {
+  -moz-image-region: rect(16px 32px 32px 16px);
+}
+
+toolbar[iconsize="small"] > #button-stop:not([disabled="true"]):hover,
+toolbar[iconsize="small"] > #button-stop:not([disabled="true"]):hover:active {
+  -moz-image-region: rect(16px 48px 32px 32px);
+}
+
+toolbar[iconsize="small"] > toolbarpaletteitem > #sync-button,
+toolbar[iconsize="small"] > #sync-button {
+  list-style-image: url("chrome://communicator/skin/sync/sync-16.png");
+}
+
+toolbar[iconsize="small"] > toolbarpaletteitem > #sync-button[status=active],
+toolbar[iconsize="small"] > #sync-button[status=active] {
+  list-style-image: url("chrome://communicator/skin/sync/sync-16-throbber.png");
+}
+
+/* ::::: message notification bar style rules ::::: */
+
+.msgNotificationBar {
+  border-radius: 7px;
+  padding: 3px;
+  margin-bottom: 3px;
+  background-color: #FF9F00;
+  color: #000000;
+}
+
+.msgNotificationBar:-moz-lwtheme {
+  text-shadow: none;
+}
+
+.msgNotificationBarText {
+  font-weight: bold;
+}
+
+#junkBarImage {
+  list-style-image: url("chrome://messenger/skin/toolbar/junk-hover.gif");
+}
+
+#junkIcon {
+  -moz-margin-start: 0.5ex;
+  list-style-image: url("chrome://messenger/skin/icons/folder-junk.gif");
+}
+
+#remoteContentImage {
+  list-style-image: url("chrome://messenger/skin/toolbar/remote-blocked.png");
+  padding: 3px;
+}
+
+#mdnBarImage {
+  list-style-image: url("chrome://global/skin/icons/alert-question.gif");
+  padding: 3px;
+}
+
+#allowRemoteContentForAuthorDesc {
+  -moz-padding-start: 10px;
 }