﻿.grid-work {
    background-size: cover;
    background-position: center;
    background-color: rgba(0, 0, 0, 1);
}
.grid-work .black {
   width:100%;
   font-family: 'code-pro-lc';
   background-color:black;
   height:100%;
   display:block;
   padding:10px;
   opacity:0.5;
   -webkit-transition: opacity 0.3s ease-in-out;
   -moz-transition: opacity 0.3s ease-in-out;
   -ms-transition: opacity 0.3s ease-in-out;
   -o-transition: opacity 0.3s ease-in-out;
}
.grid-work .black:hover {
   width: 100%;
   font-family: 'code-pro-lc';
   background-color: black;
   height: 100%;
   display: block;
   padding: 10px;
   opacity: 0;
   -webkit-transition: opacity 0.3s ease-in-out;
   -moz-transition: opacity 0.3s ease-in-out;
   -ms-transition: opacity 0.3s ease-in-out;
   -o-transition: opacity 0.3s ease-in-out;
}

.grid-work a {
    width: 100%;
    height: 100%;
    background-size: cover;
    padding: 10px;
    display: block;
    background-image: url('../../../Images/black.png');
    -webkit-transition: opacity 0.5s ease-in-out;
   -moz-transition: opacity 0.5s ease-in-out;
   -ms-transition: opacity 0.5s ease-in-out;
   -o-transition: opacity 0.5s ease-in-out;
}

.grid-work:hover a{
   display:block;
   -webkit-transition: opacity 0.5s ease-in-out;
   -moz-transition: opacity 0.5s ease-in-out;
   -ms-transition: opacity 0.5s ease-in-out;
   -o-transition: opacity 0.5s ease-in-out;
    background-image:none;
}
.grid-work span {
    font-family: 'code-pro-lc';
    color:#fff;
    font-size:24px;
    display:none;
}
.grid-work p {
    font-family: 'code-pro-lc';
    color:#fff;
    font-size:24px;
    display:none;
}
.grid-work .altsp {
    font-family: 'code-pro-lc';
    color:#fff;
    font-size:18px;
    display:none;
}
.grid-work img {
    max-width: 175px;
    display:none;
}
.grid-work:hover span{
   display:block;
   -webkit-transition: opacity 0.5s ease-in-out;
   -moz-transition: opacity 0.5s ease-in-out;
   -ms-transition: opacity 0.5s ease-in-out;
   -o-transition: opacity 0.5s ease-in-out;
   
}
.grid-work:hover img{
   display:block;
   -webkit-transition: opacity 0.5s ease-in-out;
   -moz-transition: opacity 0.5s ease-in-out;
   -ms-transition: opacity 0.5s ease-in-out;
   -o-transition: opacity 0.5s ease-in-out;
   
}