body {
   //* background-color: #0000f !important;*//
    color: black;
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(123,0,255,0.644782913165266) 33%, rgba(23,121,9,0.5635504201680672) 72%);
  }

.nav-item {
    color: white;
    font-weight: 400;
    font-size: 20px !important;
}

.nav-item:hover {
    font-weight: 500;
    font-size: 20px !important;
}


.navbar-brand {
   font-size: 24px !important;
}

.form_black {
   background-color: white !important;
   border-radius: 8px;
   padding: 20px;
   margin-top: 40px;
}

.page_border {
   background-color: #d1d1d1 !important;
   color: white !important;
   border: 2px solid #45464F;
   border-radius: 10px;
   padding: 20px !important;
   margin: 0 auto;
   margin-top: 30px;
}

.menu_item {
   padding: 5px !important;
   font-size: 17px !important;
}
hr {
   background-color: #2f26ab;
   color: #FB4229;
}
.reposts {
    color: #d9dcff !important;
    font-size: 12px !important;
    text-align: right;
}

.btn-warning {
    background-color: #2f26ab !important;
    border: 2px #FB4229 !important;
}

.comments {
   font-size: 13px !important;
}

.com_label {
   background-color: #121d2f !important;
   color: white !important;
   border: 2px solid #121d2f;
   width: 42%;
   border-radius: 10px;
}

.comment-meta {
   display: flex;
   align-items: center;
   gap: 8px;
   font-size: 11px;
   margin: 2px 0;
}

.comment-avatar {
   width: 20px;
   height: 20px;
   border-radius: 50%;
   object-fit: cover;
}
.round_avatar {
    margin-left:10px;
    margin-right:10px;
    width: 30px !important;
    height: 30px !important;
    border-radius: 50px !important;
   }

.round_office {
    margin-left:10px;
    margin-right:10px;
    width: 210px !important;
    height: 210px !important;
    border-radius: 210px !important;
}

.round {
    margin-left:15px;
    margin-right:15px;
    width:125px;
    height: 125px;
    border-radius: 125px !important;
    box-shadow: 0 0 7px black;
   }

.vertical-menu {
    width: 300px;
    height: 350px;
}

.vertical-menu li {
    background-color: #0000;
    color: white;
    display: white;
    text-decoration: none;
}

.vertical-menu li:hover {
    background-color: #fff;
}

.circle_habits {
    background-color: #2f26ab !important;
    color: white !important;
    border: 2px solid #CF9B8F;
    border-radius: 10px;
    padding: 20px !important;
    margin: 0 auto;
    margin-top: 30px;
}

.row2 {
    text-align: center;
}
.col-md-4 {
    display: inline-block;
}
.home-gallery {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    margin-top: 20px;
    margin-bottom: 14px;
}

.home-card {
    position: relative;
    display: block;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
    background: rgba(255, 255, 255, 0.08);
}

.home-gallery .home-card {
    width: 360px;
    max-width: 32vw;
}

.home-card img {
    display: block;
    width: 100%;
    height: 250px;
    object-fit: contain;
    padding: 10px;
    transition: transform 0.25s ease, filter 0.25s ease;
}

.home-card:hover img {
    filter: brightness(0.82);
    transform: scale(1.02);
}

@media (max-width: 1100px) {
    .home-gallery {
        flex-wrap: wrap;
    }
    .home-gallery .home-card {
        width: 300px;
        max-width: 92vw;
    }
}

.page_border {
    color: black;
}
.holiday {
    background-color: rgba(0, 0, 0, 0.5);
	font-size: 35px;
	color: #FFFFFF;
    border-radius: 10px;
    box-shadow: inset 0px 5px 10px 0px rgba(0, 0, 0, 0.5), -8px 0 0
}
.multicolor-text {
            text-align: center;
            font-size: 80px;
            background: linear-gradient(to left,
                    violet,
                    indigo,
                    blue,
                    green,
                    yellow,
                    orange,
                    red);
            -webkit-background-clip: text;
            color: transparent;
}
.mem {
float: right;
}

.motivation{
      font-size: 3.2rem;
      text-align: center;
      min-height: 60vh;
      line-height: 1.45;
      color: #f8f6ff;
      font-family: 'Trebuchet MS', Arial, sans-serif;
      font-weight: 700;
      letter-spacing: 0.5px;
      text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.mems img{
  width: 500px;
  height: 500px
  background: #fff;
  border-radius: 20px;
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
  margin: 15px;
}