.form {
    background: #f7f7f7;
    border: 1px solid #cdcdcd;
    border-radius: 3px;
    box-sizing: border-box;
    position: relative; 
    border-collapse: collapse;
    width: 100%;
}

.form input,
.form textarea,
.form select {
    border: 1px solid #ccc;
    box-sizing: border-box;
    border-radius: 2px;
    box-shadow: 0px 1px 1px 0px rgba(255, 255, 255, 0.9);
    font-size: 13px;
    padding: 4px 6px;
}

.form input:focus,
.form textarea:focus,
.form select:focus {
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}

.form textarea {
    width: 100%;
}

.form input[type="file"] {
    border: none;
}

.form fieldset {
    border: 1px solid #DDD;
    padding: 10px;
    margin: 0 0 10px 0;
    -moz-border-radius:7px;
}

.form label {
    font-size: 12px;
    font-weight: bold;
    display: block;
}

.form .row {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0px 1px 1px 0px rgba(255, 255, 255, 0.9);
    padding: 10px;
}

.form .hint {
    margin: 0;
    padding: 0;
    color: #999;
}

.form .note {
    font-style: italic;
    margin: 0;
    padding: 6px 10px;
    
}

.form span.required {
    color: red;
}

.form div.error label:first-child,
.form label.error,
.form span.error {
    color: #C00;
}

.form div.error input,
.form div.error textarea,
.form div.error select,
.form input.error,
.form textarea.error,
.form select.error {
    background: #FEE;
    border-color: #C00;
}

.form div.success input,
.form div.success textarea,
.form div.success select,
.form input.success,
.form textarea.success,
.form select.success {
    background: #E6EFC2;
    border-color: #C6D880;
}


.form .errorSummary {
    border: 1px solid #C00;
    border-radius: 3px;
    color: #C00;
    padding: 10px;
    margin: 10px;
    background: #FEE;
}

.form .errorMessage {
    color: #C00;
}



div.wide.form label {
    float: left;
    margin-right: 10px;
    position: relative;
    text-align: right;
    width: 100px;
}

div.wide.form .row {
    clear: left;
}

div.wide.form .buttons, div.wide.form .hint, div.wide.form .errorMessage {
    clear: left;
    padding-left: 110px;
}

