/**
 * IDG Styles
 * 
 * Roger Glenn
 * roger@mach1media.com
 * May 2014
 *
 * Compiled using CodeKit 2
 * http://incident57.com/codekit
 */
@import url(/bower_components/normalize-css/normalize.css);
@import url(/bower_components/blueimp-gallery/css/blueimp-gallery.min.css);
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

body {
  margin: 0;
  padding: 0;
  background: #ecebe9 url(/images/hero1-image.jpg) center top no-repeat;
  background-attachment: fixed;
  color: #3a3a38;
  font-family: "Tauri", sans-serif; }

h1, h2, h3 {
  font-weight: normal; }

.container {
  position: relative;
  max-width: 960px !important;
  margin: 0 auto; }

/**
 * MASTHEAD
 */
.masthead {
  height: 1050px;
  text-align: center;
  padding-top: 440px; }
  .masthead h1 {
    color: #5f5d59;
    font-size: 176px;
    text-transform: uppercase;
    letter-spacing: .10em;
    margin: 0; }
  .masthead h2 {
    color: #ada69d;
    font-size: 25px;
    font-weight: normal;
    text-transform: uppercase;
    letter-spacing: .75em;
    margin: -240px 0 0 0; }
  .masthead .scroll-down {
    position: relative;
    display: block;
    width: 116px;
    height: 120px;
    margin: 260px auto 0 auto;
    background: url(/images/hero1-scroll-icon.png) center top no-repeat;
    text-indent: -99999em; }

/**
 * STICKY NAV
 */
nav.sticky {
  height: 77px;
  text-align: center;
  background: #e8e7e5 url(/images/menu-bar-bg1.png) 0 0 repeat-x; }
  nav.sticky.stuck {
    display: block;
    position: fixed;
    z-index: 11;
    top: 0;
    width: 100%;
    height: 42px;
    box-shadow: 0px 0px 20px 10px rgba(0, 0, 0, 0.25); }
  nav.sticky .brand {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    height: 42px;
    width: 58px;
    background: url(/images/menu-idg-logo-on.jpg) center top no-repeat; }
    nav.sticky .brand span {
      position: absolute;
      left: -9999em; }
  nav.sticky .social {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    height: 42px; }
    nav.sticky .social a {
      position: relative;
      display: block;
      height: 42px;
      opacity: 0.7; }
      nav.sticky .social a span {
        position: absolute;
        left: -99999em; }
      nav.sticky .social a:hover {
        opacity: 0.99; }
    nav.sticky .social .facebook {
      width: 22px;
      background: url(/images/menu-fb-on.png) center center no-repeat; }
    nav.sticky .social .houzz {
      width: 32px;
      background: url(/images/menu-houzz-on.png) center center no-repeat; }
    nav.sticky .social .pinterest {
      width: 42px;
      background: url(/images/menu-pintrest-on.png) center center no-repeat; }
  nav.sticky a {
    text-decoration: none;
    color: rgba(94, 92, 89, 0.7);
    font-weight: normal; }
    nav.sticky a:hover {
      color: #5e5c59; }
  nav.sticky ul {
    list-style-type: none;
    display: block;
    width: auto;
    height: 42px;
    margin: 0;
    padding: 0; }
    nav.sticky ul li,
    nav.sticky ul li a {
      display: inline-block;
      height: 42px;
      line-height: 42px; }
    nav.sticky ul li a {
      text-transform: uppercase;
      font-size: 16px;
      padding: 0 10px; }

/**
 * INTRO COMPONENT
 */
.intro {
  background: url(/images/text-bar-bg.jpg) top center;
  text-align: center;
  padding: 50px 0 0 0;
  color: #efeeec;
  -webkit-box-shadow: inset 0px 0px 13px 7px rgba(50, 50, 50, 0.75), 0px 0px 0px 2px white, 0px 0px 0px 8px #b2b2b2;
  -moz-box-shadow: inset 0px 0px 13px 7px rgba(50, 50, 50, 0.75), 0px 0px 0px 2px white, 0px 0px 0px 8px #b2b2b2;
  box-shadow: inset 0px 0px 13px 7px rgba(50, 50, 50, 0.75), 0px 0px 0px 2px white, 0px 0px 0px 8px #b2b2b2;
  color: #ecebe9; }
  .intro .container {
    max-width: 68em;
    margin-left: auto;
    margin-right: auto; }
    .intro .container:after {
      content: "";
      display: table;
      clear: both; }
  .intro .inner {
    display: block; }
    .intro .inner:after {
      content: "";
      display: table;
      clear: both; }
  .intro h1 {
    clear: both;
    font-size: 48px;
    margin-top: 0;
    margin-botom: 0; }
  .intro h2 {
    clear: both;
    font-family: "Oxygen", sans-serif;
    font-size: 31px;
    margin-top: 0;
    margin-botom: 0; }
  .intro p {
    clear: both;
    font-family: "Oxygen", sans-serif;
    font-size: 16px;
    font-weight: 300; }
  .intro .fa-angle-down {
    font-size: 86px; }

/**
 * PROJECTS
 */
#projects {
  background: #ECEBE9; }
  #projects.stuck {
    margin-top: 77px; }
  #projects .container {
    max-width: 68em;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    padding-top: 50px;
    padding-bottom: 30px; }
    #projects .container:after {
      content: "";
      display: table;
      clear: both; }
  #projects article {
    height: 210px;
    margin-bottom: 20px;
    position: relative; }
    #projects article a {
      width: 100%;
      display: block;
      height: 210px;
      font-family: "Oxygen", sans-serif; }
      #projects article a .title-bar {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: auto;
        padding: 5px 5px 5px 40px;
        background: rgba(0, 0, 0, 0.35) url(/images/port-mag-glass.png) 5px 8px no-repeat; }
        #projects article a .title-bar .title {
          position: relative;
          display: block;
          color: #ecebe9;
          font-size: 16px;
          text-transform: uppercase; }
        #projects article a .title-bar .view {
          position: relative;
          display: block;
          color: #ffc44e;
          font-size: 12px;
          text-transform: uppercase; }
    #projects article .gallery-images {
      display: none; }

