﻿.place-fences h3 {
    margin: 0;
}

.place-fences .inner .place-fences-instructions {
    margin: 25px 0;
    font-size: 13px;
}

    .place-fences .inner .place-fences-instructions .heading {
        font-weight: bold;
        margin-bottom: 10px;
    }

    .place-fences .inner .place-fences-instructions .body {
        margin-left: 5px;
        color: #848484;
    }

    .place-fences .inner .place-fences-instructions .body > div {
        margin-bottom: 10px;
    }

    .place-fences .inner .place-fences-instructions .main {
        color: #000;
        font-weight: bold;
    }

    .place-fences .inner .place-fences-instructions .accent {
        color: #5e0d06;
    }

    .place-fences .inner .house-size-container {
        margin-top: 10px;
    }

.house-info {
    padding-bottom: 10px;
}

    .house-info .line-container {
        display: inline-block;
    }

    .house-info .house-item .bubble {
        height: 24px;
        width: 24px;
        margin: 0 10px 0 0;
        background: #5b5b5b;
        color: #fff;
        border-radius: 50%;
        display: inline-block;
        font-size: 15px;
        line-height: 15px;
        font-weight: 700;
        padding-top: 4px;
        text-align: center;
    }

    .house-info .house-item .house-area {
        font-size: large;
    }

.place-fences .fence-info {
    padding-bottom: 25px;
}

.place-fences .example {
    font-size: 12px;
    color: #a8a8a8;
    font-style: italic;
    display: block;
    padding-bottom: 5px;
}

.place-fences .fence-item {
    border-bottom: 1px solid #d6d6d6;
    padding-bottom: 20px;
    margin-bottom: 20px;
    opacity: 1;
    transition: opacity 200ms linear;
}

    .place-fences .fence-item .line-containter {
        display: inline-block;
    }

    .place-fences .fence-item .counter {
        height: 24px;
        width: 24px;
        margin: 0 10px 0 0;
        background: #5b5b5b;
        color: #fff;
        border-radius: 50%;
        display: inline-block;
        font-size: 15px;
        line-height: 15px;
        font-weight: 700;
        padding-top: 4px;
        text-align: center;
    }

.place-fences.editing .fence-item:not(.editing) {
    opacity: 0.35;
}

.place-fences .fence-item .fence-length {
    font-size: large;
}

.place-fences .fence-item .cost-estimate,
.place-fences .fence-item .editing-status,
.place-fences .fence-item .fence-length {
    line-height: 24px;
}

.place-fences .fence-item .fence-length {
    font-weight: bold;
}

.place-fences .fence-item .cost-estimate {
    font-size: 14px;
    font-weight: bold;
    color: #5e0d0d;
}

.place-fences .fence-item .editing-status {
    display: none;
    font-size: 14px;
    font-style: italic;
    font-weight: 600;
    color: #5e0d06;
}

.place-fences .fence-item.editing .cost-estimate {
    display: none;
}

.place-fences .fence-item.editing .editing-status {
    display: block;
}

.place-fences .fence-item .gate-info,
.place-fences .fence-item .catalog-info {
    margin-left: 34px;
    color: #848484;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .place-fences .fence-item .catalog-info.not-selected {
        font-style: italic;
        font-weight: 600;
        color: #5e0d06;
    }

.place-fences .fence-item .actions {
    padding: 10px 0 0 34px;
    position: relative;
}

    .place-fences .fence-item .actions.disabled {
        opacity: 0.5;
        pointer-events: none;
    }

.place-fences .fence-item .edit-catalog {
    margin-left: 6px;
}

.place-fences .fence-item button.delete {
    padding: 0;
}

.place-fences .delete-confirm-wrapper {
        position: absolute;
        left: 0;
        right: -10px;
        bottom: -5px;
        background: rgba(244,244,244,0);
        color: #fff;
        font-size: 14px;
        visibility: collapse;
        transition: background 150ms linear;
        overflow: hidden;
    }

    .place-fences .delete-confirm-wrapper .delete-confirm {
        float: right;
        padding: 5px 20px;
        background: #AA180B;
        height: 100%;
        opacity: 0;
        left: 80%;
        position: relative;
        transition: opacity 250ms linear, left 150ms cubic-bezier(0.215, 0.61, 0.355, 1);
        border-radius: 10px 0 0 10px;
    }

    .place-fences .delete-confirm-wrapper a {
        color: #fff;
        font-size: 14px;
    }

    .place-fences .delete-confirm-wrapper button {
        padding: 0 10px;
        margin-top: 2px;
        margin: 2px 10px 0;
    }

    .place-fences .delete-confirm-wrapper.visible {
        background: rgba(244,244,244,0.8);
        visibility: visible;
    }

        .place-fences .delete-confirm-wrapper.visible .delete-confirm {
            left: 0;
            opacity: 1;
        }

.place-fences .total-estimate {
    color: #5e0d0d;
    font-size: 18px;
    font-weight: bold;
    margin-left: 5px;
}

.place-fences .fence-removal-link {
    color: #5e0d0d;
    font-weight: bold;
}

.place-fences .fence-removal-estimate {
    color: #5e0d0d;
    font-weight: bold;
    font-size: 14px;
}

.place-fences .delete-fence-removal {
    float: right;
    font-weight: none;
    font-size: 13px;
    color: #AA180B;
}

.place-fences .fence-removal-section {
    margin-bottom: 5px;
}

.place-fences .computed-address {
    font-size: large;
}

.place-fences .inner {
    opacity: 1;
    transition: opacity 200ms linear;
}

.place-fences .inner.faded {
    opacity: 0.25;
}

.place-fences .financing-wrapper {
    margin-top: 45px;
}


@media (min-width: 768px) {
    .place-fences .nav-bar.fixed {
        width: 400px;
    }
}

.ad-campaign-container {
    margin-top: 20px;
    text-align: center;
}

    .ad-campaign-container img {
        max-height: 350px;
        max-width: 350px;
    }

    .ad-campaign-container .ad-campaign-adtext {
        margin-top: 5px;
    }

.blank-canvas-exit {
    background: none !important;
    border: none;
    padding: 0 !important;
    color: #5e0d06;
    cursor: pointer;
    border-radius: 0;
    text-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
    .blank-canvas-exit:hover,
    .blank-canvas-exit:focus,
    .blank-canvas-exit:active,
    .blank-canvas-exit:focus:active {
        background-image: none;
        outline: none;
        border-radius: 0;
        border: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    } 