@font-face {
    font-family: 'Citroen Extra Light';
    src: url('fonts/CitroenType-ExtraLight.eot');
    src: url('fonts/CitroenType-ExtraLight.eot?#iefix') format('embedded-opentype'),
        url('fonts/CitroenType-ExtraLight.woff2') format('woff2'),
        url('fonts/CitroenType-ExtraLight.woff') format('woff'),
        url('fonts/CitroenType-ExtraLight.ttf') format('truetype'),
        url('fonts/CitroenType-ExtraLight.svg#CitroenType-ExtraLight') format('svg');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Citroen Black';
    src: url('fonts/CitroenType-Black.eot');
    src: url('fonts/CitroenType-Black.eot?#iefix') format('embedded-opentype'),
        url('fonts/CitroenType-Black.woff2') format('woff2'),
        url('fonts/CitroenType-Black.woff') format('woff'),
        url('fonts/CitroenType-Black.ttf') format('truetype'),
        url('fonts/CitroenType-Black.svg#CitroenType-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Citroen Light';
    src: url('fonts/CitroenType-Light.eot');
    src: url('fonts/CitroenType-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/CitroenType-Light.woff2') format('woff2'),
        url('fonts/CitroenType-Light.woff') format('woff'),
        url('fonts/CitroenType-Light.ttf') format('truetype'),
        url('fonts/CitroenType-Light.svg#CitroenType-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Citroen Bold';
    src: url('fonts/CitroenType-Bold.eot');
    src: url('fonts/CitroenType-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/CitroenType-Bold.woff2') format('woff2'),
        url('fonts/CitroenType-Bold.woff') format('woff'),
        url('fonts/CitroenType-Bold.ttf') format('truetype'),
        url('fonts/CitroenType-Bold.svg#CitroenType-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Citroen Medium';
    src: url('fonts/CitroenType-Medium.eot');
    src: url('fonts/CitroenType-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/CitroenType-Medium.woff2') format('woff2'),
        url('fonts/CitroenType-Medium.woff') format('woff'),
        url('fonts/CitroenType-Medium.ttf') format('truetype'),
        url('fonts/CitroenType-Medium.svg#CitroenType-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Citroen Regular';
    src: url('fonts/CitroenType-Regular.eot');
    src: url('fonts/CitroenType-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/CitroenType-Regular.woff2') format('woff2'),
        url('fonts/CitroenType-Regular.woff') format('woff'),
        url('fonts/CitroenType-Regular.ttf') format('truetype'),
        url('fonts/CitroenType-Regular.svg#CitroenType-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face{
	font-family: 'FontAwesome';
	src: url('fonts/fontawesome-webfont.eot?v=4.7.0');
	src: url('fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),
		url('fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),
		url('fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),
		url('fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),
		url('fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style:normal;
}

html, body{
	padding: 0px;
	margin: 0px;
	width: 100%;
	height: 100%;
	color: #fff;
	background-color: #040409;
}
.body-landing{
	overflow: hidden;
}

button,
input,
textarea{
	outline: none;
}

.err{
	position: relative;
	display: block;
	color: #f00;
	display: none;
	font-family: 'Citroen Regular';
	font-size: 14px;
	margin-top:5px;
}
	.text-error,
	.text-error:focus{
		border: solid 1px red;
	}
	
	.body{
		position: relative;
		display: block;
		width: 100%;
		min-height: 100%;
		left: 50%;
		transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		background-color: #fff;
		color : #000;
		background-image: url('../../images/footer-bawah.png');
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-position: bottom center;
	}
		.content{
			position: relative;
			display: block;
			width: 100%;
		}
			.content-register{
				width: 100%;
				height: auto;
				left: 50%;
				transform: translateX(-50%);
				padding-bottom: 100px;
			}
				.judul-register{
					width: 100%;
					position: relative;
					display: block;
					font-family: 'Citroen Medium';
					font-size: 32px;
					color: #405376;
					text-align: center;
					margin-bottom: 10px;
				}
				.box-register{
					position: relative;
					display: block;
					width: 80%;
					left: 50%;
					transform: translateX(-50%);
					font-family: 'Citroen Regular';
					font-size: 14px;
					color: #405376;
				}
					.text-field{
						position: relative;
						display: block;
						border: solid 2px #405376;
						width: 100%;
						padding: 7px 10px;
						border-radius: 25px;
					}
					.btn-submit{
						background-color: #7b97a9;
						font-family: 'Citroen Medium';
						font-size: 20px;
						color: #fff;
						padding: 5px 50px;
						border: none;
						border-radius: 30px;
					}
				.box-home-button{
					position: relative;
					display: block;
					margin-top: 30px;
				}
				.box-home-button .form-group{
					padding: 5px 0px;
				}
					.btn-menu{
						position: relative;
						display: block;
						width: 100%;
						background-color: #fff;
						color: #405376;
						font-family: 'Citroen Medium';
						font-size: 16px;
						text-align: left;
						border: solid 2px #405376;
						padding: 13px 20px;
						border-radius: 25px;
					}
					.btn-menu:after{
						font-family: 'FontAwesome';
						content:"\f144";
						position: absolute;
						right: 20px;
						top: 4px;
						font-size: 28px;
					}
						.btn-menu-active{
							background-color: #405376;
							color: #fff;
						}
							.btn-menu-active:after{
								font-family: 'FontAwesome';
								content:"\f144";
								position: absolute;
								right: 20px;
								top: 4px;
								font-size: 28px;
								transform: rotate(90deg);
							}
					
				.box-judul-page{
					position: relative;
					display: block;
					width: 80%;
					left: 50%;
					transform: translateX(-50%);
					margin-top: 20px;
				}
					.judul-page{
						position: relative;
						display: block;
						width: 100%;
						background-color: #405376;
						color: #fff;
						font-family: 'Citroen Medium';
						font-size: 16px;
						text-align: left;
						border: solid 2px #405376;
						padding: 13px 20px;
						border-radius: 25px;
					}
						.judul-page:after{
							font-family: 'FontAwesome';
							content:"\f144";
							position: absolute;
							right: 20px;
							top: 4px;
							font-size: 28px;
							transform: rotate(90deg);
						}
						
			.box-button-bottom{
				position: absolute;
				display: block;
				text-align: center;
				width: 100%;
				bottom: 50px;
			}
				.box-isi{
					position: relative;
					display: none;
					padding: 20px !important;
					border: solid 2px #405376;
					margin-top: 10px;
					border-radius: 25px;
					font-family: 'Citroen Regular';
					font-size: 16px;
				}
				.isi-dealer{
					font-size: 14px;
				}
				.isi-produk{
					border: none;
					padding: 0px !important;
				}
					.frame-produk{
						position: relative;
						display: block;
						padding: 20px !important;
						border: solid 2px #405376;
						margin-top: 10px;
						border-radius: 25px;
						font-family: 'Citroen Regular';
						font-size: 16px;
						margin-bottom: 10px;
					}
					.box-brosur{
						position: relative;
						display: block;
					}
						.brosur-left,
						.brosur-right{
							position: relative;
							display: inline-block;
							width: 49%;
							background-color: #7b97a9;
							color: #fff;
							font-family: 'Citroen Medium';
							padding: 10px;
							border: none;
						}
						.brosur-left{
							border-radius: 20px 0 0 20px;
						}
						.brosur-right{
							border-radius: 0 20px 20px 0;
						}
						
					.box-judul-antrian{
						position: relative;
						display: block;
						width: 100%;
						text-align: center;
						border: solid 2px #405376;
						font-family: 'Citroen Regular';
						font-size: 20px;
						padding: 10px;
						border-radius: 25px;
					}
						.box-qr{
							position: relative;
							display: block;
							width: 80%;
							left: 50%;
							transform: translateX(-50%);
						}
						.no-antrian{
							position: relative;
							display: block;
							width: 100%;
							text-align: center;
							font-family: 'Citroen Medium';
							font-size: 120px;
						}


/*Tablet / iPad / Laptop Portraid*/
@media only screen
and (min-width: 601px) {
	
}


/*Tablet / iPad / Laptop Landscape*/
@media only screen
and (min-width: 1024px) {
	.body{
		max-width: 50vh;
	}
}


/*Laptop / Desktop*/
@media only screen
and (min-width: 1280px) {
	
}


/*Desktop 1366*/
@media only screen
and (min-width: 1366px) {
	
}


/*Desktop MAC*/
@media only screen
and (min-width: 1440px) {
	
}


/*Desktop Full HD MAC*/
@media only screen
and (min-width: 1680px) {
	
}


/*Desktop Full HD*/
@media only screen
and (min-width: 1920px) {
		
}