/*
Theme Name: joyhomesok.com
Description: AIOS mobile semi-custom theme.
Author: AgentImage
Author URI: http://www.agentimage.com
Version: 1.6.1
Tags: one-column, two-columns, right-sidebar, custom-menu, full-width-template, sticky-post
License: Proprietary
License URI: http://www.agentimage.com
Template: aios-starter-theme
*/

/*

TABLE OF CONTENTS

1. Variables
2. Custom CSS
3. IP styles
4. MEDIA QUERIES ARE AUTOMATICALLY REMOVED FROM THIS FILE, they must be placed in style-media-queries.css

*/

/*******************************************************
 *
 * 1. Variables
 *
 *******************************************************/

:root {
    /** Font default */
    --font-family-default: 'Quicksand', sans-serif;
    --font-family-title: 'EB Garamond', serif;
    --font-family-accent: 'Bodoni Moda', serif; 
    --font-size-default: 16px;
    --font-size-title: 18px;
    --font-color-default: #000000;
    --font-color-title: #6c757d;

    /** Use for input, button, and any other element */
    --primary: #8b181f;
    --secondary: #000;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --default-transition: .3s cubic-bezier(.4, 0, .2, 1);
    --transition-linear: .3s linear;
    --transition-image-filter: filter var(--transition-linear);
    --transition-opacity: opacity var(--transition-linear);
    --transition-color: color var(--transition-linear);
    --transition-background-color: background-color var(--transition-linear);
    --transition-all: all var(--transition-linear);
    --transition-border: border var(--transition-linear);
    --transition: all 0.4s ease-in-out;
}
.object-fit-cover {
    object-fit: cover;
}

.object-position-center {
    object-position: center;
}

.object-position-left {
    object-position: left;
}

