/*************************************************


    The Ottawa Hospital 2009-2010 Online Annual Report
    June 2010
    by 76design


***************************************************
    RESET
    */
    /***************************************************
html,body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, 
code,del, dfn, font, img, ins, kbd, q, s, samp,small, strike, sub, sup, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, 
label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;font-weight: inherit;font-style: inherit;	font-size: 100%;font-family: inherit;vertical-align: baseline;}

table {border-collapse: separate;border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}

    /*
/***************************************************
    GENERIC
    */


html{
    font: 62.5%/160% Helvetica, Arial, sans-serif;   
    background:#eee;
    color: #333;
    }

body{
    margin: 0px;
    padding: 0px;
    text-align: center;
    font-size: 120%;
    }
    
h1, h2, h3, h4, h5, h6 {
    font-weight:normal;
    line-height:1.25em
    }
h1 {
    font-size:2.6em;
    margin-bottom:0.5em;
    }
h2 {
    font-size:2em;
    margin-bottom:0.75em;
    }
h3 {
    font-size:1.5em;
    margin-bottom:1em;
    }
h4 {
    font-size:1.2em;
    margin-bottom:1.25em;
    }
h5 {
    font-size:1em;
    font-weight:bold;
    margin-bottom:1.5em;
    }
h6 {
    font-size:1em;
    font-weight:bold;
    }

p{ margin:0 0 1.25em; } 

blockquote{
    margin:1.5em;
    color:#666;
    font-style:italic;
    }
sup, sub {
    line-height:0;
    }
abbr, acronym {
    border-bottom:1px dotted #666;
    }
del{
    color:#666;
    }
pre, code {
    margin:1.5em 0; 
    white-space:pre;
    line-height:1.5;
    }
ul,ol {
    margin:0 1.5em 1.5em 1.5em;
    }
ul {
    list-style-type:disc; }
ol {
    margin-left: 2em;
    list-style-type:decimal; 
    }
dl {
    margin:0 0 1.5em 0;
    }
dl dt {
    font-weight:bold;
    }
dd {
    margin-left:1.5em;
    }
a {
    color: #3E708F;
    text-decoration: none;    
    }
a:hover{
    color: #666;
    text-decoration: underline;
    }
a img {
    border:0;
    }
    .skip{display:none;}
    
table{
    width: 100%;
    margin: 0 0 1.5em 0;
    color: #666;
    border-collapse: collapse;
    }
table thead th{
    background: #3E708F;
    color: #fff;
    padding: 4px 6px;
    }
table th{
    padding: 4px;
    }
table tr td{
    padding: 5px;
    }
table tr td, table th{
    
    }
    
table p{
    margin: .25em 0;
    }    
    
tfoot{
    font-size: .8em;
    background: #EDF8FF;
    }
table tfoot td{
    padding: 2px 5px;
    }
    
    
    
    
/***************************************************
    CUFON
    */
.knockout{
    text-transform: uppercase;
    }
    
    
/***************************************************
    EVERYWHERE
    */
    
/* >> colours */
.white{ color: #fff; }

.site-color{ color: #3E708F; }

    
/* >> ottawa hospital logo */
#toh-logo{
    display: block;
    padding-top: 12px;
    width: 159px;
    }
    
/* >> view the OHRI/TOH annual report */
.crosslink-btn{
    display: block;
    position: absolute;
    top: 0; right: 0;
    padding: 10px 14px 8px 32px;
    font-size: 120%;
    font-weight: bold;
    text-decoration: none;
    }
.crosslink-btn acronym{
    border-bottom: dotted 1px #c1cfd8;
    }
.crosslink-btn:hover{    
    text-decoration: none;
    }
.cufon-active .crosslink-btn{
    font-size: 180%;   
    }
#ohri-report-btn{
    color: #fff;
    background: #5c798f url(../images/view-ohri-report.png) 10px -35px no-repeat;    
    }
