/*******************************/
/* GENERAL                     */
/*******************************/
#articlePage {
  max-width:1000px;
  margin-left:auto;
  margin-right:auto;
  padding: 118px 20px 120px 20px;
}

.articlePage__class {
  font: bold 16px poppins, lucida, arial, sans-serif;
  letter-spacing: 4px;
}
.articlePage__class-PR { color: var(--green-200); }
.articlePage__class-P6 { color: var(--green-200); }
.articlePage__class-I5 { color: var(--coral-200); }
.articlePage__class-IN { color: var(--coral-200); }
.articlePage__class-BO { color: var(--gray-500); }

#articlePage__header {
  max-width: 660px;
  margin: 0 auto 60px auto;
}

#articlePage__title {
  font: italic bold 60px merriweather, palatino, serif;
  color: var(--gray-500);
  margin-bottom: 20px;
}

#articlePage__authorInfo {
  display:flex;
  flex-flow: row nowrap;
  justify-content:left;
  align-items:normal;
}
#articlePage__insiderOwner {
  padding-right:30px;
  height:70px;
  border-right:1px solid var(--gray-200);
  margin-right:30px;
}
#articlePage__owner {
  margin-right:20px;
}
#articlePage__ownerName, #articlePage__insiderOwnerName {
  font: italic 23px merriweather, palatino, serif;
  color: var(--gray-400);
  vertical-align: middle;
}
#articlePage__insiderAuthorName {
  font: 14px poppins, arial, sans-serif;
  color: var(--gray-400);
  margin-top: 5px;
  transform: translateY(-20px);
}

#articlePage__insiderOwnerAvatar, #articleView__ownerAvatar {
  line-height: 66px;
}
#articlePage__insiderOwnerAvatar.author {
  line-height: initial;
}

#articlePage__author {
  font: italic 23px merriweather, palatino, serif;
  color: var(--gray-400);
}
#articlePage__author a {
  font: italic 23px merriweather, palatino, serif;
  color: var(--gray-400);
}
#articlePage__authorAvatar {
  margin-left:6px;
}

#articlePage__authorInfo {
  display:flex;
}

#articlePage__socialRow {
  display:flex;
  flex-flow: row nowrap;
}
#articlePage__socialTop h3 {
  font: 12px poppins, arial, sans-serif;
  color: var(--gray-300);
}
#articlePage__socialTop button {
  width:40px;
  height:40px;
  border-radius:20px;
  border:1px solid var(--gray-200);
  background-color:var(--white);
  margin-right:2px;
  background-position: center;
  background-repeat: no-repeat;
}
#articlePage__facebookButton  { background-image:url(/static/images/icons/facebook-gray.svg); background-size: 8px;}
#articlePage__pinterestButton { background-image:url(/static/images/icons/pinterest-gray.svg); background-size: 19px;}
#articlePage__twitterButton   { background-image:url(/static/images/icons/twitter-gray.svg); background-size: 30px; }
#articlePage__emailButton     { background-image:url(/static/images/icons/email-gray.svg); background-size: 22px;}
#articlePage__facebookButton:hover  { background-image:url(/static/images/icons/facebook-blue.svg); }
#articlePage__pinterestButton:hover { background-image:url(/static/images/icons/pinterest-red.svg); }
#articlePage__twitterButton:hover   { background-image:url(/static/images/icons/twitter-blue.svg); }
#articlePage__emailButton:hover     { background-image:url(/static/images/icons/email-coral.svg); }

#articlePage__socialFooter {
  text-align:center;
  margin-bottom:40px;
}
#articlePage__socialFooter button {
  height:40px;
  border-radius:20px;
  border:1px solid var(--gray-200);
  background-color:var(--white);
  background-repeat: no-repeat;
  font: 14px poppins, arial, sans-serif;
  color: var(--gray-300);
}
#articlePage__facebookButtonLarge  { background-image:url(/static/images/icons/facebook-gray.svg); background-size: 8px; background-position:16px center; padding:0 16px 0 30px; }
#articlePage__twitterButtonLarge   { background-image:url(/static/images/icons/twitter-gray.svg); background-size: 30px; background-position:6px center; padding:0 16px 0 34px; }
#articlePage__pinterestButtonLarge { background-image:url(/static/images/icons/pinterest-gray.svg); background-size: 19px; background-position:12px center; padding:0 16px 0 36px; }
#articlePage__emailButtonLarge     { background-image:url(/static/images/icons/email-gray.svg); background-size: 22px; background-position:12px center; padding:0 16px 0 40px; }
#articlePage__facebookButtonLarge:hover  { background-image:url(/static/images/icons/facebook-blue.svg); color: #3b5998; }
#articlePage__twitterButtonLarge:hover   { background-image:url(/static/images/icons/twitter-blue.svg); color: #1da1f2; }
#articlePage__pinterestButtonLarge:hover { background-image:url(/static/images/icons/pinterest-red.svg); color: #bd081c; }
#articlePage__emailButtonLarge:hover     { background-image:url(/static/images/icons/email-coral.svg); color: var(--coral-200); }

