Attachment #468595 for bug #451134

Attachment #468595: patch (1/2): mechanical changes for bug #451134





    padding-top: 3px;
}

.pane-button-badge {
    background-color: green;
    color: white;
    font-weight: bold;
    padding: 2px;
    border-radius: 100%;
    margin-right: 25px;
    margin-bottom: 13px;
}

richlistbox.tp-study-list {
    overflow: auto;
    margin: 0px;
}





	margin-top: 30px;
}

.button {
	font-family: 'DroidSans';
	font-size: 16px;
	padding: 8px 12px;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-moz-box-shadow: 
		inset rgba(0, 0, 0, 0.2) 0 1px 1px,
		inset rgba(255, 255, 255, 1) 0 3px 1px,
		inset rgba(255, 255, 255, 0.3) 0 16px 0px,
		inset rgba(0, 0, 0, 0.2) 0 -1px 1px,
		inset rgba(0, 0, 0, 0.1) 0 -2px 1px, 
		rgba(255, 255, 255, 1) 0 1px,

}

.home_button {
	font-family: 'DroidSans';
	font-size: 16px;
	padding: 8px 12px;
	width: 240px;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-moz-box-shadow: 
		inset rgba(0, 0, 0, 0.2) 0 1px 1px,
		inset rgba(255, 255, 255, 1) 0 3px 1px,
		inset rgba(255, 255, 255, 0.3) 0 16px 0px,
		inset rgba(0, 0, 0, 0.2) 0 -1px 1px,
		inset rgba(0, 0, 0, 0.1) 0 -2px 1px, 
		rgba(255, 255, 255, 1) 0 1px,



.callout {
	font-family: 'DroidSans';
	font-size: 16px;
	padding: 8px 24px;
	margin: 24px auto;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	background: rgba(220, 240, 247, 0.8) url('chrome://testpilot/skin/callout.png') no-repeat top center;
	-moz-box-shadow: 
		inset rgba(185, 221, 234, 0.2) 0 -10px 12px,
		inset rgba(185, 221, 234, 1) 0 0px 1px,
		inset rgba(255, 255, 255, 0.2) 0 10px 12px;
	//display: inline;
}

.home_callout {
	font-family: 'DroidSans';
	font-size: 16px;
	vertical-align: middle;
	width: 240px;
	padding: 8px 24px;
	margin: 8px auto;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	background: rgba(220, 240, 247, 0.8) url('chrome://testpilot/skin/callout.png') no-repeat top center;
	-moz-box-shadow: 
		inset rgba(185, 221, 234, 0.2) 0 -10px 12px,
		inset rgba(185, 221, 234, 1) 0 0px 1px,
		inset rgba(255, 255, 255, 0.2) 0 10px 12px;
	//display: inline;
}

/* ------- MENU ------- 

#menu {
	margin: 20px auto;
	max-width: 800px;
	padding: 4px 40px;
	width: 800px;
	text-align: left;
	border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
	border-top: 1px solid #adb6ba;
	border-left: 1px solid #adb6ba;
	border-right: 1px solid #adb6ba;
	border-bottom: 3px solid #adb6ba;
	-moz-border-bottom-colors:#adb6ba #e7eaec #e7eaec;
	background-color: #fff;
} 





		-webkit-box-shadow:
			rgba(133, 153, 166, 0.4) 0px 1px 24px;
		
	}
	
	.dataBox {
		font-size: 16px;
		padding: 6px 20px 20px 20px;
		border-radius: 0.5em;
		-webkit-border-radius: 0.5em;
		background: rgba(220, 240, 247, 0.8) url('chrome://testpilot/skin/images/callout.png') no-repeat top center;
		//display: inline;
	}

#container {
	margin: 0px auto;
	width: 950px;

	margin-right: 0px;
	margin-top: 260px;
}

.button {
	font-size: 16px;
	padding: 8px 12px;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-moz-box-shadow: 
		inset rgba(0, 0, 0, 0.2) 0 1px 1px,
		inset rgba(255, 255, 255, 1) 0 3px 1px,
		inset rgba(255, 255, 255, 0.3) 0 16px 0px,
		inset rgba(0, 0, 0, 0.2) 0 -1px 1px,
		inset rgba(0, 0, 0, 0.1) 0 -2px 1px, 
		rgba(255, 255, 255, 1) 0 1px,

	//display: inline;
}

.home_button {
	font-size: 16px;
	padding: 8px 12px;
	width: 240px;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-moz-box-shadow: 
		inset rgba(0, 0, 0, 0.2) 0 1px 1px,
		inset rgba(255, 255, 255, 1) 0 3px 1px,
		inset rgba(255, 255, 255, 0.3) 0 16px 0px,
		inset rgba(0, 0, 0, 0.2) 0 -1px 1px,
		inset rgba(0, 0, 0, 0.1) 0 -2px 1px, 
		rgba(255, 255, 255, 1) 0 1px,

	//display: inline;
}

.callout {
	font-size: 16px;
	padding: 8px 24px;
	margin: 24px auto;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	background: rgba(220, 240, 247, 0.8) url('chrome://testpilot/skin/images/callout.png') no-repeat top center;
	-moz-box-shadow: 
		inset rgba(185, 221, 234, 0.2) 0 -10px 12px,
		inset rgba(185, 221, 234, 1) 0 0px 1px,
		inset rgba(255, 255, 255, 0.2) 0 10px 12px;
	//display: inline;
}


.home_callout {
	font-size: 16px;
	vertical-align: middle;
	width: 280px;
	padding: 8px 24px;
	margin: 8px auto;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	background: rgba(220, 240, 247, 0.8) url('chrome://testpilot/skin/images/callout.png') no-repeat top center;
	-moz-box-shadow: 
		inset rgba(185, 221, 234, 0.2) 0 -10px 12px,
		inset rgba(185, 221, 234, 1) 0 0px 1px,
		inset rgba(255, 255, 255, 0.2) 0 10px 12px;
	//display: inline;
}

.home_callout_continue {
	font-size: 16px;
	vertical-align: middle;
	width: 280px;
	padding: 8px 24px;
	margin: 8px auto;
	color: rgba(0, 0, 0, 0.8);
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	background: rgba(220, 240, 247, 0.8) url('chrome://testpilot/skin/images/callout_continue.png') no-repeat top center;
	-moz-box-shadow: 
		inset rgba(185, 221, 234, 0.2) 0 -10px 12px,
		inset rgba(185, 221, 234, 1) 0 0px 1px,
		inset rgba(255, 255, 255, 0.2) 0 10px 12px;
	//display: inline;
}

/* ------- MENU ------- 

#menu {
	margin: 20px auto;
	max-width: 800px;
	padding: 4px 40px;
	width: 800px;
	text-align: left;
	border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
	border-top: 1px solid #adb6ba;
	border-left: 1px solid #adb6ba;
	border-right: 1px solid #adb6ba;
	border-bottom: 3px solid #adb6ba;
	-moz-border-bottom-colors:#adb6ba #e7eaec #e7eaec;
	background-color: #fff;
} 





}

#pilot-notification-popup {
  -moz-appearance: none;
  background-color: Menu;
  background-image: -moz-linear-gradient(hsla(0,0%,100%,.2), transparent);
  -moz-box-shadow: inset 0 0 10px hsla(0,0%,100%,.2),
                   inset 0 1px 0 hsla(0,0%,100%,.3);
  border-radius: 4px;
  border: 1px solid Menu;
  margin: -6px 0 0 0;
  width: 480px;
}

.tail-up,
.tail-down {
 -moz-border-image: none;






#pilot-notification-submit {
  -moz-appearance: none;
  background: #666 
              -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%,
                                   rgba(60,60,60,.9) 51%, rgba(50,50,50,.9));
  background-clip: padding-box;
  background-origin: padding-box;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.65);
  -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2),
                   inset 0 0 1px rgba(255,255,255,.1),
                   0 1px 0 rgba(255,255,255,.1);
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0,0,0,.5);
}








.tab {
  position: absolute;
  padding: 4px 6px 6px 4px;
  border: 1px solid rgba(230,230,230,1);
  background-color: rgba(245,245,245,1);
  overflow: visible !important;
  border-radius: 0.4em;
  -moz-box-shadow: inset rgba(255, 255, 255, 0.6) 0 0 0 2px;
  cursor: pointer;
}

.tab canvas,
.cached-thumb {
  border: 1px solid rgba(0,0,0,0.2);
  width: 100%;

  margin-right: -12px;
  bottom: 2px;
  width: 94.5%;
}

.favicon {
  position: absolute;
  background-color: rgba(245,245,245,1);
  border-bottom-right-radius: 0.4em;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.6) 0 -2px 0px,
    inset rgba(255, 255, 255, 0.6) -2px 0px 0px;
  padding: 4px 6px 6px 4px;
  top: 4px;
  left: 4px;
  border-right: 1px solid rgba(0,0,0,0.2);
  border-bottom: 1px solid rgba(0,0,0,0.2);



.groupItem {
  position: absolute;
/*   float: left;  */
  cursor: move;
  border: 1px solid rgba(230,230,230,1);
  background-color: rgba(248,248,248,1);
  border-radius: 0.4em;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.6) 0 0 0 2px,
    rgba(0,0,0,0.2) 1px 1px 4px;
}

.groupItem.activeGroupItem {
  -moz-box-shadow:
    rgba(0,0,0,0.6) 1px 1px 8px;


.phantom {
  border: 1px solid rgba(190,190,190,1);
}

.overlay {
  background-color: rgba(0,0,0,.7) !important;
  -moz-box-shadow: 3px 3px 8px rgba(0,0,0,.5);
  border-radius: 0.4em;
  /*
  border: 1px solid rgba(230,230,230,1);
  background-color: rgba(248,248,248,1);
  -moz-box-shadow:
    rgba(0,0,0, .3) 2px 2px 8px,
    inset rgba(255, 255, 255, 0.6) 0 0 0 2px; */
}

/* InfoItems
----------------------------------*/

.info-item {
  position: absolute;
  cursor: move;
  border: 1px solid rgba(230,230,230,1);
  background-color: rgba(248,248,248,1);
  border-radius: 0.4em;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.6) 0 0 0 2px,
    rgba(0,0,0, .2) 1px 1px 4px;
}

.intro {
  margin: 10px;
}

  opacity: 1;
}

.newTabButtonAlt {
  position: absolute;
  cursor: pointer;
  z-index: 99999;
  border: none;
  border-radius: 4px;
  font-size: 50px;
  line-height: 50px;
  height: 57px !important;
  width: 70px !important;
  margin-top: 4px !important;
  text-align: center;
  background-color: #888888;
  -moz-box-shadow: inset 0px 0px 5px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.3);

  bottom: 1px;
}

/* Utils
----------------------------------*/

.front {
  z-index: 999999 !important;
  border-radius: 0 !important;
  -moz-box-shadow: none !important;
  -moz-transform: none !important;
  image-rendering: -moz-crisp-edges;
}

/* Feedback
----------------------------------*/






}

#errorPageContainer {
  position: relative;
  min-width: 13em;
  max-width: 52em;
  margin: 4em auto;
  border: 1px solid #FFBD09; /* pale yellow extracted from yellow passport icon */
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  background: url("chrome://global/skin/icons/sslWarning.png") left 0 no-repeat -moz-Field;
  background-origin: content-box;
}

body[dir="rtl"] #errorPageContainer {
  background-position: right 0;





}

richlistitem[type="tab"] {
  min-height: 3em;
  border: #999999 1px solid !important;
  padding: 2px 5px;
  margin-bottom: 4px;
  -moz-margin-start: 4em;
  border-radius: 6px;
  background-color: menu;
  width: 44em;
  opacity: 0.9;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.5) 0 1px 0px,
    inset rgba(0, 0, 0, 0.1) 0 -2px 0px,
    rgba(0, 0, 0, 0.1) 0px 1px 0px;
}


richlistitem[type="client"] {
  min-height: 2em;
  color: #000000;
  -moz-margin-start: 2em;
  margin-top: 2px;
  margin-bottom: 3px;
  width: 42em;
  border-radius: 6px;
  background-color: transparent;
  -moz-user-focus: ignore !important;
}
richlistitem.mobile[type="client"] {
  list-style-image: url("chrome://browser/skin/sync-mobileIcon.png");
}
richlistitem.desktop[type="client"] {
  list-style-image: url("chrome://browser/skin/sync-desktopIcon.png");





  -moz-appearance: tab-scroll-arrow-back;
  margin: 0;
}

.tabbrowser-arrowscrollbox > .scrollbutton-down {
  -moz-appearance: tab-scroll-arrow-forward;
  margin: 0;
  -moz-transition: 1s -moz-box-shadow ease-out;
  border-radius: 4px;
}

.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
  -moz-box-shadow: 0 0 7px 5px Highlight inset;
  -moz-transition: none;
}

#alltabs-button > .toolbarbutton-icon {





  padding: 3em;
  -moz-padding-start: 30px;
  margin: 2em auto;
  background: -moz-Field;
}

#feedHeaderContainer {
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  margin: -4em auto 0 auto;
  background-color: InfoBackground;
}

#feedHeader {  
  margin-top: 4.9em;
  margin-bottom: 1em;
  -moz-margin-start: 1.4em;





}

#cookiesChildren::-moz-tree-image(domainCol, container) {
  list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
}

#cookieInfoBox {
  border: 1px solid ThreeDShadow;
  border-radius: 0px;
  margin: 4px;
  padding: 0px;
}

/* bottom-most box containing a groupbox in a prefpane. Prevents the bottom
   of the groupbox from being cutoff */
.bottomBox {
  padding-bottom: 4px;





  color: #111;
}


/* Sanitize everything warning box */
#sanitizeEverythingWarningBox {
  background-color: Window;
  border: 1px solid ThreeDDarkShadow;
  border-radius: 5px;
  padding: 16px;
}

#sanitizeEverythingWarningIcon {
  list-style-image: url("chrome://global/skin/icons/warning-large.png");
  padding: 0;
  margin: 0;
}





}


.accountChoiceButton,
.mergeChoiceButton {
  -moz-appearance: none;
  border: #999999 1px solid !important;
  padding: 2px 3px;
  border-radius: 6px;
  background-color: menu;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.5) 0 1px 0px,
    inset rgba(0, 0, 0, 0.1) 0 -2px 0px,
    rgba(0, 0, 0, 0.1) 0px 1px 0px;
}

.accountChoiceButton:hover,


.mergeChoiceButtonBox {
  padding: 0.2em;
}

.success,
.error {
  padding: 2px;
  border-radius: 2px;
}

.error {
  background-color: #FF0000 !important;
  color: #FFFFFF !important;
}

.success {





}

#errorPageContainer {
  position: relative;
  min-width: 13em;
  max-width: 52em;
  margin: 4em auto;
  border: 1px solid #FFBD09; /* pale yellow extracted from yellow passport icon */
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  background: url("chrome://global/skin/icons/sslWarning.png") left 0 no-repeat -moz-Field;
  background-origin: content-box;
}

body[dir="rtl"] #errorPageContainer {
  background-position: right 0;





}

richlistitem[type="tab"] {
  min-height: 3em;
  border: #999999 1px solid !important;
  padding: 2px 5px;
  margin-bottom: 4px;
  -moz-margin-start: 4em;
  border-radius: 6px;
  background-color: menu;
  width: 44em;
  opacity: 0.9;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.5) 0 1px 0px,
    inset rgba(0, 0, 0, 0.1) 0 -2px 0px,
    rgba(0, 0, 0, 0.1) 0px 1px 0px;
}


richlistitem[type="client"] {
  min-height: 2em;
  color: #000000;
  -moz-margin-start: 2em;
  margin-top: 2px;
  margin-bottom: 3px;
  width: 42em;
  border-radius: 6px;
  background-color: transparent;
  -moz-user-focus: ignore !important;
}
richlistitem.mobile[type="client"] {
  list-style-image: url("chrome://browser/skin/sync-mobileIcon.png");
}
richlistitem.desktop[type="client"] {
  list-style-image: url("chrome://browser/skin/sync-desktopIcon.png");





}

/* ----- BOOKMARK BUTTONS ----- */

toolbarbutton.bookmark-item {
  font-weight: bold;
  color: #222;
  border: 0;
  border-radius: 100%;
  padding: 0 8px;
  margin: 0 0 1px;
}

.bookmark-item > .toolbarbutton-menu-dropmarker {
  list-style-image: url("chrome://browser/skin/places/folderDropArrow.png");
  -moz-image-region: rect(0, 7px, 5px, 0);
  margin-top: 1px;

#restore-button,
toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button,
toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-dropmarker {
  margin: 0;
  -moz-box-orient: vertical;
  padding: 0 3px;
  height: 22px;
  border: 1px solid @toolbarbuttonBorderColor@;
  border-radius: @toolbarbuttonCornerRadius@;
  -moz-box-shadow: 0 1px rgba(255, 255, 255, 0.2);
  background: @toolbarbuttonBackground@;
  background-origin: border-box;
}

toolbar:not([mode="icons"]) .toolbarbutton-1:not([type="menu-button"]),
toolbar:not([mode="icons"]) #restore-button,
toolbar:not([mode="icons"]) toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button,


toolbar:not([mode="icons"]) toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-dropmarker {
  width: auto;
  padding-top: 0;
}

toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button:-moz-locale-dir(rtl),
toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(ltr) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button:-moz-locale-dir(ltr),
toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(rtl) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

toolbar:not([mode="icons"]) toolbarbutton[type="menu-button"]:not([open="true"]) > .toolbarbutton-menubutton-dropmarker {
  opacity: .7;
}

.toolbarbutton-1 > .toolbarbutton-text,
toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button > .toolbarbutton-text {

toolbar:not([iconsize="small"])[mode="icons"] #back-button:-moz-locale-dir(rtl) {
  -moz-transform: scaleX(-1);
}

toolbar:not([iconsize="small"])[mode="icons"] #back-button {
  width: 30px;
  height: 30px;
  padding: 4px 5px 4px 3px;
  border-radius: 100%;
}

toolbar[mode="icons"] #forward-button {
  -moz-margin-start: 0;
}

toolbar[mode="icons"]:not([iconsize="small"]) #forward-button {
  /* 1px to the right */

toolbar[iconsize="small"][mode="icons"] #forward-button  {
  width: 27px;
  -moz-padding-start: 2px;
}

toolbar[mode="icons"]:not([iconsize="small"]) #forward-button:-moz-locale-dir(ltr),
toolbar[iconsize="small"][mode="icons"] #back-button:-moz-locale-dir(rtl),
toolbar[iconsize="small"][mode="icons"] #forward-button:-moz-locale-dir(ltr) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

toolbar[mode="icons"]:not([iconsize="small"]) #forward-button:-moz-locale-dir(rtl),
toolbar[iconsize="small"][mode="icons"] #back-button:-moz-locale-dir(ltr),
toolbar[iconsize="small"][mode="icons"] #forward-button:-moz-locale-dir(rtl) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

#back-forward-dropmarker {
  display: none;
}

.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {

.searchbar-textbox[focused="true"] {
  background-color: -moz-mac-focusring;
  background-image: -moz-linear-gradient(#D6D6D6, #D6D6D6 1px, #F7F7F7 1px, #F7F7F7 2px, #FFF 2px, #FFF),
                    -moz-linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,.1));
  -moz-box-shadow: @focusRingShadow@;
}

#urlbar {
  border-radius: @toolbarbuttonCornerRadius@;
  direction: ltr;
  -moz-padding-end: 3px;
}

#identity-box {
  margin: 1px;
  border-radius: 2px;
  padding: 1px;
  -moz-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
  text-shadow: 0 1px rgba(255, 255, 255, 0.2);
}