#ohri-report-btn:hover{
    color: #333;
    background: #a1b8c7 url(../images/view-ohri-report.png) 10px 15px no-repeat;
    }

    .clear{
        width:100%;
        clear:both;
        height:1px;
        margin-top:-1px;
}
/***************************************************
    Error/Success Messages
     */


.error{
    color: #ea753c;
    font-weight: bold;
    padding: 4px 4px 4px 26px;
    background: #fff url(../images/error.png) 3px 5px no-repeat;
    border: solid 1px #ffddcd;
    }
.success{
    color: #85b42e;
    font-weight: bold;
    padding: 4px 4px 4px 26px;
    background: #fff url(../images/success.png) 3px 5px no-repeat;
    border: solid 1px #e4faba
    }
    
.hidden {
    display: none;
    }
    
    
/***************************************************
    WRAPPER
    */
     
#wrapper,
#umbrella,
#footer {
    width:960px;
    margin: 0px auto;
    text-align:left;
    position: relative;
    }    
    
    
/***************************************************
    UMBRELLA & FOOTER
    */
    
#wrapper-umbrella,
#wrapper-footer{
    font-size: 90%;
    background: #323232;
    }
#umbrella,
#footer{
    padding: 9px 0;
    text-align: right;
    color: #a7a6a6;
    }
#umbrella a,
#footer a{
    padding: 0 4px;
    color: #a7a6a6;
    text-decoration: none;
    }
#umbrella a:hover,
#footer a:hover,
#umbrella a:focus,
#footer a:focus{
    color: #fff;
    text-decoration: underline;
    }
    
#wrapper-footer{
    clear: both;
    }
#footer{
    margin-top: 30px;
    text-align: left;
    }
#footer p{
    margin: 0;
    }
#footer p.copyright{
    float: right;
    }
    
    
/***************************************************
    HEADER
    */
#site-title{
    position: relative;
    background: url(../images/horizontal-dot-pattern.gif) bottom left repeat-x;
    padding: 10px 0 5px 0;
    }

.ar-title{
    font-size: 190%;
    line-height: 100%;
    font-weight: bold;
    margin: 0;
    }
.cufon-active .ar-title{
    font-size:300%;
    }
    
    
.cufon-active #my-ar-link{
    line-height: .5;
    font-size: 175%;
    }
.cufon-active #my-ar-link:hover{
    text-decoration: none;
    }
    
/* >> question mark */
#my-ar-questionmark{
    float: right;
    background: url(../images/learn-more.gif) 0 0 no-repeat;
    width: 23px;
    height: 23px;
    display: block;
    text-indent: -900em;
    overflow: hidden;
    margin-top: 4px;
    margin-left: 10px;
    }
#my-ar-questionmark:hover{    
    background-position: 0 -23px;
    }
    
    
/***************************************************
    TOP MENU
    */

#topmenu {
    margin: 0;
    padding: 0;
    }
.cufon-active #topmenu{
    font-size: 200%;
    }
    
#topmenu li  {
    list-style:none;
    float:left;
    width:auto;
    background: url(../images/vertical-dot-pattern.gif) top right repeat-y;
    }

#topmenu a {
    display:block;
    padding: 8px 20px 6px 8px;
    margin:0;
    text-decoration:none;
    }
#topmenu .first a{
    padding-left: 5px;
    }
    
#topmenu li.selected a{
    color: #666666;
}


    
/***************************************************
    HOMEPAGE
    */
#home #leftcolumn{
    width: 411px;
    }
#home #rightcolumn{
    width: 540px;
    }
    
.promo-photo{
    display: block;
    border: solid 4px #fff;
    }
    
#welcome{
    background: #fff;
    padding: 14px 8px;
    margin: 8px 0;
    }
#welcome h2{
    border-bottom: double 3px #b7b7b7;
    }
.cufon-active #welcome h2{
    font-size: 260%;
    margin: 0 0 8px 0;
    }
    
#home #connect-and-share{
    padding: 6px 9px;
    background: #c6c9c9;
    color: #4f5050;
    font-weight: bold;
    font-size: 120%;
    }
