/* start of Epanaw Homepage */
body
{
	background:					url(../images/bg.png);
	background-repeat:			repeat-x;
	background-position:		top;
	margin:						0px;
	padding:					0px;
	text-align:					center;

}
p 
{
	font:						14px verdana;
	text-align:					justify;
	color:						black;
	padding-left:				20px;
	padding-right:				20px;
}
p.cont 
{
	font:						14px verdana;
	text-align:					justify;
	color:						black;
	padding-left:				20px;
	padding-right:				20px;
	padding-top:				0px;
}
p.new
{
	font:						12px verdana;
	color:						black;
	padding-left:				15px;
	padding-right:				15px;
	margin-top:					50px;
	text-align:					center;
}
a:link img, a:link
{
	border:						0px;
	background-color:			none;
	text-decoration:			none;
}
a:visited img, a:visited
{
	border:						0px;
	background-color:			none;
	text-decoration:			none;
}
a:hover
{
	color:						white;
}
#box
{
	width:						1080px;
	height:						auto;
	margin-left:				auto;
	margin-right:				auto;
	position:					relative;

	
}
#logoholder
{
	width:						300px;
	height:						110px;
	float:						left;
	margin-left:				 50px;
}
#fbbox
{
	width:						500px;
	height:						100px;
	float:						right;
	margin-right:				 50px;
	padding-top:				5px;

}
.fb
{
	width:						120px;
	height:						 50px;
	float:						right;
	margin-right:				5px;
	margin-top:					3px;
}

.qr
{
	width:						50px;
	height:						 50px;
	float:						right;
	margin-right:				0;
}
.onsite
{	
	width:						550px;
	height:						 50px;
	margin-left:				auto;
	margin-right:				5px;
	background:					url(../images/onsite.png);
	background-repeat:			no-repeat;
	clear:						both;
}
#bgbox
{
	width:						1080px;
	height:			 			auto;
	margin-left:				auto;
	margin-right:				auto;
	clear:						both;
	
}
#top
{
	background:					url(../images/graybacktop.png);
	width:						1020px;
	height:			  			30px;
	background-repeat:			no-repeat;
	background-position:		top;
	margin-left:				auto;
	margin-right:				auto;

}
#mid
{
	width:						1020px;
	height:			 			1300px;
	background:					url(../images/graybackmid.png);
	background-repeat:			repeat-y;
	background-position:		center;
	margin-left:				auto;
	margin-right:				auto;

}
#mid1main
{
	width:						1020px;
	height:			 			auto;
	background:					url(../images/graybackmid.png);
	background-repeat:			repeat-y;
	background-position:		center;
	margin-left:				auto;
	margin-right:				auto;

}
#bot
{
	width:						1080px;
	height:			  			100px;
	background:					url(../images/graybackbot.png);
	background-repeat:			no-repeat;
	background-position:		top;
	margin-left:				auto;
	margin-right:				auto;
}
#container
{
	width:						1020px;
	height:						800px;
	margin-left:				auto;
	margin-right:				auto;

}

#navbox
{
	width:						600px;
	height:						auto;
	margin-left:				auto;
	margin-right:				35px;
	overflow:					hidden;
	padding-top:				1px;
	float:						right;
	
}
.butbox 
{
	color:						white;
	width:						98px;
	height:						 34px;
	display:					inline;
	background:					url(../images/butgray1.png);
	float:						right;
	padding-top:				9px;
	text-align:					center;
	font:						12px arial;
	background-repeat:			no-repeat;
	position:					relative;
	font-weight:				bolder;

}
.butbox a:link
{
	color:						black;
}
.butbox a:visited
{
	color:						black;
}

.butbox1 
{
	color:						white;
	width:						98px;
	height:						 34px;
	background:					url(../images/butblue1.png);
	float:						right;
	padding-top:				9px;
	text-align:					center;
	font:						12px arial;
	background-repeat:			no-repeat;
	position:					relative;
	font-weight:				bolder;
	text-shadow:-.5px -.5px 1px gray;
}
.butbox  a:hover
{
	color:						#D8D8D8;
	width:						98px;
	height:						 34px;
	padding-top:				9px;
	background:					url(../images/butblue1.png);
	float:						right;
	text-align:					center;
	font:						12px arial;
	font-weight:				bolder;
	background-repeat:			no-repeat;
	margin-top:						-9px;
	text-shadow:	1px 1px 1px #3399FF;
	text-decoration:			underline;
	border:						none;

}

