@import url('https://fonts.googleapis.com/css2?family=Overpass:wght@200;300;400;600;700;800;900&display=swap');

body {
    font-family: 'Overpass', sans-serif;
    font-weight: 300;
    color: #264b5b;
}

a,
a:hover {
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

h2 {
    font-size: 45px;
    font-weight: 900;
    line-height: 1.11;
    color: #264b5b;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 176px;
    height: 48px;
    border-radius: 0;
    padding: 4px 0 0 0;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 0.05em;
    color: #264b5b;
}

.cta-outline-primary {
    border: 1px solid #51f2a5;
    color: #264b5b;
}

.cta-outline-primary:hover {
    background-color: #51f2a5;
    color: #264b5b;
}

ul,
li,
ol {
    margin: 0;
    padding: 0;
    list-style: none;
}


/* Header css */

header {
    padding: 26.5px 0;
    border-bottom: 1px solid #c1ccc0;
}

.text-header span {
    font-size: 16px;
    text-align: left;
    color: #264b5b;
}

.text-header span a {
    font-weight: 700;
    color: #264b5b;
}

.text-header i {
    margin-right: 10px;
}

.text-header {
    display: flex;
    align-items: flex-end;
}

.hero-text h1 {
    font-weight: 900;
    font-size: 50px;
    line-height: 50px;
    text-align: left;
    color: #264b5b;
}

.hero-text p {
    font-weight: 300;
    font-size: 20px;
    line-height: 24px;
    text-align: left;
    color: #264b5b;
    margin-bottom: 44px;
}

.hero-text {
    max-width: 400px;
}

.hero-main {
    padding-bottom: 120px;
}

.management-card {
    background: #d6dfd5;
    box-shadow: -6px -4px 8px rgba(38, 75, 91, 0.1);
    padding: 37px 16px;
}

.management-card h2 {
    font-size: 30px;
    font-weight: 900;
    line-height: 1.13;
    color: #264b5b;
    margin-bottom: 43px;
    padding: 0 22px;
}

.content-card h3 {
    font-size: 14px;
    font-weight: 900;
    line-height: 1.43;
    color: #264b5b;
    margin-bottom: 25px;
}

.content-card h4 {
    font-size: 20px;
    line-height: 1.29;
    color: #264b5b;
    font-weight: 600;
}

.content-card p {
    font-size: 14px;
    font-weight: 300;
    line-height: 1.29;
    color: #264b5b;
    max-width: 173px;
}

.content-card .price {
    font-size: 24px;
    font-weight: 900;
    line-height: 2;
    color: #264b5b;
}

.content-card .price span {
    font-size: 14px;
    display: inline-flex;
}

.content-card hr {
    margin: 22px 0;
    background-color: rgba(38, 75, 91, 0.5);
    ;
}

.price-total {
    font-size: 30px;
    font-weight: 900;
    line-height: 0.93;
    letter-spacing: normal;
    color: #264b5b;
    padding: 22px 0 0;
    border-top: solid 3px rgba(38, 75, 91, 0.5);
}

.content-card .price-total {
    margin-top: 22px;
}

.inner-content {
    padding: 0 22px;
}

.management-card .row [class*="col-"]:first-child {
    border-right: 1px solid rgba(38, 75, 91, 0.5);
}

.content h2 {
    margin-bottom: 22px
}

.content p {
    font-size: 20px;
    font-weight: 300;
    line-height: 1.4;
    letter-spacing: normal;
    color: #264b5b;
    margin-bottom: 22px
}

.content-manufacture hr {
    margin: 30px 0;
}

.content-manufacture {
    padding-bottom: 20px;
}

.content-manufacture .media h3 {
    margin: 0;
    font-size: 50px;
    font-weight: 800;
    letter-spacing: -2.5px;
    color: #264b5b;
    margin-right: 24px;
}

.content-manufacture .media .media-body {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.38;
    color: #264b5b;
}

.content-manufacture {
    margin-left: 120px;
}

.text-wrapper {
    max-width: 510px;
}

.cost-management .img-holder {
    margin-bottom: 41px;
}

.cost-management .management-card {
    max-width: 510px;
    margin-left: auto;
}

.cost-management {
    position: relative;
}

.cost-management .container {
    z-index: 99;
    position: relative;
}

.cost-management:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: calc(100% - 51px);
    background-color: #f6f3f2;
}

.living-space {
    padding: 130px 0 240px;
    overflow: hidden;
}

.living-space .content {
    max-width: 510px;
}

.living-space .steps {
    max-width: 587px;
}

.content p strong {
    font-weight: 600;
}

.testimonial {
    display: flex;
    position: relative;
    max-width: 510px;
    padding: 24px 0;
}

