#home-container {
    background-color: #f1f1f1;
    min-width: 1140px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -4px;
}

#home-left-top-scroller {
    margin-left: 34px;
    top: 170px;
    position: relative;
}

#home-top-playlist {
    margin-top: -85px;
}

#home-top-playlist p {
    font-type: Arial;
    font-size: 12px;
}

#home-top-playlist span {
    color: #ff0000;
}

#home-money-advertisment {
    background-color: #ffffff;
}

#home-learnmore {
    margin-left: auto;
    margin-right: auto;
    width: 980px;
    height:140px;
  background-repeat: no-repeat;
}

/* #home-learnmore p {
    padding-left: 0px;
    font-type: Myriad Pro;
    font-size: 30px;

} */

#home-learnmore img {
    padding-top: 20px;

}

#home-money {
    margin-left: 830px;
    margin-top: -130px;
    width: 980px;
  height:140px;
}
#home-middle-playlist>div:first-child p,.home-middle-playlist>div:first-child p {
    float: left;
    font-size: 20px;
}
#scroller-container{
    position: relative;
}
#home-middle-left-scroller,.home-middle-left-scroller{
    position: absolute;
    top: 100px;
    left:0;
}
#home-middle-right-scroller,.home-middle-right-scroller{
    position: absolute;
    top: 100px;
    right:0;
}

#home-date {
    padding-top:30px;
    height: 20px;
    margin-left: auto;
    margin-right: auto;

}
span.red-line{
    border-left: 4px solid red;
    margin-right:5px;
}
#home-date p {
    font-type: Arial;
    font-size: 22.49px;
}

.videos-row {
    width: 1018px;
    margin-left: auto;
    margin-right: auto;
}

#home-left-top-scroller {
    margin-left: -110px;
    top: 100px;
    position: relative;
}

#home-left-top-scroller:hover {
    cursor: pointer;
}

#home-top-playlist {
    margin-top: 4px;
    height: 400px;
}

#home-top-playlist p {
    font-type: Arial;
    font-size: 12px;
    color: white;
    padding-top: 30px;
    padding-left: 150px;
}

#home-top-playlist span {
    color: #ff0000;
}
.main-video{
    float: left;
    width: 50%;
    height: 400px;
    border: 2px solid rgb(20,20,20);
    background: #000;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    overflow: hidden;
}
.home-featured-player,
.home-featured-player iframe,
.home-featured-player video {
    display: block;
    width: 100%;
    height: 100%;
}
.home-featured-player iframe {
    border: 0;
}
.home-featured-player video {
    background: #000;
    object-fit: contain;
}
.home-player-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 24px;
    box-sizing: border-box;
    color: #aaa;
    text-align: center;
}
.mini-video{
    float: left;
    position:relative;
    width: 25%;
    height: 200px;
}
.mini-video span.play{
    position:absolute;
    width: 50px;
    height: 50px;
    top: 80px;
    left: 135px;
}
.mini-video>div, .main-video>div{
    height: 100%;
    width: 100%;
}

#home-right-top-scroller {
    float: right;
    margin-top: 100px;
    position: relative;
    left: 110px;
}

#home-right-top-scroller:hover {
    cursor: pointer;
}

#home-money-advertisment {
    background-color: #ffffff;
}

#home-learnmore {
    margin-left: auto;
    margin-right: auto;
    width: 980px;
    padding-top: 23px;
}

/* #home-learnmore p {
    padding-left: 0px;
    font-type: Myriad Pro;
    font-size: 30px;

} */
#home-learnmore  ul{
width:600px;

height:80px;
}
#home-learnmore  ul li{
float:left;
padding-right:40px; 
font-weight:bold;
}
#home-learnmore #hip-hop-office {
font-size:18px;
font-weight:bold;
color:#ff0000;
margin-left:15px;
padding-bottom:8px;
}
#home-learnmore img {
    padding-top: 20px;
    margin-top:-40px;
   margin-left:10px;
}

