/* HOME PEOPLE GROUP
 * Deprecated DNN CSS class names will remain available for some time
 * before being  permanently removed. Removal will occur according to
 * the  following process:
 *
 * 1. Removal will only occur with a major (x.y) release, never
 *    with a maintenance (x.y.z) release.
 * 2. Removal will not occur less than six months after the release
 *    when it was deprecated.
 * 3. Removal will not occur until after deprecation has been noted 
 *    in at least two major releases.
 *
 *                                              |        |Planned |
 *  Name                                        |Release |Removal |
 *----------------------------------------------+--------+--------+
 * Mod{NAME}C                                     5.6.2    6.2
 *   {NAME} = sanitized version of the DesktopModule Name 
 *   Used on <div> tag surrounding Module Content, inside container
 *----------------------------------------------+--------+--------+
 */  

/*|| COLORS*/

:root {
  --main-bg-color: #000000;
  --secondary-bg-color:#ffffff;
  --tertiary-bg-color:#e9e9e6;
  --accent-bg-color:#3A6B48;
  --image-marble-black: url(/Portals/1/AdobeStock_116351589_webversion_small.jpg);
--main-bg-color-opacity40: rgb(0,0,0,0.4);
  --main-txt-color: #000000;
  --secondary-txt-color:#ffffff;
  --accent-txt-color:#3A6B48;
--component-padding: 100px;
--component-margin-top: 5vw;
--component-margin-top-secondary: 40px;
--component-black-border: 3px solid #000000;
--component-white-border: 3px solid #ffffff;
--grid-col-padding: 20px;    
--grid-row-padding: 20px;
--quicklinks-padding-content: 3vw;
--quicklinks-white-border: 3px solid #ffffff;
--quicklinks-margin-content: 23px;
--quicklinks-margin-overlay: 20px;
--mo-title-font-size: 6vw;
--tab-title-font-size: 2.5vw;
--desk-title-font-size: 3.35vw;
--mo-subtitle-font-size: 4vw;
--tab-subtitle-font-size: 1.65em;
--desk-subtitle-font-size: 1.65em;
--vertical-img-height: 60vh;
--vertical-img-height-secondary: 30vh;
--primary-font-family: montserrat, sans-serif;
--primary-letter-spacing: .75px;
--primary-line-height: 1.1;
--max-width: 1650px;
--gutter-width: 5vw;
}

div.container {
    width: auto;
    margin-left: 0px;
    margin-right: 0px;
    padding: 0px;
}



/* PAGE BACKGROUND */
/* background color for the header at the top of the page  */
.HeadBg {
}

/* background color for the content part of the pages */
Body
{
}

#dnn_content {
    padding-top: 0px;
}

[class*="Pane"] {
    margin-bottom: 0px;
}

.ControlPanel {
}

/* background/border colors for the selected tab */
.TabBg {
}

.LeftPane  { 
}

.ContentPane  { 
}

.RightPane  { 
}

/* text style for the selected tab */
.SelectedTab {
}

/* hyperlink style for the selected tab */
A.SelectedTab:link {
}

A.SelectedTab:visited  {
}

A.SelectedTab:hover    {
}

A.SelectedTab:active   {
}

/* text style for the unselected tabs */
.OtherTabs {
}
    
/* hyperlink style for the unselected tabs */
A.OtherTabs:link {
}

A.OtherTabs:visited  {
}

A.OtherTabs:hover    {
}

A.OtherTabs:active   {
}

/* GENERAL */
/* style for module titles */
.Head   {
}

/* style of item titles on edit and admin pages */
.SubHead    {
}

/* module title style used instead of Head for compact rendering by QuickLinks and Signin modules */
.SubSubHead {
}

/* text style used for most text rendered by modules */
.Normal
{
}

/* text style used for textboxes in the admin and edit pages, for Nav compatibility */
.NormalTextBox
{
}

.NormalRed
{
}

.NormalBold
{
}

/* text style for buttons and link buttons used in the portal admin pages */
.CommandButton     {
}
    
/* hyperlink style for buttons and link buttons used in the portal admin pages */
A.CommandButton:link {
}

A.CommandButton:visited  {
}

A.CommandButton:hover    {
}
    
A.CommandButton:active   {
}

/* button style for standard HTML buttons */
.StandardButton     {
}

/* GENERIC */
H1  {
font-size: var(--mo-title-font-size);
font-family: var(--primary-font-family);
font-weight: 700;
font-style: normal;
color: var(--main-txt-color);
line-height: var(--primary-line-height);
letter-spacing: var(--primary-letter-spacing);
text-transform: uppercase;
}

H2 {
font-size: var(--mo-subtitle-font-size);
    font-family: var(--primary-font-family);
    font-weight: 300;
    font-style: normal
color: var(--main-txt-color);
    letter-spacing: var(--primary-letter-spacing);
    line-height: var(--primary-line-height);
    text-transform: uppercase;
}

H3, a.mm-title   {
    font-size: var(--mo-title-font-size);
font-family: var(--primary-font-family);
font-weight: 700;
font-style: normal;
color: var(--main-txt-color);
letter-spacing: var(--primary-letter-spacing);
line-height: var(--primary-line-height);
text-transform: uppercase;
}

H4  {
    font-size: 2.25em;
font-family: var(--primary-font-family);
font-weight: 600;
font-style: normal;
color: var(--main-txt-color);
letter-spacing: var(--primary-letter-spacing);
line-height: var(--primary-line-height);
}

H5, DT, #dnngo_megamenu > div > ul > li > a > span  {
font-size: 1.75em;
font-family: var(--primary-font-family);
font-weight: 800;
font-style: normal;
color: var(--main-txt-color);
letter-spacing: var(--primary-letter-spacing);
line-height: var(--primary-line-height);
}

H6  {
font-size: 1.5em;
font-family: var(--primary-font-family);
font-weight: 300;
font-style: normal;
color: var(--main-txt-color);
letter-spacing: var(--primary-letter-spacing);
line-height: var(--primary-line-height);
text-transform: uppercase;
}

p, .footer > div.cell4.content > a {
font-family: var(--primary-font-family);
font-weight: 400;
font-style: normal;
font-size: 1.15em;
color: var(--main-txt-color);
letter-spacing: var(--primary-letter-spacing);
line-height: 1.35;
}

TFOOT, THEAD    {
}

TH  {
}

A:link  {
    color: var(--main-txt-color);
    text-decoration: none;
}

A:visited   {
}

A:hover {
    color: var(--accent-txt-color);
}

A:active    {
}

SMALL   {
}

BIG {
}

BLOCKQUOTE, PRE {
}


UL LI   {
}

UL LI LI    {
}

UL LI LI LI {
}

OL LI   {
}

OL OL LI    {
}

OL OL OL LI {
}
OL UL LI   {
}

HR {
       }

  
/* MODULE-SPECIFIC */
/* text style for reading messages in Discussion */    
.Message    {
}   

/* style of item titles by Announcements and events */
.ItemTitle    {
}

/* Menu-Styles */
/* Module Title Menu */
.ModuleTitle_MenuContainer {
}

.ModuleTitle_MenuBar {
}

.ModuleTitle_MenuItem {
}

.ModuleTitle_MenuIcon {
}

.ModuleTitle_SubMenu {
}

.ModuleTitle_MenuBreak {
}

.ModuleTitle_MenuItemSel {
}

.ModuleTitle_MenuArrow {
}

.ModuleTitle_RootMenuArrow {
}

/* Main Menu */

.MainMenu_MenuContainer {
}

.MainMenu_MenuBar {
}

.MainMenu_MenuItem {
}

.MainMenu_MenuIcon {
}

.MainMenu_SubMenu {
}

.MainMenu_MenuBreak {
}

.MainMenu_MenuItemSel {
}

.MainMenu_MenuArrow {
}

.MainMenu_RootMenuArrow {
}

/*||MENUS*/

.HeaderPageTitle_bg {
    margin-bottom: 0px;
}

.centerBox.header9 > .shade {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background-color: var(--main-bg-color);
    filter: alpha(opacity= 95 );
    opacity: 0.95;
}

.mobile_menu.mm-menu, div.headerBox > .shade {
    background-color: var(--main-bg-color);
    opacity: 1;
}

