/* 
 Theme Name: HWDSB
 Desciption: This is the theme for HWDSB.
 Author: Webmaster
 Date: November 25, 2016
*/
/* ---------------------------------------------------- */
/* Tags and classes
/* ---------------------------------------------------- */
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600);
html { 	height: 100% !important; font-size: 16px;/* Fix cause Google translate changes to height 100% */ } 
* {
  box-sizing: border-box;
}
body{
    margin:0;
    padding:0;
    height: 100%;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 16px;
}
ul br, #printlogo, .showmenu, .spambot_go_away, a.rsswidget img{ display:none; }
header{
    width: 100%;
	position:relative;
	z-index:51;
    box-shadow: 0px 15px 45px -9px rgba(0,0,0,0.10);
}
header a:link, header a:visited{
    color: #000;
    text-decoration: none;
}
.emergency {
    width: 50%;
    margin:0 auto;
}
.emergency-message {
    color: red;
    margin-top: 80px;
    font-size: 20px;
}
#pagetitle{
	padding: 5px;
    /* background: #003366; */
    /* color: #FFF; */
    text-align: center;
    background: rgba(255,255,255,0.8);
}
#content p, #content p span, p{
    line-height: 1.8rem;
}
.FormSectionHeader {
    text-align: center;
}
p br{display: block;}
h1, h2, h3, h4, p strong {
    -webkit-font-smoothing: antialiased;
}
h2,h2 span{
    font-size: 1.6rem;
    font-weight: 500;
}
h2 span{
    font-size: 1.6rem !important;
}
h2 a{
    text-decoration: none;
}
#content h2 a{
	text-decoration: underline;	
}
h3, h3 span{
    font-size: 1.4rem;
    font-weight: 500;
}
h3 span{
    font-size: 1.4rem !important;
}
h4, h4 span{
    font-size: 1.3rem;
    font-weight: 500;
}
h4 span{
    font-size: 1.3rem !important;
}
h5, h5 span{
    font-size: 1.2rem;
    font-weight: 500;
}
h5 span{
    font-size: 1.2rem !important;
}
h6, h6 span{
    font-size: 1.1rem;
    font-weight: 500;
}
h6 span{
    font-size: 1.1rem !important;
}
a, h2 a{
    color: #000;
    transition: all 300ms cubic-bezier(0.175, 0.885, 0.335, 1);
}
a:hover, .widgets h2 a:hover{
    color: #b00000;
}
a.button-right,a.button-left, a.button-right,a.button{
	background: #F32C52;
    overflow: hidden;
    margin: 10px;
	float:right;
    padding: 12px 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all 60ms ease-in-out;
    transition: all 60ms ease-in-out;
    text-align: center;
    white-space: nowrap;
    text-decoration: none !important;
    text-transform: none;
    text-transform: capitalize;
    color: #fff;
    border: 0 none;
    border-radius: 4px;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.3;
    box-shadow: 2px 5px 10px rgba(22, 22, 22, 0.1);
}
a.button{
	float:none;	
}
a.button-left{
	float:right;
}
a.button-right:hover,a.button-left:hover, a.button:hover{
	background: #000;
	color: #FFF;
	cursor:pointer;
}
hr{
    border: none;
    clear:both;
    border-bottom: 1px dotted #DDD;
}
blockquote{
  display:block;
  background: #fff;
  padding: 15px 20px 15px 45px;
  position: relative;
}
blockquote::before{
  content: "\201C"; /*Unicode for Left Double Quote*/
  /*Font*/
  font-size: 60px;
  font-weight: bold;
  color: #999;
  /*Positioning*/
  position: absolute;
  left: 10px;
  top:5px;
}
blockquote a{
  text-decoration: none;
  background: #eee;
  cursor: pointer;
  padding: 0 3px;
  color: #c76c0c;
}

blockquote a:hover{
 color: #666;
}

blockquote em{
  font-style: italic;
}
  /*Default Color Palette*/
blockquote.default{ 
  border-left-color: #ed5565;
  border-right-color: #da4453;
}
main iframe{ width: 100%!important; max-width:100%!important;border:none;min-height: 500px;}
main iframe#wxButtonFrame{width:inherit!important; max-width:none!important; min-height:inherit; margin: 1%;} 
.card iframe{width: 100%!important; max-width:100%!important;border:none;min-height: 360px;}
main iframe.wp-embedded-content{min-height: auto;}
#youtube iframe, #instagram iframe{ max-height: 300px; min-height: 300px;}
#youtube{
	position:relative;	
}
#youtube img{
	margin:0;
}
#youtube h2.title{
	text-transform:capitalize;
}
#youtube .youtubebutton{
	position:absolute;
	 left:40%;
	 right: 40%;
     top:30%;
	 width: 20%;
}
.instaimage{
	float:left;
	width: 23%;
	padding: 1%;
	margin: 1%
}
#instagram .fancybox{
	padding:0 !important;
}
iframe.goog-te-banner-frame{
	min-height: auto;
}
.division{
    display:flex;
    max-width: 1600px; 
    margin: 0 auto;
    width: 100%;
    overflow: hidden;
}
table{
    width: 100% !important;
	margin-top: 1%;
	border: none
}
table th{
	font-size: 1.1rem;
	padding: 1%;
}
table td{
	vertical-align:top;
	padding: 10px;
	border: 1px solid #F1F1F1;
}
table.gsc-table-result td, table.gsc-above-wrapper-area-container td, table.gsc-resultsHeader td{
	border: none;	
}
.fa{
    margin-right: 10px;
}
/*** Emergency ***/
#emergency{
    text-align: center;
	color:#FFF;
}
#emergencysecondary{
	background: rgba(255,231,147,0.9);
	color: #000;
}
#emergency h2{margin: 0 10px 0 0; font-weight: bold; font-size: 1.0rem; line-height: 1.8; }
#emergency a{color:inherit;}
#emergency a:hover{ text-decoration: underline;}
#emergency .message{padding: 10px 5px;}
.message {
    opacity: 1;
    transition: opacity 0.6s; /* 600ms to fade out */
}
/* The close button */
.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 1.2rem;
    /* padding: 20px; */
    line-height: 1.8;
    cursor: pointer;
    transition: 0.3s;
	display:none;
}

/* When moving the mouse over the close button */
.closebtn:hover {
    color: black;
}
/*** Utilities are the items in the header***/
#utilities{
    height: 140px;
    background: #003355;
    color: #FFF;
    padding: 40px 20px;
}
#utilities a{
    color: #FFF;
    padding: 0 20px;
}
#utilities .item, #tools .item{
    float:left;
}
#utilities .item a{
    height: 60px;
    line-height: 60px;
    display: inline-block;
}
#utilities .contact{
    padding-right: 20px;   
}
#utilities .item a:hover{
    background-color: #000;
}
/* Google Translate */
#utilities .translate {
    position: relative;
    color: #FFF;
}
#utilities .goog-te-menu-value{
    margin:0;
}
#utilities .goog-te-gadget{
    font-size:inherit;
    font-family:inherit;
}
#tools .translate a{
    color:#FFF;
}
#tools .translate a:hover{
    background: #000;
}
#utilities .translate a:hover{
    background: inherit;
}
#utilities .goog-te-gadget-simple{
    background-color: inherit;
    margin: 0;
    color: #FFF;
    font-size:inherit;
    padding: 0 0!important;
    border-left:none;
    border-right: none;
    border-bottom: none;
    border-top: none;
    padding: 0;
}
#utilities .goog-te-gadget-icon{
    display: none;
}
#utilities .goog-te-menu-value span {
    border-left:none !important;
    background: interit !important;
    color:#FFF !important;
    display: none;
}
#utilities .goog-te-menu-value:after {
    content: "Translate";
}
#logo{
    height:65px;
    float:left;
    width: 350px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 2.2rem;
    font-weight:bold;
    margin-right: 2%;
}
#logo a{
    padding:0
}
#logo img{
    max-width: 250px;
    max-height: 50px;
}
#logo{
    font-size: 1.7rem;
}
#tinywords{
    font-size: 1.0rem;
    display: block;
}
/*** Search ***/
#searchbox{
    overflow: auto;
}
#searchbox input#search{
    width: 90%;
    height: 60px;
    background: #FFF;
    color: #999;
    border: none;
    float: left;
    padding-left: 20px;
    font-size: 1.2rem;
}
#searchbox button{
    height: 60px;
    width: 10%;
    background: #FFF;
    border: none;
    color: #000;
    float:left;
    font-size: 1.2em;
    cursor: pointer;
}
#searchbox button:hover{
    background: #8CB65A;
}
#searchbox .fa{margin:0;}
/*** Main Body ***/
main{
    clear: both;
    overflow: auto;
	background:#F5F5F5;
}
/* These are the classes that are going to be applied: */
#content .grid[data-columns]::before{
    content: '3 .column.size-1of3';
}
.grid{overflow: auto; max-width: 1600px; margin: 0 auto;}
.column { float: left; }
.size-1of1 { width: 100%; }
.size-1of2 { width: 50%; }
.size-1of3 { width: 33.33%; }
.size-1of4 { width: 25%; }
.size-1of5 { width: 20%; }
#spotlight, .widgets{
    overflow: auto;
    text-align: center;
    position: relative;
    padding: 3% 0;
}
#spotlight {
    background: rgba(0,51,85,0.9);
    padding: 3% 0;
    position: relative;
    color: #FFF;
    box-shadow: 0px 15px 45px -15px rgba(0,0,0,0.50);
}
#spotlight:after, #spotlight:before {
	top: 0;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
