:root{
    --darkblue: #030211;
    --white: #ffffff;
    --black:#000000;
    --grey:#0D0D10;
    --red: #f71540;
}

html{
    scroll-behavior: smooth;
}
html,body,#banner-container {
    height:100%;
}
body{
    background-color: var(--darkblue);
    font-family: proxima-nova, sans-serif;
    height: 100%;
    overflow-x: hidden;
    color:#fff;

}
.page-id-25{
    background-color: var(--darkblue);
}
body.noscroll {
    overflow-y: hidden!important;
  }
  .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
    padding:0px !important;
    /*overflow:hidden;*/
}
a{
    text-decoration: none;
    font-weight: bold;
    color:#000;
}

a:hover{
    text-decoration: none;
    color:#6b6b6b;
}
.logo-animation{
    width: 60%;
    max-width: 450px;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
.fade-in-text{
    display:inline-block;
    font-size: 3.9rem;
    float:none;
    text-transform: uppercase;
    line-height: 4rem;
}
body.page-id-20{
    background-color:#0D0D10;
}
.anchor{
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
}
.container{
    width:95%;
    max-width: 1700px;
}
.no-padding-col{
    padding:0px;
}
.other-page-content{
    margin-top:200px;
}
.spacer{
    margin-top:100px;
    width:100%;
}
#banner-container {
    width:100%;
    position:relative;
}
#banner-container > img {
    width:100%;
    max-width:320px; /* real image width */
    position:absolute;
    top:0; left:0; right:0; bottom:0;
    margin:auto;
}
.vendor-button{
    width: 100%;
    height: auto;
}
.download-button{
    display:none;
    background:var(--red);
    position: fixed;
    bottom: 15px;
    left: 15px;
    padding: 15px;
    border-radius: 25px;
    font-size: 16px;
    z-index: 600;
    border:transparent 2px solid;
    cursor: pointer;
}
.download-button:hover{
    background:var(--darkblue);
    border:var(--red) 2px solid;
    color:var(--red);
}
.download-button-wrapper{
    display: table;
    width: 75%;
    table-layout: fixed;
    margin:0 auto;
    margin-bottom:3%;
}
.vendor-button-new{
    margin-right: 9px;
    margin-top: -4px;
}
.download-button-wrapper a{
display: table-cell;
  width: 50%;
  font-weight: 100;
}
.app-store{
    margin-left: 6%;
}
.download-button-main-wrapper{
    margin-top: 25px;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 25px;
}

.download-button-main-wrapper a {
    flex: 1;
    max-width: 200px;
}
.download-button-main{
    font-family: proxima-nova, sans-serif;
    background:var(--red);
    display: inline-block;
    bottom: 15px;
    left: 15px;
    padding: 15px;
    border-radius: 25px;
    font-size: 16px;
    z-index: 600;
    border:transparent 2px solid;
    cursor: pointer;
}
.download-button-main:hover{
    background:var(--darkblue);
    border:var(--red) 2px solid;
    color:var(--red);
}
.download-logo{
    width:116px;
    vertical-align: baseline;
}
.banner-logo{
    display: block;
    margin: auto;
    margin-top: auto;
    width: 300px;
    height: 25vh;
    margin-top: 50%;
    position: absolute;
}

h2{
    font-size: 3rem;
    text-transform: lowercase;
    font-family: "Gelica";
    color:var(--white);
    font-weight: 800;
}


.h-fade-4{
    font-size: 1.5rem;
    text-transform: none;
    font-weight: lighter;
    float:none;
    display: inline-block;
    margin-top: 10px;
}
@media only all and (max-width:1080px){
    .fade-in-text{
        font-size: 4vw;
        line-height: 5vw;
        font-weight: 500;
    }
    .h-fade-4{
        font-size: 4vw;
        line-height: 5vw;
    }
    h1{
        font-size: 3rem;
        text-transform: uppercase;
    }
}

h3{
    font-size: 1.5rem;
    text-transform: uppercase;
    font-weight: lighter;
    
}
h5{
    font-size: 2rem;
    text-transform: uppercase;
}
@media only all and (max-width:1080px){
h5{
    font-size: 1.0rem;
    text-transform: uppercase;
}
}



#work{
    margin-top:100px;
    margin-bottom:100px;
}
#references-box{
    background-color:#f0f0f0;
    margin-bottom:50px;
    padding:3% 0px;
    
}

