* {
  margin: 0;
  padding: 0;
  text-decoration: none;
  font-family: "Open Sans", sans-serif;
  font-weight: 100;
  list-style: none;
  word-wrap: break-word; }

p {
  color: black; }

*:focus {
  outline: none; }

::-webkit-input-placeholder {
  color: black;
  font-size: 16px;
  font-family: "Open Sans", sans-serif; }

a {
  color: black; }

html {
  height: 100%; }

body {
  background-color: white;
  margin: 0 auto;
  width: 1280px; }

img {
  display: block; }

.header .mainTitle {
  padding-top: 48px;
  text-align: center; }
  .header .mainTitle img {
    display: inline;
    width: 72px;
    margin-bottom: -16px;
    padding-right: 12px; }
  .header .mainTitle h1 {
    font-size: 64px; }
    .header .mainTitle h1 span {
      font-weight: 400; }
  .header .mainTitle h2 {
    font-size: 36px;
    border-top: 2px solid black;
    width: 960px;
    margin: 0 auto;
    padding-top: 8px;
    margin-top: 2px; }
.header .mainNav {
  text-align: center;
  padding-top: 36px; }
  .header .mainNav ul {
    display: inline-block; }
    .header .mainNav ul li {
      float: left;
      padding-right: 16px;
      padding-left: 16px;
      border-right: 1px solid black;
      height: 38px; }
      .header .mainNav ul li:last-child {
        border-right: none; }
      .header .mainNav ul li a {
        font-size: 34px; }
        .header .mainNav ul li a:hover {
          border-bottom: 2px solid black; }
        .header .mainNav ul li a.active {
          font-weight: 400; }
          .header .mainNav ul li a.active:hover {
            border-bottom: none; }

.subHeader {
  padding-top: 36px; }
  .subHeader .title h1 {
    font-size: 36px;
    font-weight: 400;
    text-align: center; }
  .subHeader .subNav {
    text-align: center;
    padding-top: 16px;
    border-top: 2px solid black;
    width: 920px;
    margin: 0 auto;
    margin-top: 16px; }
    .subHeader .subNav ul {
      display: inline-block; }
      .subHeader .subNav ul li {
        float: left;
        padding-right: 16px;
        padding-left: 16px;
        border-right: 1px solid black;
        height: 32px; }
        .subHeader .subNav ul li:last-child {
          border-right: none; }
        .subHeader .subNav ul li a {
          font-size: 28px; }
          .subHeader .subNav ul li a:hover {
            border-bottom: 1px solid black; }
          .subHeader .subNav ul li a.active {
            font-weight: 400; }
            .subHeader .subNav ul li a.active:hover {
              border-bottom: none; }

.portfolio {
  margin-bottom: 48px; }
  .portfolio .work {
    width: 1120px;
    margin: 0 auto;
    margin-top: 36px; }
    .portfolio .work .titleBar {
      font-size: 28px;
      padding-bottom: 12px;
      overflow: hidden; }
      .portfolio .work .titleBar h2 {
        font-weight: 400;
        float: left;
        cursor: pointer; }
      .portfolio .work .titleBar p {
        float: right; }
    .portfolio .work .thumbnail {
      border-top: 2px solid black;
      border-bottom: 2px solid black;
      cursor: pointer; }
      .portfolio .work .thumbnail .thumbImg {
        display: block; }
      .portfolio .work .thumbnail .contentImage {
        display: none; }
        .portfolio .work .thumbnail .contentImage p {
          font-size: 28px;
          font-style: italic;
          line-height: 36px;
          border-bottom: 2px solid black;
          text-align: center;
          width: 100px;
          margin: 0 auto;
          margin-bottom: 4px; }
      .portfolio .work .thumbnail.selected .thumbImg {
        display: none; }
      .portfolio .work .thumbnail.selected .contentImage {
        display: block; }
    .portfolio .work .description p {
      font-size: 20px;
      padding: 20px;
      background-color: #eeeeee;
      line-height: 26px; }

.banner img {
  display: block;
  border-top: 2px solid black;
  border-bottom: 2px solid black;
  width: 1120px;
  margin: 0 auto;
  margin-top: 16px; }

