/* ARTICLE PAGE: margin-left:9% content:79% margin-right:12%*/
/* GALLERY PAGE: margin-left:9% content:83.5% margin-right:7.5%*/
.downloadsDiv {
  /*margin: 36px auto;*/
}

#mainContentDiv.takeActionPage input:not(#takeActionSubmitButton) {
  border: none;
  height: 56px;
  margin-right: 16px;
  border-bottom: solid 1px #aaa;
  margin-bottom: 16px;
}

#takeActionSubmitButton {
  border: none;
  height: 56px;
  width: 200px;
  float: left;
  display: block;
  margin-top: 16px;
}

.takeActionError {
  display: inline-block;
}

#mainContentDiv.downloadsPage, #mainContentDiv.takeActionPage {
  padding: 9%;
}

#captchaDiv {
  width: 100%;
  float: left;
}

.nopadding {
  padding: 0;
}

.authCode {
  float: left;
}

.downloadsFeatured {
  margin-bottom: 36px;

  padding-left: 7px;
  padding-right: 0;
  display: inline-block;
  width: 100%;
}

.downloadsFeatured .downFeatureText {
  width: 48%;
  vertical-align: top;
  display: inline-block;
  padding: 0 8px 25px;
  /*float: left;*/
}

.downloadsFeatured .downFeatureText .captionStyle {
  margin-bottom: 10px;
}
.downloadsFeatured .downFeatureText .headline2Style {
  margin-bottom: 10px;
}
.downloadsFeatured .downFeatureText .bodyStyle {
  margin-bottom: 15px;
}

.downloadsFeatured .downFeatureImage {
  width: 50%;
  vertical-align: top;
  display: inline-block;
  text-align: right;
  float: right;
  padding: 0 16px 25px;
}

.downloadsFeatured .downFeatureImage img {
  /*max-height: 230px;*/
  width: 100%;
  margin-bottom: 36px;
}

.downloadResultDiv {
  width: 33%;
  padding: 0 8px 25px;
  float: left;
}

.downloadsResult {
  padding-left: 7px;
  padding-right: 0;
  display: inline-block;
  width: 100%;
}

.downloadsResult > .captionStyle {
  padding-left: 8px;
}

.downloadResultDiv img {
  width: 100%;
}

.downloadResultDiv .headline2Style {
    margin-bottom: 10px;
    min-height: 65px;
  }

.downloadResultDiv img {
  margin-bottom: 10px;
}

.downloadResultDiv .bodyStyle {
    margin-bottom: 15px;
}

.downloadsResult > .captionStyle {
    margin-bottom: 10px;
}
.article-next-prev-link > a, .article-next-prev-link > a:hover, .article-next-prev-link > a:visited {
  color: #000;
}

.gallery-content-start, .article-content-start {
  margin-left: 9%;
}

.gallery-content-max {
  max-width: 91%; /* content + margin-right */
}

.article-content-max {
  max-width: 79%;
}

.bg{
  /*background-position:center center;*/ /* uncomment this to have pictures aligned hor and ver */
  background-repeat:no-repeat;
  background-size:cover; /* you change this to "contain" if you don't want the images to be cropped */
}

.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

#article-concise-title.line-clamp {
  -webkit-line-clamp: 2;
}

.gallery-header {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.gallery-header-text-container {
  position: relative;
  /* OR padding-top: 30%;
  bottom: 56px; */
  padding-top: 25%; /* max-width 83.5 / aspect ratio 2.78 = 30.03 - margin-bottom 5 = 25% */
  margin-bottom: 56px;
  text-align: left;
  color: white;
  max-width: 83.5%;
  display: block;
  /*border: 1px solid pink;*/
}

.gallery-title {
  font-family: verdana;
  padding-bottom: 10px;
  font-family: 'NewCenturySchoolW02-Rg';
  font-size: 52px;
  line-height: 56px;
  /*border: 1px dotted yellow;*/
}

.gallery-subtitle {
  max-width: 73%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 24px;
  line-height: 32px;
  /*border: 1px dotted yellow;*/
}

.gallery-body {
  overflow: hidden;
  margin-bottom: 36px;
  /*border: 1px solid brown;*/
}

.gallery-article-concise {
  float: left;
  overflow: hidden;
  width:49%;
  padding: 0% 5.5% 0 0 ;
  /*border: 1px solid green;*/
}
.gallery-article-concise:hover {
  cursor: pointer;
}

.gallery-article-concise > #article-concise-title {
  width: 70%;
  height: 2.5em;
  overflow: hidden;
  font-family: 'NewCenturySchoolW02-Rg';
  font-size: 26px;
  line-height: 32px;
  margin-top: 36px;
  /*border: 1px solid orange;*/
}