.reference-wrapper{
    width:100%;
    position: relative;
}
.reference-text{
    border-top: 1px solid #1f1f1f;
    margin-top: 15px;
    padding-top: 5px;
}
.reference-item{
    margin: 3% 0%;
}
@media only all and (min-width:992px){
    .reference-item{
        margin:1.5% 0px;
    }
    #references-box{
        margin:1.5% 0px;
        padding:1.5% 0px;
    }
}
.reference-number{
    position: absolute;
    right: -24px;
    top: 3px;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    font-size: 0.8rem;
}
.reference-image{
    padding-bottom:134%;
    background-size: cover !important;
    -webkit-transition: border-radius 0.5s ease-out;
    transition: border-radius 0.5s ease-out;
}
.reference-image:hover{
    border-radius:75px;
    cursor: pointer;
}
.reference-tags{
    float:left;
    display:block;
    font-size: 0.8rem;
    text-transform: uppercase;
    
}
.reference-date{
    display:block;
    float:right;
    font-size: 0.8rem;
    text-transform: uppercase;
}
.reference-title{
    display:block;
    clear:both;
    font-weight: bold;
    text-transform: uppercase;
}
.contact-container{
    max-width:1800px;
}
#contact-section{
    margin-top:200px;
    margin-bottom:200px;
}
@media only all and (max-width: 768px){
    .contact-container{
    max-width:95%;
    }
}
.love-to{
    max-width:300px;
    text-transform: uppercase;
    font-size: 1.2rem;
}

h4{
    color:#999;
    font-size: 1rem;
    text-transform: uppercase;
}
@media only all and (max-width: 768px){
    #right-contact{
        margin-top:50px;
    }
}
.grey-button{
    margin-top:15px;
    background-color:#3d3d3d;
    padding:5px 15px;
    border-radius: 25px;
    color:#fff;
    border:0px;
    text-transform: uppercase;
    font-size: 0.8rem;
}
.grey-button:hover{
    background-color: #6b6b6b;
    cursor: pointer;
}

#instagram-logo{
    width:36px;
    height:36px;
    display:block;
    background:url("../images/instagram-logo.png");
    background-position: 0px;
    background-size: cover;
}

#instagram-logo:hover{
    background-position: 36px;
    cursor: pointer;
}
@media only all and (max-width:768px){

#instagram-logo{
    margin:0 auto;
    margin-bottom:25px;
    margin-top: 25px;
}
}

.footer{
    color:var(--white);
    height:100px;
    margin-top:500px;

}
.footer-link{
    cursor: pointer;
    margin:0px 5px;
    color:var(--white);
    font-weight: normal;
}
.footer-link:hover{
    color:#ccc;
}

#footer-logo{
    background:url("../images/compromised-logo-black.png");
    width:46px;
    height:46px;
    display:block;
    background-size: contain;
    float:right;
}
#mobile-menu-word-logo{
    display:none;
}
@media only all and (max-width:1080px){
    #footer-logo{
        margin:0 auto;
        float:none;
        margin-bottom:25px;
        margin-top:25px;
    }
}
.disclaimer-links{
    display:table;
    text-align: right;
    text-align: center; /*cumming*/
}
.v-center-footer{
    display:table-cell;
    vertical-align: middle;
}
/*Menu Styling*/
.main-menu-style{
	width:auto;
	float:right;
    margin:0px;
    font-family: "Montserrat";
}
ul.main-menu-style {

	
}
 ul.main-menu-style li.menu-item{
	display:inline-block;
	margin: 0px 15px 0px 15px;
}
.main-menu-style a{
	color:#fff;
	font-weight: 100;
	text-decoration: none;
	font-size: 1.2rem;
    display: inline-block;
}
.main-menu-style a::after {
content: '';
    display: block;
    width: 0;
    height: 5px;
    background: #fff;
    transition: width .3s;
}
.main-menu-style a:hover::after {
    width: 100%;
    transition: width .3s;
}


/*Menu Styling END*/
/*Mobile Menu START*/
.hide{
    display:none;
}
.bar-menu-logo{
    width:auto;
    max-height: 40px;
    margin:5px;
    
}
.bar-menu-logo-2{
    width:auto;
    max-height: 40px;
    margin:5px;
    opacity:100;
}
.mobile-menu-toggle{
	transition: all 0.3s ease-in-out;
	position: absolute;
    top: 22px;
    right: 30px;
	z-index:2100;
	color:#fff;
}
#mobile-menu-center-logo{
    width: 100%;
    height: 100px;
    text-align: center;
    margin-top: 100px;
    position: absolute;
}

