@import "https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css";
@import url('https://fonts.googleapis.com/css2?family=Overpass:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Overpass:wght@500;700&display=swap');

.navbar-item img {
    max-height: 4rem;
    padding-left: 0%;
}

.navbar-item {
  color: WHITE;
}

.container {
    padding: 0;
}

.navbar{
  background-color: #3a00ad;
  padding-top: 2em;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
    padding-left: 5%;
    padding-right: 5%;
    background-color: #3a00ad;
    min-height: 400vh;

  }

.body, .navbar-item  {
    font-family: 'Overpass', sans-serif;
    font-weight: 100;
}

.navbar-item {
margin-top: auto;
}
.name-us {
    font-family: 'Overpass', sans-serif;
}

.card {
    /* Default styles for all cards */
    opacity: 80%;
  }

  .purple {
    /* Styles for blue cards */
    background-color: rgba(109, 68, 195, 0.8);
  }

  .blue {
    /* Styles for blue cards */
    background-color: rgba(54, 121, 252, 0.8);
  }
  
  .red {
    /* Styles for red cards */
    background-color:  rgba(208, 212, 11, 0.8);
  }
  
  .orange {
    /* Styles for orange cards */
    background-color:  rgba(225,128,58, 1);
  }

  .yellow{
    /* Styles for orange cards */
    background-color: rgba(255, 251, 43, 0.8);
  }

  .pink {
    /* Styles for orange cards */
    background-color: rgba(186,51,208, 1);
  }

  .black {
    /* Styles for orange cards */
    background-color: rgb(0, 0, 0);
  }

  

  
.card-content {
padding: 0;
height: 0; /* Set a fixed height for the card content */
padding-bottom: 100%; /* Set the height to be the same as the width */
color: white;
font-family: 'Roboto', sans-serif;

align-items: center;
justify-content: center;
padding-left: 5%;
padding-right: 5%;
}

.content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-family: 'Overpass', sans-serif;
font-weight: 500;
font-size: 13.67;
}



.combo .card-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.combo .card-image {
  overflow: hidden;
}


.combo .card-image img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  align-items: center;
  object-position: center;

  
}


.about-me {
  background-color: black; /* Change this to your desired background color */
  color: white; /* Change this to your desired text color */
  padding: 20px; /* Optional: Add some padding for better readability */
  border-radius: 8px; /* Optional: Add rounded corners */
}