.hero-image-n {
    background-image: url("https://www.tero.com/images/mountain4k.webp");
    height: 300px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    margin-top: 140px;
}

.new-video-clip{
    width: 100%;
    height: auto;
}

.desktop-video-clip{
    display: none;
}

.new-video-container{
    display: flex;
    align-items: flex-end;
    height: 50vh;
    overflow: hidden;
    /* margin-bottom: 5vh; */
}

.hero-image-mobile{
    width: 100%;
    display: none;
}

.hero-image-mobile img{
    max-width: 100%;
    max-height: 100%;
}

.hero-text-new{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    height: 100%;
}

.hero-text-new h1{
    color: white;
    text-shadow: 2px 2px 15px #000000;
}

.hero-text-new h2{
    color: white;
    text-shadow: 2px 2px 15px #000000;
}

.hero-text {
    float: left;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    text-shadow: 2px 2px 15px #000000;
    text-align: center;
}

.responsive-youtube{
    overflow: hidden;
    padding-bottom: 56.25%;
    width: 90%;
    position: relative;
    margin: 4vmax 0;
}

.responsive-youtube iframe{
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}

@media screen and (min-width:390px){
 

    .new-video-container{
        height: 40vh;
    }
}


@media screen and (min-width:430px){
    .hero-image-n {
     height: 300px;
    }

}

@media screen and (min-width:768px){
    .hero-image-n {
     margin-top: 190px;
     height: 350px;
    }

    .responsive-youtube{
        margin: 4vmin 0;
    }
}

@media screen and (min-width: 815px){
    .hero-image-n {
     height: 400px;
    }
}

@media screen and (min-width: 900px){
    .hero-image-n {
     height: 450px;
    }
}

@media screen and (max-width: 999px){
    .hero-text-new span{
        display: block;
    }
}

@media screen and (min-width: 1000px){
    .hero-image-n {
        background-image: url("https://www.tero.com/images/mountain4k.webp");
        height: 100%;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: relative;
    }

    .responsive-youtube{
        padding-bottom: 0%;
        width: 50%;
        height: 50vh;

    }

    .responsive-youtube iframe{
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        position: absolute;
    }
}

/* styles for the video */

  
  /* TABLETS */
  
  @media screen and (min-aspect-ratio: 9/16){
    
    .new-video-container{
        height: 55vh;
    }
  }
  
  
  /* DESKTOP / HORIZONTAL */
  
  @media screen and (min-aspect-ratio: 1/1){

    .new-video-container{
        height: 90vh;
        margin-top: 20vh;
    }


    .mobile-only{
        display: none;
    }

    .desktop-video-clip{
        display: block;
        width: 100%;
        height: auto;
        margin-top: 10vh;
    }
  }