{
  box-sizing: border-box;
}

input[type=text], select, number, date,  textarea {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 100%;
  padding: 12px;
  border-radius: 4px;
  resize: vertical;
}
input.smalltext[type=text] {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 100%;
  padding: 2px;
  border-radius: 4px;
  resize: vertical;
}
input.tinytext[type=text] {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 15px;
  padding: 2px;
  border-radius: 4px;
  resize: vertical;
}
input[type=password].smalltext {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 100%;
  padding: 2px;
  border-radius: 4px;
  resize: vertical;
}
input[type=number], select {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 100%;
  padding: 12px;
  border-radius: 4px;
  resize: vertical;
}

input[type=date], select {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 100%;
  padding: 12px;
  border-radius: 4px;
  resize: vertical;
}
label {
  padding: 12px 12px 12px 0;
  display: inline-block;
}

input.base[type=submit] {
  background-color: #F01E94;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}
input.blue[type=submit]{
  background-color: #2C89E7;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}
input.blues[type=submit]{
  background-color: #2C89E7;
  color: white;
  padding: 4px 6px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}
input[type=submit]:hover {
  background-color: #F0E01E;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
}

.col-10 {
  float: left;
  width: 10%;
  margin-top: 6px;
}
.col-3 {
  float: left;
  width: 3%;
  margin-top: 6px;
}
.col-20 {
  float: left;
  width: 18%;
  margin-top: 6px;
}
.col-24 {
  float: left;
  width: 23%;
  margin-top: 6px;
}
.col-35 {
  float: left;
  width: 35%;
  margin-top: 6px;
}
.col-60 {
  float: left;
  width: 60%;
  margin-top: 6px;
}
.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
}
.col-100px {
  float: left;
  width: 100px;
  margin-top: 2px;
}
.col-175px {
  float: left;
  width: 175px;
  margin-top: 2px;
}
.col-270px {
  float: left;
  width: 270px;
  margin-top: 2px;
}
.col-385px {
  float: left;
  width: 385px;
  margin-top: 2px;
}
.col-500px {
  float: left;
  width: 500px;
  margin-top: 2px;
}
.col-560px {
  float: left;
  width: 560px;
  margin-top: 2px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 1000px) {
  .col-25, .col-75, input[type=submit] {
    width: 100%;
    margin-top: 0;
  }
}
a.button, a.button:link, a.button:visited {
	text-decoration: none;
	font-size: 1.2em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #084959;
	text-align: center;
	display: block;
	border-top: 2px solid #00CCFF;
	border-right: 2px solid #00CCFF;
	border-bottom: 2px solid #00CCFF;
	border-left: 2px solid #00CCFF;
	border-radius: 15px;
	-moz-border-radius: 15px;
    -webkit-border-radius: 15px;
	width: auto;
	float: center;
	background: url(images/bgspec.gif);
	/* background-color:  #33CCFF; */
}
a.button:hover, a.button:active {
	display: block;
	border-top: 4px solid #00CCFF;
	border-right: 4px solid #00CCFF;
	border-bottom: 4px solid #00CCFF;
	border-left: 4px solid #00CCFF;
	border: dotted;
	border-radius: 15px;
	-moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    width: auto;
	background-color:  #33CCFF;
}
a.smallb, a.smallb:link, a.smallb:visited {
	text-decoration: none;
	font-size: 0.8em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #084959;
	text-align: center;
	display: block;
	border-top: 2px solid #00CCFF;
	border-right: 2px solid #00CCFF;
	border-bottom: 2px solid #00CCFF;
	border-left: 2px solid #00CCFF;
	border-radius: 15px;
	-moz-border-radius: 15px;
    -webkit-border-radius: 15px;
	width: auto;
	float: center;
	background: url(images/bgspec.gif);
	/* background-color:  #33CCFF; */
}
a.smallb:hover, a.smallb:active {
	display: block;
	border-top: 4px solid #00CCFF;
	border-right: 4px solid #00CCFF;
	border-bottom: 4px solid #00CCFF;
	border-left: 4px solid #00CCFF;
	border: dotted;
	border-radius: 15px;
	-moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    width: auto;
	background-color:  #33CCFF;
}
.n { 
  font-size: 0.95em;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}
.p {  
  font-size: 0.875em;
  input[type=number], select {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 10px;
  padding: 12px;
  border-radius: 4px;
  resize: vertical;
}

}
.p2 {  
  font-size: 0.75em;
  }
.p1 {  
  font-size: 0.5em;
    input[type=number], select {
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  width: 10px;
  padding: 12px;
  border-radius: 4px;
  resize: vertical;
  }