﻿	
@media only screen and (max-width: 767px) {


		/* Editing controls */

		#s4-statusbarcontainer, .ms-siteactionsmenu {
			display:none;
		}

		/* END */


li.static > span > span > span {
	display:none !important;
}


	.cssMini {
		width: 100%;
	}

	#topThing, 
	#middleThing, 
	#leftThing {

	}

	body #s4-workspace, body #MSO_ContentTable {
		position: static;
	}
	
	#s4-bodyContainer {
		min-width: 320px !important;
	} 
	
	h1 {
		font-size: 200%;
		line-height: 1.125;
	}
	
	header {
		display: table;
		width: 100%;
	}
	
	#header {
		height: 55px;
		width: 100%;
		margin: 0;
		padding-top: 0;
		background: #6d034e;
	}
	
	#head_srch {
		display: block;
	}
	
	.ribbon-wrapper {
		display: none;
	}
	
	#main {
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6d034e), color-stop(20%,#6d034e), color-stop(21%,#ffffff), color-stop(100%,#ffffff));	
		background: linear-gradient(to bottom, #6d034e 0%,#6d034e 20%,#ffffff 21%,#ffffff 100%);
	}
	
	.ie-brTop {
		display: none;
	}
	
	.setWidth {
		width: 100%;
	}

	#topThing {
		min-height: 40px;
		margin-top: 0;

	}
	
	#helpYou {
		margin: -40px 0 -60px 0; /* todo border-bottom: 10px solid #6b9000; z-index: -1; */
	}
	
	#welcomeInfo {
		width: auto;
		padding-top: 0;
		padding-bottom: 0;
		margin-left: 0;
		margin-right: 0;
	}

	#footer {
		height: 250px;
		margin-left: 0;
		margin-right: 0;
	} 
	
	#footer .setWidth {
		padding-left: 0;
	}
	
	#foot_1 {
		min-width: 100%;
		vertical-align:bottom;
		margin-left: 0;
		margin-right: 0;
		border-bottom: 0;
	}
	
	#foot_2 {
	margin-left: 0;
	margin-right: 0;

	}
	
	#foot_2a {
		display: table-cell;
		min-width: 95%;
		margin: 0 2.5%;
	}

	#foot_2a p {
		margin-left: 2.5%;
	}
	

	#foot_1a {
		display:none;
	}

	#foot_1b {
		min-width: 100%;
	}

	div#foot_menu {
		min-width: 95%; 
		margin-left: 2.5%; 
		margin-right:2.5%; 
	}
	
	div#foot_menu ul {
		min-width:100% !important;
	} /* could use accurate specificity to overcome div#foot_menu ul, but this is prettier */
	
	div#foot_menu ul li {
		padding-bottom: 10px; 
		width:50%
	}
	
	.heroes h2, 
	.sidekicks h2 {
		color: #7D1F70; 
		font-size: 175%; 
		padding: 0; 
		line-height: 75px !important; 
		font-weight: bold;
	}
	
	.heroes, 
	.sidekicks {
		width: 100%; 
		margin: 0; 
		line-height: 60px; 
		display: block;
	}
		
	.heroes ul, 
	.sidekicks ul {
		width: 100%; 
		margin:0;
	}
	
	.heroes ul li,
	.heroes ul li.ButtonIcon,
	.heroes ul li.ChevronIcon,
	.heroes ul li.LockIcon, 
	.sidekicks ul li {
		height: 75px; 
		width: 95%; 
		margin: 0 2.5%; 
		border-top: 1px solid #b9b9b9; 
		background: white;
		text-indent: 0;
	}

	.sidekicks ul li:last-child {
		border-bottom: 
	}
	
	.heroes ul li:first-child {
		border-top: none;
	}
	
	.heroes ul li p, 
	.sidekicks ul li p {
		display: none;
	}
	
	.heroes ul li a:hover, 
	.sidekicks ul li:hover {
		background: #88a433; 
		background: -webkit-linear-gradient(top, #bada55 0%,#839d33 44%,#577b25 100%); 
		background: linear-gradient(top, #bada55 0%,#839d33 44%,#577b25 100%); 
	}
	
	
	#contentWrap {
		padding: 0; 
		border-radius: 0;
		margin-top: 0;
	}
	
	/* homepage overrides for social media links panel (it's not a menu) */
	#contentWrap.cpuHome #leftThing {
		width: 95%;
		margin: 0 2.5%;
		position: relative;
		top: auto;
		z-index:auto;
		background: transparent;
		-webkit-transform: none;
		-webkit-transition: none;
		-ms-transform: none;
		-ms-transition: none;
		transform: none;
		transition: none;	
	}
	
	#helpYou {
		padding: 0 16px;
	}
	
	.sidekicks ul {
		border-top: 0px;
	}
	
	.sidekicks ul li:first-child {
		border-top: 1px solid #b9b9b9;
	}
	
	.heroes, 
	.sidekicks {
		line-height: inherit;
	}
	
	.heroes ul li, 
	.sidekicks ul li {
		padding: 0; 
	}
	
	.sidekickTitle {
		display: none;
	}
	
	.navBurger {
		font-family: computershareSymbols !important;
		font-size: 33px;
		line-height: 44px;
		color: #fff !important;
		width: 44px;
		margin-left: 2.5%;
		display: inline-block !important;
	}
		
	#navBurgerGlobal {
		float: right;
	}
	
	#navBurgerLocal {
		-webkit-transition: all 0.333s 0.125s ease-in-out;
		transition: all 0.333s 0.125s ease-in-out;
		color: #739600;
	}
	
	#navBurgerClose {
		position: fixed;
		top: 5px;
		right: 0;
	}
	
	/* logo override, yucky but it works */
	#head_1a img {
		display:none;
	}

	/* other misc overrides for the SP sledgehammer HTML editor 
	   heavy-handedly assigns width where width attribute is present and not blank */
	
    /* for image carousels */   
	div.slide {
		margin: 0;
	}

	#middleThing img {
		max-width: 100%;
	}


	img[width]:not([width=""]) {
		width: auto !important;
		height: auto !important;
		max-width: 100%;	
	}	

	iframe {
		width: auto !important;
	}

	table[width]:not([width=""]) {
		width: 100%;
	}

	table[style*="width"] {
		width: 100% !important;
	}

	th[width]:not([width=""]),
	td[width]:not([width=""]),
	th[style*="width"],
	td[style*="width"] {
		width: auto !important;
	}

	#head_1a {
		background-size: 140px 26px;
		background-position-y: 13px;
		width: 100%;
		padding-right: 0;
		vertical-align: middle;
	}	
		
	#head_1b {
		display: block;
		position: absolute;
		height: auto;
		width: auto;
		min-width: 221px; /* same as search box */
		top: 80px;
		left: 0;
		z-index: -100;
		text-align: left;
		margin: 0 20px;			
		opacity: 0;
	}
	
	#head_1b {
		font-size: 1.2em;
	}
	
	#head_1b span {
		display: none;
	}
	
	#head_2 {
		height: auto;
	}
	
	#head_2a {
		display: none;
	}
	
	#head_2b a.static.menu-item {
		text-align: left;
		width: 100%;
		line-height: 40px;
		font-size: 16px;
		padding: 0;
	}
	
	#head_2b {
		display: block;
		position: absolute;
		top: 120px;
		left: 0;
		right: 20px; /* faux margin */
		z-index: -100;
		border-top: none;
		opacity: 0;
	}
	
	#head_menu {
		width: 100%;
		min-width: 221px; /* same as search box below it */
 		padding-bottom: 30px;
	}
	
	#head_menu li.static > a:link,
	#head_menu li.static > a:visited {
		color: #fff;
	}
	
	#head_menu li.static > a:hover,
	#head_menu li.static > a:active {
		color: #739600;
	}
	
	div#head_menu ul.dynamic {
		max-width: 100%;
		padding: 0; 
		box-shadow: none;
		max-width: 100%;
		margin-top: 0;
		line-height: 45px;
	}
	
	div#head_menu ul li.dynamic {
		width: 100%;
	}
	
	.menu-horizontal li.static {
		float: none;  /* conga line */
	}

	#head_srch {
		float: none;
	}
	
	#foot_1a {
		display: none;
	}
	
	#leftThing {
		width: 100%;
		position: absolute;
		top: 55px;
		z-index: 100;
		background: #3a3a3a;
		-webkit-transform: translate(-100%, 0px);
		-webkit-transition: all 0.5s ease-in-out;
		-ms-transform: translate(-100%, 0px);
		-ms-transition: all 0.5s ease-in-out;
		transform: translate(-100%, 0px);
		transition: all 0.5s ease-in-out;
	}
	
	#middleThing {
		width: 95% !important; 
		margin: 0 2.5%; 
	}
	
	#topThing h1 {
		margin-bottom: 15px;
	}
	
	#topThing h1.withNav,
	#topThing h1.noNav {
		margin-left: 2.5%;
	}
	
	#rightThing {
		float: none;
		height: auto;
		width: auto;
		margin: 0 2.5%;
		overflow-y: initial;	
	}
	
	.rightContent {
		width: auto !important;
	}
	
	#ctl00_PlaceHolderMain_breadCrumb {
		display: none;
	}
	
	/* search box improvements */
	input.ms-sbplain {
		zoom:133%;
		font-family: inherit;
	}
		
	.s4-search input.ms-sbplain {
	width:100% !important;
	border: none;
	font-style: normal;
	font-family: inherit;
	}
		
	.s4-search .srch-gosearchimg {
	-webkit-filter:grayscale(100%);
	filter: grayscale(100%);
	height: 26px;
	width: 26px; /*webkit bug won't zoom on this */
	background-color: #fff;
	}
	
	/* nav status stuff in this big ol' bucket here */
	
	#globalNavBg {
		position: absolute;
		top: 0;
		bottom: 0; /* REVIEW - might be a better way */
		left: 0;
		right: 0;
		overflow: hidden;
		z-index: -100;
		background: rgba(0,0,0,0.85);
		-webkit-transition: all 0.333s ease-in-out;
		transition: all 0.333s ease-in-out;
		opacity: 0;
	}
	
	html.revealGlobalNav #globalNavBg {
		z-index: 150;
		opacity: 1;
	}
	
	html.revealGlobalNav #head_1b,
	html.revealGlobalNav #head_2b {
		z-index:200;
		opacity: 1;
		-webkit-transition: opacity 0.333s 0.5s ease-in-out;
		transition: opacity 0.333s 0.5s ease-in-out;
	}
	
	html.revealGlobalNav #head_2b a.static.menu-item {
		font-size: 20px;
		border-bottom: 1px solid #666
	}
	
	html.revealGlobalNav,
	html.revealGlobalNav body,
	html.revealLocalNav,
	html.revealLocalNav body {
		overflow: hidden;
		position: relative;
	}
	
	html.revealLocalNav #leftThing {
		-webkit-transform: translate(0px, 0px);
		-ms-transform: translate(0px, 0px);
		transform: translate (0px, 0px);
		overflow: scroll;
		-webkit-overflow-scrolling: touch; 
	}
		
	.menu li.hover ul, .menu li.hover-off ul {
		display: none;
	}


	.s4-tn li.static > .menu-item {
		min-height: 40px;
		line-height: 40px;
		font-size: 1.2em;
	}

	table[style="width:800px"]{
		width:85% !important;
	}

	div[style="width:800px;"]{
		width:85% !important;
	}

} /* end @media 319-767 */

@media only screen and (width: 768px) {
/* vertical ipad adjustment for 1000px width - it's not pretty but it works */
	body {
		width: auto;
		zoom: 76.8%;
	}
	
}






