/* all pages */
body  {
	background:#ccc;
	font:12px verdana,sans-serif;
	margin:1px;
}
img { border:none; }

div#above {
	background: url(../simg/grd_blue_top.jpg) top;
	background-repeat: repeat-x;
	background-color:#fff;
}
div#below {
	background: url(../simg/grd_blue_btm.jpg) bottom;
	background-repeat: repeat-x;
	background-color:#fff;
}
div#mainpage {
	width:800px;
	margin-right:auto;
	margin-left:auto;
	padding:0px;
	border:1px solid #aaa;
	color:#444;
	background-color:#fff;
}
div#maincontent {
	width:700px;
	margin-right:auto;
	margin-left:auto;
}
p {
	text-align:justify;
}

/* general content */
div.image {
	text-align:center;
	font-style:italic;
}
div.image img, div.teachers img {
	padding:3px;
	border:1px solid #ccc;
	margin-bottom:8px;
}
div.image h4 {
	font-style:normal;
	margin:0 0 3px 0;
}
div.gallery img {
	margin-bottom:0;
}

/* image gallery */
table.drawalbums img, table.drawimgs img {
	padding:3px;
	border:1px solid #ccc;
}

/* paging */
div.paging {
	float:right;
	margin:3px;padding:2px;
}
div.paging a, div.paging span.current {
	margin:0px 2px 0px 2px;
	border:1px solid #ccc;
	padding:2px 4px 2px 4px;

	background:#eee;
	color:#333;
}
div.paging span.current {
	line-height:200%;
	background:#888;
	border-color:#aaa;
	color:#fff;
}


/* headings */
div.h {
	text-align:center;
	margin:15px 0 10px;
}


/* header */
div#banner {
	padding:3px;
	width:700px;
	margin:auto;
}
div#banner .left {
	float:left;
	background: url(../simg/aikiwave.gif) no-repeat bottom;
	height:125px;
	width:113px;
}
div#banner .mid {
	margin:auto;
	background: url(../simg/aikidomonterey.jpg) no-repeat bottom;
	height:125px;
	width:353px;
}
div#banner .right {
	float:right;
	background: url(../simg/AOMlogo2_113.jpg) no-repeat bottom;
	height:125px;
	width:113px;
}

/* header nav bar */
div#topnavbar {
	background-color:#676799;
	padding:4px;
	text-align:center;
	margin-bottom:10px;
}
.dropmenudiv {
	position:absolute;
	z-index:100;
	visibility: hidden;
	border:1px solid #aaa;
}

/* different margins for different browsers because ie sucks... */
.dropmenudiv {
	margin:0px 0px 0px 0px;
}
* html .dropmenudiv { /* IE6/5.5 only. */
	margin:1px 0px 0px 1px;
}
*+html .dropmenudiv { /* IE7 rule only */
	margin:1px 0px 0px 1px;
}

.topnavlinks,.topnavlinks_last,.dropmenudiv a {
	background-color:#676799;
	color:#fff;
	font-size:11px;
	text-decoration:none;
	padding:3px 15px 3px 15px;
}
.topnavlinks:hover,.topnavlinks_last:hover,.dropmenudiv a:hover {
	background-color:#8989aa;
	text-decoration:none;
	color:#0bfaff;
}
.topnavlinks,.topnavlinks_last {
	font-weight:bold;
	border-left:1px solid #aab;
}
.topnavlinks_last {
	border-right:1px solid #aab;
}
.dropmenudiv a {
	display:block;
	padding:3px 15px 3px 15px;
	border-bottom:1px solid #888;
}

/* general teachers */
div.teachers {
	background: url(../simg/hr_grad.jpg) no-repeat top center;
	margin:15px auto 0px auto;
	padding:15px 0px 0px 0px;
	width:600px;
}
div.teachers img {
	margin:5px 10px 10px 0px;
	float:left;
}
div.teachers h2 {
	font-size:14px;
	font-weight:bold;
}

/* rounded corners
 * use: <span class='corners-top'><span></span></span> */
span.corners-top {
	background-image:url(../simg/corners_left.png);
	background-position:0 0;
	background-color:#d7d9e5;
}
span.corners-top span {
	background-image:url(../simg/corners_right.png);
	background-position:100% 0;
}

span.corners-bottom {
	background-image:url(../simg/corners_left.png);
	background-position:0 100%;
	background-color:#d7d9e5;
	clear:both;
}
span.corners-bottom span {
	background-image:url(../simg/corners_right.png);
	background-position:100% 100%;
}

span.corners-top, span.corners-bottom, span.corners-top span, span.corners-bottom span {
	background-repeat:no-repeat;
	display:block;
	height:5px;
}
.topbar {
	background-color:#d7d9e5;
	padding:0px 5px 5px 5px;
	text-align:center;
	color:white;
	font-weight:bold;
}
.videopanel {
	background-color:#d7d9e5;
	padding:0px 5px;
	width:310px;
}

.grad {
	background:url(../simg/grd_ltblue_top.png) repeat-x scroll 0 0;
}

/* other */

a {
	text-decoration:none;
	color:red; 
}
a:hover {
	text-decoration:underline;
}
p {
	font-size:12px;
}
td {
	font-size:12px;
	align:center;
}
h2 {
	color:#338;
	text-align:center;
	font-size:18px;
}
h3 {
	color:#338;
	font-size:13px;
	font-weight:bold;
}
dt {
	font-weight:bold;
}

