* {
		margin: 0px;
        padding: 0px;
        }
body, html 	{
        text-align: left;
        font-family: Raleway, sans-serif !important;
        font-size: 100%;
        line-height: 1.25em;
        height: 100%;
        color: #444;
        overflow-x: hidden;
        }
    h1 {font-size: 1.7vw;}
    h2 {font-size: 1.53vw;}
    h3 {font-size: 0.8vw;}
    h4 {font-size: 0.94vw;}	
    h5 {font-size: 2vw;}
    h6 {font-size: 2.45vw;}
    p  {font-size: 0.74vw;}
    A:link, A:visited, A:active {text-decoration: none;}
    
    .bold {
     font-weight: 500;
        }
    .color {
        color: #db9f47;
        }
    .font-up {
      font-size: 1.61vw;
        }
    .text-up {
      font-size: 0.6vw;
        }
    .ital {
      font-style: italic;
        }

#container {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        }

/*-- START NAV --*/
#nav {
       position: fixed;
       width: 100%;        
       top: 0;        
       left: 0;        
       min-height: 101px;        
       background-color: #FFF;
       z-index: 100;  
       }
.nav-bar-wrap {
       display: flex;
       align-items: center;
       min-height: 101px;
       }
.nav-bar-name {
       display: flex;
       flex: 1 1 50%;
       justify-content: start;
       padding-left: 16%;
       }
.nav-bar-links {
       display: flex;
       flex: 1 1 50%;
       flex-wrap: wrap;
       justify-content: center;
       gap: 5%;
       list-style: none;
       }

.nav-bar-name h2 {
       line-height: 1.2em;
       font-weight: 100;
       letter-spacing: 0.1em;
       }
   
.nav-bar-links li {
       font-weight: 500;		
       font-size: calc(12px + (13 - 12) * ((100vw - 0px) / (2560 - 0)));
       letter-spacing: 0.1em;		
       }
