@charset 'UTF-8';

body
{
    font-family: 'Lucida Grande', 'Helvetica', sans-serif;
}


@media screen
{
    div.note_add
    {
        position: fixed;
        top: 40px;

        display: block;

        opacity: .7;
    }


    div.note_add:hover
    {
        opacity: 1;
    }

    .note
    {
        position: absolute;

        width: 200px;
        height: 250px;
        padding: 10px;

        background-color: #fff98f;   /* #94d6ff ; rgb(255, 240, 70);*/
        -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .5);
    }

    .note:hover .closebutton
    {
        display: block;
    }

    .closebutton
    {
        position: absolute;
        top: -15px;
        left: -15px;

        display: none;

        width: 30px;
        height: 30px;

        background-image: url(deleteButton.png);
    }

    .closebutton:active
    {
        background-image: url(deleteButtonPressed.png);
    }

    .edit
    {
        overflow-y: auto;

        height: 240px;

        outline: none;
    }

    .timestamp
    {
        font-size: 9px;

        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;

        display: none;

        padding: 2px 4px;

        text-align: right;

        color: #eee;
        border-top: 1px solid #24abff;
        background-color: #6dd1f3;
    }
}

@media print
{
    .note_add,
    .note,
    .closebutton,
    .edit,
    .timestamp
    {
        display: none;
        visibility: hidden;
    }
}