#articlePage__content {
  margin: 0 auto;
}
.articlePage__section {
  margin: 20px auto;
  max-width: 660px;
}
.articlePage__section blockquote {
  padding:10px;
  background-color: var(--gray-100);
}
.articlePage__section hr {
    margin:10px 0;
    border-color: var(--gray-100);
}
.articlePage__section ul, ol {
  margin:10px 0;
}
.articlePage__section li {
  font: 16px/1.5 merriweather, palatino, serif;
}
.articlePage__centeredSection {
  margin: 2em 0;
  text-align:center;
}

#articlePage__content h1 {
  font: italic 600 26px/1.5 merriweather, palatino, serif;
}
#articlePage__content h2 {
  font-weight: 600;
  font-size: 20px;
  /*line-height: 1.5;*/
  display: inline-block;
  width: calc(100% - 50px);
}
.articlePage__add {
  background: url(/static/images/buttons/add-to-itinerary-black.svg) no-repeat center/contain transparent;
  height: 20px;
  width: 20px;
  border: 0;
  display: inline-block;
  margin-left: -35px;
  margin-right: 10px;
  vertical-align: top;
  margin-top: 5px;
}
.articlePage__add:hover {
  background: url(/static/images/buttons/white-cross.svg) no-repeat center center/11px var(--blue-200);
  border-radius:15px;
}
#articlePage__content h3 {
  font-size: 16px;
  font-weight: 600;
  /*padding-top: 0.5em;*/
}
#articlePage__content p {
  font: 16px/1.6 merriweather, palatino, serif;
  padding: 0.5em 0;
}
#articlePage__content a {
  font-family: merriweather, palatino, serif;
  text-decoration: underline;
  line-height: 1.6;
  word-break: break-word;
}
#articlePage__content a.noUnderline {
  text-decoration: none;
  display: inline-block;
}
#articlePage__content a h2 {
  -moz-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
}
#articlePage__content a h2:hover{
  color: var(--blue-200);
}
#articlePage__content ul {
  font-family: merriweather, palatino, serif;
  font-size: 16px;
}
#articlePage__content figure {
  margin-bottom: 10px;
  width: 100%;
  text-align: center;
}
#articlePage__content figcaption {
  width: 100%;
  max-width: 660px;
  margin: 0 auto 10px auto;
  font-size: 12px;
  color: var(--gray-300);
  text-align: left;
}

.articleImage {
  width: 100%;
  height:500px;
  object-fit: cover;
  object-position: center;
}
.articleImage.vertical {
  max-width: 660px;
  margin: 0 auto;
  height:900px;
}
.articleImage.square {
  max-width: 660px;
  max-height:660px;
  margin: 0 auto;
  object-fit: cover;
}
.contentWidth {
  max-width: 660px;
  margin-left: auto;
  margin-right: auto;
}

#articlePage__content figcaption a {
  font-family: poppins, arial, sans-serif;
  color: var(--gray-400);
}
#articlePage__content figcaption a:hover {
  color: var(--gray-500);
}
.articlePage__place {
  color: var(--blue-200);
  height:18px;
  display:inline-flex;
  flex-flow: row nowrap;
  align-items: center;
}
.articlePage__place button {
  background-color: transparent;
  background-image:url(/static/images/buttons/add-to-itinerary-black.svg);
  background-repeat: no-repeat;
  background-size:100%;
  height:18px;
  width:18px;
  border:0;
  margin-left:4px;
  /*CSS transitions*/
	-o-transition-property: none !important;
	-moz-transition-property: none !important;
	-ms-transition-property: none !important;
	-webkit-transition-property: none !important;
	transition-property: none !important;
}
.articlePage__place button:hover {
  background: url(/static/images/buttons/white-cross.svg) no-repeat center center/11px var(--blue-200);
  border-radius:15px;
}

