.popup{
    left: 0%;
    width: 100%;
}

h4.underline{text-decoration: none; padding-bottom: 3px; border-bottom: 1px solid #fff}

.note input[type='radio'] + label::before, label.note::before{
	content: unset;
	background: unset;
}

.note input[type='radio'] + label, label.note{
	text-align: center;
	line-height: 26px!important;
	vertical-align: middle;
	border-radius: 50%;
	width: 28px;
	height: 28px!important;
	border: 2px solid gray;
	background: transparent;
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0) inset;
	color: inherit;
	padding: 0;
	display: inline-block;
	margin-left: 5px;
}

.note input[type='radio']:checked + label, label.note:not(.empty){
	border-color: var(--warning-color);
	background: var(--warning-color);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,.35) inset;
	color: white;
	font-weight: bold;
}

.criteria-category-group > div:last-child h3{
	color: var(--warning-color);
}

.criteria-category-group > div:last-child{
	margin-top: calc(var(--10px) *2);
}


#evaluation table tr td{padding-top: 5px; padding-bottom: 5px}
#evaluation .section {background: rgba(244,244,244,.9);}

.progress-container{
	--color: rgb(116, 194, 92);
	--width: 0%;
}

.progress-container .container {
	border: 1px solid #faebd6;
	background-color: rgb(192, 192, 192);
	width: 100%;
	border-radius: 15px;
}

.progress-container .skill {
	background-color: var(--color);
	color: white;
	padding: 1%;
	text-align: right;
	font-size: 20px;
	border-radius: 15px;
	width: var(--width);
}

.plans-table th{
	border-radius: 0 0 5px 5px;
}

.plans-table tr > *{
	padding: 5px;
	white-space: nowrap;
}

.plans-table th[colspan]{
	border-radius: 5px 5px 0 0;
}

.plans-table th[rowspan]{
	border-radius: 5px;
}

.grayH{
	background-color: #E8F1FF!important;
}

.plans-table {
	border-spacing: 3px 5px;
}

.plans-table tr td{
	background: #F8F8F8;
	padding: 5px 15px;
	border-radius: 5px;
}

.plans-table input{
	border: none;
	background: none;
	height: 100%;
	padding: 5px 15px;
}

.th-available, .plan_freetime {
	background: #EFFEFF!important;
}

.th-total, .plan_recap{
	background: #EBF3FF!important;;
}

.plans-table .plan_editable.editable{
	padding: 0;
	box-shadow: 0 0 2px 2px rgba(0,0,0,.075) inset;
}

.plans-table tr td.noid{
	border-radius: 5px 0 0 5px;
	padding: 10px 15px;
}

.detail-card *{
	color: #ffff;
}

.detail-card span{
	color: #FBFEFF;
}

.detail-card i{
	font-size: 2.6vw;
}

.detail-card{
	background: #575757 0% 0% no-repeat padding-box;
	border-radius: 0.4vw;
	padding: 0.9vw;
}

.detail-card.alt{
	background: #B13636 0% 0% no-repeat padding-box;
}

.detail-card.add-btn{
	background: #00828F 0% 0% no-repeat padding-box;
}

.detail-card.total{
	background: #62577B 0% 0% no-repeat padding-box;
}

.header{
	border: 0.02vw solid #c3c3c3;
	border-radius: 0.5vw;
	padding: 2.08vw;
}

.tdEdit {
	position: relative;
}
.tdEdit:hover .tdEdit__no-hover {
	opacity: 0;
}
.tdEdit:hover .tdEdit__hover {
	opacity: 1;
}
.tdEdit__hover {
	position: absolute;
	top: 0;
	opacity: 0;
	width: 100%;
}
.tdEdit__no-hover {
	opacity: 1;
}

.monthly-schedule td, .monthly-schedule th {
	border: 1px solid rgb(190,190,190);
}

.monthly-schedule td:not(:first-child), .monthly-schedule th:not(:first-child) {
	text-align: center;
	width: 150px;
}
