label,p,input{
    text-align: left;
    font: normal normal normal 17px/26px Poppins;
    letter-spacing: 0px;
    color: #707070;
      
    }
    h2,h5{
      text-align: center;
      font: normal normal bold 32px/37px Cambria;
      letter-spacing: 0px;
      color: #00306A;
      opacity: 1
    }
    legend{
      text-align: left;
      font: normal normal bold 20px/30px Poppins;
      letter-spacing: 0px;
      color: #00306A;
      opacity: 1;
    }
    #terminos{
      text-align: left;
    font: normal normal normal 17px/26px Poppins;
    letter-spacing: 0px;
    color: #707070;
    }
    .limpiar{
    /* Layout Properties */
    top: 2222px;
    left: 19px;
    width: 313px;
    height: 50px;
    /* UI Properties */
    background: #00306A 0% 0% no-repeat padding-box;
    color: #CCCCCC;
    border: 1px solid #CCCCCC;
    border-radius: 25px;
    opacity: 1;
      
    }

    
    img{
      top: 74px;
      left: 14px;
      width: 322px;
      height: 227px;
    }
    
    body{
        background-color: #d7e8ff3d;
    }

    .footer{
      flex-shrink: 0;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-end;
      padding: calc(var(--mdb-modal-padding) - var(--mdb-modal-footer-gap)* .5);
      background-color: var(--mdb-modal-footer-bg);
      border-top: var(--mdb-modal-footer-border-width) solid var(--mdb-modal-footer-border-color);
      border-bottom-right-radius: var(--mdb-modal-inner-border-radius);
      border-bottom-left-radius: var(--mdb-modal-inner-border-radius);
    }

    @media only screen and (min-width: 601px) {
      #registrar{
        max-width: 600px;

      }
  
    }
    
    /* If the screen size is 600px or less, set the font-size of <div> to 30px */
    @media only screen and (max-width: 600px) {
      #registrar{
        max-width: 250px;

      }
  
    }



    .widget > .ui-datepicker {
      position: relative;
      display: block;
      padding: 9em 4em 4em;
      background: #ffffff;
      width: 100%;
    }
    .widget > .ui-datepicker:before,
    .widget > .ui-datepicker:after {
      position: absolute;
      z-index: 1;
      top: 100%;
      right: 1em;
      left: 1em;
      height: 0.75em;
      background: #9e9e9e;
    }
    .ui-widget {
      /* font-family: Verdana, Arial, sans-serif; */
      font-size: 0.5em;
    }
    
    .widget > .ui-datepicker:before {
      z-index: 2;
      right: 0.5em;
      left: 0.5em;
      height: 0.425em;
      background: #d9d9d9;
    }
    .widget > .ui-datepicker > .ui-datepicker-header {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      overflow: hidden;
      background: rgb(4 17 57 / 78%);
      background-size: 60% auto;
    }
    .widget > .ui-datepicker > .ui-datepicker-header > .ui-datepicker-prev,
    .widget > .ui-datepicker > .ui-datepicker-header > .ui-datepicker-next {
      display: block;
      position: absolute;
      top: 50%;
      left: -1.6em;
      width: 4.6em;
      height: 0;
      margin: -1.6em 0 0;
      padding: 2.6em 0 0;
      overflow: hidden;
      border-radius: 1.6em;
      border: 0.3em solid rgba(255, 255, 255, 0.75);
      background: rgba(255, 255, 255, 0.5);
      cursor: pointer;
    }
    .widget > .ui-datepicker > .ui-datepicker-header > .ui-datepicker-prev:hover,
    .widget > .ui-datepicker > .ui-datepicker-header > .ui-datepicker-next:hover {
      background: rgba(255, 255, 255, 0.75);
    }
    .widget > .ui-datepicker > .ui-datepicker-header > .ui-datepicker-next {
      left: auto;
      right: -1.6em;
    }
    .widget > .ui-datepicker > .ui-datepicker-header > .ui-datepicker-title {
      padding: 2em 0 0;
      text-align: center;
      text-shadow: 0 0 0.5em rgba(0, 0, 0, 0.5);
      color: #fff;
    }
    .widget
      > .ui-datepicker
      > .ui-datepicker-header
      > .ui-datepicker-title
      > .ui-datepicker-month {
      text-transform: uppercase;
      font-weight: 900;
      font-size: 3em;
    }
    .widget
      > .ui-datepicker
      > .ui-datepicker-header
      > .ui-datepicker-title
      > .ui-datepicker-year {
      display: block;
      font-weight: 600;
      font-size: 1.8em;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar {
      width: 100%;
      margin: 4em 0 0;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar th {
      text-transform: uppercase;
      font-size: 1.8em;
      color: #040f36;
      text-align: center;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td {
      width: 14.28%;
      font-weight: 300;
      font-size: 2.2em;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td:first-child {
      width: auto;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td a,
    .widget > .ui-datepicker > .ui-datepicker-calendar td span {
      position: relative;
      display: block;
      padding: 0.75em 0;
      text-decoration: none;
      text-align: center;
      color: inherit;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td span {
      color: #ddd;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td.ui-datepicker-today a,
    .widget > .ui-datepicker > .ui-datepicker-calendar td a.ui-state-active {
      color: #ccc;
    }
    .widget
      > .ui-datepicker
      > .ui-datepicker-calendar
      td.ui-datepicker-today
      a:before,
    .widget > .ui-datepicker > .ui-datepicker-calendar td a.ui-state-active:before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      width: 1.7em;
      height: 1.7em;
      margin: -0.9em 0 0 -0.9em;
      border: 0.1em solid #ddd;
      border-radius: 50%;
    }
    .widget
      > .ui-datepicker
      > .ui-datepicker-calendar
      td.ui-datepicker-today
      a:after,
    .widget > .ui-datepicker > .ui-datepicker-calendar td a.ui-state-active:after {
      content: "";
      position: absolute;
      top: 16.5%;
      right: 16.5%;
      width: 0.4em;
      height: 0.4em;
      background: #ddd;
      border-radius: 50%;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td a.ui-state-active {
      color: #86a2e5;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td a.ui-state-active:before {
      border-color: #6687d5;
    }
    .widget > .ui-datepicker > .ui-datepicker-calendar td a.ui-state-active:after {
      background: #052060;
    }