#spotlight:after {
	border-top-color: #FFF;
	border-width: 10px;
	margin-left: -10px;
}
#spotlight:before {
	border-top-color: #FFF;
	border-width: 10px;
	margin-left: -10px;
}
#spotlight h2{
	text-transform: uppercase;	
	margin: 0 0 1% 0;
}
#spotlight #items{
	margin: 0 auto;
}
#spotlight ul{
	margin:  0;
    padding: 0;	
}
#spotlight ul li{
	display: inline-block;
	margin-bottom: 0.4096em;
    margin-right: 0.4096em;
}
#spotlight ul li a{
    transition: all .1s ease-in;
    /* background-color: #FFF; */
    display: block;
    color: #FFF;
    padding: 1em;
    letter-spacing: 1px;
    text-decoration: none;
    border: 1px solid #FFF;
}
#spotlight ul li a:hover{
	color: #000;
	background: #FFF;
}
/*** Card design for stories ***/
.card{
    color: #000;
	background: #FFF;
    overflow: hidden;
    float: left;
    width: 94%;
    margin: 3%;
	border: 1px solid #EEE;
}
#events .card{
    width: 100%;
    margin: 1% 0;
}
.division .card{
    float: left;
    width: 60%;
    margin: 0 auto; padding: 15px;
	position: relative;
}
.card img {
    display: block;
    margin: 2% auto;
    width: 100%;
    height: auto;
}
#content img, #footercontent img{
	max-width: 100%;
    height: auto;
}
#footercontent img{
	max-width: 612px;
    height: auto;
}
#content .today{
    border: 1px solid #999;
}
.schoolcard{ /*** For the school listing page ***/
    color: #000;
    overflow: hidden;
    width: 94%;
    margin: 3%;	
	border-bottom: 1px dotted #CCC;
}
.schoolcard h2{
	margin: 0;	
}
.schoolcard .image{
	float:left; width: 20%;
	background-position: 50% 25%;
    height: 150px;
    position: relative;
    display: block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;

}
#schoollogo{
    float: left;
    width: 20%;
    background-position: 50% 25%;
    height: 100px;
    width: 100px;
    position: relative;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border: 3px solid #FFF;
    margin-right: 10px;
    background-color: #FFF;
    border-radius: 50%;
}
.schoolcard .content{
	width: 78%;
    margin-left: 2%;
    float: left;
	background-size: cover;
    background-position: 50% 25%;
    position: relative;
    display: block;
}
.card .image{
    background-size: cover;
    background-position: 50% 25%;
    height: 200px;
    width: 100%;
    position: relative;
    display: block;
}
.card .content{
    display: block;
    width: 100%;
}
.card .date{
    color: #b00000;
}
.card .items{
    display: block;
    line-height: 18px;
    color: #b00000;
    font-size: 0.9rem;
}
.card .more{
    max-height: 380px;
    align-items: baseline;
    justify-content: flex-start;
    background: #FFF;
	overflow: auto;
    /*overflow-y: scroll;
    overflow-x: hidden;*/
}
.card h2.title{
    color: #000; 
    text-align: center;
    border-bottom: 1px solid #EEE;
    padding: 20px;
    margin:0;
	font-size: 1.4rem;
    text-transform: uppercase;
}
.card h2.title a{
	text-decoration: underline;
}
.card ul{
    padding: 0 20px;
}
.card h2{
    font-size: 1.0rem;
    font-weight: bold;
}
.card h3{
	font-size: 1.0rem;
	font-weight:500;
}
.card .item .content{
    padding: 20px 40px;
}
.card .text{
    padding: 20px;
}
#announcements{
    max-width: 1600px;
    margin: 3% auto;
    display: block;
    float:none;
    padding: 20px;
}
/*** Social Media ***/
#socialmedia{
    text-align: center;
    background: #003355;
    clear: both;
    color: #FFF;
    overflow: auto;
    padding: 3%;
    font-size: 1.0rem;
}
#socialmedia p{
    margin: 10px 0 20px 0;
}
#socialmedia a, #subscribe a{
    color: #FFF;
}
#socialmedia a:hover{
    color: #FF8F1E;
}
#socialmedia .fa{
    margin:0;
}
/*** Footer ***/
footer{
    background:#FFF;
    color: #000;
    text-align: center;
    clear:both;
	position:relative;
}
footer a{
    text-decoration: none;
    font-size: 1.0em;
    color: #000;
}
footer #footercontent{
    padding: 3%;
}
#footercontent img{
    width: 100%;
    height: auto;
}
footer .item{
    margin: 0 2%;
    font-size: 3.0rem;
}
/** Banner
===================================*/
#mainbanners{
    clear:both;
    position: relative;
	display:block;
    box-shadow: 0px 15px 45px -15px rgba(0,0,0,0.50);
}
#primarybanner{
    display: block;
    position: fixed;
    z-index: 0;
    top: 0;
    width: 100%;
    filter: blur(6px);
}
#primarybanner:after {
    content: "";
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 300px;
    background: linear-gradient(rgba(238,238,238,0),#eee);
}
#primarybanner img{
    width: 100%;
    height: auto;
    margin: 0 auto;
    display: block;
}
/**
 * BxSlider v4.1.2 - Fully loaded, responsive content slider
 * http://bxslider.com
 *
 * Written by: Steven Wanderski, 2014
 * http://stevenwanderski.com
 * (while drinking Belgian ales and listening to jazz)
 *
 * CEO and founder of bxCreative, LTD
 * http://bxcreative.com
 */