.butbox1  a:hover 
{
	color:						#D8D8D8 ;	
	width:						98px;
	height:						 34px;
	display:					inline;
	padding-top:				9px;
	background:					url(../images/butblue1.png);
	float:						right;
	text-align:					center;
	font:						12px arial;
	font-weight:				bolder;
	background-repeat:			no-repeat;
	margin-top:						-9px;
	text-shadow:	1px .1px 1px #3399FF;
	text-decoration:			underline;
	border:						none;

}
.butbox1  a:visited , a:link
{
	font-weight:				bold;
	border:						0px;
	color:						gray;
	text-decoration:			none;
}
#rotatingbox
{
	width:						1020px;
	height:						 380px;
	margin-left:				auto;
	margin-right:				auto;
	background:					url(../images/rotbg.png);
	margin-top:					0px;
}
/* start of content */

#mid1
{
	width:						1000px;
	height:						auto;
	margin-left:				auto;
	margin-right:				auto;
	margin-top:					10px;
}
.content1
{
	width:						750px;
	height:						auto;
	margin-left:				auto;
	margin-right:				auto;
	float:						left;
	background:					url(../images/contbg.png);

}
.content1 h1
{
	font:				26px	impact;
	padding-top:				20px;
	margin-bottom:				0px;
	text-align:					left;
	margin-left:				20px;
	
}
.content1a
{
	width:						750px;
	height:						500px;
	margin-left:				auto;
	margin-right:				auto;
	float:						left;
	background:					url(../images/qs.png);
	background-position:		bottom;
	background-repeat:			no-repeat;

}
#content2
{
	width:						950px;
	height:						200px;
	margin-left:				auto;
	margin-right:				auto;
	clear:						both;
	margin-top:					10px;


}
.tabboxlogo
{
	background:					url(../images/logbg.png);
	background-position:		top-center;
	background-repeat:			no-repeat;
	width:						175px;
	height:						270px;
	margin-left:				20px;
	margin-right:				auto;
	float:						left;

	
}
.tabboxgrap
{
	background:					url(../images/gfxbg.png);
	background-position:		top-center;
	background-repeat:			no-repeat;
	width:						175px;
	height:						270px;
	margin-left:				10px;
	margin-right:				auto;
	float:						left;
}
.tabboxweb
{
	background:					url(../images/webbg.png);
	background-position:		top-center;
	background-repeat:			no-repeat;
	width:						175px;
	height:						270px;
	margin-left:				10px;
	margin-right:				auto;
	float:						left;
}
.tabboxtech
{
	background:					url(../images/techbg.png);
	background-position:		top-center;
	background-repeat:			no-repeat;
	width:						175px;
	height:						270px;
	margin-left:				10px;
	margin-right:				auto;
	float:						left;
}
.tabboxprint
{
	background:					url(../images/printbg.png);
	background-position:		top-center;
	background-repeat:			no-repeat;
	width:						175px;
	height:						270px;
	margin-left:				10px;
	margin-right:				auto;
	float:						left;
}
#sidebox
{
	width:						240px;
	height:						600px;
	float:						right;
	margin-right:				auto;
	background:					url(../images/sidebg.png);
}
#recentbox
{
	width:						220px;
	height:						600px;
	margin-right:				auto;
	margin-left:				auto;
	margin-top:					60px;
	

}
.desbox
{
	width:						100px;
	height:						100px;
	float:						left;
	margin-left:				7px;
	margin-top:					5px;

}
.desbox h1
{
	font:				11px 	arial;
	font-weight:				bold;
	margin-top:					-10px;
	text-align:					center;
	color:						black;
}
/* rotating css  */
#rotating-item-wrapper {
	display: block;
	position: relative;
	width: 980px;
	height: 360px;
	margin-left:auto;
	margin-right:auto;
	top:25px;
}
.rotating-item {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}
/* end of rotating css */
/* footer properties */
#footerbox
{
	width:					1080px;
	height:					 100px;
	margin-left:			auto;
	margin-right:			auto;
	position:				relative;
	margin-bottom:			0px;
}
#footer
{
	width:					500px;
	height:					50px;
	padding-top:			25px;
	margin-left:			50px;
}
#footer ul
{
	font:			10px	verdana;
	list-style-type:		none;
	margin:					0px;
	padding:				0px;
}
#footer ul li 
{
	font:			10px	verdana;
	color:					white;
	float:					left;
	text-align:				left;
	margin-right:			5px;
}
#footer p
{
	font:			11px	arial;
	color:					white;
	text-align:				left;
	position:				absolute;
	margin-left:			-20px;
	line-height:			30px;
}
/* POrpolio Properties */
#portfoliocontainer
{
	width:					960px;
	height:					550px;
	margin-left:			auto;
	margin-right:			auto;
	padding-top:			20px;
	background:				url(../images/portbg.png);
	background-repeat:		no-repeat;
}
.designboxes
{
	width:					120px;
	height:					120px;
	float:					left;
	margin:					4px;

}
/* accordion css properties */
.verticalaccordion>ul {
    margin: 0;
    padding: 0;
    list-style:none;
   	width: 918px;
	margin-left: auto;
	margin-right: auto;
}

