/*
| Center Images - For Reals
| by: Deemonie
| last updated: July 30, 2012
*/

@-moz-document
    url-prefix(http://) ,
    url-prefix(https://) ,
    url-prefix(file://) ,
    url-prefix("about:blank")

{

/* [ FF3.0 - BACKGROUND COLOR ] */
body:only-child {
    background-color : #fffaf0 ;
    margin : 0px ;
    padding : 0px ;
    }
    
/* [ Linky - CENTER IMGS HORIZONTALLY ] */
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child ,
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child + br ~ img {
    display : block ;
    margin : 0px auto ;
    padding : 3px ;
    }

/* [ CENTER IMG VERTICALLY & HORIZONTALLY ] */
 /* Stylish in FF3.0 ignores rulesets with ":only-of-type" psuedo-classes */   
html:not([xmlns]):not([dir]):not([lang]) head + body > img:only-of-type ,
svg:root {
    position : absolute ;
    top : 0px ;
    right : 0px ;
    bottom : 0px ;
    left : 0px ;
    margin : auto ; /* center img */
    padding : 3px ; /* space for "border" */
    }

/* [ FF3.0 - CENTER IMG VERTICALLY & HORIZONTALLY ] */
 /* Can't combine with above ruleset */    
body:only-child > img:first-child ,
svg:root {
    position : absolute ;
    top : 0px ;
    right : 0px ;
    bottom : 0px ;
    left : 0px ;
    margin : auto ; /* center img */
    padding : 3px ; /* space for "border" */
    }

/* [ "BORDER" - COLOR FILLS PADDING WHEN HOVERED ] */
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child:hover ,
 /* FF3.0 */
body:only-child > img:first-child:hover ,
 /* Linky */
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child ~ img:hover {
    background-color : #006400 ;
    }

/* [ SEE TRANSPARENCIES - TILES BEHIND PNG GIF ICO WHEN HOVERED ] */
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child[src$=".png"]:hover ,
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child[src$=".gif"]:hover ,
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child[src$=".ico"]:hover ,
 /* FF3.0 */
body:only-child > img:first-child[src$=".png"]:hover ,
body:only-child > img:first-child[src$=".gif"]:hover ,
body:only-child > img:first-child[src$=".ico"]:hover ,
 /* Linky */
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child ~ img[src$=".png"]:hover ,
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child ~ img[src$=".gif"]:hover ,
html:not([xmlns]):not([dir]):not([lang]) head + body > img:first-child ~ img[src$=".ico"]:hover {
    background : #ebebeb url('data:image/gif;base64,R0lGODlhFAAUAIAAAP///+vr6ywAAAAAFAAUAAACKIyPoMvowSJ4SS567MVQT+59WMh1WkmCoYey6vlaLTy6NU2ltxxLZQEAOw==') ;
    border : 3px #006400 solid ; /* put a real border around png gif ico imgs */
    padding : 0px ;
    }

}