/* CSS Document */
/* Saint Mark's School - John McGeary 2008*/


/* EDITOR START */


body {
	font-size:					12px;
	font-weight:				200;
	line-height:                20px;
	color:						#000000;
	font-family:				Verdana, Arial, Helvetica, sans-serif;
	background-color:					#ffffff;
	width:						576px;
}



hr {
	border:                     1px solid #7c1a2e;
	margin-top:                 15px;
	margin-bottom:              15px;
	
}

h1 {
	font-size:					16px;
	color:						#7c1a2e;
	margin-bottom:              10px;
        border-bottom:                     2px solid #fdb813;
       height:                           30px;
       text-transform: uppercase;
}

h2 {
	font-size:					14px;
	color:						#fdb813;
	margin-top:                 5px;
	margin-bottom:              5px;

}

h3 {
	font-size:					12px;
	color:						#7c1a2e;
	margin-top:                 5px;
	margin-bottom:              5px;

}

h4 {
	font-size:					12px;
	color:						#7c1a2e;
	margin-top:                 5px;
	margin-bottom:              5px;
	
}

a {
    color:						#7c1a2e;
	text-decoration:            none;
}

a:hover {
    color:						#7c1a2e;
	text-decoration:            underline;
}

p {
    margin-bottom:				10px;
}

ul {
    padding:                    10px 0px 10px 20px;
}

li {
	padding:	         		0px;	
}

.red {
    color:						#7c1a2e;
}

.gold {
    color:						#fdb813;
}


/* EDITOR END */
body {
	font-size:					12px;
	font-weight:				200;
	line-height:                20px;
	color:						#000000;
	font-family:				Verdana, Arial, Helvetica, sans-serif;
	background:					#ffffff url(assets/bg.gif) repeat-x top center;
    width:100%;
}



* {
	margin:						0;
	padding:					0;
}

img {
	border:						0px;
}


/* --------- Main Container --------- */

#wrapper {
	width:						1003px;
	height:                     100%;
	padding:                    0px;
	margin: 					0 auto;
}

#main_container {
	width:						1003px;
	height:                     100%;
	padding:                    0px;
	margin: 					0px;
	float:						left;
	background:					#ffffff url(assets/maincontainer_bg.gif) repeat-y;
}


/* --------- Masthead ---------*/

#masthead {
    width:                      1003px;
	height:						150px;
	margin:				        0px;
	padding:                    0px;
	background:					#7c1a2e url(assets/right_column_bg.gif) no-repeat top right;
}


.masthead_left {
    float:                      left;
	width:                      178px;
	height:						150px; 
	margin:                     0px;
	padding:                    0px;	
	background:					transparent url(assets/left_column_bg.gif) no-repeat;
}


.masthead_left p {
    color:                      #ffffff;
	margin:                     0px;
	font-size:    				12px; 
	margin:						20px 0px 0px 30px;
	float:						left;
	width:						178px; 
	line-height:				15px;        
}

* html .masthead_left p {
	margin:                     20px 0px 0px 0px;
	width:                      150px;
	padding-left:               20px;
}


.slideshow {
	float:						right;
	width:						648;
	height:						150px;
	text-align:					right;
}


.logo {
	width:						157px;
	height:						150px;
	float:						right;
	margin-right:				10px; 
}

* html .logo {
	padding-right:              11px;
	margin-right:               0px;
}


/* --------- Mainarea ---------*/


.mainarea {
    width:                      1003px;
	margin:                     0px;
	padding:              		0px;
	float:                      left;
	background:					url(assets/right_column_bg2.gif) no-repeat top right;
}


.right_column {
    width:                      157px;
	height:						100%;
	float:						right;
	margin-right:				10px;
}

* html .right_column {
	margin-right:                -1px;
	padding-right:              11px;
}

.right_column img {
    border-top:					5px solid #fdb813;
}


.textarea {
	padding:                    40px;
	margin:                     0px;
	width:						576px;
	float:						left;
	border-top:					5px solid #fdb813; 
}

* html .textarea {
	width:						550px;
}

.left_column {
	width:						180px;
	float:						left;
	background:					transparent url(assets/left_column_bg2.gif) no-repeat top left;
}

* html .left_column {
	padding-left:                -10px;
}

.left_column img {
	margin-top:					10px;
}

