/* Page properties reset */
body {font-family: 'Helvetica Neue',Helvetica,sans-serif;color: #333;}
a.section-anchor{display: block; position: relative; top: -65px; visibility: hidden;}
a {color: #666;text-decoration: none;}
a:hover, a:focus {text-decoration: none;color: #999;}

h2 {font-size: 2em; padding:.2em .2em .5em .2em;}
@media screen and (max-width: 40em) {
  h2 {text-align: center;}
}

h2, h3 {margin-top:1em; text-transform: capitalize; font-weight: 600;}
h2 a, h3 a {color: black;}

h3 {font-size:1.3rem; padding:.2em .2em 1em .2em;}

h4 {font-size:1.1rem;font-weight: 600;padding:.2em .2em 1em .2em;}

hr {max-width: 50%;margin: 25px auto 0;}

div[id*="Header"] h1,div[id*="Header"] a {color:black;}

.mdcLoginButton {text-align: center;}
.mdcLoginButton h4 {border:1px solid #ccc;padding:12px 24px;max-width:300px;margin:auto;}
.mdcLoginButton h4 a {color: #0cb914;}


/* News stories */
.sectionRow {max-width:1152px;margin: 0 auto;}

.firstNewsRow {margin-top:0;}
.sectionRow h1 {font-size: 4em;font-weight: 600;}

h6.SectionSubheader {color:#666;text-transform: capitalize;}

.fwimgheader {overflow:hidden;margin-bottom: 40px;max-height:850px;background-color: black;background-image: linear-gradient(rgba(255,255,255,1), black 85%);}
div.small-12.columns.fwimgheader.mdxcoverimgheader {max-height:1050px;}
.fwimgheader img {width:100%;display:block;opacity:.8;}

.coverthumbs:hover {background-color:rgba(0,0,0,.027);}
.coverthumbs img {position:relative;width: 100%;}

.moremdxfooter {max-width: 100% !important;text-align: right !important;}
.moremdxfooter h4 {padding: 0 16px 0 4px !important;font-size: .9rem !important;}
.moremdxfooter h5 {margin: 0 !important;font-size: 1.1rem !important;padding-left: 4px !important;text-align: right !important;}
@media screen and (max-width: 414px) {
  .moremdxfooter h5  {font-size: .95rem !important;}
}
/*  cover */

.coverRow h6 {width: 90%;}
.coverthumbs {padding:0 !important;overflow: hidden;border-right: none !important;}
.coverthumbs a {width:100%; display: inline-block;}
.coverthumbs img {width:90% !important;margin:5% !important;}
.coverthumbs h4 {padding-top: 20px;}
.coverthumbs h4,.coverthumbs h5 {padding-right:10px;}
.coverthumbs h5 {font-size: 1.8rem;padding-left:0;height: auto;font-weight: 600;bottom: 0;margin: auto auto 30px auto;text-align: left;text-transform: capitalize;}
.storyTitleDiv  {width:90% !important;margin:5% !important;}
.storyTitleDiv h6 {width: 70%;text-align: justify;}

@media screen and (max-width: 414px) {
  .coverthumbs h5  {font-size: 1.05rem;}
}

  /* end  cover */

/* proSearch */
:root {--proSearchDivHeight:130px;}
.proSearchDiv {color:white;height: var(--proSearchDivHeight);position: relative;box-sizing: initial;}
.proSearchDivImage {position:absolute;background-image: url("https://i.mdel.net/i/arielle.jpg");background-position: right center;background-size: cover;background-repeat: no-repeat;width:100%;height: var(--proSearchDivHeight);}
.proSearchDivGray {position:absolute;background-color: black;opacity: .5;width:100%;height: var(--proSearchDivHeight);}
.proSearchTitleLine {padding-top: 3.5rem;}
.proSearchTitleLine b {color: orange;}
.proSearchImageCredits {position: absolute;right: 10px;bottom: 10px;font-size: .6rem;color: #ccc;}
.proSearchImageCredits a {color: #ccc;}
.proSearchSelectionCol {height: 100%;overflow: hidden scroll;}
.proSearchDiv.coverWidth {padding: 0}

.proSearchSelectionCol {
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
}
.proSearchSelectionCol::-webkit-scrollbar { /* WebKit */
    width: 0;height: 0;
}
.proSearchSelectionContainer {position: relative;}
.proSearchSelectionContainer li {list-style-type: none; margin: 1rem;text-align: center;}
.proSearchSelectionContainer li:not(.blankLi) {background-color: rgba(255, 255, 255, 0.2);padding: 1rem;}
.proSearchSelectionContainer li:not(.blankLi):hover {background-color: rgba(255, 255, 255, 0.4);}
.proSearchSelectionContainer a {color: white;}
@media screen and (max-width: 700px) {
  .proSearchDivImage, .proSearchImageCredits {display: none;}
}
/* end proSearch */

/* Agencies directory */
#hp-agencies-ad,#hp-ad-right,#member_search,#new_contacts,#hp-register,#hp-twitter,#hp-fb,#hp-section-links,#hp-fw-links {width:100%;margin:20px 0 40px auto;}
.agencyDirectoryAdContainer {padding:1px;}
#AgencyDirectoryRow img {border:1px solid black;margin:40px 0;width: 300px;}

/* Showpackages */
.all_box{height:auto;border-top:4px solid black;margin-bottom:3em;}
.showpackagesEntryContainer {padding:1px;}
.showpackagesEntry {min-height: 240px;}

@media screen and (max-width: 40em) {
  .showpackagesEntry {min-height: 200px;}
}
.showpackagesEntry img {border:1px solid black;}
.showpackageLinkMore a {color:black;}
.showpackageLinkMore {margin:30px 0;padding:20px;text-align: right;}


/* Trending, Favorites, Discover */
#discoverRow {padding: 0 .5rem;}
#discoverRow a img {opacity: .9;}
#discoverRow a:hover img {opacity: 1;}
#discoverRow a .discoverName {color: #333;}
#discoverRow a:hover .discoverName {color: black;}
.discoverText {margin: 0 .3rem;}
.discoverBox {display: flex;align-items: center;margin-bottom: 0.6rem;}
.discoverBox .latest-ed-box {margin: 0;}
.favoriteText div, .discoverText div {font-size: .8rem;color: #999;font-weight: 400;max-width: 160px;margin: auto;}
.trendText div, .featuredText div  {position:relative;bottom:0;background-color: rgba(255,255,255,1);color: #999;font-weight: 400;width: 100%;padding: .4rem 0 0 .4rem;font-size: .8rem;}
#TrendingRow h2 {padding:0 0 .1em .2em;}
.hpTrendingDiv h4 {padding:2.2em 1em .4em .4em;;}
.trendlarge, .trendsmall {padding: 0;overflow:hidden;}
.trendlarge .trendOverlay {background-color: black;height: 100%;width: 100%;position: absolute;top: 0;opacity: .15;}
.trendlarge .trendOverlay:hover {opacity: 0;}
.trendImgDivNoBG {position: relative;margin: 0 0 4rem 0;}
.trendImgDiv {padding-bottom:100%;background-repeat: no-repeat;background-size: cover;background-position: 50% 0;left: 0;top: 0;border-top: 1px solid #000;border-bottom: 1px solid #000;}
.trendText, .featuredText {position:absolute;width: 100%;height:100%;}
.trendClient {text-transform: uppercase;}
.trendClient, .favoriteName, .discoverName, .featuredListName {font-weight: 600;}
.trendClient, .favoriteName, .discoverName, .featuredListName {font-size: .9rem; padding: 0 0 .2rem;display: inline-block; color: black;}
@media only screen and (max-width: 40em) {
  #trendingHeader h1 {font-size:1.5rem;}
  #trendingHeaderMen h1 {font-size:1.5rem;}
}


.titleTagLine {color: #999;margin: 0 0 1rem .3rem}
.titleSeeAll a {color: #000;}
.titleSeeAll {position: absolute;right:5px;padding-right: 1rem;font-weight: 700;}
.hpTitleRow h3 {padding: .2rem .2rem 0 .2rem}


.FeaturedListHeader {text-align: center;}
#FeaturedListSlider .trendImgDivNoBG {position:relative; margin: 0 0 6.2rem 0;}
#FeaturedListSlider .trendlarge {padding: .3rem;}
#FeaturedListSlider .featuredItemContainer {max-width: 250px; margin: auto;}
#FeaturedListSlider .featuredListName {font-size: .8rem;}
#FeaturedListSlider .featuredText {text-align: center;height: initial;margin-top: 5%;line-height: 1.2rem;}
#FeaturedListSlider .featuredText div {padding: 0;}
#FeaturedListSlider .featuredText img {display: initial; width: 10px;}

@media only screen and (max-width: 59.438em) { /* small & medium */
	.titleTagLine, .titleSeeAll {font-size: .85rem;}
	.FeaturedListHeader .titleSeeAll {top:2rem;}
}


/* Slick Slider */

.slick-slide img {width: 100%;}
.slick-disabled {visibility: hidden;}
.slick-disabled img {display: none;}
.slickPrev, .slickNext {top:35%;border-radius: 75px;padding: 1rem 1.1rem;}
.slickPrev i, .slickNext i {font-size: 1.5rem; font-weight: 300; color: white;}
.slickPrev {left: -2rem;}
.slickNext {right: -2rem;}
.slickNext, .slickPrev {position: absolute;background-color: black;z-index: 98;cursor: pointer;opacity: 0.75;}
.slickNext:hover, .slickPrev:hover {opacity: 1;}

@media only screen and (max-width: 105em) { 
  .slickPrev, .slickNext {top:30%;}
  .slickPrev {left: 1rem;}
  .slickNext {right: 1rem;}
}
@media only screen and (max-width: 59.438em) { /* small & medium */
  .slickPrev, .slickNext {top:20%;}
  .slickPrev i, .slickNext i {font-size: 1rem;}
  .socialRow div {float: left;}
  .row.work-left {margin:20px 0 0;}
  .row.work-right {margin:0;}
  .slick-dots {visibility: visible;}
}
@media only screen and (max-width: 31em) {
  .slickPrev,.slickNext {padding:.4rem .5rem;top:25%;}
  /*.trendSlideRow:nth-child(1n+2) {display: none;}*/
  .slickPrev, .slickNext {display: none;}
}

/* End Slick Slider*/

/* Mobile Scroll Area */

@media only screen and (max-width: 31em) {
	#discoverRow div.row {width: 460vw !important;display: inline-block;}
	#discoverRow {overflow: scroll hidden;}
	.trendSlideRow, #FavoritesRow div.row {width: 230vw !important;display: inline-block;}
	.trendsliderContainer, #FavoritesRow {overflow: scroll hidden;}
	#trendslider {width: 690vw;}
	#FeaturedListSlider.featuredSlides1 {width: 230vw;}
	#FeaturedListSlider.featuredSlides2 {width: 460vw;}
	#FeaturedListSlider.featuredSlides3 {width: 690vw;}
}
@media only screen and (min-width: 31em) and (max-width: 59.438em) { /* small & medium */
	#discoverRow div.row {width: 230vw !important;display: inline-block;}
	#discoverRow {overflow: scroll hidden;}
}

/* END Mobile Scroll Area */

/* Scouting portfolios */
#new_contacts {margin-top: 15px;}
/* START MEMBERS RECENTLY CONTACTED */
.new_contacts_img {overflow: hidden;margin:0;background-color: white;min-height: 120px;max-height: 120px;border: 12px solid white;}
.portrait {max-width: 110%;min-height: 100%;min-width: 100%;}
.landscape {max-width: 200%; margin-left: -20%;}
#new_contacts {border-right:none;border-left:none;}
/* END MEMBERS RECENTLY CONTACTED */

/* START hp-register become a member button */
.mdc-signupbutton {background-color: #d4d4d4;color:black;font-weight: 300;font-size: 1.4rem;padding: .5rem;}
.mdcbutton:hover {color: white;}
/* END hp-register become a member button */


/* Database */
#hp-db {border-top:none;}

.hp-db-txt {padding:4px 8px 8px 8px;font-size: 0.8em;height:70px;overflow-wrap: break-word;max-width: 160px;margin:auto;}

.hp-db-txt h6 {font-size: 80%;}
@media only screen and (max-width: 414px) {
  .hp-db-nav h2 {text-align: center;padding-left: 0;}
}

.hp-button-centered {text-align:center;margin:auto;}
.hp-button-centered.hp-dbheader h2 {text-transform:lowercase;}
.hp-db-nav-header {padding:0 0 20px 0;}

.hp-db-txt-label {font-size:0.6em;color:#666;,margin-top: 9px;}
#latest-editorials {display: block;clear:both;}
#latest-advertising {display: block;clear:both;}
.latest-ed-box {overflow:hidden;margin: 0 0 12px 0;text-align:center;position:relative;}

.latest-ed-box img {border: 1px solid #e0e0e0;}
.latest-ed-box a {display: inline-block;}
.hp-db-nav-content a:hover .latest-ed-box > img.workThumb {opacity: .75;}
.hp-db-nav-content {margin-bottom: 0;}
img.workThumb {max-width: 162px;}

.hp-db-nav-top {text-align: right;padding: 10px 20px 0 0;}


/* Social embeds */
#instaFeed {margin:40px 0;/*border-bottom:2px solid black;border-top:2px solid black;*/}
#instaFeed h2 {padding:0;margin-top: .3rem;}


/* footer */
#footer {background:#efefef;font-size:10px;padding:20px;color:#666;border-top: 1px #dedede solid;clear:both;margin:10px 0;}
#footer a {color:#333;text-decoration:none;}
.footContainer {text-align:center;}


/* START 2015-2016 edits below */

.all_box {border:none;}

#newfacesmotwrow {margin-bottom: 40px;}

body {font-family: 'Helvetica Neue',Helvetica,sans-serif;}
.fullWidth {max-width:1600px !important;}
.coverWidth {max-width:2000px !important;padding:1rem 0 0;}
.panel {background:white;}


#hp-twitter {text-align: center;max-height: 400px;overflow: scroll;}

#backtotop{bottom:7.5rem!important;}
#backtotop, #sidemenubutton    {right: .4rem !important;}

.fwimgheader h5,.fwimgheader h6 {color: white;letter-spacing: 1px;font-family: 'Helvetica Neue';text-transform: capitalize;}
@media screen and (max-width: 800px) {
  .fwimgheader h5 {font-size: 1.5rem;font-weight: 500;}
}
@media screen and (min-width: 801px) {
  .fwimgheader h5 {font-size: 3rem;font-weight: 500;}
}

.fwimgheader h6 {font-size: 1.2rem;font-weight: 200;margin:.5rem auto 0 auto;line-height: 1.3rem;max-width:600px;}

.fwimgheader img,.showslist img {position:relative;width: 100%;opacity: .85;}
.fwimgheaderTitle {position:absolute;bottom:0;width: 90%;margin:0 5%;text-align: center;}


@media screen and (min-width: 769px) {
    .showslist h5 {font-size: 1.2rem;bottom:10%;margin:auto 5% auto  5%;}
    .fwimgheaderTitle {top:82%;}
    #MDXCoverStoriesRow .fwimgheaderTitle {margin:auto 5% 160px  5%;}/* changing margin bottom from 40px to 160px for Sissy Vian cover image */
}

@media screen and (max-width: 768px) {
  .showslist h5 {margin:0 5%;top:52%;font-size: 1rem;line-height: 1rem;}
  .fwimgheader h6 {font-size: .95rem;line-height: .95rem;}
  div[id*="Header"] h1 {font-size: 3.8em;}
  .fwimgheaderTitle {top:72%;}
  #MDXCoverStoriesRow .fwimgheaderTitle {margin:auto 5% 40px  5%;}/* changing margin bottom from 40px to 160px for Sissy Vian cover image */
}

@media only screen and (max-width: 768px) {
  #MDXCoverStoriesRow .fwimgheaderTitle {top:76%;}
  #MDXCoverStoriesRow .fwimgheaderTitle h5 {font-size: 1.4rem;}
  #MDXCoverStoriesRow .fwimgheaderTitle h6 {font-size: 1rem;}
}
@media only screen and (min-width: 769px) {
  #MDXCoverStoriesRow .fwimgheaderTitle {top:80%;}
  #MDXCoverStoriesRow .fwimgheaderTitle h5 {font-size: 2.6rem;}
  #MDXCoverStoriesRow .fwimgheaderTitle h6 {font-size: 1.1rem;}
}
@media only screen and (min-width: 1300px) {
  #MDXCoverStoriesRow .fwimgheaderTitle {top:83%;}
  #MDXCoverStoriesRow .fwimgheaderTitle h5 {font-size: 3rem;}
  #MDXCoverStoriesRow .fwimgheaderTitle h6 {font-size: 1.2rem;}
}

#MDXCoverStoriesRow .fwimgheader {height: calc(100vh - 198px);position: relative;margin-bottom: 10px;}

#MDXCoverStoriesRow .fwimgheader img {opacity: .9 !important;position: absolute;left: -9999px;right: -9999px;margin: auto;min-width: 100%;max-width: 230%;min-height: 100%;width: auto;}

@media only screen and (min-width: 768px) and (max-width: 1280px) and (max-height: 813px) {
  #MDXCoverStoriesRow .fwimgheader img {max-width: 100%;}
}
@media only screen and (max-width: 414px) and (max-height: 813px) {
  #MDXCoverStoriesRow .fwimgheader img {max-height: 100%;}
}
@media only screen and (min-width: 1281px) and (max-width: 1440px) {
  #MDXCoverStoriesRow .fwimgheader img { max-width: 150%; }
}
@media only screen and (max-width: 414px) {
  #MDXCoverStoriesRow .fwimgheader.mdcCoverOffsetLeft img {left: -9754px;}
  #MDXCoverStoriesRow .fwimgheader.mdcCoverOffsetRight img {right: -9924px;}
}
@media only screen and (min-width: 769px) {
  #MDXCoverStoriesRow .fwimgheader { height: calc(100vh - 80px); }
  #MDXCoverStoriesRow .fwimgheaderTitle { top: 81%; padding: 0 5%;}
  #MDXCoverStoriesRow .fwimgheaderTitle h5 { font-size: 2.6rem; }
}

@media only screen and (max-width: 768px){
  #MDXCoverStoriesRow .fwimgheaderTitle { top: 76%; }
}
.fullWidth {width: 100%;margin-left: auto;margin-right: auto;max-width: initial;}
.fullWidth .row {margin-left: auto;margin-right: auto;/*max-width: 63.25em;*/}

#fixedyesno.fixed {opacity: 1;}

#instaTitle {font-size:2.2rem;}

#instaContainer {background-color:#fff;padding:0px;position:relative;margin:auto;}
.instaContent {float:left;margin:0px;position:relative;max-width:150px;border: 6px solid white;}
.instaImage {position: absolute;top:0;width:100%;height: 100%;text-align: center;}
.instaImage img {max-height: 100%;}
.imageShadow {width:100%;height:100%;border: 1px solid #ccc;position: absolute;top:0px;left:0px;}
.instaContent a {padding-top: 100%;display: block;position: relative;overflow: hidden;}
.instaContent a:hover .imageShadow {border:1px solid #999;}
#instapicrow {max-width:900px;}
/* END INSTAMDC */


/* START footerbuttons */
ul.footerbuttons { list-style: none outside none; margin:0; padding: 0; text-align: center; }
.footerbuttons li { margin: 0 10px; display: inline; font-size:1.3em;}
.footerbuttons li.footerbuttonsheader {font-size:1em;}
/* END footerbuttons */

#instaFeed {margin:0 !important;padding: 6px 0;}
#socialicons {text-align:left;font-size:1.6rem;letter-spacing: 2px;margin:20px 0;}
#socialicons a {color:black;}
