/*////////////////////////////*/
/*/////// Landing Page ///////*/
/*////////////////////////////*/
body{
 background-image: url("ios-linen.jpg");
 background-color: #6a6a6a;
}

a{
    color: black
}

img {
    object-fit: contain;
    height: auto;
    width: 100%;
    max-width: 15rem;
    object-fit: cover;
}

/*////////////////////////////*/
/*////////// cards ///////////*/
/*////////////////////////////*/
/* .card-img-top {
    width: 100%;
    height: 15vw;
    object-fit: cover;
} */

.card{
    background-color: rgb(133, 133, 160);
    margin-top: 2rem;
    height: 20rem;
}

div.row{
    padding: 3% 10% 1% 10%;
    margin: auto;
}
/*////////////////////////////*/
/*//////// Jumbotron /////////*/
/*////////////////////////////*/
.jumbotron{
    background-image: url("jumbotron_img.jpg");
    background-size:cover;
    background-repeat: no-repeat;
    background-color: rgb(124, 115, 104);
    padding-top: 1rem;
    padding-bottom: 1rem;

    color:#ff2;
    text-shadow:
    -1px -1px 0px #56765f,
     0px -1px 0px #56765f,
     1px -1px 0px #56765f,
    -1px  0px 0px #56765f,
     1px  0px 0px #56765f,
    -1px  1px 0px #56765f,
     0px  1px 0px #56765f,
     1px  1px 0px #56765f;
    margin: auto;
    text-align: center;
    border-radius: 0rem 0rem .3rem .3rem;
}
.main_img{
    width: 30%;
    height: 100%;
    object-fit: contain;
}

.jumbotron p{
    font-size: 1.5rem;
    color: #1f1;
    /* second layer at 2px*/
    text-shadow:
        -2px -2px 0px #2b3b30,
        -1px -2px 0px #2b3b30,
         0px -2px 0px #2b3b30,
         1px -2px 0px #2b3b30,
         2px -2px 0px #2b3b30,
         2px -1px 0px #2b3b30,
         2px  0px 0px #2b3b30,
         2px  1px 0px #2b3b30,
         2px  2px 0px #2b3b30,
         1px  2px 0px #2b3b30,
         0px  2px 0px #2b3b30,
        -1px  2px 0px #2b3b30,
        -2px  2px 0px #2b3b30,
        -2px  1px 0px #2b3b30,
        -2px  0px 0px #2b3b30,
        -2px -1px 0px #2b3b30;
        margin: 0rem;
}

#collection-brand{
    font-family: 'Playfair Display', serif;
}

#secretButton {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 10px;
    height: 10px;
    background-color: transparent;
    opacity: 0;  /* invisible */
    border: none;
    cursor: pointer;
    pointer-events: auto; /* Ensures clickable*/
}
#logoutButton {
    background-color: green;
    color: #ff2;
    text-shadow:
        -1px -1px 0px #56765f,
        0px -1px 0px #56765f,
        1px -1px 0px #56765f,
        -1px 0px 0px #56765f,
        1px 0px 0px #56765f,
        -1px 1px 0px #56765f,
        0px 1px 0px #56765f,
        1px 1px 0px #56765f;
    text-align: center;
    border-radius: 0rem 0rem .3rem .3rem;
    border: none;
    cursor: pointer;
    pointer-events: auto;
    margin-top: .5rem;
    /* Ensures clickable*/
}