body {margin: 0px; padding:0px;}
h1{font-family: Verdana, Arial, Helvetica;font-size: 12px; color: #000000;}
h2{font: bold 11px Verdana, sans-serif; color: #af0f0f;}
/*table{empty-cells:show;}*/

#header{border-right:1px solid #dfdfdf; border-left:1px solid #dfdfdf; width:1000px;margin-left:auto;margin-right:auto;}
#maincontent{border-right:1px solid #dfdfdf; border-left:1px solid #dfdfdf; width:1000px;margin-left:auto;margin-right:auto;}
#footer{border-right:1px solid #dfdfdf; border-left:1px solid #dfdfdf; width:1000px;margin-left:auto;margin-right:auto;}
#maincontent .leftcontent{background-image:url(../images/contentback2.png);background-repeat:repeat-x;width:218px;}
#maincontent .centercontent{background-image:url(../images/contentback2.png);background-repeat:repeat-x;}
#maincontent .centercontentfull{ background-color:#efefef;}


/*font*/
.maintext { font-family: Verdana, Arial, Tahoma, Helvetica; font-size: 10px; line-height: 13px; color: #888484;}
.footer{ font-family: Verdana, Arial, Tahoma, Helvetica; font-size: 10px; color: #888484;}
.footnote{ font-family: Verdana, Verdana, Tahoma, Helvetica; font-size: 10px; line-height: 12px; color: #252525}
.copyright { font-family: Verdana, Verdana, Tahoma, Helvetica; font-size: 10px; line-height: 13px; color: #888484;}
.header{font-family: Verdana, Arial, Tahoma,Helvetica;font-size: 10px; color: #af0f0f;font-weight:bold;}
.header2{font-family: Verdana, Arial, Tahoma,Helvetica;font-size: 12px; color: #000000;font-weight:bold;}
.header3{font-family: Verdana, Arial, Tahoma,Helvetica;font-size: 11px; color: #af0f0f;font-weight:bold;}
.normfont{font-family: verdana, Arial, Tahoma,Helvetica;font-size: 11px; color: #454545;}
.smallnormfont{font-family: verdana, Arial, Tahoma,Helvetica;font-size: 10px; color:#565656;}
.synopsisfont{font-family: verdana, Arial, Tahoma,Helvetica;font-size: 10px; color:#565656; text-align:justify;}
.tablefont { font-family: Tahoma, verdana, Tahoma, Helvetica; font-size: 11px; line-height: 14px;  color: #000000}
.leftmenubox{ background-color:#f6f6f6; border:1px solid #b7b5b5;}
.titlebox{ background-color:#f4f4f4;}
.titlebox2{ background-color:#f4f4f4;font-family: Verdana, Arial, Helvetica;font-size: 10px; color: #af0f0f;}
.productttl{font-family: Arial, Verdana, Helvetica;font-size: 18px; color: #434343; margin-top:0px; margin-bottom:0px;}
.ttl{font-family: arial;font-size: 15px; color: #434343; font-weight:bold; letter-spacing: -1px; margin-top:0px; margin-bottom:0px; }
.subbannerttl{font-family: arial, Verdana, Helvetica;font-size: 15px; color: #030303;}
.searchurl{color: #af0f0f;}
.note1{font-family: verdana, Arial, Tahoma,Helvetica;font-size: 10px; color:#000000; font-weight:bold;}
.note2{font-family: verdana, Arial, Tahoma,Helvetica;font-size: 10px; color:#565656;background-color:#f4f4f4;}
/*forms*/
input {	
		border:1px solid #b7b6b6;
		font-family: verdana, tahoma, arial, Helvetica;
		color:#333333;
		background-color: #ffffff; padding:1px 5px 1px 5px;}

select {	
		border-left: #dedede 1px solid;
		border-right: #dedede 1px solid;
		border-top: #dedede 1px solid;
		border-bottom: #dedede 1px solid;
		width:120px;
		padding:1px 5px 1px 5px;
		font-size: 10px;
		color: #121212;
		font-family: verdana, tahoma, arial, Helvetica;
		background-color: #ffffff }

input.search {
	width:31px;
	height:20px;
	border:0;
}

/*links*/
a.leftmenu { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 11px; color: #000000; text-decoration: none}
a.leftmenu:visited { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 11px; color: #000000; text-decoration: none}
a.leftmenu:hover { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 11px; color: #e21a0f; text-decoration: none}
a.normlink { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #565656;font-weight:none;}
a.normlink:visited { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #000000;font-weight:none;}
a.normlink:hover { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #af0f0f;font-weight:none;}
a.promolink { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #af0f0f;font-weight:none;}
a.promolink:visited { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #000000;font-weight:none;}
a.headerlink { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #565656; text-decoration: underline; font-weight:bold;}
a.headerlink:visited { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #565656; text-decoration: underline; font-weight:bold;}
a.headerlink:hover { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #af0f0f; text-decoration: underline;font-weight:bold;}
a.footer { font-family: Verdana, Verdana, Arial, Helvetica;font-size: 10px; color: #888484; text-decoration: none}
a.footer:visited { font-family: Verdana, Verdana, Arial, Helvetica;font-size: 10px; color: #888484; text-decoration: none}
a.footer:hover { font-family: Verdana, Verdana, Arial, Helvetica;font-size: 10px; color: #e21a0f; text-decoration: none}

a.smalllink { font-family: arial, Verdana, Arial, Helvetica;font-size: 9px; color: #a5120b; text-decoration: none}
a.smalllink:visited { font-family: arial, Verdana, Arial, Helvetica;font-size: 9px; color: #a5120b; text-decoration: none}
a.smalllink:hover { font-family: arial, Verdana, Arial, Helvetica;font-size: 9px; color: #a5120b; text-decoration:none}
a.closelink { font-family: arial, Verdana, Arial, Helvetica;font-size: 11px; color: #a5120b; text-decoration: none}
a.closelink:visited { font-family: arial, Verdana, Arial, Helvetica;font-size: 11px; color: #a5120b; text-decoration: none}
a.closelink:hover { font-family: arial, Verdana, Arial, Helvetica;font-size: 11px; color: #a5120b; text-decoration: none}
a.sitemaplink { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#565656;text-decoration: none;}
a.sitemaplink:visited { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#565656;text-decoration: none;}
a.sitemaplink:hover { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#af0f0f;text-decoration: underline;}
a.searchlink { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#565656;text-decoration: underline;}
a.searchlink:visited { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#565656;text-decoration: underline;}
a.searchlink:hover { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#af0f0f;text-decoration: underline;}

a.redlink{font-family: Verdana, Arial, Tahoma,Helvetica;font-size: 11px; color: #af0f0f;font-weight:bold;text-decoration: underline;}
a.redlink:hover{font-family: Verdana, Arial, Tahoma,Helvetica;font-size: 11px; color: #af0f0f;font-weight:bold;text-decoration: underline;}
a.redlink:visited{font-family: Verdana, Arial, Tahoma,Helvetica;font-size: 11px; color: #af0f0f;font-weight:bold;text-decoration: underline;}

a.ttllink {font-family: Verdana, Arial, Helvetica;font-size: 12px; color: #000000; font-weight:bold;  margin-top:0px; margin-bottom:0px; text-decoration: underline;}
a.ttllink:visited {font-family: Verdana, Arial, Helvetica;font-size: 12px; color: #000000; font-weight:bold;  margin-top:0px; margin-bottom:0px; text-decoration: underline;}
a.ttllink:hover {font-family: Verdana, Arial, Helvetica;font-size: 12px; color: #af0f0f; font-weight:bold;  margin-top:0px; margin-bottom:0px; text-decoration: underline;}

/*greyout*/
.dialogueContainer
{
	position: absolute;
	left: 60%;
	margin-left: -175px;
	top: /*80px*/ 20px;
/*	filter: alpha(opacity=20);*/
	
	
	background-color: #FFFFFF;
	font-size: 11px;
	color: #000000;
	font-family: verdana, tahoma, arial, Helvetica;
	z-index: 2000;
	border:3px solid #ccc;
	height:480px;width:460px; background-image:url(../images/divback.jpg); background-repeat:no-repeat;
}
.dialogueData
{
	padding: 15px;
	height:450px;
	width:430px;
	text-align:left;
	overflow:auto;
}
a.closedialogue {background:url(http://media.canon-asia.com/images/x.png) no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; right:-18px; cursor:pointer;}


/*tooltip*/
#dhtmltooltip{
font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color: #000000;
position: absolute;
left: -300px;
width: 180px;
border: 1px solid #666666;
padding: 5px;
background-color: lightyellow;
visibility: hidden;
z-index: 100;

}

.divtooltip{
font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color: #000000;
border: 1px solid #666666;
padding: 5px;
background-color: lightyellow;
}

#dhtmlpointer{
position:absolute;
left: -300px;
z-index: 101;
visibility: hidden;

}
hr{color:#d9d9d9; height:1px;}

/*cps*/
.whitefont{font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#ffffff;}
.cpsheader{font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#999999; font-weight:bold;}
a.cpslink { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#ffffff;text-decoration: underline;}
a.cpslink:visited { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#ffffff;text-decoration: underline;}
a.cpslink:hover { font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#af0f0f;text-decoration: underline;}


.techlist img{padding:10px;vertical-align:middle}


/*multi-angle*/
.viewmoreangles {
	position: absolute;
	text-align:center;
	width:383px;
	left: 0px;
	top: 245px;
	}
	
a.angleslink { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #565656;font-weight:none;text-decoration: none}
a.angleslink:hover { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #565656;font-weight:none;text-decoration: none}

.dialogueContainer2
{
position: absolute;
/*	position: fixed;*/
	left: 50%;
	margin-left: -300px;
	top: /*80px*/ 75px;
/*	filter: alpha(opacity=20);*/
	
	
	background-color: #FFFFFF;
	color: #000000;
	font-family: verdana, tahoma, arial,Helvetica;font-size: 10px; color:#565656;
	z-index: 2000;
	border:3px solid #ccc;
	height:450px;width:616px; background-image:url(../images/divback2.jpg); background-repeat:no-repeat;
}
.dialogueData2
{
	padding: 0px;
	height:450px;
	width:616px;
	text-align:left; margin-bottom:0;
	/*overflow:auto;*/
}
.topborder{border-top:1px solid #e4e4e4;}
.rightborder{border-right:1px solid #e4e4e4;}


/*share*/
div.shareicons { border: 1px solid #d3d3d3; background-color:#FFFFFF;padding: 5px; }
a.bookmarklink { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #666666;font-weight:none;text-decoration:none;padding:3px}
a.bookmarklink:visited { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #666666;font-weight:none;text-decoration:none;}
a.bookmarklink:hover { font-family: Verdana, arial, Tahoma, Helvetica; font-size: 10px; color: #af0f0f;font-weight:none;text-decoration:none;}





/*zoomimage*/
.image-box{
  position:relative;
  border:0px solid #000;
  margin:0 0 1em;
  overflow:hidden;
  cursor:move;
}
.image-box img{
  position:relative;
  top:0;
  left:0;
}
	 
/* slider css */
#scale-track{
  width:400px;
  height:18px;
   background-image:url(../images/productangles/scrollertrack.gif);
}
#scale-track #scale-handle{
  width:9px;
  height:18px;
  /* background-color:#f00;*/
  background-image:url(../images/productangles/scroller.gif);
  background-repeat:no-repeat;
}




/* tabs */

@media screen {

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
 margin-top:1em;
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
margin:0;
 padding: 3px 0;
/* border-bottom: 1px solid #a9a7a7;*/

 font: bold 10px Verdana, sans-serif;
}

ul.tabbernav li
{
 list-style: none;
 margin: 0;
 display: inline;
}

ul.tabbernav li a
{
 padding: 1em 1em 1em 1em;

 margin-left: 5px;
 border: 1px solid #cccccc;
 border-bottom: none;
 background: #fff;
 text-decoration: none;
}


ul.tabbernav li a:link { color: #4f4f4f; }
ul.tabbernav li a:visited { color: #4f4f4f; }

ul.tabbernav li a:hover
{
 color: #e21e13;
 background: #fff;
 border-color: #a9a7a7;
}

ul.tabbernav li.tabberactive a
{
color: #000;
 background-color: #fff;
border-color: #a9a7a7;
 border-bottom: 1px solid #fff;
}

ul.tabbernav li.tabberactive a:hover
{
 color: #000;
 background: white;
 border-bottom: 1px solid white;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding: 5px 1em 1em 2em;

margin-top:7px;
 border:1px solid #a9a7a7;
 margin-left: 5px;



 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 display:none;
}
.tabberlive .tabbertab h3 {
 display:none;
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}


} /*@media screen {*/





/*printing*/
@media print {

 #header,#maincontent,#footer {
  width:100%;
 }
 .widewidth {
  width:100%;
 }
 .noprint {
  display:none;
 }

 .dialogueContainer, .dialogueContainer2, .tabbernav {
  display:none;
 }

 .viewmoreangles {
  display:none;
 }

}