.bar{
	display:block;
	width:25px;
	height:3px;
	margin:5px auto;
	transition: all 0.3s ease-in-out;
	background:#fff;
}
#menu-toggle-icon.is-active .bar{
	background:#fff;
}
.mobile-menu-toggle:hover{
	cursor: pointer;
}
#menu-toggle-icon.is-active .bar:nth-child(2){
	opacity:0;
}
#menu-toggle-icon.is-active .bar:nth-child(1){
	transform: translateY(8px) rotate(45deg);
}
#menu-toggle-icon.is-active .bar:nth-child(3){
	transform: translateY(-8px) rotate(-45deg);
}
.mobile-menu-container{
		display:none;
	}

.mobile-menu-container ul.main-menu-style {
	margin:15px 0px 15px 0px;
	padding:0px 0px 15px 0px;
	border-bottom:8px solid --darkblue;
}


.mobile-menu-container ul.main-menu-style li.menu-item{
	display: block;
	margin: 20px 15px 0px 15px;
}
.mobile-menu-container.main-menu-style a{
	color:#fff;
	font-family: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif';
	font-weight: 800;
	text-decoration: none;
	font-size: 2rem;
}

.mobile-menu-container .main-menu-style a {
  box-shadow: inset 0 0 0 0 #ccc;
  color: #fff;
  margin: 0 0rem;
  padding: 0 .25rem;
  transition: color .3s ease-in-out, box-shadow .3s ease-in-out;
  font-size: 2rem;
}

#menu-toggle-icon{
	display:none;
    position: fixed;
}

.menu-bar-container{
    
    height:120px;
    background-color:none;
    z-index: 1000;
}
#menu-bar-container{
    background-color:var(--darkblue);
    transition: top 0.6s; /* Transition effect when sliding down (and up) */
}

.nav-bar-row{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transform: translatey(-50%);
    top: 50%;
}
.nav-bar-logo-wrapper{
    display: flex;
    align-items: center;
}
.nav-bar-word-logo{
    margin-left:20px;
}
.top-bar-full-width-background{
    position: fixed;
    z-index: 800;
    background-color: none;
    top:0px;
}
@media only all and (max-width:1080px){
    #mobile-download{
        position: absolute;
        left: 0;
    width: 100vw;
    text-align: center;
    bottom: 50px;
    }
    .download-button{  margin: 0 auto;
        display:block;
        width: 230px;
        left: 0;
        right: 0;
        text-align: center;
      }
    #menu-bar-container{
        height: 75px;
    }
    .menu-bar-container{
        height: 75px;
    }
    .anchor{
        display: block;
        position: relative;
        top: -50px;
        visibility: hidden;
    }
    #mobile-menu-word-logo{
        display: block;
        position: absolute;
        width:140px;
        height:15px;
    }
    .mobile-menu-logo{
        display:none;
        position: absolute;
        top: 10vh;
        margin: 0 auto;
        left: 0;
        right: 0;
        width: 50px;
        height: auto;
    }
    .menu-menubar-container{
        display: table;
        margin: 0 auto;
        height: 100vh;
    }
    .main-menu-style{
        float:none;
    }
	#menu-toggle-icon{
		display:block;
	}
	.main-menu-container{
		display:none;
	}
	.mobile-menu-container{
		height: 100vh;
		display:grid;
		z-index:2000;
		background-color:var(--darkblue);
		margin:0;
		width:100%;
		position:fixed;
		left:-100%;
		opacity:100;
        top:0px;
		transition: all 0.5s ease;
	}
    .main-menu-style a::after {
        content: '';
            display: block;
            width: 0;
            height: 5px;
            background: #fff;
            transition: width .3s;
        }
    .is-active{
        overflow: hidden;
    }
	.active{
		left:0%;
		opacity:100;
	}
	.mobile-menu ul{
		text-align: center;
        list-style: none;
		width:100%;
		display:grid;
		grid-template-columns: auto;
	}
    ul.main-menu-style{
        display: table-cell;
        vertical-align: middle;
    }


}
.slide-in-references{
    background-color: #f0f0f0;
    margin-top:6px;
}
#menu-logo{
	margin-left:20px;
}
.mobile-menu-active{
	background:#333;
	left: 0;
	opacity: 1;
	transition: all 0.5 ease;
}

/*Mobile Menu END*/

@keyframes expand {
	0% {
        transform: scale(0, 1); 
	}
	
}
@keyframes expand-2{
	0% {
        transform: scale(0, 1); 
	}
	
}


