/**************************************************************
   AUTHOR:  Pat Heard (fullahead.org)
   DATE:    2006.03.19
   PURPOSE: Controls the layout of the site and styles
            the menus
 **************************************************************/


/**************************************************************
   #content: Sets the width of the site.  Make changes here
             to convert to a fixed width site.
 **************************************************************/

#content{  
  text-align: left;
  width: 900px;
  margin: 0 auto;
}

/**************************************************************
   #header: Holds the site title and header images
 **************************************************************/

#header {
  position: relative;
  height:100px;
}

/* Holds the site title and subtitle */
h1#logo {
	float:left;
	width:200px;
	height:45px;
	padding:0;
	margin:0;
	margin-top:20px;
}
#banner {
  position: relative;
  height:268px;
  width:100%;
  background-position:right center;
  background-repeat:no-repeat;
}

#banner-seccion {
	float:left;
	width:60%;
	font-size:120%;
}
#banner-seccion h2 {
	color:#fff;
	font-family: Georgia,"Times New Roman",Times,serif;
	font-size:2.8em;
	padding-top:.5em;
}
#banner-seccion p {
	color:#fff;
}

/**************************************************************
   #mainMenu: The top level site menu
 **************************************************************/

#mainMenu {
	padding:0; 
	margin:0;
	list-style: none;
	float:right;
	margin-top:48px;
}

#mainMenu li {
  display: inline;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size:.9em;
}

#mainMenu li a {
	display: block;
	float: left;
	padding:.9em 1.2em;
	font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
	color: #000;
	text-transform: lowercase;
	text-decoration: none;
	font-size: 120%;
}

#mainMenu li a:hover{text-decoration:underline; color: #000;}
#mainMenu li.here a {
	background-color:#cc6600; background-color:#c06605; color:#FFFFFF;
}

#mainMenu li.last a {
  margin-right: 0;
}

/**************************************************************
slider: The slide
 **************************************************************/
#slider{ margin-bottom:-22px;}	
#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style:none;
	}
#slider li{ 
	width:696px;
	height:241px;
	overflow:hidden; 
	}	
#prevBtn, #nextBtn{ 
	width:30px;
	height:20px;
	background:#fff;
	float:left;
	}	
#nextBtn{ 
	float:right;
	}														
#prevBtn a, #nextBtn a{  
		
	}	
#nextBtn a{ 

	}	


/**************************************************************
   .sideMenu: The side bar menu
 **************************************************************/

div#sideMenu ul{
  margin: 0;
  padding: .5em 0;
}

div#sideMenu ul li {
  display: inline;
  /* Needed since IE fails when you give it list-style: none; */  
  list-style-image: url(foo.gif);
}

div#sideMenu ul li a {
  display: block;
  margin: 0.2em 0;
  padding: .2em .4em;    
  text-decoration: none;
  font-size:1.3em;
} 

div#sideMenu ul li a:hover {
  color: #fff;
  background: #ccc;
}

/* Active menu item */
div#sideMenu ul li.here a{
  display: block;  
  color: #fff;
  background: #ccc;
}


/**************************************************************
   menu central servicios
 **************************************************************/
ul#menuServicios{ padding:2em 0;}
ul#menuServicios li{ display:block; padding-left:8em; list-style-type:none; margin-bottom:3em; background:center left no-repeat}
ul#menuServicios li.desarrollo_web{ background-image:url('/img/servicios_mini/desarrollo_web.png')}
ul#menuServicios li.posicionamiento{ background-image:url('/img/servicios_mini/posicionamiento.png')}
ul#menuServicios li.registro_de_dominios{ background-image:url('/img/servicios_mini/registro_de_dominios.png')}
ul#menuServicios li.hosting{ background-image:url('/img/servicios_mini/hosting.png')}
ul#menuServicios li h3{ padding:0; padding-bottom:.2em; margin:0; }
ul#menuServicios li p{ padding:0;margin:0; }

/**************************************************************
   dl inicio
 **************************************************************/
ul.fc_es {
	display:inline;
	float:left;
	padding:0;
	padding-top:1.5em;
	margin:0;
}

ul.fc_es li{ 
	padding:1.5em 0;
	float:left;
	display:inline;
	width:50%;
}
ul.fc_es li.first{ clear:both; }
ul.fc_es li h4{ 
	font-size:140%;
	color:#FF6600;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	padding:0 15px;
}

ul.fc_es li p{ 
	float:left;
	padding:0 15px;
	text-align:left;
	font-style:normal;
}

ul.fc_es li.first h4,ul.fc_es li.first p{ 
	padding-left:0;
}
ul.fc_es li.last h4,ul.fc_es li.last p{ 
	padding-right:0;
}
/**************************************************************
   dl portfolio
 **************************************************************/
ul.portfolio {
	float:left; 
	padding:0; margin:0;
	display:inline;

}
ul.portfolio li{ 
	padding:0;
	margin:0;
	display:inline;
	width:302px;
	float:left;
	padding-left:20px;
}

ul.portfolio li.clear{ padding-left:0; }

ul.portfolio li h4{ 

}
ul.portfolio li img{ 
	border: 1px solid #ccc;
}
ul.portfolio li p{
	padding-top:.3em;
	margin-top:0;
	text-align:justify;
	line-height:1.2em;
	float:left;
}

/**************************************************************
   #page: Holds the main page content.
 **************************************************************/

#page {
  float: left;
  width: 100%;
  clear: both;
  padding-bottom: 2em;
  margin-top:1.5em;
 
  /*background: #fff url(/img/page_bg.gif) repeat-x;*/
}

/**************************************************************
   #messages
 **************************************************************/

#flashMessage{ padding:1em; background:#eee; border:1px solid #ccc; margin:1em 0; font-weight:bold}
form span.error-message{ display:block; background-color:#FFFFCC; text-align:center; clear:both; margin-top:.3em; border:1px solid red; padding:.5em}

/**************************************************************
   #footer: The page footer - will stick to the bottom if not
            enough content.
 **************************************************************/

#footer {
  float: left;
  width: 100%;
  clear: both;
  padding: 1em 0;
  border-top:1px solid #ccc;
  font-size: 0.85em;
  color:#666;
}

/**************************************************************
   Right column
 **************************************************************/

div.RightColumn{ }
div.RightColumn div.widget{ padding-bottom: .5em;}
div.RightColumn div.widget h2{ padding:0; margin:0; margin-bottom:.2em}
div.RightColumn div.widget address{ font-size:.9em; line-height:1.3em; font-style:normal}

/**************************************************************
   Width classes used by the site columns
 **************************************************************/
.width100 { width: 100%;}
.width75 { width: 70%;}
.width50 { width: 49.7%;}
.width45 { width: 45%;}
.width33 { width: 32.7%;}
.width25 { width: 24.7%;}

/**************************************************************
   Alignment classes
 **************************************************************/
.floatLeft {  float: left;}
.floatRight {  float: right;}
.alignLeft {  text-align: left;}
.alignRight {  text-align: right;}

/**************************************************************
   Generic display classes
 **************************************************************/
.clear { clear: both;}
.block { display: block;}
.small {  font-size: 0.8em;}
.green {  color: #A1FF45;}
.red {  color: #EA1B00;}
.grey {  color: #666;}
.grey a {  color: #999;}
.grey a:hover {  color: #EEE;}
.gradient {  margin-bottom: 2em;  background: #eee url(/img/degradado_blanco.png) repeat-x bottom left; }
.justify{ text-align:justify;}
p.peque{ padding:.5em 0; font-size:.8em; line-height:1.2em}