.object-position-top {
    object-position: top;
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.inline {
    display: inline
}

.flex {
    display: flex
}

.inline-flex {
    display: inline-flex
}

.table {
    display: table
}

.inline-table {
    display: inline-table
}

.inline-flex {
    display: inline-flex;
}

.flex-row {
    flex-direction: row;
}

.flex-col {
    flex-direction: column;
}

.content-center {
    align-content: center
}

.content-start {
    align-content: flex-start
}

.content-end {
    align-content: flex-end
}

.content-between {
    align-content: space-between
}

.content-around {
    align-content: space-around
}

.content-evenly {
    align-content: space-evenly
}

.items-start {
    align-items: flex-start
}

.items-end {
    align-items: flex-end
}

.items-center {
    align-items: center
}

.items-baseline {
    align-items: baseline
}

.items-stretch {
    align-items: stretch
}

.justify-start {
    justify-content: flex-start
}

.justify-end {
    justify-content: flex-end
}

.justify-center {
    justify-content: center
}

.justify-between {
    justify-content: space-between
}

.justify-around {
    justify-content: space-around
}

.justify-evenly {
    justify-content: space-evenly
}

.justify-items-start {
    justify-items: start
}

.justify-items-end {
    justify-items: end
}

.justify-items-center {
    justify-items: center
}

.justify-items-stretch {
    justify-items: stretch
}

.flex-wrap-wrap {
    flex-wrap: wrap;
}

.flex-wrap-nowrap {
    flex-wrap: nowrap;
}

.flex-width-auto {
    flex-basis: 0;
    flex-grow: 1;
}

.flex-grow-1 {
    flex-grow: 1;
}

.static {
    position: static
}

.fixed {
    position: fixed
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.sticky {
    position: sticky
}

.mt-15 {
    margin-top: max(0.938vw, 15px);
}

.w-100 {
    width: 100%;
}

.w-50 {
    width: 50%;
}

.h-100 {
    height: 100%;
}

.h-auto {
    height: auto;
}

.m-center {
    margin: 0 auto;
}

.overflow-hidden {
    overflow: hidden;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

#main-wrapper {
    overflow: hidden;
}

/*******************************************************
 *
 * 3. Custom CSS
 *
 *******************************************************/

/* Global */

body{
	font-family: var(--font-family-default);
	font-size: var(--font-size-default);
	background: #FFFFFF;
	color: var(--font-color-default);
	margin: 0;
    font-weight: 400;

    /* Remove the comment from line 85 to 86 if the font issue in safari occurs */
    /* -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; */
}


.splide__arrow{
    width: max(3.563vw, 57px) !important;
    height: max(3.188vw, 51px) !important;
    border: 1px solid #777777 !important;
    border-radius: 0 !important;
    background: transparent !important;
    opacity: 1 !important;
    transition: var(--transition);
}
    .splide__arrow:hover{
        background: var(--primary) !important;
        border-color: var(--primary) !important;
    }
.splide__arrow svg{
    fill: var(--primary) !important;
    width: max(0.813vw, 13px) !important;
    transition: var(--transition);
}
    .splide__arrow:hover svg{
        fill: #fff !important;
    }

.default-button{
    
}
    .default-button a{
        height: 56px;
        display: inline-block;
        color: #fff;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        font-weight: 500;
        font-size: max(0.813vw, 13px);
        position: relative;
        z-index: 10;
        pointer-events: auto;
    }
        .default-button a::before{
            display: block;
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background: url(images/pattern-black.jpg) no-repeat 0 0 transparent;
            background-size: cover;
        }
            .default-button.default-button-border a::before{
                background: none;
                border: 1px solid #fff;
            }
        .default-button a::after {
            display: block;
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background: url(images/pattern-red.jpg) no-repeat 0 0 transparent;
            background-size: cover;
            opacity: 0;
            transition: var(--transition);
        }
            .default-button a:hover::after{
                opacity: 1;
            }
        .default-button a span{
            position: relative;
            z-index: 10;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
            padding: 0 60px;
        }
    .default-title{

    }
        .default-title h2{

        }
            .default-title h2 em{
                text-transform: uppercase;
                font-size: max(1.125vw, 18px);
                color: #777777;
                font-weight: 400;
                line-height: 1.7;
                letter-spacing: 0.6em;
                font-style: normal;
                display: block;
            }
            .default-title h2 span{
                font-size: max(5.625vw, 60px);
                color: #000;
                line-height: 1;
                letter-spacing: 0.15em;
                font-family: var(--font-family-title);
                padding-left: 31px;
                text-transform: uppercase;
                position: relative;
            }
                .default-title.text-center h2 span,
                .default-title.no-padding h2 span{
                    padding-left: 0;
                }
        .default-title.has-line h2 span{
            padding-bottom: max(3.250vw, 52px);   
        }
            .default-title.has-line h2 span::after {
                display: block;
                content: "";
                background: var(--primary);
                width: 2000px;
                height: 2px;
                position: absolute;
                bottom:0;
            }
                .default-title.has-line-left h2 span::after{
                    left: 3%;
                }
                .default-title.has-line-right h2 span::after {
                    right: 3%;
                }
.accent-bg{
    width: 34.688vw;
    background: url(images/accent-bg.jpg) no-repeat top right transparent;
    background-size: cover;
    height: 25.125vw;
    z-index: 5;
}

    .accent-bg.accent-reverse{
        background: url(images/accent-bg-reverse.jpg) no-repeat top right transparent;
        background-size: cover;
    }
    .bottom-left{
        bottom: 0;
        left: 0;
    }
    .bottom-right{
        bottom: 0;
        right: 0;
    }
    .top-left{
        top: 0;
        left: 0;
    }
    .top-right {
        top: 0;
        right: 0;
    }
.accent-letter{
    color: #e6e6e6;
    font-size: max(33.563vw, 537px);
    font-family: var(--font-family-accent);
    line-height: 0.7;
    z-index: 5;
}
    .accent-letter::after{
        display: block;
        content: "";
        background: var(--primary);
        width: 100%;
        height: 2px;
        position: absolute;
        right: 10vw;
        top: 8vw;
    }
    .accent-letter.no-line::after{
        display: none;
    }

/* Global Form */
.cc_form_row{
    padding: 17px 0;
    margin: 0 -10px;
}
    .cc_form_row .cc_form_col{
        padding: 0 10px;
    }
        .cc_form_row .cc_form_col label{
            display: none;
        }
           
           
       .cc_form_row .cc_form_col input{
            height: 67px;
            width: 100%;
            background: transparent;
            border: none;
            border-bottom: 1px solid #a6a6a6;
            color: #ffffff;
            letter-spacing: 0.15em;
            font-size: max(0.875vw, 14px);
            outline: none;
        }
        .cc_form_row .cc_form_col.cc_textarea{
            padding-top: 25px;
        }
        .cc_form_row .cc_form_col textarea {
            height: 111px;
            width: 100%;
            background: transparent;
            border: none;
            border-bottom: 1px solid #a6a6a6;
            color: #ffffff;
            letter-spacing: 0.2em;
            letter-spacing: 0.15em;
            font-size: max(0.875vw, 14px);
            outline: none;
            resize: none;
        }
    .cc_form_col .cf-button{
        width: 100%;
        max-width: 257px;
        margin-top: max(2.063vw, 33px);
    }

        .cc_form_col .cf-button::after{
            display: block;
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background: url(images/pattern-black.jpg) no-repeat 0 0 transparent;
            background-size: cover;
            border: 1px solid rgba(119, 119, 119, 0.612);
            z-index: 2;
        }

        .cc_form_col .cf-button::before {
            display: block;
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background: url(images/pattern-red.jpg) no-repeat 0 0 transparent;
            background-size: cover;
            opacity: 0;
            transition: var(--transition);
            z-index: 3;
        }
            .cc_form_col .cf-button:hover::before{
                opacity: 1;
            }
        .cc_form_col .cf-button input{
            width: 100%;
            height: 51px;
            background: transparent;
            border: none;
            color: #fff;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            font-weight: 500;
            font-size: max(0.813vw, 13px);
            position: relative;
            z-index: 10;
        }

        .cc_form_col .cf-button span{
            position: absolute;
        }
       
    .cc_form_row .wpcf7-not-valid-tip {
        position: absolute;
        left: 0;
        width: 100% !important;
        text-align: right;
        height: auto;
        background: transparent;
        border: 0;
        top: 50%;
        font-size: 10px;
        white-space: nowrap;
        font-weight: 300;
        color: #ff0404;;
        transform: translate(0, -50%);
    }

    .cc_form_row input.wpcf7-not-valid {
        border-color: #ff0404;
        color: #ff0404;
    }

    .wpcf7 form .wpcf7-response-output {
        font-size: 13px;
        text-align: center;
        padding: 1vw;
        padding: 10px 5px;
        /*color: #fff;*/
        width: 100%;
    }

    .hp-contact-form .wpcf7 form .wpcf7-response-output{
        color: #fff;
    }
/* Globals */
/* Burger Nav */
.burger-menu-container{
    z-index: 20;
    top: 0;
    right: -100%;
    visibility: hidden;
    transition: var(--transition);
}

    .burger-menu-container .accent-logo {
        max-width: 463px;
        bottom: 50px;
        right: 50px;
        z-index: 10;
        padding-left: 50px;
    }
        .burger-menu-container .accent-logo img{
            filter: brightness(0);
            opacity: 0.1;
        }
    

    .mCSB_scrollTools .mCSB_draggerRail{
        background: var(--primary) !important;
    }

    .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
        background: #000 !important;
    }
    .burger-menu-wrap{
        max-width: 713px;
        /*width: 47%;*/
        width: calc(100% - 20px);
        height: 100%;
        background: #fff;
        position: absolute !important;
        right: 0;
        padding-left: 4%;
        padding-right: 3%;
        padding-top: 160px;
        position: relative;
        z-index: 11;
    }
        .burgermenu{
            position: relative;
            z-index: 12;
        }
        
        .burger-menu-container .menu-nav-container{
            display: flex;
            justify-content: space-between;
        }
        .burger-menu-container .burger-nav{
            padding: 0 4%;
        }
            .burger-menu-container .burger-nav li{
                padding: 45px 0;
            }
                .burger-menu-container .burger-nav li a{
                    font-family: var(--font-family-title);
                    letter-spacing: 0.15em;
                    color: #000000;
                    font-size: 24px;
                    text-transform: uppercase;
                    font-weight: 400;
                    transition: var(--transition);
                }

                    .burger-menu-container .burger-nav > li:hover > a{
                        color: var(--primary);
                    }
                .burger-menu-container .burger-nav li ul{
                    padding-top: 32px;
                }
                    .burger-menu-container .burger-nav li ul li{
                        padding: 8.5px 0;
                    }
                        .burger-menu-container .burger-nav li ul li a{
                            font-family: var(--font-family-default);
                            font-weight: 400;
                            text-transform: uppercase;
                            font-size: 15px;
                            color: #8b8b8b;
                            letter-spacing: 0.05em;
                        }
                            .burger-menu-container .burger-nav li ul li:hover a{
                                color: var(--primary);
                            }
/* Burger Nav */
/* Header */
.header{
    z-index: 1001;
    padding: 49px 0;
    transition: var(--transition);
    top: 0;
    left: 0;
    opacity: 0;
}
    .site-loaded .header{
        opacity: 1;
    }
    .header.fh-show{
        background: #fff;
        padding-top: 23px;
        padding-bottom: 23px;
    }
    /* .burger-nav-open .header {
        background: transparent;
    } */
    .header .navigation .menu-nav-container {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
    }
    /* Logo */
    .header .logo{
        max-width: min(15.688vw,251px);
        margin: 0 min(2.813vw,45px);
    }
        .header .logo img{
            transition: var(--transition);
            filter: brightness(0) invert(1);
            height: auto;
        }
            .header.fh-show .logo img{
                filter: brightness(1) invert(0);
            }
    /* Logo */
    /* Nav */
    .header .navigation {
        transition: var(--transition);
        width: 1380px;
        margin: 0 auto;
        max-width: calc(100% - 80px);
    }
    /* .burger-nav-open .header .navigation{
        visibility: hidden;
        opacity: 0;
    } */
    .header .nav{

    }
        .header .nav li{
            position: relative;
            padding: 0 min(1.250vw,20px);
        }
            .header .nav li:first-child{
                padding-left: 0;
            }
            .header .nav li:last-child{
                padding-right: 0;
            }
            .header .nav li a{
                font-size: min(0.813vw,13px);
                text-transform: uppercase;
                color: #fff;
                letter-spacing: 0.1em;
                background: transparent;
                display: block;
                padding: 14px 0;
                font-weight: 500;
            }
                .header .nav li a em{
                    font-style: normal;
                    position: relative;
                    z-index: 10;
                }
                .header.fh-show .nav li a{
                    color: #6a6a6a;
                }

                .header .nav > li:hover > a{
                    opacity: .7;
                }


            /* Sub Menu */
            .header .nav  .sub-menu {
                list-style: none outside none;
                margin: 0;
                padding: 0;
                position: absolute;
                width: 100%;
                text-align: center;
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
                -webkit-transform: translate(0, 10px);
                -ms-transform: translate(0, 10px);
                transform: translate(0, 10px);
                -webkit-transition: opacity .3s, visibility, .3s, -webkit-transform .3s;
                transition: opacity .3s, visibility, .3s, -webkit-transform .3s;
                -o-transition: transform .3s, opacity .3s, visibility, .3s;
                transition: transform .3s, opacity .3s, visibility, .3s;
                transition: transform .3s, opacity .3s, visibility, .3s, -webkit-transform .3s;
                padding-top: 5.5px;
                min-width: 217px;
            }

            .header.fh-show .nav .sub-menu {
                padding-top: 35px;
            }

            .header .nav  .sub-menu li:first-child {
                margin-top: 0;
            }

            .header .nav >li>.sub-menu {
                left: 50%;
                display: block;
                -webkit-transform: translate(-50%, 10px);
                -ms-transform: translate(-50%, 10px);
                transform: translate(-50%, 10px);
            }

            .header .nav  .sub-menu li {
                display: block;
                padding: 0;
                transition: var(--transition);
            }

            .header .nav  .sub-menu a {
                color: #fff;
                display: block;
                font-size: max(0.813vw, 13px);
                line-height: 1.8;
                letter-spacing: 0.05em;
                transition: var(--transition);
                margin: 0;
                background-color: #000;
            }
                .header.fh-show .nav .sub-menu a{
                    color: #fff;
                }

            .header .nav  .sub-menu a::after {
                display: block;
                content: "";
                width: 100%;
                height: 100%;
                position: absolute;
                left: 0;
                top: 0;
                background: url(images/pattern-red.jpg) no-repeat 0 0 transparent;
                background-size: cover;
                z-index: 1;
                opacity: 0;
                transition: var(--transition);
            }

            .header .nav  .sub-menu li:hover>a::after {
                opacity: 1;
            }

            .header .nav  .sub-menu .sub-menu {
                margin-left: 100%;
                top: 0;
                padding: 0 0 0 1%;
            }

            .header .nav  li:hover>.sub-menu {
                opacity: 1;
                visibility: visible;
                pointer-events: all;
                -webkit-transform: translate(0, 0);
                -ms-transform: translate(0, 0);
                transform: translate(0, 0);
            }

            .header .nav >li:hover>.sub-menu {
                -webkit-transform: translate(-50%, 0);
                -ms-transform: translate(-50%, 0);
                transform: translate(-50%, 0);
            }

            .header .nav  .sub-menu li {
                position: relative;
                z-index: 1;
            }

            .header .nav  .sub-menu .sub-menu li a {
                color: #fff;
            }

            .header .nav  .sub-menu .sub-menu li:hover a {
                color: #fff;
            }
    /* Nav */
    /* Menu Toggler */
    .menu-toggler {
        width: 34px;
        height: 19px;
        right: min(3.75vw,60px);
        top: 70px;
        z-index: 999;
        cursor: pointer;
        transition: var(--transition);
    }
        header.fh-show .menu-toggler{
            top: 41px;
        }

    .menu-toggler span {
        display: block;
        position: absolute;
        height: 3px;
        width: 50%;
        background: #fff;
        opacity: 1;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        transition: var(--transition);
    }

        .menu-toggler.open span,
        .header.fh-show span,
        .burger-nav-open .header span{
            background: var(--primary);
        }
    .menu-toggler span:nth-child(even) {
        left: 50%;
    }

    .menu-toggler span:nth-child(odd) {
        left: 0px;
    }

    .menu-toggler span:nth-child(1),
    .menu-toggler span:nth-child(2) {
        top: 0px;
    }

    .menu-toggler span:nth-child(3),
    .menu-toggler span:nth-child(4) {
        top: 8px;
    }

    .menu-toggler span:nth-child(5),
    .menu-toggler span:nth-child(6) {
        top: 16px;
    }

    .menu-toggler.open span:nth-child(1),
    .menu-toggler.open span:nth-child(6) {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .menu-toggler.open span:nth-child(2),
    .menu-toggler.open span:nth-child(5) {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .menu-toggler.open span:nth-child(1) {
            left: -1px;
            top: 5px;
    }

    .menu-toggler.open span:nth-child(2) {
        left: calc(50% - 6px);
        top: 4px;
    }

    .menu-toggler.open span:nth-child(3) {
        left: -50%;
        opacity: 0;
    }

    .menu-toggler.open span:nth-child(4) {
        left: 100%;
        opacity: 0;
    }

    .menu-toggler.open span:nth-child(5) {
        left: -1px;
        top: 16px;
    }

    .menu-toggler.open span:nth-child(6) {
        left: calc(50% - 6px);
        top: 17px;
    }
    /* Menu Toggler */
/* Header */
/* Hero */
.hero{
    position: relative;
    padding: .62%;
    overflow: hidden;
    pointer-events: none;
}
    /* Slideshow */
    .hero .slideshow{
        z-index: 1;
        pointer-events: none;
    }
        .hero .slideshow::after,
        .hero .slideshow::before{
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
        }
            .hero .slideshow::after{
                z-index: 5;
                background-color: rgba(0, 0, 0, 0.4);
            }
            .hero .slideshow::before{
                background: url(images/slideoverlay.png) repeat-x top left transparent;
                z-index: 4;
            }
                
    /* Slideshow */
    /* Slide Content */
    .hero .slide-content{
        top: 0;
        left: 0;
        z-index: 10;
        pointer-events: none;
    }
        .hero .slide-content h2{
            color: #fff;
            text-transform: uppercase;
            margin-bottom: 22px;
        }
            .hero .slide-content h2 em{
                font-style: normal;
                font-weight: 500;
                font-size: max(1vw, 14px);
                letter-spacing: 0.1em;
            }
            .hero .slide-content h2 span{
                font-family: var(--font-family-title);
                letter-spacing: 0.15em;
                font-size: max(1.875vw, 22px);
                line-height: 2;
            }    
    /* Slide Content */
    /* Floating Smi */
    .hero .floating-smi{
        right: 0;
        z-index: 10;
        top: 0;
        margin-right: -16px;
        pointer-events: none;
    }
        .hero .floating-smi::after{
            display: block;
            content: "";
            width: 2px;
            height: 91px;
            margin-top: 20px;
            background: #fff;
        }
        .hero .floating-smi h2{
            color: #fff;
            -moz-transform: matrix(0, -1, 1, 0, 0, 0);
            -webkit-transform: matrix(0, -1, 1, 0, 0, 0);
            -ms-transform: matrix(0, -1, 1, 0, 0, 0);
            font-size: 13px;
            letter-spacing: 0.35em;
        }

        .hero .floating-smi .smi{
            margin-top: 76px;
        }
            .hero .floating-smi .smi a{
                color: #fff;
                font-size: 0;
                margin: 10px 0;
                transition: var(--transition);
                pointer-events: auto;
            }
                .hero .floating-smi .smi a i{
                    font-size: 20px;
                }
                    .hero .floating-smi .smi a:hover{
                        color: var(--primary);
                    }

    /* Floating Smi */
/* Hero */
/* About */
.hp-about{
    padding-top: max(4.938vw, 79px);
    padding-bottom: max(4.938vw, 79px);
    padding-left: 14.375vw;
}
    .hp-about .accent-letter{
        top: 3.750vw;
        right: .62%;
        pointer-events: none;
    }
    .hp-about .about-wrapper{
        z-index: 12;
    }
        /* Image */
        .hp-about .about-image{
            width: 32vw;
        }
        .hp-about .about-image img {
            height: auto;
        }
        /* Image */
        /* Content */
        .hp-about .about-content{
            width: 33.438vw;
            margin-left: 5.313vw;
            padding-top: 12.5vw;
        }
            .hp-about .about-content .default-title{
                padding-bottom: max(3.125vw, 50px);
            }
            .hp-about .about-content p{
                font-size: max(0.938vw, 15px);
                line-height: 2;
                letter-spacing: 0.05em;
            }

            .hp-about .about-content .default-button{
                margin-top: 64px;
            }

        /* Content */
/* About */
/* Meet the Team */
.hp-meet-the-team{
    margin-top: max(6.438vw, 103px);
    padding: max(2.875vw, 46px) 0;
}

    .hp-meet-the-team::after{
        display: block;
        width: 100%;
        height: 80%;
        content: "";
        position: absolute;
        left:  0;
        top: 0;
        background: #fafafa;
        z-index: 2;
    }
    .hp-meet-the-team .accent-bg.bottom-left{
        width: 11.563vw;
    }

    .hp-meet-the-team .accent-letter {
        width: 25%;
        top: 2vw;
    }
        .hp-meet-the-team .accent-letter::after{
            right: 14vw;
            top: 12vw;
        }
    .hp-meet-the-team .hp-meet-team-wrap{
        z-index: 10;
    }
        .hp-meet-the-team .hp-teams{
            padding: max(4.688vw, 75px) 0.406vw 0;
            
        }
            .hp-meet-the-team .hp-team{
                width: calc(100% / 4);
                padding: 0 0.406vw;
            }
                .hp-meet-the-team .hp-team a{
                    text-align: center;
                    color: #000;
                }
                    .hp-meet-the-team .hp-team a .team-img{

                    }
                        .hp-meet-the-team .hp-team a .team-img img{
                            top: 0;
                            left: 0;
                            filter: grayscale(1);
                            transition: var(--transition);
                        }
                            .hp-meet-the-team .hp-team a:hover .team-img img{
                                filter: grayscale(0);
                            }
                    .hp-meet-the-team .hp-team a h4{
                        font-size: max(1.625vw, 26px);
                        line-height: 1.2;
                        letter-spacing: 0.25em;
                        font-family: var(--font-family-title);
                        text-transform: uppercase;
                        padding-top: max(2vw, 32px);
                    }
                    .hp-meet-the-team .hp-team a span{
                        color: #777777;
                        line-height: 2.3;
                        letter-spacing: 0.15em;
                        font-size: max(0.813vw, 13px);
                        text-transform: uppercase;
                    }

/* Meet the Team */
/* Testimonials */
.hp-testimonials{
    padding-top: max(3.875vw, 62px);
    z-index: 12;
}

    .hp-testimonials::after{
        display: block;
        content: "";
        width: 100%;
        height: calc(100% - 15vw);
        position: absolute;
        left: 0;
        top: 11vw;
        background-color: #fafafa;
    }
    .hp-testimonials .accent-bg.top-right{
        top: 11.313vw;
        background-position: left top;
    }

        .hp-testimonials .accent-letter {
            top: 2vw;
            right: 3vw;
        }
            .hp-testimonials .accent-letter::after{
                top: 8vw;
                right: 16vw;
            }

    .hp-testimonials .accent-bg.bottom-left{
        bottom: max(3.438vw, 55px);
    }
    .hp-testimonials .testimonials-wrapper{
        z-index: 10;
    }
        /* Image */
        .hp-testimonials .testimonials-wrapper .testimonial-image{
            width: 32vw;
            z-index: 7;
            margin-left: 14.375vw;
        }
        .hp-testimonials .testimonials-wrapper .testimonial-image img{
            object-fit: cover;
            object-position: center bottom;
            height: auto;
        }
        /* Image */
        /* Content */
        .hp-testimonials .testimonials-wrapper .testimonial-content{
            width: 63.750vw;
            flex-shrink: 0;
            z-index: 10;
            background: #fff;
            margin-left: -16vw;
            /*margin-top: 19.188vw;*/
            margin-top: 35.188vw;
            padding: 7% 5.313% 4.83%;
        }
            .hp-testimonials .testimo-lists{
                margin-top: 2.5vw;
                padding: 0 max(5vw, 80px);
            }
                .hp-testimonials .testimo-list{

                }
                    .hp-testimonials .testimo-list p{
                        color: #6a6a6a;
                        font-size: max(0.938vw, 15px);
                        line-height: 2;
                        letter-spacing: 0.05em;
                        text-align: center;
                        padding: 0;
                        margin-bottom: 2.5vw;
                    }
        /* Content */
/* Testimonials */
/* Listings */
.glob-listings{
    padding: max(11.313vw, 181px) 0 0;
    z-index: 10;
    overflow: hidden;
}   


    /* Luxury Listings */
    .luxury-listings::after {
        display: block;
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: -9vw;
        z-index: 4;
        background: url(images/luxury-listings-bg.jpg) no-repeat top right transparent;
    }
    .luxury-listings .accent-bg{
        top: 41vw;
        width: 34.75vw;
    }

    .luxury-listings .accent-letter{
        width: 68%;
        top: 5vw;
        transform: scale(1.2);
        transform-origin: right;
    }
  
    /* Luxury Listings */
    /* Sold Listings */
    .glob-listings.sold-listings{
        padding: 0;
        margin-top: -2vw;
        z-index: 5;
    }
        .sold-listings .accent-letter {
            width: 53%;
            top: 2vw;
            transform-origin: right;
            text-align: left;
        }
 
    /* Sold Listings */

    .glob-listings .glob-listings-wrap{
        max-width: 71.375vw;
        z-index: 20;
    }
        /* Title */
        .glob-listings .glob-listing-title {
            margin-bottom: max(8.625vw, 138px);
        }
            .glob-listings.sold-listings .glob-listing-title{
                padding-top: 2vw;
            }
        /* Title */
        /* Properties */
        .glob-listings .glob-properties{
            margin: 0 -0.625vw;
            z-index: 20;
        }
            .glob-listings .glob-property{
                padding: 0.625vw;
                width: 55.51%;
                height: max(23vw, 368px);
            }

                .glob-listings .glob-property a{
                    
                }   
                    .glob-listings .glob-property:nth-child(2),
                    .glob-listings .glob-property:nth-child(6),
                    .glob-listings .glob-property:nth-child(3){
                        width: 44%;
                    }

                    .glob-listings .glob-property:nth-child(3),
                    .glob-listings .glob-property:nth-child(4){
                        height: max(31.250vw, 500px);
                    }
                    .glob-listings .glob-property a .glob-property-image{

                    }
                        .glob-listings .glob-property a .glob-property-image img{
                            top: 0;
                            left: 0;
                            transition: var(--transition);
                        }

                            .glob-listings .glob-property a:hover .glob-property-image img{
                                filter: grayscale(1);
                            }
                    .glob-listings .glob-property a .glob-property-content{
                        bottom: 0;
                        padding: 0px 2.72%;
                        
                    }
                        .glob-listings .glob-property:nth-child(4) a .glob-property-content{
                            justify-content: flex-end;
                        }
                        .glob-listings .glob-property a .glob-property-content .gp-wrap{
                            background-color: rgba(0, 0, 0, 0.8);
                            width: 100%;
                            max-width: max(29.063vw, 465px);
                            padding: 5.6%;
                        }
                            .glob-listings .glob-property a .glob-property-content .gp-wrap h3{
                                font-size: max(1.563vw, 20px);
                                line-height: 1.4;
                                letter-spacing: 0.02em;
                                color: #fff;
                                font-family: var(--font-family-title);
                                text-transform: uppercase;
                            }
                            .glob-listings .glob-property a .glob-property-content .gp-wrap p{
                                color: #fff;
                                font-size: max(1vw, 14px);
                                padding-top: 5px;
                            }
        /* Properties */
        .glob-listings .default-button{
            margin-top: max(4.688vw, 75px);
        }
/* Listings */
/* Featured Areas */
.featured-areas{
    padding-top: max(6.250vw, 100px);
}


    .featured-areas .accent-letter{
        width: 43%;
        top: -4vw;
    }
        .featured-areas .accent-letter::after{
            top: 12vw;
            right: 21vw;
        }
    .featured-areas .accent-bg.accent-reverse{
        top: max(12.813vw, 205px);
    }
    .featured-areas .featured-areas-wrap{
        padding-left: 14.500vw;
        padding-right: 14.500vw;
        z-index: 10;
    }
        .featured-areas .featured-areas-wrap .fa-lists{
            margin: max(3.438vw, 55px) max(-0.313vw, -5px) 0;
        }

            .featured-areas .featured-areas-wrap .fa-list{
                width: calc(100% / 4);
                padding: max(0.313vw, 5px);
            }
            .featured-areas .featured-areas-wrap .fa-list:before{
                display: none;
            }
                .featured-areas .featured-areas-wrap .fa-lists a{

                }
                    .featured-areas .featured-areas-wrap .fa-lists a .fa-img{

                    }
                        .featured-areas .featured-areas-wrap .fa-lists a .fa-img img{
                            top: 0;
                            left: 0;
                        }
                    .featured-areas .featured-areas-wrap .fa-lists a h4{
                        font-family: var(--font-family-title);
                        color: #000;
                        line-height: 1.3;
                        font-size: max(1.5vw, 17px);
                        letter-spacing: 0.15em;
                        text-transform: uppercase;
                        text-align: center;
                        padding: max(1.500vw, 24px) 0;
                    }
/* Featured Areas */
/* Instagram */
.find-me-on-instagram{
    padding-top: max(7.938vw, 127px);
    padding-bottom: max(6.250vw, 100px);
    padding-left: 14.375vw;
    padding-right: 14.375vw;
    display: none;
}


    .find-me-on-instagram  .accent-letter{
        top: 3vw;
    }
    .find-me-instagram-wrap{
        z-index: 10;
    }

    .find-me-on-instagram .default-title{
        margin-bottom: max(7.750vw, 124px);
    }
    /* Video Info */
    .find-me-on-instagram .follow-info{
        width: 34.688vw;
        margin-right: 1.875vw;
    }

        .find-me-on-instagram .follow-info .follow-video{

        }
            .find-me-on-instagram .follow-info .follow-video a::after{
                display: block;
                content: "";
                position: absolute;
                left: 50%;
                top: 50%;
                background: url(images/play-icon.png) no-repeat 0 0 transparent;
                background-size: 100% 100%;
                width: max(3.188vw, 51px);
                height: max(3.875vw, 62px);
                z-index: 7;
                transform: translate(-50%, -50%);
            }
            .find-me-on-instagram .follow-info .follow-video img{
                top: 0;
                left: 0;
                z-index: 5;
            }

        .find-me-on-instagram .follow-info p{
            color: #6a6a6a;
            font-size: max(0.938vw, 15px);
            line-height: 2;
            letter-spacing: 0.05em;
            text-align: center;
            padding: max(1.500vw, 24px) 0;
        }
    /* Video Info */
    /* IG posts */
    .find-me-on-instagram .follow-lists{
        width: 34.688vw;
        margin: 0 -0.094vw;
    }
        .find-me-on-instagram .follow-list{
            width: calc(100% / 3);
            padding: 0.094vw;
        }
            .find-me-on-instagram .follow-list a{

            }
                .find-me-on-instagram .follow-list a img{
                    top: 0;
                    left: 0;
                    z-index: 5;
                } 
                .find-me-on-instagram .follow-list a i{
                    position: absolute;
                    color: #fff;
                    bottom: 0.313vw;
                    right: 0.313vw;
                    font-size: max(1.5vw, 24px);
                    z-index: 6;
                }
    /* IG posts */
/* Instagram */
/* Contact Form */
.hp-contact-form{ 
    /*background: url(images/contact-form-bg.jpg) no-repeat center top transparent;
    background-size: cover;
    background-attachment: fixed;*/
    padding: max(6.875vw, 110px) 0;
    position: relative;
}
    .hp_form_bg {
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 1;
        top: 0;
        left: 0;
        font-size: 0;
    }
        .hp_form_bg canvas {
            width: 100%;
            height: 100%;
            display: block;
            background-size: cover;
            background-position: center center;
            background-attachment: fixed;
            background-repeat: no-repeat;
        }
            .safari-true .hp_form_bg canvas,
            .mobile .hp_form_bg canvas {
                background-attachment: scroll;
            }

    .hp-contact-form .accent-letter-form{
        width: 41.063vw;
        color: #e6e6e6;
        font-size: max(33.563vw, 537px);
        font-family: var(--font-family-accent);
        line-height: 0.7;
        z-index: 5;
        top: 3vw;
        left: 0;
    }

        .hp-contact-form .accent-letter-form span{
            display: block;
            margin-left: -4vw;
            opacity: 0.06;
        }
        .hp-contact-form  .accent-letter-form::after {
            display: block;
            content: "";
            background: var(--primary);
            width: 100%;
            height: 2px;
            margin-top: 8vw;
        }
        .hp-contact-form .accent-letter-form::before {
            display: block;
            content: "";
            background: var(--primary);
            width: 76%;
            height: 2px;
            margin-top: 8vw;
        }

        
    .hp-contact-form .cf-wrap{
        width: 55.250vw;
        z-index: 10;
    }
        .hp-contact-form .cf-wrap .default-title{
            margin-bottom: max(5.750vw, 92px);
        }
            .hp-contact-form .cf-wrap .default-title h2{
                color: #fff;
            }
                .hp-contact-form .cf-wrap .default-title h2 em{
                    color: #fff;
                }
                .hp-contact-form .cf-wrap .default-title h2 span{
                    color: #fff;
                }
/* Contact Form */
/* Footer */
.footer{
    padding: 0.813vw;
}
    .footer .footer-top{
        background: url(images/footer-top.jpg) no-repeat center top transparent;
        background-size: cover;
        padding-left: 10%;
        padding-right: 10%;
        padding-top: max(5.063vw, 80px);
        padding-bottom: max(4.125vw, 66px);
    }
        /* Footer Logos */
        .footer .footer-top .footer-logos{
            padding-bottom: max(5.063vw, 80px);
        }

            .footer .footer-top .footer-logos a{

            }
                .footer .footer-top .footer-logos a:nth-child(2){
                    max-width: 335px;
                }
                .footer .footer-top .footer-logos a:nth-child(3){
                    max-width: 233px;
                }
        /* Footer Logos */
        /* Footer Details */
        .footer .footer-top .footer-details{

        }
            .footer .footer-top .footer-details h4{
                font-size: min(1.5vw, 24px);
                font-family: var(--font-family-title);
                letter-spacing: 0.15em;
                text-transform: uppercase;
                margin-bottom: min(2.750vw, 44px);
            }
            /* Footer Menu */
            .footer .footer-top .footer-details .footer-menu{
                width: 77%;
            }
                .footer .footer-top .footer-details .footer-menu ul{
                    display: flex;
                    justify-content: space-between;
                }
                    .footer .footer-top .footer-details .footer-menu ul li{
                        position: relative;
                    }
                        .footer .footer-top .footer-details .footer-menu ul li:first-child{
                            padding-left: 0;
                        }
                        .footer .footer-top .footer-details .footer-menu ul li:last-child{
                            padding-right: 0;
                        }
                        .footer .footer-top .footer-details .footer-menu ul li a{
                            font-size: min(0.875vw,13px);
                            letter-spacing: 0.1em;
                            text-transform: uppercase;
                            transition: var(--transition);
                            color: #000000;
                        }
                            .footer .footer-top .footer-details .footer-menu ul li a:hover{
                                color: var(--primary);
                            }
                        .footer .footer-top .footer-details .footer-menu ul li ul{
                            flex-flow: column;
                            position: absolute;
                            left: 50%;
                            transform: translate(-50%, 0);
                            padding-top: 0.7vw;
                        }
                            .footer .footer-top .footer-details .footer-menu ul li ul li{
                                padding: 5px 0;
                            }
                                .footer .footer-top .footer-details .footer-menu ul li ul li a{
                                    color: #8b8b8b;
                                    font-size: min(0.813vw,12px);
                                    white-space: nowrap;
                                }
            /* Footer Menu */
            /* Footer contact */
            .footer .footer-top .footer-details .footer-contact-info{
                width: 20%;
                padding-left: 10px;
            }
                .footer .footer-top .footer-details .footer-contact-info ul{

                }
                    .footer .footer-top .footer-details .footer-contact-info ul li{
                        display: flex;
                        align-items: center;
                        letter-spacing: 0.05em;
                        font-size: min(0.938vw,15px);
                        padding: min(0.688vw,11px) 0;
                    }
                        .footer .footer-top .footer-details .footer-contact-info ul li:first-child{
                            padding-top: 0;
                        }
                    .footer .footer-top .footer-details .footer-contact-info ul li i{
                        color: var(--primary);
                        font-size: min(0.938vw,15px);
                        margin-right: min(0.625vw,10px);
                        width: min(1.313vw,21px);
                    }
                    .footer .footer-top .footer-details .footer-contact-info ul li a{
                        color: #616161;
                    }

                    .footer .footer-top .footer-details .footer-contact-info .smi{

                    }
                        .footer .footer-top .footer-details .footer-contact-info .smi a{
                            font-size: 0;
                        }
                            .footer .footer-top .footer-details .footer-contact-info .smi i{
                                font-size: min(1.375vw,22px);
                            }
            /* Footer Contact */
        /* Footer Details */
    .footer .footer-bottom{
        padding-top: max(2.625vw, 42px);
        padding-left: 14.375vw;
        padding-right: 14.375vw;
        padding-bottom: max(4.438vw, 71px);
    }
        .footer .footer-disclaimer{

        }
            .footer .footer-disclaimer p{
                font-size: max(0.813vw, 11px);
                line-height: 2;
                letter-spacing: 0.05em;
                text-align: center;
                color: #616161;
            }

        .footer .footer-copyright{
            padding-top: max(2.438vw, 39px);
            padding-bottom: max(1.875vw, 30px);
        }
            .footer .footer-copyright p {
                font-size: max(0.813vw, 11px);
                line-height: 2;
                letter-spacing: 0.05em;
                text-align: center;
                color: #616161;
            }
                .footer .footer-copyright p a{
                    color: #616161;
                    transition: var(--transition);
                }
                    .footer .footer-copyright p a:hover{
                        color: var(--primary);
                    }
        .footer .footer-copy-logos{

        }
            .footer .footer-copy-logos i{
                color: var(--primary);
                font-size: max(2.063vw, 33px);
                margin: 0 0.375vw;
            }
/* Footer */
/*******************************************************
 *
 * 4. IP Styles
 *
 *******************************************************/
.ip-banner{
    position: relative;
    width: 100%;
}
    .ip-banner::before{
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
        background: rgba(0,0,0,.6);
    }
    .ip-banner canvas{
        display: block;
        position: relative;
        z-index: 0;
        width: 100%;
        min-height: 250px;
        background-color: var(--dark);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .ip-banner .container{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        z-index: 2;
    }
        .ip-banner h1 {
            font-weight: 700;
            font-size: 32px;
            text-align: center;
            color: #FFFFFF;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            line-height: 1.7;
        }
            .ip-banner h1 span{
                display: block;
                font-size: 24px;
                font-weight: 400;
                text-transform: none;
                letter-spacing: 0.01em;
            }
/* Adjust minimum height of page area */
#content-sidebar, #content-full{ min-height: 500px; margin-top: 20px;}

/** Adjust width of content columns **/
#content-sidebar #content{ width: 77.08%; }
#content-full #content { width: 100%; }

/* Adjust width of sidebar */
.sidebar{ width: 20.83%; }

/* fullwidth template */
.page-template-template-fullwidth #content {
    padding-left: 15px;
    padding-right: 15px;
}
    .page-template-template-fullwidth #content ihf-search[data-eureka-id*=""].ihf-eureka {
        margin-left: -15px;
        margin-right: -15px;
    }

/* Adjust line height of page elements */
#content h4, aside h4,
#content p, aside p,
#content blockquote, aside blockquote,
#content ul, aside ul,
#content fieldset, aside fieldset,
#content form, aside form,
#content ol, aside ol,
#content dl, aside dl,
#content dir, aside dir,
#content menu, aside menu { line-height:1.7 }

/* Style .entry-title(post/page) and .archive-title(category/archive/etc) main headings (h1) */
#content .entry-title,
#content .archive-title {
    font-family: var(--font-family-title);
    font-size: 45px;
    margin: 0;
}

/* Styles for category/archive/search/etc subheadings (h2) */
#content .archive-subtitle {
    font-family: var(--font-family-title);
    font-size: 45px;
}
#inner-page-wrapper #breadcrumbs {
    margin: 0;
    padding: 15px 0;
}

