﻿/* Styles to deal with print media */
        @media print
        {
	        .hidefromprinter
	        {
		        display: none;
	        }
        }

body 
{
	background-color: #ECF6F9;
	text-align: center;
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 3px;
	margin-bottom: 5px;
	font-family: Arial, sans-serif;
	color: #666;
	font-size: 12px;
}

h1 
{
	color: #000000;
	font-size: 1.6em;
	margin: 0 auto;
	padding: 8px 0 10px 0;
	font-weight: bold;
}

h2 
{
	color: #006600; 
	font-size: 1.2em;
	margin: 0 auto;
	padding: 6px 0 10px 0;
	font-weight: bold;
}

p 
{
	line-height: 16px;
	margin: 0 auto;
	padding: 5px 0 4px 0;
}

.button 
{
	border-style: solid; border-color: black; border-width: 1px; background-color: #33CC99; cursor: pointer;
}

/* elements with the input class */

.inputs
{
	border-style: solid;
	border-color: Black;

}	

.ContactInput
{
	border-style: solid; border-color: #000000; border-width: 1px; background-color: #33FFCC;
}


/************************* BODY TEMPLATE ***********************************/

#sitebody 
{
	margin: auto;
	width: 830px;
}

#page-top 
{
	background: transparent url("../images/Template/PageTop.gif") no-repeat center top;
	width: 800px;
	height: 89px;
}

#content-bg
{
	background: transparent url("../images/Template/Body.gif") repeat center top;
	width: 800px;
	text-align: center;

}


#content
{
	text-align: left;
	padding: 0 15px 0 10px;
	margin: 0px;
}


#page-container 
{
	text-align: center;
	margin: 0 auto;
	padding: 0;
}


#page-end
{
	background: transparent url("../images/Template/PageBottom.gif") no-repeat center top;
	width: 800px;
	height: 24px;
}


.bodyheadings
{
	 font-weight: bolder;

}


/************************* END BODY TEMPLATE ***********************************/






/************************* SIDE Container TEMPLATE ***********************************/



.side-top 
{
	background: transparent url("../images/Template/SideTop.gif") no-repeat center top;
	width: 226px;
	height: 27px;
	text-align: center;
	color: #000000;
	font-size: 13px;
	font-family: Arial, Helvetica, sans-serif; 
	font-weight: bold;
	
	margin: 0;
	padding: 0px;
}

.side-top-body
{
	padding-top: 6px;
	margin: 0;
	
}

.side-bg
{
	background: transparent url("../images/Template/SideBody.gif") repeat center top;
	width: 226px;
	text-align: left;
	margin: 0;
	padding: 0px;
}

.side-bg-body
{
	padding-left: 10px;
	padding-right: 8px;
	padding-top: 1px;
	padding-bottom: 1px;
	margin: 0;
}

.side-bottom
{
	background: transparent url("../images/Template/SideBottom.gif") no-repeat center top;
	width: 226px;
	height: 20px;
	margin: 0;
	padding: 0px;
}


