﻿

body {font: 18px 'asap', Arial, sans-serif;}

.bodyCopy {font-size: .8em; line-height: 1.6em;}

.railContent table td hr.divColor {display: none;}

.footerWrap {background: #282828; height: 207px; border-top: solid 25px #000;}
.footerPatt {background-image: none;}
.footer {padding: 45px 2% 30px;}
.footer ul.navUtility {width: 100%; max-width: 1200px; color: #fff; bottom: 2em; text-align: center;}
.footer ul.navUtility li {float: none; display: inline-block;}
.footer ul.navUtility li.copyright {padding: 0 1em;}

.footerChamberWrap {width: 100%; padding: 1em 0; float: left; clear: both; text-align: center; border-top: solid 1px #f4f4f4;}
table.footerChamber {width: 100%; max-width: 1200px; margin: 0 auto;}

    table.footerChamber td {padding: 0 1em;}
    table.footerChamber td a {width: 100%; height: 100%;}
        table.footerChamber td a img {width: 100%; height: auto; }

a.button, ul.buttonColor li a, ul.tabsNav li a, a.viewAll, a.viewAll:link {background: white; padding: .15em.50em; font-size: .85em; color: #990831; border: solid 2px #990831; text-transform: uppercase;}
a.button:hover, a.button:active, a.button:focus,
a.viewAll:hover, a.viewAll:active, a.viewAll:focus {background: #990831; color: #fff;}

a.viewAll:after {content: '';}

.sortingTools, .calendarDiv {background: #f2f2f2;}

h1, h2 {font-family: 'Noto Serif', Georgia, 'Times New Roman', serif; font-weight: normal;}
h1, h2, h3, h4, h5, h6 {color: initial;}

ul.formList li label, ul.pagination li strong {color: #990831;}
table.tabsNav {background: #990831; border-color: #990831;}
table.tabsNav td a:hover, ul.tabsNav td a:active, table.tabsNav td a:focus, table.tabsNav td a.active {background: #fff; border-color: #990831; color: #990831;}
table.tabsNav td a {background: #990831; border-color: #990831; padding: 1em 1em;}

/*HEADER*/
.headerContent {max-width:initial;}
.headerWrap a.logoLink {width: 100%; padding-bottom: .5em; border-bottom: solid 2px #990831; text-align: center;}
.headerWrap a.logoLink img {display: inline; float: none;}

/*HERO*/
.heroNewWrap {background-color: #990831; width: 100%; height: 450px; margin-bottom: 3em; float: left; clear: both; text-align: center; position: relative;}

.heroNewWrap a.button {background: transparent; border-color: #fff; color: #fff;}
.heroNewWrap a.button:hover, .heroNew a.button:active, .heroNew a.button:focus {background: #fff; color: #990831;}

.heroNewTitle, .heroNewTitle h1, .heroNewTitle h2 {color: #fff;}

.heroNewTitle {width: 25%; height: 425px; padding: 2em 2em 1em 1em; line-height: 1.5em; text-align: left; float: left; overflow: hidden;}
.heroNewTitle span {display: inline-block; margin-bottom: 1em; text-transform: uppercase; }
.heroNewTitle p {font-size: .8em; line-height: 1.3em;}
.heroNewTitle h1, .heroNewTitle h2 {font-size: 1.85em;}

/*900x450px*/
.newHeroImg {width: 75%; height: 100%; float: right; overflow: hidden; object-fit: cover; object-position: 50% 0;}
/*1200x450px*/
.newHeroFullImg {width: 100%;} 

.newHeroImg img {width: 100%; height: auto;}

/*TOP FEATURE*/

.featureOne {width: 100%; margin-bottom: 3em; padding-bottom: 3em; border-bottom: solid 1px #990831; float: left; clear: both;}
.featureOne .featureOneImage {width: 60%; margin-right: 5%; float: left;}
.featureOne .featureOneImage img {width: 100%; height: auto;}

.featureOne .featureOneSummary {width: 35%; padding: 1em 0 0; float: left;}
.featureOne .featureOneSummary h2 {font-size: 2em; margin-bottom: .25em; line-height: 1.1em;}
.featureOne .featureOneSummary cite {margin-bottom: 1em; display: block;}

.featuresMore {width: 100%; margin-bottom: 3em; padding-bottom: 3em; border-bottom: solid 1px #990831; float: left; clear: both; }

.features {display: flex; flex-wrap: wrap;}
.feature-card {padding: 2% 5% 2% 0; flex-basis: 33.3%; flex-direction: column; display: flex; overflow: hidden;}
.feature-image {width: 100%; height: 310px; margin-bottom: 1em; overflow: hidden; text-align: center;}
.feature-image img {object-fit: cover; object-position: 0 0;}
.feature-info {width: 100%; margin-bottom: 1em; font-size: .666em; line-height: 1.75em;}
.feature-info h2 {margin-bottom: .05em; font-size: 2.5em; line-height: 1.2em;}
.feature-info cite {display: block; margin-bottom: 1em;}
.feature-info h3 {font-size: 1.5em; font-weight: normal;}
.feature-card .flexButton {margin-top: auto;}
.feature-card .flexButton a.button {width: auto; display: inline-block;}

.feature-card:nth-child(2) {border-right: solid 1px #990831;}

.feature-card.featureLatest {text-align: center; padding-right: 0;}
.feature-card.featureLatest a.issueImage {width: 70%; margin: 0 15% 1em; display: block;}
.feature-card.featureLatest a.issueImage img {width: 100%; height: auto;}
.feature-card.featureLatest a.button {margin: 0 0 2em; padding: .15em .75em; font-size: .85em;}

.feature-card.featureLatest a.rightAd {width: 70%; margin: 0 15% 1em; float: left; clear: both;}
.feature-card.featureLatest a.rightAd img {width: 100%; height: auto;}
.feature-card.featureLatest a.rightAd:last-child {margin-bottom: 0;}

/*VIProfiles Home Page Row*/

.featuresProfile {margin-bottom: 4.5em; padding-bottom: 0; border: 0;}
.viProfile {display: flex; flex-wrap: wrap;}

.profileCard {padding: 2%; flex-basis: 25%; flex-direction: column; display: flex;}
.profileCard:first-child {padding-left: 0;}
.profileCard:last-child {padding-right: 0;}

.profileCard-info {width: 100%; margin-bottom: 1em; line-height: 1.40em;}
.profileCard-info span.title {font-size: 1.25em; font-weight: bold; color: #990831; display: block; margin-bottom: .75em;}
.profileCard-info h2 {margin-bottom: .5em; font-size: 1.5em;}
.profileCard-info p {font-weight: normal;}
.profileCard .flexButton {margin-top: auto;}

/*Calendar Home*/

.newGrayWrap {background: #f4f4f4; width: 100%; padding: 2em 0 3em; text-align: center; float: left; clear: both;}
.newGray {max-width: 1200px; margin: 0 auto; text-align: left;}
.newGray h2 {font-size: 2em; margin-bottom: 1em;}

.newGray .profileCard {padding-top: 1em;}
.newGray .profileCardCalendar {padding-top: 0;}

.newGray .profileCard-info h3 {margin-bottom: 0; font-size: 1.25em; font-weight: bold;}
.newGray .profileCard-info span.date {display: block; margin-bottom: 2em; font-style: italic;}

.newGray .profileCard .railContent {width: 90%; margin: 0;}
.newGray .profileCard .railContent .calendarList {display: none;}
.newGray .profileCard .railContent .calendarWrapper {width: 100%; float: left; font-size: .65em;}
.newGray .profileCard .railContent .calendarWrap table td {padding: .25em .10em;}
.newGray .profileCard .railContent .calendarWrap table td.boxGray {background: #fff;}
.newGray .profileCard .railContent .calendarWrap table td.boxPaleColor {background: #ccc;}
.newGray .profileCard .railContent .calendarWrap table td.boxStrongColor {background: #666;}

.otherVIP {width: 100%; margin: 3em 0 0; float: left; clear: both;}
.otherVIP hr.divColor {display: none;}

.otherVIP ul.videoThumbs li {margin: 0 1.25% 1em;}
.otherVIP ul.videoThumbs li:first-child {margin-left: 0;}
.otherVIP ul.videoThumbs li:last-child {margin-right: 0;}


/* 1220 - Devices 1240px to 767px */

@media only screen and (max-width: 1240px) {

.content {padding-top: 120px;}

.heroNewWrap {height:380px;}
.heroNewTitle {width: 30%; padding: 1em; font-size: .85em;}
.heroNewTitle h1, .heroNewTitle h2 {font-size: 1.25em;}
.newHeroImg {width: 70%;}
.newHeroFullImg {width: 100%;}
.prev, .next {font-size: .75em; bottom: 1em;}

.featureOne .featureOneSummary {font-size: .8em;}
.featureOne .featureOneSummary h2 {font-size: 1.25em;}

.feature-image {height: 250px;}

}

/* 1000 - Devices 1000px and less */

@media only screen and (max-width: 1000px) {

.content {padding-top: 138px;}

.heroNewWrap {height:320px;}

}

/* 900 - Devices 900px and less */

@media only screen and (max-width: 900px) {

.content {padding-top: 138px;}

.heroNewWrap {height: 510px;}

.heroNewTitle {background: #990831; width: 100%; height: auto; margin: 0; padding: 1em 2% 0; padding-bottom: 1em; font-size: .75em; clear: both; position: absolute; left: 0; bottom: 0;}
.heroNewTitle span {display: none;}
.heroNewTitle h1, .heroNewTitle h2 {font-size: 1.25em;}

.newHeroImg  {width: 100%; margin: 0;}
.newHeroImg img {width: 100%;}

.feature-image {height: 200px;}

}

/* 768 - Devices 768px and less */

@media only screen and (max-width:768px) and (min-width: 767px) {

.content {padding-top: 110px;}

.heroNewWrap {height: 510px;}



.prev, .next {padding: .5em .25em; top: 40%; bottom: initial;}
.prev {left: 1%;}

.featureOne .featureOneImage {width: 35%;}
.featureOne .featureOneSummary {width: 60%;}

.feature-card.featureLatest {display: block; flex-basis:initial;}
.feature-card.featureLatest {width: 100%; float: left;}

.feature-card.featureLatest .feature-info {width: 45%; margin: 0 5% 1em 0; float: left; clear: none;} 
.feature-card.featureLatest a.rightAd {width: 45%; margin: 0 0 1em; float: left; clear: none;}

.feature-card.featureLatest a.issueImage {width: 100%; margin: 0 0 1em;}

.featuresMore {margin-bottom: 1em; padding-bottom: 1em;}

}

/* 768 - Devices 768px and less */

@media only screen and (max-width:768px) {

.feature-card, .profileCard {flex-basis: 50%; margin-bottom: 2em;}

.newGrayWrap {padding: 2em 2% 3em; }

#wrapper > header .mpMenu .menu .menu-link:last-child {display: none;}
}

/* 767 - Devices 767px and less */

@media only screen and (max-width:767px) {

.content {padding-top: 50px;}

.headerWrap a.logoLink {width: 50%; float: right; padding-bottom: .25em; text-align: right; border: 0;}

.heroNewWrap {height: 420px;}
.newHeroImg  {width: 100%; height: auto; margin: 0; padding-bottom: 100px;}
.newHeroImg img {width: 100%;}
.heroNewTitle {background: #990831; width: 100%; height: auto; margin: 0; padding: 1em 2% 0; padding-bottom: 1em; font-size: .75em; clear: both; position: absolute; left: 0; bottom: 0;}
.heroNewTitle span {display: none;}
.prev, .next {padding: .5em .25em;}


.featureOne .featureOneImage {width: 35%;}
.featureOne .featureOneSummary {width: 60%;}


.feature-card.featureLatest {width: 100%; display: block; flex-basis: 100%;}
.feature-card.featureLatest .feature-info {width: 50%; margin: 0 0 1em; float: left;}
.feature-card.featureLatest a.rightAd {width: 40%; margin: 0 2.5% 1em; float: right; clear: none;}

.feature-card:nth-child(2) {border: 0;}

}


/* 460 - Devices 460px and less */

@media only screen and (max-width:460px) {

.content {padding-top: 0;}
.newGray {width: 96%; margin: 0 2%;}

.heroNewWrap {height: 325px; margin-bottom: 1em;}
.newHeroImg {height: 200px;}
.prev, .next {top: 20%; bottom: initial;}

.featureOne, .featuresMore {margin-bottom: 1em; padding-bottom: 2em;}
.featureOne .featureOneImage, .featureOne .featureOneSummary {width: 100%;}
.featureOne .featureOneSummary {padding-top: 0;}
.feature-card.featureLatest {margin-bottom: 0;}

.feature-card, .profileCard {flex-basis: 100%; margin-bottom: 2em;}
.newGray .profileCard .railContent {margin: 0 5%;}
.newGray .profileCard .railContent .calendarWrap {padding-right: 1em;}

.feature-card.featureLatest {width: 100%; display: flex; flex-basis: 100%;}
.feature-card.featureLatest .feature-info {width: 100%; margin: 0 0 1em; float: left;}
.feature-card.featureLatest a.rightAd {width: 100%; margin: 0 2.5% 1em; float: right; clear: none;}

}