/*!
Theme Name: MK Bootstrap
Theme URI: http://underscores.me/
Author: Matt Kreiling
Author URI: http://matt-kreiling.wtf
Description: A custom theme using Bootstrap 4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: mk-bootstrap
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

MK Bootstrap is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

*/


/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
    ## Images
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed|Roboto+Slab|Roboto:300,300i,700');

body,
button,
input,
select,
optgroup,
textarea {
    color: #404040;
    font-family: sans-serif;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
}

p {
    margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
    font-style: italic;
}

blockquote {
    margin: 0 1.5em;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    font-family: "Courier 10 Pitch", Courier, monospace;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1.6em;
}

code,
kbd,
tt,
var {
    font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    font-size: 15px;
    font-size: 0.9375rem;
}

abbr,
acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

mark,
ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}

small, .small {font-size: 80%}
.person-title-small {font-size:80%; line-height:13px;}
.person-title-small strong {font-weight:800;}

.text-shadow {text-shadow: 2px 2px 8px #333;}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

html {
    box-sizing: border-box;
}

*,
*:before,
*:after {
    /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
    box-sizing: inherit;
}

body {
    background: #fff;
    /* Fallback for when there is no custom background color defined. */
}

hr {
    background-color: #ccc;
    border: 0;
    height: 1px;
    margin-bottom: 1.5em;
}

ul,
ol {
    margin: 0 0 1.5em 3em;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li>ul,
li>ol {
    margin-bottom: 0;
    margin-left: 1.5em;
}

dt {
    font-weight: bold;
}

dd {
    margin: 0 1.5em 1.5em;
}

img {
    height: auto;
    /* Make sure images are scaled correctly. */
    max-width: 100%;
    /* Adhere to container width. */
}

figure {
    margin: 1em 0;
    /* Extra wide images within figure tags don't overflow the content area. */
}

table {
    margin: 0 0 1.5em;
    width: 100%;
}


/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    border: 1px solid;
    border-color: #ccc #ccc #bbb;
    border-radius: 3px;
    background: #e6e6e6;
    color: rgba(0, 0, 0, 0.8);
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1;
    padding: .6em 1em .4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
    border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
    border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
    color: #666;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
    color: #111;
}

select {
    border: 1px solid #ccc;
}

textarea {
    width: 100%;
}


/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
.navbar-nav .nav-link {
    line-height: 1;
}

@media (min-width: 768px) {
.navbar-nav {
    margin: auto !important;
}
}

@media (min-width: 992px) {
.navbar-expand-lg {
	    box-shadow: 0px 0px 15px #ccc;
    margin-bottom: 20px;
}
}

/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/

a {
    color: royalblue;
}

a:visited {
    color: purple;
}

a:hover,
a:focus,
a:active {
    color: midnightblue;
}

a:focus {
    outline: thin dotted;
}

a:hover,
a:active {
    outline: 0;
}

    .accordion-caret .accordion-toggle:hover {
        text-decoration: none;
    }
    .accordion-caret .accordion-toggle:hover span,
    .accordion-caret .accordion-toggle:hover strong {
        text-decoration: underline;
    }
    .accordion-caret .accordion-toggle:before {
        font-size: 25px;
        vertical-align: -3px;
    }
    .accordion-caret .accordion-toggle:not(.collapsed):before {
        content: "▾";
        margin-right: 0px;
		display:contents;
    }
    .accordion-caret .accordion-toggle.collapsed:before {
        content: "▸";
        margin-right: 0px;
		display:contents;
    }

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.main-navigation {
    clear: both;
    display: block;
    float: left;
    width: 100%;
}

.main-navigation ul {
    display: none;
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    float: left;
    position: absolute;
    top: 100%;
    left: -999em;
    z-index: 99999;
}

.main-navigation ul ul ul {
    left: -999em;
    top: 0;
}

.main-navigation ul ul li:hover>ul,
.main-navigation ul ul li.focus>ul {
    left: 100%;
}

.main-navigation ul ul a {
    width: 200px;
}

.main-navigation ul li:hover>ul,
.main-navigation ul li.focus>ul {
    left: auto;
}

.main-navigation li {
    float: left;
    position: relative;
}

.main-navigation a {
    display: block;
    text-decoration: none;
}


/* Small menu. */

.menu-toggle,
.main-navigation.toggled ul {
    display: block;
}

@media screen and (min-width: 37.5em) {
    .menu-toggle {
        display: none;
    }
    .main-navigation ul {
        display: block;
    }
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
    margin: 0 0 1.5em;
    overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
    float: left;
    width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
    float: right;
    text-align: right;
    width: 50%;
}

.menu-building-envelopeXX:before {
    background-image: url('/wp-content/uploads/building-envelope-icon-01.png');
    background-size: 10px 10px;
    display: inline-block;
    width: 10px; 
    height: 10px;
    content:"";
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/


/* Text meant only for screen readers. */

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
    /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    clip-path: none;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar. */
}


/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/

.widget, .cidb-term-list {
    margin: 0 0 1.5em;
    /* Make sure select elements fit in widgets. */
	margin: 0 0 .5em;
}

.widget select {
    max-width: 100%;
}
.case-category-bullet {margin-bottom:10px;}
.case-category-bullet a img {
    height: 25px;
    margin: 0px 10px 0px -23px;
}
/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/


/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/

.sticky {
    display: block;
}

.hentry {
    margin: 0 0 1.5em;
}

.updated:not(.published) {
    display: none;
}

.page-content,
.entry-content,
.entry-summary {
    margin: 1.5em auto 0;
}

.page-links {
    clear: both;
    margin: 0 0 1.5em;
}


/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/

.comment-content a {
    word-wrap: break-word;
}

.bypostauthor {
    display: block;
}


/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/


/* Globally hidden elements when Infinite Scroll is supported and in use. */

.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
    /* Theme Footer (when set to scrolling) */
    display: none;
}


