#login {
	background-color: #fff;
	height: 100%;
  }
  #login > .grid {
	height: 100%;
  }
  .column {
	max-width: 450px;
  }
.divbody {
	background: linear-gradient(-45deg, #a1f308, #c5f8d2, #077732, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 10s ease infinite;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.card-1 {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

.card-1:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
/* Print A4 */
.page {
	width: 210mm;
	min-height: 297mm;
	padding: 5mm;
	margin: 0.5mm auto;
	/*border: 1px #D3D3D3 solid;*/
	border-radius: 5px;
	background: white;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
.subpage {
	padding: 0.0cm;
	/*border: 1px #ccc solid;*/
	height: 287mm;
	/*outline: 0.02cm black solid;*/
}

.mobileViewTd {
	display: none
}


@page {
	size: A4;
	margin: 0;
}
@media print {
	body * {
		visibility: hidden;
		-webkit-print-color-adjust: exact !important; /*Chrome, Safari */
        color-adjust: exact !important;  /*Firefox*/
	  }
	.page {
		margin: 0;
		border: initial;
		border-radius: initial;
		width: initial;
		min-height: initial;
		box-shadow: initial;
		background: initial;
		page-break-after: always;
		width: 210mm;
		height: 297mm; 
	}

	.tappp {
		margin: 5;
		border: initial;
		border-radius: initial;
		width: initial;
		min-height: initial;
		box-shadow: initial;
		background: initial;
		page-break-after: always;
		width: 210mm;
		height: 297mm; 
	}

	#section-to-print, #section-to-print * {
		visibility: visible;
	}
	#section-to-print {
		position: absolute;
		left: 0;
		top: 0;
	}
	#section-to-print .hideprint {
		visibility: hidden;
	}
}
	

	#left{
		float:left;
		width: 212mm;
		overflow:hidden;
	}
	#right{
		float:left;
		width:200mm;
		overflow:hidden;
		border: 1px solid #000
	} 
	@media only screen and (max-width: 900px) {
		.smallfont {
		  font-size: 13px;
		}
		#left{
			float:left;
			width: 212mm;
			overflow:hidden;
			font-size: smaller;
		}
		#right{
		  float:left;
		  width:100mm;
		  overflow:hidden;
		  border: 1px solid #000;
		  font-size: 9px;
	  } 
	  }



	  @media only screen and (max-width: 800px) {
		#dateTime{
			display: none;
		}
		#noti{
			display: none;
		}
		#tit{
			display: none;
		}
		#avatar1{
			display: none;
		}
		.mobileViewTd {
			display: block
		}

	  }
/**
 * FilePond Custom Styles
 */
 .filepond--drop-label {
	color: #4c4e53;
}

.filepond--label-action {
	text-decoration-color: #babdc0;
}

.filepond--panel-root {
	border-radius: 2em;
	background-color: #edf0f4;
	height: 1em;
}

.filepond--item-panel {
	background-color: #595e68;
}

.filepond--drip-blob {
	background-color: #7f8a9a;
}


/*progreeee */
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');

.timeline{
	width:100%;
	background-color: transparent;
	color:#000;
	padding:10px 10px;
	box-shadow:0px 0px 0px rgba(0,0,0,.5);
}
.timeline ul{
	list-style-type:none;
	border-left:2px solid #094a68;
	padding:0px 5px;
}
.timeline ul li{
	padding:2px 5px;
	position:relative;
	cursor:pointer;
	transition:.5s;
}
.timeline ul li span{
	display:inline-block;
	background-color:#ccc;
	border-radius:15px;
	padding:2px 5px;
	font-size:12px;
	text-align:center;
}
.timeline ul li .content h6{
	color:#34ace0;
	font-size:15px;
	padding-top:2px;
}
.timeline ul li .content p{
	padding:5px 0px 5px 0px;
	font-size:12px;
}
.timeline ul li:before{
	position:absolute;
	content:'';
	width:10px;
	height:10px;
	background-color:#34ace0;
	border-radius:50%;
	left:-11px;
	top:10px;
	transition:.5s;
}
.timeline ul li:hover{
	background-color:#c4c4c4;
}
.timeline ul li:hover:before{
	background-color:#0F0;
	box-shadow:0px 0px 10px 2px #0F0;
}



