* {
  font-family: CaviarDreams,helvetica,sans-serif,arial;
  font-weight: 400;
  font-size: 1.1em;
  color: white;
  margin: 0px;
  padding: 0px; }

@font-face {
  font-family: CaviarDreams;
  src: url("font/CaviarDreams.ttf"); }
@font-face {
  font-family: CaviarDreams-Bold;
  src: url("font/CaviarDreams_Bold.ttf"); }
@font-face {
  font-family: Opensans;
  src: url("font/OpenSans-Regular.ttf"); }
.button {
  background-color: #1E1E20;
  color: #D9CB9E;
  padding: 10px;
  font-family: CaviarDreams-Bold;
  font-size: 0.55em;
  line-height: 25px; }

p, span {
  color: #D9CB9E; }

a {
  text-decoration: none; }

body {
  background-color: #1E1E20;
  padding-bottom: 70px; }
  body #banner {
    height: 300px;
    overflow: hidden; }
    body #banner img {
      width: 100%;
      opacity: 0.5; }
    body #banner #scrollingBanners {
      position: relative;
      overflow: hidden;
      height: 300px; }
      body #banner #scrollingBanners #shownBanner {
        opacity: 1; }
      body #banner #scrollingBanners .headerBanner {
        opacity: 0;
        transition: 0.5s;
        height: 100%;
        position: absolute;
        top: 0px;
        width: 100%;
        background-position: center;
        background-size: cover; }
      body #banner #scrollingBanners .banner1 {
        background-image: url("img/banners/banner1.jpg"); }
      body #banner #scrollingBanners .banner2 {
        background-image: url("img/banners/banner2.jpg"); }
      body #banner #scrollingBanners .banner3 {
        background-image: url("img/banners/banner3.jpg"); }
      body #banner #scrollingBanners .banner4 {
        background-image: url("img/banners/banner4.JPG"); }
      body #banner #scrollingBanners .banner5 {
        background-image: url("img/banners/banner5.JPG"); }
      body #banner #scrollingBanners .banner6 {
        background-image: url("img/banners/banner6.JPG"); }
      body #banner #scrollingBanners .banner7 {
        background-image: url("img/banners/banner7.JPG"); }
      body #banner #scrollingBanners .banner8 {
        background-image: url("img/banners/banner8.JPG"); }
      body #banner #scrollingBanners .banner9 {
        background-image: url("img/banners/banner9.JPG"); }
      body #banner #scrollingBanners .banner10 {
        background-image: url("img/banners/banner10.JPG"); }
      body #banner #scrollingBanners .banner11 {
        background-image: url("img/banners/banner11.JPG"); }
      body #banner #scrollingBanners .banner12 {
        background-image: url("img/banners/banner12.JPG"); }
      body #banner #scrollingBanners .banner13 {
        background-image: url("img/banners/banner13.JPG"); }
      body #banner #scrollingBanners .banner14 {
        background-image: url("img/banners/banner14.JPG"); }
      body #banner #scrollingBanners .banner15 {
        background-image: url("img/banners/banner15.JPG"); }
      body #banner #scrollingBanners .banner16 {
        background-image: url("img/banners/banner16.JPG"); }
      body #banner #scrollingBanners .banner17 {
        background-image: url("img/banners/banner17.JPG"); }
      body #banner #scrollingBanners .banner18 {
        background-image: url("img/banners/banner18.JPG"); }
      body #banner #scrollingBanners .banner19 {
        background-image: url("img/banners/banner19.JPG"); }
      body #banner #scrollingBanners .banner21 {
        background-image: url("img/banners/banner21.JPG"); }
      body #banner #scrollingBanners .banner22 {
        background-image: url("img/banners/banner22.JPG"); }
      body #banner #scrollingBanners .banner23 {
        background-image: url("img/banners/banner23.JPG"); }
  body header {
    position: relative; }
    body header #logo {
      padding-top: 5px;
      padding-left: 50px;
      cursor: default; }
    body header #logo, body header nav {
      display: inline-block; }
    body header h1 {
      font-size: 2.9em;
      color: #D9CB9E;
      background-color: #1E1E20; }
    body header #bold {
      font-family: CaviarDreams-Bold;
      color: #DC3522;
      height: 40px;
      width: 170px;
      text-align: center;
      font-size: 2em;
      line-height: 50px; }
    body header nav {
      float: right;
      display: flex;
      flex-wrap: nowrap;
      padding-top: 5px;
      padding-right: 12.5%; }
      body header nav .button {
        display: inline-block;
        cursor: pointer; }
        body header nav .button:hover {
          color: #DC3522; }
      body header nav #selected {
        color: #DC3522; }
    body header:after {
      content: '';
      width: 100%;
      height: 45px;
      background-color: #2A2C2B;
      left: 0px;
      top: 5px;
      position: absolute;
      z-index: -1; }
  body .pageBind {
    width: 75%;
    display: block;
    margin: 0px auto;
    margin-top: 50px; }
  body #homePage {
    margin-top: 0px;
    text-align: center; }
    body #homePage img {
      width: 100%; }
    body #homePage h2 {
      font-size: 1.4em;
      margin-bottom: 50px;
      color: #dc3522;
      text-align: center;
      font-weight: 800;
      cursor: default; }
    body #homePage p {
      font-size: 0.6em;
      font-family: Opensans;
      text-align: center;
      padding-bottom: 40px; }
    body #homePage #videoContainer {
      overflow: hidden;
      width: 100%;
      height: 600px; }
      body #homePage #videoContainer iframe {
        height: 100%;
        width: 100%;
        z-index: 20; }
  body #aboutPage .aboutMeBox {
    background-color: #2A2C2B;
    padding: 20px;
    text-align: justify;
    padding: 30px;
    padding-left: 50px;
    padding-right: 50px; }
    body #aboutPage .aboutMeBox h1 {
      font-weight: 800;
      color: #DC3522;
      font-size: 2em;
      margin-bottom: 30px; }
    body #aboutPage .aboutMeBox p {
      margin-bottom: 15px;
      font-family: 'Opensans';
      font-size: 0.8em;
      text-align: justify; }
    body #aboutPage .aboutMeBox img {
      width: 45%;
      margin: 0px auto;
      display: block;
      padding-bottom: 20px; }
  body #portfolioPage {
    width: 100%;
    justify-content: center;
    text-align: center;
    font-size: 0.8em; }
    body #portfolioPage #grid {
      display: flex;
      flex-wrap: wrap;
      width: 100%;
      justify-content: center;
      text-align: center;
      transition: 0.5s;
      opacity: 1; }
      body #portfolioPage #grid .vidBox {
        width: 33.333%;
        overflow: hidden;
        position: relative;
        cursor: pointer; }
        body #portfolioPage #grid .vidBox img {
          width: 100%;
          transition: 0.3s;
          transform: scale(1.1); }
        body #portfolioPage #grid .vidBox span {
          opacity: 0;
          position: absolute;
          bottom: 30px;
          left: 20px;
          transition: 0.3s;
          font-size: 2em;
          font-weight: 800; }
        body #portfolioPage #grid .vidBox:hover img {
          transform: scale(1.3);
          opacity: 0.4; }
        body #portfolioPage #grid .vidBox:hover span {
          opacity: 1; }
    body #portfolioPage #focusBox {
      background-color: #2a2c2b;
      margin-left: 5%;
      margin-right: 5%;
      height: 500px;
      position: relative;
      display: none; }
      body #portfolioPage #focusBox #focusVid {
        display: inline-block;
        width: 70%;
        height: 100%;
        float: left; }
        body #portfolioPage #focusBox #focusVid .vid, body #portfolioPage #focusBox #focusVid iframe {
          width: 100%;
          height: 100%; }
      body #portfolioPage #focusBox #focusTxt {
        display: inline-block;
        width: 25%;
        vertical-align: top;
        text-align: left;
        margin: 10px;
        margin-top: 25px; }
        body #portfolioPage #focusBox #focusTxt span {
          margin-bottom: 30px;
          display: block;
          font-size: 1.4em; }
      body #portfolioPage #focusBox #backBtn {
        position: absolute;
        top: -50px;
        right: 0px;
        width: 100px;
        height: 35px;
        background-color: rgba(30, 30, 32, 0);
        border: 4px solid #2a2c2b;
        color: #d9cb9e;
        cursor: pointer; }
  body #contactPage #services {
    padding-bottom: 35px; }
  body #contactPage #contactInfo {
    display: inline-block;
    font-size: 0.8em; }
    body #contactPage #contactInfo > div {
      margin-bottom: 20px; }
    body #contactPage #contactInfo img {
      width: 30px;
      margin: -6px;
      margin-right: 15px;
      margin-left: 5px; }
    body #contactPage #contactInfo span {
      font-family: Opensans; }
  body #contactPage #contactMore {
    display: flex;
    margin-top: 15px;
    position: relative; }
    body #contactPage #contactMore > div {
      margin-right: 20px; }
    body #contactPage #contactMore > div:last-child {
      flex-grow: 2; }
    body #contactPage #contactMore input, body #contactPage #contactMore textarea {
      height: 45px;
      min-width: 350px;
      padding-left: 8px;
      font-family: Opensans;
      color: #D9CB9E;
      font-size: 16px;
      margin-top: 20px;
      display: block;
      border: 0px;
      background-color: #2a2c2b; }
    body #contactPage #contactMore #contactName, body #contactPage #contactMore #contactPhone, body #contactPage #contactMore #contactEmail {
      width: 100%;
      min-width: 350px; }
    body #contactPage #contactMore #contactDetail {
      resize: none;
      width: 100%;
      margin-top: 20px;
      height: 165px;
      padding-left: 8px;
      padding-top: 10px; }
    body #contactPage #contactMore #nameError, body #contactPage #contactMore #emailError, body #contactPage #contactMore #phoneError, body #contactPage #contactMore #detailError {
      position: absolute;
      font-size: 0.7em;
      bottom: -50px;
      right: 30px;
      background-color: #1e1e20; }
    body #contactPage #contactMore textarea::-webkit-input-placeholder, body #contactPage #contactMore input::-webkit-input-placeholder {
      color: #D9CB9E !important; }
    body #contactPage #contactMore textarea::-webkit-input-placeholder, body #contactPage #contactMore input::-webkit-input-placeholder {
      /* Firefox 18- */
      color: #D9CB9E !important; }
    body #contactPage #contactMore textarea::-webkit-input-placeholder, body #contactPage #contactMore input::-webkit-input-placeholder {
      /* Firefox 19+ */
      color: #D9CB9E !important; }
    body #contactPage #contactMore textarea::-webkit-input-placeholder, body #contactPage #contactMore input::-webkit-input-placeholder {
      color: #D9CB9E !important; }
  body #contactPage #contactUsBtn {
    width: 220px;
    height: 40px;
    font-size: 16px;
    margin-top: 20px;
    border: 0px;
    background-color: #dc3522;
    font-family: Opensans;
    color: #d9cb9e; }
  body footer {
    position: fixed;
    bottom: 0px;
    width: 100%;
    height: 40px;
    background-color: #2A2C2B; }
    body footer #footerContactInfo {
      width: 40%;
      margin-left: 40px;
      margin-top: 5px; }
      body footer #footerContactInfo span {
        font-size: 0.8em;
        padding-right: 30px; }
        body footer #footerContactInfo span img {
          width: 15px;
          padding-right: 10px; }
    body footer #externalLinks {
      position: absolute;
      right: 40px;
      top: 0px; }
      body footer #externalLinks .circleLink {
        width: 28px;
        height: 28px;
        border-radius: 100%;
        margin: 3px;
        border: 2px solid #d9cb9e;
        display: inline-block; }
        body footer #externalLinks .circleLink img {
          width: 60%;
          margin: 5px; }