.listings-cta.white .button-preset {
    text-transform: uppercase;
    text-align: center;
    width: 100%;
    display: block;
    padding: 10px 0;
    font-size: 22px;
    letter-spacing: 2px;
}

.listings-cta .button-preset {
    text-transform: uppercase;
    text-align: center;
    width: 100%;
    display: block;
    padding: 10px 0;
    font-size: 22px;
    letter-spacing: 2px;
    border: 2px solid #000000;
    transition: all ease .4s;
}

.listings-cta .button-preset:hover {
    background-color: #000;
    color: #ffffff;
}

.grecaptcha-badge{
    z-index: 999;
}

body #pojo-a11y-toolbar {
    bottom:0 !important;
    top: auto !important;
}
body #pojo-a11y-toolbar.pojo-a11y-toolbar-left .pojo-a11y-toolbar-toggle {
    top:auto !important;
    bottom:0 !important;
}
button:focus-visible, a:focus-visible {
    outline-style: solid !important;
    outline-width: 5px !important;
    outline-color: red !important;
    transition: none !important;
}

#pojo-a11y-toolbar .pojo-a11y-btn-grayscale, 
#pojo-a11y-toolbar .pojo-a11y-btn-high-contrast, 
#pojo-a11y-toolbar .pojo-a11y-btn-negative-contrast,
#pojo-a11y-toolbar .pojo-a11y-btn-light-background {
    display: none !important;
}

