

/* body { margin: 0%; padding: 0%; width: 100%; font-family: 'verdana';  }   */
.body_modules_hr { margin: 0%; padding: 0%; width: 100%; font-family: 'verdana';  }
select { font-size: 2em;  }

.nodisplay { display: none; }
.display { display: block; }
.inline { display: inline-block; }
.cursor { cursor: pointer; }
.content_area { position: relative;  float: left; width: 100%; }                        
.clear_both { clear: both; }
.modules_hr_contents { margin-left: 0.5%; margin-right: 0.5%;}

h3 { margin-bottom: 0.5em; }

.page_title { font-weight: bold; margin-top: 1%;  }


/* header and agenda area -------------------------------------------------------------------------------------------- */
.header { position: relative; float: left; width: 100%; }
.headerthin     { overflow: hidden; padding: 1%; background-color: rgba(160,160,160, 1);  z-index: 100;}
.headerexpanded { position: absolute; top: 0%; padding: 1%; background-color: rgba(160,160,160, 0.95);  z-index: 100;}
.icon    { position: relative; float:left; } /* m=margin-left, w= width */
.notifthin { position: relative; float: left; padding-left: 2%; }   
#aniversari_text     { position: relative; float: left;   font-size: 2.0em; }
#timeout_cnt             { position: relative; float: right;  }
#debug_on_header     { position: relative; float: right; margin-left: 1%; font-size: 0.8em; }
#dia_internacional { clear: both; font-size: 0.8em;} 