/* PC AND UP */
/* TABLET + SMALL SCREEN */
@media screen and (max-width: 65em) and (min-width: 40em) {
  body #banner {
    height: 250px; }
  body .pageBind {
    margin-top: 10px;
    width: 85%; }
  body #homePage #videoContainer {
    height: 100%; }
    body #homePage #videoContainer iframe {
      height: 315px; }
  body #portfolioPage #grid .vidBox {
    width: 50%; }
    body #portfolioPage #grid .vidBox img {
      opacity: 0.5; }
    body #portfolioPage #grid .vidBox span {
      opacity: 1;
      font-size: 1.2em; }
  body #portfolioPage #focusBox #focusVid {
    width: 100%;
    float: none; }
  body #portfolioPage #focusBox #focusTxt {
    display: block;
    text-align: center;
    width: 100%; }
    body #portfolioPage #focusBox #focusTxt span {
      margin-bottom: 60px; }
  body #contactPage #contactMore {
    display: block; }
    body #contactPage #contactMore #nameError, body #contactPage #contactMore #emailError, body #contactPage #contactMore #phoneError, body #contactPage #contactMore #detailError {
      position: absolute;
      font-size: 0.7em;
      bottom: -55px;
      width: 40%;
      right: 30px;
      background-color: #1e1e20; } }
