/* Hero Section */

.hero-tile {
    font-size: 5rem;
    color: var(--white-100);
    margin-bottom: 0px;
}

.static {
    margin-left: 40px;
}

.hero-tile span {
    color: var(--orange-sevilla-100);
}

.hero-subtitle {
    font-size: 2.25rem;
    color: var(--white-100);
}

.hero-lead {
    color: var(--white-100)
}

.hero-section .hero-content p {
    color: var(--white-100);
}
.bg-black{
    background: var(--black-100);
    color: white;
}
@media (max-width:600px) {
    .hero-content .col-3 {
        margin-right: 8px;
    }
}

#breadcrumbs{
   color: var(--orange-sevilla-100);
}
#breadcrumbs a {
    text-decoration: none !important;
    transition: 0.3s;
    color: var(--orange-sevilla-100);
}
#breadcrumbs a:hover {
    color: white;
}
#breadcrumbs .breadcrumb_last{
	color:white;
}
.breadcrumb {
    margin-top: 1.8rem;
}
/* Title Banner */

.title-banner {
    padding: 80px 0px 0px;
    background: var(--black-100);
    color: var(--white-100);
    background-position: right top;
    background-repeat: no-repeat;
}

.title-banner .sub-title {
    color: var(--color-yellow);
}

.title-banner .scroll {
    position: relative;
    bottom: 1rem;
    left: 0;
    width: 100%;
    text-align: center;
}

.hero-scroll {
    color: var(--white-100);
}

.hero-scroll:hover {
    animation: shakeY;
    /* referring directly to the animation's @keyframe declaration */
    animation-duration: 2.5s;
    /* don't forget to set a duration! */
}


/* Header Pages */

.page-banner {
    padding: 0px 0px;
    background: var(--black-100);
    color: var(--white-100);
    background-position: right top;
    background-repeat: no-repeat;
}

.page-banner h1,
.page-banner p {
    color: var(--white-100);
}

.header-height {
    height: 480px;
}

@media (max-width: 600px) {
    .title-banner .hero-tile {
        font-size: 48px !important;
    }
    .title-banner .hero-subtitle {
        font-size: 22px !important;
    }
    .static {
        margin-left: 20px;
    }
    .title-banner img {
        width: 100%;
    }
    .title-banner .btn-feature {
        width: 60%;
    }
    .hero-scroll {
        display: none;
    }
    .my-5 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important;
    }
}