@import url(reset.css);
body{
   background: #272727;
   font: 68.8%/1.2 tahoma, sans-serif;
}

/* =structure
----------------------------------------------- */
#container{
   background: #272727 url(../images/header-line.png) repeat-x 0 69px;
   color: white;
}

#wrapper{ width: 908px; margin: 0 auto; position: relative; }

#header{
   background-color: white;
   padding-top: 176px;
   background-repeat: no-repeat;
}

#content{
   background: white;
   color: #171717;
   padding: 35px 20px 35px 23px;
   margin-left: 1px;
   position: relative;
}

.main{ width: 656px; }

.main2{ width: 636px; }

.main2 p img {
    position: absolute;
    left: 680px;
    margin: 0px;
}

.main3{ width: 550px; }

.main4{ width: 585px; }

.main5{ width: 820px;}

.main5 .last_image{
	margin-left: 28px;
}

.main_black{ width: 856px;}

.sidebar,
.sidebar2,
.sidebar3{ float: right; position: relative; }

.sidebar{ width: 215px; }

.sidebar2{ width: 240px; }

.sidebar3{ width: 193px; }

.largeside{ width: 280px; }

.chart{ text-align: center;}

.chart img {margin-top: 50px;}

/* =elements
----------------------------------------------- */
a{ color: #171717; }

#content p,#content ul,#content ol,#content dl,.sidebar p,
.sidebar2 p, .sidebar3 p{ margin-bottom: 1.5em; }

strong{ font-weight: bold; }

a:hover{ text-decoration: underline !important; }

address{
   font-style: normal;
}

h1{
   font-size: 2.364em;
   font-weight: normal;
   margin-bottom: .5em;
}

.theme_1 h1,
.theme_1 h2,
.theme_2 h1,
.theme_2 h2{ color: #751138; }

.theme_3 h1,
.theme_3 h2{ color: #DC132C; }

.theme_6 h1,
.theme_6 h2{ color: #3C6B1E; }

.theme_4 h1,
.theme_4 h2{ color: #990000; }

.theme_7 h1,
.theme_7 h2{ color: #000033; }

h2{
   font-weight: normal;
   font-family: tahoma;
   font-size: 1.64em;
   margin-bottom: 1.11em;
}

.sidebar2 h2{
   font-size: 1.455em;
   font-family: Tahoma;
   font-weight: bold;
   margin-left: 19px;
   margin-bottom: 8px;
}

select{
	font: 11px Tahoma;
	color: #333333;
	border: 1px solid #34302D;
}

/* =header
----------------------------------------------- */
/* nav */
#nav{ float: left; }

#nav li{
   float: left;
   padding-right: 18px;
   position: relative;
   overflow: hidden;
}

#nav span{
   position: absolute;
   right: 0;
   top:0;
   width: 18px;
   height: 100px;
   background: url(../images/nav-button-alpha.png) no-repeat;
}

#nav .active span{
   background: url(../images/nav-button-active-alpha.png) no-repeat;
}

#nav li.first{ padding-left: 0; background: none; }

#nav a{
   float: left;
   color: white;
   text-decoration: none;
   height: 13px; /*SAFARI FIX!!!! THIS ALLOWS THE BUTTONS IN THE MENU TO EXPAND, DELETE IF NEEDED, BUT DELETE WISELY*/
   padding: 1em 0 1em 18px;
   background: #0E0E0E url(../images/tab.png) no-repeat;
}

#nav .active a{
   color: #000000;
   background: url(../images/tab-active.png) no-repeat;
}

#nav .first a{ padding-left: 19px; }

/* tools */
#tools{
   background: black  url(../images/nav.png) repeat-x;
   overflow: hidden;
   padding: 0.95em 0 0.6em 0;
   height: 18px; /*SAFARI FIX !!!! THIS SPECIFIES HEIGHT FOR THE BOX MENU TO THE RIGHT*/
   border-left: 1px solid black;
}

#tools li{ float: right; margin-right: 17px; }

#tools a{ color: white; }

#tools select{
	width: 115px;
	margin-right: -10px!important;
	padding: 0.05em 0;
	position: relative;
	top: -2px;
}

/* breadcrubms */
#crumbs{
   margin-top: -12px !important;
   margin-bottom: 19px !important;
   position: relative;
}

#crumbs a{ color: #171717; }

/* =subnav
----------------------------------------------- */
.subnav{
   font-size: 1.273em;
   font-family: tahoma;
   font-weight: bold;
   width: 193px;
   margin-bottom: 49px !important;
}

.subnav li{
   background: #F8F8F8 url(../images/subnav-bottom.png) no-repeat left bottom;
   margin-bottom: 11px;
}

.subnav a{
   color: #333333;
   text-decoration: none;
   background: url(../images/subnav-top.png) no-repeat;
   display: block;
   padding: 6px 11px 7px;
}

