body {

  background-image: url('clouds.jpg');
	background-repeat: no-repeat;
	background-size: 200% 200%;
	font-family: Arial;
	color: #211a1a;
	font-size: 0.9em;
}

h1 {
    font-size: 18px;
}

h2{
    font-size:16px;
}

h3{
    font-size:14px;
}

@media only screen and (max-width: 400px) {
    h1 {
        font-size: 14px;
    }

    h2{
        font-size:12px;
    }

    h3{
        font-size:11px;
    }
}

#shopping-cart {
	margin: 40px;
}

#shopping-cart table {
	width: 100%;
	background-color: lightblue;
}

#shopping-cart table td {
	background-color: #FFFFFF;
}

#product-grid {
	margin: 40px;
}

.txt-heading {
	color: #211a1a;
	border-bottom: 1px solid #E0E0E0;
	overflow: auto;
  font-size: 14px;
}

#product-grid .txt-heading {
	margin-bottom: 18px;
}

.product-item {
	float: left;
	background: #ffffff;
	margin: 30px 30px 0px 0px;
	height: 200px;
        width: 400px;
	border: #E0E0E0 1px solid;
	box-shadow: 5px 10px 18px #888888;
}

.product-image {
	float: left;
	display: flex;
        flex-wrap: wrap;
        justify-content: center;
	padding-top: 10px;
        height: 155px;
	width: 150px;
	background-color: #FFF;
}

.product-title {
	display: flex;
        flex-wrap: wrap-reverse;
        justify-content: left;
	margin-bottom: 10px;
}

.product-description {
	/*display: flex;
        flex-wrap: wrap-reverse;*/
        justify-content: center;
	margin-bottom: 10px;
  overflow-y: scroll;
}

#btnEmpty {
	background-color: #ffffff;
	border: #d00000 1px solid;
	padding: 5px 10px;
	color: #d00000;
	float: right;
	text-decoration: none;
	border-radius: 3px;
	margin: 10px 0px;
	box-shadow: 5px 10px 18px lightblue;
}

.btnAddAction {
    padding: 5px 10px;
    margin-left: 5px;
    background-color: #efefef;
    border: #E0E0E0 1px solid;
    color: #211a1a;
    float: right;
    text-decoration: none;
    border-radius: 3px;
    cursor: pointer;
}



.clear-float {
	clear: both;
}

.demo-input-box {
	border-radius: 2px;
	border: #CCC 1px solid;
	padding: 2px 1px;
}

.tbl-cart {
	font-size: 0.9em;
}

.tbl-cart th {
	font-weight: normal;
}




.product-price {
	float:left;
}

.cart-action {
	float: right;
}

.product-quantity {
    padding: 5px 10px;
    border-radius: 3px;
    border: #E0E0E0 1px solid;
}

.product-tile-footer {
    padding: 15px 15px 0px 15px;
    overflow: auto;
}

.cart-item-image {
	width: 30px;
    height: 30px;
    border-radius: 50%;
    border: #E0E0E0 1px solid;
    padding: 5px;
    vertical-align: middle;
    margin-right: 15px;
}
.no-records {
	text-align: center;
	clear: both;
	margin: 38px 0px;
}

/* Dropdown Button */
.dropbtn {
  background-color: blue;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: blue;}