body,
html {
	font-family: rubik, Sans-Serif;
	background-color: #f5f8ff;
	line-height: 1.3;
	height: 100%;
	overflow-x: hidden;
}
.logo {
	width: 15rem;
	text-align: center;
}
.login {
	min-height: 100vh;
}
.bg-image {
	background-size: cover;
	background-position: center;
	border-radius: 0 1.2rem 1.2rem 0;
	margin: 0.7rem;
}
.login-heading {
	font-weight: 300;
}
.btn-login {
	font-size: 0.9rem;
	letter-spacing: 0.05rem;
	padding: 0.75rem 1rem;
}
.login-subtitle {
	position: relative;
	text-align: center;
}
.login-subtitle::after,
.login-subtitle::before {
	content: '';
	height: 0.0625rem;
	position: absolute;
	width: 22%;
	top: 50%;
	transform: translateY(-50%);
}
.login-subtitle::before {
	background: #ebebeb;
	left: 0;
}
.login-subtitle::after {
	background: #ebebeb;
	right: 0;
}
.context {
	width: 100%;
	position: absolute;
	top: 50vh;
}
.context h1 {
	text-align: center;
	color: #ae8abe;
	font-size: 3.125rem;
}
@keyframes move3 {
	0% {
		-webkit-transform: translate(0);
		transform: translate(0);
	}
	50% {
		-webkit-transform: translate(1.875rem);
		transform: translate(1.875rem);
	}
	100% {
		-webkit-transform: translate(0);
		transform: translate(0);
	}
}
@keyframes move5 {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
	50% {
		-webkit-transform: translateY(-1.875rem);
		transform: translateY(-1.875rem);
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}
.shape.item-w-16 {
	top: 55%;
	left: 25%;
	width: 1rem;
	height: 1rem;
}
.shape.item-w-32 {
	top: 50.7%;
	right: 18.8%;
	width: 2rem;
	height: 2rem;
}
.shape.item-w-51 {
	top: 14.5%;
	right: 16.4%;
	width: 3.1875rem;
	height: 3.1875rem;
}
.shape {
	border-radius: 0.5rem;
	z-index: 1;
	position: absolute;
}
.shape.item-w-32 {
	animation: move3 4s infinite linear;
}
.shape.item-w-16,
.shape.item-w-51 {
	animation: move5 7s infinite linear;
}
.shape {
	background: linear-gradient(227.3deg, #602476 0, #ffb2b7 100.84%);
}
.full-height {
	height: 100vh; /* Full viewport height */
}

.bg-intel {
	background: url(/orders/bs2/pics/intelplus/bg_intelplus_2hx_v03.png);
	background-size: cover;
	background-position: center;
	height: 95%;
	width: 95%;
	margin: auto auto;
	border-radius: 0 1.2rem 1.2rem 0;
}

.main-wrap {
	height: 100vh;
}


.bg-red {
	background-color: red;
}

.bg-blue {
	background-color: blue;
}

.bg-yellow {
	background-color: yellow;
}

.main-wrap {
	height: 100vh;
}

.takanon-notes {
    font-size: 12px;
    padding: 20px 50px;
    text-align: justify;
    margin: 0 auto;
	margin-bottom: 10px;
}
.btn-primary {
	background-color:#ee731f;
}

.btn-primary:hover {
	background-color:#c65a10;
}

.form-control {
    font-size: .875rem;
    border: .0625rem solid #fff;
    border-radius: .5rem;
    padding: .5625rem 1.25rem;
}

/* Hide all by default */
.xs, .sm, .md, .lg, .xl {
  display: none;
}

/* Extra small: <576px */
@media (max-width: 575.98px) {
  .xs { display: block !important; }
}

/* Small: ≥576px and <768px */
@media (min-width: 576px) and (max-width: 767.98px) {
  .sm { display: block !important; }
}

/* Medium: ≥768px and <992px */
@media (min-width: 768px) and (max-width: 991.98px) {
  .md { display: block !important; }
}

/* Large: ≥992px and <1200px */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .lg { display: block !important; }
}

/* Extra large: ≥1200px */
@media (min-width: 1200px) {
  .xl { display: block !important; }
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #ed7d31;
    --bs-btn-border-color: #ed7d31;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #c96a2a;
    --bs-btn-hover-border-color: #be6427;
    --bs-btn-focus-shadow-rgb: 237, 125, 49;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #be6427;
    --bs-btn-active-border-color: #b25e25;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #ed7d31;
    --bs-btn-disabled-border-color: #ed7d31;
}

/* Base State */
.btn-primary {
    color: #fff;
    background-color: #ed7d31;
    border-color: #ed7d31;
}

/* Hover State */
.btn-primary:hover {
    color: #fff;
    background-color: #c96a2a;
    border-color: #be6427;
}

/* Focus State */
.btn-primary:focus, 
.btn-primary.focus {
    color: #fff;
    background-color: #c96a2a;
    border-color: #be6427;
    box-shadow: 0 0 0 0.25rem rgba(237, 125, 49, 0.5);
}

/* Active State (Clicking/Pressing) */
.btn-primary:active, 
.btn-primary.active, 
.show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #be6427;
    border-color: #b25e25;
}

/* Active + Focus State */
.btn-primary:active:focus, 
.btn-primary.active:focus, 
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(237, 125, 49, 0.5);
}

/* Disabled State */
.btn-primary:disabled, 
.btn-primary.disabled {
    color: #fff;
    background-color: #ed7d31;
    border-color: #ed7d31;
    opacity: 0.65;
}