.subnav a:hover{ text-decoration: underline; }

/* =paging
----------------------------------------------- */
.paging, .paging_black{
   color: white;
   padding: 12px 15px 9px;
   margin-bottom: 0 !important;
   background: #272727;
   border-bottom-width: 2px;
   border-style: solid;
}

.theme_2 .paging{
   background: #4B4846 url(../images/paging-dark.png) no-repeat;
   border-color: #8E8C8B;
}

.theme_5 .paging{
   border-color: #F4E48D;
   background: #151515 url(../images/paging-dark2.png) no-repeat;
}

.theme_3 .paging{
   border-color: #F5EEB9;
   background: #B60F23 url(../images/paging-yellow.png) no-repeat;
}

.theme_6 .paging{
   border-color: #AED193;
   background: #4D8425 url(../images/paging-green.png) no-repeat;
}

.theme_4 .paging{
   border-color: #998289;
   background: #2C0D18 url(../images/paging-purple.png) no-repeat;
}

.theme_7 .paging{
   border-color: #8E8C8B;
   background: #3B3B5A url(../images/paging-blue.png) no-repeat;
}

.paging_black{
   background: #4B4846 url(../images/paging-black.png) no-repeat;
   border-color: #8E8C8B;
}

.paging a, .paging_black a{ color: white; font-weight: bold; text-decoration: none; }

.theme_3 .paging a, .theme_3 .paging strong{ color: black;}

.paging .pages, .paging_black .pages{ float: right; padding: 0 25px; position: relative; }

.pages2 {
	font-weight: bold;
	margin-left: 600px;
}

.pages a {
	font-weight: normal;
}
.pages {font-weight: bold;}

.paging .prev,
.paging .next,
.paging_black .prev,
.paging_black .next{
   height: 18px;
   width: 18px;
   overflow: hidden;
   text-indent: -1000px;
   background-repeat: no-repeat;
   position: absolute;
}

.paging .prev, .paging_black .prev{
   background-image: url(../images/icon-arrow-paging-left.png);
   left: 0;
   top: -2px;
}

.paging .next, .paging_black .next{
   background-image: url(../images/icon-arrow-paging-right.png);
   right: 0;
   top: -2px;
}

/* =preview (product list +single product)
----------------------------------------------- */
.preview{
   background: url(../images/preview.png) repeat-x;
   overflow: hidden;
   padding-top: 28px;
}

.material_preview{
   background: url(../images/preview.png) repeat-x;
   overflow: hidden;
   padding-top: 10px;
}

.preview.product{ padding-top: 13px; }

.preview li{ clear: both; overflow: hidden; padding-bottom: 20px; }

.preview .img{ width: 125px; float: left; }

.preview.product .img{
    width: 190px;
    position: relative;
}

.preview .img img{
   display: block;
   margin: 0 auto;
   border: 1px solid #C9C9C9;
}

.preview .pdf_img{ width: 70px; float: left;}

.preview .pdf_img img{
	display: block;

}

.pdf_img a {
	background: url(../images/icon_download.png) left top no-repeat;
	width: 33px;
	height: 38px;
	display: block;
	margin: 0 auto;
	text-indent: -10000px;
	cursor: pointer;
}

.pdf_img a:hover{
	background: url(../images/icon_download_hover.png) left top no-repeat;
	background-position: 0px -1px;
}

.pdf_desc input{
	float: right;
	background: url(../images/download_icon.png) left top no-repeat;
	border: 0px;
	width: 95px;
	height: 24px;
}

.pdf_desc .button {
	text-indent: -2000px;
	float: right;
	background: url(../images/download_icon.png) left top no-repeat;
	border: 0px;
	width: 95px;
	height: 24px;
}

.preview .pdf_title{ margin-top: 0.7em;}


.preview .pdf_desc{ float: left; width: 565px;}

.preview .desc{ float: left; width: 513px; }

.preview.product .desc{ width: 448px; }

.preview .title{ margin-bottom: 1em !important; }

.preview li.thumbs{
   background: #999999 url(../images/preview-thumbs-fauxcol.png) repeat-y right;
   margin: 6px;
   margin-right: 0;
   padding-bottom: 0;
}

.preview li.thumbs ul{
   margin: 0 !important;
   overflow: hidden;
   padding-bottom: 8px;
   width: 418px;
}

.preview li.thumbs li{
   float: left;
   clear: none;
   margin: 10px 0 0 10px;
   border: 1px solid #707070;
   display: block;
   padding: 2px;
}

.preview li.thumbs li.active{ border: 3px solid white; padding: 0; }

.preview .details{
   margin: 0 !important;
   padding: 0 !important;
   width: 232px !important;
   float: right;
   background: black;
   color: #999999;
}

