@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: 'Betatron-Regular';
    src: url('fonts/Betatron-Regular-Web/Betatron-Regular.woff2') format('woff2'),
        url('fonts/Betatron-Regular-Web/') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


/* Typekit IBM Plex Mono CSS
 * --------------------------------------- */
.IBM-Plex-Mono-ExtraLight {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 200;
	font-style: normal;
} 

.IBM-Plex-Mono-Light {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 300;
	font-style: normal;
} 

.IBM-Plex-Mono-Regular {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.IBM-Plex-Mono-Italic {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 400;
	font-style: italic;
}

.IBM-Plex-Mono-Medium {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 600;
	font-style: normal;
}
.IBM-Plex-Mono-Medium-Italic {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 600;
	font-style: italic;
}
.IBM-Plex-Mono-SemiBold {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 700;
	font-style: normal;
}
.IBM-Plex-Mono-SemiBold-Italic {
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 700;
	font-style: italic;
}

/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
}
a{
	text-decoration:none;
}
table {
    border-spacing: 0;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}
ol,ul {
    list-style: none;
    margin:0;
    padding:0;
}
caption,th {
    text-align: left;

}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    /*font-size: 100%;*/
}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}

/* Global CSS
 * --------------------------------------- */

a {
	color:inherit;
}

a:hover {
	text-decoration:line-through;
	color:rgba(0,53,255,1);
}



/* Custom CSS
 * --------------------------------------- */
body{
	font-family: "ibm-plex-mono", sans-serif;
	font-weight: 400;
	font-style: normal;
	color: rgba(0,0,0,0.8);
	overflow: hidden;
}

.content h1, .content h2, .content h3, .content h4, .content h5, .content h6 {
	font-weight: normal;
}

.title.beta {
	font-family: Betatron-Regular;
}

.title {
	font-weight: normal;
}

.hero.is-primary {
	background-color: #0035FF;
	color: #fff;
}

.hero.is-halfheight .hero-body, .hero.is-fullheight .hero-body, .hero.is-fullheight-with-navbar .hero-body {
	display: block!important;
}

.hero a {
	color: #fff;
}

.hero a:hover {
	color: #0035FF!important;
}

/* OneTenEleven Styles */
/* Logo Style */

.logo-grid {
	color:#fff;
	margin:20px auto;
	width: 100%;
}

.logo a {
	color:#fff;
	-webkit-transition:color 0.25s;
	-moz-transition:color 0.25s;
}

.logo a:hover {
	color:#06E9CC;
	text-decoration:line-through;
	-webkit-transition:color 0.25s;
	-moz-transition:color 0.25s;
}

.logo-float {
	float:left;
	height: 50px;
	font-family: "proxima-nova-alt" Arial, Helvetica, sans-serif;
	font-weight:200;
	margin:0px 5px 300px 0px;
}

.light {
	font-family: "proxima-nova-alt" Arial, Helvetica, sans-serif;
	font-weight:100;
}

.light-green {
	font-family: "proxima-nova-alt" Arial, Helvetica, sans-serif;
	font-weight:100;
	color:rgba(6,233,204,1);
}

.light-blue {
	font-family: "proxima-nova-alt" Arial, Helvetica, sans-serif;
	font-weight:100;
	color:rgba(0,53,255,1);
}

.small {
	font-size:16px;
	text-transform:none;
}

h1.logo {
	font-size:60px;
	line-height: 50px;
	color:#2A2424;
	letter-spacing:0px;
	font-family: "proxima-nova-alt" Arial, Helvetica, sans-serif;
	font-weight:700;
	margin:0px 0px 20px 0px;
}

a {
	text-decoration:none;
}

/* Blink animation for Webkit and others
(Chrome, Safari, Firefox, IE, ...)
*/

@-webkit-keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.blink{
	text-decoration: blink;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 0.2s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;
}