.cufon-active #connect-and-share img{
    margin-bottom: -3px;
    }
.cufon-active #home #connect-and-share{
    font-size: 200%;
    }
    
/* >> features */
.feature{
    width: 253px;
    min-height:149px;
    height:auto !important;
    height:149px;
    border: solid 4px #c5c6c6;
    float: left;
    margin: 0 5px 5px 0;
    position: relative;
    }
.feature a{
    color: #fff;
    }
.feature a:hover
.feature a:focus{
    color: #ccc;
    text-decoration:none;
    }
.feature p{
    margin: 0;
    }
.feature strong{
    display:block;
    margin: 0 0 5px 0;
    }
.cufon-active .feature strong{
    font-size: 280%;
    margin: 0;
    line-height: .5em;
    }
.feature .details{
    width: 243px; 
    padding: 4px 5px 5px 5px;
    position: absolute;
    bottom: 0;
    display: block;
    background: url(../images/filter-bg.png);
    font-size: 90%;    
    color: #fff;
    line-height: 120%;
    }
    .feature:hover{
        text-decoration:none;
}
   .feature:hover strong{
        color: #ccc;
        text-decoration: none;
}
    
    
/* >> blue fast facts */
#fast-facts-bar{
    clear: both;
    background: #b9c8d1;
    padding: 12px;
    color: #3E708F;
    font-weight: bold;
    font-size: 130%;
    overflow: hidden;
    height: 1%;
    }
.cufon-active #fast-facts-bar{
    font-size: 240%;
    }
#fast-facts-bar em{
    display: block;
    font-style: normal;
    line-height: 100%;
    }
    
#fast-facts-bar h3{
    margin: 0 15px 0 0;
    float: left;
    color: #3E708F;
    width: 75px;
    font-weight: bold;
    }

body.fr #fast-facts-bar h3{
    width: 98px;
    }
.cufon-active #fast-facts-bar h3{
    line-height: .25;
    }
    
#fast-facts-bar ul{   
    font-size: 120%;
    float: left;
    border-left: double 3px #83949f;
    margin: 0;
    padding: 0;
    }
#fast-facts-bar li{
    padding: 6px 12px;
    list-style: none;
    border-right: solid 1px #7b8c98;
    float: left;
    line-height: 1.2em;
    }

#fast-facts-bar li.last{
    border-right: 0;
    }
    
.cufon-active #fast-facts-bar em,
.cufon-active #fast-facts-bar li{
    line-height: .25;
    }
    
    
/* >> video features */
#videonav{
    background: url(../images/horizontal-dot-pattern.gif) 0 0  repeat-x;
    padding: 3px 0 0 0;
    margin: 5px 0 12px 0;
    overflow: hidden; height: 1%;
    }
.cufon-active #videonav{
    font-size: 150%;
    }
#videonav li  {
    list-style:none;
    float:left;
    width:auto;
    background: url(../images/vertical-dot-pattern.gif) top right repeat-y;
    }

#videonav a:link,
#videonav a:visited{
    display:block;
    padding: 5px 10px 5px 8px;
    margin:0;
    text-decoration:none;
    }
#videonav .first a{
    padding-left: 5px;
    }
    

    #videonav a.selected{
        color:#666666;
}

    
/***************************************************
    STRUCTURE
    */
    
#rightcolumn {
    width: 205px;
    float:right;
    margin-bottom: 10px;        
    }
    
#leftcolumn {
    width: 740px;
    float:left;
    margin-bottom: 10px;    
    }
    
#centrecolumn {
    float:left;
    }
    
    
    
/***************************************************
    HEADER
    */
    
#header {
    height:200px;
    margin: 0 0 5px 0;
    }
    
.logo {
    text-indent:-999em;
    width:100px;
    height:100px;
    display:block;
    background:url(../images/logo.gif) no-repeat;
    }
    
 
 
/***************************************************
    SIDEMENU
    */
    
