html {
    width: 100%;
    height: 100%;
    margin: 0px auto;
    overflow-y: auto;
    overflow-x: hidden;
}
body {
    font-family: 'Helvetica Neue', arial, sans-serif;
    font-size: 13px;
    font-weight: normal;
    color: #101010;
    margin: 0px auto;
    overflow: hidden;
}
img {
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#bg-white {
  width:100%;
  height:100vh;
  z-index:-9999999999999999999999999999999999999999999999999999999999999;
}
#bg-white img{
  width:100%;
  height:100vh;
}
#tc {
    display: none;
}
.percent {
    display: none;
}
#zoom_triggers {
    position: fixed;
    top: 8px;
    right: 8px;
    list-style-type: none;
    display: block;
    cursor: pointer;
    margin: 0;
    padding: 0;
    z-index: 9999999999999999999;
}
#zoom_triggers a {
    text-decoration: none;
    border-bottom: 0px;
}
#zoom_triggers ul {}
#container {
    display: block;
    margin: 0px auto;
    width: 100%;
    height: 100vh;
}
#content {
    width: 100%;
    padding-left: 40px;
    padding-top: 24px;
    height: auto;
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    z-index: 9999999999999999999;
}
h1 {
    padding: 0px;
    text-transform: uppercase;
    font-size: 1.4em;
    cursor: pointer;
    white-space: nowrap;
}
#selected {
    display: none;
}
#nav {
    width: auto;
    z-index: 999999999999999999999;
    padding-right: 72px;
    cursor: pointer;
}
.subnav {
    padding-top: 6px;
    display: block;
}
.selnav {
    padding-top: 16px;
}
.active {
    color: #ff0000;
    border-bottom: #ff0000 1px solid;
}
.hashed {
  border-bottom:0px;
}
.selected a{
  border-bottom: 1px solid #101010;
}
/* .mailing {
  height:0px;
  padding:0px;
  margin:0px;
} */
ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}
li:first-child {
    padding-top: 0px;
}
li {
    padding-top: 8px;
}
a.close {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
li a {
    text-decoration: none;

    padding-bottom: 0px;
}
li a:hover {
    text-decoration: none;
    border-bottom: 0px;
}
p:first-child {
    text-align: left;
}
p {
    padding-right: 100px;
    text-align: left;
}
#textall {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1em;
    padding-left: 16px;
    line-height: 1.4em;
    margin-top: 39px;
}
.text {
    display: none;
    box-sizing: border-box;
    max-width: 960px;
    min-width: 100px;
}
.text a {
  text-decoration: underline;
}
#form {
    position: fixed;
    z-index: 9999999999999999999999999;
    bottom: 20px;
    width: 100%;
    font-size: 0.9em;
}
#form_l {
    float: left;
    margin-left: 16px;
}
#form_r {
    float: right;
    margin-right: 16px;
}
a {
    color: #101010;
    text-decoration: none;
    padding-bottom: -1px;
}
a:hover {
    border-bottom: 0px;
}
.wrapper {
    display: table;
    width: auto;
    position: relative;
    width: 50%;
}
#play {
    background-image: url('img/play.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0%;
    right: 0%;
    top: 0%;
    bottom: 0%;
    margin: auto;
    z-index: 999999;
}
.share {
    border-bottom: 1px solid #101010;
    padding-bottom: -1px;
}
a.reset {
    color: red;
}
.whitespace-wrap {
      white-space:nowrap;
}
.a {
    cursor: url('img/cursor.png') 4 12;
    cursor: pointer;
    color: #101010;
    border-bottom: 1px solid #101010;
    padding-bottom: -1px;
}
.a hover {
    border-bottom: 0px;
}
.nonurl {
    border-bottom: 0px;
}
#frame {
  pointer-events: none;
}
#other1 {
  display: none;
}
#other2 {
  display: none;
}
/* placeholder for the img, gif, video */
/*video::-webkit-media-controls-panel {*/
/*  width: 40px;*/
/*}*/

