/*
.buttons css
pods theme
tim sheiner and christie rixford
*/


/* .button style solution from the filament group
http://www.filamentgroup.com/lab/update_styling_the_button_element_with_css_sliding_doors_now_with_image_spr/
*/

/* SHARED .button STYLES: */
		
.button { 
	position: relative;
	border: 0; 
	padding: 0;
	cursor: pointer;
	overflow: visible; /* removes extra side padding in IE */
	background-repeat: no-repeat;
	background-color: transparent;
}

.button.disabled,
.button[disabled] {
	cursor:default;
}

.button::-moz-focus-inner {
	padding:0;
	border: none; /* overrides extra padding in Firefox */
}

.button .wrap { 
	position: relative;
	display: block !important; 
	white-space: nowrap;
	background-image:inherit;
	background-repeat: no-repeat;
	background-color: inherit;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari and Google Chrome only */
	
	/*to address discrepancy in rendering between PC and Mac WebKit*/
	
	.button {
		margin-top: -1px;
		margin-bottom: -1px;
	}

	
	.button>.wrap {
  		margin-top:-1px;
	}

	
	.tabSet.horizontal .button>.wrap {
		margin-top:0;
	}	

}

.button .icon,
.button .indicator {
	display: inline-block;
	background-repeat: no-repeat;
}

.button .indicator {
	background-image: url(images/disclosure_indicators_sprite.png);
	width:9px;
	height: 24px;
	right:0;
	top:0;
	position: absolute;
}

.button .icon {
	width:20px;
	height:24px;
	position: absolute;
	top:0;
	left:0;
}

.button.capsule.first .icon {
	left:12px;
}


.button.disabled .icon,
.button[disabled] .icon {
	opacity:.4;
}

/* END SHARED STYLES */

/* .button.action */

.action { 
  padding: 0 15px 0 0; 
  margin-right:5px; 
  text-align: center; 
  background-image: url(images/button_action_sprite.png);
  background-position: right -52px;  
  display: inline-block;
  text-decoration: none;
}

.action>.wrap {
  padding: 0 0 0 15px; 
  line-height: 32px;
  font-size: 11px;
  background-position: left 0;
  border:none;
}

.action.over {   
	background-position: right -156px; 
}

.action.over>.wrap {
	background-position: left -104px;
}

.action.pressed {
	background-position: right -260px; 
}

.action.pressed>.wrap {
	background-position: left -208px;
}

.action.disabled,
.action[disabled] {
	background-position: right -52px; 
}

.action.disabled>.wrap,
.action[disabled]>.wrap {
	background-position: left 0px;
}

.action.primary { 
	padding-right: 20px;
	background-image: url(images/button_action_primary_sprite.png); 
}

.action.primary>.wrap { 
	padding-left: 20px;
}

/* action.jumbo */

.action.jumbo { 
  padding: 0 34px 0 0; 
  margin-right:5px; 
  text-align: center; 
  background-image: url(images/button_action_jumbo_sprite.png);
  background-position: right -240px; 
  text-decoration:none;
}

.action.jumbo>.wrap {
	font-size:22px;
	height:180px;
	left:2px;
	line-height:40px;
	padding:0 0 0 25px;
	background-position: left top;
	min-width: 222px;
	margin-top:0;
}

.action.jumbo>.icon { 
	background-image: url(images/home_icons_sprite.png);
	width:222px;
	height:130px;
	position: absolute;
	top:50%;
	left:50%;
	margin-left:-111px;
	margin-top:-50px;
}


.action.jumbo.over {   
	background-position: right -711px; 
}

.action.jumbo.over>.wrap {
	background-position: left -471px;
}

.action.jumbo.pressed {
	background-position: right -1192px; 
}

.action.jumbo.pressed>.wrap {
	background-position: left -952px;
}

.action.jumbo.disabled,
.action.jumbo[disabled] {
	background-position: right -240px; 
}

