ss_new_ui_skin_and_page/skin/easy/gate.css

/*-----------------gate.css--------------*/
.xx {
	text-align: center;
	color: #FFF;
	font-family: 'MicrosoftYaHei [Regular]';
	font-size: 14px;
	margin-top: -6px;
	line-height: 20px;
}

.xm {
	/* line-height: 50px; */
	margin-top: 12px;
	/*margin-left: 57px;*/
}

#lfxx th {
	text-align: right !important;
}

#yylf th {
	text-align: right !important;
}

.bottomright {
	position: absolute;
	right: 29px;
	border: 0px;
	bottom: 29px;
	/* padding: 8px; */
}

.qrcode-text {
	font-family: "SIL Hei";
	font-size: 14px;
	line-height: 24px;
	color: #FFF;
	display: block;
	text-align: center;
	letter-spacing: 1px;
}

.hugeInvertLogo {
	width: 569px;
	height: 569px;
}

#sfzh::-webkit-input-placeholder {
	font-size: 20px;
	color: #6c9ed7;
}

#sfzh::-moz-placeholder {
	/* Mozilla Firefox 19+ */
	font-size: 20px;
	color: #6c9ed7;
}

#sfzh:-moz-placeholder {
	/* Mozilla Firefox 4 to 18 */
	font-size: 20px;
	color: #6c9ed7;
}

#sfzh:-ms-input-placeholder {
	/* Internet Explorer 10-11 */
	font-size: 20px;
	color: #6c9ed7;
}

#leave,
#back,
#cancle {
	width: 150px;
	height: 50px;
	font-size: 30px;
	margin: 0;
}

#leave,
#back {
	margin-right: 100px;
}

.content-largeText input {
	width: 388px;
	height: 50px;
	padding-left: 5px !important;
	font-family: Microsoft YaHei;
	font-size: 36px;
	color: #000000;
	line-height: 30px;
	/* padding:5px 0 11px 19px;*/
	margin-left: 1px;
	border: 2px solid #cccccc;
	border-radius: 2px;
	outline-color: #6b9ed6;
}

.content-largeText input:hover {
	border-color: #6b9ed6;
}


.content-largeText textarea {
	width: 388px !important;
	/*height: 50px !important;*/
	font-family: Microsoft YaHei;
	color: #000000;
	line-height: 30px;
	font-size: 36px;
	padding-top: 6px !important;
	/* padding: 5px 0 11px 5px;*/
	/*margin-left: 18px;*/
	border: 2px solid #cccccc;
	border-radius: 2px;
	outline-color: #6b9ed6;
	margin-top: 1px;
}

.content-largeText td {
	vertical-align: bottom;
}


.objectPickerNameDiv-jfbmid>.icon-down {
	right: 8px !important;
	top: 6px;
}

.objectPickerNameDiv-jfbjid>.icon-down {
	right: 8px !important;
	top: 6px;
}

.objectPickerNameDiv-xbm>.icon-down {
	right: 8px !important;
	top: 6px;
}

.objectPickerNameDiv-jfryid>.icon-down {
	right: 8px !important;
	top: 6px;
}

.objectPickerNameDiv-syid>.icon-down {
	right: 8px !important;
	top: 6px;

}

.getDateInfo {
	opacity: 0.65;
	position: absolute;
	bottom: 30px;
	left: 25px;
	z-index: 100;
	font-family: 'SIL Hei';
	font-size: 24px;
	color: #ffffff;
	line-height: 21.5px;
	border: 1px solid #dae6eb;
	border-radius: 3px;
	width: 206px;
	height: 18px;
	padding: 11px 30px 12px 21px;
}

.getDateInfo span {
	margin-right: 35px;
}

.userInfo {
	opacity: 0.65;

	z-index: 100;
	font-family: 'SIL Hei';
	font-size: 24px;
	color: #ffffff;
	line-height: 21.5px;
	border: 1px solid #dae6eb;
	border-radius: 3px;
	/* width: 206px; */
	height: 18px;
	padding: 11px 21px 12px 21px;

	gap: 20px;
	display: flex;
	justify-content: center;
}

.popup-div {
	width: 388px !important;
	min-width: 388px !important;
	/*margin-left: 18px;*/
}

.popup-div>.scrollbar {
	padding-right: 0px !important;
	min-width: 385px !important;

}

.popupList {
	height: 40px !important;
	line-height: 36px !important;
	font-size: 30px !important;
	white-space: nowrap;
	overflow: hidden;
}

.smallButton.icon-down {
	box-shadow: none !important;
	background-image: url(image/dialog-select-icon.png) !important;
	background-position: center center !important;
	z-index: 9999;
	right: 0px !important;
	width: 40px !important;
	height: 40px !important;
}

#jfsy {
	line-height: 40px !important;
	padding-top: 0px !important;
	margin-top: 0px !important;
}

#objectPickergrowheightjfbmid {
	height: 50px !important;
}

#objectPickergrowheightjfbjid {
	height: 50px !important;
}

#objectPickergrowheightxbm {
	height: 50px !important;
}

#objectPickergrowheightjfryid {
	height: 50px !important;
}

#objectPickergrowheightsyid {
	width: 389px !important;
	height: 50px !important;
}

