html
{
	font-size: 100%; /* IE hack */
}

*
{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

img {
   border: 0;
}

.access
{
	display: none;
}

/* main divisions */
body
{	
	background: #FBFBFF url(../images/footer.png) repeat-x bottom left;
	font: 0.75em/1.8 "Trebuchet MS", Verdana;

	margin: 30em 0 6em 0;
	
	color: #3333cc;
	color: #444; 
}

html>body
{
	font: 12px/1.8 "Trebuchet MS", Verdana; /* for all normal browser without scaling issues */
}

#header {
	background: #FBFDFF url(../images/logo-tailed.png) no-repeat 0 25px; 
  height: 20em;
  margin: 0 0 0 0;
  padding: 0.5em 0 0 0; 
  left: 0;
  position: absolute;
}

html>body>#header {
	height: auto;
}        

#main #nav-basics li, #nav-basics li {
  display: inline;
  padding: 0 0 0 0;
  margin: 0 0.5em 0 0;
  list-style: none inside;

}

ul.selector li a:link, ul.selector li a:visited {

}              



#main
{ 
  position: relative; 
	padding: 1em 2em 6em 1.4em;	
  font-weight: bold;
  width: 40em;
  margin: 0 0 2em 85px;
  line-height: 1.6;
}

/* html>body>#main {
	   margin: 0 0 2em 85px;
}  */

div#main img {
  float: left;
  padding: 1em 2em 1em 1em;
}

#footer {
   position: relative;
   top: 3em;
   clear: left;
   background-color: #3333cc;
   height: 1.83em;
   margin: 0 5% 0 0;
   background: #3333cc url(../images/logo-tailed.png) no-repeat right 0;
}



#header img {
   height: 9.5em;
   width: 9.5em;
}
 
#header h1
{
	font-size:1.8em;
	padding: 2em 0 1.5em 0;
	margin: 0 0 0 -20px;
	line-height: 2em;
	height: 1px;
	text-indent: -10000px;   
}

#header h1 a#logo
{
   font-size:1px;
   display: block;
   position: absolute;
   top: 0;
   left: 0;
   height: 50px;
   width: 235px;
   cursor: pointer;	
   color: white;
	z-index: 1000;
	background-color: transparent;
	border-bottom: none;
}

#header h2 {
   font-size: 1.6em;
   margin: 0.3em 0 0 80px;
   padding: 0 0 0 0;
	position: relative;
  left: 0;

	top: 0;
	width: 20em;
	text-indent: 0;
}

                

ol#summary h2 {
   display: inline;
   margin: 0 0 0 0;
   left: 0;
}

#main h1, #main h2, h3 
{
   font-size: 1.5em;
   margin: 2em 0 0.5em 0;
   position: relative;
   left: -10px;
}

#main h1 {
  font-size: 1.8em;
  margin: 1em 0 1em 0;
  left: -10px;  
} 

h3 
{
   font-size: 1.2em;
   margin: 2em 0 0.5em 0;
   position: relative;
   left: -10px;
}

#main p, #main ul, #main ol, #main li {
	font-size: 1.2em;
	line-height: 1.5
}

h4 
{
   font-size: 1.3em;
   margin: 2em 0 0.4em 0;
   position: relative;
   left: -5px;
}

a:link,a:visited
{
	color: #333333; 
	color: #3333cc; 
	text-decoration: none;
	border-bottom: #CCCCCC 1px dashed;
}

a:hover, a.current
{
/*	background-color: #3333cc;*/
	/*color: white;*/
/*font-weight: bold;*/
color: #3333cc;
	border-bottom: solid 3px #3333cc;
}

h1 a:hover#logo {
	background-color: transparent;
}

#main a:hover
{
	/*font-weight: normal;*/
}

#main h2 a:hover, #main h3 a:hover, #main h4 a:hover
{
	font-weight: bold;
}



ul#nav, ul#nav li ul li, #sidebar ul, #sidebar ol {
   list-style: none outside;
   margin: 0 0 0 0;

}

#sidebar ul {
   list-style: none;
   margin: 0 0 1em 0; 
   font-weight: bold;
}

/*
ul#nav li ul li a{
   width: 10em;
   display: block;
}
 ul#nav li ul li {
   list-style: inside disc;
   color: #3333cc;
   
}*/

#main p, #main ul, #main li
{
	font-family:"Verdana", "Bitstream Vera Sans", sans;
	font-weight: normal;
}

#main p {
   margin: 0 0 0.8em 0;
}

#main ul, #main ol, #main dl {
	margin: 0 0 0.8em 0;
	line-height: 1.3em;
	background-color: #F9F7FF;   
	background-color:#FFFFFF;   
    border: 1px solid #F1F1F1;
    padding-top: 0.5em; 
 /*border-left: 10px solid #DDEEFF;*/

}
#main li {
	line-height: 1.5em;
	font-size: 0.95em;
	margin: 0 0 0.6em 0;
	padding: 0.3em 1em 0.3em 30px;
	position: relative;
	list-style-position: inside;
}   

#main ul li {
  list-style: none;  
  background: transparent url(../images/blue-dot.png) no-repeat 0.9em 0.65em;       
}
ol#summary {
   margin: 3em 0 2em 0;
}

ol#summary li {
  display: inline;
   margin: 0 1em 0 0;
}


#footer li {
   list-style: none;
   float: left;
   color: white;
   margin: 0 0 0 1em;
}

#footer li a, #footer li a:visited {
   color: white;
   font-weight: bold;
}

