body{
    font-family: 'Poppins', sans-serif;
    background:#111;
    color:#fff;
    overflow-x:hidden;
}

/* NAVBAR */

.custom-nav{
    background:rgba(0,0,0,0.5);
    transition:0.4s;
}

/* HERO */

.hero-parallax{
    height:100vh;
    background-image:url('../images/hero-art.jpg');
    background-attachment:fixed;
    background-position:center;
    background-size:cover;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
}

.overlay{
    position:absolute;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.5);
}

.hero-content{
    position:relative;
    z-index:2;
    text-align:center;
}

.hero-content h1{
    font-size:5rem;
    font-weight:700;
}

.hero-content p{
    font-size:1.5rem;
}

/* CAROUSEL */

.carousel-section{
    padding:100px 0;
    padding-top: 70px;    
    background:#181818;
}

.carousel-overlay{
    position:absolute;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.4);
}

.painting-image{
    max-height:350px;
    border-radius:10px;
    box-shadow:0 10px 40px rgba(0,0,0,0.7);
    transition:0.4s;
}

.painting-image:hover{
    transform:scale(1.05);
}

/* FEATURES */

.features-section{
    padding:100px 0;
    background:#222;
}

.feature-box{
    padding:20px;
}

.feature-img{
    width:140px;
    border-radius:50%;
    margin-bottom:20px;
}

/* PARALLAX MIDDLE */

.parallax-middle{
    height:400px;
    background-image:url('../images/parallax-art.jpg');
    background-attachment:fixed;
    background-position:center;
    background-size:cover;
    position:relative;
}

.overlay-dark{
    position:absolute;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
}

.content-middle{
    position:relative;
    z-index:2;
    top:120px;
}

/* FOOTER */

footer{
    background:#000;
    padding:50px 0;
}

footer a{
    color:#1ab7ea;
}

/* MODAL */

.custom-modal{
    background:#4d87a7;
    color:#fff;
}

.gray{
    background:gray;
    padding:5px 10px;
    border-radius:5px;
}

/* RESPONSIVE */

@media(max-width:768px){

.hero-content h1{
    font-size:3rem;
}

.painting-image{
    width:90%;
}

}