body {background: rgb(240, 240, 240);}

nav{
	position: fixed !important;
    width: 100% !important;
    text-align: center !important;
    height: 59px !important;
    top: 0px;
    left: 0px;
    padding: 5px;
    overflow: hidden !important;
    background: rgba(240, 240, 240, 0.5) !important;
}
	nav:hover {
		background: rgb(255, 255, 255);
	}
	nav img {
		padding-left: 10px;
		opacity: 100;
	}
	
	nav ul {
		display: flex;
		justify-content: space-around;
	}
	
	nav li {
		display: contents !important;
		top: 0px !important;
		line-height: 10px;
		color: rgba(57, 76, 108, 1) !important;	
		line-height: 30px;
	}
		nav .menutext {
			padding: 0px;
			display: unset;
		}
	
	nav .top {
		padding: 0px !important;
		float: left;
	}
	
	nav .button {color: #fff !important; margin-top: -18px;}
	nav .button .material-icons {vertical-align: bottom !important; color: #ff9600;}
	
	.h1box small:hover .material-icons ,li a:hover .material-icons, .splitScreen-2:hover .material-icons, .splitScreen-3:hover .material-icons {
		transform: scale(-1, 1);
		transition-duration: 0.5s;
		color: #ff9600 !important;
	}
		
section, .section, haeder {
	margin: 0 auto;
    width: -webkit-fill-available !important;
    max-width: 1200px !important;
    padding: 0px;
    background: transparent !important;
}
	main {
		background: unset;
		padding: 0px;
	}
	.mainheader {
		margin: 10% 0;
		text-align: left;
		display: flex;
		justify-content: space-between;
	}
		.bigimg {
			margin: 100px 0px 150px 0px;
			padding: 10% 5%;
			color: #fff;
		}
		
		.mainheader .h1box {
			width: 50%;
		}
			.mainheader h1 {
				text-align: left;
				font-size: 2.5vw;
				font-weight: 800;
				font-family: Inter, ui-sans-serif, system-ui, -apple-system, system-ui, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color emoji;
			}
			.mainheader p {
				padding: 0px 10px;
				font-size: 17px;
			}
			
			.mainheader .textshadow {text-shadow: 0px 0px 10px #333;}
		
		.mainheader .collagebox {
			width: 40%;
			display: inline-flex;
			flex-wrap: wrap;
		}
			.mainheader .collagebox img {
				width: -webkit-fill-available;
				height: fit-content;
			}
			
			.mainheader .collagesmall, .mainheader .collagebig{
				border-radius: 40px;
				overflow: hidden;
				height: 200px;
				text-align: center;
				margin: 2%;
			}
				.mainheader .collagesmall{width: 30%;}
				.mainheader .collagebig{
					width: -webkit-fill-available;
					height: 100%;
					padding-top: 75px;
				}
				.mainheader video {
					width: -webkit-fill-available;
					border-radius: 50px;
				}
	
	.splitBox {margin: 50px 0;}
		.splitScreen-1 {margin: 0% !important;}
		.splitScreen-1, .splitScreen-2, .splitScreen-3, .splitScreen-4 {
			margin: 4% 2%;
			text-align: left;
			border-radius: 25px;
		}
			.splitScreen-2:hover, .splitScreen-3:hover, video:hover, iframe:hover {box-shadow: 5px 5px 5px 0px #ccc;}
			.splitScreen-1:hover,.splitScreen-2:hover, .splitScreen-3:hover, .splitScreen-4:hover {
				transform: scale(1.02);
				transition: transform .1s;
			}
				.splitScreen-img {height: 175px; border-radius: 15px;}
				.blue .splitScreen-1 , .blue .splitScreen-2, .blue .splitScreen-3, .blue .splitScreen-4, .none .splitScreen-1 , .none .splitScreen-2, .none .splitScreen-3, .none .splitScreen-4 {
					background: transparent;
					margin: 2%;
				}
			.splitScreen-clean {background: transparent !important;}
				.splitScreen-clean:hover, .blue .splitScreen-2:hover, .blue .splitScreen-3:hover {box-shadow: none;}
			
			.splitBox .splitScreen-2 ul li::marker {
			  color: #ff9600;
			  font-size: 1.5em;
			}
			
			.splitBox .splitScreen-calltoaction input[type="text"] {
				text-align: center;
				line-height: 60px;
				font-size: 25px;
				background: #f2f2f2;
			}
				.splitBox .splitScreen-calltoaction h3 {font-size: 50px;}
				.splitBox .splitScreen-calltoaction p {font-size: 25px;}
				
			.money {background: url(https://123betalen.com/images/img1.jpg) no-repeat center center transparent; background-size: cover;}	
			.coffiebar {background: url(https://123betalen.com/images/img2.jpg) no-repeat center center transparent; background-size: cover;}
			.receipt {background: url(https://123betalen.com/images/img3.jpg) no-repeat center center transparent; background-size: cover;}
			.event {background: url(https://123betalen.com/images/img6.jpg) no-repeat center center transparent; background-size: cover;}	
			.shop {background: url(https://123betalen.com/images/img7.jpg) no-repeat center center transparent; background-size: cover;}	
			.scissors {background: url(https://123betalen.com/images/img8.jpg) no-repeat center center transparent; background-size: cover;}
			.windowwasher {background: url(https://123betalen.com/images/img9.jpg) no-repeat center center transparent; background-size: cover;}
			.drivinglesson {background: url(https://123betalen.com/images/img10.jpg) no-repeat center center transparent; background-size: cover;}	
			.moneytrie {background: url(https://123betalen.com/images/img11.jpg) no-repeat center center transparent; background-size: cover;}	
			.hands {background: url(https://123betalen.com/images/img12.jpg) no-repeat center center transparent; background-size: cover;}
			.handsyellow {background: url(https://123betalen.com/images/img13.jpg) no-repeat center center transparent; background-size: cover;}
			.barber {background: url(https://123betalen.com/images/img14.jpg) no-repeat center center transparent; background-size: cover;}
			.bgbeauty {background: url(https://123betalen.com/images/bg1.jpg) no-repeat center center transparent; background-size: cover;}	
			.bgbarber {background: url(https://123betalen.com/images/bg3.jpg) no-repeat center center transparent; background-size: cover;}
			.bgdiy {background: url(https://123betalen.com/images/bg2.jpg) no-repeat center center transparent; background-size: cover;}
			.bgpaint {background: url(https://123betalen.com/images/bg4.jpg) no-repeat center center transparent; background-size: cover;}	
			.bgtape {background: url(https://123betalen.com/images/bg5.jpg) no-repeat center center transparent; background-size: cover;}
			
	.footerBox {
		margin: 50px 0 0 0;
		border-radius: 0px;
		display: flex;
		flex-wrap: wrap;
		width: -webkit-fill-available;
		overflow: hidden;
		padding: 0 10%; 
		justify-content: space-between;
		background: url(https://123betalen.com/images/new/FooterBG@1x.svg) center center no-repeat;
		color: #fff;
		background-size: cover;
	}
		.footerBox h3 {font-size: 3vw;}
		.footerBox p {font-size: 2vw;}
		.footerBox .material-icons  {font-size: 5vh;}
		.footerBox .splitScreen-2 {
			padding: 0;
			margin: 0px;
			width: 48%;
		}
		
		.footerBox input[type="text"], .demoinput{
			padding: 2% 0;
			text-align: center;
			font-size: 20px;
			border-radius: 25px !important;
			background: #ccc !important;
			border: 1px solid #bbb !important;
		}
		
	.slideshow {
		overflow: hidden;
		height: 250px;
	}
		.slide-wrapper {
			-webkit-animation: slide 20s ease infinite;
		}
			.slide {
				float: right;
				margin: 10px;
				transition: transform .2s;
			}
	
	.listitem {
		position: relative;
		width: -webkit-fill-available;
		margin: 150px 0px;
		border-radius: 10px;
	}
		.item {
			position: absolute;
			width: 50%;
			height: -webkit-fill-available;
			top: 0px;
			left: 0px;
			color: #333;
			padding: 10px;
			line-height: normal;
			border-radius: 50px;
			text-align: center;
		}

	.text {
		margin: 10px 0 10px 55%;
		padding: 10px 25px;
		background: rgba(250, 250, 250, 0.75);
		border-radius: 25px;
		border: 0px;
		text-align: left;
		line-height: 20px;
	}
		.text .material-icons {text-align: center;}
		.text:hover {background: #ff9600;}
		.text .info {
			border-left: 3px solid #ff9600;
			padding-left: 10px;
			font-style: italic;
		}
			.text:hover .info {
				border-left: 3px solid #394c6c;
				color: rgba(255, 255, 255, 1);
			}

	.itembody1, .itembody2, .itembody3  {display: none; -webkit-animation: fade 2s ease;}
		.text:hover .itembody1 {display: block; -webkit-animation: fade 2s ease;}
		.text:hover .itembody3 {display: block; -webkit-animation: fade 2s ease;}
		.text:hover .itembody2 {display: block; -webkit-animation: fade 2s ease;}

footer {
	max-height: unset;
}
	footer .footerLeft, footer .footerRight{
		max-width: 250px;
	}
		footer .footerLeft{float: left;}
		footer .footerRight{float: right;}
		
		footer a {
			border-left: 3px solid #ff9600;
			padding-left: 5px;
			margin-left: 3px;
		}
		footer h2 {font-size: 25px;}
		footer .links a {
			text-transform: none;
			padding: 20px 10px;
		}
		
.float-right {float: right;}
.top-0 {margin-top: 0px;}

.button {
	font-size: 20px;
    border-radius: 10px !important;
	margin: 10px 0;
}
	.blue .button, footer .button {background: #ff9600; color: #333 !important;}
	.buttonwhite {background: #fff !important;}
	
.big {font-size: 50px !important;}

.img, .iframe, .foto {
    border: 2px solid #394c6c;
    margin-left: 10px;
    box-shadow: 5px 10px #394c6c;
    max-height: 400px;
    border-radius: 25px;
}

input[type=submit], input[type=button] {
	background-color: #2420cf
}

@-webkit-keyframes slide {
  0% {margin-top: 0px;}
  15% {margin-top: 0px;}
  20% {margin-top: -250px;}
  35% {margin-top: -250px;}
  40% {margin-top: -500px;}
  55% {margin-top: -500px;}
  60% {margin-top: -750px;}
  75% {margin-top: -750px;}
  80% {margin-top: -250px;}
  95% {margin-top: -250px;}
}

@-webkit-keyframes submenu {
	0% {opacity: 0; margin-top: -50px;}
	100% {opacity: 1; margin-top: 0px;}
}

@-webkit-keyframes fade {
	0% {filter: blur(10px); filter: brightness(50%);}
	100% {filter: blur(0px); filter: brightness(100%);}
}

@media only screen and (min-width: 1200px) {
	.mainheader h1 {
		font-size: 30px;
	}
}

@media only screen and (max-width: 1200px) {
	.splitBox, .item, .text {border-radius: 0px;}
	.noTablet {display: none !important;}
}

@media only screen and (max-width: 800px) {
	nav .menutext {
		padding: 0px;
		display: none !important;
	}
	
	.nav img {
		display: unset !important;
		left: 5%;
	}
	
	.mainheader {margin: 69px 0;}
		.mainheader .collagebox, .mainheader .h1box {
			width: 90% !important;
			margin-left: 5% !important;
			flex-wrap: nowrap !important;
		}
			.mainheader .collagebox {margin-left: 0px !important;}
		
		.nomob {display: none;}
		.mainheader {display: block !important;}
			.mainheader .collagesmall {width: -webkit-fill-available;}
			.mainheader .collagesmall video {border-radius: 25px;}
			.mainheader, .mainheader h1, .mainheader .h1box {text-align: center !important;}
			.slide {float: left;}
			
			.mainheader h1 {font-size: 25px; }
			.mainheader p {font-size: 15px;}
	
	nav ul {
		line-height: 0px !important;
        padding: 10px 0;
        margin-left: 10px !important;
	}
		nav .menutext {display: none !important;}
		nav:hover ul {display: inline;}
		nav:hover li a {padding-bottom: 50px;}
		nav:hover li .button {padding-bottom: 10px;}
		
		nav ul .submenu {display: none !important;}
}

@media only screen and (max-width: 600px) {
	main {
		margin: 0px !important;
		max-width: unset !important;
	}
	.footerBox h3 {font-size: 6vw;}
	.footerBox p {font-size: 4vw;}
	.noTablet {display: unset !important;}
	
	.money {background: url(https://123betalen.com/images-small/img1.jpg) no-repeat center center transparent; background-size: cover;}	
	.coffiebar {background: url(https://123betalen.com/images-small/img2.jpg) no-repeat center center transparent; background-size: cover;}
	.receipt {background: url(https://123betalen.com/images-small/img3.jpg) no-repeat center center transparent; background-size: cover;}
	.event {background: url(https://123betalen.com/images-small/img6.jpg) no-repeat center center transparent; background-size: cover;}	
	.shop {background: url(https://123betalen.com/images-small/img7.jpg) no-repeat center center transparent; background-size: cover;}	
	.scissors {background: url(https://123betalen.com/images-small/img8.jpg) no-repeat center center transparent; background-size: cover;}
	.windowwasher {background: url(https://123betalen.com/images-small/img9.jpg) no-repeat center center transparent; background-size: cover;}
	.drivinglesson {background: url(https://123betalen.com/images-small/img10.jpg) no-repeat center center transparent; background-size: cover;}	
	.moneytrie {background: url(https://123betalen.com/images-small/img11.jpg) no-repeat center center transparent; background-size: cover;}	
	.hands {background: url(https://123betalen.com/images-small/img12.jpg) no-repeat center center transparent; background-size: cover;}
	.handsyellow {background: url(https://123betalen.com/images-small/img13.jpg) no-repeat center center transparent; background-size: cover;}
	.barber {background: url(https://123betalen.com/images-small/img14.jpg) no-repeat center center transparent; background-size: cover;}
	.bgbeauty {background: url(https://123betalen.com/images-small/bg1.jpg) no-repeat center center transparent; background-size: cover;}	
	.bgbarber {background: url(https://123betalen.com/images-small/bg3.jpg) no-repeat center center transparent; background-size: cover;}
	.bgdiy {background: url(https://123betalen.com/images-small/bg2.jpg) no-repeat center center transparent; background-size: cover;}
	.bgpaint {background: url(https://123betalen.com/images-small/bg4.jpg) no-repeat center center transparent; background-size: cover;}	
	.bgtape {background: url(https://123betalen.com/images-small/bg5.jpg) no-repeat center center transparent; background-size: cover;}
}