﻿/*-------------------------------------------------------
 PAGE PANEL ALPHA
---------------------------------------------------------*/
.element-panel-alpha-outer { clear: both; margin-bottom: 1em; position: relative; border: 3px solid #0072c6; display: inline-block; }
.element-panel-alpha-outer .element-panel-alpha-header-outer h2 { padding: 10px 10px 0px 10px; }
.element-panel-alpha-outer .asset-inline { margin-bottom: 0px; }
.element-panel-alpha-outer .asset-inline .clear { width: 100% !important; }
.element-panel-alpha-outer .asset-inline img { width: 100% !important; height: auto !important; }

/*-------------------------------------------------------
 PAGE PANEL BETA (HIDDEN)
---------------------------------------------------------*/
.element-panel-beta-outer { display: none; }


/*-------------------------------------------------------
 TAB PANELS ALPHA
---------------------------------------------------------
.tabbed-zone-outer { clear: both; margin-bottom: 1em; }
.tabs-menu-outer ul, .tabs-menu-outer ul li { list-style-type: none; padding: 0; margin: 0;  }
.tabs-menu-outer ul li, .tabs-menu-outer ul li a, .tabs-menu-outer ul li span { display: block; }
.tabs-menu-outer ul li { float: left; width: 20%; text-align: center; }
.tabs-menu-outer ul li a:link, .tabs-menu-outer ul li a:visited { text-decoration: none; border: 1px solid #ccc; border-bottom: 0; margin-right: 5px; padding: 5px; }
.tabs-menu-outer ul li.tab-selected a:link, .tabs-menu-outer ul li.tab-selected a:visited { border: 1px solid #333; border-bottom: 0; background: #f7f7f7; }
.tabs-body-outer { clear: both; width: auto; border: 1px solid #ccc; padding: 10px;  }*/

/*-------------------------------------------------------
 ACCORDION TAB PANELS ALPHA
---------------------------------------------------------*/
/* overwrite ui.css */
.oAccordionPanels.tabbed-zone-alpha .ui-icon { width: auto; height: auto; background-image: none; }
.oAccordionPanels.tabbed-zone-alpha .ui-state-default, .oAccordionPanels.tabbed-zone-alpha .ui-widget-content .ui-state-default { background: none; }

.oAccordionPanels.tabbed-zone-alpha { color: #000; border: 1px solid #dbdbdb; }
.oAccordionPanels.tabbed-zone-alpha .tabbed-zone-inner { width: 100%; overflow: hidden; }
.oAccordionPanels.tabbed-zone-alpha .tab-header-outer { padding: 5px 10px; border: 1px solid #dbdbdb; background: #eee; border-radius: 3px 3px 0 0; clear: both; display: block; overflow: hidden; }
.oAccordionPanels.tabbed-zone-alpha .tab-header-inner ul { padding: 0; margin: 0; }
.oAccordionPanels.tabbed-zone-alpha .tab-header-inner ul li { display: block; list-style-type: none; padding: 0; margin: 0; clear: none; float: left; }
.oAccordionPanels.tabbed-zone-alpha .tab-header-inner ul li.header { padding: 0; margin: 0; background: #eee; width: 90%; }
.oAccordionPanels.tabbed-zone-alpha .tab-header-inner ul li.expander { float: right; padding: 0 0 0; width: 8%; text-indent: -9991em; background: url("/EasySiteWeb/EasySite/StyleData/starter_master/Images/tabs-expand-arrow.gif") no-repeat right center; }
.oAccordionPanels.tabbed-zone-alpha .tab-header-inner ul li.expanded { background: none; }
.oAccordionPanels.tabbed-zone-alpha .expanded .tab-header-inner ul li.expander { background: url("/EasySiteWeb/EasySite/StyleData/starter_master/Images/tabs-collapse-arrow.gif") no-repeat right center; }
.oAccordionPanels.tabbed-zone-alpha ul li.header h2 { font-size: 1em !important; font-weight: bold; padding: 0; margin: 9px 8px 10px; }
.oAccordionPanels.tabbed-zone-alpha ul li.header h2 a.panel-event:link, .oAccordionPanels.tabbed-zone-alpha ul li.header h2 a.panel-event:visited { padding: 0; margin: 0; color: #00A0DE; font-weight: normal; }
.oAccordionPanels.tabbed-zone-alpha .tab-body-outer { padding: 15px; height: auto !important; border-width: 0; clear: both; }
.oAccordionPanels.tabbed-zone-alpha .tab-body-inner .justify-left { padding: 5px 10px; margin: 0; }

.oTabbedPanels { margin-bottom: 1em; }
.oTabbedPanels .tabs-menu-inner { padding-left: 15px; }
.oTabbedPanels .tabs-menu-inner ul { padding: 0px; margin: 0px; list-style-type: none; }
.oTabbedPanels .tabs-menu-inner ul li { padding: 0px; margin: 0px; list-style-type: none; float: left; }
.oTabbedPanels .tabs-menu-inner ul li a { text-decoration: none; }
.oTabbedPanels .tabs-menu-inner ul li .tab-outer { background: url("/EasySiteWeb/EasySite/StyleData/sdccg_2019_web_master/Images/tabs-l.jpg") no-repeat left bottom; display: block; }
.oTabbedPanels .tabs-menu-inner ul li .tab-inner { background: url("/EasySiteWeb/EasySite/StyleData/sdccg_2019_web_master/Images/tabs-r.jpg") no-repeat right bottom; color: #FFF; display: block; padding: 8px 20px; font-size: 0.95em; }
.oTabbedPanels .tabs-menu-inner ul li.tab-selected a { text-decoration: underline; color: #FFF; }
.oTabbedPanels .tabs-menu-inner ul li.tab-selected .tab-outer { background: url("/EasySiteWeb/EasySite/StyleData/sdccg_2019_web_master/Images/tabs-selected-l.jpg") no-repeat left bottom; font-weight: bold; }
.oTabbedPanels .tabs-menu-inner ul li.tab-selected .tab-inner { background: url("/EasySiteWeb/EasySite/StyleData/sdccg_2019_web_master/Images/tabs-selected-r.jpg") no-repeat right bottom; }
.oTabbedPanels .tabs-body-outer { background: #16499a; border-radius: 15px; padding: 10px; }
.oTabbedPanels .tabs-body-inner { background: #FFF; border-radius: 15px; padding: 15px; width: auto; }

.oTabbedPanels.tabbed-zone-epsilon .tabs-body-inner{ background: transparent; }



/* panel delta - light blue box with icon */
.panel-delta { background: #0072c5; border-radius: 15px; margin-bottom: 1em; position: relative; }
.panel-delta h2 { color: #FFF; background: #00356a; border-radius: 10px; font-size: 1.3em; font-weight: normal; margin: 10px; padding: 7px 10px; }
.panel-delta h2 a:link, .panel-delta h2 a:visited { color: #FFF; text-decoration: none; }
.panel-delta h2 a:hover, .panel-delta h2 a:active { text-decoration: underline; }
.panel-delta .panel-icon-outer { float: right; margin-left: 5px; }
.panel-delta .panel-content-inner { color: #FFF; padding: 0px 40px 20px 20px; font-size: .9em; }
.panel-delta .contenteditor { overflow: visible; margin: 0px; }
.panel-delta .contenteditor a:link, .panel-delta .contenteditor a:visited { color: #FFF; text-decoration: none; }

/* panel epsilon - dark blue box with icon */
.panel-epsilon { background: #16499a; border-radius: 15px; margin-bottom: 1.5em; position: relative; }
.panel-epsilon h2 { color: #FFF; background: #00356a; border-radius: 10px; font-size: 1.4em; font-weight: normal; margin: 10px; padding: 7px 10px; }
.panel-epsilon .panel-icon-outer { float: right; position: relative; right: -18px; top: -8px; }
.panel-epsilon .page-element-body { overflow: visible; padding: 1px; }
.panel-epsilon .panel-content-inner { color: #FFF; padding: 0px 10px 15px 10px; font-size: .9em; }

/* panel zeta - #f5f5f5 box with icon */
.panel-zeta { background: #f5f5f5; border-radius: 15px; margin-top: 2em; margin-bottom: 1em; position: relative; }
.panel-zeta h2 { color: #FFF; background: #00356a; border-radius: 10px; font-size: 1.4em; font-weight: normal; margin: 10px; padding: 7px 10px; }
.panel-zeta .panel-icon-outer { position: absolute; right: -5px; top: -5px; }
.panel-zeta .panel-content-inner { color: #2A2A2A; padding: 0px 40px 20px 20px; font-size: .9em; }

/* panel eta */
.panel-eta { background: #0072c6; border-radius: 15px; margin-bottom: 1em; position: relative; }
.panel-eta h2 { color: #FFF; background: #00356a; border-radius: 10px; font-size: 1.4em; font-weight: normal; margin: 10px; padding: 7px 10px; }
.panel-eta .panel-content-inner { color: #FFF; padding: 0px 40px 20px 20px; font-size: .9em; }


/* Poll */
.oPollingContainerOuter { background: #16499a; border-radius: 15px; margin-top: 2em; margin-bottom: 1em; position: relative; }
.oPollingContainerOuter .oPollingHeaderInner { overflow: hidden; }
.oPollingContainerOuter h2 { color: #FFF; background: #00356a; border-radius: 10px; font-size: 1.4em; font-weight: normal; margin: 10px; padding: 7px 10px; }
.oPollingContainerOuter .panel-icon-outer { position: absolute; right: -5px; top: -5px; }
.oPollingContainerOuter .panel-content-inner { color: #FFF; padding: 0px 40px 20px 20px; font-size: .9em; }
.oPollingContainerOuter .oPollingBodyInner { color: #FFF; padding: 10px; font-size: .9em; }
.oPollingContainerOuter.oPollingResultsView .oPollingBodyInner { padding: 20px; }
.oPollingContainerOuter .oDataElementContainer { padding: 10px; }
.oPollingContainerOuter .oDataFormQuestion { color: #FFF; float: none; width: auto; text-align: left; padding-bottom: 20px; }
.oPollingContainerOuter.oPollingResultsView .oDataFormQuestion { padding-bottom: 3px; }
.oPollingContainerOuter.oPollingResultsView .oPollingDescription { font-weight: bold; }
.oPollingContainerOuter.oPollingResultsView .oPollingVotes { margin-bottom: 10px; }
.oPollingContainerOuter .oDataFormAnswer { float: none; width: auto; text-align: left; }
.oPollingContainerOuter .oDataFormLabel { padding: 0px; margin: 0px; font-weight: bold; }
.oPollingContainerOuter ul.DataFormInputCheckbox, .oPollingContainerOuter ul.DataFormInputCheckbox li { padding: 0px; margin: 0px; list-style-type: none; }
.oPollingContainerOuter ul.DataFormInputCheckbox li { margin: 5px 0px; display: block; }
.oPollingContainerOuter ul.DataFormInputCheckbox li input { float: left; margin-right: 10px; }
.oPollingContainerOuter .oDataFormButtonContainer { background: #00356a; text-align: center; margin: 0px; padding: 10px; }
.oPollingContainerOuter.oPollingResultsView .oDataFormButtonContainer { display: none; }
.oPollingContainerOuter .oDataFormButtonContainer input { background: #fcfcfc; text-align: center; margin: 0px; padding: 5px 20px; border-radius: 3px; border: 0px; text-transform: uppercase; font-size: 1.1em; font-weight: bold; color: #0072c6; cursor: pointer; margin: 0px 5px; }
.oPollingContainerOuter .oDataFormAnswerText { float: none; }
.oPollingContainerOuter .oPollingChartBar { background: #58b920; border-radius: 0px 3px 3px 0px; display: block; min-width: 2px; }



@media only screen and (max-width: 980px) {
	.panel-delta h2 { /*white-space: nowrap;*/ }
	.panel-delta .panel-icon-outer { width: 30%; }
	.panel-delta .panel-icon-outer img { width: 100% !important; height: auto !important; }
}

@media only screen and (max-width: 900px) {
	.panel-epsilon .panel-icon-outer, .panel-zeta .panel-icon-outer { right: -4%; width: 20%; }
	.panel-epsilon .panel-icon-outer img, .panel-zeta .panel-icon-outer img { width: 100% !important; height: auto !important; }
}

@media only screen and (max-width: 790px) {
	.panel-delta h2 { font-size: .9em; font-weight: bold; }
	.oTabbedPanels .tabs-menu-inner ul li .tab-inner { padding: 8px 15px; font-size: .8em; }
	.panel-epsilon h2, .panel-zeta h2 { font-size: 1.2em; /*white-space: nowrap;*/ font-weight: bold; }
}

@media only screen and (max-width: 700px) {
	.oTabbedPanels .tabs-menu-inner ul li .tab-inner { font-size: .8em; }
	.panel-epsilon h2, .panel-zeta h2 { font-size: 1.1em; white-space: nowrap; }
}

@media only screen and (max-width: 640px) {
	.panel-epsilon .panel-icon-outer, .panel-zeta .panel-icon-outer { right: -17px; top: -8px; width: auto; }
	.panel-epsilon .panel-icon-outer img, .panel-zeta .panel-icon-outer img { width: 100% !important; height: auto !important; }
	.panel-delta .panel-icon-outer { width: auto; }

	.oTabbedPanels.tabbed-zone-epsilon .tabs-menu-outer { float: left; width: 84px; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-body-outer { margin-left: 84px; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-body-inner { background: transparent; clear: none; min-height: 170px; height: auto !important; height: 170px; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-menu-inner { padding: 10px 0px; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-menu-inner ul li { float: none; margin: 2px 0px; display: block; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-menu-inner ul li .tab-outer { background: #00356a; border-radius: 5px 0px 0px 5px; display: block; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-menu-inner ul li .tab-inner { background: transparent; padding: 8px 10px; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-menu-inner ul li.tab-selected .tab-outer { background: #16499a; }
	.oTabbedPanels.tabbed-zone-epsilon .tabs-menu-inner ul li.tab-selected .tab-inner { background: transparent; } 

	.panel-epsilon, .panel-zeta { max-width: 100%; }
}

@media only screen and (max-width: 320px) {
	.panel-epsilon, .panel-zeta { margin-left: 0px; max-width: 100%; }
}