/* 
    Document   : propia
    Created on : Feb 17, 2008, 11:13:56 AM
    Author     : maceto
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

body {
font-family:Helvetica, Gill Sans, Verdana, arial, sans-serif;
font-size:12px;
color:#333;
line-height:1.5em;
background:#ddd;
text-align:center;
margin:0 0 0 0;

scrollbar-3dlight-color:#004400;
scrollbar-arrow-color:#006600;
scrollbar-base-color:#FFFFFF;
scrollbar-darkshadow-color:#FFFFFF;
scrollbar-face-color:#FFFFFF;
scrollbar-highlight-color:#FFFFFF;
scrollbar-shadow-color:#004400;

}

img {border: none;}

#bottom {
    width:997px;
    height:10px;
    float: left;
    font-family:Arial,Helvetica,sans-serif;
    
    margin:0px;
    padding:0px;
    text-align:center;
}

#bottom a {
    color: #000000;
    font-size:9px;
    text-decoration: none;
}

#bottom a:hover {
    color: #FF8800;
    font-size:9px;
    text-decoration: none;
}


#page {
/*background: url("images/fondo.jpg");*/
    width:998px;
    height:600px;
    text-align:left;
    margin:0 auto;
    padding:0;
}

#page #left_side {
    background: url("images/left.jpg");
    width:217px;
    height:600px;
    float: left;
    text-align:left;
    margin:0;
    padding:0;
}

#page #content {
    background: url("images/fondo_blnk.jpg");
    width:555px;
    height:600px;
    float:left;
    text-align:left;
    margin:0;
    padding:0;
}

#page #right_side {
    width:225px;
    height:600px;
    float: left;
    text-align:left;
    margin:0;
    padding:0;
}

/**** Contenido ****/

#page #content .contenido {
    width:550px;
    height:432px;
}

#page #content .contenido .fondo_home{
    background: url("images/medio_fondo.jpg");
    width:555px;
    height:432px;
}

#page #content .contenido .fondo_soporte{
    background: url("images/fondo_soporte.jpg");
    width:555px;
    height:432px;
}

#page #content .contenido .fondo_hosting{
    background: url("images/fondo_hosting.jpg");
    width:555px;
    height:432px;
}

#page #content .contenido .fondo_servicios{
    background: url("images/fondo_servicios.jpg");
    width:555px;
    height:432px;
}

#page #content .contenido .fondo_administracion{
    /**background: url("images/fondo_servicios.jpg");**/
    width:555px;
    height:432px;
}

#page #content .contenido .fondo_contacto{
    /**background: url("images/fondo_servicios.jpg");**/
    width:555px;
    height:432px;
}

#page #content .contenido .fondo_contacto a{
	text-decoration: none;
	color: #FFFFFF;
}

#page #content .contenido .fondo_contacto a:hover{
	text-decoration: none;
	color: #FF8800;
}

#page #content .contenido .texto_grande {
    width:485px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:135px;
    padding-left:60px;
    font-size: 17px;
}

#page #content .contenido .texto_marca {
    width:125px;
    height:16px;
    color: #FF8800;
    font-weight: bold;
    float:left;
    font-size: 16px;
    text-align:left;
    margin-top:20px;
    padding-left:65px;
}

#page #content .contenido .texto_normal {
    width:450px;
    height:50px;
    color: #FFFFFF;
    font-weight: bold;
    font-size:14px;
    float:left;
    text-align:left;
    margin-top:2px;
    padding-left:65px;
}

#page #content .contenido .texto_legal {
    width:520px;
    height:385px;
    color: #000000;
    font-size:12px;
    float:left;
    text-align:left;
    margin-top:35px;
    padding-left:25px;
    overflow:auto;
}
 

#page #content .menu_home {
    width:50px;
    height:20px;
    color: #000000;
    text-transform:uppercase;
    font-weight: bold;
    float:left;
    font-size: 12px;
    margin-top:3px;
    padding-left:300px;
}

#page #content .menu_home a {
    color: #000000;
    font-size:12px;
    text-decoration: none;
}

#page #content .menu_home a:hover {
    color: #FF8800;
    font-size:12px;
    text-decoration: none;
}


#page #content .menu_contenido {
    width:490px;
    height:100px;
    color: #FF8800;
    text-transform:uppercase;
    font-weight: bold;
    float:left;
    font-size: 16px;
    margin-top:10px;
    padding-left:36px;
}

#page #content .menu_contenido a {
    color: #FF8800;
    font-size:16px;
    text-decoration: none;
}

#page #content .menu_contenido a:hover {
    color: #FFFFFF;
    font-size:16px;
    text-decoration: none;
}
/*********** Soporte *****************/

#page #content .contenido .titulo_soporte{
    width:490px;
    height:25px;
    color: #000000;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:75px;
    padding-left:25px;
    font-size: 18px;
}

#page #content .contenido .link_tutorial {
    width:490px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:50px;
    padding-left:25px;
    font-size: 18px;
}

