body {
  margin: 0px 0px 0px 0px;
  font-family: 'Open Sans', sans-serif;
  font-size: 100%;
  color: #ffffffc6;
  background-color: #091214;
  /*;#080808; #CFCDAC;*/
  background: url('../projects/junction-point/haar.jpg') no-repeat center fixed;
  /* background-repeat: repeat-x; */
  background-size: cover;
  /*#F8FFF8; */
  text-decoration: none;
  font-weight: normal;
  line-height: normal;
}

p {
  font-size: 0.75em;
  margin: 0px;
}

p#pline {
  margin-top: 12px;
}

p#pline2 {
  margin-top: 8px;
}

p#visDetail {
  margin-top: 8px;
}

div#content {
  position: absolute;

  /* left: 50%; */
  margin:auto;
  top: 15px;
  width: 100%;
  height: 900px;
  align-items: center;
  /* background-color: #006b97; */
  /*#F9F9F8; #CFCDAC; #292918;*/
}

/* @media only screen and (max-width: 946px) {
  div#content {

    left: 0px;
    margin: auto;
    top: 15px;
    height: 1000px;
    width: 430px;

    /* background-color: rgb(255, 143, 68); */

  /* } */
/* } */ 

div#example {
  position: absolute;
  top: 248px;
  left: 0px;
  height: 506px;
  width: 900px;
  /*border: solid 2px #E0E0E0;*/
  clear: both;
  overflow: none;
}

@media screen and (max-width: 946px) {
  div#example {
    width: 87%;
    margin-left: auto;
    left: 10%;
  }

}


div#title {
  z-index: 500;
  position: absolute;
  top: 40px;
  left: 50%;
  margin-left: -200px;
  width: 200px;

}

/* @media screen and (max-width: 946px) {
  div#title {
    margin: auto;
    margin-left: 18px;
    width: 80%;
  }

} */

div#textcontent {
  z-index: 500;
  position: absolute;
  top: 100px;
  left: 50%;
  margin-left: -200px;
  width: 400px;
  line-height: 20px;
}

div#textcontent2 {
  z-index: 500;
  position: absolute;
  top: 100px;
  left: 470px;
  width: 400px;
  line-height: 20px;

}


/* @media only screen and (max-width: 946px) {
  div#textcontent {
    top: 130px;
    margin-left: 18px;
    width: 88%;
  }

} */


@media only screen and (max-width: 946px) {
  div#textcontent2 {
    top: 330px;
    margin: auto;
    margin-left: -422px;

    width: 88%;

    /* visibility: hidden;
    content-visibility: hidden; */
  }

}

div#galleryImg {
  z-index: 500;
  position: absolute;
  top: 695px;
  left: 129px;
}

img#galleryImg {
  position: absolute;
  top: 0px;
  left: 0px;
}

div#cap2 {
  position: absolute;
  top: 788px;
  left: 30px;
  font-size: 0.90em;
}

div#cap1 {
  z-index: 200;
  position: absolute;
  top: 185px;
  left: 30px;
  font-size: 0.90em;
}

div#more {
  position: absolute;
  top: 918px;
  left: 30px;
  font-size: 0.90em;
}

img#bigStart {
  position: absolute;
  top: 0px;
  left: 0px;
}


div#video {
  z-index: 500;
  width: 750px;
  position: absolute;
  top: 280px;
  /*420px*/
  /* left: 30px;  */
  /*156px*/

  left: 50%;
  margin-left: -372px;
  padding-right: 0px;
  align-items: center;
}

@media screen and (max-width: 946px) {
  div#video {
    top: 280px;
    width: 87%;
    margin-left: auto;
    left: 7%;
  }

}

div#vis1 {
  z-index: 500;
  position: absolute;
  top: 155px;
  left: 70px;
  font-size: 0.90em;
}


div#info {
  z-index: 500;
  position: absolute;
  top: 1255px;
  left: 24px;
  font-size: 0.90em;
}


p#videoTitle {
  position: absolute;
  color: #585853;
  top: 1382px;
  left: 20px;
  width: 950px;
}

hr {
  width: 910px;
  position: absolute;

  top: 1390px;
  left: 20px;
  border-top: 1px dotted #9F9F9F;
  border-bottom: 1px solid #F9F9F9;
}


div#back {
  position: absolute;
  top: 10px;
  left: 290px;
  font-size: 0.75em;
}

a {
  color: #666666;
}

a:link {
  color: #666666;
  text-decoration: none;
}

a:visited {
  color: #666666;
  text-decoration: none;
}

a:active {
  color: #666666;
  text-decoration: underline;
}

a:hover {
  color: #FF6600;
  text-decoration: underline;
}


a.info:link {
  color: #88CCCC;
  text-decoration: none;
}

a.info:visited {
  color: #88CCCC;
  text-decoration: none;
}

a.info:active {
  color: #88CCCC;
  text-decoration: underline;
}

a.info:hover {
  color: #FFFFFF;
  text-decoration: underline;
}

p#copyright {
  position: relative;
  margin-top: 206px;
  left: 50%;
  margin-left: -43px;
  z-index: 500;
  text-align: left;
  color: #999999;
  font-size: 0.65em;
  line-height: 15pt;
  width:fit-content;
}

p#controls {

  line-height: 15pt;
}

span.emphasis {
  /*font-style:italic;*/
  color: #F9F9F9;
  /*#E9E9D0; */
  /*#FEFCD3; 585853;*/
  font-size: 1.10em;
  font-weight: normal;
}

img#vg1,
#vg2 {
  border: #888888;
  border-width: 0px;
  border-style: solid;
  border-radius: 0cap;
  padding-top: 5rem;
}