.living-space .testimonial:before {
    content: '';
    height: 1px;
    width: 50vw;
    position: absolute;
    top: 0;
    right: 0;
    background-color: #C1CCC0;
}

.testimonial .sign {
    font-weight: 600;
    font-size: 60px;
    line-height: 1;
    text-align: left;
    color: #51f2a5;
}

.testimonial .media-body {
    padding: 0 21px;
}

.testimonial .media-body p {
    font-size: 16px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.38;
    letter-spacing: normal;
    color: #264b5b;
    margin-bottom: 21px;
}

.testimonial .media-body .name {
    display: block;
    font-size: 14px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: 1px;
    color: #264b5b;
}

.steps li {
    max-width: 515px;
    border: solid 1px #51f2a5;
    margin-bottom: 55px;
    position: relative;
    background-color: #fff;
}

.steps li .media-body {
    padding: 21px 43px;
}

.steps li .line {
    display: none;
}

.steps li .count {
    width: 56px;
    height: 56px;
    border: solid 1px #51f2a5;
    margin-left: -1px;
    margin-top: -1px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 300;
    letter-spacing: 1.29px;
    color: #51f2a5;
}

.steps li:nth-child(odd) {
    margin-left: auto;
}

.steps li:after {
    content: '';
    height: 1px;
    width: 90px;
    position: absolute;
    left: -11px;
    top: 118px;
    background-color: #51f2a5;
    transform: rotate(39deg);
    transform-origin: bottom;
}

.steps li:last-child::after {
    content: none;
}

.steps li:nth-child(odd):after {
    right: -11px;
    left: auto;
    transform: rotate(-39deg);
}

.title {
    text-align: center;
    max-width: 511px;
    margin: 0 auto;
}

.mauris-homes form {
    max-width: 840px;
    margin: 0 auto;
}

.mauris-homes .title {
    margin-bottom: 70px;
}

.mauris-homes label {
    font-size: 12px;
    font-weight: 300;
    color: #264b5b;
    text-transform: uppercase;
}

.mauris-homes {
    background-color: #f6f3f2;
    padding: 248px 0 45px;
}

.mauris-homes .form-group label span {
    color: #51F2A5;
}

.form-control {
    height: 40px;
    border: solid 1px #c1ccc0;
    background-color: rgba(193, 204, 192, 0.1);
}

.form-control:focus {
    border: solid 1px #c1ccc0;
    box-shadow: none;
    background-color: rgba(193, 204, 192, 0.1);
}

.mauris-homes form h4 {
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    text-align: left;
    color: #264b5b;
}

.selected-list,
.form-group {
    margin-bottom: 24px;
}

.selected-list {
    display: flex;
    align-items: center;
    margin: 0 -10px;
}

.selected-list li {
    padding: 0 10px;
}

.checkbox-style,
.radio-style {
    position: absolute;
    opacity: 0;
    visibility: hidden;
}

.checkbox-style+label,
.radio-style+label {
    display: inline-flex;
    align-items: center;
    color: #264b5b;
    cursor: pointer;
    text-transform: capitalize;
}

.radio-style+label:before {
    content: '';
    width: 14px;
    height: 14px;
    background: rgba(193, 204, 192, 0.2);
    border: 1px solid #c1ccc0;
    border-radius: 50%;
    display: inline-flex;
    margin-right: 12px;
}

.radio-style:checked+label:before {
    background: #51f2a5;
    box-shadow: inset 0px 0px 0px 2px #fff;
    border: 1px solid #51f2a5;
}

.checkbox-style+label:before {
    content: '';
    width: 14px;
    height: 14px;
    background: rgba(193, 204, 192, 0.2);
    border: 1px solid #c1ccc0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 16px;
}

.checkbox-style:checked+label:before {
    content: '\2713';
    color: #fff;
    background: #51f2a5;
    border: 1px solid #51f2a5;
}

.radio-style+label span,
.checkbox-style+label span {
    flex: 1;
}

.checkbox-card {
    max-width: 500px;
}

.checkbox-card span {
    font-size: 14px;
}

.checkbox-card span a {
    color: #264b5b;
    font-weight: 600;
    text-decoration: underline;
}

.footer {
    display: flex;
    align-items: center;
}

.footer p {
    margin: 0;
}

.quick-links {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: flex-end;
}

.quick-links li a {
    font-size: 12px;
    font-weight: 600;
    color: #264b5b;
}

.quick-links li a:hover {
    color: #51f2a5;
}

.quick-links li {
    margin-left: 46px;
}

footer {
    background-color: #f6f3f2;
    padding: 41px 0;
}

.steps-junks {
    background-color: #264b5b;
    padding: 79px 0 0;
    position: relative;
}

