@charset "utf-8";
/* CSS Document */

  
body {
	margin: 0 auto;
	padding: 0;
	font-family: 'Josefin Slab', serif;
	font-style: normal;
	font-size: calc(16px + .5vw);
	color:#000;
	font: 100%/1.5em;
	line-height: 2em;
	background-image: url(../images/beigetile.png);
    background-repeat: round;
	height: 100%;
}

a{
	text-decoration: none;
	color:#369;
}

p {
	text-align:left;
}

.center {
	text-align:center;
}

.left {
	text-align:left;
	padding-left: 8%;
}


.small {
	color: #333;
	font-size : 70%;
	line-height: 1;
	letter-spacing: 2px; 
	text-align:left;
}

.small2 {
	color: #333;;
	font-size : 60%;
	line-height: 1;
	letter-spacing: 2px; 
	text-align:center;
}

h1 {
	color: #96C;
	font-size : 100%; /* 96 / 16 */
	line-height : 1.5;
	letter-spacing: 4px;
	text-transform: uppercase;
	font-stretch:expanded;
	text-align:center;
	padding-bottom:5px;	
}

h2 {
	color: #36c;
	font-size : 85%; /* 96 / 16 */
	line-height : 1.75;
	letter-spacing: 4px;
	text-transform: uppercase; 
	text-align:left;
	padding-bottom:5px;
	padding-left:5%;
}


h5 {
	color: #669;
	font-size : 85%; /* 96 / 16 */
	line-height : 1.1;
	text-transform: uppercase; 
	text-align:center;
	padding-bottom:10px;
	padding-top:10px;
}

img {
	border: 0px none;
	max-width: 100%;
	width: auto\9; /* ie8 */
}

.himg {
	max-width: 100%;
	width: auto\9; /* ie8 */
	position: relative;
	top: -5px; 
}


<!--trans box -->

div.background {
  background: ;
  border: 2px solid black;
}

div.transbox {
  margin: 20px;
  background-color: #fff;
  border: 1px solid black;
  opacity: 0.6;
}

div.transbox p {
  margin: 5%;
  font-weight: bold;
  color: #000000;
}

<!--gallery box -->

div.background2 {
  background: ;
  border: 2px solid black;
}

div.transbox2 {
  margin: 20px;
  background-color: #E2E9DA;
  border: 1px solid #999;
}

div.transbox2 p {
  margin: 5%;
  font-weight: bold;
  color: #000000;
}