.fixed-header {

    transition: all 0.6s ease;

}



.fadeInLeft {

    animation-duration: 2s;

}



.fadeInRight {

    animation-duration: 2s;

}



.fadeInUp {

    animation-duration: 2s;

}



.fadeInDown {

    animation-duration: 2s;

}



.zoomIn {

    /* animation-duration: 0.8s; */

    transition: all 0.8s linear;

}





/* .rightgear.start {

    transition: all 0.6s linear;

    animation-duration: 2s;

} */





/* .rightgear {

    width: 0px;

    -webkit-animation: rightgear 2s ease-out forwards;

    -moz-animation: rightgear 2s ease-out forwards;

    -ms-animation: rightgear 2s ease-out forwards;

    -o-animation: rightgear 2s ease-out forwards;

    animation: spin 4s forwards;

}



@keyframes spin {

    from {

        transform: rotateZ(0deg);

    }

    to {

        transform: rotateZ(90deg);

    }

} */





/* .feature-box-cover .fbox-traingle {

    left: 12%;

} */



.portfolio-content {

    animation-delay: 0s;

}



.portfolio-img-one {

    animation-delay: 0.5s;

}



.portfolio-img-two {

    animation-delay: 1.2s;

}



.portfolio-img-three {

    animation-delay: 1s;

}



.portfolio-btn-content span {

    transition: width 2s;

}



.cool-link {

    display: inline-block;

    color: #000;

    text-decoration: none;

}



.cool-link::after {

    content: '';

    display: block;

    width: 0;

    height: 1px;

    background: #fed501;

    transition: width .3s;

    margin-top: 15px;

}



.cool-link:hover::after {

    width: 100%;

    transition: width .3s;

    margin-top: 15px;

}



@media only screen and (max-width: 480px) {

    .fadeInLeft {

        animation: none;

    }

    .fadeInRight {

        animation: none;

    }

    .slideInDown {

        animation: none;

    }

    .slideInUp {

        animation: none;

    }

    .about-header .about-wrapper {

        margin-top: 69px;

    }

    .portfolio-para {

        display: none;

    }

    .filters ul {

        padding: 25px 0;

    }

}



@media only screen and (min-width: 500px) and (max-width: 768px) {

    .fadeInLeft {

        animation: none;

    }

    .fadeInRight {

        animation: none;

    }

    .about-header .rollIn {

        animation: none;

    }

    .slideInDown {

        animation: none;

    }

    .slideInUp {

        animation: none;

    }

    .play-btn {

        left: 22%;

    }

}



@media only screen and (min-width: 1024px) and (max-width: 1365px) {}