white line appearing between 2 div's

I am trying to get rid of a thin white line that appears between the 1st 2 Div's of my website ("video_main" and "parallax"). I thought this might be an artifact of the video so I cropped the bottom in export from Premiere Pro CC but it still appears. I tried making a margin, padding and border 0px for the video_main and parallax div's but it doesn't get rid of the thin white line. Can anyone tell why it's happening? Many thanks.

<!DOCTYPE HTML>
<html>

<head>
  <script src="//content.jwplatform.com/libraries/YQ8opLwo.js">
  </script>
  <script src="https://use.typekit.net/qkv6kzb.js"></script>
  <script>
    try {
      Typekit.load({
        async: true
      });
    } catch (e) {}
  </script>
  <script src="https://use.typekit.net/qkv6kzb.js"></script>
  <script>
    try {
      Typekit.load({
        async: true
      });
    } catch (e) {}
  </script>
  <meta charset="UTF-8">
  <title>Barton's website</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
  <div class="video_main">
    <video width="100%" height="100%" autoplay="autoplay" loop="loop" muted="muted" preload>
    <source src="red_hook_rush_hour_trimmed.mp4" type="video/mp4">
        </video>
    <div class="content">
      <h1>Barton Lewis</h1>
      <h2>films about light and the urban landscape</h2>
      <div class="videolinks">
        <p><a href="index.html" title="home">home</a></p>
        <p><a href="bartons_film_site_works.html" title="works">works</a></p>
        <p><a href="bartons_film_site_bio.html" title="bio">bio</a></p>
        <p><a href="bartons_film_site_cv.html" title="c/v">CV</a></p>
        <p><a href="bartons_film_site_contact.html" title="contact">contact</a></p>
      </div>
    </div>
  </div>
  <div class="parallax">
    <div class="container_blank_space">
      <p>text</p>
    </div>
    <section class="wrapper_pano_and_text">
      <div class="pano">
        <img src="https://bartonlewisfilm.com/barton-3.jpg" alt="barton" width="auto" height="auto" />
      </div>
      <div class="pano_text">
        <p>text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here text goes here.</p>
      </div>
    </section>
  </div>
</body>

</html>

/* http://meyerweb.com/eric/tools/css/reset/ 
       v2.0 | 20110126
       License: none (public domain)
    */

* {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}


/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
paragraph {
  display: block;
}

body {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}


/*THIS IS THE END OF THE MYER RESET*/

body {
  width: 100%;
  margin: 0 auto 0;
}

a {
  font-family: "europa", sans-serif;
  text-align: left;
  text-decoration: none;
  letter-spacing: 3px;
  font-size: 22px;
  color: white;
}

a:hover {
  text-decoration: underline;
}

.parallax {
  /* The image used */
  background-image: url("https://bartonlewisfilm.com/html_bckgd_1024.jpg");
  /* Set a specific height */
  height: 1620px;
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.video_main {
  margin: 0 auto 0;
  width: 100%;
  height: auto;
  overflow: hidden;
}

.video_main video {
  /*width: 100%;*/
  width: 100%;
  height: auto;
  min-width: 720px;
  margin: 0 auto;
  z-index: -1500;
}

.content h1 {
  font-family: "jaf-domus-titling-web", sans-serif;
  color: white;
  text-align: center;
  font-size: 400%;
  letter-spacing: 4px;
  z-index: 100;
  position: absolute;
  top: 50px;
}

.content h2 {
  font-family: "europa", sans-serif;
  color: white;
  text-align: center;
  font-size: 225%;
  letter-spacing: 6px;
  z-index: 100;
  position: absolute;
  top: 175px;
}

.content p {
  font-family: "europa", sans-serif;
  color: white;
  font-size: 120%;
}

h1 {
  width: 100%;
}

h2 {
  width: 100%;
}

.content .videolinks {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 100;
}

.videolinks p {
  padding: 20px;
  padding-left: 60px;
}

.videolinks p:first-child {
  padding-top: 250px;
}

.wrapper_pano_and_text {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  padding-top: 0px;
  justify-content: center;
  align-items: center;
}

.pano img {
  width: 100%;
  height: 100%;
  padding: ;
  z-index: -1500;
}

.pano_text {
  width: 45%;
  overflow: hidden;
  z-index: 100;
  position: absolute;
}

.pano_text p {
  font-family: "europa", sans-serif;
  font-size: 150%;
  padding-right: 80px;
  letter-spacing: px;
  color: white;
  font-weight: 500;
  line-height: 135%;
  font-weight: 500;
}

.container_blank_space {
  height: 75px;
}

.container_blank_space p {
  text-indent: -9999px;
}