@media only screen and (min-width: 2000px) and (max-width: 4000px) {
	
	html, body {
		font-size: 30px;
	}
	/* Lucky Draw */
	.roulette-view {
		width: 100vw;
		height: 17.75rem;
	}
	.roulette-section .box {
		height: 7rem;
	}
	.roulette-section {
		top: 60%;
	}
	.roulette-section .box {
		width: 50rem;
	}
	.roulette .wheel,
	.roulette .wheel .slot {
		width: 48rem;
		height: 200px;
	}
	.roulette .wheel .slot {
		padding: 0;
	}
	/* .roulette-section {
		width: 50%;
	}
	.roulette-view,
	.roulette-section .box {
		width: 100%;
	}
	.roulette .wheel .slot p:first-child {
		font-size: 5rem;
	} */
}

@media only screen and (max-width: 1440px) {
	
	/* Layout */
	.container {
		width: 80%;
	}
	
	/* Modal */
	.modal {
		width: 55%;
	}
}

/* Large devices (laptops / desktops) */
@media only screen and (max-width: 1200px) {
	
	/* Layout */
	.container {
		width: 85%;
	}
	
	/* Table */
	.table-satisfaction {
		width: 100%;
	}
	
}

/* Medium devices (landscape tablets) */
@media only screen and (max-width: 768px) {
	
	html, body {
		font-size: 14px;
	}
	
	/* Layouts */
	.registrant-wrapper {
		padding: 2em;
	}
	
	/* Footer */
	footer .sitemap .sitemap-wrapper .row > .col {
		margin-bottom: 1.5em;
	}
	footer .sitemap .sitemap-wrapper .sitemap-social {
		text-align: left;
	}
	
	/* Button */
	.register-form-page .section-form .btn-submit {
		height: 44px;
		line-height: 44px;
		padding: 0 20px;
		font-size: 1.125rem !important;
	}
	
	/* Section */
	.section-dashboard {
		padding: 1.5em;
	}
	
	/* Card */
	.program-form .card-form .card-action .btn i.left {
		margin-right: 0;
	}
	.card-number-registrant {
		height: 200px;
		padding: 1em;
	}
	.card-number-registrant.half {
		height: 93.5px;
	}
	.card-number-registrant .card-title {
		font-size: 1.25rem;
	}
	.card-number-registrant .card-number {
		font-size: 3.375rem;
	}
	.card-number-registrant.half .card-number {
		font-size: 2.75rem;
	}
	
	/* Form */
	.form-register-completed .qr-code #qrcode_reg {
		margin-top: 2em;
	}
	
	/* Modal */
	.modal {
		width: 70%;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
	
}


/* Extra small devices (phones, 600px) */
@media only screen and (max-width: 600px) {
	
	html, body {
		font-size: 12px;
	}
	
	/* Layout */
	.container {
		width: 90%;
	}
	.registrant-wrapper {
		padding: 1em;
	}
	
	/* Navbar */
	nav .nav-wrapper {
		padding: 0 1.5em;
	}
	nav .nav-member .user-avatar {
		width: 30px;
		height: 30px;
	}
	
	/* Footer */
	footer .sitemap .sitemap-wrapper {
		padding: 2em 1.5em;
	}
	footer .copyright .copyright-wrapper {
		padding: 1.125rem 1.5em;
		flex-direction: column;
		align-items: flex-start;
	}
	
	/* Button */
	.register-form-page .section-form .btn-submit {
		height: 40px;
		line-height: 40px;
	}
	
	/* Card */
	.card-login {
		width: 100%;
	}
	.program-form .card-form .card-registrant {
		margin-top: 1em;
	}
	.card-number-registrant {
		margin-bottom: 1em;
	}
	.card-number-registrant.half {
		height: 200px;
	}
	.card-number-registrant .card-title {
		font-size: 2rem;
	}
	.card-number-registrant .card-number,
	.card-number-registrant.half .card-number {
		font-size: 6.5rem;
	}
	
	/* Input Drag & Drop */
	.form-theme .image-preview .preview-image img {
		height: 110px;
	}
	.form-theme .image-preview .delete-button {
		font-size: 1.25rem;
	}
	
	/* Modal */
	.modal {
		width: 90%;
	}
	
	/* DataTable */
	.dataTables_wrapper .dataTables_length, 
	.dataTables_wrapper .dataTables_filter {
		text-align: left;
	}
	
	/* Cookie Policy */
	.policy-btn .policy-btn-accept {
		width: 100%;
	}
}


@media only screen and (min-width: 601px) {
	
	/* Navbar Style */
	header.navigation {
		/* height: 5rem; */
	}
	nav {
		height: inherit;
		line-height: normal;
	}
	
}