/*
put any CSS shared by all instances
of this component here. Also be sure to add this file
to the styleRefs array in elastic
*/
section#legacy .simple-circle-tout {
  /* height: 280px;*/ /*this is making title jump up auto will fix it*/
  padding-top:15px;
  padding-bottom: 20px;
}

section#legacy .simple-circle-tout .rounded-circle {
  min-width: 149px;
  width: 13.3vw;
  height: auto;
  margin: 10px 0px 10px 0px;
}

section#legacy .simple-circle-tout .postscript-text {
  font-size: 13px;
  line-height: 26px;
}

section#legacy .simple-circle-tout .title-text{
  font-size: 26px;
  line-height: 26px;
}

section#legacy .simple-circle-tout .prelude-text{
  font-size: 20px;
  line-height: 26px;
}


@media only screen and (min-width: 768px) {
  section#legacy .simple-circle-tout {
    /*height: auto;*/
    min-width: 373px;
  }

}
@media only screen and (min-width: 1200px) {
  section#legacy .simple-circle-tout {
    height: 30vw;
    padding-top:1.33vw;
    padding-bottom: 1.78vw;
  }
  section#legacy .simple-circle-tout .rounded-circle {
    min-width: 13.30vw;
    margin: 0.89vw 0px 0.89vw 0px;
  }

  section#legacy .simple-circle-tout .title-text{
    font-size: 2.30vw;
    line-height: 2.30vw;
  }
  
  section#legacy .simple-circle-tout .prelude-text{
    font-size: 1.78vw;
    line-height: 2.30vw;
  }
  section#legacy .simple-circle-tout .postscript-text {
    font-size: 1.16vw;
    line-height: 2.32vw;
  } 
}