.catBox{
    padding: 5px; 
    margin: 20px;
    border-radius: 10px;
    box-shadow: 5px 5px 5px 5px grey;
    text-align: center;
    height: 130px;
}

.catBox:hover{
    border-radius: 20px;
    box-shadow: 2px 2px 5px 2px grey;
    cursor: pointer;
    
}

.catBox span a{
    color:black;
    text-decoration: none;
    
}


.catBox span a:hover{
    color:grey;
}

.content{
    padding: 10px;
}
.constTitle{
    background-color: #210069;
    width: 90%;
    text-align: center;
    color: white;
    padding: 10px;
    border-radius: 0px 10px 0px 10px;
    box-shadow: 2px 2px 2px 2px #9b99d0;
    margin: 10px auto 10px auto;
    height: 50px;
    font-weight: bold;
    font-size: 20px;
}
.candImg{
    width: 200px;
    height: 200px;
    margin: auto;
    box-shadow: 5px 5px 5px 5px #57575787;
}

.pbarFirst{
    border-radius: 50px 0px 0px 50px;
    width: 30%;
    padding: 15px 15px 15px 15px;
    color: white;
    text-align: center;
    display: inline-grid;
}


.pbarSecond{
    border-radius: 0px 0px 0px 0px;
    width: 30%;
    padding: 15px 15px 15px 15px;
    color: white;
    text-align: center;
    display: inline-grid;
}

.pbarThird{
    border-radius: 0px 50px 50px 0px;
    width: 30%;
    padding: 15px 15px 15px 15px;
    color: white;
    text-align: center;
    display: inline-grid;
}

.active{
    background-color: #210069;
    box-shadow: 2px 2px 2px 2px #9b99d0;
    color: white;
    cursor:pointer;
    font-weight: bold;
}

.unvisited{
    background-color: #ddd;
    box-shadow: 2px 2px 2px 2px #c5c4d5;
    color: #ddd;
}

.pbar{
    text-align: center;
    display: flex;
}

.pbar a{
    color:white;
}

.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.popup {
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}