@-webkit-keyframes pulser {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.pulse {
	text-decoration: blink;
	-webkit-animation-name: pulser;
	-webkit-animation-duration: 0.8s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;
}


/* ---------------------------------------- */
/* Floating Social */
/* ---------------------------------------- */

.floating-social {
	position: fixed;
	right: 3rem;
	/*top: 100px;*/
	top: 3rem;
	z-index: 999;
	transform-origin: 100%;
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	text-align: right;
}

.fixed-nav .floating-social {
	top: 100px;
}

.admin-bar .floating-social {
	top: 54px;
}

.admin-bar.fixed-nav .floating-social {
	top: 132px;
}

.floating-social {
	color: #fff;
	-webkit-transition: color 1s; /* Safari */
  	transition: color 1s;
}

.floating-social a {
	display: inline-block;
	padding: 5px 10px;
	position: relative;
	margin: 0 0 0 20px;
	/*color: #fff;*/
	-webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
	/*font-size: .8em;*/
}

.floating-social a:hover {
	color: #e05db8;
	transform: translate3d(0px, -5px, 0);
}

.floating-social a::before {
	content: '';
	position: absolute;
	left: -22px;
	top: 15px;
	width: 20px;
	height: 1px;
	background: #fff;
}

.floating-social a:hover::before {
	background: #000;
}

.floating-social a:first-of-type::before {
	content: '';
}

a.vimeo:hover {
    color: #000;
}

a.twitter:hover {
    color: #000;
}

a.instagram:hover {
    color: #000;
}

a.ello:hover {
    color: #000;
}

.fp-viewing-intro .floating-social {
	color: #fff;
}

.fp-viewing-insight .floating-social {
	color: #000;
}

.fp-viewing-profile .floating-social {
	color: #fff;
}

.fp-viewing-contact .floating-social {
	color: #000;
}

/* Scroll Snapping
* --------------------------------------- */

html {
	scroll-snap-type: proximity;
  	scroll-snap-points-y: repeat(100vh);
  	scroll-snap-type: y proximity;
	overflow-y: scroll;
}


.hero {
	scroll-snap-align: start;
}

/* Canvas BG
* --------------------------------------- */

#cables {
	position: absolute;
	z-index: 1;
	margin: 0;
	width: 100%;
	height: 100%;
}

.canvas-float {
	/*width: 100%;
	left: 2em;
	top: 2em;*/
	height: auto;
	position: relative;
	
	z-index: 500;
	overflow: hidden;
}

/* Canvas */
canvas {
	display: block;
}

.cables {
	position: absolute;
	z-index: 1;
	margin: 0;
	width: 100%;
	height: 100%;
}

/*
[data-aos] {
  visibility: hidden;
}
[data-aos].aos-animate {
  visibility: visible;
} */

/* Arrow
* --------------------------------------- */

.arrow-wrap {
	width:  100px;
	height: 150px;
	position: relative;
	bottom: 10px;
	/*height: calc(50% + 400px);
	height: calc(70vh - 80px);*/
	
}

.arrow-wrap {
	position: fixed;
	right: .2rem;
	bottom: 1rem;
	z-index: 999;
	text-align: right;
}

.down-arrow {
  display: flex;   
  justify-content: center;
  position: absolute;
  max-height: 100px;
  height: calc(50% + 100px);;
  height: 50vw;
  width: 100px;
  margin: 0px auto;
  background: url(../svg/down_arrow.svg) bottom no-repeat;
}

/* Selection
* --------------------------------------- */

::-moz-selection{
	background:#0035FF;
	color:#000000;
}

::selection {
	background:#0035FF;
	color:#000000;
}

code::-moz-selection {
	background: #0035FF;
}

code::selection {
	background: #0035FF;
}

/* Locomotion
* --------------------------------------- */

.client_list_item {
    opacity: 0;
    position: relative;
    transform: translateY(60px);
    transition:opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1)
}

.client_list_item:after {
    background-color: #272727;
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
    transform: scaleX(0);
    transform-origin: center left;
    transition:transform .6s cubic-bezier(.215, .61, .355, 1)
}

.client_list_item.is-inview {
    opacity: 1;
    transform:none
}

.client_list_item.is-inview:after {
    transform:scaleX(1)
}

