@font-face { 
    font-family: "Regular";
    src: url("fuentes/Regular.woff") format("woff"), url("fuentes/Regular.woff2") format("woff2");
    font-weight: normal;
    style: normal;
    font-display: swap;
  }

  @font-face { 
    font-family: "Bold";
    src: url("fuentes/Bold.woff") format("woff"), url("fuentes/Bold.woff2") format("woff2");
    font-weight: 400;
    style: normal;
    font-display: swap;
  }

body {
    font-family: "Regular";
    text-align:center;
    color:white;

  }

  p{
    margin:0px;
    padding:0px;
  }

a.boton_primario{
    display:block;
    background-color: #0079BB; 
    color: white;
    font-size:18px;
    width:152px;
    text-align:center;
    border-radius: 4px;
    padding:11px 16px 12px 16px;
}
a.boton_primario:hover{

    background-color: #008EDD; 
}

@media only screen and (min-width: 1024px) {
  #container_test{
      margin:auto;
      display:flex;

      max-width:1560px;
      height:488px;
      border-radius: 16px;
      background-image: url('images/background_01.jpg');
      background-repeat: no-repeat;
  
      background-position: center top;
      background-size:1560px;
  }

  #container_reloj{

  display:block;

      width:55%;

      padding-top:64px;
      margin:12px;
  }
  #container_mediciones{

      display:flex;
      
          width:448px;
        
          padding:16px 16px 16x 0;
          padding-top:48px;
          margin:12px;
          align-content: flex-start;
          flex-wrap: wrap;
          }
      
    #medicion{
      display:block;
      text-align:left;
      margin:12px;
      border:1px solid white;
      border-radius: 16px;
      background-color: rgba(255, 255, 255, 0.3);
      padding:16px;
      height:112px;
      width:152px;
      
    }

    .tipomedicion{
      font-size:20px;
      margin-bottom:16px;
      
    }
    .tipomedicion img{
      vertical-align:middle;
      margin-right:4px;
    }
    .numero{
      font-family: "Bold";
      font-size:28px;
      margin-bottom:4px;
    }
    .decimales{
      font-size:20px
    }
    .unidades{
      font-size:16px;
    }
  }

  @media only screen and (min-width: 768px) and (max-width: 1023px){
    #container_test{
        margin:auto;
        
  
        
        height:560px;
        border-radius: 16px;
		/*
        background-image: url('images/background_01.jpg');
		*/
        background-repeat: no-repeat;
    
        background-position: center top;
        background-size:cover;
        
        
    }
  
    #container_reloj{
  
        display:block;
        height:320px;
        width:98%;
        padding-top:24px;
        margin:12px;
    }
    #container_mediciones{
  
        display:flex;
        width:100%;
        padding:0px;

        margin-top:24px;
        align-content: flex-start;
        flex-wrap: wrap;
        justify-content: center;
        }
        
      #medicion{
        display:block;
        text-align:left;
        margin:8px;
        border:1px solid white;
        border-radius: 16px;
        background-color: rgba(255, 255, 255, 0.3);
        padding:16px;
        height:112px;
        width:136px;
        
      }
  
      .tipomedicion{
        font-size:20px;
        margin-bottom:16px;
        
      }
      .tipomedicion img{
        vertical-align:middle;
        margin-right:4px;
      }
      .numero{
        font-family: "Bold";
        font-size:28px;
        margin-bottom:4px;
      }
      .decimales{
        font-size:20px
      }
      .unidades{
        font-size:16px;
      }
    }

    @media only screen and (max-width: 767px){
      #container_test{
          margin:auto;
          
    
          
          height:680px;
          border-radius: 16px;
          background-image: url('images/background_01.jpg');
          background-repeat: no-repeat;
      
          background-position: center top;
          background-size:cover;
          
          
      }
    
      #container_reloj{
    
          display:block;
          height:320px;
          width:98%;
          padding-top:24px;
          margin:12px;
      }
      #container_mediciones{
    
          display:flex;
          width:360px;
          padding:0px;
  
          margin:auto;
          align-content: flex-start;
          flex-wrap: wrap;
          justify-content: center;
          }
          
        #medicion{
          display:block;
          text-align:left;
          margin:4px;
          border:1px solid white;
          border-radius: 16px;
          background-color: rgba(255, 255, 255, 0.3);
          padding:16px;
          height:112px;
          width:128px;
          
        }
    
        .tipomedicion{
          font-size:18px;
          margin-bottom:16px;
          
        }
        .tipomedicion img{
          vertical-align:middle;
          margin-right:4px;
        }
        .numero{
          font-family: "Bold";
          font-size:24px;
          margin-bottom:4px;
        }
        .decimales{
          font-size:18px
        }
        .unidades{
          font-size:16px;
        }
      }

      #medicion.terminada{
        background-color: rgba(255, 255, 255, 0.8);
        color:#0B2739;
      }