#footer li a:hover {
   color: white;
   border-bottom: solid white 0.3em;
   font-weight: bold;
}

p
{
	font-size: 1em;
}

p#c {
   position: absolute;
   top: -3em;
   margin: 0 0 0 55px;
}

ul#bread {
	 font-size: 1em;
   position: absolute;
   top: 0;
   left: 0;
   height: 1.8em;
   width: 43.3em;
   background-color: #F9F7FF;
   display: block;
   margin: 0.1em 0 0 0;
}

#bread ul, #bread li {
   display: inline;
   margin: 0 0 0 0;
   background-color: transparent;
}

p.act {
   padding: 1em;
   background-color: yellow;
   border: solid 1px orange;
   margin: 2em 0 0 0;
}

body#we a.we, body#nosotros a.we,    
body#you a.you, body#tu a.you, 
body#happy-people a.happy-people, body#personas-felices a.happy-people,
body#real-project a.real-project, body#proyecto-real a.real-project,
body#open-web a.open-web, body#open-web a.web-abierta,        
body#default a.default,
body#surfer a.surfer, body#surfer a.default,
body#visitor a.visitor, body#visitor a.default,
body#customer a.customer, body#customer a.default,
body#web a.web,
body#accessibility a.accessibility, body#accessibility a.web,
body#usability a.usability, body#usability a.web,
body#trustability a.trustability, body#trustability a.web,
body#conversion a.conversion,
body#surfer-to-visitor a.surfer-to-visitor, body#surfer-to-visitor a.conversion,
body#visitor-to-customer a.visitor-to-customer, body#visitor-to-customer a.conversion,
body#about a.about,
body#people a.people, body#people a.about,
body#believes a.believes, body#believes a.about,
body#portfolio a.portfolio, body#portfolio a.about,
body#contact a.contact,
body#email a.email, body#email a.contact,
body#call a.call, body#call a.contact,
body#visit a.visit, body#visit a.contact {
   font-weight: bold;
	border-bottom: solid 3px #3333cc;
}

/* pre {
  position: relative;
  z-index: 10000;
  width: 40em; 
  overflow: hidden; 
  padding-right: 0.5em;
  border-right: 1px dashed #ccc;
}            

pre:hover {
  display: block;
  overflow: visible;
  width: 200em;
  background-color: #FFFFCC;
}   

code {
  display: block;
} */



input, textarea {
  font-family:"Verdana", "Bitstream Vera Sans", sans;
  border: 1px solid #F1F1F1;
  margin-right: 1em;
  padding: 0.3em; 
  	color: #3333cc; 
    background-color: white;  
     background-color: #FFFFE8;
     font-weight: normal; 
     line-height: 1.4; 
}         

input {
  width: 16em;   
  background-color: #FFFFE8;
}

input#q {
 margin-right: 0.5em;
 width: 10em;
 
}
input#comment_author_url, input#contact_author_phone {
  background-color: white;
}

  

/*div.commentsblock {
  margin-top: 2em;
} */

h3#respond {
  margin-top: 6em;
}

div.commentsblock, #main ol.commentlist {
  border: none;
  
}

ol.commentlist li {
    border: 1px solid #F1F1F1;  
   background-color: #FFFFE8;   
}

button#search, button#submit {
  text-indent: -10000px;
  border: none;
  width: 26px;
  height: 26px;
  cursor:pointer;
  background: transparent url(../images/button-search.png) no-repeat 0 0;

  padding: 0 0 0 0;
  margin: 0 0 0 0;
  font-size: 10px; 
  
  

}

button#search { 
  position: relative;
  left: 0;
  top: 0;
  vertical-align: middle; /*important for safari button position */
  /*position: absolute;
  bottom: -2px;
  right: 11.5em;*/
}          

button#search:hover, button#submit:hover {
  background: transparent url(../images/button-search.png) no-repeat 0 -26px;
  color: white;    
}



button#submit:hover span {
  color: #3333CC;
}

form#sform {
  display: inline;
  position: relative;
      vertical-align: middle;
  padding: 0 0 0 0;

}   

div#header {
  text-indent: 6em;
  padding: 1em 0 1em 0;
  position: absolute;
  width: 100%;
  top: 3em;
        border-top: 1px solid #F1F1F1;
        border-bottom: 1px solid #F1F1F1; 
   height: 20em; 
   background-color: white;    
   z-index: 0;   
}

div#nav-basics {
    position: absolute;
    top: 2em;
    right: 2em;
    padding: 0 0 0 0;
    line-height: 1.4;
} 

ul#comment-errors, ul#contact-errors {
  background-color: #FFE9E9;
}

ul#comment-errors li, ul#contact-errors li {
  list-style: none;  
  background: transparent url(../images/red.png) no-repeat 0.8em 0.7em;       
}

p#comment-email {
  display: none;
}   
             
/* flickr photos */

#main ul#work {
  height: 400px;
  padding-left: 0.5em;
}

#main ul#work * {
  margin: 0 0 0 0;
  padding: 0 0 0 0;

} 

#main ul#work li {
  display: block;
  float: left;
  width: 75px;
  height: 75px;

  padding: 5px 5px 5px 5px;
  
}
#main ul#work li:hover {


}

#main ul#work li:hover img {
  width: 63px;
  height: 63px; 
}
  
#main ul#work li:hover {
  border: 3px solid #3333cc;
    padding: 3px 3px 3px 3px; 
  width: 63px;
  height: 63px; 
  margin: 5px 5px 5px 5px;
} 
