/*ADU Summary containers*/
.summary-container {
    max-width: 952px;
    padding: 0 24px;
    margin: auto;
}

.report-body .summary-container {
    max-width: 904px;
}

.build-page.black60-link a:not(.link) {
    color: #6d6d6d !important;
}

.summary {
    margin-bottom: -24px !important;
}

.summarybox {
    overflow: hidden;
}

.flex-col {
    margin: 0 24px 24px;
    padding: 0;
    color: #6d6d6d;
    box-sizing: border-box;
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
}

.flex-col.disabled {
    color: #A8B0F5;
    pointer-events: none;
}

.flex-col .button {
    display: block;
    cursor: pointer;
    text-align: center;
}

.flex-col.disabled .button {
    background-color: #A8B0F5;
}

.flex-col:first-child {
    margin-left: 0;
}

.flex-col:last-child {
    margin-right: 0;
}


.n4 .flex-col {
    flex: calc(25% - 36px);
    max-width: calc(25% - 36px);
}

.n4 .flex-col:nth-child(4n + 1) {
    margin-left: 0;
}

.n4 .flex-col:nth-child(4n) {
    margin-right: 0;
}

.half.n4 .flex-col {
    flex-basis: calc(50% - 24px);
    max-width: calc(50% - 24px);
    margin-bottom: 0;
}

.half.n4 .flex-col:nth-child(2n + 1) {
    margin-left: 0;
}

.half.n4 .flex-col:nth-child(2n) {
    margin-right: 0;
}

.half.n4 .flex-col:nth-child(2n):after {
    width: 0;
}

.n2 .flex-col {
    flex-basis: calc(50% - 24px);
    max-width: calc(50% - 24px);
}

.n2 .flex-col:nth-child(2n + 1) {
    margin-left: 0;
}

.n2 .flex-col:nth-child(2n) {
    margin-right: 0;
}

.n3 .flex-col {
    flex-basis: calc(33.3333334% - 32px);
    max-width: calc(33.3333334% - 32px);
}

.n3 .flex-col:nth-child(3n + 1) {
    margin-left: 0;
}

.n3 .flex-col:nth-child(3n) {
    margin-right: 0;
}

.n1 .flex-col {
    flex-basis: 100%;
    max-width: 100%;
}

.n1 .flex-col {
    max-width: 480px;
}

.flex-col::after {
    content: "";
    background-color: #e2e2e2;
    position: absolute;
    width: 1px;
    height: 100%;
    left: calc(100% + 24px);
    left: -webkit-calc(100% + 24px);
    left: -moz-calc(100% + 24px);
    display: block;
}

.summary > .flex-col::after {
    height: calc(100% + 24px);
    height: -webkit-calc(100% + 24px);
    height: -moz-calc(100% + 24px);
}

.n4 .flex-col:nth-child(4n):after, .n3 .flex-col:nth-child(3n):after, .n2 .flex-col:nth-child(2n):after, .n1 .flex-col:after, .no-border .flex-col:after {
    width: 0;
}

.summary .caption-text1 {
    text-transform: uppercase;
}
.map-note .caption-text1 {
    text-transform: none!important;
}

#costdisclaimer .caption-text1 {
    text-transform: none!important;
}

.summary-container .h3-bold {
    color: #171717;
}

.summary-container .body-text1-bold {
    color: #6d6d6d;
}

.black60-fg {
    color: #6d6d6d!important;
}


/*Generic ADU Report - Nav*/
.summary-nav-link {
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: transparent;
    transition: border-bottom-color 0.3s;
    -webkit-transition: border-bottom-color 0.3s;
    -moz-transition: border-bottom-color 0.3s;
    cursor: pointer;
    height: 64px;
}

.summary-nav-link:hover {
    border-bottom-color: #A95597;
    color: #A95597;
}

.summary-nav-link.active {
    color: #A95597;
    border-bottom-color: #A95597;
}

.summary-small-nav {
    width: 100%;
    padding: 20px 0;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: right 24px center;
    position: relative;
    cursor: pointer;
    margin: 0;
    display: none;
}




