@charset "utf-8";
/* CSS Document */
a:link, a:visited {
	color: #626F36; font-weight: bold
}
#bank-details {
	display: none
}
body {
    text-align: center; font-family: 'muli', sans-serif; font-size: 16px; background-color: #FFFFFF; font-weight: 400; font-style: normal; width:100%; max-width: 1600px; margin: 0 auto; line-height: 1.5em;  
}
:root {
	--bar-width: 30px; --bar-height: 5px; --hamburger-gap: 3px; --foreground: #819A31; --background: white; --animation-timing: 200ms ease-in-out; --hamburger-height: calc(var(--bar-height) * 3 + var(--hamburger-gap) * 2); --hamburger-margin: 8px; --grid-4-column-gap: 8px; --id-green01: #9DC41D; --id-green-02: #819A31; --id-green-03: #626F36; --id-green-04: #3F452D; --id-green-05: #31332A; --id-purple: #614A6B; --id-purple-50: #b0a5b5
}
.big-title {
	font-size: 2em; margin: 0; line-height: 1.2em
}
.b-margin-20 {
	margin-bottom: 20px
}
.b-margin-30 {
	margin-bottom: 30px
}
.bg-blue {
	background-color: cornflowerblue !important;  color: #000000 !important
}
.bg-dark-green {
	background-color: #626F36 !important; color: #FFFFFF
}
.bg-fade-00-70 {
	background-image: url("images/00-70.png"); background-repeat: repeat
}
.bg-fade-01-70 {
	background-image: url("images/01-70.png"); background-repeat: repeat
}
.bg-fade-01-70-pale {
	background-image: url("images/01-70-pale.png"); background-repeat: repeat
}
.bg-fade-02-70 {
	background-image: url("images/03-70.png"); background-repeat: repeat
}
.bg-fade-03-70 {
	background-image: url("images/02-70.png"); background-repeat: repeat
}
.bg-fade-04-70 {
	background-image: url("images/04-70.png"); background-repeat: repeat; color: white
}
.bg-fade-05-70 {
	background-image: url("images/05-70.png"); background-repeat: repeat
}
.bg-darker-green {
	background-color: #3F452D !important; color: #FFFFFF
}
.bg-green {
	background-color: #9DC41D !important; color: #31332A;
}
.bg-green-pale {
	background-color: #F1F9DA !important; color: #3F452D !important
}
.bg-grey-light {
	background-color: #BDBDBD !important; color: #3F452D !important
}
.bg-left {
	background-position: left !important
}
.bg-mid-green {
	background-color: #819A31 !important; color: #FFFFFF
}
.bg-purple {
	background-color: var(--id-purple) !important; color: #FFFFFF
}
.bg-purple-50 {
	background-color: var(--id-purple-50) !important; color: #000000
}
.bg-orange {
	background-color: #EA5B0C !important; color: #FFFFFF
}
.bg-red {
	background-color: #FF0000 !important; color: #FFFFFF !important
}
.bg-white {
	background-color: #FFFFFF !important; color: #000000 !important
}
.bg-yellow {
	background-color: #F39200 !important
}
#bottom-block {
	background-color: #3F452D; padding: 0; text-align: left; margin: 0
}
#bottom-block img {
	width: 30%; max-width: 250px; min-width: 120px; height: auto
}
.bottom-block-content {
	padding: 20px 50px 50px
}
.change-banner {
	border-top: solid 2px #ea6906; border-bottom: solid 2px #72b6d0; background-color: white; text-align: left
}
.change-banner img {
	margin: -23px 0 -23px 40px; position: relative; z-index: 2
}
#copyright {
	font-size: 9px; padding: 5px; margin-bottom: 10px
}
.button {
	  padding: 9px 15px; border-radius: 12px; cursor: pointer; margin: 0; font-size: 13px; font-weight: 400; text-align: center; background-color: #819A31; color: #FFFFFF; display: inline-block; line-height: 1em
}
.button-amber {
	background-color: #FFC600; color: #000000
}
.button-compact {
	font-size: 11px; padding: 0; 
}
.button-grey {
	background-color: darkgrey; color: #000000 !important
}
.button-red {
	background-color: #FF0000; color: #FFFFFF
}
.button-spacer {
	border: solid 2px white
}
a.bottom-block-content:link, a.bottom-block-content:visited, .bottom-block-content a:link, .bottom-block-content a:visited {
	text-decoration: none; color: #FFFFFF
}
a.button:link, a.button:visited {
	text-decoration: none; color: #FFFFFF
}
.backdrop-blur {
	backdrop-filter: blur(5px)
}
.button-curve-right {
	border-top-right-radius: 10px !important; border-bottom-right-radius: 10px !important; border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; margin-left: 0; padding: 11px
}
.button-stack {
	line-height: 1.4em
}
.clear {
	clear: both; height: 0; margin: 0; font-size: 0; padding: 0
}
.close-b {
	margin-bottom: -5px !important
}
.col1 {
	border-top-left-radius: 10px; border-bottom-left-radius: 10px; padding-left: 15px!important
}
.coln {
	border-top-right-radius: 10px; border-bottom-right-radius: 10px; padding-right: 15px !important
}
.col1-bottom {
	border-bottom-left-radius: 5px
}
.coln-bottom {
	border-bottom-right-radius: 5px
}.col1-top {
	border-top-left-radius: 5px
}
.coln-top {
	border-top-right-radius: 5px
}
.desktop-only {
	display: none
}
.dialogue-box {
	background: #FFFFFF; border: solid 1px #9DC41D; border-radius: 10px; padding: 20px; max-width: 800px; margin: 50px auto; -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.2); -moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.2); box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.2);
}
.div-400 {
	width: 400px; max-width: 100%; margin: 0 auto
}
.div-500 {
	width: 500px; max-width: 100%; margin: 0 auto
}
.div-600 {
	width: 600px; max-width: 100%; margin: 0 auto
}
.div-800 {
	width: 800px; max-width: calc(100% - 5%); margin: 0 auto
}
.div-bar-top {
	border-top: solid 1px #819A31
}
.div-centre {
	margin-left: auto; margin-right: auto
}
.div-half {
	max-width: 95%; margin: 0 auto
}
.div-margin-bottom-40 {
	margin-bottom: 40px
}
.div-margin-bottom-80 {
	margin-bottom: 80px
}
.div-margin-bottom-120 {
	margin-bottom: 120px
}
.div-pad {
	padding: 5px
}
.div-pad-0-20 {
	padding: 0 20px
}
.div-pad-20 {
	padding: 20px !important;
}
.div-pad-bottom-30 {
	padding-bottom: 30px
}
.div-pad-bottom-40 {
	padding-bottom: 40px
}
.div-pad-bottom-20 {
	padding-bottom: 20px
}
.div-pad-top-20 {
	padding-top: 20px
}
.div-pad-top-30 {
	padding-top: 30px
}
.div-radius {
	border-radius: 10px
}
.div-relative {
	position: relative
}
.div-v-centre {
	margin: 0; position: absolute; top: 50%; -ms-transform: translateY(-50%);  transform: translateY(-50%);
}
.triple-spacing {
	line-height: 3em
}
.em1 {
	line-height: 1em !important
}
.email-confirm {
	width: 0px !important; height: 0px !important; border: none !mportant; line-height: 0 !important; margin: 0 !important; padding: 0 !important
}
.errorMessage {
	color: red; font-weight: bold; text-align: center
}
#fadeout {
	background-image: url("poo/fadeout.png"); background-repeat: repeat; width: 100vw; position:absolute; top: 0; left: 0; right: 0; height: 1000px
}
.fill-div-h {
	margin: -20px; width: 110%; height: auto; max-width: 200% !important
}
.fix-width-50 {
	width: 50px; max-width: 100%
}
.fix-width-60 {
	width: 60px; max-width: 100%
}
.fix-width-75 {
	width: 75px; max-width: 100%
}
.fix-width-100 {
	width: 100px; max-width: 100%
}
.fix-width-120 {
	width: 120px; max-width: 100%
}
.fix-width-200 {
	width: 200px; max-width: 100%
}
.fix-width-300 {
	width: 300px; max-width: 100%
}
.fix-width-600 {
	width: 600px; max-width: 100%
}
.fix-width-800 {
	width: 800px; max-width: 100%
}
.flex {
	display: flex
}
.four-col-item {
	padding: 15px 10px; text-align: left
}
#full-nav {
	background-color: #F1F9DA; text-align: right; padding: 0 10px; margin: 1px 0 0; display: none
}
.gradient-green {
	background-color: white background: #F1F9DA; background: linear-gradient(0deg, rgba(157,196,29,1) 0%, rgba(255,255,255,1) 50%); padding: 30px 10px
}
.gradient-pale-to-green {
	margin: 0; background: linear-gradient(0deg, rgba(157,196,29,1) 0%, rgba(255,255,255,1) 27%, rgba(255,255,255,1) 82%, rgba(241,249,218,1) 100%);
}
.grid {
	display: grid
}
.grid-2-col, .grid-3-col, .grid-4-col {
	display: grid; grid-template-columns: 1fr; row-gap: 10px; column-gap: 10px; row-gap: 10px
}
.grid-4-image {
	max-width: 80%; height: auto; border-radius: 10px; margin-top: 20px
}
.grid-header {
	padding: 10px 0; font-weight: 700; background-color: #626F36; color: #FFFFFF; margin: 0
}
.grid-secion-dark {
	background-color: #979696
}
.grid-secion-light {
	background-color: #C4C4C4
}
.grid-shareholders {
	display: grid; grid-template-columns: 1fr; grid-row-gap: 3px
}
#hero-image {
	background-size: cover; width: 100%; height: 40vw; background-color: #819A31
}
h1 {
	line-height: 1.2em
}
h1, h2, h3 {
	font-weight: 400
}
h1, h2 {
	margin: .75em 0 .25em
}
h2 {
	margin: .75em 0 .25em
}
h4 {
	margin: .25em
}
.h1-tight-top {
	margin-top: 0
}
.hamburger-menu {
	--x-width: calc(var(--hamburger-height) * 1.41421356237); display: flex; flex-direction: column; gap: var(--hamburger-gap); width: max-content; position: absolute; top: 16px; /*top: var(--hamburger-margin); left: var(--hamburger-margin);*/ right: 8px; z-index: 2; cursor: pointer;
}
.hamburger-menu::before, .hamburger-menu::after, .hamburger-menu input {
	content: ""; width: var(--bar-width); height: var(--bar-height); background-color: var(--foreground);  border-radius: 999px; transform-origin: left center; transition: opacity var(--animation-timing), width var(--animation-timing), rotate var(--animation-timing),  translate var(--animation-timing)
}
.hamburger-menu input {
	appearance: none; padding: 0; margin: 0; outline: none; pointer-events: none
}
.hamburger-menu:has(input:checked)::before {
	rotate: 45deg; width: var(--x-width); translate: 0 calc(var(--bar-height) / -2);
}
.hamburger-menu:has(input:checked)::after {
	rotate: -45deg; width: var(--x-width);  translate: 0 calc(var(--bar-height) / 2);
}
.hamburger-menu:has(input:checked) + .sidebar{
	translate: calc(100vw - 17rem);
}
.hamburger-menu input:checked {
	opacity: 0; width: 0
}
.hero-balance {
	background-image: url("images/privacy-versus-transparencty-balance-480.jpg"); background-color: #BDBDBD
}
.hero-business-payments {
	background-image: url("images/two-worlds-480.jpg")
}
.hero-caas {
	background-image: url("images/caas-hero-480.jpg")
}
.hero-caas-team {
    background-image: url("images/compliance-team-480.jpg"); padding-bottom: 25%; background-repeat: no-repeat; background-size: cover
}
.hero-circuit {
	background-image: url("images/circuit-board-480.jpg")
}
.hero-connections {
	background-image: url("images/connections-480.jpg")
}
.hero-desktop {
	background-image: url("images/desktop-480.jpg")
}
.hero-error {
	background-image: url(images/broken-robot-480.jpg)
}
.hero-federated-ledger {
	background-image: url("images/connected-federated-ledgers-480.jpg")
}
.hero-forex {
	background-image: url("images/hero-currency-conversion-480.jpg"); background-position: top left !important
}
.hero-infinite {
	background-image: url("images/hero-infinite-480.jpg")
}
.hero-money {
	background-image: url("images/money-machine-480.jpg")
}
.hero-mesh {
	background-image: url("images/hero-mesh-480.jpg")
}
.hero-money-shop {
	background-image: url("images/money-shop-480.jpg")
}
.hero-network {
	background-image: url("images/network-480.jpg")
}
.hero-payment-rails {
	background-image: url("images/payment-rails-480.jpg")
}
.hero-platform {
	background-image: url("images/platform-header-480.jpg")
}
.hero-remittances {
	background-image: url("images/hero-remittance-480.jpg"); background-position: left !important
}
.hero-secure-storage {
	background-image: url("poo/secure-storage-400.jpg")
}
.hero-text {
	padding: 15px;
}
.hero-text-flush-left {
	margin: 0; text-align: center; padding: 15px;
}
.hero-text-left, .hero-text-right {
	margin: 0 auto
}
.hero-top {
	padding: 74px 0 50px; background-size:cover; background-repeat: no-repeat; background-position: center center
}
.hero-virtual {
	background-image: url("images/hero-virtual-accounts-480.jpg")
}
img {
	max-width: 100%; height: auto; border: none
}
input[type=text], input[type=date], input[type=email], input[type=password], input[type=number], select, textarea, option {
	padding: 10px; border-radius: 10px; border: solid 1px #9DC41D; box-sizing: border-box
}
input[type=submit] {
	border: none; box-sizing: border-box
}
.input-300 {
	width: 300px
}
.input-button {
	width: calc(100% - 200px); min-width: 200px; max-width: 400px
}
.input-curve-left {
	border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; margin-right: 0
}
.input-error {
	border: solid 2px #EA5B0C !important; background-color: lightpink;
}
.input-mandatory {
	border: solid 2px #626F36 !important;
}
.input-wide {
	width: 95%
}
.khuks-table {
	display: grid; column-gap: 2px; grid-template-columns: 3.5fr 1.25fr 1.25fr; font-size: 11px; padding: 10px 7px; max-width: 400px; min-width: 280px; border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; line-height: 3em;
}
.khuks-table header {
	grid-column: 1 / -1
}
label {
	font-size: 80%
}
li::marker {
	color: #626F36
}
.left-60pc {
	margin:0
}
.left-menu {
	display: none
}
#logo-bar {
	display: flex; background-color: #FFFFFF; padding: 15px 20px; text-align: left; border-bottom: solid 1px #9DC41D; justify-content: space-between; margin: 0 auto; max-width: 1600px
}
#logo-bar .logo {
    width: 120px; height: auto
}
.logo-holder {
	width: 140px
}
.lozenge {
	font-size: 11px; padding: 10px 7px; max-width: 400px; min-width: 280px; border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; line-height: 3em;
}
.lozenge-border {
	border: solid 1px #819A31; border-radius: 10px
}
.lozenge-bottom {
	border-bottom-right-radius: 20px; border-bottom-left-radius: 20px
}
.lozenge-grid {
	padding: 10px; border-radius: 15px; background-color: #FFFFFF;
}
.lozenge-grid-2-col {
	max-width: 95%; border: solid 1px #819A31; border-radius: 15px; margin: 0 auto; padding: 20px
}
.lozenge-2-col {
	width: calc(95% - 10px); margin: 0 auto; border-radius: 15px; overflow: hidden; background-size: cover; background-position: center center; padding: 10px
}
.lozenge-3-col, .lozenge-4-col {
	width: calc(95% - 20px);  border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; padding: 10px; list-style-position: inside; overflow: hidden
}
.lozenge-grid-3-col, .lozenge-grid-4-col {
	max-width: 95%;  border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; padding: 20px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: var(--grid-4-column-gap); row-gap: var(--grid-4-column-gap);
}
.lozenge-grid-4-col header {
	margin: 0 40px
}
.lozenge-adapt {
	font-size: 11px; padding: 10px 7px; min-width: 280px; border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; line-height: 3em;
}
#main-content {
	margin: 0
}
.main-menu-item {
	margin: 0 3px 0; background-color: #9DC41D; color: #3F452D; padding: 4px 6px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border: solid 1px #9DC41D
}
a.main-menu-item:link, a.main-menu-item:visited {
	color: white; text-decoration: none; font-weight: normal
}
a.main-menu-item:hover {
	background-color: white; color: #3F452D; border: solid 1px #626F36
}
.margin-bottom-10 {
	margin-bottom: 10px
}
.margin-bottom-zero {
	margin-bottom: 0 !important
}
.max-600 {
	max-width: 600px; margin: 0 auto
}
.menu-button {
	width: 70%
}
#mobile-holder {
	overflow: hidden; display: block
}
#mobile-menu {
	border-right: solid 1px #0F70B7; border-left: solid 1px #9DC41D; border-bottom: none; border-top: none; position: absolute; top: 65px; right:0; border-bottom-left-radius: 10px; background-color: #FFFFFF; background-color: rgba(255,255,255, 0.6); backdrop-filter: blur(10px); padding: 0 15px; overflow: hidden; max-height: 0; transition: max-height 0.5s, padding 0.5s; z-index = 2
}
#mobile-menu a:link, #mobile-menu a:visited {
	text-decoration: none; color: black
}
#mobile-menu a:active {
	color: #EA5B0C
}
#mobile-menu img {
	margin: -4px -15px 0 0
}
#mobile-menu-holder {
	text-align: right; height: 0
}
a.mobile-nav:link, a.mobile-nav:visited  {
	text-decoration: none; color: black; font-weight: normal
}
a.mobile-nav:hover, a.mobile-nav:active {
	color: white
}
.msb-portal-content {
	max-width: 1600px; margin: 0 auto; background-color: white background: #F1F9DA; background: linear-gradient(0deg, rgba(98,111,54,1) 0%, rgba(255,255,255,1) 50%); padding: 30px 10px
}
.number-circle {
	text-align: center; width: 2em; margin: 10px 10px 0; border-radius: 100%; line-height: 0; padding: 1em 0; font-weight: bold
}
.outline-white {
	border: solid 1px #FFFFFF !important
}
.portal-content {
	max-width: 1600px; margin: 0 auto; background-color: white background: #F1F9DA; background: linear-gradient(0deg, rgba(157,196,29,1) 0%, rgba(255,255,255,1) 50%); padding: 30px 10px
}
.portal-logo {
	width: 300px; margin: 30px 0; max-width: 80%
}
.progress-bar {
	width: 100px; max-width: 25%; margin: 0; font-size: 60%
}
.progress-container {
	display: flex; width: 400px; max-width: 100%; margin: 0 auto
}
.rounded-15 {
	border-radius: 15px
}
.sidebar {
	margin-top: calc(var(--hamburger-height) + var(--hamburger-margin) + 1rem); background-color: #9DC41D; width: 15rem; padding: 0.5rem 1rem; transition: translate var(--animation-timing); position: absolute; z-index: 2; translate: -100%; top: 20px; text-align: left
}
.skew-bottom {
	text-align: left; padding: 40px 40px 0 40px; -webkit-clip-path: polygon(0 0, 100% 0%, 100% 88%, 0 92%); clip-path: polygon(0 0, 100% 0%, 100% 88%, 0 92%); margin-bottom: -50px
}
.skew-bottom-text {
	padding-bottom: 200px
}
.small-title {
	font-size: 1.5em; margin: 0; line-height: 1.4em
}
.submenu-holder {
	line-height: 0
}
.right-content {
	text-align: left; margin: 5px 0 0 0; 
}
#show-send, #show-receive {
	display: none
}
.table {
	display: grid; grid-template-columns: auto auto auto auto auto; max-width: 90%;
}
.table-cell {
	padding: 10px 5px; background-color: #DDDDDD; margin-bottom: 10px
}
.table-header {
	padding: 10px 5px; font-weight: 700; background-color: #626F36; color: #FFFFFF; margin: 10px 0
}
.text-align-centre {
	text-align: center
}
.text-align-left {
	text-align: left
}
.text-align-right {
	text-align: right
}
.text-bigger {
	font-size: 1.5em
}
.text-black {
	color: #000000 !important
}
.text-bold {
	font-weight: 700;
}
.text-bold-italic {
	font-weight: 700;
	font-style:italic
}
.text-dark-green {
	color: #31332A !important
}
.text-green {
	color: #9DC41D !important
}
.text-italic {
	font-style: italic !important
}
.text-mid-green {
	color: #819A31 !important
}
.text-orange {
	color: #F39200 !important
}
.text-red {
	color: #EA5B0C !important
}
.text-small {
	font-size: 10px; margin: 0
}
.text-underline {
	text-decoration: underline !important
}
.text-white {
	color: #FFFFFF !important
}
.text-zero {
	font-size: 0; line-height: 0
}
.tick {
	color: #F39200; font-weight: 700
}
.transactions-table {
	display: grid; column-gap: 2px; grid-template-columns: 1fr 2fr 1fr; font-size: 11px; padding: 10px 7px; max-width: 400px; min-width: 280px; border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; line-height: 3em;
}
.transactions-table-admin {
	display: grid; column-gap: 2px; grid-template-columns: 1fr 3fr 3fr 1fr 1fr; font-size: 11px; padding: 10px 7px; width: 800px; border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; line-height: 3em; align-content: center
}
.transactions-table header {
	grid-column: 1 / -1
}
.user-table {
	margin: 15px 0; 
}
.user-table tr {
	margin-bottom: 10px
}
.user-table-bottom-row {
	font-size: 1px; line-height: 1px; background-color: #124D77
}
.videowrapper {
    float: none;
    clear: both;
    position: relative;
    padding-bottom: 52%;
    padding-top: 25px;
    height: 0;
}
.videowrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media screen and (min-width: 400px) {
	.hero-text {
		 border-radius: 15px; width:90%;
	}
	.skew-bottom-text {
        padding-bottom: 160px
    }
}
@media screen and (min-width: 540px) {
	.div-half {
        float: left; width: 250px; max-width: 90%;
    }
	.hero-balance {
        background-image: url("images/privacy-versus-transparencty-balance-600.jpg")
    }
	.hero-business-payments {
        background-image: url("images/two-worlds-600.jpg")
    }
	.hero-caas {
        background-image: url("images/caas-hero-600.jpg")
    }
	.hero-caas-team {
		background-image: url("images/compliance-team-600.jpg")
	}
	.hero-connections {
        background-image: url("images/connections-600.jpg")
    }
	.hero-circuit {
        background-image: url("images/circuit-board-600.jpg")
    }
	.hero-desktop {
        background-image: url("images/desktop-600.jpg")
    }
	.hero-error {
        background-image: url(images/broken-robot-600.jpg)
    }
	.hero-federated-ledger {
        background-image: url("images/connected-federated-ledgers-600.jpg")
    }
	.hero-forex {
        background-image: url("images/hero-currency-conversion-600.jpg")
    }
	.hero-infinite {
        background-image: url("images/hero-infinite-600.jpg")
    }
	.hero-money {
        background-image: url("images/money-machine-600.jpg")
    }
	.hero-mesh {
        background-image: url("images/hero-mesh-600.jpg")
    }
	.hero-money-shop {
        background-image: url("images/money-shop-600.jpg")
    }
	.hero-network {
        background-image: url("images/network-600.jpg")
    }
    .hero-payment-rails {
        background-image: url("images/payment-rails-600.jpg")
    }
	.hero-platform {
        background-image: url("images/platform-header-600.jpg")
    }
	.hero-remittances {
        background-image: url("images/hero-remittance-600.jpg")
    }
	.hero-virtual {
        background-image: url("images/hero-virtual-accounts-600.jpg")
    }
	
}
@media screen and (min-width: 600px) {
	.hero-balance {
        background-image: url("images/privacy-versus-transparencty-balance-800.jpg")
    }
	.hero-business-payments {
        background-image: url("images/two-worlds-800.jpg")
    }
	.hero-circuit {
        background-image: url("images/circuit-board-800.jpg")
    }
	.hero-caas {
        background-image: url("images/caas-hero-800.jpg")
    }
	.hero-caas-team {
		background-image: url("images/compliance-team-800.jpg")
	}
	.hero-connections {
        background-image: url("images/connections-800.jpg")
    }
	.hero-desktop {
        background-image: url("images/desktop-800.jpg")
    }
	.hero-error {
        background-image: url(images/broken-robot-800.jpg)
    }
	.hero-infinite {
        background-image: url("images/hero-infinite-800.jpg")
    }
	.hero-federated-ledger {
        background-image: url("images/connected-federated-ledgers-800.jpg")
    }
	.hero-forex {
        background-image: url("images/hero-currency-conversion-800.jpg")
    }
	.hero-money {
        background-image: url("images/money-machine-800.jpg")
    }
	.hero-mesh {
        background-image: url("images/hero-mesh-800.jpg")
    }
	.hero-money-shop {
        background-image: url("images/money-shop-800.jpg")
    }
	.hero-network {
        background-image: url("images/network-800.jpg")
    }
    .hero-payment-rails {
        background-image: url("images/payment-rails-800.jpg")
    }
    .hero-platform {
        background-image: url("images/platform-header-800.jpg")
    }
	.hero-remittances {
        background-image: url("images/hero-remittance-800.jpg")
    }
	.hero-text-flush-left {
        margin-left: 0; border-radius: 0 15px 15px 0; text-align: left; padding: 15px 15px 15px 20px; width: 90%
    }
	.hero-virtual {
        background-image: url("images/hero-virtual-accounts-800.jpg")
    }
	.input-wide{
		max-width: 500px
	}
}
@media screen and (min-width: 640px) {
	.desktop-only {
		display: block
	}
	.lozenge-grid-4-col {
        max-width: 95%;  border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; padding: 20px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: var(--grid-4-column-gap); row-gap: var(--grid-4-column-gap);
    }
    .lozenge-grid-4-col header {
        grid-column: 1 / span 2; margin: 0 40px
    }
	.grid-2-col, .grid-4-col {
        grid-template-columns: 1fr 1fr; row-gap: 10px; column-gap: 10px
    }
	.left-60pc {
        width: 80%;
    }
	.hero-text {
		position: relative; left: 18%; width: 53%
	}
	.hero-text-left {
		position: relative; left: 20px; width: 53%; margin: 0
	}
	#mobile-menu {
		display: none;
	}
	#mobile-menu-holder {
		display: none
	}
}
@media screen and (min-width: 800px) {
	.col-left {
		float: left; width: calc(50% - 10px); margin: 0 10px
    }
     .col-right {
		 float: left; width: calc(50% - 10px); margin: 0
    }
	
	.hero-balance {
        background-image: url("images/privacy-versus-transparencty-balance-1000.jpg")
    }
	.hero-business-payments {
        background-image: url("images/two-worlds-1000.jpg")
    }
	.hero-circuit {
        background-image: url("images/circuit-board-1000.jpg")
    }
	.hero-caas {
        background-image: url("images/caas-hero-1000.jpg")
    }
	.hero-caas-team {
		background-image: url("images/compliance-team-1000.jpg")
	}
	.hero-connections {
        background-image: url("images/connections-1000.jpg")
    }
	.hero-desktop {
        background-image: url("images/desktop-1000.jpg")
    }
	.hero-error {
        background-image: url(images/broken-robot-1000.jpg)
    }
	.hero-federated-ledger {
        background-image: url("images/connected-federated-ledgers-1000.jpg")
    }
	.hero-forex {
        background-image: url("images/hero-currency-conversion-1000.jpg")
    }
	.hero-infinite {
        background-image: url("images/hero-infinite-1000.jpg")
    }
	.hero-money {
        background-image: url("images/money-machine-1000.jpg")
    }
	.hero-mesh {
        background-image: url("images/hero-mesh-1000.jpg")
    }
	.hero-money-shop {
        background-image: url("images/money-shop-1000.jpg")
    }
	.hero-network {
        background-image: url("images/network-1000.jpg")
    }
	.hero-payment-rails {
        background-image: url("images/payment-rails-1000.jpg")
    }
	.hero-platform {
        background-image: url("images/platform-header-1000.jpg")
    }
	.hero-remittances {
        background-image: url("images/hero-remittance-1000.jpg")
    }
	.hero-text-right {
		left: 20%; width: 50%
	}
	.hero-top {
		margin-top: -16px
	}
	.hero-virtual {
        background-image: url("images/hero-virtual-accounts-1000.jpg")
    }

}
@media screen and (min-width: 1000px) {
	#full-nav {
		display: block
	}
	.grid-2 {
		display: grid; grid-template-columns: 1fr 1fr; align-items: center; grid-auto-rows: 1fr
	}
	.grid-3 {
		display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center;  grid-auto-flow:column; margin: 0
	}
	.grid-3-col {
        grid-template-columns: 1fr 1fr 1fr; row-gap: 10px; column-gap: var(--grid-4-column-gap); row-gap: var(--grid-4-column-gap);
    }
	.grid-height-control {
		height: 100%
	}
	.hero-balance {
        background-image: url("images/privacy-versus-transparencty-balance-1200.jpg")
    }
	.hero-business-payments {
        background-image: url("images/two-worlds-1200.jpg")
    }
	.hero-circuit {
        background-image: url("images/circuit-board-1200.jpg")
    }
	.hero-caas {
        background-image: url("images/caas-hero-1200.jpg")
    }
	.hero-caas-team {
		background-image: url("images/compliance-team-1200.jpg")
	}
	.hero-connections {
        background-image: url("images/connections-1200.jpg")
    }
	.hero-desktop {
        background-image: url("images/desktop-1200.jpg")
    }
	.hero-error {
        background-image: url(images/broken-robot-1200.jpg)
    }
	.hero-federated-ledger {
        background-image: url("images/connected-federated-ledgers-1200.jpg")
    }
	.hero-forex {
        background-image: url("images/hero-currency-conversion-1200.jpg")
    }
	.hero-infinite {
        background-image: url("images/hero-infinite-1200.jpg")
    }
	.hero-money {
        background-image: url("images/money-machine-1200.jpg")
    }
	.hero-mesh {
        background-image: url("images/hero-mesh-1200.jpg")
    }
	.hero-money-shop {
        background-image: url("images/money-shop-1200.jpg")
    }
	.hero-network {
        background-image: url("images/network-1200.jpg")
    }
	.hero-payment-rails {
        background-image: url("images/payment-rails-1200.jpg")
    }
	.hero-platform {
        background-image: url("images/platform-header-1200.jpg")
    }
	.hero-remittances {
        background-image: url("images/hero-remittance-1200.jpg")
    }
	.hero-text-flush-left {
        width: 70%
    }
	.hero-text-right {
		width: 40%; left: 25%
	}
	.hero-top {
		margin-top: -25px; background-size:cover;
	}
	.hero-virtual {
        background-image: url("images/hero-virtual-accounts-1200.jpg")
    }
    .left-60pc {
        width:90%; max-width: 1100px
    }
	.left-menu {
		display: block; float: left; width: 300px; background-color: #0F70B7; margin: 5px 15px 0 5px; padding: 15px; border-radius: 10px; color: #FFFFFF
	}
	.lozenge-grid-4-col {
        max-width: 95%;  border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; padding: 20px; display: grid; grid-template-columns: repeat(4, 1fr); column-gap: var(--grid-4-column-gap); row-gap: var(--grid-4-column-gap);
    }
    .lozenge-grid-4-col header {
        grid-column: 1 / span 4; margin: 0 40px
    }
    .lozenge-grid-4-col-item {
        max-width: 95%;  border: solid 1px #819A31; border-radius: 15px; background-color: #FFFFFF; margin: 0 auto; padding: 20px;
    }
		#mobile-holder {
		display: none
	}
	
	.right-content {
        text-align: left; margin: 5px 0 0 0; float: left; width: Calc(100vw - 380px); max-width: 1230px
    }
	.skew-bottom {
        -webkit-clip-path: polygon(0 0, 100% 0%, 100% 80%, 0 92%); clip-path: polygon(0 0, 100% 0%, 100% 80%, 0 92%);
    }
}
@media screen and (min-width: 1200px) {
	.grid-4-col {
        grid-template-columns: 1fr 1fr 1fr 1fr
    }
	.hero-secure-storage {
        background-image: url("poo/secure-storage-1200.jpg")
    }
	.hero-text-right {
		width: 480px; left: 25%
	}
	.hero-balance {
        background-image: url("images/privacy-versus-transparencty-balance-1600.jpg")
    }
	.hero-business-payments {
        background-image: url("images/two-worlds-1600.jpg")
    }
	.hero-caas {
        background-image: url("images/caas-hero-1600.jpg")
    }
	.hero-caas-team {
		background-image: url("images/compliance-team-1600.jpg")
	}
	.hero-circuit {
        background-image: url("images/Circuit-board-1600.jpg")
    }
	.hero-connections {
        background-image: url("images/connections-1600.jpg")
    }
	.hero-desktop {
        background-image: url("images/desktop-1600.jpg")
    }
	.hero-error {
        background-image: url(images/broken-robot-1600.jpg)
    }
	.hero-federated-ledger {
        background-image: url("images/connected-federated-ledgers-1600.jpg")
    }
	.hero-forex {
        background-image: url("images/hero-currency-conversion-1600.jpg")
    }
	.hero-infinite {
        background-image: url("images/hero-infinite-1600.jpg")
    }
	.hero-money {
        background-image: url("images/money-machine-1600.jpg")
    }
	.hero-mesh {
        background-image: url("images/hero-mesh-1600.jpg")
    }
	.hero-money-shop {
        background-image: url("images/money-shop-1600.jpg")
    }
	.hero-network {
        background-image: url("images/network-1600.jpg")
    }
	.hero-payment-rails {
        background-image: url("images/payment-rails-1600.jpg")
    }
    .hero-platform {
        background-image: url("images/platform-header-1600.jpg")
    }
	.hero-remittances {
        background-image: url("images/hero-remittance-1600.jpg")
    }
	.hero-text-flush-left {
        width: 60%
    }
	.hero-virtual {
        background-image: url("images/hero-virtual-accounts-1600.jpg")
    }
}
@media screen and (min-width: 1600px) {
	.hero-text-right {
		position: static; margin-left: 1040px
	}
	#hero-image {
		height: 400px
	}
}