.centrat {margin:0 auto; margin-left:auto; margin-right:auto; align:center; text-align:center;}    

.vermell {
	
	}    

.destacable {font-style: bold;}

.topCarro {
   // color:#F3F6FA; 
	color:red;
    width: 120px;
    position: fixed;
    top:-5px;
    bottom:auto;
    height: 45px;
    line-height: 50px;
    right:5px;
    left:auto;
    z-index: 2147483647;
    background-color:rgba(0,0,0,0.1);
    font-weight: bolder; 
    text-align: right;
    border-radius: 5px;
}

.boto {
    background:#EAF2EF;   
    border-radius: 9px;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    position:relative;
    padding-top: 3px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    font:14px/16px Roboto, Arial, Helvetica, sans-serif;
    text-shadow: 0 1px 0 #000;
    font-style:normal;
    color: #ffffff; 
    line-height: 45px;
    text-decoration:none;
    border: 1px solid green ;
    text-align: center;

}
.boto:hover {
    opacity:0.7;
    outline: 0; 
    text-decoration:underline;
    background-color: #ff3333;
    color: #ffffff;
}

.ui-icon-spanish:after {
	background-image: url("images/spanish.svg");
        background-size: 24px 24px;
}

.ui-icon-english:after {
	background-image: url("images/english.svg");
        background-size: 24px 24px;
}
      