.gallery-article-concise > #article-concise-pic {
  width: 100%;
  padding-bottom: 56.25%; /* width 100% / aspect ratio 16:9 = 56.25% */
  margin-top: 16px;
  /*border: 1px solid orange;*/
}

.gallery-article-concise > #article-concise-summary {
  width: 100%;
  height: 4em;
  overflow: hidden;
  padding-bottom: 0%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 20px;
  line-height: 26px;
  margin-top: 16px;
  /*border: 1px solid orange;*/
}

.gallery-article-concise > #article-concise-summary > p:last-child {
  margin-bottom: 0px;
}


.gallery-article-concise > #article-concise-readmore {
  display: inline-block;
  width: 100%;
  margin-top: 24px;
  /*border: 1px solid orange;*/
}

.gallery-article-concise > #article-concise-readmore > img {
  width: 18px;
  height: 18px;
  margin-right:5px;
  vertical-align: middle;
}

.gallery-article-concise > #article-concise-readmore > span {
  display: inline-block;
  vertical-align: middle;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 24px;
  line-height: 24px;
}

.article-content {
  margin-bottom: 76px;
}

.article-header {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.article-header-text-container {
  position: relative;
  padding-top: 30.8%; /* max-width 79 / aspect ratio 2.23 = 35.4 - margin-bottom 4.6%(56px) = 30.8% */
  margin-bottom: 56px;
  text-align: left;
  color: white;
  display: block;
}

.article-title {
  font-family: 'NewCenturySchoolW02-Rg';
  font-size: 52px;
  line-height: 56px;
  padding-bottom: 10px;
  /*border: 1px dotted yellow;*/
}

.article-subtitle {
  max-width: 88.6%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 24px;
  line-height: 32px;
  margin-top: 16px;
  /*border: 1px dotted yellow; */
}

.article-header-caption {
  max-width: 34%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 16px;
  line-height: 20px;
  margin-top: 36px;
  /*border: 1px dashed;*/
}

.article-body-and-quote {
  margin-top: 36px;
  /*border: 1px dashed;*/
}

.article-empty-quote {
  float: right;
  clear: right;
  padding: 0px;
  margin: 0 0 20px 0;
  /*border: 1px solid;*/
}

.article-empty-quote > p:last-child {
  margin-bottom: 0px;
}

/*.article-quote {
  border: 1px dashed blue;
}*/

.article-quote > p {
  float: right;
  clear: right;
  max-width: 50%;
  font-family: 'NewCenturySchoolW02-Rg';
  font-size: 26px;
  line-height: 32px;
  color: #9A9A9A;
  margin: 10px 5px 15px 30px;
  padding: 10px;
  /*border: 1px dashed;*/
}

.article-body {
  padding-right: 23%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 20px;
  line-height: 26px;
}

.article-body > p {
  margin-bottom: 16px;
}

.article-body > p:last-child {
  margin-bottom: 0px;
}

.article-body-image {
  display: block;
  max-width: 61%;
  padding-bottom: 40.66%; /* max-width 61% / aspect ratio 3:2; = 40.66% */
  position: relative;
  overflow: hidden;
  margin-top: 36px;
}

.article-supplement-title {
  max-width: 63%;
  font-family: 'NewCenturySchoolW02-Rg';
  font-size: 26px;
  line-height: 32px;
  padding-bottom: 5px;
  margin-top: 56px;
  /*border: 1px dotted;*/
}

.article-supplement-text1 {
  max-width: 63%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 20px;
  line-height: 26px;
  margin-right: 12%;
  /*border: 1px dashed;*/
}

.article-supplement-text1 > p {
  margin-bottom: 16px;
}

.article-supplement-text1 > p:last-child{
  margin-bottom: 0px;
}

.article-supplement-slideshow-container {
  position: relative;
  overflow: hidden;
  margin-top: 16px;
  /*border: 1px solid;*/
}

.article-slideshow-image-container {
  position: relative;
  overflow: hidden;
  display: inline-block;
  width:77.21%; /* max-width of body-image 61% / width of conatiner 79 = 77.21% */
  padding-bottom:51.47%; /* 77.21 / aspect ratio 3:2 = 51.47% */
  overflow: hidden;
  vertical-align: bottom;
  border: 1px solid #ebebeb;
  margin-top: 1px;
  /*border: 1px solid blue;*/
}

.article-slideshow-image {
  position: absolute;
  max-width: 101%;
  max-height: 101%;
  -webkit-transform: translatex(-50%);
  -moz-transform: translatex(-50%);
  -ms-transform: translatex(-50%);
  -o-transform: translatex(-50%);
  transform: translatex(-50%);
}
.article-slideshow-image.main {
  left: 50%;
  -webkit-transition: left 1s;
  -moz-transition: left 1s;
  -ms-transition: left 1s;
  -o-transition: left 1s;
  transition: left 1s;
}
.article-slideshow-image.left {
  left: -50%;
  -webkit-transition: left 1s;
  -moz-transition: left 1s;
  -ms-transition: left 1s;
  -o-transition: left 1s;
  transition: left 1s;
}
.article-slideshow-image.right {
  left: 150%;
  -webkit-transition: left 1s;
  -moz-transition: left 1s;
  -ms-transition: left 1s;
  -o-transition: left 1s;
  transition: left 1s;
}
.article-slideshow-nav-bg {
  height:44px;
  width:80px;
  position:absolute;
  z-index:1;
  background: rgba(0, 0, 0, 0.75);
  right:0;
  bottom:0;
}

.article-slideshow-prevButton > img {
  height: 28px;
  width: 28px;
}

.article-slideshow-nextButton > img {
  height: 28px;
  width: 28px;
}

.article-slideshow-nextButton, .article-slideshow-prevButton{
  position: absolute;
  color: #fff;
  right:0;
  bottom: 0;
  z-index: 2;
  margin:0;
  user-select: none;
}

.article-slideshow-prevButton {
  margin: 8px 44px 8px 8px;
}

.article-slideshow-nextButton {
  margin: 8px;
}

.article-slideshow-nextButton:hover, .article-slideshow-prevButton:hover{
  cursor: pointer;
}

.article-slideshow-caption-container {
  display: inline-block;
  vertical-align: bottom;
  width: 22%;
  padding-left: 10px;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 16px;
  line-height: 20px;
  /*border: 1px dotted red;*/
}

.article-supplement-text2 {
  max-width: 63%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 20px;
  line-height: 26px;
  margin-top: 16px;
  margin-right: 12%;
  /*border: 1px dashed;*/
}

.article-supplement-text2 > p {
  margin-bottom: 16px;
}

.article-supplement-text2 > p:last-child{
  margin-bottom: 0px;
}

.article-footnote {
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 16px;
  line-height: 20px;
  margin-top: 56px;
  /*border: 1px dotted;*/
}

#article-footnote > p:last-child {
  margin-bottom: 0px;
}

