tags */
/*.component p {
margin-bottom: 0px;
}*/
/* components in small columns need to have their content centered */
.component.centered-component {
text-align: center;
}
/* list in small columns should always be left aligned */
.component.centered-component ul, .component.centered-component ol {
text-align: left;
}
.component p strong {
font-size: inherit;
padding: 0;
}
.component ul {
text-align: left;
font-family: OpenSans-Regular, arial, sans-serif;
}
.component ul li {
margin-bottom: .75rem;
}
.component > ul:last-child {
margin-bottom: 0;
}
.component > ul >li:last-child {
margin-bottom: 0;
}
/*.component ul > li {
margin-left: 1.25rem;
}*/
/*.component ul li a,
.component ul li a:hover {
color: #1b5faa;
}*/
.component ul.component-link-list li a:not(.button) {
display: inline-block;
padding-right: 2rem;
width: 100%;
}
.component ul.component-link-list li:last-child {
margin-bottom: 1rem; /* adds padding below the last
separator */
}
.component ul.component-link-list.facet li a:not(.button) {
padding-right: 4rem;
}
.component ul.component-link-list.facet-refinement li a:not(.button) {
padding-right: 0.2rem;
}
.component ul li > a > svg {
bottom: 0;
fill: #6a9d11;
position: absolute;
right: 0;
top: .35rem;
width: 1.875rem;
height: 1.875rem;
}
.component .button,
.component .button:visited,
.component .button:visited:hover
{
background-color: #3f73b9;
color: #fff;
font-size: 1.125rem;
line-height: 1;
margin-top: .875rem;
padding: .75rem 1.375rem;
font-weight: bold;
margin-bottom: 0px;
}
/* download button with svg icon */
.component a.button.download svg {
fill: white;
height: 1.125rem;
width: 1.125rem;
padding-top: .125rem;
padding-left: .175rem;
}
/*.component button:hover, .component button:focus, .component .button:hover, .component .button:focus {
color: #fff;
background-color: #007095;
}*/
.component .view-more-content {
display: none;
margin-top: -0.45rem;
}
.component > .button.view-more-button {
margin-top: 0;
display: block;
}
.component .filter-content {
display: block;
z-index: 801;
position: relative;
}
/* filter button */
.button.filter-button {
margin-top: 0;
/*z-index: 801;*/
display: none;
text-transform: uppercase;
display: inline;
float: left;
}
/* filter button anchor styles */
a.button.filter-button,
a.button.filter-button:visited,
a.button.filter-button:hover {
text-decoration: none;
color: #fff;
display: inline-block;
float: none;
margin-right: .9rem;
}
/* open and close svg image for filter button */
a.button.filter-button > svg {
top: .8rem;
right: 1rem;
fill: white;
height: 12px;
width: 12px;
margin-left: .875rem;
}
/* filter open - default to display */
a.button.filter-button > svg.accordion-plus {
display: inline;
}
/* filter close - default to hide */
a.button.filter-button > svg.accordion-minus {
display: none;
}
/* enlarge button */
.enlarge-button-container {
text-align: center;
}
.enlarge-button > svg {
height: 1.2rem;
width: 1.2rem;
margin-bottom: -.2rem;
margin-right: .5rem;
}
/* override fill */
.enlarge-button > svg .st0 {
fill: white !important;
}
#enlarge-image-print {
float: left;
padding-left: 3rem;
padding-right: 3rem;
}
#enlarge-image-close {
float: right;
padding-left: 3rem;
padding-right: 3rem;
}
/* end enlarge button */
.component .full-image-wrapper {
padding-left: 1rem;
padding-right: 1rem;
margin-bottom: 1rem;
}
.component .full-image-wrapper + h3 {
margin-top: inherit;
}
/*.component h2 + .full-image-wrapper {
margin-top: -1rem;
}
.component .full-image-wrapper > img {
width: 100%;
}*/
/* styles for interior-component in larger column -- 11x4 and 4x11 */
.component.interior-component {
/*padding-top: 1.75rem;
padding-bottom: 1.75rem;*/
}
.component.interior-component h2 {
margin: auto;
margin-bottom: 1rem;
}
.component.interior-component h2 + p {
margin-top: 1rem;
}
.component.interior-component p {
line-height: 1.5rem;
}
.component.interior-component .row {
margin: auto;
}
/* add top padding to component headings after paragraphs */
/*.component p + h2 {
padding-top: 1rem;
}
.component p + h3 {
padding-top: 1rem;
}
.component p + h4 {
padding-top: 1rem;
}
.component p + h5 {
padding-top: 1rem;
}
.component p + h6 {
padding-top: 1rem;
}*/
/* add top padding to component lists after paragraphs */
/*.component > p + ul, .component > p + ol {
padding-top: 1rem;
}*/
/* reduce margin for buttons immediately afer a paragraph */
.component p + a.button {
margin-top: -.4125rem;
}
/* any interior components that follow another interior component should have negative margins to butt up to the above component */
/*.component.interior-component + .component.interior-component*/
/* styles for componet search box */
.component .searchbox-wrapper {
position: relative;
}
.component .searchbox-wrapper input[type="text"] {
padding-right: 2.125rem;
border: 1px solid #333333;
margin-bottom: .625rem;
}
.component .searchbox-icon {
background: transparent;
//background-image: url("/Content/images/icons/grn-magnify.svg");
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
fill: #03729f;
position: absolute;
right: 0.45rem;
top: 0.35rem;
margin: 0;
height: 1.5rem;
width: 1.5rem;
padding: 0.75rem;
}
.component .searchbox-icon:hover,
.component .searchbox-icon:focus {
background-color: transparent;
}
/*styles for plain link list*/
.component ul.component-plain-link-list {
list-style: none;
}
.component ul.component-plain-link-list > li {
list-style-type: none;
margin-left: 0;
}
/* reduce bottom margin of first button found in plain link list - this modifies the definition found in main.css for a site wide
*/
.component ul.component-plain-link-list li:first-of-type a.button {
margin-bottom: .375rem;
}
/*.component ul.component-plain-link-list li a:not(.button),
.component ul.component-plain-link-list li a:hover:not(.button) {
color: #1b5faa;
}*/
/*.print-wrapper {
border-bottom: dotted 1px #333333;
position: relative;
width: 100%;
padding-top: .75rem;
margin-bottom: 1rem;
display: block;
text-align: right;
}*/
/* tablet overrides */
@media only screen and (max-width: 641px) {
.component:not(.interior-component) {
margin-bottom: 1rem;
margin-left: 0px;
margin-right: 0px;
}
.component {
margin-left: 0;
margin-right: 0;
margin-top: 0;
}
.component .filter-content {
display: none;
z-index: 801;
position: relative;
}
}
/* mobile overrides */
/*
Following allows filter and sort buttons
to remain side-by-side at 320 mobile.
*/
@media only screen and (max-width: 345px) {
a.button.filter-button,
a.button.filter-button:visited,
a.button.filter-button:hover {
margin-right: .25rem;
}
}
@media only screen and (max-width: 320px) {
.component {
padding-left: 1rem;
padding-right: 1rem;
margin-bottom: 0;
}
.component.interior-component {
padding-top:0;
}
.component.interior-component h2 {
margin-left: -1rem;
margin-right: -1rem;
}
.enlarge-button-container {
display: none;
}
}
/* print overrides */
@media print {
div.component > h2 {
background-color: white;
color: #333333;
}
/* 2/1/2016 - Added to make interior component left align properly in print */
.component.interior-component h2 {
margin-left: -1rem;
margin-right: -1rem;
}
div.component > h2 > a,
div.component > h2 > a:visited,
div.component > h2 > a:hover {
background-color: white;
color: #333333;
}
}
/*if the accordion follows another component in the same column, pop up to the bottom of the above component */
div.row + div.row.accordion-component {
margin-top: -2.875rem;
}
.accordion-container {
padding: 0.5rem;
}
/* main accordion */
.accordion-component ul.accordion {
margin: 0;
}
/*.accordion-component h2 + p {
margin-bottom: 1rem;
text-align: center;
}*/
/* accordion item that opens and closes */
.accordion-component ul.accordion li {
margin: 0;
padding-right: 0;
}
.accordion-component .accordion .accordion-navigation {
display: block;
}
.accordion-component .accordion .accordion-navigation > a {
font-family: 'OpenSans-Bold',arial,sans-serif;
position: relative;
background-color: #3f73b9;
color: #fff;
font-size: 1rem;
line-height: 1;
padding: .75rem 1.375rem;
padding-left: .5rem;
font-weight: bold;
margin-bottom: 0;
border-bottom: 1px solid white;
}
/* optional count on an accordion */
.accordion-component .accordion .accordion-navigation > a > span {
border: solid 3px #ffffff;
border-radius:50%;
/*float: right;*/
height: 1.85rem;
line-height: 1.625rem;
width: 1.85rem;
text-align: center;
font-size: .75rem;
position: absolute;
right: 2.875rem;
top: 0.4rem;
}
/* open and close svg image for accordion */
.accordion-component .accordion .accordion-navigation > a > svg {
top: .8rem; /*0.45rem;*/
right: 1rem;
fill: white;
height: 16px;
width: 16px;
}
/* open and close image for accordion - NOT USING THIS */
.accordion-component .accordion .accordion-navigation > a > img {
top: .4rem; /*0.45rem;*/
left: 14rem;
border: 1px solid red;
height: 16px;
width: 16px;
}
/* when accordion is opened/closed rotate the svg */
.accordion-component .accordion .accordion-navigation.active > a > svg {
/* we can't just rotate anymore -- image must be swapped */
transform: rotate(180deg);
}
/* accordion open */
.accordion-component .accordion .accordion-navigation > a > svg.accordion-plus {
display: inline;
}
/* accordion close */
.accordion-component .accordion .accordion-navigation.active > a > svg.accordion-minus {
display: none;
}
/* ----------------------------------------------------------- */
/* accordion content styles */
.accordion-component .accordion .content {
padding: 0;
/*padding-left: 1rem;*/
}
/* accordion content may have a count on the accordion */
.accordion-component .accordion .content ul {
margin-left: 0;
}
.accordion-component .accordion .content.active ul {
margin-bottom: .5rem;
}
.accordion-component .accordion .content ul li {
list-style: none;
}
.accordion-component .accordion .content ul > li {
border-bottom: dotted 1px #333333;
display: block;
min-height: 2.75rem;
padding-top: 0.75rem;
padding-bottom: .495rem;
margin-bottom: 0;
margin-left: 0;
padding-left: 1.3rem;
position: relative;
font-size: 1rem;
line-height: 1.25rem;
padding-right: 2.3rem;
}
.accordion-component .accordion .content ul > li a {
font-size: 1rem;
font-family: 'OpenSans-Bold',arial,sans-serif;
color: #333333;
}
.accordion-component .accordion .content ul li:last-child {
border-bottom: 1px solid white;
}
/* these are the count values for each row of content inside an accordion */
.accordion-component .accordion .content ul li > span {
float: right;
height: 1.85rem;
line-height: 1.625rem;
width: 1.85rem;
text-align: center;
font-size: .75rem;
position: absolute;
right: .575rem;
top: 0.4rem;
color: #333333;
font-family: 'OpenSans-Bold',arial,sans-serif;
}
/* accordion content that does not require a count */
.accordion-component .accordion .content {
}
/* accordions built with the sitecore component will be wrapped in p tags */
.accordion-component .accordion .content > div > p {
padding-top: 0.75rem;
padding-bottom: .495rem;
margin-bottom: 0;
margin-left: 0;
padding-left: 1.3rem;
padding-right: 1.3rem;
font-size: 1rem;
line-height: 1.25rem;
}
/* accordions generated by searches will be an unordered list -- /search, /people, /essays */
.accordion-component .accordion .content > div > ul > li {
border-bottom: dotted 1px #333333;
display: block;
min-height: 2.75rem;
padding-top: 0.75rem;
padding-bottom: .495rem;
margin-bottom: 0;
margin-left: 0;
padding-left: 1.3rem;
padding-right: 2.3rem;
position: relative;
font-size: 1rem;
line-height: 1.25rem;
}
.archive h3 {
font-size: 1rem;
margin-bottom: .2rem;
margin-top: 0;
}
.archive .accordion-component {
margin-bottom: 1.5rem;
}
.archive .component h2 {
margin-bottom: 0;
}
.archive .component h2 + p {
margin-top: 1rem;
}
.archive div.content-block-wrapper .content-block:first-child {
border-top: none;
}
.archive div.content-block-wrapper .content-block:last-child {
border-bottom: dotted 1px #333333;
}
.archive p + div.content-block-wrapper .content-block:first-child {
border-top: 3px solid #6A9D11;
}
/*remove border from last archive item if in an accordion*/
.archive .accordion-component .content .content-block-wrapper .content-block:last-child {
border-bottom: none;
}
@media only screen and (max-width: 320px) {
.archive .accordion-component ul.accordion {
border-top: none;
}
.archive p + .accordion-component ul.accordion {
border-top: 3px solid #6A9D11;
}
}
/* if the bibliography follows another component in the same column, pop up to the bottom of the above component */
div.row + div.row.bibliography-component {
margin-top: -1.875rem;
}
/* if the bibliography follows a rich text component in the same column, pop up to the bottom of the above component */
div.row.richtext-component + div.row.bibliography-component {
margin-top: -3.875rem;
}
/* if the bibliography follows a related content component in the same column, pop up to the bottom of the above component */
aside.row.relatedcontent-component + div.row.bibliography-component {
margin-top: -3.5rem;
}
/* if the bibliography follows a footnotes component in the same column, hide the */
div.row.footnotes-component + div.row.bibliography-component hr {
display: none;
}
div.row.bibliography-component {
margin: 0 -0.9375rem;
max-width: none;
width: auto;
}
/* moved to global-component.css on 01/12/2017 */
/*.bibliography-component > div {
margin: 0 0.625rem 1rem;
background-color: #FFF;
padding-right: 1rem;
padding-bottom: 0.75rem;
padding-left: 1rem;
padding-top: 1rem;
width: auto;
}*/
div.row.bibliography-component > div > p:last-of-type {
margin-bottom: 0;
}
@media only screen and (max-width: 641px) {
div.row.richtext-component + div.row.bibliography-component {
margin-top: -2.125rem;
}
/* if the bibliography follows a footnote component in the same column, adjust top margin */
div.row.footnotes-component + div.row.bibliography-component {
margin-top: -1rem;
}
div.row.footnotes-component > div {
margin: 0;
}
}
@media only screen and (max-width: 320px) {
div.row:not(.page-heading) + div.row.bibliography-component {
margin-top: -1rem;
}
}
.breadcrumbs-component {
color: #333333;
vertical-align: middle;
font-family: 'OpenSans-Bold',Arial, Helvetica, sans-serif;
font-size: 1.125rem;
padding-bottom: 1rem;
}
.breadcrumbs-component:not(.breadcrumbs-component-full) .component {
margin-bottom: 0;
padding-bottom: 0;
background-color: transparent;
padding-top: 0px;
color: #333333;
}
.breadcrumbs-component a {
color: #333333;
}
/*.breadcrumbs-component .component ul li > a > svg {
height: 1.5rem;
margin-bottom: -0.3rem;
width: 1.75rem;
fill: #6a9d11;
position:static;
}*/
.breadcrumbs-component ul {
margin-left: 0;
padding-top: 0;
padding-left: 3rem;
}
.breadcrumbs-component ul li {
line-height: 1.2;
list-style: outside none none;
margin-bottom: 0;
margin-left: 0;
display: inline-block;
padding: 0;
font-family: 'OpenSans-Bold',Arial, Helvetica, sans-serif;
font-size: 1.125rem;
}
.breadcrumbs-component ul > li:first-child {
margin-right:-0.375rem;
}
.breadcrumbs-component ul > *:not(:first-child)::before {
content: ">";
color: #333333;
margin: 0 0.75rem;
}
@media only screen and (max-width: 786px) {
.breadcrumbs-component {
padding-top: .5rem;
padding-bottom: .5rem;
position: relative;
z-index: 801;
background-color: #edf0f3;
}
.breadcrumbs-component ul {
padding-left: 0px;
}
.breadcrumbs-component ul > li:nth-child(2) {
display: block;
text-transform: uppercase;
text-align: center;
font-size: 1.375rem;
}
.breadcrumbs-component ul li {
display: none;
}
.breadcrumbs-component ul > *:not(:first-child)::before {
display: none;
}
}
@media print {
.breadcrumbs-component {
display: none;
}
}
.content-block {
padding-bottom: 1rem;
padding-top: 1rem;
border-top: dotted 1px #333333;
}
.content-block .row {
margin-left: .625rem;
margin-right: .625rem;
}
.content-block .content-block-content-wrapper {
line-height: 1;
}
.content-block > h1 {
border-bottom: none;
}
.content-block .content-block-content-wrapper > h3 {
font-size: 1rem;
margin-bottom: .2rem;
margin-top: 0;
}
.content-block .content-block-content-wrapper > h3 > a {
color: #1b5faa;
}
.content-block .content-block-content-wrapper > h3 > a:hover {
color: #1b5faa;
}
.content-block .content-block-content-wrapper > h3 > a:visited {
color: #a277a6;
}
.content-block .content-block-content-wrapper p {
margin: 0;
}
.content-block .content-block-content-wrapper span {
font-size: .875rem;
line-height: 1.125rem;
}
.content-block-image-wrapper {
float: left;
margin-right: 1rem;
position: relative;
width: 18.75rem;
}
.content-block-wrapper-split .content-block {
width: 50%;
float: left;
padding-right: 1rem;
}
.content-block-wrapper-split .content-block .row {
min-height: 5.625rem;
}
.content-block-wrapper-split .content-block:nth-child(odd) {
clear: both;
}
.content-block-wrapper-split .content-block:nth-child(odd) .row {
border-right: dotted 1px #333333;
}
.content-block-wrapper-split .content-block:last-child:nth-child(odd) {
width: 100%;
padding-right: 2rem;
}
.content-block-wrapper-split .content-block:last-child:nth-child(odd) .row {
width: 50%;
margin: 0;
padding-right: 1rem;
}
@media only screen and (max-width: 1000px) {
.content-block-wrapper {
padding-bottom: 0;
}
.content-block {
padding-bottom: 1rem;
border-right: none;
}
.content-block .row {
padding-right: 0;
}
.content-block-wrapper-split .content-block:nth-child(odd) .row {
border-right: none;
}
.content-block-wrapper-split .content-block {
width: 100%;
float: none;
}
.content-block-wrapper-split .content-block .row {
min-height: 0;
}
.content-block-wrapper-split .content-block:last-child:nth-child(odd) {
padding-right: 1rem;
}
.content-block-wrapper-split .content-block:last-child:nth-child(odd) .row {
width: 100%;
margin: auto;
padding-right: 0;
}
}
/* mobile media query */
@media only screen and (max-width: 320px) {
.content-block {
padding-right: 0;
}
.content-block .content-block-image-wrapper {
margin: 0;
width: 100%;
margin-bottom: .25rem;
}
.content-block .content-block-image-wrapper > img {
width: 100%
}
.content-block .content-block-content-wrapper .content-summary {
display: none;
}
}
@media only print {
.content-block {
page-break-inside: avoid;
}
}
.content-launch-block {
margin: 0;
padding: 0;
margin-left: .5rem !important;
margin-right: .5rem !important;
padding-top: 1rem;
padding-bottom: 1rem;
padding-right: 7.5rem;
position: relative;
width: 100%;
}
.content-launch-block:not(:last-child) {
border-bottom: 1px dotted #333333;
}
.content-launch-block > .button {
position: absolute;
right: 0.5rem;
top: 0.375rem;
margin: 0;
padding: .75rem 1.375rem;
}
/* This file contains CSS specific to the content lookup summary component */
.content-lookup-summary-component {
}
/* center a table */
table.center {
margin-top: 1.25rem;
width:95%;
margin-left:2.5%;
margin-right:2.5%;
}
/* outer container */
.content-lookup-results-container {
width: 100%;
color: #3f73b9;
}
/* inner container */
.content-lookup-result-container {
width: 100%;
background: #edf0f3;
overflow: hidden;
margin-bottom: .19rem;
}
/* container with the count */
.content-lookup-result-container > div:last-of-type {
font-weight: bold;
vertical-align: middle;
text-align: center;
}
/* add extra bottom margin to the last div */
/*.content-lookup-results-container > div.content-lookup-result-container:last-of-type {
margin-bottom: 1.25rem;
}*/
/* add extra top margin if directly following an h2 */
h2 + .content-lookup-results-container {
margin-top: 1rem;
}
/* horizontal bar graph */
.horizontal-bar {
float: left;
background: #3f73b9;
color: #FFF;
padding: 1rem;
text-align: left;
line-height: 1.3rem;
}
/* override anchors in horizontal bar graph */
.content-lookup-results-container a, .content-lookup-results-container a:hover, .content-lookup-results-container a:visited:hover {
color: white;
}
/* remaining portion to be displayed after the horizontal bar graph */
.percent-0 { width: 0%; }
.percent-1 { width: 1%; }
.percent-2 { width: 2%; }
.percent-3 { width: 3%; }
.percent-4 { width: 4%; }
.percent-5 { width: 5%; }
.percent-6 { width: 6%; }
.percent-7 { width: 7%; }
.percent-8 { width: 8%; }
.percent-9 { width: 9%; }
.percent-10 { width: 10%; }
.percent-11 { width: 11%; }
.percent-12 { width: 12%; }
.percent-13 { width: 13%; }
.percent-14 { width: 14%; }
.percent-15 { width: 15%; }
.percent-16 { width: 16%; }
.percent-17 { width: 17%; }
.percent-18 { width: 18%; }
.percent-19 { width: 19%; }
.percent-20 { width: 20%; }
.percent-21 { width: 21%; }
.percent-22 { width: 22%; }
.percent-23 { width: 23%; }
.percent-24 { width: 24%; }
.percent-25 { width: 25%; }
.percent-26 { width: 26%; }
.percent-27 { width: 27%; }
.percent-28 { width: 28%; }
.percent-29 { width: 29%; }
.percent-30 { width: 30%; }
.percent-31 { width: 31%; }
.percent-32 { width: 32%; }
.percent-33 { width: 33%; }
.percent-34 { width: 34%; }
.percent-35 { width: 35%; }
.percent-36 { width: 36%; }
.percent-37 { width: 37%; }
.percent-38 { width: 38%; }
.percent-39 { width: 39%; }
.percent-40 { width: 40%; }
.percent-41 { width: 41%; }
.percent-42 { width: 42%; }
.percent-43 { width: 43%; }
.percent-44 { width: 44%; }
.percent-45 { width: 45%; }
.percent-46 { width: 46%; }
.percent-47 { width: 47%; }
.percent-48 { width: 48%; }
.percent-49 { width: 49%; }
.percent-50 { width: 50%; }
.percent-51 { width: 51%; }
.percent-52 { width: 52%; }
.percent-53 { width: 53%; }
.percent-54 { width: 54%; }
.percent-55 { width: 55%; }
.percent-56 { width: 56%; }
.percent-57 { width: 57%; }
.percent-58 { width: 58%; }
.percent-59 { width: 59%; }
.percent-60 { width: 60%; }
.percent-61 { width: 61%; }
.percent-62 { width: 62%; }
.percent-63 { width: 63%; }
.percent-64 { width: 64%; }
.percent-65 { width: 65%; }
.percent-66 { width: 66%; }
.percent-67 { width: 67%; }
.percent-68 { width: 68%; }
.percent-69 { width: 69%; }
.percent-70 { width: 70%; }
.percent-71 { width: 71%; }
.percent-72 { width: 72%; }
.percent-73 { width: 73%; }
.percent-74 { width: 74%; }
.percent-75 { width: 75%; }
.percent-76 { width: 76%; }
.percent-77 { width: 77%; }
.percent-78 { width: 78%; }
.percent-79 { width: 79%; }
.percent-80 { width: 80%; }
.percent-81 { width: 81%; }
.percent-82 { width: 82%; }
.percent-83 { width: 83%; }
.percent-84 { width: 84%; }
.percent-85 { width: 85%; }
.percent-86 { width: 86%; }
.percent-87 { width: 87%; }
.percent-88 { width: 88%; }
.percent-89 { width: 89%; }
.percent-90 { width: 90%; }
.percent-91 { width: 91%; }
.percent-92 { width: 92%; }
.percent-93 { width: 93%; }
.percent-94 { width: 94%; }
.percent-95 { width: 95%; }
.percent-96 { width: 96%; }
.percent-97 { width: 97%; }
.percent-98 { width: 98%; }
.percent-99 { width: 99%; }
.percent-100 { width: 100%; }
/* tablet */
@media only screen and (max-width: 641px) {
}
/* mobile */
@media only screen and (max-width: 320px) {
}
/* print */
@media print {
}
.content-lookup .component h2 {
margin-bottom: 0;
}
.content-lookup .component h2 + p {
margin-top: 1rem;
}
.content-lookup div.content-block-wrapper .content-block:first-child {
border-top: none;
}
.content-lookup p + div.content-block-wrapper .content-block:first-child {
border-top: 3px solid #6A9D11;
}
/*set green border on second child in split column as well as the first that is set above*/
.content-lookup p + div.content-block-wrapper-split .content-block:nth-child(2) {
border-top: 3px solid #6A9D11;
}
@media only screen and (max-width: 1000px) {
/*reset green border to black dotted border on second child in split column*/
.content-lookup p + div.content-block-wrapper-split .content-block:nth-child(2) {
border-top: dotted 1px #333333;
}
}
/*
if the embedded-image follows another component in the same column, pop up to the bottom of the above component
NOTE: embedded image bumps up .2 rem more than other components because of extra padding to account for
top margins of potential headings in the right text content that wraps the image - see next style padding-top
*/
div.row + div.row.embedded-image-component {
margin-top: -2.075rem;
}
/* if the embedded image follows a related-content component in the same column, override the top margin */
aside.row.relatedcontent-component + div.row.embedded-image-component {
margin-top: -2.5rem;
}
/* if the embedded image follows an essay header component in the same column, override the top margin */
header.row.essay-header + div.row.embedded-image-component {
margin-top: -4.5rem;
}
/* if the embedded image follows a rich text component in the same column, override the top margin */
div.row.richtext-component + div.row.embedded-image-component {
margin-top: -2.3rem; /* was -3.5rem; */
}
/* if the embedded image follows another embedded image component in the same column, override the top margin */
div.row.embedded-image-component + div.row.embedded-image-component {
margin-top: -1.2rem;
}
/* reduce top margin for paragraphs after an h2 */
.embedded-image-component > div.component h2 + p {
margin-top: -0.3rem;
}
/* reduce top margin for paragraphs after an h3 */
.embedded-image-component > div.component h3 + p {
margin-top: -0.3rem;
}
div.row.embedded-image-component {
margin: 0 -0.9375rem;
max-width: none;
width: auto;
}
/* moved commented out section to global-component.css on 01/12/2017 */
.embedded-image-component > div {
/*margin: 0 0.625rem 1rem;
background-color: #FFF;
padding-right: 1rem;
padding-bottom: 0.75rem;
padding-left: 1rem;
padding-top: 1rem;
width: auto;*/
margin-bottom: 0;
padding-top: .2rem;
overflow: hidden;
}
/*.embedded-image-component > div {
margin-bottom: 0;
}
.embedded-image-component > div {
padding-top: .2rem;
overflow: hidden;
}*/
.embedded-image-container {
margin-bottom: 0.75rem;
overflow: hidden;
line-height: 1.2rem;
}
.embedded-image-container.embedded-image-border {
border: 1px solid #333333;
padding: .5rem;
padding-top: 0;
}
.embedded-image-component.left-aligned .embedded-image-container {
float: left;
margin-right: 1rem;
width: 35%; /*10.1825rem;*/
}
.embedded-image-component.right-aligned .embedded-image-container {
float: right;
margin-left: 1rem;
width: 35%; /*10.1825rem;*/
}
/*.embedded-image-component .embedded-image-container > span {
clear: both;
}
.embedded-image-component .embedded-image-container .embedded-byline {
float: left;
font-family: 'OpenSans-Regular',arial,sans-serif;
font-size: .75rem;
}
.embedded-image-component .embedded-image-container .embedded-caption {
text-transform: none;
font-style: italic;
font-size: .85rem;
float: left;
}*/
/* caption and credit */
.embedded-image-component .embedded-image-container > span {
font-family: 'OpenSans-Regular',arial,sans-serif;
font-size: .875rem;
font-style: italic;
}
/* append a space after each span in the image container containing caption and credit */
.embedded-image-component .embedded-image-container > span:after {
content: " ";
}
.embedded-image-component .embedded-image-container .embedded-image-wrapper {
position: relative;
width: 100%;
margin-bottom: .3rem;
margin-top: .5rem;
}
.embedded-image-component .embedded-image-container .embedded-image-wrapper img {
width: 100%;
/*max-width: 18.75rem;*/ /* was 20 */
}
.embedded-image-component .embedded-image-container .embedded-byline.embedded-editing-mode {
float: none;
}
/* force left and right aligned items to break at 736 instead of 320 */
@media only screen and (max-width: 736px) {
.embedded-image-component.left-aligned .embedded-image-container,
.embedded-image-component.right-aligned .embedded-image-container {
float: none;
margin-right: 0;
margin-left: 0;
width: 100%;
}
}
@media only screen and (max-width: 641px) {
/*reset negative top margin at 641 when horizontal gutters disappear*/
div.row + div.embedded-image-component {
margin-top: 0;
}
/* if the embedded image follows a rich text component in the same column, override the top margin */
div.row.richtext-component + div.row.embedded-image-component {
margin-top: -3rem;
}
}
/* mobile */
@media only screen and (max-width: 320px) {
.embedded-image-container.embedded-image-border {
border: none;
padding: 0;
}
}
/* if the embedded video follows another component in the same column, pop up to the bottom of the above component */
div.row:not(.promo-box-border) + div.row.embedded-video-brightcove {
margin-top: -2.5rem;
}
/* on page with a header remove the gap between the page header and the video */
div.row.page-heading + div.row.embedded-video-brightcove {
margin-top: -3rem;
}
/* if an h3 below then shift the h3 down*/
div.row.page-heading + .embedded-video-brightcove h3
{
margin-top: 1rem;
}
.embedded-video-container-brightcove {
padding-bottom: 4rem;
}
.embedded-video-brightcove .embedded-video-wrapper-brightcove {
position: relative;
margin: 0 auto;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
overflow: hidden;
}
.embedded-video-brightcove .embedded-video-wrapper-brightcove object {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.embedded-video-component-brightcove.left-aligned .embedded-video-container-brightcove {
float: left;
margin-right: 1rem;
}
.embedded-video-component-brightcove.right-aligned .embedded-video-container-brightcove {
float: right;
margin-left: 1rem;
}
.embedded-video-brightcove .embedded-video-byline {
float: right;
font-family: 'OpenSans-Regular',arial,sans-serif;
font-size: .75rem;
text-transform: uppercase;
}
.embedded-video-brightcove .embedded-video-caption {
text-transform: none;
font-style: italic;
font-size: .875rem;
float: left;
width: 100%;
line-height: 1.4285rem;
}
@media only screen and (max-width: 641px) {
/*reset negative top margin at 641 when horizontal gutters disappear*/
.article + .embedded-video-brightcove {
margin-top: 0;
}
/* if the embedded video follows another component in the same column, pop up to the bottom of the above component */
div.row:not(.promo-box-border) + div.row.embedded-video-brightcove {
margin-top: -1rem;
}
/* try to get the playlist to show */
.embedded-video-brightcove .embedded-video-wrapper-brightcove {
padding-bottom: 75%;
}
}
@media only screen and (max-width: 320px) {
/* try to get the playlist to show */
.embedded-video-brightcove .embedded-video-wrapper-brightcove {
padding-bottom: 100%;
}
/* if the embedded video follows another component in the same column, pop up to the bottom of the above component */
div.row + div.row.embedded-video-brightcove {
margin-top: -0.5rem;
}
/* if an h3 below then shift the h3 down*/
div.row.page-heading + .embedded-video-brightcove h3
{
margin-top: 5rem;
}
}
/* embedded video specific css */
/* override brightcove play button */
/*.video-js.vjs-mouse .vjs-big-play-button {
width: 50rem;
margin-left: auto;
margin-right: auto;
background-color: red;
}*/
div.row + div.embedded-video-component {
margin-top: -2rem;
}
/* on page with a header remove the gap between the page header and the video */
div.row.page-heading + div.row.embedded-video-component {
margin-top: -2rem;
}
/* if the embedded video follows an essay header component in the same column, override the top margin */
header.row.essay-header + div.row.embedded-video-component {
margin-top: -3.875rem;
}
/* if the embedded video follows the related content component in the same column, pop up to the bottom of the above component */
aside.row.relatedcontent-component + div.row.embedded-video-component {
margin-top: -3rem;
}
/* reduce top margin for paragraphs after an h2 */
.embedded-video-component > div.component h2 + p {
margin-top: -0.3rem;
}
/* reduce top margin for paragraphs after an h3 */
.embedded-video-component > div.component h3 + p {
margin-top: -0.3rem;
}
.embedded-video-component > div {
padding-top: .2rem;
overflow: hidden;
}
/* content for video player, caption and credit and transcript */
.embedded-video-container {
padding-top: .675rem;
margin-bottom: .75rem;
line-height: 1.2rem;
}
/* player on left has a fixed width */
.embedded-video-component.left-aligned .embedded-video-container {
float: left;
margin-right: 1rem;
width: 18.325rem;
margin-bottom: .1875rem;
}
/* player on right has a fixed width */
.embedded-video-component.right-aligned .embedded-video-container {
float: right;
margin-left: 1rem;
width: 18.325rem;
margin-bottom: .1875rem;
}
.embedded-video-component .embedded-video-wrapper {
position: relative;
padding-bottom: 75%;
/*padding-top: 35px;*/
height: 0;
overflow: hidden;
margin-bottom: .3rem;
}
/* iframe from brightcove or other video source */
.embedded-video-component .embedded-video-wrapper iframe {
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
}
/* video caption, credit and transcripts together */
.embedded-video-component .embedded-video-container > span {
font-family: 'OpenSans-Regular',arial,sans-serif;
font-size: .875rem;
font-style: italic;
}
/* append a space after each span in the video container containing caption, credit and/or transcript */
.embedded-video-component .embedded-video-container > span:after {
content: " ";
}
/* anything less than 1024 */
@media only screen and (max-width: 1024px) {
/* change player on left to span full width */
.embedded-video-component.left-aligned .embedded-video-container {
float: none;
margin: 0;
width: 100%;
}
/* change player on right to span full width */
.embedded-video-component.right-aligned .embedded-video-container {
float: none;
margin: 0;
width: 100%;
}
}
/* tablet */
@media only screen and (max-width: 641px) {
/*reset negative top margin at 641 when horizontal gutters disappear*/
.person-header ~ .embedded-video-component, .essay-header ~ .embedded-video-component {
margin-top: 0;
}
}
/* mobile */
@media only screen and (max-width: 320px) {
}
div.error {
text-align: center;
}
div.error > div {
text-align: left;
display: inline-block;
max-width: 32rem;
}
div.error h1 {
font-family: 'OpenSans-Bold',arial,sans-serif;
color: #333333;
}
.error > div p:last-of-type a.button {
margin-top: 0;
}
/* overrides for tablet and mobile */
@media only screen and (max-width: 641px) {
div.error {
text-align: left;
}
div.error > div {
max-width: 100%;
}
}
/* this css is for the essay header at the top of an essay page */
div.row + header.row.essay-header, div.row + article > header.row.essay-header {
margin-top: -2.325rem;
}
.essay-header {
line-height: 1;
padding-bottom: 2.125rem; /* 1/12/2017 - this line broke a whole bunch of components that follow the essay-header */
/*border-bottom: 1px dotted #333333*/ /* not needed -- the author line is in the header with a dotted line above it */
}
/* short summary/description make it look like an h3 */
.essay-header h5 + p {
font-size: 1.375rem;
line-height: 1.1818182;
}
.essay-header .byline {
font-family: 'OpenSans-Regular',arial,sans-serif;
font-size: .875rem;
line-height: 1.2857rem;
max-width: none;
text-align: left;
padding-bottom: 2.125rem;
}
.essay-header .image-container .caption {
text-transform: none;
font-style: italic;
font-size: .85rem;
float: left;
width: 100%;
padding-top: 1rem;
margin-bottom: .5rem;
}
.essay-header .author {
margin-top: 1rem;
font-weight: bold;
line-height: 1.5;
}
.essay-header .image-container .image-wrapper {
position: relative;
}
/*
If the photo is larger than 848x575, then it should fit the entire image size
If vertical, and taller than 575, scale to fit with 10 px of black showing above the photo and below
If smaller, square, center in the 848x575 space
If chart, do not display in the 848x575 but display in the 300x234 image size. The chart can only be displayed on the right side of the content.
Image can be selected and enlarged for better viewing, everything behind it blacked out.
*/
/* surround vertical and square images with a background and center it */
.essay-header .image-container .image-wrapper.vertical, .essay-header .image-container .image-wrapper.square {
background-color: #333333;
text-align: center;
padding-top: .625rem;
padding-bottom: .625rem;
}
.essay-header .image-container .image-wrapper img {
width: 100%;
}
/* reduce image size if it is a vertical image */
.essay-header .image-container .image-wrapper.vertical img {
width: 40%;
}
/* reduce image size if it is a square image */
.essay-header .image-container .image-wrapper.square img {
width: 75%;
}
.essay-header .slideshow-container {
margin-bottom: 0.75rem;
}
.essay-header .slideshow-container ul {
background-color: #7a7d81;
list-style: none;
width:100%
}
.essay-header .slideshow-container ul li {
list-style-type: none;
}
@media only screen and (max-width: 320px) {
.essay-header > h4 {
display: none;
}
.essay-header .image-container {
margin-left: -1.25rem;
margin-right: -1.25rem;
}
.essay-header .image-container .caption {
padding-left: 1.25rem;
padding-right: 1.25rem;
}
}
@media only print {
}
footer {
color: #333333;
/*add baseline font to overall footer*/
font-family:OpenSans-Regular, Arial, Helvetica, sans-serif;
/*add baseline font size to overall footer*/
font-size: 1rem;
}
footer a {
color: #333333;
display: inline-block;
margin: 0;
}
footer ul {
list-style: none;
margin: 0;
text-align: right;
}
footer ul li {
list-style-type: none;
margin-left: 0;
margin-bottom: .375rem;
line-height: 1.5rem;
display: inline-block;
}
/* Added to support BULLET separator between links */
.footer-nav ul li:not(:first-of-type):before {
content: "\00a0 \2022 \00a0"; /* non-breaking spaces and a bullet */
}
.footer-logo a {
/*added a min width on the a tag so the logo does not break on top of the text as screen is sized down*/
min-width: 15rem;
}
.footer-logo img {
height: 2rem;
width: 2rem;
border: 0;
}
@media only screen and (max-width: 641px) {
footer {
padding-top: 1rem;
}
footer .columns {
padding-left: 1rem;
padding-right: 1rem;
}
.footer-logo {
border-bottom-width: 1px;
border-bottom-style: dashed;
margin-bottom: .5rem;
/*added margin-left to bring dotted line in additional 8px per design*/
margin-left: .5rem;
/*added margin-right to bring dotted line in additional 8px per design*/
margin-right: .5rem;
/*added text align to center elements within the div*/
text-align: center;
}
.footer-logo a {
margin-bottom:1rem;
/*added negative letter spacing to bring letters in text closer together for mobile per design*/
letter-spacing: -1px;
}
.footer-nav ul {
/*changed to text-align center to center the navigation at break point*/
text-align: center;
}
.footer-nav ul li {
/*added negative letter spacing to bring letters in menu closer together for mobile per design*/
letter-spacing: -1px;
}
.footer-nav a { color: #333333;}
}
@media only print {
/* Footer */
.footer-nav {
display: none;
}
}
/*if the footnote follows another component in the same column, pop up to the bottom of the above component*/
div.row + div.row.footnotes-component {
margin-top: -2.875rem;
}
/*if the footnote follows a rich text component in the same column, pop up to the bottom of the above component*/
div.row.richtext-component + div.row.footnotes-component {
margin-top: -3.5rem;
}
/*if the footnote follows a related content component in the same column, pop up to the bottom of the above component*/
aside.row.relatedcontent-component + div.row.footnotes-component {
margin-top: -3.5rem;
}
/*if the footnote follows a embedded image component in the same column, pop up to the bottom of the above component*/
div.row.embedded-image-component + div.row.footnotes-component {
margin-top: -2.3rem;
}
div.row.footnotes-component {
margin: 0 -0.9375rem;
max-width: none;
width: auto;
}
/* moved to global-component.css on 01/12/2017 */
/*.footnotes-component > div {
margin: 0 0.625rem 1rem;
background-color: #FFF;
padding-right: 1rem;
padding-bottom: 0.75rem;
padding-left: 1rem;
padding-top: 1rem;
width: auto;
}*/
.footnotes-component p {
padding-bottom: 1rem;
margin-bottom: 0;
}
.footnotes-component ul {
margin-left: 0;
display: inline-block;
width: 100%;
}
/* this a foonote under the footnotes component */
li.footnote {
margin-bottom: 1rem;
list-style: none;
display: inline-block;
width: 100%;
}
li.footnote sup {
float: left;
padding-right: 0.5rem;
}
li.footnote p {
padding-left: .25rem;
padding-bottom: 0;
}
/* tablet */
@media only screen and (max-width: 641px) {
div.row.richtext-component + div.row.footnotes-component {
margin-top: -3.5rem;
}
div.footnotes-component:last-of-type {
margin-bottom: 0;
}
div.row.footnotes-component > div {
margin: 0;
}
}
/* mobile */
@media only screen and (max-width: 320px) {
div.row:not(.page-heading) + div.row.footnotes-component {
margin-top: -3.5rem; /* was 1 rem */
}
}
/* this file is for all forms on the site */
textarea {
width: 45%;
}
input[type="text"] {
width: 45%;
}
.component a.button.submit {
margin-top: -.1rem;
}
form div.error {
text-align: left;
}
/* This CSS file is for both the page header and navigation */
/* top header container -sets height for full header and nav*/
.global-header-bar {
background-color: transparent;
height: 7.8125rem;
position: relative;
z-index: 999;
background-color: #e9eaeb;
/* added 3/29/16 to allow the tablet menu to appear over a faded background */
/*z-index: 999;
position: relative;*/
}
.global-header-bar ul.global-header-menu {
float: left;
display: inline-block;
width: auto;
position: absolute;
margin-left: 20.25rem;
margin-bottom: 0px;
margin-top: .875rem;
}
.global-header-bar ul.global-header-menu li {
list-style-type: none;
display: inline;
}
.global-header-bar ul.global-header-menu li.link-item a {
color: #333333;
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
padding-right: 1.25rem;
padding-left: 1.25rem;
border-right: 2px solid #333333;
display: inline-block;
line-height: 10px;
}
.global-header-bar ul.global-header-menu li.link-item:last-of-type a {
border-right: 2px solid transparent !important;
}
.global-header-title {
height: 3.125rem;
max-width: 75rem;
margin-left: auto;
margin-right: auto;
}
.global-header-title p {
color: #1b3b61;
float: left;
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
font-size: 1rem;
float: left;
height: 3rem;
margin: 0;
padding-left: 1rem;
padding-top: 1.25rem;
text-decoration: none;
text-transform: uppercase;
}
.global-header-search {
float: right;
color: #1b3b61;
padding-right: 2rem;
height: 3rem;
position: relative;
}
.global-header-search input#global-header-searchbox {
border: none;
height: 3rem;
width: 300px;
max-width: 18.75rem;
padding: 0;
padding-left: 0.5rem;
}
.global-header-search-icon {
background: transparent;
background-image: url("/img/search.svg");
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
fill: #1b3b61;
position: absolute;
right: 2.25rem;
top: 0.75rem;
margin-bottom: 0;
height: 1.5rem;
width: 1.5rem;
padding: 0.8rem;
}
.global-header-search-icon:hover, .global-header-search-icon:focus {
background: transparent;
background-position: center top;
background-image: url("/img/blue-magnify.svg");
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
fill: #1b3b61;
}
/**Begin top bar nav section**/
.top-bar-full {
background-color: transparent;
position: relative;
display: block;
max-width: 75rem;
margin-left: auto;
margin-right: auto;
}
.top-bar, .top-bar.expanded {
height: 4.6875rem;
width: 100%;
background-color: #3a6aaa;
overflow: visible;
}
.top-bar .nav-bar-logo {
position: absolute;
top: -67%;
height: 7.8125rem;
z-index: 100;
}
.nav-close {
display: none;
}
.top-bar-section ul {
display: inline-block;
float: right;
}
.top-bar-section ul li {
background-color: #3a6aaa;
height: 4.6875rem;
list-style-type: none;
margin-bottom: 0px;
}
.non-link-item {
display: none;
}
.top-bar-section .nav-head {
display: none;
}
/*Main Logo styles*/
.top-bar-logo {
display: block;
}
/*.top-bar-logo svg path {
fill: #FFFFFF;
}
.top-bar-logo svg {
height: 3.725rem;
}*/
.nav-bar-logo {
width: auto;
margin: 0px;
padding: 0px;
display: inline;
position: relative;
float: left;
/******ADDED FOR DESKTOP******/
bottom: 3rem;
}
.nav-bar-logo li {
list-style-type: none;
display: inline-block;
position: relative;
margin-bottom: 0px;
}
/*Nav Bar menu items - main navigation*/
.nav-bar-menu {
height: 4.75rem;
padding-left: 14rem;
-moz-transition: none;
-webkit-transition: none;
-o-transition: color 0 ease-in;
transition: none;
}
/* main nav bar text */
.nav-bar-menu ul li a {
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
font-size: .875rem;
height: 4.75rem;
display: block;
vertical-align: middle;
text-transform: uppercase;
}
.nav-bar-menu li:not(.has-form) a:not(.button) {
background: transparent;
padding: 0;
padding-left: 2rem;
padding-right: 2rem;
display: table-cell;
vertical-align: middle;
position: relative;
font-size: 1.125rem;
}
.nav-bar-menu li.nav-has-dropdown>a:not(.button) {
padding-right: 1.6rem;
}
.nav-bar-menu>ul>li:not(.has-form)>a:not(.button):before {
content: " ";
border-left: 1px solid #ffffff; /*#5e98c5;*/
height: 2.25rem;
position: absolute;
left: 0;
top: 1.25rem;
}
.nav-bar-menu>ul>li.nav-active>a:not(.button):before, .nav-bar-menu>ul>li:not(.has-form):hover>a:not(.button):before {
border-left: none;
}
/*remove left border from li immediately following li:hover - border visible if not*/
.nav-bar-menu>ul li:not(.has-form):hover+li:not(.has-form)>a:not(.button):before {
border-left: none;
}
.nav-bar-menu>ul>li.nav-has-dropdown>a:not(.button):after {
content: "\25BC";
position: absolute;
right: .825rem;
top: 2.15rem;
font-size: .5rem;
}
/* content after main nav item */
.nav-bar-menu>ul>li.nav-active>a:not(.button):after, .nav-bar-menu>ul>li:not(.has-form):hover>a:not(.button):after {
top: 1.65rem;
}
/* selected main nav - hover */
.nav-bar-menu>ul>li:not(.has-form):hover>a:not(.button), .nav-bar-menu>ul>li.nav-active>a:not(.button) {
background-color: #FFFFFF;
color: #3a6aaa;
/*height: 4.6875rem;*/
text-decoration: none;
}
/* selected main nav - active */
.nav-bar-menu>ul>li.nav-active>a:not(.button) {
background-color: #FFFFFF;
/* 4/8/16 */
}
/* main navigation item drop down menus */
.nav-bar-menu>ul>li:hover>.dropdown, .dropdown:hover {
clip: auto;
top: 4.75rem;
width: 100%;
}
.nav-bar-menu .dropdown {
height: 4rem;
background-color: #ecf3db;
/* 4/8/16 - FFFFFF; */
position: relative;
display: inline;
margin-left: auto;
margin-right: auto;
padding-left: 6.5rem;
padding-top: 0;
width: 100%;
}
.nav-bar-menu .dropdown li {
width: auto;
margin-bottom: 0;
}
.chevronwrapper {
display: none;
}
/*Chevron icons for drop down menus*/
.chevronwrapper {
padding-top: 0.35rem;
position: absolute;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
.chevronwrapper svg {
width: 1rem;
height: 1.725rem;
margin: .25rem 1rem .25rem .5rem;
fill: #3f73b9;
}
.nav-head .chevronwrapper svg {
width: 1rem;
height: 1.725rem;
margin: .25rem 1rem .25rem .5rem;
fill: #FFFFFF;
}
.chevronwrapper:hover svg {
opacity: .8;
}
.global-header-tagline {
display: inline-block;
width: 55%;
float: left;
position: relative;
padding-top: .625rem;
padding-left: 19.5rem;
}
.global-header-tagline h2 {
color: #FFF;
font-size: 1rem;
font-family: 'OpenSans-Regular', Arial, Helvetica, sans-serif;
font-style: italic;
margin: 0px;
padding-left: 2.125rem;
min-width: 21.75rem;
line-height: 1.5;
/*letter-spacing: .0265625rem;*/
padding-top: .2rem;
padding-right: 4rem;
}
.icon-search {
display: none;
}
.global-nav-search {
display: none;
width: 100%;
}
.global-nav-search>form>input#global-nav-searchbox {
border: none;
height: 0;
max-width: none;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
position: absolute;
z-index: 2;
top: 50.5%;
}
/* override any inline styles that javascript may have activated before window was resized */
.expanded .nav-bar-menu {
top: 4.75rem;
}
.top-bar-section ul li.search {
display: none;
}
/****Media query for navigation change at 1201px******/
@media only screen and (min-width: 1201px) {
/* override any inline styles that javascript may have activated before window was resized */
#fadedbackground[style] {
/*display: none !important;*/ /* 12/14/2016 - mjh */
}
}
/* modified tablet view with heading links still visible */
@media only screen and (max-width: 1201px) {
/* override any inline styles that javascript may have activated before window was resized */
/*#fadedbackground[style] {
display: none !important;
}*/
.nav-bar-menu ul {
display: block;
position: absolute;
top: 4.725rem;
width: 20%;
right: 0rem;
z-index: 1000;
}
.chevronwrapper {
/*padding-top: .5rem;*/
position: absolute;
right: 0;
top: 5px;
bottom: 0;
margin: auto;
display: block;
}
.nav-bar-menu ul li a {
height: 3.725rem;
}
.nav-bar-menu li:not(.has-form) a:not(.button) {
background: transparent;
padding: 0;
padding-left: 2rem;
padding-right: 2rem;
display: table-cell;
vertical-align: middle;
position: relative;
font-size: 1.125rem;
width: 100%;
color: #333333;
}
.nav-bar-menu>ul>li:not(.has-form)>a:not(.button):before {
border-left: 0px;
}
.nav-bar-menu ul li {
font-weight: normal;
text-align: left;
border-bottom: 1px dotted #333333 !important;
padding: 0;
height: auto;
position: relative;
background-color: #FFFFFF;
margin-bottom: 0px;
display: block;
}
.top-bar .toggle-topbar.menu-icon {
top: 2.25rem;
list-style-type: none;
width: 5.5rem;
position: absolute;
/* left: 2%; */
z-index: 100;
}
.top-bar .toggle-topbar.menu-icon a {
font-family: 'OpenSans-SemiBold', Arial, Helvetica, sans-serif;
font-size: .8rem;
font-weight: normal;
/* color: #ffffff; */
line-height: 4.25rem;
text-align: center;
}
.top-bar .toggle-topbar.menu-icon a span:after {
content: "";
display: block;
height: 0;
position: static;
margin-top: 0;
top: 0;
width: 100%;
right: 0;
box-shadow: 0 0 0 2px #ffffff, 0 9px 0 2px #ffffff, 0 18px 0 2px #ffffff;
}
.top-bar.expanded {
height: 4.6875rem;
overflow: visible;
}
.expanded .nav-bar-menu {
top: 0%;
position: absolute;
left: 0%;
width: 100%;
}
.nav-bar-menu {
top: -9999px;
}
.expanded .nav-bar-menu {
top: 0%;
position: absolute;
left: 0%;
width: 100%;
}
}
/* 1055 is used to handle the case where the search box is open while resizing down, we switch to a tablet presentation and heading links disappear and move to left menu */
@media only screen and (max-width: 1055px) {
.global-header-bar {
height: 9.375rem;
z-index: 997;
}
.global-nav-search {
display: block;
}
.global-nav-search>form>input#global-nav-searchbox {
top: 101%;
z-index:900;
}
.top-bar .toggle-topbar.menu-icon {
top: 2.25rem;
list-style-type: none;
width: 5.5rem;
position: absolute;
left: 2%;
/*z-index: 1;*/
}
.top-bar .toggle-topbar.menu-icon a {
font-family: 'OpenSans-SemiBold', Arial, Helvetica, sans-serif;
font-size: .625rem;
font-weight: normal;
color: #3f73b9;
letter-spacing: 1.25px;
}
.top-bar .toggle-topbar.menu-icon a span {
display: block;
position: static;
/*height: 1.25rem;*/
margin-bottom: .04rem;
/*padding-right: 5px;*/
z-index: 100;
}
.top-bar-section ul li.search {
display: block;
}
.top-bar.expanded {
height: 4.75rem;
overflow: visible;
}
.nav-bar-menu>ul>li:not(.has-form):hover>a:not(.button), .nav-bar-menu>ul>li.nav-active>a:not(.button) {
background-color: transparent;
/*color: red;*/
/*height: 4.6875rem;
text-decoration: none;*/
}
/*.top-bar.expanded .toggle-topbar.menu-icon a {
color: white;
}*/
.top-bar-section ul li.search input {
width: 100%;
height: 3.875rem;
font-size: 1rem;
padding-left: 0.5rem;
padding-right: 2.1rem;
font-family: 'OpenSans-Regular', Arial, Helvetica, sans-serif;
display: block;
}
/* main nav background on tablet and mobile */
.nav-bar-menu ul {
position: absolute;
right: 0;
background-color: #FFFFFF;
width: 100%;
z-index: 1000;
}
.nav-bar-menu ul li {
float: none;
font-weight: normal;
text-align: left;
border-bottom: 1px dotted #333333 !important;
padding: 0;
height: auto;
position: relative;
background-color: #FFFFFF;
margin-bottom: 0px;
}
.nav-bar-menu ul li.search {
border-bottom: 0px !important;
}
.nav-bar-menu>ul>li.nav-active {
background: none;
}
.nav-bar-menu li:not(.has-form) a:not(.button) {
color: #333333;
display: inline-block;
height: auto;
padding-top: .875rem;
padding-bottom: .875rem;
font-size: 1rem;
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
}
.nav-bar-menu li.upper a {
text-transform: none;
}
.nav-bar-menu li.lower a {
text-transform: uppercase;
}
.nav-bar-menu .upper .chevronwrapper svg {
fill: #FFFFFF;
}
/* main nav hover on tablet and mobile */
.nav-bar-menu>ul>li:not(.has-form):hover>a:not(.button) {
/*background-color: #FFFFFF;
color: #333333;
border: none;
text-decoration: none;
padding-top: 1.2rem;
height: auto;
top: 0;*/
}
.nav-bar-menu>ul>li.nav-active>a:not(.button) {
border: none;
}
/**letter color in mobile rollover-hover*/
.nav-bar-menu>ul>li:not(.has-form):hover>a:not(.button), .nav-bar-menu>ul>li.nav-active>a:not(.button) {
height: auto;
top: 0;
color: #333333;
}
/*.nav-bar-menu>ul>li.nav-head:not(.has-form):hover>a:not(.button), .nav-bar-menu>ul>li.nav-active>a:not(.button) {
height: auto;
top: 0;
color:#FFFFFF;
}*/
.nav-bar-menu>ul>li.nav-has-dropdown>a:not(.button):after {
content: none;
}
.nav-bar-menu>ul>li:not(.has-form)>a:not(.button):before {
content: none;
}
.nav-bar-menu .dropdown {
display: block;
width: 100%;
position: static !important;
padding-left: 0;
height: 0;
}
.nav-bar-menu .dropdown li {
padding-left: 1rem;
}
/* the space around the subnav anchors on tablet and mobile */
.nav-bar-menu .dropdown li:not(.has-form):not(.active)>a:not(.button) {
background: none;
/* 4/8/16 - allow dividers to display */
}
.nav-bar-menu .dropdown li>a {
font-family: 'OpenSans-Regular', Arial, Helvetica, sans-serif;
}
.top-bar-section .dropdown.open {
height: auto;
}
.nav-bar-menu .chevronwrapper {
display: block;
top: 0;
}
.global-header-title {
display: none;
}
.nav-bar-menu {
top: -9999px;
}
.nav-close {
height: 4.37rem;
display: block;
}
.top-bar .nav-bar-logo {
float: none;
bottom: 0rem;
position: relative;
top: 0;
}
.icon-search ul {
margin-left: 0;
position: absolute;
top: 5%;
right: 2%;
}
.icon-search li {
display: inline-block;
margin-bottom: 0;
}
.icon-search li.icon-search-search {
display: none;
}
.icon-search li a>svg {
height: 4.25rem;
fill: #3f73b9;
width: 5.3125rem;
}
.icon-search li a>svg>text {
font-family: 'OpenSans-Regular', Arial, Helvetica, sans-serif;
font-size: .625rem;
}
.menu {
text-align: center;
/*height: 9.375rem;*/
/*max-width:49rem;*/
margin-left: auto;
margin-right: auto;
background: none;
}
.top-bar-full {
background-color: #FFFFFF;
/*z-index: 999;*/
position: relative;
}
.top-bar-logo {
width: 11.5rem;
height: 4rem;
display: block;
}
.nav-bar-menu li.nav-head:not(.has-form) a:not(.button) {
padding: 0px;
color: #FFFFFF;
padding-top: .875rem;
padding-bottom: .875rem;
}
.nav-bar-menu li:not(.has-form) a:not(.button) {
line-height: 1.3;
}
.nav-bar-menu ul li.nav-head {
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
background-color: #3f73b9;
/*padding-top: .875rem;
padding-bottom: .875rem;*/
padding-right: 1rem;
padding-left: 1rem;
color: #FFFFFF;
border-bottom: 1px solid #FFFFFF !important;
display: block;
line-height: 1.3;
}
.nav-bar-menu ul li.nav-head:first-of-type {
padding-top: .875rem;
padding-bottom: .875rem;
}
.global-header-search {
display: none;
}
/*Lower navigation*/
.global-header-container {
position: absolute;
top: 100%;
/*right: .45rem;*/
z-index: 700;
background-color: #3a6aaa;
height: 4.688rem;
margin-left: auto;
margin-right: auto;
padding-left: 1rem;
padding-right: 1rem;
border-bottom: 1px solid #ffffff;
width: 100%;
}
.nav-close ul li.home-icon {
display: block;
border-bottom: 1px transparent !important;
float: left;
padding-top: 1.25rem;
background-color: #FFFFFF;
}
.nav-close ul li.close-icon {
display: block;
border-bottom: 1px transparent !important;
float: right;
padding-top: 1.25rem;
background-color: #FFFFFF;
}
.top-bar-section ul li:hover:not(.has-form)>a {
background-color: #3a6aaa;
}
.nav-close ul li.top-bar-logo {
display: inline-block;
border-bottom: 1px transparent !important;
float: none;
}
.nav-bar-menu .nav-close ul li.top-bar-logo a {
padding: 0px;
margin: 0px;
}
.nav-bar-menu .nav-close ul {
height: 4.65rem;
position: absolute;
top: 0%;
}
.nav-bar-menu .nav-close li.home-icon a {
padding: 0px;
}
.nav-bar-menu .nav-close li.close-icon a {
padding: 0px;
}
.nav-close .home-icon svg {
width: 4rem;
height: 2rem;
fill: #3f73b9;
}
.nav-close .close-icon svg {
width: 4rem;
height: 2rem;
fill: #3f73b9;
}
.expanded .nav-bar-menu {
top: 0%;
position: absolute;
left: 0%;
width: 100%;
background-color: #FFFFFF;
}
.icon-search {
top: 4.75rem;
right: 0;
width: 100%;
display: block;
}
.global-header-tagline {
width: 100%;
/*top: 30%;
transform: translateY(-35%);*/
padding-left: 0px;
padding-top: 2.75%;
}
.global-header-tagline h2 {
text-align: center;
padding-left: 0px;
padding-top: 0px;
padding-right: 0px;
}
.icon-search ul {
display: block;
z-index: 1;
}
.icon-search li {
float: left;
margin: 0;
padding: 0;
padding-top: .925rem;
width: 25%;
position: relative;
}
.icon-search li.icon-search-search {
display: block;
}
.icon-search li a>svg {
height: 1.725rem;
width: 4rem;
}
.icon-search li a:hover>svg text {
text-decoration: underline;
}
.chevronwrapper svg {
width: 1rem;
height: 1.725rem;
margin: .25rem 1rem .25rem .5rem;
fill: #3f73b9;
}
.nav-head .chevronwrapper svg {
width: 1rem;
height: 1.725rem;
margin: .25rem 1rem .25rem .5rem;
fill: #FFFFFF;
}
}
/* switch to a large mobile view here, heading display is altered to have left mobile menu and popup search and logo in the center */
@media only screen and (max-width: 768px) {
.global-header-bar {
display: block;
height: 9.375rem
}
.global-header-search input#global-header-searchbox {
max-width: 15.625rem;
}
.global-header-bar ul.global-header-menu {
display: none;
}
/*.global-header-conatiner {
position: absolute;
top: 50%;
background-color: #3a6aaa;
height: 4.688rem;
margin-left: auto;
margin-right: auto;
padding-left: 1rem;
padding-right: 1rem;
border-bottom: 1px solid #ffffff;
width: 100%;
display: block;
z-index: 100; commented out
right: .45rem; commented out
}*/
}
/* mobile overrides for smallest screen */
@media only screen and (max-width: 320px) {
.nav-bar-menu ul li a {
font-size: 1rem;
}
.global-header-tagline h2 {
min-width: 0;
line-height: 1.2;
padding-top: .6rem; /* added 2/1/2017 to vertically center tagline on mobile, 3% also seemed to work */
}
}
/* print overrides */
@media only print {
.icon-search {
display: none;
}
.nav-bar-menu {
display: none;
}
.global-header-title {
display: none;
}
.ul.li.toggle-topbar { display: none;}
.menu-icon { display: none;}
a#mobile-menu span { display: none;}
.global-header-bar { height: 5.875rem;}
.top-bar-full {
height: 5.875rem;
background-color: #3a6aaa;
/*display: inline-block;*/ /* removed 2/1/2017 so that logo would not left align */
width: 100%;
}
.top-bar, .top-bar.expanded {
height: auto; /* added 2/1/2017 to get ride of 1px blue line above logo */
}
.top-bar ul.nav-bar-logo {
position: absolute;
top: 1%;
height: 5.875rem;
display: block;
float: left;
}
li.top-bar-logo {
height: 5.875rem;
display: inline-block;
}
li.top-bar-logo a img {
height: 5.875rem;
}
.global-header-tagline {
padding-top: 1.5rem;
}
}
/* this file is for glossary specific styling */
div.row + div.row.glossary-component {
margin-top: -2.5rem;
}
.glossary-component ul {
list-style: none;
margin-left: 0;
padding-left: 0;
}
.glossary-component .glossary-alpha-index > ul {
border-bottom: solid 3px #3f73b9;
}
.glossary-component ul li {
list-style-type: none;
}
.glossary-component .glossary-alpha-index > ul li {
list-style-type: none;
display: inline-block;
margin: 0;
margin-right: .75rem;
color: #bbb;
}
.glossary-component .glossary-links-wrapper ul li {
margin-left: 0;
margin-bottom: 0;
}
.glossary-component .glossary-links-wrapper ul li ul {
margin-bottom: 0;
}
@media only screen and (max-width: 320px) {
.glossary-component .glossary-alpha-index ul {
margin-left: 0;
}
.glossary-component .glossary-links-wrapper ul {
margin-left: 0;
}
.glossary-component .glossary-links-wrapper ul li ul {
margin-left: 1.25rem;
}
}
.link-list-component h2 {
display: inline-block;
}
.linklist-highlights ul {
margin: 0;
}
.linklist-highlights ul li { list-style: none;}
.linklist-highlights ul li {
border-top: dotted 1px #333333;
display: block;
min-height: 2.75rem;
padding-top: 0.75rem;
padding-bottom: .495rem;
margin-bottom: 0;
margin-left: 0;
position: relative;
font-size: 1rem;
line-height: 1.25rem;
}
.linklist-highlights ul li:last-child {
border-bottom: dotted 1px #333333;
}
.page-heading {
display: block;
border-bottom: 1px dotted #333333;
text-align: right;
display: inline-block;
width: 100%;
}
/* this is only used by the page heading component */
.page-heading h1 {
display: inline;
float: left;
position: relative;
text-transform: uppercase;
text-align: left;
}
/* page heading id is only used on search pages this h1 is manipulated by main.js and global-searchbox.js*/
h1#page-heading {
z-index: 801;
position: relative;
}
.print-wrapper svg {
height: 1.875rem;
width: 1.875rem;
fill: #3f73b9;
float: right;
}
.page-share-drop-down.button,
.page-share-drop-down.button:visited,
.page-share-drop-down.button:visited:hover
{
background-color: #3f73b9;
color: #fff;
font-size: 1rem;
line-height: 1;
margin: 0 1rem 0 0;
padding: .625rem 1.375rem;
font-weight: bold;
display: inline-block;
width: 8.75rem;
}
.share-drop-down
{
border: 1px solid #c7c7c7;
padding: 5px;
font-size: 0.75em;
background: #ffffff;
text-transform:capitalize;
z-index:2;
}
.share-drop-down > ul
{
list-style: none;
margin: 0;
}
.share-drop-down > ul > li
{
list-style-type: none;
border-top: 1px dotted #c7c7c7;
margin: 0;
padding: 5px;
clear:both;
font-weight:bold;
z-index:1;
}
.share-drop-down > ul > li a {
color:#000000;
}
.share-drop-down img
{
padding-right: 5px;
}
/* END SHARE DROP DOWN */
@media only screen and (max-width: 1024px) {
.page-share-drop-down.button {
clear: both;
float: left;
margin: 0 1rem 0 0;
}
}
@media only screen and (max-width: 786px) {
.page-heading a.print-wrapper {
display: none;
}
/*.page-heading {
border: none;
}
.page-heading-wrapper {
height: 0;
margin-bottom: 1.25rem;
padding: 0;
}*/
/* 3/14/2017 - Page heading will now always be visible
.page-heading h1 {
display: none;
}
*/
}
@media print {
.page-share-drop-down.button {
display: none;
}
.print-wrapper svg {
display: none;
}
}
/* this css is for the person header at the top of a person page */
.person-component .print-wrapper svg {
height: 1.5rem;
width: 1.75rem;
fill: #3f73b9;
float: right;
margin-bottom: .5rem;
}
div.row + header.row.person-header, div.row + article > header.row.person-header {
margin-top: -1rem;
}
.person-header-container {
border-bottom: 1px dotted #333333;
display: inline-block;
padding-bottom: 1rem;
width: 100%;
margin-top: -1.25rem;
}
.person-header img {
float: left;
/*height: 16.25rem;
width: 11.75rem;*/
height: 15.875rem; /* changed to match style guide on 1/18/17 they asked for 186x254 */
width: 11.625rem; /* changed to match style guide on 1/18/17 they asked for 186x254 */
margin-bottom: .75rem;
padding-top: .5rem;
}
.person-header .has-tip {
border-bottom: none;
}
.person-component .person-header {
line-height: 1;
}
.person-header-image {
float: left;
}
.byline {
font-family:'OpenSans-Regular',arial,sans-serif;
font-size: .875rem;
font-style: italic;
text-align: center;
max-width: 11.75rem;
}
.person-header-facts {
display: inline-block;
padding-left: 1.875rem;
}
.person-header-facts h1 {
/*width: 75%; Cecelia approved removing this 1/10/2017*/
margin-top: 0;
}
.person-header-facts ul {
font-family: 'OpenSans-SemiBold',arial,sans-serif;
font-size: 1rem;
margin-top: 1rem;
}
/*.person-component .byline {
font-family: 'OpenSans-SemiBold',arial,sans-serif;
font-size: .875rem;
line-height: 1.2857rem;
}
.person-component .byline > a {
color: #1b5faa;
}
.person-component.person-image, .person-component.person-video {
margin-top: -1.875rem;
}
.person-component .image-container {
margin-bottom: 0.75rem;
}
.person-component .image-container .byline {
float: right;
font-family: 'OpenSans-Regular',arial,sans-serif;
font-size: .85rem;
}
.person-component .image-container .caption {
text-transform: none;
font-style: italic;
font-size: .85rem;
float: left;
width: 100%;
}
.person-component .image-container .image-wrapper {
position: relative;
}
.person-component .image-container .image-wrapper img {
width: 100%
}
.person-component .image-container .image-wrapper .overlay-icons {
padding: 0.5rem 1rem 0.125rem 1rem;
}
.person-component .image-container .image-wrapper .overlay-icons > svg {
height: 2rem;
padding-right: 0.375rem;
}
.person-component .slideshow-container {
margin-bottom: 0.75rem;
}
.person-component .slideshow-container ul {
background-color: #7a7d81;
list-style: none;
width:100%
}
.person-component .slideshow-container ul li {
list-style-type: none;
}*/
@media only screen and (max-width: 1068px) {
.person-header img {
width: auto;
height: auto;
}
.person-header-image {
width: 25%;
}
/* remove HxW for tablet */
.person-header-image img {
float: none;
}
.person-header-image .byline {
max-width: none;
}
.person-header-facts {
padding-left: .625rem;
padding-top: .5rem;
width: 75%;
}
.person-header-facts h1 {
width: auto;
}
}
@media only screen and (max-width: 641px) {
.person-header-image {
float: none;
text-align: center;
width: 100%;
}
.person-header-image img {
float: none;
width: 75%;
}
}
@media only screen and (max-width: 320px) {
.person-header-image {
float: none;
width: 100%;
text-align: center;
}
/* force HxW in mobile */
.person-header-image img {
float: none;
height: 15.875rem; /* changed to match style guide on 1/18/17 they asked for 186x254 */
width: 11.625rem; /* changed to match style guide on 1/18/17 they asked for 186x254 */
}
.person-header-image .byline {
max-width: none;
}
.person-header-facts {
padding-left: .625rem;
padding-top: 1.5rem;
}
.person-header-facts h1 {
width: auto;
}
}
@media only print {
/*.person-component .print-wrapper svg {
display: none;
}*/
.person-header-container {
display: inline-block;
font-size: 0;
vertical-align: top;
}
.person-header-image {
float: none;
display: inline-block;
width: 30%;
}
.person-header-facts {
display: inline-block;
width: 70%;
vertical-align: top;
}
.person-header-facts h1 {
width: 100%;
}
}
/* this class contains promobox specifc css */
.promobox-component > div.component h2 + .full-image-wrapper {
margin-top: 1rem;
}
.promobox-component > div.component .full-image-wrapper {
padding-left: 0;
padding-right: 0;
}
/*.promobox-component > div.component p + .full-image-wrapper {
padding-top: 1rem;
}*/
/* iframe from brightcove, google or other source */
.promobox-component iframe {
width: 100%;
height: 100%;
}
/* print */
@media only print {
.promobox-component {
page-break-inside: avoid;
}
}
/*if the blockquote follows another component in the same column, pop up to the bottom of the above component*/
div.row + .pullquote-component {
margin-top: -1.875rem;
}
/*if the rich text follows another rich text component in the same column, pop up to the bottom of the above component*/
/*div.row.richtext-component + div.row.richtext-component {
margin-top: -4.4rem;
}*/
/*.pullquote-component > div {
margin-bottom: 0.825rem;
}*/
@media only screen and (max-width: 641px) {
div.row + .pullquote-component {
margin-top: 0;
}
}
/* this class contains related content specifc css */
/* if the related content follows an essay header component in the same column, override the top margin */
header.row.essay-header + aside.row.relatedcontent-component {
margin-top: -3.875rem;
}
/* if the related content follows a another component in the same column, pop up to the bottom of the page heading */
div.row + aside.row.relatedcontent-component {
margin-top: -2.5rem;
}
/* if the related content follows a another related component in the same column, pop up to the bottom of the page heading */
aside.row + aside.row.relatedcontent-component {
margin-top: -2.5rem;
}
/* if the related content follows a rich text component in the same column, pop up to the bottom of the page heading */
div.row.richtext-component + aside.row.relatedcontent-component {
margin-top: -3.2rem;
}
/* reduce top margin for paragraphs after an h2 */
.relatedcontent-component > div.component h2 + p {
margin-top: -0.3rem;
}
/* reduce top margin for paragraphs after an h3 */
.relatedcontent-component > div.component h3 + p {
margin-top: -0.3rem;
}
.relatedcontent-component > div {
overflow: hidden;
}
.relatedcontent-component > div.component > .relatedcontent-container {
border: 1px solid #000000;
margin-bottom: 1rem;
margin-top: .575rem; /* make related content align with content */
}
.relatedcontent-component.left-aligned .relatedcontent-container {
float: left;
margin-right: 1rem;
width: 45%; /*22.875rem;*/
}
.relatedcontent-component.right-aligned .relatedcontent-container {
float: right;
margin-left: 1rem;
width: 45%; /*22.875rem;*/
}
.relatedcontent-component > div.component > .relatedcontent-container > .relatedcontent-content {
padding-left: 1rem;
padding-right: 1rem;
padding-bottom: .75rem;
display:block;
}
.relatedcontent-component > div.component > .relatedcontent-container > .relatedcontent-content > h3 {
margin-top: 1rem;
}
/* force related content links to be bold */
.relatedcontent-component > div.component > .relatedcontent-container > .relatedcontent-content > ul > li > a {
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
}
/* anything less than 1024 */
/* CorpComm wants to break before the typical 320, set to 550 */
@media only screen and (max-width: 550px) {
/* replace border with a bottom border */
.relatedcontent-component > div.component > .relatedcontent-container {
border: none;
margin: 0;
margin-bottom: 1.125rem;
padding-left: 0;
padding-right: 0;
border-bottom: 1px dotted #000000;
}
/* removed padding */
.relatedcontent-component > div.component > .relatedcontent-container > .relatedcontent-content {
padding-left: 0;
padding-right: 0;
padding-bottom: 0;
}
/* remove top margin */
.relatedcontent-component > div.component > .relatedcontent-container > .relatedcontent-content > h3 {
margin-top: 0;
}
/* expand to full width */
.relatedcontent-component.left-aligned .relatedcontent-container {
float: none;
margin: 0;
width: 100%;
}
/* expand to full width */
.relatedcontent-component.right-aligned .relatedcontent-container {
float: none;
margin: 0;
width: 100%;
}
}
@media only screen and (max-width: 320px) {
}
/* this class contains related links specifc css */
.relatedessays-component h2 {
border-bottom: 1px dotted #333333;
padding-bottom: .75rem;
}
/* add extra padding only on the essay page where this is the first component in the column */
.columns .relatedessays-component:first-child h2 {
padding-bottom: 1rem;
}
.relatedessays-component p {
margin-bottom: 1rem;
}
/* force related essay links to be bold */
.relatedessays-component > div.component > ul > li > a, .relatedessays-component > div.component > div.view-more-content > ul > li > a {
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
}
/* tablet */
/*@media only screen and (max-width: 641px) {
.row.relatedessays-component {
margin-top: 1rem;
}
}*/
/*@media print {
.relatedessays-component {
display: none;
}
}*/
/* this class contains related people specific css */
.relatedpeople-component h2 {
border-bottom: 1px dotted #333333;
padding-bottom: .75rem;
margin-bottom: 0rem;
}
/* add extra padding only on the person page where this is the first component in the column */
.columns .relatedpeople-component:first-child h2 {
padding-bottom: 1rem;
}
.relatedpeople-component p {
font-size: .875rem;
font-family: OpenSans-Regular, arial, sans-serif;
line-height: 1.2;
margin-top: 1rem;
margin-bottom:0rem;
}
/*Following class controls styling of related-people
attributes that area displayed below the image*/
.relatedpeople-component p.related-people-attributes {
margin-top:.5625rem;
margin-bottom: 0rem;
}
.relatedpeople-component p a {
font-family: OpenSans-Bold, arial, sans-serif;
font-size: .9rem;
}
.relatedpeople-component ul li {
text-align: center;
padding-bottom: 0rem;
margin-bottom: 0rem;
}
.relatedpeople-component ul li img {
margin-top: .9375rem;
}
.relatedpeople-component a.button.view-more-button {
margin-top: 1.1875rem;
}
/* following re-sizes a singleton image to approximately the same size as a "paired image" (i.e. image is downsized) */
.relatedpeople-component .small-block-grid-1 li img {
width: 47%;
height: 47%;
}
/* tablet */
/*@media only screen and (max-width: 641px) {
.row.relatedpeople-component {
margin-top: 1rem;
}
}*/
/*@media print {
.relatedpeople-component {
display: none;
}
}*/
/* this class contains related links specifc css */
.relatedlinks-component h2 {
border-bottom: 1px dotted #333333;
padding-bottom: .75rem;
}
.relatedlinks-component p {
margin-bottom: 1rem;
}
/* force related links to be bold */
.relatedlinks-component > div.component > ul > li > a, .relatedlinks-component > div.component > div.view-more-content > ul > li > a {
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
}
/* tablet */
/*@media only screen and (max-width: 641px) {
.row.relatedlinks-component {
margin-top: 1rem;
}
}*/
/*@media print {
.relatedlinks-component {
display: none;
}
}*/
/* if the rich text follows another component in the same column, pop up to the bottom of the above component */
div.row + div.row.richtext-component {
margin-top: -2rem;
}
/* if the rich text follows a header row in the same column, pop up to the bottom of the above component */
header.row + div.row.richtext-component {
margin-top: -2rem;
}
/* if the rich text follows another rich text component in the same column, pop up to the bottom of the above component*/
div.row.richtext-component + div.row.richtext-component {
margin-top: -3.5rem;
}
/* if the rich text follows the bibliography component in the same column, pop up to the bottom of the above component */
div.row.bibliography-component + div.row.richtext-component {
margin-top: -2.5rem;
}
/* if the rich text follows the embedded image component in the same column, pop up to the bottom of the above component */
div.row.embedded-image-component + div.row.richtext-component {
margin-top: -2.3rem;
}
/* if the rich text follows the embedded video component in the same column, pop up to the bottom of the above component */
div.row.embedded-video-component + div.row.richtext-component {
margin-top: -3rem;
}
/* if the rich text follows the related content component in the same column, pop up to the bottom of the above component */
aside.row.relatedcontent-component + div.row.richtext-component {
margin-top: -3.2rem;
}
/* if the rich text follows a left or right aligned embedded video component in the same column, pop up to the bottom of the above component */
div.row.embedded-video-component.right-aligned + div.row.richtext-component,
div.row.embedded-video-component.left-aligned + div.row.richtext-component {
margin-top: -5rem;
}
/* if the rich text follows the essay header component in the same column, pop up to the bottom of the above component */
header.row.essay-header + div.row.richtext-component {
margin-top: -3.875rem;
}
div.row.richtext-component {
margin: 0 -0.9375rem;
max-width: none;
width: auto;
}
/* moved to global-component.css on 01/12/2017 */
/*.richtext-component > div {
margin: 0 0.625rem .5rem;
background-color: #FFF;
padding-right: 1rem;
padding-bottom: 0.75rem;
padding-left: 1rem;
padding-top: 1rem;
width: auto;
}*/
.richtext-component hr {
margin-bottom: 1rem;
}
/* adding top padding to headings after paragraphs */
/*.richtext-component > div.component p + h2 {
padding-top: 1rem;
}
.richtext-component > div.component p + h3 {
padding-top: 1rem;
}
.richtext-component > div.component p + h4 {
padding-top: 1rem;
}
.richtext-component > div.component p + h5 {
padding-top: 1rem;
}
.richtext-component > div.component p + h6 {
padding-top: 1rem;
}*/
/* reduce top margin for paragraphs after an h2 */
.richtext-component > div.component h2 + p {
margin-top: -0.3rem;
}
/* reduce top margin for paragraphs after an h3 */
.richtext-component > div.component h3 + p {
margin-top: -0.3rem;
}
/* special break point for embedded video before rich text */
@media only screen and (max-width: 1068px) {
/* if the rich text follows a left or right aligned embedded video component in the same column adjust top margin */
div.row.embedded-video-component.right-aligned + div.row.richtext-component,
div.row.embedded-video-component.left-aligned + div.row.richtext-component {
margin-top: -3rem;
}
}
/* tablet */
@media only screen and (max-width: 641px) {
div.row.pullquote-component + div.row.richtext-component {
margin-top: -1.125rem;
}
/*div.row.richtext-component + div.row.richtext-component {
margin-top: -2.125rem;
}*/
div.richtext-component:last-of-type {
margin-bottom: 0;
}
/*div.row.richtext-component > div {
margin: 0;
}*/
/* if the rich text follows the embedded image component in the same column, adjust top margin */
div.row.embedded-image-component + div.row.richtext-component {
margin-top: -3.5rem;
}
}
/* mobile */
@media only screen and (max-width: 320px) {
/*div.row:not(.page-heading) + div.row.richtext-component {
margin-top: -1rem;
}*/
/* if the rich text follows the embedded video component in the same column, adjust top margin */
div.row.embedded-video-component + div.row.richtext-component {
margin-top: -3rem;
}
}
.filter-content {
position: relative;
z-index: 0;
}
.search-filter-mobile { display: none;}
.filter-content h1 {
background-color: #ffffff;
margin-left: -.325rem;
padding-left: .625rem;
margin-right: -.425rem;
padding-top: .625rem;
margin-bottom: 0rem;
/* border-bottom: 1px dotted #333333; */
text-transform: uppercase;
margin-top: 0px;
}
/* filter refinements need to stay visible on desktop, tablet and mobile */
.search-facets {
position: relative;
z-index: 1;
}
.search-facets .component {
padding-left: 0rem;
padding-right: 0rem;
padding-bottom: 0rem;
}
.search h1:first-of-type {
text-transform: uppercase;
border-bottom: dotted 1px #333333;
padding-bottom: 1.25rem;
padding-top: 1.75rem;
margin-right: -.625rem;
margin-left: -.25rem;
margin-bottom: 0rem;
margin-top: 0px;
}
.search-facets h2 {
text-align: left;
margin-bottom: .5rem;
font-family: 'OpenSans-SemiBold',arial,sans-serif;
font-size: 1.125rem;
}
.search-facets ul {
margin: 0;
margin-bottom: 1rem;
}
.search-facets ul li { list-style: none;}
.search-facets ul li {
border-top: dotted 1px #333333;
display: block;
min-height: 2.75rem;
padding-top: 0.75rem;
padding-bottom: .495rem;
margin-bottom: 0;
margin-left: 0;
position: relative;
font-size: 1rem;
line-height: 1.25rem;
padding-right: 2.3rem;
}
.search-facets ul li:last-child {
border-bottom: dotted 1px #333333;
}
.accordion-component .component {
padding-left: 0rem;
padding-right: 0rem;
padding-bottom: 0rem;
}
/* the X circle */
.component .search-facets ul li > a > svg {
float: right;
font-size: .75rem;
position: absolute;
right: .575rem;
top: 0.4rem;
color: #333333;
}
.clear-all-facets { display: none;}
/* special case used by search facets inside an accordion to display filter by information */
p.filter-by {
text-align: left;
margin-bottom: .5rem;
font-family: 'OpenSans-Bold',arial,sans-serif;
font-size: 1.125rem;
}
/* special case used by search facets with a facet description */
p.facet-description {
margin-bottom: 0;
}
.content-lookup-summary-component p.facet-description {
color: #ffffff;
}
/* larger than tablet */
@media only screen and (min-width: 641px) {
/* show the filter content once out of tablet */
.filter-content[style] {
display: block !important;
z-index: 0;
position: relative;
}
}
@media only screen and (max-width: 641px) {
.search-filter-mobile {
display: block;
padding-bottom: 1rem;
/*padding-top: 0rem !important;*/
/*border-bottom: 1px dotted #333333;*/
/*margin-bottom: 1.5rem;*/
padding-left: .625rem;
position: relative;
padding-right: .625rem;
/*height: 3.625rem;*/
/*margin-left: .625rem;
margin-right: .625rem;*/
background-color: white;
}
.search-filter-mobile:after {
content: "";
width: auto;
display: block;
border-bottom: 1px dotted #333333;
position: absolute;
bottom: 0;
left: .625rem;
right: .625rem;
}
.search-filter-mobile.interior-component {
margin-bottom: 0;
padding-top: 1rem;
}
div + .drop-down-sort-by-mobile {
padding-top: 1rem;
}
/*p.filter-by {
border-top: 1px dotted #333333;
padding-top: .625rem;
}*/
.search-filter-mobile .filter-button {
margin-top: 0px;
margin-right:1rem;
}
/*div.row.search-facets {
margin-top: -1.4rem;
}*/
.search-facets .component {
padding-left: .625rem;
padding-right: .625rem;
}
.search .accordion-component .component {
padding-left: .625rem;
padding-right: .625rem;
}
.clear-all-facets {
display: block;
float: right;
padding-top: .625rem;
float: left;
padding-left: .625rem;
}
.search h1:first-of-type {
padding-left: .75rem;
}
.filter-content {
margin-left: 0px;
margin-right: 0px;
position: relative;
display: none;
}
div.row.search-facets + .filter-content > div.row.accordion-component {
/*margin-top: -1rem;*/
margin-bottom: 1rem;
}
.filter-content > div.row.accordion-component > div.component > ul.accordion:last-of-type {
padding-bottom: 1rem;
}
}
@media only screen and (max-width: 320px) {
/*.filter-content > div.row.accordion-component {
margin-top: -.4rem;
}*/
}
.search {
background-color: #ffffff;
display: inline-block;
width: 100%;
}
.row.search-component {
margin-left: .5725rem;
margin-right: .625rem;
}
.search-component .component {
margin-left: -1.425rem;
margin-right: -1.25rem;
padding-right: .3125rem;
}
.search-component .search-results-heading {
border-bottom: 1px dotted #333333;
display: inline-block;
width: 100%;
padding-bottom: 1.125rem;
padding-top: .75rem;
}
.search-component div.component a {
/*color: #1b5faa; removed 5/10/16 since this is already the default */
font-family: 'OpenSans-SemiBold',arial,sans-serif;
}
.search-component .search-controls a:visited,
.search-component div.component .search-controls a:visited {
color: #a378a6;
}
.search-component .search-controls a,
.search-component div.component .search-controls a {
color: #3f73b9;
font-family: 'OpenSans-Bold',arial,sans-serif;
font-size: 1.125rem;
/*margin-left: .25rem;*/
}
.search-component span.page-link {
font-family: 'OpenSans-Bold',arial,sans-serif;
font-size: 1.125rem;
/*margin-left: .25rem;*/
}
.page-link {
text-align: center;
}
.search-component .search-controls a.previous-page {
text-decoration: none;
}
.search-component ul {
list-style: none;
margin-left: .3125rem;
}
.search-component ul li {
list-style-type: none;
line-height: 2rem;
}
.search-component .searchbox-wrapper {
position: relative;
max-width: 24rem;
margin-left: .3125rem;
margin-right: 1rem;
}
.search-component .searchbox-wrapper input[type="text"] {
margin-bottom: .275rem;
}
.mobile-search-results-heading { display: none;}
.search-component .search-best-bets {
/*background: #aec7e9 none repeat scroll 0 0;*/
border-bottom: 1px dotted #333333;
/*padding-top: 1rem;*/
padding-bottom: 1rem;
}
.search-component .search-best-bets .content-block {
border-top: none;
padding-top: 0;
}
.search-component .search-best-bets h4 {
font-family: 'OpenSans-SemiBold',arial,sans-serif;
margin-left: .3125rem;
}
.search-component .search-best-bets li {
line-height: 1.25rem;
margin-right: 1.25rem;
}
.search-component .search-best-bets li > p {
margin-bottom: .75rem;
line-height: 1.25rem;
}
.search-component .search-results {
border-bottom: 1px dotted #333333;
margin-bottom: 1rem;
/*padding-bottom: 2rem;*/
}
.search-component .search-results ul li {
padding-bottom: 0.5rem;
line-height: 1.25rem;
margin-right: 5rem;
}
.search-component .search-results ul li > p {
margin-bottom: 0;
line-height: 1.25rem;
}
.search-component .search-results .search-result-url {
color: #6a9d11;
display: none;
}
.search-results-heading form {
/* padding-bottom: .51rem; align with left-panel */
/* padding-top: .51rem; align with left-panel */
}
/* Following support the result header, specifically dropdown styling */
.search-results-heading select, .search-filter-mobile select {
border: 1px solid #3f73b9;
background-color: #3f73b9;
//background-image: url(/Content/images/icons/down_chevron.svg);
background-size: 1.25rem;
background-position: 95% 58%;
width: 9.5rem;
/*margin-right: 4.125rem;*/
margin-top: 0rem;
margin-bottom: 0rem;
padding-left: .625rem;
font-size: 1rem;
color: #FFFFFF;
font-family: 'OpenSans-Bold',arial,sans-serif;
text-transform: uppercase;
font-size: 1.125rem;
height: 2.625rem;
}
.search-results-heading select option, .search-filter-mobile select option {
background-color: #FFFFFF;
color: #333333;
}
.search-results-heading .dropdown-sort-by {
display: inline-block; /* align dropdowns horizontally */
}
.search-filter-mobile .dropdown-sort-by-mobile {
position: relative;
top: 1px;
display: inline-block;
}
.search-results-heading label {
font-weight: bold;
display: inline;
}
.search-results-heading .print-wrapper svg {
margin-top: .7rem;
}
/*.search-component .search-best-bets ul li:not(:last-child),
.search-component .search-results ul li:not(:last-child) {
border-bottom: 1px dotted #333333;
}*/
.search-component .search-controls {
padding-right: 1rem;
padding-left: .3125rem;
margin-bottom: 0.375rem;
}
.search-component .search-controls .search-controls-count {
display: inline-block;
margin-bottom: .5rem;
margin-right: 2rem;
line-height: 2rem;
padding-top: 0.775rem;
font-weight: bold;
}
.search-component .search-controls .search-controls-count > span {
font-style: normal;
font-family: 'OpenSans-Bold',arial,sans-serif;
}
.search-component .search-controls nav {
float: right;
margin-bottom: 0;
text-align: center;
}
.search-component .search-controls ul li {
display: inline;
/*padding-left: 0.25rem;*/
/*padding-right: 0.25rem;*/
padding-top: .25rem;
padding-bottom: .125rem;
margin-bottom: 0;
/*margin-right: 0.25rem;*/
line-height: 3.5rem;
/*margin-left: 0.25rem;*/
/*border: 1px solid #333333;*/
width: 30px;
}
.search-component .search-controls ul li:first-child { border: none;}
.search-component .search-controls ul li:last-child { border: none;}
.search-component .search-controls ul li.selected {
color: #ffffff;
/*text-decoration: underline;*/
border: none;
color: #3f73b9;
/*border: 1px solid #3f73b9;*/
}
.search-component .search-controls ul li.selected > a {
color: #333333;
text-decoration: none;
}
.search-component .search-controls ul li a + a {
margin-left: 1.125rem;
}
.search-component .search-controls svg, .search-component .search-mobile-controls svg {
fill:#3f73b9;
width: 1.875rem;
height: 1.875rem;
position: relative;
top: .525rem;
}
.search-component .search-mobile-controls {
display: none;
text-align: center;
}
.search .content-block h1:first-of-type {
border-bottom: none;
padding-top: 0px;
text-transform: none;
}
span.facet-count {
/*border: solid 3px #333333;
border-radius:50%;*/
/*float: right;*/
height: 1.85rem;
line-height: 1.625rem;
width: 1.85rem;
text-align: center;
font-size: .75rem;
position: absolute;
right: 2.25rem;
top: 0.45rem;
color: #333333;
}
/* grid container base - base settings used by people, time period and topic */
.search-component .search-results.grid-container p, .search-component .search-best-bets.grid-container p {
font-size: .875rem;
font-family: OpenSans-Regular, arial, sans-serif;
line-height: 1.2;
/*margin-top: 1rem;*/
margin-bottom:0;
font-weight: bold;
text-align: center;
}
.search-component .search-results.grid-container ul, .search-component .search-best-bets.grid-container ul {
padding: 0;
margin-left: -2rem;
margin-right: -2rem;
}
.search-component .search-results.grid-container ul li, .search-component .search-best-bets.grid-container ul li {
padding-bottom: 0;
padding-left: 2rem;
padding-right: 2rem;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
text-align: left;
}
.search-component .search-results.grid-container ul li>a, .search-component .search-best-bets.grid-container ul li>a {
display: block;
}
.search-component .search-results.grid-container ul li>a h5, .search-component .search-best-bets.grid-container ul li>a h5 {
color: #3f73b9;
font-size: .875rem;
margin: 0;
font-family: "OpenSans-SemiBold", Arial, Helvetica, sans-serif;
text-align: center;
}
/* Styling time period best-bets */
.search-component .search-best-bets.time-period-container {
padding-right: 1.75rem; /* pads to text that rendered to the right side of image */
}
.search-component .search-best-bets.time-period-container .row {
margin-left: 0;
}
.search-component .search-best-bets.time-period-container h1 {
margin-left: 0;
padding-bottom: 1rem;
}
.search-component .search-results.grid-container ul li a h5~p {
font-weight: normal; /* ensure text below image is not bold on result pages */
}
.search-component .search-results.grid-container ul li>a:hover,
.search-component .search-best-bets.grid-container ul li>a:hover {
text-decoration: underline;
}
.search-component .search-results.grid-container ul li>a:hover h5,
.search-component .search-best-bets.grid-container ul li>a:hover h5 {
color: #a378a6;
text-decoration: none;
}
.search-component .search-results.grid-container ul li>a:visited h5,
.search-component .search-best-bets.grid-container ul li>a:visited h5 {
color: #a378a6;
}
.search-component .search-results.grid-container ul li, .search-component .search-best-bets.grid-container ul li > p:last-of-type {
font-weight: bold;
}
.search-component .search-results.grid-container ul li img, .search-component .search-best-bets.grid-container ul li img {
margin-top: .9375rem;
/*width: 70%;*/
margin-bottom: 1rem;
}
.search-component .search-results.grid-container .image-wrapper,
.search-component .search-best-bets.grid-container .image-wrapper {
background: #333333;
display: flex;
justify-content: center;
display: -ms-flexbox;
-ms-flex-pack: center;
align-items: center;
margin-top: .9375rem;
margin-bottom: 1rem;
width: 100%;
}
.people-container ul li .image-wrapper {
background: none !important;
}
.search-component .search-results.grid-container.people-container .image-wrapper img { flex: 1;}
.search-component .search-results.grid-container .image-wrapper img,
.search-component .search-best-bets.grid-container .image-wrapper img{
margin: 0;
max-width: 100%;
}
.search-component .search-results.time-period-container .image-wrapper,
.search-component .search-best-bets.time-period-container .image-wrapper,
.search-component .search-results.topic-container .image-wrapper,
.search-component .search-best-bets.topic-container .image-wrapper {
height: 160px;
}
.search-component .search-results.time-period-container .image-wrapper img,
.search-component .search-best-bets.time-period-container .image-wrapper img,
.search-component .search-results.topic-container .image-wrapper img,
.search-component .search-best-bets.topic-container .image-wrapper img {
max-height: 160px;
-ms-flex: none;
}
@media only screen and (max-width: 800px) {
.search-component .search-results.grid-container ul,
.search-component .search-best-bets.grid-container ul {
margin-left: -0.75rem;
margin-right: -0.75rem;
}
.search-component .search-results.grid-container ul li,
.search-component .search-best-bets.grid-container ul li {
padding-left: 0.75rem;
padding-right: 0.75rem;
}
}
@media only screen and (max-width: 640px) {
.search-component .search-results.time-period-container .image-wrapper,
.search-component .search-best-bets.time-period-container .image-wrapper,
.search-component .search-results.topic-container .image-wrapper,
.search-component .search-best-bets.topic-container .image-wrapper {
height: auto;
}
.search-component .search-results.time-period-container .image-wrapper img,
.search-component .search-best-bets.time-period-container .image-wrapper img,
.search-component .search-results.topic-container .image-wrapper img,
.search-component .search-best-bets.topic-container .image-wrapper img {
max-height: 200px;
}
.search-component .search-best-bets.time-period-container a.content-block-image-wrapper {
float: none;
max-height: 400px;
}
.search-component .search-results.grid-container .image-wrapper {
background: none;
/*max-height: 400px;*/
}
}
/* end of grid container base */
/* desktop people container overrides */
.search-component .search-results.people-container p, .search-component .search-best-bets.people-container p {
font-weight: normal;
}
.search-component .search-results.people-container p:nth-of-type(2),
.search-component .search-results.people-container p:nth-of-type(3),
.search-component .search-best-bets.people-container p:nth-of-type(2),
.search-component .search-best-bets.people-container p:nth-of-type(3) {
margin-top: 0.5625rem;
margin-bottom: 0;
display: block;
}
.search-component .search-results.people-container {
padding-bottom: 2rem;
}
.search-component .search-results.people-container p > a, .search-component .search-best-bets.people-container p > a {
font-family: OpenSans-Bold, arial, sans-serif;
font-size: 0.9rem;
}
/* end of desktop people container overrides */
/* desktop topic container overrides*/
.search-component .search-results.topic-container {
padding-bottom: 2rem;
}
/* end of desktop topic container overrides */
/* desktop time period container overrides*/
.search-component .search-results.time-period-container {
padding-bottom: 2rem;
}
/* end of desktop time period container overrides*/
.search .mobile-search-results-heading {
/*padding: 0;
margin: 1rem;*/
margin-bottom: 0;
}
.search .mobile-search-results-heading + .interior-component {
padding-top: 0;
}
/* overrides for tablet and larger */
@media only screen and (min-width: 641px) {
/* re-display desktop version of people drop down */
.search-results-heading .dropdown-sort-by {
display: inline-block;
}
/* re-display desktop version of search box */
.search-results-heading .searchbox-wrapper {
display: block;
}
}
/* overrides for tablet */
@media only screen and (max-width: 641px) {
.search-component ul {
margin-left: 0rem;
}
div.columns.large-11.medium-10.small-15 > div.search-component > div.component {
padding-top: 0px;
margin-top: 0px;
}
.mobile-search-results-heading {
display: block;
/*margin-bottom: 0px !important;*/
position: relative;
z-index: 800;
}
.search-results-heading .searchbox-wrapper {
display: none;
}
/* hide desktop version of people drop down */
.search-results-heading .dropdown-sort-by {
display: none;
}
/*.search-facets h2~ul {*/
.search-facets h2~ul {
margin-bottom: 0rem;
}
.search-facets .search-facets-list ul {
margin-bottom: 0rem;
}
.search-facets .large-15 {
margin-bottom: 0rem;
}
.search-component .search-controls ul {
float: none;
margin-left: 0px;
}
.search-component .search-controls .search-controls-count {
padding-top: 0;
margin-bottom: 0;
margin-right: 0;
line-height: normal;
}
.mobile-search-results-heading .searchbox-wrapper input[type="text"] {
max-width: 100%;
}
.search-component .component {
margin-left: 0;
margin-right: .625rem;
padding-right: 0px;
}
.search-component .search-controls {
padding-left: 0px;
padding-right: 0px;
margin:0;
}
/* hide the print icon on mobile */
.search-results-heading .print-wrapper svg {
display: none;
}
.row.search-component {
margin-left: .625rem;
margin-right: .625rem;
}
.search-component .search-results ul li {
margin-right: .5rem;
}
.search-component .search-results-heading {
padding-bottom: 0px;
padding-top: 0px;
border-bottom: none;
}
.component .searchbox-wrapper input[type="text"] {
padding-right: 2.125rem;
border: 1px solid #333333;
width: 100%;
/*max-width: 90%;*/
margin-left: auto;
margin-right: auto;
margin-bottom: 0;
}
/* pagination controls
- hide page controls on top
- and hide result counts bottom
*/
.search-component .search-controls:first-child > ul {
display: none;
}
.search-component .search-controls ~ .search-controls div.search-controls-count {
display: none;
}
.search-component .search-best-bets .content-block {
padding: 0;
margin-top:1rem;
}
/* display the best bet H1 title in mobile */
/*.search-component .search-best-bets.time-period-container h1 {
display: block;
}*/
.search-component .search-best-bets.time-period-container a.content-block-image-wrapper {
margin-right: 0;
}
.search-component .search-best-bets .content-block-content-wrapper p {
display: inline-block; /* Style text so it renders below the image */
margin-top: 1rem;
margin-left: 0;
margin-right: 0;
}
.search-component .search-best-bets.time-period-container a.content-block-image-wrapper img {
max-height: 400px;
display: block;
margin: auto;
}
.search-component .search-best-bets.time-period-container {
padding-right: 0;
}
.search-component .search-best-bets.time-period-container .row {
/*margin-top:-2rem;*/ /* remove space between image and "Displaying text ...."*/
}
}
/* overrides for mobile */
@media only screen and (max-width: 320px) {
.search-component .searchbox-wrapper {
/*z-index: 1000;*/
width: 100%;
padding-left: 0px;
background-color: #ffffff;
}
.search .mobile-search-results-heading {
padding-left: .6rem;
padding-right: .6rem;
}
.search-facets { background-color: #ffffff;}
.component .searchbox-icon { display: none;}
.search-component h2 {
display: none;
}
.search-component .searchbox-wrapper {
margin-left: 0px;
margin-right: 0px;
}
.search-component .component {
padding-right: 0;
padding-left: .625rem;
}
.search-component form {
border-bottom: none;
}
/*.search-component .searchbox-wrapper {
position: relative;
max-width: none;
margin-left: .625rem;
margin-right: .625rem;
}*/
.search-component .search-results ul li {
margin-right: 0px;
}
.search-component h2 {
display: none;
}
.search-component .search-results-wrapper {
margin-left: 0; /* Align content to dashed line above */
margin-right: 0;
}
/* pagination controls on mobile */
.search-component .search-controls {
text-align: left;
}
.search-component .search-controls .search-controls-count {
margin-top: 0;
}
.search-component .search-controls:last-child > ul {
float: none;
display: block;
margin-left: 0px;
}
.search-component .search-controls ul li:first-child {
border: none;
padding-left: 0px;
margin-right: 0px;
}
.search-component .search-controls:last-of-type .search-controls-count > span {
display: none;
}
.search-component .search-best-bets.time-period-container .row {
margin-top: 0; /* remove space between image and "Displaying text ...."*/
}
.search-component .search-best-bets .content-block-content-wrapper p {
margin-top: 0;
}
}
div.row + div.section-component {
margin-top: -1.875rem;
}
.section-component h2 {
display: inline-block;
}
/* allow section header to expand the full width of container */
.section-component h2.full-width {
display: block;
}
.section-component h5 {
font-family: 'OpenSans-Bold', Arial, Helvetica, sans-serif;
font-size: 1rem;
margin-bottom: .25rem;
}
.section-component .section-item {
padding-bottom: 1rem;
}
.section-component .section-item > ul {
margin-bottom: 0;
}
.section-component .section-item ul.section-component-links {
list-style: none;
}
.section-component .section-item ul.section-component-links li {
list-style-type: none;
margin-left: 0;
line-height: 1.5rem;
}
.section-component .section-item .content-block {
border-top: none;
padding-top: 0;
padding-bottom: 0;
}
.section-component .section-item .content-block .content-block-wrapper {
overflow: hidden;
}
.section-component .section-item > p + .content-block-wrapper {
margin-top: 1rem;
}
.section-component .section-item.section-item-border {
border-top: dotted 1px #333333;
}
.section-component .section-item .content-block + ul {
clear: both;
padding-top: 0.5rem;
}
/* removed per PT #126045143 to make it match rich text bullets */
/*.section-component .section-item ul li {
line-height: 1rem;
}*/
.section-component .section-item ul li span {
font-style: italic;
}
.section-component .section-item ul li p {
margin-bottom: 0;
margin-top: .25rem;
}
.section-component .section-item ul li ul {
padding-top: .375rem;
}
@media only screen and (max-width: 641px) {
/*reset negative top margin at 641 when horizontal gutters disappear*/
div.row:not(.page-heading) + div.section-component {
margin-top: 0;
}
}
.sidebar-component {
padding-top: 1rem;
}
.sidebar-component .sidebar-component-wrapper {
padding-left: 1rem;
padding-right: 1rem;
padding-bottom: .5rem;
}
.sidebar-component-wrapper-border {
border: solid 2px #6a9d11;
}
.sidebar-component .sidebar-component-wrapper > h2 {
font-family: "OpenSans-Regular",arial,sans-serif;
background: white;
color: #6a9d11;
border-bottom: 1px dotted #333333;
margin-top: 0.5rem;
margin-bottom: .5rem;
margin: 0.5rem 0;
padding: 0;
line-height: 1.5rem;
padding-bottom: .375rem;
padding-top: .375rem;
}
.sidebar-component .sidebar-component-wrapper > h2 > a,
.sidebar-component .sidebar-component-wrapper > h2 > a:hover,
.sidebar-component .sidebar-component-wrapper > h2 > a:visited {
color: #6a9d11;
}
.sidebar-component .sidebar-component-wrapper p {
margin-bottom: 0;
}
.sidebar-component .sidebar-component-wrapper > div {
margin-bottom: 1rem;
}
@media only screen and (max-width: 641px) {
.sidebar-component {
padding-top: 0;
}
}
/* removed per Ted's request 01/20/2016
@media print {
.sidebar-component-wrapper-border, .sidebar-component {
display: none;
}
}
*/
/*if the slideshow follows another component in the same column, pop up to the bottom of the above component*/
div.row:not(.promo-box-border) + div.row.slideshow-component {
margin-top: -1.875rem;
}
/* ====================================================================================================================
* RESETS
* ====================================================================================================================*/
.slideshow-component .flex-container a:hover,
.slideshow-component .flex-slider a:hover {
outline: none;
}
.slideshow-component .slides,
.slideshow-component .slides > li,
.slideshow-component .flex-control-nav,
.slideshow-component .flex-direction-nav {
margin: 0;
padding: 0;
list-style: none;
}
.slideshow-component .flex-pauseplay span {
text-transform: capitalize;
}
/* ====================================================================================================================
* BASE STYLES
* ====================================================================================================================*/
.slideshow-component .flexslider {
margin: 0;
padding: 0;
}
.slideshow-component .flexslider .slides > li {
display: none;
-webkit-backface-visibility: hidden;
}
.slideshow-component .flexslider .slides img {
width: 100%;
display: block;
}
.slideshow-component .flexslider .slides:after {
content: "\0020";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.slideshow-component html[xmlns] .flexslider .slides {
display: block;
}
.slideshow-component * html .flexslider .slides {
height: 1%;
}
.slideshow-component .no-js .flexslider .slides > li:first-child {
display: block;
}
/* ====================================================================================================================
* THEME
* ====================================================================================================================*/
.slideshow-component .flexslider {
margin: 0 0 0;
background: #ffffff;
border: 4px solid #ffffff;
position: relative;
zoom: 1;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
-moz-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
-o-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
}
.slideshow-component .flexslider .slides {
zoom: 1;
}
.slideshow-component .flexslider .slides img {
height: auto;
-moz-user-select: none;
}
.slideshow-component .flex-viewport {
max-height: 2000px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.slideshow-component .loading .flex-viewport {
max-height: 300px;
}
.slideshow-component .carousel li {
margin-right: 5px;
}
.slideshow-component .flex-direction-nav {
*height: 0;
}
.slideshow-component .flex-direction-nav a {
text-decoration: none;
display: block;
width: 40px;
height: 40px;
margin: -20px 0 0;
position: absolute;
top: 50%;
z-index: 10;
overflow: hidden;
opacity: 0;
cursor: pointer;
color: rgba(0, 0, 0, 0.8);
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
/*main view*/
.slideshow-component .flex-direction-nav a:before {
font-family: "flexslider-icon";
font-size: 40px;
display: inline-block;
color: rgba(0, 0, 0, 1);
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
/*content: url('/Content/images/icons/slide_left_arrow.svg');*/
content: "";
//background: url('/Content/images/icons/slide_left_arrow.svg') no-repeat;
width: 40px;
height: 40px;
}
/*thumbs view*/
.slideshow-component #slider1-nav .flex-direction-nav a:before {
font-family: "flexslider-icon";
font-size: 40px;
display: inline-block;
color: rgba(0, 0, 0, 1);
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
/*content: url('/Content/images/icons/slide_left_arrow.svg');*/
content: "";
//background: url('/Content/images/icons/slide_left_arrow_green.svg') no-repeat;
width: 40px;
height: 40px;
}
/*main view*/
.slideshow-component .flex-direction-nav a.flex-next:before {
/*content: url('/Content/images/icons/slide_right_arrow.svg');*/
content: "";
//background: url('/Content/images/icons/slide_right_arrow.svg') no-repeat;
width: 40px;
height: 40px;
}
/*thumbs view*/
.slideshow-component #slider1-nav .flex-direction-nav a.flex-next:before {
/*content: url('/Content/images/icons/slide_right_arrow.svg');*/
content: "";
//background: url('/Content/images/icons/slide_right_arrow_green.svg') no-repeat;
width: 40px;
height: 40px;
}
.slideshow-component .flex-direction-nav .flex-nav-prev {
list-style: none;
}
.slideshow-component .flex-direction-nav .flex-nav-next {
list-style: none;
}
.slideshow-component .flex-direction-nav .flex-prev {
left: -50px;
}
.slideshow-component .flex-direction-nav .flex-next {
right: -50px;
text-align: right;
}
/* thumbnail navigation arrows should always be visible, no sliding */
.slideshow-component #slider1-nav .flex-direction-nav .flex-prev {
left: 10px;
opacity: 1;
}
.slideshow-component #slider1-nav .flex-direction-nav .flex-next {
right: -2px;
text-align: right;
opacity: 1;
}
.slideshow-component #slider1.flexslider:hover #slider1-nav .flex-direction-nav .flex-prev {
opacity: 0.7;
/*opacity: 1;*/
left: 10px;
}
.slideshow-component #slider1.flexslider:hover #slider1-nav .flex-direction-nav .flex-next {
opacity: 0.7;
/*opacity: 1;*/
left: 10px;
}
.slideshow-component .flexslider:hover .flex-direction-nav .flex-prev {
opacity: 0.7;
/*opacity: 1;*/
left: 10px;
}
.slideshow-component .flexslider:hover .flex-direction-nav .flex-prev:hover {
opacity: 1;
}
.slideshow-component .flexslider:hover .flex-direction-nav .flex-next {
opacity: 0.7;
/*opacity: 1;*/
right: -2px;
}
.slideshow-component .flexslider:hover .flex-direction-nav .flex-next:hover {
opacity: 1;
}
/* opacity toggle for thumbnail arrows */
.slideshow-component #slider1-nav:hover .flex-direction-nav .flex-prev {
opacity: 0.7;
}
.slideshow-component #slider1-nav:hover .flex-direction-nav .flex-next {
opacity: 0.7;
}
.slideshow-component #slider1-nav .flex-direction-nav .flex-prev:hover {
opacity: 1;
}
.slideshow-component #slider1-nav .flex-direction-nav .flex-next:hover {
opacity: 1;
}
.slideshow-component .flex-direction-nav .flex-disabled {
opacity: 0!important;
filter: alpha(opacity=0);
cursor: default;
z-index: -1;
}
.slideshow-component .flex-pauseplay a {
display: block;
width: 20px;
height: 20px;
position: absolute;
bottom: 5px;
left: 10px;
opacity: 0.8;
z-index: 10;
overflow: hidden;
cursor: pointer;
color: #333333;
}
.slideshow-component .flex-pauseplay a:before {
font-family: "flexslider-icon";
font-size: 20px;
display: inline-block;
content: '\f004';
}
.slideshow-component .flex-pauseplay a:hover {
opacity: 1;
}
.slideshow-component .flex-pauseplay a.flex-play:before {
content: '\f003';
}
.slideshow-component .flex-control-nav {
width: 100%;
position: absolute;
bottom: -40px;
text-align: center;
}
.slideshow-component .flex-control-nav li {
margin: 0 6px;
display: inline-block;
zoom: 1;
*display: inline;
}
.slideshow-component .flex-control-paging li a {
width: 11px;
height: 11px;
display: block;
background: #666;
background: rgba(0, 0, 0, 0.5);
cursor: pointer;
text-indent: -9999px;
-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
-o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.slideshow-component .flex-control-paging li a:hover {
background: #333333;
background: rgba(0, 0, 0, 0.7);
}
.slideshow-component .flex-control-paging li a.flex-active {
background: #333333;
background: rgba(0, 0, 0, 0.9);
cursor: default;
}
.slideshow-component .flex-control-thumbs {
margin: 5px 0 0;
position: static;
overflow: hidden;
}
.slideshow-component .flex-control-thumbs li {
width: 25%;
float: left;
margin: 0;
}
.slideshow-component .flex-control-thumbs img {
width: 100%;
height: auto;
display: block;
opacity: .7;
cursor: pointer;
-moz-user-select: none;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.slideshow-component .flex-control-thumbs img:hover {
opacity: 1;
}
.slideshow-component .flex-control-thumbs .flex-active {
opacity: 1;
cursor: default;
}
/* ====================================================================================================================
* CUSTOM
* ====================================================================================================================*/
.slideshow-component .flexslider {
padding-top: 1rem;
}
.slideshow-component html[xmlns] .flexslider .slides {
align-items: center;
background: gray;
display: flex;
}
.slideshow-component html[xmlns] .flexslider.nav .slides {
align-items: center;
background: none;
display: flex;
}
.slideshow-component html[xmlns] .flexslider.nav .slides li {
background: #333333;
}
.slideshow-component html[xmlns] .flexslider.nav .slides img {
border: 3px #6a9d11 solid;
opacity: 0.35;
transition: 0.3s ease-out 0s;
}
.slideshow-component html[xmlns] .flexslider.nav .slides li.flex-active-slide img {
opacity: 1;
}
.slideshow-component .flexslider .slides>li {
position: relative;
}
.slideshow-component .flexslider .slides .flex-caption {
background: rgba(0, 0, 0, 0.6);
bottom: 0.5rem;
color: white;
font-family: "OpenSans-Regular", Arial, Helvetica, sans-serif;
font-size: 0.875rem;
font-style: italic;
left: 0;
line-height: 1.3;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
max-width: 39rem;
opacity: 0;
padding: 0.25rem 2rem 1rem;
position: absolute;
right: 0;
text-align: center;
/* image caption should not span width of image */
width: 80%;
}
.slideshow-component .flexslider .slides .flex-active-slide .flex-caption {
opacity: 1;
}
.slideshow-component .flexslider .slides .flex-caption span {
display: block;
font-family: "OpenSans-Bold", Arial, Helvetica, sans-serif;
font-size: 1rem;
font-style: normal;
margin-bottom: 0.25em;
}
/* ====================================================================================================================
* RESPONSIVE
* ====================================================================================================================*/
/* navigation arrows remain visible regardless of hover state at 860 or less */
@media screen and (max-width: 860px) {
.slideshow-component .flex-direction-nav .flex-prev {
opacity: 1;
left: 10px;
}
.slideshow-component .flex-direction-nav .flex-next {
opacity: 1;
right: -2px;
}
/* this addresses the outline that appears on ipads around an element's border */
.slideshow-component .flexslider#slider1-nav ul.slides li {
background-clip: padding-box;
}
}
@media only screen and (max-width: 641px) {
div.row:not(.promo-box-border) + div.row.slideshow-component {
margin-top: 0;
}
}
@media only screen and (max-width: 320px) {
/* for mobile view, never display thumbnails*/
.slideshow-component .flexslider.nav {
display: none;
}
/* move caption text to sit below rather than over slides */
.slideshow-component .flexslider .slides .flex-caption {
position: relative;
width: 100%;
bottom: 0;
}
.slideshow-component .flexslider .slides li.flex-active-slide {
background-color: #000000;
}
.slideshow-component .flexslider#slider1 {
margin-left: -1.1rem;
margin-right: -3.65rem;
padding-right: 2.5rem;
}
/*reposition next arrow*/
.slideshow-component .flex-direction-nav .flex-next {
right: 34px;
text-align: right;
}
.slideshow-component .component:not(.interior-component) {
overflow: hidden;
}
.slideshow-component .flexslider:hover .flex-direction-nav .flex-next {
right: 34px;
}
.slideshow-component .flexslider .slides .flex-caption {
background: black;
opacity: 1;
}
}
.slideshow-component .flexslider {
border-width: 2px;
}
.slideshow-component .flexslider.nav {
border-width: 2px;
border-bottom-width: 3px;
border-bottom-style: solid;
border-bottom-color: #6a9d11;
padding-left: 10%;
padding-right: 10%;
}
.slideshow-component .flexslider.nav img {
max-height: 5.625rem;
max-width: 8.375rem;
}
.slideshow-component .flexslider.nav ul:not(.flex-direction-nav) li {
background-color: #333333;
}
.slideshow-component .flexslider.nav ul li.flex-active-slide {
border: 3px #6a9d11 solid;
opacity: 1;
}
.slideshow-component .flexslider.nav ul li:not(.flex-active-slide) {
border: 3px white solid;
}
.slideshow-component .flexslider.nav ul li:not(.flex-active-slide) > img {
opacity: 0.3;
}
.slideshow-component .flexslider.nav ul li:not(.flex-active-slide):hover > img {
opacity: 0.8;
}
.slideshow-component {
margin-bottom: 1rem;
}
.slideshow-component ul li {
margin-left: 0;
}
.slideshow-component ul li .slideshow-slide-wrapper {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.slideshow-component ul li .slideshow-slide-wrapper > img {
display: block;
}
.slideshow-component .flex-control-thumbs > li {
padding: .25rem;
}
/* header styling*/
.slideshow-component .component h2 {
display: inline-block;
}
/* don't display in print mode */
@media only print {
.slideshow-component {
display: none;
}
}
/* page editor mode - show slides one by one rather than rendering as preview mode */
.slideshow-component ul.page_editor {
list-style: none;
}
.slideshow-component ul.page_editor li {
list-style: none outside none;
}
.slideshow-component .thumbnail_message {
border: 2px dotted black;
padding: .5rem;
background-color: #d3d3d3;
}
div.row.split-column-component {
margin-top: -1.875rem;
}
.split-column-component .component {
background-color: white;
}
.split-column-component .component .row .component,
.split-column-component .component .row.richtext-component div {
margin-left: 0;
margin-right: 0;
}
.split-column-component .component .columns .row:last-child .component,
.split-column-component .component .columns .row.richtext-component:last-child,
.split-column-component .component .columns .row.richtext-component:last-child > div {
margin-bottom: 0;
}
@media only screen and (max-width: 641px) {
.split-column-component .component .row .component,
.split-column-component .component .row.richtext-component div {
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
}
}
@media only screen and (max-width: 320px) {
div.row.split-column-component {
margin-top: 0;
}
div.row.split-column-component > .component {
padding-top: 1rem;
}
.split-column-component .component .row .component.interior-component h2 {
margin-right: -1rem;
margin-left: -1rem;
}
}
.spotlight-component {
background-color: transparent;
text-align: center;
}
.row.spotlight-component {
margin-left: -0.375rem;
margin-right: -0.375rem;
margin-bottom: 1.125rem;
}
.spotlight-component>.columns>a {
display: block;
height: 100%;
width: 100%;
}
.spotlight-person {
border: 1px solid #999999;
text-align: center;
background-color: #FFFFFF;
padding-top: 2.25rem;
padding-bottom: 1.8rem;
}
.spotlight-image {
z-index: -1;
border-top: 1px solid #999999;
border-bottom: 1px solid #999999;
border-left: 1px solid #999999;
cursor: pointer;
position: absolute;
top: 0;
height: 100%;
width:100%;
}
.spotlight-image.horizontal {
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
/*
If the photo is larger than 848x575, then it should fit the entire image size
If vertical, and taller than 575, scale to fit with 10 px of black showing above the photo and below
If smaller, square, center in the 848x575 space
If chart, do not display in the 848x575 but display in the 300x234 image size. The chart can only be displayed on the right side of the content.
Image can be selected and enlarged for better viewing, everything behind it blacked out.
*/
/* surround vertical and square images with a background and center it */
.spotlight-image.vertical, .spotlight-image.square {
background-color: #333333;
text-align: center;
}
/* hide image if spanning full width of container -- background image is used here */
.spotlight-image.horizontal img {
display: none;
}
/* reduce image size if it is a vertical image */
.spotlight-image.vertical img, .spotlight.spotlight-image.square img {
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
max-height: 95%;
max-width: 95%;
}
.overlay {
background: rgba(0,0,0,0.65);
background: transparent; /* For browsers that do not support gradients */
background: -webkit-linear-gradient(black, transparent); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(black transparent); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(black, transparent); /* For Firefox 3.6 to 15 */
background: linear-gradient(black, transparent); /* Standard syntax (must be last) */
bottom:0;
left: 0;
opacity: 0.8;
position: absolute;
right:0;
top:0;
z-index: 1;
margin-left: 1.325rem;
margin-right: .925rem;
height: 20%; /* opacity should just cover the title and a bit below it at each break point */
}
/* this image only exists for screen readers when the main image is a background image */
.overlay img {
height: 0px;
width: 0px;
z-index: 0;
position: relative;
}
.spotlight-component>.columns {
padding: 0;
}
.spotlight-component h1 {
position: absolute;
top: 0;
left: 0;
width: 100%;
color: #FFFFFF;
z-index: 2;
line-height: 1.2;
margin: 0;
padding: 3.125rem 3.75rem;
background: -moz-linear-gradient(top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}
.spotlight-component .button {
font-family: 'OpenSans-SemiBold',Arial, Helvetica, sans-serif;
background-color: #3f73b9;
color: #fff;
font-size: 1rem;
line-height: 1;
margin-top: .875rem;
padding: .875rem 1.375rem;
font-weight: bold;
display: inline-block;
margin-top: .875rem;
margin-bottom: 0rem;
}
.row.spotlight-info {
border: 1px solid #FFFFFF;
background-color: rgba(13, 31, 49, 0.8);
padding-top: 1rem;
padding-bottom: 1rem;
padding-left: 1.75rem;
padding-right: 1.75rem;
width: 25rem;
height: auto;
z-index: 5;
position: absolute;
bottom: 8%;
left: 5%;
margin: 0;
}
/*.spotlight-info .button:hover, .button:focus, .button:hover, .button:focus {
color: #fff;
background-color: #007095;
}*/
.spotlight-info-note {
border-bottom: 1px dotted #FFFFFF;
margin-bottom: 1.25rem;
}
.spotlight-info h4 {
font-family: 'OpenSans-Bold',Arial, Helvetica, sans-serif;
font-size: 1.125rem;
color: #FFFFFF;
top: 0;
left: 5%;
right: 5%;
position: relative;
left: 0;
right: 0;
/*padding-left: 1.3rem;
padding-right: 1.3rem;*/
margin-bottom: .25rem;
margin-bottom: 0px;
line-height: 1.4;
}
/* override standard behavior for an anchor in the spotlight */
.spotlight-info a:not(.button), .spotlight-info a:not(.button):hover, .spotlight-info a:not(.button):visited, .spotlight-info a:not(.button):visited:hover {
color: #ffffff;
text-decoration: underline;
}
.spotlight-info p {
font-family: 'OpenSans-Regular',Arial, Helvetica, sans-serif;
font-size: 1.125rem;
color: #FFFFFF;
line-height: 1.2;
/*padding-left: 3.625rem;
padding-right: 3.625rem;*/
margin-bottom: 0;
padding-bottom: 1.25rem;
}
.spotlight-info-nav .button {
border: 1px solid #ffffff;
margin-left: .625rem;
}
.spotlight-person {
min-height: 450px;
}
.spotlight-person img {
padding-bottom: 1rem;
padding-top: .75rem;
/* joan says all images will entered as height=300 and width=220*/
/*height: 18.75rem;*/
width: 13.75rem;
}
.spotlight-person h1, .spotlight-person h2, .spotlight-person, .spotlight-person h3, .spotlight-person h4 {
padding-left: 1rem;
padding-right: 1rem;
margin-top: 0rem;
line-height: 1.3;
margin-bottom: 0rem;
letter-spacing: -.5px;
}
.spotlight-person p {
/*padding-bottom: 1rem;*/
line-height: 1.3;
padding-left: 3rem;
padding-right: 3rem;
margin-bottom: 1rem;
}
.spotlight-person-bio {
border-top: 1px dotted #333333;
padding-top: 1rem;
padding-right: 1.625rem;
padding-left: 1.625rem;
}
/* column shift spotlight image adjustment */
@media only screen and (max-width: 1030px) {
.overlay {
margin-right: .925rem;
margin-left: .625rem;
opacity: 0.5;
height: 22%; /* opacity should just cover the title and a bit below it at each break point */
}
}
/* overlay adjustment */
@media only screen and (max-width: 715px) {
.overlay {
height: 28%; /* opacity should just cover the title and a bit below it at each break point */
}
}
/* tablet */
@media only screen and (max-width: 641px) {
.spotlight-component h1 {
position: absolute;
top: 0;
color: #FFFFFF;
z-index: 2;
width: 100%;
line-height: 1.2;
left: 0;
right: 5%;
margin-left: auto;
margin-right: auto;
text-align: center;
font-size: 1.375rem;
padding-left: .875rem;
padding-right: .875rem;
}
.spotlight-person {
min-height: 0;
}
.overlay {
margin-left: 0;
margin-right: 0;
opacity: 0.5;
height: 10%; /* opacity should just cover the title and a bit below it at each break point */
}
.spotlight-image {
margin-right: 0px;
position: static;
border: none;
}
.spotlight-image.horizontal {
background-image: none !important;
}
.spotlight-image.horizontal img {
display: block;
width: 100%;
height: 100%;
}
.spotlight-image.vertical img, .spotlight-image.square img {
position: static;
transform: none;
max-width: 100%;
max-height: 400px;
}
.row.spotlight-info {
position: relative;
width: 100%;
left: 0;
bottom: 0;
background-color: #0d1f31;
padding-bottom: 2rem;
height: auto;
padding-bottom: 1.875rem;
border: 0px;
}
.spotlight-info .button {
display: block;
width: 30%;
margin-left: auto;
margin-right: auto;
}
.spotlight-info-note {
border-bottom: none;
margin-bottom: 0;
}
.spotlight-person-bio {
border-top: none;
}
.spotlight-person {
border: none;
margin-left: 0px;
margin-right: 0px;
}
/* commented out per Ceclia 01/10/2017 */
/*.spotlight-person p {
display: none;
}*/
.spotlight-component .button {
min-width: 10rem;
}
.spotlight-component h1 {
padding: 1.75rem 1.75rem; /* decrease whitespace between H1 title and top of frame */
}
}
/* mobile */
@media only screen and (max-width: 320px) {
.overlay {
height: 15%; /* opacity should just cover the title and a bit below it at each break point */
}
}
/* print */
@media only print {
.spotlight-component * {
display: block !important;
color: black !important;
background: none !important;
border: none !important;
position: static !important;
text-align: left !important;
transform: none !important;
padding: 0 !important;
margin-bottom: 1em !important;
}
.spotlight-component .button {
display: none !important;
}
/*.overlay {
display: none;
}
.spotlight-image {
background-image: none !important;
position: static !important;
border: none !important;
}
.spotlight-image img {
display: block !important;
margin-left: auto;
margin-right: auto;
position: static !important;
width: auto;
height: auto;
overflow: hidden;
transform: none !important;
}
.spotlight-image h1 {
display: block;
position: static;
padding: 0 0 1rem 0;
color: black !important;
background: none !important;
}
.spotlight-person {
margin-left: 0px;
border: none;
}
/*.spotlight-image {
margin-left: 0;
background-color: #FFFFFF;
border: none;
margin-right:-.325rem;
}*/
/*.row.spotlight-component {
margin-left: 0px;
margin-right: 0px;
display: block;
margin-bottom: 4rem;
}*/
.spotlight-component h1 {
top: 8rem;
padding-left: 2rem;
padding-right: 2rem;
color: white; /* why isn't this displaying in white? */
}
.row .spotlight-info {
overflow: hidden;
position: relative;
width: 100%;
left: 0;
bottom: 0;
}
.spotlight-person {
page-break-inside: avoid;
}
}
.article + .standard-image-component {
margin-top: -1.875rem;
}
.standard-image-component .standard-image-container {
margin-bottom: 0.75rem;
}
.standard-image-component .standard-image-container .standard-image-byline {
float: right;
font-family: 'OpenSans-Regular',arial,sans-serif;
font-size: .75rem;
text-transform: uppercase;
}
.standard-image-component .standard-image-container .standard-image-caption {
text-transform: none;
font-style: italic;
font-size: .875rem;
float: left;
width: 100%;
line-height: 1.4285rem;
}
.standard-image-component .standard-image-container .standard-image-wrapper {
position: relative;
}
.standard-image-component .standard-image-container .standard-image-wrapper .overlay-icons {
padding: 0.5rem 1rem 0.125rem 1rem;
}
.standard-image-component .standard-image-container .standard-image-wrapper .overlay-icons > svg {
height: 2rem;
padding-right: 0.375rem;
}
@media only screen and (max-width: 641px) {
/*reset negative top margin at 641 when horizontal gutters disappear*/
.article + .standard-image-component {
margin-top: 0;
}
}
/* twitter only allows minimal control of the feed data
the following overrides twitter's iframe settings
*/
.twitterfeed-component iframe[style] {
height: 30em !important; /* set iframe to fixed height */
}
/* Site banner
*/
#site-banner * {
padding: 0;
margin: 0;
}
#site-banner > .row {
padding: 10px;
}
#site-banner #close-banner {
cursor: pointer;
padding: 10px;
}