@media print {
    #itemized-activity {page-break-before: always;}
}

@media print {
    body {
        font-size: 11px;
    }     

}

@media print {

.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
  float: left;
}
.col-sm-12 {
  width: 100%;
}
.col-sm-11 {
  width: 91.66666666666666%;
}
.col-sm-10 {
  width: 83.33333333333334%;
}
.col-sm-9 {
  width: 75%;
}
.col-sm-8 {
  width: 66.66666666666666%;
}
.col-sm-7 {
  width: 58.333333333333336%;
}
.col-sm-6 {
  width: 50%;
}
.col-sm-5 {
  width: 41.66666666666667%;
}
.col-sm-4 {
  width: 33.33333333333333%;
 }
 .col-sm-3 {
   width: 25%;
 }
 .col-sm-2 {
   width: 16.666666666666664%;
 }
 .col-sm-1 {
  width: 8.333333333333332%;
 }

  }


.client-links {
	color: white;
}

.client-links:hover {
	color: #ddd;
	text-decoration: underline;
}

#clients {
	padding: 10px;
	color: #fff;
}

.title-header {
	margin-top: -50px;
    min-height: 60px;
}

p.text-center {
	font-size: .85em;
}

h4.text-center {
	margin-bottom: 0;
}

.total {
	border: 1px solid #000;
	padding: 20px;
    min-height: 65px;
}

h6.text-center {
	margin-top: 0;
}

th, tr {
	text-align: center;
}

th {
	background-color: #ee3349;
	color: #fff;
	font-weight: normal;
}

span.minutes {
    font-size: .6em;
}

/*
@media(max-width:767px){}
@media(min-width:768px){}
@media(min-width:992px){}
@media(min-width:1200px){}
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Links, Buttons, Hover Effects
# Navigation
# Forms
# Header
# Common Elements and Modules
# Content
    ## Index
    ## Subpages
    ## Blogs

# Accessibility
# Alignments
# Clearings
# Header
# Widgets
# Content
    ## Global
    ## Indexes
    ## Posts and pages
    ## Asides
    ## Comments
# Infinite scroll
# Media
    ## Captions
    ## Ixges
    ## Galleries
# Footer
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/

html, body { overflow-x: hidden; }

body { font-size: 16px; font-family: Raleway;}

.container-fluid { padding: 0;} /* fixes HubSpot Bootstrap */ 

.row-fluid [class*="span"] {
    min-height: 0; /* Override top row */
}

@media (min-width: 768px) {

    .overflow {
      overflow: hidden; /* Hides absolute lines from em-title-line */
      padding-right: 0; /* eliminates padding so that text align with em-title-line */
      padding-left: 0;
    }
} 

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/


