@font-face {
	font-family: 'Museo Sans';
	src: url('../fonts/museosans-100-webfont.eot');
	src: url('../fonts/museosans-100-webfont.eot') format('embedded-opentype'), url('../fonts/museosans-100-webfont.woff') format('woff'), url('../fonts/museosans-100-webfont.ttf') format('truetype'), url('../fonts/museosans-100-webfont.svg#MuseoSans100') format('svg');
	font-weight: 100;
	font-style: normal;
}

@font-face {
	font-family: 'Museo Sans';
	src: url('../fonts/museosans-300-webfont.eot');
	src: url('../fonts/museosans-300-webfont.eot') format('embedded-opentype'), url('../fonts/museosans-300-webfont.woff') format('woff'), url('../fonts/museosans-300-webfont.ttf') format('truetype'), url('../fonts/museosans-300-webfont.svg#MuseoSans300') format('svg');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: 'Museo Sans';
	src: url('../fonts/museosans_500-webfont.eot');
	src: url('../fonts/museosans_500-webfont.eot') format('embedded-opentype'), url('../fonts/museosans_500-webfont.woff') format('woff'), url('../fonts/museosans_500-webfont.ttf') format('truetype'), url('../fonts/museosans_500-webfont.svg#MuseoSans500') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Museo Sans';
	src: url('../fonts/museosans_700-webfont.eot');
	src: url('../fonts/museosans_700-webfont.eot') format('embedded-opentype'), url('../fonts/museosans_700-webfont.woff') format('woff'), url('../fonts/museosans_700-webfont.ttf') format('truetype'), url('../fonts/museosans_700-webfont.svg#MuseoSans700') format('svg');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: 'Museo Sans';
	src: url('../fonts/museosans_900-webfont.eot');
	src: url('../fonts/museosans_900-webfont.eot') format('embedded-opentype'), url('../fonts/museosans_900-webfont.woff') format('woff'), url('../fonts/museosans_900-webfont.ttf') format('truetype'), url('../fonts/museosans_900-webfont.svg#MuseoSans900') format('svg');
	font-weight: 900;
	font-style: normal;
}

@media screen {
	#page {
		max-width: 980px;
	}
	.logged-in.member-area #page {
		max-width: 1240px;
	}
}
@media screen and (min-width: 1000px) {
	.hidden-md {
		display: none !important;
	}
	.logo-image {
		position: relative;
		top: -15px
	}
}
@media screen and (max-width: 999px) {
	body {
		background-color: #fff;
	}
	
	.displaymobile {
		display: inline;
	}
	
	#page {
		padding: 0;
		background: none;
	}
	
	#header {
		height: auto;
		display: -webkit-box;
		display: -moz-box;
		display: block;
		-webkit-box-orient: vertical;
		-moz-box-orient: vertical;
		box-orient: vertical;
	}
	
	#header .logo {
		position: relative;
		left: 0;
		text-align: left;
		-webkit-box-ordinal-group: 2;
		-moz-box-ordinal-group: 2;
		box-ordinal-group: 2;
		padding: 0 0 15px 10px;
		top: -10px;
	}
	
	#header .menu .main-menu-trigger  {
		display: block;
	}
	
	#header .menu {
		position: relative;
		top: 0;
		right: 0;
		-webkit-box-ordinal-group: 1;
		-moz-box-ordinal-group: 1;
		box-ordinal-group: 1;
	}
	
	#header .menu > ul {
		display: none;
		padding: 15px 0 5px;
	}
	
	#header .menu > ul > li {
		float: none;
		font-size: 17px;
		font-style: normal;
		text-transform: uppercase;
	}
	
	#header .menu > ul > li > a {
		padding: 10px 10px 10px 42px;
		font-family: "Museo Sans";
		color: #333;
	}
	#header .menu > ul > li a img {
		margin-left: -32px;
	}
	
	#header .menu2 {
		display: none;
	}
	
	/* Member Menu */
	.member-menu-toggle {
		display: block;
	}
	.memberMenu {
		background: none;
		margin: 0 0 25px !important;
		height: auto !important;
		display: none;
	}
	.memberMenu a {
		display: block;
	}
	.memberMenu > ul {
		width: 100% !important;
		padding: 0 !important;
	}
	
	.memberMenu > ul li {
		display: block;
	}
	
	.logged-in .memberContainer #content > h1 {
		margin-bottom: 0 !important;
		font-size: 22px;
		padding-left: 0;
	}
	
	.memberMenu .menu-item ul.sub-menu {
		position: relative;
		top: 0;
		visibility: visible;
	}
	
	.memberMenu > ul > li.current-menu-item,
	.memberMenu > ul > li.current-menu-parent,
	.memberMenu > ul > li.current-page-ancestor {
		margin-top: 0;
		padding-top: 0;
	}
	.memberMenu li li {
		height: auto;
		line-height: 1;
	}
	.memberMenu li li a {
		line-height: 1;
	}
}