.b-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
    opacity: 0;
}



.aios-custom-ihomefinder-results-template #content-full .entry-title {
    width: 100% !important;
    padding: 0 0px !important;
}

.areaPickerExpandAllTopBar.btn-primary span.glyphicon.glyphicon-remove-circle {
    color: #fff !important;
}

#agents-results .agent-top {
    display: none;
}

.aiosp-wrap .aiosp-ref-\#agents-popup-form input[type=submit]:hover {
    color: #8b181f !important;
}

.wpcf7-not-valid-tip {
    font-size: 11px;
}

#inner-page-wrapper #listings-details .listings-form textarea{
    padding-right: 35px;
}
#content #listings-results .listings-table .listings-table-body .listings-table-label{
    color: #fff;
}
.aios-custom-ihomefinder-template-credits.mt-lg{
    padding: 0 0 40px;
}

.aios-custom-ihomefinder-printable-template #breadcrumbs,
.aios-custom-ihomefinder-printable-template #content .listings-printable-photo div strong,
.aios-custom-ihomefinder-printable-template .aios-mobile-header-1 {
    display: none !important;
}

body.aios-custom-ihomefinder-details-template .wpcf7-not-valid-tip{
    right: auto !important;
}
.single-comm-bc{
    padding: 0 100px;
}


