/* Responsive layout for Orange Psychiatric Medical Group.
   Loaded after opstyle.css. Desktop layout (>= 992px) is unchanged. */

@media (max-width: 991px) {
	body {
		min-width: 0;
	}

	.container {
		width: auto;
		max-width: 950px;
		padding: 0 16px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		border-left: 0;
		border-right: 0;
	}

	/* Blueprint's fixed-width columns become full-width blocks. */
	[class*="span-"] {
		float: none !important;
		width: auto !important;
		margin-right: 0 !important;
	}
	[class*="prepend-"] {
		padding-left: 0 !important;
	}
	[class*="append-"] {
		padding-right: 0 !important;
	}

	img {
		max-width: 100%;
		height: auto;
	}
	.imgleft,
	.imgright {
		float: none;
		display: block;
		margin: 0 0 14px 0;
	}

	/* Header and navigation. */
	.top-pad {
		padding-top: 16px;
	}
	.top-pad2,
	.top-pad3,
	.pad40,
	.pad50,
	.pad60,
	.pad70,
	.pad80,
	.pad90,
	.pad110 {
		padding-top: 0;
	}

	.menu {
		margin-bottom: 8px;
	}
	.menu ul {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.menu ul li {
		float: none;
		display: block;
	}
	.menu ul li a {
		display: block;
		float: none;
		padding: 12px 10px;
		font-size: 15px !important;
		text-align: left;
		border-bottom: 1px solid #e6e6e6;
	}
	#a a {
		background-image: none !important;
	}
	.menu ul li a:hover,
	.menu ul li a.activemenu {
		background-color: #f7f7f7 !important;
	}

	.txt-rit,
	.staff-title {
		text-align: left !important;
	}

	hr.space28 {
		height: 18px;
	}
	hr.line25 {
		margin-bottom: 14px;
	}
	.footer {
		padding: 32px 0 20px;
		font-size: 14px;
	}
}

/* Tablet header: logo on the left, horizontal menu on the right,
   matching the original desktop arrangement. */
@media (min-width: 640px) and (max-width: 991px) {
	.container > .span-10.top-pad {
		float: left !important;
		width: 38% !important;
		margin-right: 0 !important;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.container > .span-10.top-pad img {
		display: block;
		width: 100%;
		max-width: 320px;
		height: auto;
	}
	.container > .span-10.top-pad + .span-14.last {
		float: right !important;
		width: 62% !important;
		margin-right: 0 !important;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.container > .span-10.top-pad + .span-14.last .menu {
		margin-top: 20px;
	}
	.menu ul {
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
	}
	.menu ul li a {
		padding: 10px 6px;
		font-size: 13px !important;
		border-bottom: 0;
	}
}

@media (max-width: 520px) {
	.menu ul li a {
		padding: 10px 8px;
		font-size: 14px !important;
	}
}