/* DEFAULTS
----------------------------------------------------------*/
body { background: #b6b7bc; font-size: .80em; font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; margin: 0; padding: 0; color: #696969; width: 100%; }

.header { position: relative; margin: 0; padding: 0; background: #252525; width: 100%; height: 60px; }
    .header h1 { font-weight: 700; margin: 0; padding: 0 0 0 20px; color: #f9f9f9; border: none; line-height: 2em; font-size: 2em; }

dl.twoWide { width: 100%; text-align: left; margin: 0; }
    dl.twoWide dt { width: 15%; padding-right: 1%; padding-left: 1%; padding-bottom: 5px; float: left; margin: 0; text-align: right; }
    dl.twoWide dd { width: 33%; float: left; margin: 0; padding-bottom: 5px; }
    dl.twoWide :nth-child(4n+5) { clear: both; }

dl.oneWide { width: 100%; text-align: left; margin: 0; }
    dl.oneWide > dt { width: 25%; padding-right: 1%; padding-bottom: 5px; float: left; margin: 0; text-align: right; }
    dl.oneWide > dd { width: 73%; float: left; margin: 0; padding-bottom: 5px; }
    dl.oneWide > :nth-child(2n+3) { clear: both; }

dl.oneWideBigScreen { width: 100%; text-align: left; margin: 0; }
    dl.oneWideBigScreen > dt { width: 15%; padding-right: 1%; padding-bottom: 5px; float: left; margin: 0; text-align: right; }
    dl.oneWideBigScreen > dd { width: 83%; float: left; margin: 0; padding-bottom: 5px; }
    dl.oneWideBigScreen > :nth-child(2n+3) { clear: both; }

dl.oneWideBigDt { width: 100%; text-align: left; margin: 0; }
    dl.oneWideBigDt > dt { width: 35%; padding-right: 1%; padding-bottom: 5px; float: left; margin: 0; text-align: right; }
    dl.oneWideBigDt > dd { width: 63%; float: left; margin: 0; padding-bottom: 5px; }
    dl.oneWideBigDt > :nth-child(2n+3) { clear: both; }

dl.importantNumbers { }
    dl.importantNumbers dt { font-size: 20px; }
    dl.importantNumbers dd { font-size: 20px; color: black; }

.col3-1, .col3-2, .col3-3 { margin: 0; padding: 0 5px 0 0; line-height: 14px; float: left; }
.col3-1, .col3-3 { width: 19%; }
.col3-2 { width: 57%; }
.col3even-1, .col3even-2, .col3even-3 { width: 31%; margin: 0; padding: 0 5px 0 0; line-height: 14px; float: left; }
.col2-1, .col2-2 { margin: 0; padding: 0 5px 0 0; line-height: 14px; float: left; }
.col2-1 { width: 77%; text-transform: capitalize; }
.col2-2 { width: 19%; }
.col2half-1, .col2half-2 { margin: 0; padding: 0 5px 0 0; line-height: 14px; float: left; }
.col2half-1 { width: 49%; text-transform: capitalize; }
.col2half-2 { width: 49%; }

/* Must do !important below because of Telerik theme... */
table.basicSpacing { border-spacing: 1px !important; border-collapse: separate !important; }
    table.basicSpacing > tbody > tr > td { padding: 2px; }

.bold { font-weight: bold; }

.right { float: right; }
.left { float: left; }

.textAlignRight { text-align: right; }
.textAlignCenter { text-align: center; }

.importantText { font-weight: bold; font-size: larger; }
.criticalText { font-style: italic; color: darkblue; }
.smallerText { font-size: smaller; }
.lowPriorityText { color: gray; font-style: italic; }

.required { color: red; }

.smallLabel { width: 70px; padding-left: 3px; padding-right: 5px; display: inline-block; text-align: right; }

.hidden { display: none; }
.showTableRow { display: table-row; }

.smallerH3 { font-size: 18px; margin-top: 5px; }

.clear { clear: both; }

.bmPurple { color: #92278F; }

.smallGridButton { font-size: 10px; }

.previewThumbnailLineItem { max-width: 150px; max-height: 100px; }

.rgDetailTable { margin: 10px; }

td.tableLabel { color: gray; width: 150px; }

.lineLabel { width: 15%; }

.bigButton { font-size: 20px; font-weight: bold; }

.completionButton { color: green; }

.cancelButton { color: red; }

.bottomBorder { border-bottom: 1px solid black; }

/* ---- Progress Indicator ---- */
#imgProgressBar { background-image: url('../Images/ajax-bluegold.gif'); background-repeat: no-repeat; width: 100px; height: 100px; }
.Progress_Indicator { border: solid 1px #A0A0A0; color: #A0A0A0; padding: 4px; background-color: White; }
    .Progress_Indicator img { padding: 5px; }

/* ---- Controls ---- */
.TextBox { width: 200px; }
.TextBoxSmallFont { width: 200px; font-size: 8pt !important; }

.PanelLayout { margin: 0 0 0 8px; padding: 0; }
.PanelLayoutCentered { width: 700px; margin-left: auto; margin-right: auto; }
.PanelLayoutCenteredLarge { width: 900px; margin-left: auto; margin-right: auto; }
.RequiredLabel { color: #696969; font-size: 6pt; font-style: italic; }
/* ---- Page Styles ---- */
.AppMessage { color: Maroon; font-size: 8pt; font-weight: bold; }

.ErrorText { color: Red; font-size: 8pt; font-weight: bold; }
.errorBig { color: red; font-size: 25px; }

.ContentLineBreak { height: 12px; clear: both; padding-top: 0 !important; width: 100%; }
.ContentLineBreakSmall { height: 8px; clear: both; padding-top: 0 !important; width: 100%; }

div.FormContentSection { position: relative; margin: 0 0 5px 15px; padding-bottom: 15px; clear: both; width: 100%; }
div.FormFieldLabel { float: left; width: 175px; position: relative; padding: 0 5px 0 0; margin-top: 0; text-align: right; vertical-align: middle; }
div.FormField { padding: 0; margin-left: 180px; }

/* HEADINGS
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 { font-size: 1.5em; color: #666666; font-variant: small-caps; text-transform: none; font-weight: 200; margin-bottom: 0; padding-bottom: 0; }
h1 { font-size: 1.6em; margin-bottom: 0; }

/* PRIMARY LAYOUT ELEMENTS
----------------------------------------------------------*/

.page { background-color: #fff; margin: 5px auto 0 auto; border: 1px solid #496077; padding: 5px; }

.main { padding: 0 12px; margin: 12px 8px 8px 8px; min-height: 420px; }

.footer { color: #4e5766; padding: 8px 0 0 0; margin: 0 auto; text-align: center; line-height: normal; }

/* LOGIN FORM ELEMENTS
----------------------------------------------------------*/

fieldset.login { margin: 1em 0; padding: 1em; border: 1px solid #ccc; }
    fieldset.login p { margin: 2px 12px 10px 10px; }
    fieldset.login label, fieldset.register label, fieldset.changePassword label { display: block; }
        fieldset.login label.inline { display: inline; }

legend.loginlegend { font-size: 1.1em; font-weight: 600; padding: 2px 4px 8px 4px; }

input.textEntry { width: 320px; border: 1px solid #ccc; }
input.passwordEntry { width: 320px; border: 1px solid #ccc; }

div.accountInfo { width: 400px; }

.loginDisplay { font-size: 1.1em; display: block; text-align: right; padding: 10px; color: White; }
    .loginDisplay a:link { color: white; }
    .loginDisplay a:visited { color: white; }
    .loginDisplay a:hover { color: white; }

/* ERROR MSG ELEMENTS
----------------------------------------------------------*/
fieldset.ValidationSummary { margin: 1em 0; padding: 1em; border: 1px solid #ccc; }
    fieldset.ValidationSummary p { margin: 2px 12px 10px 10px; }
    fieldset.ValidationSummary label { display: block; }
        fieldset.ValidationSummary label.inline { display: inline; }

legend.ValidationSummary { font-size: 1.1em; font-weight: 600; padding: 2px 4px 8px 4px; }

.requiredFieldValidator { color: #880000; font-weight: bold; }

/* TEXT FORMATS
----------------------------------------------------------*/
.GrayText12pt { color: #696969; font-size: 12pt; }
.GrayText8pt { color: #696969; font-size: 8pt; }

.BreadCrumbText a { color: #696969; text-decoration: none; }
    .BreadCrumbText a:hover { color: #696969; text-decoration: underline; }
    .BreadCrumbText a:visited { color: #696969; text-decoration: none; }

/* MISC
----------------------------------------------------------*/

.basicSection { padding: 3px; margin: 5px; }

.title { display: block; float: left; text-align: left; width: auto; }

.failureNotification { font-size: 12px; color: Red; }

.submitButton { text-align: right; padding-right: 10px; }

ul.clean { list-style-type: none; }
    ul.clean > li { padding: 3px; }

ul li a { color: #696969; text-decoration: none; }
    ul li a:hover { color: #696969; font-weight: bold; }
    ul li a:visited { text-decoration: none; }

.gridLayout { width: 95%; margin-left: auto; margin-right: auto; }

.moreInfo { width: 20px; height: 20px; vertical-align: middle; cursor: help; }

div.RadGrid_Default .rgFooter a, div.RadGrid_Default .rgEditForm a { color: #428bca; }

.row.topSpace { padding-top: 10px; }

/*---------Budget Manager----------------------*/
div.BudgetFormFieldLabel { float: left; width: 20%; position: relative; padding: 0 5px 0 0; margin-top: 0; vertical-align: middle; }
div.CenterButtons { margin-left: auto; margin-right: auto; width: 20%; padding-top: 5px; }
.budgetPanel { float: left; width: 50%; }

/*---------Landing Page Creation----------------------*/

.collapsibleContainerTitle { cursor: pointer; font-weight: bold; color: Black; }
    .collapsibleContainerTitle div { padding-top: 5px; padding-left: 10px;  background: #dbdbdb; background-color: Teal; width: 1000px; }
.collapsibleContainerContent { padding: 10px; display: none; }

ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 32px; /*--Set height of tabs--*/ border-bottom: 1px solid #999; border-left: 1px solid #999; width: 100%; }
    ul.tabs li { float: left; margin: 0; padding: 0; height: 31px; /*--Subtract 1px from the height of the unordered list--*/ line-height: 31px; /*--Vertically aligns the text within the tab--*/ border: 1px solid #999; border-left: none; margin-bottom: -1px; /*--Pull the list item down 1px--*/ overflow: hidden; position: relative; background: #e0e0e0; }
        ul.tabs li a { text-decoration: none; color: #000; display: block; font-size: 1.2em; padding: 0 20px; border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/ outline: none; }
            ul.tabs li a:hover { background: #ccc; font-weight: normal; }

html ul.tabs li.active, html ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/ background: #fff; border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/ }

.tab_container { border: 1px solid #999; border-top: none; overflow: hidden; clear: both; float: left; width: 100%; background: #fff; }
.tab_content { padding: 20px; font-size: 1.2em; }

.SeasonalImage { display: none; top: 200px; left: 500px; position: absolute; }

html .RadOrgChart .rocItemContent,
html .RadOrgChart .rocItemTemplate { height: 78px; /** Was 78 */ }

.RadMenu.RadMenu_Black.rmSized { z-index: 1 !important; }

/*------------------ Quote Tracker -------------------*/

div.RadGrid_Default .rgRow a, div.RadGrid_Default .rgAltRow a, div.RadGrid_Default .rgEditRow a { color: #2a6598; }

.quoteItemFileUploadControl { margin-left: 0; }
    .quoteItemFileUploadControl div.RadGrid_Default { width: 100% !important; border-color: transparent; }

.quoteActionButtons { padding: 20px 15px 15px 15px; }

.newQuotePage hr { margin-top: 20px; margin-bottom: 20px; }
.newQuotePage h3 { margin-top: 2px; }

.exportType { display: inline-block; }

.selectAllPriceBreaksButton { margin-left: 25px; }

.quoteItemStatus { font-size: larger; text-shadow: 2px 2px rgba(0, 0, 0, 0.12); font-weight: bold; }
.quoteItemComplete { color: purple; }
.quoteItemRejectedClosed { color: red; }
.quoteItemSaved { color: dimgray; }
.quoteItemProcessing { color: green; }
.quoteItemWaiting { color: blue; }

span.rushSelected.RadButton_Default { color: red; font-weight: bold; font-size: 14px; }
.rushPanel { border: 1px solid red; }
.notRushPanel { border: 1px solid White; }

div.gridContainingMenu > table { overflow: visible !important; }

.marginMessage { padding-left: 20px; }

/*.newQuotePage #cphMain_cphMain_ClonePanel { display: none; }*/
/* Hide quote clone section. */

fieldset.qiEditForm { margin-top: 15px; }
    fieldset.qiEditForm > legend { margin-bottom: 10px; }
    fieldset.qiEditForm > div { padding: 1px 15px 15px 15px; }
    fieldset.qiEditForm dl.oneWide > dt, dl.cutDieLineSection > dt { text-align: left; padding-left: 40px; }
    fieldset.qiEditForm div.requiresSubSectionPad { padding-left: 55px; }

.currentAssignments { padding-top: 20px; float: left; z-index: 102; }
    .currentAssignments .assignmentCorp { display: inline-block; width: 45%; }
    .currentAssignments .assignmentMarket { display: inline-block; width: 45%; }
    .currentAssignments .RadListBox .rlbCheck { float: left; margin-top: 3px; }

.row.configRow > div > label, .row.configRow > div > span { padding-left: 7px; padding-right: 7px; }
.container-fluid.gridBorder { border: 1px solid #CAC2C2; }
    .container-fluid.gridBorder > div.row { border-top: 1px solid #CAC2C2; }

/* z-index is hack to prevent action menu from showing over RadWindow.  Works because happen to know Telerik uses 3000 as the starting z-index for RadWindows. */
.actionMenu { overflow: visible !important; z-index: 2999; }
.actionMenuImage img { width: 20px; }
.expandedAction { background-color: white; }
.filterSection { padding: 10px; }
.actionControl { position: relative; padding: 5px; }

.vendorEmailCompletion { color: aqua; font-size: 30px; padding: 20px; text-align: center; height: 800px; width: 100%; position: absolute; background-color: rgba(0, 0, 0, 0.2); top: 0; left: 0; }

.itemGridDetailTemplate { border: 1px solid rgb(194,194,194); overflow: hidden; border-top-width: 0; }
    .itemGridDetailTemplate td { padding: 3px; }

.recent01 { /*background-color: #A9F5A9;*/ background: rgba(169, 245, 169, 0.5); }
.recent02 { /*background-color: #F4FA58;*/ background: rgba(244, 250, 88, 0.5); }
.recent03 { /*background-color: #FFBF00;*/ background: rgba(255, 191, 0, 0.5); }
.recent04 { /*background-color: #F7819F;*/ background: rgba(247, 129, 159, 0.5); }
.rushQuote { font-weight: bold; }

.qiNestTable { border: 1px solid rgb(194,194,194); overflow: hidden; border-top-width: 0; margin-top: -6px; }
    .qiNestTable td { padding: 3px; }

/*---------Approval Config----------------------*/

html .rocItem .rocItemContent { color: blue !important; font-weight: bold; border: 1px solid black !important; background-color: silver !important; }

html .RadOrgChart .rocItem { width: 150px !important; /*width: auto !important;*/ }

/* TO do - move to javascript, needs to be set only for groups of the same items
.RadOrgChart .rocGroup .rocItemList
{
    width: 900px !important;
}
*/

.rbDecorated input { text-align: right !important; padding-right: 10px !important; }

.smallPaddedSection { position: relative !important; z-index: 2 !important; padding: 5px !important; margin: 5px !important; }

/*.rpRootGroup { position: static !important; width: 400px !important; }*/

.alignOrgChart { /*margin-left: 150px*/ }

.rpSlide label { left: 10px !important; margin-left: 10px !important; }
.rpSlide input[type="checkbox"] { display: inline-block !important; text-align: left !important; margin-left: 7px !important; }

.RadForm.rfdTextbox input[type="text"].rfdDecorated { float: right !important; margin-right: 30px !important; text-align: left !important; }
/*.rpSlide input[type="text"] { float: right !important; margin-left: 80px !important; text-align: right !important; }*/
.RadForm .rfdSelect { display: inline-block !important; text-align: left !important; margin-left: 60px !important; }

.divsSideBySide div { float: left !important; padding: 10px !important; }
.divsSideBySide .RadListBox .rlbItem { border-style: solid !important; border-width: 1px !important; border-color: black !important; margin-top: 3px !important; }

.rtShadow { -moz-border-radius: 15px !important; border-radius: 15px !important; }
.rtWrapper { -moz-border-radius: 15px !important; border-radius: 15px !important; }
.rtWrapperContent { -moz-border-radius: 15px !important; border-radius: 15px !important; }

.toggleOn { border: 1px outset; color: #369; background: #FFCC99; /*#efefef;*/ background-color: #FFCC99 !important; }
.toggleOff { border: 1px outset; color: #369; background: #f9d543; /*#f9d543;*/ background-color: #f9d543 !important; }

input.toggler { background: url(/Images/gear-icon.png) no-repeat; background-color: #f9d543; background-position: left center; background-size: 30px 30px; cursor: pointer; margin-top: 20px; margin-bottom: 20px; width: 200px; height: 50px; font: normal 12px "Segoe UI",Arial,Helvetica,sans-serif; }

.isHidden { display: none !important; }

.rocLineUp { display: none !important; }
.rocLineDown { text-align: center; margin-left: -20px; background-repeat: no-repeat !important; width: 90px !important; height: 60px !important; background-image: url("/Images/arrow_down.png") !important; }

.rddlList { height: 500px !important; }
.rddlPopup { width: 300px !important; }

/* Initially hidden items */
.cutDieLineSection, .largeFormatMaterialSection, .otherFormatMaterialSection, .laminationSection, .encapsulatedSection, .bindingSection, .paddingSection, .bundlesSection, .finishingSection, .shipsWithSection, .proofingSection, .additionalSection { display: none; }

/*Left Right & Center DIVS*/
.left-column, .right-column, .center-column { position: relative; float: left; }
.left-column { margin-right: 1px; margin-left: 10px; z-index: 10; width: 41%; }
.right-column { margin-right: -200px; margin-left: 15px; z-index: 10; width: 41%; }
.center-column { margin: 0 0 0 0; /*z-index: 20;*/ width: 18%; }

.container { width: 98%; margin: 0; }