@tailwind base;
@tailwind components;
@tailwind utilities;


@layer base {
  h1{
    @apply font-bold text-4xl my-2.5
  }
  h2{
    @apply font-bold text-3xl my-3

  }
  h3{
    @apply font-bold text-lg my-3.5

  }
  h4{
    @apply font-bold my-4

  }
  h5{
    @apply font-bold text-sm

  }
  h6{
    @apply font-bold text-xs 

  }

  p{
    @apply  text-base 
  }


  span{
    @apply  text-base

  }
  };
  
  /* @layer components {
    .btn-blue {
      @apply bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded;
    }
    .btn1 {
      @apply py-2 px-4 bg-blue-500 text-white font-semibold rounded-lg shadow-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-400 focus:ring-opacity-75;
    }

    .input1{
      @apply w-full h-10 rounded-xl border border-black px-3
    }


    .navtext{
        @apply uppercase text-lg py-2 justify-end  hover:text-c10  border-b-4 mr-6 text-c10 hover:border-c10 tracking-wider
    }

    .table1{

    }
    .th1{

    }

    .tr1{

    }
    .cell1{

    } 

    
  }*/

  
  @layer utilities {
    .filter-none {
      filter: none;
    }
    .filter-grayscale {
      filter: grayscale(100%);
    }
    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    input[type=number] {
      -moz-appearance: textfield;
    }
  }