@media (prefers-reduced-motion: no-preference) {
    .black-bar-left-animation {
        display:block;
        transform-origin: left;
      animation-name: expand;
      animation-duration: 2s;
      animation-iteration-count: 1;
    }
    .black-bar-right-animation {
        display:block;
        transform-origin: right;
      animation-name: expand-2;
      animation-duration: 2s;
      animation-iteration-count: 1;
    }
    
  }
  #instructions {
    max-width: 640px;
    text-align: left;
    margin: 0px auto;
  }
  
  #instructions textarea {
    width: 100%;
    height: 100px;
  }


.video-js{
    position:absolute;
    z-index:-1;
    top:25px;
    left:0;
    width:100%; 
    height:90vh;

}


.line-text p{
    margin:0 !important;
}

h1{
    font-size: 4.2vw;
    text-transform: lowercase;
    font-family: "Gelica";
    color:var(--red);
    font-weight: 800;
}

.designed-to h2{
    font-weight: 100;
}
@media only all and (min-width:1200px){

    h1{
        font-size: 3rem;
    }
    .designed-to h2{
        font-size: 2.5rem;
    }
}
@media (max-width:768px){
    .designed-to h2{
        font-size: 1.5rem;
    }
}

#home{
    
}
.home-container{
    margin-top:50px;
}
.home-headline{
    padding-left: 6vmin;
}
@media only all and (max-width:768px){
.comic{
    margin-top:50px;
    width:75%;
}
}
.square_animation_wrapper{
    display:inline-block;
    width:37px;
    height:37px;
}
.rings_animation_wrapper{
    display:inline-block;
    width:44px;
    height:34px;
}
.line_animation_wrapper{
    display:inline-block;
    width:70px;
    height:15px;
}
@keyframes float {
	0% {
	
		transform: translatey(0px);
	}
	50% {
		
		transform: translatey(-20px);
	}
	100% {
		
		transform: translatey(0px);
	}
}
.mobile-mockup{
    width:100%;
    margin-top:50px;
    margin-left:25px;
    transform: translatey(0px);
	animation: float 6s ease-in-out infinite;
}

.designed-to{
    width:75%;
    text-align: center;
    margin: 0 auto;
    margin-top:190px;
}


#home .row {
    
}

#home .home-headline .row {
    height: 100%;
}

.mobile-mockup-wrapper,
.all-it-needs {
    height: 100%;
}

.all-it-needs{
    color:var(--white);
    font-family: 'Gelica', sans-serif;
    font-size: 2vmin;
    font-style: italic;
    text-align: center;
    
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
}
#momentum-comic-profil-wrapper{
    margin-top: 100px;
  float: left;
  width: 100%;
}
.comic-profile{
    width: 20%;
    float: left;
    
}
.momentum-comic-profil{
    width:100%;
    
    border-radius: 35px;
}
.momentum-comic-profil-var-2{
    
}

