p, input, select, textarea, td {
	font-family: 'Open Sans', sans-serif;
}
h1, h2, h3, h4, th {
	font-family: 'Dosis', sans-serif;
	color: #65C9CB;
}
h1 {
	color: #65c9cb !important;
}
.warning {
  color: #e85d75 !important;
}


label {
	font-family: 'Dosis', sans-serif;
	color: #e85d75;
	font-size: 18px;
	font-weight: 300;
}
input[type=text], input[type=number], input[type=date], input[type=email], input[type=tel], select, textarea {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  font-size: 14px;
  color: #61707d;
  -webkit-appearance: none;
}

input[type=submit] {
  width: 150px;
  background-color: #a7dcdd;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  -webkit-appearance: none;
}

input[type=submit]:hover, input[type=submit]:active {
  background-color: #65c9cb;
}

textarea {
  height: 150px;
}

.header {
  border: 2px solid #65c9cb;
	border-radius: 5px;
	background-color: #f8f8ff;
	padding: 20px;
}
.header p {
	color: #61707d;
}

#count p {
  color: #65C9CB;
}

#container {
  border-radius: 5px;
  background-color: white;
  padding: 20px;
}

#container p {
	color: #61707d;
}
.action {
	border-style:solid;
	border-weight:3px;
	border-color:red;
	border-radius:15px;
	background-color:rgba(241, 169, 160, 0.3);
	padding: 20px;
}
#signature {
	padding: 20px;
	background-color:rgba(255, 255, 255, 1);
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
}

.signature-pad {
  padding: 20px;
}

input[type=button] {
  width: 30%;
  background-color: #a7dcdd;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  -webkit-appearance: none;
}

input[type=button]:hover, input[type=button]:active {
  background-color: #65c9cb;
}

#clear, .back {
	background-color:rgba(232, 93, 117, 0.6) !important;
}

#clear:hover, .back:hover {
	background-color:rgba(232, 93, 117, 1) !important;
}

.error {
	background-color:rgba(232, 93, 117, 0.6) !important;
}

.error:hover {
	background-color:rgba(232, 93, 117, 1) !important;
}

.imgpreview {
  overflow: hidden;
  text-align: center;
}

.img {
  width: 280px;
  float: left;
  padding: 15px;
}

#imgcontainer {
  width: 100%;
  float: left;
  padding: 0px
}

.right {
  width: 55%;
  cursor: pointer;
  float: right;
  text-align: left;
  height: 50px;
}

.img h3 {
  text-align: center;
  margin-block-start: 0px;
  margin-block-end: 0px;
}

.left {
  width: 40%;
  float: left;
  text-align: right;
  height: 50px;
    line-height: 60px;
}

.labinp {
  margin-bottom: 30px;
}

.thumbs {
  width: 275px;
  padding: 5px;
  border-radius: 15px;
}

.thumbs:hover {
  opacity: 0.7;
  cursor: pointer;
  transition: 0.3s;
}

.check {
	filter: grayscale(100%);
	width: 35px;
}
/*.check:hover {
	filter: grayscale(50%);
}*/
.img input:checked ~ .check {
	filter: grayscale(0%);
}
td {
	text-align: left;
}
#loading {
            background: url('../gif/spinner.gif') no-repeat center center;
            position: absolute;
            top: 0px;
            left: 0px;
            height: 100%;
            width: 100%;
            z-index: 9999999;
        }
.readonly {
  background-color: #F5F5F5 !important;
}
#staff_login, #staff_logout {
  position: absolute;
  top: 5px;
  left: 650px;
  width: 100px;
}