@charset "utf-8";
/**************************************************
    shodow2/style.css
    file created in 2009/03/21 22:34:50.
    LastUpdated :2021/02/19 10:06:44.
    author iNo
**************************************************/

html {
    overflow-y: scroll;
}
body {
    margin: 0; padding: 0;
    width: 100%; height: 100%;
    background-color: #eeeeff;
}
h1 {
    position: relative;
    margin: 3px 10px 0 50px; padding: 0;
    font: italic bold 120% serif;
}
h1 .desc {
    text-align: left;
    font: 90% sans-serif;
}

#controls {
    position: relative;
    clear: both;
    margin: 0; padding: 5px 5px 5px 50px;
    height: 45px;
    background-color: #ffffff;
    border-top: 1px solid #999999;
}

#controls a {
    display: block;
    float: left;
    width: 40px; height: 40px;
    margin: 0 5px 0 0;
    text-indent: -9999px;
    outline: none;
    background-color: transparent;
    background-image: url(controls.png);
    background-repeat: no-repeat;
    border: 1px solid #ffffff;
}

#controls a:hover {
    border: 1px solid gray;
}
#set-color-black {
    background-position: 0px 0px;
}
#set-color-gray {
    background-position: -40px -40px;
}
#set-color-red {
    background-position: -80px -40px;
}
#set-color-type0 {
    background-position: -120px 0px;
}
#set-color-type1 {
    background-position: -160px -40px;
}
#set-line-weight-thin {
    background-position: -280px -40px;
}
#set-line-weight-normal {
    background-position: -240px 0px;
}
#set-line-weight-bold {
    background-position: -200px -40px;
}
#controls a#clear-canvas {
    width: 100px; height: 40px;
    float: left;
    margin: 0 10px 0 0;
    background-position: -320px 0px;
}
#controls a#clear-canvas:hover {
    background: transparent url(controls.png) no-repeat -320px -40px;
    border: 1px solid #ffffff;
}
#controls a#convert-png {
    width: 100px; height: 40px;
    float: left;
    background-position: -420px 0px;
}
#controls a#convert-png:hover {
    background-position: -420px -40px;
    border: 1px solid #ffffff;
}

#help-text {
    clear: both;
    color: #666666;
    background-color: #ffffff;
    border-bottom: 1px solid #999999;
    margin: 0 0 10px 0; padding: 0 0 3px 50px;
    font-size: 80%;
}

#canvas-layer {
    clear: both;
    margin: 0 50px;
}

#canvas {
    outline: 1px solid #999999;
    background-color: #ffffff;
}

#footer {
    color: #88a;
    font: italic 90% "Georgia", serif;
    margin: 30px 50px;
}
#footer a,
#footer a:link,
#footer a:visited {
    color: #88a;
    text-decoration: none;
}
#footer a:hover {
    color: #a88;
    text-decoration: underline;
}

@media screen and (max-width: 640px) {
    #canvas {
        max-width: calc(100vw - 100px);
    }
}

/*
vim:fdl=0 fdm=marker:ts=4 sw=4 sts=0:
*/