.article-next-prev-container {
  overflow: hidden;
  margin-top: 56px;
  /*border: 1px dashed green ;*/
}

.article-prev-nav {
  float: left;
  width: 48%;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 16px;
  line-height: 20px;
  /*border: 1px solid brown;*/
}

.article-prev-nav .article-next-prev-subj > img {
  -webkit-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  transform: scale(-1, 1);
}

.article-next-nav {
  float: right;
  width: 48%;
  text-align: right;
  font-family: 'ITCFranklinGothicW02-Bk_812924';
  font-size: 16px;
  line-height: 20px;
  /*border: 1px solid brown;*/
}

.article-next-prev-subj {
  display: inline-block;
}
.article-next-prev-subj:hover {
  cursor: pointer;
}
.article-next-prev-subj > img {
  width: 18px;
  height: 18px;
  vertical-align: middle;
}

.article-next-prev-subj > span {
  display: inline-block;
  vertical-align: middle;
}


.article-next-prev-hor-line {
  border-top: 1px solid black;
  margin-top: 16px;
}

.article-next-prev-link {
  font-family: 'NewCenturySchoolW02-Rg';
  font-size: 26px;
  line-height: 32px;
  margin-top: 16px;
}

div.gallery-back {
    font-family: 'ITCFranklinGothicW02-Bk_812924';
    font-size: 16px;
    line-height: 20px;
    width: 105px;
    height: 105px;
    position: absolute;
    top: 50px;
    right: 50px;
}
div.gallery-back a {
   color: black;
}

