/* CSS Document */
/* Additional elements to the main 960 grid system, that increments and states echoes4ever layout */
/*
.....................
BODY
.....................
*/
html {
	font-size: 100%; /* Makes sure IE displays em sizes correctly */
}
body
{
	border-top: 1em solid #000;
	background: #000 url(../img/grunge_bg_50.jpg) repeat-x center top;
  /* background: #000;url(../img/12_col.gif) repeat-y center top;*/  

}

/*
.....................
LINKS
.....................
*/
body a{ color: #FFD700; text-decoration:none; padding:0.2em;}
body a:focus,body a:active,body a:hover/*been nice to IE*/{
		/*outline: 1px dotted invert;*/
    color: #FFFF00;
		text-decoration: underline;
    /*text-decoration:underline;*/
		/*background:#5B1619 url(../img/link_pattern.gif) repeat left top;*/
}


/*
.....................
HEADER
.....................
*/

#header{
	height:auto;/*300*/
	z-index:1;
	/*background: #000 url(../img/cloud_bg.jpg) repeat right top;*/
}

#header #logo h1{
padding-top: 0.1em;
padding-left: 0.3em;
text-indent: -5000px;
}
#header #logo h1 a{
display:block;
width:345px;
height:155px;
overflow: hidden;
background: url(../img/logo_echoes.png) no-repeat left center;
}
#header #logo h1 a:hover{
background: url(../img/logo_echoes_on.png) no-repeat left center;
}
#header .breadcrumb{
font-family: "Bookman Old Style", Georgia, Garamond, "Times New Roman", Times, serif;
font-weight:bold;
text-transform:lowercase;
font-size: 2.8em;
color:#EEA616;
margin-top:60px;
}
/*
.....................
MENU
.....................
*/

#menu-items{
	list-style:none;
}
#menu-items .menu-opt{
	display:inline;
	margin:0 0.5em 0 0;
	padding:2.5em 0.5em 0 1em;
	float:left;
	border-left: 1px solid #CE0606;
	text-align:center;
}

#menu-items li a{
    color: #FFD700;
    text-decoration:none;
    padding:2.3em 0 1.5em 0;
}
#menu-items .menu-opt a strong{
	font-size:2.2em;
}

#menu-items .menu-opt a span{
	display:block;
	font-size:1.1em;
	letter-spacing: 0.1em;
	color:#FF0000;
	padding-top:0.5em;
}

#menu-items a:focus, #menu-items a:active, #menu-items a:hover, #menu-items a.selected{
    color: #FFFF00;
    background: url(../img/fire_ico.png) no-repeat center -3px;
}
/*
.....................
BANNERS + h1 titles
.....................
*/
.banner{
	z-index:2;
	margin:0;
	position:relative;
	margin-top:-10em;
	height:23em;
	overflow:hidden;
}

h1.about{
text-indent: -9000px;
width:94em;
height: 23em;
background:url(../img/banner-about-us.jpg) no-repeat left top;
}

h1.what{
text-indent: -9000px;
width:94em;
height: 23em;
background:url(../img/banner-what-we-do.jpg) no-repeat left top;
}

h1.works{
text-indent: -9000px;
width:94em;
height: 23em;
background:url(../img/banner-our-work.jpg) no-repeat left top;
}

h1.contact{
text-indent: -9000px;
width:94em;
height: 23em;
background:url(../img/banner-contact-us.jpg) no-repeat left top;
}

/*
.....................
FEATURED
.....................
*/

#featured{
	position:relative;
	margin:0;
	padding:0;
	/*margin-top:-10em;*/
	margin-bottom: 21em;
}

#featured-img{
	z-index:2;
	position:absolute;
	margin-top:-10em;
	height:31em;
	overflow:hidden;
}

#featured-info{
	z-index:3;
	position:absolute;
	margin-top:-10em;
	background-color:#000;
	height:31em;
}
#featured-info p,h2,h3,span{
	margin:0;/*reset the text.css margin bottom attribute*/
}

#featured-info h3, #featured-info h2{
	margin-top: 0.8em;
	padding: 0 0.8em;
}
#featured-info h3{
  font-weight:lighter;
}
#featured-info span{
	padding: 2.6em;
}
#featured-info p{
	margin-top: 0.8em;
	font-size: 1.3em;
	padding: 0 2em;
}


/*
.....................
LEFT-AREA
.....................
*/

#left-area{
margin-left: 1em;
padding-left: 2.5em;
padding-right: 3.1em;

}

#left-area h1,#left-area h2,#left-area h3,#left-area h4,#left-area h5{
	margin: 0.5em 0 0.5em 0;
}
/*
.....................
SIDEBAR
.....................
*/
#sidebar{
	margin:0em;
	padding:0em;
}
/*
NON-PROFIT .......
*/
#sidebar #non-profit{
	margin-top:2em;
	width:115px;
	height:119px;
}

#sidebar #non-profit span a.badge{
  width: 115px;
  height: 119px;
	border: none;
	text-indent: -9999px;
	display: block;
	background:url(../img/non-profit-badge.png) no-repeat 0em 0.5em;
}
#sidebar #non-profit span a.badge:active, #sidebar #non-profit span a.badge:hover{
	background:url(../img/non-profit-badge-on.png) no-repeat 0em 0.5em;
}
/*
FOSFOROS .......
*/
#sidebar h3.fosforo{
	font-weight:lighter;
	height:9.6em;
	margin-top:3.5em;
	background:url(../img/set_fire.png) no-repeat center bottom;
	font-size:2.8em;
}
#sidebar h3.fosforo:first-letter{
	font-weight:bold;
	margin-left: -0.4em;
	font-size:1.5em;
}
/*
PORTFOLIO PLUS .......
*/
#sidebar #portfolio-plus h5{
	height:1em;
	background:url(../img/fire_title.png) no-repeat -5px -3px;
	padding-left: 2.5em;
	padding-top: 1em;
	margin-bottom: 0.5em;
}

