.post-container {
    border: 0 solid #EEEEEE;
    border-radius: 5px;
    overflow: hidden;
}

    .post-container .fpthumb {
        max-height: 25vw;
    }

    .post-container a {
        transition: all 2s;
        -moz-transition: all 2s;
        -o-transition: all 2s;
        -webkit-transition: all 2s;
    }

    .post-container .fpthumb img {
        -moz-transition: all 2s;
        -o-transition: all 2s;
        -webkit-transition: all 2s;
    }

    .post-container:hover .fpthumb img {
        -moz-transform: scale(1.5,1.5);
        -webkit-transform: scale(1.5,1.5);
        -o-transform: scale(1.5,1.5);
        -ms-transform: scale(1.5,1.5);
        transform: scale(1.5,1.5);
    }
.certificate {
    animation-delay:0.1s; /*动画延迟时间*/
    animation-duration: 2s; /*动画持续时间*/
    animation-iteration-count: 1; /*动画执行次数*/
}

.iii:hover {
    transition-property: opacity;
}
.social {
    margin: 5px;
    -webkit-box-flex: 1;
    flex-grow: 1;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    overflow: hidden;
    background-color: #fff;
    border-radius: 4px;
}
.social:hover {
    -ms-transform:scale(1.06);
	-webkit-transform:scale(1.06);
	transform:scale(1.06)   
}

    .social img {
        /*min-height: 110%;
        width: 100%;*/
        cursor: pointer;
        -webkit-transition: all .6s;
        -o-transition: all .6s;
        transition: all .6s;
    }
        .social img:hover {
            -ms-transform: scale(1.06);
            -webkit-transform: scale(1.06);
             transform: scale(1.06); 
        }
.StretchedBox {
  
}
    .StretchedBox img {
        /*background-color: #000;*/
        border-radius: 4px;
        /*border:1px solid #000;*/
    }
        .StretchedBox img:hover {
            background-color: rgba(0,0,0,.5);
            -webkit-transition-duration: .25s;
            transition-duration: .25s;
            opacity: 0.3;
        }
.product-img {
    overflow: hidden;
    border-radius: 4px;
    border: 1px solid #fff;
    opacity:0.9;
    /*transition: all .3s ease;*/
}
        .product-img:hover {
            opacity: 0.6;
            /*transition-delay: 0.2s;*/
            -webkit-transition-duration: .25s;
            transition-duration: .25s;
            transition: ease-in-out 0.25s;
            border-color: rgba(0,0,0,.5);
            /*-webkit-transform: scale3d(0.9,0.9,0.9);
        transform: scale3d(0.9,0.9,0.9);
        transition: ease-in-out 0.5s;*/
            /*opacity: 1;
        -webkit-transform: scale3d(0.9,0.9,0.9);
        transform: scale3d(0.9,0.9,0.9);
        -webkit-transition: opacity .5s cubic-bezier(.09,.25,.38,.99), -webkit-transform 1s cubic-bezier(.09,.25,.38,.99);
        transition: opacity .5s*/
        }

/*<ul id="abgne-block" >
<li > <a href="#" > <img src="img/j.jpg" / > </a > </li >
<li > <a href="#" > <img src="img/q.jpg" / > </a > </li >
<li > <a href="#" > <img src="img/u.jpg" / > </a > </li >
<li > <a href="#" > <img src="img/e.jpg" / > </a > </li >
<li > <a href="#" > <img src="img/r.jpg" / > </a > </li >
<li > <a href="#" > <img src="img/y.jpg" / > </a > </li >
</ul >*/
#abgne-block li:nth-child(1) {
    left: 0px;
}

#abgne-block li:nth-child(2) {
    left: 110px;
}

#abgne-block li:nth-child(3) {
    left: 220px;
}

#abgne-block li:nth-child(4) {
    left: 330px;
}

#abgne-block li:nth-child(5) {
    left: 440px;
}

#abgne-block li:nth-child(6) {
    left: 550px;
}
#abgne-block li:hover {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -o-transform: scale(2);
    -ms-transform: scale(2);
    transform: scale(2);
    z-index: 1;
}
#abgne-block li {
    position: absolute;
    -webkit-transition: -webkit-transform 0.4s linear;
    -moz-transition: -moz-transform 0.4s linear;
    -o-transition: -o-transform 0.4s linear;
    -webkit-transition: -ms-transform 0.4s linear;
    transition: transform 0.4s linear;
}
@-moz-keyframes text {
  0%{
    color: black;
    margin-bottom: -40px;

  }
  30%{
    letter-spacing: 25px;
    margin-bottom: -40px;

  }
  85%{
    letter-spacing: 8px;
    margin-bottom: -40px;

  }
}

@-webkit-keyframes text {
  0%{
    color: black;
    margin-bottom: -40px;

  }
  30%{
    letter-spacing: 25px;
    margin-bottom: -40px;

  }
  85%{
    letter-spacing: 8px;
    margin-bottom: -40px;

  }
}

@keyframes text {
  0%{
    color: black;
    margin-bottom: -40px;

  }
  30%{
    letter-spacing: 25px;
    margin-bottom: -40px;

  }
  85%{
    letter-spacing: 8px;
    margin-bottom: -40px;

  }
}

@keyframes animtext { 
  from {
      width: 0;
     transition: all 2s ease-in-out;
  } 
}

@keyframes move {
    0% {
        top: 0px;
    }

    20% {
        top: -50px;
    }

    40% {
        top: -100px;
    }

    60% {
        top: -150px;
    }

    80% {
        top: -200px;
    }
}



.bigger {
    margin: 0;
    font-size: 60px;
    font-weight: 800;
    padding: 20px;
    text-transform: uppercase;
    color: #202020;
    display: inline-block;
    position: relative;
}

.text {
    max-width: 600px;
    width: 100%;
    line-height: 24px;
    text-align: left;
    color: #404040;
    padding: 20px;
}

    .text.txt-center {
        text-align: center;
    }

    .text a {
        color: #0fe4d2;
    }

.has-animation {
    position: relative;
}

    .has-animation p, .has-animation img {
        opacity: 0;
    }

    .has-animation.animate-in p, .has-animation.animate-in img {
        animation: textHidden 0.1s 1.1s forwards;
    }

    .has-animation.animate-in:before, .has-animation.animate-in:after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        z-index: 10;
    }

    .has-animation.animate-in:before {
        background-color: teal;
    }

    .has-animation.animate-in:after {
        background-color: yellowgreen;
        animation-delay: .5s;
    }

    .has-animation.animation-ltr.animate-in:before {
        animation: revealLTR 1.8s ease;
    }

    .has-animation.animation-ltr.animate-in:after {
        animation: revealLTR 1s .6s ease;
    }

    .has-animation.animation-rtl.animate-in:before {
        animation: revealRTL 1.8s ease;
    }

    .has-animation.animation-rtl.animate-in:after {
        animation: revealRTL 1s .6s ease;
    }

@keyframes revealRTL {
    0% {
        width: 0;
        right: 0;
    }

    65% {
        width: 100%;
        right: 0;
    }

    100% {
        width: 0;
        right: 100%;
    }
}

@keyframes revealLTR {
    0% {
        width: 0;
        left: 0;
    }

    65% {
        width: 100%;
        left: 0;
    }

    100% {
        width: 0;
        left: 100%;
    }
}

@keyframes textHidden {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}