@charset "UTF-8";
/* CSS Document */

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  



/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* new Linux- and Windows-friendly sans-serif font stack: http://mky.be/fontstack */
body {font: 13px Helmet, Freesans, sans-serif;}

/* using local fonts? make sure to read up on Paul Irish's 
	Bulletproof @font-face syntax: http://mky.be/font-face/bulletproof/ */

/* we like off-black for text */
body, select, input, textarea {color: #333;}

a {color: #03f;}
a:hover {color: #69f;}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}





/* Print styles!
-------------------------------------------------------------------------------*/
@media print {



}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
	
		
}

@media all and (orientation: portrait) {
	
}

@media all and (orientation: landscape) {
	
}

header {
	height: 68px;
	width: 100%;
	position: relative;
	margin: 0px 0px 0px 0px;
	background-color: #f2f1f1;
	overflow: visible;
	background: #9003ad url('../images/bgHeader.jpg') repeat-x left top;
}

nav {
	width: 950px;
	height: 68px;
	margin: 0px auto;
/*	background-color: #898989;*/
	position: relative;
/*	overflow: hidden;*/
}

#logo {
	width: 185px;
	height: 44px;
/*	background: url('../images/logo.png') no-repeat left top;	*/
	display: block;
	overflow: hidden;
	float: left;
	position: absolute;
	z-index: 2;
	top: 10px;
	left: 0px;
}

#usuario {
	width: 100%;
	height: 30px;
/*	background-color: green;*/
	text-align: center;
/*	overflow: hidden;*/
	margin: 0px 0px 0px 0px;
	padding: 28px 0px 0px 0px;	
}

#usuario h1{
	font-size: 14px;
	font-weight: bold;
	color: white;
	text-transform: uppercase;
	font-family: 'Quattrocento Sans', sans-serif;
}

#menuSettings {
	width: 100px;
	height: 30px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
/*	background-color: #8109e4;*/
	position: absolute;
	z-index: 3;
	top: 20px;
	left: 844px;
}

#menuSettings p{
	font-size: 13px;
	font-weight: 400;
	color: white;
	font-family: 'Quattrocento Sans', sans-serif;
	margin: 8px 0px 0px 0px;
	float: left;
}

#menuSettings a{
	text-decoration: none;
}

#settings {
	width: 18px;
	height: 18px;
	background: url('../images/iconSettings.png') no-repeat left top;	
	overflow: hidden;
	margin: 7px 0px 0px 20px;
	padding: 0px;
	float: left;
}

#settings a{
	width: 18px;
	height: 18px;
/*	background-color: red;*/
	display: block;
}

#settings span {
	display: none;
}

/* FINAL HEADER ------------------------------------ */
/* INICIO PORTADA ------------------------------------ */

#portadaWrap {
	width: 100%;
	min-height: 432px;
/*	background-color: #f4cece;*/
	display: block;
}

.portada {
	width: 950px;
	min-height: 432px;
	background-color: white;
	margin: 0px auto;
	padding: 5px 0px 0px 0px;	
}

/* FINAL PORTADA  ------------------------------------ */
/* INICIO ASIDE ------------------------------------ */

aside {
	width: 261px;
	height: 432px;
/*	background-color: blue;*/
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	float: left;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	
	background-color: #162077;

/*	overflow: hidden;	*/
}

#asideCont {
	width: 261px;
	height: 405px;
	margin: 22px 0px 0px 0px;
/*	overflow: hidden;*/
	background: #0d5ccc; /* Old browsers */
	background: -moz-linear-gradient(top,  #0d5ccc 0%, #0d5ccc 65%, #0347a7 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0d5ccc), color-stop(65%,#0d5ccc), color-stop(100%,#0347a7)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #0d5ccc 0%,#0d5ccc 65%,#0347a7 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #0d5ccc 0%,#0d5ccc 65%,#0347a7 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #0d5ccc 0%,#0d5ccc 65%,#0347a7 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #0d5ccc 0%,#0d5ccc 65%,#0347a7 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d5ccc', endColorstr='#0347a7',GradientType=0 ); /* IE6-9 */
	
}

#asideCont ul {
	margin: 0px 0px 0px 0px;
	padding: 40px 0px 0px 0px;
	list-style-type: none;
	
}

#asideCont ul li.nivel1 {
	width: 259px;
/*	background: url('../images/lineaAside.gif') no-repeat 0px 0px;*/
}

/* Primer Nivel Estado normal*/
#asideCont ul li a{
	display: block;
	text-decoration: none;
	color: #fff;
/*	background-color: #399;*/
	padding: 17px 0px 17px 0px;
	position: relative;
	font: 14px 'Quattrocento Sans', sans-serif;
	font-weight: 700;
	text-indent: 65px;
/*	background: url('../images/lineaAside.gif') no-repeat 0px 0px;*/

-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;

}

/* Primer Nivel Estado hover (en la lista) */
#asideCont ul li:hover {
	position: relative;
/*	background-color: #6CC;*/
/*	color: #000;*/
	
}

