@font-face {
font-family: "FontAwesome";
font-weight: normal;
font-style : normal;
       src : url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0");
       src : url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"),
             url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0") format("woff2"),
             url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0") format("woff"),
             url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0") format("truetype"),
             url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");
}
html {
    background: rgb(200, 200, 200);

}

body {
    background: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
    color: #404040;
    font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    margin: 0 auto;
    max-width: 600px;
    padding: 2em 2em 4em;
    counter-reset: figures;
}
/* For smaller screens*/
 @media screen and (max-width: 650px) {
    body {
        max-width: 450px;
        margin: 0 auto;
        padding: 1em 1em 2em;
    }
}
/* For printing */
@media print {
    
    html {
        height: auto;    
    }
     body {
        color: #000;
        background: #fff;
        font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
         line-height:1.5;
         height: auto;
    }
    h1, h2, h3, h4, h5, h6 {
    page-break-after:avoid;
    page-break-inside:avoid
    }
 
    img {
    page-break-inside:avoid;
    page-break-after:avoid;
    }
 
    blockquote, table, pre {
    page-break-inside:avoid
    } 
 
    ul, ol, dl {
    page-break-before:avoid
    }
 
    .pagebreak { 
        page-break-inside: avoid;; 
    }
    .break {
        page-break-before: always;
    }
    .noprint {
        display: none !important;
    }
    @page {
        margin: 1cm 2cm 1cm 2cm;
    }
    img {
        max-width: 100% !important;
    }
    .notice {
        page-break-inside: avoid;
    }
    .nobreak { 
    page-break-inside: avoid;
    }

  }
/* end printing*/

/* For tables */

table {
    width: 100%;
}



th, td {
    padding: 10px;
}
        
tr {
    background-color: aliceblue;
}

tr:nth-child(even) {
    background-color: #eeeeee;
}


table.datasheet {
    border-collapse: collapse;
    border: 1px solid black;
    margin:auto;
    margin-top: 20px;
}

table.datasheet tr:nth-child(odd) {
    background-color: #dddddd;
}
table.datasheet {
    background-color: #eeeeee;
}

table.datasheet th {
    
    background-color:grey;
    color:black;
    padding-right: 10px;
    padding-left: 10px;

}

table.datasheet  td {
     padding: 6px;
     border: 1px solid rgb(60, 60, 60);
     border-collapse: collapse;
     
 }

table.schedule td {
    text-align:center;
}

table.schedule th {
    border-bottom: 2px solid #000000;
}

.cellgreen {
    background-color:#cfffb7;
}

.cellblue {
    background-color:#b7ddff;
}

.cellyellow {
    background-color:#fff7d6;
}

.cellwhite {
    background-color:#ffffff;
}

.celllight {
    background-color:#eeeeee;
}

/* End for tables */

h1 {
    border-bottom: 1px solid black;
    border-top: 1px solid black;
    padding-bottom: 24px;
    padding-top: 24px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #222;
    font-weight: 600;
    line-height: 1.3;
}

h2 {
    margin-top: 1.3em;
}

a {
    color: #0083e8;
}

b,
strong {
    font-weight: 600;
}

em {
    color:mediumblue;
    font-weight: 600;
    font-style: normal;
}


/* Images and Figure counting*/

.app_d {
    border: 0;
}

img {
    background: transparent;
    border: 6px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    display: block;
    margin: 1.3em auto;
    max-width: 95%;
}
.figure {
	counter-increment: figures;
}

.figure figcaption:before {
	content: 'Figure ' counter(figures) ' - ';
    font-weight: bold;
}


/* end images and figure count*/

/* safety boxes */

.safety_title {
    font-weight: bold;
    padding-bottom: 1em;
    padding-top: 1em;
}



/* notices adapted from http://codepen.io/walesmd/pen/zysbv */



ul.safety {
    list-style-position: inside;
    text-indent: 1em;
}

.notice {
     position: relative;
     margin: 1em;
     background: #F9F9F9;
     padding: 1em 1em 1em 2em;
     border-left: 4px solid #DDD;
     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125);
 }
 
