/*=================================================
 ALPRA INTERIORS
 animation.css
==================================================*/

/* Smooth Scrolling */
html{
    scroll-behavior:smooth;
}

/* General Transition */
*{
    transition:all .3s ease;
}

/* Fade Up */
.fade-up{
    animation:fadeUp .8s ease forwards;
}

@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(50px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* Fade In */
.fade-in{
    animation:fadeIn 1s ease forwards;
}

@keyframes fadeIn{
    from{
        opacity:0;
    }
    to{
        opacity:1;
    }
}

/* Slide Left */
.slide-left{
    animation:slideLeft .8s ease forwards;
}

@keyframes slideLeft{
    from{
        opacity:0;
        transform:translateX(-50px);
    }
    to{
        opacity:1;
        transform:translateX(0);
    }
}

/* Slide Right */
.slide-right{
    animation:slideRight .8s ease forwards;
}

@keyframes slideRight{
    from{
        opacity:0;
        transform:translateX(50px);
    }
    to{
        opacity:1;
        transform:translateX(0);
    }
}

/* Zoom In */
.zoom-in{
    animation:zoomIn .7s ease forwards;
}

@keyframes zoomIn{
    from{
        opacity:0;
        transform:scale(.85);
    }
    to{
        opacity:1;
        transform:scale(1);
    }
}

/* Hero Title */
.hero h1,
.carousel-caption h1{
    animation:heroTitle 1.2s ease;
}

@keyframes heroTitle{
    from{
        opacity:0;
        transform:translateY(60px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* Hero Button */
.hero .btn,
.carousel-caption .btn{
    animation:heroButton 1.5s ease;
}

@keyframes heroButton{
    from{
        opacity:0;
        transform:translateY(30px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* Service Card */
.service-box{
    transition:.4s;
}

.service-box:hover{
    transform:translateY(-12px);
    box-shadow:0 20px 45px rgba(0,0,0,.15);
}

.service-box img{
    transition:.6s;
}

.service-box:hover img{
    transform:scale(1.08);
}

/* Portfolio Card */
.portfolio-card{
    overflow:hidden;
}

.portfolio-card img{
    transition:.6s;
}

.portfolio-card:hover img{
    transform:scale(1.08);
}

/* Portfolio Overlay */
.portfolio-overlay{
    opacity:0;
    transition:.4s;
}

.portfolio-card:hover .portfolio-overlay{
    opacity:1;
}

/* Testimonial */
.testimonial-card{
    transition:.4s;
}

.testimonial-card:hover{
    transform:translateY(-10px);
}

/* Process Card */
.process-card{
    transition:.4s;
}

.process-card:hover{
    transform:translateY(-12px);
}

/* Feature Box */
.feature-box{
    transition:.4s;
}

.feature-box:hover{
    transform:translateY(-12px);
}

/* Buttons */
.btn,
.btn-gold{
    transition:.35s;
}

.btn:hover,
.btn-gold:hover{
    transform:translateY(-3px);
}

/* Navbar */
.navbar{
    transition:.4s;
}

/* Floating Animation */
.float{
    animation:floating 3s infinite ease-in-out;
}

@keyframes floating{
    0%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-10px);
    }
    100%{
        transform:translateY(0);
    }
}

/* Pulse */
.pulse{
    animation:pulse 2s infinite;
}

@keyframes pulse{
    0%{
        transform:scale(1);
    }
    50%{
        transform:scale(1.08);
    }
    100%{
        transform:scale(1);
    }
}

/* Rotate Icon */
.rotate:hover{
    transform:rotate(360deg);
}

/* Image Hover */
img{
    transition:.5s;
}

/* Link Hover */
a{
    transition:.3s;
}

/* Footer Social Icons */
.social-icon{
    transition:.3s;
}

.social-icon:hover{
    transform:translateY(-5px);
}