#placeholder {
    display: none;
    float: left;
    position: absolute;
    padding: 0px;
    margin: 0px auto;
    box-sizing: border-box;
    z-index: 0;
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#placeholder img {
    width: 100%;
    height: auto;
}
#placeholder video {
    width: 100%;
    height: auto;
}
.transition {
    -webkit-transition: 400ms all ease-in;
    transition: 400ms all ease-in;
}
.resize-icon {
    width: 16px;
    height: 16px;
    bottom: 7px;
    right: 7px;
    position: absolute;
    z-index: 10000;
    background-image: url('img/resize.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}
.move {
    float: left;
}
.front {
    z-index: 100;
}
.top {
    z-index: 2;
    position: relative
}
.bottom {
    z-index: 1;
    position: relative
}
#capture {
    position: fixed;
    top: 0px;
    right: 0px;
}
form {
    color: #000;
}
#url {
    display: none;
}
#copy {
    display: none;
}
#capt {
    display: none;
}
#play {
    position: absolute;
    z-index: 99999;
    width: 100%;
    height: 100%;
}
.playbutton {
    width: 100%;
    height: 100%;
    color: red;
    z-index: 9999999;
}
.caption {
    display: none;
    padding-top: 10px;
    font-style: italic;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.caption-inner a {
  text-decoration: underline;
}
.caption-inner {
    display: none;
    border: 0px solid #101010;
    padding: 10px;
    text-align: left;
    width: auto;
    font-size: 0.8em;
}
.caption-inner-show a {
  text-decoration: underline;
  font-size: 1em;
}
.caption-inner-show {
    border: 0px solid #101010;
    padding: 10px;
    text-align: left;
    width: auto;
    font-size: 0.8em;
}
#short {
    display: none;
}
form {
  width:150%;
}
form:after{
  content:'';
  display:block;
  clear:both;
}
/* STRIPE */
/**
 * The CSS shown here will not be introduced in the Quickstart guide, but shows
 * how you can use CSS to style your Element's container.
 */
.StripeElement {
  box-sizing: border-box;

  height: 40px;

  padding: 10px 12px;

  border: 1px solid transparent;
  border-radius: 4px;
  background-color: white;

  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}
/* FORM STUFF BEGINS HERE */
#address {
  display: none;
}
form{
  font-size:100%;
  padding:0px;
  width:240px;
  margin-top: 0px;
}
form div {
  padding:0px;
}
label{
  display:block;
  color:#000;
  margin:0px 0 3px;
  text-transform: lowercase;
}
fieldset label{
  display:inline-block;
  font-size:85%;
  font-family: Calibri, sans-serif;
}
input[type=text],
input[type=email],
input[type=tel],
textarea,
select{
  width:100%;
  padding:5px;
  box-sizing:border-box;
  border: solid 1px #ccc;
}
textarea{
  resize: vertical;
  min-height: 70px;
}
fieldset{
  border:none;
  margin:20px 0 ;
  padding:10px 0;
  border-bottom: 1px solid tan;
}
button {
    background-color: #000; /* Green */
    border: none;
    color: white;
    padding: 8px 24px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}
#form1 {
  display:none;
}
#form2 {
  display:none;
}
#sharelinks {
  display:none;
}
#sharelinks a{
  text-decoration: none;
}
#sharelinks a:hover{
  text-decoration: none;
  animation-name: slideRight;
  animation-fill-mode: both;
  animation-duration: 800ms;
}
@keyframes slideRight {
  0% {
    margin-left:0px;
  }
  50% {
    margin-left:4px;
  }
  100% {
    margin-left:0px;
  }
}
/*.one {
  top:-999999999999px;
  left:-999999999999px;

}
.two {
  top:-999999999999px;
  left:-999999999999px;

  height:auto;
}
.three {
  top:-999999999999px;
  left:-999999999999px;

  height:auto;
}
.four {
  top:-999999999999px;
  left:-999999999999px;;

  height:auto;
}
.five {
  bottom:-999999999999px;
  left:-999999999999px;

  height:auto;
}
.six {
  bottom:-999999999999px;
  left:-999999999999px;

  height:auto;
}
.seven {
  bottom:-999999999999px;
  left:-999999999999px;

}
.eight {
  bottom:-999999999999px;
  left:-999999999999px;

}
.nine {
  bottom:-999999999999px;
  left:-999999999999px;

}
.ten {
  bottom:-999999999999px;
  left:-999999999999px;

}
.eleven {
  bottom:-999999999999px;
  left:-999999999999px;

}*/

@media (max-width: 960px) {
    body {
        font-size: 12px;
    }
    #textall {
        margin-top: 36px;
    }
}
@media (max-width: 640px) {
    body {
        font-size: 10px;
    }
    a.close {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
    }
    #content {
        padding-left: 16px;
        padding-top: 16px;
    }
    #nav {
        width: 100px;
        overflow: visible;
    }
    .subnav {
        display: block;
    }
    p {
        margin-right: 0px;
        padding-right: 40px;
    }
    #form {
        width: 100%;
        line-height: 1.5em;
        display: none;
    }
    #textall {
        margin-left: -20px;
        margin-top: 32px;
    }
    .text {}
    #zoom_triggers {
        display: none;
    }
    #popup {
        display: none;
    }
    #form_l {
        width: 100%;
        text-align: center;
        margin: 0px;
    }
    #form_r {
        width: 100%;
        text-align: center;
        margin: 0px;
    }
    .share {
        display: none;
    }
}