/** RESET AND LAYOUT
===================================*/
.slider,.slider img{
	height: 500px;
    position: relative;
}
.slider{
    background-repeat: no-repeat;  
	background-position: 50%;
}
.slider h2, .slider h1{
	color: #FFF;
    font-size: 4.0vw;
    font-weight: 800;
    width: 100%;
    margin: 0 auto 10px auto;
    text-shadow: 0 3px 3px rgba(0,0,0,1);
}
.slider p{
    margin:0;
    color:#FFF;
    font-size: 2.0rem;
	padding: 0 5%;
	text-shadow: 0 3px 3px rgba(0,0,0,1);
}
.slider .masthead{
    bottom: 0;
    position: absolute;
    width: 100%;
    overflow: auto;
    text-align: center;
    /*background: linear-gradient(to bottom,transparent 0,#000 100%);*/
    padding: 3% 0;
}
.slider .text{
    width: 100%;
     vertical-align: middle;
    text-align: center;	
}
.slider a{
    border-radius: 2px;
    background: rgba(255,255,255, 0.8);
    color: #000;
    font-weight: bold;
    clear: both;
    display: table;
    transition: all 300ms cubic-bezier(0.175, 0.885, 0.335, 1);
    text-align: center;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    padding: 20px;
    margin: 20px auto;
	text-shadow:none;
	font-size: 1.0rem;
    text-transform: uppercase;
}
.slider a:hover{
    background: #FFF;
    color: #000;
}
.bx-wrapper img {
	max-width: 100%;
	display: block;
}
.bxslider, #ticker{
    margin: 0;
    padding:0;
    visibility: hidden;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto,.bx-wrapper .bx-pager{
	position: absolute;
	bottom: 20px;
	width: 100%;
    z-index: 52;
    text-align: center;
}
/* LOADER */
.bx-wrapper .bx-loading {
	min-height: 50px;
	background: url('images/bx_loader.gif') center center no-repeat #fff;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}
.bx-wrapper a{
    transition: none;
}
/* PAGER */
.bx-wrapper .bx-pager {
	text-align: center;
	font-size: .85em;
	font-weight: bold;
	color: #666;
	padding-top: 10px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
	background: none;
	text-indent: -9999px;
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	outline: 0;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
    border: 1px solid #FFF;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active, .widgets .bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #FFF;
}
/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
	left: 0;
	background: url('images/controls.png') no-repeat 0 -32px;
}
.bx-wrapper .bx-next {
	right: 0;
	background: url('images/controls.png') no-repeat -43px -32px;
}
.bx-wrapper .bx-prev:hover {
	background-position: 0 0;
}
.bx-wrapper .bx-next:hover {
	background-position: -43px 0;
}
.bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    margin-top: -16px;
    width: 32px;
    height: 32px;
    text-indent: -9999px;
    z-index: 100;
    background-color: #000;
}
.widgets .bx-wrapper .bx-controls-direction a{
    top: 100%;
    background-color: #CCC;
}
.widgets .bx-wrapper .bx-pager.bx-default-pager a{
    background: #AAA;
}
.widgets .bx-wrapper .bx-pager{
    position: relative;
}
.bx-controls-direction a:hover{
    border:none;
}
.bx-wrapper .bx-controls-direction a.disabled {
	display: none;
}
.bx-wrapper .bx-controls-auto .bx-start {
	display: block;
	text-indent: -9999px;
	width: 10px;
	height: 11px;
	outline: 0;
	background: url(images/controls.png) -86px -11px no-repeat;
	margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active {
	background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
	display: block;
	text-indent: -9999px;
	width: 9px;
	height: 11px;
	outline: 0;
	background: url('images/controls.png') -86px -44px no-repeat;
	margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active {
	background-position: -86px -33px;
}
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
	margin: 0 auto;
    z-index: 51;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
	left: 0;
	width: 35px;
}
/* BxSlider Done */
/* ----------Quicklinks ------------------- */
/* Quicklinks # */
#quicklinks{
    display: block;
    width: 100%;
    text-align: center;
    overflow: auto;
    box-shadow: 0px 15px 45px -9px rgba(0,0,0,0.20);
	position:relative;
    background: #FFF;
}
#quicklinks .fa{
    display: inherit;
    margin:0 0 3% 0;
    font-size: 2.0em;
    clear: both;
}
#quicklinks a[href$='.pdf']{
    background: none;
}
#quicklinks a{
    padding: 2% 1%;
    width: 16.66%;
    text-align: center;
    vertical-align: middle;
    float: left;
    color: #000;
    text-decoration: none;
    font-size: 1.3em;
}
#quicklinks a:hover{
    background: #003355;
    color: #FFF;
}
/* Menu */
/*----------------------------------------------*/
/* Smart menu - Main menu
/*----------------------------------------------*/
nav ul{
     display:inline-block;
}
.sm{position:relative;z-index:9999;}
.sm,.sm ul,.sm li{display:block;list-style:none;margin:0;padding:0;line-height:normal;direction:ltr;text-align:left;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.sm-rtl,.sm-rtl ul,.sm-rtl li{direction:rtl;text-align:right;}
.sm>li>h1,.sm>li>h2,.sm>li>h3,.sm>li>h4,.sm>li>h5,.sm>li>h6{margin:0;padding:0;}
.sm ul{display:none;}
.sm li,.sm a{position:relative;}
.sm a{display:block;}
.sm a.disabled{cursor:not-allowed;}
.sm:after{content:"\00a0";display:block;height:0;font:0px/0 serif;clear:both;visibility:hidden;overflow:hidden;}
.sm,.sm *,.sm *:before,.sm *:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}ain-nav:after {
  clear: both;
  content: "\00a0";
  display: block;
  height: 0;
  font: 0px/0 serif;
  overflow: hidden;
}
ul.sm-clean a, ul.sm-clean a:hover, ul.sm-clean a:focus, ul.sm-clean a:active {
  padding: 13px 20px;
  /* make room for the toggle button (sub indicator) */
  padding-right: 58px;
  font-size: 18px;
  font-weight: normal;
  line-height: 17px;
  text-decoration: none;
}
ul.sm-clean a.current {
  color: #E74C3C;
}
ul.sm-clean a.disabled {
  color: #bbbbbb;
}
ul.sm-clean a span.sub-arrow {
  position: absolute;
  top: 50%;
  margin-top: -17px;
  left: auto;
  right: 4px;
  width: 34px;
  height: 34px;
  overflow: hidden;
  font: bold 16px/34px monospace !important;
  text-align: center;
  text-shadow: none;
  background: rgba(255, 255, 255, 0.5);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
ul.sm-clean a.highlighted span.sub-arrow:before {
  display: block;
  content: '-';
}
ul.sm-clean > li:first-child > a, ul.sm-clean > li:first-child > :not(ul) a {
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  -ms-border-radius: 5px 5px 0 0;
  -o-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
}
ul.sm-clean > li:last-child > a, ul.sm-clean > li:last-child > *:not(ul) a, ul.sm-clean > li:last-child > ul,
ul.sm-clean > li:last-child > ul > li:last-child > a, ul.sm-clean > li:last-child > ul > li:last-child > *:not(ul) a, ul.sm-clean > li:last-child > ul > li:last-child > ul,
ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > a, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul,
ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul,
ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul {
  -webkit-border-radius: 0 0 5px 5px;
  -moz-border-radius: 0 0 5px 5px;
  -ms-border-radius: 0 0 5px 5px;
  -o-border-radius: 0 0 5px 5px;
  border-radius: 0 0 5px 5px;
}
ul.sm-clean > li:last-child > a.highlighted, ul.sm-clean > li:last-child > *:not(ul) a.highlighted,
ul.sm-clean > li:last-child > ul > li:last-child > a.highlighted, ul.sm-clean > li:last-child > ul > li:last-child > *:not(ul) a.highlighted,
ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted,
ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted,
ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, ul.sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
ul.sm-clean li {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}
ul.sm-clean > li:first-child {
  border-top: 0;
}
ul.sm-clean ul {
  background: rgba(162, 162, 162, 0.1);
}
ul.sm-clean ul a, ul.sm-clean ul a:hover, ul.sm-clean ul a:focus, ul.sm-clean ul a:active {
  font-size: 16px;
  border-left: 8px solid transparent;
}
ul.sm-clean ul ul a,
ul.sm-clean ul ul a:hover,
ul.sm-clean ul ul a:focus,
ul.sm-clean ul ul a:active {
  border-left: 16px solid transparent;
}
ul.sm-clean ul ul ul a,
ul.sm-clean ul ul ul a:hover,
ul.sm-clean ul ul ul a:focus,
ul.sm-clean ul ul ul a:active {
  border-left: 24px solid transparent;
}
ul.sm-clean ul ul ul ul a,
ul.sm-clean ul ul ul ul a:hover,
ul.sm-clean ul ul ul ul a:focus,
ul.sm-clean ul ul ul ul a:active {
  border-left: 32px solid transparent;
}
ul.sm-clean ul ul ul ul ul a,
ul.sm-clean ul ul ul ul ul a:hover,
ul.sm-clean ul ul ul ul ul a:focus,
ul.sm-clean ul ul ul ul ul a:active {
  border-left: 40px solid transparent;
}
@media (min-width: 1000px) {
  /* Switch to desktop layout
  -----------------------------------------------
     These transform the menu tree from
     collapsible to desktop (navbar + dropdowns)
  -----------------------------------------------*/
  /* start... (it's not recommended editing these rules) */
  ul.sm-clean ul {
    position: absolute;
    width: 12em;
  }
  ul.sm-clean li {
    float: left;
  }
  ul.sm-clean.sm-rtl li {
    float: right;
  }
  ul.sm-clean ul li, ul.sm-clean.sm-rtl ul li, ul.sm-clean.sm-vertical li {
    float: none;
  }
  ul.sm-clean a {
    white-space: nowrap;
  }
  ul.sm-clean ul a, ul.sm-clean.sm-vertical a {
    white-space: normal;
  }
  ul.sm-clean .sm-nowrap > li > a, ul.sm-clean .sm-nowrap > li > :not(ul) a {
    white-space: nowrap;
  }
  /* ...end */
  ul.sm-clean a, ul.sm-clean a:hover, ul.sm-clean a:focus, ul.sm-clean a:active, ul.sm-clean a.highlighted {
    padding: 12px;
  }
  ul.sm-clean a:hover, ul.sm-clean a:focus, ul.sm-clean a:active, ul.sm-clean a.highlighted, ul.sm-clean a.current, ul.sm-clean a.ancestor{
    color: #b00000;
  }
  ul.sm-clean a.disabled {
    color: #DDD;
  }
  ul.sm-clean a.has-submenu {
    padding-right: 24px;
  }
  ul.sm-clean a span.sub-arrow {
 	top: 50%;
    margin-top: -2px;
    right: 12px;
    width: 0;
    height: 0;
    border-width: 4px;
    border-style: solid dashed dashed dashed;
    border-color: #000 transparent transparent transparent;
    background: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
  }
  ul.sm-clean a.highlighted span.sub-arrow:before {
    display: none;
  }
  ul.sm-clean li {
    border-top: 0;
  }
  ul.sm-clean > li > ul:before,
  ul.sm-clean > li > ul:after {
    content: '';
    position: absolute;
    top: -18px;
    left: 30px;
    width: 0;
    height: 0;
    overflow: hidden;
    border-width: 9px;
    border-style: dashed dashed solid dashed;
    border-color: transparent transparent #003355 transparent;
  }
  ul.sm-clean > li > ul:after {
    top: -16px;
    left: 31px;
    border-width: 8px;
    border-color: transparent transparent #003355 transparent;
  }
  ul.sm-clean ul {
    padding: 5px 0;
    background: #003355;
    border: 1px solid #003355;
    -webkit-box-shadow: 0 5px 9px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 9px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 9px rgba(0, 0, 0, 0.2);
  }
  ul.sm-clean ul ul{
	background: #015E9D;
	border:none;
  }
  ul.sm-clean ul ul ul{
	background:#328FCD;
  }
  ul.sm-clean ul a, ul.sm-clean ul a:hover, ul.sm-clean ul a:focus, ul.sm-clean ul a:active, ul.sm-clean ul a.highlighted {
    border: 0 !important;
    padding: 15px 20px;
    color: #FFF;
  }
  ul.sm-clean ul a:hover, ul.sm-clean ul a:focus, ul.sm-clean ul a:active, ul.sm-clean ul a.highlighted {
    background: #0170BA;
    color: #FFF;
  }
  ul.sm-clean ul a.current {
    color: #d23600;
  }
  ul.sm-clean ul a.disabled {
    background: white;
    color: #cccccc;
  }
  ul.sm-clean ul a.has-submenu {
    padding-right: 30px;
  }
  ul.sm-clean ul a span.sub-arrow {
    right: 8px;
    top: 50%;
    margin-top: -5px;
    border-width: 5px;
    border-style: dashed dashed dashed solid;
    border-color: transparent transparent transparent #FFF;
  }
  ul.sm-clean span.scroll-up,
  ul.sm-clean span.scroll-down {
    position: absolute;
    display: none;
    visibility: hidden;
    overflow: hidden;
    background: white;
    height: 20px;
  }
  ul.sm-clean span.scroll-up:hover,
  ul.sm-clean span.scroll-down:hover {
    background: #eeeeee;
  }
  ul.sm-clean span.scroll-up:hover span.scroll-up-arrow, ul.sm-clean span.scroll-up:hover span.scroll-down-arrow {
    border-color: transparent transparent #d23600 transparent;
  }
  ul.sm-clean span.scroll-down:hover span.scroll-down-arrow {
    border-color: #d23600 transparent transparent transparent;
  }
  ul.sm-clean span.scroll-up-arrow, ul.sm-clean span.scroll-down-arrow {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -6px;
    width: 0;
    height: 0;
    overflow: hidden;
    border-width: 6px;
    border-style: dashed dashed solid dashed;
    border-color: transparent transparent #555555 transparent;
  }
  ul.sm-clean span.scroll-down-arrow {
    top: 8px;
    border-style: solid dashed dashed dashed;
    border-color: #555555 transparent transparent transparent;
  }
  ul.sm-clean.sm-rtl a.has-submenu {
    padding-right: 12px;
    padding-left: 24px;
  }
  ul.sm-clean.sm-rtl a span.sub-arrow {
    right: auto;
    left: 12px;
  }
  ul.sm-clean.sm-rtl.sm-vertical a.has-submenu {
    padding: 10px 20px;
  }
  ul.sm-clean.sm-rtl.sm-vertical a span.sub-arrow {
    right: auto;
    left: 8px;
    border-style: dashed solid dashed dashed;
    border-color: transparent #555555 transparent transparent;
  }
  ul.sm-clean.sm-rtl > li > ul:before {
    left: auto;
    right: 30px;
  }
  ul.sm-clean.sm-rtl > li > ul:after {
    left: auto;
    right: 31px;
  }
  ul.sm-clean.sm-rtl ul a.has-submenu {
    padding: 10px 20px !important;
  }
  ul.sm-clean.sm-rtl ul a span.sub-arrow {
    right: auto;
    left: 8px;
    border-style: dashed solid dashed dashed;
    border-color: transparent #555555 transparent transparent;
  }
  ul.sm-clean.sm-vertical {
    padding: 10px 0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
  }
  ul.sm-clean.sm-vertical a {
    padding: 10px 20px;
  }
  ul.sm-clean.sm-vertical a:hover, ul.sm-clean.sm-vertical a:focus, ul.sm-clean.sm-vertical a:active, ul.sm-clean.sm-vertical a.highlighted {
    background: white;
  }
  ul.sm-clean.sm-vertical a.disabled {
    background: #eeeeee;
  }
  ul.sm-clean.sm-vertical a span.sub-arrow {
    right: 8px;
    top: 50%;
    margin-top: -5px;
    border-width: 5px;
    border-style: dashed dashed dashed solid;
    border-color: transparent transparent transparent #555555;
  }
  ul.sm-clean.sm-vertical > li > ul:before,
  ul.sm-clean.sm-vertical > li > ul:after {
    display: none;
  }
  ul.sm-clean.sm-vertical ul a {
    padding: 10px 20px;
  }
  ul.sm-clean.sm-vertical ul a:hover, ul.sm-clean.sm-vertical ul a:focus, ul.sm-clean.sm-vertical ul a:active, ul.sm-clean.sm-vertical ul a.highlighted {
    background: #eeeeee;
  }
  ul.sm-clean.sm-vertical ul a.disabled {
    background: white;
  }
}
/* Mobile menu toggle button */
.main-menu-btn {
  float: right;
  margin: 6px 10px;
  position: relative;
  display: inline-block;
  width: 29px;
  height: 29px;
  text-indent: 29px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* hamburger icon */
.main-menu-btn-icon,
.main-menu-btn-icon:before,
.main-menu-btn-icon:after {
  position: absolute;
  top: 50%;
  left: 2px;
  height: 2px;
  width: 24px;
  background: #555;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.main-menu-btn-icon:before {
  content: '';
  top: -7px;
  left: 0;
}
.main-menu-btn-icon:after {
  content: '';
  top: 7px;
  left: 0;
}
#main-menu > li {
	float:none;
	display:inline-block;
	margin-right:-4px;
}
/* x icon */
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
  height: 0;
  background: transparent;
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
  top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* hide menu state checkbox (keep it visible to screen readers) */
#main-menu-state {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
/* hide the menu in mobile view */
#main-menu-state:not(:checked) ~ #main-menu {
  display: none;
}
#main-menu-state:checked ~ #main-menu {
    display: block;
    padding: 1%;
    text-align: center;
    clear:both;
}
@media (min-width: 1000px) {
  /* hide the button in desktop view */
  .main-menu-btn {
    position: absolute;
    top: -99999px;
  }
  /* always show the menu in desktop view */
  	#main-menu-state:not(:checked) ~ #main-menu {
		display: block;
		padding: 1%;
		text-align: center;
		background: #FFF;
		z-index: 51;
		box-shadow: 0px 15px 45px -9px rgba(0,0,0,0.30);
	}
}
/* ---------------------------------------------------- */
/* Menu & Widgets - Left on secondary pages
/* ---------------------------------------------------- */
.widget{
    list-style: none;
}
.widgets h2.tribe-events-title{
    font-size: 1.0rem;
    background: none;
}
.widgets .widgets ul {
    list-style: none;
    padding: 0;
}
.widgets ul{
	margin: 0;
	padding:0;
}
.widgets .card ul li{
    padding: 20px;
    border-bottom: 1px solid #F1F1F1;
    list-style-type: none;
	text-align:left;
}
.widgets .post-date, .widgets .widget_search, .widgets .calendar_wrap, .widgets .tribe-events-adv-list-widget{
    padding: 5%;
    display: block;
}
.widgets .textwidget{
    padding: 5%;
}
.widgets .textwidget a:hover{
    background: none;
    color: #b00000;
}
.widgets .widget img{
    width: 100%;
    height: auto;
}

