@charset "utf-8";

/* I have monkeys in my pants. */

html {
  width: 100%;
  height: 100%
}

body {
  color: #000000;
  background-attachment: fixed;
  background-color: #FFFFFF;
  background-image: url(watermark.gif);
  background-position: center;
  background-repeat: no-repeat;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.875em;
  margin: 0em auto;
  overflow: scroll;
  padding: 0em 12px 2px 12px;
  text-align: center;
  width: 816px;
}

p {
  clear: left;
  margin: 1.875em 0em;
  padding: 0em;
  text-align: justify;
}

h1, h2, h3, h4 {
  clear: left;
  margin: 1.25em 0em;
  padding: 0em;
  text-align: left;
}

h1 {
  font-size: 1.750em;
}

h2 {
  font-size: 1.500em;
}

h3 {
  font-size: 1.250em;
}

h4 {
  font-size: 1.000em;
}

li {
  line-height: 1.5em;
  margin: 0em;
  padding: 0em;
  text-align: left;
}

a         { text-decoration: none; }
a:link    { color: #0000EE; }
a:visited { color: #551A8B; }
a:hover   { color: #990000; background-color: #FFFF99; text-decoration: underline; }
a:active  { color: #FF0000; }

table  { text-align: center; border-collapse: collapse; border: none; border-spacing: 0em; margin: 0em auto; padding: 0em;
         background-color: transparent; }
td, th { margin: 0em; padding: 0em; }
th     { white-space: nowrap; }

em { font-style: normal; text-decoration: underline; }

sub, sup { font-size: 66.6%; line-height: 0em; white-space: nowrap; }

.shadow,
table.listicle td:first-child,
img,
embed      { border: none; padding: 0em; box-shadow: 0.00em 0.25em 0.50em rgba(  0,  0, 24,0.5); max-width: 100%; }
img.icon,
embed.icon { box-shadow: none; }

img,
td { box-sizing: border-box; }

code { background-color: #ffff99; font-family: monospace; }

/* Right next to my Meatleg */

.fall   { color:#903000; }
.spring { color:#309000; }

.banner {
  box-shadow: 0.00em 0.25em 0.50em rgba(  0,  0, 24,0.5);
  width:  816px;
  height: 172px;
  margin-bottom: 1.25em;
}

.bannerproper {
  width:  816px;
  height: 136px;
}

.bannerproper img {
  box-shadow: none;
}

.bannermenu {
  margin: 0em;
  overflow: visible;
  height: 30px;
}

.date {
  color: #FF0000;
}

.calendar, .weather {
  float: right; /* position: absolute; right: 0em; */
  margin: 0em -58px 1em 0em;
  padding: 0em 0em 1em 1.5em;
}

.calendar {
  overflow: hidden;
  width:  272px;
}

.calendar h2, .weather h2 {
  margin-bottom: 0em;
}

.bigcalendar p, .smallcalendar p {
  font-size: 0.875em;
  margin: -2em 0em 0em 0em;
  text-align: left;
  text-indent: 1em;
} /* makes the little text at the bottom fall outside the buffer area around the calendar proper */

.bigcalendar, .smallcalendar {
  background-color: #e3e9ff;
  border-radius: 0.333em;
  padding: 0.250em 0em 0.250em 0em;
}

.tinycalendar {
  display: none;
}

table.weather {
  border: none;
  padding: 0em;
  margin-right: auto;
  margin-left: auto;
  border-collapse: collapse;
  width: 272px;
}

.floater, .floatup {
  float: right;
  line-height: 1.375em;
  margin: 0.5em 0em 0.5em 1.5em;
  text-align: center;
  width: auto;
  max-width: 30%;
}

.floater img, .floatup img {
  width: auto;
  max-width: 100%;
}

.floatup {
  margin-top: -4em;
}

.highlighter {
  background-color: #FFFF55;
}

p.dates {
  line-height: 1.375em;
  margin-left: 2.5em;
  text-align: left;
  text-indent:0em;
}

p.permalink {
  text-align: center;
}

p.permalink a:visited,
p.permalink a:link {
  color: #cccccc;
}

.posted {
  margin-top: 0em;
}

.source { 
  text-align: right;
}

.vanish {
  opacity: 0;
}

/* galleries (centeredimage is basically a single celled gallery) */

p.centeredimage {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

p.centeredimage img {
  margin: 0em 0em 0.375em 0em;
}

body article:nth-of-type(1) p.centeredimage img {
  max-width: 70%;
}

table.gallery,
table.gallery2,
table.gallery3,
table.gallery4     { width: 100%; }

table.gallery2 td  { width:  50%; }
table.gallery3 td  { width:  33%; }
table.gallery4 td  { width:  25%; }

table.gallery2 td,
table.gallery3 td,
table.gallery4 td  { padding: 0.5em; line-height: 1.375em; vertical-align: center; }

table.gallery2 img,
table.gallery3 img,
table.gallery4 img { width: 100%; }

aside,
.floater,
.floatup,
p.centeredimage,
table.gallery  td,
table.gallery2 td,
table.gallery3 td,
table.gallery4 td  { font-size: 14px; line-height: 1.375em; }

/* electron microscope table 588 px wide 
  588 - 12/2 = 288
  588 - 12/3 = 192
  588 -  1/4 = 145
  normal sem image dimensions 1280 * 1080
  288/1280 * 1080 = 243
  192/1280 * 1080 = 162
  145/1280 * 1080 = 122 */

table.sem2, table.sem3, table.sem4 {
  border: none;
  border-collapse: collapse;
  margin-right: auto;
  margin-left: auto;
  padding: 0em;
  text-align: center;
  width: 100%;
}

.sem2 img { height: 243px; width: 288px; margin-top: 1.250em; }
.sem2 td  { padding:  6px; width:   50%; vertical-align: top; line-height: 1.250em; }
.sem3 img { height: 162px; width: 192px; margin-top: 1.250em; }
.sem3 td  { padding:  6px; width:   33%; vertical-align: top; line-height: 1.250em; }
.sem4 img { height: 122px; width: 145px; margin-top: 1.250em; }
.sem4 td  { padding:  6px; width:   25%; vertical-align: top; line-height: 1.250em; }

table.listicle { margin-left: 0em; margin-right: auto; margin-top: 1em; margin-bottom: 1em; }
table.listicle td { height: 12em; }
table.listicle td:first-child { background-color: white; background-position: center; background-size: cover; line-height: 0em; width: 16em; }
table.listicle td:first-child img { box-shadow: none; width: 96%; height: 96%; }
table.listicle td:last-child { padding-left: 1em; text-align: left; }
table.listicle p { margin: 0em; }

p.listicles img { float: left; margin: 0em 0.5em 0.125em 0em; width: 16em; } /* images must be square? */

/*
   Soylent Green is people!
   This style overlaps physicsa.com, midwoodscience.org, AND physics.info homework pages.
 */

.signature { font-size: 12px; line-height: 1.5em; margin: 2em auto; text-align: center; width: 98%; }
.signature table.science,
.signature table.midwood { display: inline; margin: 0em 1em 1em 1em; }
.signature table.midwood td { text-align: left; white-space: nowrap; }
.signature table.midwood td:nth-child(2) { padding-left: 0.5em; }
.signature img { background-color: transparent; box-shadow: none; }
.signature table.science img { width: 18.0em; height: 4.5em; }
.signature table.midwood img { width:  8.0em; height: 8.0em; max-width: none; }

.signature a:link,
.signature a:visited { color: #999999; }
.signature a:hover   { color: #990000; background-color: #FFFF99; }
.signature a:active  { color: #FF0000; }

.socials { width: 50%; }

/* This style does not overlap. */

table.directory { margin-bottom: 1.5em; }
table.directory th:nth-child(1),
table.directory td:nth-child(1) { text-align: left; }
table.directory th:nth-child(3),
table.directory td:nth-child(3) { text-align:right; padding-right: 0em; }
table.directory th:nth-child(4),
table.directory td:nth-child(4) { text-align: left;  padding-left: 0em; }

/*
 * Horizontal CSS Drop-Down Menu Module
 * @link      http: //www.lwis.net/free-css-drop-down-menu/
 * @copyright 2006-2008 Live Web Institute. All Rights Reserved.
 */

ul.dropdown, ul.dropdown li, ul.dropdown ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
}

ul.dropdown {
  position: relative;
  z-index: 597;
}

ul.dropdown li {
  float: left;
  height: 24px;
  text-align: center;
  vertical-align: middle;
}

ul.dropdown li.hover, ul.dropdown li:hover {
  cursor: default;
  position: relative;
  z-index: 599;
}

ul.dropdown ul {
  left: 0px;
  position: absolute;
  top: 100%;
  visibility: hidden;
  z-index: 598;
}

ul.dropdown ul li {
  float: none;
  padding: 6px;
  text-align: left;
  width: 180px;
}

ul.dropdown ul ul {
  top: -2px;
  left: 67%;
}

ul.dropdown li:hover > ul {
  visibility: visible;
}

ul.dropdown li {
  border-color: #d9d9d9 #9a9a9a #aeaeae #9a9a9a;
  border-style: solid;
  border-width: 1px 1px 1px 0px;
  color: #000000;
  text-transform:lowercase;
  padding: 6px 0px 6px 0px;
  width: 94px;
}

ul.dropdown li.hover,  ul.dropdown li:hover {
  background-color: #2277bb;
  color: #ffffff;
  cursor: pointer;
  position: relative;
}

/* -- level mark -- */

ul.dropdown ul {
  margin-top: 1px;
  width: 220px;
}

ul.dropdown ul li {
  border-color: #d9d9d9 #9a9a9a #aeaeae #d9d9d9;
  border-style: solid;
  border-width: 1px;
  margin: 0px 0px 0px -1px;
}

ul.dropdown *.dir {
  background-image: url(hand.svg);
  background-position: 160px 50%;
  background-repeat: no-repeat;
}

/* -- my additions -- */

ul.dropdown li.search {
  border-right: none;
  width: 246px;
}

ul.dropdown form {
  display: inline;
  margin: 0px;
  padding: 0px;
}

ul.dropdown input {
  display: inline;
  margin: 0px;
  padding: 0px;
}

ul.dropdown fieldset {
  border: none;
  margin: 0px;
  padding: 0px;
}

ul.dropdown ledgend {
  border: none;
  margin: 0px;
  padding: 0px;
}

ul.dropdown *.rss {
  background-image: url(rss.svg);
  background-position: 160px 50%;
  background-repeat: no-repeat;
}

ul.dropdown *.facebook {
  background-image: url(social-facebook.svg);
  background-position: 160px 50%;
  background-repeat: no-repeat;
}

ul.dropdown *.instagram {
  background-image: url(social-instagram.svg);
  background-position: 160px 50%;
  background-repeat: no-repeat;
}

ul.dropdown *.threads {
  background-image: url(social-threads.svg);
  background-position: 160px 50%;
  background-repeat: no-repeat;
}

ul.dropdown *.twitter {
  background-image: url(social-twitter.svg);
  background-position: 160px 50%;
  background-repeat: no-repeat;
}

ul.dropdown a       { text-decoration: none; }
ul.dropdown a:hover { background-color: #2277bb; color: #ffff00; text-decoration: underline; }

/* Why must I sit at this uncomfortable? */

table.vibrant                      { margin-top: 1.500em; margin-bottom: 2.500em; }
li table.vibrant                   { margin-top: 0.250em; margin-bottom: 0.750em; } /* encouraging tighter spacing in hw problems */
table.vibrant caption              { padding: 0.000em 0.000em 0.500em 0.000em; }
table.vibrant th                   { padding: 0.500em 0.500em 0.500em 0.500em; white-space: nowrap; }
table.vibrant td                   { padding: 0.500em 0.125em 0.500em 0.125em; }
table.vibrant td:first-child       { padding-left: 0.500em; }
table.vibrant td:last-child        { padding-right: 0.500em; }

table.vibrant table                { border: none; }
table.vibrant table td             { border: none; }
table.vibrant table th             { border: none; }

table.vibrant tr:nth-child(even) td            { background-color: rgba(255,255,255,0.850); } /* white */
table.vibrant tr:nth-child(odd) td             { background-color: rgba(218,224,229,0.850); } /* light blue gray */
table.vibrant tr:hover td                      { background-color: rgba(255,151,151,1.000); } /* light red */
table.vibrant td                    { border-bottom: 0.083em solid rgba(182,187,191,0.850); } /* darker blue gray */
.bar,
table.vibrant th      { color: rgb(255,255,255); background-color: rgba( 43, 53, 59,0.850); } /* white on blue black */
table.vibrant tr:last-child td      { border-bottom: none; }

table.vibrant { border-radius: 0.333em; }

table.vibrant tr:first-child,
table.vibrant tr:first-child th:first-child { border-radius: 0.333em 0em 0em 0em; }
table.vibrant tr:first-child th:last-child  { border-radius: 0em 0.333em 0em 0em; }
table.vibrant tr:first-child th:only-child  { border-radius: 0.333em 0.333em 0em 0em; }
table.vibrant tr:last-child,
table.vibrant tr:last-child td:only-child,
table.vibrant tr:last-child th:only-child  { border-radius: 0em 0em 0.333em 0.333em; }
table.vibrant tr:last-child td:first-child,
table.vibrant tr:last-child th:first-child  { border-radius: 0em 0em 0em 0.333em; }
table.vibrant tr:last-child td:last-child,
table.vibrant tr:last-child th:last-child   { border-radius: 0em 0em 0.333em 0em; }

table.vibrant { box-shadow: 0.00em 0.25em 0.50em rgba(  0,  0, 24,0.5); } /* shadowed */

body.errorpage { background-image: url(https://midwoodscience.org/pieces/smashing.png); background-size: cover; }
.errorpage img              { transform: rotate(0.707deg); }
.errorpage table.vibrant    { transform: rotate(-6.00deg); }
.errorpage .signature table { transform:  rotate(2.000deg);}

@media print {
  body { background-image: none; }
  .banner,
  .directory,
  .donotprint { display: none; }}

/* Adapted from Shrink-wrap and Center by Bruno Fassino
   http://brunildo.org/test/shrink_center_4.html */

.swc0   { display: table;      height: 100%; width: 100%; margin: 0em; }
.swc1   { display: table-cell; height: 100%; vertical-align: middle;  }
.swc2   { display: inline;     height: 0em; }

/* State Fair. (You mean State Unfair.) */

table.register td { height: 2.250em; text-align: left; }
table.register tr:nth-child(odd) td { vertical-align: bottom; }
table.register tr:nth-child(even) td { vertical-align: top; }

table.faircal { font-size: 14px; }
table.faircal { border-radius: 12pt; box-shadow: 0.00em 0.25em 0.50em rgba(  0,  0, 24,0.5); min-width: 12em; }
table.faircal caption { caption-side: bottom; margin-top: 0.25em; }
table.faircal td, table.faircal th { text-align: center; }
table.faircal th { background-color: rgba(150,  0,  2,1.00); font-size: 2em; padding: 0em 0.5em 0em 0.5em;
                   line-height:2em; border-top-left-radius: 12pt;   border-top-right-radius: 12pt; }
table.faircal td { background-color: rgba(255,255,255,1.00); font-size: 8em; padding: 0.063em 0em; font-weight: bold;
                   line-height: 1em; border-bottom-left-radius: 12pt; border-bottom-right-radius: 12pt; height: 1em; }

table.faircal th a:link,
table.faircal th a:visited { color: #ffffff; }
table.faircal td a:link,
table.faircal td a:visited { color: #000000; }
table.faircal td a:hover,  table.faircal th a:hover  { color: #FFFF00; text-decoration: none; background-color: transparent; }
table.faircal td a:active, table.faircal th a:active { color: #FF0000; text-decoration: none; }

/* ISEF */

table.mosaic4x4,
table.mosaic5x5         { background-color: white; border-collapse: separate; border-spacing: 0.25em; box-shadow: 0.00em 0.25em 0.50em rgba(  0,  0, 24,0.5); overflow: hidden; max-width: 100%; }
table.mosaic4x4 a:hover,
table.mosaic5x5 a:hover { background-color: transparent; color: #000000; text-decoration: none; }
table.mosaic4x4 td,
table.mosaic5x5 td      { background-position: center; background-repeat: no-repeat; background-size: cover; margin: 0em; overflow: hidden; padding: 0em; width: 9em; height: 9em; }
table.mosaic4x4 td img,
table.mosaic5x5 td img  { width: 94%; height: 94%; }
table.mosaic4x4 td      { max-width: 25%; max-height: 25%; }
table.mosaic5x5 td      { max-width: 20%; max-height: 20%; }

/* The Google made me do it. */

ul.dropdown, ul.dropdown li, table.weather {
  background-color: #e3e9ff;
}

/* Ook ook! MailChimp. Ook ook! */

#mc_embed_signup form {display:block; position:relative; text-align:left; padding:10px 0 10px 3%}
#mc_embed_signup h2 {font-weight:bold; padding:0; margin:15px 0; font-size:1.4em;}
#mc_embed_signup input {border:1px solid #999; appearance:none;}
#mc_embed_signup input[type=checkbox]{appearance:checkbox;}
#mc_embed_signup input[type=radio]{appearance:radio;}
#mc_embed_signup input:focus {border-color:#333;}
#mc_embed_signup .button {clear:both; background-color: #aaa; border: 0 none; border-radius:4px; color: #FFFFFF;
                          cursor: pointer; display: inline-block; font-size:15px; font-weight: bold; height: 32px;
                          line-height: 32px; margin: 0 5px 10px 0; padding: 0 22px; text-align: center; text-decoration:
                          none; vertical-align: top; white-space: nowrap; width: auto;}
#mc_embed_signup .button:hover {background-color:#777;}
#mc_embed_signup .small-meta {font-size: 11px;}
#mc_embed_signup .nowrap {white-space:nowrap;}

#mc_embed_signup .mc-field-group {clear:left; position:relative; width:96%; padding-bottom:3%; min-height:50px;}
#mc_embed_signup .size1of2 {clear:none; float:left; display:inline-block; width:46%; margin-right:4%;}
* html #mc_embed_signup .size1of2 {margin-right:2%; /* Fix for IE6 double margins. */}
#mc_embed_signup .mc-field-group label {display:block; margin-bottom:3px;}
#mc_embed_signup .mc-field-group input {display:block; width:100%; padding:8px 0; text-indent:2%;}
#mc_embed_signup .mc-field-group select {display:inline-block; width:99%; padding:5px 0; margin-bottom:2px;}

#mc_embed_signup .indicates-required {text-align:right; font-size:11px; margin-right:4%;}
#mc_embed_signup .asterisk {color:#c60; font-size:200%;}
#mc_embed_signup .mc-field-group .asterisk {position:absolute; top:25px; right:10px;}        
#mc_embed_signup .clear {clear:both;}

#mc_embed_signup .mc-field-group.input-group ul {margin:0; padding:5px 0; list-style:none;}
#mc_embed_signup .mc-field-group.input-group ul li {display:block; padding:3px 0; margin:0;}
#mc_embed_signup .mc-field-group.input-group label {display:inline;}
#mc_embed_signup .mc-field-group.input-group input {display:inline; width:auto; border:none;}

#mc_embed_signup div#mce-responses {float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%;margin: 0 5%; clear: both;}
#mc_embed_signup div.response {margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%;}
#mc_embed_signup #mce-error-response {display:none;}
#mc_embed_signup #mce-success-response {color:#529214; display:none;}
#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}

#mc-embedded-subscribe {clear:both; width:auto; display:block; margin:1em 0 1em 5%;}
#mc_embed_signup #num-subscribers {font-size:1.1em;}
#mc_embed_signup #num-subscribers span {padding:.5em; border:1px solid #ccc; margin-right:.5em; font-weight:bold;}

#mc_embed_signup{clear:left;}

/* No condition is permanent. */