/*Palette link https://www.materialpalette.com/deep-purple/purple */
@import url('https://fonts.googleapis.com/css2?family=Gajraj+One&display=swap');
.gajraj-one-regular {
    font-family: "Gajraj One", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #E040FB;
    font-size: 100px;
}
.gajraj-one-regular h3 {
    color: #512DA8;
    font-size: 30px;
}
.sitelogo {
    width: 100px;
    filter: hue-rotate(-10deg) saturate(75%) brightness(100%);
}
html {
    font-size: 14px;
    background-color: #512DA8;
    background-attachment: fixed;
    background-image: url(../siteimgs/spacebackground.jpg); /*image from https://unblast.com/10-free-space-background-images-jpg/ */
    color: #D1C4E9;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
    color: #D1C4E9;
}
p {
    color: #D1C4E9;
}
body {
    margin-bottom: 60px;
    background-color: #512DA8;
    background-attachment: fixed;
    background-image: url(../siteimgs/spacebackground.jpg); /*image from https://unblast.com/10-free-space-background-images-jpg/ */
    color: #D1C4E9;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}
.hiddenp {
    opacity: 0;
    display: grid;
    place-items: center;
    padding: 2rem 1.2rem;
    position: absolute;
    font-family: Impact;
    font-size: 30px;
    color: #512DA8;
    inset: 0;
    background: #D1C4E9;
    background: radial-gradient(circle, rgba(209, 196, 233, 1) 0%, rgba(217, 127, 242, 1) 49%, rgba(224, 64, 251, 1) 93%);
    border-radius: 100px;
}
.homebg:hover .hiddenp {
    opacity: 1;
}
.homebg {
    position: relative;
    width: 30%;
    height: 300px;
    display: grid;
    place-items: center;
    border-radius: 100px;
    /*courtesy of https://cssgradient.io/ */
    background: #D1C4E9;
    background: radial-gradient(circle, rgba(209, 196, 233, 1) 0%, rgba(217, 127, 242, 1) 49%, rgba(224, 64, 251, 1) 93%);
}
.navbar-dark {
    background-color: #212121;
}
footer {
    background-color: #212121;
}
.sitemessage {
    font-family: Arial;
    font-weight: bold;
    font-size: 30px;
    color: #D1C4E9;
}
a:hover, .nav-link:hover {
    color: #E040FB;
}
.nav-link:hover {
    text-shadow: 1px 1px 10px #E040FB;
}
a{
    color: plum;
}
.editbtn, .deletebtn, .viewbtn {
    margin: 1px;
    padding: 5px;
    text-decoration: none;
    color: white;
    background-color: #512DA8;
    border-radius: 5px;
}
.editbtn:hover, .deletebtn:hover, .additem:hover, .editsavebtn:hover {
    color: white;
    background-color: #c771fc;
}
.editbtn:hover{
    background-color: #5e35c6;
}
.deletebtn:hover{
    background-color: #BA2B00;
}
.deletebtn {
    background-color: darkred;
}
.tableh1 {
    padding-top: 1rem;
    margin-bottom: 1rem;
    color: #D1C4E9;
    text-transform: uppercase;
    font-weight: bold;
    font-family: Arial;
    font-size: 60px;
}
.additem {
    margin: 1rem auto;
    padding: .5rem;
    text-decoration: none;
    color: white;
    background-color: #E040FB;
    border-radius: 5px;
    font-size: 30px;
    text-transform: uppercase;
    font-weight: bold;
}
.editsavebtn {
    margin: 1rem auto;
    padding: .5rem;
    text-decoration: none;
    border: none;
    color: white;
    background-color: #E040FB;
    border-radius: 5px;
    font-weight: bold;
}
.tableimg{
    width: 80px;
}
.backbutton {
    margin: 1rem auto;
    padding: .5rem;
    text-decoration: none;
    border: none;
    color: white;
    background-color: #014B96;
    border-radius: 5px;
    font-weight: bold;
}
.backbutton:hover {
    color: white;
    background-color: #44005D;
}
.viewbtn {
    background-color: #014B96;
}
.viewbtn:hover, .backbutton:hover {
    background-color: #0163c4;
    color: white;
}