/* MOBILE STYLES */
@media screen and (max-width: 40em) {
  body {
    padding-bottom: 80px; }
    body header #logo {
      text-align: center;
      display: block;
      padding-left: 0px; }
    body header #bold {
      margin: 0px auto; }
    body header nav {
      justify-content: center;
      padding-right: unset;
      float: none; }
      body header nav .button {
        padding: 5px; }
    body #banner {
      height: 250px; }
    body .pageBind {
      margin-top: 10px;
      width: 85%; }
    body #homePage #videoContainer {
      height: 100%; }
      body #homePage #videoContainer iframe {
        height: 315px; }
    body #aboutPage {
      width: 100%; }
      body #aboutPage .aboutMeBox {
        padding-left: 25px;
        padding-right: 25px; }
        body #aboutPage .aboutMeBox h1 {
          font-size: 1.5em; }
        body #aboutPage .aboutMeBox p {
          font-size: 0.7em; }
    body #portfolioPage #grid .vidBox {
      width: 100%; }
      body #portfolioPage #grid .vidBox img {
        opacity: 0.5; }
      body #portfolioPage #grid .vidBox span {
        opacity: 1;
        font-size: 1.2em; }
    body #portfolioPage #focusBox {
      margin-top: 50px; }
      body #portfolioPage #focusBox #focusVid {
        width: 100%;
        float: none;
        height: 315px; }
      body #portfolioPage #focusBox #focusTxt {
        display: block;
        text-align: center;
        width: 100%;
        margin-left: 0px; }
        body #portfolioPage #focusBox #focusTxt span {
          margin-bottom: 60px;
          font-size: 1em; }
    body #contactPage #contactMore {
      display: block; }
    body #contactPage #contactInfo span {
      font-size: 0.9em; }
    body #contactPage #contactMore #contactName, body #contactPage #contactMore #contactPhone, body #contactPage #contactMore #contactEmail, body #contactPage #contactMore textarea {
      min-width: unset;
      width: 100%; }
    body #contactPage #contactMore #nameError, body #contactPage #contactMore #emailError, body #contactPage #contactMore #phoneError, body #contactPage #contactMore #detailError {
      position: static;
      font-size: 0.65em;
      padding-top: 5px; }
    body footer {
      height: 70px; }
      body footer #externalLinks {
        right: 0px;
        left: 0px;
        margin: 0px auto;
        display: block;
        width: 140px;
        position: static; }
      body footer #footerContactInfo {
        text-align: center;
        margin: 0px auto;
        width: 100%; }
        body footer #footerContactInfo span {
          padding-right: 0px; } }

/*# sourceMappingURL=css.css.map */