.titletd {
  width:170px;
}


.copy{
  font-size: 20px;
}
.copy:hover{
  color : green;
  opacity: 0.6;
}


.img-wrap {
    position: relative;
    display: inline-block;
    border: 1px black solid;
    font-size: 0;
}
.img-wrap .close {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 100;
    background-color: #fff;
    padding: 1px 1px 1px 1px;
    color: #000;
    font-weight: bold;
    cursor: pointer;
    opacity: 0.95;
    text-align: center;
    font-size: 20px;
    line-height: 25px;
    border-radius: 2px;
}
.img-wrap:hover .close {
    opacity: 1;
}

.w3-2020-classic-blue
{color:#fff;background-color:#34568B}
.w3-2020-flame-scarlet
{color:#fff;background-color:#CD212A}
.w3-2020-saffron
{color:#000;background-color:#FFA500}
.w3-2020-biscay-green
{color:#000;background-color:#56C6A9}
.w3-2020-chive
{color:#fff;background-color:#4B5335}
.w3-2020-faded-denim
{color:#fff;background-color:#798EA4}
.w3-2020-orange-peel
{color:#fff;background-color:#FA7A35}
.w3-2020-mosaic-blue
{color:#fff;background-color:#00758F}
.w3-2020-sunlight
{color:#000;background-color:#EDD59E}
.w3-2020-coral-pink
{color:#000;background-color:#E8A798}
.w3-2020-cinnamon-stick
{color:#fff;background-color:#9C4722}
.w3-2020-grape-compote
{color:#fff;background-color:#6B5876}
.w3-2020-lark
{color:#fff;background-color:#B89B72}
.w3-2020-navy-blazer
{color:#fff;background-color:#282D3C}
.w3-2020-brilliant-white
{color:#000;background-color:#EDF1FF}
.w3-2020-ash
{color:#fff;background-color:#A09998}
.w3-2020-amberglow
{color:#fff;background-color:#DC793E}
.w3-2020-samba
{color:#fff;background-color:#A2242F}
.w3-2020-sandstone
{color:#fff;background-color:#C48A69}
.w3-2020-green-sheen
{color:#000;background-color:#D9CE52}
.w3-2020-rose-tan
{color:#000;background-color:#D19C97}
.w3-2020-ultramarine-green
{color:#fff;background-color:#006B54}
.w3-2020-fired-brick
{color:#fff;background-color:#6A2E2A}
.w3-2020-peach-nougat
{color:#000;background-color:#E6AF91}
.w3-2020-magenta-purple
{color:#fff;background-color:#6C244C}
.w3-ios-dark-blue
{color:#fff;background-color:#5856d6}
.w3-ios-deep-blue
{color:#fff;background-color:#007AFF}
.w3-ios-blue
{color:#fff;background-color:#34AADC}
.w3-ios-light-blue
{color:#fff;background-color:#5AC8FA}
.w3-ios-green
{color:#000;background-color:#4cd964}
.w3-ios-pink
{color:#fff;background-color:#ff2d55}
.w3-ios-red
{color:#fff;background-color:#ff3b30}
.w3-ios-orange
{color:#fff;background-color:#ff9500}
.w3-ios-yellow
{color:#000;background-color:#ffcc00}
.w3-ios-grey
{color:#fff;background-color:#8e8e93}
.w3-ios-light-grey
{color:#000;background-color:#ceced2}
.w3-ios-background
{color:#000;background-color:#efeff4}
.w3-win8-lime
{color:#fff;background-color:#a4c400}
.w3-win8-green
{color:#fff;background-color:#60a917}
.w3-win8-emerald
{color:#fff;background-color:#008a00}
.w3-win8-teal
{color:#fff;background-color:#00aba9}
.w3-win8-cyan
{color:#fff;background-color:#1ba1e2}
.w3-win8-blue
{color:#fff;background-color:#3e65ff}
.w3-win8-cobalt
{color:#fff;background-color:#0050ef}
.w3-win8-indigo
{color:#fff;background-color:#6a00ff}
.w3-win8-violet
{color:#fff;background-color:#aa00ff}
.w3-win8-pink
{color:#fff;background-color:#f472d0}
.w3-win8-magenta
{color:#fff;background-color:#d80073}
.w3-win8-crimson
{color:#fff;background-color:#a20025}
.w3-win8-red
{color:#fff;background-color:#e51400}
.w3-win8-orange
{color:#fff;background-color:#fa6800}
.w3-win8-amber
{color:#fff;background-color:#f0a30a}
.w3-win8-yellow
{color:#fff;background-color:#e3c800}
.w3-win8-brown
{color:#fff;background-color:#825a2c}
.w3-win8-olive
{color:#fff;background-color:#6d8764}
.w3-win8-steel
{color:#fff;background-color:#647687}
.w3-win8-mauve
{color:#fff;background-color:#76608a}
.w3-win8-taupe
{color:#fff;background-color:#87794e}
.w3-win8-sienna
{color:#fff;background-color:#a0522d}
.w3-flat-turquoise
{color:#fff;background-color:#1abc9c}
.w3-flat-emerald
{color:#fff;background-color:#2ecc71}
.w3-flat-peter-river
{color:#fff;background-color:#3498db}
.w3-flat-amethyst
{color:#fff;background-color:#9b59b6}
.w3-flat-wet-asphalt
{color:#fff;background-color:#34495e}
.w3-flat-green-sea
{color:#fff;background-color:#16a085}
.w3-flat-nephritis
{color:#fff;background-color:#27ae60}
.w3-flat-belize-hole
{color:#fff;background-color:#2980b9}
.w3-flat-wisteria
{color:#fff;background-color:#8e44ad}
.w3-flat-midnight-blue
{color:#fff;background-color:#2c3e50}
.w3-flat-sun-flower
{color:#fff;background-color:#f1c40f}
.w3-flat-carrot
{color:#fff;background-color:#e67e22}
.w3-flat-alizarin
{color:#fff;background-color:#e74c3c}
.w3-flat-clouds
{color:#000;background-color:#ecf0f1}
.w3-flat-concrete
{color:#fff;background-color:#95a5a6}
.w3-flat-orange
{color:#fff;background-color:#f39c12}
.w3-flat-pumpkin
{color:#fff;background-color:#d35400}
.w3-flat-pomegranate
{color:#fff;background-color:#c0392b}
.w3-flat-silver
{color:#000;background-color:#bdc3c7}
.w3-flat-asbestos
{color:#fff;background-color:#7f8c8d}
.w3-food-apple
{color:#000;background-color:#76cd26}
.w3-food-aspargus
{color:#fff;background-color:#77ab56}
.w3-food-apricot
{color:#fff;background-color:#ffb16d}
.w3-food-aubergine
{color:#fff;background-color:#3d0734}
.w3-food-avocado
{color:#fff;background-color:#87a922}
.w3-food-banana
{color:#000;background-color:#fafe4b}
.w3-food-butter
{color:#000;background-color:#ffff81}
.w3-food-blueberry
{color:#fff;background-color:#464196}
.w3-food-carrot
{color:#fff;background-color:#e67e22}
.w3-food-cherry
{color:#fff;background-color:#cf0234}
.w3-food-chocolate
{color:#fff;background-color:#411900}
.w3-food-cranberry
{color:#fff;background-color:#9e003a}
.w3-food-coffee
{color:#fff;background-color:#a6814c}
.w3-food-egg
{color:#000;background-color:#fffcc4}
.w3-food-grape
{color:#fff;background-color:#6c3461}
.w3-food-kiwi
{color:#000;background-color:#8ee53f}
.w3-food-lemon
{color:#000;background-color:#fdff52}
.w3-food-lime
{color:#000;background-color:#bffe28}
.w3-food-mango
{color:#fff;background-color:#ffa62b}
.w3-food-mushroom
{color:#fff;background-color:#ba9e88}
.w3-food-mustard
{color:#fff;background-color:#ceb301}
.w3-food-mint
{color:#000;background-color:#c0fa8b}
.w3-food-olive
{color:#fff;background-color:#6e750e}
.w3-food-orange
{color:#fff;background-color:#f97306}
.w3-food-pea
{color:#fff;background-color:#a4bf20}
.w3-food-peach
{color:#fff;background-color:#ffb07c}
.w3-food-pear
{color:#000;background-color:#cbf85f}
.w3-food-pistachio
{color:#000;background-color:#c0fa8b}
.w3-food-plum
{color:#fff;background-color:#3f012c}
.w3-food-pomegranate
{color:#fff;background-color:#c0392b}
.w3-food-pumpkin
{color:#fff;background-color:#d35400}
.w3-food-raspberry
{color:#fff;background-color:#b00149}
.w3-food-saffron
{color:#fff;background-color:#feb209}
.w3-food-salmon
{color:#fff;background-color:#ff796c}
.w3-food-spearmint
{color:#000;background-color:#1ef876}
.w3-food-squash
{color:#fff;background-color:#f2ab15}
.w3-food-strawberry
{color:#fff;background-color:#fb2943}
.w3-food-tomato
{color:#fff;background-color:#ec2d01}
.w3-food-wheat
{color:#000;background-color:#fbdd7e}
.w3-food-wine
{color:#fff;background-color:#80013f}
/*!
 * # Semantic UI 0.0.1 - Calendar
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */.ui.calendar .ui.popup{max-width:none;padding:0;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ui.calendar .calendar:focus{outline:0}.ui.calendar .ui.table.minute,.ui.calendar .ui.table.month,.ui.calendar .ui.table.year{min-width:15em}.ui.calendar .ui.table.day{min-width:18em}.ui.calendar .ui.table.hour{min-width:20em}.ui.calendar .ui.table tr td,.ui.calendar .ui.table tr th{padding:.5em;white-space:nowrap}.ui.calendar .ui.table tr th{border-left:none}.ui.calendar .ui.table tr th .icon{margin:0}.ui.calendar .ui.table tr:first-child th{position:relative;padding-left:0;padding-right:0}.ui.calendar .ui.table.day tr:first-child th{border:none}.ui.calendar .ui.table.day tr:nth-child(2) th{padding-top:.2em;padding-bottom:.3em}.ui.calendar .ui.table tr td{padding-left:.1em;padding-right:.1em}.ui.calendar .ui.table tr .link{cursor:pointer}.ui.calendar .ui.table tr .prev.link{width:14.28571429%;position:absolute;left:0}.ui.calendar .ui.table tr .next.link{width:14.28571429%;position:absolute;right:0}.ui.calendar .ui.table tr .disabled{pointer-events:none;color:rgba(40,40,40,.3)}.ui.calendar .ui.table tr td.today{font-weight:700}.ui.calendar .ui.table tr td.range{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);box-shadow:none}.ui.calendar .ui.table.inverted tr td.range{background:rgba(255,255,255,.08);color:#fff;box-shadow:none}.ui.calendar .calendar.active .ui.table tbody tr td.focus,.ui.calendar .calendar.active .ui.table.inverted tbody tr td.focus,.ui.calendar .calendar:focus .ui.table tbody tr td.focus,.ui.calendar .calendar:focus .ui.table.inverted tbody tr td.focus{box-shadow:inset 0 0 0 1px #85B7D9}