/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */

.infinity-end.neverending .site-footer {
    display: block;
}


/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/

.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}

.alignright, .image-right {float:right; margin:0px 0px 10px 10px;}
.alignleft, .image-left {float:left; margin:0px 10px 10px 0px;}
.alignnone {float:none;margin:auto;}

.vc_gitem-post-data-source-post_title h3 {font-size:12px;}

/* Make sure embeds and iframes fit their containers. */

embed,
iframe,
object {
    max-width: 100%;
}


/* Make sure logo link wraps around logo image. */

.custom-logo-link {
    display: inline-block;
}


/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/

.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}

.wp-caption-text {
    text-align: center;
}


/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/

.gallery {
    margin-bottom: 1.5em;
}

.gallery-item {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
}

.gallery-columns-2 .gallery-item {
    max-width: 50%;
}

.gallery-columns-3 .gallery-item {
    max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
    max-width: 25%;
}

.gallery-columns-5 .gallery-item {
    max-width: 20%;
}

.gallery-columns-6 .gallery-item {
    max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
    max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}

.gallery-caption {
    display: block;
}



/* Begin Custom Styles */


/* ====================================================================
    VARIABLES
    These work in all modern browsers except for IE
==================================================================== */


/* This is the new way to use variables in CSS.
It's inherited so we put it in the root 
use it like this color: var(--color-orange) */

:root {
    --color-orange: #f26521;
    --color-green: #b2bb1d;
    --font--body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --font--heading: "Roboto Slab";
}


/* ====================================================================
    COLORS
==================================================================== */

.font-color--orange {
    color: var(--color-orange);
    color: #f26521;
}


/* ====================================================================
    TYPOGRAPHY
==================================================================== */

body,
.type-style--body {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
}

h1,
h2,
h3,
h4,
h5,
.type-style--heading-slab {
    font-family: 'Roboto Slab', serif;
}


h6,
h7,
.type-style--heading {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
}

a,
strong {
    font-weight: 500;
}


/* ====================================================================
    HEADER STYLES
==================================================================== */
.custom-logo__wrapper img {
    width: 180px;
}


/* ====================================================================
    FOOTER STYLES
==================================================================== */


/* ====================================================================
    UTILITY STYLES
==================================================================== */


/* Use to keep an empty div with a background image a certain ratio */


/* Set a fluid width and a background image */

.keep-aspect--5x2 {
    padding-bottom: 40%;
    /* 40% = 40/100 = 2/5 = aspect ratio of 5/2 */
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}


/* ====================================================================
    UNSORTED STYLES / SHAME.CSS
    Here we put styles as we develop, and remove as we refactor.
    Also, put stuff that we know is kinda ugly or problematic.
==================================================================== */