ul.mm-listview > li > a > span, .mm-menu .mm-navbar.mm-navbar-top-2 a {
    color: var(--secondary-txt-color);
}

.mobile_menu.mm-menu .mm-listview > li.mm-selected > a:not(.mm-next), .mobile_menu.mm-menu .mm-listview > li.mm-selected > span, .mobile_menu.mm-menu .mm-listview > li.current > a:not(.mm-next), .mobile_menu.mm-menu .mm-listview > li.subcurrent > a:not(.mm-next), .mobile_menu.mm-menu .mm-listview > li.current > .mm-next, .mobile_menu.mm-menu .mm-listview > li.subcurrent >.mm-next, .mobile_menu.mm-menu .mm-listview > li > a:not(.mm-next):hover, .mobile_menu.mm-menu .mm-listview > li > .mm-counter:hover + .mm-next, .mobile_menu.mm-menu .mm-listview > li > a.mm-next:hover {
    background-color: var(--accent-bg-color);
}

.mobile_menu .mm-listview > li, .mobile_menu .mm-listview > li:after, .mobile_menu .mm-listview > li .mm-next, .mobile_menu .mm-listview > li .mm-next:before, .mobile_menu .mm-navbar.mm-navbar-top-2, .mobile_menu .menu_header, .mobile_menu .mm-navbar.mm-navbar-top.mm-navbar-top-1, #mobile_user {
    border-color:transparent;
}

/* Login Styles */
.LoginPanel{
}

.LoginTabGroup{
}

.LoginTab {
}

.LoginTabSelected{
}

.LoginTabHover{
}

.LoginContainerGroup{
}

.LoginContainer{
}

/* || Header*/

#dnngo_megamenu > div.dnngo_gomenu > ul > li > a > span {
font-family: var(--primary-font-family);
font-size: 14px;
font-weight: 400;
padding: 10px 21px;
}

#mm-0 > ul > li> a > span {
    font-size: 18px;
    font-family: var(--primary-font-family);
    font-weight: 300;
    font-style: normal;
    color: var(--secondary-txt-color);
    letter-spacing: var(--primary-letter-spacing);
    line-height: var(--primary-line-height);
    text-transform: uppercase;
}



.mobile_header, .mobile_dnn_logo, .mobile_nav {
    height: 96px;
}

.mobile_nav > .shade {
    background-color: var(--main-bg-color);
    border-bottom: 3px solid #ffffff;
    height: 100px;
}

.mobile_left_icon #ico_search, .mobile_right_icon a:before {
    color: var(--secondary-txt-color) ;
    font-size: 1.5rem;
}

.mobile_left_icon {
    display: none;
}

#dnngo_megamenu > div > ul > li > a > span, #dnngo_megamenu > div > ul > li.current > a > span {
    color: var(--secondary-txt-color) ;
}

#dnngo_megamenu > div > ul > li > a > span:before {
    border-bottom: 2px solid var(--secondary-txt-color);
}

/* BUTTONS*/

.kyb-btn.bkgd-light.btn-border, div.HPG-Theme_01_Default .form_submit .submit_but, .HPG-Theme_01_Default .form_submit .reset_but {
    background-color: var(--secondary-bg-color);
    border: 3px solid var(--main-bg-color);
    padding: 10px 30px;
    color: var(--main-txt-color);
    font-weight: 500;
   font-family: var(--primary-font-family);
   letter-spacing: var(--primary-letter-spacing);
   font-size: 1.15em;
   border-radius: 0px;
}

.kyb-btn.bkgd-light.btn-border:hover, div.HPG-Theme_01_Default .form_submit .submit_but:hover, div.HPG-Theme_01_Default .form_submit .reset_but:hover {
    background-color: var(--accent-bg-color);
    border: 3px solid var(--accent-bg-color);
    color: var(--secondary-txt-color);
   text-decoration: none;
}

.button_cta {
   margin-top: 2.5vw;
}

/*Graphic Elements*/

#to_top:hover {
    background-color: var(--accent-bg-color);
    border-color: var(--accent-bg-color);
}

.hpg_divider_center, .hpg_divider_left {
background-color: var(--main-bg-color);
width: 100px;
    height: 3px;
}

.hpg_divider_center {
    text-align: center;
    align-self: center;  
    margin: 20px auto 1em;
 }

.hpg_divider_left {
     text-align: left;
    align-self: left;
    margin: 20px 0em 1em;
 }

/*Content Planner Start*/
.web_cp_thankyoumessage_bkgd{
    background: #fefefa;
    padding: 5em 0em;
}

.circle_icon {
    background: #ffffff;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
padding: 1em 1.15em;
}

a.bottom_icons_social {
    color: #000000;
}

a.circle_icon:hover {
    background: #3A6B48;
}

a.bottom_icons_social:hover{
    color: #ffffff;
    text-decoration: none;
}

/*|| Breadcrumbs*/

div.pagetitle_bg.PageTitle_h.Auto {
    margin-bottom: var(--component-margin-top-secondary);
}

.pagetitleBox .pagetitleborder {
    padding: var(--component-margin-top-secondary);
}

.pagetitle_bg > .shade .img {
    background-color: var(--tertiary-bg-color);
}



div.pagetitleBox > div > div > div > div.pagetitletoken > div > em::before, div.pagetitleBox > div > div > div > div.pagetitletoken > div > em, .pagetitleBox .pagetitletoken .fa {
    display: none;
}

.pagetitleBox .pagetitletoken, .pagetitleBox .pagetitletoken a, .pagetitleBox .pagetitletoken aLlink, .pagetitleBox .pagetitletoken a:active, .pagetitleBox .pagetitletoken a:visited {
text-align: left;
    font-style: Normal;
    Font-Size: 13px;
    text-transform: uppercase;
    color: var(--main-txt-color);
    Font-Family: var(--primary-font-family);
    letter-spacing: var(--primary-letter-spacing);
    Font-weight: 500;
    margin-bottom: 0;
}

.pagetitleBox .pagetitleborder {
    padding-right: var(--quicklinks-margin-content);
    padding-left: var(--quicklinks-margin-content);
    padding-top: var(--quicklinks-margin-content);
    padding-bottom: var(--quicklinks-margin-content);
}

.breadcrumb {
    margin: 0px;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 0;
    padding: 0px;
}

.hpg.breadcrumb {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "content";
}

.hpg.breadcrumb > div.full {
grid-area: 1 / 1 / 2 / 2;
}

.hpg.breadcrumb {
    height: 50vh;
}

.hpg.breadcrumb.fullscreen {
    height: auto;
}


.about.hpg.breadcrumb {
display: grid;
grid-template-columns: 60vw 10vw 30vw;
/*grid-template-rows: repeat(5, 1fr);*/
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-areas: "content1 content1 content1"
                    "content4 . content5";
height: auto;
}

.about.hpg.breadcrumb > div.full { grid-area: 1 / 1 / 6 / 4; }
.about.hpg.breadcrumb > div.cell1 { grid-area: content1; text-align: center;     margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);}
.about.hpg.breadcrumb > div.cell2 { grid-area: content2; display: none;}
.about.hpg.breadcrumb > div.cell3 { grid-area: content3; display: none;}
.about.hpg.breadcrumb > div.cell4 { grid-area: content4; margin-bottom: -3px;}
.about.hpg.breadcrumb > div.cell5 { grid-area: content5; margin-bottom: -3px;}



.about.hpg.breadcrumb > div.cell4.content {
    place-self: end start;
}

.about.hpg.breadcrumb > div.cell4.content > img {
    height: 20vw;
    margin-left: -10vw;
}

.about.hpg.breadcrumb > div.cell5.content{
    place-self: end;
}

.about.hpg.breadcrumb > div.cell5.content > img {
        height: 27vw;
}



#hpg-about-bc > div.bkgd.full {
    background-image: url(/portals/1/HPG%20Different%20Types%20of%20Homes%20Graphic.svg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 12vw;
    place-self: end stretch;
    background-position-x: right;
    margin-bottom: -2px;
}

