/**
 * HTML5 ✰ Boilerplate
 *
 * style.css contains a reset, font normalization and some base styles.
 *
 * Credit is left where credit is due.
 * Much inspiration was taken from these projects:
 * - yui.yahooapis.com/2.8.1/build/base/base.css
 * - camendesign.com/design/
 * - praegnanz.de/weblog/htmlcssjs-kickstart
 */


/**
 * html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
 * v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark
 * html5doctor.com/html-5-reset-stylesheet/
 */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video
{
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; } 

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section
{
    display: block;
}

blockquote, q
{
    quotes: none;
}

    blockquote:before, blockquote:after,
    q:before, q:after
    {
        content: "";
        content: none;
    }

/*ins
{
    background-color: #ff9;
    color: #000;
    text-decoration: none;
}*/

mark
{
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: bold;
}

del
{
    text-decoration: line-through;
}

abbr[title], dfn[title]
{
    border-bottom: 1px dotted;
    cursor: help;
}

table
{
    border-collapse: collapse;
    border-spacing: 0;
}

hr
{
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

input, select
{
    vertical-align: middle;
}


/**
 * Font normalization inspired by YUI Library's fonts.css: developer.yahoo.com/yui/
 */

body
{
    font: 13px/1.231 sans-serif;
    *font-size: small;
}
/* Hack retained to preserve specificity */
select, input, textarea, button
{
    font: 99% sans-serif;
}

/* Normalize monospace sizing:
   en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
pre, code, kbd, samp
{
    font-family: monospace, sans-serif;
}


/**
 * Minimal base styles.
 */

/* Always force a scrollbar in non-IE */
html
{
    overflow-y: scroll;
}

/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active
{
    outline: none;
}

ul, ol
{
    margin-left: 2em;
}

ol
{
    list-style-type: decimal;
}

/* Remove margins for navigation lists */
nav ul, nav li
{
    margin: 0;
    list-style: none;
    list-style-image: none;
}

small
{
    font-size: 85%;
}

strong, th
{
    font-weight: bold;
}

td
{
    vertical-align: top;
}

/* Set sub, sup without affecting line-height: gist.github.com/413930 */
sub, sup
{
    font-size: 75%;
    line-height: 0;
    position: relative;
}

sup
{
    top: -0.5em;
}

sub
{
    bottom: -0.25em;
}

pre
{
    /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
    padding: 15px;
}

textarea
{
    overflow: auto;
}
/* www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */

.ie6 legend, .ie7 legend
{
    margin-left: -7px;
}

/* Align checkboxes, radios, text inputs with their label by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */
input[type="radio"]
{
    vertical-align: text-bottom;
}

input[type="checkbox"]
{
    vertical-align: bottom;
}

.ie7 input[type="checkbox"]
{
    vertical-align: baseline;
}

.ie6 input
{
    vertical-align: text-bottom;
}

/* Hand cursor on clickable input elements */
label, input[type="button"], input[type="submit"], input[type="image"], button
{
    cursor: pointer;
}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea
{
    margin: 0;
}

    /* Colors for form validity */
    input:valid, textarea:valid
    {
    }

    input:invalid, textarea:invalid
    {
        border-radius: 1px;
        -moz-box-shadow: 0px 0px 5px red;
        -webkit-box-shadow: 0px 0px 5px red;
        box-shadow: 0px 0px 5px red;
    }

.no-boxshadow input:invalid, .no-boxshadow textarea:invalid
{
    background-color: #f0dddd;
}


/* These selection declarations have to be separate
   No text-shadow: twitter.com/miketaylr/status/12228805301
   Also: hot pink! */
/*::-moz-selection
{
    background: #FF5E99;
    color: #fff;
    text-shadow: none;
        
}*/

/*::selection
{
    background: #FF5E99;
    color: #fff;
    text-shadow: none;
}*/

/* j.mp/webkit-tap-highlight-color */
a:link
{
    /*-webkit-tap-highlight-color: #FF5E99;*/
}

/* Make buttons play nice in IE:
   www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
button
{
    width: auto;
    overflow: visible;
}

/* Bicubic resizing for non-native sized IMG:
   code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img
{
    -ms-interpolation-mode: bicubic;
}

/**
 * You might tweak these..
 */

body, select, input, textarea
{
    /* #444 looks better than black: twitter.com/H_FJ/statuses/11800719859 */
    color: #444;
    /* Set your base font here, to apply evenly */
    /* font-family: Georgia, serif;  */
}

/* Headers (h1, h2, etc) have no default font-size or margin; define those yourself */
h1, h2, h3, h4, h5, h6
{
    font-weight: bold;
}

a, a:active, a:visited
{
    color: #607890;
}

    a:hover
    {
        color: #036;
    }


/**
 * Primary styles
 *
 * Author: Rochester Oliveira - RockingCode.com
 */
body
{
   
}

.tagged
{
    cursor: pointer;
    -moz-box-shadow: 0 0 15px green;
    -webkit-box-shadow: 0 0 15px green;
    box-shadow: 0 0 15px green;
    _border: 3px solid green;
    _margin: -1px 0 0 -1px;
}


.debugging *:hover
{
    cursor: pointer;
    -moz-box-shadow: 0 0 5px #FF0000;
    -webkit-box-shadow: 0 0 5px #FF0000;
    box-shadow: 0 0 5px #FF0000;
    _border: 1px solid red;
    _margin: -1px 0 0 -1px;
}



#eltreeDebug
{
    position: fixed;
    top: 100px;
    right: 100px;
    padding: 20px;
    background: #ffffff;
    border: 1px solid #EFEFEF;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

#elemtree
{
    margin-bottom: 10px;
}

#eltreeCSSSel, #eltreeJSSel
{
    display: block;
    margin-bottom: 20px;
    width: 215px;
    border-bottom: 1px solid #DDDDDD;
}

    #eltreeCSSSel:before
    {
        padding-right: 5px;
        content: "CSS:";
        font-weight: bold;
    }

    #eltreeJSSel:before
    {
        padding-right: 5px;
        content: "JS: ";
        font-weight: bold;
    }

#container
{
    position: relative;
    width: 500px;
    margin: 15px auto 0;
}




.labelCol
{
    width: 150px;
    float: left;
}

.inputCol
{
    float: left;
    width: 400px;
}

.formRow
{
    border-bottom: solid 1px silver;
    margin-top: 20px;
    padding-bottom:30px;
}

/**
 * Media queries for responsive design.
 *
 * These follow after primary styles so they will successfully override.
 */

@media all and (orientation:portrait)
{
    /* Style adjustments for portrait mode goes here */

}

@media all and (orientation:landscape)
{
    /* Style adjustments for landscape mode goes here */

}

/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
   consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px)
{


    /* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you: j.mp/textsizeadjust */
    /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}