/* Primer Nivel estado hover (en en el ancle) */
#asideCont ul li a:hover, #asideCont ul li:hover a.nivel1 {
	background-color: #003c93;
	color: #77fafa;
	position: relative;
	text-indent: 70px;
}

#asideCont ul li a.nivel1 {
	display: block!important;
	display: none;
	position: relative;
}

/* Escondo el Desplegable */
#asideCont ul li ul {
	display: none;
}

/* Lista Desplegable ul Desplegable */
#asideCont ul li a:hover ul, #asideCont ul li:hover ul {
	display: block;
	position: absolute;
	left: 257px;
	top:-40px!important;
	top: -31px;
	z-index: 50;
}

/* Elemento li a Segundo nivel  */
#asideCont ul li ul li a {
	width: 259px;
/*	background-color: #0553c1;*/
	color: #FFF;
	background: #0553c1 url('../images/lineaAside.gif') no-repeat 0px 0px;
}

/* Elemento li a Segundo nivel estado hover */
#asideCont ul li ul li a:hover {
	position: relative;
	background-color: #003c93;
	color: #77fafa;
}

table.falsa {
	border-collapse:collapse;
	border:0px;
	float: left;
	position: relative;
}

/* iconos del aside */

.i_inicio {
	background: url('../images/lineaAside.gif') no-repeat 0px 0px,
	url('../images/i_inicio.png') no-repeat 10px 5px;
	
}

.i_pedidos {
	background: url('../images/lineaAside.gif') no-repeat 0px 0px,
	url('../images/i_misPedidos.png') no-repeat 10px 5px;
}

.i_estado {
	background: url('../images/lineaAside.gif') no-repeat 0px 0px,
	url('../images/i_estadoCuenta.png') no-repeat 10px 5px;
}

.i_aviso {
	background: url('../images/lineaAside.gif') no-repeat 0px 0px,
	url('../images/i_avisoPrivacidad.png') no-repeat 10px 5px;
}

.i_terminos {
	background: url('../images/lineaAside.gif') no-repeat 0px 0px,
	url('../images/i_terminos.png') no-repeat 10px 5px;
}

.i_salir {
	background: url('../images/lineaAside.gif') no-repeat 0px 0px,
	url('../images/i_salir.png') no-repeat 10px 5px,
	url('../images/lineaAside.gif') no-repeat left bottom;
	
}


/* FINAL ASIDE  ------------------------------------ */
/* INICIO DESPLEGABLE SETTINGS ------------------------------------ */

#desple {
	width: 18px;
	height: 18px;
/*	background: url('../images/iconSettings.png') no-repeat left top;	*/
/*	background-color: #b43eca;*/
	overflow: visible;
	margin: 7px 0px 0px 20px;
	padding: 0px;
	float: left;
}

.iconSettings {
/*	display: none;*/
	background: url('../images/iconSettings.png') no-repeat left top;
	width: 18px;
	height: 18px;
}

#desple ul {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
	
}

#desple ul li.level1 {
/*	width: 28px;*/
/*	background: url('../images/lineaAside.gif') no-repeat 0px 0px;*/
}

/* Primer Nivel Estado normal*/
#desple ul li a{
	display: block;
	text-decoration: none;
	color: #fff;
/*	background-color: #399;*/
	padding: 0px 0px 0px 0px;
	position: relative;
	font: 14px 'Quattrocento Sans', sans-serif;
	font-weight: 700;
	
	width: 18px;
	
/*	background: url('../images/lineaAside.gif') no-repeat 0px 0px;*/

-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;

}

/* Primer Nivel Estado hover (en la lista) */
#desple ul li:hover {
	position: relative;
/*	background-color: #6CC;*/
/*	color: #000;*/
	width: 100px;

	
}

/* Primer Nivel estado hover (en en el ancle) */
#desple ul li a:hover, #desple ul li:hover a.level1 {
	background-color: #8702a6;
	color: #fff;
	position: relative;
	width: 100px;
	height: 75px;
}

#desple ul li a.level1 {
	display: block!important;
	display: none;
	position: relative;
	height: 40px;
}

/* Escondo el Desplegable */
#desple ul li ul {
	display: none;
}

/* Lista Desplegable ul Desplegable */
#desple ul li a:hover ul, #desple ul li:hover ul {
	display: block;
	position: absolute;
	left: 0px;
	top:20px!important;
	top: -31px;	
}

/* Elemento li a Segundo nivel  */
#desple ul li ul li a {
	width: 100px;
/*	background-color: #0553c1;*/
	color: #FFF;
/*	background: #0553c1 url('../images/lineaAside.gif') no-repeat 0px 0px;*/
	padding: 20px 0px 20px 0px;
	text-indent: 7px;
/*	height: 15px;*/
}

/* Elemento li a Segundo nivel estado hover */
#desple ul li ul li a:hover {
	position: relative;
/*	background-color: #0553c1;*/
	color: #77fafa;
	width: 100px;
	/* Esta altura es para evitar que crezca mas el desplegable	*/
	height: 15px;
}



/* FINAL DESPLE  ------------------------------------ */
/* INICIO BANNER  ------------------------------------ */

