docs/partials/duck-css.mustache

<style>

    .example {
        background-color: #59554F;
        text-align: center;
    }

    .example .container {
        text-align: left;
        position: relative;
        width: 554px;
        margin: 10px auto;
        padding: 0;
        font-family: georgia;
    }

    .example #demo {
       position: absolute;
       top: -10px;
       left: 350px;
    }

    .example #duck {
        width:300px;
        height:188px;
        background:url({{{componentAssets}}}/images/sprite_duck.jpg) no-repeat;
        background-position: 0 0;
        border:solid 1px #958A71;
        -moz-box-shadow:7px 7px 10px rgba(0,0,0,0.3);
        -webkit-box-shadow:7px 7px 10px rgba(0,0,0,0.3);
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
    }

    .example .yui3-dial-label {
        visibility:hidden;
    }

    .example .yui3-dial-north-mark {
        visibility:hidden;
    }

    .example .yui3-skin-sam #demo .yui3-dial-ring {
        -moz-box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.3);
        -webkit-box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.3);
    }

    .example #text {
        color:#C5B291;
    }

    .example #text h2 {
        font-size:261%;
        color:#EEE5D6;
        text-shadow: 2px 2px 7px #000;
        margin: 0;
        font-family: georgia;
    }

    .example #text h3 {
        color:#EEE5D6;
        font-size: 100%;
        margin: 0.6em 0;
        font-family: georgia;
    }

    .example #text p {
        margin: 0.5em 0;
        font-size:135%;
        line-height: 1.2em;
    }

</style>