@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather&family=Playfair+Display:wght@400;700&display=swap');

html{
	box-sizing: border-box;
}
*,
*:before,
*:after {
	box-sizing: inherit;
}

.row:before,
.row:after {
	display: table;
	content: " ";
	clear:both;
}

@media only screen and (min-width:320px){

body{
	font-family: 'Roboto', sans-serif;
	text-align:center;
	color:#6c5e4f;
	background-color: #e6dbd1;
	text-decoration: none;
}
h1{
	font-family: 'Playfair Display', serif;
	font-weight: 700;
	color: #6c5e4f;
}
h2{
	font-family: 'Playfair Display', serif;
	color: #6c5e4f;
}
h5{
	font-size: 15pt;
	color: #6c5e4f;
}
h6{
	font-size: 15pt;
	color: #6c5e4f;
	font-weight: 300;
}
p{
	font-size: 12pt;
	color: #6c5e4f;
}

.container {
	margin:0 -20px;
	padding: 20px 0;
	background-color: #e6dbd1;
	width: 100%!important;
	max-width: 1366px!important;
	min-width: 320px!important;
}

.row {
	display: flex;
	flex-wrap: wrap;
}
.content{
	display: flex;
	flex-wrap: wrap;
	margin:-80px 0px;
}
.col-1 {
	max-width: calc(100% / 12);
}
.col-2 {
	max-width: calc(100% / 12 * 2);
}
.col-3 {
	max-width: calc(100% / 12 * 3);
}
.col-4 {
	max-width: calc(100% / 12 * 4);
}
.col-5 {
	max-width: calc(100% / 12 * 5);
}
.col-6 {
	max-width: calc(100% / 12 * 6);
}
.col-8 {
	max-width: calc(100% / 12 * 8);
}
.column {
  	text-align: center;
	flex-grow:1;
	flex-shrink: 1;
	flex-basis: 1;
	margin: 0px;
	padding: 0px;
	color:#98827b;
	background-color: none;
}
.nav {
  	text-align: center;
	flex-grow:1;
	flex-shrink: 1;
	flex-basis: 1;
	margin: 10px 0;
	padding: 0px;
	color:#98827b;
	font-size: 14pt;
	background-color: none;
}
.nav ul{
	display: inline;
}

.nav li{
	display: inline-block;
	padding: 0 14px;
	margin: auto;
}

.nav li a{
	text-decoration: none;
	color:#98827b;
	font-weight: 600;
}

.nav li a.active{
	color: #6c5e4f;
	font-weight: bold;
	text-shadow: 5px 5px 10px rgba(68, 68, 68, 0.4);
}

.nav li a:hover{
	color: #6c5e4f;
	font-weight: bold;
}

.decortop{
	width:100%;
	height: auto;
	display: flex;
	-webkit-justify-content:space-between;
	justify-content: flex-start;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-align-items:stretch;
	align-items: center;
	margin:-20px -20px;
	text-align: center;
	background-color: none;
}
.content {
	max-width: 100%;
	height:auto;
  	text-align: left;
	flex-grow:1;
	flex-shrink: 1;
	flex-basis: 1;
	align-items: center;
	margin: -120px 30px 15px -30px;
	padding: 0px;
	color:#98827b;
	background-color: none;
}
.titles{
	margin-top: -20px;
	margin-bottom: 0px;
	margin-left: 20px;
}
.projectsby{
	font-weight: 300;
}
.louisechang{
	font-weight: 700;
}
.smallnav ul{
	display: inline;
	text-decoration: none;
	color: #94807b;
	margin-left: -40px;
}

.smallnav li{
	display: inline-block;
	padding: 10px 5px;
	margin: auto;
	color: #94807b;
	font-weight: 500;
}
.smallnav li a{
	display: inline-block;
	text-decoration: none;
	color: #94807b;
}
.smallnav li a.active{
	text-decoration: underline;
	color: #6c5e4f;
}
.smallnav li a:hover{
	color: #6c5e4f;
}
.collage{
	width: 100%;
 	height:500px;
  	background-image: url('webdescollage.png');
  	background-repeat: no-repeat;
  	background-size: contain;
	margin-top: 30px;
	margin-left: 5px;
}
/* Masonry on large screens */
@media only screen and (min-width: 1024px) {
  .collage {
    height: 500px;
  }
}

/* Masonry on medium-sized screens */
@media only screen and (max-width: 1024px) and (min-width: 453px) {
  .collage {
    height: 500px;
  }

}

/* Masonry on small screens */
@media only screen and (max-width: 452px) and (min-width: 375px) {
  .collage {
    height: 350px;
  }
}
.columndecorleft {
	max-width: 100%;
	height:auto;
  	text-align: center;
	flex-grow:1;
	flex-shrink: 1;
	flex-basis: 1;
	margin: -100px 30px 0px -30px;
	padding: 0px;
	color:#98827b;
	background-color: none;
}

.columndecorright {
 	width: 100%;
 	height: 250px;
  	background-image: url('decorright.png');
  	background-repeat: no-repeat;
  	background-size: contain;
	
  	text-align: center;
	flex-grow:1;
	flex-shrink: 1;
	flex-basis: 1;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	color:#98827b;
	background-color: none;
}

.footer {
	display: flex;
	flex-wrap: wrap;
	font-size: 9pt;
	color:#98827b;
	margin-top:-115px;
  	text-align: center;
	flex-grow:1;
	flex-shrink: 1;
	flex-basis: 1;
	margin: -30px 0px 0px 0px;
	padding: 0px;
	background-color: none;
	font-family: 'Merriweather', serif;
	align-items: center;
}
.contacts{
	margin-top: 70px;
}
.contacts ul{
	display: inline;
	text-decoration: none;
}

.contacts li{
	display: inline-block;
	padding: 0px 5px 0px 5px;
	margin: auto;
}

.decorbtmright{
	max-width: 100%;
	height:auto;
	margin: 0px 0px -20px 15px;
}
}