div.gallery-back a:hover {
    text-decoration: none;
}
div.gallery-back.sticky {
    position: fixed;
}
div.gallery-back a img {
    width: 28px;
    height: 28px;
    margin-bottom: 5px;
}


/*==========  Non-Mobile First Method  ==========*/

/* Ipad landscape */
@media only screen and (max-width : 1200px) {
  /* Article and Gallery left margin and right margin are 5% */
  .gallery-content-start, .article-content-start {margin-left: 5%;}
  .gallery-content-max {max-width: 93%;}
  .article-content-max {max-width: 81%;}
  .gallery-header-text-container {max-width: 90%; margin-bottom: 36px;}
  .gallery-subtitle {max-width: 100%;}
  .gallery-article-concise {float: left; width: 50%; overflow: hidden; padding: 0% 11% 0 0 ;}
  .gallery-article-concise > #article-concise-summary {width:115%; padding: 0% 0% 0 0; height: 6.5em; -webkit-line-clamp: 5;}
  .gallery-article-concise > #article-concise-title {width:100%;}
  .article-content {margin-bottom: 36px;}
  .article-header-text-container {margin-bottom: 36px;}
  .article-subtitle {margin-top: 0px;}
  .article-header-caption {max-width: 44.5%;}
  .article-body-and-quote {max-width: 90%;}
  .article-body {padding-right: 12%;}
  .article-body > p {margin-bottom: 24px;}
  .article-body-image {max-width:53.63%; padding-bottom: 40.22%;}
  /*.article-slideshow-image-container {width:66.2%; padding-bottom:49.65%; }*/
  .article-slideshow-caption-container {width:33%;}
  .article-footnote {margin-top: 36px;}

  .downloadsDiv {
    /*margin: 36px auto;*/
  }

  #mainContentDiv.downloadsPage, #mainContentDiv.takeActionPage {
    padding: 7% 5% 5%;
  }

  .downloadsFeatured {
    margin-bottom: 36px;
  }

  .downloadsFeatured .downFeatureText {
    width: 48%;
    vertical-align: top;
    display: inline-block;
    /*float: left;*/
  }

  .downloadsFeatured .downFeatureText .captionStyle {
    margin-bottom: 10px;
  }
  .downloadsFeatured .downFeatureText .headline2Style {
    margin-bottom: 10px;
  }
  .downloadsFeatured .downFeatureText .bodyStyle {
    margin-bottom: 15px;
  }

  .downloadsFeatured .downFeatureImage {
    width: 50%;
    vertical-align: top;
    display: inline-block;
    text-align: right;
    float: right;
  }

  .downloadsFeatured .downFeatureImage img {
    /*max-height: 230px;*/
    width: 100%;
    margin-bottom: 36px;
  }

  .downloadResultDiv {
    width: 33%;
    padding: 0 8px 25px;
    float: left;
  }

  .downloadsResult {
    padding-left: 7px;
    padding-right: 0;
    display: inline-block;
  }

  .downloadsResult > .captionStyle {
    padding-left: 8px;
  }

  .downloadResultDiv img {
    width: 100%;
  }

  .downloadResultDiv .headline2Style {
    margin-bottom: 10px;
    min-height: 65px;
  }

  .downloadResultDiv img {
    margin-bottom: 10px;
  }

  .downloadResultDiv .bodyStyle {
      margin-bottom: 15px;
  }

  .downloadsResult > .captionStyle {
      margin-bottom: 10px;
  }
}

