/* CSS Document */

/* virtualmente.com.mx CSS */ 

/* Main style defintions for the body               */
/* ------------------------------------------------ */

/* Global Container Styles */
.container {
	width:810px;
	margin:0px auto;
	text-align:left;
}	

body {
	font-size: 12px; /* 1em is now 12px */
	color: #484848;  /* standard text is now dark grey */
	padding:0px;
	text-align:center;
	margin: 20px 0 20px 0px;
	font-family: arial, helvetica, sans-serif;
}

/*  Standard link and visited colors used throught */
a { color: #557792; }
a.small { font-size: 11px; }
a:visited{ color: #587894;}

/* standard header sizes used in main body area (except banners and large headings) */
h1{
	font-size: 16px;
	font-weight: bold; 
}
h1 a,
h1 a:hover{
	text-decoration: none;
	color: #4A4A4A;
}
h2{
	font-size: 14px; 
	font-weight: bold; 
}
h3{
	font-size: 12px; 
	font-weight: bold; 
}

/* line used to denote section breaks */
.bottomline{
	height: 1px;
	width: auto;
	border-bottom: 1px solid #d2d5d7;
	margin: 0 0 6px 0;
}

/* a heading that is also a link (see "Build") */
.headinglink{
	font-size: 12px;
	font-weight: bold;
	color: #2888c5;
}

#headeroffset {
	margin-top:35px; /* headerbar floats, set a one-off margin offset */
}

/* Global Navigation icons                           */ 
/* ------------------------------------------------- */

/* the navegacion is used to navigate to the three different sections on the site: */
/* get, disucss, and learn. */

.navegacion {
	float: right;	
	display: inline;
	position: relative;	/* we position the item relative so we can...*/
	top: 7px; /* push the navegacion down into the gradient  */
	width: 266px;
	margin-top: 14px;
}
.navegacion A {
	float: right;
	display: inline;
	/*display: block;*/
	height: 40px;
	width: 66px;
}
.navegacion UL {
	list-style-type: none;
	display: inline;
	float: left;
}
.navegacion LI {
	width:66px;
	height:40px;
}		
.navegacion #vender {
	background: url("../images/nav_vender.png") no-repeat;
}
.navegacion #vender:hover {
	background: url("../images/nav_vender.png") 0 -40px no-repeat;
}
.navegacion #estar {
	background: url("../images/nav_estar.png") no-repeat;
}
.navegacion #estar:hover {
	background: url("../images/nav_estar.png")  0 -40px no-repeat;
}
.navegacion #sobresalir {
	background: url("../images/nav_sobresalir.png") no-repeat;
}
.navegacion #sobresalir:hover {
	background: url("../images/nav_sobresalir.png")  0 -40px no-repeat;
}

.navegacion #contacto {
	background: url("../images/nav_contacto.png") no-repeat;
}
.navegacion #contacto:hover {
	background: url("../images/nav_contacto.png")  0 -40px no-repeat;
}

/* Large buttons on the main homepage                */ 
/* ------------------------------------------------- */

/* the png graphics have the normal and rollover states stacked vertically*/
/* to reduce loadtime flicker*/

.buttonbar {
	height: 340px;
	margin-top: 10px; /* margin for gradient bar at top */
}
.buttonbar a {
	height: 336px;
	width: 264px;
	display:inline;
	float:left;
	font-size: 0px;
	color: #FFFFFF;
	text-decoration: none;
	overflow: hidden;
	font-weight: normal;
	text-align: left;
}
.buttonbar #estar {
	font-size: 0px;
	text-indent: -100px;
	background: url("../images/estar_en_internet_a.png") 0 0 no-repeat;
}
.buttonbar #estar:hover {
    background-position: 0 -336px; /*rollover state is in png below norm state*/
	font-size: 12px;
	text-decoration: none; 
	text-indent: 0px;
}

