@font-face {
    font-family: 'FontAwesome';
    src: url('fonts/FontAwesome.otf') format('opentype');
}

.nh-case-study a:not('btn'), #page-nav a {
    text-decoration: none;
    color: #486589;
    font: 16px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
}

.nh-case-study a:focus,
.nh-case-study button:focus {
    outline: 0;
}

.nh-case-study a:not('btn'):hover {
    color: #699AD6;
}

.page-nav-button {
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
}

.nh-case-study h1 {
	font-size:2.9em;
	margin-top:0;
}

.nh-case-study h2 {
	text-transform:none;
}

/* ------------------------------------------------------ */
/* base styles
/* ------------------------------------------------------ */

#main-wrap {
    position: relative;
    background-color: #fff;
    max-width: 978px;
    width:auto;
    margin: 0 auto;
    overflow: hidden;
    padding: 40px 0 80px 0;
/*    border-top: 8px solid #383838;  remove for responsive redo */
}

.nh-case-study .wysiwyg > p a:not('btn') {
	font: normal 16px/28px 'Mercury SSm A', 'Mercury SSm B', 'Palatino', 'Palatino Linotype', Georgia, serif;
}

.nh-case-study:first-of-type {
    display: block;
}

.nh-main-column {
    padding: 0 11px;
}

.nh-main-column p,
.nh-main-column > ul,
.nh-main-column > ol,
.nh-case-study .wysiwyg h2,
.nh-main-column h3,
.nh-main-column h4 {
    max-width: 600px;
}

.nh-main-column p,
.nh-main-column > ul,
.nh-main-column > ol,
.nh-case-study .wysiwyg h2 {
    margin: 0 auto 24px;
}

.nh-main-column h3,
.nh-main-column h4 {
    margin:0 auto;
}

/* drop caps */
.nh-main-column > p:first-of-type:first-letter {
    float: left;
    font-size: 58px;
    line-height: 50px;
    padding: 6px 8px 0 0;
}


/* ------------------------------------------------------ */
/* text styles
/* ------------------------------------------------------ */

.nh-case-study h1 {
    font: normal 18px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
    color: #b0b0b0;
    margin: 0;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding-left: 3px;
}

.nh-case-study h2 {
    font: normal 36px/1em "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
    color: #383838;
    margin: 0;
}

.nh-case-study h3 {
    font: 20px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
    color: #555;
    /*margin: 0 0 24px 0;*/
    margin: 0 auto;
    text-transform:none;
}

.nh-case-study h4 {
    font: 18px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
    color: #555;
    /*margin: 0 0 24px 0;*/
    margin: 0 auto;
	text-transform:none;
}

.nh-case-study h5 {
    font: 18px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
    color: #555;
    letter-spacing: normal;
    margin: 0 0 10px 0;
}

.nh-case-study p,
.nh-case-study ul li,
.nh-case-study ol li {
    font: normal 16px/28px 'Mercury SSm A', 'Mercury SSm B', 'Palatino', 'Palatino Linotype', Georgia, serif;
    letter-spacing: 0.02em;
    color: #383838;
}

.nh-case-study ul li a,
.nh-case-study ol li a {
	font: normal 16px/28px 'Mercury SSm A', 'Mercury SSm B', 'Palatino', 'Palatino Linotype', Georgia, serif;
    letter-spacing: 0.02em;
}

.page-title-header,
.nh-chapter-header {
    margin-bottom: 14px;
}

.page-title-header,
.nh-chapter-header {
    border-bottom: 3px solid #DFDFDF;
    margin: 14px 0;
}

.page-title-header,
.nh-chapter-header h2 {
    padding-bottom: 8px;
}


/* ------------------------------------------------------ */
/* navigation
/* ------------------------------------------------------ */

#page-nav a {
    color: #383838;
    font: 18px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica;
    outline: 0;
    display: block;
}

.page-nav-tab-subnav li:not(.active):hover {
    text-decoration: underline;
}

.page-nav-button {
    border:0;
    font: 18px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica;
    padding: 10px 20px;
    color: #fff;
    background-color: #383838;
    z-index: 980;

    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

.page-nav-button:hover {
    background-color: #444;
}

.page-nav-button span {
    font-size: 16px;
}

.page-nav-tabs {
    z-index: 980;
    background-color: #F1EDE8;
    display: none;
    width: 100%;
    margin-top: 20px;
    padding:0;
}

.page-nav-tabs.active {
    margin-top: 20px;
}

.page-nav-tab {
    font-family: "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica;
    color: #383838;
    padding: 0;
    border-bottom: 1px solid #fff;
    list-style:none;
    margin:0;
}

.page-nav-tab-header {
    padding: 10px 20px;
    display: block;
    background-color: #dfdfdf;
}

#page-nav .page-nav-tab.active .page-nav-tab-header {
    color: #fff;
    background-color: #383838;
    pointer-events: none;
    text-decoration: none;
}