.articlePage__imageText__section {}
.articlePage__imageText__content {
  display:flex;
  flex-flow:row nowrap;
}
.articlePage__imageText__image {
  height:240px;
  width:240px;
}
.articlePage__imageText__imageCaption {
  font-size: 12px;
  color: var(--gray-300);
}
.articlePage__imageText__textLeft { margin-right:40px; }
.articlePage__imageText__textRight { margin-left:40px; }

#articlePage__footer {
  max-width:1000px;
  text-align:center;
  margin:0 auto 40px auto;
  border-top:solid 1px var(--gray-500);
  padding-top:40px;
}
.articlePage__footerContent {
  max-width:500px;
  margin:0 auto;
  font: 16px/1.6 merriweather, palatino, serif;
  color: var(--gray-500);
}
#articlePage__registerButton {
  margin-top:20px;
}

/* new article sidebar */
.articlePage__sidebar {
  position: -webkit-sticky;
  position: sticky;
  top: 65px;
  width: 141px;
  float: right;
}
.articlePage__sidebar_map {
  height: 141px;
  background-size: cover;
  background-position: center;
  border-top: 3px solid var(--yellow-200);
}
.articlePage__sidebar_label h4 {
  font-size: 14px;
  font-style: italic;
  color: var(--gray-300);
  font-family: merriweather, palatino, serif;
  padding-top: 15px;
}
.articlePage__section.withSidebar {
  margin-left: calc((100% - 660px)/2);
  padding-right: 160px;
}

/* buttons */
#articlePage__content a.button {
  text-decoration: none;
  font-family: poppins, arial, sans-serif;
  -moz-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
  cursor: pointer;
  margin:20px 0 0 0;
}
#articlePage__content a.button--level-primary {
  font-weight: 600;
  background-color: var(--blue-200);
  border: none;
  color: var(--white);
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 15px 65px;
}
#articlePage__content a.button--level-primary:hover {
  background-color: var(--blue-300);
}
#articlePage__content a.button--level-secondary {
  font-weight: 600;
  background-color: var(--white);
  border: 1px solid var(--gray-500);
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 15px 65px;
  color: var(--gray-500);
  text-align: center;
}
#articlePage__content a.button--level-secondary:hover {
  border: 1px solid var(--blue-200);
  color: var(--blue-200);
}
#articlePage__content a.button--level-tertiary {
  border: solid 1px var(--gray-500);
  background-color: var(--white);
  font-size: 12px;
  padding: 3px 25px;
}
#articlePage__content a.button--level-tertiary:hover {
  border: solid 1px var(--blue-200);
  color: var(--blue-200);
}


/* !* setting max padding for images *! */
/*@media (min-width : 1000px) {*/
  /*.articleImage {padding-top: 500px;}*/
  /*.articleImage.vertical {padding-top: 990px;}*/
/*}*/

/* adjustment to sidebar sections when smaller than max-width */
@media only screen and (max-width : 690px){
  .articlePage__section.withSidebar {margin-left: 0; padding-right: 90px;}
  .articlePage__sidebar {width: 75px;}
  .articlePage__sidebar_map {height: 100px;}
}

/* mobile portrait */
@media only screen and (max-width : 767px) and (orientation : portrait) {
  #articlePage {padding: 100px 15px 0 15px;}
  .articlePage__classHeader {font-size: 14px;}
  #articlePage__content a.noUnderline {max-width: calc(100% - 32px);}
  #articlePage__title {font-size: 40px; margin-bottom: 10px;}
  #articlePage__author {font-size: 20px;}
  #articlePage__authorInfo {display: block;}
  #articlePage__insiderOwner, #articleView__owner {height: initial; padding: 0; margin: -10px 0 10px 0; border-right: none; border-bottom: 1px solid var(--gray-200);}
  #articlePage__header {margin-bottom: 40px;}
  .articlePage__add {margin-left: 0; margin-right: 5px;}
  #articlePage__emailButtonLarge {margin-top: 10px;}
  .articlePage__section { margin-bottom:10px; }
  .articleImage { height: auto; }
  .articlePage__imageText__section { flex-flow: column; }
  .articlePage__imageText__textLeft { margin-right:0; }
  .articlePage__imageText__textRight { margin-left:0; }

}