.client_list_item.is-inview:first-child {
    transition-delay:.1s
}
.client_list_item.is-inview:first-child:after {
    transition-delay:.5s
}
.client_list_item.is-inview:nth-child(2) {
    transition-delay:.2s
}
.client_list_item.is-inview:nth-child(2):after {
    transition-delay:.6s
}
.client_list_item.is-inview:nth-child(3) {
    transition-delay:.3s
}
.client_list_item.is-inview:nth-child(3):after {
    transition-delay:.7s
}
.client_list_item.is-inview:nth-child(4) {
    transition-delay:.4s
}
.client_list_item.is-inview:nth-child(4):after {
    transition-delay:.8s
}
.client_list_item.is-inview:nth-child(5) {
    transition-delay:.5s
}
.client_list_item.is-inview:nth-child(5):after {
    transition-delay:.9s
}
.client_list_item.is-inview:nth-child(6) {
    transition-delay:.6s
}
.client_list_item.is-inview:nth-child(6):after {
    transition-delay:1s
}
.client_list_item.is-inview:nth-child(7) {
    transition-delay:.7s
}
.client_list_item.is-inview:nth-child(7):after {
    transition-delay:1.1s
}
.client_list_item.is-inview:nth-child(8) {
    transition-delay:.8s
}
.client_list_item.is-inview:nth-child(8):after {
    transition-delay:1.2s
}
.client_list_item.is-inview:nth-child(9) {
    transition-delay:.9s
}
.client_list_item.is-inview:nth-child(9):after {
    transition-delay:1.3s
}
.client_list_item.is-inview:nth-child(10) {
    transition-delay:1s
}
.client_list_item.is-inview:nth-child(10):after {
    transition-delay:1.4s
}
.client_list_item.is-inview:nth-child(11) {
    transition-delay:1.1s
}
.client_list_item.is-inview:nth-child(11):after {
    transition-delay:1.5s
}
.client_list_item.is-inview:nth-child(12) {
    transition-delay:1.2s
}
.client_list_item.is-inview:nth-child(12):after {
    transition-delay:1.6s
}
.client_list_item.is-inview:nth-child(13) {
    transition-delay:1.3s
}
.client_list_item.is-inview:nth-child(13):after {
    transition-delay:1.7s
}
.client_list_item.is-inview:nth-child(14) {
    transition-delay:1.4s
}
.client_list_item.is-inview:nth-child(14):after {
    transition-delay:1.8s
}
.client_list_item.is-inview:nth-child(15) {
    transition-delay:1.5s
}
.client_list_item.is-inview:nth-child(15):after {
    transition-delay:1.9s
}
.client_list_item.is-inview:nth-child(16) {
    transition-delay:1.6s
}
.client_list_item.is-inview:nth-child(16):after {
    transition-delay:2s
}
.client_list_item.is-inview:nth-child(17) {
    transition-delay:1.7s
}
.client_list_item.is-inview:nth-child(17):after {
    transition-delay:2.1s
}
.client_list_item.is-inview:nth-child(18) {
    transition-delay:1.8s
}
.client_list_item.is-inview:nth-child(18):after {
    transition-delay:2.2s
}
.client_list_item.is-inview:nth-child(19) {
    transition-delay:1.9s
}
.client_list_item.is-inview:nth-child(19):after {
    transition-delay:2.3s
}
.client_list_item.is-inview:nth-child(20) {
    transition-delay:2s
}
.client_list_item.is-inview:nth-child(20):after {
    transition-delay:2.4s
}
.client_list_item.is-inview:nth-child(21) {
    transition-delay:2.1s
}
.client_list_item.is-inview:nth-child(21):after {
    transition-delay:2.5s
}
.client_list_item.is-inview:nth-child(22) {
    transition-delay:2.2s
}
.client_list_item.is-inview:nth-child(22):after {
    transition-delay:2.6s
}
.client_list_item.is-inview:nth-child(23) {
    transition-delay:2.3s
}
.client_list_item.is-inview:nth-child(23):after {
    transition-delay:2.7s
}
.client_list_item.is-inview:nth-child(24) {
    transition-delay:2.4s
}
.client_list_item.is-inview:nth-child(24):after {
    transition-delay:2.8s
}
.client_list_item.is-inview:nth-child(25) {
    transition-delay:2.5s
}
.client_list_item.is-inview:nth-child(25):after {
    transition-delay:2.9s
}
.client_list_item.is-inview:nth-child(26) {
    transition-delay:2.6s
}
.client_list_item.is-inview:nth-child(26):after {
    transition-delay:3s
}
