html, body {
	height:100%;
} 
	
body{
  	margin: 0 auto;
  	padding: 0;
 	background-color:#212F38;
	background-image: url('images/bg-fiberware.jpg');
	background-repeat:repeat-x;
    font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	color: #cccccc;
}

.main {
/*	position:relative;*/
	width:900px;
	margin: 0 auto;
}

.top{
	margin: 0 auto;
	width:100%;
	margin-top:25px;
}

.top h1{
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	font-style:italic;
	color:#FFFFFF;
	text-align: left;
	margin-left:240px;
	margin-bottom:20px;
	margin-top: -10px;
}

a:link, a:active, a:visited {
	color:#cccccc;
	text-decoration: underline;
}

a:hover{
	text-decoration: underline;
	color:#ffffff;
}


.menu{
	float:left;
	width:100%;
	height:50px;	
    overflow:hidden;
    position:relative;
	padding:0;
	margin: 0 auto;
}

.menu ul {
    clear:left;
    float:left;
    list-style:none;
	margin: 0 auto;
    padding:0;
    position:relative;
    left:50%;
    text-align:center;
}

.menu li {
   display:block;
   float:left;
   list-style:none;
   margin:0 auto;
   padding:0;
   position:relative;
   right:50%;
}

.menu a, .menu a:visited, .menu a:active{
   	padding:0px 2px;
	float: left;
	width: 176px;
	height: 50px;
	padding-top: 15px;
	background: url(images/menu-inativo.jpg) no-repeat;
	text-decoration: none;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight:bold;
	color: #FFFFFF;
}

.menu a:visited{
   	padding:0px 2px;
	float: left;
	width: 176px;
	height: 50px;
	padding-top: 15px;
	background: url(images/menu-inativo.jpg) no-repeat;
	text-decoration: none;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight:bold;
	color: #FFFFFF;
}

.menu a:hover {
	background: url(images/menu-ativo.jpg) no-repeat;
	color: #666666;
}

.destaque{
	clear: left;
	width:897px;
	height:250px;
	background-color:#dde4ea;
}

.conteudo{
	width:897px;
	border-top: #568fbc solid 3px;
	margin-top:5px;
}

h1{
	font-family: Arial, Helvetica, sans-serif;
	font-size:24px;
}

h2{
	font-family: Arial, Helvetica, sans-serif;
	font-size:16px;
	color: #568fbc;
}

h3 a{
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	color: #568fbc;
}

img, img a{
	border: none;
}

hr{
	border: #568fbc dotted 1px;
}

.pagina{
	width:60%;
	float:left;
	margin:15px 0px 0px 25px;
	padding:0px 25px 0px 0px;
	border-right: #568fbc dotted 1px;
}

p{
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	color: #cccccc;
}

.coluna{
	width:31%;
	float:left;
	margin:15px 0px 0px 25px;
	_width:29%;
	_margin:15px 0px 0px 20px;

}

.coluna p, .coluna ul{
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #cccccc;
}

.coluna img {
	border: none;
	float:left;
	padding-right:10px;
}

p img {
	border: none;
	float:right;
	padding-left:20px;
}

.clear{
	clear:both;
}

.rodape{
	width:897px;
	height:30px;
	margin:0 auto;
	border-top: #568fbc solid 3px;
	padding:5px 0 0 0;
	font-size:12px;
}

.left{
	float:left;
}

.right{
	float:right;
}

.down {
	margin:0;
	padding:0;
	list-style: none;
	}
	
.down li {
	text-align:left;
	}
	
.down li a, .down  li a:visited {
	height:1%;
	text-decoration:underline;
	font-weight:bold;
	display:block;
	padding:15px 0px 15px 35px;
	background: url(images/download.gif) no-repeat 0 50%;
	}
	
.down  ul li a:hover {
	font-weight:bold;
	background: url(images/download.gif) no-repeat 0 50%;
	}

/* BANNER */

.stepcarousel{
position: relative; /*leave this value alone*/
background-image:url(images/bgBanner.gif);
background-repeat:repeat-x;
/*border: 10px solid black;*/
overflow: scroll; /*leave this value alone*/
width: 897px; /*Width of Carousel Viewer itself*/
height: 250px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 10px; /*margin around each panel*/
width: 897px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
text-align:center;

}

.stepcarousel .panel .box{
	width:725px;
	text-align:center;
	margin:0 auto;

}

.stepcarousel .panel .box .image{
	float: left;
	width:290px;
	height:220px;
	border:5px solid #A6A6A6;

}

.stepcarousel .panel .box .text{
	float: left;
	width:350px;
	margin-right:40px;
	text-align:left;
	margin-top:40px;
	color:#666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
}

.stepcarousel .panel .box .text h1{
	color:#568FBC;
	font-size:28px;
	font-style:normal;
	text-align:left;
	margin-left:0;
	margin-top:0;
	
	
}
