* {
  box-sizing: border-box;
  }
html {
  background-color: hsl(180, 0%, 70%);
  font-family: Helvetica, sans-serif;
}
.outb {
    z-index:100;
    border: solid black 1vw;
    width: 100vw;
    max-width:100%;
}

 .inb {
    position:relative;
    border: solid 2vw;
    border-color: hsl(0, 0%, 40%);
    margin: 1vw;
    /* padding-top: 2rem; */
    /* padding-bottom: 2rem; */
}
#textlogo{
    text-align: center;
    font-family: Helvetica;
    font-size:5vw;
    margin-bottom: 3vw;
 }
.alofronttext {
   position:relative;
   width: 35vw;
   top: 0vw;
}
.alofronttex p {
   font-size:3vw;
   text-indent: 0em;
   margin-bottom: 1vw;
   margin-top: 0em;
   line-height: 3vw;
}
.topleft{ display:inline-block;
    vertical-align: top;
    left: 8vw; top: 0vw; }
.topright{ display:inline-block;
    left: 11vw; top: 0vw; }
.left{ left: 8vw; }
.right{ left: 49vw; }
.righter{ margin-left: 4rem;}
.lefter{ margin-left: 0rem; }
p.first {
  margin-top: 0pt;
  }
.button {
  background: #aaaaaa;
  border: solid #666 0.3mm;
  padding: 0.1em;
  padding-left: 0.2em;
  padding-right: 0.2em;
  font-weight: bold;
}
figcaption {
  font-size: 0.8rem;
  color: #696;
  }
h1{
   text-align: center;
   font-size: 2rem;
   font-weight: normal;
   margin-top: 1em;
   margin-bottom: 1em;
   }
body.aclass h1 {
   margin-bottom: 4rem;
}
h2{
   text-align: center;
   font-size: 1.7rem;
   font-weight: normal;
   margin-top: 1em;
   margin-bottom: 1.08em;
}
h3 {
   text-align: center;
   font-size: 1.2rem;
   font-weight: bold;
}
.outb h3 {
   text-align: left;
   margin-bottom: 0.1rem;
}
a{
   text-decoration: none;
   color: black;
   background: hsl(0, 0%, 65%);
}
.classescolor a {
   background: hsl(61, 100%, 34%);
   /* border-color: hsl(61, 100%, 34%); */
}
a:hover {
   background: hsl(0, 0%, 60%);
}
body.aclass {
    width: 45rem;
    margin-left: auto;
    margin-right: auto;
}
#emailthanks {
    display: block;
    position: absolute;
    top: 5rem;
    left: 21rem;
    border: solid #dd5555 1mm;
    background-color: rgba(200, 150, 150, 0.9);
    width: 25rem;
    padding: 2rem;
    font-weight: bold;
}
p.warn {
    border: solid rgb(225, 94, 32) 0.6mm;
    padding: 2mm;
    text-indent: 0em;
    margin: 1.5ex 0em 1.5ex 2em;
}
.rjform p{
    text-align: right;
    margin-right: 10rem;
}

.small {
    font-size: 0.75rem;
}
.pubcolor {
   border-color: hsl(194, 100%, 24%);
}
.classescolori, button.classescolor {
   border-color: hsl(61, 100%, 34%);
}
.bottom {
  margin-top: 10em;
  }
#bglogo {
    font-family: Helvetica, sans-serif; font-size: 124px;
    opacity: 0.1;
    line-height: 0px;
    position: absolute;
    top: 45px;
    left: 0px;
}
#alofront {
  padding-bottom: 10px;
  margin-top: 80px;
  margin-left: 12.5%;
  width: 75%;
}
html.rfm {
  background-color: #D8EDDC;
  background-image: url("/?originalUrl=https%3A%2F%2Falogus.com%2Fpublishing%2Frfm%2Fclovers.png");
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: top right;
  /* -webkit-animation-name: clover; */
  /*         animation-name: clover; */
  /* -webkit-animation-duration: 2s; */
  /*         animation-duration: 2s; */
  /* background-size: 60%; */
  }
@-webkit-keyframes clover {
  from { background-size: 0%; }
  to { background-size: 60%; }
  }
@keyframes clover {
  from { background-size: 0%; }
  to { background-size: 60%; }
  }
.rfmgrad {
  background-color: #D8EDDC;
  background-image:
    linear-gradient(
      to right, 
      green, #D8EDDC
    );
  }