.preview .details li{
   margin: 0 !important;
   padding: 0 !important;
   border: none !important;
   float: none !important;
   ;
   clear: none !important;
   : ;
}

.preview .details table{ border-collapse: collapse; }

.preview .details td,
.preview .details th{ padding: 8px 9px; }

.preview .details th{
   text-align: center;
   padding-top: 16px;
   padding-bottom: 16px;
}

.preview .details td{ border-top: 1px solid #999999; }

/* =footer
----------------------------------------------- */
#footer{ padding: 17px 16px 50px 18px; }

#footer #comp{ vertical-align: middle; margin: 0 5px; }

#magstudio{ float: right; }

/* footlinks */
#extra-nav{
   min-height: 24px; /* ie6.css */
   border-bottom: 1px solid #030303;
   padding: 10px 19px 0;
   margin-left: 1px;
}

.theme_1 #extra-nav {
   background: #4B001C url(../images/footlinks-red.png) repeat-x bottom;
}

.theme_3 #extra-nav{
   background: #FBF8C7 url(../images/footlinks-yellow.png) repeat-x bottom;
}

.theme_2 #extra-nav,
.theme_5 #extra-nav{
   background: #252525 url(../images/footlinks-dark.png) repeat-x bottom;
}

.theme_6 #extra-nav{
   background: #203C0E url(../images/footlinks-green.png) repeat-x bottom;
}

.theme_4 #extra-nav{
   background: #72052F url(../images/footlinks-purple.png) repeat-x bottom;
}

.theme_7 #extra-nav{
   background: #0D0D31 url(../images/footlinks-blue.png) repeat-x bottom;
}

#extra-nav .links li{ display: inline; margin-right: 11px; }

#extra-nav .links li a{ color: #ccc; }

.theme_3 #extra-nav .links li a{color: black;}

/* =intros
----------------------------------------------- */
.intros{
   margin-right: -24px;
   margin-bottom: -35px !important;
   float: left;
}

.intros li{
   margin-left: -16px;
   float: left;
   width: 205px;
   margin-right: 14px;
   margin-bottom: 25px;
}

.intros .title,
.intros .image{ display: block; position: relative; }

.intros .title{
   font-size: 1.455em;
   font-family: Tahoma;
   background-repeat: no-repeat;
   background-position: left bottom;
   min-height: 30px; /* ie6.css */
   padding: 0 0 0 16px;
}

.intros .title a{ color: black; text-decoration: none; }

.intros .image{
   width: 205px;
   height: 135px;
   background: url(../images/intros-frame.png) no-repeat;
}

.intros .image img{ position: relative; top: 2px; left: 15px; }

.intros .black .title{
   background-image: url(../images/intros-arrow-black.png);
}

.intros  .title{
	font-weight: bold;
}

.intros .velvet .title{
   background-image: url(../images/intros-arrow-velvet.png);
}

.intros .red .title{ background-image: url(../images/intros-arrow-red.png); }

.intros .green .title{
   background-image: url(../images/intros-arrow-green.png);
}

.intros .yellow .title{
   background-image: url(../images/intros-arrow-yellow.png);
}

.intros .blue .title{ background-image: url(../images/intros-arrow-blue.png); }

/* =accents
----------------------------------------------- */
.accents{
   background: url(../images/accents-shaddow.png) repeat-y;
   position: relative;
   padding: 3px 24px 22px 19px;
   width: 197px;
}

.accents p.photo{
   padding: 1px;
   border: 1px solid #CCCCCC;
   padding: 7px;
   text-align: center;
   margin-bottom: 12px !important;
}

.accents p.photo img{  }

.accents .title{ margin-bottom: 8px !important; }

.accents .decor{
   width: 240px;
   height: 13px;
   position: absolute;
   left: 0;
   bottom: 0px; /* ie6.css */
   background: url(../images/accents-bottom.png) no-repeat;
}

/* =photos + captions (sidebar)
----------------------------------------------- */
dl.photos dt a{ position: relative; zoom: 1; }

dl.photos dd{ margin-bottom: 30px; }

dl.photos .zoom{
   width: 22px;
   height: 22px;
   display: block;
   position: absolute;
   right: 2px;
   bottom: 4px;
   background: url(../images/icon-magnifier-alpha.png) no-repeat;
}

/* =misc
----------------------------------------------- */
p.banner{ text-align: center; margin-bottom: 2em !important; }

.toplink{ position: absolute; right: 35px; bottom: 145px; }

.toplink a{
   color: black;
   padding-right: 13px;
   background: url(../images/icon-toplink.png) no-repeat 100% 5px;
}

ul.steps{
   padding-top: 40px;
}

ul.steps li{
   margin-bottom: 13px;
}

p.important{
   font-size: 14px;
}

.left-side{
   float: left;
   width: 230px;
}