.action.jumbo.disabled>.wrap,
.action.jumbo[disabled]>.wrap {
	background-position: left 0px;
}

/* .action.square.button */
	
.action.square { 
  text-align: center; 
  background-position: right -52px;
  width:34px;
}

.action.square>.wrap {
  height: 32px;
  width: 20px;
  background-position: left top;
  padding:0;
  text-indent:-5000px;
}

.action.square>.wrap>.icon {
	display: block;
	height: 32px;
	width: 34px;
	background-image: url(images/button_action_square_icons_sprite.png);
	background-repeat: no-repeat;
}

.action.square.over {   
	background-position: right -156px; 
}

.action.square.over>.wrap {
	background-position: left -104px;
}

.action.square.pressed {
	background-position: right -260px; 
}

.action.square.pressed>.wrap {
	background-position: left -208px;
}

/* END .button.action */

/* .button.options */

.button.options { 
  padding: 0 15px 0 0; 
  margin-right:5px; 
  text-align: center; 
  background-image: url(images/button_options_sprite.png);
  background-position: right -41px; 
}

.button.options>.wrap {
  padding: 0 0 0 15px; 
  line-height: 21px;
  background-position: left top;
  border:none;
}

.button.options.over {   
	background-position: right -123px; 
}

.button.options.over>.wrap {
	background-position: left -82px;
}

.button.options.pressed {
	background-position: right -205px; 
}

.button.options.pressed>.wrap {
	background-position: left -164px;
}

.button.options.disabled {
	background-position: right -41px; 
}

.button.options.disabled>.wrap {
	background-position: left 0px;
}

/* END .button.options */

/* .button.capsule */

	/* metrics */

.button.capsule { 
  padding: 0 15px 0 0; 
  margin:4px 5px 4px auto;   
  text-align: center; 
  background-image: url(images/button_capsule_sprite.png);
}

.button.capsule .wrap {
  padding: 0 0 0 15px; 
  line-height: 26px;
  height: 26px;
  min-width: 20px;
}

.button.capsule .icon {
	left:6px;
}

.button.capsule.mutton .wrap {
  padding-right: 10px;
}

.buttonSet .button.capsule.first {
	padding-right: 5px;
	margin-right:0;
}

.buttonSet .button.capsule.middle {
	margin-right:0;
	padding-right:5px;
}

.buttonSet .button.capsule.middle .wrap,
.buttonSet .button.capsule.last .wrap {
	padding-left:5px;
}

.buttonSet .button.capsule.first .wrap {
	border-left:none;
	padding-left:15px;
	padding-right:3px;
}

.buttonSet .button.capsule.last {
	border-right: none;
	padding-right:12px;
}

.buttonSet {
	margin:0 15px 0 0;
	display: inline-block;
	position: relative;
}

	/* sprite positions */


.button.capsule .indicator {
	background-position: 0px -44px;
}

.button.capsule.over .indicator,
.button.capsule.pressed .indicator {
	background-position: 0px -78px;
}

.button.capsule.up { 
  background-position: right -46px; 
}

.button.capsule.up .wrap  {
  background-position: left top;
}

.button.capsule.up.over {   
	background-position: right -184px; 
}

.button.capsule.up.over .wrap {
	background-position: left -138px;
}

.button.capsule.up.pressed {
	background-position: right -322px; 
}

.button.capsule.up.pressed .wrap {
	background-position: left -276px;
}

.button.capsule.down,
.button.capsule.down.over {
	background-position: right -322px; 
}

.button.capsule.down .wrap,
.button.capsule.down.over .wrap {
	background-position: left -276px;
}

.button.capsule.disabled {
	background-position: right -46px; 
}

.button.capsule.disabled .wrap {
	background-position: left 0px;
}

.button.capsule.down.pressed {
	background-position: right -460px; 
}

.button.capsule.down.pressed .wrap {
	background-position: left -414px;
}