.notice:before {
     position: absolute;
     top: 50%;
     margin-top: -17px;
     left: -17px;
     background-color: #DDD;
     color: #FFF;
     width: 30px;
     height: 30px;
     border-radius: 100%;
     text-align: center;
     line-height: 30px;
     font-weight: bold;
     font-family: FontAwesome;
     text-shadow: 1px 1px rgba(0, 0, 0, 0.5);
 }
 
.info {
     border-color: #8bc34a;
 }
 
.info:before {
     content: "\f129";
     background-color: #8bc34a;
 }

.glassware {
    
 border-color: #8bc34a;
 }
 
.glassware:before {
     content: "\f0c3";
     background-color: #8bc34a;
 }
 .check {
     border-color: #03a9f4;
 }
 
.check:before {
     content: "\f12a";
     background-color: #03a9f4;
 }
 
.warning {
     border-color: #FFa500;
 }
 
 .warning:before {
     content: "\f12a";
     background-color: #FFa500;
 }
 
.save {
     border-color: gold;
 }
 
.save:before {
     content: "\f0c7";
     background-color: gold;
 }

.critical {
     border-color: #d32f2f;
 }
 
.critical:before {
     content: "\f0fa";
     background-color: #d32f2f;
 }
 
 .question {
     border-color: #9c27b0;
 }
 
.question:before {
     content: "\f128";
     background-color: #9c27b0;
 }
 /* end notices */



iframe {
    display: block;
    margin: 0 auto;
}

img.inlineimage {
    border: 0px;
    border-radius: 0px;
    margin: 0em auto;
    height: 12px;
    display: inline;
}
/* For extra questions */
.QA{
    border-style: solid;
    border-width: 1px;
    border-color: grey;
    padding: 10px;

}
.Q {
    font-weight: bold;
    font-size: large;
}

.A {
    
    
}
.A span {
    font-weight:bold;
}



.hilite span {
    color: dodgerblue;
}
.hilite {
    font-weight:bold;
    
}
.answer {
    background: lightgrey;
}

#graph{
    height: 550px;
}

/* For extra questions */

.button {
    background-color: dodgerblue; /* Green */
    border: none;
    color: white;
    padding: 5px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border-radius: 6px;
    height: 31px;
    width: 280px;
}

.nowrap {
    white-space:nowrap;
}

ol.sublist {
    list-style-type: lower-alpha;
}


/* Specific for titration lab*/

.acid {
    margin:auto;
}

.acid th {
    text-align: left;
}

.acid td {
    padding-right: 2em;
}

.titration {
    min-width: 85px;
}

@media screen and (max-width: 650px) {
.titration {
    min-width: 15px;
}
}

.right{
    float: right;
    width: 250px;
    margin: 0 0 2px 2px;
    padding: 5px;
    text-align: center;
}

/* For printing */
@media print {
    
    html {
        height: auto;
        background: rgb(255, 255, 255);
    }
    
    body {
    color: #000;
    background: #fff;
    font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
    font-size:11pt;
    line-height:1.5;
    height: auto;
    width: 100%;
    margin: auto;
    padding: 0;
    }
    h1, h2, h3, h4, h5, h6 {
    page-break-after:avoid;
    page-break-inside:avoid
    }
 
    img {
    page-break-inside:avoid;
    page-break-after:avoid;
        max-width: 100% !important;
    }
    
    figure {
        page-break-inside:avoid;
    }
 
    blockquote, table, pre {
    page-break-inside:avoid
    } 
 
    ul, ol, dl {
    page-break-before:avoid
    }
 
    .pagebreak { 
        page-break-inside: avoid;;
    }
    .break {
        page-break-before: always;
    }
    .noprint {
        display: none !important;
    }
    @page {
        margin: 1cm 2cm 1cm;
    }
    .scroll::-webkit-scrollbar { 
        width: 0 !important }
    }
    
    .scroll {
        -ms-overflow-style: none; }
    }

    .nobreak { 
    page-break-inside: avoid;
    }

  }
@media print and (color) {
   * {
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
   }
}
/* end printing*/