#home-money {
    margin-left: 730px;
    margin-top: -137px;
}

#home-middle-playlist{
    background-color: rgb(38,38,38);
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    padding: 30px 130px;
    color: #fff;
    height: 220px;
}
.home-middle-playlist {
    background-color: rgb(38,38,38);
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    color: #fff;
    height: 220px;
}
#home-middle-playlist>div,.home-middle-playlist>div{
    text-align: center;
}
#home-middle-left-scroller,.home-middle-left-scroller, #home-middle-right-scroller,.home-middle-right-scroller{
    width: 5%;
}
#scroller-container,.scroller-container {
    margin-left: auto;
    margin-right: auto;
}
.home-middle-playlist{
    padding: 30px;
}
.home-middle-playlist h4{
    margin: 10px 120px 0;
}
#home-middle-player,.home-middle-player {
    margin-left: 35px;
    margin-top: -45px;
    width: 100%;
}
#home-middle-player .ad-image{
  margin-left: 0;
}

#home-date {
    height: 20px;
    margin-left: auto;
    margin-right: auto;
}

#home-date p {
    font-type: Arial;
    font-size: 22.49px;
}

.home-video1 {
    background-color: #ffffff;
    width: 310px;
    height: 335px;
    float: left;
    margin-right: 17px;
    margin-top: 37px;

}

#home-banners-row {
    margin-bottom: 20px;
}
#home-banners-row img, #top-banner img{
      border: 13px solid #000000;
      height: 100%;
      width: 100%;
}

#banner-coca {
    float:right;
    width: 460px;
    height: 216px;
    margin: 40px 30px 40px 0;
}

#banner-gitar {
    width: 460px;
    float:left;
    height: 216px;
    margin: 40px 30px 40px 0;
}
#home-banners-row img{
    border: 13px solid #000000;
}

#home-view-more {
    margin-top: 40px;
    text-align: center;
}

#home-view-more p {
    font-size: 18px;
    font-type: Myriad Pro;
    text-align: center;
}

#home-view-more p {
    text-decoration: none;
    color: #fff;
    cursor: pointer;
    width:200px;
    margin:auto;
}

#home-upload-wrap {
    margin-top: 10px;
    background-color: #ffffff;
}

#home-upload {
    width: 980px;
    margin-left: auto;
    margin-right: auto;
}

#home-upload p {
    font-size: 25px;
    font-type: Myriad Pro;
    padding-top: 15px;
}

#home-upload p span {
    color: #ff0000;

}

#home-upload button {
    width: 184px;
    height: 39px;
    color: #ffffff;
    background-color: #000000;
    margin-left: 20px;
}

.home-images1 {
    padding-left: 6px;
    width: 298px;
    height: 178px;
}

.home-images1 img {
    width: 298px;
    height: 178px;
}

.home-video1 p,
.home-video1 h4 {
    padding-left: 10px;
}

.home-video1 p:first-of-type {
    padding-top: 15px;
    font-size: 14px;
    font-type: Arial;
}

.home-video1 h4 {
    padding-top: 18px;
    font-type: Arial;
    font-size: 14px;
}

.home-video1 p:nth-of-type(2) {
    padding-top: 13px;
    font-size: 9px;
    font-type: Arial;
}

.home-video1 p:nth-of-type(3) {
    padding-bottom: 14px;
    font-size: 9px;
    font-type: Arial;
    color: #919191;

}

.home-video1 p:first-of-type span {
    font-size: 7px;
    font-type: Arial;
    color: #888888;
}

.home-video1 span#share-plus {
    position: relative;
    left: 188px;
}

.home-video2 span#share-plus {
    position: relative;
    left: 174px;
}

.home-video6 span#share-plus {
    position: relative;
    left: 90px;
}

#home-top-row {
    width: 980px;
    margin-left: auto;
    margin-right: auto;
}

#home-bottom-row {
    width: 980px;
    margin-left: auto;
    margin-right: auto;
}

#banner-container {
    width: 100%;
}

