/*   Web design by Jarret Cooper   */
/*   Version 12.10.2008   */
/*   Copyright 2008 TMAI Traditional Martial Arts International   */




/*    TOP ELEMENTS   */

html
{ height: 100%; }

body 
{ margin: auto;  float: center;  height: 100%; 
align: center;  vertical-align: top;  
font-family: arial, helevetica, verdana, tahoma, sans-serif;  
color: #333333;  
font-size: 12px;  
background: url(images/background-goldshaded.jpg);  
background-position: top center;  
background-color: #A57D50;  
margin: 0px;  padding: 0px; border: 0px;  }




/*    TYPOGRAPHY   */

p, ul, ul li, h1, h2, h3 
{ font-family: arial, helevetica, verdana, tahoma, sans-serif;  
color: #333333;  
font-size: 12px;    
letter-spacing:  0.04em; 
line-height: 1.3em;  }

h1
{ color: #990000;
font-size: 1.7em;
font-weight: bold; 
letter-spacing:  0.1em; 
line-height: 1.4em;  }

h2
{ color: #990000;
font-size: 1.4em;
font-weight: bold; 
letter-spacing:  0.1em; 
line-height: 1.4em;  }

h3
{ color: #444444;
font-weight: bold; 
font-size: 1.1em;
letter-spacing:  0.04em; 
line-height: 1.3em;  }

h4
{ color: #444444;
font-style: italic; 
font-weight: bold; 
font-size: 1.1em;
letter-spacing:  0.04em; 
line-height: 1.3em;  }

h5
{ color: #990000;
font-weight: bold; 
font-size: 1.2em;
letter-spacing:  0.04em; 
line-height: 1.3em;  }

