@charset "UTF-8";
body{
    font-family: Arial, Helvetica, sans-serif;
    padding: 0;
    margin: 0;
}
nav{
    background: #bbf5f4 /*#FF7E13;*/
}

.navbar-inverse {
	background: #bbf5f4 /*#FF7E13;*/
}

.btn-primary {
    color: #fff;
    background-color: #48759b; /*#FF5900;*/
    border-color: #F4FF14;
}

.btn-primary:hover{
	background: #9e98d5; /*#FF0400;*/
}

.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
  }
nav ul{
    padding: 0;
    margin: 0;
}

nav ul li{
    display: inline-block;
    padding: 0px;
}

nav ul li a{
    display: inline;
    color: white;
    padding: 0px;
    text-decoration: none;
}

.carrito{
    float: right;
}

.carrito-active{
    background: white;
}
.carrito-active a{
    color: black;
}

main{
    margin: 0 auto;
    width: 100%;
}

.articulo{
    display: inline-block;
    padding: 10px;
    vertical-align: top;
    text-align: center;
    width: 176px;
}
.articulo div{
    padding: 5px 0;
}
.articulo .imagen img{
    height: 200px;
}

.articulo .titulo{
    font-weight: bold;
    font-size: 18px;
}
button{
    border: 0;
    border-radius: 5px;
    background: rgb(115, 162, 201);
    cursor: pointer;
    padding: 5px;
}


#carrito-container{
    /*width: 300px;*/
    background: white;
    border: solid 1px #000;
    padding: 1px;
    box-sizing: border-box;
    position: absolute;
    right: 1px;
    margin-top: 10px;
    display: none;
    max-height: 500px;
    overflow-y: auto;
    scrollbar-gutter: stable both-edges;
}


/*Webkit*/
::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}
::-webkit-scrollbar:window-inactive {
  display: none;
}
::-webkit-scrollbar:corner-present  {
 }
::-webkit-scrollbar-track-piece {
  border-radius: 2px;
  background-color: #a4f2f1; /*#369;*/
  background-clip: content-box;
  border-radius: 6px;
  border: solid 4px transparent;
}
::-webkit-scrollbar-track-piece:decrement {
  background: #a4f2f1; /*orange;*/
  background-clip: content-box;
  border: solid 4px transparent;
}
#carrito-container::-webkit-scrollbar-button:vertical:start:decrement {
  background: transparent url(https://elcssar.com/ejemplos/arrow_up.png) no-repeat center center;
}
#carrito-container::-webkit-scrollbar-button:vertical:end:decrement {
  background: transparent url(https://elcssar.com/ejemplos/arrow_up.png) no-repeat center center;
}
#carrito-container::-webkit-scrollbar-button:vertical:end:increment {
  background: transparent url(https://elcssar.com/ejemplos/arrow_down.png) no-repeat center center;
}
#carrito-container::-webkit-scrollbar-button:horizontal:decrement {
  background: transparent url(https://elcssar.com/ejemplos/arrow_left.png) no-repeat center center;
}
::-webkit-scrollbar-button:horizontal:increment {
  background: transparent url(https://elcssar.com/ejemplos/arrow_right.png) no-repeat center center;
}

::-webkit-scrollbar-thumb  {
  height: 10px;
  width: 4px;
  background-color: #09C;
  border-radius: 6px;
  box-shadow: 0 3px 6px -2px rgba(51,0,51,0.5);
}
::-webkit-scrollbar-corner {
  background: transparent ;
}
::-webkit-resizer {
  background: transparent url(https://elcssar.com/ejemplos/expandIcon.png) no-repeat -1px -1px;
}
::-webkit-scrollbar-track-piece:no-button {
  background-color: red;
}

/*----------------*/



#tabla .fila{
    box-sizing: border-box;
    /*padding: 10px 0;*/
}

#tabla .fila .imagen{
    display: inline-block;
    width: 80px;
}
#tabla .fila .info{
    box-sizing: border-box;
    font-size: 0.95em;
    display: inline-block;
    padding-left: 10px;
    vertical-align: top;
    width: 273px;
}

#tabla .fila .info .nombre{
    font-size: 1.2em;
    font-weight: bold;
}

.cantidad{
    font-size: 20px;
    font-weight: bold;
}

#tabla .fila .info .botones{
    padding: 20px 0 0 0;
}

#tabla p{
    font-size: 24px !important;
    text-align: center;
    font-weight: bold;
}

ul.col2{
	PADDING-RIGHT: 0px;
	PADDING-LEFT: 0px;
	FLOAT: left;
	PADDING-BOTTOM: 0px;
	MARGIN: 15px 0px;
	WIDTH: 100%;
	PADDING-TOP: 0px;
	LIST-STYLE-TYPE: none
}

ul.col2 li{
	PADDING-RIGHT: 2px;
	DISPLAY: inline;
	PADDING-LEFT: 2px;
	FLOAT: left;
	PADDING-BOTTOM: 2px;
	WIDTH: 50%;
	PADDING-TOP: 2px
}
.form-control {
	width: 90%;
}