h1, h2, h3, h4, h5, h6, button,
.imitation-h3
/* imitation-h3 is used for outline purposes */{
    color: #141414;
    font-family: Raleway;
    letter-spacing: .0675em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1 {
    /* should not be used for outline purposes */
    font-weight: 700; 
    font-size: 2em;
}

h2 {
    font-weight: 700;
    font-size: 1.75em;
}

    @media (min-width: 767px) {
        h2{
            font-size: 3em;
      }
    }


h3, .imitation-h3 {
    text-transform: uppercase;
    font-size: 1.125em;
    margin-bottom: 5px;
}

    @media (min-width: 767px) {
        h3, .imitation-h3{
            font-size: 1.25em;
      }
    }

    @media (min-width: 992px) {
        h3, .imitation-h3{
            font-size: 1.5em;
      }
    }


h4 {
    font-size: 1.25em;
    color: #333;
    font-weight: 700;
    font-family: Raleway;
    text-transform: none;
}

p {
    font-family: Raleway;
    font-size: 1em;
    line-height: 1.5em;
    color: #333;
    margin-bottom: 1.5em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    @media (min-width: 767px) {
        p{
            font-size: 1em;
      }
    }

ul {
    margin-bottom: 20px;
}

li {
    font-family: Raleway;
    font-size: 1.0em;
    color: #333;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

ul.checklist {
    padding-left: 20px;
    -webkit-padding-start: 20px;
    
}

ul.checklist, ul.checklist li {
    line-height: 1.75;
    list-style: none;
}

ul.checklist li:before {
    font-family: FontAwesome;
    content: "\f058";
    margin-right: 8px;
    list-style: none;
}

.callout {
    font-size: 3em;
    font-weight: 700;
    line-height: 1em;
}


/*--------------------------------------------------------------
# Links, Buttons, Hover Effects
--------------------------------------------------------------*/

a, a:hover, a:focus, a:visited {
    text-decoration: none;
}

a:focus, :focus {
    outline: #000 dotted 1px;
    outline-offset: 0px;
}

.em-button-standard,
.em-button-narrow,
.em-button-light {
    background-color: #fff;
    border: 1px solid #000;
    border-radius: 0;
    box-shadow: inset 250px 0 0 0 #94479b;
    cursor: pointer;
    color: #fff;
    display: block;   
    font-size: .85em;
    letter-spacing: .0675em; 
    margin: 30px auto;    
    padding: 15px;
    text-shadow: none;
    text-transform: uppercase;
        -webkit-appearance: none;
    transition: all ease-out .3s;
        -webkit-transition: all ease-out .3s;
        -moz-transition: all ease-out .3s;
    width: 150px;
}

.em-button-gold {
    background-color: #fff;
	border: 1px solid #000;
	border-radius: 0;
	box-shadow: inset 350px 0 0 0 #EAAA00;
	cursor: pointer;
	color: #fff;
	display: block;
	font-size: .85em;
	letter-spacing: .0675em;
	margin: 0 auto 15px;
	padding: 15px;
	text-transform: uppercase;
	width: 300px;
	-webkit-transition: all ease-in-out .3s;
	-moz-transition: all ease-in-out .3s;
	transition: all ease-in-out .3s;
	border: 1px solid #000;
}

.em-button-gold:hover {
	box-shadow: inset 0 0 0 0 #EAAA00;
	color: #000;
}

.em-button-standard:hover,
.em-button-narrow:hover,
.em-button-light:hover {
    box-shadow: inset 0 0 0 0 #94479b;
    color: #000;
}

.em-button-standard{
    padding: 10px 15px;
}

.em-button-narrow {
    font-size: .7em;
    padding: 5px 15px;
    width: 148px;
}

.em-button-narrow.pull-left {
    margin: 5px 5px;
    height: 58px;
}
.em-button-narrow.pull-left:nth-child(5n+1) {
    margin-left: 15px;
}

/*@media (min-width: 768px) {
    .em-button-narrow.pull-left:nth-child(4n+1) {
        margin-left: 0;
    }
    .em-button-narrow.pull-left:nth-child(2n+1) {
        margin-left: 15px;
    }
}*/

.em-button-narrow.pull-left:nth-child(n+6) {
    margin-top: 5px;
}

.em-button-narrow.pull-left:last-child {
    margin-bottom: 30px;
}

.em-button-light {
    border: 1px solid #fff;
    box-shadow: inset 250px 0 0 0 #94479b;
}

.em-button-large {
    font-size: 1em;
    width: 300px;
    box-shadow: inset 300px 0 0 0 #94479b;
}

.full-width {
  width: 100%;
}

.hs-cta-node {
    width: 100%;
}

.em-button-group .em-button-standard{
    box-shadow: inset 800px 0 0 0 #94479b;
}

.em-button-group .em-button-standard:hover{
    box-shadow: inset 0 0 0 0 #94479b;
}

@media (min-width: 768px) {
    .em-button-group .em-button-standard {
    box-shadow: inset 240px 0 0 0 #94479b;
    }
} 

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/

.navbar-brand {
    padding-top: 0;
}

.navbar {
    background-color: transparent;
    background: transparent;
    border-color: transparent;
}

.navbar-default .navbar-toggle {
    background-color: #94479b;
    border-radius: 0;
    border: 0;
}

.navbar-default .navbar-toggle:hover, 
.navbar-default .navbar-toggle:focus {
    background-color: #94479b;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
    margin-right: auto;
    margin-left: auto;
}

button.navbar-toggle {
    width: 50px;
    height: 50px;
    margin-top: 0;
}

.navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.navbar-nav .open .dropdown-menu > li > a {
    line-height: 20px;
}

.navbar-nav .open .dropdown-menu > li > a,
.navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
}

.dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}

.navbar-header {
    float: none;
}
.navbar-toggle {
    display: block;
    margin-bottom: 0;
}

.navbar-collapse {
    position: absolute;
    width: 100%;
    margin-top: -50px; 
    border: none;
    box-shadow: none;
    z-index: -1;
}

.navbar-collapse.collapse {
    display: none!important;
}

.navbar-nav {
    float: none!important;
    background-color: #94479b;
    padding: 50px 0;
    margin: 0;
}

    @media (min-width: 767px) {
        .navbar-nav {
            width: 720px;
            margin-left: 15px;
        }
    }

    @media (min-width: 992px) {
        .navbar-nav {
            width: 940px;
        }
    }

    @media (min-width: 1200px) {
        .navbar-nav {
            width: 1140px;
        }
    }

.navbar-nav>li {
    float: none;
}

.navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
}

