/* --------------------------------- 
    NEW MODULE STYLING 2015 
 --------------------------------- */

/* USE #-ux-content TO SANDBOX COMMON (NON MODULE SPECIFIC) STYLING SAFELY AWAY FROM EASYSITE FUNCTIONALITY (MODAL WINDOWS) */
/* (.ClientAreaContainer DOES THE SAME JOB, BUT MAY BE USED HERE TO OVERWRITE OTHER SPECIFIC RULES) */

/* Based on generic font colour of #444 (inherited from lib.generics.css) */
/* A paler version for form labels etc, is #515151 */
/* Generic blue used for buttons and other details. #39addd */
/* a paler blue for selected links, buttons, etc: #58c3f4 */

/* --------------------------------- 
    GENERIC ELEMENTS
 --------------------------------- */
/* QUESTION/ANSWER format for all modules (directory, poll, asset browser, form, search, etc ) */
#-ux-content .question, #-ux-content .form-search .element .question { width: 100%; text-align: left; }
#-ux-content .question .label  { padding: 0; }
/* for checkboxes etc */
#-ux-content .answer label { margin-right: 3px; padding: 3px 10px 3px 10px; }
#-ux-content .answer, #-ux-content .form-search .element .answer { width: 100%; }
/* BUTTONS for all modules */
#-ux-content .oDataFormButtonContainer, .buttons { text-align: left; margin: 1em 0; clear: both; }
/* three different ways of targeting buttons used throughout system */
#-ux-content .oDataFormButtonContainer input, #-ux-content .buttons .button, #-ux-content input[type="submit"] { background: #32558e; cursor: pointer; color: #fff; padding: 12px 25px; font-weight: 500; font-size: 1.15em; border: 0; }
#-ux-content .page-element-inner .oDataFormButtonContainer input { background: #32558e url("/EasySiteWeb/EasySite/StyleData/BOP19-master/Images/ico-search.png") no-repeat left 13px center; margin-right: 4px; padding-left: 40px; }
/* hover/active/focus state 
#-ux-content .oDataFormButtonContainer input:hover, #-ux-content .oDataFormButtonContainer input:active, #-ux-content .oDataFormButtonContainer input:focus, 
#-ux-content .buttons .button:hover, #-ux-content .buttons .button:active, #-ux-content .buttons .button:focus, 
#-ux-content input[type="submit"]:hover, #-ux-content input[type="submit"]:active, #-ux-content input[type="submit"]:focus { background: #58c3f4; } */
/* low importance, secondary buttons */ 
#-ux-content .button[value="Clear"], #-ux-content .button[value="Reset"] { color: #444; background: #fff; margin-left: 1em; }
/* LEGEND (forms, search, etc) - emulates a h2 */
#-ux-content legend, #-ux-content .oDataFormLegend { font-size: 2.26em; color: #515151; padding: 0 0 1em 0; }