.buttonbar #sobresalir {
	margin-left: 7px;
	margin-right: 7px;
	font-size: 0px;
	text-indent: -100px;
	background: url("../images/sobresalir_en_internet_a.png") 0 0 no-repeat;
}
.buttonbar #sobresalir:hover {
    background-position: 0 -336px; /*rollover state is in png below norm state*/
	font-size: 12px;
	text-decoration: none; 
	text-indent: 0px;
}
.buttonbar #vender {
	background: url("../images/vender_en_internet_a.png")  0 0 no-repeat;
	font-size: 0pt;
	text-indent: -100px;
}
.buttonbar #vender:hover {
    background-position: 0 -336px; /*rollover state is in png below norm state*/
	text-decoration: none; 
	font-size: 12px;
	text-indent: 0px;
}
.buttonbar DIV {
	display:inherit;
	margin: 288px 12px 9px 10px;
	padding: 0;
}

/* Global Footer -- these appear on every page        */
/* -------------------------------------------------- */	

.footer {
	position: relative;
	top: 20px;
	font-size: 10px;
	margin: 6px auto;
	vertical-align: middle;
}
#footerline {
	float:left;
	display:inline;
	width: 810px;
	height: 10px;
	background-image: url('../images/footer_line.gif');
}	
#copyright{
	height: 35px;
	float: left;
	display: inline;
	color: #747474;	
	padding-top:13px;
	padding-left:23px;
}
#footernav{
	height: 35px;
	padding-top:13px;
	float: right;
	display: inline;
	color: #c6c6c6;
	vertical-align: middle;
}

/* Banner classes for the graphic headers to each page content */
/* ----------------------------------------------------------- */

/* These banners are graphic at the left and a text heading and */
/* subcopy at the right (inside the graphic area). */

/* The text area can change from banner to banner, so is set on */
/* individual basis. */

.banner { 
	font-size: 11px; 
	margin-top: 40px; /* margin for gradient bar at top */
}
.banner h1 { 
	font-size: 25px;
	font-weight: normal; 
	display: inline;
}
.banner h2 {
	color: #557792;
	font-size: 25px;
	line-height: 20pt;
	font-weight: normal;
}
.banner h3 { 
	font-size: 16px;
	font-weight: bold; 
	display: inline;
}
#getbanner { 
	background-image: url('../images/banner_get.gif');
	height: 256px;
}
#getbanner h3{
	font-size: 14px;
}
#getbannertext{
	float:right;
	display:inline;
	margin: 16px 16px 16px 538px;
}
#venderbanner { 
	background-image: url('../images/seccion_vender.png');
	height: 256px;
}
#venderbannertext{
	float:right;
	display:inline;
	margin: 16px 16px 16px 538px;
}
#sobresalirbanner { 
	background-image: url('../images/seccion_sobresalir.png');
	height: 256px;
}
#sobresalirbannertext{
	float:right;
	display:inline;
	margin: 16px 16px 16px 538px;
}
#estarbanner { 
	background-image: url('../images/seccion_internet.png');
	height: 256px;
}
#estarbannertext{
	float:right;
	display:inline;
	margin: 16px 16px 16px 536px;
}
#contactobanner { 
	background-image: url('../images/seccion_contacto.png');
	height: 256px;
}
#contactobannertext{
	float:right;
	display:inline;
	margin: 16px 16px 16px 538px;
}
#graciasbanner { 
	background-image: url('../images/seccion_gracias.png');
	height: 256px;
}
#graciasbannertext{
	float:right;
	display:inline;
	margin: 16px 16px 16px 538px;
}

/*  Gradient bars                         */
/* -------------------------------------- */

/* Displayed at the top of the screen and the bottom of the screen */
.header{
	height:57px;
}
.headerbar { 
	width: 100%;
	height: 15px;
	background-image: url('../images/header_gradientpart.png');
	display: block;
}
.footerbar { 
	width: 100%;
	height: 30px;
	background-image: url('../images/footer_gradientpart_new.png');
	display: inline;
	float:left;
}

/* Two Column body layouts                  */
/* ----------------------------------------- */

/* In general the position of the twpo */