.hpg.fullscreen.breadcrumb {
display: grid;
grid-template-columns: 1fr;
/*grid-template-rows: repeat(2, 1fr);*/
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-areas: "content1"
                            "content2"
                            "content3";
/*grid-template-areas: "content1 content2"
                        "content1 content3";*/
border-bottom: var(--component-black-border);
position: relative;
overflow: hidden;
width: 100vw;
}

.hpg.fullscreen.breadcrumb > div.full  {
   grid-area: 1 / 1 / 4 / 2; 
}

.hpg.fullscreen.breadcrumb > div.cell1  {
    grid-area: content1; 
}

.hpg.fullscreen.breadcrumb > div.cell1.bkgd   {
    grid-area: content1; 
    background-image: url(/Portals/1/AdobeStock_313808580wDetroitMap_websize.jpg);
    background-size: cover;
    background-position: right;
    position: relative;
    min-height: var(--vertical-img-height);
    background-repeat: no-repeat;
}

.hpg.fullscreen.breadcrumb > div.cell2  {
    grid-area: content2; 
}

.hpg.fullscreen.breadcrumb > div.cell2.content  {
    place-self: center;
}

.hpg.fullscreen.breadcrumb > div.cell3  {
    grid-area: content3; 
    margin-bottom: -4px;
    margin-top: var(--component-margin-top);
}

.hpg.fullscreen.breadcrumb > div.cell3.content {
    place-self: center;
    position: relative;
    overflow: hidden;
}

.selling.hpg.fullscreen.breadcrumb > div.cell3.content {
    place-self: end;
    position: unset;
}

.selling.hpg.fullscreen.breadcrumb > div.cell1.bkgd {
    background-image: url(/Portals/1/HPG_Summary_ContentIMG.jpg);
}

.stagingorganizing.hpg.fullscreen.breadcrumb > div.cell1.bkgd {
    background-image: url(/portals/1/HPG%20Staging%20Organizing%20Component%20Card%20Home%20Staging.jpg);
}

.hpg.fullscreen.breadcrumb > div.cell3.content > img {
    height: 175px;
}

.selling.hpg.fullscreen.breadcrumb > div.cell3.content > img {
    padding-right: var(--quicklinks-margin-content);
}

.hpg.fullscreen.breadcrumb > div.cell2.content {
margin-top: var(--gutter-width);
margin-left: var(--gutter-width);
margin-right: var(--gutter-width);
text-align: center;
}


.hpg.fullscreen.breadcrumb > div.cell2.content > h1, .hpg.fullscreen.breadcrumb > div.cell2.content > h3  {
    text-transform: uppercase;
    font-size: var(--mo-title-font-size);
}

.hpg.fullscreen.breadcrumb> div.cell2.content > h3 {
    font-weight: 500;
}

/*|| Components*/
.highlight {
    background-color: transparent;
    border-radius: 0px;
}

.component {
    display: grid;
    border-bottom: var(--component-black-border);
    margin-top: var(--component-margin-top);
}



#selling, #buying, #emaillistings {
   grid-template-columns: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "cell2"
    "cell1";
    min-height: 60vh;
    width: 100vw;
    position: relative;
    overflow: hidden;
}

#emaillistings > div.full, #buying > div.full, #selling > div.full {
grid-area: 1 / 1 / 3 / 2; 
}
#emaillistings > div.cell1, #buying > div.cell1, #selling > div.cell1 {
grid-area: cell1; 
}
#emaillistings > div.cell2, #buying > div.cell2, #selling > div.cell2 {
grid-area: cell2; 
}

#selling > div.cell1.content, #buying > div.cell1.content, #emaillistings> div.cell1.content {
    padding-top: 100px;
    margin-bottom: -3px;
    position: relative;
    overflow: hidden;
    place-self: end center;
}

#selling > div.cell1.content > a > img {
    height: 200px;
}

#buying > div.cell1.content > img {
    height: 150px;
}

#emaillistings > div.cell1.content > a > img {
        height: 200px;
}

#selling > div.content, #buying > div.cell2.content, #emaillistings> div.content {
    margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}

/*|| Staging & Organizing Component*/

#stagingandorganizing {
    display: grid;
    grid-template-columns: 1fr;
    grid-column-gap: var(--grid-col-padding);
    grid-row-gap: var(--grid-row-padding); 
    grid-template-areas: "content1"
    "content2"
    "content3"
    "content4"
    "content5"
    "content6"
    "content7"
    "content8"
    "content9"
    "content10";
        margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}

#stagingandorganizing > .full { grid-area: 1 / 1 / 9 / 2; }
#stagingandorganizing > .cell1 { grid-area: content1; }
#stagingandorganizing > .cell2 { grid-area: content2; }
#stagingandorganizing > .cell3 { grid-area: content3; }
#stagingandorganizing > .cell4 { grid-area: content4; }
#stagingandorganizing > .cell5 { grid-area: content5; }
#stagingandorganizing > .cell6 { grid-area: content6; }
#stagingandorganizing > .cell7 { grid-area: content7; }
#stagingandorganizing > .cell8 { grid-area: content8; }
#stagingandorganizing > .cell9 { grid-area: content9; }
#stagingandorganizing > .cell10 { grid-area: content10; }

#stagingandorganizing > .bkgd > a > img {
    width: 100%;
}

#stagingandorganizing {
  border-bottom: 0px solid var(--main-bg-color);  
}

#stagingandorganizing > .cell2.overlay, #stagingandorganizing > div.cell4.overlay, #stagingandorganizing > div.cell6.overlay, #stagingandorganizing > div.cell8.overlay {
    border: var(--quicklinks-white-border);
    margin: var(--quicklinks-margin-overlay)
}

#stagingandorganizing > div.content {
    text-align: center;
}





/*|| HOME VALUATION*/

#homevaluation {
    display: grid;
    grid-template-columns: 1fr;
    grid-column-gap: var(--grid-col-padding);
    grid-row-gap: var(--grid-row-padding); 
    grid-template-areas:     "content2"
    "content3"
    "content1";
    margin-bottom: -3px;
}

#homevaluation > .full { grid-area: 1 / 1 / 4 / 2; }
#homevaluation > .cell1 { grid-area: content1;
    margin-bottom: -3px;
    margin-top: var(--component-padding);
    position: relative;
    overflow: hidden;
    place-self: end center;}
#homevaluation > .cell2 { grid-area: content2;}
#homevaluation > .cell3 { grid-area: content3; }

#homevaluation > div.cell2.content, #homevaluation > div.cell3.content {
    margin-left: var(--quicklinks-margin-content);
    margin-right: var(--quicklinks-margin-content);
}

#homevaluation > div.cell1.content > a > img {
        height: 150px;
}


/*|| HOME PAGE */

.hero.hpg {
  display: grid;
grid-template-columns: 1fr;
/*grid-column-gap: var(--grid-col-padding);
grid-row-gap: var(--grid-row-padding); */
grid-template-areas: "content1"
"content2";
}

.hero.hpg > .full {
  grid-area: 1 / 1 / 3 / 2; 
}

.hero.hpg > .cell1 {
  grid-area: content1;
}

.hero.hpg > .cell2 {
  grid-area: content2; 
}

.hero.hpg > div.cell2.content > img {
    /*height: 67vh;*/
    width: 100%;
}

#hpg-home-hero > div.bkgd.full, #messsage > div.bkgd.full {
    background-image: var(--image-marble-black);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
}

#hpg-home-hero > div.full.overlay, #messsage > div.full.overlay {
    background-color: rgba(0, 0, 0, 1);
}

#hpg-home-hero > div.content, #messsage > div.content {
    margin: var(--gutter-width);
}

#hpg-home-hero > div.content > h2, #hpg-home-hero > div.content > h1, #hpg-home-hero > div.content > p, #messsage > div.cell1.content > h1, #messsage > div.cell1.content > p {
    color: var(--secondary-txt-color);
}

#hpg-home-hero > div.cell1.content > div.hpg_divider_left, #messsage > div.cell1.content > div {
    background-color: var(--secondary-bg-color);
}

#hpg-home-hero > div.cell2.content {
    padding-bottom: var(--component-margin-top);
}

#hpg-home-hero > div.cell1.content > div.hpg_divider_left {
display: none;
}

