:root {
--large-banner-background-color: #00acd4;
--large-banner-text-line1: 'Click Here to view the';
--large-banner-text-line2: 'video version of the site!';
--large-banner-text-color: #000000;
--large-banner-border-color: #000000;
--large-banner-stays-up: 750s;
--small-banner-comes-up-delay: 1s;
--small-banner-background-image: url("seesaw_icon.png");
--desktopFrameWidth: 9;
--desktopFrameColor: #00acd4;
--smallerFrameWidth: 5;
--smallerFrameColor: #00acd4;
}
#svg_bg path{
  fill: var(--large-banner-background-color);
  stroke: var(--large-banner-border-color);
}
.banner_text{
  color: var(--large-banner-text-color);
  font-weight:bold;
  font-family:sans-serif;
  position: absolute;
    top: 15px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
}
#line1{

  font-size:14pt;
}
#line1::after{
  content: var(--large-banner-text-line1);
}
#line2{

  font-size:14pt;
}
#line2::after{
  content: var(--large-banner-text-line2);
}
#line3{

  font-size:11pt;
  margin-top:5px;
}
#sawicon2{
  background-image:var(--small-banner-background-image);
  width:90px;
  height:90px;
  background-size:90px 90px;
  cursor:pointer;
}
#seesaw_trigger1{
  animation-delay: var(--large-banner-stays-up) !important;
}