/**
 * BASELINE: FORMS
 */
form {
  overflow: auto; }

legend {
  padding-bottom: 18px; }

label {
  width: 100%;
  position: relative;
  top: 5px;
  margin-bottom: 18px;
  line-height: 18px;
  display: block; }

input[type="text"],
input[type="password"],
input[type="select"],
input[type="search"] {
  font-family: "Oxygen", sans-serif;
  font-weight: normal;
  padding: 10px;
  background: #3C3938;
  border: 1px solid #3a3a38;
  border-radius: 4px;
  box-shadow: inset 0px 0px 15px 5px rgba(0, 0, 0, 0.5);
  width: 100%;
  margin-bottom: -1px;
  display: block; }

input[type="radio"] {
  top: -1px;
  margin: 0 4px 3px 1px; }

input[type="checkbox"] {
  top: -2px;
  margin: 0 4px 3px 1px; }

input[type="file"] {
  margin: 0px 6px 3px 6px; }

input[type="submit"],
input[type="reset"],
input[type="button"] {
  position: relative;
  top: 5px;
  margin-bottom: 18px; }

select {
  display: block;
  margin: 0px; }

textarea {
  font-family: "Oxygen", sans-serif;
  font-weight: normal;
  padding: 10px;
  background: #3C3938;
  border: 1px solid #3a3a38;
  border-radius: 4px;
  box-shadow: inset 0px 0px 15px 5px rgba(0, 0, 0, 0.5);
  width: 99%;
  line-height: 18px;
  margin-bottom: -2px;
  display: block;
  clear: left;
  overflow: auto; }

.form-row {
  margin-bottom: 1em; }

/**
 * CONTACT
 */
#contact .intro {
  display: block; }
#contact .inner {
  max-width: 68em;
  margin-left: auto;
  margin-right: auto; }
  #contact .inner:after {
    content: "";
    display: table;
    clear: both; }
  #contact .inner .container {
    display: block;
    padding-bottom: 40px;
    /*
    & > div {
    	@include span-columns(6);
    	@include omega(2n);
    	text-align: left;
    }
    */ }
    #contact .inner .container:after {
      content: "";
      display: table;
      clear: both; }
#contact h2 {
  font-family: "Tauri", sans-serif;
  font-size: 48px; }
#contact p {
  font-family: "Oxygen", sans-serif;
  font-size: 31px;
  line-height: 1.2em;
  margin-bottom: .5em; }
#contact .address {
  font-size: 22px; }
#contact a {
  color: #efeeec; }
#contact label {
  display: none; }
#contact #contact-close {
  display: none;
  position: absolute;
  width: 128px;
  height: 40px;
  bottom: 0;
  left: 50%;
  margin-left: -64px;
  background: url(/images/contact-close-tab.png) 0 0 no-repeat; }
  #contact #contact-close span {
    position: absolute;
    left: -9999em; }
#contact .directions {
  position: relative;
  display: inline-block;
  width: 137px;
  height: 39px;
  background: url(/images/contact-dir-btn.png) 0 0 no-repeat; }
  #contact .directions span {
    position: absolute;
    left: -99999em; }
