body {
  color: #000;
  font-family: Arial, sans-serif;
  font-size: 12px; /* basesize */
  line-height: 1.5;
}

/* Percentage Font-size reference:
- 84%   ~ 10px
- 92%   ~ 11px
- 100%  ~ 12px (basesize)
- 110%  ~ 13px
- 115%  ~ 14px
- 125%  ~ 15px
- 150%  ~ 18px
- 185%  ~ 22px
- 200%  ~ 24px
- 250%  ~ 30px
*/

/* Links ---*/
a {
  color: #09c;
  text-decoration: none;
}

a:hover, a:active, a:focus {
  color: #333;
  text-decoration: none;
}

/* Headings & Titles ---*/
h1, h2, h3, h4, h5, h6 {
  text-rendering: optimizelegibility;
}

/* Small text ---*/
small, .small {
  font-size: 92%;
}

/* List ---*/
ul {
  list-style: none;
}

ul li {
}


ol {
}


ol li {
  list-style-position: inside;
}

dt {
  font-weight: bold;
}

dd {
}

/* Image ---*/
img {
  max-width: 100% !important;
}

img[align=left] {
  margin: 0 20px 0 0;
}

img[align=right] {
  margin: 0 0 0 20px;
}

/* Others ---*/
hr {
  border-top: 1px solid #ccc;
}

/* FORM
--------------------------------------------------------- */
form {
}

label {
  cursor: pointer;
  margin-right: 10px;
}

input, select, button, textarea {
  font-family: inherit;
  font-size: 100%; /* Set the font size to match with the basesize */
  transition: all 0.2s ease 0s;
  -o-transition: all 0.2s ease 0s;
  -moz-transition: all 0.2s ease 0s;
  -webkit-transition: all 0.2s ease 0s;
}

textarea {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 3px;
  box-sizing: border-box;
  color: #333;
  overflow: auto;
  padding: 10px 15px;
  vertical-align: top;
}

textarea:hover {
  border-color: #999;
}

textarea:focus {
  border-color: #666;
  box-shadow: inset 0 0 2px rgba(0,0,0,.4);
}

input[type=text],
input[type=password],
input[type=email],
.inputbox {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 3px;
  color: #333;
  line-height: normal;
  margin: 0;
  padding: 5px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

input[type=text]:hover,
input[type=password]:hover,
input[type=email]:hover,
.inputbox:hover {
  border-color: #09c;
}

input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
.inputbox:focus {
  border-color: #666;
  box-shadow: inset 0 0 2px rgba(0,0,0,.4);
}

input[type=submit],
.button,
button {
  background: url(../images/trans-grad-white-20.png) repeat-x center #09c;
  border: 1px solid #09c;
  border-radius: 3px;
  color: #FFF;
  font-weight: bold;
  line-height: normal;
  margin: 0;
  padding: 3px 5px;
  text-shadow: 0 -1px 0 rgba(0,0,0,.4);
}

input[type=submit]:hover,
.button:hover,
button:hover {
  background-color: #333;
  border: 1px solid #333;
}

input[type=submit]:focus,
.button:focus,
button:focus {
  background-color: #333;
  border: 1px solid #333;
  box-shadow: inset 1px 1px 1px rgba(0,0,0,.7);
}

.checkbox,
input[type=checkbox] {
  border: 0;
}

.radio,
input[type=radio] {
  border: 0;
}

input[type=checkbox],
input[type=radio] {
  margin: 0;
  padding: 0;
  vertical-align: middle;
  width: auto !important;
}

fieldset {
  border: none;
}

legend {
  font-size: 125%;
  font-weight: bold;
  line-height: 1.2;
}

fieldset dt {
  clear: left;
  float: left;
  padding: 3px 0;
  line-height: 25px;
}

fieldset dd {
  min-height: 25px;
  padding: 3px 0;
  line-height: 25px;
}

.star {
  color: #c00;
}

.invalid {
  border-color: #c00;
}

label.invalid {
  color: #c00;
}

/* GENERIC STYLE
--------------------------------------------------------- */
/* Clearfix */
.clearfix:after {
  clear: both;
  content: "";
  display: block;
  height: 0;
  visibility: hidden;
}

* html .clearfix {
  height: 1%;
}

:first-child + html .clearfix {
  min-height: 1%;
}

/* Alignment */
.left {
  float: left;
}

.right {
  float: right;
}