/* grouped capsule .buttons */

.button.capsule.up.first {
	background-position: right -674px; 
}

.button.capsule.up.first.over {
	background-position: right -729px; 
}

.button.capsule.up.middle,
.button.capsule.up.middle .wrap,
.button.capsule.up.last .wrap {
	background-position: left -92px; 
	background-repeat: repeat-x;
}

.button.capsule.up.middle.over,
.button.capsule.up.middle.over .wrap,
.button.capsule.up.last.over .wrap {   
	background-position: 0px -230px; 
}


.button.capsule.up.middle.pressed .wrap,
.button.capsule.up.last.pressed .wrap,
.button.capsule.down.middle .wrap,
.button.capsule.down.last .wrap,
.button.capsule.down.middle.over .wrap,
.button.capsule.down.last.over .wrap {   
	background-position: 0px -368px; 
}

.button.capsule.up.first.pressed,
.button.capsule.up.middle.pressed,
.button.capsule.down.first,
.button.capsule.down.first.over,
.button.capsule.down.middle,
.button.capsule.down.middle.over {   
	background-position: right -567px; 
}

.button.capsule.down.middle.pressed .wrap,
.button.capsule.down.last.pressed .wrap {   
	background-position: 0px -506px; 
}

.button.capsule.down.first.pressed,
.button.capsule.down.middle.pressed {   
	background-position: right -627px; 
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari and Google Chrome only */
	
	/*to address discrepancy in rendering between PC and Mac WebKit
	  - not entitely satisfactory because does not preserve identical appearance to FF in Mac case
	*/
	.button.capsule.middle>.wrap,
	.button.capsule.last>.wrap {
		margin-left:-3px;
		padding-left: 8px !important;
	}
}



/* END .button.capsule */

/* START .button.minimize */

.button.minimize {
	height: 16px;
	width: 16px;
	display: block;
	background-image: url(images/disclosure_indicators_sprite.png);
	background-repeat: no-repeat;
	background-position: 0 -489px;
	top:10px;
	left: 0;
	z-index: 10;
	text-indent: -9999px;
}

.button.minimize.over {
	background-position: 0 -522px;
}

.button.minimize.pressed {
	background-position: 0 -555px;
}

.minimized .button.minimize {
	
}

/* END .button.minimize */



/* START .button.disclosure */

.button.disclosure {
	height: 16px;
	width: 16px;
	display: inline-block;
	background-image: url(images/disclosure_indicators_sprite.png);
	background-repeat: no-repeat;
	vertical-align: middle;
}

.closed .button.disclosure,
.minimized .button.disclosure {
	background-position: 0px -205px;
}

.closed .button.disclosure.over,
.minimized .button.disclosure.over {
	background-position: 0px -229px;
}

.closed .button.disclosure.pressed,
.minimized .button.disclosure.pressed {
	background-position: 0px -257px;
}

.button.disclosure,
.button.disclosure.down {
	background-position: 0px -286px;
}

.button.disclosure.over,
.button.disclosure.down.over {
	background-position: 0px -310px;
}

.button.disclosure.pressed,
.button.disclosure.down.pressed {
	background-position: 0px -336px;
}

/* END .button.disclosure */

/* START .button.scheduled */

.button.scheduled {
	height: 16px;
	width: 16px;
	display: inline-block;
	background-image: url(images/disclosure_indicators_sprite.png);
	background-repeat: no-repeat;
	background-position: 0 -406px;
	z-index: 10;
	position: relative;
}

.button.scheduled.over {
	background-position: 0 -432px;
}

.button.scheduled.pressed {
	background-position: 0 -458px;
}


/* END .button.scheduled */


/* START .button.picker */

.button.picker {
	height: 16px;
	width: 16px;
	display: inline;
	background-image: url(images/disclosure_indicators_sprite.png);
	background-repeat: no-repeat;
	background-position: 0 -589px;
	z-index: 10;
}

