File "image.css"

Full path: /home/thebfvxb/haseebamjad.com/css/image.css
File size: 0 KB (4.99 KB bytes)
MIME-type: text/plain
Charset: utf-8

Download   Open   Edit   Advanced Editor   Back

.grid-wrap .row figure
{
    /* border: 1px solid #e7e7e7; */
    display: inline-block;
    height: 350px;
    width: 100%;
    background-position: center 0;
    background-repeat: no-repeat;
    /* overflow: hidden; */
    position: relative;
    transition: all 0.5s ease-out 0s;
}

.grid-wrap .row figure img
{
    position: absolute;
    left: 50%;
    transition: all 6s ease-out 0s;
    -moz-transition: all 6s ease-out 0s;
    -webkit-transition: all 6s ease-out 0s;
    -o-transition: all 6s ease-out 0s;
    transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}
.grid-wrap .grid figure:hover{
    z-index:1000;
    transform:scale(1.1) !important;
    box-shadow: 0 0 5px 0.3rem rgba(0,0,0,0.2) !important;
}
.grid-wrap .grid figure:hover img {
    -ms-transform: translateY(-100%) translateX(-50%);
    -webkit-transform: translateY(-100%) translateX(-50%);
    -o-transform: translateY(-100%) translateX(-50%);
    transform: translateY(-100%) translateX(-50%);
    margin-top: 500px;
}

.grid-wrap .grid figure a
{
    /*font-size: 18px;*/
    border: 1px solid #0ec525;
    text-decoration: none;
    border-radius: 4px;
    text-align: center;
    color: #ffffff !important;
    background: #0ec525 !important;
    padding: 3px 13px;
    text-shadow: 0 0 0.2rem rgb(0 0 0 / 10%);
    /*box-shadow: 0 0 3px 0.1rem rgb(14 197 37 / 10%);*/
    box-shadow:0 0 1px 0.1rem rgba(0,0,0,0.1);
    background: rgb(0 236 82 / 10%);
    visibility: hidden;
    transition: all 0.3s ease-out 0s;
}
 .grid-wrap .grid figure a:hover{
     background:transparent !important;
     color:#0ec525 !important;
    /*box-shadow:0 0 0 0.2rem rgba(0,0,0,0.15);*/
} 
.grid-wrap .grid figure:hover a
{
    visibility:visible ;
}
.galleryspan a{
    border: 1px solid #0ec525;
    text-decoration: none;
    border-radius: 4px;
    text-align: center;
    color: #ffffff !important;
    background: #0ec525 !important;
    padding: 3px 13px;
    text-shadow: 0 0 0.2rem rgb(0 0 0 / 10%);
    box-shadow:0 0 1px 0.1rem rgba(0,0,0,0.1);
    background: rgb(0 236 82 / 10%);
    transition: all 0.3s ease-out 0s;
}
 .galleryspan a:hover{
     background:transparent !important;
     color:#0ec525 !important;
    /*box-shadow:0 0 0 0.2rem rgba(0,0,0,0.15);*/
} 
/*.gallery span a*/
/*{*/
    /*font-size: 18px;*/
/*    border: 1px solid #0ec525;*/
/*    text-decoration: none;*/
/*    border-radius: 5px;*/
/*    text-align: center;*/
/*    color: #ffffff!important;*/
/*    background: #0ec525 !important;*/
/*    padding: 3px 13px;*/
/*    text-shadow: 0 0 0.2rem rgb(0 0 0 / 10%);*/
/*    box-shadow: 0 0 3px 0.1rem rgb(14 197 37 / 10%);*/
    /*background: rgb(0 236 82 / 10%);*/
    /* visibility: hidden; */
/*    transition: all 0.3s ease-out 0s;*/
/*}*/
/*.gallery span a:hover*/
/*{*/
/*    box-shadow:0 0 0 0.2rem rgba(0,0,0,0.2);*/
/*}*/

.button{
    border: 1px solid #0ec525;
    overflow: hidden;
    display: inline-block;
    line-height: 1.4;
    border-radius: 35px;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
    user-select: none;
    transition: 250ms all ease-in-out;
    text-transform: uppercase;
    text-decoration: none !important;
    position: relative;
    z-index: 1;
    padding: 16px 70px 16px 35px;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background-color: transparent;
    outline: none !important;
}
.button:before {
    z-index: -1;
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateX(100%);
    transition: .3s ease-out all;
}
.button .button-text {
    position: relative;
    z-index: 2;
    color: #fff;
    transition: .3s ease-out all;
}
.button-icon {
    background-color: #0ec525;
    position: absolute;
    right: -1px;
    top: -1px;
    bottom: 0;
    width: 55px;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 19px;
    color: #ffffff;
    border-radius: 50%;
}
.button:hover .button-text {
  color: #ffffff;
}

.button:hover:before {
    background-color: #0ec525;
  transform: translateX(0);
}


/* .slideshow figure img{
    position: absolute;
    left: 50%;
    transition: all 4s ease-out 0s;
    -moz-transition: all 4s ease-out 0s;
    -webkit-transition: all 4s ease-out 0s;
    -o-transition: all 4s ease-out 0s;
    transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);

}
.slideshow figure:hover img
{
    -ms-transform: translateY(-100%) translateX(-50%);
    -webkit-transform: translateY(-100%) translateX(-50%);
    -o-transform: translateY(-100%) translateX(-50%);
    transform: translateY(-100%) translateX(-50%);
    margin-top: 500px;
} */