@font-face {

    font-family: Metropolis;

    font-weight: 500;

    src: url('../../vendors/metropolis/Metropolis-Medium.otf');

}



@font-face {

    font-family: Metropolis;

    font-weight: 700;

    src: url('../../vendors/metropolis/Metropolis-Bold.otf');

}



@font-face {

    font-family: Metropolis;

    font-weight: 400;

    src: url('../../vendors/metropolis/Metropolis-Regular.otf');

}



body {

    margin: 0;

    padding: 0;

    font-family: 'Metropolis';

    background: #F8F8F8

}



.excell-background-color {

    background-color: #1982C1;

}



.excell-font-color {

    color: #1982C1;

}



.carousel.slide,

.carousel-inner,

.carousel-item {

    height: 100%;

}



.carousel-inner {

    width: 85%;

    margin-left: 15%;

}



.carousel-item div h1 {

    font-weight: 700;

    font-size: 3.5em;

    line-height: 64px;

    color: #13132F;

}



.carousel-item div p {

    width: 80%;

    color: #13132F;

}



.carousel-indicators {

    width: 10px;

    right: 0;

    bottom: unset;

    top: 50%;

    transform: translateY(-50%);

    left: 0;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 0;

    margin-right: unset;

    margin-bottom: unset;

    margin-left: unset;

    list-style: none;

    margin-left: 5%;

}



.carousel-indicators [data-bs-target] {

    width: 10px;

    height: 10px;

    border-radius: 50%;

    padding: 0;

    margin: 9px 0;

    background-color: #D9D9D9;

    border: 0;

}



.carousel-indicators .active {

    border: 4px solid #1982C1;

    background-color: transparent;

}



.header-carousel {

    background-image: url('../img/ellipsis.png');

    background-position: top right;

    background-color: #ffffff;

    background-repeat: no-repeat;

}





.active.carousel-item-end,

.carousel-item-next:not(.carousel-item-start) {

    transform: translateX(0);

    transform: translateY(100%);

}



.active.carousel-item-start,

.carousel-item-prev:not(.carousel-item-end) {

    transform: translateX(0);

    transform: translateY(-100%);

}



.enquiry-button {

    padding: 12px 30px;

    background-color: #1982C1;

    border-radius: 6px;

    color: #ffffff;

}



.scroll-label {

    font-style: normal;

    font-weight: 500;

    font-size: 1em;

    line-height: 14px;

    color: #4E4E4E;

}



.banner-strip-contact {

    font-size: 1.5em;

    font-weight: 700;

    color: #ffffff;

    white-space: nowrap;

}



.banner-strip {

    font-size: 1rem;

    color: #ffffff;

    padding: 2rem;

}





.common-section {

    padding-top: 8rem;

}





.common-section-title,

.section-title {

    font-size: 2.5rem;

    font-weight: 700;

    color: #13132F;

}



.common-section-title::before {

    width: 42px;

    height: 7px;

    background-color: #1982C1;

    position: absolute;

    top: -30px;

    left: 50%;

    transform: translateX(-50%);

    content: '';

}



.card.active {

    border: 2px solid #1982C1 !important;

}



.card.active .excell-arrow,

.excell-arrow-portfolio {

    width: 40px;

    height: 40px;

    background: #1982C1;

    position: relative;

    border-radius: 50%;

}





.card.active .excell-arrow svg,

.excell-arrow-portfolio svg {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}



.card.active .excell-arrow svg path,

.excell-arrow-portfolio svg path {

    fill: white;

}

.excell-arrow-portfolio{

    box-shadow: 0px 0px 0px 6px #1982c133;

}





.product-card .card-title {

    font-size: 1.325rem;

    font-weight: 700;

    color: #13132F;

}



#detailCard .card {

    background: #16133E;

    color: #fff;

    border-radius: 10px;

    padding: 2.5rem;

}



#detailCard .card-title {

    font-weight: 700;

    font-size: 1.625rem;

}



.excell-paragraph-text {

    font-size: 1rem;

    line-height: 2rem;

}





.card-title span {

    color: #1982C1;

}







#portfolioContainer .common-section-title::before {

    left: unset;

    transform: translateX(0);

}



.excell-footer-details {

    padding: inherit;

}



.portfolio-cards .card {

    padding: 3rem 1rem;

    border: none;

    display: block;

    text-align: center;

}





.portfolio-cards img {

    width: auto;

    max-width: 100%;

}



.excell-input-group input {

    background-color: #F3F3F3;

    border: 1px solid #C6CCD3;

    border-radius: 5px;

}



@media only screen and (max-width: 767px) {

    .carousel-details {

        /* margin-right: 10%; */

        position: relative !important;

    }



    .excell-footer-details {

        padding: unset;

    }



    .header-carousel {

        background-image: url('../img/ellipsis_mobile.png');

        background-position: bottom right;

        background-color: #ffffff;

        background-repeat: no-repeat;

    }

}



/* 

@media screen and (max-width: 720px) {

 

} */