#identity-box:-moz-focusring {
  -moz-box-shadow: 0 0 3px 1px -moz-mac-focusring inset,

}

#editBMPanel_newFolderButton .button-text {
  display: none !important;
}

#editBMPanel_folderMenuList {
  @hudButton@
  border-radius: 5px;
  margin: 0 3px !important;
  min-height: 22px;
  -moz-padding-start: 2px;
}

#editBMPanel_folderMenuList:focus {
  outline: 2px solid -moz-mac-focusring;
  outline-offset: -2px;

  background-color: #b3b3b3;
}

/**** expanders ****/

#editBookmarkPanel .expander-up,
#editBookmarkPanel .expander-down {
  @hudButton@
  border-radius: 5px;
  -moz-margin-start: 4px;
  -moz-margin-end: 2px;
  padding: 0;
  -moz-padding-start: 4px;
  min-width: 10px;
  min-height: 22px;
}


#editBMPanel_namePicker[droppable="false"] > .menulist-editable-box {
  -moz-appearance: none !important;
  margin: 2px 4px !important;
  border: 2px solid !important;
  -moz-border-top-colors: #1c1c1c #545454 !important;
  -moz-border-right-colors: #1c1c1c #636363 !important;
  -moz-border-bottom-colors: #1c1c1c #797979 !important;
  -moz-border-left-colors: #1c1c1c #636363 !important;
  border-radius: 1px !important;
  background-color: #666 !important;
  color: #fff !important;
}

#editBMPanel_namePicker[droppable="false"] > .menulist-editable-box > html|*.menulist-editable-input {
  color: inherit;
}


  margin-bottom: 0;
  font: message-box;
  font-weight: bold;
}

.tabbrowser-tab,
.tabs-newtab-button {
  -moz-appearance: none;
  border-radius: 0 0 6px 6px;
  color: #222;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
  margin: 0 0 1px;
  padding: 2px 5px 0;
  border-style: none solid solid;
  border-width: 3px;
  -moz-border-top-colors: rgba(0,0,0,.04) rgba(0,0,0,.17) rgba(255,255,255,.35);
  -moz-border-bottom-colors: rgba(0,0,0,.04) rgba(0,0,0,.17) rgba(255,255,255,.25);

  height: 24px;
  background-image: url(chrome://browser/skin/tabbrowser/tab-bkgnd.png);
}

#tabbrowser-tabs[tabsontop="true"] > .tabbrowser-tab,
#tabbrowser-tabs[tabsontop="true"] > .tabbrowser-arrowscrollbox > .tabs-newtab-button {
  border-top-style: solid;
  border-bottom-style: none;
  border-radius: 6px 6px 0 0;
  padding-top: 0;
  padding-bottom: 2px;
  margin-top: 1px;
  margin-bottom: 0;
  background-image: -moz-linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,0));
}

.tabs-newtab-button {

#TabsToolbar > #bookmarks-menu-button-container > #bookmarks-menu-button,
#TabsToolbar > toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button,
#TabsToolbar > toolbarpaletteitem > toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button,
#TabsToolbar > toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-dropmarker,
#TabsToolbar > toolbarpaletteitem > toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-dropmarker {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: none;
  -moz-box-shadow: none;
}

#TabsToolbar > toolbarbutton:not([type="menu-button"]),
#TabsToolbar > toolbarpaletteitem > toolbarbutton:not([type="menu-button"]),
#TabsToolbar > #bookmarks-menu-button-container > #bookmarks-menu-button,
#TabsToolbar > toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button,


/* ::::: Keyboard UI Panel ::::: */

.KUI-panel {
  -moz-appearance: none;
  background: rgba(27%,27%,27%,.9) url(KUI-background.png) repeat-x;
  color: white;
  border-style: none;
  border-radius: 20px;
}

.KUI-panel[level="top"] {
  background-color: rgba(27%,27%,27%,.65);
  -moz-window-shadow: none;
}

.KUI-panel-closebutton {


.ctrlTab-preview-inner {
  padding-bottom: 10px;
}

#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
  padding: 10px;
  background-color: rgba(255,255,255,.2);
  border-radius: .5em;
}

.ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
  color: white;
  background-color: rgba(0,0,0,.6);
  text-shadow: none;
  padding: 8px;
  border: 2px solid white;
  border-radius: .5em;
}

.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
  margin: -10px -10px 0;
}

#ctrlTab-showAll {
  margin-top: .5em;

}

.allTabs-favicon[src] {
  background-color: -moz-dialog;
  width: 20px;
  height: 20px;
  padding-bottom: 4px;
  -moz-padding-start: 4px;
  border-bottom-left-radius: 4px;
}

.allTabs-favicon[src]:-moz-locale-dir(rtl) {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 4px;
}

.allTabs-preview:not(:focus) > * > .allTabs-favicon-container > .allTabs-favicon[src] {
  width: 22px;
  height: 22px;
  padding-top: 2px;
  -moz-padding-end: 2px;
  margin-top: -2px;





  padding: 3em;
  -moz-padding-start: 30px;
  margin: 2em auto;
  background: -moz-Field;
}

#feedHeader {
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding-top: 4em;
  padding-bottom: .3em;
  -moz-padding-start: .3em;
  -moz-padding-end: .3em;
  margin: -4em auto 0 auto;
  font-size: 110%;
  color: InfoText;
  padding: 5em 3em 0 3em;





  -moz-appearance: textfield;
  cursor: text;
  margin: 4px 4px;
  border: 3px solid;
  -moz-border-top-colors: transparent #888888 #000000;
  -moz-border-right-colors: transparent #FFFFFF #000000;
  -moz-border-bottom-colors: transparent #FFFFFF #000000;
  -moz-border-left-colors: transparent #888888 #000000;
  border-top-right-radius: 2px;
  border-bottom-left-radius: 2px;
  padding: 0;
  background-color: -moz-Field;
  color: -moz-FieldText;
}

#editBMPanel_namePicker[droppable="false"][disabled="true"] > .menulist-editable-box {
  cursor: default;
  -moz-border-top-colors: transparent ThreeDShadow -moz-Dialog;





  background-image: none !important;       
}

#placesToolbar > toolbarbutton {
  list-style-image: url("chrome://browser/skin/places/toolbar.png");
  margin: 4px 4px 5px;
  padding: 1px 3px;
  border: 1px solid @toolbarbuttonBorderColor@;
  border-radius: @toolbarbuttonCornerRadius@;
  -moz-box-shadow: @loweredShadow@;
  background: @toolbarbuttonBackground@;
  background-origin: border-box;
}

#placesToolbar > toolbarbutton:not([disabled="true"]):active:hover,
#placesToolbar > toolbarbutton[open="true"] {
  background: @toolbarbuttonPressedBackgroundColor@;

#placesToolbar > toolbarbutton > menupopup {
  margin-top: 1px;
}

/* back and forward button */
#back-button:-moz-locale-dir(ltr),
#forward-button:-moz-locale-dir(rtl) {
  -moz-image-region: rect(0px, 16px, 16px, 0px);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: 0;
  border-right: 0;
}

#forward-button:-moz-locale-dir(ltr),
#back-button:-moz-locale-dir(rtl) {
  -moz-image-region: rect(0px, 32px, 16px, 16px);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: 0;
}

#back-button > .toolbarbutton-icon {
  -moz-margin-start: 3px !important;
  -moz-margin-end: 2px !important;
}


  margin: 0 6px 1px;
}

#organizerScopeBar > toolbarbutton {
  border: 0;
  font: icon;
  font-weight: bold;
  color: #2D2D2D;
  border-radius: 100%;
  padding: 0 10px 1px;
  margin: 1px;
  font-weight: bold;
}

#organizerScopeBar > toolbarbutton > .toolbarbutton-text {
   margin: 0 !important;
}

#organizerScopeBar  > .expander-down:hover:active {
  list-style-image: url("chrome://browser/skin/places/minus-active.png") !important;
}

#saveSearch {
  margin: 0 4px;
  padding: 0 10px;
  -moz-appearance: none;
  border-radius: 100%;
  border: @roundButtonBorder@;
  text-shadow: @loweredShadow@;
  background: @roundButtonBackground@;
  -moz-box-shadow: @roundButtonShadow@;
}

#saveSearch > .button-box > .button-text {
  margin: 0 !important;






#sidebar-search-label {
  display: none;
}

#viewButton {
  -moz-appearance: none;
  border: 1px solid #7F7F7F;
  border-radius: 10px;
  background: @toolbarbuttonBackground@;
  min-width: 0px;
  min-height: 0px;
  -moz-padding-start: 5px;
  -moz-padding-end: 0px;
  padding-top: 1px;
  padding-bottom: 1px;
}





  color: #111;
}


/* Sanitize everything warning box */
#sanitizeEverythingWarningBox {
  background-color: Window;
  border: 1px solid ThreeDDarkShadow;
  border-radius: 5px;
  padding: 16px;
}

#sanitizeEverythingWarningIcon {
  list-style-image: url("chrome://global/skin/icons/warning-large.png");
  padding: 0;
  margin: 0;
}

(-)a/browser/themes/pinstripe/browser/searchbar.css (-1 / +1 lines)

Line	Link Here

Lines 1-10	Link Here

.searchbar-textbox {

.searchbar-textbox {

  -moz-border-radius: 100%;

  border-radius: 100%;

.searchbar-engine-button {

.searchbar-engine-button {

  -moz-padding-start: 6px;

  -moz-padding-start: 6px;

  -moz-padding-end: 2px;

  -moz-padding-end: 2px;

  margin: 0;

  margin: 0;

  -moz-margin-end: 2px;

  -moz-margin-end: 2px;

  -moz-appearance: none;

  -moz-appearance: none;

(-)a/browser/themes/pinstripe/browser/shared.inc (-1 / +1 lines)

Line	Link Here

Lines 1-3	Link Here

%include ../../../../toolkit/themes/pinstripe/global/shared.inc

%include ../../../../toolkit/themes/pinstripe/global/shared.inc

%define hudButton -moz-appearance: none; background: url("chrome://browser/skin/hud-style-button-middle-background.png") repeat-x #464646 center center; border: 3px solid; -moz-border-top-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4); -moz-border-right-colors: rgba(53,53,53,1) rgba(53,53,53,1) rgba(162,162,162,1); -moz-border-bottom-colors: rgba(128,128,128,0.35) rgba(0,0,0,0.5) rgba(255,255,255,0.15); -moz-border-left-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4); -moz-border-radius: 20px; color: #fff;

%define hudButton -moz-appearance: none; background: url("chrome://browser/skin/hud-style-button-middle-background.png") repeat-x #464646 center center; border: 3px solid; -moz-border-top-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4); -moz-border-right-colors: rgba(53,53,53,1) rgba(53,53,53,1) rgba(162,162,162,1); -moz-border-bottom-colors: rgba(128,128,128,0.35) rgba(0,0,0,0.5) rgba(255,255,255,0.15); -moz-border-left-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4); border-radius: 20px; color: #fff;





}


.accountChoiceButton,
.mergeChoiceButton {
  -moz-appearance: none;
  border: #999999 1px solid !important;
  padding: 2px 3px;
  border-radius: 6px;
  background-color: menu;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.5) 0 1px 0px,
    inset rgba(0, 0, 0, 0.1) 0 -2px 0px,
    rgba(0, 0, 0, 0.1) 0px 1px 0px;
}

.accountChoiceButton:hover,


.mergeChoiceButtonBox {
  padding: 0.2em;
}

.success,
.error {
  padding: 2px;
  border-radius: 2px;
}

.error {
  background-color: #FF0000 !important;
  color: #FFFFFF !important;
}

.success {





}

#errorPageContainer {
  position: relative;
  min-width: 13em;
  max-width: 52em;
  margin: 4em auto;
  border: 1px solid #FFBD09; /* pale yellow extracted from yellow passport icon */
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  background: url("chrome://global/skin/icons/sslWarning.png") left 0 no-repeat -moz-Field;
  background-origin: content-box;
}

body[dir="rtl"] #errorPageContainer {
  background-position: right 0;





}

richlistitem[type="tab"] {
  min-height: 3em;
  border: #999999 1px solid !important;
  padding: 2px 5px;
  margin-bottom: 4px;
  -moz-margin-start: 4em;
  border-radius: 6px;
  background-color: menu;
  width: 44em;
  opacity: 0.9;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.5) 0 1px 0px,
    inset rgba(0, 0, 0, 0.1) 0 -2px 0px,
    rgba(0, 0, 0, 0.1) 0px 1px 0px;
}


richlistitem[type="client"] {
  min-height: 2em;
  color: #000000;
  -moz-margin-start: 2em;
  margin-top: 2px;
  margin-bottom: 3px;
  width: 42em;
  border-radius: 6px;
  background-color: transparent;
  -moz-user-focus: ignore !important;
}
richlistitem.mobile[type="client"] {
  list-style-image: url("chrome://browser/skin/sync-mobileIcon.png");
}
richlistitem.desktop[type="client"] {
  list-style-image: url("chrome://browser/skin/sync-desktopIcon.png");





  .tabs-newtab-button:not(:-moz-lwtheme):hover {
    background-image: -moz-linear-gradient(hsla(0,0%,100%,.6), hsla(0,0%,75%,.6) 50%);
  }

  #allTabs-panel,
  #ctrlTab-panel {
    background: transparent;
    -moz-appearance: -moz-win-glass;
    border-radius: 0;
    border: none;
    font: normal 1.2em "Segoe UI";
    color: black;
    text-shadow: white -1px -1px .5em, white -1px 1px .5em, white 1px 1px .5em, white 1px -1px .5em;
  }
}

@media not all and (-moz-windows-compositor) {





  -moz-appearance: none;
  background-color: rgb(228,120,14);
  background-image: -moz-linear-gradient(rgba(255,255,255,.7),
                                         rgba(255,255,255,.4) 10%,
                                         rgba(255,255,255,0) 50%);
  background-clip: padding-box;
  border: 1px solid rgba(0,0,0,.5);
  border-top-style: none;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  -moz-box-shadow: 0 0 5px rgba(255,255,255,.5) inset;
  color: white;
  text-shadow: 0 0 2px #333;
  font-weight: bold;
  padding: .1em 1.5em;
  margin: 0;
}



/* Style Firefox App Menu popup */

.appmenu-edit-button {
  -moz-appearance: none;
  border: 1px solid transparent;
  padding: 2px;
  background: transparent;
  border-radius: 3px;
}

.appmenu-edit-button[disabled="true"] {
  opacity: .3;
}

@media all and (-moz-windows-default-theme) {
  #appmenu-popup {

.toolbarbutton-menubutton-dropmarker,
.toolbarbutton-1 {
  -moz-appearance: none;
  padding: 1px 5px;
  background: rgba(151,152,153,.05)
              -moz-linear-gradient(rgba(251,252,253,.95), rgba(246,247,248,.47) 49%, 
                                   rgba(231,232,233,.45) 51%, rgba(225,226,229,.3));
  background-clip: padding-box;
  border-radius: 4.5px;
  border: 1px solid;
  border-color: rgba(0,0,0,.12) rgba(0,0,0,.19) rgba(0,0,0,.38);
  -moz-box-shadow: 0 0 0 1px rgba(255,255,255,.3) inset,
                   0 0 0 2px rgba(255,255,255,.1) inset,
                   0 1px 0 rgba(0,0,0,.15);
  color: black;
  text-shadow: 0 0 3px white;
}

}

.toolbarbutton-menubutton-dropmarker {
  -moz-border-start-style: none;
}

.toolbarbutton-menubutton-button:-moz-locale-dir(ltr),
.toolbarbutton-menubutton-dropmarker:-moz-locale-dir(rtl) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.toolbarbutton-menubutton-button:-moz-locale-dir(rtl),
.toolbarbutton-menubutton-dropmarker:-moz-locale-dir(ltr) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.toolbarbutton-menubutton-button[disabled="true"],
.toolbarbutton-menubutton-dropmarker[disabled="true"],
.toolbarbutton-1[disabled="true"] {
  opacity: .8;
}


}

#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
#forward-button:-moz-locale-dir(rtl) {
  -moz-transform: scaleX(-1);
}

#back-button:-moz-locale-dir(ltr) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

#back-button:-moz-locale-dir(rtl),
#forward-button {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

toolbar:not([iconsize="small"])[mode="icons"] #back-button {
  border-radius: 100%;
  padding: 0;
  width: 30px;
  height: 30px;
  position: relative;
  z-index: 1;
  margin-top: -2px;
  margin-bottom: -2px;
  border: none;


#urlbar,
.searchbar-textbox {
  -moz-appearance: none;
  margin: 1px 3px;
  padding: 2px;
  background-clip: padding-box;
  border: 1px solid ThreeDDarkShadow;
  border-radius: 4px;
  -moz-box-shadow: 0 1px 0 rgba(0,0,0,.1) inset,
                   0 1px 0 rgba(255,255,255,.4);
}

@media all and (-moz-windows-default-theme) {
  #urlbar,
  .searchbar-textbox {
    @navbarTextboxCustomBorder@

}

/* identity box */

#identity-box {
  background-color: -moz-dialog;
  background-image: -moz-linear-gradient(rgba(255,255,255,.25), rgba(0,0,0,.15));
  color: -moz-dialogText;
  border-radius: 2px;
}

#identity-box:hover {
  background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(50%,50%,50%,.2), rgba(0,0,0,.15));
}

#identity-box[open="true"],
#identity-box:hover:active {

  -moz-appearance: none;
  background: -moz-linear-gradient(hsla(0,0%,50%,.1), hsla(0,0%,37%,.1) 50%);
  background-position: -5px -2px;
  background-repeat: no-repeat;
  background-size: 200%;
  margin: 0;
  padding: 0;
  -moz-border-image: url(tabbrowser/tab.png) 4 5 3 6 / 4px 5px 3px 6px;
  border-radius: 10px 8px 0 0;
}

.tabbrowser-tab:hover,
.tabs-newtab-button:hover {
  background-image: -moz-linear-gradient(hsla(0,0%,100%,.4), hsla(0,0%,75%,.4) 50%);
}

.tabbrowser-tab[selected="true"] {


/* ::::: Keyboard UI Panel ::::: */

.KUI-panel {
  -moz-appearance: none;
  background: rgba(27%,27%,27%,.9) url(KUI-background.png) repeat-x;
  color: white;
  border-style: none;
  border-radius: 20px;
}

.KUI-panel[level="top"] {
  background-color: rgba(27%,27%,27%,.65);
}

.KUI-panel-closebutton {
  list-style-image: url(KUI-close.png);


.ctrlTab-preview-inner {
  padding-bottom: 10px;
}

#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
  padding: 10px;
  background-color: rgba(255,255,255,.2);
  border-radius: .5em;
}

.ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
  color: white;
  background-color: rgba(0,0,0,.6);
  text-shadow: none;
  padding: 8px;
  border: 2px solid white;
  border-radius: .5em;
}

.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
  margin: -10px -10px 0;
}

#ctrlTab-showAll {
  margin-top: .5em;

  width: 22px;
  height: 22px;
  padding-top: 1px;
  padding-bottom: 5px;
  -moz-padding-start: 1px;
  -moz-padding-end: 5px;
  margin-top: -2px;
  -moz-margin-start: -2px;
  border-bottom-right-radius: 4px;
}

.allTabs-favicon[src]:-moz-locale-dir(rtl) {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 4px;
}

.allTabs-preview-inner > .tabPreview-canvas {
  background-color: rgb(60%,60%,60%);
  -moz-box-shadow: 0 0 2px ThreeDShadow;
}