ul.blogroll ul li{list-style: none;}
ul.blogroll ul li a{padding: 5%; display: block;border-bottom: 1px solid #DDD;text-decoration: none; color: #000;}
ul.blogroll ul li ul li{border-bottom: none;}
ul.blogroll{padding: 0; margin: 0;}
ul.widgets, ul.blogroll{padding:0;margin:0; list-style: none; clear:both;}
#menu{
    float: left;
    width: 20%;
    margin: 0;
	background: rgba(255,255,255,0.95);
	border-right: 1px solid #DDD;
}
#menu ul ul{
	background: rgba(0,0,0,0.05);	
}
#menu ul, ul.widgets{
    margin: 0; padding: 0; list-style: none;
}
#menu ul li ul li a,#menu ul li.current_page_item ul a {color: #000; }
#menu ul li.current_page_item a{ color: #b00000;}
#menu ul.blogroll li a, .card ul.blogroll li a, #menu ul li a, .widget ul li a{
    padding: 5%;
    display: block;
    border-bottom: 1px solid #DDD;
    text-decoration: none;
    color: #000;
}
#menu ul li a:hover, #menu a.current_page_item, 
#menu ul li.current_page_item ul a:hover, .card ul.blogroll li a:hover{
    background: #003366;
    color: #FFF;
}
#menu ul li ul li a{
    padding-left: 20px;
    display: block;
}
#menu ul li ul li ul li a{
    padding-left:40px;
    display: block;
    font-weight: normal;
}
#menu ul li ul li ul li ul li a{
	padding-left: 60px;
	background: #E3E3E3;
}
/**** Page Content ****/
#pagecontent{
    overflow: hidden;
    margin: 100px auto;
    max-width: 1600px;
    position: relative;
    display: flex;
}
#content{
    width: 80%;
	margin: 0;
    padding: 40px;
    display: block;
    float: left;
	background:#FFF
    /*box-shadow: 0 3px 10px 0 rgba(0,0,0,0.1); */
}
#content #information{ 
    overflow: auto;
    padding: 1% 0;
    margin-top: 2%;
    clear:both;
}
#content .date{
    color: #666;
}
#content #information .date{
	display:block;
	margin: 0;
	line-height:18px;
    float:left;
	color: #666;
}
#content #information .tools{
	display:block;
	float:right;
}
#information a{
    border:none;
}
#content #information .share, #content #information .report{
	display:inline-block;
	padding-left:20px; margin: 0;
	line-height: 20px;
	float:right;
}
#content .edit{ margin: 0 0 10px 0;}
#content .edit a{
    border:none;
}
#content #information .tools{
		display:block;
		float:right;
}
#content ul li, ol li{
	margin: 15px 0;
	line-height: 1.8;
}
#content .odd {
    background: #DFEFF0;
}
#contenttitle{
	border-bottom: 1px solid #DDD;
    overflow: hidden;
    padding: 0;
}
#contenttitle h1{
	margin: 0 0 10px 0;
	float:left;
}
/* Font Size */
#controls  {  
	text-align:center;
	transition:.25s ease-out;
    float:right;
}
#controls a{  
	font-size:18px;
	color:#000;
	display:block;
  	font-weight:bold;
    float:left;
}
#controls a:hover{  
	background:#000;
	color: #FFF;
    transition:.25s ease-out;
}
#controls a.selected  {  
	background:#000;
	color:#fff !important;
}
#controls .textsize{
    text-indent:-9999px;
	position:absolute;