/* A - Z */
/* Directory A - Z */
.AZLinkBar { text-align: left !important; font-size: 0.9em; font-weight: 600; width: 100%; clear: both; overflow: hidden; margin: 0 0 1em; }
/* Ideally the right padding should be 1em, but reduced to allow all items to fit on one row at a smaller screen size */
.AZLinkBar a { padding: .55em .75em .55em 0; text-decoration: none; color: #39addd; display: block; float: left; clear: none; text-transform: uppercase; }
.AZLinkBar a:hover, .AZLinkBar a:active, .AZLinkBar a:focus { color: #58c3f4; }
.AZLinkBar .oAZSep { display: none; }
div.AZLinkBar > a:last-child { background: #39addd; color: #fff; border-radius: 5px; padding-left: 1em; }
div.AZLinkBar > a:last-child:hover, div.AZLinkBar > a:last-child:active, div.AZLinkBar > a:last-child:focus { background: #58c3f4; }
/* Asset Browser A - Z */
.atoz-outer { text-align: left !important; font-size: 0.9em; font-weight: 600; width: 100%; clear: both; overflow: hidden; margin: 0 0 1em; }
.atoz-outer ul.links { margin: 0; padding: 0; }
.atoz-outer ul.links li { display: block; float: left; clear: none; }
/* Ideally the right padding should be 1em, but reduced to allow all items to fit on one row at a smaller screen size */
.atoz-outer ul.links li a { padding: .55em .75em .55em 0; text-decoration: none; color: #39addd; display: block; text-transform: uppercase; }
.atoz-outer ul.links li.last a { background: #39addd; color: #fff; border-radius: 5px; padding-left: 1em; }
.atoz-outer ul.links li.last a:hover, div.atoz-outer ul.links li.last a:active, div.atoz-outer ul.links li.last a:focus { background: #58c3f4; }

/* PAGINATION */
/* Directory & Asset Browser pagination */
.pagination-pages span.jump-title { display: none; }
.results-pagination-outer span.sep { display: none; }
.pagination-outer ul, .pagination-outer li { list-style-type: none; margin: 0; padding: 0; }
.results-pagination-outer a, .pagination-outer a { display: block; float: left; clear: none; padding: 5px 15px; font-size: 1.05em; font-weight: bold; }
.results-pagination-outer a.selected, .pagination-outer li.selected a, .console .navigation-outer ul li.selected a { background: #5c991a; color: #fff; border-radius: 20px; }

/* --------------------------------- 
     FORMS
 --------------------------------- */
/* fix for occasional hidden content in config views */
fieldset { clear: both; }
/* using .ClientAreaContainer as all form elements (within content area) should be consistent, regardless of the module they appear inside */
/* main container*/
.ClientAreaContainer, .oDataFormContainer, .oFormBuilder { margin: 0 0 1em; width: 100%; overflow: hidden; clear: both; }
/* fieldset - overwrite browsers' default behaviour */
.ClientAreaContainer fieldset { border: none; padding: 0; margin: 0; }
/* separate the form elements */
.form .element { margin-bottom: 1em; }
/* Question */
.ClientAreaContainer .question { width: 100%; text-align: left; }
.ClientAreaContainer .question .label { padding: 0; color: #515151; }		
/* input areas */
/* width must not exceed 100% (1% allows for borders) */
/* text box/area */
.ClientAreaContainer .answer input.textbox, .ClientAreaContainer .answer textarea, .ClientAreaContainer .answer input[type="text"], .ClientAreaContainer .answer input[type="password"] { padding: 15px 0 15px 2%; margin: 0; width: 97% !important; border: 1px solid #a6a6a6; }
/* Combobox - these need slightly less height */
.ClientAreaContainer select { padding: 9px 0 9px 2%; margin: 0; width: 97%; border: 1px solid #444; }
/* radio buttons */
.ClientAreaContainer ul.radiolist-items { list-style: none; padding: 0 0; }
.ClientAreaContainer .radiolist-items li { display: block; float: left; width: 100%; }
.ClientAreaContainer .radiolist-items li input, .ClientAreaContainer .radiolist-items li label { float: left; }
.ClientAreaContainer .radiolist-items li input { height: 1.6em; }
/* checklist */
.ClientAreaContainer ul.checklist-items { list-style: none; padding: 0 0; }
.ClientAreaContainer .checklist-items li { display: block; float: left; width: 100%; }
.ClientAreaContainer .checklist-items li input, .ClientAreaContainer .checklist-items li label { float: left; }
.ClientAreaContainer .checklist-items li input { height: 1.6em; }
/* Datepicker */
.ClientAreaContainer .answer input.hasDatepicker { width: auto; }
/* overwrite generic textbox styling and put border on surrounding element - so can include calendar image */
.ClientAreaContainer .date-picker .answer input { border: none; }
#-ux-content .date-picker .answer { border: 1px solid #444; width: 97%; }
.ClientAreaContainer .date-picker .answer input[type="text"] { width: 80% !important; }
/* position calendar image */
.date-picker .answer img { float: right; margin: 0.8em; }

/* need to add further input fields... */

/* focus */
.ClientAreaContainer .answer input:focus, .ClientAreaContainer select:focus, .ClientAreaContainer textarea:focus, .ClientAreaContainer .date-picker .answer:focus { border-color: #7dc8f3; }
/* mandatory fields */
#-ux-content .mandatory .question .label { padding-left: 1em; background: transparent url(/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/mandatory.png) left no-repeat; }
p.mandatory { padding-left: 1em; background: transparent url(/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/mandatory.png) left no-repeat; }

/*for inline searches
.oSearchInline { margin: 20px 0; min-height: 50px; display: block; }
.oSearchInline .page-element-inner { width: 100%; clear: both; display: block; }
.oSearchInline .fields .question { display: none; }
.oSearchInline .oDataFormButtonContainer { width: 20%; float: right; clear: none !important; margin: 0 !important; }
.oSearchInline .oDataFormButtonContainer .buttons { clear: none !important;  }
.oSearchInline .oDataFormButtonContainer input { background: #32558e url("/EasySiteWeb/EasySite/StyleData/BOP19-master/Images/ico-search.png") no-repeat left 18px center; cursor: pointer; color: #fff; padding: 21px 30px 21px 50px !important; font-weight: 500; font-size: 1.25em; }

.oSearchInline .oDataFormFieldset { width: 80%; float: left; }
.oSearchInline .oDataFormFieldset .fields { background: #fff; }
.oSearchInline .oDataFormFieldset .fields input { border: 1px solid #c3c3c3 !important; padding: 23px; }*/

/* --------------------------------- 
    DIRECTORIES, MAPPING & ASSET MANAGER
 --------------------------------- */
/* TABLE */
.oDataGrid, .grid { border-collapse: collapse; width: 100%; margin: 0 0 1em; }
/* header */
.oDataGrid th, .grid th { background: #eee; text-align: left; font-weight: normal; border: 0; padding: 1em .55em; }
.oDataGrid th a.oDataGridHeaderLinkSortAsc { display: block; background: url("/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/Table-sort-ascdending.png") no-repeat right center; }
.oDataGrid th a.oDataGridHeaderLinkSortDesc { display: block; background: url("/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/Table-sort-descending.png") no-repeat right center; }
/* rows */
.table-row-background-alpha, .table-row-background-beta { border-bottom: 1px solid #dbdbdb; }
/* cells */
.oDataGridCell, .grid td { padding: .55em; vertical-align: top; }
/* MAP */
.oDirectoryBuilder .map { margin: 0 0 1em; width: 100% !important; }
/* SEARCH */
.form-search { width: 100%; overflow: hidden; clear: both; }
.oDirectoryBuilder .oDataFormContainer.form-search .oDataFormFieldset { border: 0; }
/* stack search elements on one row */
.form-search .element, .search-plugin .element, .console .form-search .element { width: auto; float: left; clear: none; margin-right: 3px; }
/* results */
.search-results { display: block; width: 100%; margin: 0 0 1em; }
/* separate the fields on directory entry */
.oDirectoryBuilder .element { margin-bottom: 1em; }
/* Detail View - Directories AND Maps */
.oDirectoryBuilder .entry-outer .label, .oDirectoryBuilder .entry-outer label  { font-weight: bold; }

/* --------------------------------- 
    POLLS
 --------------------------------- */
.oPollingDescription { font-weight: 600; text-transform: uppercase; }
/* here the label emulates a heading */
.oPollingContainerOuter .question .label { font-size: 1.124em; font-weight: 600; text-transform: uppercase; }
/* Answer elements */
.oPollingContainerOuter .answer .radiolist { padding: 1em 0 0 2em; }
.oPollingContainerOuter .answer ul { list-style-type: none; }
.oPollingContainerOuter .answer ul li label { display: inline; }
/* Results */
.oPollingVotes { font-weight: 600; font-size: 1.12em; margin: 2% 0; }
.oPollingContainerOuter .oPollingFormContainer .question span.oPollingFormLabel { font-weight: 400; text-transform: none; }
.oPollingContainerOuter .oPollingFormContainer .answer span.oPollingChartBar { background: #39addd; display: block; }

/* --------------------------------- 
    EVENTS
 --------------------------------- */
.events .calendar .ui-datepicker { width: auto; border: 0; }
/* HEADER - need to overwrite some css brought in from external widget */
.events .calendar .ui-widget-header { background: none; border: 0; }
.events .calendar { margin: 0 0 1em; }
/* calendar navigator - need to overwrite some css brought in from external widget */
.events .calendar .ui-datepicker-prev { left: 0; margin: 0; top: .7em; }
.events .calendar .ui-datepicker-next { left: 36px; margin: 0; top: .7em; }
.events .calendar .ui-datepicker-prev:hover { border-width: 0; background: none; cursor: pointer; }
.events .calendar .ui-datepicker-next:hover { border-width: 0; background: none; cursor: pointer; }
/* images on spans inside links - need to overwrite some css brought in from external widget */
.events .calendar .ui-datepicker .ui-corner-all span { height: 27px; width: 27px; position: relative; margin: 0; left: 0; top: 0; }
.events .calendar .ui-datepicker-next span.ui-icon { background: url('/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/next-calendar.png') no-repeat; }
.events .calendar .ui-datepicker-prev span.ui-icon { background: url('/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/previous-calendar.png') no-repeat; }
/* Current month title */
.events .calendar .ui-datepicker-title { font-size: 1.5em; font-weight: 400; }
/* CALENDAR TABLE */
.events table { font-size: .9em; }
.events .calendar .ui-datepicker-calendar tbody { background: #eee; }
.events .calendar .ui-datepicker-calendar .ui-datepicker-unselectable { opacity: 1; }
.events .calendar .ui-datepicker-calendar span.ui-state-default { background: none; border: 0; }
.events .calendar .ui-datepicker-calendar th span { font-weight: 400; }
.events .calendar .ui-datepicker-calendar td { padding: 2% 3%; }
.events .calendar .ui-datepicker-calendar .ui-state-default { text-align: center; }
/* Day with event */
.events .calendar .ui-datepicker-calendar td.has-event .ui-state-default { background: #39addd; border: 0; color: #fff; }
.events .fc-event { cursor: pointer; }
/* EVENT LIST */
.events .event-list .date { font-weight: 600; }
.events .event-list ul { list-style-type: none; margin: 0; padding: 0; }
.events .event-list li { margin: .55em 0; }
/* EVENT DETAILS */
/* Q & A all on one line, unlike forms */
.events .question { width: 30%; float: left; clear: none; }
.events .answer { width: 70%; float: left; clear: none; }
.events .buttons ul { list-style-type: none; margin: 0; padding: 0; }
/* ADD NEW EVENT */
.events .tabs-facet li { float: left; clear: none; width: auto; }
.events .tabs-facet li a { padding: 0.55em 1em; display: block; }
.events .ui-widget-header, .events .ui-widget-content { border-width: 0; background: none;  }
/* date picker */

/* --------------------------------- 
    ASSET MANAGER
 --------------------------------- */
/* General Layout */
.asset-manager .col-alpha { float: left; clear: none; width: 74%; margin-right: 1%; }
.asset-manager .col-beta { float: left; clear: none; width: 25%; }
.asset-manager ul li { list-style-type: none; }
/* Search */
.asset-manager .form-search .buttons { float: right; clear: none; margin: 1.5em 0; }
/* assuming these buttons are floated right (see above) then we knock the right margin off the final item - so they can be flush with the page boundary. */
.asset-manager .form-search .buttons > input:last-child { margin-right: 0; }
/* Column A */
/* A-Z same as directory */
/* hide unnecessary labels */
.asset-manager .navigation-outer .links li.first, .asset-manager .navigation-outer .links li.sep { display: none; }
/* switch view buttons */
.asset-manager .navigation-outer .views-outer { max-width: 140px; float: right; clear: none; margin: 0 0 1em; }
.asset-manager .navigation-outer .views-outer ul { padding: 0; margin: 0; list-style-type: none; }
.asset-manager .navigation-outer .views-outer li { margin: 0; padding: 0 .55em; display: block; float: left; clear: none; }
/* table same as directory */
/* Download button - change this image? */
.asset-manager .grid-outer td a[title^="Download"] { background: url('/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/download.png') no-repeat center; display: block; }
.asset-manager .grid-outer td a[title^="Download"] span { display: inline-block; text-indent: -9999px; }
/* results message */
.ClientAreaContainer .matches-outer { width: 50%; float: right; clear: none; text-align: right; }
.ClientAreaContainer .pagination-outer { width: 50%; float: left; clear: none; padding: 1% 0; }
.ClientAreaContainer .matches-outer select { padding: 1% 1%; width: auto; }
/* column B */
/* hide unnecessary tabs */
.col-beta .tabbed-panels .tabs-menu-outer { display: none; }
.asset-manager .tabs-body-outer { border: 0; background: #eee; border: 0; padding: 0; }
.asset-manager .tabs-body-outer .category-tree-outer a { color: #444; }
/* adv accordion */
/* header tabs */
.advanced-accordion { margin: 0 0 1px; }
.advanced-accordion .panel-header { background: #39addd; overflow: Hidden; padding: .8em; }
.advanced-accordion .panel-header ul { list-style-type: none; padding: 0; margin: 0; }
.advanced-accordion .panel-header li { display: block; color: #fff; padding: 0; width: auto; text-transform: uppercase; }
.advanced-accordion .panel-header ul.tab-list li.expander { float: right; }
.advanced-accordion .panel-header button { border-width: 0; height: 20px; width: 20px; cursor: pointer; }
.advanced-accordion .panel-header ul.tab-list li.expander button { float: right; background: url('/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/accordion-closed.png') no-repeat center; }
.advanced-accordion .panel-header ul.tab-list li.expanded button { background-image: url('/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/accordion-open.png'); }
.advanced-accordion .panel-header .button-text { display: none; }
/* body of search */
.advanced-accordion .panel-body { padding: 1em; }
/* checklist items - emulate generic form styling */
.advanced-accordion ul { list-style: none; padding: 0 0; }
.advanced-accordion ul li, .advanced-accordion div.checkbox, .asset-manager-multiple-category-checkbox { display: block; float: left; width: 100%; }
.advanced-accordion ul li input, .advanced-accordion .checklist-items li label, .advanced-accordion div.checkbox input, .advanced-accordion div.checkbox label, .asset-manager-multiple-category-checkbox input, .asset-manager-multiple-category-checkbox label { float: left; padding: 0; }
.advanced-accordion ul li input, .advanced-accordion div.checkbox input, .asset-manager-multiple-category-checkbox input { height: 1em; }
/* Datepicker - needs to fit onto a narrower row - with a wider page this may not be necessary */
.advanced-accordion .answer input.hasDatepicker { max-width: 75%; }
/* introduce some white space */
.advanced-accordion .category-tree { margin: 0 0 1em; }
/* overwrite some strange inline values on asset browser rh col tables */
.category-tree-outer td { white-space: normal !important; }

.filter-outer { background: #f4f4f4; padding: 1em; }
.filter-outer a.remove-filter { color: #fff; margin: 0 1em; padding: 0.5em 1em; background: #39addd; display: inline-block; }

/* --------------------------------- 
    BLOG
 --------------------------------- */
/* New post button - inherit default site button colour */
#-ux-content .blogs input[value="New Post"] { background-image: url('/EasySiteWeb/EasySite/StyleData/starter_master_7/Images/modules/add-post.png'); background-repeat: no-repeat; background-position: 1em .5em; padding-left: 45px; }
/* Blog Body */
.blogs .vignette { padding: 0 1em 0 0; }
.blogs .oBlogTitle { margin: 0 0 .55em; }
/* why is this even a link? */
.blogs .oBlogTitleLink { text-decoration: none; }

.blogs .oBlogPostedBy a { color: #48b3f1; text-decoration: none; }
.blogs .oBlogPost { width: 90%; padding: 4% 0; }
/* Navigation */
.blogs .oBlogNavigation ul { list-style-type: none; }
.blogs .oBlogNavigation a { text-decoration: none; color: #444; font-size: 0.9em; }
.blogs .oBlogNavigation h2 { font-weight: 300; }
.blogs .oBlogNavigation ul.oBlogNavigationList { background: #eee; padding: 3% 0 3% 18%; }

/* --------------------------------- 
    ALERT BAR
 --------------------------------- */
 
 .inalrt { background: #940000; top: 0; padding: 15px; }
 .inalrtinner { max-width: 1220px; margin: 0 auto; color: #fff; background: url('/EasySiteWeb/EasySite/StyleData/BOP19-master/Images/ico-warning.png') center left no-repeat; padding-left: 50px; }

 /*Page properties*/
.object-properties.style-alpha { padding: 5px 0 25px; }
.object-properties.style-alpha .datetime { font-size: 1.2em; }