body
{
   font-size: 13px;
   font-family: arial, Verdana, Helvetica, Sans-Serif;
   color: #232323;
   background-color: #FFFFFF;
   border: 0px;
   padding: 0px;
   margin: 0px;
}

header,
footer,
nav,
section {
   display: block;
}

.cleaner
{
   clear: both;
}

#contentWrapper
{
   border-collapse: collapse;
   width: 100%;
}

/* Styles for header
-----------------------------------------------------------*/

#header
{
   background: black url('../Images/headerBackground.png') repeat-x;
   color: white;
   height: 50px;
}

#header #applicationLogo
{
   position: absolute;
   top: 17.5px;
   left: 15px;  
}

#header #filterWrapper
{
   position: absolute;
   top: 10.5px;
   left: 385px;
   z-index: 500; /* Solves IE7 z-index bug */
}

.searchButton, #notificationButton, #helpButton
{
   position: absolute;
   cursor: pointer;
   width: 62px;
   height: 29px;
}

.searchButton
{
   background-image: url('../Images/searchButton.png');  
}

#primarySearchButton
{
   top: 0px;
   left: 275px;  
}

.searchButton-hover
{
   background-image: url('../Images/searchButtonHover.png') !important;
}

#notificationButton
{
   background-image: url('../Images/notificationButton.png');
   top: 10.5px;
   right: 87px;  
}

.notificationButton-hover
{
   background-image: url('../Images/notificationButtonHover.png') !important;
}

#helpButton
{
   background-image: url('../Images/helpButton.png');
   top: 10.5px;
   right: 15px;  
}

.helpButton-hover
{
   background-image: url('../Images/helpButtonHover.png') !important;
}

/* Styles for textboxes with dropdown
-----------------------------------------------------------*/

.textboxWithDropdown
{
   float: left;
   border: 1px solid #C6C6C6;
   border-right: 0px;
   padding: 0px 0px 0px 5px;
}

#searchTextbox
{
   height: 27px;
   width: 231px;
   margin: 0px;
   line-height: 27px;
}

#statusTextbox
{
   height: 22px;
   padding: 0px 5px;
   width: 217px;
   line-height: 22px;
   background: white;
}

/* Styles for dropdown togglers
-----------------------------------------------------------*/

.dropdownToggler
{
   float: left;
   border: 1px solid #C6C6C6;
   border-left: 0px;
}

#filterDropdownToggler
{
   height: 27px;
   width: 27px;
   background: white url('../Images/filterToggle.png') no-repeat center center;
}

#statusDropdownToggler
{
   height: 22px;
   width: 16px;
   background: white url('../Images/statusToggle.png') no-repeat center center;
}

/* Styles for dropdowns
-----------------------------------------------------------*/

.dropdown
{
   position: absolute;
   display: none;
   border: 1px solid #C6C6C6;
   background: white;
}

#filterDropdown
{  
   width: 248px;
   padding: 15px 8px 8px 7px;
   z-index: 100;
}

#statusDropdown
{
   width: 243px;
   z-index: 101;
}

/* Styles for contents of filter dropdown
-----------------------------------------------------------*/
#filterDropdownCloseButton
{
   position: absolute;
   top: 4px;
   right: 5px;
   height: 16px;
   width: 16px;
   cursor: pointer;
   background: url('../Images/filterClose.png') no-repeat center center;
}

#filterTable
{
   color: #808080;
   border: 0px;
   border-collapse: collapse;
   margin-left: 1px;
}

#filterTable tr td
{
   padding: 0px;
}

#filterTable input
{
   color: black;
   margin: 0px;
}

#filterSeparator
{
   padding-top: 3px !important;
}

#secondarySearchTextbox
{
   border: 1px solid #C6C6C6;
   height: 22px;
   padding: 0px 5px;
   width: 233px;
   line-height: 22px;
}

#secondarySearchButton
{
   position: static;
   margin-top: 13px;
}

/* Styles for contents of status dropdown
-----------------------------------------------------------*/
#statusDropdown div
{
   padding: 2px 5px;
   cursor: pointer;
}

.statusDropdown-selected-item
{
   background: #EEEEEE;
}

/* Styles for toolbar
-----------------------------------------------------------*/
#toolbar
{
   background: #F4F4F4;
   border-bottom: 1px solid #E2E2E2;
   height: 49px;
   width: 100%;
}

#projectInfo
{
   position: absolute;
   top: 58px;
   left: 10px;
   color: #FF6A00;
   font-weight: bold;
}

#projectInfo p
{
   margin: 0px;
   padding: 0px 5px;
}

#projectInfo #projectName
{
   font-size: 1.2em;
}

#projectName img
{
   position: relative;
   top: -3px;
}

#actionButtons
{
   position: absolute;
   top: 61px;
   left: 385px;
}

#actionButtons .ui-button
{
   height: 27px !important;
}

#actionButtons .ui-state-default, #actionButtons .ui-widget-content .ui-state-default, #actionButtons .ui-widget-header .ui-state-default
{
   background-image: url('../Images/highWidgetBackground.png');
}

