:root {
	--primary: #010101;
	--primary-dark: #010101;
	--secondary: #E5FFD6;
	--thirtiary:#9FE1FD;
	--quartieary: #FF555E;
	--quartiearylight: #FFECF3;
	--light: #F6F6FD;
	--white:#F6F6FD;
	--dark:#161069;
	--brand: #7077E3;
	--green: #00D161;
	--blue-light: #00E0FF;
	--gray-text: #878792;
}

.white {
	color: var(--white);
}

.light {
	color: var(--light);
}

.dark {
	color:var(--light);
}
.color-black .dark {
	color:var(--light);
}
.color-light {
	background-color: var(--light);
	color: var(--primary-dark);
}

.color-dark {
	background-color: var(--primary-dark);
	color:var(--light);
}

.color-lighterb {
	background-color: #ECF9FF;
}

.color-lighterp {
	background-color: #F5EEFC;
}

.color-lighterg {
	background-color: #E6FAF9;
}

.color-lightery {
	background-color: #FFFCEF;
}

.color-blue {
	background-color: var(--dark);
	color:var(--light);
	width: 100%;
	height: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
}

.color-violet {
	background-color: var(--thirtiary);
}

.color-red {
	background-color: var(--quartieary);
	color:var(--white)
}

.color-black {
	background-color: var(--primary-dark);
	color:var(--white)
}

.color-light-red {
	background-color: var(--quartiearylight);
}

.color-green {
	background-color: var(--secondary);
}

.color-black {
	background-color:var(--primary-dark);
}
.border-blue {
	border: 1px solid var(--dark);
}

.border-red {
	border: 1px solid var(--quartieary);
}

.border-green {
	border: 1px solid var(--green);
}

.border-black {
	border: 1px solid var(--primary-dark);
}

.font-blue {
	color:var(--dark);
}

.font-red {
	color:var(--quartieary);
}

.font-green {
	color:var(--green);
}

body {
	padding: 0px 0px; 
	margin: 0px 0px;
	padding: 0;
	height: 100%;
	width: 100%;
}


html {
	scroll-behavior: smooth;
}

body, html, ul, li {
	margin:0;
	padding:0;	
}

body {
	font-family: 'Urbanist', sans-serif!important;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin:0;
    letter-spacing: -.01em;
	background-color: #ffffff;
	font-size: 1rem;
	-webkit-transition: all 0.6s;
        -moz-transition: all 0.6s;
        transition: all 0.6s;
	-ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

.crossLRFacebook:hover {color:#505;}
.crossLRTwitter:hover {filter: hue(5);}
.crossLRLinkedin:hover {filter: hue(5);}

h1 {
	font-style: normal;
	font-weight: 500;
	font-size: 4rem;
	line-height: 120%;
	letter-spacing: 0;
	text-align: left;
	margin:0;
}

h2 {
	font-style: normal;
	font-weight: normal;
	font-size: 1.5rem;
	line-height: 160%;
}

h3 {
	font-style: normal;
	font-weight: bold;
	font-size: 14px;
	line-height: 19px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.descriptor1 h1 {
	font-size: 2rem;
	padding-bottom: 24px;
	padding-left: 24px;
	padding-right: 24px;
}

.descriptor1 h2 {
	font-size: 1.2rem;
	padding-bottom: 24px;
	padding-left: 24px;
	padding-right: 24px;
}

.platform-explanation h1 {
	margin-top:120px!important;
}

.platform-explanation h2 {
	margin-bottom: 120px;
}




section {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

.fullscreen {
	height: 100vh;
	min-height: 100%;
}

.descriptor {
	display: flex;
	width:100%;
	align-items: center;
	flex-direction: column;
	align-self: center;
}

.mobile-menu {
	visibility: visible;
}



.desktop-menu {
	visibility: hidden!important;
	display: none!important;
}

.fullscreenimg {
	width: 100%;
	height: 760px;
	margin-top: 120px;
}

.fullscreenimg01 {
	background-image: url('../images/fullscreen-01.jpg');
	background-repeat: no-repeat;
	background-position-x: center;
}

ul li .desktop-menu {
	color:var(--primary-dark);
	padding-top:24px;
	display: block;
}


.crossLRFacebook {
	background-image: url(../images/facebook.svg); 
	background-size: 32px 32px; 
	background-repeat: no-repeat; 
	width: 32px; 
	height: 32px; 
} 

.crossLRTwitter{
	background-image: url(../images/twitter.svg); 
	background-size: 32px 32px; 
	background-repeat: no-repeat; 
	width: 32px; 
	height: 32px;
}

.crossLRLinkedin {
	background-image: url(../images/linkedin.svg); 
	background-size: 32px 32px; 
	background-repeat: no-repeat; 
	width: 32px; 
	height: 32px; 
}

section {
	margin: 60px auto;
}

.clientlogos {
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    grid-column: 1 / span 3;
}

.clientlogos div {
    width: 50%;
    height: 120px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    display: block;
}

.square {
	background-size: 96px !important;
	transition: 0.2s;
	background-image: url('../images/clients/model-01.png');
}

.google {
	transition: 0.2s;
	background-size: 76px !important;
	background-image: url('../images/clients/model-02.png');
}

.tata {
	transition: 0.2s;
	background-size: 48px !important;
	background-image: url('../images/clients/model-03.png');
}

.alibaba {
	background-size: 56px !important;
	transition: 0.2s;
	background-image: url('../images/clients/beeld.png');
}

.vodafone {
	transition: 0.2s;
	background-size: 56px !important;
	background-image: url('../images/clients/model-05.png');
}

.cedar {
	background-size: 80px !important;
	transition: 0.2s;
	background-image: url('../images/clients/model-06.png');
}

.jetty {
	background-size: 120px !important;
	transition: 0.2s;
	background-image: url('../images/clients/model-07.png');
}

.nasdaq {
	background-size: 72px !important;
	transition: 0.2s;
	background-image: url('../images/clients/model-08.png');
}

.mcm {
	background-size: 96px !important;
	transition: 0.2s;
	background-image: url('../images/clients/model-09.png');
}


.ventures h3, .clients h3, .menu h3 {
	padding: 32px 0 0px 0;
}

.visual-case01 {
    background:url('../images/twrl-02.png');
	background-position: left center;
    background-repeat: no-repeat;
	background-size: contain;
    width: 100%;
	height: 100%;
}



.button {
	width: 160px;
    height: 48px;
    border-radius: 55px;
    line-height: 1;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    padding-bottom: 3px;
    -webkit-box-pack: center;
    justify-content: center;
    margin-top: auto;
    position: relative;
    overflow: hidden;
    transition: all 350ms
}


.button:hover {
	color: white;
	transition: all 0.5s ease;
	background-color: var(--primary-dark);
	cursor: pointer;
}

.button-red:hover {
	background-color: var(--quartieary);
}

.button-blue:hover {
	background-color: var(--dark);
}

.button-green:hover {
	background-color: var(--green);
}



  @keyframes slideshow {
	0%    { left: 0; }
	100%  { left: -200%; }
  }

  .images {
	/* Hey browser, use your GPU */
	transform: translate3d(0, 0, 0);
  }

  @keyframes moveSlideshow {
	100% { 
	  transform: translateX(-66.6666%);  
	}
  }





section h1 {
	padding: 0;
}