a:link {color: #111;}
a:visited {color: #111;}
a:active {color: #111;}
a:hover {color: #111;}

.nav-bar-links a:link {color: #111;}
.nav-bar-links a:visited {color: #111;}
.nav-bar-links a:active {color: #111;}
.nav-bar-links a:hover {color: #111; text-decoration: underline; text-decoration-color: #FF0000; text-decoration-thickness: 4px; text-underline-offset: 0.5em;}
/*-- END NAV --*/


/* START TOP SECTION */
#top {
       position: relative;
       z-index: -10;
       width: 100vw;
       height: 100vh;
       background-color: #FFF;
       }

.top-video-background {
       display: flex;
       justify-content: center;
       align-items: center;
       width: 100%;
       height: 100%;
       }
       
.top-video-wrap {
       position: relative;
       width: 75vw;
       height: 83vh;
       overflow: hidden;
       }
.top-video-wrap video {
       z-index: -1;
       position: absolute;
       width: 100%;
       height: 100%;
       min-width: 100%;
       min-height: 100%;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);       
       }

.top-content-wrap {
       display: flex;
       flex-direction: column;
       position: absolute;
       z-index: 10;
       width: 42.5%;
       height: 30%;
       bottom: 0%;
       left: 5%;
       background-color: #fccb06;
       }      
       
.top-copy {
       width: 100%;
       padding-top: 7%;
       }      
.top-copy h5 {
       width: 62%;
       padding-top: 2%;
       padding-left: 22%;
       line-height: 1.1em;
       font-weight: 400;
       font-family: Roboto Serif;
       }
.top-copy p {
       width: 60%;
       padding-top: 4%;
       padding-left: 22%;
       line-height: 1.6em;
       font-weight: 500;
       letter-spacing: 0.02em;
       }
/* END TOP SECTION */


/* START WHAT I DO SECTION */
#what-i-do {
      display: flex;
      width: 100%;
      height: 62vh;
      }

.what-i-do-photo-wrap {
      width: 50%;
      }
.wha-pic {
      width: 85%;
      margin-top: 2.5%;
      margin-left: 10%;
     }

.what-i-do-copy-wrap {
      display: flex;
      flex-direction: column;
      width: 50%;
      padding-top: 5%;
      }

.what-i-do-copy-wrap h2 {
      width: 56%;
      padding-left: 18%;
      padding-bottom: 2%;
      line-height: 1.1em;
      font-weight: 400;
      font-family: Roboto Serif;
      }
.what-i-do-copy-wrap p {
      width: 53%;
      padding-left: 18%;
      padding-bottom: 4%;
      line-height: 1.62em;
      font-weight: 300;
      }
.what-i-do-copy-wrap h4 {
      width: 56%;
      padding-left: 18%;
      line-height: 1.5em;
      font-weight: 500;
      color: #444;
      }
/* END WHAT I DO SECTION */


/* START EXPERIENCE SECTION */
#experience {
      display: flex;
      width: 100%;
      height: 62vh;
      }
  
.experience-photo-wrap {
      width: 50%;
      }
.exp-pic {
      width: 85%;
      margin-top: 2.5%;
      margin-left: 5%;
     }
.experience-copy-wrap {
      display: flex;
      flex-direction: column;
      width: 50%;
      padding-top: 7%;
      }
.experience-copy-wrap h2 {
      width: 50%;
      padding-left: 27%;
      padding-bottom: 2%;
      line-height: 1.1em;
      font-weight: 400;
      font-family: Roboto Serif;
      }
.experience-copy-wrap p {
      width: 50%;
      padding-left: 27%;
      padding-bottom: 5%;
      line-height: 1.62em;
      font-weight: 300;
      }

.experience-copy-wrap h3 {
      width: 18%;
      margin-left: 27%;
      line-height: 2.1em;
      font-size: 0.75vw;;
      font-weight: 500;
      letter-spacing: 0.04em;
      text-align: center;
      color: #FFF;
      background-color: #d5a45c;
      }  
/* END EXPERIENCE SECTION */


/* START PARTNER LOGOS SECTION */
#logos {
      width: 100%;
      padding-bottom: 5%;
      }
.logos-text-box {
      width: 100%;
      padding-top: 2%;
      padding-bottom: 2%;
      }
.logos-text-box h2 {
      width: 90%;
      margin: 0 auto;
      padding-top: 10px;
      line-height: 1.6em;
      font-weight: 300;
      font-family: Roboto Serif;
      text-align: center;
      }
.logos-box {
      display: flex;
      flex: 1 1 90%;
      justify-content: center;
      }	
.img-box {
      width: 11.24%;
      padding: 52px 0 30px 0;
      text-align: center;
      }    
img.center {
      width: 42%;
      margin: 0 auto;
      opacity: 0.6;
      }
/* END PARTNER LOGOS SECTION */


/* START FILMSTRIP SECTION */
#filmstrip {
      width: 100%;
      height: 62vh;
      }

.filmstrip-wrap {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      }
.f-strip {
      width: 90%;
      }
/* END FILMSTRIP SECTION */


/* START RF-QUOTE SECTION */
#rf-quote {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 62vh;
      }
.rf-content-wrap {
      width: 90%;
      padding-top: 5%;
      padding-bottom: 6%;
      background-color: #fccb06;
      }
.rf-copy-wrap {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 38%;
      margin: 0 auto;
      }

.rf-quote-mark {
      width: 6%;
      padding-bottom: 5%;
      }
.rf-copy-wrap h3 {
      width: 80%;
      padding-bottom: 2%;
      line-height: 1.3em;
      font-size: 0.74vw;
      font-weight: 500;
      font-style: italic;
      }
.rf-copy-wrap p {
      width: 80%;
      padding-bottom: 2%;
      line-height: 1.62em;
      font-weight: 300;
      }
/* END RF-QUOTE SECTION */


/* START SOLUTIONS SECTION */
#solutions {
      display: flex;
      width: 100%;
      height: 68vh;
      }
  