.leftcol{
	float: left;
	display: inline;
}
.rightcol{
	padding: 0 10px 0 0;
}
.rightcol hr{
	background-color: #D2D5D7;
	color: #D2D5D7;
	border: 0;
	height: 1px;
}

.rightcol .listwrap{
	width: 540px;
	margin: 0 0 10px 0;
}

.rightcol .whitespace{
	height: 200px;
}

.rightcol h1{
	color: #4A4A4A;
	margin: 15px 0 0 0;
}

.rightcol p {
	margin: 0 0 15px 0;
	line-height: 16px;
}

.rightcol h5.listtitle{
	color: #747474;
	font-size: 11px;
	line-height: 11px;
	margin: 12px 0 0 2px;
}

.rightcol h5 a,
.rightcol h5 a:visited,
.rightcol h5 a:active,
.rightcol h5 a:hover{
	text-decoration: none;
	color: #747474;
}
.rightcol ol{
	list-style-type:circle;
	}

.rightcol ul{
	margin: 12px 0 0 2px;
	font-size: 11px;
	width: 130px;
	color: #A7A7A7;

}

.rightcol ul li{
	margin: 0;
	padding: 0;
	width: 120px;
	display: block;
	float: left;
}

.rightcol .legal{
	font-size: 11px;
}

.rightcol .legal h5{
	margin: 10px 0 10px 0;
	font-weight: bold;
	color: #747474;
	font-size: 11px;
}

.rightcol .legal p{
	margin: 0 0 5px 0;
}


.rightcol p.legal{
	margin: 20px 0 0 0;
}
#getcol1{
	margin-top: 15px;
	width: 267px;
}
#getcol1 h1{
	font-size: 11px; 
	display: inline;
	font-weight: normal;
	padding-left: 4px;
}
#getcol1 h2{
	color: #6bb1e1;
	font-size: 11px; 
	display: inline;
	font-weight: normal;
	padding-left: 4px;
}

#getcol1 img.download{
	margin: 0 0 5px 0;
}

#getcol2{
	margin-top: 15px;
	margin-left: 273px;
}
#homecol1{
	margin-top: 8px;
	width: 270px;
}
#homecol2{
	margin-top: 15px;
	margin-left: 273px;
}
.body #homecol1 h3 { 
	padding: 6px 0 6px 0;
	font-size: 16px;
	font-weight: bold; 
}
#sharecol1{
	width: 267px;
}
#sharecol2{
	margin-left: 273px;
	width: 515px;
}

/* text below the download button that notes the version to download */
/* we want it centered below the button. */
.releaseinfo{
	width: 120px;
	text-align: left;
	margin: 0 0 10px 5px;
}

.releaseinfo p{
	margin-top: 0;
	font-size: 11px;
}

.releaseinfo h3{
	margin: 0;
	line-height: 14px;
	font-size: 11px;
	font-weight: normal;
}

/* GUIDE & FAQ content body classes                      */
/* ----------------------------------------------------- */
 
#guidecol1{
	width: 267px;
	height: auto;
}
#guidecol2{
	margin-left:273px;
}
#guidecol3{
	margin-left:10px;
}

/* intro block                                           */
/* ----------------------------------------------------- */

/* used when right and left column body and nav box content must be aligned. */
/* see: reference guide first chapter, and the */

.introblock{
	width: auto;
	display: block;
	margin-top: 15px;
	margin-bottom: 35px;
}
.introblock h1{ /* usually into blocks use a sunsans 25px graphic label*/
	font-size: 25px; 
	font-weight: normal;
}

/* Guide-body content styles. Uses slightly different heading styles than the */
/* main content areas for non-guide and FAQ pages. */

.guidebody{
	margin-top: 20px;
	font-size: 12px;
	color: #4a4a4a;
	
}

.guidebody .paging{
	border-bottom: solid 1px #D1D5D8;
	padding: 0 0 5px 0;
	font-size: 11px;
}

.guidebody .pagingbottom{
	border: none;
	padding: 5px 0 0 0;
}

.guidebody .paging span{
	margin: 0 2px 0 0;
}