.contactDetails {
  padding-top: 36px;
  width: 1120px;
  margin: 0 auto;
  font-size: 20px;
  line-height: 26px; }
  .contactDetails .leftDiv, .contactDetails .rightDiv {
    float: left;
    width: 550px; }
  .contactDetails .leftDiv {
    padding-right: 10px;
    text-align: right; }
    .contactDetails .leftDiv p {
      font-weight: 400; }
  .contactDetails .rightDiv {
    padding-left: 10px;
    text-align: left; }
  .contactDetails .footnote {
    padding-top: 36px;
    clear: both;
    text-align: center;
    width: 900px;
    margin: 0 auto; }

.aboutText {
  width: 1120px;
  margin: 0 auto;
  font-size: 20px;
  line-height: 26px;
  padding-top: 35px;
  margin-bottom: 48px;
  overflow: hidden; }
  .aboutText .leftDiv {
    width: 765px;
    float: left; }
  .aboutText .rightDiv {
    width: 320px;
    float: right; }
    .aboutText .rightDiv span {
      font-weight: 400; }

@media (max-width: 360px) {
  body {
    background-color: white;
    margin: 0 auto;
    width: 320px; }

  .header .mainTitle {
    padding-top: 8px; }
    .header .mainTitle img {
      width: 28px;
      margin-bottom: -6px;
      padding-right: 4px; }
    .header .mainTitle h1 {
      font-size: 26px; }
    .header .mainTitle h2 {
      font-size: 20px;
      width: 320px;
      padding-top: 8px;
      margin-top: 8px; }
  .header .mainNav {
    padding-top: 16px; }
    .header .mainNav ul li {
      padding-right: 8px;
      padding-left: 8px;
      border-right: 1px solid black;
      height: 26px; }
      .header .mainNav ul li a {
        font-size: 24px; }

  .subHeader {
    padding-top: 16px; }
    .subHeader .title h1 {
      font-size: 28px; }
    .subHeader .subNav {
      padding-top: 16px;
      width: 320px;
      margin-top: 8px; }
      .subHeader .subNav ul {
        display: inline-block; }
        .subHeader .subNav ul li {
          float: left;
          padding-right: 8px;
          padding-left: 8px;
          border-right: 1px solid black;
          height: 22px; }
          .subHeader .subNav ul li:nth-child(2) {
            border-right: none;
            clear: right; }
          .subHeader .subNav ul li:nth-child(1) {
            margin-left: 28px; }
          .subHeader .subNav ul li:nth-child(3) {
            margin-left: 16px; }
          .subHeader .subNav ul li a {
            font-size: 18px; }

  .portfolio {
    margin-bottom: 24px; }
    .portfolio .work {
      width: 320px;
      margin-top: 16px; }
      .portfolio .work .titleBar {
        font-size: 18px;
        padding-bottom: 8px; }
        .portfolio .work .titleBar p {
          display: none; }
      .portfolio .work .thumbnail .thumbImg {
        width: 320px; }
      .portfolio .work .thumbnail .contentImage {
        display: none;
        width: 320px; }
        .portfolio .work .thumbnail .contentImage img {
          width: 320px; }
        .portfolio .work .thumbnail .contentImage p {
          font-size: 18px;
          font-style: italic;
          line-height: 26px;
          border-bottom: 2px solid black;
          text-align: center;
          width: 100px;
          margin: 0 auto;
          margin-bottom: 4px; }
      .portfolio .work .thumbnail.selected .thumbImg {
        display: none; }
      .portfolio .work .thumbnail.selected .contentImage {
        display: block; }
      .portfolio .work .description p {
        font-size: 14px;
        padding: 14px;
        background-color: #eeeeee;
        line-height: 18px;
        display: none; }
      .portfolio .work .description.selected p {
        display: block; }

  .banner img {
    width: 320px;
    margin-top: 8px; }

  .contactDetails {
    padding-top: 16px;
    padding-bottom: 16px;
    width: 320px;
    font-size: 18px;
    line-height: 24px; }
    .contactDetails .leftDiv {
      width: 70px; }
    .contactDetails .rightDiv {
      width: 230px; }
    .contactDetails .footnote {
      padding-top: 16px;
      width: 300px; }

  .aboutText {
    width: 320px;
    font-size: 18px;
    line-height: 24px;
    padding-top: 0px;
    margin-bottom: 16px;
    overflow: hidden; }
    .aboutText .leftDiv {
      width: 288px;
      padding: 16px;
      float: left; }
    .aboutText .rightDiv {
      width: 288px;
      padding: 16px;
      float: right; }
      .aboutText .rightDiv span {
        font-weight: 400; } }