/*** Base Grid CSS --------------------------------- */

/*** row class overrides for full width or site width changes - 1240px ***/
.row {
	margin-left: auto;
	margin-right: auto;
	max-width: 77.5rem;
}

.rowNarrow {
	max-width: 50rem;
}

.rowLarge {
	max-width: 125rem;
}

.rowFull
{
	max-width:100%;
}

.rowMax
{
	margin-left: auto;
	margin-right: auto;
	max-width:2200px;
}

body
{
    background-color:  #fff;
}

/* header */

header
{
    display:block;
		height: auto;
		font-size: 1rem;
    box-sizing:border-box;
    background-color: #999;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-ms-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
}

/*** section tag css ***/
section
{
    padding: 1rem 0;
	clear: both;
}
/*** default padding above first section tag ***/
/* JJH - per Matt lets remove this one (alredy overrode on Eyefinity)
section:first-child
{
    padding-top: 3rem;
}
[end] JJH */

/*** remove border on last section tag - footer has top border ***/
section:last-child
{
    border-bottom:none;
}
.constrainToPageWidthBg3 {
    margin: auto;
    max-width: 90rem;
}

/*** Right sidebar styles ***/
.row,
section.pageBodyRow
{
    max-width: var(--row-class-width);
    padding: 0;
}

section.pageBodyRow
{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    float: none;
    clear: both;
    margin-left: auto;
    margin-right: auto;
}

/*** sidebar css for tablet and mobile ***/
section.pageBodyRow section.mainDisplay,
section.pageBodyRow aside.mainSidebar
{
    padding-right: 0;
    padding-left: 0;
}

section.pageBodyRow aside.mainSidebar
{
    display: flex;
    flex-direction: column;
	margin-bottom: 2rem;
}

section.pageBodyRow aside.mainSidebar > div,
section.pageBodyRow aside.mainSidebar > section,
section.pageBodyRow aside.mainSidebar > section .paragraphBlock,
section.pageBodyRow aside.mainSidebar > div .paragraphBlock,
section.pageBodyRow aside.mainSidebar > div .manual-list,
section.pageBodyRow aside.mainSidebar > section .category-links-block,
section.pageBodyRow aside.mainSidebar > div .category-links-block,
section.pageBodyRow aside.mainSidebar > section.pinnedlist .container
{
    padding-left: 0;
    padding-right: 0;
}

/** [end[ Right sidebar styles ***/

/*** flex-grid css ***/
.column-flex-container .componentTitle,
.column-flex .columnTitle
{
	padding-bottom: 0.8rem;
	float: none;
	display: inline-flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}
.column-flex-container .componentTitle p,
.column-flex .columnTitle p {
    margin-bottom: 0;
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 1px;
    font-weight: 700;
    text-transform: uppercase;
}

.column-flex,
.column-flex-container .row
{
		position: relative;
}

.column-flex-container .componentTitle
{
    display: flex;
    flex-direction: row;
}

/*** SMALL only
--------------------------------------------- */
@media screen and (max-width: 39.9375em) {

	.rowNarrow {
		max-width: 100%;
	}

	section
	{
		padding: 1rem 0;
	}

}

/*--- SMALL and MEDIUM only ----------------------------------- */
@media screen and (max-width: 63.9375em)
{
    /*** sidebar css for tablet and mobile ***/
    section.pageBodyRow
    {
        flex-direction: column;
    }

    section.pageBodyRow section.mainDisplay
    {
        padding-right: 0;
        padding-left: 0;
    }

    section.pageBodyRow aside.mainSidebar
    {
        padding-left: var(--single-gutter-padding);
        padding-right: var(--single-gutter-padding);
    }
}


/*--- MEDIUM and UP only ------------------------------- */
@media screen and (min-width: 40em) {

  /*** template css for sidebar layouts ***/
  section.pageBodyRow section.mainDisplay
  {
      padding-right: var(--double-gutter-padding);
      padding-left: 0;
  }

  section.pageBodyRow aside.mainSidebar
  {
      padding-left: var(--double-gutter-padding);
      padding-right: var(--single-gutter-padding);
  }

  section.article-component
  {
      padding-top: 3rem;
  }

}


/*--- Large and up ------------------------- */
@media screen and (min-width: 64em) {

/*** sidebar css ***/
    section.pageBodyRow aside.mainSidebar.sidebarBorder
    {
        border-left: 1px solid var(--sideBarBorderColor);
        margin-left: 0.6rem;
        padding-left: calc( var(--double-gutter-padding) + 0.4rem );
    }

}