@charset "utf-8";

/*==================================
	Base
==================================*/
html,
body{
	height:100%;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
body.body-main{
	/*background-color:#fdfae8;*/
	background-color:#fff;
}
/*==================================
	text & bg
==================================*/
.bg-danger{
	background-color:#ff674f !important;
}
.bg-warning{
	background-color:#f8e773 !important;
}
.bg-info{
	background-color:#117a8b !important;
}
.bg-primary{
	background-color:#5278a2 !important;
}
.bg-success{
	background-color:#6dbd12 !important;
}
.bg-purple{
	background-color:#b97abb !important;
}
.bg-warning-light{
	/*background-color:#fdfae8;*/
}
.text-info{
	color: #178286 !important;
}
.text-primary{
	color: #285aa0 !important;
}
.text-success{
	color: #6dbd12 !important;
}
.text-purple{
	color: #751596 !important;
}

/*==================================
	Common single column
==================================*/
.single-col{
	display:table;
	width:100%;
	height:100%;
}
.single-col .single-col-body{
	display:table-cell;
	vertical-align:middle;
}
.single-col .single-col-body .single-col-container{
	margin:0 auto;
}
@media (min-width: 768px) {
	.single-col .single-col-body .single-col-container{
		width:900px;
	}
	.single-col .single-col-body .single-col-container.single-col-container-sm{
		width:550px;
	}
}

/*==================================
	Login & Menu
==================================*/
.login h1,
.menu h1{
	font-size:3rem;
}
.login h2,
.menu h2{
	font-weight:300;
	font-size:1.75rem;
}
.login .card{
	margin-top:50px;
}
.menu .card{
	margin-top:25px;
}
.login .card .card-body{
	padding:60px 25px;
}
.menu .card .card-body{
	padding:60px 25px;
}
.login .btn-login,
.menu .btn-start{
	margin-top:40px;
	width:100%;
	padding:20px 0;
	font-size:1.5rem;
	line-height:1;
	font-weight:700;
}
.login .form-control{
	font-weight:700;
}
.menu .table-list th{
	font-size:1.5rem;
	width:1%;
	white-space:nowrap;
}
.div-login-input-wrapper{
	position:relative;
}
.div-login-input-wrapper .form-control{
	padding-left:45px;
	margin-bottom: 5px;
	height:63px;
}
.div-login-input-wrapper .fas{
	font-weight: 900;
	position: absolute;
	left: 14px;
	top: 22px;
	color: #aaa;
	font-size: 18px;
}
@media (min-width: 768px) {
	.login .form-control-group,
	.login .btn{
		width:340px;
		margin:0 auto;
	}
	.login .btn-login,
	.menu .btn-start{
		margin-top:10px;
	}
	.menu .btn-start{
		width:340px;
	}
}
@media (max-width: 767.98px) {
	.menu h1{
		margin-top:1rem;
		font-size:2rem;
	}
	.login h2{
		font-size:1.5rem;
	}
	.menu h2{
		font-size:1.2rem;
	}
	.login .card{
		margin:50px 0;
		border-radius:0;
	}
	.menu .card{
		margin: 25px 15px 0 15px;
	}
	.menu .card .card-body{
		padding: 20px 25px;
	}
}

/*==================================
	Card
==================================*/
.card{
	border:none;
	box-shadow:none;
	border-radius:10px;
}
.card.bg-warning{
	background-color:#f8d273 !important;
}

/*==================================
	Form
==================================*/
.form-control{
	outline:none !important;
}
.form-control.form-control-lg{
	height: calc(3.75rem + 2px);
	font-size:1.15rem;
}
.form-control-group .input-group-text,
.form-control-group .form-control{
	border-radius:0;
	border:none;
	box-shadow:none !important;
}
.form-control-group .input-group-text{
	background-color:#fff;
	padding: .375rem .75rem .375rem 1.25rem;
	font-size: 1.25rem;
	color:#ccc;
}
.form-control-group .input-group:first-child{
	margin-bottom:1px;
}
.form-control-group .input-group:first-child .input-group-text{
	border-radius:10px 0 0 0;
}
.form-control-group .input-group:last-child .input-group-text{
	border-radius:0 0 0 10px;
}
.form-control-group .input-group:first-child .form-control{
	border-radius:0 10px 0 0;
}
.form-control-group .input-group:last-child .form-control{
	border-radius:0 0 10px 0;
}

.form-control-info-wrap{
	position:relative;
}
.form-control-info-wrap:before{
	content: '\f0d7';
	font-family: Font Awesome\ 5 Free;
	position: absolute;
	z-index: 2;
	right: 19px;
	font-size: 1.75rem;
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
	font-weight: bold;
	top: 50%;
	margin-top: -.95rem;
	color:#021e7f;
}
.form-control-info-wrap:after{
	content: '';
	position: absolute;
	z-index: 3;
	height: calc(100% - 1rem);
	margin: .375rem 0;
	width: 1px;
	top: .1rem;
	right: 3.25rem;
	background-color: #021e7f;
	box-sizing: border-box;
}
.form-control-info{
	border-width:2px;
	border-color:#71c0fb;
	background-color:#cae9fe;
}
.form-control-info-wrap .form-control-info{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding-right: 4rem;
}
table thead th > .custom-control .custom-control-input,
table tbody th > .custom-control .custom-control-input{
	left: 0;
}
table thead th > .custom-control .custom-control-label,
table tbody th > .custom-control .custom-control-label{
	position: absolute;
	z-index:1;
	left: 0;
	top: 0;
}
table thead th > .custom-control .custom-control-label::before,
table thead th > .custom-control .custom-control-label::after,
table tbody th > .custom-control .custom-control-label::before,
table tbody th > .custom-control .custom-control-label::after{
	top: .3rem;
	left: .3rem;
}
.custom-checkbox .custom-control-input:checked~.custom-control-label::before,
.custom-radio .custom-control-input:checked~.custom-control-label::before{
	background-color: #6dbd12;
}

/*==================================
	Btn
==================================*/
.btn{
	border:none;
	box-shadow:none;
	font-weight:700;
	box-shadow:inset 0 -3px 0 rgba(0,0,0,0.15) !important;
}
.btn-success{
	background-color:#6dbd12;
	border:none;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active{
	background-color:#7ece23 !important;
}
.btn-secondary{
	background-color:#f8e773;
	color:#212529;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active{
	background-color:#ffe954 !important;
}
.btn-primary{
	background-color:#5278a2;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active{
	background-color:#3372b7 !important;
}
.btn-warning{
	color:#fff !important;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active{
	background-color:#f7b900 !important;
}
.btn-danger{
	background-color:#f88573;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active{
	background-color:#ff674f !important;
}
.btn-purple{
	background-color:#b97abb;
	color:#fff !important;
}
.btn-purple:hover,
.btn-purple:focus,
.btn-purple:active{
	background-color:#bd6dbf !important;
}
.btn-dark-danger{
	background-color: #dc3545;
	color:#fff !important;
}
.btn-dark-danger:hover,
.btn-dark-danger:focus,
.btn-dark-danger:active{
	background-color:#c82333 !important;
}
.btn-dark-warning{
	background-color: #dcae35;
	color:#fff !important;
}
.btn-dark-warning:hover,
.btn-dark-warning:focus,
.btn-dark-warning:active{
	background-color:#c89b23 !important;
}
.btn-dark-info{
	background-color: #178286;
	color:#fff !important;
}
.btn-dark-info:hover,
.btn-dark-info:focus,
.btn-dark-info:active{
	background-color:#177073 !important;
}
.btn-dark-primary{
	background-color: #285aa0;
	color:#fff !important;
}
.btn-dark-primary:hover,
.btn-dark-primary:focus,
.btn-dark-primary:active{
	background-color:#163d82 !important;
}
.btn-dark-success{
	background-color: #15963b;
	color:#fff !important;
}
.btn-dark-success:hover,
.btn-dark-success:focus,
.btn-dark-success:active{
	background-color:#096f1e !important;
}
.btn-dark-purple{
	background-color: #751596;
	color:#fff !important;
}
.btn-dark-purple:hover,
.btn-dark-purple:focus,
.btn-dark-purple:active{
	background-color:#47096f !important;
}

.footer-body-left .btn,
.footer-body-right .btn,
.toggle-menu .toggle-menu-footer .btn{
	width:70px;
	height:70px;
	padding:0;
}
.footer-body-left .btn,
.footer-body-right .btn,
.footer-body-left .btn *,
.footer-body-right .btn *,
.toggle-menu .toggle-menu-footer .btn,
.toggle-menu .toggle-menu-footer .btn *{
	line-height:1;
}
.footer-body-left .btn .fas,
.footer-body-right .btn .fas,
.toggle-menu .toggle-menu-footer .fas{
	font-size:25px;
	display:block;
}
.footer-body-left .btn small,
.footer-body-right .btn small,
.toggle-menu .toggle-menu-footer .btn small{
	font-size:11px;
	margin-top:2px;
}
.toggle-menu .toggle-menu-footer .btn-success{
	background-color:#4f9005;
	box-shadow:none !important;
}
.toggle-menu .toggle-menu-footer .btn-success:hover,
.toggle-menu .toggle-menu-footer .btn-success:active,
.toggle-menu .toggle-menu-footer .btn-success:focus{
	background-color: #4e860f !important;
}

@media (max-width: 767.98px) {
	.footer-body-left .btn,
	.footer-body-right .btn,
	.toggle-menu .toggle-menu-footer .btn{
		width:45px;
		height:45px;
	}
	.footer-body-left .btn .fas,
	.footer-body-right .btn .fas,
	.toggle-menu .toggle-menu-footer .btn .fas{
		font-size:16px;
	}
	.footer-body-left .btn small,
	.footer-body-right .btn small,
	.toggle-menu .toggle-menu-footer .btn small{
		font-size:10px;
	}
}

/*==================================
	Table
==================================*/
.table-list{
	width:100%;
}
.table-list th,
.table-list td{
	font-size:1.15rem;
	text-align:left;
	padding:7px;
}

@media (max-width: 767.98px) {
	.table-list th,
	.table-list td{
		width:auto !important;
		display:block;
	}
	.menu .table-list th{
		font-size:1.25rem;
		padding-bottom:0;
	}
}

/*==================================
	alert
==================================*/
.alert{
	border:none;
}
.alert-primary{
	color: #285aa0;
	background-color: #d0e0f3;
}
.alert-success{
	color: #00691f;
	background-color: #ceeaaf;
}
.alert-danger {
	color: #cc1325;
	background-color: #ffd5ce;
}
.alert-warning {
	background-color: #f9e8b7;
}
.alert-info {
	background-color: #c6edf3;
}
.alert-purple {
	color: #751596;
	background-color: #fadbfb;
}

/*==================================
	Header
==================================*/
.header-btns{
	position:static;
}
.header-btns .btn{
	min-width:42px;
	min-height:38px;
}
.header-btns .btn.text-primary{
	color:#022986 !important;
}
.header-btns .btn.text-danger{
	color:#a0000b !important;
}
.header-btns-right-fixed{
	position:fixed;
	z-index:3;
	right:5px;
	top:5px;
}
header .a-back-menu {
	position: fixed;
	z-index: 3;
	left: 5px;
	top: 5px;
}
header #div-title {
	position: fixed;
	z-index: 4;
	left: 70px;
	top: 15px;
	font-size:120%;
	font-weight: bold;
}
@media (min-width: 768px) {
	.header-btns .btn{
		min-width: 52px;
		min-height: 52px;
		padding: 14px 18px;
	}
	.header-btns .btn.btn-secondary{
		min-width:120px;
		font-size: 16px;
	}
}
@media (max-width: 767px) {
	.header-btns .btn{
		min-width:35px;
		font-size: .75rem;
		padding: .375rem .35rem;
	}
	header .a-back-menu .fas {
		position:relative;
		top:4px;
	}
}
/*==================================
	Footer
==================================*/
.footer-menus{
	position:static;
}
.footer-body{
	position:relative;
	text-align: center;
}
.footer-body .footer-body-left,
.footer-body .footer-body-right{
	position:absolute;
	z-index:3;
	bottom:5px;
}
.footer-body .footer-body-left{
	left:5px;
}
.footer-body .footer-body-right{
	right:5px;
	z-index:4;
}
.footer-body .footer-body-center{
	white-space:nowrap;
	display:inline-block;
	position:absolute;
	text-align:center;
	z-index:3;
	bottom:25px;
	left:0;
	right:0;
}
.footer-body-center .fas{
	color:#ccc;
	font-size:2rem;
}
.footer-body-center .fas.active{
	color:#7ece23;
}
.footer-body-center .fas.max{
	color:#f7b900	
}
@media (max-width: 767.98px) {
	.footer-body .footer-body-center{
		margin-left:-110px;
		bottom:17px;
	}
	.footer-body-center .fas{
		font-size:1rem;
	}
}
@media (max-width: 362px) {
	.footer-body .footer-body-center{
		margin-left:-96px;
	}
	.footer-body-center .fas {
		font-size: .85rem;
	}
}

/*==================================
	Main
==================================*/
.main{
	word-break: break-word;
	height:100%;
	padding-top:62px
}
.main .container{
	min-height:1px;
	position:relative;
	max-width: 100% !important;
}
.div-canvas {
	line-height: 1;
}
.div-canvas canvas{
	/*background-color: #fdfae8;*/
	position:relative;
	z-index:2;
}
.p-message{
	position:fixed;
	top:62px;
	left:70px;
	z-index:4;
}
@media (max-width: 767.98px) {
	.main{
		padding-top:48px;
		padding-bottom:55px;
	}
}

/*==================================
	Calculator
==================================*/
.div-calculator{
	position:absolute;
	z-index: 3;
	width: 350px;
	top: 100px;
	left: 50%;
	margin-left: -175px;
	border-radius: 5px;
	/*background-color: #fcee00;
	border: 1px solid #333;*/
	/*display:none;*/
}
.div-calculator.div-calculator-flex {
	width: 802px;
	margin-left: -400px;
}
.div-calculator.div-calculator-flex .div-child-calculator {
	float: left;
}
.div-calculator.div-calculator-flex .div-child-calculator.div-child-calculator-left,
.div-calculator.div-calculator-flex .div-child-calculator.div-child-calculator-right {
	width: 350px;
}
.div-calculator.div-calculator-flex .div-child-calculator.div-child-calculator-center{
	width: 100px;
}
.div-calculator.div-calculator-flex .div-child-calculator.div-child-calculator-center .div-calculator-body {
	padding-left: 0;
	padding-right: 0;
}
.div-calculator.div-calculator-flex .div-child-calculator.div-child-calculator-center .div-calculator-body .div-calculator-button,
.div-calculator.div-calculator-flex .div-child-calculator.div-child-calculator-center .div-calculator-body .div-calculator-button-blank{
	float: none;
	width: 100%;
}
.div-calculator-body{
	border-radius:5px;
	padding:20px;
	/*display:flex;
	flex-wrap:wrap;
	justify-content: flex-start;
	background-color:#f8e773;
	box-shadow: inset 0 -3px 0 rgba(0,0,0,0.15);*/
	position:relative;
}
.div-calculator-close,
.div-calculator-result{
	/*flex-basis:calc(100% - 8px);*/
}
.div-calculator-result{
	padding:10px;
	border-radius:5px;
	background-color:#fff;
	text-align:right;
	margin:0 4px 10px 4px;
	font-size:30px;
	overflow:hidden;
}
.div-calculator-body .div-calculator-button,
.div-calculator-body .div-calculator-button-blank{
	float: left;
	width:33%;
	padding:4px;
}
.div-calculator-body .div-calculator-button-blank {
	height: 63px;
}
.div-calculator-body .div-calculator-button.div-calculator-button-half {
	width:50%;
}
.div-calculator-body .div-calculator-button .btn{
	width:100%;
	font-size:20px;
	height: 55px;
	font-size:25px;
}
.div-calculator-body .div-calculator-button .btn-warning{
	color:#333 !important;
}
.div-calculator-body .div-calculator-button .btn:active{
	position:relative;
	top:1px;
	left:1px;
}
.div-calculator-close .i-calculator-close{
	position: relative;
	top: -10px;
	right: -17px;
	font-size: 24px;
	background-color: #000;
	color:#fff;
	padding: 0;
	width: 35px;
	height: 35px;
	line-height: 1;
	text-align: center;
	line-height: 35px;
	border-radius: 35px;
	cursor:pointer;
	z-index:5;
}
@media (max-width: 767.98px) {
	.div-calculator{
		width:300px;
		margin-left:-150px;
	}
	.div-calculator-body .div-calculator-button .btn{
		font-size:20px;
	}
}

/*==================================
	Toggle menu
==================================*/
.toggle-menu{
	position:fixed;
	z-index:3;
	top:0;
	bottom:0;
	left:-260px;
	width:250px;
	height:100%;
	box-shadow: 1px 0 10px rgba(0, 0, 0, 0.32);
}
.toggle-menu .toggle-menu-body{
	height:calc(100% - 80px);
	overflow-y:auto;
}
.toggle-menu .toggle-menu-footer{
	height:80px;
	padding:5px;
}
.toggle-menu .list-group-item{
	border:none;
	background-color:transparent;
	color:#fff;
	font-weight:700;
	border-bottom: 1px solid rgba(255, 255, 255, 0.32);
	border-radius:0;
}
.toggle-menu .list-group-item:hover,
.toggle-menu .list-group-item:active,
.toggle-menu .list-group-item:focus{
	background-color:rgba(0, 0, 0, 0.21);
}
.toggle-menu .list-group-item .fas{
	min-width: 1rem;
}
.toggle-menu .toggle-menu-body::-webkit-scrollbar{
	width: 10px;
}
.toggle-menu .toggle-menu-body::-webkit-scrollbar-track{
	background-color: #4e860f;
}
.toggle-menu .toggle-menu-body::-webkit-scrollbar-thumb{
	background-color: #E6E6E6;
	border-radius: 10px;
}

@media (max-width: 767.98px) {
	.toggle-menu .toggle-menu-body{
		height:calc(100% - 55px);
	}
	.toggle-menu .toggle-menu-footer{
		height:55px;
	}
}

/*==================================
	Modal
==================================*/
.modal-header{
	background-color: #f8e773;
	border-bottom:none;
}
.modal-header .modal-title{
	font-weight: 700;
	color: #7c7339;
}
.modal-header .close{
	outline:none !important;
	text-shadow:none;
}
.modal-footer{
	border-top:none;
}
.modal-footer .btn{
	min-width: 7rem;
}
