treestyletab/skin/classic/treestyletab/square.css

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* Default style */

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tabs,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tabs {
	background: darkgray !important;
	-moz-appearance: none;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-strip,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tabs,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-arrowscrollbox,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabs-container {
	height: auto !important;
	max-height: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"]:not([treestyletab-tabbar-transparent="full"]) .tabbrowser-strip {
	border-right: 1px solid ThreeDShadow !important;
	-moz-border-right-colors: none !important;
}
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="right"][treestyletab-tabbar-fixed="true"]:not([treestyletab-tabbar-transparent="full"]) .tabbrowser-strip {
	border-left: 1px solid ThreeDShadow !important;
	-moz-border-left-colors: none !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabs-bottom,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabs-left,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabs-bottom,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tab-text-shadow, /* Mac OS X */
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tab-text-shadow /* Mac OS X */ {
	display: none !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]),
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) {
	-moz-appearance: none !important;
	min-height: 2em;
	margin: 0 !important;
	padding: 0 0.2em !important;
	color: -moz-dialogtext;
	background: ThreeDFace !important;
	-moz-background-origin: border !important;
	border-top: 2px solid !important;
	-moz-border-top-colors: transparent transparent !important;
	border-bottom: 2px solid !important;
	-moz-border-bottom-colors: ThreeDShadow transparent !important;
	-moz-border-radius-topleft : 0 !important;
	-moz-border-radius-topright : 0 !important;
	-moz-border-radius-bottomleft : 0 !important;
	-moz-border-radius-bottomright : 0 !important;
	-moz-box-align: stretch !important;
}
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:not([selected="true"]):first-child {
	-moz-border-top-colors: ThreeDShadow transparent !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tab-icon-image,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tab-icon-image {
	margin-left: 0;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"],
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"] {
	margin: 0 !important;
	padding: 0 0.2em !important;
	background-color: ThreeDHighlight !important;
	-moz-border-top-colors: ThreeDHighlight transparent !important;
	-moz-border-bottom-colors: ThreeDShadow transparent !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab > .tab-image-left,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab > .tab-image-right,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]) > .tab-image-left,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]) > .tab-image-right,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab > .tab-image-left,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab > .tab-image-right,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) > .tab-image-left,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) > .tab-image-right {
	height: auto;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent;
	width: 0;
}


tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab > .tab-image-middle,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab > .tab-close-button,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle > .tab-close-button,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab > .tab-image-middle,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab > .tab-close-button,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle > .tab-close-button {
	height: auto;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent;
}
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] > .tab-image-middle,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] > .tab-close-button,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"] > .tab-image-middle,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"] > .tab-close-button {
	background: transparent;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab,
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]) {
	border-left: 2px solid !important;
	-moz-border-left-colors: ThreeDLightShadow transparent !important;
	border-right: 2px solid !important;
	-moz-border-right-colors: ThreeDLightShadow transparent !important;
}
tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] {
	-moz-border-left-colors: ThreeDLightShadow transparent !important;
	-moz-border-right-colors: ThreeDLightShadow transparent !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab .tab-close-button {
	margin-right: 0 !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab,
tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) {
	border-right: 2px solid !important;
	-moz-border-right-colors: ThreeDShadow transparent !important;
	border-left: 2px solid !important;
	-moz-border-left-colors: ThreeDShadow transparent !important;
}

tabbrowser[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab { /* Mac OS X */
	text-align: start !important; 
	-moz-box-pack: start !important;
}


/* Vertigo style */

tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tabs,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tabs {
	background: transparent !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tabs,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tabs {
	border-right: 1px solid #aaa !important;
}
tabbrowser[reestyletab-tabbar-position="right"][treestyletab-style~="vertigo"] .tabbrowser-tabs {
	border-left: 1px solid #aaa !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tabs {
	border-top: 1px solid #aaa !important;
}

tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]),
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) {
	background: transparent !important;
	-moz-border-top-colors: transparent transparent !important;
	-moz-border-bottom-colors: transparent transparent !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]):hover,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]):hover {
	background-color: #e0e8f6 !important;
	-moz-border-top-colors: #e0e8f6 #e0e8f6 !important;
	-moz-border-bottom-colors: #e0e8f6 #e0e8f6 !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"],
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"] {
	background-color: #c1d2ee !important;
	-moz-border-top-colors: #c1d2ee #c1d2ee !important;
	-moz-border-bottom-colors: #c1d2ee #c1d2ee !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"]:hover,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"]:hover {
	background-color: #d1e2fe !important;
	-moz-border-top-colors: #d1e2fe #d1e2fe !important;
	-moz-border-bottom-colors: #d1e2fe #d1e2fe !important;
}

tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]),
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab:not([selected="true"]),
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) {
	-moz-border-left-colors: transparent transparent !important;
	-moz-border-right-colors: transparent transparent !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]):hover,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab:not([selected="true"]):hover,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]):hover {
	-moz-border-left-colors: #e0e8f6 #e0e8f6 !important;
	-moz-border-right-colors: #e0e8f6 #e0e8f6 !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"],
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"],
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"] {
	-moz-border-left-colors: #c1d2ee #c1d2ee !important;
	-moz-border-right-colors: #c1d2ee #c1d2ee !important;
}
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"]:hover,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"]:hover,
tabbrowser[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"]:hover {
	-moz-border-left-colors: #d1e2fe #d1e2fe !important;
	-moz-border-right-colors: #d1e2fe #d1e2fe !important;
}


/* Mixed style */

tabbrowser[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"] .tabbrowser-tab {
	-moz-border-right-colors: transparent transparent !important;
	-moz-border-left-colors: transparent transparent !important;
}

tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]):hover,
tabbrowser[treestyletab-style~="mixed"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]):hover {
	background-color: #e0e8f6 !important;
	-moz-border-top-colors: #e0e8f6 transparent !important;
	-moz-border-left-colors: #e0e8f6 transparent !important;
}
tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:first-child:not([selected="true"]):hover {
	-moz-border-top-colors: ThreeDShadow #e0e8f6 !important;
}
tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab:not([selected="true"]):hover {
	-moz-border-right-colors: #e0e8f6 transparent !important;
}

tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"],
tabbrowser[treestyletab-style~="mixed"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"] {
	background-color: #c1d2ee !important;
	-moz-border-top-colors: #c1d2ee transparent !important;
	-moz-border-left-colors: #c1d2ee transparent !important;
}
tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:first-child[selected="true"] {
	-moz-border-top-colors: ThreeDShadow #c1d2ee !important;
}
tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"] {
	-moz-border-right-colors: #c1d2ee transparent !important;
}

tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"]:hover,
tabbrowser[treestyletab-style~="mixed"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"]:hover {
	background-color: #d1e2fe !important;
	-moz-border-top-colors: #d1e2fe transparent !important;
	-moz-border-left-colors: #d1e2fe transparent !important;
}
tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:first-child[selected="true"]:hover {
	-moz-border-top-colors: ThreeDShadow #d1e2fe !important;
}
tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"]:hover {
	-moz-border-right-colors: #d1e2fe transparent !important;
}


/* tab surface */

tabbrowser[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"] .tabbrowser-tab,
tabbrowser[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]),
tabbrowser[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-tabbar-position="bottom"] .tabbrowser-tab,
tabbrowser[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) {
	background-image: url("square/tab-bg.png") !important;
	background-repeat: repeat-x !important;
	background-position: 1px 1px !important;
}

tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"],
tabbrowser[treestyletab-style~="mixed"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"] {
	background-image: url("square/tab-bg-highlighted.png") !important;
}

/* animation */

tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]):hover,
tabbrowser[treestyletab-style~="mixed"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]):hover {
	background-color: ThreeDFace !important;
	background-image: url("square/tab-bg-hover.png") !important;
}

tabbrowser[treestyletab-style~="mixed"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"]:hover,
tabbrowser[treestyletab-style~="mixed"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab[selected="true"]:hover {
	background-color: #c1d2ee !important;
	background-image: url("square/tab-bg-selected-hover.png") !important;
}