#background-video {
    width: 100%;
    height: auto;
    margin-top:-9vmin;
    position: relative;
    object-fit: cover;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
  }
  @media only all and (max-width:1200px){
    #background-video{
    object-fit: contain;
    height: auto;
    }
  }
  p{
      margin:30px 0px;
  }
  .main-headline{
    margin: 50px 0px 75px 0px;
    color:var(--white);
    font-size: 5.5rem;
}
  .quote-text{
    font-family: 'Gelica', sans-serif;
    font-style: normal;
    color:var(--white);
    font-size: 3.5vmin;
    text-transform: lowercase;
  }
  .content-text{
    text-transform: lowercase;
    color: var(--white);
    font-family: 'Montserrat';
    font-size: 1.2rem;
    line-height:2.2rem;
  }
  .bigger-content-text{
    color: var(--white);
    font-family: 'Montserrat';
    font-size: 1.8rem;
  }
  .video-wrapper{
      
  }
  .video-container{
      overflow: hidden;
  }
  .video-text-wrapper{
        position: relative;
        top: 19vw;
        margin: 0 auto;
  }
  .video-text{
    color: var(--white);
  font-family: 'Gelica', sans-serif;
  font-style: normal;
  font-size: 8.5vmin;
  font-weight: bold;
  text-align: center;
  }
  .video-sub-text{
    color: var(--white);
    font-family: 'Montserrat';
    font-size: 2.4vmin;
    margin-top: 20px;
  }

  .inline-logo{
    vertical-align: baseline;
    width:250px;
  }
  
  .circle-outer{
      width:100%;
      position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 3440px;
  

  }
  .circle-outer-2{
    width:100%;
    position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
width: 3440px;
  }
  .circle-overflow{
    width: 100%;
    position: absolute;
    height: 550px;
    padding-top: 100px;
    overflow-x: hidden !important;
  }
  .circle-overflow-2{
    width: 100%;
    position: absolute;
    height: 600px;
    padding-top: 100px;
    overflow-x: hidden !important;
  }
  .circle_animation_wrapper{
      
  }
  @media only all and (max-width:1200px){
    .video-text-wrapper{
        position: relative;
        top: 24vmin;
        margin: 0 auto;
  }
  .video-text{
    color: var(--white);
    font-family: 'Gelica', sans-serif;
    font-style: normal;
    font-size: 8.5vmin;
    font-weight: bold;
  }
  .video-sub-text{
    color: var(--white);
    font-family: 'Montserrat';
    font-size: 3vmin;
    margin-top: 20px;
  } 
  .inline-logo{
    vertical-align: baseline;
    width: 240px;
    margin-left: 0.5vw;
  }
  }
  .angle-box-top{
    background-image: url("../images/angle-box-top.png");
    width: 100%;
    height: 8.8vw;
    margin-top: -9vw;
    z-index: 100;
    position: relative;
    background-position: center bottom;
    background-size: 100% auto;
  }
  .angle-box-mmntm{
    background-image: url("../images/angle-box-mmntm.png");
    width: 100%;
    height: 8.8vw;
    margin-top: -9vw;
    z-index: 100;
    position: relative;
    background-position: center bottom;
    background-size: 100% auto;
  }
  .comic-couple-2{
    min-height: 42vw;
  background-image: url("../images/momentum-the-essence-logo.png");
  background-repeat: no-repeat;
  background-size: 70%;
  background-position: center 150px;
  }
  .comic-couple-2-mobile{
      display:none;
  }
  .comic-cuffs{
    background-image: url("../images/comic-cuffs-long.svg");
    background-repeat: no-repeat;
    background-size: contain;
    position: relative;
    background-position: top;
    margin-top: -8vw;
    z-index: 500;
  }
  .cuffs_animation_wrapper{
    position: relative;
    margin-top: -8vw;
    z-index: 500;
    text-align: center;
  }
  .cuffs_animation_wrapper svg{
      width:45% !important;
      height: auto !important;
  }
  .momentum-quote-logo{
      display:inline;
  }
  .the-difference-wrapper{
      background-image: url("../images/momentum-spiral-bg.png");
      background-repeat: no-repeat;
      background-size: cover;
  }
  .the-difference-content{
    padding-top: 25vw;
  }
  .difference-table{
      display:table;
  }
  .difference-line{
      margin-top:50px;
  }
  .difference-icon-col{
      text-align: right;
  }
  .difference-icon{
    width: 100%;
    max-width: 120px;
    }
  .difference-topic{
      display:none;
      padding-left:15px;
      color:var(--white);
      font-family: 'Montserrat';
      font-size: 1.7rem;
      margin:0px 0px 0px 0px;
  }
  .difference-text{
    padding-left:15px;
    margin:0px;
    color:var(--white);
    font-family: 'Montserrat';
    font-size: 1rem;
    line-height: 2rem;
    display:table-cell;
    vertical-align: middle;
}
.the-difference-quote-wrapper{
    text-align: center;
    margin-top: 220px;
    padding-bottom: 200px;
    position: absolute;
  width: 100%;
  text-align: center;
  padding-top:100px;
}
.circle-spacer{
    height:400px;
}
.circle-spacer-2{
    height:400px;
}