.guidebody .paging a{
	color: #2888c5;
	margin: 0 2px 0 0;
}

.guidebody .paging a:visited{
	color: #587894;
}

.guidebody a{
	color: #4a4a4a;
	text-decoration: none; 
}
.backtotop A, .backtotop A:visited{ /* don't use visited color on the "top" links */
	color: #2888c5;
}
.guidebody h1{
	font-size: 16px;
	font-weight: bold;
}
.guidebody h2{
	font-size: 14px;
	font-weight: bold;
}
.guidebody h3{
	font-size: 12px;
	font-weight: normal;
}

/* "top" link at the end of each anchor section  */
.backtotop{
	height: 10px;
	width: auto;
	border-bottom: 1px solid #d2d5d7;
	text-align: right;
	padding-bottom: 6px;
	margin: 6px 0 10px 0;
}


/* Learn body                                      */
/* ------------------------------------------------*/

.learnbody{
	margin-top: 20px;
}
.learnbody TD {
	width: 267px;
	padding: 0;
	margin: 0;
}

/* GUIDE & FAQ NAVIGATION : chapter & subsection   */
/* ------------------------------------------------*/

/* displays information about the currently selected chapter, and allows user to move up one level. */
.chapternav{
	margin: 30px 10px 25px 0px;
	padding-bottom: 5px;
	border-bottom: 1px solid #d0d0d0;
	font-weight: normal;
	font-size: 14px;
	color: #cccccc;
}
.chapternav h2{
	display: inline;
	color: #4a4a4a;
}
.chapternav a{
	font-weight: bold;
	font-size: 14px;
}
/* subsection anchor allows sections in chapters to obe slected */
.anchorbox{
	font-size: 11px;
	line-height: 15px;
	padding: 8px 6px 8px 6px;
	width: auto;
	display: block;
	background-color: #f5f5f5 ;
}
#anchorcol1{
	width: 267px;
	max-width: 267px;
	overflow: hidden;
}
#anchorcol2{
	margin-left:268px;
}

/* NEWS Table on homepage                  */
/* --------------------------------------- */

.body .news TABLE {
	width: 530px;
	border-left: 1px solid #cbcbcb;
	border-right: 1px solid #cbcbcb;
	border-collapse: collapse;
}
.body .news caption {
	width: 530px;
	text-align: left;
	border: 1px solid #cbcbcb;
	border-bottom: 1px solid #000;
	vertical-align: top;
	color: #4a4a4a;
	height: 33px;
}
.body .news caption h2{
	margin: 8px 0 8px 6px;
	display: inline;
	float: left;
}
.body .news caption a{
	margin: 8px 6px 8px 0;
	display: inline;
	float: right;
}


.body .news TD {
	vertical-align: middle;
	margin: 0;
	padding: 6px 7px 6px 7px;
	border-bottom: 1px solid #cbcbcb;
}
.body .news .column1 {
	width: 24px;
	padding: 3px 0px 3px 3px;
}
.body .news .column2 {
	font-size: 11px;
	font-weight: normal;
}
.body .news .column3 {
	font-size: 11px;
	font-weight: bold;
}

.guidebody dl{
	padding: 0 0 20px 35px;
	margin: 0;
	border-bottom: 1px solid #D1D5D8;
}

.guidebody dl h2{
	font-size: 16px;
	margin: 0 15px 3px 0;
	padding: 12px 0 0 0;
}

.guidebody dl strong{
	margin:	0 5px 0 0;
	color: #4A4A4A;
}

.guidebody dd{
	margin:	10px 0 0 0;
	width: 470px;
}

.guidebody dl.news_bullet{
	background: url('../images/news_bullet.png') no-repeat 5px 14px;
}

.guidebody dl.audio_bullet{
	background: url('../images/audio_bullet.png') no-repeat 5px 14px;
}

.guidebody dl.rss_bullet{
	background: url('../images/rss_bullet.png') no-repeat 5px 14px;
}

.guidebody dl.video_bullet{
	background: #F5F5F5 url('../images/video_bullet.png') no-repeat 5px 14px;
}

