/* -------------------------------------------------------------- 
  
   reset.css
   * Resets default browser CSS.
   
   Based on work by Eric Meyer:
   * meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
   
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}

/* @group Structure */

body, html {
	background: #222288 url(../mecca-images/mecca-bg.jpg) no-repeat center top;
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 14px;
	line-height: 20px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
}

#nav {
	margin-top: 5px;
	margin-bottom: 30px;
	z-index: 1500;
}

#masthead-home {
	float: left;
	clear: both;
	height: 440px;
}

#slide1 {
	background-image: url(../mecca-images/masthead-wedding-album.jpg);
	height: 420px;
}

#slide2 {
	background-image: url(../mecca-images/slide-home-1.jpg);
	height: 420px;
}

#slide3 {
	background-image: url(../mecca-images/slide-home-2.jpg);
	height: 420px;

}

#masthead {
	float: left;
	clear: both;
	
}


/* Logo link thru CSS -- make sure heigh and width match the dimensions of your logo file. Use <a> in masthead div in the HTML file to call up the logo. 

#masthead a {
	background: url(../generic-images/logo.jpg) no-repeat;
	text-indent: -9000px;
	width: 323px;
	height: 75px;
	position: absolute;
	margin: 0px;
	padding: 0px;
}*/

#srch {
    float: right;
    width: 200px;
    padding: 5px 0px 5px 0px;
}

#content {
	overflow: auto;
	float: left;
	background: #ffffff url(../lb4lb-images/content-bg.jpg) no-repeat center top;
	clear: both;
}

#footer {
	float: left;
	clear: both;
	background-color: #ffffff;
	padding: 0px;
}

.clearl {
	clear: left;
}

/* @end */

/* @group Backgrounds */

.albums {
	background: url(../mecca-images/masthead-albums.jpg) no-repeat center top;
	height: 435px;
}

.generic {
	background: url(../mecca-images/masthead-bg.jpg) no-repeat center top;
	height: 230px;
}

.giclee {
	background: url(../mecca-images/masthead-giclee.jpg) no-repeat center top;
	height: 435px;
}

.mounting {
	background: url(../mecca-images/masthead-mounting.jpg) no-repeat center top;
	height: 435px;
}

.prints {
	background: url(../mecca-images/masthead-prints.jpg) no-repeat center top;
	height: 435px;
}

.portraits {
	background: url(../mecca-images/masthead-portraits.jpg) no-repeat center top;
	height: 435px;
}

.schools {
	background: url(../mecca-images/masthead-schools.jpg) no-repeat center top;
	height: 435px;
}

.sports {
	background: url(../mecca-images/masthead-sports.jpg) no-repeat center top;
	height: 435px;
}

.wedding {
	background: url(../mecca-images/masthead-wedding.jpg) no-repeat center top;
	height: 435px;
}

/* @end */

/* @group Typography */

#masthead-home h1 {
	color: #ffffff;
	padding: 10px;
	font: bold 21px/34px Georgia, "Times New Roman", Times, serif;
}

#masthead-home p {
	color: #ffffff;
	font: normal 16px/20px Verdana, Arial, Helvetica, Swiss, sans-serif;
	padding: 20px 20px 60px 100px;
}

#masthead h1 {
	color: #ffffff;
	padding: 0px 0px 0px 20px;
	font: bold 36px/36px Georgia, "Times New Roman", Times, serif;
}

#masthead h2 {
	color: #88bbff;
	padding: 125px 0px 0px 20px;
	font: bold 21px/36px Georgia, "Times New Roman", Times, serif;
}

#masthead h2 + h1 {
	margin-top: 0px;
}

#masthead p {
	color: #ffffff;
	font: normal 14px/20px Verdana, Arial, Helvetica, Swiss, sans-serif;
	margin: 30px 20px 10px 630px;
}

#masthead ul {
	margin: 30px 0px 10px 670px;
}

#masthead li {
	color: #ffffff;
	margin-bottom: 10px;
}

#content h1, #content h2, #content h3 {
	color: #222288;
	padding: 10px 10px 10px 10px;
	font-family: Georgia, "Times New Roman", Times, serif;
}

#content h1 {
	font-size: 18px;
}

#content h2 {
	font-size: 16px;
}

#content h3 {
	font-size: 14px;
}

#content p {
	color: #333333;
	font: normal 14px/20px Verdana, Arial, Helvetica, Swiss, sans-serif;
	padding: 10px;
}

#content hr {
	border: none 0;
	border-top: 1px solid #cccccc;
	float: left;
	clear: both;
	width: 98%;
	height: 1px;
	margin: 0px 0px 10px 10px;
	padding: 0px;
	/* left align in IE, Opera */
	text-align: left;
}