.bannerCont {
	width: 677px;
	height: 432px;
/*	background-color: #ccd4a4;*/
	margin: 0px 0px 0px 10px;
	padding: 0px;
	display: block;
	float: left;
	position: relative;
}

/* FINAL BANNER para mas propiedades del banner: Consulte la hoja screen -- */
/* INICIO FOOTER  ------------------------------------ */

footer {
	width: 950px;
	height: 68px;
/*	background-color: #dad8f7;*/
	margin: 0px auto 0px auto;
	padding: 20px 0px 0px 0px;
	overflow: hidden;
}

#lineaFooter {
	width: 100%;
	height: 5px;
/*	background-color: #eaeaea;*/
	margin: 0px 0px 0px 0px;
	padding: 0px;
	border-top: 1px solid #adadad;
}

footer p {
	font-family:'Quattrocento Sans', sans-serif;
	display: block;
	margin: 27px 0px 0px 0px;
	padding: 0px;
	float: left;
}

footer small {
	color: #818181;
	font-size: 12px;
}

.resaltado {
	font-weight: 700;
/*	color: black;*/
}

#logoVianney {
	width: 85px;
	height: 22px;
	display: block;
	overflow: hidden;
	background: url('../images/logoVianney.gif') no-repeat left top;
	float: right;
	margin: 24px 20px 0px 0px;
	padding: 0px;	
}

#logoVng {
	width: 57px;
	height: 24px;
	display: block;
	overflow: hidden;
	background: url('../images/logoVng.gif') no-repeat left top;
	float: right;
	margin: 24px 0px 0px 0px;
	padding: 0px;	
}

.linkSitios {
	width: 100px;
	height: 30px;
/*	background-color: red;*/
	display: block;
	overflow: hidden;
}

.oculto {
	display: none;
}

/* FINAL FOOTER  ----------------------------------------------------------- */

/* INICIO INDEX ----------------------------------------------------- */

#header2 {
	height: 68px;
	width: 100%;
	position: relative;
	margin: 0px 0px 0px 0px;
	background-color: #f2f1f1;
	overflow: hidden;
	background: #9003ad url('../images/bgHeader.jpg') repeat-x left top;
}

#nav2 {
	width: 419px;
	height: 68px;
	margin: 0px auto;
/*	background-color: #898989;*/
	position: relative;
	overflow: hidden;
	
/*	overflow: hidden;*/
}

#logo2 {
	width: 185px;
	height: 44px;
/*	background: url('../images/logo.png') no-repeat left top;	*/
	display: block;
	overflow: hidden;
	margin: 11px auto 0px auto;
/*	padding: 20px 0px 0px 0x;*/
}

.indexWrap {
z-index: -999;
width: 100%;
height: 100%;
position: fixed;
	
background: url('../images/bgIndex.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

/*html {
    background: url('../images/bgIndex.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}*/

.indexPortada {
	width: 419px;
	min-height: 315px;
/*	background-color: red;*/
	margin: 60px auto 0px auto;
	padding: 0px 0px 0px 0px;
	background: url('../images/bgIndexForm.png') no-repeat left top;
	overflow: hidden;
}

#formLogin {
	width: 325px;
	min-height: 200px;
	display: block;
	margin: 38px auto 0 auto;
/*	background-color: #aeddaf;*/
/*	padding: 10px;*/
/*	padding: 20px;*/
	
}

/* FORMULARIO INDEX --------------------------------------- */


#formLogin label { 
  font: 14px 'Quattrocento Sans', sans-serif;
  text-transform: uppercase;
  display: block;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 10px 0px;
}


.campoLogin {
	width: 300px;
	background: #fff;
	border: 1px solid #929191;

 	-moz-border-radius: 4px; 
 	-webkit-border-radius: 4px; 
 	border-radius: 4px; 
 	padding: 8px;
 	margin: 0px 0px 20px 0px; 

 	
 	font: 400 14px 'Quattrocento Sans', sans-serif;
 	color: #000;	
} 


#formLogin #submit { 
/*   width: 450px;   */
/*   color: #BFD7C1; */
   border: none; 
/*   background-color: #6EA070;*/
}

#formLogin h1 {
	font: 700 15px 'Quattrocento Sans', sans-serif;
	color: #740198;
	text-transform: uppercase;
	margin: 0px 0px 10px 0px;
} 

#formLogin p {
	font: 400 14px 'Quattrocento Sans', sans-serif;
	color: #000;
	margin: 0px 0px 0px 0px;
	padding: 0px;
} 

#formLogin p a:link {
	color: #0084ff;
	text-decoration: none;
	font-weight: 400;
}

#formLogin p a:visited {
	color: #740198;
}

#formLogin p a:hover {
	color: #740198;
/*	padding: 5px 5px 5px 5px;*/
}

#formLogin p a:active {
	color: #740198;
}

#botoneraIndex {
	min-width: 100px;
	min-height: 30px;
/*	background-color: red;*/
	display: block;
	margin: 15px 0px 0px 0px;
	padding: 0px 0px;
	text-align: center;
	overflow: visible;
}