/*Thanks font squirrel!*/
@font-face 
{
        font-family: 'DejaVuSans';
        src: url('../../fonts/dejavusans-webfont.eot');
        src: local('☺'), url('../../fonts/dejavusans-webfont.woff') format('woff'), url('../../fonts/dejavusans-webfont.ttf') format('truetype'), url('../../fonts/dejavusans-webfont.svg#webfont7D8p2GZt') format('svg'), local('DejaVu Sans');
        font-weight: normal;
        font-style: normal;
}
@font-face 
{
        font-family: 'DejaVuSansBold';
        src: url('../../fonts/dejavusans-bold-webfont.eot');
        src: local('☺'), url('../../fonts/dejavusans-bold-webfont.woff') format('woff'), url('../../fonts/dejavusans-bold-webfont.ttf') format('truetype'), url('../../fonts/dejavusans-bold-webfont.svg#webfont7D8p2GZt') format('svg'), local('DejaVu Sans Bold');
        font-weight: bold;
        font-style: normal;
}

* { padding: 0; margin: 0; border-width: 0;}
html { border: 0; overflow: hidden; }

.hide508 /* this is an attempt to use a style rule that will hide this element from visual rendering
            while still displaying it in screen readers.  Screen readers can be surprisingly varied 
            in how they honour screen media types.  Obviously anyone disabling screen stylesheets
            will not have an issue.  http://www.access-matters.com/screen-reader-test-results/ */
{
    position:absolute; 
    left:0px; 
    top:-500px; 
    width:1px; 
    height:1px; 
    overflow:hidden;
}
.center
{
    display: block;
    margin: auto;
}
body
{
    background: transparent url(../../images/widget/background-trans.png) scroll no-repeat top left;
    color: black;
    padding-left: 10px;
    padding-right: 10px;
    font-family: "DejaVuSans", Arial, sans-serif;
    font-size: 10px;
    width: 168px;
    height: 250px;
    overflow:hidden;
}
h1 { padding-right: 10px; }
h1 a
{
    text-indent: -1000px;
    display: block;
    width: 114px;
    height: 30px;
    margin: auto;
    background: transparent url(../../images/widget/epss-trans.png) scroll no-repeat top left;
}
p 
{ 
    margin-top: 4px; 
    width: 160px;
}

/* form h3:after, label.colon:after { content: ": "; } */
form h3, label.colon
{
    font-family: DejaVuSansBold, Verdana, sans-serif;
    font-weight: bold;
    font-size: 9px;
    display: inline-block;
}
form li 
{ 
    display: block; 
    margin: 0;
}
fieldset { margin-bottom: 3px; }
input#age_id, button { border: 1px solid #999; }
input
{
    display: inline-block;
    margin-top: 6px;
    vertical-align: bottom;
}

input#age_id 
{ 
    width: 3em; 
    text-align: right;
    background-color: white;
}
#male_label { margin-right: 24px; }
h3.fixed { width: 82px; }

.buttons 
{
    text-align: center; 
    padding-right: 10px;
}
button
{
    background-color: #c9e2ab;
    color: black;
    font-size: 9px;
    padding: 1px 5px 1px 5px;
    margin-left: 5px;
    margin-top: 10px;
}


/* special effects */
button
{
    /* border-radius is partially implemented in many browsers. */
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;

    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#c9e2ab)); 
    background: -moz-linear-gradient(top, #fff, #c9e2ab);
    background: linear-gradient(top, #fff, #c9e2ab);
}
button:active
{
    background: -webkit-gradient(linear, left top, left bottom, from(#c9e2ab), to(#fff)); 
    background: -moz-linear-gradient(top, #c9e2ab, #fff);
    background: linear-gradient(top, #c9e2ab, #fff);
}

#info
{
    margin: 0; 
    padding: 0;
    position: fixed;
    left: 10px;
    top: 220px;
    text-align: center;
    width: 158px;
}
#info a 
{ 
    text-decoration: none; 
    color: white;
}
#hhs, #ahrq, #uspstf
{
    display: inline-block;
    text-indent: -1000px;
    height: 31px;
    width: 32px;
}
/* these have to be separate images to support IE6 transparency fixes :( */
#hhs { background: transparent url(../../images/widget/hhs-trans.png) scroll no-repeat top left; }
#uspstf { background: transparent url(../../images/widget/uspstf-trans.png) scroll no-repeat top left; }
#ahrq
{
    width: 35px;
    background: transparent url(../../images/widget/ahrq-trans.png) scroll no-repeat top left;
}


#results
{
    margin-left: 13px;
}
#results li 
{ 
    list-style-type: square; 
    margin-bottom: 2px;
}