.card-link a:link{
    color:#FFF;
}
.card-link a:visited{
    color:#FFF;
}
.card-link a:hover{
    color:#FFF;
}

nav a:hover{
    color:red;
}
 /* Tooltip */
  .test + .tooltip > .tooltip-inner {
    background-color: #FFF;
    opacity:0.7;
    color: #662200; 
    border: 1px solid #CCC; 
    padding: 15px;
    font-size: 20px;
  }
.head-banner{
    margin:0;
    padding-top:50%;
    text-shadow:2px 2px 2px #000;
    font-size:2em;
    font-family:Arial Black;
}
p{
     text-justify: inter-word;
     text-align:justify;
}
.f-img{
    border-radius:50%;
    height:90px;
}
.f-img2{
    height:90px;
}@media screen and (max-width: 300px) {
  .f-img{
      height:100%;
    float:left;
  }
  
}
#iccem_imp{
    border-radius:0;
    height:100px;
}

.macho-man{
    
    background-color:#AAA;
    font-family:Open Sans, Century Gothic;
}
#header{
    background-color: #006400;    position: relative;
    text-align: center;
    color: #ffffff;
    text-justify: inter-word;
    
}
#header img{
    border-radius: 50px;
}
.login-link{
    position: absolute;
    bottom: 2px;
    right:2px;

}

.box{ 
    color: #FFF;
    float: left;
    min-height: 100px;
    padding: 10px;
    /* margin: 2px; */
    /* padding: 2px; */
}
.box:hover{ 
    background-color: rgb(80, 77, 72);
}
.box a:link,.box a:visited{
    color:rgb(14, 13, 13);
}
.box a:hover{
    color: #660;
}
.news-list:hover{
    background-color: rgba(255, 235, 205, 0.438);
}
footer a:link,footer a:hover,footer a:visited{
    color:#FFF;
}
.news-list a:link, .news-list a:visited{
    color:#006600;
    font-family:Verdana, 'Roboto', Sans Serif;
}
.wrapper{
    box-shadow:5px 5px 10px #000;
}

footer{
    color: #006400;
    background-color: #006400;
    font-family:serif;
}
footer img{
    border-radius:0;
}

.news-list img:hover, nav a:hover, .upcoming-events:hover {
    animation: shake 0.6s;
    animation-iteration-count:initial;
  }
  nav a:link{
      color: black;
      font-family:serif;
  }
  nav a:visited{
      color: black;
      font-family:serif;
  }
  nav a:hover{
      color: #dd0f0f;
      font-family:serif;
  }
  
  /*@keyframes shake {*/
  /*  0% { transform: translate(1px, 1px) rotate(0deg); }*/
  /*  10% { transform: translate(-1px, -2px) rotate(-1deg); }*/
  /*  20% { transform: translate(-3px, 0px) rotate(1deg); }*/
  /*  30% { transform: translate(3px, 2px) rotate(0deg); }*/
  /*  40% { transform: translate(1px, -1px) rotate(1deg); }*/
  /*  50% { transform: translate(-1px, 2px) rotate(-1deg); }*/
  /*  60% { transform: translate(-3px, 1px) rotate(0deg); }*/
  /*  70% { transform: translate(3px, 1px) rotate(-1deg); }*/
  /*  80% { transform: translate(-1px, -1px) rotate(1deg); }*/
  /*  90% { transform: translate(1px, 2px) rotate(0deg); }*/
  /*  100% { transform: translate(1px, -2px) rotate(-1deg); }*/
  /*}*/
  .upcoming-events{
      padding:10px;
      border-radius: 20px;;
      background-color: rgba(41, 110, 179, 0.589);
      position: fixed;
      bottom:5px;
      right:5px;
      color: lightyellow;
      text-align: center;
      box-shadow: 2px 2px 10px #000;
  }


.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 9px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: rgba(29, 22, 22, 0.385);
}
.contact-details p{
    padding: 0;
    margin: 0;
}
.contact-details img{
    border-radius: 50%;
}

.no-bullets{
    list-style-type: none; /* Remove bullets */
    padding: 0; /* Remove padding */
    margin: 0; /* Remove margins */
    color: #ffffff;
    text-align:;
    font-size: 10pt;
    /* background-color: rgb(4, 16, 27); */

}
p span a:link{
        color: blue;
}
.carousel-inner img {
    width: 100%;
    height: 100%;
  }
  
  /*flip-card*/
  
  flip-card {
  background-color: transparent;
  width: 300px;
  height: 300px;
  perspective: 1000px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-card-front {
  background-color: #bbb;
  color: black;
}

.flip-card-back {
  background-color: #2980b9;
  color: white;
  transform: rotateY(180deg);
}
.center {
  line-height: 200px;
  height: 200px;
  border: 1px solid gray;
  text-align: center;
  border-radius:5px;
  box-shadow:2px 2px 5px #CCC;
  margin:3px;
  
}

.center p {
    width:100%;
    opacity:0.9;
    background-image: linear-gradient(45deg, #62ad53 35.09%, #ded5a0 35.09%, #ded5a0 50%, #62ad53 50%, #62ad53 85.09%, #ded5a0 85.09%, #ded5a0 100%);
  line-height: 1.5;
  display: inline-block;
  vertical-align: middle;
    color:#000;
}
.center p a:link {
    color:#117a8bd6;
    text-shadow:1px 1px 3px #000;
}
.center p a:visited {
    color:#117a8bd6;
    text-shadow:1px 1px 3px #000;
}
.center p a:hover {
    color:#117a8bd6;
    padding-left:1em;
    text-shadow:1px 1px 4px #000;
}
.center p a:active {
    color:#F00;
    text-shadow:1px 1px 4px #000;
}

#LiDAR{
    background-image:url('http://www.projectsafe-clsu.com/img_tools/Picture4.webp');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}
#GT{
    background-image:url('http://www.projectsafe-clsu.com/greentech/greentech.webp');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}
#CC{
    background-image:url('http://www.projectsafe-clsu.com/climatechange/CLIMATECHANGEADAPTATION.webp');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}
#BIO{
    background-image:url('http://www.projectsafe-clsu.com/img_tools/Picture5.webp');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}
#Pytho{
    background-image:url('http://www.projectsafe-clsu.com/img_tools/Picture6.webp');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}
#EC{
    background-image:url('http://www.projectsafe-clsu.com/img_tools/ecological%20profile.webp');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}
#REDAS{
    background-image:url('http://www.projectsafe-clsu.com/img_tools/Picture7.jpg');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}
#RIC{
    background-image:url('http://www.projectsafe-clsu.com/img_tools/Picture1.webp');
    background-size:100% 100%;
    font-weight:bold;
    color:#006400;

}