.ui-icon-remove-wh:after { 
	background:  url("images/times-circlewh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}

.ui-icon-info-circle-wh:after { 
	background:  url("images/info-circlewh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}

.ui-icon-shopping-cart-wh:after { 
	background:  url("images/shopping-cartwh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}	
.ui-icon-user-wh:after { 
	background:  url("images/userwh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.ui-icon-phone-wh:after { 
	background:  url("images/phonewh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}

.ui-icon-envelope-wh:after { 
	background:  url("images/envelopewh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}

.ui-icon-home-wh:after { 
	background:  url("images/homewh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}

.ui-icon-location-arrow-wh:after { 
	background:  url("images/location-arrowwh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}

.ui-icon-location-arrow-wh:after { 
	background:  url("images/location-arrowwh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}

.ui-icon-gavel-wh:after { 
	background:  url("images/gavelwh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.ui-icon-chain-broken-wh:after { 
	background:  url("images/chain-brokenwh.svg") 50% 50% no-repeat; 
	background-size: 22px 22px;  
	-moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.nav-glyphish .ui-btn { padding-top: 40px !important; }
.nav-glyphish .ui-btn:after { width: 30px!important; height: 30px!important; margin-left: -15px !important; box-shadow: none!important; -moz-box-shadow: none!important; -webkit-box-shadow: none!important; -webkit-border-radius: 0 !important; border-radius: 0 !important; }

#btnInfo:after { background:  url("images/homewh.svg") 50% 50% no-repeat; background-size: 22px 22px;  -moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;}
#btnMiCuenta:after { background:  url("images/userwh.svg") 50% 50% no-repeat; background-size: 22px 22px;   -moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;}
#btnCarta:after { background:  url("images/book.svg") 50% 50% no-repeat;  background-size: 22px 22px;  -moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;}
#btnCarrito:after { background:  url("images/shopping-cartwh.svg") 50% 50% no-repeat;  background-size: 22px 22px;  -moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;}

#btnEntregas:after { background:  url("images/truck.svg") 50% 50% no-repeat;  background-size: 22px 22px;  -moz-border-radius: 0px;
    -webkit-border-radius:0px;
    border-radius:0px;}
	
.botobuit {
    -webkit-border-radius: .3125em;
    border-radius: .3125em;
}

// CARTA

/* A bit custom styling */
.carta .ui-listview {
     //background:  url("images/scooter.png");
	  background-color: #83D3C9;
	
}
.carta .ui-listview h2 {
//color: #7C8081;
}
.carta .ui-listview li .ui-btn p {
   // color: #111;
	
}
.carta .ui-listview li .ui-btn .ui-li-aside {
    color: red; // #F3F6FA;
   //color:rgb(227,26,18);
    font-weight: bolder;
}

/* First breakpoint is 22,5em (360px). 2 column layout. Tiles 250x250 pixels incl. margin at the breakpoint. */
@media ( min-width: 22.5em ) {
    .carta .ui-content {
        padding: .5625em; /* 9px */
    }
    .carta .ui-listview li {
        float: left;
        width: 45%; /* 33.3333% incl. 2 x 1.2% margin */
        height: 11.25em; /* 180p */
        margin: .5625em 1.2%;
    }
    .carta .ui-listview li > .ui-btn {
        -webkit-box-sizing: border-box; /* include padding and border in height so we can set it to 100% */
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        height: 100%;
    }
    .carta .ui-listview li.ui-li-has-thumb .ui-li-thumb {
        height: auto; /* To keep aspect ratio. */
        max-width: 100%;
        max-height: none;
    }
    /* Make all list items and anchors inherit the border-radius from the UL. */
    .carta .ui-listview li,
    .carta .ui-listview li .ui-btn,
    .carta .ui-listview .ui-li-thumb {
        -webkit-border-radius: inherit;
        border-radius: inherit;
    }
    /* Hide the icon */
    .carta .ui-listview .ui-btn-icon-right:after {
        display: none;
    }
    /* Make text wrap. */
    .carta .ui-listview h2,
    .carta .ui-listview p {
        white-space: normal;
        overflow: visible;
        position: absolute;
        left: 0;
        right: 0;
    }
    /* Text position */
    .carta .ui-listview h2 {
      //  font-size: 1.15em;
        margin: 0;
        padding: .125em 1em;
        bottom: 50%;
    }
    .carta .ui-listview p {
        font-size: 0.75em;
        margin: 0;
        padding: 0 1.25em;
        min-height: 50%;
        bottom: 0;
    }
    /* Semi transparent background and different position if there is a thumb. The button has overflow hidden so we don't need to set border-radius. */
    .ui-listview .ui-li-has-thumb h2,
    .ui-listview .ui-li-has-thumb p {
        //background: #fff;
        //background: rgba(255,255,255,.8);
		background: rgba(131,211,201,.8);
    }
    .ui-listview .ui-li-has-thumb h2 {
        bottom: 35%;
    }
    .ui-listview .ui-li-has-thumb p {
        min-height: 35%;
    }
    /* ui-li-aside has class .ui-li-desc as well so we have to override some things. */
    .carta .ui-listview .ui-li-aside {
		background: rgba(131,211,201,.8);
        padding: .125em .625em;
        width: auto;
        min-height: 0;
        top: 0;
        left: auto;
        bottom: auto;
        font-size: 1.25em;
        /* Custom styling. */
        //background: #cc6600;
        //background: rgba(220,120,19,.85);
        -webkit-border-top-right-radius: inherit;
        border-top-right-radius: inherit;
        -webkit-border-bottom-left-radius: inherit;
        border-bottom-left-radius: inherit;
        -webkit-border-bottom-right-radius: 0;
        border-bottom-right-radius: 0;
		color:  #F3F6FA;
    }
    /* If you want to add shadow, don't kill the focus style. */
    .carta .ui-listview li {
        -moz-box-shadow: 0px 0px 9px #111;
        -webkit-box-shadow: 0px 0px 9px #111;
        box-shadow: 0px 0px 9px #111;
    }
    /* Images mask the hover bg color so we give desktop users feedback by applying the focus style on hover as well. */
    .carta .ui-listview li > .ui-btn:hover {
        -moz-box-shadow: 0px 0px 12px #33ccff;
        -webkit-box-shadow: 0px 0px 12px #33ccff;
        box-shadow: 0px 0px 12px #33ccff;
    }
    /* Animate focus and hover style, and resizing. */
    .carta .ui-listview li,
    .carta .ui-listview .ui-btn {
        -webkit-transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -o-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        transition: all 500ms ease;
    }
    
    
.ui-page-theme-a {	
	background-image: url('../img/fondo.png');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: bottom right; 
}
}

/* First breakpoint is 48em (768px). 3 column layout. Tiles 250x250 pixels incl. margin at the breakpoint. */
@media ( min-width: 48em ) {
    .carta .ui-content {
        padding: .5625em; /* 9px */
    }
    .carta .ui-listview li {
        float: left;
        width: 30.9333%; /* 33.3333% incl. 2 x 1.2% margin */
        height: 14.5em; /* 232p */
        margin: .5625em 1.2%;
    }
    .carta .ui-listview li > .ui-btn {
        -webkit-box-sizing: border-box; /* include padding and border in height so we can set it to 100% */
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        height: 100%;
    }
    .carta .ui-listview li.ui-li-has-thumb .ui-li-thumb {
        height: auto; /* To keep aspect ratio. */
        max-width: 100%;
        max-height: none;
    }
    /* Make all list items and anchors inherit the border-radius from the UL. */
    .carta .ui-listview li,
    .carta .ui-listview li .ui-btn,
    .carta .ui-listview .ui-li-thumb {
        -webkit-border-radius: inherit;
        border-radius: inherit;
    }
    /* Hide the icon */
    .carta .ui-listview .ui-btn-icon-right:after {
        display: none;
    }
    /* Make text wrap. */
    .carta .ui-listview h2,
    .carta .ui-listview p {
        white-space: normal;
        overflow: visible;
        position: absolute;
        left: 0;
        right: 0;
    }
    /* Text position */
    .carta .ui-listview h2 {
        font-size: 1.25em;
        margin: 0;
        padding: .125em 1em;
        bottom: 50%;
    }
    .carta .ui-listview p {
        font-size: 1em;
        margin: 0;
        padding: 0 1.25em;
        min-height: 50%;
        bottom: 0;
    }
    /* Semi transparent background and different position if there is a thumb. The button has overflow hidden so we don't need to set border-radius. */
    .ui-listview .ui-li-has-thumb h2,
    .ui-listview .ui-li-has-thumb p {
  //      background: #ffffff;
  //      background: rgba(255,255,255,.8);
    }
    .ui-listview .ui-li-has-thumb h2 {
        bottom: 35%;
    }
    .ui-listview .ui-li-has-thumb p {
        min-height: 35%;
    }
    /* ui-li-aside has class .ui-li-desc as well so we have to override some things. */
    .carta .ui-listview .ui-li-aside {
        padding: .125em .625em;
        width: auto;
        min-height: 0;
        top: 0;
        left: auto;
        bottom: auto;
        /* Custom styling. */
 //       background: #cc6600;
 //       background: rgba(220,120,19,.85);
        -webkit-border-top-right-radius: inherit;
        border-top-right-radius: inherit;
        -webkit-border-bottom-left-radius: inherit;
        border-bottom-left-radius: inherit;
        -webkit-border-bottom-right-radius: 0;
        border-bottom-right-radius: 0;
    }
    /* If you want to add shadow, don't kill the focus style. */
    .carta .ui-listview li {
        -moz-box-shadow: 0px 0px 9px #111;
        -webkit-box-shadow: 0px 0px 9px #111;
        box-shadow: 0px 0px 9px #111;
    }
    /* Images mask the hover bg color so we give desktop users feedback by applying the focus style on hover as well. */
    .carta .ui-listview li > .ui-btn:hover {
        -moz-box-shadow: 0px 0px 12px #33ccff;
        -webkit-box-shadow: 0px 0px 12px #33ccff;
        box-shadow: 0px 0px 12px #33ccff;
    }
    /* Animate focus and hover style, and resizing. */
    .carta .ui-listview li,
    .carta .ui-listview .ui-btn {
        -webkit-transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -o-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        transition: all 500ms ease;
    }
}
/* Second breakpoint is 63.75em (1020px). 4 column layout. Tiles will be 250x250 pixels incl. margin again at the breakpoint. */
@media ( min-width: 63.75em ) {
    .carta .ui-content {
        padding: .625em; /* 10px */
    }
    /* Set a max-width for the last breakpoint to prevent too much stretching on large screens.
    By setting the max-width equal to the breakpoint width minus padding we keep square tiles. */
    .carta .ui-listview {
        max-width: 62.5em; /* 1000px */
        margin: 0 auto;
    }
    /* Because of the 1000px max-width the width will always be 230px (and margin left/right 10px),
    but we stick to percentage values for demo purposes. */
    .carta .ui-listview li {
        width: 23%;
        height: 230px;
        margin: .625em 1%;
    }
}
// PROBABLEMENT PER BORRAR
/*
.categoria {
    background:#91b68f;   
    border-radius: 9px;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    position:relative;
    width: 94px;
    padding-top: 3px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    font:14px/16px "Trebuchet MS", Arial, Helvetica, sans-serif;
    // text-shadow: 0 1px 0 #000;
    font-style:normal;
    margin-right: 10px;
    margin-top: 3px;
    margin-bottom: 3px;
    margin-left:10px;
    color: #ffffff; 
    text-decoration:none;
    border:0;
    text-align: center;

}
.categoria:hover {
    opacity:0.7;
    outline: 0; 
    text-decoration:underline;
        background-color: #000;
    color: #fff;
}
.categoria a {
    text-decoration: none;
}   
*/
// FI PROBABLEMENT

.detallsExtres {
  position:relative;
}
.detallsExtres .img1 {
    max-width:512px;
    height:auto;
    max-height: 288px;
    width:100%;
}

.detallsExtres .img2 {
    max-width:512px;
    height:auto;
    max-height: 288px;
    width:auto;
}

.detallsExtres .info {

        position:absolute;
   //     width: auto;
   //     min-height: auto;
        top: 0px;
        left: auto;
        bottom: auto;
        right:30px;
   //     font-size: 2em;
}
.detallsExtres .botoBorrar {
        position:absolute;
        min-height: auto;
        top: auto;
        left: auto;
        bottom: 50px;
        right:30px;
  //      font-size: 2em;
}

.detallsExtres .detallTexte {
    display:hidden;
    font-size: 1em;
    margin: 0;
    padding: 0 1.25em;
    //min-height: 50%;
    top:auto;
    position:absolute;
    background-color: rgba(255,255,255,0.75);
    bottom: 0;
}
.logo {
    max-width:240px;
    height:auto;
    max-height: 240px;
    width:100%;
}