.rfmbg {
  /* background-color: rgba(168, 168, 168, 0.75); */
  background-image:
    linear-gradient(
      to right, 
      rgba(168, 168, 168, 0.0) 50%, rgba(168, 168, 168, 0.75) 100%
    );
  margin-left: 20px;
  padding: 10px;
  }
body.gnuplot {
  width: 50rem;
  }
body.moveright {
    margin-left: 10rem;
}
.bod {
  width: 50rem;
  margin-left: 10rem;
  }
.graybg {
  background-color: #ccc;
}
.lightbluebg {
  background-color: rgb(204, 235, 251);
}
.nobg {
    background-color: transparent;
}
.gnuplot {
  background-color: hsl(30, 90%, 80%);
  font-family: 'Raleway', sans-serif;
  }
body.rfm {
  /* background-color: #D8EDDC; */
  position: relative;
  width: 100%;
  height: 100%;
  font-family: 'Raleway', sans-serif;
  }
.gnuplot h1{
   text-align: center;
   font-size: 2rem;
   font-weight: bold;
   margin-top: 1rem;
   margin-bottom: 1rem;
   }
.rfm a {
  text-decoration: none;
  background-color: #BDD7BE;
  }
.gnuplot a {
  text-decoration: none;
  background-color: hsl(30, 90%, 90%);
  }
.expo {
  text-align: justify;
  width: 50rem;
  }
.shexpo {
  text-align: justify;
  width: 30rem;
  margin: auto;
  }
.wideimage {
  position: relative;
  margin-left: -3rem;
  }
 
.kblockh {
  display: inline-block;
  vertical-align: middle;
  /* width: 45%; */
  margin-left: 0.2em;
  margin-right: 0.2em;
  }
.biggerfont{
  font-size: 120%;
  }
.ctxt {
    text-align: center;
}
.smallmodal {
  background-color: rgba(151, 183, 184,0.9);
  border: solid black 1mm;
  padding: 1em;
  position: fixed;
  width: 66%;
  left: 16%;
  top: 40%;
  display: none;
  }
.smallmodal:target {
  display: block;
  }
.gnuplotinlinebox {
  margin: 10px;
  display: inline-block;
  width: 333px; 
  vertical-align: top;
}
.gnuplotleftbox {
  margin: 10px;
  margin-right: 20px;
  float: left;
  clear: left;
  width: 333px; 
}
.gnuplotrightbox {
  margin: 10px;
  margin-right: 20px;
  float: right;
  clear: right;
  width: 20rem; 
  border: solid 1mm #666;
  padding: 9px;
}
.gnuplotrightbox h3 {
    margin-top: 0.1rem;
}
.gnuplotcenterbox {
  margin: 0px auto;
  padding: 1rem;
  clear: both;
  width: 25rem; 
  border: solid 1mm #666;
}
.gnuplotcenterbox h3 {
    margin-top: 0.1rem;
}
.gnuplotreturnbox {
   margin: auto;
   margin-top: 200px;
   width: 500px;
   }
.gnuplotreturnbox input[type='email'] {
  width: 20em;
  }
.gnuplotreturnbox input[type='text'] {
  width: 20em;
  }
.bgpics {
    z-index: 20;
    position:absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.bgpics img {
    width: 33%;
}
.moreinforec {
  /* border: solid red 0.5mm; */
  min-height: 20rem;
  color: black;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
  font-weight: bold;
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, 10rem);
  grid-template-rows: repeat(auto-fit, 6rem);
  align-content: center;
  justify-content: center;
  align-items: center;
  justify-items: center;
  row-gap: 1rem;
  column-gap: 1rem;
}
.moreinforec > label {
  border: solid #666 1mm;
  border-radius: 8px;
  padding: 0.4rem;
  height: 2.5rem;
  text-align: center;
  width: 10rem;
  cursor: zoom-in;
}
.moreinforec > label:active {
  background-color: hsl(100, 50%, 65%);
}
.moreinforec > input {
  display: none;
}
.moreinforec > input         + label > div{
  transition: all 1.0s;
  opacity: 0;
  z-index: -10;
  font-size: 1.0rem;
  font-weight: normal;
  background-color: hsl(360, 54%, 82%);
  position: absolute;
  left: 0rem;
  top: 0rem;
  padding: 1.4rem;
  height: 100%;
  width: 100%;
  text-align: left;
}
.moreinforec > input:checked + label > div {
  opacity: 1;
  z-index: 10;
  cursor: zoom-out; 
}
.moreinforec input + label > div > img { 
  float: left;
  margin-right: 0.2rem;
  max-width: 50%;
  height: auto;
  max-height: 100%;

}
.moreinforec label > img {
  height: 100%;
}