#sidemenu,
#sidemenu ul{
    list-style:none;
    margin: 0 0 10px 0;
    }
#sidemenu ul{
        margin:0;
}

#sidemenu LI {
    list-style:none;
    border-bottom:solid 1px #eee;
    }
#sidemenu ul LI {
    list-style:none;
    border-bottom:none;
    }

#sidemenu LI A{
    text-decoration:none;
    padding:10px 8px;
    display:block;
    background: #737373;
    color: #fff;
    font-weight: bold;
    }

    
#sidemenu li a:hover,
#sidemenu li a:focus{
    background: #a7a7a7;
    }
    
#sidemenu li.selected a,
#sidemenu li.selected a:hover,
#sidemenu li.selected a:focus{
    color: #3E708F;
    background: #bfcdd8;
    }
 #sidemenu li.selected li.selected a{
        background: #6c8ca3;
        color: #fff;
}

.cufon-active #sidemenu{
    font-size: 190%;
    }
.cufon-active #sidemenu LI A{
    padding: 7px 8px;
    }

.cufon-active #sidemenu LI ul A{
    padding:9px 14px 7px 14px;
    background: #efefef;
    font-size: 90%;
}
    
#rightcolumn #connect-and-share{
    background: #b9c8d1;
    padding:  7px 4px;
    color: #333;
    font-weight: bold;
    overflow: hidden;
    height: 1%;    
    }
.cufon-active #rightcolumn #connect-and-share{
    font-size: 180%;
    padding: 7px 4px 3px 4px;
    overflow: hidden;
    height: 1%;
    }

.cufon-active body.fr #rightcolumn #connect-and-share{
    font-size: 160%;

    }
#rightcolumn #connect-and-share .knockout{
    float: left;
    }
#rightcolumn #connect-and-share img{
    float: right;
    margin: 1px 0 0 8px;
    }

    
         
/***************************************************
    CONTENT
    */
.content{
    background: #fff;
    padding: 8px;
    margin: 0 0 10px 0;
    line-height: 1.4em;
    float:left;
    width:724px;
    }
    
.content h2{
    color: #3E708F;
    margin: 0 0 10px 0;
    }
.cufon-active .content h2{
    font-size: 250%;
    text-transform: uppercase;
    }

.pagetitle{
    /*width: 435px;*/
    border-bottom: double 3px #b7b7b7;
    margin-top: 15px;
    }
.cufon-active .pagetitle{
    margin-top: 0;
    }
         
         
.content ul, 
.content ol{
    margin: 0 0 1.5em 3em;
    }
    
    
    
/***************************************************
    SUCCESS STORIES
    */
.tricol .col{
    width: 233px;
    float: left;
    margin-right: 11px;
    overflow:hidden;
    }
.tricol .last{
    margin-right: 0;
    }
    
    
.col h2{
    font-size: 150%;
    border-bottom: double 3px #8c979e;
    padding: 8px 0 8px 0;
    margin: 0 0 10px 0;
    }
.col h2 a{
    color: #333;
    }
.col h2 a:hover,
.col h2 a:focus{
    color: #000;
    text-decoration: none;
    }
    
.cufon-active .col h2{
    font-size: 215%;
    padding: 0;
    line-height: 0.25em;
    }
    
.col .detail{
    padding: 8px;
    background: #b7c8d2;
    min-height:200px;
    height:auto !important;
    height:200px;    
    }
.col img{
    margin-bottom: 5px;
    }
.tricol .last{

    margin-right:0;

}
    
/***************************************************
    Sidebar Random 
    */
.randomimage img{
    border: solid 3px #fff;
    display: block;
    margin-bottom: 10px;
    }
    
    
/***************************************************
    UTILS
*/

/* >> clearing and floating */
.floatright{
    float: right;
    margin: 0 0 15px 15px;
    }
.floatleft{
    float: left;
    margin: 0 15px 15px 0;
    }
.clearleft{
    clear: left; 
    }
