/*   

Theme Name: Professional Website v1-feature

Theme URI: www.magicalsupply.com

Description: A marketing website base on feacture concept with following benefit - Optimum for featured products or business, directional to access the designated information and is emphasize on the innovativeness of the products or businesses. Design by AP, PCT sdn.bhd. copyrighted.

Author: pct production


Version: version 1

*/

/*********** Begin Sturcture **********/
body {
	margin: auto;

}

#page {

width:865px;
margin:0 auto;

}




#content {
width:865px;
margin:0 auto;

}


#content-prop {
float:left;
position:relative;

}

#content-main {

}



#error {
	margin-top: 60px;
}
/*********** End Sturcture **********/


/*********** Begin General setting **********/


h1 {
margin:0;
padding:0;
font-family:Tahoma;
font-size:30px;
color:#494949;



}



h2 {
margin:0;
padding:0;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#000000;




}

h3 {
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color:#14518f;
margin:0;
padding:0;
font-weight:normal;

}


h4 {
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
margin:11px 0 0 0;
padding:0;
color:#000000;
height:30px;
border-bottom:solid 1px #cfcfcf;
width:307px;
text-align:center;
}


h4 a{
color:#000000;
text-decoration:none;

}

h4 a:hover {
color:#9900cc;


}


p {
margin:0;
padding:0;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color:#555555;



}

img {
	border: 0;
}

a {
	outline: none;
}

a img {
	cursor: pointer;
}


/*********** End General setting **********/

/*********** Begin Header **********/
#header {
height:136px;
background-color:#000000;

}

#header-content {
width:960px;
margin:0 auto;
height:136px;
position:relative;

}

#header-contact {
position:absolute;
top:22px;
right:50px;

}

#header-contact p{
color:#ffffff;
font-size:14px;
font-weight:bold;


}



#logo {
float:left;
padding:20px 0 0 48px;

}


/*********** End Header **********/

/*********** Begin Nav **********/




#nav {
margin:0;
padding:93px 0 0 107px;
float:left;


}


#nav ul{
margin:0;
padding:0;
list-style:none;


}

#nav ul li{
margin:0;
padding:0 20px;
float:left;
border-right:solid 1px #717171;


}

#nav ul li p{
margin:0;
padding:0;
font-size:14px;

}


#nav a {
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
color:#717171;
text-decoration:none;
}


#nav a:hover {
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
color:#ffffff;
}






/*********** End Nav **********/


#banner {
height:172px;
background-color:#071321;
}

#banner-contact{
background:url(img/page/banner/Magical-contacts.jpg) scroll center center no-repeat;
height:172px;
margin:0 auto;

}

#banner-services{
background:url(img/page/banner/Magical-services.jpg) scroll center center no-repeat;
height:172px;
margin:0 auto;

}

#banner-prop{
background:url(img/page/banner/Magical-props.jpg) scroll center center no-repeat;
height:172px;
margin:0 auto;

}

#banner-portfolio{
background:url(img/page/banner/Magical-portfolio.jpg) scroll center center no-repeat;
height:172px;
margin:0 auto;

}




#banner-home {
height:331px;
background-color:#071321;

}





/*********** Begin Footer **********/
#footer {
height:52px;
background-color:#000000;
clear:both;

}

#footer-content {
width:960px;
margin:0 auto;

}



#copyright {
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
padding:15px 0 0 0;

}


#mms {

}
/*********** End Footer **********/

/*********** Begin Home **********/
#home {
height:468px;
border-top:solid 1px #cfcfcf;
margin:54px 0 0 0;



}


#prop {
margin:0;
padding:0;
width:865px;
height:765px;
position:relative;
}


#border-prop {
background-color:#CFCFCF;
height:617px;
left:601px;
position:absolute;
top:125px;
width:1px;
}


#h1-icon {
background:url(img/general/1.png) no-repeat left;
height:60px;
border-bottom:solid 1px #cfcfcf;
margin:30px 0 0 0;
}


#h1-icon h1{
margin:0;
padding:0 0 0 60px;

}

#h1-icon p {
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color:#555555;
padding:0 0 0 59px;

}








#h1-icon-contact {
background:url(img/general/Magical-contacts.png) no-repeat left;
height:60px;
border-bottom:solid 1px #cfcfcf;
margin:30px 0 0 0;
}


#h1-icon-contact h1{
margin:0;
padding:0 0 0 60px;

}

#h1-icon-contact p {
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color:#555555;
padding:0 0 0 59px;

}












#content-prop {
position:relative;
}



#prop-layout-1 {
margin:20px 0 0 0;
padding:0;
width:610px;
}

#prop-layout-1 ul{
margin:15px 20px 0 10px;
padding:0;
list-style:none;
float:left;
}

#prop-layout-1 ul li{
margin:0;
padding:0;
}

#prop-layout-1 ul li p{
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#555555;


}

#sidebar-prop-position {
position:absolute;
right:13px;
top:126px;
width:220px;
z-index:5;

}


#sidebar-prop {
margin:0 auto;
padding:19px 0 0;
width:220px;
background-color:#f1f1f1;
}



.sidebar-prop-content {
width:199px;
margin:0 auto;
}




#sidebar-prop ul{
margin:0;
padding:20px 0 0 15px;
list-style:url(img/general/2.png);


}


#sidebar-prop ul li{
margin:0 0 5px;
padding:0;


}

#sidebar-prop ul li p {
margin:0;
padding:0;
}