/*Increased borders within summary containers*/
.summary-container .border-bottom {
    margin: 0 -24px;
}

/*Generic CSS*/
.bottom {
    margin-top: auto;
}

/*NextSteps*/
.next-steps {
    list-style: none;
    counter-reset: item;
    padding: 0;
    margin: 0 -24px;
}

.next-steps > li {
    position: relative;
    counter-increment: item;
    padding: 24px 0 24px 64px;
}

.next-steps > li:not(:last-child) {
    border-bottom: 1px solid #e2e2e2;
}

.next-steps > li:before {
    position: absolute;
    content: counter(item);
    color: #6d6d6d;
    width: auto;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: left;
    top: 24px;
    left: 24px;

    font-size: 16px;
    letter-spacing: -0.005em; /* 16/3200 */
    line-height: 24px;
    font-weight: 600;
}

.next-steps.steps > li {
    position: relative;
    counter-increment: item;
    padding: 24px 0 24px 64px;
}

.next-steps.steps > li:before {
    position: absolute;
    content: counter(item);
    color: #6d6d6d;
    width: auto;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: left;
    top: 24px;
    left: 24px;
    font-size: 16px;
    letter-spacing: -0.005em;
    line-height: 24px;
    font-weight: 600;
}

/*Process Info*/
.process-heading {
    text-decoration: underline;
}

.process-heading:not(:first-child) {
    margin-top: 8px;
}

li li {
    padding: 8px 0 0 8px;
    list-style-type: upper-roman;
}

li li li {
    padding: 8px 0 0 8px;
    list-style-type: upper-alpha;
}

ul {
    padding: 0 0 0 24px;
}

ul li {
    list-style-type: disc;
}

.restriction {
    padding-right: 24px;
}

.article-container {
    padding-right: 56px;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: right 24px top 4px;
    position: relative;
    cursor: pointer;
    margin: 0;
    padding-left: 0;
}

.steps .article-container {
    padding-right: 24px;
}

.article-content {
    padding-top: 24px;
    padding-right: 56px;
}

.article-container .icon {
    margin-left: 0;
    border-radius: 16px;
    position: absolute;
    right: 24px;
    top: -4px;
    background-image: url(../img/icon/arrow_down.png);
    background-repeat: no-repeat;
    background-size: 16px auto;
    background-position: center;
    height: 32px;
    width: 32px;
    transform: rotate(0deg);
    transition: transform 0.3s;
}

.article-container.expanded .icon {
    transform: rotate(180deg);
}

.article-content > div.content {
    padding: 24px;
}

.next-steps-segment {
    height: 24px;
}

.next-steps-timeline > div:nth-child(1) {
    width: calc(72 / 856 * 100%);
    width: -webkit-calc(72 / 856 * 100%);
    width: -moz-calc(72 / 856 * 100%);
}

.next-steps-timeline > div:nth-child(2) {
    width: calc(144 / 856 * 100%);
    width: -webkit-calc(144 / 856 * 100%);
    width: -moz-calc(144 / 856 * 100%);
}

.next-steps-timeline > div:nth-child(3) {
    width: calc(216 / 856 * 100%);
    width: -webkit-calc(216 / 856 * 100%);
    width: -moz-calc(216 / 856 * 100%);
}

.next-steps-timeline > div:nth-child(4) {
    width: calc(416 / 856 * 100%);
    width: -webkit-calc(416 / 856 * 100%);
    width: -moz-calc(416 / 856 * 100%);
}

.next-steps-timeline > div:nth-child(5) {
    width: calc(8 / 856 * 100%);
    width: -webkit-calc(8 / 856 * 100%);
    width: -moz-calc(8 / 856 * 100%);
}




/*calculator - changed CSS*/

dim, sketch {
    display: block;
}

dim {
    margin-top: 8px;
}

