body {width:100%; text-align:center; padding:0; margin: 0; font-family: "Varela Round"; user-select: none; min-width: 1020px; margin: 0 auto;}
div {margin: 0; padding: 0}
img {border: 0; padding:0; margin:0;}
a { text-decoration: inherit; color:inherit}
p { padding-bottom: 0; text-indent: 0; text-align:left; }
/*h2 { margin-top:.5em; }*/


#main_head { position:relative; top: 0; width: 100%; z-index: 10; /* background: url("ombre-blush-brow.jpg"); background-size:cover; background-position: 0% 90%; */ /* https://stackoverflow.com/questions/9837573/css3-animation-repeat-transform-effect */ }
#main_body { position:relative; top: 0px; left:5%; width:90%; }
#main_foot { position:relative; clear:both; bottom: 0; width: 100%; z-index: 10; background: white; }

#title {width:100%; font-size:6em; padding: .2em 0; font-family: Montez}
#subtitle { color: #daa3b0; font-size: 1.5em; margin-bottom: .6em; }

#menu {display:table; width:100%; margin: 0 auto; font-size:2em; padding: 0 0; background: #faece9}
#menu div {display:table-cell; margin:0; padding: 2em 1.5em; font-size: .75em }
#menu div:hover { background: black; color: #daa3b0; transition: .3s }

#serviceitems {width:100%; max-width: 800px; margin: 0 auto; font-size:4em; padding: 0 0}
#serviceitems {display:none; }
#serviceitems div {padding:.5em}

#main_image { position: relative; padding: 0; width: 50%; box-sizing: border-box; float: left;}
#main_image img { width: 100% }

#tagline {
 font-family: Montez;
 position: absolute;
 bottom:12%; left:-10%;
 width:100%;
 transform: rotate(-10deg);
 font-size: 4em;
 line-height: .75em;
}

#mission { padding: 2em; background: white; color: black; width: 50%; position: relative; float: right; box-sizing: border-box; padding-bottom: 0; }
#mission h1, #work h1 { font-size: 3em; font-family: Montez; font-weight: 100; margin: 0; }
#mission .outer_links { font-size: 1.25em; padding-bottom: 1.5em; padding:0 14% 1.5em; }
#mission .outer_links a { width: 24%; text-align: center; display: inline-block; }
#mission h2 { line-height: 1.6em; }
#mission p { text-indent: 1em; padding-bottom: .5em; text-align: justify }
#mission i { color: #daa3b0; font-size: 2em; }

#work { padding-bottom: 3em; width: 50%; float: left; }
#work h1 { font-size: 4em; }

#work_slider { position: relative }
#work_slider * { vertical-align: middle; }
#work_slider .nav { width:15%; display: inline-block; text-align:center; }
#work_slider .image { width: 95%; display: inline-block; text-align:center }
#work_slider .image img { max-width: 100%; }
#work_slider .swiper { position: absolute; top: 0; left: 0; width: 100%; height:100%; }
.img_title { font-size: 1.5em; font-weight: bold; padding-bottom: 1em; }
.swiper .left { position:absolute; width: 40%; height: 100%; top: 0; left: 0; }
.swiper .right { position:absolute; width: 60%; height: 100%; top: 0; right: 0; }

#work_video { padding-top:3em; }
#work_video .image { width: 95%; display: inline-block; text-align:center }
#work_video .image img { max-width: 100%; }

#location { padding: 3em 15%; background: black; color: white; }
#location h1 { font-size: 4em; }

#footer { clear: both; padding: 2em; background: #faece9 }