@import url('https://fonts.googleapis.com/css?family=Assistant');

body{
  font-family: 'Assistant', sans-serif;
  font-size: 1.2rem!important;
}
.container-fluid {
  padding-right: 0px!important;
  padding-left: 0px!important;
  margin-right: auto;
  margin-left: auto;}

  .h2, h2 {
    font-size: 3rem!important;
    padding-top: 1rem;
    margin-bottom: 1rem;
  }
  .h3, h3 {
    font-size: 2rem!important;
    padding-top: 1rem;
    margin-bottom: 1rem;
  }

  .h4, h4 {
    font-size: 1.5rem!important;
    padding-top: 1rem;
    margin-bottom: 1rem;
  }

  label {
    font-weight: 500!important;
  }

  #banner{
    /* background: url(http://127.0.0.1:8887/poc.png) no-repeat; */
    width: 100vw;
    /* height: 30vh; */
    /* border: 1px solid; */
    background-size:contain;
  }

  #poc_title{
    padding-right: 15px!important;
    padding-left: 15px!important;
    /* background: url(http://127.0.0.1:8887/rdata_icon.png);
    height: 100px; */
  }

  #rdata1{
    padding-top: 3rem;
  }
  #rdata2{
    padding-right: 15px!important;
    padding-left: 15px!important;
    background: url(rdata_icon2.png) no-repeat;
    background-size: contain;
    background-position: center;
  }
  #intro{
    text-align: justify;
    font-family: 'Assistant', sans-serif !important;
    font-size: 1.3rem!important;
  }
  #smiley{
    margin-top: 2rem;
    text-align: center;
  }
  #help{
    text-align: center;
  }
  #correct{
    text-align: center;
    padding-right: 0px!important;
    padding-left: 0px!important;
  }
  #yes{
    text-align: right;
  }
  #no{
    text-align: left;
  }

  #poc_img{
    background: url(poc11.png) no-repeat;
    background-position: center center;
    background-size:  cover;
    width: 100%;
    height: 100%;
    background-size:contain;

  }

  .btn-default {
    background: #3498db!important;
    background-image: -webkit-linear-gradient(top, #3498db, #2980b9)!important;
    background-image: -moz-linear-gradient(top, #3498db, #2980b9)!important;
    background-image: -ms-linear-gradient(top, #3498db, #2980b9)!important;
    background-image: -o-linear-gradient(top, #3498db, #2980b9)!important;
    background-image: linear-gradient(to bottom, #3498db, #2980b9)!important;
    -webkit-border-radius: 24!important;
    -moz-border-radius: 24!important;
    border-radius: 24px!important;
    font-family: 'Assistant', sans-serif , Arial;
    color: #ffffff!important;
    font-size: 1.2rem!important;
    padding: 5px 10px 5px 10px!important;
    text-decoration: none!important;
  }

  .btn:hover {
    background: #3cb0fd;
    background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
    background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
    text-decoration: none;
  }



  @media screen and (max-width: 575px) {
    #rdata1{
      margin-top: 2rem;
      padding-right: 15px!important;
      padding-left: 15px!important;
      background: url(rdata_bar.png) no-repeat;
      background-size: contain;
      background-position: center;
      height: 4rem;
    }
  }

  @media screen and (min-width: 560px) and ( min-height: 412px ){
  }