/* Format our side links  */
a.sidelink:link {color: #666; text-decoration: none;}
a.sidelink:visited{color: #666; text-decoration: none;}
a.sidelink:hover {color:  #666; text-decoration: underline;}

.side-list
{
	padding-left: 1em; margin-left: 1em; list-style-image: url(../images/Template/bullet.gif); font-family:Arial; font-size: small;


}


/************************* END SIDE Container TEMPLATE ***********************************/

/* Testimonials */

.Testimonials
{
	 padding: 6px 8px 0 2px;
	
}

/* END Testimonials */






/************************* FOOTER ***********************************/
#page-foot 
{
	text-align: left;
	padding: 20px 40px 5px 30px;
	font-family: Arial, sans-serif;
	font-size: 11px;
	color: #999;
}

#page-foot p 
{
	color: #999;
	line-height: 15px;
}

#page-foot a:link, #page-foot a:visited {color: #666; text-decoration: none; font-weight: bold; font-family: Arial, sans-serif;}
#page-foot a:hover {color: #000; text-decoration: underline; font-weight: bold; font-family: Arial, sans-serif;}

/************************* END FOOTER ***********************************/













/****************** TOP NAVIGATION *************************/
/* NOTE: Had to add alot of CSS rules to get IE 6 to display page w/out recking IE7, Firefox, Safari */


#Navigation
{
	background: transparent url("../images/Template/Body.gif") repeat center top;
	width: 800px;
	text-align: center;

}

#navigation-content
{
	text-align: left;
	padding: 0 15px 0 10px;
	margin: 0px;
}

#navigation-container 
{
	text-align: center;
	margin: 0 auto;
	padding: 0;
}


#topNavigation
{
	text-align: left;
	width: 785px;
	background-color: #006600; 
	border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #009933;
	border-top-style: solid; border-top-width: 2px; border-top-color: #009933;
	margin-left: -4px;
}

#NavTable
{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
}

/* Format top navigation not selected */
a.NormalLink:link, a.NormalLink:visited {color: #FFFFFF; text-decoration: none; font-weight: bold; font-family: Arial, sans-serif; font-size: 14px;}
a.NormalLink:hover {color: #000000; text-decoration: none; font-weight: bold; font-family: Arial, sans-serif; font-size: 14px;}

/* Format the link that is selected for the page */
a.ActiveLink:link {color: #FFFFFF; text-decoration: underline; font-weight: bold; font-family: Arial, sans-serif; font-size: 14px;}
a.ActiveLink:visited{color: #FFFFFF; text-decoration: underline; font-weight: bold; font-family: Arial, sans-serif; font-size: 14px;}
a.ActiveLink:hover {color: #000000; text-decoration: underline; font-weight: bold; font-family: Arial, sans-serif; font-size: 14px;}

/****************** END TOP NAVIGATION *************************/









.highlight { background-color: yellow;}



/***************************************************************
BELOW CSS Styles format for the build ornament page only
*/

/* header section for base pieces */

#baseheader 
{
	
	
	width: 775px; 
	height: 20px; 
	background-color: #00CC99; 
	border-style: solid;
	border-color: #009933;
	border-width: 1px 1px 0px 1px;
	text-align: center; 
	color: #000000;
    font-size: medium;
    font-weight: bold;
	
}

/* body section for our base pieces */

#basepieces 
{
	
	width: 775px;
	border-style: solid;
	border-color: #009933;
	border-width: 0px 1px 1px 1px;
	height: 153px;
}


#exampleheader 
{


	width: 99%; 
	 
	background-color: #00CC99; 
	border-style: solid;
	border-color: #009933;
	border-width: 1px 1px 0px 1px;
	text-align: center;
	color: #000000;
    font-size: medium;
    font-weight: bold;

}

#examples 
{
	width: 99%; 
	border-style: solid;
	border-color: #009933;
	border-width: 0px 1px 1px 1px;
}

#charmsheader 
{

	width: 264px; 
	
	background-color: #00CC99; 
	border-style: solid;
	border-color: #009933;
	border-width: 1px 1px 0px 1px;
	text-align: center;
	color: #000000;
    font-size: medium;
    font-weight: bold;

}

#charms 
{
	width: 264px;
	
	border-style: solid;
	border-color: #009933;
	border-width: 0px 1px 1px 1px;
	text-align: center;
	font-size: 12px;
}

#yourornamentheader 
{
	width: 321px; 
 
	background-color: #00CC99; 
	border-style: solid;
	border-color: #009933;
	border-width: 1px 1px 0px 1px;
	text-align: center;
	color: #000000;
    font-size: medium;
    font-weight: bold;
}

#yourornament 
{
	width: 321px;
	border-style: solid;
	border-color: #009933;
	border-width: 0px 1px 1px 1px;
	font-size: 12px;
	padding-bottom: 5px;
	text-align: center;
	margin: 0px;
}




.steps 
{
	
	font-size: medium;
	font-weight: bold;
	color: #000000;
}	

/***************************************************************
DONE WITH CSS Styles format for the build ornament page only
*/


/* Format our add cart links  */
a.cartlink:link {color: #000099; text-decoration: underline;}
a.cartlink:visited{color:  #000099; text-decoration: underline;}
a.cartlink:hover {color:  #000099; background-color: #00CC99; text-decoration: underline;}




/* AJAX Control formating */

/* Accordion */
.accordionHeader
{
    border-width: 1px;
    text-align: left;
  
	
	
   
    
	font-family: Arial, Sans-Serif;
	font-size: 11px;
	font-weight: bold;
    
    
    padding: 3px;
	   

    margin-top: 3px;
    cursor: pointer;
}

.accordionHeaderSelected
{
    border-width: 1px;
	text-align: left;
   
    
   
   
	
	font-family: Arial, Sans-Serif;
	font-size: 11px;
	font-weight: bold;
    
    
    padding: 3px;
    
    margin-top: 3px;
    cursor: pointer;
}

.accordionHeader a
{
	
	
	color: #000099; text-decoration: underline;
	background: none;
	
}

.accordionHeader a:hover
{

	color:  #000099; background-color: #00CC99; text-decoration: underline;

}



.accordionHeaderSelected a
{
	
	color:  #000099; background-color: yellow; text-decoration: underline;
}

.accordionHeaderSelected a:hover
{
	color:  #000099; background-color: #00CC99; text-decoration: underline;
}

.accordionContent
{
    

    padding-top: 2px;
}

/*AutoComplete flyout */

.autocomplete_completionListElement 
{  
	visibility : hidden;
	margin : 0px!important;
	background-color : inherit;
	color : windowtext;
	border : buttonshadow;
	border-width : 1px;
	border-style : solid;
	cursor : 'default';
	overflow : auto;
	height : 200px;
    text-align : left; 
    list-style-type : none;
   
}

/* AutoComplete highlighted item */

.autocomplete_highlightedListItem
{
	background-color: #00CC99;
	color: black;
	padding: 1px;
}

/* AutoComplete item */

.autocomplete_listItem 
{
	background-color : window;
	color : windowtext;
	padding : 1px;
}


/*Modal Popup*/
.modalBackground 
{
	background-color:Gray;
	filter:alpha(opacity=70);
	opacity:0.7;
}

.modalPopup 
{
	background-color:#ffffdd;
	border-width:3px;
	border-style:solid;
	border-color:Gray;
	padding:3px;
	width:300px;
}


/*Textbox Watermark*/

.unwatermarked {
	
}

.watermarked {
	
	padding:2px 0 0 2px;
	border:2px solid Black;
	background-color:#F0F8FF;
	color:gray;
}	

/*********** Done with Toolkit ***********************/

.Drag
{
    cursor: move;
}

 #ProxyObject
 {
            position: absolute; 
            visibility: hidden; 
            z-index: 99999;  
            
 }
 
 .OrnamentCaption
{
	font-family: Arial;
	font-size: smaller;
	padding: 2px;
	color: #000000;
	text-align: center;
	

}

.ErrorMessage
{
	 text-align: center;
	 color: Red;
	 font-weight: bold;
}

.SuccessMessage
{
	 text-align: center;
	 color: Green;
	 font-weight: bold;
}


.BottomLinks
{
	font-size: x-small;
}