.form form {
    opacity: 1;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

.form-loading {
    background-image: url(loading.gif);
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0;
}

.form .hint {
    font-size: 12px;
}

/* Buttons */

.buttonS, .buttonM, .buttonL, .buttonH {
    color: #fff;
    cursor: pointer;
    font-weight: bold;
    text-shadow: 0 -1px #6f6f6f;
    font-size: 12px;
    display: inline-block;
    line-height: 14px ;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

.buttonS:focus, .buttonM:focus, .buttonL:focus, .buttonH:focus {
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
}

.buttonS span, .buttonM span, .buttonL span, .buttonH span {
    text-shadow: 0 1px 0 #6f6f6f;
    margin-left: 10px;
}

button.buttonS, input.buttonS {
    padding: 6px 14px;
}

button.buttonM, input.buttonM{
    padding: 7px 15px;
    font-size: 12px;
}

button.buttonL, input.buttonL {
    padding: 8px 18px;
    font-weight: normal;
}

button.buttonH, input.buttonH {
    float: right;
    padding: 4px 12px 4px 12px;
    margin: 7px 10px 6px 10px;
}

button.bDefault, input.bDefault, 
button.dualBtn, input.dualBtn, 
.searchLine button {
    border: 1px solid #c3c3c3;
    box-shadow: inset 0 1px 2px #fff;
    -webkit-box-shadow: inset 0 1px 2px #fff;
    -moz-box-shadow: inset 0 1px 2px #fff;
    color: #686868;
    text-shadow: none;
    background: #f8f8f8;
    background: -moz-linear-gradient(top, #f8f8f8 0%, #e8e8e8 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#e8e8e8));
    background: -webkit-linear-gradient(top, #f8f8f8 0%,#e8e8e8 100%);
    background: -o-linear-gradient(top, #f8f8f8 0%,#e8e8e8 100%);
    background: -ms-linear-gradient(top, #f8f8f8 0%,#e8e8e8 100%);
    background: linear-gradient(top, #f8f8f8 0%,#e8e8e8 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#e8e8e8',GradientType=0 );
}

button.bDefault:hover, input.bDefault:hover, 
button.dualBtn:hover, input.dualBtn:hover, 
.searchLine button:hover {
    -webkit-transition: box-shadow 0.05s ease-in-out;
    -moz-transition: box-shadow 0.05s ease-in-out;
    transition: box-shadow 0.05s ease-in-out;
    background: #fafafa;
    background: -moz-linear-gradient(top, #fafafa 0%, #e5e5e5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fafafa), color-stop(100%,#e5e5e5));
    background: -webkit-linear-gradient(top, #fafafa 0%,#e5e5e5 100%);
    background: -o-linear-gradient(top, #fafafa 0%,#e5e5e5 100%);
    background: -ms-linear-gradient(top, #fafafa 0%,#e5e5e5 100%);
    background: linear-gradient(top, #fafafa 0%,#e5e5e5 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#e5e5e5',GradientType=0 );
}

button.bDefault:active, input.bDefault:active, 
button.dualBtn:active, input.dualBtn:active, 
.searchLine button:active {
    background: #eee;
    color: #505050;
    border-color: #c0c0c0;
    box-shadow: 0 0 5px #e2e2e2 inset, 0 1px 1px #fff;
    -webkit-box-shadow: 0 0 5px #e2e2e2 inset, 0 1px 1px #fff;
    -moz-box-shadow: 0 0 5px #e2e2e2 inset, 0 1px 1px #fff;
    text-shadow: 0 -1px 1px #f1f1f1;
}

.bDefault span {
    text-shadow: none;
}

button.bSuccess, input.bSuccess,
button.bGreen, input.bGreen {
    border: 1px solid #68a341;
    box-shadow: 0 1px 2px 0 #a4ca6c inset;
    -webkit-box-shadow: 0 1px 2px 0 #a4ca6c inset;
    -moz-box-shadow: 0 1px 2px 0 #a4ca6c inset;
    background: #96c161;
    background: -moz-linear-gradient(top, #96c161 0%, #609c3d 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#96c161), color-stop(100%,#609c3d));
    background: -webkit-linear-gradient(top, #96c161 0%,#609c3d 100%);
    background: -o-linear-gradient(top, #96c161 0%,#609c3d 100%);
    background: -ms-linear-gradient(top, #96c161 0%,#609c3d 100%);
    background: linear-gradient(top, #96c161 0%,#609c3d 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#96c161', endColorstr='#609c3d',GradientType=0 );
}

button.bSuccess:active, input.bSuccess:active,
button.bGreen:active, input.bGreen:active {
    background: #74aa49;
    box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
}

button.bWarn, input.bWarn, 
button.bRed, input.bRed {
    border: 1px solid #a95151;
    box-shadow: 0 1px 2px 0 #cd8787 inset;
    -webkit-box-shadow: 0 1px 2px 0 #cd8787 inset;
    -moz-box-shadow: 0 1px 2px 0 #cd8787 inset;
    background: #c57979;
    background: -moz-linear-gradient(top, #c57979 0%, #a34c4c 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c57979), color-stop(100%,#a34c4c));
    background: -webkit-linear-gradient(top, #c57979 0%,#a34c4c 100%);
    background: -o-linear-gradient(top, #c57979 0%,#a34c4c 100%);
    background: -ms-linear-gradient(top, #c57979 0%,#a34c4c 100%);
    background: linear-gradient(top, #c57979 0%,#a34c4c 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#c57979', endColorstr='#a34c4c',GradientType=0 );
}

button.bWarn:active, input.bWarn:active, 
button.bRed:active, input.bRed:active {
    background: #b15e5e;
    box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
}

button.bAction, input.bAction, button.bBlue, input.bBlue {
    border: 1px solid #3e76af;
    box-shadow: 0 1px 2px 0 #66b2d2 inset;
    -webkit-box-shadow: 0 1px 2px 0 #66b2d2 inset;
    -moz-box-shadow: 0 1px 2px 0 #66b2d2 inset;
    background: #5ba5cb;
    background: -moz-linear-gradient(top, #5ba5cb 0%, #3a70ab 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5ba5cb), color-stop(100%,#3a70ab));
    background: -webkit-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: -o-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: -ms-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#5ba5cb', endColorstr='#3a70ab',GradientType=0 );
}

button.bAction:active, button.bBlue:active, input.bAction:active, input.bBlue:active {
    background: #4786b8;
    box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
}

button.bGreyish, input.bGreyish {
    border: 1px solid #5e6779;
    box-shadow: 0 1px 2px 0 #9ca6b3 inset;
    -webkit-box-shadow: 0 1px 2px 0 #9ca6b3 inset;
    -moz-box-shadow: 0 1px 2px 0 #9ca6b3 inset;
    background: #8c97a6;
    background: -moz-linear-gradient(top, #8c97a6 0%, #596171 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8c97a6), color-stop(100%,#596171));
    background: -webkit-linear-gradient(top, #8c97a6 0%,#596171 100%);
    background: -o-linear-gradient(top, #8c97a6 0%,#596171 100%);
    background: -ms-linear-gradient(top, #8c97a6 0%,#596171 100%);
    background: linear-gradient(top, #8c97a6 0%,#596171 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#8c97a6', endColorstr='#596171',GradientType=0 );
}

button.bGreyish:active, input.bGreyish:active {
    background: #6d7787;
    box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
}

button.bBlack, input.bBlack {
    border: 1px solid #4e4e4e;
    box-shadow: 0 1px 2px 0 #959595 inset;
    -webkit-box-shadow: 0 1px 2px 0 #959595 inset;
    -moz-box-shadow: 0 1px 2px 0 #959595 inset;
    background: #838383;
    background: -moz-linear-gradient(top, #838383 0%, #444444 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#838383), color-stop(100%,#444444));
    background: -webkit-linear-gradient(top, #838383 0%,#444444 100%);
    background: -o-linear-gradient(top, #838383 0%,#444444 100%);
    background: -ms-linear-gradient(top, #838383 0%,#444444 100%);
    background: linear-gradient(top, #838383 0%,#444444 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#838383', endColorstr='#444444',GradientType=0 );
}

button.bBlack:active, input.bBlack:active {
    background: #5d5d5d;
    box-shadow: 0 0 2px #505050 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #505050 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #505050 inset, 0 1px 0 #fff;
}

button.bLightBlue, input.bLightBlue {
    border: 1px solid #5897c3;
    box-shadow: 0 1px 2px 0 #84c4dd inset;
    -webkit-box-shadow: 0 1px 2px 0 #84c4dd inset;
    -moz-box-shadow: 0 1px 2px 0 #84c4dd inset;
    background: #6db5d5;
    background: -moz-linear-gradient(top, #6db5d5 0%, #4a91c0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6db5d5), color-stop(100%,#4a91c0));
    background: -webkit-linear-gradient(top, #6db5d5 0%,#4a91c0 100%);
    background: -o-linear-gradient(top, #6db5d5 0%,#4a91c0 100%);
    background: -ms-linear-gradient(top, #6db5d5 0%,#4a91c0 100%);
    background: linear-gradient(top, #6db5d5 0%,#4a91c0 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#6db5d5', endColorstr='#4a91c0',GradientType=0 );
}

button.bLightBlue:active, input.bLightBlue:active {
    background: #559cc7;
    box-shadow: 0 0 2px #808080 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #808080 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #808080 inset, 0 1px 0 #fff;
}

button.bGold, input.bGold {
    border: 1px solid #c4853e;
    box-shadow: 0 1px 2px 0 #ddb65b inset;
    -webkit-box-shadow: 0 1px 2px 0 #ddb65b inset;
    -moz-box-shadow: 0 1px 2px 0 #ddb65b inset;
    background: #d5a44c;
    background: -moz-linear-gradient(top, #d5a44c 0%, #c07833 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d5a44c), color-stop(100%,#c07833));
    background: -webkit-linear-gradient(top, #d5a44c 0%,#c07833 100%);
    background: -o-linear-gradient(top, #d5a44c 0%,#c07833 100%);
    background: -ms-linear-gradient(top, #d5a44c 0%,#c07833 100%);
    background: linear-gradient(top, #d5a44c 0%,#c07833 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#d5a44c', endColorstr='#c07833',GradientType=0 );
}

button.bGold:active, input.bGold:active {
    background: #ca8e40;
    box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
}

button.bSea, input.bSea {
    border: 1px solid #5a837e;
    box-shadow: 0 1px 2px 0 #95b8b6 inset;
    -webkit-box-shadow: 0 1px 2px 0 #95b8b6 inset;
    -moz-box-shadow: 0 1px 2px 0 #95b8b6 inset;
    background: #7ca6a3;
    background: -moz-linear-gradient(top, #7ca6a3 0%, #547b76 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7ca6a3), color-stop(100%,#547b76));
    background: -webkit-linear-gradient(top, #7ca6a3 0%,#547b76 100%);
    background: -o-linear-gradient(top, #7ca6a3 0%,#547b76 100%);
    background: -ms-linear-gradient(top, #7ca6a3 0%,#547b76 100%);
    background: linear-gradient(top, #7ca6a3 0%,#547b76 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#7ca6a3', endColorstr='#547b76',GradientType=0 );
}

button.bSea:active, input.bSea:active {
    background: #68918d;
    box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
}

button.bBrown, input.bBrown {
    border: 1px solid #9c6b3c;
    box-shadow: 0 1px 2px 0 #c8a85f inset;
    -webkit-box-shadow: 0 1px 2px 0 #c8a85f inset;
    -moz-box-shadow: 0 1px 2px 0 #c8a85f inset;
    background: #bb934f;
    background: -moz-linear-gradient(top, #bb934f 0%, #996336 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bb934f), color-stop(100%,#996336));
    background: -webkit-linear-gradient(top, #bb934f 0%,#996336 100%);
    background: -o-linear-gradient(top, #bb934f 0%,#996336 100%);
    background: -ms-linear-gradient(top, #bb934f 0%,#996336 100%);
    background: linear-gradient(top, #bb934f 0%,#996336 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#bb934f', endColorstr='#996336',GradientType=0 );
}

button.bBrown:active, input.bBrown:active {
    background: #ad7f45;
    box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
    -moz-box-shadow: 0 0 2px #707070 inset, 0 1px 0 #fff;
}

button.buttonS, button.buttonM, button.buttonL, button.buttonH, 
input.buttonS, input.buttonM, input.buttonL, input.buttonH {
    opacity: 1;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

button.bLoading, input.bLoading {
    opacity: 0.3;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

/* File upload */
.filebutton-wrapper {
    position:relative;
}

.filebutton {
    position: absolute;
    z-index: 999;
    line-height: 0;
    font-size: 0;
    overflow: hidden;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    filter: alpha(opacity = 0);
    -ms-filter: "alpha(opacity=0)";
    margin: 0;
    padding:0;
}

.filebutton input {
    cursor: pointer;
}

filebutton-fakebutton {
    float: left;
}

.filebutton-filename {
    background: #ededed;
}

.button-column a {
    color: #ccc;
    font-size: 18px;
    margin: 0 5px;
}

.button-column a:hover {
    color: #212121;
}
