<?xml version="1.0" encoding="UTF-8"?>
<nifty-styles xmlns="http://nifty-gui.lessvoid.com/nifty-gui">

    <!-- +++++++++++++++++++++++++++++++++++++ -->
    <!-- style for the button background panel -->
    <!-- +++++++++++++++++++++++++++++++++++++ -->
    <style id="nifty-button#panel">
        <attributes backgroundImage="button/button.png" imageMode="sprite-resize:100,23,0,2,96,2,2,2,96,2,19,2,96,2,2"
                    paddingLeft="7px" paddingRight="7px" width="100px" height="23px" childLayout="center"
                    visibleToMouse="true"/>
        <effect>
            <onHover name="border" color="#822f" post="true"/>
            <onFocus name="imageOverlay" filename="button/button.png"
                     imageMode="sprite-resize:100,23,1,2,96,2,2,2,96,2,19,2,96,2,2" post="true"/>
            <onEnabled name="renderQuad" startColor="#2228" endColor="#2220" post="true" length="150"/>
            <onDisabled name="renderQuad" startColor="#2220" endColor="#2228" post="true" length="150"/>
        </effect>
    </style>

    <!-- +++++++++++++++++++++++++++++++++++++ -->
    <!-- style for the button text -->
    <!-- +++++++++++++++++++++++++++++++++++++ -->
    <style id="nifty-button#text" base="button-font">
        <attributes align="center" valign="center" textHAlign="center" textVAlign="center" visibleToMouse="false"/>
        <effect>
            <onEnabled name="textColorAnimated" startColor="#8886" endColor="#eeef" post="false" length="150"/>
            <onDisabled name="textColorAnimated" startColor="#eeef" endColor="#8886" post="false" length="150"/>
        </effect>
    </style>
</nifty-styles>