.clearright{
    clear: right;
    }


/* >> clearfix */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    }

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


/* >> flash messages */
.flash-msg{

    }
.error{
    color: #b02828;
    font-weight: bold;
    border-bottom: solid 1px #ccc;
    padding-bottom: 6px;
    margin-bottom: 15px;
    }
.success{
    color: #8fbc2d;
    font-weight: bold;
    border-bottom: solid 1px #d5f199;
    padding-bottom: 6px;
    margin-bottom: 15px;
    }

/***************************************************
    My Annual Report Dropdown [Button]
*/

#my-annual-report-controls{
    position: absolute;
    bottom: 10px;
    right: 0;
    font-size: 130%;
    }

/* >> "my annual report" */
    #my-ar-link{
    float: left;
    text-align: right;
    margin-top: 3px;
    }

#above-pagecart-dropdown{
    position: absolute;
    top: 0px;
    right: 0;
    width: 186px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    overflow: auto; /* ;) */
    }

#pagecart-dropdown,
#pagecart-dropdown ul,
#pagecart-dropdown li{
    margin: 0;
    padding: 0;
    list-style: none;

    }
#pagecart-dropdown{
    /*width: 220px;*/
    position: absolute;
    top: 56px; right: 4px;
 }

 body.fr #pagecart-dropdown{
    top: 60px;
 }

 li#pagecart-dropdown-primary{

    padding-right: 10px;
    margin-top: 2px;
    float:right;
 }

 #pagecart-dropdown-primary-link{

    text-align: right;
    margin-top: 3px;
    padding-top: 5px;
    height: 23px;
    width: 189px;
 }


 span#change-wrapper{
        width: 15px;
        font-size: 18px;
        color:#3E708F;
        padding: 0;
        margin-top: -3px;
        height:15px;
        line-height: 18px;
}

body.fr  span#change-wrapper{
    
}

html.cufon-active #pagecart-dropdown-primary-link{
    line-height: .5;
    font-size: 205%;
    }
html.cufon-active body.fr #pagecart-dropdown-primary-link{
    line-height: .5;
    font-size: 165%;
}
html.cufon-active #pagecart-dropdown-primary-link:hover{
    text-decoration: none;
    }

/* >> question mark */
li#my-ar-questionmark a{
    display:block;
    background: url(../images/learn-more.gif)no-repeat top left;
    width: 23px;
    height: 23px;
    text-indent: -900em;
    overflow: hidden;
    margin-top: 0;
    margin-left: 10px;
    float:right;
    }

body.fr li#my-ar-questionmark a{
    
}

#my-ar-questionmark a:hover{
    background-position: 0 -23px;
    }


/***************************************************
    My Annual Report [Dropdown]
*/
#pagecart-dropdown ul{ /*dropdown hidden until hover */
    display: none;
    background: #e6e6e6;
    position: absolute;
    top: 25px;
    right: 0;
    width: 145px;
    padding: 3px;
    margin: 0 0 0 3px;
    border: solid 1px #455665;
    border-top: none;
    }

 body.fr #pagecart-dropdown ul{
    top: 22px;
    width: 180px;
    }

    
#pagecart-dropdown-primary ul a{ /* dropdown link */
    color: #455665;
    display: block;
    height: auto;
    padding: 6px 6px 6px 30px;
    margin: 2px;
    text-decoration: none;
    font-size: 150%;
    }
#pagecart-dropdown-primary ul a:hover{ /* dropdown link */
    text-decoration:none;
    color: #3E708F;
    background-color: #efefef;
    }
#pagecart-dropdown-primary ul .alt a{ /* alternate dropdown link */
    border-bottom: solid 1px #999;
    }
#pagecart-dropdown-save a{
    background: #eee url(../images/myar-dropdown-save.gif) 8px 8px no-repeat;
    }
#pagecart-dropdown-save a.disabled{
    background-position: 8px -90px;
    color: #a5a4a4;
    }