.button.picker.over {
	background-position: 0 -618px;
}

.button.picker.pressed {
	background-position: 0 -653px;
}


/* END .button.picker */


/* .button.search */
  	
#globalSearch .button.search {
	height:29px;
	width: 41px;
	margin-top:-2px;
	margin-right:-3px;
}

#globalSearch .button.search.up,
#globalSearch .button.search.disabled {
	background-position: 0px -76px;
}

#globalSearch .button.search.over {
	background-position: -63px -76px;
}

#globalSearch .button.search.pressed {
	background-position: -131px -76px;
}


.button.search {
	height:24px;
	width: 35px;
	background-image: url(images/search_sprite.png);
	background-repeat: no-repeat;
}

.button.search.up,
.button.search.disabled {
	background-position: 0px -124px;
}

.button.search.over {
	background-position: -64px -124px;
}

.button.search.pressed {
	background-position: -132px -124px;
}


/* END .button.search */
		

/* .move.button */
	
.move.right .icon {
	background-position: 8px 9px;
}

.move.left .icon {
	background-position: 8px -44px;
}

.move.toRight .icon {
	background-position: 9px -150px;
}

.move.toLeft .icon {
	background-position: 8px -97px;
}

.move.upward .icon {
	background-position: 8px -217px;
}

.move.downward .icon {
	background-position: 8px -270px;
}

.move.toTop .icon {
	background-position: 8px -336px;
}

.move.toBottom .icon {
	background-position: 8px -387px;
}


.move.right.over .icon,
.move.right.pressed .icon {
	background-position: -46px 9px;
}


.move.left.over .icon,
.move.left.pressed .icon {
	background-position: -46px -44px;
}


.move.toRight.over .icon,
.move.toRight.pressed .icon  {
	background-position: -46px -150px;
}


.move.toLeft.over .icon,
.move.toLeft.pressed .icon {
	background-position: -46px -97px;
}


.move.upward.over .icon,
.move.upward.pressed .icon {
	background-position: -46px -217px;
}


.move.downward.over .icon,
.move.downward.pressed .icon {
	background-position: -46px -270px;
}


.move.toTop.over .icon,
.move.toTop.pressed .icon {
	background-position: -46px -336px;
}


.move.toBottom.over .icon,
.move.toBottom.pressed .icon {
	background-position: -46px -387px;
}


/* .action.join.button */
	
.action.join.left .icon {
	background-position: 4px -693px;
}

.action.join.right .icon {
	background-position: 4px -723px;
}

.action.join.inner .icon {
	background-position: 4px -752px;
}

.action.join.full .icon {
	background-position: 4px -780px;
}

.action.join.left.over .icon,
.action.join.left.pressed .icon {
	background-position: -32px -693px;
}

.action.join.right.over .icon,
.action.join.right.pressed .icon {
	background-position: -32px -723px;
}

.action.join.inner.over .icon,
.action.join.inner.pressed .icon  {
	background-position: -32px -752px;
}

.action.join.full.over .icon,
.action.join.full.pressed .icon  {
	background-position: -32px -780px;
}

/* domain designer buttons */
#add.square>.wrap>.icon {
	background-position: 6px -655px;
}

#add.square.over>.wrap>.icon,
#add.square.pressed>.wrap>.icon {
	background-position: -33px -655px;
}

#addToSet.square>.wrap>.icon {
	background-position: 6px -615px;
}

#addToSet.square.over>.wrap>.icon,
#addToSet.square.pressed>.wrap>.icon {
	background-position: -33px -615px;
}

/* .button.action */

.footer .action {
	margin-bottom: 50px;
	position:relative;
	z-index:1;
}

/* .button.options */

.filter .button.options {
	margin-left:20px;
	margin-right: 10px;
	border-width: 0;
}

.filter .button.options>.wrap {
	border-width: 0;
}