/* height: 0; */
}
#controls .font-button{
    height: 40px;
    width: 60px;
    display: inline-block;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
}
/*** Bread Crumbs ***/
#breadcrumbs{ padding: 0; margin: 10px 0; line-height:25px;}
#breadcrumbs a{text-decoration: none;}
/*** Accessibility ***/
a.skiptomaincontent {
    left:-999px;
    position:absolute;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
    z-index:-999;
}
a.skiptomaincontent:focus, a.skiptomaincontent:active {
    color: #fff;
    background-color:#000;
    left: auto;
    top: auto;
    width: 30%;
    height: auto;
    overflow:auto;
    margin: 10px 35%;
    padding:5px;
    border-radius: 15px;
    border:4px solid yellow;
    text-align:center;
    font-size:1.2em;
    z-index:999;
}
/*** Image ***/
img.centerthumbnail{
	clear:both;
	margin:0 auto 10px auto;
	display:block;
}
.aligncenter, div .aligncenter {
   	display: block;
	margin: 0 auto;
}
.alignleft {
   	float: left;
	margin: 10px   
}
.alignright {
  	float: right;
	margin: 10px;
	display:block;
}
.wp-caption {
   text-align: center;
   background-color: #F9F9F9;
   margin: 10px; padding-top: 4px;
   clear:both;
}
.wp-caption img {
   margin: 0;  padding: 0;
   border: 0 none;
}
.wp-caption p .wp-caption-text {
   font-size: 11px;
   padding: 0 4px 5px; margin: 0;
   font-style:italic;
}
time, .postinfo{
    color: #000;
    font-size: 0.9rem;
	font-weight: bold;
    display: block;
    clear: both;
}
/*** Home Widgets ***/
.widgetitem{
    overflow: auto;
    display: flex;
    min-height: 65px;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #EEE;
}
.widgetitem .date{
    text-align: center;
    width: 20%;
    float: left;
}
.widgetitem .body{
    padding: 10px;
    /* text-align: center; */
    float: left;
    width: 80%;
    text-align: left;
	border-left: 1px solid #EEE;
}
.widgetitem a{
    text-decoration: none;
}
.widgetitem .linkicon{
	text-align: center;
    width: 20%;
    float: left;
	font-size: 30px;
}
/****** Ward and Senior Management ****/
.ward{
	width: auto;
	overflow:auto;
	margin: 10px 0;
    display: flex;
    border: 1px solid #EEE;
}
#contentwrapper .ward h3{
	margin: 0;
	padding: 10px;
}
#contentwrapper .wardinfo h3{
	background: #EEE;	
}
.wardinfo{
    display: block;
    float: left;
    width: 20%;
    padding-bottom: 20px;
    text-align: center;
    border-right: 1px solid #EEE;
    background: #f5f5f5;
}
.committees{
	width: 80%;
    padding: 2%;
    display: block;
    float: left;
    background-color: #FCFCFC;
}
.ward .accordioncontent .ui-accordion p {
	padding: 0 10px;
}
.ward h2{
    text-align: center;
    font-size: 1.2rem;
    background: #EAEAEA;
    padding: 10px;
    margin: 0 0 20px 0;
}
.wardinfo h3{
	font-size: 1.2rem;
    margin: 5% 0 0 0;
}
.wardinfo p{
    margin:0;
}
.ward h3, .ward h4{
    font-size: 1.1rem;
    margin: 10px 0 0 0 ;
}
.so{
	clear: both;
	padding: 0 10px 10px 10px;
	background: #F9F9F9;
	margin-bottom: 10px;
}
.soinfo{
	overflow:auto;
}
.soname{
	float:left;	
}
.sotitle{
	float:left;	
	margin-left: 5px;
}
.soschools{
    overflow:auto;
    padding: 1%;
    display: flex;
}
.soschools h3{
    margin: 20px 0;
    font-weight: bold;
    text-align: center;
}
.soschool ul li{
    display:inline;
}
.schoollistfloat{
	float:left;
}
.secondaryschools{
    float:left;
    padding: 2%; 
    width: 25%;
    background: #FFF;
}
.elementaryschools{
    float:left;
    padding: 2%; 
    width: 75%;
    background: #F1f1f1;
}
/*** Forms ***/
/* .selection class for dropdown menu such as year */
.selection{
	padding: 2% 0;
    overflow: auto;
}
.selection label{
    float:left;
    display: block;
    margin: 10px;
}
.selection form select{
    float: left;
    display: block;
}
form .textbox, form .select, form .textarea{ width: 98%; }
form input[type="text"], form input[type="password"],form .select, #contentwrapper .box select,
form .bigselect,form .file,form .smallbox, form .textarea,form .smallbox{
	width: 215px;
	border: 1px solid #DDD;
	padding: 1%;
    border-radius: 0;
    /*-webkit-appearance: none;*/
}
form.gsc-search-box input[type="text"]{
    width: 100%;
}
form .bigselect{
    padding:0;
}
form .textarea{
    width: 80%;
    height: 200px
}
form .smallbox{ width: 100px; }
form .button{
    width: 100px;
    padding: 1%;
    background-color: #000;
    color: #FFF;
    border: 1px solid #000;
    cursor: pointer;
    font-weight: bold;
    font-size: 13px;
    margin: 0;
}
option{padding: 3%;}
#inputArea{	margin: 0 auto;
    padding: 40px;
    background: #f9f9f9; border: 1px solid #DDD;}