.page-nav-tab:last-of-type {
    border: none;
}

.page-nav-page-nav-tabs button.close {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #111;
    color: #fff;
    padding: 10px 15px;
}

.page-nav-tab-subnav {
    background-color: #F1EDE8;
    margin: 0;
    padding: 12px 0;
    display: none;
}

.page-nav-tab.active .page-nav-tab-subnav {
    display: block;
}

.page-nav-tab-subnav li {
    padding: 0;
    list-style:none;
}

#page-nav .page-nav-tab-subnav a {
    font: normal 14px 'Helvetica Neue', Helvetica, sans-serif;
    color: #383838;
    padding: 10px 10px 10px 30px;
}

#page-nav .page-nav-tab-subnav li.active a {
    color: #4F6D91;
    text-decoration: underline;
    font-weight: bold;
    pointer-events: none;
}


/* header nav
/* ----------------------------------- */

.page-header-nextprev {
    margin-bottom: 36px;
    overflow:hidden;
}

.page-header-nextprev a {
    font: 14px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
    color: #486589;
    letter-spacing: 0.01em;
    text-decoration: none;
    position: relative;
    max-width: 145px;
}

.page-header-nextprev a:hover {
    color: #699ad6;
    text-decoration: underline;
}

a.page-header-nextprev-prev {
    float: left;
    text-align: left;
}

a.page-header-nextprev-next {
    float: right;
    text-align: right;
}

/*.page-header-nextprev span {
    display: inline-block;
    vertical-align: top;
    margin-top: -2px;
}*/


/* footer nav
/* ----------------------------------- */

.page-footer-nextprev {
    margin-top: 40px;
    overflow:hidden;
}

