/* general */
.header.header {
    display: none;
}

.ip-header {
    display: block;
}

.ip-banner {
    display: none;
}

#breadcrumbs {
    display: block;
}

#inner-page-wrapper {
    margin: 0;
    position: relative;
}

#inner-page-wrapper::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 313px;
    height: 774px;
    background-image: url('../../images/neighborhoods/neigh-logo-accent-bg.png');
    background-repeat: no-repeat;
    background-position: center;
    z-index: -1;
    pointer-events: none;
}

    #inner-page-wrapper > .container {
        width: 100%;
        padding: 0;
    }

    #content-sidebar, 
    #content-full {
        margin: 0;
        padding: 29px 0 0;
    }

    #ip-neighborhoods {
        padding: 55px 0 112px;
    }

        .neigh-top {
            margin-bottom: 7px;
        }

            .site-title-secondary {
                text-align: center;
            }

                .site-title-secondary h3,
                .site-title-secondary h2 {
                    line-height: 1;
                    display: inline-block;
                    position: relative;
                }

                #ip-neighborhoods .site-title-secondary h2::before {
                    left: unset;
                    right: calc(100% + 20px);
                    background: #828282;
                    width: 100vw;

                    display: none !important;
                }

                #content .site-title-secondary h3 {
                    font-weight: 300;
                    margin-bottom: 16px;
                }

                    .title-initial-accent {
                        font-style: normal !important;
                        font-size: 540.5px;
                        position: absolute;
                        top: -206px;
                        left: -316px;
                        display: inline-block;
                        line-height: 1;
                        font-family: var(--font-family-accent);
                        color: #f6f6f6;
                        z-index: -1;
                        opacity: .50;
                    }

            .neigh-list-wrapper {
                max-width: 1392px;
                margin: 0 auto;
                position: relative;
                padding: 55px;
            }

            .neigh-list-wrapper::before, 
            .neigh-list-wrapper::after {
                content: '';
                display: block;
                position: absolute;
                pointer-events: none;
                height: 29.7%;
                width: 27.3%;
            }

            .neigh-list-wrapper::before {
                top: 0;
                left: 0;
                border-left: 13px solid #000;
                border-top: 13px solid #282828;
            }

            .neigh-list-wrapper::after {
                bottom: 0;
                right: 0;
                border-bottom: 13px solid #000;
                border-right: 13px solid #282828;
            }

                .neigh-list {
                    margin: -15px -15px;
                    font-size: 0;
                }

                    .neigh-item {
                        display: inline-block;
                        vertical-align: middle;
                        width: calc(100% / 3);
                        padding: 15px;
                    }


                        .neigh-item a {
                            display: block;
                            position: relative;
                        }

                            .neigh-img {
                                position: relative;
                                overflow: hidden;
                            }

                            .neigh-img::before {
                                content: '';
                                display: block;
                                position: absolute;
                                top: 0;
                                left: 0;
                                width: 100%;
                                height: 100%;
                                z-index: 2;
                                background: #000;
                                opacity: .30;
                                transition: all .4s ease;
                            }

                            a:hover .neigh-img::before {
                                opacity: .40;
                            }

                            .neigh-img::after {
                                content: '';
                                display: block;
                                position: absolute;
                                top: 0;
                                left: 0;
                                width: 100%;
                                height: 100%;
                                z-index: 3;
                                background-image: url('../../images/neighborhoods/neigh-item-overlay.png');
                                background-position: center right;
                                background-size: contain;
                                background-repeat: no-repeat;
                                transition: all .4s ease;
                                transform: translateX(-20px);
                                opacity: 0;
                            }

                            a:hover .neigh-img::after {
                                opacity: 1;
                                transform: translateX(0);
                            }

                                .neigh-img canvas {
                                    display: block;
                                    width: 100%;
                                }

                                .neigh-img img {
                                    display: block;
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    width: 100%;
                                    height: 100%;
                                    object-fit: cover;
                                    transition: all .4s ease;
                                }

                                a:hover .neigh-img img {
                                    transform: scale(1.1);
                                    filter: grayscale(1);
                                }

                        .neigh-item-content {
                            position: absolute;
                            top: 0;
                            left: 0;
                            display: flex;
                            flex-direction: column;
                            width: 100%;
                            height: 100%;
                            padding: 20px 25px;
                            z-index: 5;
                        }

                            .neigh-item-accent {
                                display: flex;
                                flex: 1;
                                flex-direction: column;
                                width: 33px;
                                position: relative;
                                z-index: 2;
                                padding-bottom: 12px;
                                transition: all .4s ease;
                            }

                            a:hover .neigh-item-accent {
                                opacity: 0;
                                transform: translateY(-15px);
                            }

                            .neigh-item-accent::after {
                                content: '';
                                display: block;
                                width: 1px;
                                flex: 1;
                                background-color: #fff;
                                height: 100%;
                                margin: 13px auto 0;
                                opacity: .60;
                            }

                                .icon-key {
                                    display: inline-block;
                                    width: 33px;
                                    height: 61px;
                                    background-image: url('../../images/icon-key.png');
                                    background-position: center right;
                                    background-size: contain;
                                    background-repeat: no-repeat;
                                }

                            .neigh-item-details {

                            }

                            #content .neigh-item-details h3 {
                                font: normal 400 28px/1 var(--font-family-title);
                                text-transform: uppercase;
                                color: #fff;
                            }
                            
                            

  


#content .site-title-primary h2 {
    color: #fff;
}

#content .hp-touch .site-title-primary h2{
    color: #282828;
}

/* media queries */
@media only screen and (max-width: 1199px) { 
    #content .neigh-item-details h3 {
        font-size: 22px;
    } 
}

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

    .title-initial-accent {
        display: none;
    }

    .neigh-item {
        width: 50%;
    }
   
}


@media only screen and (max-width: 767px) { 
   
    .neigh-list-wrapper {
        padding: 0;
    }

    .neigh-list-wrapper::before, .neigh-list-wrapper::after {
        display: none;
    }

    .neigh-list {
        margin: 0;
    }

    .neigh-top {
        margin-bottom: 50px;
    }
    
}

@media only screen and (max-width: 480px) { 
     
    .neigh-item {
        width: 100%;
        padding: 5px;
    }
    
}