/*|| Quick Link Cards*/

.quicklinks {
    display: grid;
    grid-column-gap: 0px;
    grid-row-gap: 20px;
    grid-template-columns: repeat(auto-fill,minmax(100%, 1fr));
    grid-template-areas: "content1"
"content2"
"content3";
margin-left: var(--gutter-width);
margin-right: var(--gutter-width);
margin-top: -5vw;
}



.quicklinks > div.full { display: none;}
.quicklinks > div.cell1 { grid-area: content1; }
.quicklinks > div.cell2 { grid-area: content2; }
.quicklinks > div.cell3 { grid-area: content3; }



.hpg.quicklinks > div.bkgd.cell1, .hpg.quicklinks > div.bkgd.cell2, .hpg.quicklinks > div.bkgd.cell3, .hpg.quicklinks > div.cell1.content, .hpg.quicklinks > div.cell2.content, .hpg.quicklinks > div.cell3.content {
background-color: var(--tertiary-bg-color);
}

.hpg.quicklinks > div.cell1.overlay, .hpg.quicklinks > div.cell2.overlay, .hpg.quicklinks > div.cell3.overlay {
    margin: 20px;
    border: solid 3px var(--secondary-bg-color);
    }

.hpg.quicklinks > div.cell1.content, .hpg.quicklinks > div.cell2.content, .hpg.quicklinks > div.cell3.content {
    margin: var(--quicklinks-margin-content);
    padding: var(--quicklinks-padding-content);
    text-align: center;
    place-self: center;
}

.hpg.quicklinks > div.content > h3, .hpg.quicklinks > div.content > h3 > a, .hpg.quicklinks > div.content > h6 > a, .hpg.quicklinks > div.content > h6 {
color: var(--main-txt-color);
text-transform: uppercase;
}



/*|| ABOUT PAGES*/

.breadcrumb.agentinfo {
    display: grid;
    grid-template-columns: 1fr;
    /*grid-template-rows: 1fr;*/
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "content1"
    "content2"
    "content3";
    height: fit-content;
}

.breadcrumb.agentinfo > div.full { grid-area: 1 / 1 / 4 / 2; }
.breadcrumb.agentinfo > div.cell1 { grid-area: content1; }
.breadcrumb.agentinfo > div.cell2 { grid-area: content2; }
.breadcrumb.agentinfo > div.cell3 { grid-area: content3; }

.breadcrumb.agentinfo > div.cell1.content > img {
    width: 100%;
}

.hpg.breadcrumb.agentinfo {
    border-bottom: 3px solid var(--main-bg-color);
}

.breadcrumb.agentinfo > div.cell3.content > div > a {
    padding: 10px;
    background-color: var(--accent-bg-color);
    border-radius: 3px;
    color: var(--secondary-txt-color);
}

.breadcrumb.agentinfo > div.cell3.content > div > a:hover {
    background-color: var(--main-bg-color);
    color: var(--secondary-txt-color);
}

.breadcrumb.agentinfo > div.cell2.content, .breadcrumb.agentinfo > div.cell3.content {
    margin-left: var(--quicklinks-margin-content);
margin-right: var(--quicklinks-margin-content);
}

.breadcrumb.agentinfo > div.cell2.content {
    margin-top: var(--quicklinks-margin-content);
}
.breadcrumb.agentinfo > div.cell3.content {
    margin-top: var(--component-margin-top);
    margin-bottom: 2px;
}

.agentbio {
    margin-top: var(--quicklinks-margin-content);
    margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}

/*|| TESTIMONIALS*/

.testimonial {
    display: grid;
    grid-template-columns: 1fr;
    /*grid-template-rows: 1fr;*/
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "content";
    margin-top: var(--component-margin-top);
    margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}

.testimonial > div.full { grid-area: 1 / 1 / 2 / 2;}

.hpg.testimonial > div.full.bkgd { background-color: var(--tertiary-bg-color);}

.hpg.testimonial > div.full.overlay { 
    border: var(--quicklinks-white-border);
    margin: var(--quicklinks-margin-overlay);
    }
    
.hpg.testimonial > div.content {
    padding: var(--gutter-width);
    text-align: center;
}

/* || Grids */

.hpg.summary {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "content";
    margin-top: var(--component-margin-top-secondary);
    margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}

.hpg.summary > div.full {
grid-area: 1 / 1 / 2 / 2;

}




/* || HOME VALUATION*/

div.embed_iframe.hpg > iframe {
    width: 100%;
    height: 90vh;
}

/*|| Buying, Selling, Staging Organizing PAGES MOBILE*/


.stagorg, .buy, .sell {
display: grid;
grid-template-columns: 1fr;
/*grid-template-columns: repeat(2, 1fr);*/
/*grid-template-rows: 1fr;*/
grid-column-gap: var(--grid-col-padding);
grid-row-gap: var(--grid-row-padding);
grid-template-areas: "content1"
                    "content2";
margin-top: var(--component-margin-top);
padding-right: var(--gutter-width);
padding-left: var(--gutter-width);
border-bottom: var(--component-black-border);
padding-bottom: var(--component-padding);
}

.stagorg > .full, .buy > .full, .sell > .full  { grid-area: 1 / 1 / 3 / 2;  }

.stagorg > .cell1, .buy > .cell1, .sell > .cell1 { grid-area: content1; }
.stagorg > .cell2, .buy > .cell2, .sell > .cell2 { grid-area: content2; }

.stagorg > .cell2.content, .buy > .cell2.content, .sell > .cell2.content 
{ place-self: center center; }

#experience > div.bkgd.cell1 {
    min-height: auto;
}

.buy#experience {
    grid-template-areas: "content1"
                    "content2"
                    "content3"
                    "content4"
                    "content5"
                    "content6"
                    "content7"
                    "content8"
                    "content9"
                    "content10"
                    "content11"
                    "content12"
                    "content13"
                    "content14";
}

.buy#experience > .full { grid-area: 1 / 1 / 15 / 2; }
.buy#experience > .cell1 {grid-area: content1;}
.buy#experience > .cell2 {grid-area: content2;}
.buy#experience > .cell3 {grid-area: content3;}
.buy#experience > .cell4 {grid-area: content4;}
.buy#experience > .cell5 {grid-area: content5;}
.buy#experience > .cell6 {grid-area: content6;}
.buy#experience > .cell7 {grid-area: content7;}
.buy#experience > .cell8 {grid-area: content8;}
.buy#experience > .cell9 {grid-area: content9;}
.buy#experience > .cell10 {grid-area: content10;}
.buy#experience > .cell11 {grid-area: content11;}
.buy#experience > .cell12 {grid-area: content12;}
.buy#experience > .cell13 {grid-area: content13;}
.buy#experience > .cell14 {grid-area: content14;}

.sell#experience {
    grid-template-areas: "content1"
                    "content2"
                    "content3"
                    "content4"
                    "content5"
                    "content6"
                    "content7"
                    "content8";
}

.sell#experience > .full { grid-area: 1 / 1 / 15 / 2; }
.sell#experience > .cell1 {grid-area: content1;}
.sell#experience > .cell2 {grid-area: content2;}
.sell#experience > .cell3 {grid-area: content3;}
.sell#experience > .cell4 {grid-area: content4;}
.sell#experience > .cell5 {grid-area: content5;}
.sell#experience > .cell6 {grid-area: content6;}
.sell#experience > .cell7 {grid-area: content7;}
.sell#experience > .cell8 {grid-area: content8;}

.buy > .bkgd.cell1, .sell > .bkgd.cell1, .stagorg > .bkgd.cell1 {
    background-image: url(/Portals/1/Buying%20a%20home%20woman%20searching%20online.jpg);
    min-height: var(--vertical-img-height);
    background-size: cover;
    background-position: center;
}

#interiordesign > div.bkgd.cell1 {
    background-image: url(/Portals/1/Interior%20Design%20Plans%20and%20Paint%20Color%20Swatches.jpg);
}

#homestaging > div.bkgd.cell1 {
    background-image: url(/Portals/1/Home%20Staging%20Bedroom%20Nightstand.jpg);
}

