
/* desktop - smaller than 1299
largely for the home page where promo extends beyond 1260 */
@media only screen and (max-width: 1299px) 
{	
#sx-Top .style-element-inner { width: 100%; }
/* promotion */
.lister-carousel.lister-alpha { width: 100%; }
.lister-carousel.lister-alpha .pagination-outer { width: 100%; }
.lister-carousel.lister-alpha .wrapper ul li { width: auto; max-width: 900px; }
.lister-carousel.lister-alpha .article-asset { min-width: 900px; width: 100%; }
.lister-carousel.lister-alpha .article-asset img { width: 100% !important; }

}

/* desktop - smaller than 1259 */
@media only screen and (max-width: 1259px) 
{
/* top nav */	
#sx-Top .style-element-body { padding: 0 10px; }
#sx-Top a.title span { padding: 20px 18px; }
#sx-Top .panel a.title:hover span { padding-bottom: 9px; }
/* tab panels */
.tabbed-zone-delta .tabs-menu-outer, .tabbed-zone-delta .tabs-body-inner { width: 100%; }  
.tabbed-zone-delta .tabbed-zone-inner { margin: 0 10px; }
.tabbed-zone-delta .tabs-body-inner { width: auto; margin: 0 0; max-width: 100%; }
.tabbed-zone-epsilon .tabs-menu-outer, .tabbed-zone-epsilon .tabs-body-inner { width: 100%; }  
.tabbed-zone-epsilon .tabbed-zone-inner { margin: 0 10px; }
.tabbed-zone-epsilon .tabs-body-outer { width: auto; margin: 0 0; }

/* Asset Resizing - matt's fix */
body .ClientAreaContainer div.asset-width, body .ClientAreaContainer div.asset-inline, body .ClientAreaContainer div.asset > div, body .ClientAreaContainer div.asset img { height: auto !important; width: auto !important; max-width: 100% !important; }
/* iframe */
iframe { width: 100% !important; }
.video iframe { height: auto !important; }

/* cookie consent */
body .cookie-optin .app-i { width: 100%; }
body .cookie-usage .app-i { width: 100%; }
body .cookie-usage .app-i .contenteditor { padding: 10px; }

/* panels */  
.style-alpha .contenteditor h2 { margin: 10px 10px 10px; font-size: 1.4em; }
/* Incidents plugin - space between the columns */
.tabbed-zone-delta .incidents .col-beta .incidents-list { margin-left: 10px; } 

/* footer nav */  
/* split into two rows
#sx-Foot .style-element-inner { margin: 0 20px; }
#sx-Foot ul.ddl { margin: 0 30px 0 0; }
#sx-Foot .panel { width: 25%; min-height: 300px; margin-bottom: 30px; }
#sx-Top a.title span { padding: 20px 5px; } */
/* fold column two into two columns */
#sx-Foot .beta div.ddl li { width: 48%; margin-right: 2%; clear: none; }

/*  page lister beta with large image */
.item-image { width: 30%; }
.item-image img { width: 100% !important; height: auto !important; }
.style-beta .oPageListerShowImages .item-body-outer { padding-left: 40%; }

/* page lister xi */
.lister.style-xi .item-image { width: auto; }

/* panel gamma - twitter feed: squeeze h2 size and margins */
.style-gamma .icon { margin: 0 14px; }
.style-epsilon  .hdi h2 { font-size: 1.6em; }

/* panel theta - reduce margin */
.style-theta .pel-o { margin-right: 40px; }

/* STYLE PSI IS USED TO SHOW CONTENT ONLY BETWEEN 1260 - 600 PX */
.style-psi { display: block; }

/* STYLE OMEGA IS USED PURELY TO HIDE CONTENT @ < 1260PX */
.style-omega { display: none; }

/* we are treating large images as the norm; so they need to begin scaling down as soon as the page begins to shrink */
.asset-width, .asset-width img { max-width: 100% !important; height: auto !important; }
/* this is for streaming media assets */
.asset > div:first-child { width: 100% !important; }
  
/* promotion beta */
.lister-carousel.lister-beta { width: 520px; }
.lister-carousel.lister-beta .body-outer { height: 200px; }
.lister-carousel.lister-beta .wrapper { height: 200px; }
.lister-carousel.lister-beta .wrapper ul li { width: 520px; min-height: 200px; }  
.lister-carousel.lister-beta .article-content { width: 60%; margin-left: 10px; }
.lister-carousel.lister-beta .article-link { width: 30%; margin-top: 120px; }

/* reduce font size */
.columns-delta .column-inner h3 { font-size: 1.1em; }

/* quick, dirty test on resizing incidents plugin
.incidents .col-alpha > div:first-child { width: 100% !important; } */
/* how it should work, once the css class is in place */
.incidents .map { width: 100% !important; }
/* so that the link floats beside the image without clearing */
.incidents table tr > td:first-child a { width: 76%; }

/* the home page promo/tabs
.tabbed-zone-epsilon .tabs-body-outer { background-position: center top; }
.contenteditor .promoTitle { font-size: 2.8em !important; }
.contenteditor .promoSub { width: 70% !important; }
  
.tabbed-zone-epsilon .contenteditor .hugeText { font-size: 3.6em; display: inline; float: none;  }
.tabbed-zone-epsilon .contenteditor .bigText { display: inline; float: none; margin: 30px 0 10px 6px; line-height: 1em; width: auto; }
.tabbed-zone-epsilon .contenteditor p {  width: 100%; } */

/* hp promotion */
.lister-carousel.lister-gamma .article-asset img { width: 100% !important; height: auto !important; }

}

