:root {
    --color-green-v1:#279044;
    --color-green-v2:#28302f;
    --color-grey-v1: #f8f8f8;
    --color-grey-v2:#b9b9b9;
    --color-grey-v3:#989898;
    --color-purple-v1:#c38da4;
    --color-purple-v2:#946987D1;
    --color-purple-v3:#4e223a;
    --color-yellow:#f1e4d3;

    --color-purple-v1-rgb:195,141,164;
    --color-purple-v2-rgb:148,105,135;
    --color-purple-v3-rgb:78,34,58;


    --bs-icon-link-transform: translate3d(0, -.175rem, 0);
}
@font-face{font-family:'Designer';src:url('/public/assets/current/font/designer.otf');}
@font-face{font-family:'Marianne';src:url('/public/assets/current/font/Marianne-Regular.woff2');}
@font-face{font-family:'Marianne-Light';src:url('/public/assets/current/font/Marianne-Light.woff2');}
@font-face{font-family:'Montserrat';src:url('/public/assets/current/font/Montserrat-Regular.ttf');}

.ff-designer {font-family: 'Designer', serif!important;}
.ff-montserrat {font-family: 'Montserrat', serif!important;}

.bg-green-v1{background-color:var(--color-green-v1)!important;}
.bg-green-v2{background-color:var(--color-green-v2)!important;}
.bg-grey-v1{background-color:var(--color-grey-v1)!important;}
.bg-grey-v2{background-color:var(--color-grey-v2)!important;}
.bg-grey-v3{background-color:var(--color-grey-v3)!important;}
.bg-purple-v1{background-color:var(--color-purple-v1)!important;}
.bg-purple-v2{background-color:var(--color-purple-v2)!important;}
.bg-purple-v3{background-color:var(--color-purple-v3)!important;}
.bg-yellow{background-color:var(--color-yellow)!important;}

.bg-blue-gradient {background: linear-gradient(0.25turn, #597da2, #32326c);}
.bg-red-gradient {background: linear-gradient(0.25turn, #b81e1b, rgba(216, 10, 0, 0.58));}
.bg-white-75 {background: rgba(255,255,255,.75);}
.bg-success-85 {background: rgba(40, 167, 69, .85);}
.bg-hover-transparent:hover {background-color: transparent;}

.text-green-v1{color:var(--color-green-v1)!important;}
.text-green-v2{color:var(--color-green-v2)!important;}
.text-grey-v1{color:var(--color-grey-v1)!important;}
.text-grey-v2{color:var(--color-grey-v2)!important;}
.text-grey-v3{color:var(--color-grey-v3)!important;}
.text-purple-v1{color:var(--color-purple-v1)!important;}
.text-purple-v2{color:var(--color-purple-v2)!important;}
.text-purple-v3{color:var(--color-purple-v3)!important;}

.btn-outline-purple-light {
    border: 1px solid #c38da4;
    color: #c38da4;
}
.btn-outline-purple-light:hover {
    background: #c38da4;
    color: #fdfdfd;
}
.btn-outline-purple-dark {
    border: 1px solid #4e223a;
    color: #4e223a;
}
.btn-outline-purple-dark:hover {
    background: #4e223a;
    color: #f1e4d3;
}
.btn-outline-light-purple-int:hover {
    color: #4e223a
}
.btn-purple-dark {
    background: #4e223a;
    color: #f1e4d3;
}
.btn-purple-dark:hover {
    border: 1px solid #4e223a;
    background: transparent;
    color: #4e223a;
}

body{font-family:"Montserrat",serif;}

#homeFirstRow{
    background: url('/public/image/background/troy-mortier-nLho-2qAy8g-unsplash.webp') no-repeat bottom;
    background-size: cover;
}
#prodFirstRow {
    background-image: url('/public/image/background/ant-rozetsky-io7dX_1EFCg-unsplash.webp');
    background-position: center 45%;
    background-repeat: no-repeat;
    background-size: cover;
}
#aboutFirstRow {
    background-image: url('/public/image/background/about-fhd-md.webp');
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
}
#one-content {
    padding: 70px 0 0 0 !important;
    height: max-content !important;
}

#second-content {
     margin-top: 60px !important;
}

.prod-size {
    width: 18rem;
}

/* Background mobile size */
.bgi-home {
    background: url("/public/image/background/home-pfhd.webp") no-repeat center;
    background-size: cover;
}

.bgi-footer {
    background: url("/public/image/footer.webp") no-repeat right bottom;
    background-size: contain;
}

.bgi-about-header {
    background: url("/public/image/background/about-pfhd.webp") no-repeat center;
    background-position: bottom;
    background-size: cover;
}

.bgi-about-emp {
    background: url("/public/image/background/about-emp-pfhd.webp") no-repeat center;
    background-position: bottom;
    background-size: cover;
}

.bgi-about-vehicle {
    background: url("/public/image/background/about-vehicle-pfhd.webp") no-repeat center;
    background-position: 50% 65%;
    background-size: cover;
}

/* Button */
.btn-tel-text {
    color: #f8f9fa;
}

.btn-tel-text:hover {
    color: #1b1e21;
}