#organizing > div.bkgd.cell1 {
    background-image: url(/Portals/1/Organizing%20Kitchen%20Pantry%20Shelves.jpg);
}

#renovation > div.bkgd.cell1 {
    background-image: url(/Portals/1/Renovation%20Consulting%20Couple%20Looking%20at%20Plans.jpg);
}

#professionalism > div.bkgd.cell1 {
    background-image: url(/Portals/1/Elderly%20couple%20moving.jpg);
}

.sell#fullservice > div.bkgd.cell1 {
    background-image: url(/Portals/1/Selling%20couple%20speaking%20to%20realtor%20at%20table.jpg);
}

.buy#fullservice > div.bkgd.cell1 {
    background-image: url(/Portals/1/Buying%20a%20home%20woman%20searching%20online.jpg);
}

#knowledge > div.bkgd.cell1 {
    background-image: url(/Portals/1/Selling%20a%20home%20sold%20sign.jpg);
}

.buy > .overlay.cell1, .sell > .overlay.cell1, .stagorg > .overlay.cell1 {
    border: var(--quicklinks-white-border);
    margin: var(--quicklinks-margin-overlay);
}

.buy#experience > div.bkgd.cell1, .sell#experience > div.bkgd.cell1 {
background-image: none;
height: fit-content;
}

#experience > div.cell2.content,#experience > div.cell4.content, #experience > div.cell6.content, #experience > div.cell8.content, #experience > div.cell10.content, #experience > div.cell12.content     {
    text-align: center;
}

#experience > div.content > img {
    width: 175px;
}

/* || COMING SOON PAGE */



/*Coming Soon Hero Banner */

.hero_banner {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(4, 1fr);
grid-column-gap: 0px;
grid-row-gap: 0px;
height: 200vw ;
}

.hero_logo_section { 
    grid-area: 1 / 1 / 4 / 2; 
    background-color: #000000;
    height: 130vw;
}
.hero_image_section{ 
    grid-area: 3 / 1 / 5 / 2; 
        height: 90vw;
    padding: 0em 1em;
    }



.hero_logo {
    width: 70%;
    display: block;
    height: 80vw;
    margin: 10vw auto;
}


    .hero_image {
    background-image: url(/Portals/1/HPG_Summary_HeroIMG.jpg);
    background-size: cover;
    height: var(--vertical-img-height);
    background-position: bottom;
}

/*Content text section*/

.content_grid {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr; 
grid-column-gap: 0px;
grid-row-gap: 6em;
margin-left: var(--gutter-width);
margin-right: var(--gutter-width);
padding-bottom: 3em;
margin-top: var(--component-margin-top);
}



.content_text_area { 
    grid-area: 1 / 1 / 2 / 2;
     }

h1.content_header {
    font-size: 5em;
}

h2.content_header {
    font-size: 3.5em;
}

h1.contact_header {
    font-size: 2.5em;
}

h2.contact_header {
    font-size: 2em;
}

.paragraph_text {
    font-size: 1.2em;
    color: #000000;
}

.contact_paragraph_text {
    font-size: 1.2em;
    color: #000000;
}



.content_contact_area {
    grid-area: 2 / 1 / 3 / 2; 
    margin-top: 3em;
}

.content_contact_section {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(2, 1fr);
grid-column-gap: 0px;
grid-row-gap: 0px;
}

.contact_text { grid-area: 1 / 1 / 2 / 2; }
.contact_info { grid-area: 2 / 1 / 3 / 2; }

#dnn_ctr1482_HtmlModule_lblContent > div.content_grid, #dnn_ctr1482_HtmlModule_lblContent > div > div.content_display > div.display_parent_grid {
    padding-left: var(--quicklinks-margin-content);
    padding-right: var(--quicklinks-margin-content);
}

#dnn_ctr1482_HtmlModule_lblContent > div > div.content_display {
        margin: 0em -24px;
}

#dnn_ctr1482_HtmlModule_lblContent > div > div.content_display > div.display_parent_grid {
    padding: 0px;
}


/*Display Area*/

    .content_display {
    grid-area: 2 / 1 / 3 / 2;
    /*background-color: #e9e9e6;*/
    height: 120vw;
    margin: 0em -1.1em;
}


.display_parent_grid  {
display: grid;
grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
grid-column-gap: 0px;
grid-row-gap: 0px;
    margin-left: auto;
    margin-right: auto;
    padding: 0em 1em;
}


/*left display content*/

left_display { 
   grid-area: 1 / 1 / 2 / 2;
           height: 70vw;
    }


.left_images_grid {
    position: relative;
    display: grid;
    transform: translateY(-5em);
    grid-template-columns: 1fr;
    grid-template-rows: .8fr 2fr;
    grid-column-gap: 0px;
    grid-row-gap: 14px;
    height: 100%;
    z-index: 100;
}


.wood_detail_image {
    grid-area: 1 / 1 / 2 / 2;
    width: 120%;
    background-size: cover;
    background-image: url(/Portals/1/WoodGrainDetailImage.jpg);
    height: 30vw;
}

.woman_display_image {
    grid-area: 2 / 1 / 3 / 2;
    width: 120%;
    background-size: cover;
    background-image: url(/Portals/1/HPG_Summary_ContentIMG.jpg);
    height: 80vw;
}

/*right display content*/

.right_display { 
    grid-area: 1 / 2 / 2 / 3;
        height: 30vw;
    }


.green_leaf_image {
height: 90vw;
    width: 100%;
    position: relative;
    transform: translateY(7em);
    background-size: cover;
    background-image: url(/Portals/1/GreenLeafBackgroundImage.jpg);
    /* text-align: right; */
    /* margin-bottom: -10em; */
}


/*bottom banner*/

.bottom_banner {
    height: 20vw;
    width:  100%;
    background-size: cover;
    background-image: url(/Portals/1/MarbleBackground_Strip.jpg);
}

.bottom_banner-overlay {
    background-color: rgba(0, 0, 0,.4);
    height: 20vw;
}

.bottom_banner_interactible {
    margin-left: auto;
    margin-right: auto;
    padding-top: 7%;
    text-align: center;
    height: 50%;
}

/*|| AGENT LIST*/

#dnn_ctr1459_HtmlModule_lblContent > h1 {
    text-align: center;
    margin-top: var(--component-padding);
}

.agentlist {
    display: grid;
    grid-column-gap: var(--grid-col-padding);
    grid-row-gap: var(--grid-row-padding);
   grid-template-columns: repeat(auto-fill,minmax(100%, 1fr));
    margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}

.agentcard {
display: grid;
grid-template-columns: 1fr;
grid-column-gap: var(--grid-col-padding);
grid-row-gap: var(--grid-row-padding);
grid-template-areas: "content1"
"content2";
margin-top: var(--quicklinks-margin-content);
}

.agentcard > div.cell1 { grid-area: content1; }
.agentcard > div.cell2 { grid-area: content2; text-align: center; }

.agentcard.hpg > div.cell1.content > a > img {
    width: 100%;
}

.agentcard.hpg > div.bkgd.cell1 {
        border: solid 3px var(--tertiary-bg-color);
}

.agentcard.hpg > div.content.cell1 {
        padding: 3px;
}

.agentcard.hpg > div.cell2.content > h2 {
    font-weight: 700;
}

.agentcard.hpg > div.cell2.content > h2 > a:hover {
text-decoration: underline;
}

/*|| AGENT PAGES*/

.agentcontact {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "content";
    margin-top: var(--component-margin-top);
    margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}

.agentcontact > .full {
    grid-area: 1 / 1 / 2 / 2;
}

#dnn_ctr1463_ModuleContent, #dnn_ctr1466_ModuleContent, #dnn_ctr571_ModuleContent {
    margin-top: var(--quicklinks-margin-content);
    margin-left: var(--gutter-width);
    margin-right: var(--gutter-width);
}


/*|| CONTACT PAGE */

.hero#info {
grid-row-gap: var(--grid-row-padding);
margin-right: var(--gutter-width);
margin-left: var(--gutter-width);
margin-top: var(--gutter-width);
}

#info > div.cell2.content {
    margin-bottom: var(--gutter-width);
    padding-bottom: var(--gutter-width);
    place-self: center center;
}