.the-difference-quote-text{
    font-family: 'Gelica', sans-serif;
    font-style: normal;
    color: var(--white);
    font-size: 1.8rem;
    padding: 15px;
    display: inline-block;
    background-color: var(--darkblue);
    margin: 0px;
    line-height: 2rem;
  }
  .the-essence-quote-wrapper{
    text-align: center;
    margin-top: 175px;
    padding-bottom: 200px;
    position: absolute;
  width: 100%;
  text-align: center;
  padding-top:100px;
}
  .the-essence-quote-text{
    font-family: 'Gelica', sans-serif;
    font-style: normal;
    color: var(--white);
    font-size: 1.8rem;
    padding: 15px;
    display: inline-block;
    background-color: var(--darkblue);
    margin: 0px;
    line-height: 2rem;
  }
  .break{
      display:block;
  }
  #the-story{
      padding-top:250px;
      background-image: url("../images/gradient-bg.png");
      background-size: contain;
      background-repeat: no-repeat;
      background-repeat: repeat-x;
  }
  .story-photo{
      width:100%;
  }

  .footer-row{
      width:90%;
    padding: 125px 0px 25px 0px;
    margin: 0 auto; /*cumming*/
    z-index: 500;
    position: relative;
}
  /*TABLET STYLES*/
  
  /*TABLET STYLES END*/

  /* MOBILE STYLES */
  
  .comic-profile-mob{
      display:none;
  }
  @media only all and (max-width:768px){
    
    .comic-profile-mob{
        display:block;
    }
    .container{
        width:90%;
        margin:0 auto;
    }
    
    .home-headline{
        position: relative;
        
        width:100%;
    }
    .home-headline h1{
        font-size: 7vw;
    }
    .mobile-mockup-wrapper{
        text-align: center;
    }
    .mobile-mockup{
        margin-left: 0px;
        width:70%;
    }
    .all-it-needs{
        font-size: 2rem;
        text-align: center;
        padding: 20px;
    }
    .designed-to{
        margin-top:100px;
    }
    .comic-profile{
        width: 250px;
        float: left;
        padding: 0px 0.3%;
    }
    #momentum-comic-profil-wrapper
    {
        position: relative;
        overflow: hidden;
        --offset: 0vw;
        --move-initial: calc(0% + var(--offset));
        --move-final: calc(-50% + var(--offset));
    }
    #momentum-comic-profil-inner
    {
        width: fit-content;
        display: flex;
        position: relative;
        transform: translate3d(var(--move-initial), 0, 0);
        animation: marquee 20s linear infinite;
        animation-play-state: paused;
    }
    #momentum-comic-profil-wrapper #momentum-comic-profil-inner {
        padding-top: 50px;
        animation-play-state: running;
    }
    @keyframes marquee {
        0% {
            transform: translate3d(var(--move-initial), 0, 0);
        }
    
        100% {
            transform: translate3d(var(--move-final), 0, 0);
        }
    }
    #background-video{
        height: 85vmin;
        object-fit: cover;
    }
    .video-text-wrapper{
        position: relative;
        top: 42vw;
        margin: 0 auto;
        width: 70%;
    }
    .essence-container{
        width:90% !important;
    }
    .main-headline{
        font-size: 3rem;
        margin: 50px 0px 25px 0px;
    }
    .quote-text{
        font-size: 1.5rem;
    }
    .comic-couple-2{
        display:none;
    }
    .comic-couple-2-mobile{
        display: block;
    background-image: url("../images/momentum-the-essence-logo.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 0px 75px;
    height: 45vmin;
    background-position: center;
    margin-top: 50px;
    }
    .content-text{
        font-size: 1rem;
        line-height: 1.8rem;
    }
    .bigger-content-text{
        font-size: 1.5rem;
    }

    .cuffs_animation_wrapper{
        margin-top:0px;
    }
    .the-difference-quote-text{
        font-size: 2rem;
        margin:0px;
        padding:0px;
    }
    .inline-logo{
        width: 190px;
        margin-left: 5px;
    }
    .the-difference-quote-wrapper{
        padding-bottom:0px;
    }
    .the-difference-content{
        padding-top:45vw;
        width: 90%;
        margin: 0 auto;
    }
    .difference-icon{
        width:100%;
    }
    .difference-icon-col
    {
        padding: 0px;
    }
    .footer{
        margin-top: 150px;
    }
}
  /* MOBILE STYLES END*/
    .active-page{
        right:0px;
        transition:1s;
        height:100%;
    }
    .inactive-page{
        transition: 1s;
        right:-100%;
        overflow-x:hidden;
        right: -100%;
        overflow: hidden;
    }
    .overlay-page{
        position: fixed;   
    top: 0px;
    min-height: 100%;
    z-index: 700;
    width:75%;
    overflow: auto;
    }
    #privacy-policy-page-wrapper{
    
    }
    @media only all and (max-width:768px){
    .overlay-page{
        width:100%;
    }
}
  #privacy-policy-page{
    background-color: #0D0D10;
    padding-top: 250px;
    color: #fff;
    min-height: 100%;
  }
  #cookies-page{
    background-color: #0D0D10;
    padding-top: 250px;
    color: #fff;
    min-height: 100%;   
  }
  #terms-of-use-page{
    background-color: #0D0D10;
    padding-top: 250px;
    color: #fff;
    min-height: 100%;
  }

  .close-cross{
      cursor: pointer;
    width: 50px;
    height: 50px;
    background: url(../images/close-cross.svg);
      background-position-y: 0%;
      background-repeat: repeat;
      background-size: auto;
      background-position-x: left 0px !important;
    margin-bottom: 50px;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .close-cross:hover{
      background-position-x: left -50px !important;
  }

  /* COMING SOON PAGE */
  #momentum-logo-loop{
      width:50%;
      max-width:250px;
      margin-bottom:25px;

  }
  #coming-soon{
    background-color:#0d090f;
    position: relative;
  }
  .momentum-spinning-logo{
    text-align: center;
    padding-top: 120px;
    text-align: center;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0;
  position: absolute;
  top: 40%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  }
  #cumming-soon{
    position: relative;
    z-index: 50;
    background:#0D0D10;
  }