#elevator h1 {
	color: #222288;
	padding: 10px 10px 10px 10px;
	font: 18px/30px Georgia, "Times New Roman", Times, serif;
}

#elevator h1:first-line {
	font-variant: small-caps;
	font-size: 24px;
}

#footer p {
	color: #333333;
	font: normal 10px/14px Verdana, Arial, Helvetica, Swiss, sans-serif;
	padding: 10px 20px 10px 20px;
}

#content ul, #content li, #content ol {
	color: #333333;
	font: normal 12px/18px Verdana, Arial, Helvetica, Swiss, sans-serif;
}



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

ol {
	margin: 0px 0px 0px 20px;
	padding: 0px 10px 5px 10px;
}

.sml {
	color: #000000;
	font: normal 10px/12px Verdana, Arial, Helvetica, Swiss, sans-serif;
	padding: 10px 20px 10px 20px;
}

.ovrstrk {text-decoration:line-through;
}

/* @end */


/* @group Links */

a:link {
	color: #222288;
}

a:visited {
	color: #333333;
}

a:hover {
	color: #dd7711;
}

a:active {
	color: #dd7711;
}

#footer a:link {
	color: #333333;
}

#footer a:visited {
	color: #777777;
}

#footer a:hover {
	color: #222288;
}

#footer a:active {
	color: #222288;
}



/* @end */


/* @group Elements */

img.mat {
	border: 1px solid #cccccc;
	background-color: #ffffff;
	padding: 4px;
}

.photo-r {
	float: right;
	clear: right;
	margin: 10px;
}

.icon {
	float: left;
	padding: 0px 15px 0px 0px;
}

.pad-10{
	padding-left: 10px;
}

.pad-20{
	padding-left: 20px;
}

.bak2top {
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;
	font-size: 10px;
	color: #222288;
	background-color: #ffffff;
	border: 2px solid #333333;
	padding: 4px;
	z-index: 1200
}

.camera {
	float: left;
	clear: both;
	height: 40px;
	width: 940px;
	margin-bottom: 20px;
	background-image: url(../mecca-images/camera-hr.gif);
}

.wr_fieldset {
width: 620px; 
margin: 12px 0px 12px 10px;
padding: 0; }

.wr_fieldset fieldset {
border: 1px solid #88bbff; }

.wr_fieldset legend {
margin: 0 10px 0 10px;
padding: 0 5px 0 1px;
color: #222288;
font-size: 12px;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif; }

.wr_fieldset_pad {
margin: 0;
padding: 10px; }

.quotebox {
	border: 1px solid #cccccc;
	padding: 10px 10px 10px 10px;
}

/* Floating boxes, good for photos with captions or similar */


div.floatl {
  float: left;
  }
  
div.floatl p {
   text-align: left;
   width: 265px;
   }

div.floatr {
  float: right;
  }
  
div.floatr p {
   text-align: center;
   width: 265px;
   }
   
#scrollbox {
width:400px;
height:300px;
overflow: auto
}

/* @end */


/* @group E-comm */

/* Styles for Mal's e-commerce tables currently in most of my Excel TDF masters; probably should revisit these on site-by-site basis */

.ptcol {border-bottom: 1px solid #000; text-align: center; font-size: 11px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}

.ptfrm {border-bottom: 1px solid #cccccc; text-align: left; font-size: 11px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;}

.pthdr1 .pthdr {font-size: 14px; font-family: Verdana, Arial, Helvetica, Swiss, sans-serif}


/* @end */

/* @group Tables */

/* Applies global padding and paragraph styles to entire table. Normally used for forms or tabular data within the main layout table so you do not need to add paragraph or other styles to each td */

table {
	border-collapse: collapse;
}

tr.shaded td {
	background-color: #ddeeff;
	border-top: 1px solid #88bbff;
	border-bottom: 1px solid #88bbff;
	
}

table.frm td {
	padding: 1px; 
	font-size: 11px;
	line-height: 15px;
	font-family: Verdana, Arial, Helvetica, Swiss, sans-serif;}
	
.tblborder {
	border: 1px solid #000000;
	border-collapse: collapse;
}

	
/* Add following as a table class="cellbkgrnd" for applying table cell backgrounds using tablestyle name="Alt Background By Style w/o formatting */

.cellbkgrnd {background-color: #cccccc;}

/* Adding bkground images to table cells or divs for announcement boxes or similar; commented out below until needed */

/* .bg1 {background: white url(images/divheader.gif) no-repeat top left; width: 236px; padding: 48px 10 10 10; border: 1px solid #548dab; border-collapse: collapse; text-align: left;} */

/* @end */