body {
  background-color: black;
}
/* Standard syntax */
input::placeholder {
  color: #939598; /* white */
  font-family: montserrat, sans-serif;
  font-weight: 300;
  font-style: italic;
}

/* For WebKit browsers (Chrome, Safari, Opera) */
input::-webkit-input-placeholder {
  color: #939598; /* white */
  font-family: montserrat, sans-serif;
  font-weight: 300;
  font-style: italic;
}

/* Firefox 19+ */
input::-moz-placeholder {
  color: #939598; /* white */
  font-family: montserrat, sans-serif;
  font-weight: 300;
  font-style: italic;
}

/* Firefox 4 - 18 */
input:-moz-placeholder {
  color: #939598; /* white */
  font-family: montserrat, sans-serif;
  font-weight: 300;
  font-style: italic;
}

/* Internet Explorer 10+ */
input:-ms-input-placeholder {
  color: #939598; /* white */
  font-family: montserrat, sans-serif;
  font-weight: 300;
  font-style: italic;
}

.navbar {
  position: relative;
  z-index: 998; /* Higher than most default content layers */
}

.card-container{
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

#template-btn, #tech-btn{
  border-radius: 0; 
  color:#a53b79; 
  border-color: #a53b79;
}

#template-btn:hover, #tech-btn:hover{
  background-color: #a53b79;
  color: white;
  border-color: #a53b79;
}

#slides-btn, #handbook-btn{
  border-radius: 0; 
  color:#ec5643; 
  border-color: #ec5643;
}

#slides-btn:hover, #handbook-btn:hover{
  background-color: #ec5643;
  color: white;
  border-color: #ec5643;
}



#benefits-btn{
  border-radius: 0; 
  color:#4570b5; 
  border-color: #4570b5;
}

#benefits-btn:hover{
  background-color: #4570b5;
  color: white;
  border-color: #4570b5;
}

#timeoff-btn{
  border-radius: 0; 
  color:#fb9334; 
  border-color: #fb9334;
}

#timeoff-btn:hover{
  background-color: #fb9334;
  color: white;
  border-color: #fb9334;
}

#access-btn{
  border-radius: 0; 
  color:#1b2946; 
  border-color: #1b2946;
}

#access-btn:hover{
  background-color: #1b2946;
  color: white;
  border-color: #1b2946;
}

.dropdown-menu {
  z-index: 998; /* Bootstrap default z-index for dropdowns */
  position: relative; /* Ensure proper positioning */
  border-radius: 0 !important;
}

.custom-align-right{
  margin-left: auto;

}
  
.dropdown-item:hover{
  background-color: #A53A79;
  color: white;
}

.has-photo{
  border: 2px solid white;
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer;
}


#image-preview{
  max-height:50vh;
  object-fit:contain;
  max-width:100%;
  display:none;
}

.cropper-line {
  background-color: #FB9334; /* Change to your desired color */
}
.cropper-view-box,
.cropper-face {
  border-color: #FB9334; /* Change to your desired color */
  border-width: 3px;
}

.card-img-top{
  border-radius: 0;
  border: none;
}

.card {
 display: flex;
  border-radius: 0;
  height:100%;
  box-sizing: border-box;
  border: 5px solid rgba(255, 255, 255, 1);
  cursor:pointer;
}

input[type="file"] {
  display: none;
}

.custom-file-upload{
  border: 2px solid #FB9334;
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer;
}

.file-input {
  background-color:black;
  border: none;
  color: white;
  padding-left:0 !important;
}

.file-input{
  background-color: white;
  color: black;
}

header {
  height: 100px;
}

p {
  font-size: 0.7rem;
  font-family: montserrat, sans-serif !important;
  font-weight: 400;
  margin-bottom: 0.1rem;
}

.grey-text{
  color: #939598;
}

.card-title {

  font-family: "futura-pt-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 1.3rem;
  letter-spacing: 0.1rem;
  text-transform: uppercase;
}