#ihf-main-container .hidden-xs.areaPickerExpandAllButtonClass{
    display: block !important;
}

#ihf-main-container.ihf-modal-container #ihf-user-registration-modal .nav-tabs>li:not(.active)>a:hover {
    color: #ffffff;
}


/*Opt-in/out message*/
.disclaimer .wpcf7-list-item label {
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

.disclaimer .wpcf7-list-item .wpcf7-list-item-label {
	text-align: center;
	line-height: normal;
	max-width: 93%;
	    font-size: 12px;
    font-weight: normal;
}

.disclaimer input {
    width: unset;
  height: unset;
  margin: 0 10px 0 0;
}

/*//for IHF*/
.listings-contact .listings-form .disclaimer {
    padding-top: 20px;
    position: relative;
    clear: both;
    display: block;
    width: 100%;
}

/*//default-wrap*/
.ai-default-cf7wrap .disclaimer {
    margin-bottom: 10px;
}

.hp-contact-form .disclaimer .wpcf7-list-item .wpcf7-list-item-label {
	color: #fff;
}

.use-floating-validation-tip .wpcf7-not-valid-tip {
    width: auto;
    position: absolute;
}

.ihf-details-template #listings-details .listings-form .listings-field.submit {
    bottom: 10px;
}

body.pojo-a11y-readable-font [class*=ai-font-] {
  font-family: agentimage !important;
}
.ihf-results-template #ihf-main-container.ihf-modal-container .modal .form-group > .ihf-modal-form-response-output {
    display: none !important;
}
/* MEDIA QUERIES ARE AUTOMATICALLY REMOVED FROM THIS FILE, they must be placed in style-media-queries.css */