dim > div, dim > input, .dim input {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: 0;
    background: transparent;
    padding: 0 8px;
    height: 36px;
    font-size: 16px;
    line-height: 24px;
    color: #6d6d6d;
    border: 1px solid #e2e2e2;;
    width: 100%;
}

.sqft-div {
    padding-right: 58px !important;
    padding-left: 18px !important;
}

.area-div {
    padding-right: 40px !important;
}

.per-sqft {
    position: absolute;
    right: 8px;
    top: 6px;
}

.cost-symbol {
    position: absolute;
    left: 8px;
    top: 6px;
}

dim > div {
    display: inline-flex;
    align-items: center;
}

.dim select {
    appearance: none;
    padding-left: 8px;
    -webkit-appearance: none;
    background-image: url(../img/icon/drop_down.png);
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 10px 5px;
    border: 1px solid #e2e2e2;
    background-color: #FFFFFF;
    font-size: 16px;
    line-height: 24px;
    color: #6d6d6d;
    width: 100%;
    height: 40px;
    outline: 0;
    border-radius: 0;
}

/*Property Image*/
.property-image {
    height: 360px;
    position: relative;
}

.property-image.satellite {
    height: 240px;
}

.property-image, .adustatus {
    min-width: 216px;
}

.property-image > * {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.property-image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999999;
    background-color: transparent;
}

#moreeligibilitytext:not(:empty) {
    margin-top: 8px;
}

/*map*/
.status-map {
    height: 360px;
    width: calc(100% + 48px);
    width: -webkit-calc(100% + 48px);
    width: -moz-calc(100% + 48px);
    margin: 0 -24px;
    position: relative;
}

/*general*/
.sticks-at-top {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 9999;
}

.project-specification-block {
    min-width: 172px !important;
    max-width: 100% !important;
}

/*Design*/
.project-image {
    object-position: top;
    object-fit: contain;
    max-width: 100%;
}

/*Standards*/
.design-standard {
    padding: 24px 0;
}

.consideration {
    padding: 24px 0 24px 24px;
    margin: 0 -24px;
    border-top: 1px solid #e2e2e2;
}

.consideration .article-content {
    padding-right: 24px;
}

.learnmore {
    margin-top: 16px;
}

.learnmore-content {
    padding-top: 24px;
}

@media (max-width: 960px) {
    .n4 .flex-col {
        flex-basis: calc(50% - 24px);
        max-width: calc(50% - 24px);
    }

    .n4 .flex-col:nth-child(2n+1) {
        margin-left: 0;
    }

    .n4 .flex-col:nth-child(2n) {
        margin-right: 0;
    }

    .n4 .flex-col:nth-child(2n):after {
        width: 0;
    }

    .half.n4 .flex-col {
        flex-basis: 100%;
        max-width: 100%;
        margin: 0 0 24px;
    }

    .half.n4 .flex-col:after {
        width: 0;
    }

    #summary .summarybox .flex-col:not(:nth-child(4n)):not(:nth-child(4n-1)) {
        margin-bottom: 72px;
    }
}

@media (max-width: 768px) {
    .summary-small-nav {
        display: flex;
        display: -webkit-flex;
    }

    .summary-reg-nav {
        display: none;
    }

    .timeline {
        display: none;
    }
}


@media (max-width: 720px) {
    .n3 .flex-col {
        flex-basis: 100%;
        max-width: 100%;
        margin: 0 0 24px;
    }

    .n3 .flex-col:after {
        width: 0;
    }
}

@media (max-width: 480px) {
    #summary .summarybox .flex-col:not(:last-child) {
        border-bottom: 1px solid #DCDFFB;
        padding-bottom: 36px;
        margin-bottom: 36px!important;
    }

    .n4 .flex-col, .n2 .flex-col {
        flex-basis: 100%;
        max-width: 100%;
        margin: 0 0 24px;
    }

    .n4 .flex-col:after, .n2 .flex-col:after {
        width: 0;
    }
}

.blue10-bg {
    background-color: #F5F7F6!important;
}
.blue2-bg {
    background-color: white!important;
}