@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

body {
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  font-weight: 400;
}

.custom-btn-fill{
    background: linear-gradient(to bottom, #FDFFE9, #CBE270);
    border-color: #D9FF00;
    transition: all 0.3s ease;
    border: 2px solid #D9FF00;
    padding: 5px 10px;
}

.custom-btn-fill:hover{
  filter: brightness(1.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transform: scale(1.05);
}


/* custom container  */
.custom-container {
    margin:0 auto;
    width: 90%;
}

@media (min-width: 640px) {
  .custom-container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {
  .custom-container {
    max-width: 768px;
  }
  .custom-btn-fill{
    padding: 6px 14px;
  }
}

@media (min-width: 1024px) {
  .custom-container {
    max-width: 1024px;
  }
}

@media (min-width: 1280px) {
  .custom-container {
    width: 1200px;
    max-width: 1280px;
  }
   .custom-btn-fill{
   padding: 8px 20px;
  }
}

@media (min-width: 1536px) {
  .custom-container {
    width: 1200px;
    max-width: 1536px;
  }
}