/** 
* SilverStripe Black Candy Theme
* http://www.silverstripe.com
*
* Form Styling
*/

form#Form_Form { padding-top:8px; }

/* FIELDSETS
---------------------------------------- */

fieldset { border:0; padding:0px; margin:0px; }

#Content form fieldset h2#Form_Form_FormHeadingLabel { font-size:15px; clear:both; margin-top:10px; padding-bottom:3px; border-bottom:#8caddc 1px solid; }

/* ACTION BUTTONS
---------------------------------------- */

input { background-color:#ccd8e6; color:#000000; border:#ffffff 1px solid; font-weight:normal; }

input.action { padding:6px; font-size:11px; font-family:Verdana, Tahoma, Sans-serif; font-weight:bold; background-color:transparent; margin-top:10px; background-color:#ffffff; float:right; }

input#PageCommentInterface_Form_PostCommentForm_action_postcomment { padding:2px 6px 2px 6px; }

input.action:hover,
input.action:focus { cursor:pointer; }

/* FIELD FORMATING
---------------------------------------- */

form ul { list-style:none; }

form#PageCommentInterface_Form_PostCommentForm { padding-bottom:15px; margin-bottom:15px; }

.middleColumn { display:block; margin:0px; padding:0px; width:306px; }

#Sidebar .middleColumn { margin:0 0 0 8px; 	display:inline; }

div.tab .field .middleColumn { clear:none !important; margin:0 !important; width:auto; }

.middleColumn .middleColumn { margin-left:0; margin-right:0; padding:0; }

.middleColumn .message { margin:0; }

div.file { float:right; width:294px;}

/* INPUT BOXES
---------------------------------------- */

.required { font-size:10px; color:#d96e00; }

p.required.left { float:left; }
p.vr, p.vr a { clear:both; font-size:10px; color:#b8b5a1; }

.middleColumn input { background-color:#ccd8e6; color:#422818; border:#ffffff 1px solid; font-weight:normal; }

textarea, select { background-color:#ccd8e6; }

input.submit { width:60px; height:38px; background-color:transparent; border:none; font-size:10px; line-height:8px; text-transform:uppercase; font-weight:bold; cursor:pointer; float:left; }

input.text, textarea, select { padding:2px; border:1px solid #A7A7A7; color:#000000; font-size:12px; width:285px; }

textarea { font-family:Verdana, Tahoma, sans-serif; font-size:12px; }

input:focus span, textarea:focus span { border:3px solid #000; }

/* SELECT DROPDOWN
---------------------------------------- */

select { width:auto; }

div.field.dropdown { clear:both; width:600px; padding:6px 0px 6px 0px; }
div.field.dropdown label.left { width:290px; margin-right:15px; float:left; text-align:right; }
div.field.dropdown div.middleColumn { width:190px; float:left; }
div.field.dropdown div.middleColumn select { width:290px; font-size:10px; }

div.field.optionset { width:600px; padding:12px 0px 12px 0px; }
div.field.optionset label.left { width:290px; margin-right:15px; float:left; text-align:right; }
div.field.optionset div.middleColumn { width:190px; float:left; }
div.field.optionset div.middleColumn select { width:290px; font-size:10px; }
div.field.optionset div.middleColumn input{float:left;10px;}
div.field.optionset div.middleColumn li {margin-top:3px;}
div.field.optionset:after{ content:"."; display:block; height:0px;clear:both; visibility:hidden;}

div.field.text, div.field.email, div.field.password, div.field.checkboxset  { clear:both; width:600px; padding:6px 0px 6px 0px; }
div.field.text label.left, div.field.email label.left, div.field.password label.left, div.field.checkboxset label.left { width:290px; margin-right:15px; float:left; text-align:right; }
div.field.text div.middleColumn, div.field.email div.middleColumn, div.field.password div.middleColumn, div.field.checkboxset div.middleColumn { width:290px; float:left; }

div.field.textarea { clear:both; width:600px; padding:6px 0px 6px 0px; }
div.field.textarea label.left { width:290px; margin-right:15px; float:left; text-align:right; }
div.field.textarea label.left p { width:100%; }
div.field.textarea div.middleColumn { width:290px; float:left; }

div.literalFieldArea { display:block; }

p.field.checkbox, p#ForgotPassword { width:290px; margin-left:305px; }

p#Remember { padding-top:6px; }

ul.optionset.checkboxsetfield li input { float:left; margin:2px 3px 0px 0px; }
ul.optionset.checkboxsetfield li label { float:left; width:272px; }
ul.optionset.checkboxsetfield li { clear:both; }

/* LABELS
---------------------------------------- */

label { display:block; font-size:10px; line-height:17px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#000000; }

label.right { display:inline; width:290px; }

#Name label, #CommenterURL label, #Comment label { color:#422818; font-size:12px; margin:6px 0px 2px 0px; }

/* SEARCH BOX 
---------------------------------------- */

#Search { width:105px; }

input#Search_Form_SearchForm_Search { width:110px; 	padding:3px; 	margin-left:-4px; font-size:12px; }

#Sidebar input.action { font-size:12px; float:right; padding:1px; margin:-22px 10px 0 0; }

/* CLEAR FLOATS
This forces the div to surround elements that it contains that are floating, without having to put an element on the page that clears the float. See IE stylesheets for the method that works for that browser, since it doesn't support pseudo-selectors. */

div.field.textarea:after,
div.field.text:after,
div.field.email:after,
div.field.dropdown:after,
#Password:after { content:".";  display:block;  height:0; clear:both; visibility:hidden; }