/*-----------------------------------------------------------------------------
Screen CSS file for Hidrosistemas

Created 06 July 2009 by  Fernanda Scur of Purnima Webprojects (purnima.com.br)

-----------------------------------------------------------------------------*/

/* INDEX --------------------------------------------------------------------

[resets]
[general classes]
[general layout]
[header layout]
[content layout]
[footer layout]
[form layout]
[table layout]
---------------------------------------------------------------------------- */


/* resets 
-----------------------------------------------------------------------------*/

/* =typography resets */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
:focus { outline: 0; }
body { line-height: 1; color: black; background: white; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/* =layout resets */

html, body { margin: 0; padding: 0;	border: 0; height:100%;}
img { margin: 0; padding: 0; border: 0; }
a {text-decoration: none;}



/* general classes 
-----------------------------------------------------------------------------*/

a {  color: #214772; text-decoration:none; }
a:hover {text-decoration:none; }
.clear {clear:both;}
.left { float:left}
.right { float:right}
li.phone { 
    background-image: url(../i/ic-phone.png); 
    background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 7px 20px 5px 22px;
	margin: .4em 0;
 }

li.contact { 
    background-image: url(../i/ic-mail.png); 
    background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 7px 5px 5px 22px;
	margin: .4em 0;
 }
 
 li.fax { 
    background-image: url(../i/ic-fax.png); 
    background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 7px 6px 5px 24px;
	margin: .4em 0;
 }

.img-style{ background-color:#eee; border: 1px solid #fff; padding: 4px;}


.img-margin{margin-left: 20px;}

.highlight{font-weight:bold; color: #db0000;}

.lnk-cat {padding-right: 10px; text-transform:lowercase;}


/* general layout 
-----------------------------------------------------------------------------*/

body {background-color: #193657; color: #1e1e1d; font: 85%/1.5 "Lucida Sans",  "Lucida Grande", Tahoma, Verdana, sans-serif; }

#header {background: #fff; height: 138px;}

#content {background: #eee  url(../i/bg-content.png) top repeat-x; overflow:auto; padding-bottom: 20px;}

#footer {background-color: #fff; overflow:auto; position: relative;}


/* header layout 
-----------------------------------------------------------------------------*/

#hd-contact {width: 990px; height:38px;}

#hd-logo-menu {height:100px; background: url(../i/bg-hd-logo-menu.png) top repeat-x;}

#hd-logo-menu img {float: left;}

#hd-contact ul {list-style: none; overflow: hidden;	}

#hd-contact li { float: right; font-size: 0.80em; font-weight: normal; color: #888; }

#hd-contact li a { height: 38px; text-decoration: none; color: #888; }

#hd-contact li a:hover { color: #193556; text-decoration: none;  }

#hd-logo-menu ul { list-style: none; overflow: hidden; float: left; }

#menu li {width: 110px; text-align:center; float: left; }

#menu li a { display: block;
	height: 31px;
	text-decoration: none;
	font-size: 0.70em;
	font-weight: normal;
    color: #e1e5e6;
    padding-top: 44px;
	line-height: 1.3em;
	border-right: 1px solid #5f7d9f;
	}

#menu li a:hover {color: #fff;}

li.hidraulica a { background-image: url(../i/menu.png); background-position: 0 0 ; }

li.hidraulica a:hover { background-image: url(../i/menu.png); background-position: 0 -75px; }

li.hidraulica-current a { background-image: url(../i/menu.png); background-position: 0 -75px; }

li.indramat a { background-image: url(../i/menu.png); background-position: -110px 0; }

li.indramat a:hover { background-image: url(../i/menu.png); background-position: -110px -75px; }

li.indramat-current a { background-image: url(../i/menu.png); background-position: -110px -75px; }

li.star a { background-image: url(../i/menu.png); background-position: -220px 0; }

li.star a:hover { background-image: url(../i/menu.png); background-position: -220px -75px; }

li.star-current a { background-image: url(../i/menu.png); background-position: -220px -75px; }

li.pneumatica a { background-image: url(../i/menu.png); background-position: -330px 0; }

li.pneumatica a:hover { background-image: url(../i/menu.png); background-position: -330px -75px; }

li.pneumatica-current a { background-image: url(../i/menu.png); background-position: -330px -75px; }

li.propria a { background-image: url(../i/menu.png); background-position: -440px 0; }

li.propria a:hover { background-image: url(../i/menu.png); background-position: -440px -75px; }

li.propria-current a { background-image: url(../i/menu.png); background-position: -440px -75px; }

li.catalogos a { background-image: url(../i/menu.png); background-position: -550px 0; }

li.catalogos a:hover { background-image: url(../i/menu.png); background-position: -550px -75px; }

li.catalogos-current a { background-image: url(../i/menu.png); background-position: -550px -75px; }


/* content layout 
-----------------------------------------------------------------------------*/


#content h1 { font-weight:bold; color: #db0000; padding:0 0 0 5px;}

#content h2 {
	margin-top: 10px;
	font-size: 0.9em;
	font-weight:bold;
	color: #193556;
	text-transform: uppercase;
	background-color: #e4e4e4;
	border: 1px solid #fff;
	padding:4px 0 4px 6px;
	overflow:auto;}

#content h2 a:hover {text-decoration: underline}

#content p {padding: 15px 15px 5px 5px; font-size: 0.9em; }

#content p a { border-bottom: 1px solid #fff;  }

#content p a:hover { border-bottom: 1px solid #fff; background-color: #e4e4e4; color: #193556; }

h3 {padding: 10px 0 0 5px; font-size: 0.8em;  font-weight:bold; }

/* Only in the HOMEPAGE
-----------------------------------------------------------------------------*/

#main-col {width: 625px; padding-left: 15px;}

#secondary-col {width: 315px; padding-left: 25px;}

#intro {padding: 0 10px 10px 10px; }

#intro h1 {font-size: 1.2em; }

#carrousel {background: url(../i/bg-carrousel.png) top left no-repeat; padding: 7px 6px 30px 8px; }

#intro {padding: 0 10px 10px 10px; }

#intro h1 {font-size: 1.2em; }

/* Only in INTERNAL PAGES
-----------------------------------------------------------------------------*/

#intern {width: 960px; padding: 0 15px 15px 20px;}

#intern h1 {font-size: 1.2em; }

#intern h4 {font-size: 1.2em; color: #193556; font-weight: bold; }

#produtos ul{font-size: 0.90em; padding: 10px 0 0 4px;}

#produtos ul li {
	background-image: url(../i/blt.png); 
    background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 2px 0 3px 14px;
	margin:.2em 0;}
	


#produtos ul li a {border-bottom: 1px solid #fff;}

#produtos ul li a:hover {border-bottom: 1px solid #fff; background-color: #e4e4e4; color: #193556; }

#breadcrumb {padding: 0  0 5px 5px;}

#breadcrumb li {display: inline; font-size: 0.70em; font-weight: normal; color: #888; }

#breadcrumb li a {color:#888; }

#breadcrumb li a:hover {border-bottom: 1px solid #fff; background-color: #e4e4e4; color: #193556;}

#breadcrumb li.breadcrumb-active {color: #1e1e1d; }

 a.veja {
	background: url(../i/bt-cat.png);
	background-position: 0 0;
	height: 43px;
	width: 196px;
	z-index:999;
}

 a:hover.veja {
	background: url(../i/bt-cat.png);
	background-position: 0 -43px ;
	height: 43px;
	width: 196px;
	z-index:999;

}

a.bt-cat {
	display: block;
	text-align: left;
	text-indent: -9999px;
}

div.address {width: 250px; padding-left: 6px;}

div.news-block {padding-top: 20px;}

/* footer layout 
-----------------------------------------------------------------------------*/
#footer div{   }

#footer h2 { font-size: 0.80em;  font-weight:bold; color: #193556; background-color: #eee; padding:2px 0 2px 6px; margin-right: 3px}

#footer h2 a:hover {text-decoration: underline}

#footer p{padding: 16px 0 0 6px; font-size: 0.90em; font-weight: normal; color: #888; }

#footer ul{ padding-left: 6px;}

#footer li{ font-size: 0.80em; font-weight: normal; color: #888; }

#footer li a:hover { border-bottom: 1px solid #fff; background-color: #eee; color: #193556; }

.ft-div-w {margin:30px 0 30px 20px; border-right:1px solid #eee; width: 260px;}

.ft-div-bosch {margin:30px 0 30px 20px; }

.lnk-map {padding-right: 10px;}

#footer img {position: absolute; bottom:30px; }


/* form layout 
-----------------------------------------------------------------------------*/

.form  {margin: 20px 0 0 0;}

.form fieldset { }

.form ul { margin:0;  list-style:none;}

.form ul li {clear:both; background:none; }

.form ul label {display: block; font-size:0.90em; float: left; width:90px; padding:3px 0; color: #db0000;}

.form .field  {
	display: block;
	float: left;
	padding:3px;
	margin:5px 0 7px 0;
	color:#193556;
	outline:none;
	background:#e4e4e4;
	border:1px solid #fff;
}

.form .txtfield  {
	
	width:200px; 

}

.form .msgfield  {
	
	width:360px; 
	
}

.msg-padding {

padding-left: 40px;
	
}

.form .field:hover, .field:focus, .field:active {  background: #DBDBDB;}

em {font-size:0.9em; color:#1e1e1d; font-style:normal;}

.form .send { 
	width:105px;
	height:35px;
	background:url(../i/bt-form.png) no-repeat;
	padding-bottom:10px; text-align:center;
	border:none;
	margin:15px 0 0px 0;
	border:none;
	color: #fff; 
	font-size: 1.0em;
	font-weight:bold;

}

.form .send:hover {cursor:pointer; color:#fff;}

/* table layout 
-----------------------------------------------------------------------------*/


#table
{
    margin-top: 20px;
	background: #e4e4e4;
	border-collapse: collapse;
	text-align: left;
	border: 1px solid #fff;
}

#table td
{
	border-bottom: 1px solid #fff;
	color: #193556;
	font-size:0.90em;
	font-weight:bold;
	padding: 6px 8px;
}
#table tbody tr:hover td
{
	background: #f1f1f1;
}

#table a:hover
{
 text-decoration:underline;
}