body {background:#fff; color:#000; font-size:14px; line-height:24px; margin:0; padding:0; font-family: 'Open Sans', sans-serif;}

img {border:none;}
.clear {clear:both;}

a {text-decoration:underline; color:#808080;}

.container {width:960px; margin:50px auto 100px auto; padding:0 0 0 0;}
.container2 {width:100%; margin:0 auto; padding:0px 0 0px 0;}
.container3 {width:100%; margin:0 auto; padding:0px 0 0px 0;}

.logo {width:200px; margin:0 auto;}
.logo img {width:100%;}
.welcome-txt {width:100%; margin:50px auto; text-align:center;}
.welcome-txt h1 {font-size:30px; line-height:36px; font-weight:300; text-align:center;}
.welcome-txt h1 span {font-weight:600; color:#808080;}
.welcome-txt a {font-size:18px; line-height:24px; font-weight:300; text-decoration:none; color:#fff; background:#808080; padding:5px 15px;}

.login-form > form {margin:0 auto; width:280px; background:#fff; box-shadow:#bbbaba 0px 0px 15px; padding:20px; border-radius:15px;}
.login-form > form > input.login {margin:10px auto; width:100%; background:#fff; padding:12px 5%; border:1px solid #bababa; box-sizing: border-box;}
.login-form > form > input.login-btn {margin:10px auto; width:100%; background:#808080; padding:12px 0; border:1px solid #808080; color:#fff; cursor:pointer;}

.section-select {margin:20px 1.5%; width:22%; background:#fff; box-shadow:#bbbaba 0px 0px 15px; padding:20px 1.5%; border-radius:15px; float:left; text-align:center; box-sizing:border-box;}

.section-select h2 {font-size:18px; line-height:24px; font-weight:600; text-align:center; text-transform:uppercase; margin:0 0 15px 0;}
.section-select > a.select-btn1 {font-size:15px; line-height:18px; font-weight:300; text-align:center; padding:8px 15px; margin:10px 5px; background:#808080; color:#fff; text-decoration:none;}
.section-select > a.select-btn2 {font-size:15px; line-height:18px; font-weight:300; text-align:center; padding:8px 15px; margin:10px 5px; background:#000; color:#fff; text-decoration:none;}
.section-select ul {margin:0; padding:0;}
.section-select ul li {margin:5px 0; padding:0; width:100%; list-style:none; background:#808080;}
.section-select ul li a {margin:0; padding:8px 15px; text-decoration:none; color:#fff; text-align:center; line-height:36px; font-size:15px;}
.section-select ul li:nth-child(even) {background:black;}

.photo-display {width:100%; margin:0; height: calc(100vh - 40px); background:#808080; float:left; min-height: calc(100vh - 40px); max-height: calc(100vh - 40px); text-align:center; padding-top:1%; padding-bottom:1%; float:left; position:fixed; top:0; box-sizing:border-box;}
.photo-display img {height:auto; max-height:100%; margin:auto;}
.photo-display-bottom-bar {width:100%; margin:0; height:40px; background:#000; float:left; position:fixed; bottom:0;}

.photo-marking-thumbnail {width:50%; margin:0; padding:20px; float:left; box-sizing:border-box;}
.photo-marking-thumbnail img {width:100%;}
.photo-marking {width:100%; margin:0; padding:20px; float:left; box-sizing:border-box;}

.photo-id-area {width:20%; float:left; margin:0; padding:0;}
.photo-id-area p {font-size:13px; line-height:16px; font-weight:300; text-align:center; margin:4px 5px 4px 5px; color:#fff; float: left; width: 70px; letter-spacing: 0.5px;}

.photo-marked-signal-area {width:60%; float:left; text-align:center; padding-top:5px;}
.photo-marked-signal-area ul {width:100%; margin:0; padding:0;}
.photo-marked-signal-area ul li {width:30%; margin:0 1.5%; padding:0; float:left; list-style:none; color:#f00;}
.photo-marked-signal-area ul li .fa-check {color:#0f0;}

.photo-marked-signal-area form {
	margin: 0px !important;
}.photo-marked-signal-area form input {
	width: 30px;
	height: 30px;
	cursor: pointer;
}

.photo-number-area {width:100%; float:left; text-align:center; padding-top:10px;}
.photo-number-area-left-01 {
	width:15%;
	float: left;
	padding: 5px;
	box-sizing: border-box;
}
.photo-number-area-middle-01 {
	width:70%;
	float: left;
	padding: 5px;
	box-sizing: border-box;
}
.photo-number-area-right-01 {
	width:15%;
	float: left;
	padding: 5px;
	box-sizing: border-box;
}
.photo-number-area input[type="submit"] {width:auto; height:auto; text-align:center; background:#808080; color:#fff; border:none; cursor:pointer; margin:10px; font-size:15px; border-radius:17px;padding:20px 30px;}
.photo-number-area input:hover[type="submit"], .photo-number-area input:active[type="submit"], .photo-number-area input:focus[type="submit"] {background:#000;}


.photo-btn-area {width:20%; float:right; text-align:right; padding-top:8px;}
.photo-btn-area a {text-decoration:none; font-size:12px; line-height:18px; text-transform:uppercase; color:#fff; background:#808080; padding:5px 10px; margin:10px 20px 10px 10px;}

.result-table-1 {
	border-collapse: collapse;
  	width: 100%;
}
.result-table-1 tr:nth-child(even){background-color: #f2f2f2;}
.result-table-1 tr {background-color: #fff;}
.result-table-1 tr:hover {background-color: #ddd;}

.result-table-1 th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: center;
  background-color: #808080;
  color: white;
}
.result-table-1 th, td {
  padding-left: 5px;
  padding-right: 5px;
}
.result-table-1 th img, td img {
	max-height:100px;
	max-width:120px;
}
.result-table-1  td.got-award {
	color:#f00;
}

@media only screen and (max-width: 979px) {

.container {width:90%;}

.section-select {margin:20px 1.5%; width:45%; background:#fff; box-shadow:#bbbaba 0px 0px 15px; padding:20px 1.5%; border-radius:15px; float:left; text-align:center; box-sizing:border-box;}

}

@media only screen and (max-width: 767px) {
	.container {width:90%; margin:20px auto 20px auto; padding:0 0 0 0;}
	.logo {width:150px; margin:0 auto;}
	.welcome-txt {width:100%; margin:20px auto; text-align:center;}
	.welcome-txt h1 {font-size:18px; line-height:30px; font-weight:300; text-align:center;}
}

@media only screen and (max-width: 619px) {
	.section-select {margin:10px 0%; width:100%; background:#fff; box-shadow:#bbbaba 0px 0px 15px; padding:20px 1.5%; border-radius:15px; float:left; text-align:center; box-sizing:border-box;}
}

@media only screen and (max-width: 479px) {
	.login-form > form  {width:240px;}
}