#actionButtons .ui-state-hover, #actionButtons .ui-widget-content .ui-state-hover, #actionButtons .ui-widget-header .ui-state-hover, #actionButtons .ui-state-focus, #actionButtons .ui-widget-content .ui-state-focus, #actionButtons .ui-widget-header .ui-state-focus
{
   background-image: url('../Images/highWidgetBackgroundHover.png');
}

#untranslateButton
{
   position: relative;
   left: 10px;
}

/* Styles for strings grid
-----------------------------------------------------------*/

#stringsGridWrapper
{
   padding-right: 20px;
   padding-left: 15px;
   width: 350px;
}

#actionBar
{
   border-collapse: collapse;
   margin-top: 6px;
   margin-bottom: 5px;
   color: #808080;
   font-weight: bold;
   height: 24px;
   width: 350px;
}

#actionBar tr td
{
   padding: 0px;
}

#percentTranslated
{
   white-space: nowrap;
}

#pager, #pagingInfo
{
   text-align: right;
}

#pagingInfo
{    
   width: 100%;
}

#pager
{
   white-space: nowrap;
}

#pagingButtons
{
   margin-left: 5px;  
}

.ui-icon-paging-previous
{
   background-image: url('../Images/pagingPrevious.png') !important;
}

.ui-icon-paging-next
{
   background-image: url('../Images/pagingNext.png') !important;
}

#stringsGrid
{   
   overflow-y: auto;
   overflow-x: hidden;
   width: 100%;
}

#stringsGridTable
{
   table-layout: fixed;
   border-collapse: collapse;
   width: 100%;
}

.noStringsAvailableInGrid
{
   text-align: center;
   font-style: italic;
   padding: 10px;
}

.stringToTranslate
{
   padding: 4px;
   border-bottom: 1px solid #EBEBEB;
   border-top: 1px solid #EBEBEB;
   overflow-x: hidden;
   text-overflow: ellipsis;
}

.stringToTranslateContent
{
   white-space: nowrap;
}

.stringToTranslate-active
{
   background: #FFE1C2 !important;
   cursor: pointer;
}

.stringToTranslate-hover
{
   background: #FFE1CC;
   cursor: pointer;
}

.stringToTranslate-notTranslatedSourceValue
{
   font-weight: bold;
}

.stringToTranslate-contextualId
{
   color: #999999;
}

/* Styles for translation bench
-----------------------------------------------------------*/

#noStringFoundMessage
{
   font-weight: bold;
   padding: 10px 0px;
}

#translationBench
{
   padding: 0px 20px 0px 0px;
}

#translationBench #translationBenchTable
{
   border-collapse: collapse;
   width: 100%;
}

#translationBench #translationBenchTable tr td
{
   padding: 10px 0px;
   width: 100%;
}

#originalValueWrapper
{
   padding: 5px !important;
   border: 1px solid #C6C6C6;
   background: #F5F5F5;
   height: 80px;
}

.translationLengthTooLong
{
   color: red;
}

#translationBenchTableValidation {
   color: red;
   font-weight: 700;
   font-size: 17px;
   margin: 12px 0;
}

#translationTextAreaWrapper
{
   padding: 0px 12px 0px 0px !important;
}

#translationTextArea 
{
   width: 100%;
   height: 80px;
   padding: 5px;
   margin: 0px;
   border: 1px solid #C6C6C6;   
   font-size: 13px;
   font-family: arial, Verdana, Helvetica, Sans-Serif;
}

.disabledTranslationTextArea
{
   background: #F5F5F5;
}

.androidMacro {
   background-color: purple;
   color: white;
}

.endOfLine
{
   background-color: yellow;
}

.variable
{
   background-color: lightgreen;
}

.customMacro {
   background-color: lightsalmon;
}

.searchedValue
{
   background-color: navy !important;
   color: white !important;
}

.translationHintsDescriptionCell
{
   width: 400px !important;
   margin-right: 20px;
}

.translationHintsCell
{
   width: 400px !important;
   padding: 0px !important;
}

.translationHints
{
   width: 380px;
   margin-right: 20px;
   border-collapse: collapse;
   background: #F5F5F5;
}

.translationHints p
{
   margin: 0px;
}

.translationHintDescription
{
   color: #6B6B6B;
   font-style: italic;
}

.translationHint-nothingAvailable
{
   text-align: center;
   font-style: italic;
}

.translationHint-hover
{
   background: #FFE1CC;
   cursor: pointer;
}

.translationHints tr td
{
   height: 35px !important;
   padding: 0px 8px !important;   
   border-top: 1px solid #C6C6C6;
   border-bottom: 1px solid #C6C6C6;
}

.translationHints-loading
{
   background: url('../Images/translationHintsLoading.gif') center center no-repeat;
}

/* Styles for error page
-----------------------------------------------------------*/
#errorPageContent
{
   padding: 15px;
}

/* Styles for Help
-----------------------------------------------------------*/

.helpDialog
{
   background: transparent !important;
   margin: 0px !important;
   padding: 0px !important;
   border: 0px !important;
}

.helpDialog .ui-dialog-content
{
   width: 1027px !important;
   height: 673px !important;
   margin: 0px !important;
   padding: 0px !important;
}

.helpDialog .ui-dialog-titlebar
{
   display: none;
}

#helpCloseButton 
{
   position: absolute;
   top: 28px;
   right: 42px;
   cursor: pointer;
}