body,
p,
li,
dt {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    /*font-size: 15px;*/
    /* TODO: Discuss minimum font size and weight */
    line-height: 1.5;
}

h1,
h2 {
    color: #f26521;
}

.internal-sidebar-grey {
    background-color: #eee;
    border: 0px dotted #666;
    padding: 10px;
}

.container-fluid {
    padding-right: 0px;
    padding-left: 0px;
}

.card {
    border: 0px solid #fff;
}

.card-header {
    background-color: #fff;
    padding: 1rem .65rem .1rem 0rem;
}

.v2row {
    border-bottom: 1px #ccc solid;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

a {
    color: #427597;
}

a:hover {
    color: #f26521;
    text-decoration: underline;
}

#hero-banner {
    padding: 15% 0 15% 0;
    background-size: cover;
    background-repeat: no-repeat;
    margin: 0px;
	background-position: center center;
}

#tabular-summary {
    border: 10px solid #eee;
	height:fit-content;
	margin-bottom:20px;
}

#tabular-summary dl {margin-bottom: 0rem;}
#tabular-summary dl dt {
    border-bottom: 2px solid #eee;
	line-height:150%;
}

#tabular-summary dl hr {margin: 0px; color: #eee;}

#tabular-summary.policy-summary:before {border-top:1px solid red;}

/* Understrap overrides */

.wrapper {
    padding: 0;
}


/* == Global ===================== */

.content-area {width:100%;}
/* Typography */



.page-header-title {
    font-family: "Roboto";
    font-weight: 200;
}

.page-subheading {
    font-family: "Roboto Condensed";
    font-weight: 200;
}

.blog-entry-title.entry-title a,
.blog-entry-title.entry-title a:hover {
    font-family: "Roboto Condensed";
    font-weight: 300;
    font-size: 30px;
    color: #f26521;
}

.single-post-title {
    color: #f26521;
}

.entry h1 {
    color: #f26521;
}

.entry h2 {
    font-family: "Roboto Condensed";
    font-weight: 400;
    font-style: normal;
    color: #b2bb1d;
    letter-spacing: .05px;
    text-transform: uppercase;
}


#top-bar {
    background-color: #b2bb1d;
    color: #ffffff;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: right;
}

#top-bar strong {
    color: #ffffff;
}

#sidebar li {
    border-color: #b2bb1d;
}

#sidebar .widget-title {
    padding: 0 5px;
    text-align: left;
	border-bottom: purple 4px solid;
}

.white-grid-overlay-text {text-shadow:1px 1px 10px #000;}

/* Utilities */


/* These things do only one thing, they should be at the */
/* bottom of the cascade so they override preceding styles */

.cidb-brand-font {
    font-family: "Roboto Slab";
}

.cidb-bg-green {
    background-color: #b2bb1d;
    background-color: var(--color-green);
}

/*--------------------------------------------------------------
## Images
--------------------------------------------------------------*/

.image-right img {
	float: right;
    margin-left: 18px;
}

.image-right .image-caption {
	    float: right;
    clear: right;
	    width: inherit;
    font-size: 75%;
    margin: 4px 10%;
}

.image-left img, .image-left a img, dl.image-left dt a img {
	float: left;
    margin-right: 18px;
}

.image-left .image-caption {
	    float: left;
    clear: left;
	    width: inherit;
    font-size: 75%;
    margin: 4px 10%;
}
.widget-area h2 {
	font-size: 1.25rem;
}
.widget ul, .widget ol, #taxonomy ul {
    margin-left: 0; 
	padding-left:20px;
}

#dynamic-sidebar-taxonomy.offset-md-1 { margin-top:20px;}

@media (min-width: 768px){
    #dynamic-sidebar-taxonomy.offset-md-1 {border-left:1px solid #666; margin-top:36px;}
  }

.map-still {width:inherit;}
.code-compliance-box table tr td, .code-compliance-box table tr th, .card-content table tr th, .card-content table tr td {border:1px dotted #666; padding:5px 10px; width:50%; vertical-align:top;}
th {background-color: #ccc;}
.h1, h1 {
    font-size: 2.0rem;
}

.nav-links {  
	    width: 90%;
   
    margin-right: auto;
    margin-left: auto;
	padding-right: 0px;
    padding-left: 0px;
}