
@font-face {
    font-family: AdobeCaslonPro;
    src: url(../../fonts/ACaslonPro-Regular.otf);
    font-weight: normal;
}


.page-template-template-agents-rousseau-homes .ip-banner {
    border: 23px solid #fff;
    border-top: 96px solid #fff;
    border-bottom: 26px solid #fff;
}

    .page-template-template-agents-rousseau-homes .ip-banner canvas {
        height: 412px;
    }

    .page-template-template-agents-rousseau-homes .ip-banner::before {
        background: rgba(0,0,0,0.34);
    }


    .page-template-template-agents-rousseau-homes #inner-page-wrapper .container {
        max-width: 100%;
        width: 100%;
        position: relative;
        z-index: 100;
        padding: 97px 100px 95px;
    }

    .page-template-template-agents-rousseau-homes #breadcrumbs {
        /* display: none; */
        position: absolute;
        bottom: 13px;
        left: 97px;
        color: #fff;
        z-index: 10;
    }

    .page-template-template-agents-rousseau-homes #inner-page-wrapper::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 758px;
        background: url(../../images/common/agents-bg.jpg) no-repeat center / cover;
        filter: grayscale(1);
        opacity: 0.1;
        z-index: 1;
    }
    #inner-page-wrapper{
        z-index: unset;
    }
    .page-template-template-agents-rousseau-homes #inner-page-wrapper::after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100px;
        height: 1076px;
        background: url(../../images/common/red-accent1.jpg) no-repeat center / cover;
        z-index: 2;
    }

    .page-template-template-agents-rousseau-homes .network:before {
        filter: none;
    }

    .page-template-template-agents-rousseau-homes .hpSlider__smis {
        top: 312px;
        opacity: 1;
        bottom: auto;
    }


.custom-agents-main {
    /* display: flex;
    flex-wrap: wrap; */
    position: relative;
}

    .custom-agents-wbg {
        position: relative;
        display: flex;
        flex-wrap: wrap;
        padding: 10px 0 0;
        justify-content: center;
    }

    .custom-agents-main::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 642px;
        background: url(../../images/common/agents-bg1.jpg) no-repeat center / cover;
        z-index: 1;
    }

    .custom-agents-item {
        /* max-width: 280px; */
        width: 20%;
        position: relative;
        padding: 13px 17px 22px;
        z-index: 10;
    }

    .custom-agents-item a {
        display: block;
        width: 100%;
    }



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

    .cai-img canvas {
        position: relative;
        z-index: 1;
    }

    .cai-img img {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 10;
        transition: all .25s ease-in-out;
        -moz-transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
    }

    .custom-agents-item a:hover .cai-img img {
        transform: scale(1.1);
    }

    .cia-name {
        text-align: center;
    }

    .cia-name h2 {
        font-family: AdobeCaslonPro;
        text-transform: uppercase;
        font-weight: 400 !important;
        font-size: 1.250vw !important;
        color: #731d20;
    }

    .custom-load-more-btn a,
    .custom-agents-btn a {
        display: block;
        width: 100%;
        max-width: 320px;
        color: var(--black);
        font-size: 14px;
        letter-spacing: .160em;
        line-height: 1;
        text-align: center;
        text-transform: uppercase;
        border: 1px solid var(--black);
        padding: 1.25vw;
        position: relative;
        transition: all .25s ease-in-out;
        -moz-transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
        margin: auto;
    }
        .custom-load-more-btn a:after,
    .custom-agents-btn a:after {
        position: absolute;
        content: '';
        width: 2.5vw;
        height: 2px;
        background: var(--maroon);
        right: -1.138vw;
        top: 50%;
        transform: translateY(-50%);
        transition: all .25s ease-in-out;
        -moz-transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
    }
    .custom-load-more-btn,
    .custom-agents-btn {
        padding: 27px 15px;
    }
    .custom-load-more-btn a:hover,
    .custom-agents-btn a:hover {
        opacity: 1;
        color: var(--white);
        background: var(--maroon) !important;
        border-color: var(--maroon) !important;
    }
    .custom-load-more-btn a:hover:after,
    .custom-agents-btn a:hover:after {
        background: var(--black);
    }


.custom-agents-wbg .custom-agents-item:nth-child(n+15) ~ div {
    display: none;
}

.custom-agents-wbg.active .custom-agents-item:nth-child(n+15) ~ div {
    display: inline-block;
}



@media only screen and (max-width: 1599px) {
    .cia-name h2 {
        font-size: 17px !important;
    }
}

@media only screen and (max-width: 1499px) {
    .cia-name h2 {
        font-size: 13px !important;
    }
}

@media only screen and (max-width: 1199px) {
    .cia-name h2 {
        font-size: 10px !important;
    }
}

@media only screen and (max-width: 991px) {
    .cia-name h2 {
        font-size: 15px !important;
    }

    .custom-agents-item {
        width: 50%;
    }

    .page-template-template-agents-rousseau-homes .hpSlider__smis {
        display: none;
    }

    .page-template-template-agents-rousseau-homes #breadcrumbs {
        left: 13px;
    }

    .custom-load-more-btn a, .custom-agents-btn a {
        padding: 20px 15px;
    }

    .custom-load-more-btn a:after, .custom-agents-btn a:after {
        width: 30px;
        right: -15px;
    }
}

@media only screen and (max-width: 768px) {
    .custom-agents-item {
        width: 100%;
        max-width: 300px;
    }

    .page-template-template-agents-rousseau-homes #inner-page-wrapper .container {
        padding: 50px 15px;
    }

    .page-template-template-agents-rousseau-homes #inner-page-wrapper::after {
        width: 15px;
    }
}