.hero.hpg > div.content > h2, .hero.hpg> div.content > h1 {
    text-transform: uppercase;
}

.dg-form-content.form-line .form-control-wrap input[type=text], .dg-form-content.form-line .form-control-wrap input[type=email], .dg-form-content.form-line .form-control-wrap input[type=url], .dg-form-content.form-line .form-control-wrap input[type=tel], .dg-form-content.form-line .form-control-wrap input[type=number], .dg-form-content.form-line .form-control-wrap input[type=date], .dg-form-content.form-line .form-control-wrap select, .dg-form-content.form-line .form-control-wrap textarea {
    border-bottom-color: #000000;
    border-bottom-width: 3px!important;
}

/*||THANK YOU PAGE*/

#messsage > div.bkgd.cell2 {
    background-image: url(/Portals/1/Black-mailbox-on-green-door.jpg);
    height: var(--vertical-img-height);
    background-position: center;
    background-size: cover;
}

#messsage > div.cell2.content > img {
    display: none;
}

/*|| FOOTER*/

.footer.hpg {
display: grid;
grid-template-columns: 1fr;
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-areas: "content1"
"content2"
"content3"
"content4"
"content5";
border-bottom: var(--component-white-border);
}

#footer > div.content {
    margin: var(--quicklinks-margin-content);
}

.footer > div.full { grid-area: 1 / 1 / 6 / 2; }
.footer > div.cell1 { grid-area: content1; }
.footer > div.cell2 { grid-area: content2; }
.footer > div.cell3 { grid-area: content3; }
.footer > div.cell4 { grid-area: content4; }
.footer > div.cell5 { grid-area: content5; }


.hpg.footer > div.content > h3 > a, .hpg.footer > div.content > p > a, .hpg.footer > div.content > p, .hpg.footer > div.content > a {
    color: var(--secondary-txt-color);
}

.hpg.footer > div.bkgd.full {
    background-image: var(--image-marble-black);
}

.hpg.footer > div.overlay.full {
    background-color: var(--main-bg-color);
}

.hpg.footer > div.content > div.hpg_divider_center, .hpg.footer > div.content > div.hpg_divider_left {
    background-color: var(--secondary-bg-color);
}

.hpg.footer > div.cell3.content > p > img {
    width: 30px;
}

.hpg.footer > div.cell4.content > a {
    width: 100%;
    display: inline-block;
    padding-top: 1em;
}

#footer > div.content > a:hover {
text-decoration: underline;
}

#footer > div.cell5.content > img {
    height: 30vw;
}

#footer > div.cell5.content {
    place-self: end;
    margin-bottom: -3px;
}

.footer-10 .footer-top {
    display: none;
}

#footer > div.cell3.content > p:nth-child(4) > a:nth-child(1), #footer > div.cell3.content > p:nth-child(5) > a:nth-child(1), #footer > div.cell3.content > p:nth-child(6) > a:nth-child(1), #footer > div.cell3.content > p:nth-child(3) > a:nth-child(1) {
    padding: 10px;
    background-color: var(--secondary-bg-color);
    border-radius: 3px;
    color: var(--main-txt-color);
}

#footer > div.cell3.content > p:nth-child(4) > a:nth-child(1):hover, #footer > div.cell3.content > p:nth-child(5) > a:nth-child(1):hover, #footer > div.cell3.content > p:nth-child(6) > a:nth-child(1):hover, #footer > div.cell3.content > p:nth-child(3) > a:nth-child(1):hover {
    background-color: var(--accent-bg-color);
    color: var(--secondary-txt-color);
}

#footer > div.cell3.content > p:nth-child(3) > a:nth-child(2):hover, #footer > div.cell3.content > p:nth-child(4) > a:nth-child(2):hover, #footer > div.cell3.content > p:nth-child(5) > a:nth-child(2):hover {
    text-decoration: underline;
}

#footer > div.cell3.content > p:nth-child(4) > a:nth-child(1) {
    padding: 10px 13px 10px 13px;
}

#footer > div.cell3.content > p:nth-child(2) {
    margin-bottom: var(--component-margin-top-secondary);
}

#footer > div.cell3.content > p:nth-child(4) > a:nth-child(1):hover, #footer > div.cell3.content > p:nth-child(5) > a:nth-child(1):hover, #footer > div.cell3.content > p:nth-child(6) > a:nth-child(1):hover {
    background-color: var(--accent-bg-color);
    color: var(--secondary-txt-color);
    text-decoration: none;
}

#footer > div.cell3.content > p:nth-child(5) > a:nth-child(1) {
    padding-right: 7px;
}


#footer > div.cell3.content > p:nth-child(3), #footer > div.cell3.content > p:nth-child(4), #footer > div.cell3.content > p:nth-child(5) {
    padding-bottom: 23px;
}

/*footer bottom*/

.footer-10 .footer-bottom {
font-size: 12px;
/*border-bottom: var(--component-white-border);*/
}
.website_credits > p {
color: var(--secondary-txt-color);
font-size: 12px;
padding-top: var(--quicklinks-padding-content);
margin-left: var(--quicklinks-margin-content);
margin-right: var(--quicklinks-margin-content);
font-family: var(--primary-font-family);
}

.footer-10 .footer-bottom {
font-family: var(--primary-font-family);
color: var(--secondary-txt-color);
background-color: var(--main-bg-color);
padding: var(--quicklinks-padding-content);
}

/* || 404 ERROR PAGE*/

#errorpage {
    display: grid;
    grid-template-columns: 1fr;
    /*grid-template-rows: 1fr;*/
    grid-column-gap: 0px;
    grid-row-gap: var(--grid-row-padding);
    grid-template-areas: "content1" 
                         "content2";
}

#errorpage > div.full { grid-area: 1 / 1 / 3 / 2; }
#errorpage > div.cell1 { grid-area: content1; }
#errorpage > div.cell2 { grid-area: content2; }

/*#errorpage > div.cell1.bkgd {
border-bottom: var(--component-black-border);
}*/

#errorpage > div.cell1.content {
place-self: end center;
}

#errorpage > div.cell1.content > img {
     width: 100vw;
}

#errorpage > div.cell2.content {
    place-self: start center;
    margin-bottom: var(--gutter-width);
}

#errorpage > div.bkgd.cell1 {
    background-image: none;
        border-bottom: 3px solid var(--main-bg-color);
    min-height: var(--vertical-img-height-secondary);
}

#errorpage > div.cell1.content > h1 {
    font-size: 38vw;
    -webkit-text-stroke: 3px var(--main-bg-color);
    color: white;
        margin-bottom: 0px;
    line-height: .745;
}





/*MEDIA QUERIES*/

/*DESKTOP*/

@media screen and (min-width: 992px) {
h1 {
    font-size: var(--desk-title-font-size);
}

h2 {
    font-size: var(--desk-subtitle-font-size);
}

h3 {
    font-size: var(--desk-title-font-size);
}

div.shade {
    border-bottom: 3px solid #ffffff;
}

.hero_banner {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    height: 60vw;
}

.hero_logo_section { 
    grid-area: 1 / 1 / 2 / 2; 
    height: 60vw;
}

.hero_image_section { 
    grid-area: 1 / 2 / 2 / 3; 
    padding: 0em;
    height: 60vw;
}

.hero_image, #messsage > div.bkgd.cell2 {
    height: 80vh;
}

.hero_logo {
     margin: auto;
    height: 60vw;
}

.content_grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
    padding-top: 5vw;
}

.content_text_area {
    grid-area: 1 / 1 / 2 / 2;
    place-self: center;
    margin-right: var(--quicklinks-margin-content);
}

.content_display {
    grid-area: 1 / 2 / 2 / 3;
    height: 40vw;
}

.content_contact_section {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
}

.contact_text {
    grid-area: 1 / 1 / 2 / 2;
}

.contact_info {
    grid-area: 1 / 2 / 2 / 3;
}

.content_display  { 
   height: 40vw;
   margin: 0em;
    }

    .display_parent_grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
        grid-column-gap: 18px;
    grid-row-gap: 0px;
padding: 0em 2em;
}

.left_display {
    grid-area: 1 / 1 / 2 / 2;
    height: 35vw;
}