#sidebar-prop ul li p a{
margin:0;
padding:0;
color:#14518f;
text-decoration:none;




}

#sidebar-prop ul li p a:hover{
color:#3300FF;

}







#sidebar-prop p{
padding:10px 0 20px 0;


}







#sidebar-prop img {
padding:0 0 11px;
}

p#style-1 {
margin:0;
padding:73px 0 5px;
color:#000000;
}


p#style-7 {
margin:0;
padding:53px 0 5px;
color:#000000;
}


p#style-8 {
margin:0;
padding:23px 0 0 0px;
color:#000000;
}





#contact {
height:686px;
}


#contact-content {
margin:0;
padding:0;
height:274px;
border-bottom:solid 1px #cfcfcf;
}

#contact-content iframe {
margin:10px 0 0 6px;
width:850px;
}


#contact-content-2a {
padding:14px 0 0 0;
width:207px;
float:left;
}

#contact-content-2a h2{
margin:0 0 15px 0;

}


#contact-content-2a table {
margin:8px 0;
}

#contact-content-2a table tr td {
padding:0 4px 0 0;
}

#contact-content-2b {
width:317px;
float:left;
padding:14px 0 0 25px;


}

#contact-content-2b .adjust {
width:255px;
height:21px;
border:solid 1px #d0d0d0;
margin:0 0 5px 7px;
}

#contact-content-2b #adjust-2 {
width:299px;
height:108px;
border:solid 1px #d0d0d0;
margin:0 0 5px 7px;
}

#contact-content-2b #style-9 {
margin:0 0 0 120px;
}

#contact-content-2b h2 {
padding:0 0 15px 56px;
}

#contact-content-2c  {
float:right;
width:236px;
padding:20px 0 0 0px;
}

#services {
height:506px;
width:865px;
}

#services {
*height:536px;
width:865px;
}

#services-content-1 {
margin:0;
padding:30px 0 0 145px;
}

#services-content-2 {
border-right:1px solid #cfcfcf;
margin:35px 0 0;
padding:0 50px 0 0;
width:540px;
}

#services-content-2 p{
padding:0 0 20px 0;

}
#services-content-2 h2 {
padding:0 0 3px 0;

}

p.style-2 {
font-family:Arial, Helvetica, sans-serif;
font-size:26px;
color:#868686;
font-style:italic;
padding:10px 0 0 57px;

}



p.style-3 {
font-family: Tahoma;
font-weight:bold;
font-size:12px;
color:#010101;
clear:both;
padding:5px 0 5px 0;



}


p.style-5 {
font-family: Arial, Helvetica, sans-serif;
font-weight:bold;
font-size:12px;
padding:10px 0 5px 0;



}


p.style-5 a{
color:#9900cc;

}


.style-4 {
color:#77009f;

}




#home-content-1 {
margin:22px 0 0 0;
width:850px;
height:194px;



}


.home-content-1a {
margin:0 40px 0 18px;
padding:0;
float:left;
width:225px;
}

/*\*/ * html  .home-content-1a {
margin:0 30px 0 18px;
padding:0;
float:left;
width:225px;
}
/**/ 


.home-content-1a img{
margin:0;
padding:0;
float:left;
}


#home-content-2 {
margin:0;
padding:0;
height:170px;
width:850px;
}

#home-content-2 img{
float:left;
margin:0 20px 0 0;
}

#style-6 {
margin:0;
padding:0;
font-family:Tahoma;
font-size:30px;
color:#494949;
font-weight:bold;
}

#home-content-2 p {
margin:15px 0 0 0;
padding:0;
}


#home-content-3 {
float:right;
margin:-32px 63px 0 0;
}



/*\*/ * html #home-content-3 {
float:right;
margin:-32px 33px 0 0;
}

 /**/
 
 
 
#portfolio {
height:520px;
 width:850px;

 }
 
 
 #portfolio {
*height:550px;
 width:850px;

 }
 
#portfolio-content-1 {
border-right:1px solid #CFCFCF;
margin:35px 0 0;
padding:0 50px 0 0;
width:540px;
}



#portfolio-content-1a {
margin:0;
padding:41px 0 0 117px;
}


#camel {
margin:0;
padding:0;
width:850px;
position:relative;
}





#sound-system {
margin:0;
padding:0;
width:850px;
height:1100px;
position:relative;
}









#simple {
padding:0;
width:541px;
}

#border {
background-color:#CFCFCF;
height:496px;
left:552px;
position:absolute;
top:95px;
width:1px;
}

#border {
background-color:#CFCFCF;
height:496px;
left:552px;
position:absolute;
*top:125px;
width:1px;
}


#client {
width:220px;
margin:30px 0 0 0;
background-color:#f1f1f1;
padding:20px 0 0 0;
height:400px;



}


#client img{
margin:0;
padding:0;
float:left;

}

#client h2 {
padding:20px 0;
}


#prop-layout-1 ul li p a {
color:#555555;
text-decoration:none;
font-size:14px;

}

#prop-layout-1 ul li p a:hover {
color:#9900cc;


}

.sidebar-prop-content h3 a{
color:#14518f;
text-decoration:none;


}


#img-preload {
display:none;
}

.sidebar-prop-content h3 a:hover {
color:#000000;
}

p.style-10 {
height:70px;
}

#flash {
width:960px;
margin:0 auto;
}

img#style-11 {
margin:20px 0 0 0;
}