#page #content .contenido .link_tutorial  a {
    color: #FFFFFF;
    font-size:18px;
    text-decoration: none;
}

#page #content .contenido .link_tutorial a:hover {
    color: #FF8800;
    font-size:18px;
    text-decoration: none;
}

#page #content .contenido .texto_grande_soporte {
    width:485px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:135px;
    padding-left:50px;
    font-size: 17px;
}
#page #content .contenido .fondo_soporte a {
color:#FFFFFF;
text-decoration:none;
}

#page #content .contenido .fondo_soporte a:hover{
	text-decoration: none;
	color: #FF8800;
}

#page #content .contenido .texto_email_soporte{
    width:470px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:10px;
    padding-left:60px;
    font-size: 16px;
}

#page #content .contenido .texto_telefono_soporte{
    width:470px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:10px;
    padding-left:60px;
    font-size: 16px;
}

/*********** Servicio *****************/

#page #content .contenido .titulo_servicios{
    width:450px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:44px;
    padding-left:30px;
    font-size: 18px;
}


#page #content .contenido .servicios_primero{
    width:350px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:40px;
    padding-left:140px;
    font-size: 18px;
}

#page #content .contenido .servicios{
    width:350px;
    height:25px;
    color: #FFFFFF;
    float:left;
    text-align:left;
    font-weight: bold;
    margin-top:20px;
    padding-left:140px;
    font-size: 18px;
}


/*********** Muestra planes de hosting *****************/

#page #content .hosting_group{
    width:520px;
    height:351px;
    padding-left:32px;
    margin-top:40px;
    float: left;
}

#page #content .hosting_plan {
    width:169px;
    /**height:150px;**/
    color: #FFFFFF;
    /**text-transform:uppercase;**/
    font-weight: bold;
    float:left;
    font-size: 11px;
    margin-top:10px;
    padding-left:3px;
}

#page #content .hosting_name {
    width:145px;
    height:20px;
    color: #FF8800;
    font-weight: bold;
    float:left;
    font-size: 12px;
    text-transform:uppercase;
}

#page #content .hosting_description {
    width:142px;
    height:90px;
    color: #000000;
    padding:3px;
    float:left;
}

#page #content .hosting_cost {
    width:132px;
    height:20px;
    padding-left:10px;
    color: #FF8800;
    font-weight: bold;
    float:left;
    font-size: 14px;
}

#page #content .hosting_feature_group{
    width:142px;
    height:164px;
    font-weight: bold;
    float:left;
}


#page #content .hosting_feature {
    width:142px;
    height:20px;
    color: #000000;
    font-weight: bold;
    float:left;
}

#page #content .pie_hosting {
    width:400px;
    height:37px;
    float:left;
    padding-left:75px;
	padding-top: 5px;
}

/**** notes ****/


#page #content .notes {
    background: url("images/notas.jpg");
    width:523px;
    height:374px;
    float:left;
    padding-top:25px;
    padding-left:25px;
	/*margin-left: 1px;*/
	margin: 0px 0px 0px 0.02cm;
}

#page #content .notes .title {
    color:#000000;
    float:left;
    font-size:16px;
    font-weight:bold;
    margin-top:22px;
    padding-left:21px;
    width:490px;
}

#page #content .notes .body {
    width:470px;
    height:40px;
    float:left;
    font-size: 10px;
    margin-bottom:10px;
    padding-left:21px;
}

#page #content .notes .body a {
    color: #000000;
    font-size:10px;
    text-decoration: none;
    padding-letf:0px;
}

#page #content .notes .body a:hover {
    color: #FF8800;
    font-size:10px;
    text-decoration: none;
}

#page #content .title_note {
    color: #FFFFFF;
    font-weight: bold;
    font-size: 16px;
    padding-top:25px;
    padding-left:25px;
    width:490px;
    float:left;
}

#page #content .body_note {
    width:520px;
    height:340px;
    padding-left:25px;
    float:left;
    font-size: 12px;
    overflow:auto;
}

/**** works ****/

#page #content .works_cont{
    width:500px;
    height:360px;
    padding-top:35px;
}

#page #content .works{
    width:500px;
    height:90px;
    float:left;
    margin-top:15px;
    margin-left:25px;
}

#page #content .works_show{
    width:500px;
    height:90px;
    float:left;
    padding-top:40px;
    padding-left:25px;
}

#page #content .works .picture{
    width:90px;
    height:90px;
    float:left;
}

#page #content .works_show .picture_show{
    width:250px;
    height:200px;
    float:left;
}

#page #content .works .name{
    width:300px;
    height:15px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 16px;
    float:left;
    padding-left:10px;
}

#page #content .works_show .name_show{
    width:240px;
    height:15px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 16px;
    float:left;
    padding-left:10px;
}

#page #content .works .link{
    width:300px;
    height:15px;
    float:left;
    padding-left:10px;
    padding-top:5px;
}

#page #content .works .link a {
    color: #000000;
    font-size:12px;
    text-decoration: none;
}

