/*

	PanGraphX
	http://www.pangraphx.com

*/

/*

	Table of Contents
	
	1. Body
	2. Typography
	3. Image
	4. Header
	5. Content
	6 Footer
	
*/

/*
----------Examples---------
font-family: "verdana";
line-height: 1.5em;
text-align: justify;
text-decoration: underline;
font-size: 1.2em;
font-weight: normal;
display: inline;
font-weight: bold;
background-repeat: no-repeat;
background-position: right;
background-image: url('images/pan.gif');
clear: both;
vertical-align: middle;
background-position: bottom;
border: thin dashed black;
ul { list-style-image: url("http://png.com/ellipse.png") }
background: #011D23 url('<?php echo $background; ?>') no-repeat;background-position: top;
style="background: #e1e1e1 url('<?php echo $background; ?>') repeat-x;"

*/


/*


	----------------------------------------------------------------
	1. Body			
	----------------------------------------------------------------

	
*/

body
{
	padding: 0;
	margin: 0;
	font-size: 12px;
	font-family: "verdana";
	color: #000000;
	background: #e1e1e1 url('/image/body_bg8.gif') repeat-x;
	/*background: #e1e1e1 url('/image/bg/bees_bg2.gif') repeat-x;*/
}

body a img
{
	border: 0px;
}

body p a:hover
{
	color:#0042B3;
	background:#FFDB43;
	text-decoration: none;
}

body p a:link
{
	color: #51B317;
	text-decoration: none;
}

body p a:visited
{
	color: #51B317;
	text-decoration: none;
}

#frame
{ 
	margin: 0 auto;
	width: 920px;/*770*/
	height: 100%;
	border: 0px solid #000000;
}

/*


	----------------------------------------------------------------
	2. Typography			
	----------------------------------------------------------------

	
*/

p
{
	padding: 10px;
}

h1
{
	font-family:Georgia,Times;
	font-size: 10pt;
	font-weight: bold;
	letter-spacing:2px;
	text-align: left;
}

/*


	----------------------------------------------------------------
	3. Image		
	----------------------------------------------------------------

	
*/

.float_right img
{
	margin: 10px 0px 0px 0px;
	float: right;
}

.float_left img
{
	margin: 10px 0px 0px 0px;
	float: left;
}

.grey_background
{
	background: #494747 !important;
}
/*


	----------------------------------------------------------------
	4. Header			
	----------------------------------------------------------------

	
*/

#header 
{
	position:relative;
	float: left;
	width: 840px;
	height: 100%;
	margin-left: 20px;
	padding: 0px 20px 0px 20px;
	color: #ffffff;
	background: #000000;/*url('/image/icon/logo_pangraphx.png') no-repeat;
	background-position: center center; left right center, top center bottom , x% y%*/
	border-bottom: 0px solid #ffffff;
}

#logo
{
	position: relative;
	float: left;
	width: 244px;
	height: 100%;
	padding: 20px 20px 20px 0px;
}

#menu
{
	position: relative;
	float: left;
	width: 860px;
	height: 100%;
	margin: 0px 20px 0px 20px;
	padding: 0px 20px 0px 0px;
	background: #000000;
}

#modernbricksmenu{
padding: 0;
width: 100%;
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}

#modernbricksmenu ul{
font: bold 12px Georgia Serif;
margin:0;
margin-left: 20px; /*margin between first menu item and left browser edge*/
padding: 0;
list-style: none;
}

#modernbricksmenu li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

#modernbricksmenu a{
float: left;
display: block;
color: white;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px;
text-decoration: none;
letter-spacing: 1px;
background-color: black; /*Default menu color*/

}

#modernbricksmenu a:hover
{
	background: #83CFF3;/*83CFF3*/
	color: #000000;
}

#modernbricksmenu .current a{ /*currently selected tab*/
background: #ffffff; /*Brown color theme*/
color: #000000; 
}

#modernbricksmenuline{
clear: both;
padding: 0;
width: 840px;
height: 3px;
line-height: 3px;
margin: 0px 20px 0px 20px;
background: #ffffff; /*Brown color theme*/ 
}

#myform{ /*CSS for sample search box. Remove if desired */
float: right;
margin: 0;
padding: 0;
}

#myform .textinput{
width: 190px;
height: 20px;
border: 0px solid #ffffff;
vertical-align: top;
}

#myform .submit{
font: bold 11px Verdana;
height: 22px;
background-color: #ffffff;
vertical-align: top;
border: 0;
}


/*


	----------------------------------------------------------------
	5. Content			
	----------------------------------------------------------------

	
*/

#content 
{
	position: relative;
	float: left;
	width: 880px;
	height: 100%;
	padding: 0px 20px 20px 20px;
	border: 0px solid #000000;
}

#content_left
{
	position: relative;
	float: left;
	width: 419px;
	height: 100%;
	padding: 10px 10px 10px 0px;
	margin: 20px 0px 20px 0px;
	border-top: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
}
#content_left img
{ 
    float: left; 
    margin: 0px 10px 5px 0px;
}

#content_right
{
	position: relative;
	float: left;
	width: 419px;
	height: 100%;
	padding: 10px 10px 10px 0px;
	margin: 20px 0px 20px 20px;
	border-top: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
}

#video
{
	position: relative;
	float: left;
	width: 840px;
	height: 100%;
	padding: 20px;
	background: #000000;
}

#youtube
{
	position: relative;
	float: left;
	width: 420px;
	height: 100%;
	background: #000000;
}

#zazzle
{
	position: relative;
	float: left;
	width: 400px;
	height: 100%;
	margin-left: 20px;
	color: #ffffff;
}

#all_art
{
	position: relative;
	float: left;
	width: 840px;
	height: 100%;
	padding: 20px 20px 25px 20px;
	border: 0px solid #ffffff;
	background: #000000;
	color: #ffffff;
	
}
#all_art img
{
	padding: 10px 0px 0px 9px;
	width: 126px !important;
}

#web_tools
{
	position: relative;
	float: left;
	height: 100%;
	width: 840px;
	padding: 20px;
}

#contact
{
	position: relative;
	float: left;
	width: 840px;
	height: 100%;
	padding: 20px;
	border: 0px solid #ffffff;
	background: #000000;
	color: #ffffff;
	
}

#layouts
{
	position: relative;
	float: left;
	height: 100%;
	width: 840px;
	background: #000000;
	color: #ffffff;
	padding: 20px 20px 20px 20px;
}

#layouts a img
{
	border: 0px !important;
	vertical-align: top;
}
#layouts img
{
	border: 0px !important;
	vertical-align: top;
	width: 38px;
}
#layouts li:hover
{
	border: 1px solid #51B317;
}
#layouts li
{
	display: inline;
	position: relative;
	float: left;
	font-size: 10px;
	padding: 5px;
	margin: 2px;
	border: 1px solid #C2E8FB;
}


/*


	----------------------------------------------------------------
	6. Footer			
	----------------------------------------------------------------

	
*/

#footer 
{ 
	position: relative;
	float: left;
	width: 880px;
	height: 100%;
	margin: 20px;
	border-top: 3px solid #ffffff;
}
#footer_left
{
	position: relative;
	float: left;
	width: 419px;
	height: 100%;
	padding: 10px 10px 10px 0px;
	margin: 20px 0px 20px 0px;
	border-right: 1px solid #ffffff;
}

#footer_right
{
	position: relative;
	float: left;
	width: 420px;
	height: 100%;
	padding: 10px 10px 10px 0px;
	margin: 20px 0px 20px 20px;
}