@media screen and (max-width: 979px) {
	.banner {
		padding: 0px;
		height: auto;
	}
	#page {
		background: none;
	}
	.banner > .alignright {
		width: calc(100% - 260px);
		position: relative;
	}
	#sidebar {
		width: 200px;
	}
	#content {
		max-width: 100%;
	}
	.member-area #content {
		max-width: none;
	}
	#content.login-content > .left,
	#content.login-content > .right {
		float: none !important;
		margin-left: auto;
		margin-right: auto;
	}
	#content h1 {
		width: auto;
	}
	#content .column {
		width: 45%;
		padding: 10px;
	}
	#content table#wp-calendar {
		width: 230px !important;
	}
	#content table {
		height: auto !important;
		width: 100% !important;
		display: block;
		overflow-x: auto;
	}
	.buckets {
		float: none;
	}
	.buckets li {
		width: 29%;
	}
}

@media screen and (max-width: 799px) {
	/* sfgov menu */
	#sf_header {
		display: none;
		width: 100%;
	}
	.sfgov-menu {
		display: none;
		margin-top: 5px;
	}
	
	.sfgov-menu li {
		padding: 0;
	}
	
	.sfgov-menu li a {
		color: #003F6C;
		font-size: 17px;
		font-weight: bold;
		font-family: sans-serif;
	}
	
	.mobile-logo {
		display: inline-block !important;
		float: left;
		margin: 10px 0 0px 10px;
		position: relative;
		z-index: 2;
	}
	
	.mobile-logo img.hide {
		display: inline;
	}
	
	.mobile-logo img.show {
		display: none;
	}
	
	.top_links {
		width: 100%;
		background: none;
		padding: 15px 0 0;
		border-top: 2px solid #0395d7
	}
	
	.top_links a {
		margin-right: 15px;
	}
	
	.top_links a span {
		color: #0f9ad9;
	}
}

@media screen and (max-width: 767px) {
	#sidebar {
		float: none;
		width: auto;
	}
	#sidebar .bucket {
		float: left;
		width: 230px;
		margin-right: 20px;
	}
	#content {
		background: none;
		max-width: none;
	}
}

@media screen and (max-width: 600px) {
	#content .column {
		float: none;
		width: auto;
	}
}