.navbar-text {
    float: none;
    margin: 15px 0;
}

/* since 3.1.0 */
.navbar-collapse.collapse.in { 
    display: block!important;
}

.collapsing {
    overflow: hidden!important;
}
    
.navbar-default .navbar-nav > li > a,
nav ul li a{ /*HubSpot Fix */
    padding: 10px 0;
    color: #fff;
    text-transform: uppercase;
    display: inline-block; /*HubSpot Fix */
    font-family: Raleway;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
nav ul li a:hover,
nav ul li a:focus{
    color: #ddd;
    background-color: transparent;
    text-decoration: none;
    outline: none;
}

.navbar .navbar-collapse {
    text-align: center;
    max-height: 500px;
    margin-left: -15px;
}

.collapsing {
  -webkit-transition-timing-function: ease;
       -o-transition-timing-function: ease;
          transition-timing-function: ease;
  -webkit-transition-duration: .35s;
       -o-transition-duration: .35s;
          transition-duration: .35s;
  -webkit-transition-property: height, visibility;
       -o-transition-property: height, visibility;
          transition-property: height, visibility;
}
/* Hamburger Menu that will transform from Menu to closing icon */

.c-hamburger {
  display: block;
  position: relative;
  overflow: hidden;
  margin-right: 15px;
  padding: 0;
  width: 50px;
  height: 50px;
  font-size: 0;
  text-indent: -9999px;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
  cursor: pointer;
  transition: background 0.3s;
}

.c-hamburger:focus {
  outline: none;
}

.c-hamburger span {
  display: block;
  position: absolute;
  top: 25px;
  left: 18px;
  right: 18px;
  height: 2px;
  background: white;
}

.c-hamburger span::before,
.c-hamburger span::after {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #fff;
  content: "";
}

.c-hamburger span::before {
  top: -5px;
}

.c-hamburger span::after {
  bottom: -5px;
}

.c-hamburger--htx span {
  transition: background 0s 0.3s;
}

.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
  transition-duration: 0.3s, 0.3s;
  transition-delay: 0.3s, 0s;
}

.c-hamburger--htx span::before {
  transition-property: top, transform;
}

.c-hamburger--htx span::after {
  transition-property: bottom, transform;
}

/* active state, i.e. menu open */
.c-hamburger--htx.is-active {}

.c-hamburger--htx.is-active span {
  background: none;
}

.c-hamburger--htx.is-active span::before {
  top: 0;
  transform: rotate(45deg);
}

.c-hamburger--htx.is-active span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
  transition-delay: 0s, 0.3s;
}

/* HubSpot Fixes */

nav ul {
    list-style-type: none;
    padding: 0;
}

.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
    transition-duration: .1s,0.3s;
    transition-delay: .1s,0s;
}

    @media (min-width: 767px) {

        .c-hamburger {
            margin-right: 0px;
        }
    }

    @media (min-width: 992px) {

        #em-site-navigation, #em-contact-navigation {
            margin-top: 50px;
        }

        .navbar #em-site-navigation li {
            margin-left: 50px;
            text-align: left;
        }
        
        .navbar #em-contact-navigation h3{
            margin-right: 50px;
            text-align: right;
        }
        
        .navbar #em-contact-navigation h3,
        .navbar #em-contact-navigation h3 a{
            color: #fff;
            font-size: 1em;
            margin-top: 5px;
        }
        
       #em-media-contact-information h3:nth-child(2){
            font-size: 1.5em;
            margin-bottom: 25px;
        }
        
        #em-media-contact-information h3:nth-child(5){
            margin-top: 25px;
        }
        
    }

    @media (min-width: 1200px) {
        .navbar #em-site-navigation li {
            margin-left: 80px;
        }
        
        .navbar #em-contact-navigation h3{
            margin-right: 80px;
        }
    }