/* video row style override */
.videos {
    width: 235px;
    margin-right: 0px;
    margin-bottom: 20px;
    position: relative;
    /*height:260px;*/
}

.videos-row div:nth-child(4n) {
    #margin-right: 0px;
}
.videos-row span.play{
    position:absolute;
    width: 50px;
    height: 50px;
    top: 60px;
    left: 95px;
}

.real-video img {
    width: 235px;
}

.real-video {
    #width: 310px;
}

.preview-reader {
    left: 175px;
    top:127px;
}

.is-splash.flowplayer .fp-ui, .is-paused.flowplayer .fp-ui {
    background: url(http://hiphopraw.com/assets/js/flowplayer/skin/img/play_red.png) center no-repeat;
    background-size: 12%;
}
.home-white-wrapper{
    background: transparent;
    width: 1018px;
    margin: 60px auto 30px;
    padding-left:10px;
    padding-bottom: 20px;
    color: #ffffff;
}
.home-white-wrapper h3, #home-middle-playlist h4,.home-middle-playlist h4{
    border-bottom: 2px solid rgb(62,62,62);
}
#abc #popupContact {
position:absolute;
width:600px; 
height:80%;
left:50%;
top:100px;
margin-left:-202px;
font-family:Raleway,sans-serif;
}
.ad-image-2{
    width: 180px;
    height: 138px;
    float: left;
    margin-left: 50px;
}
#abc{
width:100%;
 z-index:100000000000;
 height:1000%;
 opacity:.95;
 top:0;
 left:0;
 display:none;
 position:absolute;
 background-color:#313131;
 overflow:auto;

}
#popupContact #close{
position:absolute;
right:-60px;
top:0px;
cursor:pointer;
}
 #enternal-popup{
background-color:#fff; 
width:750px;
 height:630px;
 padding:20px 0px;
 margin:10px -120px;

 border-radius:5px 5px 0 0;
}
 #enternal-popup #pop-header{
height:45px; 
width:750px; 
background-color:red;

 margin:-20px 0px;
 text-align:left; 
 border-radius:5px 5px 0 0;
}
 #pop-header #left-pop-text{ 
  float:left;
   margin-top:10px;
   margin-left:10px;
  }
  #pop-header #left-pop-text p{   
font-weight:bold;
  font-size:18px;
   color:#fff;
}
 #pop-header #right-pop-text { 
  background-color:#000;
  margin-top:5px;
  padding-top:7px;
  padding-left:10px;
  float:right;
  width:400px;
  height:27px;
 }
 #pop-header #right-pop-text p { 

  font-size:16px;
  float:left;
  
   }
.popup-text-instruct{


}
 .popup-text-instruct #instruct {  
 float:left;
 width:419px;
 padding:10px;
 border-bottom:1px solid #d8d8d8;
 
 }
  .popup-text-instruct #instruct p{
  float:left;
  font-size: 20px;
  font-family: "Arial";
  color: rgb( 9, 9, 9 );
  font-weight: bold;
  text-transform: uppercase;
  line-height: 0.978;
  
  -webkit-transform: matrix( 0.88915850696211,0,0,0.88915850696211,0,0);
  -ms-transform: matrix( 0.88915850696211,0,0,0.88915850696211,0,0);

}
.popup-text-instruct #instruct2{
  float:left;
 width:424px;
 
 padding-top:10px;
 padding-left:10px;
  
  }
.popup-text-instruct #instruct2 p{
  float:left;
  font-size: 14px;
  font-family: "Arial";
  color: rgb( 0, 0, 0 );
  line-height: 1.214;
  -moz-transform: matrix( 1.00552200828899,0,0,1.00552200828899,0,0);
  -webkit-transform: matrix( 1.00552200828899,0,0,1.00552200828899,0,0);
  -ms-transform: matrix( 1.00552200828899,0,0,1.00552200828899,0,0);
 }
 .image-right-pop{
  width:300px;
  height:380px;
  background-color:#000;
  margin-left:440px;
  margin-top:30px;
  padding-top:50px;
  padding-right:3px;
  padding-left:3px;
 border-radius:5px 5px 0 0;

  }