.allTabs-preview:not(:hover):not([closebuttonhover]) > html|canvas {





  padding: 3em;
  -moz-padding-start: 30px;
  margin: 2em auto;
  background: -moz-Field;
}

#feedHeaderContainer {
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  margin: -4em auto 0 auto;
  background-color: InfoBackground;
}

#feedHeader {  
  margin-top: 4.9em;
  margin-bottom: 1em;
  -moz-margin-start: 1.4em;





  -moz-appearance: toolbox;
  padding: 2px 0;
  -moz-padding-end: 3px;
}

#organizerScopeBar > toolbarbutton {
  -moz-appearance: none;
  border: 1px solid transparent;
  border-radius: 2px;
  padding: 0 !important;
  margin: 0 1px;
}

#organizerScopeBar > toolbarbutton > .toolbarbutton-icon {
  padding: 0;
  margin: 0;
}





}

#cookiesChildren::-moz-tree-image(domainCol, container, open) {
  -moz-image-region: rect(16px, 32px, 32px, 16px);
}

#cookieInfoBox {
  border: 1px solid ThreeDShadow;
  border-radius: 0;
  margin: 4px;
  padding: 0;
}

/* Advanced Pane */

/* Adding padding-bottom prevents the bottom of the tabpanel from being cutoff
   when browser.preferences.animateFadeIn = true */





  color: #111;
}


/* Sanitize everything warning box */
#sanitizeEverythingWarningBox {
  background-color: Window;
  border: 1px solid ThreeDDarkShadow;
  border-radius: 5px;
  padding: 16px;
}

#sanitizeEverythingWarningIcon {
  list-style-image: url("chrome://global/skin/icons/warning-large.png");
  padding: 0;
  margin: 0;
}





}


.accountChoiceButton,
.mergeChoiceButton {
  -moz-appearance: none;
  border: #999999 1px solid !important;
  padding: 2px 3px;
  border-radius: 6px;
  background-color: menu;
  -moz-box-shadow:
    inset rgba(255, 255, 255, 0.5) 0 1px 0px,
    inset rgba(0, 0, 0, 0.1) 0 -2px 0px,
    rgba(0, 0, 0, 0.1) 0px 1px 0px;
}

.accountChoiceButton:hover,


.mergeChoiceButtonBox {
  padding: 0.2em;
}

.success,
.error {
  padding: 2px;
  border-radius: 2px;
}

.error {
  background-color: #FF0000 !important;
  color: #FFFFFF !important;
}

.success {





  z-index: -999999;
}

.newTabButtonAlt {
  position: absolute;
  cursor: pointer;
  z-index: 99999;
  border: none;
  border-radius: 4px;
  font-size: 50px;
  line-height: 50px;
  height: 57px !important;
  width: 70px !important;
  margin-top: 4px !important;
  text-align: center;
  background-color: #B9CDEB;
  -moz-box-shadow: inset 0px 0px 5px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.3);

  text-shadow: 0px 0px 7px rgba(0,0,0,.4), 0 -1px 0 rgba(255,255,255,.6);
  font-weight: bold;
}

.newTabGroup {
  background-color: #D9E7FC;
  border: none;
  border-top: 1px solid rgba(127,127,127,.5);
  border-radius: 0.1em;
  -moz-box-shadow: inset 0px 5px 10px rgba(0,0,0,.1);
}

.inNewTabGroup .favicon {
  background-color: #D9E7FC;
  -moz-box-shadow: none;
}


(-)a/layout/base/crashtests/265736-2.html (-1 / +1 lines)

Line	Link Here

Lines 1-8	Link Here

<html>

<html>

<head>

<head>

</head>

</head>

<body>

<body>

<iframe style="border-top-width: 31378748; -moz-border-radius-bottomright: 23895784; ">

<iframe style="border-top-width: 31378748; border-bottom-right-radius: 23895784; ">

</body>

</body>

</html>