.left_column h3 {
	font-size:					12px;
	font-style:					italic;
	text-align:					right;
	padding:                    10px 0px 20px 20px;	
	font-weight:				300;
	width:						150px;
	float:                      right;
	margin-right:               -10px;
}




/* --------- Navigation left ---------*/


.navigation_left {
	width:						178px;
	float:						left;
	margin:						0px 0px 0px 10px;
	line-height:                18px;
	border-top:					5px solid #fdb813;            
}

* html .navigation_left {
	margin-left:                5px;
}

.navigation_left ul {
	margin:						0px;
	padding:					0px;
	width:						178px;
}

.navigation_left li {
	list-style:                 none;
	margin:                     0px;
	padding:                    0px;
	width:						178px;
	background-color:			#ebebeb;
	margin-bottom:              1px;
}


* html .navigation_left li {
	margin-top:                -3px;
	padding:                    1px 0px 1px 0px;
	margin-bottom:              2px;
}


.navigation_left a {
	text-decoration:			none;
	color:						#000000;
	margin:                     0px;
	padding:                    0px;
	display:                    block;
	padding:                    3px 0px 3px 10px;
	
}

.navigation_left a:hover {
	color:						#000000;
	text-decoration:			underline;
	margin:                     0px;
	padding:                    3px 0px 3px 10px;
	background-color:			#dddddd;
}


.navigation_left #active a {
	margin:                     0px;
	color:						#000000;
	text-decoration:			none;
	padding:                    3px 0px 3px 10px;
	font-weight:				bold;
	background-color:			#fdb813;
} 

.navigation_left #active a:hover {
	text-decoration:			none;
	color:						#000000;
	margin:                     0px;
	padding:                    3px 0px 3px 10px;
	background-color:			#fdb813;
} 

.navigation_left #parent {
	margin:                     0px;
	color:						#000000;
	text-decoration:			none;
	padding:                    3px 0px 3px 10px;
	font-weight:				bold;
	width:						168px;
	background-color:			#fdb813;
}

* html .navigation_left #parent {
	padding:                    3px 0px 3px 0px;
}  

.navigation_left #parent a {
	margin:                     0px;
	color:						#000000;
	text-decoration:			none;
	padding:                    0px;
	font-weight:                200;
	background-color:			#fdb813;	
} 

.navigation_left #parent a:hover {
	text-decoration:			none;
	color:						#000000;
	margin:                     0px;
	padding:                    0px;
	font-weight:                200;
	text-decoration:			underline;
	background-color:			#fdb813;
}

 
.navigation_left li ul li  {
	color:						#000000;
	text-decoration:			none;
	width:						125px;
	border-bottom:				none;
}

* html .navigation_left li ul li {
	margin-left:                10px;
}


.navigation_left #menu {
	margin:                     0px;
	color:						#ffffff;
	text-decoration:			none;
	padding:                    3px 0px 3px 10px;
	font-weight:				bold;
	background-color:			#7c1a2e;
	width:						168px;
}




/* --------- Footer --------- */

#footer {
	width:						983px;
	height:                     79px;
	font-size:					9px;
	color:						#ffffff;
	text-align:                 right;
	margin-top:                 0px;
	clear:                      both;
	background:					url(assets/footer_bg.gif) repeat-x;
	margin-left:				10px;
}

* html #footer {
	margin-bottom:              -20px;
}



#footer a {
	text-decoration:			none;
	color:						#ffffff;
}

#footer a:hover {
	text-decoration:			underline;
	color:                      #ffffff;
}

#footer p {
	font-size:					9px;
	color:						#ffffff;
	text-align:					right;
	padding:                    28px 20px 0px 0px;
}

/* --------- Contact Form --------- */


div.contactForm{
  width:                        365px;
  padding:                      0px;
  margin:                       30px;
}
div.row {
  clear:                        both;
  padding-top:                  5px;
  vertical-align:               middle;
  }
div.row span.label {
  float:                        left;
  width:                        140px;
  text-align:                   right;
  padding:                      0px 10px 0px 0px;
  }
div.row span.formw {
  float:                        right;
  width:                        210px;
  text-align:                   left;
  }
div.row span.formw input.text, div.row span.formw textarea{
	font-family:                Arial, Helvetica, sans-serif;
	font-size:                  12px;
	color:                      #86b637;
	width:                      210px;
	border:                     1px solid #000000;
	background:                 none !important;
}
div.row span.formw textarea{
  height:                       50px;
}
div.spacer {
  clear:                        both;
}