.ContainersBase
{
  width:100%;
  height:100%;
}

.Outer
{
  flow-children: down;
  border: 1px solid #555555;
  background-color: #000000;
}

#Inner
{
  margin:0px 10px 10px 10px;
  flow-children: down;
  border: 1px solid #555555;
  align: center center;
  background-color: #333333;
}

#Header
{
  background-color: #000000;
  width: 100%;
  height: 40px;
  align: center top;

}

#CloseButton
{
  align: right top;
}

#HeaderLabel
{
  align: center center;
  font-weight: bold;
  font-size: 25;
}

#Footer
{
  margin-bottom: 8px;
  align: center center;
  flow-children: right;
  //visibility: collapse;
}

.ButtonBevel
{
  margin-right: 2px;
  margin-left: 2px;
  min-height: 0px;
  min-width: 0px;
  vertical-align: middle;
  horizontal-align: center;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-right: 6px;
  padding-left: 6px;
}

.ButtonBevel Label
{
  font-size: 16px;
  margin-top: 2px;
}




.InventoryOverlayRoot
{
  horizontal-align: right;
  vertical-align: bottom;
  margin-bottom: 28px;
  margin-right: 10px; 
  
  flow-children: down;
}

.AspectRatio5x4 #inventory_items.Flipped
{
  margin-right: 0px;
  margin-left: 80px;
}

.AspectRatio5x4 #inventory_items
{
  margin-bottom: 26px;
  margin-right: 80px;
}

.AspectRatio4x3 #inventory_items.Flipped
{
  margin-right: 0px;
  margin-left: 100px;
}

.AspectRatio4x3 #inventory_items
{
  margin-bottom: 30px;
  margin-right: 100px;
}

.AspectRatio16x9 #inventory_items.Flipped
{
  margin-right: 0px;
  margin-left: 230px;
}

.AspectRatio16x9 #inventory_items
{
  margin-bottom: 27px;
  margin-right: 230px;
}

.AspectRatio16x10 #inventory_items.Flipped
{
  margin-right: 0px;
  margin-left: 230px;
}

.AspectRatio16x10 #inventory_items
{
  margin-bottom: 30px;
  margin-right: 230px;
}


#inventory_items.Flipped
{
  horizontal-align: left;
}

#inventory_items
{
  flow-children: down;
  border: 2px solid black;
  horizontal-align: right;
  vertical-align: bottom; 
  margin-bottom: 235px;
}


.AspectRatio5x4 #stash_row
{
  margin-bottom: 235px;
  transform: scale3d(.75, .75, 1);
}

.AspectRatio4x3 #stash_row
{
  margin-bottom: 255px;
}

.AspectRatio16x9 #stash_row
{
  margin-bottom: 235px;
}

.AspectRatio16x10 #stash_row
{
  margin-bottom: 225px;
}

#stash_row.Flipped
{
  horizontal-align: left;
  transform-origin: 0% 50%;
} 

#stash_row
{
  transform-origin: 100% 50%;
  transform: scale3d(.8, .8, 1);
  flow-children: right;
  background-color: #222222;
  border: 2px solid black; 
  horizontal-align: right;
  vertical-align: bottom;
}

#inventory_row_1
{
  flow-children: right;
  background-color: #222222;
}

#inventory_row_2
{
  flow-children: right;
  background-color: #222222;
}

.ItemRow
{
  margin-top: 4px;
  margin-bottom: 4px;
  margin-left: 4px;
  margin-right: 4px;
  flow-children: right; 
  background-color: #222222;
  align: center center;
}
 
.ItemPanel
{
  width: 66px;
  height: 48px;
  box-shadow: #000000ff 1px 1px 2px 2px;

  margin-top: 4px;
  margin-bottom: 4px;
  margin-left: 4px;
  margin-right: 4px;
  align: center center;
}

#ItemButton
{
  align: center center;
  width: 100%;
  height: 100%;
}

#ItemImage
{
  align: center center; 
  width: 100%;
  height: 100%;
}


.Charges
{
  font-size: 18px;
  text-shadow: 0px 0px 6px 6 #000000;
}

#ChargeCount
{
  visibility: collapse;
  vertical-align: bottom;
  horizontal-align: right;
  margin-right: 4px;
  margin-bottom: -6px;
}

#AltChargeCount
{
  font-size: 14px;
  visibility: collapse;
  vertical-align: bottom;
  horizontal-align: left;
  margin-left: 4px;
  margin-bottom: -2px;
}

.show_charges #ChargeCount
{
  visibility: visible;
}

.show_alt_charges #AltChargeCount
{
  visibility: visible;
}

.no_hotkey #Hotkey
{
  visibility: collapse;
}

.ItemMenu
{
  flow-children: down;
}

