/*ZoomIn Hover Effect*/
.hover-zoomin a {
    display: block;
    position: relative;
    overflow: hidden;
  }
  .hover-zoomin img {
    width: 100%;
    height: auto;
    transition: all 0.5s ease-in-out;
  }
  .hover-zoomin:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }

  /*Fade Hover Effect*/
  .hover-fade a {
    display: block;
    position: relative;
    overflow: hidden;
    background-color: #333;
  }
  .hover-fade img {
    width: 100%;
    height: auto;
    transition: all 0.5s ease-in-out;
  }
  .hover-fade:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0.5)";
    filter: alpha(opacity=0.5);
    opacity: 0.5;
  }

  /*ZoomIn Hover-Mask Effect*/
  .hover-mask a {
    display: block;
    position: relative;
    overflow: hidden;
  }
  .hover-mask img {
    width: 100%;
    height: auto;
    transition: all 0.5s ease-in-out;
  }
  .hover-mask:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  .hover-mask a h2 {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 0px;
    margin-bottom: 0px;
    height: 100%;
    width: 100%;
    padding: 45% 20px;
    text-align: center;
    background-color: rgba(0,0,0,0.4);
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
  }
  .hover-mask:hover a h2 {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
  }
  .hover-mask .glyphicon {
    -webkit-transform: scale(0);
    transform: scale(0);
    color: #fff;
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
  }
  .hover-mask:hover .glyphicon {
    -webkit-transform: scale(1);
    transform: scale(1);
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=1)";
    filter: alpha(opacity=1);
    opacity: 1;
  }

  /* Hover Blur Effect */
  .text-white {
    color: #fff;
  }
  .hover-blur a {
    display: block;
    position: relative;
    overflow: hidden;
  }
  .hover-blur img {
    width: 100%;
    height: auto;
    transition: all 0.5s ease-in-out;
  }
  .hover-blur:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: grayscale(0.6) blur(1px);
    filter: grayscale(0.6) blur(1px);
  }
  .hover-blur a h2 {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 0px;
    margin-bottom: 0px;
    height: 100%;
    width: 100%;
    padding: 45% 20px;
    text-align: center;
    background-color: rgba(0,0,0,0.5);
    /*background dotted*/
    background-image: -webkit-repeating-radial-gradient(center center, rgba(0,0,0,.8), rgba(0,0,0,.8) 1px, transparent 1px, transparent 100%);
    background-image: repeating-radial-gradient(center center, rgba(0,0,0,.8), rgba(0,0,0,.8) 1px, transparent 1px, transparent 100%);
    background-size: 3px 3px;
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
  }
  .hover-blur:hover a h2 {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
  }
  .hover-blur .text-white {
    -webkit-transform: scale(0);
    transform: scale(0);
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
  }
  .hover-blur:hover .text-white {
    -webkit-transform: scale(1);
    transform: scale(1);
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=1)";
    filter: alpha(opacity=1);
    opacity: 1;
  }

  /* Hover Zoomout */
  .hover-zoomout a {
    display: block;
    position: relative;
    overflow: hidden;
  }
  .hover-zoomout img {
    width: 100%;
    height: auto;
    transition: all 0.5s ease-in-out;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  .hover-zoomout:hover img {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

/*Hover Blurout Effect*/
  .hover-blurout a {
    display: block;
    position: relative;
    overflow: hidden;
  }
  .hover-blurout img {
    width: 100%;
    height: auto;
    transition: all 0.5s ease-in-out;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  .hover-blurout:hover img {
    -webkit-transform: scale(1);
    transform: scale(1);
    /*Blur Filtr*/
    -webkit-filter: grayscale(0.6) blur(1px);
    -moz-filter: grayscale(0.6) blur(1px);
    -o-filter: grayscale(0.6) blur(1px);
    -ms-filter:progid:DXImageTransform.Microsoft.Blur(pixelRadius=2);
    filter: progid:DXImageTransform.Microsoft.blur(pixelradius=2);
    -webkit-filter: grayscale(0.6) blur(2px);
            filter: grayscale(0.6) blur(2px);
  }
  .hover-blurout a h2 {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 0px;
    margin-bottom: 0px;
    height: 100%;
    width: 100%;
    padding: 45% 20px;
    text-align: center;
    background-color: rgba(0,0,0,0.4);
    /*background dotted*/
    background-image: -webkit-repeating-radial-gradient(center center, rgba(0,0,0,.8), rgba(0,0,0,.8) 1px, transparent 1px, transparent 100%);
    background-image: repeating-radial-gradient(center center, rgba(0,0,0,.8), rgba(0,0,0,.8) 1px, transparent 1px, transparent 100%);
    background-size: 3px 3px;
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
  }
  .hover-blurout:hover a h2 {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
  }
  .hover-blurout .glyphicon {
    -webkit-transform: scale(0);
    transform: scale(0);
    color: #fff;
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
  }
  .hover-blurout:hover .glyphicon {
    -webkit-transform: scale(1);
    transform: scale(1);
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=1)";
    filter: alpha(opacity=1);
    opacity: 1;
  }
/* ---------Hover Overlay text Effect--------- */

  .overlay-item {
     display: block;
     position: relative;
     overflow: hidden;
     text-align: center;

  }
  .overlay-item .mask {
     display: block;
     position: absolute;
     overflow: hidden;
     top: 0;
     left: 0;
     height: 100%;
  }
  .overlay-item img {
     display: block;
     width: 100%;
     height: auto;
     x-margin-right: auto;
     x-margin-left: auto;
  }
  .overlay-item h3 {
     text-transform: uppercase;
     text-align: center;
     position: relative;
     padding: 10px;
     margin: 0px 0px 20px 0px;
     display: block;
     background-color: #333;
     color: #fff;
  }
  .overlay-item p {
     text-align: left;
  }
  .overlay-item a.btn {
    margin: 10px 0;
  }

  .overlay-effect img {
     -webkit-transform: scaleY(1);
     transform: scaleY(1);
     transition: all 0.7s ease-in-out;
  }
  .overlay-effect .mask {
     background-color: rgba(255, 255, 255, 0.3);
     transition: all 0.5s linear;
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
     filter: alpha(opacity=0);
     opacity: 0;
  }
  .overlay-effect h3 {
     -webkit-transform: scale(0);
     transform: scale(0);
     transition: all 0.5s linear;
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
     filter: alpha(opacity=0);
     opacity: 0;
  }
  .overlay-effect p {
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
     filter: alpha(opacity=0);
     opacity: 0;
     -webkit-transform: scale(0);
     transform: scale(0);
     transition: all 0.5s linear;
  }
  .overlay-effect a.btn {
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
     filter: alpha(opacity=0);
     opacity: 0;
     -webkit-transform: scale(0);
     transform: scale(0);
     transition: all 0.5s linear;
  }
  .overlay-effect:hover img {
     -webkit-transform: scale(10);
     transform: scale(10);
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
     filter: alpha(opacity=0);
     opacity: 0;
  }
  .overlay-effect:hover .mask {
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
     filter: alpha(opacity=100);
     opacity: 1;
  }
  .overlay-effect:hover h3,.overlay-effect:hover p,.overlay-effect:hover a.btn {
     -webkit-transform: scale(1);
     transform: scale(1);
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
     filter: alpha(opacity=100);
     opacity: 1;
  }
/*Hover Fall Effect*/
  .fall-item {
     width: 100%;
     height: auto;
     overflow: hidden;
     position: relative;
     text-align: center;
  }
  .fall-item .mask,.fall-item .content {
     width: 100%;
     height: 100%;
     position: absolute;
     overflow: hidden;
     top: 0;
     left: 0;
  }
  .fall-item img {
    position: relative;
    height: 268px !important;
    object-fit: cover !important;
    width: 100%;
  }
  .fall-item h2 {
     text-transform: uppercase;
     color: #fff;
     text-align: center;
     position: relative;
     padding: 10px;
     background: rgba(0, 0, 0, 0.8);
     margin: 0 0 20px 0;
  }
  .fall-item p {
     font-style: italic;
     position: relative;
     color: #fff;
     padding: 0px;
     text-align: left;
  }
  .fall-item .course-colomn-hover {
    position: relative;
     
     background: rgba(0, 0, 0, 0.8);
    
  }
  .fall-effect .mask {
     background-color: #000;
     top: -200px;
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
     filter: alpha(opacity=0);
     opacity: 0;
     transition: all 0.3s ease-out 0.5s;
  }
  .fall-effect h2 {
     -webkit-transform: translateY(-200px);
     transform: translateY(-200px);
     transition: all 0.2s ease-in-out 0.1s;
  }
  .fall-effect .course-colomn-hover {
    -webkit-transform: translateY(-200px);
     transform: translateY(-200px);
     transition: all 0.2s ease-in-out 0.1s;
  }
  
  .fall-effect p {
     color: #c7c5c5;
     -webkit-transform: translateY(-200px);
     transform: translateY(-200px);
     transition: all 0.2s ease-in-out 0.2s;
  }
  .fall-effect a.btn {
     -webkit-transform: translateY(-200px);
     transform: translateY(-200px);
     transition: all 0.2s ease-in-out 0.3s;
  }
  #class-crousal .fall-effect:hover .mask  {
    opacity: 1;
  }
  .course-colomn.fall-effect:hover .mask  {
    opacity: 0.9;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
     filter: alpha(opacity=100);
     top: 0px;
     transition-delay: 0s;
  }
  .fall-effect:hover .mask {
     -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
     filter: alpha(opacity=100);
     top: 0px;
     transition-delay: 0s;

  }
  .fall-effect:hover h2 {
     -webkit-transform: translateY(0px);
     transform: translateY(0px);
     transition-delay: 0.4s;
  }
  .fall-effect:hover p {
     -webkit-transform: translateY(0px);
     transform: translateY(0px);
     transition-delay: 0.2s;
  }
  .fall-effect:hover .course-colomn-hover  {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    transition-delay: 0.2s;
  }
  .fall-effect:hover a.btn {
     -webkit-transform: translateY(0px);
     transform: translateY(0px);
     transition-delay: 0s;
  }