#inputArea div{
	margin:0 0 1% 0;
}
#inputArea h4{
    margin: 0;
}
label{
    display: block;
}
.red{ color: #b00000; }
.required{ text-align: left; }
.required::after{content: "*"}
.success{
	text-align:center;
	color: #003366;
	font-weight: bold; font-size: 1.2rem;
}
.error{
	color: #b00000;
    display: block;
	font-weight: bold;font-size: 1.2rem;;	
}
/*** Scroller ***/
#back-to-top {
position: fixed;
    top: 460px;
    right: 40px;
    z-index: 9999;
    width: 42px;
    height: 42px;
    text-align: center;
    line-height: 40px;
    font-size: 1.3rem;
    background: #000;
    color: #FFF;
    cursor: pointer;
    border: 0;
    border-radius: 5px;
    text-decoration: none;
    transition: opacity 0.2s ease-out;
    opacity: 0;
}
#back-to-top .fa{margin:0;padding:0}
#back-to-top:hover {
    background: #FF8E11;
}
#back-to-top.show {
    opacity: 1;
}
.indent{
	text-indent:-9999px;
	height: 1px;
	float: left;
	position:absolute
}

/***
 * jQuery UI CSS Framework 1.8.12
 *
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Theming/API
 */
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family:inherit; }
.ui-widget-header { background: #336699 url(images/ui-bg_highlight-soft_15_336699_1x100.png) 50% 50% repeat-x; color: #ffffff; font-weight: bold; }
/*.ui-widget-header a { color: #ffffff; }*/
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
#ui-datepicker-div .ui-icon { width: 16px; height: 16px; }
.ui-widget-header .ui-icon {background-image: url(images/ui-icons_444444_256x240.png); }
/* calendar arrows on the top*/
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-datepicker .ui-icon { display: block; text-indent: -99999px;overflow: hidden; background-repeat: no-repeat; left: .5em; top: .3em;}
.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; }
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
.ui-datepicker .ui-datepicker-prev { left:2px; }
.ui-datepicker .ui-datepicker-next { right:2px; }
.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
.ui-datepicker .ui-datepicker-next-hover { right:1px; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px;  }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year { width: 49%;}
.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; background-color:#FFF; color: #000; }
.ui-datepicker td { border: 0; padding: 1px; }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi { width:auto; }
.ui-datepicker-multi .ui-datepicker-group { float:left; }
.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
.ui-datepicker-row-break { clear:both; width:100%; }
/* RTL support */
.ui-datepicker-rtl { direction: rtl; }
.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
.ui-datepicker-rtl .ui-datepicker-group { float:right; }
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover {
    display: none; /*sorry for IE5*/
    display/**/: block; /*sorry for IE5*/
    position: absolute; /*must have*/
    z-index: -1; /*must have*/
    filter: mask(); /*must have*/
    top: -4px; /*must have*/
    left: -4px; /*must have*/
    width: 200px; /*must have*/
    height: 200px; /*must have*/
}
#ui-datepicker-div.ui-widget-content {background: #EEE;}
#ui-datepicker-div.ui-widget-content a { color: #000; }
#ui-datepicker-div .ui-datepicker-rtl .ui-widget-header { background: #336699; color: #ffffff; font-weight: bold; }
#ui-datepicker-div .ui-datepicker-rtl .ui-widget-header a { color: #ffffff; }