#pagecart-dropdown-save a.disabled:hover {
    text-decoration: none;
    color: #a5a4a4;
    background-color: #ccc;
    }

#pagecart-dropdown-view a{
    background: #eee url(../images/myar-dropdown-view.gif) 4px 50% no-repeat;
   
    }





/***************************************************
    MY ANNUAL REPORT
*/

 #pagecart-wrapper {
    border: solid 1px #b3d1d2;
    border-bottom: none;
    background: white;
    margin: 4px 0 5px 0;
    font-size: 1.1em;
    }


#pagecart-messages{ /* no need to show! */
    display: none; }

#pagecart-wrapper .success,
#pagecart-wrapper .error{
    font-size: .75em;
    background-position: 5px 3px;
    margin: 0;
    display: inline-block;
    position: absolute;
    padding: 2px 7px 2px 26px;
    top: 5px; right: 4px;
    }

#pagecart-wrapper ol,
#pagecart-wrapper li{
    margin: 0;
    padding: 0;
    list-style: none;
    }
#pagecart-wrapper li{
    position: relative;
    }
#pagecart-wrapper ol li{
    padding: 0;
    }

#pagecart-wrapper a{
    text-decoration: none;
    }
#pagecart-wrapper a:hover{
    text-decoration: underline;
    }


#pagecart-wrapper p{
    height: 20px; /* for ie7, remarkably */
    display: block;
    border-bottom: solid 1px #b3d1d2;
    margin: 0;
    padding: 7px 5px; }
#pagecart-wrapper li p{
    background-image: none; }
#pagecart-wrapper li li  p{
    background: url(../images/bullet-on-white.gif) 5px 50% no-repeat;
    padding-left: 25px; }
#pagecart-wrapper li li li p{
    background: url(../images/bullet-on-white.gif) 25px 50% no-repeat;
    padding-left: 50px; }
#pagecart-wrapper li li li li p{
    background: url(../images/bullet-on-white.gif) 30px 50% no-repeat;
    padding-left: 75px; }
#pagecart-wrapper p:hover{
    background-color: #deedf5;
    }

#pagecart-wrapper .selected{
    background-color: #e6e7e8;
    }

#pagecart-wrapper input{
    border: none;
    }

.pagecart-controls{
    font-size: .85em;
    margin: 3px 0 0 0;
    overflow: hidden;
    height: 1%;
    }

.pagecart-controls a,
.pagecart-controls input{
    color: #455665;
    font-size: 12px;
    font-weight: bold;
    border: solid 1px #e1e9f1;
    display: block;
    background: #efefef;
    padding: 3px 6px 3px 24px;
    margin: 0;
    float: left;
    margin: 0 4px 0 0;
    text-decoration: none;
    background-repeat: no-repeat;
    }
.pagecart-controls a.viewreport{
    background-image: url(../images/myar-viewreport.gif);
    background-position: 4px 7px;
    }
.pagecart-controls a.printreport{
    background-image: url(../images/myar-print.gif);
    background-position: 4px 5px;
    }
.pagecart-controls a.removepages{
    background-image: url(../images/myar-cross.gif);
    background-position: 7px 8px;
    }
.pagecart-controls .savereport{
    float: right;
    margin-right: 0;
    padding: 4px 6px 5px 28px;
    background-image: url(../images/myar-save.gif);
    background-color: #f5ffe2;
    background-position: 5px ;
    border: solid 1px #c0db8c;
    text-align: center;
    }
.pagecart-controls .savereport:hover{
    border: solid 1px #8aa851;
    color: #3b5012;
    }

.pagecart-controls a:hover,
.pagecart-controls input:hover{
    border: solid 1px #bfd0e2;
    cursor: pointer;
    }


a.ar-view{
    font-size: 10px;
    }
a.ar-view img{
    border: none;
    /*line-height: 1.5em;*/
    }

#pagecart-wrapper a.ar-view:hover{

       text-decoration:none;
}

.flv-media{
    float:right;
    margin:0 0 10px 10px;
}