/*****
BODY
*/

/********************************************************************************************
	HEADER
********************************************************************************************/
* {
	font-size:8pt;
}

#header h1 {
	 font-family:'lucida grande',tahoma,arial,sans-serif;
    font-size: 16px;
    color: #fff;
    font-weight: normal;
    padding: 5px 10px;
    font-weight:bold;
}


/********************************************************************************************
	LOADING
********************************************************************************************/
#loading-mask{
     position:absolute;
     left:0;
     top:0;
     width:100%;
     height:100%;
     z-index:2000;
     background-color:white;
 }
 #loading{
     position:absolute;
     left:35%;
     top:40%;
     padding:2px;
     z-index:20001;
     height:auto;
 }
 #loading a {
     color:#225588;
 }
 #loading .loading-indicator{
     background:white;
     color:#444;
     font:bold 13px tahoma,arial,helvetica;
     padding:10px;
     margin:0;
     height:auto;
 }
 #loading-msg {
     font: normal 10px arial,tahoma,sans-serif;
 }

@CHARSET "UTF-8";  
  
/* 
    Section    :    CSS RESET 
    Description:    Reseteamos practicamente todos los valores de los selectores para facilitar el cross-browsing 
*/  
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,  
font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,  
tfoot, thead, tr, th, td, button{  
    border:0pt none;  
    font-family: inherit;  
    font-size: 100%;  
    font-style: inherit;  
    font-weight: inherit;  
    margin: 0pt;  
    padding: 0pt;  
    vertical-align: baselinebaseline;  
}  
body{  
    line-height: auto;  
    font-size: 12px !Important;  
    background: #fff;  
    font-family: Helvetica, Arial, sans-serif;  
    margin: 0pt;  
    cursor: default;  
    color: #000;  
}  
table{  
    border-collapse: separate;  
    border-spacing: 0pt;  
}  
strong{  
    font-weight: 700;  
}  
caption, th, td{  
    font-weight: normal;  
    text-align: left;  
}  
blockquote:before, blockquote:after, q:before, q:after{  
    main: "";  
}  
blockquote, q{  
    quotes: "" "";  
}  
html,body{  
    height: 100%;  
  
    overflow: hidden;  
}  
.clearfix{  
    overflow: hidden;  
}  


/*
    Section:        LATERAL
    Description:    Panel lateral donde mostramos las distintas fuentes RSS
*/
#lateral{
    width: 180px;
    height: 100%;
    float: left;
}
#lateral h2{
    font-size: 11px;
    font-weight: 700;
    padding: 10px;
    padding-bottom: 0;
}
#lateral ul{
    padding: 1px 0 0;
    list-style: none;
    list-style-position: inside;
}
#lateral li{
    font-size: 10px;
    position: relative;
    line-height: 22px;
}
#lateral li a{
    display: block;
    padding-left: 23px;
    text-decoration: none;
    color: #000;
}
#lateral li.active a, #lateral li.active a:hover{
    background: #c2cff1
}
#lateral li a:hover{
    background-color: #ffffcc;
}
#lateral li a span{
    padding-left: 20px;
}
#lateral li a .icon{
    width: 11px;
    height: 16px;
    position:absolute;
    top: 4px;
    background: transparent url("../img/icons/fam/collection_icon.png") no-repeat left center;
}  



/*
    Section:        TOGGLER
    Description:    Boton que permitir� mostrar / ocultar el panel
*/
#toggler{
    width: 16px;
    height: 100%;
    border-left: 1px solid #c2cff1;
    background: #EBEFF9 url("img/toggler_bg.gif") no-repeat left center;
    float: left;
}
#toggler:hover{
    background: #c2cff1 url("img/toggler_bg.gif") no-repeat -25px center;
    cursor: pointer;
}
#toggler.off{
    background: #EBEFF9 url("img/toggler_off_bg.gif") no-repeat left center;
    margin-left: 0;
}
#toggler.off:hover{
    background: #c2cff1 url("img/toggler_off_bg.gif") no-repeat -25px center;
    margin-left: 0;
}

/*
    Section:        CONTENT
    Description:    Zona donde cargamos el contenido seleccionado
*/
#content{
    height: 100%;
    margin-left: 180px;
}
#content #render{
    height: 100%;
    overflow: hidden;
}
#content #iframe{
    display: none;
}


/********************************************************************************************
	LINKS
********************************************************************************************/
.link {
    height: 60px;
    padding: 10px;
    text-align: center;
}
.linkImage {
    height: 40px;
}

/********************************************************************************************
	TRADES
********************************************************************************************/
#report { border-collapse:collapse;width: 100%;}
#report h4 { margin:0px; padding:0px;}
/*#report img { float:right;}*/
#report ul { margin:10px 0 10px 40px; padding:0px;}
#report th { background:#7CB8E2 url(img/header_bkg.png) repeat-x scroll center left; color:#fff; padding:7px 15px; text-align:left;font-size:12px;}
#report td { background:#C7DDEE none repeat-x scroll center left; color:#000; padding:7px 15px;font-size:10px; }
#report tr.odd td { background:#fff url(img/row_bkg.png) repeat-x scroll center left; cursor:pointer; }
#report div.arrow { background:transparent url(img/arrows.png) no-repeat scroll 0px -16px; width:16px; height:16px; display:block;}
#report div.up { background-position:0px 0px;}