/* BG dark transition effect */
.ref-col .card-img-overlay {
    top:unset;bottom:5px;left:5px;right:5px;
    background-color: rgba(0, 0, 0, .75) !important;
    transition-duration: 0.6s;
}

.ref-col:hover .card-img-overlay {
    background-color: transparent !important;
    transition-duration: 0.6s;
}

.ref-col:hover .card-img-overlay .card-title {
    opacity: 0;
    transition: opacity 0.5s cubic-bezier(0.64, 1.5, 0.58, 1.9) 0.1s;
    transition-duration: 0.6s;
}

/* Translate Y effect transition */
/*.engage-box .engage-col .engage-text {*/
/*    opacity: 0;*/
/*    transition: opacity 0.5s cubic-bezier(0.64, 1.5, 0.58, 1.3) 0.3s;*/
/*    transition-duration: 1s;*/
/*}*/

/*.engage-box .engage-col {*/
/*    transform: translateY(4em);*/
/*    transition-duration: 1s;*/
/* }*/

/*.engage-box .engage-col:hover .engage-text {*/
/*    opacity: 1;*/
/*}*/

/*.engage-box .engage-col:hover .engage-text {*/
/*    transform: translateY(0px);*/
/*}*/

/*.engage-box .engage-col:hover {*/
/*    transform: translateY(-4em);*/
/*    transition: transform 0.4s cubic-bezier(0.64, 1.5, 0.58, 1.3)0.3s;*/
/*}*/

.about-vehicle-box .about-vehicle-col .about-vehicle-text {
    opacity: 0;
    transform: translateY(4em);
    transition: transform 0.35s  cubic-bezier(0.64, 1.3, 0.58, 1.1)0.25s, opacity 0.35s cubic-bezier(0.64, 1.3, 0.58, 1.1) 0.2s;
}

.about-vehicle-box .about-vehicle-col .about-vehicle-img {
    transform: translateY(1.50em);
    transition-duration: 0.6s;
}

.about-vehicle-box .about-vehicle-col .about-vehicle-title {
    transform: translateY(1.50em);
    transition-duration: 0.6s;
}

.about-vehicle-box .about-vehicle-col:hover .about-vehicle-text {
    opacity: 1;
    transition: transform 0.35s  cubic-bezier(0.64, 1.3, 0.58, 1.1)0.5s, opacity 0.35s cubic-bezier(0.64, 1.3, 0.58, 1.1) 0.5s;
    transform: translateY(0px);
}

.about-vehicle-box .about-vehicle-col:hover {
    transform: translateY(0px);
}

.about-vehicle-box .about-vehicle-col:hover .about-vehicle-img {
     transform: translateY(-1.5em);
     transition: transform 0.25s cubic-bezier(0.64, 1.3, 0.58, 1.1)0.2s;
 }

.about-vehicle-box .about-vehicle-col:hover .about-vehicle-title {
    transform: translateY(-1.5em);
    transition: transform 0.3s cubic-bezier(0.64, 1.3, 0.58, 1.1)0.4s;
}

/* Circle dot carousel */
.dot {
    border-radius: 50% !important;
    background-color: white !important;
    height: 10px !important;
    width: 10px !important;
    margin: 0 2px;
}

@media (min-width: 576px) {

}
@media (min-width: 768px) {
    #one-content {
        padding: 70px 0 0 0 !important;
        height: max-content !important;
    }

    #second-content {
        margin-top: 0 !important;
    }

    .prod-size {
        width: 25rem;
    }

    /* Background md size */
    .bgi-md-home {
        background: url("/public/image/background/home-md-fhd.webp") no-repeat center;
        background-size: cover;
    }

    .bgi-md-about-header {
        background: url("/public/image/background/about-fhd-md.webp") no-repeat bottom;
        background-size: cover;
    }

    .bgi-md-about-emp {
        background: url("/public/image/background/about-emp-fhd-md.webp") no-repeat;
        background-position: 50% 90%;
        background-size: cover;
        opacity: 75%;
        filter: alpha(opacity=75)
    }

    .bgi-md-about-vehicle {
        background: url("/public/image/about-vehicle-fhd-md.webp") no-repeat center;
        background-position: 50% 60%;
        background-size: cover;
        opacity: 75%;
        filter: alpha(opacity=75)
    }

    /* Title line before & after */
    .page-title-light:before,
    .page-title-light:after {
        background: #fff;
    }

    .page-title-dark:before,
    .page-title-dark:after {
        background: #000;
    }

    .page-header {
        background: none;
        text-align: center;
        overflow: hidden;
        padding-top: 35px;
    }

    .page-header .page-title {
        position: relative;
        display: inline-block;
        background: transparent;
        padding: 0 10px;
        z-index: 3;
        line-height: 1.2em;
        font-size: 3em;
    }

    .page-header .page-title:before,
    .page-header .page-title:after {
        position: absolute;
        left: auto;
        right: auto;
        bottom: 22px;
        display: block;
        content: '';
        width: 250%;
        height: 1px;
    }

    .page-header .page-title:before {
        left: -250%;
    }

    .page-header .page-title:after {
        right: -250%;
    }
}
@media (min-width: 992px) {
    #homeFirstRow {
        background-position: right;
        background-size: cover;
    }
}
@media (min-width: 1200px) {

}