/* Minification failed. Returning unminified contents.
(21,28): run-time error CSS1039: Token not allowed after unary operator: '-white-background'
(31,17): run-time error CSS1039: Token not allowed after unary operator: '-black-text'
(33,23): run-time error CSS1039: Token not allowed after unary operator: '-font-medium'
(59,28): run-time error CSS1039: Token not allowed after unary operator: '-black-text'
(66,28): run-time error CSS1039: Token not allowed after unary operator: '-black-text'
(80,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(94,17): run-time error CSS1039: Token not allowed after unary operator: '-black-text'
(119,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-background'
(137,17): run-time error CSS1039: Token not allowed after unary operator: '-black-text'
(139,23): run-time error CSS1039: Token not allowed after unary operator: '-font-semi-bold'
(151,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(154,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(155,17): run-time error CSS1039: Token not allowed after unary operator: '-white-text'
(158,28): run-time error CSS1039: Token not allowed after unary operator: '-black-background'
(159,17): run-time error CSS1039: Token not allowed after unary operator: '-white-text'
(162,17): run-time error CSS1039: Token not allowed after unary operator: '-white-text'
(166,17): run-time error CSS1039: Token not allowed after unary operator: '-white-text'
(169,17): run-time error CSS1039: Token not allowed after unary operator: '-black-text'
(170,31): run-time error CSS1039: Token not allowed after unary operator: '-black-text'
(178,17): run-time error CSS1039: Token not allowed after unary operator: '-black-title'
(179,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(181,23): run-time error CSS1039: Token not allowed after unary operator: '-font-medium'
(194,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(205,28): run-time error CSS1039: Token not allowed after unary operator: '-gray-background'
(209,17): run-time error CSS1039: Token not allowed after unary operator: '-black-title'
(210,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(212,23): run-time error CSS1039: Token not allowed after unary operator: '-font-medium'
(216,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(283,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(290,17): run-time error CSS1039: Token not allowed after unary operator: '-black-title'
(291,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(293,23): run-time error CSS1039: Token not allowed after unary operator: '-font-medium'
(297,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(299,23): run-time error CSS1039: Token not allowed after unary operator: '-font-light'
(311,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(338,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(344,17): run-time error CSS1039: Token not allowed after unary operator: '-black-title'
(345,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(347,23): run-time error CSS1039: Token not allowed after unary operator: '-font-bold'
(351,17): run-time error CSS1039: Token not allowed after unary operator: '-gray-text'
(352,23): run-time error CSS1039: Token not allowed after unary operator: '-font-text'
 */
/*CAROUSEL*/
#banner,
#banner .carousel-inner,
#banner .carousel-inner .carousel-item,
#banner .carousel-inner .carousel-item .carousel-video {
    height: 88VH;
}
#banner .carousel-inner .carousel-item .carousel-image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    width: 100%;
 }