.cumming-soon-background{
    width: 100%;
    height: 100%;
    background: url(../images/cumming-soon-circle.png);
      background-position-x: 0%;
      background-position-y: 0%;
      background-repeat: repeat;
      background-size: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 100;
    background-repeat: no-repeat;
    background-position: right top;
    background-size: 50%;
    max-width: 800px;
}
  .cumming-phone-wrapper{
      text-align: center;
      position: relative;
      z-index: 150;
  }
  .cumming-phone{
    width: 60vmin;
    max-width: 375px;
  }

  .cumming-soon-text{
      font-size: 9vmin;
      color:#fff;
      text-align: center;
      text-transform: uppercase;
      z-index: 200;
        position: relative;
  }

  .cumming-soon-description{
      text-transform: uppercase;
      z-index: 200;
    position: relative;
  }
  .cumming-soon-description-wrapper{
    margin: 0 auto;
    max-width: 1600px;
    font-size: 1.6rem;
    font-family: 'Montserrat';
    padding: 40px 150px;
    text-align: center;
    line-height: 2rem;
  }
  @media only all and (max-width:768px){
      .cumming-soon-text{
          margin-top:25px;
      }
    .cumming-soon-description-wrapper{
        margin: 0 auto;
        max-width: 1600px;
        font-size: 1rem;
        font-family: 'Montserrat';
        padding: 25px 25px;
        text-align: center;
        line-height: 2rem;
        z-index: 200;
    position: relative;
      }
  }
  .cumming-soon-join-momentum{
    text-align: center;
    font-size: 1.3rem;
    font-family: 'Montserrat';
    font-weight: bold;
    display: inline-block;
    width: 100%;
    z-index: 200;
    position: relative;
  }
  .cumming-soon-join-momentum:hover{
      cursor: pointer;
  }
  .white-link{
      color:#fff;
  }
  .white-link:hover{
    color:#ccc;
    cursor: pointer;
}
/* COOKIE BOT */
#CookiebotWidget{
    left:auto !important;
    right:10px !important;
}
#CybotCookiebotDialogPoweredbyCybot{
    display:none !important;
}

#CybotCookiebotDialogBodyButtonsWrapper button{
    border:1px solid !important;
    border-color: inherit;
}

#CybotCookiebotDialogBodyButtonsWrapper #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll{
    border:1px solid #F71540 !important;
}


/* LINK TREE */
#momentum-links{
height: 100%;
  font-family: 'Gelica', sans-serif;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.linktree-background{
    display:none;
    width: 100%;
    height: 100%;
    background: url(../images/cumming-soon-circle.png);
      background-position-x: 0%;
      background-position-y: 0%;
      background-repeat: repeat;
      background-size: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 100;
    background-repeat: no-repeat;
    background-position: right top;
    background-size: 50%;
    max-width: 800px;
}
/*#linktree-video{
    position: absolute;
  top: 189px;
  left: -356px;
  width: 100%;
  max-width: 900px;
  min-width: 911px;
}*/

#linktree-video{

    z-index: 100;
   
    max-width: 800px;
    min-width: 700px;
}
#linktree-video-wrapper{
    position: absolute;
    
    height: 100%;
    top: 0;
    right: 0;
}
.linktree-circle-logo{
    width: 20vmin;
    max-width: 125px;
    margin-top: 50px;
}
.linktree-content-wrapper{
    z-index: 500;
    position: relative;
    margin-top: -125px;
}
.linktree-logo-wrapper{
    text-align: center;
    position: relative;
    z-index: 150;
    padding-top: 200px;
    margin-bottom: 175px;
}
.linktree-logo{
  width: 60vmin;
  max-width: 375px;
}

