/*
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body
{
	font-size: .75em;
	font-family: Verdana, Helvetica, Sans-Serif;
	margin: 0;
	padding: 0;
	color: black;
	background-image: url(../images/ACBkgnd.jpg);
}

.classRingsBody
{
	font-size: .75em;
	font-family: Verdana, Helvetica, Sans-Serif;
	margin: 0;
	padding: 0px;
	color: black;
	background-image: url(../images/HSBkgnd.jpg);
}

.retailerLocatorHeader
{
	font-size: 1.5em;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	padding: 20px 0 0 35px;
}

.retailerLocatorHeader1
{
	font-size: 1.5em;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0px 0 0 35px;
}

.retailerLocatorSubHeader
{
	font-size: 1.25em;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0px 0 0 35px;
}

a:link
{
	color: #ffffff;
	text-decoration: none;
}
a:visited
{
	color: #ffffff;
	text-decoration: none;
}
a:hover
{
	color: #ffffff;
	text-decoration: none;
}
a:active
{
	color: #ffffff;
	text-decoration: none;
}

.AltLinks a:link
{
	color: #000000;
	text-decoration: underline;
}
.AltLinks a:visited
{
	color: #000000;
	text-decoration: underline;
}
.AltLinks a:hover
{
	color: #000000;
	text-decoration: underline;
}
.AltLinks a:active
{
	color: #000000;
	text-decoration: underline;
}

p, ul
{
	margin: 20px 20px 20px 20px;
	line-height: 1.6em;
}

.emailLink a:link
{
	color: #000033;
	text-decoration: underline;
	padding: 0 0 0 0px;
}
.emailLink a:visited
{
	color: #000000;
	text-decoration: underline;
}
.emailLink a:hover
{
	color: #000033;
	text-decoration: underline;
}
.emailLink a:active
{
	color: #000000;
	text-decoration: underline;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6
{
	font-size: 1.5em;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
}

h1
{
	font-size: 2em;
	padding-bottom: 0;
	margin-bottom: 0;
}
h2
{
	padding: 0 0 10px 0;
}
h3
{
	font-size: 1.2em;
}
h4
{
	font-size: 1.1em;
}
h5, h6
{
	font-size: 1em;
}

/* this rule styles <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
	margin-top: 0;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page
{
	width: 883px;
	height: 524px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px 0px 0px 0px;
}

.classRingsPage
{
	width: 1041px;
	height: 774px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px 0px 0px 0px;
}

#header
{
	width: inherit;
	height: 50px;
	position: relative;
	margin-bottom: 0px;
}

#classRingsHeader
{
	width: inherit;
	height: 83px;
	position: relative;
	margin-bottom: 0px;
	/*background-color: #240029;*/
}

#main
{
	padding: 0px 0px 0px 0px;
	margin-bottom: 0px;
	_height: 1px; /* only IE6 applies CSS properties starting with an underscrore */
}

#footer
{
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 30px;
	font-size: 1em;
	color: #fff;
	height: 25px;
	text-align: center;
	line-height: normal;
	font-weight: bold;
}

#classRingsfooter
{
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: 100px;
	padding-top: -10px;
	font-size: 1em;
	color: #fff;
	height: 25px;
	text-align: right;
	line-height: normal;
	color: #ffffff;
	font-weight: bold;
}

.twoColumns div
{
	width: 574px;
	float: right;
	vertical-align: top;
}

.twoColumns table
{
	width: 90%;
	font-size: .90em;
}

/* MENU   
----------------------------------------------------------*/
#menuArtCarved
{
	margin-bottom: 10px;
	height: 40px;
	float: right;
	color: #ffffff;
}

#menuArtCarved li
{
	display: inline;
	list-style: none;
	padding: 0px 2px 0 2px;
	color: #ffffff;
	font-weight: bolder;
}

#menuRetailers
{
	height: 0px;
	float: left;
	color: #999999;
	padding: 0px 0px 0px 0px;
}

#menuRetailers li
{
	display: inline;
	list-style: none;
	padding: 0px 2px 0px 0px;
	color: #999999;
	font-weight: bolder;
}

#menu
{
	margin-bottom: 10px;
	height: 83px;
	width: 651px;
	float: right;
	color: #ffffff;
	background-image: url(../images/HSNav_Top.gif);
}

#menu li
{
	display: inline;
	list-style: none;
	padding: 0px 0 0 0px;
	margin: 0px 0 0 20px;
	color: #ffffff;
	font-weight: bolder;
}