#contact .pure-button {
  background: url(/images/contact-send-btn.png) 0 0 no-repeat;
  width: 100px;
  height: 39px;
  background-color: transparent;
  border-radius: 0; }
#contact #contactbutton {
  float: left; }
#contact #contactform_response {
  float: left;
  margin-left: 20px;
  line-height: 39px; }

/**
 * ABOUT
 */
#about {
  background: #ECEBE9; }
  #about .container {
    max-width: 68em;
    margin-left: auto;
    margin-right: auto;
    max-width: 960px;
    clear: both;
    padding-top: 50px;
    padding-bottom: 30px; }
    #about .container:after {
      content: "";
      display: table;
      clear: both; }
  #about article {
    display: block;
    margin-bottom: 2em;
    /*
    & > div {
    	@include span-columns(6);
    }
    .description {
    	@include omega;
    }
    &:nth-of-type(2n+1) {
    	.description {
    		float: left;
    	}
    	.image {
    		float: right;
    		@include omega;
    		& > img {
    			float: left;
    		}
    	}
    }
    */ }
    #about article:after {
      content: "";
      display: table;
      clear: both; }
    #about article h1 {
      margin-top: 0;
      margin-bottom: .25em;
      font-family: "Tauri", sans-serif;
      font-size: 65px;
      line-height: 1em;
      text-transform: uppercase; }
    #about article p {
      font-family: "Oxygen", sans-serif;
      font-size: 18px;
      line-height: 1.2em; }
    #about article .lead {
      font-size: 27px;
      font-weight: 300; }
    #about article .image img {
      float: right;
      max-width: 100%;
      height: auto; }

/**
 * DESIGN CENTER
 */
#design-center {
  background: url(/images/text-bar-bg.jpg) top center;
  text-align: center;
  padding: 50px 0 0 0;
  color: #efeeec;
  -webkit-box-shadow: inset 0px 0px 13px 7px rgba(50, 50, 50, 0.75), 0px 0px 0px 2px white, 0px 0px 0px 8px #b2b2b2;
  -moz-box-shadow: inset 0px 0px 13px 7px rgba(50, 50, 50, 0.75), 0px 0px 0px 2px white, 0px 0px 0px 8px #b2b2b2;
  box-shadow: inset 0px 0px 13px 7px rgba(50, 50, 50, 0.75), 0px 0px 0px 2px white, 0px 0px 0px 8px #b2b2b2;
  font-family: "Oxygen", sans-serif; }
  #design-center .inner {
    height: 479px;
    margin-top: 50px;
    background: url(/images/dc-background.jpg) top center no-repeat; }
  #design-center .container {
    padding-top: 140px; }
  #design-center h2 {
    font-family: "Tauri", sans-serif;
    font-size: 48px;
    line-height: 1.2em;
    margin-top: 0;
    margin-bottom: 0; }
  #design-center h3 {
    font-size: 31px;
    margin-top: 0;
    margin-bottom: 3em; }
  #design-center p {
    font-size: 16px; }
  #design-center .button {
    position: relative;
    display: block;
    margin: 0 auto;
    width: 183px;
    height: 60px;
    background: url(/images/dc-image-btn.png) 0 0 no-repeat;
    text-indent: -9999em; }

/**
 * FOOTER
 */
footer {
  margin-top: 8px;
  padding-top: 400px;
  padding-bottom: 40px;
  text-align: center;
  color: #5d5a56;
  font-family: "Oxygen", sans-serif;
  font-size: 14px;
  border-bottom: 2px solid #fff;
  background: url(/images/footer-background.jpg) top center no-repeat;
  background-size: cover; }
  footer a {
    color: #5d5a56; }
  footer p {
    margin: 0; }
  footer .heading {
    font-size: 20px;
    line-height: 1.2em;
    margin-bottom: 5px; }
  footer .facebook {
    width: 36px;
    height: 42px;
    background: url(/images/footer-fb-on.png) center center no-repeat;
    opacity: 0.7; }
  footer .houzz {
    width: 37px;
    height: 42px;
    background: url(/images/footer-houzz1-on.png) center center no-repeat;
    opacity: 0.7; }
  footer .social a {
    margin: 0 10px;
    position: relative;
    display: inline-block; }
    footer .social a span {
      position: absolute;
      text-indent: -9999em; }
    footer .social a:hover {
      opacity: 0.99; }

/**
 * BOTTOM
 */
.bottom {
  padding: 10px 0;
  border-top: 8px solid #b2b2b2;
  text-align: center;
  color: #a8a8a8;
  font-family: "Oxygen", sans-serif;
  font-size: 12px; }

@media all and (min-width: 960px) {
  #projects article {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 31.76157%; }
    #projects article:last-child {
      margin-right: 0; }
    #projects article:nth-child(3n) {
      margin-right: 0; }
    #projects article:nth-child(3n+1) {
      clear: left; }

  #about article > div {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 48.82117%; }
    #about article > div:last-child {
      margin-right: 0; }
  #about article .description {
    margin-right: 0; }
  #about article:nth-of-type(2n+1) .description {
    float: left; }
  #about article:nth-of-type(2n+1) .image {
    float: right;
    margin-right: 0; }
    #about article:nth-of-type(2n+1) .image > img {
      float: left; }

  #contact .inner .container > div {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 48.82117%;
    text-align: left; }
    #contact .inner .container > div:last-child {
      margin-right: 0; }
    #contact .inner .container > div:nth-child(2n) {
      margin-right: 0; }
    #contact .inner .container > div:nth-child(2n+1) {
      clear: left; } }