/* mobile - tablet landscape */
@media only screen and (max-width: 1060px) 
{	

/* the home page promo/tabs
.tabbed-zone-epsilon .tabs-body-inner { font-size: 1em; }
.contenteditor .promoTitle { font-size: 2.4em !important; }
.tabbed-zone-epsilon .contenteditor .hugeText { font-size: 1.6em; font-family: "HelveticaNeueW01-75Bold", Helvetica, Arial, Verdana, Sans-Serif; }
.tabbed-zone-epsilon .contenteditor .bigText {  font-size: 1.6em; }
.tabbed-zone-epsilon .contenteditor p { line-height: 1.2em; font-size: 1.2em; }  */

/* Incidents lightbox */
.blockMsg { top: 20% !important; left: 25% !important; width: 50% !important; }

/* hp promotion */
.lister-carousel.lister-gamma .body-outer { height: 200px; overflow: hidden; }

}

/* mobile - tablet */
@media only screen and (max-width: 900px) 
{	
/* three per row */
#sx-Foot .panel { width: 49%;  min-height: 300px; }
/* incidents plugin, home page, restructure page split */
.tabbed-zone-delta .incidents .col-alpha { width: 50%; }
.tabbed-zone-delta .incidents .col-beta { width: 50%; } 

/* resize h2 text. panel alpha */  
.style-alpha .contenteditor h2 { margin: 10px 0 10px 10px; font-size: 1.2em; }
.style-alpha .hugeText	{ margin: 0 5px 0 0; }

/* pagelister beta reduce padding */
.style-beta .item-body-outer { padding-right: 10px; }
.style-beta.show-images .item-image { padding-right: 10px; }
  
/* columns: your local area */
.columns-epsilon .columns-delta .column-outer { width: 33% !important; }

/* panel delta / epsilon. reduce h2 size */
.style-delta .hdi h2 { font-size: 1.4em; }
.style-epsilon .hdi h2 { font-size: 1.4em; }
.style-delta li.oBoxItem { background-position: 0 10px; padding: 8px 0 10px 20px; }

/* panel zeta, reduce padding */  
.style-zeta .bdo { padding: 20px 20px 0 20px; }

/* panel theta - three to a row; reduce margin */
.style-theta { width: 33%; }
.style-theta .pel-o { margin-right: 20px; }

/* promotion beta */
.lister-carousel.lister-beta { width: 350px; }
.lister-carousel.lister-beta .body-outer { height: 240px; }
.lister-carousel.lister-beta .wrapper { height: 240px; }
.lister-carousel.lister-beta .wrapper ul li { width: 350px; min-height: 240px; }
.lister-carousel.lister-beta .article-content { width: 90%; }
.lister-carousel.lister-beta .article-link { width: 80%; clear: both; position: relative; float: right; margin: 0 20px 0 0; }

/* so that the link floats beside the image without clearing */
.incidents table tr > td:first-child a { width: 66%; }

/* Incidents lightbox */
.blockMsg { top: 15% !important; left: 20% !important; width: 60% !important; }
.blockMsg .incident-summary div.field, .blockMsg .incident-summary div.field-0 { margin: 0 10px 1em 10px; }

/* hp promotion */
.lister-carousel.lister-gamma .body-outer { height: 260px; overflow: hidden; }

/* redraw directory table for RWD 
*** data-th attribute is added to tables via javascript - but if upgrade to 8 or a later version of 7 then it is added to directory tables automatically *** */
.oDirectoryBuilder table.oDataGrid { margin: 0 auto; border-collapse: collapse; width: 100%; }
.oDirectoryBuilder table.oDataGrid thead { display: none; }
.oDirectoryBuilder table.oDataGrid tbody td { display: block; padding: 1em; border-bottom: 1px solid #ebebeb; }
.oDirectoryBuilder table.oDataGrid tbody tr td:nth-child(1) { background: #353535; color: #fff; }      
.oDirectoryBuilder table.oDataGrid tbody tr td:nth-child(1) a:link, .oDirectoryBuilder table.oDataGrid tbody tr td:nth-child(1) a:visited { color: #fff; text-decoration: underline; }
.oDirectoryBuilder table.oDataGrid tbody td:before { content: attr(data-th); font-weight: bold; display: block; width: 100%; }

}

/* mobile - tablet */
@media only screen and (max-width: 700px) 
{	
	
/* show mobile nav */
#mob-nav #section-link { display: block; color: #000; font-size: 2.2em; width: 200px; margin: 20px auto 10px auto; padding: 6px; font-family: 'HelveticaNeueW01-Thin', Helvetica, Arial, Verdana, Sans-Serif; background: url("/EasySiteWeb/EasySite/StyleData/KentFire_master/Images/mob-nav.gif") no-repeat right center; }
#sx-Top { display: none; }
#mob-nav.show #sx-Top { display: block; }
/* restyle nav */
#sx-Top .style-element-inner { width: auto; }
#sx-Top .style-element-body { padding: 0; }
#sx-Top li { border-width: 0; text-align: center; border-bottom: 1px solid #c5c5c5; }
#sx-Top .alpha li { border-top: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; }
#sx-Top .panel {  float: none; }
/* titles */
#sx-Top a.title:link, #sx-Top a.title:visited { color: #353535; font-family: "HelveticaNeueW01-Thin", Helvetica, Arial, Verdana, Sans-Serif; font-size: 1.8em; margin-left: 0; }
#sx-Top a.title span { display: block; padding: 5px 10px; }
/* selected */
#sx-Top .selected a.title:link, #sx-Top .selected a.title:visited { font-family: "HelveticaNeueW01-55Roma", Helvetica, Arial, Verdana, Sans-Serif; }

#sx-Top .panel a.title:hover span { border-bottom: 0; padding-bottom: 5px; }
#sx-Top .selected a.title:link span, #sx-Top .selected a.title:visited span { border-bottom: 0; }


/* hide dropdown links */
#sx-Top div.ddl { display: none; }

/* Red Button inside panel zeta (speech bubble) has less room because columns don't expand */
.style-zeta .contenteditor .redButton { font-size: 1.1em !important; padding: 6px 10px !important; text-align: center; }
  
/* re-stack nested columns */
.columns-alpha .columns-delta .column-outer { width: 50% !important; clear: none !important; }
.columns-alpha .columns-delta .column-outer h3 { min-height: 40px; }
.columns-alpha .columns-delta .contenteditor .topPad	{	margin-top: 0; }

/* promotion */
.lister-carousel.lister-alpha { width: 100%; }
.lister-carousel.lister-alpha .wrapper ul li { width: 100%; }
.lister-carousel.lister-alpha .article-asset { min-width: 0; }
.lister-carousel.lister-alpha .article-asset img { width: 100%; }
.lister-carousel.lister-alpha .article-content { width: 50%; }
.lister-carousel.lister-alpha .pagination-outer { width: 100%; }

/* pagelister beta reduce padding */
.style-beta .item-body-outer { padding-right: 0; }
.item-image { width: 25%; }
.style-beta .oPageListerShowImages .item-body-outer { padding-left: 30%; }

/* reduce tab padding to ensure they don't wrap onto two lines */
.tabbed-zone-delta .tabs-menu-outer ul li a:link, .tabbed-zone-delta .tabs-menu-outer ul li a:visited { padding: 12px 20px; }
.tabbed-zone-epsilon { margin-bottom: 0; }

/* the home page promo/tabs */
.tabbed-zone-epsilon .contenteditor .promoTitle a:link, .tabbed-zone-epsilon .contenteditor .promoTitle a:visited { display: block; padding: 5px 0; border-right: 10px solid  #625e4e; border-left: 10px solid #625e4e; }
.contenteditor .promoSub { padding-left: 10px !important; }

/* Incidents lightbox */
.blockMsg { top: 10% !important; left: 10% !important; width: 80% !important; }

/* hp promotion */
.lister-carousel.lister-gamma .body-outer { height: 200px; overflow: hidden; }

}

/* mobile - landscape */
@media only screen and (max-width: 599px) 
{	
	
/* footer splits into two rows
#sx-Foot .panel { width: 49%; }
#sx-Foot li a.title { font-size: 1.6em; }
#sx-Foot ul.ddl { margin: 0 10px 0 0; } */
/* hide footer drop downs */
#sx-Foot div.ddl { display: none; }
#sx-Foot .panel { width: 49%; min-height: 30px; margin-bottom: 10px; }

/* tab panels
.tabbed-zone-delta .tabs-menu-outer { }
.tabbed-zone-delta .tabs-menu-outer ul li { float: none; width: auto; text-align: left; } */
.tabbed-zone-delta .tabs-menu-outer ul li a:link, .tabbed-zone-delta .tabs-menu-outer ul li a:visited { border-right-width: 0; border-bottom-width: 1px; margin-right: 0; padding: 5px 10px; font-size: 1em; }
/* .tabbed-zone-delta .tabs-menu-outer ul li .tab-outer { display: block; }
.tabbed-zone-delta .tabs-body-outer { }
.tabbed-zone-delta .tabs-body-inner { width: auto; } */

/* incidents list */
.tabbed-zone-delta .incidents .col-alpha { width: 100%; float: none; clear: both; }
.tabbed-zone-delta .incidents .col-beta { width: 100%; float: none; clear: both; margin-top: 30px; } 

/* put space around panel alpha */
.style-alpha { margin: 20px 40px 0; }
/* resize h2 text. panel alpha */  
.style-alpha .contenteditor h2 { font-size: 1.7em; }
.style-alpha .hugeText	{ margin: 0 10px 0 0; }

/* retain column split */
.style-zeta .column-outer { width: 50% !important; float: left !important; clear: none !important; }
.style-zeta .columns-alpha .column-inner { margin-left: 10px; }

/* panel theta - two to a row */
.style-theta { width: 50%; }

/* STYLE PSI IS USED TO SHOW CONTENT ONLY BETWEEN 1260 - 600 PX */
.style-psi { display: none; }

/* promotion beta */
.lister-carousel.lister-beta { width: 420px; }
.lister-carousel.lister-beta .wrapper ul li { width: 420px; }

/* re-stack nested columns */
.columns-alpha .columns-delta .column-outer { width: 60% !important; margin: auto; }
.columns-alpha .columns-delta .column-outer h3 { min-height: 20px; }

/* the home page promo/tabs
.tabbed-zone-epsilon .tabs-body-outer { background: #f3bd03; } */
/* retain column split
.tabbed-zone-epsilon .column-outer { width: 45% !important; float: left !important; clear: none !important; margin-right: 5%; } */

/* hide content editors for desktop. show them only for mobile */
.not-edit-mode .tabbed-zone-epsilon .contenteditor { display: block; }
.not-edit-mode .tabbed-zone-epsilon .asset-inline { display: none; }

/* incidents */
.incidents .tagline { width: auto; float: none; padding-right: 20px; }
.incidents .more-incidents { width: 100%; float: none; clear: both; }
.incidents .button a { font-size: 1.2em; margin-top: 0; }

/* ensure twitter feed does not become crazy tall */
.tweets iframe { height: 200px !important; }

/* hp promotion */
.lister-carousel.lister-gamma .page-element-inner { padding: 15px; }
.lister-carousel.lister-gamma .body-outer { height: 175px; }

/* panel lambda */
.panel.style-lambda .panel-body { padding: 15px; }

}

/* mobile - portrait */
@media only screen and (max-width: 400px) 
{	
	
/* tab panels
.tabbed-zone-delta .tabs-menu-outer { width: 33%; }
.tabbed-zone-delta .tabs-body-outer { width: 67%; } */
/* Incident plugin. reduce text size */
.incidents .tagline h1, .incidents .tagline h2 { font-size: 1.3em; }
  
/* columns: your local area */
.columns-epsilon .columns-delta .column-outer { width: 50% !important; }

/* reduce space around panel alpha */
.style-alpha { margin: 20px 10px 0; }
/* resize h2 text. panel alpha */  
.style-alpha .contenteditor h2 { font-size: 1.2em; }
.style-alpha .hugeText	{ margin: 0 10px 0 0; }

/* panel theta - one to a row */
.style-theta { width: 100%; }

/* promotion beta */
.lister-carousel.lister-beta { width: 280px; }
.lister-carousel.lister-beta .body-outer { height: 280px; }
.lister-carousel.lister-beta .wrapper { height: 280px; }
.lister-carousel.lister-beta .wrapper ul li { width: 280px; min-height: 280px; }

/* re-stack nested columns */
.columns-alpha .columns-delta .column-outer { width: 90% !important; }

/* the home page promo/tabs */
/* split columns  */
.tabbed-zone-epsilon .column-outer { width: 100% !important; float: none !important; clear: none !important; margin-right: 0; }
.tabbed-zone-epsilon .column-beta .column-inner { margin: 0 10px; }
.contenteditor .promoSub { width: 90% !important; }

/* resize video for iphone */
body .ClientAreaContainer div.asset-width, body .ClientAreaContainer div.asset > div , body .ClientAreaContainer div.asset img { max-width: 260px !important; height: auto !important; }

/* page lister xi */
.lister.style-xi li.oBoxItem .item-image { display: none; }
.lister.style-xi .item-body-outer { width: 100%; margin: 0 0 10px 0; clear: both; }

/* footer */
#sx-Foot .panel { width: 100%; }

}