/* Header */
.topnav {    
  overflow: hidden;
  font-size: 20px;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: right;
  display: block;
  color:white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 16px;
}

/* Change the color of links on hover */
.topnav a:hover {
  background-color:#30ccb9;
  text-decoration: none;
  color: white;
  }

/* Add an active class to highlight the current page */
.topnav a.active {
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}

#skills .card-text-about li {
color:#414141;
text-align: left;
}

#my-work .container-fluid .section-heading .button {
  text-align: center;
}

.my-work .container-fluid .section-heading {
  color: white;
  text-align: center;
  padding: 20px;
  }

.container-fluid-content {
      height: 100%;
      padding: 20px;
    }

.container-fluid {
  align-items: center;
  text-align: center; 
  padding: 30px;
  height: 100%;
  }

/* Cards */
.card-container {
  width: 100px;
}

.card-container .card {
  transition: all .3s ease-in-out;
  margin: 20px;
  border-radius: 20px;
  border: none; 
  padding: 10px;
}  

/* Card states */
.card:hover {
  transform: scale(1.1); 
  text-decoration: none;
  }

.card-container .card-graphics {
  transition: all .3s ease-in-out;
  margin: 10px;
  border: none; 
  padding: 0px;
  }

.card-graphics:hover {
  transform: scale(1.1); 
  text-decoration: none;
  color: white;  
  }

.card-graphics:active {
  text-decoration: none;
  color: white;
}
/* End button states */

.card-container .card-case-study {
  transition: all .3s ease-in-out;
  margin: 10px;
  align-items: center;
  border-radius: 20px;
  border: none; 
  padding: 8px;
  }

  .card-case-study:hover {
    transform: scale(1.1); 
    text-decoration: none;
    }

  .card-text {
    color: #414141;
    font-weight: normal;
    font-size: 24px;
    text-align: left;
    }
    
.card-title {
  color: #414141;
  font-size: 36px;
  font-weight: normal;
  padding: 2px; 
  text-align: center; 
}

.card-container .card-text {
font-size: 20px;
text-align: left;
letter-spacing: normal;
}

.card-container .card .card-img-top {
  size: 50%;
  }