.comments
{ font-style: italic;  color: #666666;  }

.quote 
{ color: #660000;  }

ul li
{ list-style-image: url(images/bullet.gif);  }

p.contentbox
{ margin: 5px;  
padding: 2px;  
border: 1px solid #DADADA;  }

p.highlightbox
{ position:relative;  
margin: 10px;  
padding: 2px;  
background-color: #FAFAFA;  
border: 1px solid #CCCCCC;}
/* 
border-top: #DADADA;  border-left: #DADADA; 
border-bottom: #D3D3D3;  border-right: #D3D3D3;  }
*/

p.divider
{ width: 100%;  background: url(images/divider.gif);  background-repeat: repeat-x;  }
/*   { width: 100%;  font-size: -0.5px;  line-height: -0.5em;  background-color: #666666;  }   */

.googleinput 
{ font-size: 12px;  color: #666666;  text-align: left; 
background-color: #FFFFFF; 
border: 1px solid #CCCCCC;}
/* 
border-top: #DADADA;  border-left: #DADADA; 
border-bottom: #D3D3D3;  border-right: #D3D3D3;  }
*/

.googlesearch
 { font-size: 9px; color: #666666;
background-color: #CCCCCC; 
border: 1px solid;  }

.contentbox
{ padding-left: 10px;  padding-right: 10px;  margin-bottom: 15px; 
border: 1px solid #DADADA;  }




/*   IMAGES   */

img
{ border:0; }

img.imgBanner
{ margin: 10px;  }

img.imgFeature
{ margin: 15px;  }

img.imgContent
{ background: #FAFAFA;  
width: 180px;  
padding: 2px;  
border: 1px solid;  
border-top: #DADADA;  border-left: #DADADA; 
border-bottom: #D3D3D3;  border-right: #D3D3D3;  }

img.imgFrontdoorBanner
{ background: #FAFAFA;  
padding: 4px;  
border: 2px solid;  
border-top: #DADADA;  border-left: #DADADA; 
border-bottom: #D3D3D3;  border-right: #D3D3D3;  }



/*    LINKS   */

a, a:visited
{ background: inherit;  color: #BF041B;  text-decoration: none;  }

a:hover 
{ background: inherit;  color: #000080;  text-decoration: none;  }




/*   ALL   */

#container
{ width: 900px;  height: 100%;  float: center; align: center; } 
 




/*   HEADER   */

#header
{ width: 900px;  height: 210px;  align: center;  float: center; 
background: url(images/headerbackground.jpg);  
background-repeat: repeat-x;  
background-position: top center;  }

#banner 
{ width: 100%;  height:  186px;  background: inherit; }

#navbar
{ width: 100%;  height:  24px;  background: clear;  text-align: bottom; }

	#navbar p
	{ color: #FFFFFF;  letter-spacing: 0.1em; line-height: 1em; }

	#navbar a
	{ width: 100px;  font-weight: bold;  text-align: center;  }

	#navbar a, a:visited
	{ background: inherit;  color: #F8F8F8;  text-decoration: none;  }

	#navbar a:hover 
	{ background: inherit;  color: #FFD700;  text-decoration: none;  }

	#navbar img
	{ border:0; margin: 0; padding: 0; }




/*   MAIN   */

#content
{ width: 900px;  height: auto;  float: center;  vertical-align: top;  
text-align: left;  
background: url(images/contentbackground.jpg);  
background-repeat: repeat-x  repeat-y;  
background-position: top center; 
background-color: #FFFFFF; }

#contentLeft
{ width: 160px;  height: auto;  float: left; vertical-align: top;  
padding-left: 10px;  margin-right: 10px;  
padding-top: 35px;  padding-bottom: 40px;  } 

#contentRight
{ width: 170px;  height: auto;  float: right;   
align: center;  vertical-align: top;  text-align: center; 
padding-left: 10px;  padding-right: 20px;  
padding-top: 35px;  padding-bottom: 40px;  } 

#contentCenter
{ width: 460px;  height: auto;  float: left;   vertical-align: top;  
margin-left: 30px;  margin-right: 30px;  
padding-top: 25px;  padding-bottom: 40px;  } 

.clear 
{ clear:both; width:100%; line-height:0px; height:0px; display:block; }


	/*   MAIN  with 1 CENTER-RIGHT COLUMN   */

	          #contentCenterAndRight
	          { width: 660px;  float: right;  
	          margin-left: 30px;  margin-right: 15px;  
	          padding-top: 25px;  padding-bottom: 40px;  }

	/*   MAIN  with 2 CENTER COLUMNS   */

	          #contentCenterAndRightHalfB
	          { width: 360px;  float: right;   
	          padding-left: 20px;  padding-right: 30px;  
	          padding-top: 25px;  padding-bottom: 40px;  }

	          #contentCenterAndRightHalfA
	          { width: 360px;  float: left;  
	          padding-left: 30px;  padding-right: 20px;  
	          padding-top: 25px;  padding-bottom: 40px;  }




/*   FRONTDOOR   */

#frontdoor
{ width: 900px;  height: auto;  float: center;  vertical-align: top;  
text-align: left;  
background: url(frontdoor/frontdoorBackground.jpg);  
background-repeat: repeat-x  repeat-y;  
background-position: top center; 
background-color: #330000; }



#frontdoorWithPhoto
{ width: 900px;  height: auto;  float: center;  vertical-align: top;  
text-align: left;  
background: url(frontdoor/frontdoorPhoto.jpg);  
background-repeat: repeat-x;  
background-position: top center; 
background-color: #330000; }



#frontdoorLeft
{ width: 150px;  float: left;  
padding-left: 10px;  margin-right: 0px;
padding-top: 35px;  padding-bottom: 40px;  }

#frontdoorRight
{ width: 150px;  float: right;  
padding-left: 0px;  padding-right: 10px;
padding-top: 35px;  padding-bottom: 40px;  }

#frontdoorCenter
{ width: 540px;  float: left;  
margin-left: 30px;  margin-right: 30px;  
padding-top: 25px;  padding-bottom: 40px;  }

	/*   FRONTDOOR  with 2 COLUMNS   */

	          #frontdoorHalfA
	          { width: 310px;  float: left;   
	          margin-left: 55px;   
	          padding-top: 25px;  padding-bottom: 40px;  }

	          #frontdoorHalfB
	          { width: 300px;  float: right;   
	          margin-left: 20px;  margin-right: 75px;  
	          padding-top: 25px;  padding-bottom: 40px;  }




/*   TABLE   */

table
{ margin:  10px;  text-align: left;  background-color: #FFFFFF;  
font-family: arial, helevetica, verdana, tahoma, sans-serif;  
color: #333333;  
font-size: 12px;    
letter-spacing:  0.04em; 
line-height: 1.3em;  }

th
{ font-weight: bold; 
background-color: #D4D4D4; 
padding-top: 10px;  padding-bottom: 10px; 
padding-left: 10px;  padding-right: 10px;  }

tr
{ border-top: 1px;  border-color: #F8F8F8; 
border-bottom: 1px;  border-color: #F8F8F8; }

td
{ padding-top: 5px;  padding-bottom: 5px; 
padding-left: 10px;  padding-right: 10px;  }

tr.rowA
{ background-color: #F8F8F8;  }

tr.rowB
{ background-color: #EFEFEF;  }

tr.rowC
{ background-color: #999999;  color: #FFFFFF;  }

tr.rowSpecial
{ background-color: #F3ECDA;  font-weight: bold;  }

td.tdSpecialTopic
{ width: 100%; vertical-align: top;  text-align: left;  
background-color: #FFD700;  padding: 5px 5px 5px 5px; 
border: 1px 1px 1px 1px; border-style:solid; border-color:#660000; }

table.tableSpecial
{ background-color: #FFD700; }

td.tdHighlightA
{ vertical-align: top;  text-align: center; font-weight: bold;  
padding: 5px 5px 5px 5px; background-color: #EAEFF5;  
border: 1px 1px 1px 1px; border-style:solid; border-color:#D2BEA7; }

td.tdHighlightB
{ vertical-align: top;  text-align: left; 
padding: 5px 5px 5px 5px; background-color: #F3ECDA;  
border: 1px 1px 1px 1px; border-style:solid; border-color:#D2BEA7; }



/*   ROUNDED BOX   */

/*   http://www.neuroticweb.com/recursos/css-rounded-box/index.php?color=f2f2f2&fondo=FFFFFF   */

/* set millions of background images */
.rbroundbox { background: url(images/nt.gif) repeat; }
.rbtop div { background: url(images/tl.gif) no-repeat top left; }
.rbtop { background: url(images/tr.gif) no-repeat top right; }
.rbbot div { background: url(images/bl.gif) no-repeat bottom left; }
.rbbot { background: url(images/br.gif) no-repeat bottom right; }

/* height and width stuff, width not really necessary */
.rbtop div, .rbtop, .rbbot div, .rbbot { width: 100%;  height: 7px;  font-size: 1px; }
.rbcontent { margin: 0 7px; padding-left: 10px; padding-right: 12px;  }
.rbroundbox { width: 100%; margin: 1em auto; }




/*   FOOTER   */

#footer 
{ width: 900px;  height:  60px;  
background-color: #660000;  text-align: center;  
padding-top: 15px; }

#footer p
{ color: #96A0AB;  
font-size: 9px;  letter-spacing:  0.1em;  line-height: 1.2em;  }

#footer a, a:visited
{ background: inherit;  color: #AF9E8B;  text-decoration: none;  }

#footer a:hover 
{ background: inherit;  color: #FFD700;  text-decoration: none;  }


