/*----------------------------------+
 | Site: Regional Housing Solutions |
 | Part: Master stylesheet          |
 +----------------------------------*/

/* Imports
=====================================================================*/
@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(//fonts.googleapis.com/css?family=Lora:400,400i,700,700i|Montserrat:300,400,700);
@import url(reset.css);
@import url(we-master.css);
@import url(forms.css);
@import url(ie.css);

/* Fonts
=====================================================================*/
.accordion,
.action,
.credit,
#find,
.flag,
h1, h2, h3, h4, h5, h6,
#header,
#issues-toggle,
.jump,
.mapboxgl-popup-content,
#menu,
.mute,
.qtip,
.share {
    font-family: Montserrat, Arial, sans-serif;
}

body, input, select, .strategies dd, textarea { font-family: Lora, Georgia, "Times New Roman", Times, serif; }


/* Basics
=====================================================================*/
a { color: #1f8090; text-decoration: none; }
a:hover { text-decoration: underline; }
body { background: #333; line-height: 1.55; }
cite, em { font-style: italic; }
dl, ol, p, table, ul { margin-bottom: 1.55em; }
dt { margin-top: 1.55em; }
dt:first-child { margin: 0; }
dt, h2, h3, h4, h5, h6, strong { font-weight: bold; }
html { font-size: 18px; height: 100%; }
h1 { font-size: 2.5rem; font-weight: 400; line-height: 1.2; }
h2 { font-size: 1.66rem; line-height: 1.2; margin-bottom: 0.3em; }
h3 { font-size: 1.2rem; line-height: 1.2; margin-bottom: 0.2em; }
hr { background: rgba(0, 0, 0, 0.2); border: 0; clear: both; color: rgba(0, 0, 0, 0.2); height: 1px; margin: 40px 0; }
img { max-width: 100%; }
li { margin-bottom: 0.5em; }
ol { list-style: decimal; margin-left: 2em; }
table { border-collapse: collapse; width: 100%; }
tbody td, tbody th { border: 1px solid #ddd; }
td, th { padding: 0.5em 1em; }
th { font-weight: bold; }
ul { list-style: disc; margin-left: 1.5em; }
ul ul { list-style: circle; margin-bottom: 0; margin-top: 0.5em; }


/* Layout
=====================================================================*/
.clear { clear: both; }
#main { background: #fff; display: block; padding-top: 80px; }

/* Content */
.content-primary { float: left; width: 58.9%; }
.content-secondary { float: right; width: 38.35%; }

/* Map */
#find { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
#find #header { flex: 0 0 auto; position: static; }
#find #main { display: flex; flex: 1 1 auto; min-height: 0px; padding-top: 0; }

#find-primary {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    flex: 1 1 25%;
    max-width: 350px;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
    padding: 30px;
    position: relative;
    z-index: 1000;
}

#find-secondary { flex: 1 1 auto; overflow: hidden; position: relative; width: 75%; }


/* Content
=====================================================================*/
/* Accordions */
.ui-accordion { background: #fff; border: 1px solid #ddd; font-size: 0.88rem; font-weight: 300; }
.ui-accordion .ui-accordion-content { border-bottom: 1px solid #ddd; padding: 1rem; }
.ui-accordion .ui-accordion-header { border: 0; border-bottom: 1px solid #ddd; border-radius: 0; color: #1f8090; font-size: 1rem; font-weight: normal; margin: 0; padding: 0.5em; }
.ui-accordion .ui-accordion-header:hover { background: #f5f5f5; cursor: pointer; }
.ui-accordion .ui-accordion-header:last-of-type { border-bottom: 0; }
.ui-accordion .ui-accordion-header .fa-square-o { color: #777; }
.ui-accordion .ui-accordion-header-icon { display: none; }
.ui-accordion .ui-accordion-header-active { background: none; border-bottom: 0; font-weight: bold; }

    /* Map */
    .accordion-map { margin-bottom: 1em; }
    .accordion-map .ui-accordion-content { padding: 0; }
    .accordion-map .ui-accordion-content ol { list-style: none; margin: 0; }
    .accordion-map .ui-accordion-content ol a { display: block; padding: 0.2em 1em; }
    .accordion-map .ui-accordion-content ol a:hover, .accordion-map .ui-accordion-content ol a.active { background: #1f8090; color: #fff; text-decoration: none; }
    .accordion-map .ui-accordion-content ol li { margin: 0; }
    
    /* Strategies */
    .strategies { background: #fff; border: 1px solid #ddd; margin: 1rem 0 2rem; }
    .strategies dd { border-bottom: 1px solid #ddd; display: none; font-size: 1rem; padding: 1rem; }
    .strategies dt { border-bottom: 1px solid #ddd; color: #1f8090; font-size: 1rem; font-weight: normal; margin: 0; padding: 0.5em 1em; }
    .strategies dt:hover { background: #f5f5f5; cursor: pointer; }
    .strategies dt:last-of-type { border-bottom: 0; }
    .strategies dt.active { border-bottom: 0; padding-bottom: 0; }
    .strategies dt.active .mute { display: none; }
    .strategies dt .mute { display: block; font-weight: 300; }

/* Action buttons */
.action {
    -webkit-appearance: none;
    background: #1f8090;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 1.22rem;
    font-weight: 300;
    padding: 0.7em 1em;
    vertical-align: middle;
}

.action:hover { opacity: 0.6; text-decoration: none; }

/* Browse */
.browse { margin-bottom: 1.5em; }
.browse li, .browse p { white-space: nowrap; }
.browse li, .browse p, .browse ul { display: inline; margin: 0 1em 0 0; }
.browse ul { list-style: none; margin-left: 0; }

/* Browse by category */
.browse-category { background: #fff; color: #000; margin-top: 1.5em; max-height: 400px; overflow-x: hidden; overflow-y: scroll; padding: 30px 40px 40px; text-align: left; }
.browse-category .close { float: right; font-size: 35px; opacity: 0.4; }
.browse-category .close:hover { opacity: 1; }
.browse-category h2 { font-size: 1.5rem; margin-bottom: 0.5em; }
.browse-category ul { margin: 0; }

/* Callouts */
[class *= "call"] { font-size: 12px; line-height: 1.3; margin-bottom: 15px; max-width: 100%; }
[class *= "call"] img { display: block; margin-bottom: 5px; }
[class *= "call"] img.icon { display: inline; }
[class *= "call"] p { margin-bottom: 0.5em; }
.call-c, .pull-c { clear: both; display: block; margin: 1em auto; }
.call-c img { margin: 0 auto; }
.call-l, .pull-l, .pull-small-l { clear: left; float: left; margin: 0 30px 10px 0; }
.call-r, .pull-r, .pull-small-r { clear: right; float: right; margin: 0 0 10px 30px; }
dt img.call-l { margin-top: 0; }
.credit { font-size: 11px; letter-spacing: 0.01em; margin: 0.5em 0; text-align: right; }
.credit a { color: #7f8183; }
.pull, .pull-l, .pull-r { color: #4d4d4d; font-size: 24px; font-weight: bold; line-height: 1.3; }
.pull-l, .pull-r { width: 42.15%; }
[class *= "pull-small"] { border: 1px solid #ccc; border-width: 2px 0; font-size: 16px; line-height: 1.6; width: 42.15%; padding: 1em 0; }
[class *= "pull"] blockquote cite { color: #666; display: block; font-size: 16px; font-weight: normal; text-align: right; }
[class *= "pull"] .mute { font-weight: normal; }
[class *= "pull"] p { margin-bottom: 0.5em; }

/* Charts */
    /* Bars */
    .bar { background: #e6e6e6; position: relative; }
    .bar .value { height: 20px; }
    
    /* Bar chart list */
    .bar-list { font-size: 0.7rem; list-style: none; margin: 0; }
    .bar-list .bar { flex: 1 1 auto; width: 30%; }
    .bar-list .label { flex: 1 1 auto; overflow: hidden; text-align: right; text-overflow: ellipsis; white-space: nowrap; width: 30%; }
    .bar-list .idx { flex: 0 0 4.5em; padding: 0 1em; text-align: right; }
    .bar-list li { align-items: center; display: flex; justify-content: space-between; margin-bottom: 2px; }
    .bar-list li:hover { background: #f5f5f5; }
    
    /* Colors */
    .value.sub1 { background: #f1c119; }
    .value.sub2 { background: #90d113; }
    .value.sub3 { background: #df8225; }
    .value.sub4 { background: #1eb568; }
    .value.sub5 { background: #a45d95; }
    .value.sub6 { background: #cd5f3a; }
    .value.sub7 { background: #0d2d7a; }
    .value.sub8 { background: #1f8090; }
    
    /* Stacked bar */
    .stacked-bar { display: flex; height: 2rem; }

/* Columns */
.c2l, .c2r { width: 48%; }
.c2l, .c3l, .c3m { float: left; }
.c2r, .c3r { float: right; }
.c3l { margin-right: 3%; }
.c3l, .c3m, .c3r { width: 31%; }

    /* Text flow */
    .cols2 { -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
    .cols3 { -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; }
    .cols4 { -moz-column-count: 4; -webkit-column-count: 4; column-count: 4; }
    .cols2, .cols3, .cols4 { -moz-column-gap: 40px; -webkit-column-gap: 40px; column-gap: 40px; }
    [class *= "cols"] li { -webkit-column-break-inside: avoid; column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; margin: 0; }
    [class *= "cols"] p { margin: 0; }
    ol[class *= "cols"], ul[class *= "cols"] { list-style: none; margin-left: 0; }

/* Colors */
.sub1 { color: #f1c119; }
.sub2 { color: #90d113; }
.sub3 { color: #df8225; }
.sub4 { color: #1eb568; }
.sub5 { color: #a45d95; }
.sub6 { color: #cd5f3a; }
.sub7 { color: #0d2d7a; }
.sub8 { color: #1f8090; }

/* Covers */
.cover {
    align-items: flex-end;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
    display: flex;
    min-height: 60vh;
}

.cover a { color: #fff; }
.cover .credit { bottom: -2.5em; position: absolute; right: 1em; z-index: 500; }
.cover .we-section-content { flex: 1 1 auto; }
.cover-credit { color: #aaa; float: right; padding: 0 20px; }
.cover-home { align-items: center; box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.5); min-height: 80vh; text-align: center; }
.cover-home .action { background: none; border: 1px solid #fff; }
.cover-home .action:hover { background: rgba(255, 255, 255, 0.3); opacity: 1; }
.cover-home .browse-category a { color: #1f8090; }
.cover-home .we-section-content { flex: 1 1 auto; max-width: 870px; }
.cover-home h1 { margin-bottom: 0.5em; }

/* Flags */
.flag { color: #fff; display: inline-block; font-weight: normal; padding: 0.5em 1em; }
.flag a { color: #fff; }
.flag.sub1 { background: #f1c119; }
.flag.sub2 { background: #90d113; }
.flag.sub3 { background: #df8225; }
.flag.sub4 { background: #1eb568; }
.flag.sub5 { background: #a45d95; }
.flag.sub6 { background: #cd5f3a; }
.flag.sub7 { background: #0d2d7a; }
.flag.sub8 { background: #1f8090; }

    /* Flag lists */
    .flag-list { font-size: 0.7rem; list-style: none; line-height: 1.4; margin: 0; }
    .flag-list li { display: inline-block; }

/* Footer */
#footer { color: rgba(255, 255, 255, 0.5); padding: 2% 40px 5%; text-align: center; }
#footer a, #footer h6 { color: #fff; }
#footer h6 { font-size: 1.33rem; margin-bottom: 0.5em; font-weight: normal; }
#footer .logos { margin-bottom: 3em; }
#footer .logos img[src*="-color"] { display: none; }

/* Geography */
.geo { display: flex; justify-content: space-between; min-height: 550px; }
.geo-primary { width: 31.81%; }
.geo-secondary { position: relative; width: 65.9%; }

/* Header */
#header {
    align-items: center;
    background: #333;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    display: flex;
    justify-content: space-between;
    padding: 15px 40px;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#header a { color: #fff; }
    
    /* Logo */
    #logo { color: #fff; font-size: 1.5rem; font-weight: 300; text-transform: uppercase; }
    #logo a:hover { display: inline-block; opacity: 0.6; text-decoration: none; }
    #logo img { max-height: 50px; max-width: auto; vertical-align: -0.2em; }
    
    /* Navigation */
    #nav { font-weight: 300; }
    #nav a { border-radius: 3px; display: inline-block; padding: 0.7em 0.5em; }
    #nav a:hover { background: rgba(255, 255, 255, 0.1); text-decoration: none; }
    #nav li { display: inline-block; margin: 0; }
    #nav li.current a { color: #f1c119; }
    #nav ul { list-style: none; margin: 0; }
    
        /* Menu */
        #menu {
            background: #333;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
            display: none;
            font-size: 15px;
            height: 100%;
            overflow-x: hidden;
            overflow-y: auto;
            position: fixed;
            right: -400px;
            top: 0;
            width: 250px;
            z-index: 1000;
        }
        
        #menu a { border-bottom: 1px solid rgba(255, 255, 255, 0.2); color: #fff; display: block; padding: 0.8em 1.1em; }
        #menu a:hover { text-decoration: none; }
        #menu a:active { background: transparent; }
        #menu li { margin: 0; }
        #menu li.current { background: #f0f0f0; }
        #menu li.current a, .menu li.current a strong { color: #000; }
        #menu ul { border-bottom: 3px solid rgba(0, 0, 0, 8); list-style: none; margin: 0; }
        #menu ul:last-child { border: 0; }
        #menu ul ul a { border-bottom: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); color: #3c6cc7; }
        #menu ul ul li.current a { color: #000; }
        #menu-toggle { font-weight: 300; white-space: nowrap; }

/* Highlight */
.highlight { background: #fcf27e; }

/* Grids */
.grid { display: flex; flex-wrap: wrap; list-style: none; justify-content: space-between; margin: 0 0 2em; }
.grid img { width: 100%; }
.grid li { margin-bottom: 2em; }
.grid-2 li { width: 48%; }
.grid-3 li { width: 31%; }
.grid-4 li { width: 23%; }
.grid-5 li { width: 18%; }
.grid-6 li { width: 14%; }

/* Intro */
.intro { font-size: 1.33rem; line-height: 1.375; }
.intro p { margin-bottom: 0.5em; }

/* Issues */
.issues { table-layout: fixed; }
.issues tbody th { font-weight: normal; }
.issues td { width: 2em; text-align: center; }
.issues td.description { padding: 30px 30px 1px; text-align: left; }
.issues th:first-child { text-align: left; }
.issues thead th { text-align: center; }
.issues-submarket { width: 2em; }
.issues-label { width: 50%; }

    /* Issues browse */
    #issues-browse { display: flex; justify-content: space-between; margin-bottom: 2rem; }
    #issues-browse .search { margin-bottom: 1rem; width: 40%; }
    #issues-toggle { font-size: 1.22rem; font-weight: 300; width: 40%; }
    #issues-toggle a { border: 1px solid #aaa; display: block; padding: 0.3em 1em; text-align: center; }
    #issues-toggle a:hover { background: #f0f0f0; text-decoration: none; }
    #issues-toggle li { flex: 1 1 auto; margin: 0; }
    #issues-toggle li.current a { background: #1f8090; border-color: #1f8090; color: #fff; }
    #issues-toggle ul { display: flex; list-style: none; margin: 0; }

/* Jump nav */
.jump { font-weight: 300; margin-bottom: 1.5em; }
.jump li, .jump p { white-space: nowrap; }
.jump li, .jump p, .jump ul { display: inline; margin: 0 1em 0 0; }
.jump ul { list-style: none; margin-left: 0; }

/* Logos */
.logos { font-size: 14px; list-style: none; margin-left: 0; line-height: 80px; text-align: center; }
.logos a:hover { opacity: 0.7; }
.logos img { max-height: 50px; vertical-align: middle; }
.logos img, .logos li { max-width: 250px; }
.logos li { display: inline-block; line-height: 1.2; margin: 0 20px; vertical-align: middle; }
.logos-small img { max-height: 40px; }
.logos-small img, .logos-small li { max-width: 200px; }

/* Map */
#community-map { height: 0; overflow: hidden; padding-bottom: 100%; position: relative; }
#find h1 { font-size: 1.5rem; font-weight: bold; margin-bottom: 0.5em; }
#find h2 { font-size: 1rem; }
#find-primary { font-size: 0.88rem; font-weight: 300; }
#map { height: 100%; left: 0; position: absolute; top: 0; width: 100%; }

    /* Legend */
    .legend { border: 1px solid #ddd; margin: 1em 0; padding: 15px; }
    .legend .flag { display: inline-block; font-size: 0.7rem; font-weight: normal; padding: 0.2em 0.7em; text-align: center; width: 2em; }
    .legend li { align-items: flex-start; display: flex; }
    .legend ol { list-style: none; margin: 0; }
    .legend ol a:hover { text-decoration: none; }
    .legend p { margin-bottom: 0; }
    .legend .title { padding-left: 0.5em; }
    .legend-toggle { display: block; margin-bottom: 0.5em; text-align: center; }
    .legend .flag.disabled { background: #ccc; }
    
        /* Collapsed */
        .legend-collapsed .flag { display: block; font-size: 1rem; width: auto; }
        .legend-collapsed li { display: block; width: 23%; }
        .legend-collapsed ol { display: flex; flex-wrap: wrap; justify-content: space-between; }
        .legend-collapsed .title { display: none; }
    
    /* Popup */
    .mapboxgl-popup-content { font-size: 0.77rem; max-height: 400px; max-width: 400px; overflow: auto; padding: 20px; }
    .mapboxgl-popup-content dd { color: #a0a0a0; }
    .mapboxgl-popup-content dl { margin: 0; }
    .mapboxgl-popup-content dt { font-weight: normal; margin-top: 1em; }
    .mapboxgl-popup-content h2 { font-size: 1.2rem; margin-bottom: 0.5em; }
    .mapboxgl-popup-close-button { font-size: 1.5rem; }

/* Muted text */
.mute { color: #999; font-size: 0.77rem; font-weight: normal; }

/* Print only */
.printonly { display: none; }

/* qTip */
.qtip { background: #fff; border: 1px solid #ccc; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.25); font-size: 16px; line-height: 1.4; max-width: 400px; }
.qtip h2 { font-size: 1em; }
.qtip p { margin: 0; }
.qtip-content { max-height: 200px; overflow-x: hidden; overflow-y: auto; padding: 10px 20px; }
.qtip-titlebar { border-bottom: 1px solid #ddd; padding: 10px 20px; }

/* Sharing */
.share { font-weight: 300; list-style: none; margin: 0; float: right; }
.share .social { font-size: 1.3rem; }
.share li { display: inline; margin-left: 0.7em; }

    /* Icons */
    .fa-envelope-square { color: #666; }
    .fa-facebook-official { color: #3b5998; }
    .fa-twitter-square { color: #1da1f2; }

/* Stats */
.stats { border: 5px solid #777; color: #000; padding: 25px 25px 1px; }
.stats.sub1 { border-color: #f1c119; }
.stats.sub2 { border-color: #90d113; }
.stats.sub3 { border-color: #df8225; }
.stats.sub4 { border-color: #1eb568; }
.stats.sub5 { border-color: #a45d95; }
.stats.sub6 { border-color: #cd5f3a; }
.stats.sub7 { border-color: #0d2d7a; }
.stats.sub8 { border-color: #1f8090; }

/* Submarket summaries */
.submarket-summaries { list-style: none; margin-left: 0; }
.submarket-summaries > li { border-top: 1px solid #ddd; display: flex; margin: 0; justify-content: space-between; padding: 2.7rem 0 3rem; }
.submarket-summaries > li:first-child { border: 0; }
.submarket-summary-details { width: 58.9%; }
.submarket-summary-details h2 { display: flex; }
.submarket-summary-details h2 .action { align-items: center; display: flex; }
.submarket-summary-details h2 .flag { margin-right: 0.5em; }
.submarket-summary-details h3 { margin-bottom: 0.3em; }
.submarket-summary-map { text-align: center; width: 38.35%; }
.submarket-summary-map img { width: 80%; }


/* Widths
=====================================================================*/
@media screen and (max-width: 1280px) {
    /* Layout */
    #main { padding-top: 75px; }
    #find-primary { flex-basis: 40%; }
    #find-secondary { flex-basis: 60%; }
    
    /* Content */
        /* Grids */
        .grid-5, .grid-6 { grid-template-columns: 1fr 1fr 1fr 1fr; }
        
        /* Navigation */
        #nav { display: none; }
}

@media screen and (max-width: 850px) {
    /* Covers */
    .cover-credit { float: none; text-align: left; }
    
    /* Submarkets */
    .submarket-summary-details h2 { display: block; }
    .submarket-summary-details h2 .action, .submarket-summary-details h2 .flag { display: block; margin: 0 0 0.3em; text-align: center; }
}

@media screen and (max-width: 740px) {
    /* Basics */
    html { font-size: 14px; }
    h1 { font-size: 1.5rem; }
    
    /* Layout */
    #main { padding-top: 50px; }
    
        /* Content */
        .content-primary, .content-secondary { float: none; width: auto; }
        
        /* Map */
        #find #main { flex-direction: column; }
        #find-primary { flex-basis: 40%; padding: 10px; max-width: 100%; }
        #find-secondary { flex-basis: 60%; width: auto; }
    
    /* Content */
        /* Action buttons */
        .action { display: block; margin-bottom: 1em; text-align: center; width: 100%; }
        
        /* Callouts */
        [class *= "call"], [class *= "pull"] { width: auto !important; }
        [class *= "pull"] { font-size: 16px; }
        .call, .call-l, .pull-l, .call-r, .pull-r { float: none; margin: 0 0 10px; }
        
        /* Columns */
        .c2l, .c2r, .c3l, .c3m, .c3r, [class *= "col-"], #content-primary, #content-secondary, .subcontent-primary, .subcontent-secondary { float: none; margin-bottom: 1em; width: auto; }
        [class *= "col-"] img { display: block; width: 100%; }
        .cols2, .cols3, .cols4 { -moz-column-count: 1; -webkit-column-count: 1; column-count: 1; }
        
        /* Covers */
        .cover { min-height: 0; padding: 7vw 20px 2vw; }
        
        /* Forms */
        .signup-row { display: block; }
        .signup-row .txt { display: block; margin-bottom: 1em; padding: 0.5em; width: 100%; }
        
        /* Geography */
        .geo { flex-direction: column; }
        .geo-primary { height: 50vh; order: 2; padding-top: 1em; width: auto; }
        .geo-secondary { height: 50vh; order: 1; width: auto; }
        
        /* Grids */
        .grid-3, .grid-4, .grid-5, .grid-6 { grid-template-columns: 1fr 1fr; }
        
        /* Header */
        #header { padding-left: 15px; padding-right: 15px; }
        #logo { font-size: 4.5vw; line-height: 1.1; }
        #logo a { align-items: center; display: flex; }
        #logo img { margin-right: 10px; width: 6vw; }
        
        /* Issues browse */
        #issues-browse { display: block; margin-bottom: 1rem; }
        #issues-browse .search { width: auto; }
        #issues-toggle { font-size: 1.22rem; font-weight: 300; text-align: center; width: auto; }
        
        /* Map */
        .legend-collapsed li { width: 12%; }
        .legend-collapsed ol { flex-wrap: nowrap; }
        
            /* Popup */
            .mapboxgl-popup[style] { height: calc(100% - 50px); transform: translate(10px, 10px) !important; width: calc(100% - 60px); }
            .mapboxgl-popup-content { height: 100%; max-height: none; max-width: none; line-height: 1.4; width: 100%; }
            .mapboxgl-popup-content dt { font-weight: bold; }
            .mapboxgl-popup-tip { display: none; }
        
        /* Sharing */
        .share { float: none; margin-bottom: 0.7em; }
        .share li { margin: 0 0.7em 0 0; }
        
        /* Submarket summaries */
        .submarket-summaries > li { display: block; padding: 2rem 0 1.5rem; }
        .submarket-summary-details { width: auto; }
        .submarket-summary-map { width: auto; }
        .submarket-summary-map img { width: 50%; }
}

@media screen and (max-width: 500px) {
    .action { display: block; margin-bottom: 1em; text-align: center; width: 100%; }
}