.verticalaccordion>ul>li {
    display:block;
	overflow: hidden;
    margin: 0;
    padding: 0;
    list-style:none;
	height:40px;
	width: 918px;

    /* Decorative CSS */



    /* CSS3 Transition Effect */
    transition: height 0.3s ease-in-out;
    -moz-transition: height 0.3s ease-in-out;
    -webkit-transition: height 0.3s ease-in-out;
    -o-transition: height 0.3s ease-in-out;

}

.verticalaccordion>ul>li.graphics>h3 {
    display:block;
    margin: 0;
    padding:10px;
    height:20px;

    /* Decorative CSS */
    border-top:#f0f0f0 1px solid;
    font-family: Arial, Helvetica, sans-serif;
	font-size:	14px;
    text-decoration:none;
    text-transform:uppercase;
    color: #000;
    background: url(../images/libg.png);
	text-align:	center;

}
.verticalaccordion>ul>li.logo>h3 {
    display:block;
    margin: 0;
    padding:10px;
    height:20px;

    /* Decorative CSS */
    border-top:#f0f0f0 1px solid;
    font-family: Arial, Helvetica, sans-serif;
	font-size:	14px;
    text-decoration:none;
    text-transform:uppercase;
    color: #000;
    background: url(../images/libglogo.png);
	text-align:	center;

}
.verticalaccordion>ul>li.web>h3 {
    display:block;
    margin: 0;
    padding:10px;
    height:20px;

    /* Decorative CSS */
    border-top:#f0f0f0 1px solid;
    font-family: Arial, Helvetica, sans-serif;
	font-size:	14px;
    text-decoration:none;
    text-transform:uppercase;
    color: #000;
    background: url(../images/libgweb.png);
	text-align:	center;

}
.verticalaccordion>ul>li.photography>h3 {
    display:block;
    margin: 0;
    padding:10px;
    height:20px;

    /* Decorative CSS */
    border-top:#f0f0f0 1px solid;
    font-family: Arial, Helvetica, sans-serif;
	font-size:	14px;
    text-decoration:none;
    text-transform:uppercase;
    color: #000;
    background: url(../images/libgphotography.png);
	text-align:	center;

}
.verticalaccordion>ul>li>div {
    margin:0;
    overflow: auto;
    padding:10px;
    height:250px;
}

.verticalaccordion>ul>li:hover {
	height: 385px;
}

.verticalaccordion:hover>ul>li:hover>h3 
{
    /* Decorative CSS */
    color:#fff;
    background: url(../images/libghover.png);

   
}
.verticalaccordion:hover>ul>li:hover>h3 
{
    /* Decorative CSS */
    color:#fff;
    background: url(../images/libghover.png);
 
}
.verticalaccordion:hover>ul>li.graphics:hover>h3 
{
    /* Decorative CSS */
    color:#fff;
    background: url(../images/libghover.png);

   
}
.verticalaccordion:hover>ul>li.logo:hover>h3 
{
    /* Decorative CSS */
    color:#fff;
    background: url(../images/libglogohover.png);

   
}
.verticalaccordion:hover>ul>li.web:hover>h3 
{
    /* Decorative CSS */
    color:#fff;
    background: url(../images/libgwebhover.png);

   
}
.verticalaccordion:hover>ul>li.photography:hover>h3 
{
    /* Decorative CSS */
    color:#fff;
    background: url(../images/libgphotographyhover.png);

   
}
.verticalaccordion>ul>li>h3:hover {
    cursor:pointer;
}
/* end of accordion css */