.linktree-join-momentum{
    text-align: center;
    font-size: 1.3rem;
    font-family: 'Montserrat';
    font-weight: bold;
    display: inline-block;
    width: 100%;
    z-index: 200;
    position: relative;
    margin-bottom: 4%;
  }
  .linktree-join-momentum:hover{
      cursor: pointer;
      
  } 
  .linktree-button-wrapper{
    max-width:500px;
    text-align: center;
    margin:0 auto;
    margin-top:200px;
    
  }
  .linktree-button-margin{
    margin-left: 2%;
    margin-right: 2%;
  }
  .linktree-button{
      font-family: 'Montserrat';
    margin-bottom: 3%;
    height: 53px;
    border-radius: 25px;
    border: 0px;
    position: relative;
    background-color: #fff;
  }
  .store-download-bubble{
    font-family: 'Montserrat';
    height: 53px;
    border-radius: 25px;
    border: 0px;

    background-color: #fff;

    width: 94%;
    padding: 13px;
  }
  .linktree-button-full-width{
      width:75%;
}
.linktree-button:hover{
    cursor: pointer;
    background-color:#f0f0f0;
}
.linktree-button-1-3{
    width:30%;
margin-right:4%;
}
.linktree-button-2-3{
    width:30%;
}
.linktree-button-3-3{
    width:30%;
    margin-left:4%;
}
.newsletter-icon{
    width: 35px;
  margin-right: 13px;
}
.social-icon{
    width: 45px;
    position: absolute;
    left: 40px;
    top: 16px;
}
#momentum-links a button{
    color:#000;
}
#momentum-links button{
    color:#000;
}
.linktree-footer footer{
    background-color: transparent !important;
    position: relative !important;
    z-index: 500 !important;
}
@media only all and (max-width:768px){
    .linktree-logo-wrapper{
        padding-top:50px;
    }
    #linktree-video-wrapper{
    top:100px;
    right:0px;
    }
}



/*CONTACT FORM*/
.support-intro{
    font-family: 'Montserrat';
    font-size: 25px;
    max-width:650px;
}
.support-intro p{
    font-size: 1rem;
}
.wpcf7-form-control{
    border: 2px solid var(--red);
    border-radius: 50px;
    background-color: transparent;
    height: 50px;
    color: #fff;
    padding: 15px;
}
.wpcf7 input{
    color: var(--white);
    font-family: 'Montserrat';
  font-size: 18px;
  font-style: normal;
}
.wpcf7 select{
padding: 10px;
  margin-top: 6px;
  font-size: 18px;
}
.wpcf7 textarea{
    height:350px !important;
    }
.wpcf7 label{
    text-transform: lowercase;
  font-family: "Gelica";
  color: var(--red);
  font-weight: 800;
  font-size: 25px;
  margin-top: 30px;
}
.wpcf7-not-valid-tip{
    font-family: 'Montserrat';
    font-size: 15px;
    color: #ee8b8b;
}
.wpcf7 select {

    -webkit-appearance: none;
  
    -moz-appearance: none;
  
    background: url(http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png);
  
    background-repeat: no-repeat;
  
    background-position-x: 98%;
  
    background-position-y: 2px;
  
  }

  .wpcf7-submit{
    height: 75px !important;
    line-height: 44px;
    padding: 0px 50px;
    margin-top: 35px;
    color:#fff;
      background-color: var(--red);
  }


  /*HOW-TO*/
  .how-to-video-container{
    margin-top:-28vw;
  }
  .how-to-momentum{
      text-align: center;
  }
  .how-to-momentum-image{
    width: 100%;
    max-width: 900px;
    margin-top: 100px;
  }
  #background-video-momentum{
      
    width: 100%;
    height: auto;
    margin-top:-24vw;
    position: relative;
    object-fit: cover;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
    object-fit: contain;
    height: auto;
    margin-top:-8vw;
  }
  .video-text-wrapper-momentum{
    position: relative;
    top: 37vw;
    margin: 0 auto;
    width: 70%;
  }

  

  .how-to-video-text{
    color: var(--white);
    font-family: 'Gelica', sans-serif;
    font-style: normal;
    font-size: 11.5vmin;
    font-weight: bold;
    margin: 0;
    padding: 0;
    line-height: 11vmin;
  }
  .how-to-container{
    width:90% !important;
    margin-top:50px;
}
@media only all and (min-width:1570px){
#background-video-momentum{
    margin-top:0;
}

}
  @media only all and (max-width:768px){
  .how-to-video-container{
      margin-top:-29vw;
  }

}
  .how-to-headline{
    margin: 0px 0px 15px 0px;
    color:var(--white);
    font-size: 2rem;
}
.how-to-text{
    font-size: 0.9rem;
    line-height: 1.4rem;
    margin: 15px 0px;
}
.how-to-image{
    width:100%;
    transform: translatey(0px);
	animation: float 6s ease-in-out infinite;
}

.how-to-row{
    margin-top:50px;
}

