html, body{
  height:100%;
  scroll-behavior: smooth;
}

body {
  font-family: 'Roboto', Arial, sans-serif;
  display: flex;
  flex-direction:column;
  background-color:#fff;
  overflow-x:hidden;
}

/* Containers */
.content {
    max-width:1170px;
    width:100%;
    margin: 30px auto;
    flex: 1 0 auto;
}

.content-content-marketing {
    max-width:1170px;
    width:100%;
    margin: -50px auto;
    flex: 1 0 auto;
}

.content-container{
  position: sticky;
  top:calc(20% - 2em);

}

.bg-light{
  background-color:#fff !important;
}

.band-container {
  padding: 60px 40px;
  margin: 20px 0px;
}
.band-gray{
  background-color:#eee;
}

/* Top Elements */
.sm-navbar{
  width:200px;
  margin-bottom: -10px;
}

.element-border{
  border: 13px #ddd solid;
}

.sticky-top{
  border-bottom: 1px solid #eee;
  z-index: 1 !important;
}
.navbar-brand{
  margin-top: -13px;
  margin-right: 50px;
}
.lc-circle-logo{
  opacity:0;
  margin-top:0px;
  top:35px;
  position:inherit;
}
.logo-roll{
  padding:20px 20px;
  opacity:0;
  top:10px;
  position:relative;
}
.fade-text{
  opacity:0;
  top:10px;
  position:relative;
}

.heart-anim{

}

.text-box-fade{
  opacity:0;
}

/*-- Footer --*/
.footer-content{
  max-width:1170px;
  width:100%;
  margin:auto;
  padding:20px 0px 20px;
}
.footer {
  flex-shrink: 0;
  color:#fff;
  background-color:#353433;
}
.footer-attribution{
  font-size: 0.75em;
  line-height: 1.6em;
  clear:both;
}
.footer-col-right{
  float:right;
  text-align:right;
}

/*-- General styling --*/

.text-center {
  text-align:center;
}

.spacer-10 {
  margin-top: 10px;
}

.spacer-20 {
  margin-top: 20px;
}

.spacer-50 {
  margin-top: 50px;
}

/* Home JS Stuff */
.hey-text{
  position:relative;
  top:10px;
  opacity:0;
}
.lc-logo-home{
  position:relative;
  top:10px;
  opacity:0;
}
.text-move-right{
  position:relative;
  left:-20px;
  opacity:0;
}
.box-1, .box-2{
  opacity:0;
}

/* Marketing Page JS Stuff */

.content-block-l{
  padding:0px 25px 0px 15px;
}

.content-block-c{
  padding:0px 20px 0px 20px;
}

.content-block-r{
  padding:0px 15px 0px 25px;
}

.vid-embed{
  padding:56.3% 0 0 0;
  position:relative;
}

.vid-expand{
  height:100%;
}
.vid-popup {
  width:50%;
  height:initial;
  padding: 0px 20px 20px;
  background-color:#fff;
  border-radius:10px;
  position: fixed;
  top: 10%;
  left: 25%;
  display:none;
  z-index:9;
}
.vid-thumb{
  transition:0.5s ease;
}
.vid-thumb:hover{
  filter: brightness(50%);
  transition:0.5s ease;
}
.vid-thm{
  position:relative;
}
.vid-thm::after{
  position:absolute;
  top:20%;
  left:45%;
  font-family:"Font Awesome 5 Free";
  font-weight:900;
  content:"\f04b";
  font-size:6em;
  pointer-events: none;
  color:#fff;
  opacity:0.8;

}
.vid-popup-title{
  float:left;
  font-family: 'Roboto Slab', Arial, sans-serif;
  font-size:1.7em;
  transition: 0.5s ease;
  text-align:left;
  padding-top: 5px;
}
#popup-bg{
  position:fixed;
  width:100%;
  height:100%;
  background-color:#000;
  opacity:0.3;
  display:none;
  z-index: 1;
}
.close-icon{
  font-size:40px;
  color:#eb9622;
  transition: 0.5s ease;
}
.close-icon:hover{
  color:#c37a15;
  transition: 0.5s ease;
}
.close-vid{
  margin: 8px 0px 5px;
  text-align:right;
}