#menu div
{
	padding: 42px 0 0 50px;
}

#banner
{
	width: 390px;
	height: 0px;
	float: left;
	padding: 3px 0px 0px 0px;
}

ul#menu a:link
{
	color: #ffffff;
	text-decoration: none;
	font-weight: bolder;
}
ul#menu a:visited
{
	color: #ffffff;
	font-weight: bolder;
}
ul#menu a:hover
{
	color: #ffffff;
	text-decoration: none;
	font-weight: bolder;
}
ul#menu a:active
{
	color: #ffffff;
	font-weight: bolder;
}

/* MISC  
----------------------------------------------------------*/
.clear
{
	clear: both;
}

.error
{
	color: Red;
}

div#title
{
	display: block;
	float: left;
	text-align: left;
}

.field-validation-error
{
	color: #ff0000;
}

.input-validation-error
{
	border: 1px solid #ff0000;
	background-color: #ffeeee;
}

.validation-summary-errors
{
	font-weight: bold;
	color: #ff0000;
}

.textContainer
{
	padding-top: 0px;
	padding-left: 100px;
	float: left;
	vertical-align: top;
}

.textContainerArtCarved
{
	padding-top: 0px;
	padding-left: 0px;
	float: left;
	vertical-align: top;
}

.bodyTextFormat
{
	width: 574px;
	height: 522px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	padding: 0px 0px 0px 0px;
	font-size: .9em;
	border: 0px solid black;
	background-image: url(../images/ACWhiteBkg.gif);
}

.bodyTextFormat1
{
	width: 574px;
	height: 522px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px 0px 0px 0px;
	font-size: .9em;
	border: 0px solid black;
}

.bodyTextFormat2
{
	width: 574px;
	height: 522px;
	margin-left: auto;
	margin-right: auto;
	font-size: 1em;
	border: 0px solid black;
	background-image: url(../images/ACWhiteBkg.gif);
}

.bodyTextFormat li
{
	margin-left: 15px;
	list-style-type: square;
}

.bodyTextFormatP
{
	font-weight: bold;
	font-size: 1.5em;
}

.bodyTextFormatP2
{
	font-size: 1.5em;
}

.bodyTextFormat p
{
	padding-left: 15px;
	font-size: 1.2em;
}

.bodyTextFormat a
{
	padding: 0px 0px 0px 180px;
}

.bodyTextFormatting
{
	width: 574px;
	height: 522px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	padding: 0px 0px 0px 0px;
	font-size: .9em;
	border: 0px solid black;
	background-image: url(../images/ACWhiteBkg.gif);
}

.bodyTextFormatting p
{
	padding-left: 15px;
	font-size: 1.2em;
}

.bodyTextFormatting a
{
	padding: 0px 0px 0px 0px;
}

.contactContainer
{
	width: 300px;
	height: 250px;
	border: 1px solid black;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
	font-size: .9em;
}


/* HOME PAGE 
----------------------------------------------------------*/

#homePageContainer
{
	height: 524px;
	margin-left: auto;
	margin-right: auto;
	padding-top: auto;
}

#homeLinksContainer
{
	height: 524px;
	padding-top: 2px;
}

#hsRingsContainer
{
	width: 307px;
	height: 174px;
	border: 0px solid black;
	position: relative;
	margin: 0px 0 0 0;
	float: left;
}

#hsPageContainer
{
	width: 1003px;
	height: 768px;
	border: 1px dotted red;
	margin-left: auto;
	margin-right: auto;
}

#classPageContainer
{
	width: 1041px;
	height: 774px;
	border: 0px dotted red;
	margin-left: auto;
	margin-right: auto;
}

#classPageBrochureContainer
{
	height: 600px;
	width: 80%;
	border: 0px dotted red;
	margin-left: auto;
	margin-right: auto;
	padding: 40px 0 0 0;
	vertical-align: middle;
}

.classPageBrochure
{
	padding: 0px 0 0px 0;
	width: 80%;
	height: 774px;
	
}	

#celebrationsOfLifeContainer
{
	width: 307px;
	height: 174px;
	border: 0px solid black;
	position: relative;
	margin: 0px 0 0 0;
	float: right;
}

#bridalContainer
{
	width: 307px;
	height: 174px;
	border: 0px solid black;
	position: relative;
	float: right;
	margin: 0px 0 0 0;
}


#giftContainer
{
	width: 574px;
	height: 522px;
	border: 0px solid black;
	position: relative;
	float: right;
	margin: 0px 0 0 0;
}