.right-side{
   float: left;
   width: 405px;
   margin-left: 30px;
}

/* =morenav
----------------------------------------------- */
.morenav{ margin-top: 25px; }

.morenav .pic{
   display: block;
   width: 75px;
   float: left;
   padding-bottom: 25px;
   background: url(../images/morenav-shadow.png) no-repeat bottom;
}

.morenav .desc{
   float: left;
   padding-left: 13px;
   font-size: 1.455em;
   padding-top: 30px;
}

.morenav li{ clear: both; }

.morenav .pic img{ display: block; border: 2px solid #CCCCCC; }

/* =extranav
----------------------------------------------- */
.extranav{ float: right; position: relative; top: 3px; }

.extranav li{
   float: left;
   margin-left: 14px;
   font-weight: bold;
   overflow: hidden;
   zoom: 1;
}

.extranav .pic{
   float: left;
   display: block;
   margin-right: 7px;
   padding-bottom: 13px;
   background: url(../images/extranav-shadow.jpg) no-repeat bottom;
}

.extranav .pic img{ display: block; border: 1px solid #CCCCCC; }

.extranav .desc{ float: left; padding-top: 12px; }

/* =lists
----------------------------------------------- */

ul.list{
   clear: both;
   overflow: hidden;
   zoom: 1;
   padding-top: 20px;
   width: 750px;
}

ul.list li{
   padding-bottom: 14px;
}

ul.list .pic{
   float: left;
   margin-right: 20px;
}

ul.list .desc{
   display: block;
   overflow: hidden;
   zoom:1;
}
/* =forms
----------------------------------------------- */
.login{
   width: 298px;
}

.contact{
   width: 403px;
}

.contact textarea{
   width: 280px;
   height: 94px;
   overflow: auto;
}

label{
   float: left;
   width: 60px;
   text-align: right;
   padding-right: 5px;
   position: relative;
   top: 4px;

}

form p{
   clear: both;
}

input.text, textarea {
   border: 1px solid #676767;
}

.login input.text{
   width: 178px
}

.login .submit{
   padding-left: 68px;
}

.contact .submit{
   padding-left: 277px; /* ie.css */
}

.submit input{
   border: none;
   padding: 2px 5px;
   color: white;
   background: #78183D;
   font: bold 13px tahoma;
}

/* =box1
----------------------------------------------- */

.box1{
   background: #CCCCCC url(../images/corner-gray-lt.gif) no-repeat;
   margin-bottom: 1.5em;
   }

.box1 .inner1{
   background: url(../images/corner-gray-rt.gif) no-repeat right top;
}

.box1 .inner2{
   background: url(../images/corner-gray-rb.gif) no-repeat right bottom;
}

.box1 .inner3{
   background: url(../images/corner-gray-lb.gif) no-repeat left bottom;
   padding: 27px 24px 10px;
}


/* =self clearing floats
----------------------------------------------- */
#nav:after,
#header:after,
#content:after,
#extra-nav:after,
.intros:after,
.preview li.thumbs ul:after,
.morenav:after,
ul.list li:after{
   content: ".";
   display: block;
   height: 0;
   clear: both;
   visibility: hidden;
}
.material_image {float: left; padding-left: 10px;}
.material_chart {float: right; padding-right: 10px;}

.material_text{
	padding: 10px 10px;
	overflow: hidden;
	zoom: 1;
}

li.none {
	margin-left: 15px;
	font-weight: bold;
}

/* Custom */

li.thumb_li {
	cursor: pointer;
}

span#zoom {
	display: block;
	text-align: right;
    position:absolute;
    z-index:10;
    bottom:5px;
    right:21px;
    cursor:pointer;
    width: 22px;
}

img#magnifier {
	border: none;
}

img#current_image {
	cursor: pointer;
}

.material_preview .pos {
	padding: 0px 8px 15px 8px;
}

ul.rich_cnt {
	list-style-type: inherit;
	list-style-position: inside;
}

ol.rich_cnt {
	list-style-type: decimal;
	list-style-position: inside;
}

/**** STYLES FOR SITEMAP ****/

.sitemap { overflow: hidden; zoom: 1; }
.sitemap .blocks { float: left; width: 178px; margin: 0 14px 14px 0; }
.sitemap .blocks h3 { height: 25px; padding: 5px 0 0 12px; background: #EAEAEA; font: bold 16px Tahoma, Arial, Helvetica, sans-serif; }
.sitemap .blocks h3 a { text-decoration: none; }
.sitemap .blocks ul { margin: 0px !important;/*fix/reset, someone pit margin from outside, not needed here.*/ padding: 15px 0 0 14px; }
.sitemap .blocks ul li { padding: 0 0 3px 0; }
.sitemap .blocks ul li a { text-decoration: none; }