.steps-junks:before {
    content: '';
    width: calc(50% + 10px);
    height: calc(100% + 253px);
    background-color: transparent;
    border: 10px solid #51f2a5;
    position: absolute;
    top: -127px;
    right: 0;
    left: -5px;
    border-left: 0;
    border-bottom: 0;
    border-top-right-radius: 80px;
}

.steps-junks:after {
    content: '';
    width: calc(50% + 5px);
    height: calc(100% - 109px);
    background-color: transparent;
    border: 10px solid #51f2a5;
    position: absolute;
    top: auto;
    bottom: 0;
    right: 0;
    border-right: 0;
    border-bottom: 0;
    border-top-left-radius: 80px;
}

.arrows-main {
    position: absolute;
    top: -246px;
}

.arrows-down2 {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: -147px;
}

.steps-junks .container {
    position: relative;
    z-index: 1;
}

.steps-junks .shape-main {
    position: absolute;
    left: 0;
    right: 0;
    max-width: 100%;
    margin: 0 auto;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.steps-junks .card_box {
    max-width: 510px;
}

.steps-junks .card_box h2 {
    color: #f6f3f2;
    margin-bottom: 32px;
}

.steps-junks .card_box p {
    font-size: 20px;
    font-weight: 300;
    line-height: 1.2;
    letter-spacing: normal;
    color: #f6f3f2;
    margin: 0;
}

.steps-junks .card_box {
    margin-bottom: 90px;
}

.steps-junks ul li {
    display: flex;
    align-items: center;
    padding-bottom: 131px;
}

.steps-junks ul li:nth-child(even) {
    flex-direction: row-reverse;
}

.steps-junks ul li:nth-child(even) .icon {
    padding-left: 95px;
}

.steps-junks ul li:nth-child(even) .media-body p,
.steps-junks ul li:nth-child(even) .media-body {
    text-align: right;
    margin-left: auto;
    padding-left: 0;
}

.steps-junks ul li:nth-child(even) .icon {
    text-align: left;
}

.steps-junks ul li:nth-child(even) .media-body {
    padding-right: 50px;
}

.steps-junks ul li .col {
    padding: 0;
}

.steps-junks ul li .icon {
    flex: 1;
    display: block;
    padding-right: 50px;
    text-align: right;
}

.steps-junks ul li .media-body h3 {
    font-size: 45px;
    font-weight: 300;
    margin: 0;
    color: #51f2a5;
}

.steps-junks ul li .media-body h4 {
    font-size: 20px;
    font-weight: 900;
    color: #51f2a5;
    margin: 0;
}

.steps-junks ul li .media-body p {
    margin: 0;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.22;
    color: #f6f3f2;
    max-width: 400px;
}

.steps-junks ul li .media-body {
    padding-left: 95px;
}

.steps-junks ul li .shape {
    width: 64px;
    height: 64px;
    background: #264b5b;
    border: 10px solid #51f2a5;
    border-radius: 50%;
    display: inline-flex;
    position: relative;
    z-index: 6;
}



.theme-dark header,
.theme-dark .hero-main {
    background-color: #264b5b;

}

.theme-dark .hero-main {
    padding: 42px 0;
}

.theme-dark .hero-main .hero-text {
    max-width: 100%;
}

.theme-dark .hero-main .hero-text p,
.theme-dark .hero-main .hero-text h1 {
    color: #f6f3f2;
}

.theme-dark .hero-main .hero-text .btn {
    color: #f6f3f2;
}

.theme-dark .hero-main .hero-text p {
    max-width: 510px;
}

.theme-dark header .text-header span {
    color: #f6f3f2;
}

.theme-dark header .text-header a {
    color: #51F2A5;
    text-decoration: underline;
}


.theme-dark .management-card {
    padding: 30px 50px;
    position: relative;
}

.arrow-m {
    position: absolute;
    bottom: 86%;
    left: 86%;
}

.theme-dark .management-card .caption h2 {
    margin: 0 0 21px;
    padding: 0;
}

.theme-dark .management-card .caption p {
    margin: 0;
}

.theme-dark .management-card .caption h2 {
    max-width: 347px;
}

.theme-dark .cost-management {
    background-color: #f6f3f2;
}

.theme-dark .cost-management:after {
    content: none;
}

.theme-dark .management-card .caption p strong {
    font-weight: 600;
}

.check-label {
    position: absolute;
    opacity: 0;
    visibility: hidden;
}

.check-label+label {
    height: 48px;
    background: rgba(246, 243, 242, 0.5);
    border: 1px solid rgba(38, 75, 91, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 30px 0;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    color: #264b5b;
    cursor: pointer;
    padding-top: 3px;

}

.check-label:checked+label {
    background: rgba(38, 75, 91, 0.3);
    border: 1px solid rgba(38, 75, 91, 0.5);

}

.management-card .media {
    padding: 10px 0;
    border-top: 2px solid #c1ccc0;
    align-items: center;

}

.management-card .media p {
    margin: 0;
}

.management-card .media h4 {
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
    text-align: left;
    color: #264b5b;

}

.management-card .price {
    font-weight: 900;
    font-size: 20px;
    line-height: 28px;
    text-align: right;
    color: #264b5b;

}

.management-card .note {
    display: flex;

}

.management-card .note span {
    flex: 1;
    padding: 0 10px;
}

.management-card .cta-primary {
    min-width: 191px;
    height: 48px;
    background: #264b5b;
    border: 1px solid #51f2a5;
    color: #51f2a5;
    ;

}


.theme-dark .content-manufacture.content {
    padding-top: 176px;

}


.theme-dark .management-card {
    margin-top: -97px;
}

.theme-dark .content-manufacture.content {
    padding-top: 122px;
}


.icon-cards {
    text-align: center;
    margin-bottom: 80px;
}

.icon-cards h4 {
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #264b5b;

}

.icon-cards p {
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #264b5b;
}

.icon-cards .icon {
    margin-bottom: 30px;
}

.theme-dark .living-space {
    position: relative;
}

.theme-dark .living-space:after {
    content: '';
}

.theme-dark .spaceHolder {
    position: relative;
}


.theme-dark .spaceHolder:after {
    content: '';
    width: 55vw;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 0px 0px 0px 100px;
    background: #c4ebf3;
    opacity: 0.5;

}

.spaceHolder {
    padding-top: 83px;
}

.spaceHolder .container {
    position: relative;
    z-index: 99;
}


.theme-dark .living-space {
    padding: 119px 0;
}


.get-jobs {
    padding: 89px 0 100px;
    background-color: #f6f3f2;
    position: relative;
}

.jobs-steps {
    position: relative;
    padding: 120px 34px 0;
}

.jobs-steps li {
    max-width: 884px;
    align-items: center;
}

.jobs-steps li .icon img{
    max-width: 100%;
}

.jobs-steps li .elipse {
    width: 70px;
    height: 70px;
    border: solid 10px #51f2a5;
    background-color: #f6f3f2;
    display: inline-flex;
    border-radius: 50%;
    margin: 0 75px;
}

.jobs-steps li .media-body span {
    font-size: 45px;
    font-weight: 300;
    color: #264b5b;
    margin-right: 28px;

}

.jobs-steps li .media-body h4 {
    font-size: 20px;
    font-weight: 900;
    font-stretch: normal;
    line-height: 1.2;
    color: #264b5b;
}

.jobs-steps li .media-body p {
    font-size: 18px;
    font-weight: 300;
    line-height: 1.22;
    color: #264b5b;
}

.jobs-steps .img-holder {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    text-align: center;
    z-index: 1;
}

.jobs-steps ul {
    position: relative;
    z-index: 1;
}

.jobs-steps li:nth-child(2) {
    margin-left: auto;
    flex-direction: row-reverse;
}

.jobs-steps li {
    margin-bottom: 50px;
}

.jobs-steps li:nth-child(2) .d-flex {

    flex-direction: row-reverse;
}

.jobs-steps li:nth-child(2) .d-flex .media-body {
    text-align: right;
}


.jobs-steps li:nth-child(2) .media-body span {
    margin-right: 50px;
    margin-left: 28px;
}

.jobs-steps li:nth-child(2) .elipse {
    margin: 0 12px
}

.get-jobs .title {
    margin-bottom: 57px;
}


.get-jobs .arrow-jobs {
    width: 52%;
    position: absolute;
    bottom: calc(100% - 70px);
}

.arrow-down2 {
    position: absolute;
    left: 50%;
    bottom: -48px;
    transform: translate(-50%, -50%);
    margin-left: 4px;
    z-index: 1;
}

.theme-dark .mauris-homes,
.theme-dark footer {
    background-color: #264B5B;
}

.theme-dark .footer p,
.theme-dark .checkbox-card span a,
.theme-dark .mauris-homes form h4,
.theme-dark .mauris-homes label,
.theme-dark .mauris-homes .title p,
.theme-dark .mauris-homes .title h2 {
    color: #F6F3F2;

}

.theme-dark .quick-links li a,
.theme-dark .mauris-homes .cta-outline-primary {
    color: #F6F3F2;

}

.theme-dark .mauris-homes {
    padding: 131px 0 45px;
}

.get-jobs {
    margin-bottom: -45px;
}

.theme-dark .mauris-homes {
    position: relative;
}

.navbar-brand img{
    height: 54px;
}