.navbar {
	border:1px solid #CFD2F3;
	padding:1px;
	background-color:#CFD2F3;
	text-align:center;
	padding:0px;
	font-weight:bold;
}
.navtext {
	font: 10px 'Lucida Grande', Geneva, Verdana, Arial, sans-serif;
	text-transform:uppercase;
}
.navlinks {
	color:#000040;
}

.contact {
	border-top:1px solid #676799;
	font-size:10px;
	text-align:center;
}
.contacttitles {
	color:#000000;
	font-weight:bold;
}
.foot  {
	font-size:10px;
	text-align:center;
}
div.artofpeace_outer {
	width:700px;
	margin:10px auto;
}
.artofpeace {
	font-size:12px;
	text-align:center;
}
.artofpeace_head {
	border-color:#000080;
	background-color:#CFD2F3;
	color:#000000;
	font-weight:bold;
	text-align:center;
}

table.schedule {
	border-color:#aaa;
	border-collapse:collapse;
	font-size:8px;
	font-weight:bold;
	text-align:center;
}
.schedule_toprow {
	background-color:#000080;
	color:#ffffff;
	text-align:center;
	font-weight:bold;
	font-size:10px;
}
.schedule_timeframe {
	font-size:10px;
	text-align:left;
	background-color:#cccccc;
	text-transform:uppercase;
}
.schedule_general {
	background-color:#CCCCFF;
	font-size:10px;
}
.schedule_all {
	background-color:#00CC99;
	font-size:10px;
}
.schedule_inter {
	background-color:#9999FF;
	font-size:10px;
}
.schedule_kids {
	background-color:#0000FF;
	color:#ffffff;
	font-size:10px;
}
.schedule_advanced {
	background-color:#000000;
	color:#ffffff;
	font-size:10px;
}
.schedule_time {
	font-weight:normal;
	text-align:right;
	color:#000000;
	font-size:10px;
	padding-right:5px;
}

.fees_table {
	border-color:#000000;
	border-collapse:collapse;
	font-size:8px;
	text-align:center;
}
.fees_toprow {
	border-color:#000000;
	background-color:#000080;
	color:#ffffff;
	font-weight:bold;
	text-align:center;
}
.fees_desc {
	border-color:#000000;
}

.glossary_table {
	border-collapse:collapse;
	font-size:12px;
}
.glossary_letters {
	text-align:center;
	font-size:16px;
}
.glossary_word {
	vertical-align:top;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
}
.glossary_pron {
	vertical-align:top;
	font-size:12px;
	font-style:italic;
}
.glossary_defin {
	vertical-align:top;
	font-size:12px;
}

.event {
	font-size:14px;
}

.aboutaikido {
	text-align:justify;
}
.justify {
	text-align:justify;
}
.faqtop { text-transform:uppercase;border-top:1;font-style:underline;font-size:8px; }

.border { border:1px solid #CFD2F3;padding:4px; }
.hr { border-top:1px solid #CFD2F3;padding:1px; }

.borderin {	border-width: 1px;border-color:#CFD2F3;border-style: solid;padding: 6px; }
.newsletter { border:3px outset #CFD2F3;padding: 10px; }
















/* get rid of those system borders being generated for A tags */
a:active { outline:none;  }

:focus { -moz-outline-style:none; }





/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 614px;
	height:54px;

	/* custom decorations */
	border:0px;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

.items div {
	float:left;
}

/* single scrollable item */
.scrollable img {
	float:left;
	margin:0px 0px 0px 7px;
	background-color:#fff;
	padding:1px;
	border:1px solid #ccc;
	width:50px;
	height:50px;
	
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}

/* active item */
.scrollable .active {
	border:1px solid #000;
	position:relative;
	cursor:default;
}





/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(../simg/hori_small.png) no-repeat;
	display:block;
	width:15px;
	height:15px;
	float:left;
	margin:15px 13px;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right			{ background-position: 0 -15px; clear:right; margin-right: 0px;}
a.right:hover	{ background-position:-15px -15px; }
a.right:active	{ background-position:-30px -15px; } 


/* left */
a.left			{ margin-left: 15px; } 
a.left:hover	{ background-position:-15px 0; }
a.left:active	{ background-position:-30px 0; }

/* up and down */
a.up, a.down		{ 
	background:url(../simg/vert_large.png) no-repeat; 
	float: none;
	margin: 5px 25px;
}

/* up */
a.up:hover		{ background-position:-15px 0; }
a.up:active		{ background-position:-30px 0; }

/* down */
a.down			{ background-position: 0 -15px; }
a.down:hover	{ background-position:-15px -15px; }
a.down:active	{ background-position:-30px -15px; } 


/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	







/* styling for the image wrapper  */
	#image_wrap {
		/* dimensions */
		width:677px;
		margin:15px 0 15px 40px;
		padding:15px 0;

		/* centered */
		text-align:center;

		/* some "skinning" */
		background-color:#efefef;
		border:2px solid #fff;
		outline:1px solid #ddd;
		-moz-ouline-radius:4px;
	}

#social { text-align:right; }
iframe.twitter-share-button { float:right;margin:0 0 0 5px; }