/* ========================================================
Time Tracker Report Dropdown

* a simple style for the client select dropdown.

========================================================= */

#client-menu {
    color: #000;
    margin-left: 10px;
}

/*--------------------------------------------------------------
# Headers
--------------------------------------------------------------*/

/* ========================================================
Header

* used on all pages except Index.

* header is labeled as h2 and is pulled from backend based
on the page name. 

* on dynamic pages like notes, team, etc..., featured image
is pulled in as cover background. 

* static pages have absolute url as cover background.
========================================================= */

.em-header {
  color: #fff;
  font-family: Raleway;
  text-align: center;
  overflow: hidden; /* Hides overflow of .em-header-image */
}

.em-header,
.em-header .em-overlay-blue {
  width: 100%; /* Ensures overlay and header fill entire width */
  height: 200px; /* Height of header on all subpages */
}

.em-header img {
  position: relative; /* Puts at top of page, must be Relative or Overflow breaks */
  top: 0; 
  left: 0; 
  min-width: 100%; /* Creates Cover-Background Style to fill page */
  min-height: 100%; /* Creates Cover-Background Style to fill page */
}

.em-header .em-overlay-blue {
  position: absolute; /* Overlay color over image, forced at top */
  top: 0;
}

.em-header-title{
  position: absolute; /* Allows for title to overlay .em-header img */
  top: 15px;
}
 
.em-overlay-blue {
  z-index: 1;
}

.em-header-cover-image {
    background-color: #fff;
    background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        -webkit-background-size: cover;
    margin-bottom: 20px; /* Adds white-space after header image on all pages using header graphic */
}

.em-header-cover-image h2 {
    color: #ee3349 !important;
}

.em-title-white {
    color: #ee3349;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
}

.em-title-white a, .em-title-white a:hover {
    color: inherit;
}

/*--------------------------------------------------------------
# Common Elements and Modules
--------------------------------------------------------------*/

/* ========================================================
Element: Image Overlay

* used for featured blogs, notes, case studies.

* provides featured image with text overlay, animation 
when hovering. 
========================================================= */

.em-image-overlay {
    background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        -webkit-background-size: cover;
    min-height: 300px;
    padding: 0; /* eliminates padding from bootstrap col */
    margin: 10px 0;
}

.em-image-overlay img { 
    width: 100%; /* Forces full width for object-fit */
    height: 300px;
    object-fit: cover;
    object-position: 50% 50%;
    transition: all ease-out 0.3s;
        -webkit-transition: all ease-out 0.3s;
        -moz-transition: all ease-out 0.3s;
}

.em-image-overlay:hover img{
    opacity: 0.7;
    transition: all ease-out 0.3s;
        -webkit-transition: all ease-out 0.3s;
        -moz-transition: all ease-out 0.3s;
}

.em-title-overlay {
    background: rgba(39,54,121,0.7);
    position: absolute;
    box-shadow: inset 0 0 0 0 rgba(255,255,255,1);
    bottom: 0;
    left: 0;
    right: 0;
    margin: 15px;
    box-sizing: border-box;
    text-align: center;
    border: 1px solid #fff;
    z-index: 2;
    transition: all ease-out 0.3s;
        -webkit-transition: all ease-out 0.3s;
        -moz-transition: all ease-out 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.em-image-overlay:hover .em-title-overlay {
    /* When hovering over image, title shows effect */
    box-shadow: inset 500px 0 0 0 rgba(255,255,255,1);
    transition: all ease-out 0.3s;
        -webkit-transition: all ease-out 0.3s;
        -moz-transition: all ease-out 0.3s;
}

     @media (min-width: 530px) { 
       .em-image-overlay:hover .em-title-overlay {
            box-shadow: inset 750px 0 0 0 rgba(255,255,255,1);
        } 
    }

    @media (min-width: 768px) { 
        
       #em-index-case-studies .em-image-overlay:hover .em-title-overlay {
            box-shadow: inset 800px 0 0 0 rgba(255,255,255,1);
        } 
        
      .em-title-overlay{
        /* creates larger margin for bigger screens */
        margin-right: 30px;
        margin-left: 30px;
        }
        
        #em-blog .em-image-overlay:hover .em-title-overlay {
            box-shadow: inset 700px 0 0 0 rgba(255,255,255,1);
        } 
    }

    @media (min-width: 992px) { 
        
        #em-blog .em-image-overlay:hover .em-title-overlay {
            box-shadow: inset 400px 0 0 0 rgba(255,255,255,1);
        } 
    }

    @media (min-width: 1200px) { 
        
       #em-index-case-studies .em-image-overlay:hover .em-title-overlay {
            box-shadow: inset 1000px 0 0 0 rgba(255,255,255,1);
        } 
    }