.moreinforec a {
  color: black;
  background-color: transparent;
  text-decoration: none;
}
.onsale {
  color: red;
  font-style: oblique;
}
#landingbanner {
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 0.2rem;
}
#buynow {
  text-align: center;
}
#g5slideshow {
  position: relative;
  /* border: solid red 0.3mm; */
  width: 100%;
  height: 26rem;
  margin-top: 1.4rem;
  margin-left 0%;
  font-size: 1.7rem;
}
#g5slideshow > div{
  width: 100%;
  height: 100%;
  display: grid;
  grid-template: 100% / 1.5fr 1fr;
  align-items: center;
  justify-items: start;
  animation: 105s slideFadeIn infinite linear;
  position: absolute; top: 0; left: 0; opacity: 0.0
}
#g5slideshow  > div > img {
  height: 100%;
  max-width: 100%;
}
#g5slideshow > div > div {
  padding-left: 0.2rem;
  /* padding-right: 0.5rem; */
  color: #666;
}
#g5slideshow > div:nth-child(1)  {animation-delay: 0s}
#g5slideshow > div:nth-child(2)  {animation-delay: 7s}
#g5slideshow > div:nth-child(3)  {animation-delay: 14s}
#g5slideshow > div:nth-child(4)  {animation-delay: 21s}
#g5slideshow > div:nth-child(5)  {animation-delay: 28s}
#g5slideshow > div:nth-child(6)  {animation-delay: 35s}
#g5slideshow > div:nth-child(7)  {animation-delay: 42s}
#g5slideshow > div:nth-child(8)  {animation-delay: 49s}
#g5slideshow > div:nth-child(9)  {animation-delay: 56s}
#g5slideshow > div:nth-child(10) {animation-delay: 63s}
#g5slideshow > div:nth-child(11) {animation-delay: 70s}
#g5slideshow > div:nth-child(12) {animation-delay: 77s}
#g5slideshow > div:nth-child(13) {animation-delay: 84s}
#g5slideshow > div:nth-child(14) {animation-delay: 91s}
#g5slideshow > div:nth-child(15) {animation-delay: 98s}

@keyframes slideFadeIn {
  0% {opacity: 0.0}
  1.0% {opacity: 1.0}
  5.666% {opacity: 1.0}
  6.666% {opacity: 0.0}
  100% {opacity: 0.0}
}
.bottomlinks {
  text-align: center;
  font-size: 0.8rem;
  margin-top: 100px;
  }
.rbottomlinks {
  text-align: center;
  font-size: 0.85rem;
  margin-top: 4rem;
  margin-left: auto;
  margin-right: auto;
  }
.bottomlinks p, .rbottomlinks p {
  display: inline;
  margin-right: 1rem;
  }
.morelinks{
  text-align: center; font-size: 1.4rem;
  margin-top: 2rem;
}
.morelinks p {
  display: inline;
  margin-right: 1rem;
}
.highlink {
  text-align: center; font-size: 1.4rem;
  margin-top: 2rem;
}
.highlink a {
  background-color: black;
  color: white;
  font-weight: bold;
  padding: 0.8rem;
}
.promolink {
  text-align: center; font-size: 1.4rem;
  margin-top: 2rem;
}
.promolink a {
  background-color: hsl(30, 90%, 60%);
  color: hsl(30, 90%, 30%);
  padding: 0.5rem;
}
.centerbox {
    margin: 0 auto;
}
.centertext {
    text-align: center;
}
.buy_button {
  width: 171px;
  }
.borderbox {
  border: solid 1mm #666;
  padding: 9px;
}
#paysetup {
  border: solid 1mm #666;
  padding: 9px;
}
#paysetup h2 {
  font-weight: bold;
  font-size: 150%;
  margin-top: 0.1em;
}
.long {
  width: 20em;
  }
.smallsubmit {
    font-size: 1.0rem;
    border: solid 1mm;
}
.bigsubmit {
    font-size: 1.4rem;
    border: solid 1mm;
}
.big_centered {
  width: 700px;
  text-align: justify;
  margin-left: auto;
  margin-right: auto;
 } 
.light_text {
  opacity: 0.5;
  }
@media screen and (max-width: 810px){
html.rfm {
  background-image: none;
  }
body.gnuplot {
  width: auto;
  }
.big_centered {
  width: auto;
  }
#bglogo {
  display: none;
  }
.expo {
 width: auto;
 }
.gnuplotleftbox {
  float: none;
  margin: 10px;
  width: 333px; 
}
}