.dragging_from
{
  saturation: 0.5;
  wash-color: #808080;
}

.is_active
{
  saturation: 1.5;
}

#DropTargetHighlight
{
  width: 100%;
  height: 100%;
  background-color: gradient( radial, 50% -20%, 0% 0%, 80% 80%, from( #FFFFFF ), to( #FFFFFF00 ) );
  opacity: 0;
}

.potential_drop_target #DropTargetHighlight
{
  opacity: 0.3;
}

#Contents
{
  padding: 0px;
  margin: 0px;
}

.ItemMenuButton
{
  visibility: collapse;
  width: 200px;
  height: 40px;
  border: 1px solid black;
  padding: 4px;
  padding-left: 8px;
  background-color: #291818;
}

.ItemMenuButton:hover
{
  background-color: #443837;
}

.ItemMenuButton Label
{
  font-size: 16px;
  vertical-align: center;
  color: #acaaaa;
}

.ItemMenuButton:hover Label
{
  color: #eae9e9;
}

.bSellable #Sell
{
  visibility: visible;
}
.bDisassemble #Disassemble
{
  visibility: visible;
}
.bShowInShop #ShowInShop
{
  visibility: visible;
}
.bDropFromStash #DropFromStash
{
  visibility: visible;
}
.bAlertable #Alert
{
  visibility: visible;
}
.bMoveToStash #MoveToStash
{
  visibility: visible;
}










#CooldownOverlay
{
  height: 100%;
  background-color: #000000DD;
}

#CooldownTimer
{
  color: white;
    font-size: 24px;
  text-shadow: 0px 0px 6px 6 #000000;
    horizontal-align: center;
    vertical-align: center;
}

#Cooldown
{
  width: 100%;
  height: 100%;
  visibility: collapse;
}

.in_cooldown #Cooldown
{
  visibility: visible;
}

#Price
{
  color: #FFD700;
    font-size: 14px;
    font-weight: bold;
  text-shadow: 0px 0px 6px 3 #846722;
  margin-right: -2px;
  margin-bottom: -4px;

  vertical-align: top;
  horizontal-align: left;
  visibility: collapse;
}

.show_price #Price
{
  visibility: visible;
}

.high_price #ItemImage
{
  wash-color: #404040;
}

.high_price #Price
{
  color: #cc0000;
  text-shadow: 0px 0px 6px 3 #660000;
}

#Stock
{
  color: #a020a0;
    font-size: 14px;
    font-weight: bold;
  text-shadow: 0px 0px 6px 3 #400040;
  margin-right: -2px;
  margin-bottom: -4px;

  vertical-align: top;
  horizontal-align: right;
  visibility: collapse;
}

.show_stock #Stock
{
  visibility: visible;
}

.out_of_stock #Stock
{
  color: #999999;
  text-shadow: 0px 0px 6px 3 #444444;
}

.out_of_stock #ItemImage
{
  wash-color: #404040;
}

#ManaCost
{
  color: #c0e8fb;
    font-size: 14px;
    font-weight: bold;
  text-shadow: 0px 0px 6px 8 #245191;
  margin-right: -2px;
  margin-bottom: -4px;

  vertical-align: bottom;
  horizontal-align: right;
  visibility: collapse;
}

.no_mana_cost #ManaCost
{
  visibility: collapse;
}

.low_mana #ItemImage
{
  wash-color: #8080ff;
}

#ActiveAbility
{
  width: 100%;
  height: 100%;
  background-color: gradient( radial, 50% -20%, 0% 0%, 80% 80%, from( #FFFFFF ), to( #FFFFFF00 ) );
  border: 4px solid #FFFFFF40;
  opacity: 0;
}

.is_active #ActiveAbility
{
  opacity: 1;
}

#Hotkey
{
  margin-left: -4px;

  vertical-align: top;
  horizontal-align: left;
  min-width: 18px;
}

#HotkeyBlock
{

  vertical-align: top;
  horizontal-align: left;
  min-width: 18px;
  min-height: 17px;
  width: 18px;
  clip: rect(0%, 200%, 200%, 0%);

  background-color: gradient( linear, 0% 0%, 0% 100%, from( #393939 ), to( #414849 ) );
  border: 1px solid #ffffff05;
  box-shadow: fill black 1px 1px 2px 2px;
}

#HotkeyText
{
  color: #bba995;
  text-shadow: 1px 1px 2px 2 #000000;
    font-size: 13px;
    font-weight: bold;
  vertical-align: center;
  text-align: center;
  min-width: 18px;
  text-overflow: clip;
}

.Outer #Hotkey,
.no_level #Hotkey,
.no_item #Hotkey,
.is_passive #Hotkey,
#stash_row #Hotkey,
.no_hotkey #Hotkey
{
  visibility: collapse;
}


