@import url("/assets/fonts/Poppins/poppins.css");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap');
:root {
  --color-primary-dark: #181818;
}
body {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
}
header {
  background-color: var(--color-primary-dark);
  border-bottom: 1px solid #ffffff26;
  color: white;
  padding: 14px;
}
header .navbar-brand,
header .navbar-nav .nav-link.active,
header .navbar-nav .nav-link {
  color: #fff;
}
header .navbar-brand:hover,
header .navbar-nav .nav-link.active:hover,
header .navbar-nav .nav-link:hover {
  color: #ffffffd3;
}

#mail-create {
  z-index: 0;
  background-color: var(--color-primary-dark);
  padding: 50px 50px 150px 50px;
}
#mail-create .caption .title {
  color: #fff;
  font-size: 40px;
  font-weight: 400;
  margin-bottom: 2.5px;
}
#mail-create .caption .desc {
  color: #fff;
  font-size: 15px;
  font-weight: 300;
  margin-bottom: 30px;
}
#mail-create .mail {
  background-color: #fff;
  padding: 12px 15px;
  border-radius: 8px;
  overflow: auto;
  height:48px;
}
#mail-create .mail-icon {
  background-color: #fff;
  color: #000;
  padding: 12px 0px;
  text-align: center;
  border-radius: 8px;
  text-decoration: none;
  font-size: 15px;
}
#mail-create a.mail-icon i {
  font-size: 16px;
}
#mail-create a.mail-icon:hover {
  background-color: #ffffffe7;
}

#mail-box {
  margin-top: -110px;
}
#mail-box > .wrapper {
  overflow: auto;
  min-height: 500px;
  max-height: 500px;
  background-color: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

#copyright {
  background-color: var(--color-primary-dark);
  z-index: 5;
  bottom: 0;
  padding: 40px;
  color: #fff;
  font-size: 14.5px;
  text-align: center;
  letter-spacing: 0.3px;
}

@media screen and (max-width: 992px) {
  #mail-box {
    position: relative;
    margin: 50px 0px 50px 0px;
  }
  #mail-create {
    padding: 35px 25px 40px 25px;
  }
  #mail-create a.mail-icon i {
    font-size: 14px;
  }
  footer {
    position: relative;
  }
}

.modern-title {
  font-family: 'Poppins', sans-serif !important; 
  font-size: 2rem;
  font-weight: 600;
  letter-spacing: 1px;
  background: linear-gradient(45deg, #00c6ff, #0072ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}