/* ------ Below are styles for overall page layout for new gTLD Application Comments ------ */

.formSection {
    width: 100%;
    border: 1px solid #d8d8d8;
    background-color: #f8f8f8;
}

/* field name */
label {
    width: 20%;
    float: left;
    text-align: right;
    margin-right: 0.5em;
    display: block;
}

/* text fields with a blue border */
input {
    color: #000000;
    border: 1px solid #A9A9A9;
    width: 60%;
    padding-top: 3px;
    padding-bottom: 3px;
}

/* text areas with a blue border */
textarea {
    color: #000000;
    border: 1px solid #212B5F;
    width: 60%;
    padding-top: 3px;
    padding-bottom: 3px;
    resize:none;
}

textarea[readonly] {
    width:75%;
    background-color: #f8f8f8;
    border: none;
    overflow:auto;
    color: #595959;
    font-family: Arial, sans-serif;
	font-size: 14px;
	line-height: 20px;
    padding: 1px;
    outline: none;
}

pre {
    white-space: pre-line;
}

.field_instruction {
    margin-left: 20%;
    width: 60%;
    padding: 0;
    font-size: 80%;
    color: #d8000c;
}

/* submit button in orange color */
.submit {
}
.submit input {
    color: #ffffff;
    background: #F89728;
    font: bold 115% arial;
    border: 0px;
    width: auto;
}

/* submit button when disabled */
.submit input[disabled] {
    margin-left: 0.5em;
    color: #ffffff;
    background: #cccccc;
    font: bold 84% arial;
    width: auto;
}

.footnotes {
    background-color:#f8f8f8;
    font-size:80%;
}

/* Specific for the login form */
.inline-login-form {
    border: 1px solid #d8d8d8;
    background-color: #f8f8f8;
	float: right;
	margin-left: 30px;
	margin-bottom: 30px;
	width: 40%;
}

.inline-login-form label {
    width: 20%;
}

.inline-login-form .submit {
    margin-left: 20%;
}
.inline-login-form .submit input {
    margin-left: 0.5em;
}

.inline-login-form .forgotPassword {
    margin-left: 10%;
}

.message {
    padding: 0 10px;
}

/* To align the Kaptcha input field */
.ck-kaptcha input {
    margin-left: 198px;
    margin-bottom: 0;
}

/* Override the t:zone in default.css from tapestry core*/
.t-zone {
    display: inline;
}

/* Override the Tapestry t:grid style in default.css from tapestry core  */

img.t-sort-icon	{
    margin: auto;
    vertical-align: bottom;
    display: block;
}

.auto_table {
    width: auto;
}

TABLE.t-data-grid {
    border: 1px solid #efefef;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border-collapse: collapse;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    font-family: Arial, sans-serif;
}

TABLE.t-data-grid THEAD TR {
    color: #595959;
    background-color: #f8f8f8;
}

TABLE.t-data-grid THEAD TR TH {
    white-space: pre;   /* wrap on line break*/
    border: 1px solid #d8d8d8;
    padding: .5em;
    text-align: center;
    vertical-align: bottom;
}

TABLE.t-data-grid TBODY TR TD {
    border: 1px solid #d8d8d8;
    padding: .5em;
    white-space: pre;
}

DIV.t-data-grid {
    font-size: 90%;
}

DIV.t-data-grid-pager {
    margin: 0px;
}

DIV.t-data-grid-pager A, DIV.t-data-grid-pager SPAN.current {
    text-decoration: none;
    color: #595959;;
    padding: 2px 5px;
    font-size: medium;
    border: none;
    margin-right: 5px;
}

DIV.t-data-grid-pager A:hover {
    border: none;
}

DIV.t-data-grid-pager SPAN.current {
    color: white;
    background-color: #2d76d0;
    border: none;
}

TABLE.t-data-grid TR TH A {
    color: #595959;
}

TABLE.t-data-grid tbody tr.odd	{
    background-color: #f8f8f8;
}

/* Override the auto-completion style in default.css from tapestry core */
DIV.t-autocomplete-menu {
    display: inline;
    font-size: 70%;
    font-family: Arial, sans-serif;
}
DIV.t-autocomplete-menu UL {
    border: 1px solid #d8d8d8;;
    background-color: #ffffff;
    padding: 4px 6px;
    overflow: auto;
}

DIV.t-autocomplete-menu LI {
    color: #000000;
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    border-bottom: none;
    cursor: pointer;
}

DIV.t-autocomplete-menu LI.selected {
    color: white;
    background:  #2d76d0;
    font-weight: bold;
}

/* Specific for displaying the search value text field or select component*/
.display_none {
    display: none;
    width: 300px;
}

.display_block {
    display: inline-block;
    width: 300px;
}

/* -----------Application Status Table/Grid----------- */

TABLE.t-data-grid THEAD TR TH.prioritizationNumberDisplayable {
    white-space: pre;
}
TABLE.t-data-grid THEAD TR TH.applicationTld {
    white-space: pre;
}
TABLE.t-data-grid THEAD TR TH.countryCode {
    white-space: pre;
}

/* ----------Application Change History Grid/Table--------- */

/* We want the summary,From,To columns to wrap the text as necessary and on line break */
TABLE.t-data-grid TBODY TR TD.dateCreated {
    white-space: nowrap;
}
TABLE.t-data-grid TBODY TR TD.summary {
    white-space: pre-line;
}
TABLE.t-data-grid TBODY TR TD.fromText {
    white-space: pre-line;
}
TABLE.t-data-grid TBODY TR TD.toText {
    white-space: pre-line;
}

/* -----------String Contention Set Table/Grid----------- */

TABLE.t-data-grid THEAD TR TH.name {
    white-space: pre;
}
TABLE.t-data-grid THEAD TR TH.setNumber {
    white-space: pre;
}
TABLE.t-data-grid THEAD TR TH.type {
    white-space: pre;
}
TABLE.t-data-grid THEAD TR TH.status {
    white-space: pre;
}
TABLE.t-data-grid THEAD TR TH.numApps {
    white-space: pre;
}

TABLE.t-data-grid TBODY TR TD.setNumber {
    text-align: center;
}