@media only screen and (max-width : 1024px) {
    div.gallery-back {
        display: none;
    }
}

/* Ipad portrait */
@media only screen and (max-width : 992px) {
  .gallery-content-start, .article-content-start {margin-left: 5%;}
  .article-content-max {max-width: 90%;}
  .article-header-caption{max-width: 44.5%;}
  .article-body-image {padding-bottom: 35.73%;}
  /*.article-slideshow-image-container {width:59.58%; padding-bottom:39.72%;}*/
  .article-slideshow-caption-container {width:39%;}

  #mainContentDiv.downloadsPage, #mainContentDiv.takeActionPage {
    padding: 112px 5% 5%;
  }
}

/* Phone landscape */
@media only screen and (max-width : 768px) {
}

/* Phone portrait changed from 480 to 550 */
@media only screen and (max-width : 550px) {
  /* Article and Gallery left and right margins are 9% */
  .gallery-content-start, .article-content-start {margin-left: 9%;}
  .gallery-content-max, .article-content-max {max-width: 82%;}
  .gallery-header-text-container {padding-top: 25%; /* 25% = aspect ratio 3:2; */ margin-bottom: 36px;}
  .gallery-title {font-size: 32px; line-height: 38px;}
  .gallery-subtitle{font-size: 18px; line-height: 24px;}
  .gallery-article-concise {width: 100%; padding: 0% 0% 0 0 ;}
  .gallery-article-concise > #article-concise-title {height: auto; font-size: 22px; line-height: 28px;}
  .gallery-article-concise > #article-concise-summary {width:100%; height: auto; line-height: 27px;}
  .article-header-text-container {padding-top: 25%; /* 25% = aspect ratio 3:2; */}
  .article-title{font-size: 32px; line-height: 38px;}
  .article-subtitle{font-size: 18px; line-height: 24px;}
  .article-header-caption {max-width: 82%;}
  .article-empty-quote {padding: 0; margin: 0 0 40px 0;}
  .article-quote {float: left; width: 100%;}
  .article-quote > p {float: left; max-width: 100%; padding: 0; margin: 24px 0 24px 0; font-size: 22px; line-height: 28px;}
  .article-body {padding: 0;}
  .article-body-image {max-width: 82%; padding-bottom:54.66%; margin-top: 24px;}
  .article-supplement-title {font-size: 22px; line-height: 28px;}
  .article-supplement-slideshow-container {margin-top: 24px;}
  .article-slideshow-image-container {width: 100%; padding-bottom: 66.66%;}
  .article-slideshow-caption-container {width: 100%; padding-left: 0; margin: 24px 0 5px 0;}
  .article-supplement-text2 {margin-top: 0;}
  .article-next-prev-container {margin-top: 36px;}
  .article-prev-nav {float: left; width: 100%; margin-bottom: 24px;}
  .article-next-nav {float: left; width: 100%; text-align: left;}
  .article-next-prev-link {font-size: 22px; line-height: 28px;}
}

/* Retina */
@media only screen and (max-width : 320px) {

}

nav#siteNav .buttons .galleryTagWhite {
	position: absolute;
	opacity: 0;
	right: -1px;
	top: 28%;
	width: 0;
	height: 0;
	border-top: 15px solid transparent;
	border-bottom: 15px solid transparent;
	border-right: 15px solid white;
	z-index: 1000;
}

nav#siteNav .buttons .galleryTagBlack {
	position: absolute;
	opacity: 0;
	right: -2px;
	top: 28%;
	width: 0;
	height: 0;
	border-top: 15px solid transparent;
	border-bottom: 15px solid transparent;
	border-right: 15px solid black;
	z-index: 1010;
}
nav#siteNav.expanded .buttons .galleryTagWhite,
nav#siteNav.expanded .buttons .galleryTagBlack {
	opacity: 1;
	transition: opacity 0.5s 1s;
}