/*-- Text Styling --*/

p{
  font-size:1em;
  color:#353433;
}

h1.feature-title{
  font-family: 'Roboto Slab', Arial, sans-serif;
  font-size: 4em;
  padding-bottom: 10px;
}

h1.feature-title-sm{
  font-family: 'Roboto Slab', Arial, sans-serif;
  font-size: 2.5em;
  padding-bottom: 10px;
}


h2.featured-subtitle{
  font-family: 'Roboto Slab', Arial, sans-serif;
  font-size:2em;
}

h3.featured-subtitle{
  font-family: 'Roboto Slab', Arial, sans-serif;
  font-size:1.7em;
  transition: 0.5s ease;
}

h3.featured-subtitle:hover{
  color:#eb9622;
  transition: 0.5s ease;
}

.feature-type{
  font-size:1.1em;
  font-weight:300;
  text-align:justify;
}

.text-orange {
  color:#eb9622;
}
.text-gray{
  color:#888;
}
.text-darkgray{
  color:#353433;
}
.text-white{
  color:#fff;
}
.text-red{
  color:#b51d1d;
}

a {
  color:#eb9622;
  text-decoration:none;
  transition: all 0.2s ease;
}

a:hover {
  color:#c37a15;
  text-decoration:none;
  transition: all 0.2s ease;
}

a.footer-links{
  color:#fff;
  text-decoration:none;
  transition: all 0.2s ease;
}

a.footer-links:hover{
  color:#eb9622;
  text-decoration:none;
  transition: all 0.2s ease;
}

.bitcoin-button{
  background-color:#353433;
  color:#fff;
  padding:10px 5px;
  border-radius: 3px;
  text-align:center;
  border: 2px solid #4c4b4b;
}

.navlinks {
    background-color: #eee;
    padding: 15px 0;
    margin: auto;
    border-radius: 10px;
    font-weight: bold;
}

/*-- Form Shit --*/

input.contact-email, textarea.contact-message{
  width:100%;
  padding:5px 10px;
  margin: 10px 0px;
  border-radius:3px;
  border: 1px solid #ddd;
}

.button-default {
  padding:10px 20px;
  background-color:#eb9622;
  color:#fff;
  font-weight:400;
  min-width:150px;
  border:none;
  transition: all 0.2s ease;
}

.button-default:hover, .button-default:not(:disabled):not(.disabled):active, .button-default:focus{
  text-decoration:none;
  background-color:#c37a15;
  color:#fff;
  transition: all 0.2s ease;
  box-shadow:none;
}

.button-gray{
  padding:10px 20px;
  text-decoration:none;
  background-color:#bbb;
  color:#fff;
  transition: all 0.2s ease;
  box-shadow:none;
}

.button-gray:hover{
  text-decoration:none;
  background-color:#eee;
  color:#fff;
  transition: all 0.2s ease;
  box-shadow:none;
}

/*-- Mobile --*/

@media only screen and (max-width:768px){
  .vid-popup-title{
    font-size:1.2em;
    width:80%;
  }
  .vid-popup{
    top:25%;
    width:95%;
    left:2.5%;
    height:initial;
  }
  .vid-thm::after{
    top:12%;
  }
  .nav-link {
    padding: 1.5rem 1rem;
    text-align: center;
    border-bottom: 1px solid #ddd;
  }
  .content{
    margin:0px auto;
  }
  .band-container {
    margin:0px 0px;
    padding: 60px 10px;
  }

  h1.feature-title{
    text-align:center;
    font-size:3em;
    padding-bottom: 0px;
    margin-bottom: 0px;
  }
  .featured-subtitle{
    text-align:center;
  }

  .footer-content{
    text-align:center;
  }
  .footer-col-right{
    float:none;
    text-align:center;
  }

  .mobile-sep{
    border-bottom: 1px solid #ddd;
  }

  .btn {
    width:100%;
  }
  .content-container{
    position: inherit;
    top:auto;
  }

  .spacer-50{
    margin-top:20px;
  }


}