#co-curricular{
    margin-bottom: 20px;
}
#co-curricular h2{
    color: #2A166F;
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 25px;
    font-weight: 700;
    text-transform: capitalize
  }
 
  #co-curricular .curricular{
    background: #fff;
    padding: 0!important;
    margin-bottom: 10px;
    border: #f7f7f7 solid 1px;
    height: 250px;
    /*transition: transform .1s;  Animation */
  }

  #co-curricular .curricular:hover{
    transform: scale(1.08); 
}

#co-curricular .curricular img{
    height: 200px;
    width: 100%; 
    padding: 0 !important; 
}
 
#co-curricular .curricular hr{
    margin-bottom: 0 !important; 
}

#co-curricular .curricular .description{
    padding-left: 10px; 
}


#co-curricular .curricular h5{
    color: #2a166f;
    font-size: 18px;
    font-weight: 400;
    text-transform: capitalize;
    margin-top: 5px;
    padding-left: 10px;
    margin-bottom: 5px;
 }

#co-curricular .curricular span{
    color: #111111;
    font-size: 14px;
    padding-left: 10px;
    font-weight: 400;
    text-transform: capitalize;
 }

    .btn:focus, .btn:active, button:focus, button:active {
        outline: none !important;
        box-shadow: none !important;
      }
 
      .img-thumbnail{
          height: 150px;
      }
      
      #image-gallery .modal-footer,  #gallery .modal-footer{
        display: block;
      }
      
      
      .thumb{
        margin-top: 0px;
        margin-bottom: 0px;
      }

/*********************** Demo - 16 *******************/
.box16{text-align:center;color:#fff;position:relative;overflow:hidden; height: 250px;}
.box16 .box-content,.box16:after{width:100%;position:absolute;left:0}
.box16:after{content:"";height:100%;background:linear-gradient(to bottom,rgba(0,0,0,.05) 0,rgba(0,0,0,.8) 69%,rgba(0,0,0,.76) 100%);top:0;transition:all .5s ease 0s}
.box16 .post,.box16 .title{transform:translateY(145px);transition:all .4s cubic-bezier(.13,.62,.81,.91) 0s}
.box16:hover:after{background:linear-gradient(to bottom,rgba(0,0,0,.09) 0,rgba(0,0,0,.09) 15%,rgba(0,0,0,.12) 18%,rgba(0,0,0,.19) 25%,rgba(0,0,0,.29) 30%,rgba(0,0,0,.29) 30%,rgba(0,0,0,.42) 38%,rgba(0,0,0,.46) 43%,rgba(0,0,0,.53) 47%,rgba(0,0,0,.75) 69%,rgba(0,0,0,.87) 84%,rgba(0,0,0,.98) 99%,rgba(0,0,0,.94) 100%)}
.box16 img{width:100%;height:100%}
.box16 .box-content{padding:20px;margin-bottom:20px;bottom:0;z-index:1}
.box16 .title{font-size:15px;font-weight:700;text-transform:uppercase;margin:0 0 10px}
.box16 .post{display:block;padding:8px 0;font-size:15px}
.box16 .social li a,.box17 .icon li a, .box16 .description{border-radius:50%;font-size:20px;color:#fff}
.box16:hover .post,.box16:hover .title{transform:translateY(0)}
.box16 .social, .box16 .description{list-style:none;padding:0 0 3px;margin:30px 0 5px;opacity:0;position:relative;transform:perspective(500px) rotateX(-90deg) rotateY(0) rotateZ(0);transition:all .6s cubic-bezier(0,0,.58,1) 0s}
.box16 .description{padding:0 0 5px;margin:40px 0 25px;position:relative;transition:all .6s cubic-bezier(0,0,.58,1) 0s}
.box16:hover .social, .box16 .description:hover{opacity:1;transform:perspective(500px) rotateX(0) rotateY(0) rotateZ(0)}
.box16 .social:before, .box16 .description:before{content:"";width:50px;height:2px;background:#fff;margin:0 auto;position:absolute;top:-20px;left:0;right:0}
.box16 .social li, .box .social p {display:inline-block}
.box16 .social p{color: #fff; padding-bottom:0px;}
.box16 .social li a{display:block;width:40px;height:40px;line-height:40px;background:#6d3795;margin-right:10px;transition:all .3s ease 0s}
.box17 .icon li,.box17 .icon li a{display:inline-block}
.box16 .social li a:hover{background:#bea041}
.box16 .social li:last-child a{margin-right:0}
@media only screen and (max-width:990px){.box16{margin-bottom:30px}
}

 
/*********************** Demo - 8 *******************/
.box8{overflow:hidden; margin-bottom: 20px;}
.box8 .icon,.box8 .title{margin-bottom:25px; position:absolute}
.box8{box-shadow:0 0 3px rgba(0, 0, 0, 0.849);position:relative; border:1px solid #BBB; background: rgba(0, 0, 0, 0.849)} 
.box8 img{width:100%; height:250px; background: rgba(0, 0, 0, 0.849) }
.box8 .icon li,.box8 .title{display:inline-block}
.box8 .box-content{width:100%;height:100%;background:rgba(5, 3, 10, 0.753);opacity:0;position:absolute;top:0;left:0;transform:perspective(400px) rotateX(-90deg);transform-origin:center top 0;transition:all .5s ease 0s}
.box8 .icon li a,.box8 .title{background:#f6f6f6;font-size:15px;color:#2a166f}
.box8 .location{font-size:15px;color:#fff; font-weight: 600; float: right !important; position:absolute;}
.box8:hover .box-content{opacity:1;transform:perspective(25px) rotateX(0); color:#fff}
.box8 .title, .box8 .location{padding:5px 7px;border-radius:5px;font-weight:600;bottom:-5px;left:20px;transition:all .9s ease 0s}
.box8 .icon li a{transition:all .35s ease 0s}
.box8:hover .title{bottom:-40px}
.box8 .icon{list-style:none;padding:0;top:42%;left:0;right:0}
.box8 .icon li a{display:block;width:40px;height:40px;line-height:40px;border-radius:50%;margin-right:7px}
.box9 .icon,.box9 .title{width:100%;font-size:22px}
.box8 .icon li a:hover{background:#fff;color:#000}
.box8 .description{font-size:14px;font-style:italic;padding:10px 10px;margin:15px 0}
.box8 .read-more{display:block;width:120px;background:#178993;border-radius:5px;font-size:14px;color:#fff;text-transform:capitalize;padding:10px 0;margin:0 auto; text-align: center}
.box8 p{font-size: 15px; margin: 20px; color: #fff; text-align: center}
@media only screen and (max-width:990px){.box8{margin-bottom:20px}
}