/*** Time Picker ***/
.ui-timepicker-wrapper {
	position: absolute;
	height: 191px;
	width:4em; /* needed for IE */
	overflow: auto;
	background: #fff;
	border: 1px solid #aaa;
	z-index: 99;
	margin: 0;
	width:215px;
}
ui-timepicker-wrapper .time-picker-12hours {
  	width:8em; /* needed for IE */
}
.ui-timepicker-wrapper ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.ui-timepicker-wrapper li {
	cursor: pointer;
	padding: 4px 3px;
}
.ui-timepicker-wrapper li.selected {
	background: #336699;
	color: #fff;
}/*** Accodions and Tabs ***/
#content .ui-tabs ul li, #content .ui-tabs-nav ul li, .card .ui-tabs ul li, .card .ui-tabs-nav ul li{
	list-style: none;
	float: left;
	position: relative;
	top: 0;
	margin: 0;
	padding: 0;
	background:#FFF;
	white-space: nowrap;
}
#content  .tabcontent{
    margin: 20px 0;
}
.card .tabcontent{
	margin: 0;	
}
.tabcontent .ui-tabs{
	position: relative;/*position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
}
#content .tabcontent .ui-tabs-panel ul li, .card .ui-tabs-panel ul li{
	float:none;
	background:none;
	list-style:disc;
	margin-bottom: 15px;
	white-space: normal;
}
.tabcontent .ui-widget-header{
	background:#FFF;
    padding: 0;
    margin: 0;
    overflow: auto;
}	
.ui-tabs .ui-tabs-nav .ui-tabs-anchor{
    display: block;
    float: left;
    padding: 18px;
    color: #000;
    font-weight: 500;
    font-size: 1.2rem;
    text-decoration: none;
}
.ui-tabs .ui-tabs-nav a {border:none;}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
    color: #b00000;
    background: #f9f9f9;
    border: 1px solid #DDD;
    border-bottom: none;
}
.ui-tabs .ui-tabs-panel {
    border-width: 0;
    padding: 1% 0;
    overflow: auto;
    border-top: 1px solid #DDD;
    clear: both;
}
.ui-icon, .card .ui-icon {
    display: inline-block;
    vertical-align: middle;
    margin-top: -.25em;
    position: relative;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
}
.ui-icon, .ui-widget-content .ui-icon {
    background-image: url(images/ui-icons_444444_256x240.png);
}
.ui-state-active .ui-icon, .ui-button:active .ui-icon {
    background-image: url(images/ui-icons_444444_256x240.png);
}
.ui-icon-triangle-1-e {
    background-position: -32px -16px;
}
.ui-icon-triangle-1-s {
    background-position: -65px -16px;
}
.accordioncontent .ui-accordion h3.ui-accordion-header {
    background: #f9f9f9;
    margin: 0;
    padding: 20px;
    cursor: pointer;
    font-size: 1.1rem;
    border: 1px solid #EEE;
}
.accordioncontent .ui-accordion .ui-accordion-header-active{
    cursor: pointer;
    background: #EEE;
    color: #b00000;
    border-bottom: none;
}
.accordioncontent  .ui-accordion .ui-accordion-content {
	border-top: 0;
	overflow: auto;
	background: #FFF;
	padding: 20px;
}
/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp{
	padding: 0;
	margin: 0;
	border: 0;
	outline: none;
	vertical-align: top;
}
.fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 8020;
}
.fancybox-skin {
	position: relative;
	background: #f9f9f9;
	color: #444;
	text-shadow: none;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
}
.fancybox-opened {
	z-index: 8030;
}
.fancybox-opened .fancybox-skin {
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}
.fancybox-outer, .fancybox-inner {
	position: relative;
}
.fancybox-inner {
	overflow: hidden;
}
.fancybox-type-iframe .fancybox-inner {
	-webkit-overflow-scrolling: touch;
}
.fancybox-error {
	color: #444;
	margin: 0;
	padding: 15px;
	white-space: nowrap;
}
.fancybox-image, .fancybox-iframe {
	display: block;
	width: 100%;
	height: 100%;
}
.fancybox-image {
	max-width: 100%;
	max-height: 100%;
}
#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
	background-image: url('images/fancybox_sprite.png');
}
#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -22px;
	margin-left: -22px;
	background-position: 0 -108px;
	opacity: 0.8;
	cursor: pointer;
	z-index: 8060;
}
#fancybox-loading div {
	width: 44px;
	height: 44px;
	background: url('images/bx_loader.gif') center center no-repeat;
}
.fancybox-close {
	position: absolute;
	top: -18px;
	right: -18px;
	width: 36px;
	height: 36px;
	cursor: pointer;
	z-index: 8040;
}
.fancybox-nav {
	position: absolute;
	top: 0;
	width: 40%;
	height: 100%;
	cursor: pointer;
	text-decoration: none;
	background: transparent url('images/blank.gif'); /* helps IE */
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	z-index: 8040;
}
.fancybox-prev {
	left: 0;
}
.fancybox-next {
	right: 0;
}
.fancybox-nav span {
	position: absolute;
	top: 50%;
	width: 36px;
	height: 34px;
	margin-top: -18px;
	cursor: pointer;
	z-index: 8040;
	visibility: hidden;
}
.fancybox-prev span {
	left: 10px;
	background-position: 0 -36px;
}
.fancybox-next span {
	right: 10px;
	background-position: 0 -72px;
}
.fancybox-nav:hover span {
	visibility: visible;
}
.fancybox-tmp {
	position: absolute;
	top: -99999px;
	left: -99999px;
	visibility: hidden;
	max-width: 99999px;
	max-height: 99999px;
	overflow: visible !important;
}
/* Overlay helper */
.fancybox-lock {
    overflow: hidden !important;
    width: auto;
}
.fancybox-lock body {
    overflow: hidden !important;
}
.fancybox-lock-test {
    overflow-y: hidden !important;
}
.fancybox-overlay {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	display: none;
	z-index: 8010;
	background: url('images/fancybox_overlay.png');
}
.fancybox-overlay-fixed {
	position: fixed;
	bottom: 0;
	right: 0;
}
.fancybox-lock .fancybox-overlay {
	overflow: auto;
	overflow-y: scroll;
}
/* Title helper */
.fancybox-title {
	visibility: hidden;
	position: relative;
	text-shadow: none;
	z-index: 8050;
}
.fancybox-opened .fancybox-title {
	visibility: visible;
}
.fancybox-title-float-wrap {
	position: absolute;
	bottom: 0;
	right: 50%;
	margin-bottom: -35px;
	z-index: 8050;
	text-align: center;
}
.fancybox-title-float-wrap .child {
	display: inline-block;
	margin-right: -100%;
	padding: 2px 20px;
	background: transparent; /* Fallback for web browsers that doesn't support RGBa */
	background: rgba(0, 0, 0, 0.8);
	-webkit-border-radius: 15px;
	   -moz-border-radius: 15px;
	        border-radius: 15px;
	text-shadow: 0 1px 2px #222;
	color: #FFF;
	font-weight: bold;
	line-height: 24px;
	white-space: nowrap;
}
.fancybox-title-outside-wrap {
	position: relative;
	margin-top: 10px;
	color: #fff;
}
.fancybox-title-inside-wrap {
	padding-top: 10px;
}
.fancybox-title-over-wrap {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	padding: 10px;
	background: #000;
	background: rgba(0, 0, 0, .8);
}
/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	   only screen and (min--moz-device-pixel-ratio: 1.5),
	   only screen and (min-device-pixel-ratio: 1.5){

	#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
		background-image: url('images/fancybox_sprite@2x.png');
		background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/
	}

	#fancybox-loading div {
		background-image: url('images/fancybox_loading@2x.gif');
		background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/
	}
}
[class="icon"]:after {
    content: "(pdf)";
    padding-left:2px;
}
a[href$=".xls"]:after, a[href$=".xlsx"]:after {
    content: "(excel)";
    padding-left:2px;
}
a[href$=".doc"]:after, a[href$=".docx"]:after {
    content: "(word)";
    padding-left:2px;
}
/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	   only screen and (min--moz-device-pixel-ratio: 1.5),
	   only screen and (min-device-pixel-ratio: 1.5){
    #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
		background-image: url('images/fancybox_sprite@2x.png');
		background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/
	}
    #fancybox-loading div {
		background-image: url('images/fancybox_loading@2x.gif');
		background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/
	}
}
.goog-te-menu-frame{
	box-shadow: none !important;
	 -moz-box-shadow: none !important;;
    -webkit-box-shadow: none  !important;
}
/*** Mobile ***/
@media screen and (min-width: 1920px){
    .grid[data-columns]::before {
        content: '3 .column.size-1of3';
	}
}
@media screen and (max-width: 1600px){
	#pagecontent{
		margin: 20px;
		width: auto;
	}	
}
@media screen and (max-width: 1400px){
	.division{
		margin: 0 10px;	
		width: auto;
	}
	.card .fa{
		display:none;	
	}
}
@media screen and (min-width: 1267px) and (max-width: 1919px){
    .slider{
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        /*min-height: 500px*/;
    }
    .grid[data-columns]::before {
        content: '3 .column.size-1of3';
	}
}
@media screen and (min-width: 1001px) and (max-width: 1266px){
    .widgets{
        width: 100%;
    }
    #quicklinks a{
        font-size: 1.2em;
        padding: 3% 1%;		
    }
    .grid[data-columns]::before, #content .grid[data-columns]::before {
        content: '2 .column.size-1of2';
	}
	.wardinfo{
		width: 30%;
	}
	.secondaryschools,elementaryschools{
		width: 50%;
	}
	#menu{
		width: 30%;	
	}
	#content{
		width: 70%;	
	}
	.ui-tabs .ui-tabs-nav .ui-tabs-anchor{
		font-size: 1.0rem;
	}
	.slider .text{
		padding-bottom: 4%; 	
	}
}
@media screen and (min-width: 801px) and (max-width: 1000px){
    .grid[data-columns]::before, #content .grid[data-columns]::before {
        content: '2 .column.size-1of2';
	}
    .wardinfo{
		width: 50%;
	}
	.schoollistfloat{
		float:none;	
	}
	.secondaryschools,elementaryschools{
		width: 50%;
	}
    .division{
        display: block;
    }
	.division .card{
        width: 100%;
        margin: 5% 0;
    }
	.widgets {
		display: block;
		padding: 5%;
		margin: 2% 0 0 0;
	}
	#menu{
		width: 30%;	
	}
	#content{
		width: 70%;	
	}
	#spotlight{
		padding: 5%;	
	}
	.slider .text{
		padding-bottom: 4%; 	
	}
}
@media screen and (max-width: 1000px){
    #searchbox{
        clear:both;
    }
    .grid[data-columns]::before, #content .grid[data-columns]::before {
        content: '2 .column.size-1of2';
	}
    #counteritems .item{
        font-size: 2.0rem;
    }
    .wardinfo{
		width: 50%;
	}
	.schoollistfloat{
		float:none;	
	}
	.secondaryschools,elementaryschools{
		width: 50%;
	}
    .division{
        display: block;
	}
	.division .card{
        width: 100%;
        margin: 5% 0;
    }
	.widgets {
		display: block;
		padding: 5%;
		margin: 2% 0 0 0;
	}
	#menu{
		width: 30%;	
	}
	#content{
		width: 70%;	
		padding: 4% 6%;
	}
	#spotlight{
		padding: 5%;	
	}
	.slider .text{
		padding-bottom: 4%; 	
	}
    #main-menu > li{
        display: block;
    }
    #menu, #content{ 
        width:100%;
        float:none;
    }
	#searchbox{
		clear:both;
	}
    .card{
        margin: 5% auto;
        width: 100%;
    }
    #menu, #main-menu li#home{
        display: none;
    }
    main{
        border:none;
		margin:0;
    }
    nav{
        padding:2%;
        overflow: auto;
        background: #EEE;
		border-bottom: 1px solid #DDD;
    }
    .slider h2 {
        font-size: 7.9vw;
    }
    #logo {
        margin: 0 auto;
        float: none;
        width: 100%;
        padding: 10% 0;
        justify-content: center;
        text-align: center;
    }
    #tools{
        clear:both;
    }
    #utilities{
        height: 200px;
        display: block; 
        padding: 0;
    }
    #utilities .item a{
        width: 100%;
    }
    #searchbox button,#searchbox input#search {
        height: 60px;
        text-align: center;
    }
    #utilities .contact{
        width: 50%;
        text-align: center;
        background: #555;
    }
    #utilities .subscribe-button{
        width: 50%;
        text-align: center;
    }
    #contactinformation{
        background: #555;
    }
    #utilities .contact{
        padding:0;
    }
    #utilities #controls {
        width: 50%;
        text-align: center;
        overflow: auto;
        float: left;
        background: #444;
        display:none;
    }
    .emergency {
        width: 80%;
        margin:0 10%;
    }
    #utilities .translate{
        width: 100%;
		background: #000;
    }
    #utilities .goog-te-menu-value{
        margin: 0;
    }
    #utilities .translate div{
        float:none;
        margin: 0 auto;
        width: 100%;
        
        text-align: center;
    }
    #tools{
        display: block;
        width: 100%;
        clear:both;
    }
    #quicklinks{
        padding: 0;
        background: #FFF;;
    }
    #quicklinks a{
        width: 33.3%;
        padding: 4% 2%;
        border: 1px solid #f5f5f5;
        font-size: 1.2rem;
    }
    #footercontent img, #content img{
        width: 100%;
        height: auto;
    }
    .contact{
        background: #444;
    }
    .widgets{
        display: block;
        padding:5%;
        margin: 2% 0 0 0;
    }
    .widgets .twitter{
        width: 100%;
        clear:both;
    }
    main{
        display: block;
    }
    .grid[data-columns]::before, #content .grid[data-columns]::before {
        content: '1 .column.size-1of1';
	}
    #emergency .message{border-bottom: 1px solid #E8D17F; display:block!important}
    #counteritems .item{
        font-size: 2.0rem;
    }
    table {
        width: 100%!important;
		height: auto!important;
		overflow-x: auto;
		display: block;
	}
	.wardinfo{
		width: 40%;
	}
	.schoollistfloat{
		float:none;	
	}
	.secondaryschools,elementaryschools{
		width: 50%;
	}
	.alignleft, .alignright{
		float:none;
		margin:0;
	}
	.selection form select,.selection label{
		float:none;
		margin:1% 0;
		width: 100%;
	}
	#spotlight{
		padding: 10% 0;	
	}
	.card .fa{
		display:inline-block;
	}
	.slider .text{
		padding-bottom: 4%; 	
	}
}
@media screen and (max-width: 650px){
	#logo{
		padding: 10% 0;
	}
	.widgets{
        float:none;
        width: 100%;
    }
    #quicklinks a{
        width: 50%;
        padding: 5% 1%;
        font-size: 1.1em;
    }
    .card{
        float:none;
        width: 100%;
        margin-bottom: 5%;
    }
	.slider .masthead{
		width: 100%;
		height: 100%;
		display: table;
		table-layout: fixed;
	}
	.slider .text{
		width: 100%;
		display: table-cell;
		vertical-align: middle;
		text-align: center;	
	}
    .slider, .slider img{
        height: 300px;
    }  
	.wardinfo{
		width: 50%;
	}
	.soschools{
		display:block;
	}
	.secondaryschools{
		float:none;
		width: 100%;
	}
	.elementaryschools{
		float:none;
		width: 100%;
	}
}
@media screen and (max-width: 550px){
    #utilities{
        font-size: 0.9em;
    }
    .slider a{
        margin: 5% auto;
    }
    .ward{
        display: block;
    }
    .wardinfo, .committees{
        width: 100%;
    }
	.ui-tabs .ui-tabs-nav .ui-tabs-anchor{
		padding: 10px;
		font-size: 1.0rem;
	}
	.slider p{
		font-size: 1.1rem;
	}
}
@media screen and (max-width: 400px){
    #quicklinks a{
        font-size: 1.0em;
    }
    #spotlight ul{
	    margin: 5%;
	}
	#searchbox input#search{
        font-size: 1.0rem;
    }
	#logo{
        padding: 20% 0;
    }
    #logo img{
        width: 100%;
        height: auto;
    }
    #searchbox button{
        font-size: 1.0em;
    }
    footer .item{
        font-size: 2.0rem;
    }
    #socialmedia{
        padding: 10%;   
    }
	.card .ui-tabs ul li,.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor{
		width: 100%;
		border-bottom: 1px solid #DDD;
	}
	.tabcontent .fa{
		display:none;	
	}
	#spotlight ul li{
		list-style:none;
		display:block;
	}
	#content #information .report{
		padding: 10px;	
		float:left;
	}
}
/* Print Styles */
@media print {
     body {
        background: white;
    }
    a:after,
    a:link:after,
    a:visited:after,
    a:hover:after,
    a:active:after {
        content: " <" attr(href) "> ";
        color: grey;
        font-style: italic;
        font-weight: normal;
    }
    a[target="_blank"]:not( [href^='#'] ):not( [href^='/'] ):not( [href$=".pdf"]):after {
        content: "";
    }
    /* Page */
    #menu, #breadcrumbs, #emergency, #subscribe, #logo, #searchbox,#socialmedia, #content #information .tools, #back-to-top, nav, a.skiptomaincontent, #quicklinks, #counter, .twitter, #map_canvas, #mainbanners,.division, #scoreboard, #announcements,#inputArea, .selection{
        display:none;
    }
    #utilities{
        background: #FFF;
        padding: 0;
    }
    #printlogo{
        display: block;
        color: #000;
        margin: 20px 0 0 0;
    }
    main{
        border:none;
        margin: 0;
    }
    #content{
        padding: 0;
        float:none;
        box-shadow: none;
    }
    #content img, #footercontent img{
        max-width: 670px;
        height: auto;
    }
    /* front page */
    .division{
        display: block;
    }
    .card, .division .card, #content .card{
        float: none;
        width: 100%;
        max-width: 670px;
        padding: 0;
        margin: 0;
        border:none;
    }
    .card .image{
        display: none;
    }
    .card .items{
        margin: 0;
        padding: 20px 0;
        border-top: none;
        border-bottom: 1px dotted #DDD;
    }
    .card h2{
        margin: 10px 0;
    }
    .card p{
        margin: 0;
    }
    main .more{
        max-height: none;
    }
    .size-1of1, .size-1of2, .size-1of3,.size-1of4,.size-1of5, table{
        float:none;
        width: 100%;
        max-width: 670px;
    }
    .column{
        float:none;
    }
    .widgets{
        padding:0;
    }
    /* accordions */
    #accordion-1 > *, #accordion-2 > *, #accordion-3 > *, #accordion-4 > *, #accordion-5 > *, 
    #accordion-6 > *, #accordion-7 > *, #accordion-8 > *, #accordion-9 > *, #accordion-10 > *,
    #accordion-11 > *, #accordion-12 > *, #accordion-13 > *, #accordion-14 > *, #accordion-15 > *
    {display:block !important;}
    
    /* tabs */
    .ui-tabs-nav { display: none; }
    .ui-tabs .ui-tabs-hide { display: block !important; }
    .ui-tabs .ui-tabs-panel { display: block !important; }    
}