.solutions-copy-wrap {
      display: flex;
      flex-direction: column;
      width: 50%;
      padding-top: 7%;
      }

.solutions-photo-wrap {
      width: 50%;
      }
.sol-pic {
      width: 85%;
      margin-top: 2.5%;
      margin-left: 10%;
     }

.solutions-copy-wrap h2 {
      width: 26%;
      padding-left: 18%;
      padding-bottom: 2%;
      line-height: 1.1em;
      font-weight: 400;
      font-family: Roboto Serif;
      }
.solutions-copy-wrap h4 {
      width: 52%;
      padding-left: 18%;
      padding-bottom: 2%;
      line-height: 1.25em;
      font-weight: 400;
      font-family: Roboto Serif;
      }
.solutions-copy-wrap p {
      width: 52%;
      padding-left: 18%;
      padding-bottom: 5%;
      line-height: 1.62em;
      font-weight: 300;
      }
.solutions-copy-wrap h3 {
      width: 18%;
      margin-left: 18%;
      line-height: 2.1em;
      font-size: 0.8vw;
      font-weight: 500;
      letter-spacing: 0.04em;
      text-align: center;
      color: #FFF;
      background-color: #d5a45c;
      }  
/* END SOLUTIONS SECTION */


/* START CONTACT SECTION */
#contact {		
        display: flex;
        width: 100%;
        padding-top: 4%;
        padding-bottom: 4%;
        background-color: #323b3f;
        }
.contact-menu-wrap {
        display: flex;
        width: 38%;
        flex-direction: column;
        align-items: center;
        padding-top: 3.6%;
        }
.contact-copy-wrap {
        display: flex;
        width: 24%;
        flex-direction: column;
        align-items: center;
        }
.contact-links-wrap {
        display: flex;
        width: 38%;
        flex-direction: column;
        align-items: center;
        padding-top: 3.6%;
        }

.contact-menu-wrap p {
		width: 100%;
        line-height: 1.8em;
        font-size: 0.75vw;
        font-weight: 400;
        text-align: center;
        color: #FFF;
        }

.contact-copy-wrap h6 {
		width: 100%;
        line-height: 1.7em;
        font-weight: 100;
        text-align: center;
        letter-spacing: 0.02em;
        color: #FFF;
        }
.contact-copy-wrap h2 {
		width: 100%;
        padding-top: 2%;
        line-height: 1.5em;
        font-size: 0.6vw;
        font-weight: 400;
        letter-spacing: 0.06em;
        text-align: center;
        color: #FFF;
        }
.contact-copy-wrap h3 {
		width: 100%;
        padding-top: 2%;
        line-height: 1.5em;
        font-size: 0.83vw;
        font-weight: 500;
        letter-spacing: 0.06em;
        text-align: center;
        color: #FFF;
        }
.contact-copy-wrap h4 {
		width: 100%;
        padding-top: 16%;
        line-height: 1.7em;
        font-size: 0.5vw;
        font-weight: 400;
        text-align: center;
        color: #FFF;
        }
.contact-copy-wrap p {
		width: 100%;
        line-height: 1.7em;
        font-size: 0.52vw;
        font-weight: 400;
        text-align: center;
        color: #FFF;
        }

.contact-links-wrap p {
		width: 100%;
        line-height: 1.8em;
        font-size: 0.75vw;
        font-weight: 400;
        text-align: center;
        color: #FFF;
        }

.contact-menu-wrap a:link {color: #FFF;}
.contact-menu-wrap a:visited {color: #FFF;}
.contact-menu-wrap a:active {color: #FFF;} 
.contact-menu-wrap a:hover {color: #FFF;}

.contact-links-wrap a:link {color: #FFF;}
.contact-links-wrap a:visited {color: #FFF;}
.contact-links-wrap a:active {color: #FFF;} 
.contact-links-wrap a:hover {color: #FFF;}
/* END CONTACT SECTION */