/* video rec module ---------------------------------------------------------------------------------------- */
.vid_keypad_icon {
    position: absolute; top: 12%; margin: -9%; width: 9%; cursor: pointer;
}
.vid_keypad_icon_img { width: 100%; }
.vid_keypad { 
    position: absolute; top: 1%; margin: 2%; padding: 2%; width: 30%;
    border: 5px solid rgba(   0,  0,  0, 0.9); border-radius: 6px; 
    background-color: rgba(192, 192, 192, 0.9); 
}
.vid_keypad_keys {  position: relative; float: left; padding-left: 9%; }
.vid_key {    
    position: relative; float: left; width: 13.5%; margin: 1.5%; padding: 1.5%; 
    font-size: 2.5em;
    border-radius: 6px;
    /*border: 15px ;
    border-top:solid #404040; border-bottom:solid #000000; border-left:solid #202020; border-right:solid #000000;
    */border-top: 5px solid #404040; border-bottom: 5px solid #000000; border-left: 5px solid #303030; border-right: 5px solid #000000;
    background-color: #101010; 
    color:  rgba(192, 192, 192, 1);
    cursor: pointer;
}
.vid_pin {
    position: relative; float: left; width: 95%; margin: 3% 1% 3% 1%; padding: 1.5%; 
    background-color: rgba(255, 255, 255, 1); 
    color:  rgba(   8,   8,  8, 1);
    font-size: 2.5em;
}
.vid_cancel {
    position: absolute; top: 3%; width: 15%; margin-left: 75%; 
}
.vid_cancel_img { width: 100%; }
.vid_keypad_text { font-size: 1.1em;  }
.vid_title {  position: relative; float: left; width: 100%; font-size: 8em; }
.vid_body        { position: relative; float: left; width: 80%; margin: 0%; padding: 1% 10% 30% 10%; background-color: #00f; }
.vid_cam         { position: relative; float: left; width: 100%; margin: 0.5% 1% 0.5% 1%; background-color: #cc0; 
                   border-radius: 12px; border: 5px solid rgba( 128, 128, 128, 1);
}
.vid_imgA        { position: relative; float: left; width:  12%; margin: 0.5%; margin-left: 3%; margin-right: 5%; }
.vid_imgB        { position: relative; float: left; width:   8%; margin: 0.5%; }
.vid_text_block  { position: relative; float: left; width:  60%; margin: 0.5%; }
.vid_txtA        { position: relative; float: left; width: 100%; margin: 0.5%; font-size: 1.3em; }
.vid_txtB        { position: relative; float: left; width: 100%; margin: 0.5%; font-size: 1.0em; }
.vid_txtC        { position: relative; float: left; width: 100%; margin: 0.5%; font-size: 1.0em; }
.vid_txtD        { position: relative; float: left; width: 100%; margin: 0.5%; font-size: 1.0em; }
.vid_img_fit {     
    width:100%;
    height:100%;
    object-fit: cover;
    overflow: hidden;
}
.points3 { display: none; }

/* menu -------------------------------------------------------------------------------------------- */
.menulist { position: absolute; top: 0%; float: left; width: 100%; 
    background-color: rgba(160,160,160, 0.8);  z-index: 500;} /* rgba(0,150,224, 0.9); */
.menu_left  { position: relative; float: left; align:  left; width: 95%;  }
.half_menu  { position: relative; float: left; align:  left; width: 48%;  }
.menu_button_left { position: relative; float: left; align: left; width: 10%; cursor: pointer; } /* wr */
.icon_in_menu  { position: relative; float:right; margin: 10%; width: 67%;} /* w = w / wr  */
.menu_radio { position: relative; float: left; align:  left; margin-top: 2%; clear: both; cursor: pointer; }
.menu_debug_right { position: relative; float: right; text-align: right; width: 40%; margin-right: 1%; padding-right: 1%; 
                    border: 2px solid rgba(  0, 117, 176, 1)}

    /* nuevo menu */
    .button_petit1 { width: auto; margin: 1%;  padding: 1%; font-size: 0.8em; }
    
    .menu_contents    { position: relative; float: left; align:  left; padding-bottom: 4%;
                        width: 100%; background-color: rgba(192, 192, 192, 0.8) }
    .menu_item_image  { position: relative; float: left; width: 19%;  
                        border-radius: 6px; border: 5px solid rgba(  0, 117, 176, 1);
                        margin: 2%; background-color: rgba(224, 224, 224, 1) }
    .menu_img_holder  { position: relative; float: left;  border-radius: 6px; border: 2px solid rgba(  0, 117, 176, 1);
                        margin: 2%; padding: 2%; cursor: pointer;  background-color: #fff;}
    .menu_img1 { width: 100%;   }
    .menu_options_holder { position: relative; float: left;  border-radius: 6px; 
                           margin: 2%; width: 94%; }
    .menu_options_holder_full   { border: 2px solid rgba(  0, 117, 176, 1); cursor: pointer; background-color: #fff; }
    .menu_options_holder_empty  { border: 2px solid rgba(  0, 117, 176, 0);}
    .menu_options {  width: 40%; display: block; margin: auto; padding: 2%; }
    
    .menu_menu_options { position: relative; float: left; width: 95%; padding: 1%; 
                         border-radius: 6px; border: 5px solid rgba(  0, 117, 176, 1);
                         margin: 2%; margin-top: 0%; background-color: rgba(224, 224, 224, 1)  }
    
    .tdir_change_button { position: relative; float: left; background-color: rgba(192, 255, 255, 1); font-size: 1.5em; 
    padding: 0.5%; margin-right: 1.0%; margin-top: 0.5%; border-radius: 6px; display: inline-block; cursor: pointer; }


/* Lista de la compra -------------------------------------------------------------------------------------------- */
.lc_categoria { position: relative; float: left; background-color: rgba(240, 240, 255, 1); width: 100%; }
.cat_name { clear:both; position: relative; float: left; border-radius: 6px; padding-left: 1%; margin-left: 0.5%;
            background-color: rgba(127, 127, 255, 1); margin-top: 1.5%; width: 98%;}
.lc_element { position: relative; float: left; background-color: rgba(192, 192, 255, 1); clear:both; 
    padding: 0.5%; margin-left: 2%; margin-top: 0.5%; margin-bottom: 0.5%; border-radius: 6px;  width: 96%; }
.lc_element_name       { overflow: hidden;  }    
.lc_element_expand   { position: relative; float: left; width: 100%;  }    
.elem_qty_group         { margin-top: 1%;  }    
.elem_qty                     { position: relative; float: left; margin-left: 3%; margin: 16%; }    
.elem_comm                   { margin-top: 1%; }    
.elem_label                 { position: relative; float: left; text-align: right; margin-right: 3%; width: 30%; }    
.lc_elem_comm_input { position: relative; float: left; width: 60%; }    
.lc_elem_qty_input   { position: relative; float: left; width: 30%; }    
.lc_elem_submitt        { position: relative; float: left;  width: 26%; border-radius: 6px; margin: 3% 1% 3% 1%; 
                     padding-left: 1%; background-color: rgba( 96, 96, 255, 0.5);  cursor: pointer; }
.lc_elem_cancel         { float: left;  }
.lc_elem_send             { float: right; }

.lc_elem_cancel1 { float: left;  }
.lc_elem_elim, .lc_elem_elim1     { float: left; margin-left: 7%; }
.lc_elem_marcar   { float: right;  }


 /*.lc_link_button { position: relative; float: left; background-color: rgba(192, 255, 255, 1); clear:both;
    padding: 0.5%; margin-left: 0.5%; margin-top: 1.5%; border-radius: 6px;  width: 70%; cursor: pointer; }  */
            
.lc_elem_comprado     { background-color: rgba( 127, 255, 127, 1); }             
.lc_elem_activo       { background-color: rgba( 255, 255, 127, 1); }             
.lc_elem_standard     { background-color: rgba( 127, 255, 127, 1); }             
.lc_elem_no_standard  { background-color: rgba( 255, 255, 127, 1); }             
                    
.lc_select_cat    { position: relative; float: left; width: 50%; }                  

.lc_elem_loader    { position: relative; float: left; margin: 1% 0% 1% 0%; width: 100%; display: none; }                    
.lc_elem_loader_img { margin-left: auto; margin-right: auto; display: block; width: 4%;}
.lc_pink_background { background-color: rgba( 255, 192, 192, 0.5); }
.lc_in_element_img { width: 3%; display: none; }
 
/* otras listas -------------------------------------------------------------------------------------- */ 
 /*.lc_link_button { position: relative; float: left; background-color: rgba(192, 255, 255, 1); clear:both;
    padding: 0.5%; margin-left: 0.5%; margin-top: 1.5%; border-radius: 6px;  width: 70%; cursor: pointer; }  */
.boton_linea { clear:both; position: relative; float: left; border-radius: 6px; padding-left: 1%; margin-left: 0.0%;
            margin-right: 0.0%; margin-top: 1.5%; width: 99%; color: #22f; cursor: pointer; }
.boton_linea_sep { clear:both; position: relative; float: left; margin-top: 0.5%; }
.boton_linea_color1 { background-color: rgba(192, 192, 192, 1);  border: 2px solid rgba(192, 192, 192, 1); 
                      border-top-color: rgba(224, 224, 224, 1);  border-bottom-color: rgba(127, 127, 127, 1); }
.boton_linea_color2 { background-color: rgba(224, 224, 192, 1);  border: 2px solid rgba(224, 224, 192, 1); 
                      border-top-color: rgba(255, 255, 224, 1);  border-bottom-color: rgba(192, 192, 127, 1); }
.lis_line_input { position: relative; float: left; width: 60%; }    
.lis_area_input { width: 60%; height: 300px; }    
.lis_link_button { position: relative; float: left; background-color: rgba(192, 255, 255, 1); clear:both;
    padding: 0.5%; margin-left: 0.5%; margin-top: 1.5%; border-radius: 6px;  width: 70%; }                 
.lis_texto { margin-top: 1.5%; margin-bottom: 1.5%; margin-left: 0.0%; margin-right: 0.0%; 
             padding: 1%;  
             background-color: rgba(255, 255, 224, 1); clear:both;   
             border: 2px solid rgba(192, 192, 192, 1); border-radius: 6px; padding-left: 1%; }


/* agenda -------------------------------------------------------------------------------------------- */
.agen_ta_h { position: relative; float: left; overflow: hidden; background-color: #ddd; border-bottom: 1px solid #444; margin-bottom: 4px; white-space: nowrap; margin-top: 2%; }
.agen_ta_r { position: relative; float: left; overflow: hidden; background-color: #eee; border-bottom: 1px solid #444; margin-bottom: 4px; white-space: nowrap;}
.agen_ta_c1 { width: 20%; display: inline-block; clear: both; padding-left: 0.5%;}
.agen_ta_c2 { width: 20%; text-align: right; display: inline-block;}
.agen_ta_c3 { width: 12%; text-align: right; display: inline-block;} 
.agen_ta_c4 { width: 12%; text-align: right; display: inline-block; padding-right: 3%; } 
.agen_ta_c5 { width: 32%; } 

.agen_pre_block { position: relative; float: left; background-color: #fff; padding: 1%; 
                  border: 1px solid #444; border-radius: 4px; margin-right: 0.5%; margin-top: 0.5%; }
.agen_pre_b1 { width: 35%; text-align: center; }
.agen_pre_b2, .agen_pre_b3 { width: 21%; text-align: left; }
.agen_pre_row  { }
.agen_pre_t1 { font-size: 1.8em; }
.agen_pre_t2 { }
.agen_pre_t3 { font-size: 1.7em; }
.agen_pre_t4 { font-size: 2.2em; }
.agen_pre_t5 { font-size: 1.6em; }
.agen_pre_t6 { font-size: 0.5em; }
.agen_pre_img { height: auto; width: 40%; }
.agen_pre_b2l { text-align: left;  width: 60%; display: inline-block; font-size: 1.8em; }
.agen_pre_b22 { text-align: right; width: 40%; display: inline-block; font-size: 1.8em; }
.agen_pre_b23 { text-align: left;  width: 85%; display: inline-block; font-size: 1.7em; }
.agen_pre_b31 { text-align: left;  width: 90%; display: inline-block; font-size: 2.6em; color: #f00; font-weight: bold;}
.full-moon-percent { color: #ff0;  font-weight: bold;/* background-color: #ff0; */}
.agen_moon_div { position: relative; float: left; width: 100%; background-color: #000; padding: 1%; 
                  margin: 0.5%; margin-top: 0.5%; }
.agen_moon_img 	{ margin-left: 2%; margin-right: 4%; position: relative; float: left;}			  
.agen_moon_txtl { color: #ccc; font-size: 1.4em; position: relative; float: left; padding-top: 3%; }				  
/* wall clock -------------------------------------------------------------------------------------------- */

.wall_clock_text_color1 {
    color: #100;
}

.wall_clock_text_color2 {
    color: #211;
}

.wall_clock_title {
    font-weight: bold; 
    padding-top: 2%; 
    margin-left: 2%;     
    font-size: 50px;
}

.wall_clock_body {
    background: #000 ;
}

.wall_clock-night-overlay {
    height: 4000px;
    width: 100%;
    background: #000 ;
    z-index: 120;
    position: fixed;
    //position: absolute;
    top: 0;
    left: 0;
    opacity: 1.0;
}

.wall_clock-night-menu {
    background: #000;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 140;
    opacity: 1.00;
    height: 10%;
    width: 100%;
    padding: 1%;
}

.wall_clock-clock_body {
    background: #000 ;
}
.wall_clock-clock_frame1 {
    border-radius: 24px;
    background: #000;
    padding: 12px;
    /* float: left; */
}
.wall_clock-clock_frame {
    border-radius: 24px;
    border: 5px solid #000;
    background: #000;
    padding: 12px;
}
.wall_clock-clock {
    background: #000;
    font-size: 250px;
    text-align: left;
    padding: 0px;
    font-family: 'impact';
}


#overlay { /* used in case of ajax-returned errors */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fcc;
    filter:alpha(opacity=90);
    -moz-opacity:0.9;
    -khtml-opacity: 0.9;
    opacity: 0.9;
    z-index: 10000;
} 