#banner .carousel-inner .carousel-item .carousel-video {
    filter: brightness(80%);
    object-fit: cover;
    width: 100%;
}
#banner .carousel-caption.main-caption {
    background-color: var(--white-background);
    padding: 2rem;
    text-align: left;
    width: 400px;
}
#banner .carousel-caption.left-bottom-alignment {
    left: 10%;
    bottom: 10%;
}
#banner .carousel-caption .carousel-subtitle {
    color: var(--black-text);
    font-size: 1.125rem;
    font-weight: var(--font-medium);
    margin-bottom: 2rem;
}
#banner .carousel-indicators {
    align-items: center;
    display: flex;
    flex-flow: column;
    justify-content: flex-start;
    left: 10%;
    margin: 0;
    top: calc(60% - 200px);
    width: 22px;
}
#banner .carousel-indicators button {
    background-color: transparent;
    border: none;
    border-radius: 50%;
    font-size: 6px;
    height: 22px;
    line-height: 0;
    margin: 0;
    text-indent: 0;
    width: 6px;
}
#banner .carousel-indicators button:hover {
    background-color: transparent;
    border: 1px solid var(--black-text);
    border-radius: 50%;
    height: 20px;
    width: 20px;
}
#banner .carousel-indicators button.active {
    background-color: transparent;
    border: 1px solid var(--black-text);
    border-radius: 50%;
    height: 20px;
    width: 20px;
}
/*END CAROUSEL*/
/*SERVICES*/
#services .services-area {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: 50px 0;
}
#services .services-area .services-box ion-icon {
    color: var(--primary-normal);
    margin-right: 10px;
}
#services .services-area .services-box {
    align-items: center;
    border-right: 1px solid #DEDEDE;
    display: flex;
    justify-content: center;
    width: 215px;
}
#services .services-area .services-box:last-child {
    border-right: none;
}
#services .services-area .services-box .services-text {
    color: var(--black-text);
    font-size: .875rem;
}
/*END SERVICES*/
/*FAMILIES*/
#families .family-line {
    display: flex;
    width: 100%;
}
#families .family-line .family-double {
    display: flex;
    flex-flow: column;
    width: 50%;
}
#families .family-line .family-single {
    display: flex;
    width: 100%;
}
#families .family-outer-box {
    height: 100%;
    padding: 0.5rem;
    width: 100%;
}
#families .family-box {
    align-items: center;
    background-color: var(--gray-background);
    display: flex;
    justify-content: space-between;
    height: 100%;
    padding: 45px 30px;
    width: 100%;
}
#families .family-box.small {
    padding: 25px;
}
#families .family-box .family-img {
    height: 120px;
    width: auto;
}
#families .family-box .family-img.main {
    height: 280px;
}
#families .family-box .family-text {
    color: var(--black-text);
    font-size: 1.5rem;
    font-weight: var(--font-semi-bold);
    margin-bottom: 1rem;
}
#families .family-box .link {
    font-size: .875rem;
    transition: 0.15s all ease-in-out;
}
#families .family-box .link i {
    font-size: .875rem;
    margin-left: 10px;
}
#families .family-box .link:hover {
    border-bottom: 1px solid var(--primary-normal);
}
#families .family-box.alt {
    background-color: var(--primary-normal);
    color: var(--white-text);
}
#families .family-box.inverted {
    background-color: var(--black-background);
    color: var(--white-text);
}
#families .family-box.inverted .family-text {
    color: var(--white-text);
}
#families .family-box.alt .link,
#families .family-box.inverted .link {
    color: var(--white-text);
}
#families .family-box.alt .link:hover {
    color: var(--black-text) !important;
    border-bottom-color: var(--black-text);
}
/*END FAMILIES*/
/*FEATURED*/
#featured {
    padding: 75px 0;
}
#featured .title {
    color: var(--black-title);
    font-family: var(--font-title);
    font-size: 1.625rem;
    font-weight: var(--font-medium);
    margin-bottom: 5rem;
    text-align: center;
}
#featured .featured-link {
    text-align: center;
    margin-bottom: 4rem;
}
#featured .featured-link .link {
    font-size: 0.875rem;
    transition: 0.15s all ease-in-out;
}
#featured .featured-link .link:hover {
    border-bottom: 1px solid var(--primary-normal);
}
#featured .featured-link .link i {
    font-size: 0.75rem;
}
.featured-box:nth-child(4n) {
    border-right: 0;
}
/*END FEATURED*/
/*BRANDS*/
#brands {
    background-color: var(--gray-background);
    padding: 60px 0;
}
#brands .title {
    color: var(--black-title);
    font-family: var(--font-title);
    font-size: 1.125rem;
    font-weight: var(--font-medium);
    text-align: center;
}
#brands .title-bar {
    background-color: var(--primary-normal);
    display: block;
    height: 2px;
    margin: auto auto 3rem auto;
    width: 30px;
}
#brands .owl-carousel .owl-nav {
    margin: 0;
}
#brands .owl-carousel .owl-nav .owl-prev,
#brands .owl-carousel .owl-nav .owl-next {
    background: transparent;
    border: none;
    display: block !important;
    position: absolute;
    top: 50%;
}
#brands .owl-carousel .owl-nav .owl-prev,
#brands .owl-carousel .owl-nav .owl-next {
    margin: 0;
    padding: 0;
    top: 40%;
}
#brands .owl-carousel .owl-nav .owl-prev {
    left: -20px;
}
#brands .owl-carousel .owl-nav .owl-next{
    right: -20px;
}
#brands .owl-carousel .owl-nav .owl-prev ion-icon,
#brands .owl-carousel .owl-nav .owl-next ion-icon {
    font-size: 20px;
}
#brands .owl-carousel .owl-nav .owl-prev ion-icon,
#brands .owl-carousel .owl-nav .owl-next ion-icon {
    color: rgba(143, 143, 143, 0.7);
}
#brands .owl-carousel .owl-nav .owl-prev:hover ion-icon,
#brands .owl-carousel .owl-nav .owl-next:hover ion-icon {
    color: rgba(143, 143, 143, 1);
}
#brands .owl-carousel {
}
#brands .owl-carousel .owl-stage {
    align-items: center;
    display: flex;
}
#brands .owl-carousel .owl-item img {
    filter: grayscale(100%);
    margin: auto;
    opacity: 0.5;
    transition: 0.15s all ease-in-out;
    width: 150px;
}
#brands .owl-carousel .owl-item:hover img {
    filter: grayscale(0%);
    opacity: 1;
}
/*END BRANDS*/
/*NEWS*/
#blog {
    padding: 75px 0;
}
#blog .title-box {
    margin-bottom: 50px;
}
#blog .title-bar {
    background-color: var(--primary-normal);
    display: block;
    height: 2px;
    margin: auto;
    width: 30px;
}
#blog .title {
    color: var(--black-title);
    font-family: var(--font-title);
    font-size: 1.625rem;
    font-weight: var(--font-medium);
    text-align: center;
}
#blog .subtitle {
    font-family: var(--font-title);
    font-size: 1.25rem;
    font-weight: var(--font-light);
    text-align: center;
}
#blog .blog-link {
    text-align: center;
    margin: 3rem 0 0 0;
}
#blog .blog-link .link {
    font-size: 0.875rem;
    transition: 0.15s all ease-in-out;
}
#blog .blog-link .link:hover {
    border-bottom: 1px solid var(--primary-normal);
}
#blog .blog-link .link i {
    font-size: 0.75rem;
}
#blog .blog-section .blog-item:first-child {
    padding-left: 0;
}
#blog .blog-section .blog-item:last-child {
    padding-right: 0;
}
#blog .blog-image-parent {
    height: 270px;
    overflow: hidden;
}
#blog .blog-image-parent:hover .blog-image-child,
#blog .blog-image-parent:focus .blog-image-child {
    transform: scale(1.05);
}
#blog .blog-image-child {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    transition: all 0.3s ease-in-out;
}
#blog .blog-item-date {
    color: var(--primary-normal);
    font-size: 0.75rem;
    margin: 0;
    padding: 28px 0 1rem 0;
}
#blog .blog-item-title {
    color: var(--black-title);
    font-family: var(--font-title);
    font-size: 1.25rem;
    font-weight: var(--font-bold);
    margin-bottom: 1.125rem;
}
#blog .blog-item-text {
    color: var(--gray-text);
    font-family: var(--font-text);
    font-size: 1rem;
    margin-top: 20px;
}
/*END NEWS*/