.left_images_grid {
     transform: translateY(7em);
}

.wood_detail_image {
    height: 100%;
    width: 100%;
}

.woman_display_image {
    width: 100%;
    height: 100%;
}

.right_display {
    grid-area: 1 / 2 / 2 / 3;
    height: 35vw;
}

.green_leaf_image {
    transform: translateY(-7em);
        height: 100%;
    width: 100%;
    margin-left: 0%;
}

.bottom_banner, .bottom_banner-overlay {
    height: 12vw;
}

.bottom_banner_interactible {
       padding-top: 4.5%;
}

/* || QUICK LINKS COMPONENT DESKTOP*/

.quicklinks {
    display: grid;
       grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 0px;
    grid-template-areas: "content1 content2 content3";
}

/*|| COMPONENTS */

.hero.hpg {
        display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "content2 content1";
}

.hero.hpg > .cell1.content {
    place-self: center center;
}
.hero.hpg > .cell1.bkgd {
    background-color: var(--main-bg-color);
}

#hpg-home-hero > div.content {
    margin: var(--quicklinks-padding-content);
}

#selling, #buying, #emaillistings {
   grid-template-columns: 40vw 60vw;
    grid-template-areas: "cell1 cell2";
    min-height: 50vh;
}

#buying {
   grid-template-columns: 60vw 40vw;
    grid-template-areas: "cell2 cell1";
}

#emaillistings > div.full, #buying > div.full, #selling > div.full { grid-area: 1 / 1 / 2 / 3; }

#selling > div.cell1.content, #buying > div.cell1.content, #emaillistings> div.cell1.content {
    padding-top: 0px;
}

#selling > div.cell1.content, #emaillistings > div.cell1.content {
    place-self: end start;
}

#selling > div.cell2.content {
    place-self: start end;
    text-align: right;
}

#selling > div.cell1.content > a > img, #emaillistings > div.cell1.content > a > img {
    height: 275px;
}

#buying > div.cell1.content > img {
    height: 200px;
}

/*|| HOME VALUATION*/

#homevaluation {
display: grid;
    grid-template-columns: 25vw 50vw 25vw;
    /* grid-template-rows: 1fr; */
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas:  "content1 content2 content3";
}

#homevaluation > .full { grid-area: 1 / 1 / 3 / 4;}

#homevaluation > .cell1 { place-self: end center;}
#homevaluation > div.cell1.content > a > img {
    width: 100%;
} 

#homevaluation > .cell2 { place-self: center; }

#homevaluation > div.cell3.content {
    place-self: center center;
}

/*|| Staging & Organizing Component*/

#stagingandorganizing {
    grid-template-columns: repeat(4, 1fr);
    grid-template-areas: "content1 content1 content1 content1"
    "content2 content4 content6 content8"
    "content3 content5 content7 content9"
    "content10 content10 content10 content10";
}

#stagingandorganizing > .full { grid-area: 1 / 1 / 5 / 5; }


/*|| BREADCRUMBS DESKTOP */

.hpg.fullscreen.breadcrumb {
    display: grid;
grid-template-columns: 40vw 60vw;
/*grid-template-rows: repeat(2, 1fr);*/
 grid-template-areas:  "content1 content2"
        "content1 content3";
min-height: 75vh;
}

.selling.hpg.fullscreen.breadcrumb {
    grid-template-columns: 60vw 40vw;
     grid-template-areas:  "content2 content1"
        "content3 content1";
}

.hpg.fullscreen.breadcrumb > div.full {
    grid-area: 1 / 1 / 3 / 3;
}

.hpg.fullscreen.breadcrumb > div.cell1.bkgd {
    height: 100%;
}

.hpg.fullscreen.breadcrumb > div.cell3.content {
    place-self: end;
}

.selling.hpg.fullscreen.breadcrumb > div.cell3.content {
    place-self: end start;
}

.hpg.fullscreen.breadcrumb > div.cell3 {
    margin-top: -175px;
}

.selling.hpg.fullscreen.breadcrumb > div.cell3.content > img {
    padding-right: 0px;
    padding-left: var(--quicklinks-margin-content);
}

.hpg.fullscreen.breadcrumb > div.cell2.content > h1, .hpg.fullscreen.breadcrumb > div.cell2.content > h3  {
    font-size: var(--desk-title-font-size);
}



/*|| ABOUT PAGES DESKTOP*/

.about.breadcrumb.hpg {
display: grid;
grid-template-columns: 22vw 24vw 37vw 17vw;
/*grid-template-rows: repeat(2, 1fr);*/
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-areas: "content1 content1 content1 content1"
"content2 content3 content4 content5";
}

.about.hpg.breadcrumb > div.full { grid-area: 1 / 1 / 3 / 5; }
.about.hpg.breadcrumb > div.cell2 { display: inherit; place-self: end start;}
.about.hpg.breadcrumb > div.cell3 { display: inherit; place-self: end center; }
.about.hpg.breadcrumb > div.cell4.content { place-self: end; }

.about.hpg.breadcrumb > div.cell2.content > img {width: 22vw;}
.about.hpg.breadcrumb > div.cell3.content > img {width: 15vw;}
.about.hpg.breadcrumb > div.cell4.content > img {width: 25vw; height: auto; margin-left: 0px;}
.about.hpg.breadcrumb > div.cell5.content > img {width: 14vw; height: auto;}

/* || AGENT LIST DESKTOP*/

.agentlist {
    display: grid;
    grid-column-gap: var(--grid-col-padding);
    grid-row-gap: var(--grid-row-padding);
   grid-template-columns: repeat(auto-fill,minmax(45%, 1fr));
}

/*|| Agent PAGES*/

.breadcrumb.agentinfo {
    display: grid;
    grid-template-columns: 25vw 50vw 25vw;
    /*grid-template-rows: 1fr;*/
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "content1 content2 content2"
  "content1 content2 content2"
   "content1 content3 content3";
    height: fit-content;
}

.breadcrumb.agentinfo > div.full { grid-area: 1 / 1 / 3 / 4; }

.breadcrumb.agentinfo > div.cell3 {
    place-self: end;
}
.breadcrumb.agentinfo > div.cell2 {
    place-self: center start;
}


/*|| Buying, Selling, Staging Organizing PAGES DESKTOP*/


.stagorg, .buy, .sell {
grid-template-columns: repeat(2, 1fr);
/*grid-template-rows: 1fr;*/
grid-template-areas: "content1 content2";
}

#interiordesign, #organizing, .buy#fullservice {
grid-template-areas: "content2 content1";
}

.stagorg > .full, .buy > .full, .sell > .full  { grid-area: 1 / 1 / 2 / 3; }

.buy > .bkgd.cell1, .sell > .bkgd.cell1, .stagorg > .bkgd.cell1 {
    height: auto;
}

#experience > div.cell1.content, #experience > div.cell14.content {
    text-align: center;
}


.buy#experience {
    grid-template-columns: 10% 38% 10% 38%;
    grid-template-areas: "content1 content1 content1 content1"
                    "content2 content3 content4 content5"                   
                    "content6 content7 content8 content9"                   
                    "content10 content11 content12 content13"               
                    "content14 content14 content14 content14";
}


.buy#experience > .full { grid-area: 1 / 1 / 6 / 5; }


.sell#experience {
    grid-template-columns: 10% 38% 10% 38%;
    grid-template-areas: "content1 content1 content1 content1"
                    "content2 content3 content4 content5"                   
                    "content6 content7 . ."              
                    "content8 content8 content8 content8";
}

.sell#experience > .full { grid-area: 1 / 1 / 5 / 5;  }


#experience > div.content > img {
    width: 100%;
}

/* || CONTACT DESKTOP*/
#info > div.bkgd.cell1 {
    background-color: transparent;
}
#info {
    grid-template-areas: "content1 content2";
}

.hero#info {
    grid-column-gap: var(--grid-col-padding);
}

/* FOOTER DESKTOP*/

#footer > .content > h3 {
    font-size: var(--tab-title-font-size);
}

.footer.hpg {
    grid-template-columns: 50vw 25vw 25vw;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas:  "content1 content3 content2"
"content4 content4 content4"
"content5 content5 content5";
        }