@media all and (max-width: 960px) {
  body {
    background-position-y: -500px; }

  nav.sticky {
    display: block;
    position: fixed;
    text-align: right;
    z-index: 11;
    top: 0;
    width: 100%;
    height: 42px;
    box-shadow: 0px 0px 20px 10px rgba(0, 0, 0, 0.25); }
    nav.sticky .social {
      display: none; }

  .masthead {
    height: auto;
    padding-top: 60px;
    padding-bottom: 40px; }
    .masthead h1 {
      font-size: 54px; }
    .masthead h2 {
      font-size: 18px;
      letter-spacing: .25em;
      margin: 0; }
    .masthead .scroll-down {
      margin: 20px auto 0 auto; }

  .intro {
    padding: 40px 0 0 0; }
    .intro h1 {
      font-size: 24px; }
    .intro h2 {
      font-size: 15px; }
    .intro p {
      font-size: 12px; }
    .intro .fa-angle-down {
      font-size: 43px; }

  #projects .container, #about .container {
    padding: 0 20px; }
  #projects > .container, #about > .container {
    padding-top: 30px; }

  #about article h1 {
    font-size: 48px; }
  #about article .lead {
    font-size: 27px; }
  #about article .image {
    width: 50%;
    float: right;
    padding: 0 0 20px 20px; }
    #about article .image img {
      max-width: 100%;
      height: auto; }
  #about article:nth-of-type(2n+1) .image {
    float: left;
    padding: 0 20px 20px 0; }

  #design-center {
    padding-top: 0; }
    #design-center .inner {
      height: auto;
      margin-top: 0; }
    #design-center .container {
      padding-top: 60px;
      padding-bottom: 30px; }
    #design-center h2 {
      font-size: 36px; }
    #design-center h3 {
      font-size: 18px;
      margin-bottom: 1em; }
    #design-center p {
      font-size: 14px; }

  footer {
    padding-top: 40px; }

  #contact .inner .container {
    padding: 0 20px; }
    #contact .inner .container > div {
      float: left;
      display: block;
      margin-right: 2.35765%;
      width: 100%;
      margin-right: 0;
      text-align: center; }
      #contact .inner .container > div:last-child {
        margin-right: 0; }
  #contact h2 {
    font-size: 36px; }
  #contact p {
    font-size: 24px; }
  #contact .address {
    font-size: 18px; } }
@media all and (max-width: 960px) {
  #projects article {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 48.82117%; }
    #projects article:last-child {
      margin-right: 0; }
    #projects article:nth-child(2n) {
      margin-right: 0; }
    #projects article:nth-child(2n+1) {
      clear: left; } }
@media all and (max-width: 700px) {
  #projects article {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%;
    margin-right: 0; }
    #projects article:last-child {
      margin-right: 0; }

  #contact .description,
  #contact .form {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%;
    margin-right: 0; }
    #contact .description:last-child,
    #contact .form:last-child {
      margin-right: 0; } }
@media all and (max-width: 500px) {
  nav.sticky ul li a {
    font-size: 11px;
    padding: 0 2px; }

  #about article h1 {
    margin-top: 20px; }
  #about article p {
    font-size: 16px; }
  #about article .lead {
    font-size: 18px; }
  #about article .image,
  #about article .description {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%;
    margin-right: 0; }
    #about article .image:last-child,
    #about article .description:last-child {
      margin-right: 0; }
  #about article .image {
    padding: 0; }
  #about article:nth-of-type(2n+1) .image {
    padding: 0; } }