/********************************************************************************************
	VENTANA MODAL
********************************************************************************************/
#simplemodal-overlay {background-color:#aaaaaa; cursor:wait;}
#simplemodal-container {height:200px; width:310px; background-color:#fff; border:1px solid #000000; -moz-border-radius: 5px; }
#simplemodal-container a.modalCloseImg {background:url('../img/x.png') no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; left:-18px; cursor:pointer;}
#simplemodal-container #basicModalContent {padding:8px;}
/* Label */
form#login label { width: 80px; padding-left: 20px; margin: 5px; float: left; text-align: left; }
form#input { margin: 5px; padding: 0px; float: left; border: 1px solid #cdcdcd; background-color: white; -moz-border-radius: 2px; }
br { clear: left; }
.textbox { border: 1px solid #999999; border-top-color: #CCCCCC; border-left-color: #CCCCCC; color: #333333; font: 90% Verdana, Helvetica, Arial, sans-serif; font-size: 11px; }
form#h1 { font-size: 17px; }
form#div { font-family: Verdana; font-size: 11px; }
#submit { margin: 5px; padding: 0px; float: left; width: 50px; background-color: white; }
#notification_error { color: red; height: auto; padding: 4px; text-align: center; }
#login_response { overflow: auto; }
#ajax_loading { display: none; font-size: 12px; font-family: Tahoma; }
#logged_in { padding: 5px; margin: 23px 0 100px 43px; padding: 5px; text-align: center; width: 400px; }

/********************************************************************************************
	PAGINACION
********************************************************************************************/

.paginate {
    font-family:Arial, Helvetica, sans-serif;
    padding: 3px;
    margin: 3px;
}

.paginate a {
    padding:2px 5px 2px 5px;
    margin:2px;
    /* border:1px solid #999;*/
    text-decoration:none;
    color: #666;
}
.paginate a:hover, .paginate a:active {
    /*border: 1px solid #999;*/
    color: #000;
}
.paginate span.current {
    margin: 2px;
    padding: 2px 5px 2px 5px;
    border: 1px solid #999;
    font-weight: bold;
    background-color: #999;
    color: #FFF;
}
.paginate span.disabled {
    padding:2px 5px 2px 5px;
    margin:2px;
    /*border:1px solid #eee;*/
    color:#DDD;
}

/********************************************************************************************
	MENU DE TIPOS DE BEBIDA
********************************************************************************************/
html > body .menu_inline {
	display:inline-block;
}

.menu_inline {
	display:inline-block;
	position:relative;
}

.menu_option {
	margin:0.7em;
	text-align:center;
	vertical-align:top;
}
.menu_shadow  {
	background:url("../img/drinkmenu/menu_back.gif") no-repeat scroll transparent;
	height:152px;
	width:152px;
}
.menu_image  {
	background:none repeat scroll 0 0 #D1D1D1;
	height:144px;
	margin:2px 0 6px 2px;
	position:relative;
	width:144px;
}
.menu_option_img  {
	vertical-align:bottom;
}

.menu_option_title  {
	font-weight:bold;
	margin:0;
	overflow:hidden;
	padding-left:2px;
	width:144px;
	word-wrap:break-word;
}

.menu_option_link{
	text-decoration: none;
    text-decoration: none;
}

/********************************************************************************************
	FORMULARIOS
********************************************************************************************/
.pepe { 
    border-collapse:collapse;
    width: 100%;
}
.pepe td { 
    background:#C7DDEE none repeat-x scroll center left; 
    color:#000; 
    padding:7px 15px;
    font-size:10px; 
}


.setList {
  background: none repeat scroll 0 0 #FFFFFF;
  border-collapse: collapse;
  font-family: "Lucida Sans Unicode","Lucida Grande",Sans-Serif;
  font-size: 12px;
  margin: 20px;
  text-align: left;
  width: 480px;
    -moz-box-sizing: border-box;
  border-spacing: 2px;
  display: table;
  margin-bottom: 0;
  margin-top: 0;
  text-indent: 0;
  
}
.setList thead {
    display: table-header-group;
    vertical-align: middle;
}

.setList tr {
    display: table-row;
    vertical-align: inherit;
}

.setList th {
    border-bottom: 2px solid #6678B1;
    color: #003399;
    font-size: 14px;
    font-weight: normal;
    padding: 10px 8px;
}

.setList tbody {
    display: table-row-group;
    vertical-align: middle;
}

.setList td {
    border-bottom: 1px solid #CCCCCC;
    color: #666699;
    padding: 6px 8px;
}

#preview{
	position:absolute;
	border:1px solid #ccc;
	background:#333;
	padding:5px;
	display:none;
	color:#fff;
	}

