@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.fonts.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.generics.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.nav.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.forms.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.grists.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.panels.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.promotion.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/lib.apps.css");
@import url("/EasySiteWeb/EasySite/StyleData/KentFire_master/CSS/responsiveModules.css");

@media screen, all {

/*-------------------------------------------------------
 LAYOUT
---------------------------------------------------------*/

/* whole page container */
#sx-wrapper { }
.sx-wo { }
.sx-wi { width: 1300px; margin: auto; }

/* masthead */
#sx-masthead-wrapper { background: #fff; }
#sx-masthead { width: 1260px; margin: auto; }
.sx-mo {}
.sx-mi {}

/* help */
#sx-help, .sx-ho { display: block; padding: 0 0; float: right; clear: none; }
.sx-hi {}
map#snv-help {}
  
.social-o { display: block; width: auto; padding: 0 0; float: right; clear: none; } /*  width: 40%; */
.social-i { float: right; padding: 0 10px 0 0; }
.social-i li { display: inline; margin-right: 10px; }

/* avatar */
#sx-avatar { float: left; }

/* search */
#sx-search, .sx-so { width: 45%; float: right; clear: none; }
.sx-si {}

/* nav + content */
/* this will change for landing pages */
#sx-body { clear: both; margin: auto; width: 1260px; }
.sx-bdo { padding: 0 0; margin: auto; margin-top: 20px; }
.sx-bdi { margin: auto; padding: 0 0 20px 0; }

/* content */
#sx-content { float: right; width: 77.5%; }
.sx-co { padding: 0 20px; }
.sx-ci { background: #fff; box-shadow: 2px 2px 4px 1px rgba(0,0,0,0.2); margin: 4px 8px 8px 4px; width: auto; padding: 0 15px; }

/* generator */
#sx-generator {}

/* some generic classes */
/* used in footer */
.floatleft { float: left; clear: none; }
/* used in masthead */
.floatright { float: right; width: auto; clear: none; } /*  width: 65%; */
.floatright.mob-no-float { clear: right; }
/* hide at desktop */
.hide-desktop { display: none; }
/* hide at tablet */
.hide-tablet { display: block; }
/* hide at mobile */
.hide-mob { display: block; }

/*-------------------------------------------------------
 USABILITY
---------------------------------------------------------*/
/* accessibility links */
#sx-help { position: relative; float: right; margin: 15px 0 12px; }
#sx-help ul, #sx-help li { list-style-type: none; margin: 0; padding: 0 0; }
#sx-help li { float: left; display: block; padding: 0 0 0 6px; border-left: 1px solid #c3c3c3; margin: 0 0 4px; }
#sx-help ul > li:first-child { border-width: 0; }
#sx-help li.text-larger { padding: 0; }
#sx-help a:link, #sx-help a:visited { padding: 0 6px 0 0; color: #1f6fca; }

/* search box */
#sx-search { width: 280px; }
#sx-search { padding: 0; margin-bottom: 19px; }
#sx-search fieldset { border: 0; padding: 0; margin: 0; width: 100%; }
#sx-search fieldset legend, #sx-search fieldset .question { display: none; }
#sx-search fieldset .fields { float: left; width: 227px; border: 1px solid #c5c5c5; border-right-width: 0; height: 47px; }
#sx-search fieldset .answer { padding: 17px 9px 12px; }
#sx-search .textbox { border: 0; font-family: "HelveticaNeueW01-56It", Helvetica, Arial, Verdana, Sans-Serif; color: #a2a2a2; padding: 0; margin: 0; font-size: 1em; }
#sx-search fieldset .buttons { float: left; width: 52px; text-align: right; display: inline-block; float: right; margin: 0; background: #ffb81f; }
#sx-search .button { border: 0; height: 49px; width: 52px; padding: 0; margin: 0; line-height: 1em; background: transparent url("/EasySiteWeb/EasySite/StyleData/KentFire_master/Images/search-btn.png") no-repeat center; cursor: pointer; text-indent: -9999em; }
#sx-search .element { margin: 0; }

/*-------------------------------------------------------
 BREADCRUMB 
---------------------------------------------------------*/
#sx-bct { clear: both; padding: 30px 0 20px; }
#sx-bct .sep { font-size: .7em; padding: 0 9px; font-family: verdana, arial, sans-serif; font-weight: bold; }

/*-------------------------------------------------------
 FOOTER
---------------------------------------------------------*/
#sx-fo { width: 100%; padding: 0; padding: 36px 0 0; background: #fff; overflow: hidden; margin-top: 20px; }
.sx-fi { width: 1260px; padding: 0; margin: 0 auto; }
#sx-fo .floatleft { margin: 0 30px 40px 0; }
#sx-fo .connect { font-size: 3em; border-bottom: 1px solid #d8d8d8; overflow: hidden; margin: 0 0 50px; font-family: 'HelveticaNeueW01-Thin', Helvetica, Arial, Verdana, Sans-Serif; }
#sx-fo .connect ul { display: block; float: left; clear: none; }
#sx-fo .connect ul.hide-desktop { display: none; }
#sx-fo .connect li { display: inline; }
#sx-fo .flinks { font-size: .9em; }
#sx-fo .flinks img { float: left; clear: none; margin: 0 10px 10px 0; }
#sx-fo .flinks-i { overflow: hidden; margin-bottom: 50px; }
#sx-fo .copyright { float: left; margin: 26px 0 0 20px; }
#sx-fo .flinks-ii { float: left; margin: 26px 0 0 40px; clear: none; display: block; }
#sx-fo ul.links { }
#sx-fo ul.links li a:link, #sx-fo ul.links li a:visited { border-left: 1px solid #c3c3c3; padding: 0 8px; color: #1592d9; }
#sx-fo ul.links > li:first-child a { border-width: 0; padding-left: 0; }

/*-------------------------------------------------------
 COLUMNS
---------------------------------------------------------*/
.columns-outer .column-inner { margin-left: 25px; }
/* no margin on first column */
.columns-outer .column-alpha .column-inner { margin-left: 0; }
/* but allow for nested columns to behave consistently - although they are already inside a different column-alpha! */
.columns-outer .column-alpha .column-outer .column-inner { margin-left: 25px; }
.columns-outer .column-alpha .column-alpha .column-inner { margin-left: 0; }
/* to allow for margins on nested columns. no longer need this on recruitment page. not sure if it's needed elsewhere? If so, will have to overwrite with column delta styling.
.columns-outer .column-alpha .column-beta .column-inner { margin-left: 25px; } */

/* alpha will be the normal column style, with 25px divisions, and no unusual behaviour */
  
/* used on home page where there is no page wrapper with set width (so columns have to set the width) */
.columns-beta { width: 1260px; margin: 0 auto; }

/* wider gap between columns */
.columns-gamma .column-inner { margin-left: 60px; }

/* narrow gap between columns - this is used with nested columns and often for equal sized images. We are keeping padding on every column (not missing it off the first one), so that each column retains its equal size. And placing it on the right instead of left so that ragged edges (compared to other content) will be less apparent  */
.columns-delta .column-inner { margin-right: 10px; margin-left: 0; }

/* columns which expand to 100% at tablet portrait view */
.columns-epsilon .column-inner { }
/* local area page with small images on right */
.columns-epsilon .columns-delta .asset-inline .asset-width { margin-bottom: 0; }
.columns-epsilon .columns-delta .contenteditor .mobButton, .columns-epsilon .columns-delta .contenteditor .mobButton a:link, .columns-epsilon .columns-delta .contenteditor .mobButton a:visited { color: #bf1609; display: block; margin: 0 0 1em; text-align: center; font-family: "HelveticaNeueW01-65Medi", Helvetica, Arial, Verdana, Sans-Serif; }

/* columns zeta - new homepage style - right column needs to be first in rwd views so for desktop the columns are swapped around */
.columns-zeta .column-alpha { clear: none !important; float: right !important; }
.columns-zeta .column-beta { clear: none !important; }
.columns-zeta .column-alpha .column-inner { margin: 0 0 0 7px; }
.columns-zeta .column-beta .column-inner { margin: 0 7px 0 0; }
/* columns alpha within columns zeta - homepage */
.columns-zeta .columns-alpha .column-alpha { float: left !important; }
/* latest incidents column on homepage */
.columns-zeta .panel.style-kappa .columns-alpha { margin: 0 35px 10px; }
.columns-zeta .panel.style-kappa .columns-alpha .column-inner { margin: 0 !important; }
.columns-zeta .panel.style-kappa .columns-alpha .contenteditor { color: #000; font-size: 1.1em; }

}

/* mobile - tablet */
@media only screen and (max-width: 1259px) 
{
/* page wrappers */
.sx-wi { width: 100%; }
#sx-masthead { width: 100%; }
.sx-mo { padding: 0 10px; }
#sx-body { width: 100%; }
.sx-no { margin: 0 0 0 20px; }
.sx-fi { width: 100%; }
.flinks { padding: 0 10px; }
#sx-fo .copyright, #sx-fo .flinks-ii { margin-left: 10px; }
/* footer */
#sx-fo { padding-top: 20px; }
#sx-fo .connect { margin-left: 20px; }
#sx-Foot { margin: 0 20px 40px; }
/* columns on home page */
.columns-beta { width: 100%; }
.columns-beta .columns-inner { margin: 0 10px; }
/* reduce very large gap between columns */
.columns-gamma .column-inner { margin-left: 25px; }
/* reduce size of gap for this column style */
.columns-epsilon .column-inner { margin-left: 10px; }
/* override this for nested columns which have margin on right instead */
.columns-epsilon .columns-delta .column-inner { margin-left: 0; }

/* incidents plugin */
.incidents .search-keywords { width: 100%; }
	
}

/* mobile - tablet */
@media only screen and (max-width: 900px) 
{
#sx-content { width: 75%; }
#sx-nav { width: 25%; }

#sx-help li.hide-tablet { display: none; }
/* reduce page padding */
.sx-no { margin: 0 0 0 10px; }
.sx-co { padding: 0 10px; }

/* columns which expand to 100% at tablet portrait view */
.columns-epsilon .column-outer { width: 100% !important; }
/* but not nested columns! */
.columns-epsilon .columns-alpha .column-outer { width: 50% !important; }
/* columns zeta */
.columns-zeta .column-alpha { width: 100% !important; }
.columns-zeta .column-beta { width: 100% !important; }
.columns-zeta .column-alpha .column-inner { margin: 0; }
.columns-zeta .column-beta .column-inner { margin: 0; }
.columns-zeta .columns-alpha .column-alpha { width: 50% !important; }
.columns-zeta .columns-alpha .column-beta { width: 50% !important; }
.columns-zeta .columns-alpha .justify-centre .asset-width { text-align: center; }
}

/* mobile - tablet */
@media only screen and (max-width: 820px) 
{
.mob-no-float { float: right; clear: none; width: 60%; }
.social-o { margin-bottom: 10px; }
.social-i { padding: 0; }
.social-i li:last-child { margin: 0; }
#sx-search { margin-bottom: 10px; }
/* footer */
#sx-fo .copyright, #sx-fo .flinks-ii { text-align: right; clear: both; width: 100%; margin-left: 0; }

}

/* mobile - tablet */
@media only screen and (max-width: 700px) 
{
#sx-content { width: 70%; }
#sx-nav { width: 30%; }
.floatright { width: 60% }
/* accessibility links */
#sx-help li { float: right; }
.floatright.mob-no-float { float: none; clear: both; width: 100%; }
.social-o { width: auto; padding-top: 5px; margin-bottom: 0; float: left; }
.social-i li { margin-right: 5px; }

}

/* mobile - tablet */
@media only screen and (max-width: 625px) 
{
#sx-fo .connect { margin: 30px 0 50px; }
#sx-fo .floatleft { margin: 10px 30px 40px 10px; }
.floatright.mob-no-float { width: 100%; }
.sx-mo { padding-left: 0; }
	
/* footer */
#sx-fo { padding: 0; }
#sx-fo .connect { font-size: 2.2em; }
#sx-fo .connect ul { float: left; margin-bottom: 20px; }
#sx-fo .copyright { padding-top: 20px; margin-top: 0; }
#sx-fo .flinks-ii { padding-top: 0; margin-top: 0; }
#sx-fo .flinks-ii li { padding-top: 10px; display: block; float: right; clear: none; }
#sx-fo ul.links li a:link, #sx-fo ul.links li a:visited { }
#sx-fo ul.links > li:first-child a { border-left: 1px solid #c3c3c3; padding-right: 8px; padding-left: 8px; }

}

/* mobile - landscape */
@media only screen and (max-width: 599px) 
{

/* avatar */
#sx-avatar { float: none; text-align: center; }

/* accessibility links */
#sx-help { position: relative; float: right; clear: none; text-align: center; margin-top: 0; width: 100%; }  
#sx-help li { float: none; display: inline; }
    
.social-o { padding: 0; float: none; clear: left; text-align: center; margin-bottom: 10px; }
.social-i { float: none; }
.social-i li { margin-right: 10px; }
.floatright { width: 100% }
#sx-search { margin: 0 auto 10px; float: none; }

/* move side nav to bottom of page */
#sx-content { float: none; width: 100%; }
#sx-nav { float: none; width: 100%; }
.sx-no { margin: 1em 20px 0; }

/* expand all columns */
.column-outer { width: 100% !important; float: none !important; }
.columns-epsilon .column-outer { float: left !important; }
.columns-outer .column-inner,
.columns-gamma .column-inner,
.columns-delta .column-inner, 
.columns-epsilon .column-inner { margin-left: 0; }

 /* resize h1 */
.contenteditor h1 { font-size: 3em !important; }

/* hide the images and turn the links into 'buttons' */
.columns-epsilon .columns-delta .asset-inline { display: none; }
.columns-epsilon .columns-delta .contenteditor .mobButton a:link, .columns-epsilon .columns-delta .contenteditor .mobButton a:visited { color: #fff; background: #bf1609; padding: 10px 4px; border: 1px solid #fff; }

/* footer */
#sx-fo .connect { margin-left: 10px; }
#sx-fo .floatleft {  margin-left: 0; }

/* columns zeta */
.columns-zeta .columns-alpha .column-alpha { width: 100% !important; }
.columns-zeta .columns-alpha .column-beta { width: 100% !important; }

}

/* mobile - landscape */
@media only screen and (max-width: 459px) 
{
  
.hide-mob { display: none; }
.hide-desktop { display: block; }
/* accessibility links */
.floatright { width: 100% }
.social-i li { margin-right: 2px; }
.sx-mo { padding-left: 10px; }
/* footer */
#sx-fo .connect ul { margin-right: 10px; clear: both; }
#sx-fo .connect li { display: block; float: left; margin-right: 10px; }
#ft-flickr-icon-mob { clear: both; }
#sx-fo .floatleft { margin-top: 10px; margin-bottom: 20px; }
.flinks-i { width: 100%; clear: both; }
#sx-fo .floatleft { margin-right: 10px; }
/* resize text */
#sx-fo .connect { margin-bottom: 20px; font-size: 1.6em; }
/* show alt icons */
#sx-fo .connect ul.hide-mob { display: none; }
#sx-fo .connect ul.hide-desktop { display: block; }
  
 /* resize h1 */
.contenteditor h1 { font-size: 2em !important; }
  
/* columns epsilon now expands */
.columns-epsilon .columns-alpha .column-outer { width: 100% !important; float: none !important; } 
.columns-outer .column-alpha .column-beta .column-inner { margin-left: 0; }

/* incidents plugin search */
.incidents .search-keywords .label {  width: 20%; }
.incidents .search-keywords input { width: 45%; }
.incidents .search-keywords .buttons { width: 18%; }

}

/* mobile - portrait */
@media only screen and (max-width: 320px) 
{

#sx-help { width: 100%; margin-bottom: 5px; }
.social-o { width: 100%; margin-bottom: 5px; }

}

@media print {
/* print friendly */
#sx-help, sx-masthead, #sx-extras, #sx-bct { display: none; }
#sx-nav { width: 0; display: none; }
#sx-content { margin-left: 0px; }

}