body {
  background-image: url('../bk.svg');
  background-size:49px 41px;
  background-repeat: repeat;
  font-family: 'Amatic SC', cursive;
  font-size : 16px;
}
hr { 
	border: 0.125em solid rgb(91,56,22); 
	width: 25%; 
}
form { width: 18.75em; }
button { font-size: 1.25em; }

.nav > li > a { font-size: 1.5em; }
.navbar-default {
    background-color: rgba(238,247,234,0.45);
}
.title { 
	margin-bottom: 0; 
	padding-bottom: 0; 
	font-size: 4.5em; 
}
.subtitle  { 
	margin-top: 0; 
	padding-top: 0; 
	font-size: 1.75em; 
}
.normaltext { 
	margin-top: 0; 
	padding-top: 0; 
	font-size: 1.25em; 
}
.smalltext { font-size: 1em; }

.border { margin: 1.5625em 0 0.625em 0; }
.productname { 
	margin-bottom: 0; 
	padding: 0.0625em 0.5em; 
	font-size: 1.875em; 
	font-weight: 600; 
}
.productprice { 
	display: inline; 
	margin-top: 0; 
	padding-top: 0;
	font-size: 1.375em; 
}
.shopping-bag { margin: -0.625em 0 0 0.625em; }

.header { 
	position: relative; 
	margin-top: 1.25em; 
}
.header h1 { margin-top: 0; }

.modal-dialog { 
	background: url('../bk.svg'); 
	background-size: 49px 41px; 
	background-repeat: repeat; 
}
.modal-content { background-color: transparent; }

.margin-top-3 { margin-top: 0.1875em; }
.margin-top-15 { margin-top: 0.9375em; }
.margin-top-25 { margin-top: 1.5625em; }
.margin-bottom-25 { margin-bottom: 1.5625em; }

@media only screen and (min-width: 320px) {
	.modal-dialog { width: 350px; }
	.modal-body img { width: 250px; height: 220px; }
	.modal-header h1.title { font-size: 2em; }
}

@media only screen and (min-width: 768px) {
	.modal-dialog { width: 350px; }
	.modal-body img { width: 300px; height: 270px; }
	.modal-header h1.title { font-size: 3.25em; }

	.border { margin: 0.9375 0 0.625em 0; }
	.user-login { margin-top: 0.3125em; }
	.title { font-size: 2.5em; }
	.productname { font-size: 1.5625em; }
	.productprice { font-size: 1.0625em; }
	.btn img { width: 120px; height: 100px; }
}