#ascrail2006 {
	display: none !important;
}

.objectPickerNameDiv-syid {
	margin-top: 1px;
}

.input-div-selected {
	border: 0px !important;
	box-shadow: 0px 0px 0px #FFF !important;
	top: 1px !important;
	left: 61px !important;
	outline-color: #6b9ed6 !important;
}

#objectPickergrowheightxbm:hover {
	border-color: #6b9ed6 !important;
}

#objectPickergrowheightxbm:active {
	border-color: #6b9ed6;
}

#objectPickergrowheightjfbmid:hover {
	border-color: #6b9ed6 !important;
}

#objectPickergrowheightjfbmid:active {
	border-color: #6b9ed6;
}

#objectPickergrowheightjfbjid:hover {
	border-color: #6b9ed6 !important;
}

#objectPickergrowheightjfbjid:active {
	border-color: #6b9ed6 !important;
}

#jfsy:hover {
	border-color: #6b9ed6 !important;
}

#jfsy:active {
	border-color: #6b9ed6 !important;
}


/* 许汝桦202106022 边框 未经过叶老大确定 */
.mainState-inportantrRed {
	border: 15px solid #ff5a4b !important;
	box-sizing: border-box;
	background: #f9dcdb !important;
}

.mainState-inportantrRed>div {
	margin-left: 46px !important;
	margin-top: 47px !important;
}

div#ryxxlb::-webkit-scrollbar {
	display: none;
}

#jcjllb::-webkit-scrollbar {
	width: 0 !important;
}

.ryxxlb-child {
	z-index: -3 !important;
}

.jcjllb-child {
	z-index: -3 !important;
}

/* 绿色 */
.mainState-green {
	background-color: #c7ffe0 !important;
}

/*红色*/
.mainState-orange {
	background-color: #f9dcdb !important;
}

/*蓝色*/
.mainState-blue {
	background-color: #c7e0ff !important;
}

/* 三区域布局容器 - 固定三个位置 */
#ryxxlb {
	position: absolute;
	width: 100%;
	height: calc(100% - 60px);
	display: grid;
	grid-template-columns: 475px 535px 475px;
	grid-template-areas: "left center right";
	justify-content: center;
	align-items: center;
	gap: 30px;
	padding: 0 50px;
}

/* 所有卡片的基础样式 */
.ryxxlb-child {
	transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
	border: 1px white solid;
	border-radius: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 40px 30px;
}

/* 左边位置 - 小卡片 */
.ryxxlb-child-left {
	grid-area: left;
	width: 475px;
	height: 750px;
	opacity: 0.9;
	box-sizing: border-box;
}

/* 中间位置 - 大卡片 */
.ryxxlb-child-center {
	grid-area: center;
	width: 535px;
	height: 845px;
	z-index: 10;
	opacity: 1;
	box-sizing: border-box;
}

/* 右边位置 - 小卡片 */
.ryxxlb-child-right {
	grid-area: right;
	width: 475px;
	height: 750px;
	opacity: 0.9;
	box-sizing: border-box;
}

/* 从中间移动到左边的动画 */
@keyframes moveToLeft {
	from {
		grid-area: center;
		width: 535px;
		height: 845px;
		opacity: 1;
	}

	to {
		grid-area: left;
		width: 475px;
		height: 750px;
		opacity: 0.9;
	}
}

/* 从中间移动到右边的动画 */
@keyframes moveToRight {
	from {
		grid-area: center;
		width: 535px;
		height: 845px;
		opacity: 1;
	}

	to {
		grid-area: right;
		width: 475px;
		height: 750px;
		opacity: 0.9;
	}
}

/* 淡入动画 */
@keyframes fadeIn {
	from {
		opacity: 0;
		transform: scale(0.9);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

/* 淡出动画 */
@keyframes fadeOut {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
		transform: scale(0.8);
	}
}

/* 左右两边卡片的照片尺寸 */
.ryxxlb-child-left .card-photo,
.ryxxlb-child-right .card-photo {
	width: 405px !important;
	height: 548px !important;
}

/* 中间卡片的照片尺寸 */
.ryxxlb-child-center .card-photo {
	width: 455px !important;
	height: 616px !important;
}

/* 左右两边卡片的姓名班级容器 */
.ryxxlb-child-left .name-class-container,
.ryxxlb-child-right .name-class-container {
	font-size: 46px !important;
}

/* 中间卡片的姓名班级容器 */
.ryxxlb-child-center .name-class-container {
	font-size: 52px !important;
}

/* 左右两边卡片的状态文字 */
.ryxxlb-child-left .status-text,
.ryxxlb-child-right .status-text {
	font-size: 46px !important;
}

/* 中间卡片的状态文字 */
.ryxxlb-child-center .status-text {
	font-size: 52px !important;
}

/* 进校状态文字颜色 */
.status-enter {
	color: #0006ff !important;
}

/* 离校状态文字颜色 */
.status-leave {
	color: #007339 !important;
}

/* 请假状态文字颜色 */
.status-vacation {
	color: #ff1212 !important;
}

/* 淡出动画类 */
.fade-out {
	animation: fadeOut 0.4s ease-out forwards;
}