@media screen and (max-width: 480px) {
	
	/* Bullets in table */
	table img {
		min-width: 25px;
	}
	
	.banner {
		padding: 0px;
		height: auto;
	}

	.banner > .alignleft {
		width: 88%;
		margin: -8px auto 0 7px;
		border: none;
		padding-top: 27px !important;
	}

	.banner .login .login_links {
		font-size: 13px;
		line-height: 1.5;
	}

	.banner .login input[type=image],
	.banner .login input[type=hidden] {
		position: relative;
		left: 10px;
	}

	.banner .login {
		width: 100%;
	}

	.banner .login h2 {
		margin-bottom: 10px;
		width: 103%;
	}

	.banner .login h2 a {
		float: right;
	}

	.banner .login input[type=text],
	.banner .login input[type="password"] {
		width: 100%;
		height: 35px;
	}

	.banner .search {
		width: 106%;
	}

	.banner .search h2 a {
		float: right;
		margin-right: 11px;
	}

	.banner .search input[type=text] {
		width: 75%;
		height: 35px;
	}

	.banner .search input[type=image] {
		width: 44px;
		height: 35px;
	}

	.banner > .alignright {
		display: none;
	}

	.home #sidebar {
		display: none;
	}

	#sidebar .mobile-about {
		display: block;
	}

	#sidebar {
		display: block;
		width: 96%;
	}

	#sidebar .subpages {
		margin-bottom: 0;
	}

	#sidebar .subpages ul {
		display: none;
	}

	#content {
		background: none;
	}

	#content h2 {
		font-size: 15px;
	}

	#content ul.events h3,
	#content ul.announcements h3 {
		font-size: 15px;
	}

	#content .column {
		float: none;
		width: 100%;
	}

	/*#content ul, #content ol {padding-left:0;}*/
	#content ul.events {
		margin-bottom: 20px;
	}

	#content h1 {
		width: inherit;
		height: auto;
	}

	#content ul.thumbnails li {
		width: 200px;
		height: 186px;
		margin: 0 2px 20px;
	}

	#content ul.thumbnails li h3 {
		width: 200px;
		font-size: 12px;
		padding: 3px 0;
	}

	#content ul.thumbnails li img {
		width: 200px;
		height: 186px;
	}

	.wpcf7 input {
		min-height: 35px;
	}

	.alignleft, .alignright {
		float: none;
	}

	.quick_links {
		width: 100%;
	}

	.quick_links a {
		font-size: 14px;
	}

	.quick_links .alignright {
		width: 100%;
		padding: 0;
	}

	.quick_links .alignright li {
		float: none;
	}

	.partners {
		width: 100%;
		height: auto;
		padding: 10px 0;
	}

	.partners ul {
		width: 90%;
		margin: auto;
	}

	.partners li {
		margin-right: 2px;
	}

	.partners li img {
		height: 50px;
		margin: 0;
		height: 45px;
	}

	.container_bottom .copyright {
		/*width: 95%;*/
		background: none;
	}

	.banner {
		width: 100%;
	}

	.banner .why-register {
		width: 200px;
		margin: auto;
	}

	.buckets {
		background: none;
	}

	.buckets ul {
		width: 85%;
		margin: auto;
	}

	.buckets li {
		width: 100%;
		margin: 10px 0 0 -6px !important;
		padding: 10px 0;
		border: 5px solid #eee;
	}

	.buckets li h2 {
		font-size: 17px;
		text-align: center;
	}

	.buckets li p {
		font-size: 15px;
	}

	.quick_links .alignleft {
		margin: auto;
	}

	.quick_links .alignright ul {
		width: 83%;
		padding: 25px;
	}

	.quick_links .alignright li {
		width: 100%;
		padding: 3px 0;
	}

	.w450 {
		width: 100% !important;
	}

	.w450.right {
		-webkit-box-ordinal-group: 2;
		-moz-box-ordinal-group: 2;
		box-ordinal-group: 2;
		float: none !important;
		margin-top: 30px;
		margin-left: 0;
		padding: 0;
	}

	.w450.left {
		-webkit-box-ordinal-group: 1;
		-moz-box-ordinal-group: 1;
		box-ordinal-group: 1;
		float: none !important;
		margin-top: 30px;
		margin-left: 0;
		padding: 0;
	}

	.logged-in #content h1 {
		display: block;
		font-size: 19px;
	}

	.logged-in .w450.left {
		-webkit-box-ordinal-group: 1;
		-moz-box-ordinal-group: 1;
		box-ordinal-group: 1;
	}

	.logged-in .w450.right:nth-child(2) {
		-webkit-box-ordinal-group: 2;
		-moz-box-ordinal-group: 2;
		box-ordinal-group: 2;
		margin-top: 15px;
	}

	.logged-in #content.dashboard .clear.underline {
		-webkit-box-ordinal-group: 3;
		-moz-box-ordinal-group: 3;
		box-ordinal-group: 3;
	}

	.logged-in #content.dashboard h2 {
		-webkit-box-ordinal-group: 4;
		-moz-box-ordinal-group: 4;
		box-ordinal-group: 4;
	}

	.logged-in #content.dashboard .member-footer-links {
		-webkit-box-ordinal-group: 5;
		-moz-box-ordinal-group: 5;
		box-ordinal-group: 5;
	}

	.logged-in #content.dashboard p {
		-webkit-box-ordinal-group: 6;
		-moz-box-ordinal-group: 6;
		box-ordinal-group: 6;
	}

	.logged-in.page-template-page-member-calculator-php .memberContainer #content {
		padding: 0 !important;
	}

	.memberContainer #content {
		padding: 0 !important;
		display: -webkit-box;
		display: -moz-box;
		display: box;
		-webkit-box-orient: vertical;
		-moz-box-orient: vertical;
		box-orient: vertical;
	}

	.memberContainer #content h1 {
		margin-top: 20px;
	}

	.memberContainer #content h3 {
		font-size: 14px !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
		padding-left: 0 !important;
	}

	.memberContainer .banner {
		display: none;
	}

	.memberContainer #content input[type="text"], .memberContainer #content input[type="password"] {
		width: 97% !important;
		height: 35px !important;
		font-size: 12px;
	}

	.page-template-page-login-php .memberContainer select {
		width: 100% !important;
		height: 35px !important;
	}

	#loginForm {
		height: 200px;
	}

	#loginForm .left {
		width: 100% !important;
		height: 165px !important;
	}

	.memberContainer form {
		font-size: 12px;
	}

	.memberContainer form.dark#loginForm fieldset {
		height: 168px;
	}

	.memberContainer form.dark fieldset {
		padding: 0 10px;
	}

	.page-id-1763 .container_bottom {
		height: 50px;
	}

	.memberContainer form.dark {
		padding: 0 !important;
	}

	.memberContainer form.dark#loginForm a {
		font-size: 13px !important;
		position: relative;
		top: -38px;
		line-height: 1.5 !important;
	}

	.page-id-2166 .memberContainer .banner {
		display: block;
		height: 100px;
	}

	.page-id-2166 .memberContainer .banner .memberType {
		position: relative;
		bottom: -16px;
		right: 0;
		float: right;
	}

	.memberContainer .banner h1 {
		font-size: 27px !important;
		padding-top: 15px !important;
	}

	.memberContainer #content form#calcForm #calculate {
		width: 100% !important;
	}

	#content.dashboard h2 {
		margin-top: 20px;
	}

	#content p {
		margin: 20px 0;
		font-size: 14px;
	}

	#footer .footer_ctn {
		width: 100%;
	}
}

@media screen and (max-width: 450px) {
	#content ul.thumbnails li {
		width: 180px;
		height: 168px;
	}

	#content ul.thumbnails li h3 {
		width: 180px;
		font-size: 11px;
	}

	#content ul.thumbnails li img {
		width: 180px;
		height: 168px;
	}
}

@media screen and (max-width: 360px) {
	.banner > .alignleft {
		width: 85%;
		margin: -8px auto 0 5px;
	}

	.banner .search input[type=text] {
		width: 79%;
	}

	#content ul.thumbnails li {
		width: 135px;
		height: 123px;
	}

	#content ul.thumbnails li h3 {
		width: 135px;
		font-size: 10px;
	}

	#content ul.thumbnails li img {
		width: 135px;
		height: 123px;
	}
}