.page-footer-nextprev a {
    position: relative;
    text-decoration: none;
    box-sizing: content-box;

    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;

    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.page-footer-nextprev i {
    font-size: 30px;
    position: absolute;
    top: 50%;
    margin-top: -16px;
}

a.page-footer-nextprev-prev i {
    left: 11px;
}

a.page-footer-nextprev-next i {
    right: 11px;
}

a.page-footer-nextprev-prev,
a.page-footer-nextprev-next {
    font: 16px "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
    height: 30px;
    width: 34%;
    background-color: #486589;
    color: #fff;
    letter-spacing: 0.01em;
    padding: 16px;
}

.page-footer-nextprev a:hover {
    background-color: #699AD6;
    color: #fff;
}

a.page-footer-nextprev-prev {
    float: left;
    text-align: right;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    padding-left: 32px;
}

a.page-footer-nextprev-next {
    float: right;
    text-align: left;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding-right: 32px;
}

/*.page-footer-nextprev span {
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -10px;
}

a.page-footer-nextprev-prev span {
    left: 10px;
}

a.page-footer-nextprev-next span {
    right: 10px;
}*/

.page-header-nextprev a span.lbl, .page-footer-nextprev a span.lbl {
	display:none;
}

.page-header-nextprev a:hover {
	cursor:pointer;
}

/* related links
/* ----------------------------------- */
.related-links {
	border-top:1px solid #999;
	padding-top:20px;
	margin-top:50px;
}

.related-links h4 {
	text-align:center;
	font-size:1.5em;
	text-transform:uppercase;
	color:#999;
}

.related-links ul {
	padding:0 20px;
}

.related-links ul li {
	display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-align: flex-start;
    -ms-flex-align: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    justify-content:flex-start;

    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.related-links li {
	list-style:none;
	padding-bottom:20px;
}

.related-links .thumb {
	margin-right:10px;
	display:block;
	width:25%;
}

.related-links .thumb img {
	display:block;
	width:100%;
}

.related-links ul li a {
	letter-spacing:normal;
}

.related-links .details {
	width:75%;
}

.related-links .details a.section {
	font: .8em "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;
	text-transform:uppercase;
	color:#486589;
}

.related-links .details h5 {
	margin-bottom:0;
}

.related-links .details h5 a {
	font: 1.2em "Knockout 50 A", "Knockout 50 B", "Arial Narrow", "Trebuchet MS", Helvetica, sans-serif;;
	color:#000;
}

.related-links .details h5 a:hover,
.related-links .details a.section:hover {
	text-decoration:underline;
}

.related-links .details a.section {
	display:block;
	line-height:.7em;
}

.related-links .details h5 a,
.related-links .details p {
	display:block;
	line-height:1.5em;
}

.related-links .details p {
	display:none;
}

/* ------------------------------------------------------ */
/* media collection overrides
/* ------------------------------------------------------ */
.nh-main-column .mc-pinnedBox {
    position:relative;
    right:0;
    width:100%;
    margin:0 auto;
    max-width:600px;
    margin-bottom:10px;
}

.nh-main-column .mc-pinnedBox .mc-content p {
    font-family: Arial;
}


/* ------------------------------------------------------ */
/* media queries
/* ------------------------------------------------------ */

@media only screen and (min-width: 550px) {
    .nh-main-column {
        padding: 0 27px;
    }

    .nh-case-study h1 {
        font-size: 26px;
    }

    .nh-case-study h2 {
        font-size: 64px;
    }

    .page-title-header h1 {
        font-size: 20px;
        padding-left: 6px;
        letter-spacing: 0.09em;
    }

    .page-title-header h2 {
        font-size: 60px;
    }

    .page-header-nextprev a {
        max-width: inherit;
        font-size: 16px;
    }

    .related-links h4 {
    	font-size:2em;
    }

    .related-links .details a.section {
		font-size:1em;
	}

    .related-links .details h5 a {
    	font-size:1.5em;
    }

}

@media only screen and (min-width: 650px) {

    .page-title-header h1 {
        font-size: 26px;
        padding-left: 6px;
        letter-spacing: 0.09em;
    }

    .page-title-header h2 {
        font-size: 80px;
    }

    a.page-footer-nextprev-prev,
    a.page-footer-nextprev-next {
        width: 200px;
        font-size: 18px;
    }

    a.page-footer-nextprev-prev {
        padding: 20px;
        padding-left: 40px;
    }

    a.page-footer-nextprev-next {
        padding: 20px;
        padding-right: 40px;
    }

    a.page-footer-nextprev-prev i {
        left: 27px;
    }

    a.page-footer-nextprev-next i {
        right: 27px;
    }

    .related-links li {
	    padding-bottom:40px;
	}

    .related-links .details p {
		display:block;
	}

}

@media only screen and (min-width: 800px) {

    /* main nav (tabs)
    /* ----------------------------------- */

    .page-nav-button {
        display: none;
    }

    .page-nav-tabs {
        display: block !important;
        background-color: transparent;
        overflow: inherit;
        position: relative;
        width: inherit;
        margin: 0;
        padding: 0;
        font-size: 0; /* eliminate white space between li */

        -webkit-transition: 0;
        -moz-transition: 0;
        -o-transition: 0;
        transition: 0;
    }

    .page-nav-tab {
        display: inline-block;
        background-color: #DEDCDA;
        border-right: 1px solid #fff;
        border-bottom: none;
        margin:0;
    }

    .page-nav-tab-subnav {
        display: none;
        position: absolute;
        top: 42px;
        z-index: 999;
        width: 240px;


        -webkit-box-shadow: 0 6px 10px -5px rgba(0,0,0,0.5);
        -moz-box-shadow: 0 6px 10px -5px rgba(0,0,0,0.5);
        -o-box-shadow: 0 6px 10px -5px rgba(0,0,0,0.5);
        box-shadow: 0 6px 10px -5px rgba(0,0,0,0.5);
    }

    .page-nav-tab.active .page-nav-tab-subnav {
        display: none;
    }

    .page-nav-tab-subnav a {
        padding: 10px 20px;
    }

    .page-nav-tab-subnav li {
        padding: 0;
        font-size: 0.8em;
        font-weight: 200;
        border-top: 1px solid #ddd;
        list-style:none;
    }

    .page-nav-tab-subnav li:first-child {
        border: none;
    }

    .page-nav-tab:hover .page-nav-tab-subnav {
        display: block;
    }

    .page-nav-tabs li.page-nav-tab:hover a.page-nav-tab-header {
        background-color: #F1EDE8;
    }

    .page-nav-tabs li.page-nav-tab.active:hover a.page-nav-tab-header {
        background-color: #383838;
    }

    .related-links .thumb,
	.related-links .thumb img {
		display:block;
		width:240px;
		height:160px;
		margin-right:20px;
	}
}

@media only screen and (min-width: 1200px) {

	.related-links h4,
	.related-links ul {
		padding:0;
		margin:0 auto 24px 0;
	}

	.related-links ul {
		margin-bottom:0;
	}

}