</html>





      shadowContext->NewPath();
      if (hasBorderRadius) {
        gfxCornerSizes clipRectRadii;
        gfxFloat spreadDistance = -shadowItem->mSpread / twipsPerPixel;
        gfxFloat borderSizes[4] = { 0, 0, 0, 0 };

        // We only give the spread radius to corners with a radius on them, otherwise we'll
        // give a rounded shadow corner to a frame corner with 0 border radius, should
        // the author use non-uniform border radii sizes (border-top-left-radius etc)
        // (bug 514670)
        if (borderRadii[C_TL].width > 0 || borderRadii[C_BL].width > 0) {
          borderSizes[NS_SIDE_LEFT] = spreadDistance;
        }

        if (borderRadii[C_TL].height > 0 || borderRadii[C_TR].height > 0) {
          borderSizes[NS_SIDE_TOP] = spreadDistance;
        }






input[type="radio"] {
/*  -moz-appearance: radio; */
  margin: 1px 0px;
  border-top: 1px solid ThreeDShadow;
  border-right: 1px solid ThreeDHighlight;
  border-bottom: 1px solid ThreeDHighlight;
  border-left: 1px solid ThreeDShadow;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  background-color: -moz-Field;
}

xul|*.input-radio-check-box2 {
  border-top: 1px solid ThreeDDarkShadow;
  border-right: 1px solid ThreeDLightShadow;
  border-bottom: 1px solid ThreeDLightShadow;
  border-left: 1px solid ThreeDDarkShadow;
  border-radius: 50%;
  padding: 2px;
  width: 4px;
  height: 4px;
  list-style-image: none;
}

input[type="radio"]:hover:active {
  background-color: -moz-Dialog;





<html><head>
<title>Circular border</title>
<style>
body { margin: 0 }
div {
  margin-left: 8px; margin-top: 8px;
  width: 50px; height: 50px; 
  border: 10px solid black; 
  border-radius: 10px;
}
div > div {
  margin: 0; width: 50px; height: 50px;
  border-radius: 0;
  background: black;
  border: none;
}
</style>
</head>
<body><div><div></div></div></body></html>

(-)a/layout/reftests/border-radius/border-circle.html (-1 / +1 lines)

Line	Link Here

Lines 1-11	Link Here

<!doctype html>

<!doctype html>

<html><head>

<html><head>

<title>Circular border</title>

<title>Circular border</title>

<style>

<style>

div { width: 50px; height: 50px;

div { width: 50px; height: 50px;

      border: 10px solid black;

      border: 10px solid black;

      -moz-border-radius: 10px;

      border-radius: 10px;

</style>

</style>

</head>

</head>

<body><div></div></body></html>

<body><div></div></body></html>

(-)a/layout/reftests/border-radius/border-ellips.html (-1 / +1 lines)

Line	Link Here

Lines 1-11	Link Here

<!doctype html>

<!doctype html>

<html><head>

<html><head>

<title>Elliptical border</title>

<title>Elliptical border</title>

<style>

<style>

div { width: 50px; height: 50px;

div { width: 50px; height: 50px;

      border: 10px solid black;

      border: 10px solid black;

      -moz-border-radius: 10px / 20px;

      border-radius: 10px / 20px;

</style>

</style>

</head>

</head>

<body><div></div></body></html>

<body><div></div></body></html>





            box-sizing: border-box;
            width: 60px;
            height: 20px;
            border: 2px solid black;
            background: green;
            position: absolute;
            top: 12px;
            left: 12px;
            border-radius: 4px 16px 4px 16px;
          }
    </style>
  </head>
  <body>
    <div></div>
  </body>
</html>





            box-sizing: border-box;
            width: 60px;
            height: 20px;
            border: 2px solid black;
            background: green;
            position: absolute;
            top: 12px;
            left: 12px;
            border-radius: 5px 20px 5px 20px;
          }
    </style>
  </head>
  <body>
    <div></div>
  </body>
</html>





  <head>
    <title>Test different types of values with border radius</title>
    <!-- This bug will break when bug 451134 is fixed -->
    <style>
      div { width: 200px;
            height: 200px;
            background: green;
            border: 10px dashed black;
            border-top-left-radius: 2em 10px;
            border-top-right-radius: 10px 0.5em;
            border-bottom-right-radius: 3em 10px;
            border-bottom-left-radius: 10px 0.5em;
          }

</style>
</head>
<body>
  <div></div>
</body></html>

(-)a/layout/reftests/border-radius/border-value-interpret.html (-1 / +1 lines)

Line	Link Here

Lines 4-18	Link Here

    <title>Test different types of values with border radius</title>

    <title>Test different types of values with border radius</title>

    <style>

    <style>

      div { width: 200px;

      div { width: 200px;

            height: 200px;

            height: 200px;

            background: green;

            background: green;

            border: 10px dashed black}

            border: 10px dashed black}

      /* Test interpreted values */

      /* Test interpreted values */

      #test1 { -moz-border-radius: 2em 10px 3em / 10px 0.5em }

      #test1 { border-radius: 2em 10px 3em / 10px 0.5em }

</style>

</style>

</head>

</head>

<body>

<body>

  <div id="test1"></div>

  <div id="test1"></div>

</body></html>

</body></html>





<!doctype html>
<html><head>
<title>Border clipping</title>
<style>
.div1 { width: 50px; height: 50px;
      border: 10px solid black; 
      border-radius: 20px;
      position: fixed;
      left: 50px;
      top: 50px;
}

.div2 {
      width: 40px; height: 40px;
      border: 10px solid black;
      background: black; 
      border-radius: 10px;
      position: fixed;
      left: 55px;
      top: 55px;
}

</style>
</head>
<body>

(-)a/layout/reftests/border-radius/clipping-1.html (-1 / +1 lines)

Line	Link Here

Lines 1-15	Link Here

<!doctype html>

<!doctype html>

<html><head>

<html><head>

<title>Border clipping</title>

<title>Border clipping</title>

<style>

<style>

.div1 { width: 50px; height: 50px;

.div1 { width: 50px; height: 50px;

      border: 10px solid black;

      border: 10px solid black;

      -moz-border-radius: 20px;

      border-radius: 20px;

      position: absolute;

      position: absolute;

      background: black;

      background: black;

      left: 50px;

      left: 50px;

      top: 50px;

      top: 50px;

      background-clip: padding-box;

      background-clip: padding-box;

</style>

</style>





<!doctype html>
<html><head>
<title>Border clipping</title>
<style>
.div1 { width: 50px; height: 50px;
      border: 4px dotted black; 
      border-radius: 10px;
      position: fixed;
      background: red;
      left: 50px;
      top: 50px;
      background-clip: padding-box;
}

.div2 { width: 50px; height: 50px;
      border: 4px dotted black; 
      border-radius: 10px;
      position: fixed;
      background: red;
      left: 50px;
      top: 140px;
      background-clip: border-box;
}

</style>





}

.div2 { width: 50px; height: 50px;
      border: 10px solid red; 
      position: fixed;
      background: red;
      left: 80px;
      top: 80px;
      border-radius: 10px;
}

</style>
</head>
<body>
  <div class="div1"/>
  <div class="div2"/>
</body></html>

(-)a/layout/reftests/border-radius/corner-1.html (-1 / +1 lines)

Line	Link Here

Lines 1-15	Link Here

<!doctype html>

<!doctype html>

<html><head>

<html><head>

<title>Corners different</title>

<title>Corners different</title>

<style>

<style>

.div1 { width: 50px; height: 50px;

.div1 { width: 50px; height: 50px;

      border: 10px solid black;

      border: 10px solid black;

      -moz-border-radius: 10px 10px 6px 6px;

      border-radius: 10px 10px 6px 6px;

      position: absolute;

      position: absolute;

      background: black;

      background: black;

      left: 50px;

      left: 50px;

      top: 50px;

      top: 50px;

</style>

</style>

</head>

</head>

(-)a/layout/reftests/border-radius/corner-2.html (-1 / +1 lines)

Line	Link Here

Lines 1-15	Link Here

<!doctype html>

<!doctype html>

<html><head>

<html><head>

<title>Corners different</title>

<title>Corners different</title>

<style>

<style>

.div1 { width: 50px; height: 50px;

.div1 { width: 50px; height: 50px;

      border: 10px solid black;

      border: 10px solid black;

      -moz-border-radius: 10px 6px 6px 10px;

      border-radius: 10px 6px 6px 10px;

      position: absolute;

      position: absolute;

      background: black;

      background: black;

      left: 50px;

      left: 50px;

      top: 50px;

      top: 50px;

</style>

</style>

</head>

</head>






<head>
 <title>testcase for bug #382721</title>
<style>
 div {
	background: beige;
	margin: 1ex;
	padding: 1ex;
	border-radius: 3ex;
	}
</style>
<script>
 function ini() {
  var s,i,d;
  s=['none','hidden','dotted','dashed','solid',
     'double','groove','ridge','inset','outset'];
  for (i=0; i<s.length; i++) {

(-)a/layout/reftests/border-radius/curved-stripe-border.html (-1 / +1 lines)

Line	Link Here

Lines 3-17	Link Here

<title>Curved stripe border (HTML)</title>

<title>Curved stripe border (HTML)</title>

<style>

<style>

body { margin: 0 }

body { margin: 0 }

div {

div {

  -moz-box-sizing: border-box;

  -moz-box-sizing: border-box;

  width: 180px;

  width: 180px;

  height: 180px;

  height: 180px;

  border: 30px double black;

  border: 30px double black;

  -moz-border-radius: 60px / 40px;

  border-radius: 60px / 40px;

  margin: 20px;

  margin: 20px;

</style>

</style>

</head><body>

</head><body>

<div></div>

<div></div>

</body></html>

</body></html>





<!doctype html>
<html><head>
<title>Border-radius inheritance</title>
<style>
.div1 { width: 100px; height: 100px;
      border: 10px solid black; 
      border-radius: 10px;
      left: 50px;
      top: 50px;
}

div > div {
  width: 40px; height: 40px;
  border: 10px solid black;
  position: absolute;
  border-radius: 0px;
  left: 40px;
  top: 40px;
}

</style>
</head>
<body>
  <div class="div1"><div></div></div>

(-)a/layout/reftests/border-radius/inherit-1.html (-1 / +1 lines)

Line	Link Here

Lines 1-15	Link Here

<!doctype html>

<!doctype html>

<html><head>

<html><head>

<title>Border-radius inheritance</title>

<title>Border-radius inheritance</title>

<style>

<style>

.div1 { width: 100px; height: 100px;

.div1 { width: 100px; height: 100px;

      border: 10px solid black;

      border: 10px solid black;

      -moz-border-radius: 10px;

      border-radius: 10px;

      left: 50px;

      left: 50px;

      top: 50px;

      top: 50px;

div > div {

div > div {

  width: 40px; height: 40px;

  width: 40px; height: 40px;

  border: 10px solid black;

  border: 10px solid black;

  position: absolute;

  position: absolute;

(-)a/layout/reftests/border-radius/invalidate-1-ref.html (-1 / +1 lines)

Line	Link Here

Lines 1-7	Link Here

<!DOCTYPE HTML>

<!DOCTYPE HTML>

<html>

<html>

<body>

<body>

<div id="d" style="background:blue; -moz-border-radius:50px; width:200px; height:200px;">

<div id="d" style="background:blue; border-radius:50px; width:200px; height:200px;">

</div>

</div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/border-radius/invalidate-1a.html (-1 / +1 lines)

Line	Link Here

Lines 1-12	Link Here

<!DOCTYPE HTML>

<!DOCTYPE HTML>

<html class="reftest-wait">

<html class="reftest-wait">

<body>

<body>

<div id="d" style="background:blue; -moz-border-radius:50px; width:200px; height:100px;">

<div id="d" style="background:blue; border-radius:50px; width:200px; height:100px;">

</div>

</div>

<script>

<script>

function doTest() {

function doTest() {

  var d = document.getElementById("d");

  var d = document.getElementById("d");

  d.style.height = "200px";

  d.style.height = "200px";

  document.documentElement.className = "";

  document.documentElement.className = "";

window.addEventListener("MozReftestInvalidate", doTest, false);

window.addEventListener("MozReftestInvalidate", doTest, false);

(-)a/layout/reftests/border-radius/invalidate-1b.html (-1 / +1 lines)

Line	Link Here

Lines 1-12	Link Here

<!DOCTYPE HTML>

<!DOCTYPE HTML>

<html class="reftest-wait">

<html class="reftest-wait">

<body>

<body>

<div id="d" style="background:blue; -moz-border-radius:50px; width:100px; height:200px;">

<div id="d" style="background:blue; border-radius:50px; width:100px; height:200px;">

</div>

</div>

<script>

<script>

function doTest() {

function doTest() {

  var d = document.getElementById("d");

  var d = document.getElementById("d");

  d.style.width = "200px";

  d.style.width = "200px";

  document.documentElement.className = "";

  document.documentElement.className = "";

window.addEventListener("MozReftestInvalidate", doTest, false);

window.addEventListener("MozReftestInvalidate", doTest, false);

(-)a/layout/reftests/border-radius/percent-1-ref.html (-16 / +16 lines)

Line	Link Here

Lines 2-33	Link Here

<html><head><title>Border radius with percent units &mdash; reference</title>

<html><head><title>Border radius with percent units &mdash; reference</title>

<style>

<style>

div { background: green; }

div { background: green; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r1.c1 { -moz-border-radius:  5px /  5px; }

.r1.c1 { border-radius:  5px /  5px; }

.r1.c2 { -moz-border-radius: 10px /  5px; }

.r1.c2 { border-radius: 10px /  5px; }

.r1.c3 { -moz-border-radius: 15px /  5px; }

.r1.c3 { border-radius: 15px /  5px; }

.r1.c4 { -moz-border-radius: 20px /  5px; }

.r1.c4 { border-radius: 20px /  5px; }

.r2.c1 { -moz-border-radius:  5px / 10px; }

.r2.c1 { border-radius:  5px / 10px; }

.r2.c2 { -moz-border-radius: 10px / 10px; }

.r2.c2 { border-radius: 10px / 10px; }

.r2.c3 { -moz-border-radius: 15px / 10px; }

.r2.c3 { border-radius: 15px / 10px; }

.r2.c4 { -moz-border-radius: 20px / 10px; }

.r2.c4 { border-radius: 20px / 10px; }

.r3.c1 { -moz-border-radius:  5px / 15px; }

.r3.c1 { border-radius:  5px / 15px; }

.r3.c2 { -moz-border-radius: 10px / 15px; }

.r3.c2 { border-radius: 10px / 15px; }

.r3.c3 { -moz-border-radius: 15px / 15px; }

.r3.c3 { border-radius: 15px / 15px; }

.r3.c4 { -moz-border-radius: 20px / 15px; }

.r3.c4 { border-radius: 20px / 15px; }

.r4.c1 { -moz-border-radius:  5px / 20px; }

.r4.c1 { border-radius:  5px / 20px; }

.r4.c2 { -moz-border-radius: 10px / 20px; }

.r4.c2 { border-radius: 10px / 20px; }

.r4.c3 { -moz-border-radius: 15px / 20px; }

.r4.c3 { border-radius: 15px / 20px; }

.r4.c4 { -moz-border-radius: 20px / 20px; }

.r4.c4 { border-radius: 20px / 20px; }

</style>

</style>

</head><body>

</head><body>

<table>

<table>

  <tr>

  <tr>

    <td><div class="r1 c1"></div></td>

    <td><div class="r1 c1"></div></td>

    <td><div class="r1 c2"></div></td>

    <td><div class="r1 c2"></div></td>

    <td><div class="r1 c3"></div></td>

    <td><div class="r1 c3"></div></td>

(-)a/layout/reftests/border-radius/percent-1.html (-1 / +1 lines)

Line	Link Here

Lines 1-12	Link Here

<!doctype html>

<!doctype html>

<html><head><title>Border radius with percent units &mdash; test</title>

<html><head><title>Border radius with percent units &mdash; test</title>

<style>

<style>

div { -moz-border-radius: 25%; background: green; }

div { border-radius: 25%; background: green; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r4 { height: 80px; } .c4 { width: 80px; }

</style>

</style>

</head><body>

</head><body>

<table>

<table>

  <tr>

  <tr>

(-)a/layout/reftests/border-radius/percent-2-ref.html (-16 / +16 lines)

Line	Link Here

Lines 2-33	Link Here

<html><head><title>Border radius with percent units &mdash; reference</title>

<html><head><title>Border radius with percent units &mdash; reference</title>

<style>

<style>

div { background: green; }

div { background: green; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r1.c1 { -moz-border-radius:  5px 2px /  5px 2px; }

.r1.c1 { border-radius:  5px 2px /  5px 2px; }

.r1.c2 { -moz-border-radius: 10px 4px /  5px 2px; }

.r1.c2 { border-radius: 10px 4px /  5px 2px; }

.r1.c3 { -moz-border-radius: 15px 6px /  5px 2px; }

.r1.c3 { border-radius: 15px 6px /  5px 2px; }

.r1.c4 { -moz-border-radius: 20px 8px /  5px 2px; }

.r1.c4 { border-radius: 20px 8px /  5px 2px; }

.r2.c1 { -moz-border-radius:  5px 2px / 10px 4px; }

.r2.c1 { border-radius:  5px 2px / 10px 4px; }

.r2.c2 { -moz-border-radius: 10px 4px / 10px 4px; }

.r2.c2 { border-radius: 10px 4px / 10px 4px; }

.r2.c3 { -moz-border-radius: 15px 6px / 10px 4px; }

.r2.c3 { border-radius: 15px 6px / 10px 4px; }

.r2.c4 { -moz-border-radius: 20px 8px / 10px 4px; }

.r2.c4 { border-radius: 20px 8px / 10px 4px; }

.r3.c1 { -moz-border-radius:  5px 2px / 15px 6px; }

.r3.c1 { border-radius:  5px 2px / 15px 6px; }

.r3.c2 { -moz-border-radius: 10px 4px / 15px 6px; }

.r3.c2 { border-radius: 10px 4px / 15px 6px; }

.r3.c3 { -moz-border-radius: 15px 6px / 15px 6px; }

.r3.c3 { border-radius: 15px 6px / 15px 6px; }

.r3.c4 { -moz-border-radius: 20px 8px / 15px 6px; }

.r3.c4 { border-radius: 20px 8px / 15px 6px; }

.r4.c1 { -moz-border-radius:  5px 2px / 20px 8px; }

.r4.c1 { border-radius:  5px 2px / 20px 8px; }

.r4.c2 { -moz-border-radius: 10px 4px / 20px 8px; }

.r4.c2 { border-radius: 10px 4px / 20px 8px; }

.r4.c3 { -moz-border-radius: 15px 6px / 20px 8px; }

.r4.c3 { border-radius: 15px 6px / 20px 8px; }

.r4.c4 { -moz-border-radius: 20px 8px / 20px 8px; }

.r4.c4 { border-radius: 20px 8px / 20px 8px; }

</style>

</style>

</head><body>

</head><body>

<table>

<table>

  <tr>

  <tr>

    <td><div class="r1 c1"></div></td>

    <td><div class="r1 c1"></div></td>

    <td><div class="r1 c2"></div></td>

    <td><div class="r1 c2"></div></td>

    <td><div class="r1 c3"></div></td>

    <td><div class="r1 c3"></div></td>

(-)a/layout/reftests/border-radius/percent-2.html (-1 / +1 lines)

Line	Link Here

Lines 1-12	Link Here

<!doctype html>

<!doctype html>

<html><head><title>Border radius with percent units &mdash; test</title>

<html><head><title>Border radius with percent units &mdash; test</title>

<style>

<style>

div { -moz-border-radius: 25% 10%; background: green; }

div { border-radius: 25% 10%; background: green; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r4 { height: 80px; } .c4 { width: 80px; }

</style>

</style>

</head><body>

</head><body>

<table>

<table>

  <tr>

  <tr>

(-)a/layout/reftests/border-radius/percent-3-ref.html (-16 / +16 lines)

Line	Link Here

Lines 2-33	Link Here

<html><head><title>Border radius with percent units &mdash; reference</title>

<html><head><title>Border radius with percent units &mdash; reference</title>

<style>

<style>

div { background: green; }

div { background: green; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r1.c1 { -moz-border-radius:  5px / 2px; }

.r1.c1 { border-radius:  5px / 2px; }

.r1.c2 { -moz-border-radius: 10px / 2px; }

.r1.c2 { border-radius: 10px / 2px; }

.r1.c3 { -moz-border-radius: 15px / 2px; }

.r1.c3 { border-radius: 15px / 2px; }

.r1.c4 { -moz-border-radius: 20px / 2px; }

.r1.c4 { border-radius: 20px / 2px; }

.r2.c1 { -moz-border-radius:  5px / 4px; }

.r2.c1 { border-radius:  5px / 4px; }

.r2.c2 { -moz-border-radius: 10px / 4px; }

.r2.c2 { border-radius: 10px / 4px; }

.r2.c3 { -moz-border-radius: 15px / 4px; }

.r2.c3 { border-radius: 15px / 4px; }

.r2.c4 { -moz-border-radius: 20px / 4px; }

.r2.c4 { border-radius: 20px / 4px; }

.r3.c1 { -moz-border-radius:  5px / 6px; }

.r3.c1 { border-radius:  5px / 6px; }

.r3.c2 { -moz-border-radius: 10px / 6px; }

.r3.c2 { border-radius: 10px / 6px; }

.r3.c3 { -moz-border-radius: 15px / 6px; }

.r3.c3 { border-radius: 15px / 6px; }

.r3.c4 { -moz-border-radius: 20px / 6px; }

.r3.c4 { border-radius: 20px / 6px; }

.r4.c1 { -moz-border-radius:  5px / 8px; }

.r4.c1 { border-radius:  5px / 8px; }

.r4.c2 { -moz-border-radius: 10px / 8px; }

.r4.c2 { border-radius: 10px / 8px; }

.r4.c3 { -moz-border-radius: 15px / 8px; }

.r4.c3 { border-radius: 15px / 8px; }

.r4.c4 { -moz-border-radius: 20px / 8px; }

.r4.c4 { border-radius: 20px / 8px; }

</style>

</style>

</head><body>

</head><body>

<table>

<table>

  <tr>

  <tr>

    <td><div class="r1 c1"></div></td>

    <td><div class="r1 c1"></div></td>

    <td><div class="r1 c2"></div></td>

    <td><div class="r1 c2"></div></td>

    <td><div class="r1 c3"></div></td>

    <td><div class="r1 c3"></div></td>

(-)a/layout/reftests/border-radius/percent-3.html (-1 / +1 lines)

Line	Link Here

Lines 1-12	Link Here

<!doctype html>

<!doctype html>

<html><head><title>Border radius with percent units &mdash; test</title>

<html><head><title>Border radius with percent units &mdash; test</title>

<style>

<style>

div { -moz-border-radius: 25% / 10%; background: green; }

div { border-radius: 25% / 10%; background: green; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r1 { height: 20px; } .c1 { width: 20px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r2 { height: 40px; } .c2 { width: 40px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r3 { height: 60px; } .c3 { width: 60px; }

.r4 { height: 80px; } .c4 { width: 80px; }

.r4 { height: 80px; } .c4 { width: 80px; }

</style>

</style>

</head><body>

</head><body>

<table>

<table>

  <tr>

  <tr>

(-)a/layout/reftests/border-radius/table-collapse-1.html (-1 / +1 lines)

Line	Link Here

Lines 6-22 table {	Link Here

  border: 2px solid black;

  border: 2px solid black;

  border-collapse: collapse;

  border-collapse: collapse;

td {

td {

  border: 2px solid black;

  border: 2px solid black;

  width: 50px;

  width: 50px;

  height: 50px;

  height: 50px;

  -moz-border-radius: 4px;

  border-radius: 4px;

</style>

</style>

</head>

</head>

<body>

<body>

  <table>

  <table>

    <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>

    <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>

    <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>

    <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>

(-)a/layout/reftests/box-shadow/boxshadow-dynamic-ref.xul (-1 / +1 lines)

Line	Link Here

Lines 1-7	Link Here

<?xml version="1.0"?>

<?xml version="1.0"?>

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<hbox flex="1"

<hbox flex="1"

  style="margin:50px; background:yellow;

  style="margin:50px; background:yellow;

  -moz-box-shadow: 1px 2px 3px black, 0 0 10px white, 0 0 20px rgb(50, 170, 255), 0 0 30px rgb(50, 170, 255);

  -moz-box-shadow: 1px 2px 3px black, 0 0 10px white, 0 0 20px rgb(50, 170, 255), 0 0 30px rgb(50, 170, 255);

  -moz-border-radius: 10px;"/>

  border-radius: 10px;"/>

</window>

</window>






hbox {
  margin: 50px;
  background: yellow;
}

hbox[x] {
  -moz-box-shadow: 1px 2px 3px black, 0 0 10px white, 0 0 20px rgb(50, 170, 255), 0 0 30px rgb(50, 170, 255);
  border-radius: 10px;
}

"?>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        class="reftest-wait">
  
  <script>
  <![CDATA[

(-)a/layout/reftests/box-shadow/boxshadow-inner-basic.html (-1 / +1 lines)

Line	Link Here

Lines 1-8	Link Here

<!doctype html>

<!doctype html>

<div style="

<div style="

  width: 240px; height: 240px;

  width: 240px; height: 240px;

  -moz-border-radius: 8px;

  border-radius: 8px;

  -moz-box-shadow: 32px 32px grey inset;

  -moz-box-shadow: 32px 32px grey inset;

  position: absolute;

  position: absolute;

  top: 16px; left: 16px;

  top: 16px; left: 16px;

"></div>

"></div>

(-)a/layout/reftests/box-shadow/boxshadow-mixed-ref.html (-1 / +1 lines)

Line	Link Here

Line 1	Link Here

<div style="background-color: blue; border: 2px solid red; -moz-border-radius: 10px; width: 300px; height: 300px; position: absolute; top: 10px; left: 10px;">inset and outset</div><div style="-moz-border-radius: 10px; background-color: green; width: 304px; height: 304px; position: absolute; top: 10px; left: 360px;">&nbsp;</div>

<div style="background-color: blue; border: 2px solid red; border-radius: 10px; width: 300px; height: 300px; position: absolute; top: 10px; left: 10px;">inset and outset</div><div style="border-radius: 10px; background-color: green; width: 304px; height: 304px; position: absolute; top: 10px; left: 360px;">&nbsp;</div>

(-)a/layout/reftests/box-shadow/boxshadow-mixed.html (-1 / +1 lines)

Line	Link Here

Line 1	Link Here

<div style="border: 2px red solid; -moz-border-radius: 10px; width: 300px; height: 300px; -moz-box-shadow: 500px 500px 0px 20px blue inset, 350px 0px green; position: absolute; top: 10px; left: 10px;">inset and outset</div>

<div style="border: 2px red solid; border-radius: 10px; width: 300px; height: 300px; -moz-box-shadow: 500px 500px 0px 20px blue inset, 350px 0px green; position: absolute; top: 10px; left: 10px;">inset and outset</div>

(-)a/layout/reftests/box-shadow/boxshadow-onecorner-ref.html (-2 / +2 lines)

Line	Link Here

Lines 1-3	Link Here

<!DOCTYPE HTML>

<!DOCTYPE HTML>

<div style="position: absolute; top: 300px; left: 70px; width: 360px; height: 160px; -moz-border-radius-topright: 40px; background: red;">&nbsp;</div>

<div style="position: absolute; top: 300px; left: 70px; width: 360px; height: 160px; border-top-right-radius: 40px; background: red;">&nbsp;</div>

<div style="position: absolute; top: 30px; left: 100px; width: 300px; height: 100px; -moz-border-radius-topright: 10px; background: yellow;">Test</div>

<div style="position: absolute; top: 30px; left: 100px; width: 300px; height: 100px; border-top-right-radius: 10px; background: yellow;">Test</div>

(-)a/layout/reftests/box-shadow/boxshadow-onecorner.html (-1 / +1 lines)

Line	Link Here

Lines 1-2	Link Here

<!DOCTYPE HTML>

<!DOCTYPE HTML>

<div style="position: absolute; top: 30px; left: 100px; width: 300px; height: 100px; -moz-border-radius-topright: 10px; -moz-box-shadow: 0 300px 0 30px red; background: yellow;">Test</div>

<div style="position: absolute; top: 30px; left: 100px; width: 300px; height: 100px; border-top-right-radius: 10px; -moz-box-shadow: 0 300px 0 30px red; background: yellow;">Test</div>

(-)a/layout/reftests/box-shadow/boxshadow-rounded-spread-ref.html (-1 / +1 lines)

Line	Link Here

Line 1	Link Here

<div style="width: 300px; height: 300px; -moz-border-radius: 100%; position: absolute; top: 20px; left: 20px;">shadow div</div><div style="-moz-border-radius: 100%; width: 320px; height: 320px; background-color: grey; position: absolute; top: 330px; left: 30px;">&nbsp;</div>

<div style="width: 300px; height: 300px; border-radius: 100%; position: absolute; top: 20px; left: 20px;">shadow div</div><div style="border-radius: 100%; width: 320px; height: 320px; background-color: grey; position: absolute; top: 330px; left: 30px;">&nbsp;</div>

(-)a/layout/reftests/box-shadow/boxshadow-rounded-spread.html (-1 / +1 lines)

Line	Link Here

Line 1	Link Here

<div style="-moz-box-shadow: 20px 320px 0 10px grey; width: 300px; height: 300px; -moz-border-radius: 100%; position: absolute; top: 20px; left: 20px;">shadow div</div>

<div style="-moz-box-shadow: 20px 320px 0 10px grey; width: 300px; height: 300px; border-radius: 100%; position: absolute; top: 20px; left: 20px;">shadow div</div>

(-)a/layout/reftests/bugs/24998-1-ref.html (-1 / +1 lines)

Line	Link Here

Lines 1-12	Link Here

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

  <head>

  <head>

    <title>-moz-border-radius background image clipping (bug 24998)</title>

    <title>border-radius background image clipping (bug 24998)</title>

    <style type="text/css">

    <style type="text/css">

      div {

      div {

        height: 100px;

        height: 100px;

        width: 100px;

        width: 100px;

	background-color: #0000ff;

	background-color: #0000ff;

    </style>

    </style>

  </head>

  </head>





<!DOCTYPE html>
<html>
  <head>
    <title>border-radius background image clipping (bug 24998)</title>
    <style type="text/css">
      div {
        height: 100px;
        width: 100px;
        border-radius: 100px;
        /* this must be bigger than 1x1 */
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACEAIAAACtREYwAAAACXBIWXMAAABIAAAASABGyWs+AAAACXZwQWcAAAACAAAAAgBqLH6AAAAAGUlEQVQI12NkYGBg+P+fgYGBgYGBiQEJAAApJQICMg0uAAAAAABJRU5ErkJggg==);
      }
    </style>
  </head>
  <body>
    <div></div>
  </body>

(-)a/layout/reftests/bugs/364861-1-ref.html (-1 / +1 lines)

Line	Link Here

Lines 2-13	Link Here

<html>

<html>

  <body>

  <body>

    <div style="background: black;

    <div style="background: black;

                background-clip: padding-box;

                background-clip: padding-box;

                width: 400px;

                width: 400px;

                padding: 0;

                padding: 0;

                height: 300px;

                height: 300px;

                border: 100px solid rgba(255, 255, 0, 0.5);

                border: 100px solid rgba(255, 255, 0, 0.5);

                -moz-border-radius: 240px / 200px">

                border-radius: 240px / 200px">

    </div>

    </div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/364861-1.html (-1 / +1 lines)

Line	Link Here

Lines 2-13	Link Here

<html>

<html>

  <body>

  <body>

    <div style="background: black;

    <div style="background: black;

                background-clip: padding-box;

                background-clip: padding-box;

                width: 400px;

                width: 400px;

                padding: 0;

                padding: 0;

                height: 300px;

                height: 300px;

                border: 100px solid rgba(255, 255, 0, 0.5);

                border: 100px solid rgba(255, 255, 0, 0.5);

                -moz-border-radius: 40.0%">

                border-radius: 40.0%">

    </div>

    </div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/368247-1-ref.html (-2 / +2 lines)

Line	Link Here

Lines 3-15	Link Here

<style type="text/css">

<style type="text/css">

div {

div {

  width: 64px;

  width: 64px;

  height: 64px;

  height: 64px;

  border: 64px solid blue;

  border: 64px solid blue;

</style>

</style>

  <body>

  <body>

<div style="height: 0; border-bottom: 0; -moz-border-radius-topleft: 64px; -moz-border-radius-topright: 64px;"></div>

<div style="height: 0; border-bottom: 0; border-top-left-radius: 64px; border-top-right-radius: 64px;"></div>

<div style="height: 64px; border-width: 0 64px;"></div>

<div style="height: 64px; border-width: 0 64px;"></div>

<div style="height: 0; border-top: 0; -moz-border-radius-bottomleft: 64px; -moz-border-radius-bottomright: 64px;"></div>

<div style="height: 0; border-top: 0; border-bottom-left-radius: 64px; border-bottom-right-radius: 64px;"></div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/368247-1.html (-1 / +1 lines)

Line	Link Here

Lines 3-13	Link Here

<style type="text/css">

<style type="text/css">

div {

div {

  width: 64px;

  width: 64px;

  height: 64px;

  height: 64px;

  border: 64px solid blue;

  border: 64px solid blue;

</style>

</style>

  <body>

  <body>

<div style="-moz-border-radius: 64px"></div>

<div style="border-radius: 64px"></div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/368247-2-ref.html (-1 / +1 lines)

Line	Link Here

Lines 3-13	Link Here

<style type="text/css">

<style type="text/css">

div {

div {

  width: 64px;

  width: 64px;

  height: 64px;

  height: 64px;

  border: 64px solid blue;

  border: 64px solid blue;

</style>

</style>

  <body>

  <body>

<div style="-moz-border-radius: 256px"></div>

<div style="border-radius: 256px"></div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/368247-2.html (-1 / +1 lines)

Line	Link Here

Lines 3-13	Link Here

<style type="text/css">

<style type="text/css">

div {

div {

  width: 64px;

  width: 64px;

  height: 64px;

  height: 64px;

  border: 64px solid blue;

  border: 64px solid blue;

</style>

</style>

  <body>

  <body>

<div style="-moz-border-radius: 128px"></div>

<div style="border-radius: 128px"></div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/384576-1.html (-1 / +1 lines)

Line	Link Here

Lines 1-14	Link Here

<html>

<html>

  <style type="text/css">

  <style type="text/css">

    div.test {

    div.test {

      background-color: red;

      background-color: red;

      margin: 5em;

      margin: 5em;

      -moz-border-radius: 10px;

      border-radius: 10px;

    div > div {

    div > div {

      background-color: green;

      background-color: green;

  </style>

  </style>

  <body>

  <body>

    <div class="test"><div>&nbsp;</div></div>

    <div class="test"><div>&nbsp;</div></div>

(-)a/layout/reftests/bugs/399258-1.html (-1 / +1 lines)

Line	Link Here

Lines 1-9	Link Here

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

<body>

<body>

<div style="position:absolute; border: 20px solid black;

<div style="position:absolute; border: 20px solid black;

            left: -50px; top: -50px; width: 3000px; height: 3000px;

            left: -50px; top: -50px; width: 3000px; height: 3000px;

            -moz-border-radius: 160px; clip:rect(50px 60px 60px 50px);">

            border-radius: 160px; clip:rect(50px 60px 60px 50px);">

</div>

</div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/bugs/438537-1-ref.html (-1 / +1 lines)

Line	Link Here

Lines 1-10	Link Here

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

  <head>

  <head>

    <title>Testcase, bug 438537</title>

    <title>Testcase, bug 438537</title>

  </head>

  </head>

  <body>

  <body>

    <div style="height:40px;border:solid 2px black;-moz-border-radius: 8px;overflow:hidden">

    <div style="height:40px;border:solid 2px black;border-radius: 8px;overflow:hidden">

    </div>

    </div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/438537-1.html (-1 / +1 lines)

Line	Link Here

Lines 7-18	Link Here

        function() {

        function() {

          var div = document.getElementById("div");

          var div = document.getElementById("div");

          div.style.height = "40px";

          div.style.height = "40px";

          document.documentElement.className = "";

          document.documentElement.className = "";

        }, false);

        }, false);

    </script>

    </script>

  </head>

  </head>

  <body>

  <body>

    <div id="div" style="height:20px;border:solid 2px black;-moz-border-radius: 8px;overflow:hidden">

    <div id="div" style="height:20px;border:solid 2px black;border-radius: 8px;overflow:hidden">

    </div>

    </div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/456219-1-ref.html (-5 / +5 lines)

Line	Link Here

Lines 10-30 td { width: 110px; height: 110px; text-a	Link Here

div.i {

div.i {

   z-index: 0;

   z-index: 0;

   width: 70px;

   width: 70px;

   height: 70px;

   height: 70px;

   border-style: solid;

   border-style: solid;

   border-color: transparent;

   border-color: transparent;

   background-color: green;

   background-color: green;

.rA div.i { -moz-border-radius: 10px; }

.rA div.i { border-radius: 10px; }

.rB div.i { -moz-border-radius: 20px; }

.rB div.i { border-radius: 20px; }

.rC div.i { -moz-border-radius: 30px; }

.rC div.i { border-radius: 30px; }

.rD div.i { -moz-border-radius: 40px; }

.rD div.i { border-radius: 40px; }

.rE div.i { -moz-border-radius: 50px; }

.rE div.i { border-radius: 50px; }

.wA div.i { border-width: 10px 10px 10px 10px; }

.wA div.i { border-width: 10px 10px 10px 10px; }

.wB div.i { border-width: 20px 20px 20px 20px; }

.wB div.i { border-width: 20px 20px 20px 20px; }

.wC div.i { border-width: 5px 20px 5px 20px; }

.wC div.i { border-width: 5px 20px 5px 20px; }

.wD div.i { border-width: 20px 20px 5px 5px; }

.wD div.i { border-width: 20px 20px 5px 5px; }

.wE div.i { border-width: 5px 10px 15px 20px; }

.wE div.i { border-width: 5px 10px 15px 20px; }

div.o {

div.o {





   z-index: 0;
   width: 70px;
   height: 70px;
   border-style: solid;
   border-color: green;
   background-clip: padding-box;
   background-color: green;
}
.rA div.i { border-radius: 10px; }
.rB div.i { border-radius: 20px; }
.rC div.i { border-radius: 30px; }
.rD div.i { border-radius: 40px; }
.rE div.i { border-radius: 50px; }

.wA div.i { border-width: 10px 10px 10px 10px; }
.wB div.i { border-width: 20px 20px 20px 20px; }
.wC div.i { border-width: 5px 20px 5px 20px; }
.wD div.i { border-width: 20px 20px 5px 5px; }
.wE div.i { border-width: 5px 10px 15px 20px; }

div.o {





   z-index: 0;
   width: 70px;
   height: 70px;
   border-style: solid;
   border-color: green;
   background-clip: padding-box;
   background-image: url("data:image/gif;base64,R0lGODdhAQABAPAAAACAAAAAACwAAAAAAQABAAACAkQBADs=");
}
.rA div.i { border-radius: 10px; }
.rB div.i { border-radius: 20px; }
.rC div.i { border-radius: 30px; }
.rD div.i { border-radius: 40px; }
.rE div.i { border-radius: 50px; }

.wA div.i { border-width: 10px 10px 10px 10px; }
.wB div.i { border-width: 20px 20px 20px 20px; }
.wC div.i { border-width: 5px 20px 5px 20px; }
.wD div.i { border-width: 20px 20px 5px 5px; }
.wE div.i { border-width: 5px 10px 15px 20px; }

div.o {





   z-index: 0;
   width: 70px;
   height: 70px;
   border-style: solid;
   border-color: green;
   background-clip: padding-box;
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaAQMAAAACZtNBAAAAA1BMVEUAgACc+aWRAAAAEklEQVQYGWNgGAWjYBSMgsECAASSAAFZGYSDAAAAAElFTkSuQmCC");
}
.rA div.i { border-radius: 10px; }
.rB div.i { border-radius: 20px; }
.rC div.i { border-radius: 30px; }
.rD div.i { border-radius: 40px; }
.rE div.i { border-radius: 50px; }

.wA div.i { border-width: 10px 10px 10px 10px; }
.wB div.i { border-width: 20px 20px 20px 20px; }
.wC div.i { border-width: 5px 20px 5px 20px; }
.wD div.i { border-width: 20px 20px 5px 5px; }
.wE div.i { border-width: 5px 10px 15px 20px; }

div.o {





body { background: white; color: black; margin: 0 }
div {
  background: aqua;
  color: black;
  height: 75px;
  width: 75px;
  padding: 15px;
  border: 20px solid;
  border-radius: 25px;
  border-color: transparent;
  background-clip: padding-box;
}
img {
  position: absolute;
  top: 20px;
  left: 20px;
}





body { background: white; color: black; margin: 0 }
div {
  background: aqua;
  color: black;
  height: 75px;
  width: 75px;
  padding: 15px;
  border: 20px solid;
  border-radius: 25px;
  border-color: white;
}
img {
  position: absolute;
  top: 20px;
  left: 20px;
}
</style>





        >

<html:style>
    #prog {
        -moz-appearance: none;
        background-color: blue;
    }
    #prog .progress-bar {
        border-radius: 3px 3px;
        background-color: red;
    }
</html:style>

<progressmeter id="prog" value="50" max="200"/>

</window>





        class="reftest-wait">

<html:style>
    #prog {
        -moz-appearance: none;
        background-color: blue;
    }
    #prog .progress-bar {
        border-radius: 3px 3px;
        background-color: red;
    }
</html:style>

<progressmeter id="prog" value="50"/>

<script>
<![CDATA[

(-)a/layout/reftests/bugs/526463-1-ref.html (-1 / +1 lines)

Line	Link Here

Lines 1-12	Link Here

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

  <head>

  <head>

    <title>Testcase, bug 526463</title>

    <title>Testcase, bug 526463</title>

  </head>

  </head>

  <body>

  <body>

    <div style="-moz-border-radius: 50px;overflow:hidden;background:gold">

    <div style="border-radius: 50px;overflow:hidden;background:gold">

      outer div

      outer div

      <div>inner div</div>

      <div>inner div</div>

    </div>

    </div>

  </body>

  </body>

</html>

</html>

(-)a/layout/reftests/bugs/526463-1.html (-1 / +1 lines)

Line	Link Here

Lines 7-20	Link Here

        function() {

        function() {

          var div = document.getElementById("div");

          var div = document.getElementById("div");

          div.style.display = "";

          div.style.display = "";

          document.documentElement.className = "";

          document.documentElement.className = "";

        }, false);

        }, false);

    </script>

    </script>

  </head>

  </head>

  <body>

  <body>

    <div style="-moz-border-radius: 50px;overflow:hidden;background:gold">

    <div style="border-radius: 50px;overflow:hidden;background:gold">

      outer div

      outer div

      <div id="div" style="display:none">inner div</div>

      <div id="div" style="display:none">inner div</div>

    </div>

    </div>

  </body>

  </body>

</html>

</html>





#linux html|input, #linux html|textarea {
  margin: 2px 4px;
  padding: 2px 4px 3px;
}

textbox[multiline="true"], html|textarea {
  border: none !important;
  -moz-appearance: none !important;
  border-top-right-radius: 0;
  border-bottom-left-radius: 0;
}

html|input, html|textarea {
  font: inherit;
}

html|input.ac {
  padding:  0 3px !important;






p::first-line {
  /* specify all the properties in nsStyleBorder */
  -moz-border-start: medium solid red ! important;
  -moz-border-end: medium solid red ! important;
  border: medium solid red ! important;
  -moz-border-image: none ! important;
  -moz-float-edge: content-box ! important;
  border-radius: 0 ! important;
  -moz-border-top-colors: none ! important;
  -moz-border-right-colors: none ! important;
  -moz-border-bottom-colors: none ! important;
  -moz-border-left-colors: none ! important;
  -moz-box-shadow: none ! important;
}

</style>

(-)a/layout/reftests/image-element/element-paint-sharpness-01a.html (-1 / +1 lines)

Line	Link Here

Lines 5-17	Link Here

     Test that background-size and zooming don't degrade rendering sharpness.

     Test that background-size and zooming don't degrade rendering sharpness.

-->

-->

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

<body style="margin:0">

<body style="margin:0">

<div style="width:200px; height:200px; background-image:-moz-element(#e); background-size: cover;"></div>

<div style="width:200px; height:200px; background-image:-moz-element(#e); background-size: cover;"></div>

<div style="overflow:hidden; height:0">

<div style="overflow:hidden; height:0">

  <div id="e" style="width:100px; height:100px;">

  <div id="e" style="width:100px; height:100px;">

    <div style="width:100px; height:100px; -moz-border-radius:100%; background-color:lime;"></div>

    <div style="width:100px; height:100px; border-radius:100%; background-color:lime;"></div>

  </div>

  </div>

</div>

</div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/image-element/element-paint-sharpness-01b.html (-1 / +1 lines)

Line	Link Here

Lines 2-12	Link Here

     Any copyright is dedicated to the Public Domain.

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/licenses/publicdomain/

     http://creativecommons.org/licenses/publicdomain/

     Test that background-size and zooming don't degrade rendering sharpness.

     Test that background-size and zooming don't degrade rendering sharpness.

-->

-->

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

<body style="margin:0">

<body style="margin:0">

<div style="width:200px; height:200px; -moz-border-radius:100%; background-color:lime;"></div>

<div style="width:200px; height:200px; border-radius:100%; background-color:lime;"></div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/image-element/element-paint-sharpness-01c.html (-1 / +1 lines)

Line	Link Here

Lines 2-12	Link Here

     Any copyright is dedicated to the Public Domain.

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/licenses/publicdomain/

     http://creativecommons.org/licenses/publicdomain/

     Test that background-size and zooming don't degrade rendering sharpness.

     Test that background-size and zooming don't degrade rendering sharpness.

-->

-->

<!DOCTYPE html>

<!DOCTYPE html>

<html reftest-zoom="2">

<html reftest-zoom="2">

<body style="margin:0">

<body style="margin:0">

<div style="width:100px; height:100px; -moz-border-radius:100%; background-color:lime;"></div>

<div style="width:100px; height:100px; border-radius:100%; background-color:lime;"></div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/image-element/element-paint-sharpness-01d.html (-1 / +1 lines)

Line	Link Here

Lines 5-17	Link Here

     Test that background-size and zooming don't degrade rendering sharpness.

     Test that background-size and zooming don't degrade rendering sharpness.

-->

-->

<!DOCTYPE html>

<!DOCTYPE html>

<html reftest-zoom="2">

<html reftest-zoom="2">

<body style="margin:0">

<body style="margin:0">

<div style="width:100px; height:100px; background-image:-moz-element(#e);"></div>

<div style="width:100px; height:100px; background-image:-moz-element(#e);"></div>

<div style="overflow:hidden; height:0">

<div style="overflow:hidden; height:0">

  <div id="e" style="width:100px; height:100px;">

  <div id="e" style="width:100px; height:100px;">

    <div style="width:100px; height:100px; -moz-border-radius:100%; background-color:lime;"></div>

    <div style="width:100px; height:100px; border-radius:100%; background-color:lime;"></div>

  </div>

  </div>

</div>

</div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/image-element/element-paint-sharpness-02a.html (-1 / +1 lines)

Line	Link Here

Lines 5-17	Link Here

     Test that background-size and zooming don't degrade rendering sharpness even when rendering to a surface.

     Test that background-size and zooming don't degrade rendering sharpness even when rendering to a surface.

-->

-->

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

<body style="margin:0">

<body style="margin:0">

<div style="width:400px; height:400px; background-image:-moz-element(#e); background-size: 200px;"></div>

<div style="width:400px; height:400px; background-image:-moz-element(#e); background-size: 200px;"></div>

<div style="overflow:hidden; height:0">

<div style="overflow:hidden; height:0">

  <div id="e" style="width:100px; height:100px;">

  <div id="e" style="width:100px; height:100px;">

    <div style="width:100px; height:100px; -moz-border-radius:100%; background-color:lime;"></div>

    <div style="width:100px; height:100px; border-radius:100%; background-color:lime;"></div>

  </div>

  </div>

</div>

</div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/image-element/element-paint-sharpness-02b.html (-1 / +1 lines)

Line	Link Here

Lines 5-17	Link Here

     Test that background-size and zooming don't degrade rendering sharpness even when rendering to a surface.

     Test that background-size and zooming don't degrade rendering sharpness even when rendering to a surface.

-->

-->

<!DOCTYPE html>

<!DOCTYPE html>

<html>

<html>

<body style="margin:0">

<body style="margin:0">

<div style="width:400px; height:400px; background-image:-moz-element(#e);"></div>

<div style="width:400px; height:400px; background-image:-moz-element(#e);"></div>

<div style="overflow:hidden; height:0">

<div style="overflow:hidden; height:0">

  <div id="e" style="width:200px; height:200px;">

  <div id="e" style="width:200px; height:200px;">

    <div style="width:200px; height:200px; -moz-border-radius:100%; background-color:lime;"></div>

    <div style="width:200px; height:200px; border-radius:100%; background-color:lime;"></div>

  </div>

  </div>

</div>

</div>

</body>

</body>

</html>

</html>

(-)a/layout/reftests/image-element/element-paint-sharpness-02c.html (-1 / +1 lines)

Line	Link Here

Lines 5-17	Link Here

     Test that background-size and zooming don't degrade rendering sharpness even when rendering to a surface.

     Test that background-size and zooming don't degrade rendering sharpness even when rendering to a surface.

-->

-->

<!DOCTYPE html>

<!DOCTYPE html>

<html reftest-zoom="2">

<html reftest-zoom="2">

<body style="margin:0">

<body style="margin:0">

<div style="width:200px; height:200px; background-image:-moz-element(#e);"></div>

<div style="width:200px; height:200px; background-image:-moz-element(#e);"></div>

<div style="overflow:hidden; height:0">

<div style="overflow:hidden; height:0">

  <div id="e" style="width:100px; height:100px;">

  <div id="e" style="width:100px; height:100px;">

    <div style="width:100px; height:100px; -moz-border-radius:100%; background-color:lime;"></div>

    <div style="width:100px; height:100px; border-radius:100%; background-color:lime;"></div>

  </div>

  </div>

</div>

</div>

</body>

</body>

</html>

</html>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 19.9px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20.1px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 21px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20.4px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20.5px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20.6px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 19.5px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 19.5px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 19.5px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 21px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20.4px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20.5px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20.6px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 19.5px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 19.5px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 19.5px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 19.9px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>






body > div > div { background: green; }

.tl { top: 20px; }
.tr { margin-top: 40px; }
.bl { left: 20.1px; }
.br { margin-left: 40px; }

div.one > div.tl { border-top-left-radius: 1px; }
div.one > div.tr { border-top-right-radius: 1px; }
div.one > div.bl { border-bottom-left-radius: 1px; }
div.one > div.br { border-bottom-right-radius: 1px; }
div.four > div.tl { border-top-left-radius: 4px; }
div.four > div.tr { border-top-right-radius: 4px; }
div.four > div.bl { border-bottom-left-radius: 4px; }
div.four > div.br { border-bottom-right-radius: 4px; }

</style>
</head>
<body>

<div class="one">
<div></div>
<div class="tl"></div>





            aValue.Append(PRUnichar(' '));
            NS_ABORT_IF_FALSE(leftValue.GetUnit() != eCSSUnit_Null, "null left");
            leftValue.AppendToString(subprops[3], aValue);
          }
        }
      }
      break;
    }
    case eCSSProperty_border_radius:
    case eCSSProperty__moz_outline_radius: {
      const nsCSSProperty* subprops =
        nsCSSProps::SubpropertyEntryFor(aProperty);
      const nsCSSValue* vals[4] = {
        data->ValueFor(subprops[0]),
        data->ValueFor(subprops[1]),
        data->ValueFor(subprops[2]),
        data->ValueFor(subprops[3])





  letter-spacing: inherit;
  cursor: inherit;
}

/* radio buttons */
input[type="radio"] {
  -moz-appearance: radio;
  margin: 3px 3px 0px 5px;
  border-radius: 100% !important;
}

/* check boxes */
input[type="checkbox"] {
  -moz-appearance: checkbox;
  margin: 3px 3px 3px 4px;
  border-radius: 0 !important;
}

/* common features of radio buttons and check boxes */

/* NOTE: The width, height, border-width, and padding here must all
   add up the way nsFormControlFrame::GetIntrinsic(Width|Height)
   expects them to, or they will not come out with total width equal
   to total height on sites that set their 'width' or 'height' to 'auto'.





};
static const nsCSSProperty kBorderColorIDs[] = {
  eCSSProperty_border_top_color,
  eCSSProperty_border_right_color_value,
  eCSSProperty_border_bottom_color,
  eCSSProperty_border_left_color_value
};
static const nsCSSProperty kBorderRadiusIDs[] = {
  eCSSProperty_border_top_left_radius,
  eCSSProperty_border_top_right_radius,
  eCSSProperty_border_bottom_right_radius,
  eCSSProperty_border_bottom_left_radius
};
static const nsCSSProperty kOutlineRadiusIDs[] = {
  eCSSProperty__moz_outline_radius_topLeft,
  eCSSProperty__moz_outline_radius_topRight,
  eCSSProperty__moz_outline_radius_bottomRight,
  eCSSProperty__moz_outline_radius_bottomLeft
};


    return ParseDirectionalBoxProperty(eCSSProperty_border_left_style,
                                       NS_BOXPROP_SOURCE_PHYSICAL);
  case eCSSProperty_border_right_style:
    return ParseDirectionalBoxProperty(eCSSProperty_border_right_style,
                                       NS_BOXPROP_SOURCE_PHYSICAL);
  case eCSSProperty_border_start_style:
    return ParseDirectionalBoxProperty(eCSSProperty_border_start_style,
                                       NS_BOXPROP_SOURCE_LOGICAL);
  case eCSSProperty_border_radius:
    return ParseBoxCornerRadii(kBorderRadiusIDs);
  case eCSSProperty__moz_outline_radius:
    return ParseBoxCornerRadii(kOutlineRadiusIDs);

  case eCSSProperty_border_top_left_radius:
  case eCSSProperty_border_top_right_radius:
  case eCSSProperty_border_bottom_right_radius:
  case eCSSProperty_border_bottom_left_radius:
  case eCSSProperty__moz_outline_radius_topLeft:
  case eCSSProperty__moz_outline_radius_topRight:
  case eCSSProperty__moz_outline_radius_bottomRight:
  case eCSSProperty__moz_outline_radius_bottomLeft:
    return ParseBoxCornerRadius(aPropID);

  case eCSSProperty_box_shadow:
  case eCSSProperty_text_shadow:

  case eCSSProperty_border_bottom:
  case eCSSProperty_border_end:
  case eCSSProperty_border_left:
  case eCSSProperty_border_right:
  case eCSSProperty_border_start:
  case eCSSProperty_border_top:
  case eCSSProperty_border_width:
  case eCSSProperty_background_size:
  case eCSSProperty_border_radius:
  case eCSSProperty_border_top_left_radius:
  case eCSSProperty_border_top_right_radius:
  case eCSSProperty_border_bottom_right_radius:
  case eCSSProperty_border_bottom_left_radius:
  case eCSSProperty_box_shadow:
  case eCSSProperty_clip:
  case eCSSProperty__moz_column_rule:
  case eCSSProperty_content:
  case eCSSProperty_counter_increment:
  case eCSSProperty_counter_reset:
  case eCSSProperty_cue:
  case eCSSProperty_cursor:





    MozAppearance,
    0,
    Display,
    mAppearance,
    kAppearanceKTable,
    CSS_PROP_NO_OFFSET,
    eStyleAnimType_None)
CSS_PROP_SHORTHAND(
    border-radius,
    border_radius,
    MozBorderRadius,
    0)
CSS_PROP_BORDER(
    border-top-left-radius,
    border_top_left_radius,
    MozBorderRadiusTopleft,
    CSS_PROPERTY_APPLIES_TO_FIRST_LETTER,
    Margin,
    mBorderRadius.mTopLeft,
    nsnull,
    offsetof(nsStyleBorder, mBorderRadius),
    eStyleAnimType_Corner_TopLeft)
CSS_PROP_BORDER(
    border-top-right-radius,
    border_top_right_radius,
    MozBorderRadiusTopright,
    CSS_PROPERTY_APPLIES_TO_FIRST_LETTER,
    Margin,
    mBorderRadius.mTopRight,
    nsnull,
    offsetof(nsStyleBorder, mBorderRadius),
    eStyleAnimType_Corner_TopRight)
CSS_PROP_BORDER(
    border-bottom-right-radius,
    border_bottom_right_radius,
    MozBorderRadiusBottomright,
    CSS_PROPERTY_APPLIES_TO_FIRST_LETTER,
    Margin,
    mBorderRadius.mBottomRight,
    nsnull,
    offsetof(nsStyleBorder, mBorderRadius),
    eStyleAnimType_Corner_BottomRight)
CSS_PROP_BORDER(
    border-bottom-left-radius,
    border_bottom_left_radius,
    MozBorderRadiusBottomleft,
    CSS_PROPERTY_APPLIES_TO_FIRST_LETTER,
    Margin,
    mBorderRadius.mBottomLeft,
    nsnull,
    offsetof(nsStyleBorder, mBorderRadius),
    eStyleAnimType_Corner_BottomLeft)
CSS_PROP_SHORTHAND(





#define CSS_PROP_SHORTHAND(name_, id_, method_, flags_) flags_,
#include "nsCSSPropList.h"
#undef CSS_PROP_SHORTHAND
};

static const nsCSSProperty gMozBorderRadiusSubpropTable[] = {
  // Code relies on these being in topleft-topright-bottomright-bottomleft
  // order.
  eCSSProperty_border_top_left_radius,
  eCSSProperty_border_top_right_radius,
  eCSSProperty_border_bottom_right_radius,
  eCSSProperty_border_bottom_left_radius,
  eCSSProperty_UNKNOWN
};

static const nsCSSProperty gMozOutlineRadiusSubpropTable[] = {
  // Code relies on these being in topleft-topright-bottomright-bottomleft
  // order.
  eCSSProperty__moz_outline_radius_topLeft,
  eCSSProperty__moz_outline_radius_topRight,





    COMPUTED_STYLE_MAP_ENTRY(background_origin,             BackgroundOrigin),
    COMPUTED_STYLE_MAP_ENTRY(background_size,               MozBackgroundSize),
    COMPUTED_STYLE_MAP_ENTRY(binding,                       Binding),
    COMPUTED_STYLE_MAP_ENTRY(border_bottom_colors,          BorderBottomColors),
    COMPUTED_STYLE_MAP_ENTRY(border_image,                  BorderImage),
    COMPUTED_STYLE_MAP_ENTRY(border_left_colors,            BorderLeftColors),
    COMPUTED_STYLE_MAP_ENTRY(border_right_colors,           BorderRightColors),
    COMPUTED_STYLE_MAP_ENTRY(border_top_colors,             BorderTopColors),
    COMPUTED_STYLE_MAP_ENTRY_LAYOUT(border_bottom_left_radius, BorderRadiusBottomLeft),
    COMPUTED_STYLE_MAP_ENTRY_LAYOUT(border_bottom_right_radius,BorderRadiusBottomRight),
    COMPUTED_STYLE_MAP_ENTRY_LAYOUT(border_top_left_radius,    BorderRadiusTopLeft),
    COMPUTED_STYLE_MAP_ENTRY_LAYOUT(border_top_right_radius,   BorderRadiusTopRight),
    COMPUTED_STYLE_MAP_ENTRY(box_align,                     BoxAlign),
    COMPUTED_STYLE_MAP_ENTRY(box_direction,                 BoxDirection),
    COMPUTED_STYLE_MAP_ENTRY(box_flex,                      BoxFlex),
    COMPUTED_STYLE_MAP_ENTRY(box_ordinal_group,             BoxOrdinalGroup),
    COMPUTED_STYLE_MAP_ENTRY(box_orient,                    BoxOrient),
    COMPUTED_STYLE_MAP_ENTRY(box_pack,                      BoxPack),
    COMPUTED_STYLE_MAP_ENTRY(box_shadow,                    BoxShadow),
    COMPUTED_STYLE_MAP_ENTRY(box_sizing,                    BoxSizing),





        }
      }
      else if (eCSSUnit_Initial == value.GetUnit()) {
        border->SetBorderToForeground(side);
      }
    }
  }

  // border-radius: length, percent, inherit
  {
    const nsCSSCornerSizes& borderRadius = marginData.mBorderRadius;
    NS_FOR_CSS_FULL_CORNERS(corner) {
      int cx = NS_FULL_TO_HALF_CORNER(corner, false);
      int cy = NS_FULL_TO_HALF_CORNER(corner, true);
      const nsCSSValue& radius = borderRadius.GetCorner(corner);
      nsStyleCoord parentX = parentBorder->mBorderRadius.Get(cx);
      nsStyleCoord parentY = parentBorder->mBorderRadius.Get(cy);





	"-moz-border-left-colors": {
		domProp: "MozBorderLeftColors",
		inherited: false,
		type: CSS_TYPE_LONGHAND,
		initial_values: [ "none" ],
		other_values: [ "red green", "red #fc3", "#ff00cc", "currentColor", "blue currentColor orange currentColor" ],
		invalid_values: [ "red none", "red inherit", "red, green", "none red", "inherit red" ]
	},
	"border-radius": {
		domProp: "MozBorderRadius",
		inherited: false,
		type: CSS_TYPE_TRUE_SHORTHAND,
		subproperties: [ "border-bottom-left-radius", "border-bottom-right-radius", "border-top-left-radius", "border-top-right-radius" ],
		initial_values: [ "0", "0px", "0px 0 0 0px" ], /* 0% ? */
		other_values: [ "3%", "1px", "2em", "3em 2px", "2pt 3% 4em", "2px 2px 2px 2px", // circular
						"3% / 2%", "1px / 4px", "2em / 1em", "3em 2px / 2px 3em", "2pt 3% 4em / 4pt 1% 5em", "2px 2px 2px 2px / 4px 4px 4px 4px", "1pt / 2pt 3pt", "4pt 5pt / 3pt" // elliptical
					  ],
		invalid_values: [ "2px -2px", "inherit 2px", "inherit / 2px", "2px inherit", "2px / inherit", "2px 2px 2px 2px 2px", "1px / 2px 2px 2px 2px 2px" ]
	},
	"border-bottom-left-radius": {
		domProp: "MozBorderRadiusBottomleft",
		inherited: false,
		type: CSS_TYPE_LONGHAND,
		initial_values: [ "0", "0px" ], /* 0% ? */
		other_values: [ "3%", "1px", "2em", // circular
						"3% 2%", "1px 4px", "2em 2pt" // elliptical
					  ],
		invalid_values: [ "-1px", "4px -2px", "inherit 2px", "2px inherit" ]
	},
	"border-bottom-right-radius": {
		domProp: "MozBorderRadiusBottomright",
		inherited: false,
		type: CSS_TYPE_LONGHAND,
		initial_values: [ "0", "0px" ], /* 0% ? */
		other_values: [ "3%", "1px", "2em", // circular
						"3% 2%", "1px 4px", "2em 2pt" // elliptical
					  ],
		invalid_values: [ "-1px", "4px -2px", "inherit 2px", "2px inherit" ]
	},
	"border-top-left-radius": {
		domProp: "MozBorderRadiusTopleft",
		inherited: false,
		type: CSS_TYPE_LONGHAND,
		initial_values: [ "0", "0px" ], /* 0% ? */
		other_values: [ "3%", "1px", "2em", // circular
						"3% 2%", "1px 4px", "2em 2pt" // elliptical
					  ],
		invalid_values: [ "-1px", "4px -2px", "inherit 2px", "2px inherit" ]
	},
	"border-top-right-radius": {
		domProp: "MozBorderRadiusTopright",
		inherited: false,
		type: CSS_TYPE_LONGHAND,
		initial_values: [ "0", "0px" ], /* 0% ? */
		other_values: [ "3%", "1px", "2em", // circular
						"3% 2%", "1px 4px", "2em 2pt" // elliptical
					  ],
		invalid_values: [ "-1px", "4px -2px", "inherit 2px", "2px inherit" ]





       style="min-height: 600px; max-height: 320px"></div>
  <div id="minmaxheight10-2" class="auto"
       style="min-height: 600px; max-height: 40%"></div>
  <div id="minmaxheight11-1" class="auto"
       style="min-height: 75%; max-height: 320px"></div>
  <div id="minmaxheight11-2" class="auto"
       style="min-height: 75%; max-height: 40%"></div>

  <div id="radius1" style="border-radius: 80px"></div>
  <div id="radius2" style="border-radius: 10%"></div>
  <div id="outlineradius1" style="-moz-outline-radius: 160px"></div>
  <div id="outlineradius2" style="-moz-outline-radius: 20%"></div>
</div>
<div id="content2" style="display: none">
  <div id="indent3" style="text-indent: 400px"></div>
  <div id="indent4" style="text-indent: 50%"></div>

  <div id="minwidth1-3" style="min-width: 200px"></div>

  <div id="minmaxheight1-4" style="min-height: 200px; max-height: 40%"></div>
  <div id="minmaxheight2-3" style="min-height: 25%; max-height: 320px"></div>
  <div id="minmaxheight2-4" style="min-height: 25%; max-height: 40%"></div>
  <div id="minmaxheight3-3" style="min-height: 600px; max-height: 320px"></div>
  <div id="minmaxheight3-4" style="min-height: 600px; max-height: 40%"></div>
  <div id="minmaxheight4-3" style="min-height: 75%; max-height: 320px"></div>
  <div id="minmaxheight4-4" style="min-height: 75%; max-height: 40%"></div>

  <div id="radius3" style="border-radius: 80px"></div>
  <div id="radius4" style="border-radius: 10%"></div>
  <div id="outlineradius3" style="-moz-outline-radius: 160px"></div>
  <div id="outlineradius4" style="-moz-outline-radius: 20%"></div>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">

/** Test for Bug 365932 **/

document.body.offsetWidth;

doATest("text-indent", "indent", 400, 50);
doATest("border-top-left-radius", "radius", 80, 10);
doATest("-moz-outline-radius-topleft", "outlineradius", 160, 20);

doATest("width", "widthheight-", 440, 0);
doATest("height", "widthheight-", 0, 0);

doATest("min-width", "minwidth1-", 200, 25);
doATest("min-width", "minwidth2-", 600, 75);
doATest("max-width", "maxwidth1-", 320, 40);





   "text-decoration still stored");
is(s.getPropertyPriority("text-decoration"), "important",
   "text-decoration priority still stored");
is(s.getPropertyValue("z-index"), "3",
   "z-index still stored");
is(s.getPropertyPriority("z-index"), "",
   "z-index priority still stored");

s.setProperty("border-radius", "2em", "");
is(s.getPropertyValue("border-radius"), "2em 2em 2em 2em",
   "border-radius serialization 1")

s.setProperty("border-top-left-radius", "3em 4em", "");
is(s.getPropertyValue("border-radius"),
   "3em 2em 2em 2em / 4em 2em 2em 2em",
   "border-radius serialization 2");

s.setProperty("border-radius", "2em / 3em", "");
is(s.getPropertyValue("border-radius"),
   "2em 2em 2em 2em / 3em 3em 3em 3em",
   "border-radius serialization 3")

s.setProperty("border-top-left-radius", "4em", "");
is(s.getPropertyValue("border-radius"),
   "4em 2em 2em 2em / 4em 3em 3em 3em",
   "border-radius serialization 3");

</script>
</pre>
</body>
</html>





}

function any_unit_to_num(str)
{
    return Number(String(str).match(/^([\d.]+)/)[1]);
}

var supported_properties = {
    "border-bottom-left-radius": [ test_radius_transition ],
    "border-bottom-right-radius": [ test_radius_transition ],
    "border-top-left-radius": [ test_radius_transition ],
    "border-top-right-radius": [ test_radius_transition ],
    "-moz-box-flex": [ test_float_zeroToOne_transition,
                       test_float_aboveOne_transition ],
    "-moz-box-shadow": [ test_shadow_transition ],
    "-moz-column-count": [ test_pos_integer_or_auto_transition ],
    "-moz-column-gap": [ test_length_transition ],
    "-moz-column-rule-color": [ test_color_transition,
                                test_border_color_transition ],
    "-moz-column-rule-width": [ test_length_transition ],





.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }


/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-tl { border-top-left-radius: 4px; -webkit-border-top-left-radius: 4px; }
.ui-corner-tr { border-top-right-radius: 4px; -webkit-border-top-right-radius: 4px; }
.ui-corner-bl { border-bottom-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; }
.ui-corner-br { border-bottom-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-top { border-top-left-radius: 4px; -webkit-border-top-left-radius: 4px; border-top-right-radius: 4px; -webkit-border-top-right-radius: 4px; }
.ui-corner-bottom { border-bottom-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-right {  border-top-right-radius: 4px; -webkit-border-top-right-radius: 4px; border-bottom-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-left { border-top-left-radius: 4px; -webkit-border-top-left-radius: 4px; border-bottom-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; }
.ui-corner-all { border-radius: 4px; -webkit-border-radius: 4px; }

/* Overlays */
.ui-widget-overlay { background: #aaaaaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); }
.ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); border-radius: 8px; -webkit-border-radius: 8px; }/* Accordion
----------------------------------*/
.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
.ui-accordion .ui-accordion-li-fix { display: inline; }
.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em 2.2em; }
.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; }
.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; }
.ui-accordion .ui-accordion-content-active { display: block; }/* Datepicker






.memBox {
    max-width: 30em;
    background: -moz-Field;
    color: -moz-FieldText;
    margin-top: 25px;
    padding: 5px;
    border: 1px solid -moz-FieldText;
    border-radius: 10px 10px;
}

.memValue {
    text-align: right;
}

.memOverview table {
    font-size: 120%;





button {
  /*-moz-appearance: button;*/
  margin: 3px 7px 3px 7px;
  min-width: 6.3em;
  border: 1px solid;
  border-color: #555555;
  background-color: #eeeeee;
  color: black;
  border-radius: 3px 3px;
}

.button-box {
  border: 1px solid transparent;
  padding-top: 1px;
  padding-bottom: 2px;
  -moz-padding-start: 3px;
  -moz-padding-end: 4px;

  border: 1px dotted black;
}

/* .......... default state .......... */

button[default="true"] {
  margin: 1px 5px 1px 5px;
  border-width: 2px;
  border-radius: 3px 3px;
  border-color: black;
}

/* .......... active/open/checked state .......... */

button:hover:active,
button[open="true"],
button[checked="true"] {






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

/* ::::: groupbox ::::: */

groupbox {
  -moz-appearance: groupbox;
  border: 1px solid gray;
  border-radius: 3px;
  margin: 3px;
  padding: 3px 3px 6px 3px;
}

.groupbox-body {
  padding: inherit;
}






  color: GrayText;
}

/* ::::: checkmark image ::::: */

.radio-check-box1 {
  margin: 1px 0px;
  border: 1px solid #555555;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  background: -moz-Field no-repeat 50% 50%;
}

.radio-check-box2 {
  border: 1px solid #555555;
  border-radius: 50%;
  padding: 2px;
  width: 4px;
  height: 4px;
  list-style-image: none;
  background: -moz-Field no-repeat 50% 50%;
}

radio:hover:active > .radio-check-box1 {






tab 
{
  margin-top: 2px;
  border-top: 1px solid #555555;
  border-right: 1px solid #555555;
  border-left: 1px solid #555555;
  border-bottom: 1px solid #555555;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  padding: 1px 4px 2px 4px;
  background-color: -moz-Dialog;
  color: -moz-DialogText;
}

tab:-moz-locale-dir(rtl) {
  border-bottom-left-radius: 1px;
  border-bottom-right-radius: 0px;
}

.tab-text {
  margin: 0 !important;
}

tab[selected="true"] {
  margin-top: 0;

tab:focus > .tab-middle {
  /* Don't specify the outline-color, we should always use initial value. */
  outline: 1px dotted;
}

tab[beforeselected="true"]:not(:-moz-locale-dir(rtl)),
tab[selected="true"]:-moz-locale-dir(rtl) + tab {
  border-right: none;
  border-top-right-radius: 0;
}

tab[selected="true"]:not(:-moz-locale-dir(rtl)) + tab,
tab[beforeselected="true"]:-moz-locale-dir(rtl) {
  border-left: none;
  border-top-left-radius: 0;
}

tab:first-of-type[selected="true"] {
  padding-right: 5px;
  padding-left: 5px;
}

/* ::::: tab-bottom ::::::::::

   :: a tabpanels.
   ::::: */

.tab-bottom {
  margin-top: 0;
  margin-bottom: 2px;
  border-top: 1px solid;
  border-bottom: 1px solid #555555;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
  padding: 2px 4px 1px 4px;
}

.tab-bottom[selected="true"] {
  margin-bottom: 0;
  -moz-border-top-colors: -moz-Dialog;
  padding: 4px 6px 1px 6px;
}

.tab-bottom[beforeselected="true"]:not(:-moz-locale-dir(rtl)),
.tab-bottom[selected="true"]:-moz-locale-dir(rtl) + .tab-bottom {
  border-bottom-right-radius: 0;
}

.tab-bottom[selected="true"]:not(:-moz-locale-dir(rtl)) + .tab-bottom,
.tab-bottom[beforeselected="true"]:-moz-locale-dir(rtl) {
  border-bottom-left-radius: 0;
}

/* ::::: tabs-bottom ::::: */

.tabs-bottom > .tabs-left,
.tabs-bottom > .tabs-right {
  border-top: 1px solid ThreeDShadow;
  border-bottom: none;





}

#errorPageContainer {
  position: relative;
  min-width: 13em;
  max-width: 52em;
  margin: 4em auto;
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  background: url("moz-icon://stock/gtk-dialog-warning?size=dialog") left 0 no-repeat -moz-Field;
  background-origin: content-box;
}

#errorPageContainer.certerror {
  background-image: url("chrome://global/skin/icons/sslWarning.png");

#securityOverrideDiv {
  padding-top: 10px;
}

#securityOverrideContent {
  background-color: InfoBackground;
  color: InfoText;
  padding: 10px;
  border-radius: 10px;
}

/* Custom styling for 'blacklist' error class */
:root.blacklist #errorTitle, :root.blacklist #errorLongContent,
:root.blacklist #errorShortDesc, :root.blacklist #errorLongDesc,
:root.blacklist a {
  background-color: #722; /* Dark red */
  color: white;






/* ::::: checkmark image ::::: */

.radio-check-box1 {
  border-top: 1px solid ThreeDShadow;
  border-right: 1px solid ThreeDHighlight;
  border-bottom: 1px solid ThreeDHighlight;
  border-left: 1px solid ThreeDShadow;
  border-radius: 50%;
  min-width: 12px;
  min-height: 12px;
  background-color: -moz-Field;
}

.radio-check-box2 {
  border-top: 1px solid ThreeDDarkShadow;
  border-right: 1px solid ThreeDLightShadow;
  border-bottom: 1px solid ThreeDLightShadow;
  border-left: 1px solid ThreeDDarkShadow;
  border-radius: 50%;
  padding: 2px;
  width: 4px;
  height: 4px;
  list-style-image: none;
}

radio:not([disabled="true"]):hover {
  color: -moz-buttonhovertext;





  position: relative;
  -moz-appearance: tab;
  margin-top: 2px;
  border: 2px solid;
  border-bottom: none;
  -moz-border-top-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
  -moz-border-left-colors: ThreeDHighlight ThreeDLightShadow;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  padding: 3px 4px;
  background-color: -moz-Dialog;
  color: -moz-DialogText;
}

tab[selected="true"] {
  z-index: 1;
  margin-top: 0;
  margin-bottom: -2px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  padding-top: 4px;
  padding-bottom: 6px;
}

tab + tab {
  -moz-margin-start: -2px;
}


   ::::: */

.tab-bottom {
  margin-top: 0;
  margin-bottom: 2px;
  border-top: none;
  border-bottom: 2px solid;
  -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
}

.tab-bottom[selected="true"] {
  margin-bottom: 0;
  margin-top: -2px;
  padding-top: 6px;
  padding-bottom: 4px;
}





#addons-page {
  margin: 20px 20px;
}

#view-port {
  background-color: -moz-field;
  color: -moz-fieldtext;
  border: 1px solid black;
  border-radius: 5px;
}


/*** category selector ***/

#categories {
  -moz-appearance: none;
  border: none;

  border-color: transparent;
  padding: 10px 4px;
  -moz-box-align: center;
  overflow: hidden;
  min-height: 0px;
}

.category:-moz-locale-dir(ltr) {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.category:-moz-locale-dir(rtl) {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.category[disabled] {
  height: 0px;
  opacity: 0;
  -moz-transition-property: height, opacity;
  -moz-transition-duration: 1s, 0.8s;
}

.category-name {
  font-size: 150%;
}

.category-badge {
  background-color: #55D4FF;
  padding: 2px 8px;
  margin: 6px 0px;
  border-radius: 100%;
  color: #FFF;
  font-weight: bold;
  text-align: center;
}

.category-badge[value="0"] {
  visibility: hidden;
}

#header-utils-btn {
  -moz-appearance: none;
  min-width: 4.5em;
  border-width: 1px;
  -moz-border-top-colors: #999;
  -moz-border-bottom-colors: #999;
  -moz-border-left-colors: #999;
  -moz-border-right-colors: #999;
  border-radius: 8px;
  background-image: -moz-linear-gradient(#FFF, #BBB);
  list-style-image: url("chrome://mozapps/skin/extensions/utilities.png");
}

#header-utils-btn:hover,
#header-utils-btn[open="true"] {
  -moz-border-top-colors: #777;
  -moz-border-bottom-colors: #777;

.sort-controls {
  -moz-appearance: none;
}

.sorter {
  -moz-appearance: none;
  border: none;
  background-color: transparent;
  border-radius: 100%;
  padding: 0px 6px;
  margin: 0px 6px;
  min-width: 12px !important;
  -moz-box-direction: reverse;
}

.sorter[checkState="1"],
.sorter[checkState="2"] {

.addon[status="uninstalled"] {
  border: none;
}

.addon[status="uninstalled"] > .container {
  -moz-box-align: center;
  padding: 4px 20px;
  background-color: #FDFFA8;
  border-radius: 8px;
  font-size: 120%;
}

.addon[status="uninstalled"][selected] {
  background-color: transparent;
}



}

#detail-notification {
  -moz-box-align: center;
  -moz-box-pack: center;
  margin: 0px 50px;
  padding: 4px 20px;
  background-color: #FDFFA8;
  border-radius: 8px;
  font-size: 120%;
  border: 2px solid #F0F6A3;
}


/*** creator ***/

.creator > label {

  padding: 0px 1px;
}


/*** download progress ***/

.download-progress {
  background-image: -moz-linear-gradient(#E1E1E1, #FEFEFE);
  border-radius: 100%;
  border: 1px solid #555;
  -moz-box-shadow: #777 1px 1px 2px;
  width: 200px;
  height: 24px;
  margin: 0px 8px;
}

.download-progress .start-cap,

}

.download-progress .start-cap, .download-progress .end-cap {
  width: 12px;
}

.download-progress .start-cap:-moz-locale-dir(ltr),
.download-progress .end-cap:-moz-locale-dir(rtl) {
  border-radius: 100% 0 0 100%;
}

.download-progress .end-cap:-moz-locale-dir(ltr),
.download-progress .start-cap:-moz-locale-dir(rtl) {
  border-radius: 0 100% 100% 0;
}

.download-progress .progress {
  -moz-appearance: none;
  padding: 0px;
  margin: 0px;
  border: none;
}

.download-progress .pause, .download-progress .cancel {
  -moz-appearance: none;
  background-image: -moz-linear-gradient(#E1E1E1, #FEFEFE);
  border-width: 1px 0px 0px 1px;
  padding-right: 1px;
  border-style: solid;
  -moz-border-top-colors: #FFF;
  -moz-border-left-colors: #FFF;
  border-radius: 100%;
  min-width: 16px;
  width: 16px;
  height: 16px;
  margin: 3px;
  -moz-box-shadow: #777 1px 1px 1px;
}

.download-progress .pause {

}

.contribute {
  -moz-appearance: none;
  color: #FFF;
  font-weight: bold;
  text-shadow: #4C9EF8 -1px -1px 1px;
  border: 1px solid #4C9EF8;
  border-radius: 100%;
  background-image: -moz-linear-gradient(#93C5FA, #4C9EF8);
  -moz-padding-start: 20px;
  -moz-padding-end: 4px;
}

.contribute:hover {
  border-color: #4271FF;
  background-image: -moz-linear-gradient(#49CEFF, #4271FF);





  background-color: -moz-Dialog;
}

#warningBox
{
  background-color: -moz-Field;
  color: -moz-FieldText;
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  margin-left: 1em;
  margin-right: 1em;
}

#warningInnerBox
{





#TextfieldEval {
  margin: 2px !important;
}

#ButtonEval {
  margin: 0 4px;
  padding: 1px 10px;
  -moz-appearance: none;
  border-radius: 100%;
  border: @roundButtonBorder@;
  background: @roundButtonBackground@;
  -moz-box-shadow: @roundButtonShadow@;
}

#ButtonEval > .toolbarbutton-text {
  margin: 0 !important;
}

#Console\:clear {
  -moz-box-orient: vertical;
  -moz-box-align: center;
  font: menu;
  text-shadow: @loweredShadow@;
  margin: 4px 0 9px;
  padding: 0 4px;
  border: 1px solid @toolbarbuttonBorderColor@;
  border-radius: @toolbarbuttonCornerRadius@;
  -moz-box-shadow: @loweredShadow@;
  background: @toolbarbuttonBackground@;
  background-origin: border-box;
}

#Console\:clear:active:hover {
  background: @toolbarbuttonPressedBackgroundColor@;
  text-shadow: @loweredShadow@;





  cursor: text;
  margin-right: 4px;
  margin-bottom: 2px;
  border: 3px solid;
  -moz-border-top-colors: transparent #888888 #000000;
  -moz-border-right-colors: transparent #FFFFFF #000000;
  -moz-border-bottom-colors: transparent #FFFFFF #000000;
  -moz-border-left-colors: transparent #888888 #000000;
  border-top-right-radius: 2px;
  border-bottom-left-radius: 2px;
  padding: 0px;
  background-color: -moz-Field;
  color: -moz-FieldText;
}

.datetimepicker-input-subbox {
  width: 1.6em;
}





  color: -moz-dialogtext;
  font: message-box;
  padding-left: 2em;
  padding-right: 2em;
}

body {
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  min-width: 30em;
  max-width: 65em;
  margin: 4em auto;
  background-color: -moz-field;
  color: -moz-fieldtext;
}






}

.findbar-find-next,
.findbar-find-previous,
.findbar-highlight {
  margin: 0 4px;
  padding: 1px 3px;
  -moz-appearance: none;
  border-radius: 100%;
  border: @roundButtonBorder@;
  background: @roundButtonBackground@;
  -moz-box-shadow: @roundButtonShadow@;
  color: buttontext;
}

.findbar-container > toolbarbutton:-moz-focusring {
  position: relative;

}

.findbar-container > checkbox > .checkbox-label-box > .checkbox-icon {
  -moz-padding-start: 1px;
  padding-bottom: 1px;
}

.findbar-container > checkbox:-moz-focusring > .checkbox-label-box > .checkbox-icon {
  border-radius: 4px;
  -moz-box-shadow: @focusRingShadow@;
}

/* Search field */

.findbar-textbox {
  -moz-appearance: none;
  border-radius: 100%;
  border: none;
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .7) inset,
                   0 0 0 1px rgba(0, 0, 0, .17) inset;
  background: url("chrome://global/skin/icons/search-textbox.png") -moz-Field no-repeat 5px center;
  margin: 0 4px -1px;
  padding: 3px 8px 2px;
  -moz-padding-start: 19px;
}


.findbar-find-next {
  -moz-border-end: none;
  -moz-margin-end: 0 !important;
}

.findbar-find-next:-moz-locale-dir(ltr),
.findbar-find-previous:-moz-locale-dir(rtl) {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

/* find-previous button */

.findbar-find-previous {
  -moz-margin-start: 0 !important;
}

.findbar-find-previous:-moz-locale-dir(ltr),
.findbar-find-next:-moz-locale-dir(rtl) {
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

/* highlight button */

.findbar-highlight {
  -moz-margin-start: 8px;
}

.findbar-highlight > .toolbarbutton-icon {
  width: 13px;
  height: 8px;
  margin: 0 4px;
  -moz-margin-end: 0;
  border: 1px solid #818181;
  border-radius: 4px;
  background-color: #F4F4F3;
}


.findbar-highlight[checked="true"] > .toolbarbutton-icon {
  background-color: #FFFF00;
  border-color: #818100;
}





}

notification > button {
  margin: 0 3px;
  padding: 1px 10px;
  min-width: 60px;
  min-height: 16px;
  -moz-appearance: none;
  border-radius: 100%;
  border: @roundButtonBorder@;
  text-shadow: @loweredShadow@;
  background: @roundButtonBackground@;
  -moz-box-shadow: @roundButtonShadow@;
}

notification > button:active:hover {
  background: @roundButtonPressedBackground@;





  min-width: 16px;
  min-height: 11px;
}

.volumeBackgroundBar {
  /* margin left/right: make bar 8px wide (control width = 28, minus 2 * 10 margin) */
  margin: 0 10px;
  background-color: rgba(255,255,255,.5);
  border-radius: 4px 4px;
}

.durationBox {
  -moz-box-pack: center;
}

.durationLabel {
  margin-left: -22px; /* 1/2 of scrubber thumb width, for overhang. */

  font-family: Helvetica, sans-serif;
}

.backgroundBar {
  /* margin top/bottom: make bar 8px tall (control height = 28, minus 2 * 10 margin) */
  /* margin left/right: 1/2 of scrubber thumb width, for overhang. */
  margin: 10px 22px;
  background-color: rgba(255,255,255,.5);
  border-radius: 4px;
}

.bufferBar,
.progressBar {
  /* margin top/bottom: make bar 8px tall (control height = 28, minus 2 * 10 margin) */
  /* margin left/right: 1/2 of scrubber thumb width, for overhang. */
  margin: 10px 22px;
  -moz-appearance: none;

/* .progress-bar is an element inside the <progressmeter> implementation. */
.bufferBar .progress-bar {
  /*
   * Note that this is drawn on top of the .backgroundBar. So although this
   * has the same background-color specified, the semitransparent
   * compositing gives it a different visual appearance.
   */
  background-color: rgba(255,255,255,.5);
  border-radius: 4px;
}

.progressBar .progress-bar {
  background-color: white;
  border-radius: 4px 0 0 4px;
}

/* .scale-slider is an element inside the <scale> implementation. */
.scrubber .scale-slider,
.volumeControl .scale-slider {
  /* Hide the default horizontal bar. */
  -moz-appearance: none;
  background: none;





}

#errorPageContainer {
  position: relative;
  min-width: 13em;
  max-width: 52em;
  margin: 4em auto;
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  background: url("chrome://global/skin/icons/warning-large.png") left 0 no-repeat -moz-Field;
  background-origin: content-box;
}

#errorPageContainer.certerror {
  background-image: url("chrome://global/skin/icons/sslWarning.png");


#securityOverrideDiv {
  padding-top: 10px;
}

#securityOverrideContent {
  background-color: #FFF090; /* Pale yellow */
  padding: 10px;
  border-radius: 10px;
}

/* Custom styling for 'blacklist' error class */
:root.blacklist #errorTitle, :root.blacklist #errorLongContent,
:root.blacklist #errorShortDesc, :root.blacklist #errorLongDesc,
:root.blacklist a {
  background-color: #722; /* Dark red */
  color: white;

(-)a/toolkit/themes/pinstripe/global/notification.css (-1 / +1 lines)

Line	Link Here

Lines 76-87 notification[type="critical"] .messageIm	Link Here

  list-style-image: url("chrome://global/skin/icons/closetab-hover.png");

  list-style-image: url("chrome://global/skin/icons/closetab-hover.png");

.messageCloseButton:hover:active {

.messageCloseButton:hover:active {

  list-style-image: url("chrome://global/skin/icons/closetab-active.png");

  list-style-image: url("chrome://global/skin/icons/closetab-active.png");

.messageCloseButton:-moz-focusring > .toolbarbutton-icon {

.messageCloseButton:-moz-focusring > .toolbarbutton-icon {

  -moz-border-radius: 100%;

  border-radius: 100%;

  -moz-box-shadow: 0 0 3px 1px -moz-mac-focusring,

  -moz-box-shadow: 0 0 3px 1px -moz-mac-focusring,

                   0 0 0 2px -moz-mac-focusring inset;

                   0 0 0 2px -moz-mac-focusring inset;

(-)a/toolkit/themes/pinstripe/global/numberbox.css (-2 / +2 lines)

Line	Link Here

Lines 54-66 html\|*.numberbox-input {	Link Here

  -moz-appearance: textfield;

  -moz-appearance: textfield;

  cursor: text;

  cursor: text;

  margin-right: 4px;

  margin-right: 4px;

  border: 3px solid;

  border: 3px solid;

  -moz-border-top-colors: transparent #888888 #000000;

  -moz-border-top-colors: transparent #888888 #000000;

  -moz-border-right-colors: transparent #FFFFFF #000000;

  -moz-border-right-colors: transparent #FFFFFF #000000;

  -moz-border-bottom-colors: transparent #FFFFFF #000000;

  -moz-border-bottom-colors: transparent #FFFFFF #000000;

  -moz-border-left-colors: transparent #888888 #000000;

  -moz-border-left-colors: transparent #888888 #000000;

  -moz-border-radius-topright: 2px;

  border-top-right-radius: 2px;

  -moz-border-radius-bottomleft: 2px;

  border-bottom-left-radius: 2px;

  background-color: -moz-Field;

  background-color: -moz-Field;

  color: -moz-FieldText;

  color: -moz-FieldText;





  background-color: rgba(0, 0, 0, 0.1);
  -moz-border-end-color: rgba(0, 0, 0, 0.1);
}

tabbox.tabs-bottom > tabs > tab[selected=true],
tabs.tabs-bottom > tab[selected=true] {
  border: solid #888;
  border-width: 0 2px 2px;
  border-radius: 2px;
  -moz-border-left-colors: rgba(0, 0, 0, 0.08) #888;
  -moz-border-right-colors: rgba(0, 0, 0, 0.08) #888;
  -moz-border-bottom-colors: rgba(0, 0, 0, 0.08) #888;
  -moz-margin-end: -1px;
  margin-top: -2px;
  margin-bottom: 1px;
  padding: 0;
}





  -moz-appearance: textfield;
  cursor: text;
  margin: 4px;
  border: 3px solid;
  -moz-border-top-colors: transparent #888888 #000000;
  -moz-border-right-colors: transparent #FFFFFF #000000;
  -moz-border-bottom-colors: transparent #FFFFFF #000000;
  -moz-border-left-colors: transparent #888888 #000000;
  border-top-right-radius: 2px;
  border-bottom-left-radius: 2px;
  /*padding: 1px 0px 1px 2px ;*/
  padding: 0px;
  background-color: -moz-Field;
  color: -moz-FieldText;
}

html|*.textbox-input, 
html|*.textbox-textarea {





.viewGroupWrapper {
  -moz-box-align: center;
  -moz-box-pack: center;
}

#viewGroup {
  background-color: rgba(0, 0, 0, 0.55);
  padding: 1px;
  border-radius: @toolbarbuttonCornerRadius@;
  -moz-box-shadow: @loweredShadow@;
  margin: 4px 0 9px;
}

#viewGroup > radio,
#viewGroup > toolbarbutton {
  -moz-box-orient: vertical;
  -moz-box-align: center;

#viewGroup > radio:-moz-locale-dir(ltr):first-child,
#viewGroup > radio:-moz-locale-dir(ltr)[first-visible],
#viewGroup > radio:-moz-locale-dir(rtl):last-child,
#viewGroup > radio:-moz-locale-dir(rtl)[last-visible],
#viewGroup > toolbarbutton:-moz-locale-dir(ltr):first-child,
#viewGroup > toolbarbutton:-moz-locale-dir(ltr)[first-visible],
#viewGroup > toolbarbutton:-moz-locale-dir(rtl):last-child,
#viewGroup > toolbarbutton:-moz-locale-dir(rtl)[last-visible] {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
  border-left: none !important;
}

#viewGroup > radio:-moz-locale-dir(ltr):last-child,
#viewGroup > radio:-moz-locale-dir(ltr)[last-visible],
#viewGroup > radio:-moz-locale-dir(rtl):first-child,
#viewGroup > radio:-moz-locale-dir(rtl)[first-visible],
#viewGroup > toolbarbutton:-moz-locale-dir(ltr):last-child,
#viewGroup > toolbarbutton:-moz-locale-dir(ltr)[last-visible],
#viewGroup > toolbarbutton:-moz-locale-dir(rtl):first-child,
#viewGroup > toolbarbutton:-moz-locale-dir(rtl)[first-visible] {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}





#clearListButton {
  -moz-appearance: none;
  min-height: 18px;
  min-width: 0;
  margin: 0 6px;
  padding: 0 2px;
  text-shadow: @loweredShadow@;
  border: 1px solid @toolbarbuttonBorderColor@;
  border-radius: @toolbarbuttonCornerRadius@;
  -moz-box-shadow: @loweredShadow@;
  background: @toolbarbuttonBackground@;
  background-origin: border-box;
}

#clearListButton:hover:active:not([disabled="true"]) {
  background: @toolbarbuttonPressedBackgroundColor@;
  text-shadow: @loweredShadow@;

(-)a/toolkit/themes/pinstripe/mozapps/extensions/eula.css (-2 / +2 lines)

Line	Link Here

Lines 8-19	Link Here

  color: -moz-dialogtext;

  color: -moz-dialogtext;

  background-color: window;

  background-color: window;

  margin: 1em 0 1em 0;

  margin: 1em 0 1em 0;

  border: 1px solid;

  border: 1px solid;

  -moz-border-top-colors: ActiveBorder;

  -moz-border-top-colors: ActiveBorder;

  -moz-border-right-colors: ActiveBorder;

  -moz-border-right-colors: ActiveBorder;

  -moz-border-bottom-colors: ActiveBorder;

  -moz-border-bottom-colors: ActiveBorder;

  -moz-border-left-colors: ActiveBorder;

  -moz-border-left-colors: ActiveBorder;

  -moz-border-radius-topright: 0;

  border-top-right-radius: 0;

  -moz-border-radius-bottomleft: 0;

  border-bottom-left-radius: 0;





  background-color: #c5ccd7;
  -moz-appearance: none;
  margin: 20px;
}

#view-port {
  background-color: #d2d7df;
  border: 1px solid black;
  border-radius: 5px;
}


/*** category selector ***/

#categories {
  -moz-appearance: none;
  border: none;

  border-color: transparent;
  padding: 10px 4px;
  -moz-box-align: center;
  overflow: hidden;
  min-height: 0px;
}

.category:-moz-locale-dir(ltr) {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.category:-moz-locale-dir(rtl) {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.category[disabled] {
  height: 0px;
  opacity: 0;
  -moz-transition-property: height, opacity;
  -moz-transition-duration: 1s, 0.8s;
}

.category-name {
  font-size: 150%;
}

.category-badge {
  background-color: #55D4FF;
  padding: 2px 8px;
  margin: 6px 0px;
  border-radius: 100%;
  color: #FFF;
  font-weight: bold;
  text-align: center;
}

.category-badge[value="0"] {
  visibility: hidden;
}

#header-utils-btn {
  -moz-appearance: none;
  min-width: 4.5em;
  border-width: 1px;
  -moz-border-top-colors: #999;
  -moz-border-bottom-colors: #999;
  -moz-border-left-colors: #999;
  -moz-border-right-colors: #999;
  border-radius: 8px;
  background-image: -moz-linear-gradient(#FFF, #BBB);
  list-style-image: url("chrome://mozapps/skin/extensions/utilities.png");
}

#header-utils-btn:hover,
#header-utils-btn[open="true"] {
  -moz-border-top-colors: #777;
  -moz-border-bottom-colors: #777;

.sort-controls {
  -moz-appearance: none;
}

.sorter {
  -moz-appearance: none;
  border: none;
  background-color: transparent;
  border-radius: 100%;
  padding: 0px 6px;
  margin: 0px 6px;
  min-width: 12px !important;
  -moz-box-direction: reverse;
}

.sorter[checkState="1"],
.sorter[checkState="2"] {

.addon[status="uninstalled"] {
  border: none;
}

.addon[status="uninstalled"] > .container {
  -moz-box-align: center;
  padding: 4px 20px;
  background-color: #FDFFA8;
  border-radius: 8px;
  font-size: 120%;
}

.addon[status="uninstalled"][selected] {
  background-color: transparent;
}



}

#detail-notification {
  -moz-box-align: center;
  -moz-box-pack: center;
  margin: 0px 50px;
  padding: 4px 20px;
  background-color: #FDFFA8;
  border-radius: 8px;
  font-size: 120%;
  border: 2px solid #F0F6A3;
}


/*** creator ***/

.creator > label {

  padding: 0px 1px;
}


/*** download progress ***/

.download-progress {
  background-image: -moz-linear-gradient(#E1E1E1, #FEFEFE);
  border-radius: 100%;
  border: 1px solid #555;
  -moz-box-shadow: #777 1px 1px 2px;
  width: 200px;
  height: 24px;
  margin: 0px 8px;
}

.download-progress .start-cap,

}

.download-progress .start-cap, .download-progress .end-cap {
  width: 12px;
}

.download-progress .start-cap:-moz-locale-dir(ltr),
.download-progress .end-cap:-moz-locale-dir(rtl) {
  border-radius: 100% 0 0 100%;
}

.download-progress .end-cap:-moz-locale-dir(ltr),
.download-progress .start-cap:-moz-locale-dir(rtl) {
  border-radius: 0 100% 100% 0;
}

.download-progress .progress {
  -moz-appearance: none;
  padding: 0px;
  margin: 0px;
  border: none;
}

.download-progress .pause, .download-progress .cancel {
  -moz-appearance: none;
  background-image: -moz-linear-gradient(#E1E1E1, #FEFEFE);
  border-width: 1px 0px 0px 1px;
  padding-right: 1px;
  border-style: solid;
  -moz-border-top-colors: #FFF;
  -moz-border-left-colors: #FFF;
  border-radius: 100%;
  min-width: 16px;
  width: 16px;
  height: 16px;
  margin: 3px;
  -moz-box-shadow: #777 1px 1px 1px;
}

.download-progress .pause {



/*** buttons ***/

.addon-control {
  -moz-appearance: none;
  padding: 0px 5px;
  border: 1px solid #A2A6AD;
  border-radius: 100%;
  background-image: -moz-linear-gradient(#F9F9F9, #DFDFDF);
}

.addon-control:hover {
  border-color: #75797F;
}

.addon-control.enable:hover {

}

.contribute {
  -moz-appearance: none;
  color: #FFF;
  font-weight: bold;
  text-shadow: #4C9EF8 -1px -1px 1px;
  border: 1px solid #4C9EF8;
  border-radius: 100%;
  background-image: -moz-linear-gradient(#93C5FA, #4C9EF8);
  -moz-padding-start: 20px;
  -moz-padding-end: 4px;
}

.contribute:hover {
  border-color: #4271FF;
  background-image: -moz-linear-gradient(#49CEFF, #4271FF);





.mainBox {
    text-align: center;
    background-image: -moz-repeating-linear-gradient(-45deg,
                                                     rgba(65, 65, 65, 0.8),
                                                     rgba(65, 65, 65, 0.8) 20px,
                                                     rgba(69, 69, 69, 0.8) 20px,
                                                     rgba(69, 69, 69, 0.8) 40px);
    color: white;
    border-radius: 12px;
    /* recessed effect with dark inner shadow and lightened bottom */
    -moz-box-shadow: inset 0 1px 5px rgba(0,0,0,0.8),
                           0 1px 0 rgba(255,255,255,0.2);
    padding: 5px;
    -moz-user-select: none;
}

html|a {






.wizard-buttons button {
  -moz-appearance: none;
  min-height: 22px;
  margin: 0 6px;
  padding: 0 2px;
  text-shadow: @loweredShadow@;
  border: 1px solid @toolbarbuttonBorderColor@;
  border-radius: @toolbarbuttonCornerRadius@;
  -moz-box-shadow: @loweredShadow@;
  background: @toolbarbuttonBackground@;
  background-origin: border-box;
}

.wizard-buttons button:hover:active:not([disabled="true"]) {
  background: @toolbarbuttonPressedBackgroundColor@;
  text-shadow: @loweredShadow@;






body {
  color: -moz-FieldText;
  position: relative;
  min-width: 330px;
  max-width: 50em;
  margin: 4em auto;
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  background: -moz-Field;
}

.aboutPageWideContainer {
  max-width: 80%;
}





  margin-top: 2em;
}

table {
  table-layout: fixed;
  width: 100%;
  margin-bottom: 1em;
  padding: 0.5em 0;
  border-radius: 10px;
}

#disk,
#memory,
#offline {
  background-color: rgba(0, 0, 0, .1);
}






  background-color: -moz-Dialog;
}

#warningBox
{
  background-color: -moz-Field;
  color: -moz-FieldText;
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  margin-left: 1em;
  margin-right: 1em;
}

#warningInnerBox
{





  color: -moz-dialogtext;
  font: message-box;
  padding-left: 2em;
  padding-right: 2em;
}

body {
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  min-width: 30em;
  max-width: 65em;
  margin: 4em auto;
  background-color: -moz-field;
  color: -moz-fieldtext;
}







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

/* ::::: groupbox ::::: */

groupbox {
  -moz-appearance: groupbox;
  border: 2px groove ThreeDFace;
  border-radius: 3px;
  margin: 3px;
  padding: 3px 3px 6px;
}

.groupbox-body {
  padding: inherit;
}






  min-width: 16px;
  min-height: 11px;
}

.volumeBackgroundBar {
  /* margin left/right: make bar 8px wide (control width = 28, minus 2 * 10 margin) */
  margin: 0 10px;
  background-color: rgba(255,255,255,.5);
  border-radius: 4px 4px;
}


.durationBox {
  -moz-box-pack: center;
}

.durationLabel {

  font-family: Arial, sans-serif;
}

.backgroundBar {
  /* margin top/bottom: make bar 8px tall (control height = 28, minus 2 * 10 margin) */
  /* margin left/right: 1/2 of scrubber thumb width, for overhang. */
  margin: 10px 22px;
  background-color: rgba(255,255,255,.5);
  border-radius: 4px;
}

.bufferBar,
.progressBar {
  /* margin top/bottom: make bar 8px tall (control height = 28, minus 2 * 10 margin) */
  /* margin left/right: 1/2 of scrubber thumb width, for overhang. */
  margin: 10px 22px;
  -moz-appearance: none;

/* .progress-bar is an element inside the <progressmeter> implementation. */
.bufferBar .progress-bar {
  /*
   * Note that this is drawn on top of the .backgroundBar. So although this
   * has the same background-color specified, the semitransparent
   * compositing gives it a different visual appearance.
   */
  background-color: rgba(255,255,255,.5);
  border-radius: 4px;
  -moz-appearance: none;
}

.progressBar .progress-bar {
  background-color: white;
  border-radius: 4px 0 0 4px;
  -moz-appearance: none;
}

/* .scale-slider is an element inside the <scale> implementation. */
.scrubber .scale-slider,
.volumeControl .scale-slider {
  /* Hide the default horizontal bar. */
  -moz-appearance: none;





}

#errorPageContainer {
  position: relative;
  min-width: 13em;
  max-width: 52em;
  margin: 4em auto;
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 3em;
  -moz-padding-start: 30px;
  background: url("chrome://global/skin/icons/warning-large.png") left 0 no-repeat -moz-Field;
  background-origin: content-box;
}

#errorPageContainer.certerror {
  background-image: url("chrome://global/skin/icons/sslWarning.png");

#securityOverrideDiv {
  padding-top: 10px;
}

#securityOverrideContent {
  background-color: InfoBackground;
  color: InfoText;
  padding: 10px;
  border-radius: 10px;
}

/* Custom styling for 'blacklist' error class */
:root.blacklist #errorTitle, :root.blacklist #errorLongContent,
:root.blacklist #errorShortDesc, :root.blacklist #errorLongDesc,
:root.blacklist a {
  background-color: #722; /* Dark red */
  color: white;






.radio-check-box1 {
  -moz-appearance: radio;
  margin: 1px 0px;
  border-top: 1px solid ThreeDShadow;
  border-right: 1px solid ThreeDHighlight;
  border-bottom: 1px solid ThreeDHighlight;
  border-left: 1px solid ThreeDShadow;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  background-color: -moz-Field;
}

.radio-check-box2 {
  border-top: 1px solid ThreeDDarkShadow;
  border-right: 1px solid ThreeDLightShadow;
  border-bottom: 1px solid ThreeDLightShadow;
  border-left: 1px solid ThreeDDarkShadow;
  border-radius: 50%;
  padding: 2px;
  width: 4px;
  height: 4px;
  list-style-image: none;
}

radio:hover:active > .radio-check-box1 {
  background-color: -moz-Dialog;





  margin-top: 2px;
  border-top: 2px solid;
  border-right: 2px solid;
  border-left: 2px solid;
  border-bottom: 1px solid ThreeDHighlight;
  -moz-border-top-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
  -moz-border-left-colors: ThreeDHighlight ThreeDLightShadow;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  padding: 1px 4px 2px 4px;
  background-color: -moz-Dialog;
  color: -moz-DialogText;
}

tab:-moz-locale-dir(rtl) {
  border-bottom-left-radius: 1px;
  border-bottom-right-radius: 0px;
}

.tab-text {
  margin: 0 !important;
}

tab[selected="true"] {
  margin-top: 0;

tab:-moz-focusring > .tab-middle {
  /* Don't specify the outline-color, we should always use initial value. */
  outline: 1px dotted;
}

tab[beforeselected="true"]:-moz-locale-dir(ltr),
tab[selected="true"]:-moz-locale-dir(rtl) + tab {
  border-right: none;
  border-top-right-radius: 0;
}

tab[selected="true"]:-moz-locale-dir(ltr) + tab,
tab[beforeselected="true"]:-moz-locale-dir(rtl) {
  border-left: none;
  border-top-left-radius: 0;
}

tab:first-of-type[selected="true"] {
  padding-right: 5px;
  padding-left: 5px;
}

/* ::::: tab-bottom ::::::::::


.tab-bottom {
  margin-top: 0;
  margin-bottom: 2px;
  border-top: 1px solid;
  border-bottom: 2px solid;
  -moz-border-top-colors: ThreeDShadow;
  -moz-border-bottom-colors: ThreeDShadow ThreeDLightShadow;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
  padding: 2px 4px 1px 4px;
}

.tab-bottom[selected="true"] {
  margin-bottom: 0;
  -moz-border-top-colors: -moz-Dialog;
  padding: 4px 6px 1px 6px;
}

.tab-bottom[beforeselected="true"]:-moz-locale-dir(ltr),
.tab-bottom[selected="true"]:-moz-locale-dir(rtl) + .tab-bottom {
  border-bottom-right-radius: 0;
}

.tab-bottom[selected="true"]:-moz-locale-dir(ltr) + .tab-bottom,
.tab-bottom[beforeselected="true"]:-moz-locale-dir(rtl) {
  border-bottom-left-radius: 0;
}

/* ::::: tabs-bottom ::::: */

.tabs-bottom > .tabs-left,
.tabs-bottom > .tabs-right {
  border-top: 1px solid ThreeDShadow;
  border-bottom: none;





  background-color: #c5ccd7;
  -moz-appearance: none;
  margin: 20px;
}

#view-port {
  background-color: #d2d7df;
  border: 1px solid black;
  border-radius: 5px;
}


/*** category selector ***/

#categories {
  -moz-appearance: none;
  border: none;

  border-color: transparent;
  padding: 10px 4px;
  -moz-box-align: center;
  overflow: hidden;
  min-height: 0px;
}

.category:-moz-locale-dir(ltr) {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.category:-moz-locale-dir(rtl) {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.category[disabled] {
  height: 0px;
  opacity: 0;
  -moz-transition-property: height, opacity;
  -moz-transition-duration: 1s, 0.8s;
}

.category-name {
  font-size: 150%;
}

.category-badge {
  background-color: #55D4FF;
  padding: 2px 8px;
  margin: 6px 0px;
  border-radius: 100%;
  color: #FFF;
  font-weight: bold;
  text-align: center;
}

.category-badge[value="0"] {
  visibility: hidden;
}

#header-utils-btn {
  -moz-appearance: none;
  min-width: 4.5em;
  border-width: 1px;
  -moz-border-top-colors: #999;
  -moz-border-bottom-colors: #999;
  -moz-border-left-colors: #999;
  -moz-border-right-colors: #999;
  border-radius: 8px;
  background-image: -moz-linear-gradient(#FFF, #BBB);
  list-style-image: url("chrome://mozapps/skin/extensions/utilities.png");
}

#header-utils-btn:hover,
#header-utils-btn[open="true"] {
  -moz-border-top-colors: #777;
  -moz-border-bottom-colors: #777;

.sort-controls {
  -moz-appearance: none;
}

.sorter {
  -moz-appearance: none;
  border: none;
  background-color: transparent;
  border-radius: 100%;
  padding: 0px 6px;
  margin: 0px 6px;
  min-width: 12px !important;
  -moz-box-direction: reverse;
}

.sorter[checkState="1"],
.sorter[checkState="2"] {

.addon[status="uninstalled"] {
  border: none;
}

.addon[status="uninstalled"] > .container {
  -moz-box-align: center;
  padding: 4px 20px;
  background-color: #FDFFA8;
  border-radius: 8px;
  font-size: 120%;
}

.addon[status="uninstalled"][selected] {
  background-color: transparent;
}



}

#detail-notification {
  -moz-box-align: center;
  -moz-box-pack: center;
  margin: 0px 50px;
  padding: 4px 20px;
  background-color: #FDFFA8;
  border-radius: 8px;
  font-size: 120%;
  border: 2px solid #F0F6A3;
}


/*** creator ***/

.creator > label {

  padding: 0px 1px;
}


/*** download progress ***/

.download-progress {
  background-image: -moz-linear-gradient(#E1E1E1, #FEFEFE);
  border-radius: 100%;
  border: 1px solid #555;
  -moz-box-shadow: #777 1px 1px 2px;
  width: 200px;
  height: 24px;
  margin: 0px 8px;
}

.download-progress .start-cap,

}

.download-progress .start-cap, .download-progress .end-cap {
  width: 12px;
}

.download-progress .start-cap:-moz-locale-dir(ltr),
.download-progress .end-cap:-moz-locale-dir(rtl) {
  border-radius: 100% 0 0 100%;
}

.download-progress .end-cap:-moz-locale-dir(ltr),
.download-progress .start-cap:-moz-locale-dir(rtl) {
  border-radius: 0 100% 100% 0;
}

.download-progress .progress {
  -moz-appearance: none;
  padding: 0px;
  margin: 0px;
  border: none;
}

.download-progress .pause, .download-progress .cancel {
  -moz-appearance: none;
  background-image: -moz-linear-gradient(#E1E1E1, #FEFEFE);
  border-width: 1px 0px 0px 1px;
  padding-right: 1px;
  border-style: solid;
  -moz-border-top-colors: #FFF;
  -moz-border-left-colors: #FFF;
  border-radius: 100%;
  min-width: 16px;
  width: 16px;
  height: 16px;
  margin: 3px;
  -moz-box-shadow: #777 1px 1px 1px;
}

.download-progress .pause {

}

.contribute {
  -moz-appearance: none;
  color: #FFF;
  font-weight: bold;
  text-shadow: #4C9EF8 -1px -1px 1px;
  border: 1px solid #4C9EF8;
  border-radius: 100%;
  background-image: -moz-linear-gradient(#93C5FA, #4C9EF8);
  -moz-padding-start: 20px;
  -moz-padding-end: 4px;
}

.contribute:hover {
  border-color: #4271FF;
  background-image: -moz-linear-gradient(#49CEFF, #4271FF);





.mainBox {
    text-align: center;
    background-image: -moz-repeating-linear-gradient(-45deg,
                                                     rgba(65, 65, 65, 0.8),
                                                     rgba(65, 65, 65, 0.8) 20px,
                                                     rgba(69, 69, 69, 0.8) 20px,
                                                     rgba(69, 69, 69, 0.8) 40px);
    color: white;
    border-radius: 12px;
    /* recessed effect with dark inner shadow and lightened bottom */
    -moz-box-shadow: inset 0 1px 5px rgba(0,0,0,0.8),
                           0 1px 0 rgba(255,255,255,0.2);
    padding: 5px;
    -moz-user-select: none;
}

html|a {

Return to bug 451134