#sidebar #portfolio-plus{
  margin: 3em 0;
}

#sidebar #portfolio-plus p{
    text-align:right;
    font-size: 1.3em;
}

#sidebar #portfolio-plus .portfolio-plus-img{
    margin:0.5em 0;
    height:10em;
		overflow:hidden;
    border:#342211 solid 0.2em;

}
/*
DESIGN SOLUTIONS & SKILLS .......
*/
#sidebar #design-solutions{margin-top:3em;margin-bottom:1.5em;}
#sidebar #design-solutions h5, #sidebar div.skills h5{
	height:1em;
	background:url(../img/fire_title.png) no-repeat -5px -3px;
	padding-left: 2.5em;
	padding-top: 1em;
	margin-bottom: 0.5em;
}

#sidebar #design-solutions li, #sidebar div.skills li{
	font-size: 1.3em;
  line-height:1.2em;
	background:url(../img/fire_ico.png) no-repeat left 0.2em;
	padding-left: 1.5em;
  padding-top: 0.5em;
  padding-bottom: 0.6em;
  border-bottom:/*#342211*/#7A5408 dotted thin;
	width:83%;
}



/*
.....................
OUR WORKS
.....................
*/

.work-block{
	margin: 1.6em 0 3.2em 0;
	border-top: #EEA616 dotted thin;
}
.work-block h2{
	padding: 0.3em 0;
	border-bottom: #EEA616 dotted thin;
}
.work-block .grid_8, .work-block .grid_4{
  margin-top:0.3em;						
}
.work-block .imagem{
	overflow:hidden;
}
.work-block .grid_4{
	border-bottom: #EEA616 dotted thin;		
}
.work-block .grid_4 .case-info p{
  font-size: 1.1em;
  text-align: right;
}
.work-block .grid_4 p{
    padding: 0.3em;
}
.work-block .grid_4 p.time{
		font-size: 1em;						
}
.work-block .grid_4 h4{
  padding: 0.3em;
	/*border-top: #EEA616 dotted thin;*/
	border-bottom: #EEA616 dotted thin;
}


/*
.....................
CONTACT
.....................
*/

#quick-form label{ font-size: 1.6em;}

#quick-form textarea:focus,#quick-form input:focus,#quick-form select:focus{border-color: #FF6600;}

#quick-form input, #quick-form textarea, #quick-form select{
	font-family: "Trebuchet Ms", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
  border: #951313 solid 3px;
  background-color: #000;
  padding: 0.5em;
  margin-top:0.5em;
  color:#FC4100;
  font-size: 1.3em;
	width:90%;

}
#quick-form textarea{
}

#quick-form .aviso {border-color: #E74343;}

#quick-form span.errorMessage{
		display:block;
		padding:0.3em;
		font-size: 1.3em;
		color:#FFCC00;
}

/*
.....................
FOOTER
.....................
*/

#footer{
    clear:both;
		margin-top:2.5em;
    width:100%;
    padding: 2em 0 2em 0;
    border-top: #951313 solid thin;
    background: #000 url(../img/footer_bg.jpg) repeat-x center top;
}

#footer h3, #footer h5{
				margin: 0em 0 0.5em 0;
}

#footer label{
    font-size: 2em;
}
#footer #footer-contact .grid_7{
    background: url(../img/footer_fire.png) no-repeat right bottom;
}

#footer input, #footer textarea, #footer select{
  border: #951313 solid 0.2em;
  background-color: #000;
  padding: 0.5em;
  margin-top:0.5em;
  color:#FC4100;
  font-size: 1.3em;
  width:90%;
}

#footer #short-form{
      background: url(../img/footer_light.png) no-repeat left top;
      padding-top:3.5em;
      margin-top:-3em;
}

#short-form #chega-pra-la{
  float:left;
}

#short-form #que-eu-deixo{
    margin-left: 18em;
}

.send-short-form{
   background: url(../img/bt_form_bg.jpg) no-repeat left bottom;
   background-color: #951313;
   cursor:pointer;
   color: #FFD700;
   width:100%;
   font-weight: bold;
}
.send-short-form:hover{
   background: url(../img/bt_form_bg.jpg) no-repeat right bottom;
   border-color: #FFFF00;
   color: #FFFF00;
}

textarea:focus, input:focus, select:focus, #quick-form textarea:focus,#quick-form input:focus,#quick-form select:focus{
   border-color: #FF6600;
}

#footer .colophon{
padding-top:3em;
}
#footer .colophon li{
  list-style: none;
  display: inline;
  float: left;
	font-size: 1.6em;
	margin-bottom: 1em;
}

#footer .colophon p{
   font-size: 1.1em;
}


/*
.....................
HCARD
.....................

#hcard-Jonathas-Scott{
	margin:0;
	margin-top: 48px;
	padding:0;
	width: 300px;
}
.fn, .org, .email, .locality, .tel, .region, .country-name{
	font-family: "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	font-size: 12px;
	padding: 2px;
	margin:2px 0 2px 0;
	background-color:#000000;
}
.fn{
	font-size: 18px;
}
.org{
	width: 250px;
}
.email{
	background-image:url(imgs/email-contact-green.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	padding-left: 16px;
}
.adr{
	margin-top: 2px;
}
.tel{
	width: 100px;
	background-image:url(imgs/user-comment-green.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	padding-left: 16px;
}
*/