/* ./src/index.css */
@tailwind base;
@tailwind components;
@tailwind utilities;
/*  */
body {
    background: linear-gradient(90deg,#75DBFF 0% , #2AC5FC 28%, #25C4FC 67%, #57D3FF 80%, #75DBFF 100%);
}
input.inp {
    @apply outline-none focus-within:outline-none focus:outline-none
     active:shadow-none focus:shadow-none focus-visible:outline-none
     border-solid border-2 border-blue-300 
     bg-black
    p-2 ;
    background-color: rgba(0, 0, 255, 0.082);
    padding: 0.5rem;
    padding-top: 1.25rem;
}
.inp-container>label {
    top: 0;
    left: 0;
    margin: 0.25rem;
    position: absolute;
    font-weight: bold;
    font-size: 0.75rem;

}
.inp-container {
    height: fit-content; 
    width: fit-content;
    position: relative;

}
@media (max-width: 768px)  {
    input.inp {
        
        width: 8rem !important;
    }
  }
  
@media (max-width: 300px)  {
    input.inp {
        
        width: 6rem !important;
    }
  }
  
input.inp:focus-visible {outline: none;}