.btn{
  font-family: montserrat, sans-serif;
  font-weight: 600;
  font-style: normal;
}

h1{
  font-family: montserrat, sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1rem;
  letter-spacing: 0.05rem;
  color:#ffffff;
  margin-bottom: 0;
  line-height: 0;
}
h2{
  font-family: montserrat, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1rem;
  letter-spacing: 0.05rem;
  color:#ffffff;

}

.error-text{
  color: white !important;
}

.white-text{
  color: white !important;
}

.card-subtitle {
  font-family: montserrat, sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 0.7rem;
  letter-spacing: 0.05rem;
  
 
  text-transform: uppercase;
}

.bottom-padding{
  padding-bottom : 15px;
  padding-top:0;
}

.label-txt{
  font-size: 1rem;
  font-family: montserrat, sans-serif !important;
  font-weight: 500;
  text-transform: uppercase;
  color: #ffffff;
  padding-bottom:5px;
}

.form-control{
  border-radius: 0;
}



.scaled-image {
  transform: scale(3);
  transform-origin: top left;
  /* Adjust the origin as needed */
}

.white-text .error-text{
  color: white;
}

.black-text {
  color: black;
}

.gradient {
  position: relative;
  height: 15px;
  background: linear-gradient(to right, #234181, #4570B5, #FB9334, #EC564C, #A53A79);
  width: 100%;
}


.rsplogo {
  width: 15%;
  height: 15%;
}

header {
  font-family: montserrat, sans-serif !important;
  font-weight: 400;
  font-size: 14px;
  color: #ffffff;
}

.btn-primary {
  border-radius: 0;
  letter-spacing: 2px;
  font-family: montserrat, sans-serif !important;
  font-weight: 500;
  background-color:#FB9334;
  color: white;
  border: none;
}

.btn-secondary{
  border-radius: 0;
  letter-spacing: 2px;
  font-family: montserrat, sans-serif !important;
  font-weight: 500;
  background-color:#EC564C;
  color: white;
  border: none;

}

.btn-primary:hover,
.btn-secondary:hover {
  border: none;
  background-color: #A53A79;
  color: white;
}

.btn-deactivated{
  background-color: #939598;
}

.label-text{
  font-size: 0.9rem;
  letter-spacing: 5px;
  font-family: montserrat, sans-serif !important;
  font-weight: 300;
  margin-bottom: 0.3rem;
}

.custom-alert {
  display: none;
  position: fixed;
  margin: 20px auto;
  width: 500px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: black;
  color: white;
  padding: 20px;
  border: none;
  border-radius: 0px;
  z-index: 1000;
  font-size: 1.2rem;
  font-family: montserrat, sans-serif !important;
  font-weight: 400;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8); /* White with 0.8 opacity */
  z-index: 999; /* Ensure it is behind the custom alert */
}

.gradient-top {
  height: 5px;
  width: 100%;
  background: linear-gradient(to right, #234181, #4570B5, #FB9334, #EC564C, #A53A79); /* Adjust the gradient colors as needed */
  position: absolute;
  top: 0;
  left: 0;
}

.alert-content{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
}

.alert-buttons{
  display: flex;
  justify-content: space-between;
  width: 100;
  margin-top:10px;
}

.custom-alert-message{
  font-size: 1.2rem;
  font-family: montserrat, sans-serif !important;
  font-weight: 500;
  text-align:center;
  margin-bottom:10px;
}

.custom-alert-close {
  border-radius: 0;
  letter-spacing: 2px;
  font-family: montserrat, sans-serif !important;
  font-weight: 500;
  background-color:#FB9334;
  color: white;
  border: none;
  padding: 10px 20px;
  margin: 0 5px;
  cursor: pointer;
  align-self:flex-end;
 }

.custom-alert-close:hover {
  background-color: #234181;
}



p{
    font-family: montserrat, sans-serif !important;
  font-weight: 500;
  font-size: 1rem;
  letter-spacing: 0.1rem;
  
  color: white;
  padding-top: 25px;

}