/* https://chemandy.com/themes/calculator.css */
/* Use the reference number series 30 to 39 */

em { font: 400 100% Georgia, Cambria, "Latin Modern Math", "Lucida Bright", "Liberation Serif", Palatino, "Times New Roman", Serif; text-decoration: underline
}
.dropdiv {display: inline-block; margin: -35% 0 0 50%; width:100%
}
.dropdiv5x10 {margin: 2% 40% 2% 50%; width:100%
}
.dropdiv5x30 {margin: 2% 40% 2% 50%; width:50%
}
.dropdiv10x25, .dropdiv10x50, .dropdiv15x25, .dropdiv20x5, .dropdiv20x45 {margin: 2% 40%; width:100%
}
.f31 {font: italic 400 100% Georgia, Cambria, "Latin Modern Math", "Lucida Bright", "Liberation Serif", Palatino, "Times New Roman", Serif
}
.f32 {font-weight: 700; text-align:center
}
.figwidth7p5 {width: 7.5%; height: auto
}
.figwidth10 {width: 10%; height: auto
}
.figwidth12p5 {width: 12.5%; height: auto
}
.figwidth15 {width: 15%; height: auto
}
.figwidth20 {width: 20%; height: auto
}
.figwidth25 {width: 25%; height: auto
}
.figwidth30 {width: 30%; height: auto
}
.figwidth35 {width: 35%; height: auto
}
.figwidth40 {width: 40%; height: auto
}
.figwidth45 {width: 45%; height: auto
}
.figwidth50 {width: 50%; height: auto
}
.figwidth240 {width: 240%; height: auto
}
.figwidth300 {width: 300%; height: auto
}
h1 { border: #000 1pt solid; background: #c9ebb2; color: #000; font: 600 110% "Times New Roman", Cambria, Palatino, Serif; margin: 7% 30% 2%; padding: .5%; text-decoration: none; vertical-align: bottom
}
.hide-on-fallback {display: block; position: absolute; left: -100%; height: 0; width: 0; overflow: hidden
}
hr {background: #000 0 50%; height: 2px
}
.imgleft2 { position: absolute; left: 0; margin: 2% 1% 0 2%; width: 22%; height: auto; z-index: -1
}
.imgleft5 { position: absolute; left: 0; margin: 2% 1% 0 5%
}
.imgleft10 { position: absolute; left: 0; margin: 2% 1% 0 10%; width: 22%; height: auto; z-index: -1
}
.imgleft15 { position: absolute; left: 0; margin: 2% 1% 0 15%; width: 7.5%; height: auto; z-index: -1
}
.imgleft19 { position: absolute; left: 0; margin: 0 1% 0 19%; width: 13%; height: auto; z-index: -1
}
.imgleft20 { position: absolute; left: 0; margin: 2% 1% 0 20%; width: 22%; height: auto; z-index: -1
}
.imgright5 { float: right; margin: 2% 5% 10% -50%
}
.imgright10 { float: right; margin: 2% 10% 10% -25%
}
.imgright15 { float: right; margin: 2% 15% 10% -25%
}
input, select {text-align: center; font-size: 100%; font-weight: 400
}
.left2centre5, .left2centre5x10, .left2centre5x25, .left2centre5x30 {float: left; margin: 2% 2% 2% 5%
}
.left2centre10, .left2centre10x10, .left2centre10x25, .left2centre10x50 {float: left; margin: 2% 2% 2% 10%
}
.left2centre15x10 {float: left; margin: 7% 2% 2% 15%
}
.left2centre15x25 {float: left; margin: 2% 2% 2% 15%
}
.left2centre20x5 {float: left; margin: 7% 2% 2% 20%
}
.left2centre20x45, .left2centre20 {float: left; margin: 2% 2% 2% 20%
}
.left2centre30x5  {float: left; margin: 2% 2% 2% 30%
}
#nav > a {display: none
}
#nav li {position: relative
}
#nav li a {margin-top: 3%; padding: 5% 0; background: #66d819; display: block; text-decoration: none; text-align: center; font-weight: 600; white-space: nowrap
}
#nav li a:active { background: #88e04c
}			
#nav span:after {width: 0; height: 0; border: .5em solid transparent; border-bottom: none; border-top-color: #FFF; content: ''; vertical-align: middle; display: inline-block; position: relative; right: -0.313em
}
/* first level */
#nav > ul {margin: -9% 2% -3%; height: 2.5em; background: #66d819; list-style: none
}
#nav > ul > li {width: 17%; height: 75%; float: left
}
#nav > ul > a {font-size: 1.2em; line-height: 2.9em; padding: 0	
}
#nav > ul > li:not( :last-child ) > a {border-right: 2px solid #333
}
#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a {background: #88e04c
}
/* second level */
#nav li ul {margin: 10% 2% 3% -10.2%; background: #4cbe00; width: 111%; display: none; position: absolute; top: 100%; list-style: none; padding: 0 5% 5%
}
#nav li:hover ul {display: block
}
#nav li ul a {border-top: 2px solid #333; padding: .75em; margin: -1% 5% 2%
}
#nav li ul li a:hover, #nav li ul:not( :hover ) li.active a {background: #88e04c
}
.sidebyside {height: auto; margin: 5% 20% 0 20%; width: 60%
}
.spar {text-align: right; padding: .5% 0
}
@media screen and (-webkit-min-device-pixel-ratio:0){
a:visited {fill:inherit; stroke:inherit
}
}
.tableright4 {font-size: 110%; font-weight: 500; margin-left: 0; width: 75%
}
.tableright5 {font-size: 110%; font-weight: 500; margin-left: 5%; width: 95%
}
.tableright10 {font-size: 110%; font-weight: 500; margin-left: 10%; width: 90%
}
.tableright25 {font-size: 110%; font-weight: 500; margin-left: 25%; width: 75%
}
.tableright27 {font-size: 110%; font-weight: 500; margin-left: 27%; width: 60%
}
.tableright30B {font-size: 110%; font-weight: 500; margin-left: 30%; width: 60%
}
.tableright32 {font-size: 110%; font-weight: 500; margin-left: 32%; width: 35%
}
.tableright35 {font-size: 110%; font-weight: 500; margin-left: 35%; width: 55%
}
td {white-space: nowrap
}
.wrap {white-space: pre-wrap
}
/* large screens/TV */
@media only screen and (max-width: 2001px) {
body { font-size: 120%; font-weight: 500
}
.dropdiv {margin: -35% 0 0 50%; width:100%
}
.dropdiv10x10 {margin: 5% 0 2% 60%; width:100%
}
.figurefloatright {width: 25%; height: auto
}
.figwidth7p5 {width: 6%
}
.figwidth10 {width: 9%
}
.figwidth12p5 {width: 10%
}
.figwidth15 {width: 15%
}
.figwidth20 {width: 20%
}
.figwidth25 {width: 22%
}
.figwidth30 {width: 30%
}
.figwidth35 {width: 35%
}
.figwidth40 {width: 32%
}
.figwidth45 {width: 38%
}
.figwidth50 {width: 55%
}
.figwidth240 {width: 120%
}
.figwidth300 {width: 100%
}
h1 {margin: 9% 30% 4%
}
.imgleft15 { position: absolute; left: 0; margin: -1% 1% 0 15%
}
.left2centre5x10 {float: left; margin: 4% 2% 2% 10%
}
.left2centre20x5 {float: left; margin: 2% 2% 2% 25%
}
.main {margin-top: 0
}
}
/* large laptops */
@media only screen and (max-width: 1601px) {
body { font-size: 100%
}
.figwidth7p5 {width: 7.8%
}
.figwidth10 {width: 12%
}
.figwidth15 {width: 16%
}
.figwidth17p5 {width: 21%
}
.figwidth20 {width: 21%
}
.figwidth22p5 {width: 27%
}
.figwidth25 {width: 27%
}
.figwidth27p5 {width: 31%
}
.figwidth30 {width: 31%
}
.figwidth35 {width: 38%
}
.figwidth40 {width: 44%
}
.figwidth45 {width: 40%
}
.figwidth50 {width: 60%
}
.figwidth55 {width: 70%
}
}
/* laptops */
@media only screen and (max-width: 1299px) {
body {font-size: 80%
}
.dropdiv5x10 {margin: 5% 0 2% 70%
}
.dropdiv5x30 {margin: 1% 0 2% 65%
}
.dropdiv20x5 {margin: 1% 0 2% 45%
}
.figwidth7p5 {width: 7.5%
}
.figwidth10 {width: 13%
}
.figwidth12p5 {width: 15%
}
.figwidth15 {width: 19%
}
.figwidth20 {width: 22%
}
.figwidth25 {width: 35%
}
.figwidth30 {width: 31%
}
.figwidth35 {width: 35%
}
.figwidth40 {width: 40%
}
.figwidth45 {width: 57%
}
.figwidth50 {width: 60%
}
.figwidth240 {width: 100%
}
hr {background: #000 0 25%; height: .5px
}
.imgleft2, .imgleft10, .imgleft20 {width: 33.3%
}
.imgleft19 {width: 16%
}
.left2centre5, .left2centre5x10, .left2centre5x25, .left2centre5x30, .left2centre20 {margin: 3% 2% 5% 5%
}
#nav {width: 100%; position: static; margin: 0
}
/* second level */
#nav li ul {margin: 9% 2% 3% -12%
}
#nav li ul li {line-height: .9em
}
.tableright10 {margin: 0 0 0 5%; width: 60%
}
.tableright30B {margin: 0 0 0 35%; width: 60%
}
}
/* small laptops */
@media only screen and (max-width: 1001px) {
body {font-size: 90%
}
.dropdiv5x10 {margin: 7% 40% 2% 50%
}
.dropdiv5x30 {margin: 30% 40% 2% 15%
}
.dropdiv10x10 {margin: -1% 0 2% 60%
}
.figwidth15 {width: 25%
}
.figwidth20 {width: 31%
}
.figwidth30 {width: 52%
}
.figwidth35 {width: 54%
}
.figwidth40 {width: 50%
}
.imgleft2 {margin: 2% 1% 0
}
.imgleft10 {margin: 2% 1% 0 5%
}
.imgleft15, .imgleft19 {margin: 2% 1% 0 15%
}
.leftside10 {margin: -2% 2% 6% 40%
}
.left2centre5, .left2centre5x25, .left2centre5x30 {margin: 2% 2% 5% 40%
}
.left2centre5x10 {margin: -1% 2% 2% 40%
}
.left2centre10x25 {margin: 4% 2% 2% 5%
}
.left2centre20x5 {margin: 7% 2% 2% 25%
}
.left2centre10 {margin: 3% 2% 5% 5%
}
.left2centre20 {margin: 6% 2% 2% 5%
}
.left2centre30 {margin: 6% 2% 2% 20%
}
#nav > ul > li {width: 20%
}
#nav > ul {margin: -10% 2% -2% 3%
}
/* second level */
#nav li ul {margin: 9% -10% 0 -25%
}
.sidebyside {margin-top: 3%; width: 80%; height: auto; border: thin transparent solid
}
.tableright10 {font-size: 100%; margin-left: 0; width: 100%
}
.tableright30B {font-size: 100%
}
}
/* large tablets */
@media only screen and (max-width: 801px) {
.dropdiv10x50 {margin: -1% 0 2% 55%
}
body {font-size: 75%
}
.figwidth10 {width: 13%
}
.figwidth12p5 {width: 12.5%
}
.figwidth15 {width: 24%
}
.figwidth20 {width: 32%
}
.figwidth25 {width: 35%
}
.figwidth30 {width: 40%
}
.figwidth35 {width: 45%
}
.figwidth40 {width: 60%
}
.figwidth45 {width: 68%
}
.figwidth50 {width: 75%
}
.imgleft3 {width: 15%
}
.imgleft5 {margin: 0 2% 0 4%; width: 25%
}
.imgleft19 {margin: 0 2% 0 8%; width: 21%
}
.imgright15 {margin: 2% 10% 10% -20%
}
.imgright3 {margin: 2% 5% 10% -30%; width: 25%
}
input, button {font-size: 90%
}
.left2centre10, .left2centre20 {margin: 3% 0 5% 40%
}
.tableright10 {margin-left: 1%; width: 95%; font-size: 90%
}
.tableright25 {margin-left: 30%; width: 70%; height: auto; font-size: 90%
}
.tableright32 {margin-left: 25%; width: 50%
}
.tableright35 {margin-left: 15%; width: 70%
}
}
/*small tablets */
@media only screen and (max-width: 655px) {
body {font-size: 66.7%
}
.dropdiv5x30 {margin: 25% 40% 2% 15%
}
.dropdiv20x5 {margin: 1% 0 2% 52%
}
.figwidth15 {width: 29%
}
.figwidth20 {width: 36%
}
.figwidth300 {width: 90%
}
.footer {font-size: 90%
}
.imgleft3 {margin: 0 2% 0 8%
}
h1 {margin: 5% 20%; font-size: 100%
}
.imgleft20 {margin: 2% 1% 0 10%; width: 10%; height: auto
}
.imgright15 {margin: 2% 2% 10% -5%; width: 25%
}
#nav {position: relative; top: auto; left: auto
}
#nav > a {width: 3.125em; height: 3.125em; text-align: left; text-indent: -9999px; background: #00F; position: relative
}
#nav > a:before, #nav > a:after { position: absolute; border: 2px solid #FFF; top: 35%; left: 25%; right: 25%; content: ''
}
#nav > a:after {top: 60%
}#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type	{display: block
}
/* first level */
#nav > ul {width: 25%; height: auto; margin: -10% 0 0 65%; background: #4cbe00; display: none;	position: absolute;	left: 0; right: 0
}
#nav:target > ul {display: block; line-height: 2.4em
}
#nav > ul > li {width: 80%; margin: -2% 0 0 -10%; float: none
}
#nav > ul > li > a {padding: 0 .833em; font-size: 100%
}
#nav > ul > li:not( :last-child ) > a {border-right: none; border-bottom: 1px solid #333
}
/* second level */
#nav li ul { margin: 0 0 0 -20%; position: static; padding: 1.25em; padding-top: 0; width: 130%
}
#nav li ul li {font-size: 100%; margin: 0 0 -4% 6%; width: 105%
}
#nav li ul a {border-top: 1px solid #333
}
.tableright10 {font-size: 95%; margin-left: -3%; width: 99%
}
.tableright25 {font-size: 95%; margin-left: 1%; width: 99%; height: auto
}
.tableright32 {margin-left: 40%; width: 50%; font-size: 95%
}
} 
/* mobile phones */
@media only screen and (max-width: 505px) {
.dropdiv {margin: -2% 0 0 15%; width:90%
}
.dropdiv5x10 {margin: 10% 20% 2%
}
.dropdiv5x30, .dropdiv10x25 {margin: 40% 40% 2% 15%
}
.dropdiv10x50 {margin: 50% 0 2% 20%
}
.dropdiv15x25 {margin: 40% 40% 2% 20%
}
.dropdiv20x5 {margin: 2% 40% 2% 45%
}
.dropdiv20x45 {margin: 45% 40% 2% 30%
}
.figwidth7p5, .figwidth10 {width: 15%
}
.figwidth12p5 {width: 25%
}
.figwidth15 {width: 39%
}
.figwidth20 {width: 52%
}
.figwidth25 {width: 66.6%
}
.figwidth30 {width: 65%
}
.figwidth35 {width: 65%
}
.figwidth40 {width: 95%
}
.figwidth45 {width: 106%
}
.figwidth50 {width: 130%
}
.figwidth300 {width: 90%
}
.imgleft2, .imgleft10 {margin: 2% 1% 0 30%; width: 40%
}
.imgleft15 {margin: -2% 1% 0 3%; width: 17%
}
.imgleft19 {margin: 2% 1% 0 30%; width: 35%
}
.imgright15 {margin: 2% 2% 10% -10%; width: 20%
}
h1 {margin: 6% 10% 2%
}
.left2centre5, .left2centre10 {margin: 2% 0 5% 50%; padding: 2%
}
.left2centre5x10 {margin: -6% -10% 0 15%; padding: 2%
}
.left2centre5x25 {margin: 2% 0 5% 30%; padding: 2%
}
.left2centre5x30 {margin: 2% 0 5% 15%; padding: 2%
}
.left2centre15x25 {margin: 2% 2% 2% 45%
}
.left2centre20x5 {margin: 15% 0 2%
}
.left2centre30 {margin: -2% 0 5% 50%
}
/* first level */
#nav > ul {width: 37%; margin: -16% 0 0 45%
}
#nav > ul > li {margin: -2% 0 0 -15%
}
/* second level */
#nav li ul {font-size: 100%; margin: 1% 0 2%; width: 100%
}
#nav li ul li {width: 155%; margin: 0 0 2% -20%
}
.sidebyside {margin-top: 3%; width: 80%; height: auto; border: thin transparent solid
}
.tableright30B {margin: 50% 5% 0 0; width: 90%; font-size: 90%
}
.tableright32 {margin: 10% 5% -10% 15%; width: 90%; font-size: 90%
}
.tableright35 {font-size: 100%
}
}
/* small mobile phones */
@media only screen and (max-width: 350px) {
.dropdiv15x25 {margin: 45% 40% 2% 20%
}
.figwidth10 {width: 18%
}
.figwidth15 {width: 45%
}
.figwidth20 {width: 63%
}
.figwidth30 {width: 72%
}
.figwidth40 {width: 125%
}
h1 {font-size: 107%
}
.imgleft2 {margin: 1% 1% 10% 30%; width: 50%
}
.imgleft10 {margin: 1% 1% 10% 30%; width: 45%
}
.imgright5 {margin: 2% 1% 10% -30%; width: 25%
}
#nav > ul {margin: -18% 0 0 45%
}
/* second level */
#nav li ul li {margin: 0 0 2% -44%; width: 175%
}
select, .tableright32 {font-size: 90%
}
.tableright30B {margin: 50% 0 0 -4%; width: 100%; font-size: 85%
}
.tableright35 {font-size: 90%; margin-left: 10%; white-space: nowrap
}
}
/* smallest mobile phones */
@media only screen and (max-width: 300px) {
body {font-size: 50%
}
.figwidth15 {width: 60%
}
.figwidth30 {width: 75%
}
.figwidth300 {width: 75%
}
h1 {font-size: 100%
}
.imgleft10 {margin: -4% 0 50% 30%; width: 50%
}
.left2centre5x10 {margin: -6% 0 0 10%; padding: 1%
}
#nav > ul {font-size: 90%; margin: -20% 0 0 45%; width: 40%
}
/* second level */
#nav li ul li {width: 140%; margin: 0 0 2% -30%
}
.tableright10 {font-size: 100%; margin-left: -3%; width: 99%
}
.tableright30B {margin: 50% 0 0 -4%; width: 100%; font-size: 100%
}
}