.footer > div.full {
   grid-area: 1 / 1 / 4 / 4;
}

.hpg.footer > div.cell4.content > a {
    width: 20vw;
}

.hpg.footer > div.cell4 {
    padding-top: var(--component-margin-top);
}

.hpg.footer > div.cell4.content {
        padding-right: 10vw;
            position: relative;
    z-index: 9;
}

#footer > div.cell5.content > img {
    width: 15vw;
    height: auto;
}

#footer > div.cell5 {
margin-top: -200px;

}

/*footer bottom*/
.website_credits > p  {
padding-top: 0em;
}

/* || 404 Error Page - Desk*/

#errorpage {
    min-height: 80vh;
}

#errorpage > div.cell1.content > h1 {
    font-size: 20vw;
}


    /*END DESKTOP*/
}


/*TABLET*/

@media all and (min-width:768px) and (max-width:991px) {

h1, h2 {
    font-size: var(--tab-title-font-size);
}

.hero_banner {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    height: 60vw;
}

.hero_logo_section { 
    grid-area: 1 / 1 / 2 / 2; 
    height: 60vw;
}

.hero_image_section { 
    grid-area: 1 / 2 / 2 / 3; 
    padding: 0em;
    height: 60vw;
}

.hero_image{
    height: 60vw;
}

.hero_logo {
     margin: auto;
    height: 60vw;
}

.content_grid {
    grid-template-rows: 1fr;
    padding-bottom: 4em;
}

.content_contact_section {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
}

.contact_text {
    grid-area: 1 / 1 / 2 / 2;
}

.contact_info {
    grid-area: 1 / 2 / 2 / 3;
}

.content_display  { 
   height: 70vw;
margin: 0em -1.7em;
    }

.display_parent_grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
        grid-column-gap: 18px;
    grid-row-gap: 0px;
padding: 0em 2em;
}

.left_display {
    grid-area: 1 / 1 / 2 / 2;
    height: 60vw;
}

.left_images_grid {
     transform: translateY(7em);
}

.wood_detail_image {
    height: 100%;
    width: 100%;
}

.woman_display_image {
    width: 100%;
    height: 100%;
}

.right_display {
    grid-area: 1 / 2 / 2 / 3;
    height: 60vw;
}

.green_leaf_image {
    transform: translateY(-7em);
        height: 100%;
    width: 100%;
    margin-left: 0%;
}

/*|| COMPONENTS TABLET */
.hero.hpg {
        display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "content1 content2";
}

.hero.hpg > .cell1 {
    place-self: center center;
}

#hpg-home-hero > div.content {
    padding-bottom: var(--component-padding);
}

/*|| BREADCRUMBS TABLET */

.hpg.fullscreen.breadcrumb {
    display: grid;
grid-template-columns: 50vw 50vw;
/*grid-template-rows: repeat(2, 1fr);*/
 grid-template-areas:  "content1 content2"
        "content1 content3";
}

.selling.hpg.fullscreen.breadcrumb {
    grid-template-columns: 60vw 40vw;
     grid-template-areas:  "content2 content1"
        "content3 content1";
}

.hpg.fullscreen.breadcrumb > div.full {
    grid-area: 1 / 1 / 3 / 3;
}

.hpg.fullscreen.breadcrumb > div.cell1.bkgd {
    height: 100%;
}

.hpg.fullscreen.breadcrumb > div.cell3.content {
    place-self: end;
}

.hpg.fullscreen.breadcrumb > div.cell3 {
    margin-top: -175px;
}

.hpg.fullscreen.breadcrumb > div.cell2.content > h1, .hpg.fullscreen.breadcrumb > div.cell2.content > h3  {
    font-size: var(--tab-title-font-size);
}

.selling.hpg.fullscreen.breadcrumb > div.cell3.content {
    place-self: end start;
}


.hpg.fullscreen.breadcrumb > div.cell2.content {
    margin-top: 0px;
}

/*|| HOME PAGES TABLET*/

.quicklinks {
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: var(--grid-col-padding);
    grid-template-areas: "content1 content2 content3";
}

h3 {
    font-size: var(--tab-title-font-size);
}

/*|| ABOUT PAGES TABLETP*/

.about.breadcrumb.hpg {
display: grid;
grid-template-columns: 25vw 50vw 25vw;
/*grid-template-rows: repeat(2, 1fr);*/
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-areas: "content1 content1 content1"
"content3 content4 content5";
}

.about.hpg.breadcrumb > div.full { grid-area: 1 / 1 / 3 / 5; }
.about.hpg.breadcrumb > div.cell3 { display: inherit; place-self: end center; }
.about.hpg.breadcrumb > div.cell4.content { place-self: end; }

.about.hpg.breadcrumb > div.cell3.content > img {width: 23vw;}
.about.hpg.breadcrumb > div.cell4.content > img {width: 45vw; height: auto; margin-left: 0px;}
.about.hpg.breadcrumb > div.cell5.content > img {width: 22vw; height: auto;}

.agentlist {
    display: grid;
    grid-column-gap: var(--grid-col-padding);
    grid-row-gap: var(--grid-row-padding);
   grid-template-columns: repeat(auto-fill,minmax(45%, 1fr));
}

.breadcrumb.agentinfo {
    grid-template-columns: 40% 60%;
    grid-template-areas: "content1 content2"
        "content1 content2"
        "content1 content3";
    height: fit-content;
}

.breadcrumb.agentinfo > div.full {
    grid-area: 1 / 1 / 4 / 4;
}

#homevaluation > div.cell1.content {
    place-self: end;
}

#homevaluation > div.cell1.content > a > img, #emaillistings > div.cell1.content > a > img {
    height: 250px;
}

/*|| Buying, Selling, Staging Organizing PAGES TABLET*/

.hpg.fullscreen.breadcrumb > div.cell1.bkgd {
    min-height: var(--vertical-img-height-secondary);
}


#experience > div.cell1.content, #experience > div.cell14.content {
    text-align: center;
}


.buy#experience {
    grid-template-columns: 10% 38% 10% 38%;
    grid-template-areas: "content1 content1 content1 content1"
                    "content2 content3 content4 content5"                   
                    "content6 content7 content8 content9"                   
                    "content10 content11 content12 content13"               
                    "content14 content14 content14 content14";
}


.buy#experience > .full { grid-area: 1 / 1 / 6 / 5; }


.sell#experience {
    grid-template-columns: 10% 38% 10% 38%;
    grid-template-areas: "content1 content1 content1 content1"
                    "content2 content3 content4 content5"                   
                    "content6 content7 . ."              
                    "content8 content8 content8 content8";
}

.sell#experience > .full { grid-area: 1 / 1 / 5 / 5;  }


#experience > div.content > img {
    width: 100%;
}

.buy > .bkgd.cell1, .sell > .bkgd.cell1, .stagorg > .bkgd.cell1 {
    min-height: var(--vertical-img-height-secondary);
}

#stagingandorganizing {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "content1 content1"
    "content2 content4"
    "content3 content5"
    "content6 content8"
    "content7 content9"
    "content10 content10";
}

#stagingandorganizing > .full { grid-area: 1 / 1 / 7 / 3; }

/*|| CONTACT PAGE TABLET*/

.hpg.quicklinks#ourservices {
    grid-template-columns: 28% 40% 28%;
}

#ourservices > div.cell2.content {
    padding: 5px;
}

/* FOOTER TABLET*/

.footer.hpg {
    grid-template-columns: 50vw 50vw;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas:  "content1 content1"
"content3 content2"
"content4 content4"
"content5 content5";
}

.footer > div.full {
   grid-area: 1 / 1 / 5 / 3; 
}

.hpg.footer > div.cell4.content > a {
    width: 30vw;
}

.hpg.footer > div.cell4 {
    padding-top: var(--component-margin-top);
}

.hpg.footer > div.cell4.content {
        padding-right: 20vw;
            position: relative;
    z-index: 9;
}

#footer > div.cell5.content > img {
    width: 20vw;
    height: auto;
}

#footer > div.cell5 {
margin-top: -150px;

}

/*footer bottom*/
.website_credits > p  {
padding-top: 0em;
}

    /*END TABLET*/
}