.image-right-pop #images-pop{
border-bottom:2px solid #fff;
padding-bottom:10px;
 float:left;
}
.image-right-pop #join-hip-pop{
float:left;
padding-top:15px;
}
.image-right-pop #join-hip-pop ul {

width:300px;
  font-size: 12px;
  font-family: "Arial";
  color: rgb( 255, 255, 255 );
    -webkit-transform: matrix( 0.71061572730949,0,0,0.70763253730871,0,0);
  -ms-transform: matrix( 0.71061572730949,0,0,0.70763253730871,0,0);
}
.image-right-pop #join-hip-pop ul li {
padding-bottom:4px;
}
.image-right-pop  #pop-button{
width:250px;
padding:10px;
padding-left:25px;
margin:10px;
margin-top:25px;
height:30px;
float:left;
 background-color: #ff0000;
 border-radius:5px 5px 5px 5px;

}
.image-right-pop #pop-button p{
float:left;

  font-size: 19.049px;
  font-family: "Arial";
  
  font-weight: bold;
    -webkit-transform: matrix( 0.92135822612608,0,0,0.92135822612608,0,0);
  -ms-transform: matrix( 0.92135822612608,0,0,0.92135822612608,0,0);
 
}
#last-text-pop{
float:left;
padding-left:10px;
}
#last-text-pop p {
  font-size: 14px;
  font-family: "Arial";
  color: rgb( 0, 0, 0 );
  line-height: 1.214;
  
}
.font-size-pop {
 font-weight:bold;
  font-size: 14px;
  font-family: "Arial";
  color: rgb( 0, 0, 0 );
  line-height: 1.214;
  -webkit-transform: matrix( 1.00552200828899,0,0,1.00552200828899,0,0);
  -ms-transform: matrix( 1.00552200828899,0,0,1.00552200828899,0,0);

}