#page #content .works .link a:hover {
    color: #FFFFFF;
    font-size:12px;
    text-decoration: none;
}

#page #content .works .description{
    width:300px;
    height:40px;
    float:left;
    padding-left:10px;
}

#page #content .works_show .description_show{
    width:420px;
    height:120px;
    float:left;
    padding-left:10px;
    padding-top:10px;
}

#page #content .works .description a {
    color: #FFFFFF;
    font-size:10px;
    text-decoration: none;
}

#page #content .works .description a:hover {
    color: #FF8800;
    font-size:10px;
    text-decoration: none;
}


#page #content .works .tools{
    width:300px;
    height:15px;
    float:left;
    padding-left:10px;

}

#page #content .works_show .tools_show{
    width:300px;
    height:15px;
    float:left;
    padding-left:10px;
    padding-top:10px;
}

#page #content #back_show {
    width:80px;
    height:15px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 16px;
    float:left;
    padding-top:10px;
    padding-left:430px;
}

#page #content #back_show a {
    color: #FFFFFF;
    font-size:16px;
    text-decoration: none;
}

#page #content #back_show a:hover {
    color: #FF8800;
    font-size:16px;
    text-decoration: none;
}

/**** Tutorials ****/


#page #content .tutorials {
    background: url("images/ayuda.jpg");
    width:530px;
    height:360px;
    float:left;
    padding-top:48px;
    padding-left:17px;
	margin-left: 1px;	
	margin: 0px 0px 0px 0.02cm;
}

#page #content .tutorials_show {
    width:515px;
    height:360px;
    float:left;
    padding-top:25px;
    padding-left:17px;
}

#page #content .tutorials_show .steps {
    width:515px;
    height:360px;
    float:left;
    overflow:auto;
}

#page #content .tutorials_show .steps .steps_name {
    color: #000000;
    padding-top:10px;
    padding-botton:5px;
    padding-left:15px;
    width:450px;
    float:left;
    font-size:14px;
    font-weight: bold;
}

#page #content .tutorials_show .steps .steps_body {
    color: #000000;
    padding-top:10px;
    padding-botton:10px;
    padding-left:15px;
    width:450px;
    float:left;
    font-size:12px;
    font-weight: bold;
}

#page #content .tutorials_show .steps .steps_picture {
    padding-left:35px;
}

#page #content .tutorials .title {
    color: #FFFFFF;
    /*padding-top:34px;*/
    padding-left:13px;
    width:510px;
    float:left;
	height: 58px;
}

#page #content .tutorials_show .title_show {
    color: #FFFFFF;
    padding-top:10px;
    font-size:16px;
    font-weight: bold;
    width:510px;
    float:left;
}

#page #content .tutorials .title a {
    color: #000000;
    font-size:15px;
    font-weight: bold;
    text-decoration: none;
}

#page #content .tutorials .title a:hover {
    color: #FF8800;
    font-size:15px;
    font-weight: bold;
    text-decoration: none;
}

/**** END Tutorials ****/

/**** left ****/


#page #left_side .menu_left{
    width:185px;
    height:150px;
    float: left;
    color: #000000;
    text-transform:uppercase;
    font-size: 12px;
    text-align:left;
    margin-top:45px;
    padding-left:24px;
}

#page #left_side .menu_left a {
    color: #000000;
    font-size:12px;
    text-decoration: none;
    font-weight: bold;
}

#page #left_side .menu_left a:hover {
    color: #FFFFFF;
    font-size:12px;
    text-decoration: none;
}

#page #left_side .menu_left .contenedor{
    width:185px;
    height:13px;
    float:left;
    margin-top:10px;
}

#page #left_side .menu_left .contenedor .flecha {
    background: url("images/flecha.jpg");
    width:13px;
    height:13px;
    float:left;
}

#page #left_side .menu_left .contenedor .menu {
    width:160px;
    height:13px;
    float:left;
    padding-left:5px;
}

#page #left_side .contenido_left{
    width:215px;
    height:200px;
    float: left;
    text-align:left;
    margin:0;
    padding:0;
}


/***** paginado *****/

.pagination {
  padding-left: 20px;
  margin: 2px;
  font-weight: bold;
}

.pagination a {
  padding: 2px 5px 2px 5px;
  margin: 2px;
  border: 1px solid #aaaadd;
  text-decoration: none;
  /**color: #000099;**/
  color: #FFFFFF;
}

.pagination a:hover, .pagination a:active {
  border: 1px solid #FF8800;
  color: #FF8800;
}

.pagination span.current {
  padding: 2px 5px 2px 5px;
  margin: 2px;
  /**border: 1px solid #000099;**/
  font-weight: bold;
  /**background-color: #000099;**/
  background-color: #FF8800;
  color: #FFF;
}

.pagination span.disabled {
  padding: 2px 5px 2px 5px;
  margin: 2px;
  /**border: 1px solid #eee;**/
  color: #ddd;
}