/* style.css */

body {
	margin: 0;
	padding: 0;
	background: #d8cfb8;
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-size: 12px;
	color: #333333;
}

a { color: #1d4f91; }
a:hover { color: #cc0000; }

#wrap {
	width: 960px;
	margin: 12px auto;
	background: #ffffff;
	border: 1px solid #9c9278;
}

/* header */
#header { height: 110px; background: #ffffff; border-bottom: 4px solid #1d4f91; position: relative; }
#logo { position: absolute; left: 18px; top: 24px; font-family: Arial, Helvetica, sans-serif; font-size: 30px; color: #1d4f91; letter-spacing: -1px; }
#logo a { color: #1d4f91; text-decoration: none; }
#logo span { display: block; font-family: Verdana, Arial, sans-serif; font-size: 12px; color: #595959; letter-spacing: 0; margin-top: 3px; }
#phone { position: absolute; right: 20px; top: 20px; text-align: right; font-family: Arial, Helvetica, sans-serif; }
#phone .l { font-size: 13px; color: #333333; font-weight: bold; }
#phone .n { font-size: 34px; font-weight: bold; }
#phone .n a { color: #cc0000; text-decoration: none; }

/* top menu */
#nav {
	background: #1d4f91;
	height: 32px;
	border-top: 1px solid #4f7fc0;
	border-bottom: 1px solid #0e2f5c;
}
#nav a {
	float: left;
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	font-size: 12px;
	padding: 0 18px;
	line-height: 32px;
	border-left: 1px solid #4f7fc0;
	border-right: 1px solid #0e2f5c;
}
#nav a:hover, #nav a.on { background: #cc0000; color: #ffffff; }

/* columns */
#main { float: left; width: 640px; padding: 16px 18px; }
#side { float: right; width: 250px; padding: 16px 14px 16px 0; }

h1 { font-family: Arial, Helvetica, sans-serif; font-size: 21px; color: #1d4f91; margin: 0 0 10px 0; }
h2 { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #cc0000; margin: 18px 0 6px 0; border-bottom: 1px dotted #bbbbbb; padding-bottom: 3px; overflow: hidden; }
h2 a { color: #cc0000; }
p { line-height: 1.6; margin: 0 0 10px 0; }
ul { margin: 4px 0 10px 0; padding: 0 0 0 20px; line-height: 1.7; overflow: hidden; }

img.l { float: left; margin: 2px 12px 6px 0; border: 1px solid #999999; padding: 3px; background: #f4f4f4; }
img.r { float: right; margin: 2px 0 6px 12px; border: 1px solid #999999; padding: 3px; background: #f4f4f4; }

table.chart { border-collapse: collapse; margin: 6px 0 12px 0; width: 100%; clear: both; }
table.chart th { background: #1d4f91; color: #ffffff; text-align: left; padding: 5px 8px; font-size: 12px; }
table.chart td { border: 1px solid #c9c0a6; padding: 5px 8px; }
table.chart tr.alt td { background: #f7f3e8; }

.bigphone { font-family: Arial, Helvetica, sans-serif; font-size: 28px; font-weight: bold; color: #cc0000; margin: 6px 0 14px 0; }
.bigphone a { color: #cc0000; text-decoration: none; }
.back { clear: both; padding-top: 6px; }

/* sidebar */
.call { background: #cc0000; color: #ffffff; text-align: center; padding: 10px; margin-bottom: 12px; border: 2px solid #990000; font-size: 13px; }
.call b { display: block; font-size: 22px; font-family: Arial, Helvetica, sans-serif; }
.call a { color: #ffffff; text-decoration: none; }
.call small { display: block; font-size: 11px; margin-top: 3px; }
.dash { border: 2px dashed #cc0000; padding: 10px; text-align: center; font-weight: bold; color: #990000; background: #fffbe6; margin-bottom: 12px; }
.box { border: 1px solid #c9c0a6; background: #f7f3e8; margin-bottom: 12px; }
.box h3 { margin: 0; background: #1d4f91; color: #ffffff; font-size: 12px; padding: 5px 8px; font-family: Arial, Helvetica, sans-serif; }
.box div { padding: 8px 10px; line-height: 1.8; }

#footer {
	clear: both;
	background: #eeeeee;
	border-top: 1px solid #cccccc;
	padding: 10px 18px;
	font-size: 11px;
	color: #555555;
	line-height: 1.7;
}
#footer a { color: #1d4f91; }

.mbar { display: none; }

@media (max-width: 760px) {
	#wrap { width: auto; margin: 0; border: 0; }
	#header { height: auto; padding: 12px; text-align: center; }
	#logo, #phone { position: static; text-align: center; }
	#logo { font-size: 22px; }
	#phone { margin-top: 8px; }
	#phone .n { font-size: 26px; }
	#nav { height: auto; text-align: center; padding: 4px 0; }
	#nav a { float: none; display: inline-block; padding: 0 9px; border: 0; line-height: 28px; }
	#main, #side { float: none; width: auto; padding: 12px; }
	img.l, img.r { float: none; display: block; margin: 0 auto 10px auto; max-width: 92%; height: auto; }
	.mbar { display: block; position: fixed; bottom: 0; left: 0; right: 0; background: #cc0000; border-top: 2px solid #990000; text-align: center; padding: 12px 0; }
	.mbar a { color: #ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; text-decoration: none; }
	body { padding-bottom: 54px; }
}