#join-hip-pop-row{
cursor:pointer;
}
.real-video-home{
  height: 100%;
  width: 100%;
}
.hhr-modern-home {
    max-width: 1440px;
    margin: 0 auto;
    padding: 22px;
    background: #f7f8fb;
    color: #17181c;
    font-family: Arial, sans-serif;
}
.vuemigo-header-wrap { background: #fff !important; border-bottom: 1px solid #e8eaf0; }
.vuemigo-header { display: flex; align-items: center; gap: 20px; width: 100% !important; height: 74px !important; max-width: 1440px; margin: 0 auto; padding: 0 22px; box-sizing: border-box; background: #fff !important; }
.vuemigo-header #hhr-logo-header { position: static !important; width: auto !important; height: auto !important; margin: 0 35px 0 0 !important; }
.vuemigo-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.vuemigo-brand-image { display:block; width:210px; max-width:100%; height:auto; object-fit:contain; }
.vuemigo-brand-mark { position: relative; display: block; width: 38px; height: 38px; border-radius: 10px; background: #ff6413; }
.vuemigo-brand-mark:before { content: ''; position: absolute; left: 11px; top: 8px; border-top: 11px solid transparent; border-bottom: 11px solid transparent; border-left: 18px solid #fff; }
.vuemigo-brand-mark i { position: absolute; right: -4px; top: 3px; width: 18px; height: 8px; border-radius: 6px; background: #1747d1; transform: rotate(32deg); }
.vuemigo-brand-name { color: #1747d1; font-size: 28px; line-height: 1; font-weight: 900; letter-spacing: -.8px; }
.vuemigo-brand-name span { color: #ff6413 !important; }
.vuemigo-header #header-dropdown { display: none; }
.vuemigo-main-nav { display: flex; align-items: stretch; align-self: stretch; gap: 28px; }
.vuemigo-main-nav a { position: relative; display: flex; align-items: center; color: #17181c; font-size: 14px; font-weight: 700; text-decoration: none; }
.vuemigo-main-nav a:hover, .vuemigo-main-nav a.active { color: #ff6413; }
.vuemigo-main-nav a.active:after { content: ''; position: absolute; left: 0; right: 0; bottom: 10px; height: 3px; border-radius: 3px; background: #ff6413; }
.vuemigo-header #header-search-container { position: static; margin: 0 0 0 auto !important; }
.vuemigo-header #search-header { width: 190px; height: 34px; border: 1px solid #dfe2ea; border-radius: 8px; background: #f8f9fb; }
.vuemigo-header #header-search { margin-top: -4px; }
.vuemigo-header #header-email,
.vuemigo-header #header-notification,
.vuemigo-header #header-friends,
.vuemigo-header #header-profile { position: relative; flex: 0 0 auto; margin: 0 !important; }
.vuemigo-header #header-email,
.vuemigo-header #header-notification,
.vuemigo-header #header-friends { width: 34px; border: 0; }
.vuemigo-header #header-profile { display: flex; align-items: center; min-width: 140px; }
.vuemigo-header #header-small-profile-pic { margin: 0; border-color: #1747d1; }
.vuemigo-header #header-profile p { position: static; width: auto; margin: 0 7px; }
.vuemigo-header #header-profile p a { color: #17181c; }
.vuemigo-header #header-name-dropdown { position: static; margin: 0; }
.vuemigo-header .circle { background: #ff6413 !important; }
.hhr-modern-home ~ * { box-sizing: border-box; }
#container { min-width: 0; background: #f7f8fb; }
#top-template-wrap:not(.vuemigo-header-wrap) { height: 70px; background: #fff; border-bottom: 1px solid #eef0f4; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-template { display: flex; align-items: center; width: min(1600px, calc(100% - 60px)); height: 70px; background: #fff !important; }
#top-template-wrap:not(.vuemigo-header-wrap) #hhr-logo-wrapper { position: static; flex: 0 0 auto; width: auto; margin-right: 82px; }
#top-template-wrap:not(.vuemigo-header-wrap) .vuemigo-brand-mark { width: 34px; height: 34px; border-radius: 8px; }
#top-template-wrap:not(.vuemigo-header-wrap) .vuemigo-brand-mark:before { left: 10px; top: 7px; border-top-width: 10px; border-bottom-width: 10px; border-left-width: 16px; }
#top-template-wrap:not(.vuemigo-header-wrap) .vuemigo-brand-name { font-size: 27px; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-wrapper { position: static; flex: 1; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar ul { display: flex; align-items: stretch; height: 70px; gap: 48px; margin: 0; padding: 0; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li { width: auto; background: none; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li img { display: none; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li a { position: relative; display: flex; align-items: center; height: 70px; padding: 0; color: #111318; font-family: Arial, sans-serif; font-size: 14px; font-weight: 600; white-space: nowrap; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li.active a,
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li a:hover { color: #ff6413; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li.active a:after { content: ''; position: absolute; left: 0; right: 0; bottom: 9px; height: 3px; border-radius: 3px; background: #ff6413; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-right-banner { position: static; width: auto; margin: 0; background: none; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-right-banner .sub-header { display: flex; align-items: center; gap: 14px; margin: 0; padding: 0; color: #17181c; line-height: 1; white-space: nowrap; text-align: right; text-transform: none; transform: none; }
#top-template-wrap:not(.vuemigo-header-wrap) #login-btn,
#top-template-wrap:not(.vuemigo-header-wrap) .signup-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 92px; height: 38px; margin: 0; padding: 0 18px; border-radius: 8px; box-sizing: border-box; font-family: Arial, sans-serif; font-size: 13px; font-weight: 800; line-height: 1; }
#top-template-wrap:not(.vuemigo-header-wrap) #login-btn { color: #1747d1; border: 1px solid #4e72e6; background: #fff; }
#top-template-wrap:not(.vuemigo-header-wrap) #login-btn:hover { color: #fff; background: #1747d1; }
#top-template-wrap:not(.vuemigo-header-wrap) .signup-btn { min-width: 112px; color: #fff; border: 1px solid #ff6413; background: linear-gradient(180deg, #ff762f, #f4540a); box-shadow: 0 5px 12px rgba(255,100,19,.2); }
#top-template-wrap:not(.vuemigo-header-wrap) .signup-btn:hover { color: #fff; background: #e94e05; }
.vuemigo-search-button { position: relative; width: 38px; height: 38px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.vuemigo-search-button:before { content: ''; position: absolute; left: 9px; top: 7px; width: 14px; height: 14px; border: 2px solid #17181c; border-radius: 50%; }
.vuemigo-search-button:after { content: ''; position: absolute; left: 24px; top: 23px; width: 9px; height: 2px; border-radius: 2px; background: #17181c; transform: rotate(45deg); transform-origin: left center; }
@media (max-width: 1350px) {
    #top-template-wrap:not(.vuemigo-header-wrap) #hhr-logo-wrapper { margin-right: 35px; }
    #top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar ul { gap: 23px; }
}
@media (max-width: 1080px) {
    #top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li:nth-child(3),
    #top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li:nth-child(4),
    #top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li:nth-child(7) { display: none; }
}
.headline { display: none; }
.hhr-hero-grid { display: grid; grid-template-columns: minmax(0, 2.25fr) minmax(300px, .85fr); gap: 20px; }
.hhr-hero-player { position: relative; min-height: 420px; overflow: hidden; border-radius: 18px; background: #07080b; box-shadow: 0 12px 34px rgba(0,0,0,.16); }
.hhr-hero-player video, .hhr-hero-player iframe { display: block; width: 100%; height: 100%; min-height: 420px; object-fit: contain; border: 0; background: #000; }
.hhr-hero-art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); }
.hhr-hero-player:after { content: ''; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(3,10,28,.96) 0%, rgba(3,10,28,.7) 42%, rgba(3,10,28,.12) 78%), linear-gradient(0deg, rgba(3,10,28,.55), transparent 55%); pointer-events: none; }
.hhr-hero-caption { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 70px 34px 28px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.88)); pointer-events: none; }
.hhr-hero-caption span { color: #ff6413; font-size: 12px; font-weight: 800; letter-spacing: 1.4px; }
.hhr-hero-caption h1 { margin: 7px 0 5px; font-size: 34px; color: #fff; }
.hhr-hero-caption p { max-width: 660px; margin: 0; color: #ddd; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hhr-hero-promo { top: 0; right: auto; bottom: 0; display: flex; width: min(610px, 72%); padding: 44px 38px; flex-direction: column; align-items: flex-start; justify-content: center; background: none; }
.hhr-hero-promo h1 { max-width: 580px; font-size: 44px; line-height: 1.05; }
.hhr-hero-promo p { max-width: 520px; margin-top: 7px; white-space: normal; line-height: 1.45; }
.hhr-hero-actions { display: flex; gap: 12px; margin-top: 25px; pointer-events: auto; }
.hhr-watch-button, .hhr-explore-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 24px; border-radius: 9px; color: #fff !important; font-weight: 800; }
.hhr-watch-button { background: linear-gradient(180deg, #ff762f, #f4540a); box-shadow: 0 8px 18px rgba(255,100,19,.28); }
.hhr-watch-button b { margin-right: 9px; font-size: 15px; }
.hhr-explore-button { border: 1px solid #5e80ed; background: rgba(5,18,54,.72); }
.hhr-hero-empty { display: flex; align-items: center; justify-content: center; min-height: 420px; color: #aaa; }
.hhr-creator-spotlight { padding: 24px; border: 1px solid #e1e3e8; border-radius: 18px; background: #fff; box-shadow: 0 8px 24px rgba(22,28,45,.07); }
.hhr-section-kicker, .hhr-section-heading { display: flex; align-items: center; justify-content: space-between; }
.hhr-section-kicker span { font-size: 18px; font-weight: 800; }
.hhr-modern-home a { color: inherit; text-decoration: none; }
.hhr-section-kicker a, .hhr-section-heading > a { color: #1747d1; font-size: 12px; font-weight: 800; }
.hhr-creator-info { display: flex; align-items: center; gap: 15px; margin: 25px 0 18px; }
.hhr-creator-info img { width: 92px; height: 92px; border-radius: 50%; object-fit: cover; border: 4px solid #f1f2f5; }
.hhr-creator-info h2 { margin: 0 0 6px; font-size: 24px; }
.hhr-creator-info p { margin: 0; color: #777; }
.hhr-creator-stats { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 18px; }
.hhr-creator-stats div { display: flex; flex-direction: column; padding: 0 15px; border-left: 1px solid #ddd; }
.hhr-creator-stats div:first-child { padding-left: 0; border: 0; }
.hhr-creator-stats strong { font-size: 22px; }
.hhr-creator-stats span { color: #777; font-size: 12px; }
.hhr-primary-button { display: block; padding: 12px; border-radius: 8px; color: #fff !important; background: #1747d1; text-align: center; font-weight: 800; box-shadow: 0 7px 16px rgba(23,71,209,.2); }
.hhr-secondary-button { display: block; margin-top: 9px; padding: 10px; border: 1px solid #1747d1; border-radius: 8px; color: #1747d1 !important; text-align: center; font-weight: 800; }
.hhr-guest-profile { padding-top: 42px; text-align: center; }
.hhr-guest-profile p { max-width: 260px; margin: 10px auto 25px; color: #737780; line-height: 1.5; }
.hhr-guest-avatar { display: grid; place-items: center; width: 92px; height: 92px; margin: 0 auto 18px; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #1747d1, #ff6413); font-size: 25px; font-weight: 900; }
.hhr-spotlight-label { margin: 22px 0 10px; font-size: 14px; }
.hhr-mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.hhr-mini-grid img { display: block; width: 100%; aspect-ratio: 4/3; border-radius: 8px; object-fit: cover; }
.hhr-content-section { margin-top: 22px; padding: 18px; border-radius: 16px; background: #fff; border: 1px solid #e8e9ed; }
.hhr-section-heading { margin-bottom: 14px; }
.hhr-section-heading h2 { margin: 0; font-size: 18px; }
.hhr-section-heading h2 span { color: #ff6413; }
.hhr-video-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.hhr-video-card { min-width: 0; }
.hhr-card-media { position: relative; display: block; overflow: hidden; border-radius: 10px; background: #111; }
.hhr-card-media img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; transition: transform .2s ease; }
.hhr-placeholder-card .hhr-card-media { aspect-ratio: 16/9; background: linear-gradient(135deg, #eef2ff, #fff2e9); border: 1px dashed #bac4df; }
.hhr-placeholder-icon { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 42px; height: 42px; transform: translate(-50%, -50%); border-radius: 50%; color: #fff; background: #1747d1; }
.hhr-card-media:hover img { transform: scale(1.035); }
.hhr-card-play { position: absolute; left: 10px; bottom: 9px; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: #ff6413; display: grid; place-items: center; font-size: 11px; }
.hhr-card-views { position: absolute; right: 7px; bottom: 7px; padding: 4px 6px; border-radius: 5px; color: #fff; background: rgba(0,0,0,.78); font-size: 10px; }
.hhr-card-badge { position: absolute; z-index: 2; left: 7px; top: 7px; padding: 4px 7px; border-radius: 4px; color: #fff; background: #1747d1; font-size: 9px; font-weight: 800; }
.hhr-video-card h3 { margin: 8px 0 3px; font-size: 14px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hhr-video-card p { margin: 0; color: #7a7d84; font-size: 11px; }
@media (max-width: 1180px) { .vuemigo-main-nav { gap: 14px; } .vuemigo-header #header-search-container { display: none; } }
@media (max-width: 1050px) { .vuemigo-main-nav { display: none; } .hhr-hero-grid { grid-template-columns: 1fr; } .hhr-video-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 680px) { .hhr-modern-home { padding: 12px; } .hhr-hero-player, .hhr-hero-player video, .hhr-hero-player iframe { min-height: 280px; } .hhr-video-row { grid-template-columns: repeat(2, 1fr); } .hhr-hero-caption h1 { font-size: 24px; } }

/* VueMigo reference button alignment */
#top-template-wrap:not(.vuemigo-header-wrap) #top-right-banner { display: flex !important; align-items: center !important; justify-content: flex-end !important; margin-left: 26px !important; }
#top-template-wrap:not(.vuemigo-header-wrap) #top-right-banner .sub-header { display: flex !important; align-items: center !important; gap: 14px !important; }
#top-template-wrap:not(.vuemigo-header-wrap) a#login-btn { min-width: 92px !important; height: 38px !important; margin: 0 !important; padding: 0 18px !important; border: 1px solid #4169e1 !important; border-radius: 8px !important; color: #1241c4 !important; background: #fff !important; box-shadow: none !important; }
#top-template-wrap:not(.vuemigo-header-wrap) a#login-btn:hover { color: #fff !important; background: #1747d1 !important; }
#top-template-wrap:not(.vuemigo-header-wrap) a.signup-btn { min-width: 120px !important; height: 38px !important; margin: 0 !important; padding: 0 20px !important; border: 1px solid #ff5b0b !important; border-radius: 8px !important; color: #fff !important; background: linear-gradient(180deg, #ff7429 0%, #f45108 100%) !important; box-shadow: 0 5px 12px rgba(244,81,8,.2) !important; }
.hhr-explore-button b { margin-right: 9px; color: #4d79ff; font-size: 17px; }
.hhr-hero-actions .hhr-watch-button { min-width: 208px; min-height: 48px; padding: 0 24px; background: linear-gradient(180deg, #ff7429 0%, #f45108 100%); }
.hhr-hero-actions .hhr-explore-button { min-width: 178px; min-height: 48px; padding: 0 22px; border: 1px solid #3264ed; background: rgba(5,18,54,.82); }

/* Keep navigation and account actions in separate horizontal lanes. */
#top-template-wrap:not(.vuemigo-header-wrap) #hhr-logo-wrapper {
    margin-right: 42px !important;
}
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-wrapper {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0;
}
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar ul {
    justify-content: center;
    gap: clamp(18px, 2vw, 38px);
}
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li,
#top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li a {
    flex: 0 0 auto;
    white-space: nowrap !important;
}
#top-template-wrap:not(.vuemigo-header-wrap) #top-right-banner {
    flex: 0 0 344px !important;
    width: 344px !important;
    min-width: 344px !important;
    margin-left: 22px !important;
}
#top-template-wrap:not(.vuemigo-header-wrap) #top-right-banner .sub-header {
    width: 100%;
    justify-content: space-between;
    gap: 16px !important;
}
#top-template-wrap:not(.vuemigo-header-wrap) .vuemigo-search-button {
    flex: 0 0 40px;
    margin-right: 2px;
}
#top-template-wrap:not(.vuemigo-header-wrap) a#login-btn {
    flex: 0 0 94px;
}
#top-template-wrap:not(.vuemigo-header-wrap) a.signup-btn {
    flex: 0 0 124px;
}
@media (max-width: 1250px) {
    #top-template-wrap:not(.vuemigo-header-wrap) #hhr-logo-wrapper { margin-right: 22px !important; }
    #top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar ul { gap: 16px; }
    #top-template-wrap:not(.vuemigo-header-wrap) #top-navigation-bar li a { font-size: 12px; }
    #top-template-wrap:not(.vuemigo-header-wrap) #top-right-banner { flex-basis: 326px !important; width: 326px !important; min-width: 326px !important; margin-left: 14px !important; }
}