/* -----------------------------------------
   Shared Styles
----------------------------------------- */
@page {
    margin: 1cm 1cm 1cm 1cm !important;
    counter-increment: page;
    counter-reset: page 1;
    @top-right {
        content: "Page " counter(page) " of " counter(pages);
    }
    size: 5.5in 8.5in portrait;
}

.twelve, .row .twelve {
    width: 95% !important;
    margin-left: 0.5cm !important;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td, label {
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-size: 12pt;
    color: #000000;
    counter-reset: page_number;
}
form label{
    font-size: 12pt;
}

#footer{
    color: rgb(0, 0, 0);
    margin-top: 30px;
    padding: 2px 0;
}
#footer p{
    color: rgb(255, 255, 255);
    font-size: 1.1rem;
    margin-top: 10px;
}
.bottom-nav .button{
    display: none;
}
.top-bar{
    display: none !important;
}
.breadcrumbs{
    display: none !important;
}

*[data-printAsNewPage]{
    page-break-before: always !important;
}

/* -----------------------------------------
   Custom styles
----------------------------------------- */
.instruction{
    font-style: italic;
    font-weight: bold;
}
.italic{
    font-style: italic;
}
.sub{
    vertical-align: sub;
}
#animationModal, #spirogramModal, #spirometerModal{
    width:auto;
}

/* -----------------------------------------
   Laboratory Report
----------------------------------------- */
.lreport h3{
    font-size: 12pt !important;
}
.lreport h3:before{
    font-size: 12pt;
    margin: 10px 50px;
}
.lreport h4{
    font-size: 11pt !important;
}
.lreport h5{
    font-size: 11pt !important;
    padding-right: 80px !important;
}
.lreport textarea{
    font-size: 10pt !important;
}
.lreport table caption{
    font-size: 10pt !important;
}
.lreport table th, #table1 th, #table2 th{
    font-size: 9pt !important;
    padding: 1px !important;
    font-weight: normal;
}
table .header{
    font-size: 9pt !important;
    font-weight: normal !important;
}
.lreport table td{
    font-size: 9pt !important;
    padding: 1px !important;
    font-weight: normal;
}
.lreport form{
    font-size: 10pt;
    margin: 0 0;
}
.lreport form p{
    font-size: 10pt !important;
}
.lreport form p strong{
    font-size: 10pt !important;
}
.lreport form label{
    font-size: 10pt !important;
}

.lreport li{
    font-size: 10pt !important;
}

.lreport table{
    border-collapse: collapse;
    width: 90% !important;
    font-size: 7pt !important;
}
#table1, #table2 ,#table3, #table4, #table5, #table6{       
    max-width: 90% !important;    
    margin-left: -10px !important;
}
.lreport #table1 caption:before{
    content: "Table 1: ";
}
.lreport #table2 caption:before{
    content: "Table 2: ";
}
.lreport #table3 caption:before{
    content: "Table 3: ";
}
.lreport #table4 caption:before{
    content: "Table 4: ";
}
.lreport #table5 caption:before{
    content: "Table 5: ";
}

.lreport #table1 input{
    display: none;
}
.lreport #table2 input{
    display: none;
}
.lreport #table3 input{
    display: none;
}
.lreport #table4 input{
    display: none;
}
.lreport #table5 input{
    display: none;
}
.lreport table[id] th{
    border: 1px solid rgb(221, 221, 221);
}
.lreport table[id] td{
    border: 1px solid rgb(221, 221, 221);
}

.lreport .predquestion li span:first-of-type:after{
    content: "";
    margin-right: 5pt;
}
.lreport .varquestion li span:after{
    content: ",";
    margin-right: 5pt;
}
.lreport .varquestion li span:last-of-type:after{
    content: "";
}
.lreport .varquestion li span:first-of-type:after{
    content: "";
    margin-right: 5pt;
}
.lreport .button{
    display: none;
}
.lreport li{
    width: 90% !important;
    margin-right: 30px !important;
    padding-right: 30px !important;
}
.row .centered{
    display: none;
}
.lreport form strong{
    font-size: 10pt !important;
}
#chart1, #chart2 ,#chart3, #chart4, #chart5, #chart6{       
    max-width: 90% !important;
    width: 90% !important;       
    margin-left: -50px !important;
}

#chart1 table td table, #chart2 table td table, #chart3 table td table, #chart4 table td table, #chart5 table td table, #chart6 table td table{
    height: 60px !important;
    max-height: 60px !important;    
    /*display: none;*/
}

#chart1 table table, #chart2 table table, #chart3 table table, #chart4 table table, #chart5 table table, #chart6 table table{
    margin-top: 400px !important;
    margin-left: -300px !important;
    padding-bottom: -100px !important;
    /*display: none;*/
}

.section_05 #chart3 table table{
    margin-top: 500px !important;
    margin-left: -350px !important;
    /*display: none;*/
}

.section_05  #chart3{
    margin-top: -100px !important;
}

.section_06 #chart1, .section_06 #chart2, .section_06 #chart3, .section_06 #chart4{
    margin-top: -100px !important;
}

.section_07 div[id^="chart"]{
   margin-top: -110px !important;
}

.section_08_8 div[id^="chart"]{
   margin-top: -110px !important;
}

p{
    font-size: 9pt !important;
}
.mleft{
    font-size: 7pt !important;
}

.section_09 #table1 th, .section_09 #table2 th, .section_09 #table1 td, .section_09 #table2 td{
    font-size: 8pt !important;
    padding: 1px !important;
    font-weight: normal;
}

.section_09_10 #chart2{
   margin-top: -100px !important;
}

.section_11 #table3 .selector {
    display: none;
}
.section_11 table#table3 label {
   display: none;
}
.section_11 #table3 .dropdown a.current{
    display: inline;
    text-decoration: none !important;
}

.section_12 #table2 th, .section_12 #table2 td, .section_13 #table1 th, .section_13 #table1 td{
    font-size: 9pt !important;
    padding: 1px !important;
    font-weight: normal;
}

.section_12 #table2 .dropdown, .section_13 #table1 .dropdown{
    display: none;
}
.section_12 #table2 a.current, .section_13 #table1 a.current{
    font-size: 7pt !important;
    text-decoration: none !important;
}

.section_12 div[id^="chart"]{
   margin-top: -90px !important;
}

.section_13 table label{
    display: none;
}

.section_13 #table1 a.current{
    font-size: 7pt !important;
    text-decoration: none !important;
}

.section_14 table th img{
    display: none;
}

.section_14 #chart3 table table{
    margin-top: 550px !important;
    margin-left: -350px !important;
    /*display: none;*/
}

.section_14 #chart3 {
   margin-top: -120px !important;
}