#giftContainer img
{
	width: 574px;
	height: 522px;
	top: 0;
	left: 0;
}

/* HIGH SCHOOL HOME PAGE 
----------------------------------------------------------*/
#classPageContainer
{
	height: 774px;
	margin-left: auto;
	margin-right: auto;
	background-image: url(../images/HSPaper.png);
}

#classPageContainerNoImage
{
	height: 710px;
	margin-left: auto;
	margin-right: auto;
	background: #103740;
}

#classPageLinksContainer
{
	width: 833px;
	height: 471px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 30px;
	position: relative;
}

#classPageRetailerContainer
{
	margin-left: auto;
	margin-right: auto;
	padding-top: 20px;
	position: relative;
}

#classPageLinksContainer img
{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

#heroshotContainer
{
	width: 833px;
	height: 471px;
	position: relative;
	float: left;
	margin-left: auto;
	margin-right: auto;
	vertical-align: top;
}

#catalogContainer
{
	width: 326px;
	height: 148px;
	float: left;
	margin: 27px 22px 0 10px;
	background-image: url(../images/HSBoxBrowse.png);
}


#retailerContainer
{
	width: 326px;
	height: 148px;
	float: left;
	margin: 27px 0 0 10px;
	background-image: url(../images/HSBoxFind.png);
}

.retailerContainerButtonBrowse
{
	height: 118px; 
	width: 280px; 
	margin-left: 65px; 
	margin-right: auto; 
	margin-top: 55px;
	text-align: center;
}

.retailerContainerButtonBrowse span
{
	text-align: center;
	font-family: Verdana;
	font-size: 1.1em;
	font-weight: bold;
	color: #fff;
	margin: 10px 0 0 0;
}

.retailerContainerButtonFind
{
	height: 118px; 
	width: 280px; 
	margin-left: auto; 
	margin-right: auto; 
	margin-top: 55px;
	text-align: center;
}

.retailerContainerButtonFind span
{
	text-align: center;
	font-family: Verdana;
	font-size: 1.1em;
	font-weight: bold;
	color: #fff;
	margin: 10px 0 0 0;
}

#classPageSocialMedia
{
	width: 504px;
	height: 251px;
	float: left;
	margin: -95px 0 0 0px;
	background-image: url(../images/HSRings.png);
}

.classPageSocialMediaContainer
{
	padding: 0 0 0 30px;
}

.classPageSocialMediaTwitter
{
	width: 75px;
	height: 88px;
	margin: 120px 0 0 280px;
}

.classPageSocialMediaFB
{
	width: 75px;
	height: 88px;
	margin: -60px 0px 0px 360px;
}

#bkgContainer
{
	width: 768px;
	height: 1024px;
}

.retailerLocatorBodyCopy
{
	padding: 0px 20px 0px 0px;
	font-style: normal;
	font-size: 1.85em;
	font-weight: bold;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.2em;
}

/* HIGH SCHOOL SEARCH PAGE 
----------------------------------------------------------*/

#onlineSearch
{
	width: 1041px;
	height: 774px;
	margin-left: auto;
	margin-right: auto;
}

.searchContainer
{
	width: 900px;
	height: 774px;
	border: 0px solid black;
	position: relative;
	margin: 0px 0 0 80px;
}

.searchContainer p
{
	padding: 0px 20px 0px 20px;
	margin-left: auto;
	margin-right: auto;
}

.searchContainer li
{
	margin-left: 15px;
	padding-left: 5px;
	line-height: 2em;
	list-style-type: square;
}

.searchContainer a
{
	color: Black;
	text-decoration: underline;
}

.searchContainerButton
{
	width: 900px;
	height: 774px;
	border: 0px solid black;
	position: relative;
	margin: 0px 0 0 35px;
}

.searchContainerButton p
{
	padding: 0px 20px 0px 20px;
	margin-left: auto;
	margin-right: auto;
}

.searchContainerButton li
{
	margin-left: 15px;
	padding-left: 5px;
	line-height: 2em;
	list-style-type: square;
}

.searchContainerButton a
{
	color: Black;
	text-decoration: underline;
}

#bannerContainer
{
	width: 610px;
	height: 100px;
	margin: 10px 0 0 10px;
	position: relative;
	float: left;
}

/* RINGS CAROUSEL AND DESCRIPTION
----------------------------------------------------------*/

#ringsContainer
{
	padding: 10px 0 0 0;
	height: 522px;
	width: 817px;
	margin-left: auto;
	margin-right: auto;
}

#summaryringsContainer
{
	padding: 10px 0 0 0;
	height: 522px;
	width: 817px;
	margin-left: auto;
	margin-right: auto;
	border: 0px dotted red;
}

#summaryringsContentContainer
{
	padding-top: 10px;
	margin-top: 10px;
	height: 500px;
	width: 817px;
}

#ringsListContainer
{
	padding-top: 10px;
	width: 817px;
	height: 112px;
	text-align: center;
	margin: -65px 0 0 0;
}

#ringsContentContainer
{
	padding-top: 5px;
	margin-top: 5px;
	height: 500px;
	width: 817px;
}

.sideContainer
{
	width: 250px;
	height: 440px;
	position: relative;
	float: left;
	color: black;
	margin-left: 5px;
	background-color: white;
}

.sideContainer ul
{
	margin:0;
	padding:0;
	padding: 5px;
}

.sideContainer h3
{
	color: White;
	text-align: center;
}

.sideContainer li
{
	list-style: none;
	margin:0;
	font-size: .85em;
}

.centerContainer
{
	width: 300px;
	height: 440px;
	position: relative;
	float: left;
	text-align: center;
	color: black;
	margin-left: 5px;
	margin-right: 2px;
	background-color: white;
}

.centerContainer img
{
	height: 300px;
	width: 300px;
}

.centerContainer h2
{
	color: black;
	text-align: center;
	padding: 0;
}

.centerContainer p
{
	text-align: center;
	margin: 15px 10px 0px 10px;
	font-size: .85em;
	font-weight: bold;
	color: black;
	padding: 20px 0 0 0;
}

.centerContainer a:link
{
	color: #000033;
	text-decoration: underline;
}
.centerContainer a:visited
{
	color: #000000;
	text-decoration: underline;
}
.centerContainer a:hover
{
	color: #000033;
	text-decoration: underline;
}
.centerContainer a:active
{
	color: #000000;
	text-decoration: underline;
}

.bigFont
{
	font-size: 1.9em;
	color: Black;
	font-weight: bolder;
	text-align: center;
	padding-top: 100px;
}

#content-slider
{
	width: 790px;
	height: 6px;
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
	background: #BBBBBB;
	position: relative;
}

.content-item
{
	width: 100px;
	height: 120px;
	padding: 0.4em;
	margin: 0 0.4em 0.4em 0;
	text-align: center;
	float: left;
}

.content-item div
{
	padding-top: 20px;
	vertical-align: bottom;
}

.content-item h5
{
	margin: 0 0 0.4em;
	cursor: move;
}

.content-item div a.ui-icon-zoomin
{
	float: left;
}

.content-item img
{
	height: 60px;
	width: 60px;
	cursor: move;
}

.details
{
	width: 186px;
	height: 480px;
	padding-top: 25px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.details p
{
	margin: 0 5px 10px 5px;
	font-size: .85em;
	text-align: left;
}

.details select
{
	font-size: .9em;
}

.sideContainer em.ui-icon-closethick
{
	float: right;
}

#content-scroll
{
	width: 796px;
	height: 130px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	padding: 5px;
	overflow: hidden;
}

#content-holder
{
	width: 1500px;
	height: 130px;
	margin-left: 7px;
}

#LocationContainer
{
	margin-left: auto;
	margin-right: auto;
	margin-top: -600px;
	border: 0px solid #ff0000;
	width: 850px;
	height: 482px;
	vertical-align: top;
}

#LocationListing
{
	overflow: auto;
	height: 480px;
	width: 200px;
	font-size: .75em;
	font-family: Verdana, Helvetica, Sans-Serif;
	margin: 0 0 0 0;
	padding: 0px;
	color: black;
	border: 0px solid #cc0000;
	position: relative;
}

.contentBox {
	display:block;
	border-width: 0px;
	border-style: solid;
	border-color: #000000;
	padding:0px 0 0 22px;
	margin-top:0px;
	margin-left:15px;
	width:520px;
	height:280px;
	overflow:scroll;
	font-size: 1.2em;
	line-height: 1.6em;
	}

#map
{
	height:480px;
	width:600px;
	margin-left: auto;
	margin-right: auto;
	vertical-align: top;
	border: 0px solid #000000;
	float: right;
}

.classPageRetailerBodyText
{
	padding-left: 50px; 
	font-size: .95em; 
	font-weight:bold; 
	font-family: Verdana, Helvetica, Sans-Serif; 
	color: black;
}