/* 
						cream		fcf9ce
brown		833e28	
blue		629595
dkGrayBlue	50acc8
pink		e3b7b3
						gray		bdcbc7
padding layout = top right bottom left

purple dk	542366
						purple lt	b09cb6
mint		bad2a6
blue		226ca0
pink		f6d1e3
background-color:#542366; background-image:url(../images/bgPinkRay.jpg);
*/

/* #Base 
================================================== */
	
body { background:url(../images/bgPinkRay.jpg);}
	/*h1 { font-size: 46px; line-height: 50px; margin-bottom: 14px;}*/
	h1 { font-size: 35px; line-height: 40px; margin-bottom: 10px; }
	h2 { font-size: 28px; line-height: 34px; margin-bottom: 8px; }
	h3 { font-size: 21px; line-height: 30px; margin-bottom: 4px; }
	h4 { font-size: 17px; line-height: 24px; }
	h5 { font-size: 14px; line-height: 21px; }
	
	
/*	h1 { font-size: 35px; line-height: 40px; margin-bottom: 10px;}
	h2 { font-size: 28px; line-height: 34px; margin-bottom: 8px;}
	h3 { font-size: 22px; line-height: 30px; margin-bottom: 4px;}
	
	h1 { font-size: 32px; line-height: 37px; margin-bottom: 8px;}
	h2 { font-size: 25px; line-height: 31px; margin-bottom: 4px;}
	h3 { font-size: 22px; line-height: 28px; margin-bottom: 2px;}*/

div#logo {background-image:url(../images/theSEOzone_320.gif); background-repeat:no-repeat; margin:0; padding:1px; width:320px; height:97px;}
div#logo ul { width:inherit; height:inherit;}
div#logo li {left:-41px; top:-13px; position:relative; list-style:none; margin:0; width:inherit; height:inherit;}
div#logo a {display:block; width:inherit; height:inherit;}

/*MAIN NAVIGATION*/
div#nav ul {margin:25px 0 0 0; padding:0;  background-color: #b09cb6; float:right; }
div#nav li {position:relative; list-style:none; margin:0; float:left; border-right:1px solid #bdcbc7; background-color:#fcf9ce;}
div#nav li:hover {background: #bad2a6; }
div#nav li a:hover { color:#226ca0;}
div#nav li a {display:block; padding: 15px 10px 15px 10px; text-decoration: none; color:#833e28; font-weight:bold; font-size:14px;}
* html div#nav li a {padding: 15px 10px 15px 10px;}
div#nav>ul a {width: auto;}
div#nav li.end {border-right:1px solid #fcf9ce;}

/*FOOTER NAVIGATION*/
div#nav-ft ul {margin:0; padding:0;  background-color: #b09cb6; float:right; }
div#nav-ft li {position:relative; list-style:none; margin:0; border-right: 1px solid #bdcbc7; background-color: #bdcbc7;}
div#nav-ft li:hover {background: #fcf9ce; }
div#nav-ft li a:hover { color:#226ca0;}
div#nav-ft li a {display:block; padding: 3px 6px 3px 6px; text-decoration: none; color:#833e28; font-weight:bold; font-size:10px;}
* html div#nav-ft li a {padding: 3px 6px 3px 6px;}
div#nav-ft>ul a {width: auto;}


/* #Tablet (Portrait)
================================================== */
    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
		
	body { background:#542366;}	
	.pushfix {padding-right:1px;}  /* This forces the navigation below the logo for tablets. */
	
	/*MAIN NAVIGATION*/
	div#nav ul {margin:25px 0 0 0; padding:0; float:right; background:#542366;}
	div#nav li {position:relative; list-style:none; margin:0; float:left; border-right:1px solid #bdcbc7; background-color:#fcf9ce;}
	div#nav li:hover {background: #bad2a6; }
	div#nav li a:hover { color:#226ca0;}
	div#nav li a {display:block; padding:15px; text-decoration:none; color:#833e28; font-weight:bold; font-size:14px;}
	* html div#nav li a {padding:15px;}
	div#nav>ul a {width: auto;}
	div#nav li.end { border-right:1px solid #fcf9ce;}       
    }

/* #Mobile (Portrait)
================================================== */
    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
       
	body { background:#542366;}
	h1 { font-size: 32px; line-height: 37px; margin-bottom: 8px;}
	h2 { font-size: 25px; line-height: 31px; margin-bottom: 4px;}
	h3 { font-size: 22px; line-height: 28px; margin-bottom: 2px;}

	div#logo {background-image:url(../images/theSEOzone_280.gif); width:280px; height:85px; background-repeat:no-repeat; margin-left:10px;}

	/* NAV */
	div#nav ul { padding:0; float: none;}
	div#nav li { background-color:#b09cb6; border-top:1px solid #bdcbc7; border-right:0; list-style:none inside none;  text-align:center; float: none;}  /* float:left; */
	div#nav li:hover {background: #bad2a6; }
	div#nav li a:hover { color:#226ca0;}
	div#nav li a {color:#833e28; font-weight:bold; font-size:14px; display:block; padding: 15px 20px 15px 20px; text-decoration:none;}
	* html div#nav li a {padding: 15px 20px 15px 20px;}
	div#nav>ul a {width: auto;}  
	div#nav li.end { border-right:0; border-bottom:1px solid #bdcbc7;} 
	
	/*FOOTER NAVIGATION*/
	div#nav-ft ul {padding:0;  background-color: #b09cb6; float:none; }
	div#nav-ft li {background-color: #bdcbc7; border-top:1px solid #b09cb6; border-right:0; list-style:none inside none; text-align:center; float: none;}
	div#nav-ft li:hover {background: #fcf9ce; }
	div#nav-ft li a:hover { color:#226ca0;}
	div#nav-ft li a {display:block; padding: 15px 20px 15px 20px; text-decoration: none; color:#833e28; font-weight:bold; font-size:14px;}
	* html div#nav-ft li a {padding: 3px 6px 3px 6px;}
	div#nav-ft>ul a {width: auto;}
	div#nav-ft li.end { border-right:0; border-bottom:1px solid #b09cb6;} 
		
	h1, h2, h3, h4, header p, section p, footer p, aside p {width:280px; margin:0px auto; border:0 solid #900;}
	 /* This forces a left and right margin on each side of elements. */

    }

/* #Mobile (Landscape)
================================================== */
    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
      
	body { background: #542366;}
	h1 { font-size: 35px; line-height: 40px; margin-bottom: 10px;}
	h2 { font-size: 28px; line-height: 34px; margin-bottom: 8px;}
	h3 { font-size: 22px; line-height: 30px; margin-bottom: 4px;}
	
	div#logo {background-image:url(../images/theSEOzone_320.gif); background-repeat:no-repeat; margin:0; padding:1px; width:320px; height:97px;}
	
	h1, h2, h3, h4, header p, section p, footer p, aside p {width:400px; margin:0px auto; border:0 solid #000;}
	/* This forces a left and right margin on each side of elements. */
    }