/*****************************************************
my website styles

 *****************************************************/


  .custom-navbar-item {
    font-size: 2rem;
    position: relative;
    top: -3px;

  }
  .navbar-item.no-hover-bg:hover {
    background-color: #1f222a !important; /* same as navbar bg */

}

/****************************************************
 page color background style
 ****************************************************/

.but-is-rose {
    background-color:#B80454 !important;
    border-color:#B80454 !important;
    color:#DCBCD0 !important;
}

.but-is-rose:hover {
    background-color:#fe0179 !important;

}

.has-text-rose,
.has-text-rose:visited,
.has-text-rose:hover,
.has-text-rose:active,
.has-text-rose:focus {
    color: #B80454 !important;
    text-decoration: none !important;
}

.text-is-rose {
    color:#DCBCD0 !important;
}

.anchor-is-rose {
    color:#DCBCD0 !important;
}
.anchor-is-rose:hover {
    color:#fe0179 !important;
}

.rose-red {
   color:#B80454 !important;
}

.has-background-my-black {
    background-color:#1D190A;
    }

.has-background-rose {
background-color:#DCBCD0;
}

.has-no-border {
  border: none !important;
  background: none;
}

/****************************************************
album picture showing
 ****************************************************/

.card-equal-height {
     display: flex;
     flex-direction: column;
     height: 100%;
  }

.underline {
  text-decoration: underline;
  text-decoration-color: white;
  text-decoration-thickness: 2px;
}

.no_radius {
  --bulma-card-radius: 0rem;
}


.has-text-rotated {
  top: 5%;
  position: absolute;
  writing-mode: vertical-lr;
  transform: scale(-1, -1);
}

.transparent {
  background-color: transparent;

}

.cover-image {
    max-height: 400px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.cover-image img {
    transition: transform 1s, filter 2s ease-in-out;
    -webkit-transition: transform 1s, filter 2s ease-in-out;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

.card:hover .cover-image img {
    cursor: pointer;
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
}

.is-overflow-hidden {
    overflow: hidden !important;
}

.blur {
   filter: blur(7px);
}

/****************************************************
 album display
****************************************************/


.card-equal-height {
     display: flex;
     flex-direction: column;
     height: 100%;
  }

.underline {
  text-decoration: underline;
  text-decoration-color: white;
  text-decoration-thickness: 2px;
}

.no_radius {
  --bulma-card-radius: 0rem;
}

.has-text-rotated {
  top: 5%;
  position: absolute;
  writing-mode: vertical-lr;
  transform: scale(-1, -1);
}

.transparent {
  background-color: transparent;

}

.cover-image {
    max-height: 400px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.cover-image img {
    transition: transform 1s, filter 2s ease-in-out;
    -webkit-transition: transform 1s, filter 2s ease-in-out;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

.card:hover .cover-image img {
    cursor: pointer;
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
}

.is-overflow-hidden {
    overflow: hidden !important;
}

/****************************************************
 Card Footer No white line
****************************************************/
.no-top-border {
  border-top: none !important;
}

/****************************************************
 Image 300px
****************************************************/

.img300px {
    width:100%;
    max-width:300px;
}


.img400px {
    width:100%;
    max-width:400px;
}

/****************************************************
 For form honeypot (to catch bots
****************************************************/

.the_check {
  position: absolute;
  left: -9999px;
  top: -9999px;
  visibility: hidden;
}

/****************************************************
 For the message and heart in the creator's profiles
****************************************************/

.has-no-border {
    border: none !important;
    background: none !important;
}

.footer-item-vertical {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0.75rem;
}

.footer-item-vertical i {
    margin-bottom: 0.5rem; /* space between icon and label */
}