@charset 'UTF-8';

@font-face {
  font-family: "Roboto-Slab";
  src: url("fonts/RobotoSlab-Regular.ttf") format('truetype'), 
       url("fonts/RobotoSlab-Regular.eot") format('embedded-opentype'),
       url("fonts/RobotoSlab-Regular.woff") format('woff'),
       url("fonts/RobotoSlab-Regular.woff2") format('woff2');
}

/*******************************************************/
/******************** GENERAL **************************/
/*******************************************************/
body {font-family: Arial, sans-serif !important; font-size:12px; background-color:#FFFFFF; margin:0px;}

/*media screen*/

.bold{font-weight:bold;}
.padding10{padding:10px;}
.oculto{visibility:hidden;}
.seleccionable{cursor:pointer;}

a {color:black;}
a:hover {color:#777370; text-decoration:underline; transition: all 0.4s ease 0s;}
a:hover, a:focus, a:active {outline:none;}
strong {font-weight:600;}
label  {font-weight:normal;}
.radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {margin-top:2px;}
.wrapper {box-shadow: 0 5px 10px rgba(0,0,0,0.20); margin: 0 auto; width: 80%; background:#fff;margin-top:5px;}
.btn-ak2 {background:#f9f9f9; color:#333; box-shadow:none; border:1px solid #ccc;margin-right:5px;}
.btn-ak:hover, .btn-ak:focus {background:#777370; color:#fff; transition: all 0.4s ease 0s;}
.btn-ak:active {box-shadow:none; outline:none;}
.btn-ak2:hover, .btn-ak2:focus {background:#f2f2f2; transition: all 0.4s ease 0s; cursor: pointer;}
.form-control {font-size:12px;width:73%;}
.form-control:focus {box-shadow:none; border-color:black;}
input[type="text"]{	width:100px;}
.img-logo{width: 50%;float: right;display: inline;margin-right: 25%;margin-top: 2%;margin-bottom:4%;}
.img-logo2{width: 25%;float: right;display: inline;margin-right: 41%;margin-top: -1%;}

.btn{cursor:pointer!important;}
.btn-ak {
    background:#1CA5CC;
    color: #FFFFFF !important;
    box-shadow: none;
}
.btn-ak:hover, .btn-ak:focus {
    background-color:#F4F4F4;
    color: #000000 !important;
    transition: all 0.4s ease 0s;
    cursor: pointer;
}
.btn-ak:active {box-shadow:none; outline:none;}
.btn-ak2:hover, .btn-ak2:focus {background:#f2f2f2; transition: all 0.4s ease 0s;}
button[disabled], html input[disabled] {cursor:not-allowed !important;}
.msg-error{margin-top:400px;display:inline-block;width:100px;} 
.img-table{width:20px;}


.btn-delete-item{ float:right;	margin-top:0.4em;	background: url("../images/style/delete.png") no-repeat left top;	height: 22px; 	width: 22px;	padding:0em 0 3em 20px;	color:#555;	text-decoration:none;	margin-right:0.1em;}
.btn-delete-item:hover { opacity:0.7; }

.precio-euros {float: right;}
.precio-euros{color:darkgrey;}
.precio-euros span{color:#064C68;}


/* ================ COMPESCA - TABLE ===========================*/
table {font-size:9px;}
.table th {color:black; text-transform:uppercase;}
.tableCenter th {text-align:center !important;}
.tableCenter td {text-align:center !important;}
.table thead > tr > th, .table tbody > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tbody > tr > td, .table tfoot > tr > td {
    vertical-align:middle;
    text-align:left;
    padding: 10px;
    font-family:'Roboto Slab';
    font-size:12px;
    color:#333333;
}


.table .quantity {font-size: 12px; height: 25px; padding: 2px 5px; text-align: right; width: 40px;}
.table a img:hover {opacity:0.7;}
.desc-responsive{display:none;}

/*======= /FIN - GENERAL =============================== */



/*=======================================================================================================================================================================*/
/*====================== COMPESCA - CSS =================================================================================================================================*/
/*=======================================================================================================================================================================*/


/*====================== COMPESCA - BASIC STYLES ========================================================================================================================*/
/*=======================================================================================================================================================================*/
body {background-color:#FFFFFF !important; line-height:normal !important;}
a {font-family:'Roboto-Slab'; font-size:12px; color:#666666 !important; font-weight:normal;}
p {font-family:'Roboto-Slab'; font-size:11px; color:#999999 !important; font-weight:normal; margin:0 !important;}

.clear {clear:both;}

/*====================== COMPESCA - MAIN LAYOUT ==================================================================================*/
/*================================================================================================================================*/
#maincontainer {width:100%; margin:0 auto;}
#topbar {width:100%; margin:0 auto;}
#bottombar {width:100%; margin:0 auto;}

/*====================== COMPESCA - MAIN_LAYOUT - HEADER =========================================================================*/
/*================================================================================================================================*/
#topbar #headerbar {width:100%; margin:0 auto; background:url(../images/cabecera/cabecera.png); background-color:#1CA5CC;}
#topbar #headerbar #header {/*width:970px;*/ height:80px; /*margin:0 auto; */padding:0px 15px 0px 15px;} 

/*====================== COMPESCA - MAIN_LAYOUT - HEADER - LOGO ==================================================================*/
#topbar #headerbar #header #logo {width:105px; height:80px; background-color:#FFFFFF; float:left; position:relative;}
#topbar #headerbar #header #logo a img {margin:0 auto;}
#topbar #headerbar #header #logo:hover {top:0px;}   


/*====================== COMPESCA - MAIN_LAYOUT - HEADER - MAIN MENU =============================================================*/

.mainmenu {height:40px; margin:0 auto; padding:10px 0px; float:right; text-align:right;}

.mainmenu .info {
    display: table-cell;
    width: auto !important;
    margin: 0 15px 0 0;
    padding: 2px 3px;
    font-family:'Roboto-Slab' !important;
    font-size:10px !important;
    color:#666666 !important;
    font-size:12px !important;
    font-weight:normal !important;
    background-color:#E9F3FD;
    vertical-align:middle;
    float:right;
}


.mainmenu nav {margin:0; padding:0; overflow:hidden; border:none; float:right;}
.mainmenu nav a {font-size:14px; color:#FFFFFF !important; font-weight:bold; text-decoration:none; padding:3px 15px; display:block;}
.mainmenu nav a:hover {border-bottom:solid; border-bottom-width:6px;}

/*====================== COMPESCA - MAIN_LAYOUT - HEADER - BUSCADOR ===============================================================*/

.menu .buscador {margin:0 0 10px 0; padding:0; float:right;}
.menu .buscador .form-control-bus {width:85%; height:22px; margin:0 5px 0 0; padding:2px; background-color:#FFFFCC;border: 1px solid #ccc;}
.menu .buscador .btn-lupa {width:22px; height:22px; margin:0 0px 0 0; padding:0; background-color:#CCFFCC; background:url(../images/style/lupa.png) no-repeat;}
.menu .buscador .btn-lupa:hover {background-color:#F4F4F4; transition: all 0.4s ease 0s;}

/*====================== COMPESCA - MAIN_LAYOUT - HEADER - HEADLINER ==============================================================*/
#topbar #headlinebar {width:100%; margin:0 auto 10px auto; background-color:#F4F4F4;}
#topbar #headlinebar #headline {height:40px; margin:0 auto; text-align:center;}
#topbar #headlinebar #headline h3, h5 {line-height:40px; font-family:'Roboto-Slab'; color:#999999; margin:0; text-align:center;}



/*====================== COMPESCA - MAIN_LAYOUT - MIDDLE - CONTENIDO =============================================================*/
/*================================================================================================================================*/
#maincontainer #center {/*width:970px;*/ margin:0 auto; /*padding:0px 15px 0px 15px;*/}

#maincontainer #center .column200 {/*width:200px; margin-right:10px; float:left; position:relative;*/}
#maincontainer #center .maincontent {/*width:730px;*/ margin:0; padding:0; float:left; position:relative;}
#maincontainer #center .column200 .column200line {margin-bottom:10px !important;}

/*====================== COMPESCA - MAIN_LAYOUT - MIDDLE - CESTA / PEDIDOS =========================================================*/
#maincontainer #center .column200 .column200line .cestacontainer {padding:10px; background-color:#F4F4F4; border: 1px solid #CCCCCC; position:relative; overflow:hidden;}
#maincontainer #center .column200 .column200line .cestacontainer .cestaline {margin-bottom:6px; position:relative; overflow:hidden;}
#maincontainer #center .column200 .column200line .cestacontainer .cestaline p {font-family:'Roboto-Slab'; color:#333333 !important; font-size:12px; padding-bottom:4px;}
#maincontainer #center .column200 .column200line .cestacontainer h3 {line-height:normal; font-family:'Roboto-Slab'; color:#999999; margin:0; font-size:16px; font-weight:bold; margin-bottom:10px;}
#maincontainer #center .column200 .column200line .cestacontainer ul {list-style:none; padding:0; margin-bottom:10px;}
#maincontainer #center .column200 .column200line .cestacontainer ul li {font-family:'Roboto-Slab'; color:#333333; font-size:11px; overflow:hidden; background-color:#FFFFCC;}
#maincontainer #center .column200 .column200line .cestacontainer ul li p {color:#333333 !important; font-size:11px; overflow:hidden;}
#maincontainer #center .column200 .column200line .cestacontainer ul li span {color:#FF0000; font-size:12px; font-weight:bold;}
#maincontainer #center .column200 .column200line .cestacontainer .precioline {overflow:hidden; font-weight:bold; float:left; margin-right:10px; padding:2px 0;} 
#maincontainer #center .column200 .column200line .cestacontainer .precioline span {font-family:'Roboto-Slab'; color:#999999 !important; font-size:12px; font-weight:bold;} 
#maincontainer #center .column200 .column200line .cestacontainer .btn {width:auto; height:auto; padding:4px; font-size:12px; float:right; margin-bottom:0px;}
#maincontainer #center .column200 .column200line .cestacontainer .btn-ak {background: #1CA5CC; color: #FFFFFF !important; box-shadow: none;}
#maincontainer #center .column200 .column200line .cestacontainer .btn-ak:hover, #maincontainer #center .column200 .column200line .cestacontainer .btn-ak:focus {
    background-color: #F4F4F4;
    color: #000000 !important;
    transition: all 0.4s ease 0s;
}

#bgpaletizado {background-color:#F6E3CE !important;}


#maincontainer #center .maincontent .breadcrumb {
    width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 10px;
    font-family: 'Roboto-Slab';
    font-size: 12px;
    color: #666666;
    background-color: #E9F3FD;
    display: inline-block;
}
#maincontainer #center .maincontent .infocontainer h3 {font-family:'Roboto-Slab'; margin:0; /* margin: 7px 0 10px; */ color: #999999;}

/*====================== COMPESCA - MAIN_LAYOUT - MIDDLE - IDENTIFICACIÓN =========================================================*/
#maincontainer #center .maincontent .compescarow {margin-bottom:0px; padding:0; clear:both;}
#maincontainer #center .maincontent .compescarow_01 {margin-left:10px; margin-top:10px; clear:both; }
#maincontainer #center .maincontent .compescarow .txt {
    width:auto;
    height:auto; 
    margin:0 0 6px 0;
    padding:10px;
    font-family: 'Roboto-Slab';
    font-size: 14px;
    color: #666666;
    display:inline-block;
}
#maincontainer #center .maincontent .compescarow .form-group {display:block !important; margin-bottom: 0 !important; margin:0 0 10px 0; padding:0 10px 10px 10px; clear:both;}
#maincontainer #center .maincontent .compescarow .form-group input {height:auto;}

#maincontainer #center .maincontent .compescarow .form-group .namelabel {
    width:120px;
    height:auto; 
    margin:0;
    padding:0;
    font-family: 'Roboto-Slab';
    font-size: 14px;
    color: #666666;
    float:left; 
    display:inline-block;
}
#maincontainer #center .maincontent .compescarow .form-group .passlabel {
    width:auto;
    height:auto; 
    margin:0 0 10px 0;
    padding:0;
    font-family: 'Roboto-Slab';
    font-size: 11px;
    color: #999999;
    float:left; 
    display:inline-block;
}
#maincontainer #center .maincontent .compescarow .form-group .form-control {
  display: block;
  width:180px !important;
  height:auto !important;
  margin:0;
  padding:2px;
  font-size:10px;
  color: #999999;
  background-color:#E9F3FD;
  border: 1px solid #CCCCCC;
  border-radius: 0 !important;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
          transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.contenedorBotones div {background-color:#E9F3FD;text-align:center;height:50px;padding:0px!important;margin-bottom:10px;}
.contenedorBotones div a {display: inline-block; width:100%; height:100%; vertical-align:middle;margin-top:15px;}
.contenedorBotones div:hover a{font-weight:bold;font-size:1.1em;}
.contenedorBotones div a:hover {text-decoration:none;}

/*====================== COMPESCA - MAIN_LAYOUT - MIDDLE - SELECCIÓN_CONTACTO =====================================================*/
#maincontainer #center .maincontent .compescarow .dropdowncontainer {
    width:100%;
    height:auto;
    margin:0 0 10px 0;
    padding:0px;
    font-family: 'Roboto-Slab';
    font-size: 14px;
    color: #666666;
    float:left;
}
#maincontainer #center .maincontent .compescarow .dropdowncontainer .dropdownform {
    width:auto;
    height:auto;
    margin:0;
    padding:10px;
    background-color:#F6E3CE;
    float:left;
}
#maincontainer #center .maincontent .compescarow .dropdowncontainer .dropdownline {
    padding-bottom:10px;
}
#maincontainer #center .maincontent .compescarow .dropdowncontainer .buttonline {
    padding:0;
}
#maincontainer #center .maincontent .compescarow .dropdowncontainer .dropdownline .dropdown {
    width:auto;
    height:28px;
    padding:5px 10px;
    display: block;
    vertical-align: middle;
    background-color:#FFFFFF;
    border: 1px solid #CCCCCC;
    font-size: 12px;
    line-height:normal;
    color:#666666;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

#maincontainer .line {width:940px; height:60px; margin:10px auto; padding:10px; background-color:#FFCFFF; clear:both;}
#maincontainer .linehidden {width:940px; height:auto; margin:0; padding:0; clear:both;}

/*====================== COMPESCA - MAIN_LAYOUT - MIDDLE - TABLE PEDIDO / PALETIZADO =====================================================*/
#maincontainer #center .maincontent .compescarow .paletizado {width:100%; height:auto; margin:0 0 20px 0; padding:0; float:left; background-color:#F6E3CE;}
#maincontainer #center .maincontent .compescarow .paletizado .paletizadoline {padding:10px; position:relative; overflow:hidden; float:left;}
#maincontainer #center .maincontent .compescarow .paletizado .paletizadoline p {color:#666666 !important; font-size:14px; font-weight:normal; padding-right:8px; display:inline-block;}
#maincontainer #center .maincontent .compescarow .paletizado .paletizadoline span {color:#333333; font-size:14px; font-weight:bold;}


/*====================== COMPESCA - MAIN_LAYOUT - MIDDLE - PRODUCTS ===============================================================*/
.panelListadoDetalleProductos .title {font-size:12px; padding:10px; background-color:#FFCC66;}
.panelListadoDetalleProductos .title h3 {font-size:12px; font-weight:bold; text-align: left;}

#maincontainer #center .maincontent .compescarow .col-der {padding-top:0 !important;}
#maincontainer #center .maincontent .compescarow .col-der .headline {position:relative; width:730px; height:auto; margin:0 0 10px 0; padding:10px; background-color:#F4F4F4; overflow:hidden;}
#maincontainer #center .maincontent .compescarow .col-der .headline h2 {/* line-height:120px; */ font-family:'Roboto-Slab'; font-size:24px; color:#999999; margin:0; font-weight:300;}


.col-der .listado-productos .producto {position:relative; /*width:730px;*/ height:auto; margin:0 0 10px 0; padding:4px; background-color:#FFFFFF; border:1px solid #CCCCCC; overflow:hidden;}
.col-der .listado-productos .producto .imagen {width:80px; height:60px; margin:0 10px 0 0; padding:0; float:left; position:relative;}
.col-der .listado-productos .producto .imagen img {max-width:100%; max-height:100%; vertical-align:inherit!important; border:1px solid #CCCCCC;}

.col-der .listado-productos .producto .dataproduct {/*width:220px;*/ width:200px; height:auto; margin:0 10px 0 0; padding:0; float:left; position:relative;}
.col-der .listado-productos .producto .dataproduct a {overflow:hidden; display:inline-block; font-size:14px; color:#333333 !important; margin:0;}
.col-der .listado-productos .producto .dataproduct a:hover {color:#1CA5CC !important; font-weight:bold; text-decoration:none; background-color:#F4F4F4;}
.col-der .listado-productos .producto .dataproduct a span {display:block; font-size:12px;}

.col-der .listado-productos .producto .pricescontainer {width:auto; height:auto; margin:0 10px 0 0; padding:0; float:left; position:relative;}
.col-der .listado-productos .producto .pricescontainer .price {width:130px; margin:0 0 2px 0; padding:2px; background-color:#F4F4F4; border:1px solid #CCCCCC; clear:both;}
.col-der .listado-productos .producto .pricescontainer .price p {font-size:10px;}
.col-der .listado-productos .producto .pricescontainer .price p span {overflow:hidden; font-family:'Roboto-Slab'; font-size:11px; color:#333333; font-weight:normal; float:right;}

.col-der .listado-productos .producto .finalpricecontainer .pricerow p{display:inline;}

.col-der .listado-productos .producto .finalpricecontainer {width:auto; height:auto; margin:0 15px 0 0; padding:0; float:left; position:relative;}
.col-der .listado-productos .producto .finalpricecontainer .finalprice {width:120px; margin:0 0 6px 0; padding:2px; background-color:#F6E3CE; border:1px solid #CCCCCC; clear:both;}
.col-der .listado-productos .producto .finalpricecontainer .finalprice p {font-size:10px;}
.col-der .listado-productos .producto .finalpricecontainer .finalprice p span {overflow:hidden; font-family:'Roboto-Slab'; font-size:12px; color:#333333; font-weight:bold; float:right;}

.col-der .listado-productos .producto .finalpricecontainer {width:134px; height:auto; margin:0 0 5px 0; padding:2px; background-color:#F6E3CE; border:1px solid #CCCCCC; clear:both; position:relative; overflow:hidden; }
.col-der .listado-productos .producto .finalpricecontainer p {font-size:10px; float:left;display:inline;}
.col-der .listado-productos .producto .finalpricecontainer input {width:auto !Important; font-family:'Roboto-Slab' !Important; font-size:11px !Important; /*color:#666666 !Important;*/ float:right;}
.col-der .listado-productos .producto .finalpricecontainer input[type=text] {width:40px !Important; background-color:#E9F3FD; text-align:right; border:inset;}

.col-der .listado-productos .producto .quantitycontainer {width:auto; height:auto; margin:0; padding:0; float:right; position:relative;}
.col-der .listado-productos .producto .quantitycontainer .quantityrow {width:120px; margin:0 0 4px 0; padding:2px;}
.col-der .listado-productos .producto .quantitycontainer .quantityrow p {font-size:11px;}
.col-der .listado-productos .producto .quantitycontainer .quantityrow p span {overflow:hidden; font-family:'Roboto-Slab'; font-size:11px; color:#333333; font-weight:normal; float:right;}


.col-der .listado-productos .producto .quantitycontainer .quantityrow input {width:auto !Important; font-family:'Roboto-Slab' !Important; font-size:10px !Important; color:#666666 !Important; }
.col-der .listado-productos .producto .quantitycontainer .quantityrow input[type=text] {width:60px !Important; background-color:#E9F3FD; text-align:center; border:inset;}
.col-der .listado-productos .producto .quantitycontainer .quantityrow input[type=submit] {width:60px !important; background-color:#BCE9F6;}
    .col-der .listado-productos .producto .quantitycontainer .quantityrow input[type=submit]:disabled {background-color:#CCC;}

/*====================== COMPESCA - MAIN_LAYOUT - MIDDLE - PRODUCTS - NOVEDADES ===================================================*/
.col-der .list-top-news .listado-productos .producto {position:relative; width:730px; height:auto; margin:0 0 10px 0; padding:4px; background-color:#FFFFFF; border:1px solid #CCCCCC; overflow:hidden;}
.col-der .list-top-news .listado-productos .producto .imagen {width:80px; height:60px; margin:0 10px 0 0; padding:0; float:left; position:relative;}
.col-der .list-top-news .listado-productos .producto .imagen img {max-width:100%; max-height:100%; vertical-align:inherit!important; border:1px solid #CCCCCC;}

.col-der .list-top-news .listado-productos .producto .dataproduct {width:240px; height:auto; margin:0 10px 0 0; padding:0; float:left; position:relative;}
.col-der .list-top-news .listado-productos .producto .dataproduct a {overflow:hidden; display:inline-block; font-size:14px; color:#333333 !important; margin:0;}
.col-der .list-top-news .listado-productos .producto .dataproduct a:hover {color:#1CA5CC !important; font-weight:bold; text-decoration:none; background-color:#F4F4F4;}
.col-der .list-top-news .listado-productos .producto .dataproduct a span {display:block; font-size:12px;}

/*====================== COMPESCA - MAIN_LAYOUT - FOOTER ==========================================================================*/
/*=================================================================================================================================*/
#bottombar #footerbar {width:100%; height:auto; margin:15px auto; background-color:#FFFFFF !important;}
#bottombar #footerbar #designfooter {height:30px; margin-bottom:10px; padding:0px; background:#F4F4F4;}
#bottombar #footerbar #footer {height:auto; margin:0 auto; padding:0px 15px 0px 15px;}

/*====================== COMPESCA - MAIN_LAYOUT - FOOTER - ADDRESS ================================================================*/
#bottombar #footerbar #footer .column34 {height:auto; margin:0 auto; float:left; position:relative;}
#bottombar #footerbar #footer .column34 .address {margin: 20px 0 0; /*line-height:20px;*/}
#bottombar #footerbar #footer .column34 .address p {font-family:'Roboto-Slab'; font-size:12px; color:#999999; font-weight:normal; line-height:10px; margin: 0 0 10px 0 !important;}
#bottombar #footerbar #footer .column34 .address a {color:#1CA5CC !important;}
#bottombar #footerbar #footer .column34 .address a:hover {color:#999999 !important; text-decoration:none;}

/*====================== COMPESCA - MAIN_LAYOUT - FOOTER - COLUMNS ================================================================*/
/*#maincontainer #bottombar #footerbar #footer .column22 {width:22%; height:auto; margin:0 auto; float:left; position:relative;}*/
#bottombar #footerbar #footer .column22 h3 {font-family:'Roboto-Slab'; font-weight: 700; margin: 7px 0 10px; color: #999999; font-size: 15px;}
#bottombar #footerbar #footer .column22 ul {margin:0 0 20px;  padding:0; list-style: none;}
#bottombar #footerbar #footer .column22 ul li a {text-decoration:none;}
#bottombar #footerbar #footer .column22 ul li a:hover {padding-left:5px;}



/*====================== COMPESCA - GENERAL ======================================================================================*/
/*================================================================================================================================*/

/*====================== COMPESCA - MIGAS / BREADCRUMB ===============================================================================*/
.migas {
    width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 10px;
    font-family: 'Roboto-Slab';
    font-size: 12px;
    color: #666666;
    background-color: #E9F3FD;
    display: inline-block;
}

.migas ul {padding:0; margin:0; list-style:none;}
.migas li {display:inline; float:left; padding-right:2px;}
.migas li:after {color: #666666; content: " > "; font-size:12px; padding:0 2px;}
.migas li:last-child:after {content: none;}
.migas-cesta .migas-img{display:none;}


/*====================== COMPESCA - AVISOS / ERRORES ===============================================================================*/

/* === Ajustados a Compesca ==========*/
.usernotice {
    margin:0 0 10px 0;
    padding:10px 10px 10px 35px;
    font-family:'Roboto-Slab';
    font-size:13px;
    color:#666666;
    background:url(../images/style/info25x25.png) no-repeat 0.5em 0.5em RGB(189,202,244);
    background-color:#FFFFCC;
    display:inline-block;
}
.customerComments {
    margin:0 0 10px 0px;
    padding:10px 10px 10px 0px;
    font-family:'Roboto-Slab';
    font-size:14px;
    color:#666666;
    background-color:#F4F4F4;
    display:inline-block;
}


.customerComments ul {
    margin: 0 0 0 0;
}

/*Lista habitual*/
#btnBuy, #btnSave{
    float:right;
}

.linkBtn{
    font-size:inherit!important;
    padding:2px;
    color:white;
}

#listaHabitual .tableListado{
    background-color:#F4F4F4;
    margin-top:10px;
}

#listaHabitual .buscador{
    float:right;
}
/* === Pendientes de ajuste ==========*/
.error {background:url(../images/style/error25x25.png) no-repeat 0.5em 0.5em RGB(255,196,206);border-radius: 5px;font-size: 13px;padding: 10px 15px;margin-bottom:20px;float: inherit;padding-left:35px;color:DarkRed;display:inline-block;}
.Max{font-size:14px;font-weight:bold;}
.infoMax{background:url(../images/style/info25x25.png) no-repeat 0.5em 0.5em   RGB(189,202,244);border-radius: 5px; color:#064C68; font-size: 13px; padding: 10px 15px;margin-bottom:20px;padding-left:30px;display:inline;}
.timespan{display:none;border-radius: 5px; color:#990719; font-size: 13px; padding: 10px 15px;margin-bottom:20px;float: inherit;}
.warning{background:url(../images/style/warning25x25.png) no-repeat 0.5em 0.5em RGB(254,230,182);padding-left:35px;border-radius: 5px; color:orangered; font-size: 13px; padding: 10px 15px;margin-bottom:20px;float: inherit;}
.marginTop{margin-top:20px;}
.marginTopMax{margin-top:40px;}


/*======= /FIN - COMPESCA - CSS =============================== */

/*******************************************************/
/******************** CABECERA**************************/
/*******************************************************/
.container {max-width: none !important; width: 100% !important;}


/*==============================================================================================================================================================*/
/*==================== COMPESCA - CSS Luis =====================================================================================================================*/
/*==============================================================================================================================================================*/
.col-der .filtro2 {
    background: #F6E3CE;
    border: 1px solid #CCCCCC;
    border-radius: 5px;
    float: left;
    margin: 4px 0;
    padding: 20px;
    width: 100%;
    text-align: left;
    font-size: 1.1em;
}
.form-inline2 {
    display: inline-block !important;
    margin-bottom: 0 !important;
    vertical-align: middle !important;
    width: 100%;
}
.form-group2 {
    display: inline-block !important;
    margin-bottom: 0 !important;
    vertical-align: bottom !important;
    width: 100%;
}
.col-der .form-inline2 .btn-ak {
    margin-right: 5px;
}
.filtro2 .btn-filtro {
    margin-top: 20px;
    text-align: right
}
.control-label {
    text-align: left;
}
.row2 {
    margin-right: -5px;
    margin-left: -5px;

    width: 100%;
    margin-bottom: 10px;
}
.row2:before,
.row2:after {
    display: table;
    content: " ";
}
.row2:after {
    clear: both;
}
.row2:before,
.row2:after {
    display: table;
    content: " ";
}
.row2:after {
    clear: both;
}


/*====================== PAGINACIÓN ==========================================================*/
.pagination li a {
    padding: 8px 12px !important;
    height: 31px !important;
}
#paginacion {
    text-align: right;
}

/*======= /FIN - COMPESCA - CSS Luis (OLD) =============================== */


/************************************ CABECERA DE IMAGEN Y LOGOTIPO *****************************************/
.header {width:100%;height:160px;float:left;background:url("../images/cabecera/cabecera.png");}
.header-sin{width: 100%;height: 160px;float:left;padding:5px 5px;margin: 10px 0px 5px 0px;background-color:Black;}
.header-white{width: 100%;height: 160px;float:left;padding:5px 5px;margin: 10px 0px 5px 0px;}
.logo {margin-top:7px;}
.private {float:right; background:#D63019; padding:5px 14px; color:#fff; font-weight:600; border-radius:3px; margin-top:32px;}
.private:hover, .private:focus {background:#B72718; text-decoration:none; color:#fff;transition: all 0.6s ease 0s;}


/******************* MenÚ *********************/

header{/*float:left;*/width:100%;margin-bottom:5px;}
    header nav {
        width: 100%;
        height: 40px;
        /* background: #084B8A; */
        background: #1CA5CC;
    }

.menu_bar {display:none;}
.icons-zone{display:none;}
header nav ul {list-style:none;overflow:hidden;margin-top:2px;margin-left:-40px;}
header nav ul li {float: left;}
header nav ul li span {margin-right:10px;}
header nav ul li a{display:block; padding:15px; color:#fff; text-decoration:none; margin-top:-5px; font-size:14px; margin-bottom:-5px; font-weight:bold;}
    header nav ul li a:hover {
        background: #f4f4f4;
        color: black;
        text-decoration: none;
        font-weight:bold;
    }
header nav ul li:hover .children {display:block;}

header nav ul li .children {display:none;background:#444141;position: absolute;width: 100%;z-index:1000; color:White;}
header nav ul li .children li {display:block; overflow: hidden; border-bottom: 1px solid rgb(255,255,255);}
header nav ul li .children li:hover{display:block; overflow: hidden; border-bottom: 1px solid rgb(255,255,255);}
header nav ul li .children li a { display: block;}
header nav ul li .children li a span {position: relative;top:3px;margin-right:0;margin-left:10px;left:10px;}
header nav ul li .caret {position: relative;top:3px;margin-left:10px; margin-right:0px;}

header nav ul li .children li:hover .children2 {display:block;}
header nav ul li .children li .children2 {display:none;background: #201f1f;position: relative;width: 100%;z-index: 1000;color: White;display: inline-table;height: auto;float: right;}
header nav ul li .children li .children2 li {display:block; overflow: hidden; border-bottom: 1px solid rgb(255,255,255);}
header nav ul li .children li .children2 li:hover{display:block; overflow: hidden; border-bottom: 1px solid rgb(255,255,255);}
header nav ul li .children li .children2 li .last{border-bottom: 0px !important;}
header nav ul li .children li .children2 li a {display: block;}
header nav ul li .children li .children2 li a span {position: relative;top:3px;margin-right:0;margin-left:10px;left:10px;}
header nav ul li .children li .caret {position: relative;top:3px;margin-left:10px; margin-right:0px;}

.bt-menu{display:none;}

.submenu{display:none!important;}



/*******************************************************/
/********************  CUERPO **************************/
/*******************************************************/

.wrapper .container{width:1000px;}

.container {max-width: none !important; width: 970px;}

/*******************************************************/
/************* COLUMNA IZQUIERDA ***********************/
/*******************************************************/


#maincontainer .line .col-izq {/*float:left;*/ width:auto; margin-top:2px;padding-top:10px;}
#maincontainer .line .col-izq {/*float:left;*/ width:100%; /* Este _Height es mio =>*/height:auto; border:1px solid #ccc; border-radius:5px; margin-bottom:15px; padding:10px;}
#maincontainer .line .col-izq h3 {padding-bottom:5px; border-bottom:1px solid #f4f4f4; font-size:15px; margin:5px 0 10px; font-weight:bold; text-transform:uppercase;}
#maincontainer .line .col-izq p {margin:0 0 6px;}
#maincontainer .line .col-izq img {max-width:100%;}
#maincontainer .line .col-izq .btn {/*float: right;*/ font-size: 12px; padding: 4px 10px 2px; width: 100%;}
#maincontainer .line .col-izq select {height: 30px; width: 100%;}


.col-izq .SinBordeado {float:left; width:100%;  margin-bottom:15px; padding:10px;}
.col-izq .SinBordeado h3 {padding-bottom:5px;  font-size:15px; margin:5px 0 10px; font-weight:bold; text-transform:uppercase;}
.col-izq .SinBordeado p {margin:0 0 6px;}
.col-izq .SinBordeado img {max-width:100%;}

.sin-bordeado {margin-bottom:15px; float:left; width:100%;border-radius:5px;}
.sin-bordeado img {width:100%;border-radius:5px;}



/****************** Cesta *************/
.col-izq .cesta {background:#f9f9f9;}
.col-izq .cesta ul {list-style:none; padding:0; margin:0;}
.col-izq .cesta ul li{background: url(../images/style/nextarrow.gif) no-repeat left 3px; padding-left: 14px; padding-bottom:4px;}
.col-izq .cesta ul li span{color: #b2b2b1; font-size: 9px; font-style: italic; font-weight: bold;margin-right:5px;}
.col-izq .cesta .btn {padding:4px 10px 2px; font-size:12px; float:right; width:100%;margin-bottom:10px;}
.col-izq .cesta .price {color: #b2b2b1; font-size: 18px; text-align:right; font-weight:bold;}
.col-izq .cesta .price span {font-size: 11px;}


/******  MENU LATERAL DINAMICO 
.cssmenu {width: 200px;}*******/


/*******************************************************/
/************* COLUMNA DERECHA *************************/
/*******************************************************/

.col-der {/*float:right; width:720px;*/ padding-bottom:30px;font-size:12px;padding-top:10px;}

/* ======================= CAMBIOS PARA DETALLE PRODUCTO - LuisCSSenNAVIDAD ==========================================================================================*/
/* .title {font-size:23px; margin:10px 0; text-transform:uppercase; color:black; border-bottom:1px solid #F4F4F4; padding-bottom:5px;margin-bottom:25px;} */
.title {font-size:12px; margin:0; text-transform:uppercase; color:black; border-bottom:1px solid #F4F4F4; padding-bottom:5px;margin-bottom:15px !important;}

.col-der .subtitle {color: #666666;font-size: 15px;font-weight: bold;margin: 25px 0 15px 15px;text-transform: uppercase;float: left;}


.col-der .bordeado {float:left; width:100%; border:1px solid #ccc; border-radius:5px; margin-bottom:15px; padding:10px;}
.col-der .bordeado h3 {padding-bottom:5px; border-bottom:1px solid #f4f4f4; font-size:15px; margin:5px 0 10px; font-weight:bold; text-transform:uppercase;}
.col-der .bordeado p {margin:0 0 6px;}
.col-der .bordeado img {max-width:100%;}
.col-der .bordeado .btn {float: right; font-size: 12px; padding: 4px 10px 2px; width: 100%;}
.col-der .bordeado select {height: 30px; width: 100%;}


.col-der .listado-productos .producto .price {color: gray; font-size: 18px; text-align:left; font-weight:bold; margin-bottom:5px;margin-top:7px;margin-right:10px;}
.col-der .listado-productos .producto .price-discount {float:left; color: gray; font-size: 18px; text-align:right; font-weight:bold; margin-bottom:5px;margin-top:-18px;margin-left:30px;}
.col-der .listado-productos .producto .price-discount-en {float:left; color: black; font-size: 16px; text-align:right; font-weight:bold; margin-left: 60px;margin-top: -5px;}
.col-der .listado-productos .producto .price-discount-en span {font-size: 11px;}
.col-der .listado-productos .producto .price-discount span {font-size: 11px;}
.col-der .listado-productos .producto .price-discount .old{text-decoration:line-through;color:#777;display: block;margin-bottom: 10px;}
.col-der .listado-productos .producto .price-discount-en .old{text-decoration:line-through;color:#777;}
.col-der .listado-productos .producto .war{color: orange;}

.col-der .listado-productos .producto .capaCantidad{height:50px; width:140px; overflow:hidden; display:inline-block; margin:10px 0; line-height:15px; margin-left:20px; text-align:center; background-color:#FFFFFF;}
.col-der .listado-productos .producto .capaCantidad a {font-size:11px; font-weight:bold; color:#666666;}
.col-der .listado-productos .producto .capaCantidad input {max-width:60px; margin: 5px; text-align:center; background-color:#FFFFCC; font-size:12px; font-weight:bold; color:#000000;}

.col-der .listado-productos .producto .btn-ak {
    font-size: 13px;
    background: #1CA5CC;
    border: none;
    border-radius: 15px 0 10px 0;
    bottom: -1px;
    position: absolute;
    right: -1px;
    padding: 10px 15px 10px 16px;
}
.col-der .listado-productos .producto .btn-ak:hover {
    background: #F4F4F4;
    color:#000000;
}
.col-der .listado-productos .producto .img-disp-list{margin-top: 12px; margin-left: 5px;}


/************* Detalle Producto *************************/
/* ======================= CAMBIOS PARA DETALLE PRODUCTO - LuisCSSenNAVIDAD ==========================================================================================*/
.col-der .detalle-producto .descripcion {float:right; padding:0px 10px 5px;text-align:justify;}
.col-der .detalle-producto .descripcion h3 {margin:0 0 15px 0; line-height:25px; color:black; text-transform:uppercase;} /* Quitar si no se usa */
.col-der .detalle-producto .descripcion span {font-size:16px; font-weight:bold; color:#333333; display:block; margin:0 0 15px 0; line-height:25px; text-transform:uppercase;}
.col-der .detalle-producto .descripcion .title {font-size:16px; color:#666666 !important;}

/*========== Tabla que muestra los pedidos en ShoppingBag ====================*/
.col-der .tbl-bag{margin-left:0; background-color:#FFFFCC /* color azul suave de compesca #E9F3FD */ ;}


.col-der .detalle-producto .en-linea{display:inline-block;margin-left:9px;margin-top:3px;}


.col-der .detalle-producto .error {background:url(../images/style/error25x25.png) no-repeat 0.5em 0.5em RGB(255,196,206);margin-left:15px;border-radius: 5px;font-size: 13px;padding:10px 15px 10px 35px;margin-bottom:20px;float: inherit;color:darkred;}
.col-der .detalle-producto .Max{font-size:14px;font-weight:bold;}
.col-der .detalle-producto .warning{background:url(../images/style/warning25x25.png) no-repeat 0.5em 0.5em RGB(254,230,182);margin-left:15px;padding:10px 15px 10px 35px;border-radius: 5px; color:orangered; font-size: 13px;margin-bottom:20px;float: inherit;display:inline-flexbox;}
.col-der .detalle-producto .info {background:url(../images/style/info25x25.png) no-repeat 0.5em 0.5em RGB(189,202,244);margin-left:15px;border-radius: 5px;font-size: 13px;padding:10px 15px 10px 35px;margin-bottom:20px;float: inherit;color:#645656;}
.col-der .detalle-producto .info-warning {color: #ce092a;font-size: 10px;padding-left: 0 !important;}
.col-der .detalle-producto .msg-info { display:inline-block;margin:10px 5px; width:715px; float:left; padding:20px; }


.col-der .row .col-bus40{padding-left:10px;position:relative;float:left;margin-right:10px;}
.col-der .row .col-bus50{padding-left:10px;position:relative;}
.ordenar{margin-left:75%;}


.col-der .form-inline .btn-ak{ margin-right:5px;}
.col-der .filtro {background: #F9F9F9; border: 1px solid #CCCCCC; border-radius: 5px; float: left; margin: 10px 0; padding: 20px; width: 100%;text-align:justify !important;font-size: 1.1em;}
.col-der .principal {margin:30px 0;}

/*============ COMPESCA =============== */
    
.col-der .precio-cesta span {font-family: 'Roboto-Slab' !important; font-size: 18px; display:block; text-transform: uppercase; font-weight: normal; line-height: 55px; color:#333333 !important;}

.col-der .precio-cesta {float: right;color: #B2B2B1;width: 100%;text-align: right;margin: 10px 0;font-size: 11px;font-weight: bold;}
.precio-cesta span {font-size: 50px;display:block;text-transform: uppercase;font-weight: normal;line-height: 55px;color:black;}
.precio-cesta {color: #B2B2B1;width: 100%;text-align: right;margin: 10px 0;font-size: 11px;font-weight: bold;}
.col-der .slide {width: 100%;}

.col-der .filtro {background:#F9F9F9; border:1px solid #CCCCCC; border-radius:5px; float:left; margin:10px 0; padding:20px; width:100%;}

.col-der .user-data {margin:30px 0;}
.col-der .progress-bar {background-color:gray;}

/************************************/
/******  PAGINACI�N PRODUCTOS *******/
/************************************/
.filtro-paginacion {background: #F9F9F9;border: 1px solid #CCCCCC;border-radius: 5px;float: left;margin: 10px 0 20px 0;padding: 12px 15px 5px;width: 100%;font-size: 11px;}
.pagination li a{    padding:8px 12px !important;    height:31px !important;}
#paginacion {text-align: right;}
.filtro-paginacion select {width: 100%;height: auto;}



/************************************/
/******  PAGINACI�N PRODUCTOS *******/
/************************************/



.btns-bag{ float:right; }
.btns-bag .btn .btn-ak, .btns-bag .btn .btn-ak2{    margin-left:10px;    margin-right:10px;    margin-top:20px;}
.btns-page-options {	margin-top:150px;	margin-left:10px;}


/******* RFV ********/
.rfv-style{    visibility: visible;    display:none !important;}

/******* RFV *******/

.filtro .btn-filtro {margin-top:20px; text-align:right}


/*********************************************************************/
/*********************** FOOTER **************************************/
/*********************************************************************/
.footer {background:#E2E2E2; width:100%; margin-bottom:30px;}
.footer .col-izq {text-align:right; font-weight:bold; padding:20px 0;}
.footer .col-der {padding:23px 5px;}
.footer .col-der ul{list-style:none; margin:0; padding:0; font-size:11px; float:left; width:100px;}
.footer .col-der ul.lg {width:230px;}
.footer .col-der li{padding:2px 0;}
.footer .col-der li a{color:#333;}
.footer .col-der .redes {float:left; text-align:right;margin-left:30px;}
.footer .col-der .redes img { text-align:right; width:45px;height:45px;}
.footer .col-der .logo-footer {width:20%; float:right;margin-top:-20px;margin-right:-20px;}




/*********************************************************************/
/*********************** MAPA DISTRIBUIDORES *************************/
/*********************************************************************/

.item {padding: 1em;margin: 0 0 2em;}

.dark {background: #2a3333;}
.map {width: 100%;height: 750px;}
.shadow {-moz-box-shadow: 0px 2px 4px #999;-webkit-box-shadow: 0px 2px 4px #999;box-shadow: 0px 2px 4px #999;}
.light {background: #fff;}
.content {padding: 1.5em;margin: 0 0 1.5em;}


/*****************************************************************************
  MAPA DEL SITIO
*****************************************************************************/
.sitemap dl {float:left; padding-right:30px; width:180px;}
.sitemap dt {font-size:14px; text-transform:uppercase; font-weight:bold; margin-bottom:10px;color:#0090d1;}
.sitemap dd {padding-bottom:3px;}


/*****************************************************************************
 MIGAS CESTA
*****************************************************************************/
/* .progress {width:100%;} */
.progress {width:auto; }
.migas-cesta {width:100%; float:left;margin-top:10px;margin-bottom:15px;margin-top:5px;} /*comentado: padding-left:2px;margin:10px 0 5px; margin-bottom: 40px; */
.migas-cesta ul {padding:0; margin:0; list-style:none;}
.migas-cesta li {text-transform: uppercase; background: url("../images/style/bg-footer.png") no-repeat right -1px; display: inline; float: left; margin-left: 2px; padding-right: 18px;}
.migas-cesta li:last-child {background: none;}
.migas-cesta li.active {color: black; font-weight:bold; font-weight: 600;}
.migas-cesta li a{color: GrayText;font-weight:Bold;}


/*****************************************************/
/******* LISTADO CATEGORIAS / SUBCATEGORIAS **********/
/*****************************************************/

/*Menu categor�a*/
.categorias {display:none!important;}
dl.categorias{float:left;width:112.5%;margin:0;margin-bottom:30px;display:none;}
dl.categorias dd.activo{color: black !important;}
dl.categorias dd.activo,dl.categorias dd.activo:hover {background: #777370;border: 1px solid #F8D07C;color: black;}

.activo a:hover {color: black;}
dl.categorias dd 
{
    background: black;
    border: 1px solid rgba(255, 255, 255, 0.15);
    float: left;
    font-weight: bold;
    height: 4em;
    line-height: 1em;
    margin: 0.5em 0.5em 0 0;
    padding: 1em 0.5em 0.2em 0.5em;
    line-height: 0.8em;
    text-align: center;
    display:none;
    line-height: 10pt;
    border-radius: 5px;
}
/******** overflow-y: visible;*********/
dl.categorias dd:hover{    background: #777370; /*url("../images/style/dd-hover.png") repeat-x scroll center bottom #FEFEFE;*/     color: black;    /*border: 1px solid #F8D07C;*/}
dl.categorias dd a{ text-decoration: none;font-size: 13px;
    font-weight: bold;
    float:left;
    width:100%;
    color: white;
    font-family:Arial !important;
}
dl.categorias dd a:hover{    font-weight: bold;    /*font-size:13px;*/    color: black;/*#FA6804;*/ }

/*********************************************************************/
/********************* PopUp Jquery **********************************/
/*********************************************************************/
.ui-widget-header {	background:Black;}
.ui-dialog .ui-dialog-title{    color:white !important;}

/*********************************************************************/
/********************* PopUp Jquery **********************************/
/*********************************************************************/

/*********************************************************************/
/********************* BANNERS PUBLICIDAD ****************************/
/*********************************************************************/

.wrapper-publi {position:relative; width:100%; margin:0 auto;}
.img-options{margin-right:5px;}
.img-options-vend{margin-right:1px;}
.disabled{pointer-events: none;cursor: default;opacity:0.7;}
/*********************************************************************/
/********************* BANNERS PUBLICIDAD ****************************/
/*********************************************************************/



/*********************** PANEL DE CONTROL ****************************/
/*********************************************************************/
.img-control-panel{width:30px;height:30px;}
.bordeado {float: left;border: 1px solid #ccc;border-radius: 5px;margin-top: -8px;padding-top: 5px;padding:4px;}
/*********************************************************************/
/*********************** PANEL DE CONTROL ****************************/

/************************* OTROS *************************************/
/*********************************************************************/

.form-inline {
    display: inline-block !important;
    margin-bottom: 0 !important;
    vertical-align: middle !important;
}

div .color-bag{text-align:left; font-family:'Roboto Slab'; color:#333333; font-size:12px;}


h2 .pc{margin-top:15px;margin-bottom:15px;}

.divAcceder{margin-left: 29%;width: 49%;}
.btnAcceder{width: 100%;}

/*********** POPUP CONFIRMACION ELIMINACION ***********/
 .delete-popup
{
    background-color: white;
    border: 1px solid grey;
    display: inline-block;
    color:black;
    border-radius: 5px;
    left: 55%;
    padding: 15px;
    position: fixed;
    text-align: justify;
    top: 50%;
    z-index: 10;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.4) inset;
    -moz-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.4) inset;
    -webkit-transition: opacity .5s, top .5s;
    -moz-transition: opacity .5s, top .5s;
    -o-transition: opacity .5s, top .5s;
    /*width:500px;*/
    /*height:120px;*/
    font-size:12px;         
}
.delete-popup .title-popup
{
    margin-top:2px;
    border-bottom-right-radius:4px;
    border-bottom-left-radius:4px;
    border-top-right-radius:4px;
    border-top-left-radius:4px;
    border:1px solid #aaaaaa;
    color:#222222;
    font-weight:bold;
    background-color:Black;
    padding: .4em 1em;
    position: relative;
    margin-left:-10px;
    margin-top:-10px;
    margin-right:-10px;
            
}
.delete-popup p{ margin-top:15px; margin-bottom: 10px;}
.delete-popup label{display: inline-block;text-align: left; width: 120px;}
.delete-popup input[type="text"], .delete-popup input[type="password"]
{
    border: 1px solid;
    border-color: #999 #ccc #ccc;
    margin: 0;
    padding: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.delete-popup input[type="text"]:hover, .delete-popup input[type="password"]:hover
{
    border-color: #555 #888 #888;
}
.delete-popup .ui-dialog-title
{
    color:white !important;
}
        
               
/*********** POPUP CONFIRMACION ELIMINACION ***********/
        
.posicion{display:inline-block;margin-top:50px;width:500px;margin-left:28px;}
 
 /************** PANEL DE CONTROL *************/
.filtro {background: #F9F9F9; border: 1px solid #CCCCCC; border-radius: 5px; float: left; margin: 10px 0; padding: 20px; width: 100%;text-align:justify !important;font-size: 1.1em;}

.img-size img{height:50px;width:50px;}

/****************************************/

/*AJUSTES RESPONSIVE*/
@media (max-width:576px){
    #topbar #headerbar #header{
        height: auto;
    }
    
}

/************MASCARA DE CARGA***************/
.loader-page {
    position: fixed;
    z-index: 25000;
    background: rgba(255, 255, 255,0.5);
    left: 0px;
    top: 0px;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
}

    .loader-page::before {
        content: "";
        position: absolute;
        border: 2px solid rgb(50, 150, 176);
        width: 60px;
        height: 60px;
        border-radius: 50%;
        box-sizing: border-box;
        border-left: 2px solid rgba(50, 150, 176,0);
        border-top: 2px solid rgba(50, 150, 176,0);
        animation: rotarload 1s linear infinite;
        transform: rotate(0deg);
    }

@keyframes rotarload {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.loader-page::after {
    content: "";
    position: absolute;
    border: 2px solid rgba(50, 150, 176,.5);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    box-sizing: border-box;
    border-left: 2px solid rgba(50, 150, 176, 0);
    border-top: 2px solid rgba(50, 150, 176, 0);
    animation: rotarload 1s ease-out infinite;
    transform: rotate(0deg);
}