* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  /* background-image: url("../img/keysight-world-bg.png"); */
  background-size: cover; /* Optional: Adjusts the size of the image to cover the entire body */
  /* You can use other background properties to adjust the image display, like position, repeat, etc. */
}

.get-emails {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.body-int {
  position: absolute;
  width: 100%;
  background-color: rgb(255 255 254 / 80%);
  height: 100vh;
}

label {
  /* color: white; */
  /* text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8); */
  /* background: #000000d7; */
  /* border-radius: 10px; */
  /* padding: 3px 15px; */
}

/* input,
select {
  background: #000000d7 !important;
  color: white !important;
  border-color: white !important;
} */

/* input::placeholder {
  color: white !important;
} */

/* Define your custom button class */
/* Reset button styles to avoid browser-specific styles */
button {
  border: none;
  outline: none;
  cursor: pointer;
  padding: 10px 40px;
  font-size: 16px;
  border-radius: 5px;
}

/* Custom styles for the button to resemble Bootstrap */
.btn-custom {
  background-color: #e80028; /* Bootstrap's primary button color */
  color: #ffffff;
  border-radius: 10px;
}

/* Styles for hover and active states to add visual feedback */
.btn-custom:hover {
  background-color: #ff2348; /* Slightly darker shade for hover */
}

.btn-custom:active {
  background-color: #e80028; /* Even darker shade for active */
}

html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

header {
  padding: 2vh 2vw;
  margin-top: 2vh;
}

header img {
  float: right;
}

.form-center {
  display: grid;
  justify-content: right;
}

.form-right-section .form-center {
  display: grid;
  justify-content: left;
}

.form-center select {
  border: 1px solid #000;
  border-radius: 10px;
  width: 25vw;
}

.form-center input {
  border: 1px solid #000;
  border-radius: 10px;
  width: 25vw;
}

.footer-ribbon,
footer img {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  right: 0;
  height: 6.165vh;
  background: #131a22;
}

.footer-section img {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 6.165vh;
}

footer img {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  bottom: -10vh;
  height: 4.69vh;
}

.side-container .form-center {
  /* display: grid;
  justify-content: center; */
  /* position: absolute;
    top: 300px;
    left: 50%;
    transform: translateX(-50%); */
}

@media print {
  body {
    visibility: hidden;
  }

  #section-to-print {
    visibility: visible;
    position: absolute;
    left: 0;
    top: 0;
    transform: scale(2.5) translate(10px, 100px);
  }
}

.header-logo {
  width: 15vw;
  border-radius: 10px;
}

/* Hide the up and down arrows */
input[type="number"] {
  /* For Firefox */
  appearance: textfield;
  -moz-appearance: textfield;
}
@media (max-width: 768px){
  .header-logo {
    width: 50vw !important;
    border-radius: 10px !important;
}
 
.emailDiv > label {
width : -webkit-fill-available;;
 
}
.emailDiv > input {
  width : -webkit-fill-available;
}
.mb-3 > input {
  width : -webkit-fill-available;
}
.mb-3 > label {
  width : -webkit-fill-available;
}
#category{
  width : -webkit-fill-available;
}
.form-center {
  display: grid;
  justify-content: center;
}
}
.st0 {
  fill: #ff0000; /* Red color */
}

/* Apply color to specific SVG paths */
#Layer_1 path {
  fill: #00ff00; /* Green color */
}