.guidebody dl a{
	color: #2888c5; 
}

.guidebody dl a:visited{
	color: #587894;
}

.icon_news{
	width: 24px;
	height: 24px;
	background: url('../images/icon_news.png');
}
.icon_podcast{
	width: 24px;
	height: 24px;
	background: url("../images/icon_podcast.png");
}
.icon_video{
	width: 24px;
	height: 24px;
	background: url("../images/icon_video.png");
}
.icon_blog_rss{
	width: 24px;
	height: 24px;
	background: url("../images/icon_blog_rss.png");
}


/* Navigation Boxes                       */
/* --------------------------------------- */

/* vertical navigation boxes used in the Forum, Learn and FAQ sections */

/* Forumn nav box used in the JIVE FORUMS */
.forumnavbox{
	background-color: #FFFFFF;
	font-size: 12px;
	line-height:18px;
	display:block;
	width: 255px;
}
.forumnavcontainer{
}

/* Navbox used in the Learn and FAQ sections. This is kept separate in case */
/* the forumn classes need to be changed for JIVE. */
.generalnavbox{
	background-color: #FFFFFF;
	font-size: 12px;
	line-height:18px;
	display:block;
	width: 255px;
}
.forumnavcontainer{
}

.navboxheader{
	background-color: #e5e5e5;
	border-bottom: 2px solid #7ca1c0;
	font-size: 10pt;
	padding: 6px 9px 6px 9px;
	font-size: 14px; 
	font-weight: bold;
	color: #4a4a4a;
}
.navboxactions{
	margin: 0 0 0 5px;
}

.navboxactions img{
	margin: 0 3px 0 0;
}

.navsepline{
	height: 2px;
	margin: 3px 0 3px 0;
	display: block;
	width: auto;
	border-bottom: 1px solid #aaaaaa;
}
.navboxcontent{
	padding: 9px 9px 9px 9px;
}
.navboxcontent h2{
	font-size: 14px;
	font-weight: normal;
}
.navbottom{
	height: 6px;
	width: auto;
	background-image: url('../images/navbox_bottom_shadow.gif'); 
}
.space {
	height:10px;
	width: auto;
	}

/*drop shadow wrappers                     */
/*---------------------------------------- */

/* simple css drop shadows */
.dropshadowbox {
	font-size: 12px;
	width: 255px;
	float:left
}
.wrap1, .wrap2, .wrap3 {
} 
.wrap1 {
	float:left;
	background:url(../images/shadow.gif) right bottom no-repeat;}
.wrap2 {background:url(../images/corner_bl.gif) left bottom no-repeat;}
.wrap3 {
	padding:0 8px 8px 0;
	background:url(../images/corner_tr.gif) right top no-repeat;}
.wrap3 table {
	display:block;
	border:12px solid #ffffff;}
#wrapper {margin: 0 auto; text-align: left; }


/* Virtualmente Logo - floating PNG class      */
/*------------------------------------------- */

/* we need to float the virtualmente logo over the gradient bar */ 
#virtualmentelogo{
	cursor: hand;
	position: absolute;
	top: 4px;
	width: 253px;
	height: 80px;
	background: url('../images/logo_virtualmente_2.png') top left no-repeat;
}

#sel_sobresalir{
	position: absolute;
	height: 40px;
	width: 66px;
	background: url('../images/botones_secciones_top_sobresalir.png') top left no-repeat;
}
#sel_estar{
    position: absolute;
    height: 40px;
    width: 66px;
    background: url('../images/botones_secciones_top_estar.png') top left no-repeat;
}
#sel_vender{
    position: absolute;
    height: 40px;
    width: 66px;
    background: url('../images/botones_secciones_top_vender.png') top left no-repeat;
}
#sel_contacto{
    position: absolute;
    height: 40px;
    width: 66px;
    background: url('../images/botones_secciones_top_contacto.png') top left no-repeat;
}


.textmkt
{
	width:auto;
	padding: 5px;
	color: #557792;
	font-size:17px !important;
	font-weight:600;
	text-align: center !important;
}