.em-image-overlay h3 {
    margin: 25px 0;
    color: #fff;
    letter-spacing: .0675em;
    transition: all ease-out 0.3s;
        -webkit-transition: all ease-out 0.3s;
        -moz-transition: all ease-out 0.3s;
    padding: 0 15px;
}

.em-image-overlay:hover .em-title-overlay h3 {
    /* When hovering over title, title shows effect */
    color: #000;
    transition: all ease-out 0.3s;
        -webkit-transition: all ease-out 0.3s;
        -moz-transition: all ease-out 0.3s;
}


/* ========================================================
Element: Em Title Line

* used for major headings and sections

* Em titles are usually H3 and are placed in a span for 
horizontal bar.

========================================================= */

.white.em-title-line span:before, 
.white.em-title-line span:after {
    border-bottom: 2px solid #fff !important;
}

.em-title-line {
  line-height: 1;
  text-align: center;
  color: #000;
  margin-top: 50px;
}

.em-title-line span {
  display: inline-block;
  position: relative; 
}

.em-title-line span:before,
.em-title-line span:after {
  content: "";
  position: absolute;
  height: 50%;
  border-bottom: 2px solid black;
  top: 0;
  width: 600px;
}

.em-title-line span:before {
  right: 100%;
  margin-right: 15px;
}

.em-title-line span:after {
  left: 100%;
  margin-left: 15px;
}

/* ========================================================
Element: Em Image with Captions

* used for images featuring a caption or text. caption is 
usually contained in an h4.

* Em titles are usually H3 and are placed in a span for 
horizontal bar.

========================================================= */

.em-image-caption {
    margin-top: 30px;
    margin-bottom: 30px;
}

    @media (min-width: 768px) {
        .em-image-caption {
             margin-top: 0;
             margin-bottom: 0;
        }
    }

.em-image-full-width img { /* Add to images when needing width attribute for other classes */
    width: 100%;
}

.em-image-caption img{
  padding: 0;
  display: block;
  height: 300px;
  object-fit: cover; /* Image will fit container without overflow */
  object-position: 50% 50%;
}

.em-image-caption h4{
  font-size: 1em;
  display: flex;
  align-items: center; /* Vertically align with Flex */
  justify-content: center; /* Horizontally align with Flex */
  text-align: center; /* Horizontally align larger screen */
  min-height: 100px;
  color: #fff;
  font-family: Raleway, Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  background-color: #ee3349;
  margin-top: 0;
  overflow: hidden; /* Covers overflow, top and bottom */
}

    @media (min-width: 768px) {
    
        .em-image-caption h4 {
          height: 300px; /* Same height of image */
          margin-left: -15px; /* Fixes Row/Col issue */
        }
    
        .em-image-stack img{
            height: 200px;
        }
    
        .em-image-stack h4 {
            height: 100px;
            margin-bottom: 30px; /* Creates equal padding on bottom as horizontally between */
            margin-left: 0; /* Overrides em-image-caption margin left align issue */
        }
    } 

/* ========================================================
Element: Coloring and Styling Effects

* used throughout the site to easily change color of elements

========================================================= */

.black {
  color: #000 !important;
}

.white {
  color: #fff !important;
}

.em-blue {
    color: #fff;
    background-color: #ee3349;
}

.em-blue p { /* Add all headings and styles to make font white */
    color: #fff;
}

.border-black {
    border: 1px solid #000;
    margin: 15px 0;
}

.border-black p {
    font-size: 1em;
    padding: 15px;
}

.em-box {
    /* Used to create Em Blue Box for content */
    text-align: center;
    color: #fff;
    background-color: #ee3349;
}

.padding {
    padding-top: 1em;
    padding-bottom: 1em;
}