/* Website Design by Jennifer L Holt | www.jenniferleigh.ca */
/* http://meyerweb.com/eric/tools/css/reset/  v2.0b1 */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section { display: block; }

body { line-height: 1; scroll-behavior: smooth; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

:focus { outline: none; }

ins { text-decoration: none; }

del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }

/*--450px--*/
/*--864px--*/
/*--1026px--*/
/*--1350pxpx--*/
.column-group:after, .column-group-slim:after { display: block; clear: both; content: ''; }

@font-face { font-family: 'champagne__limousinesregular'; src: url("/assets/fonts/champagne__limousines-webfont.eot"); src: url("/assets/fonts/champagne__limousines-webfont.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/champagne__limousines-webfont.woff2") format("woff2"), url("/assets/fonts/champagne__limousines-webfont.woff") format("woff"), url("/assets/fonts/champagne__limousines-webfont.ttf") format("truetype"), url("/assets/fonts/champagne__limousines-webfont.svg#champagne__limousinesregular") format("svg"); font-weight: normal; font-style: normal; }
body { font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 18px; -webkit-text-size-adjust: 100%; }

@media screen and (max-width: 75em) { body { font-size: 0.889em; } }
@media screen and (max-width: 38em) { body { font-size: 0.778em; } }
/*------------------------------------------------
	TYPE
------------------------------------------------*/
h1 { font-family: "champagne__limousinesregular", "Roboto", Arial, Helvetica, sans-serif; font-size: 3.000em; color: #70757f; text-transform: uppercase; margin-bottom: 1em; }

h1 + h2 { margin: -2.5em 0 3em; font-size: 1em; text-transform: uppercase; font-weight: 500; color: #304f6d; }

h2 { font-weight: 300; color: #70757f; font-size: 1.500em; margin-bottom: 1em; font-family: "champagne__limousinesregular", "Roboto", Arial, Helvetica, sans-serif; }

h3 { font-weight: 500; color: #304f6d; font-size: 1.400em; margin-bottom: .5em; }

h4 { font-weight: 500; margin: 2em 0 .25em; text-transform: uppercase; color: #70757f; }

p { font-weight: 300; color: #000; line-height: 1.5em; margin-bottom: 1.5em; }

p:last-child { margin-bottom: 0; }

strong { font-weight: 400; }

strong.label { text-transform: uppercase; font-size: .7em; }

blockquote p.quote { line-height: 1.5em; font-size: 1.1em; margin-bottom: .5em; color: #70757f; }

blockquote p.credit { font-weight: 500; margin-top: 0; }

blockquote + blockquote { margin-top: 3em; }

main a { color: #304f6d; }
main a:hover { color: #d8d7db; }

footer a { color: #d8d7db; }
footer p { color: #fff; font-size: 0.66em; }
footer h6 { font-family: "champagne__limousinesregular", "Roboto", Arial, Helvetica, sans-serif; color: #70757f; text-transform: uppercase; margin-bottom: 3px; font-size: 1.100em; font-weight: bold; letter-spacing: 0.050em; }
footer .links { text-align: right; }
footer nav ul li { display: inline-block; margin-left: 10px; text-align: right; }
footer nav ul li a { color: #70757f; text-decoration: none; font-size: 0.667em; font-weight: 500; }
@media all and (max-width: 75em) { footer nav ul li a { font-size: 1em; } }

.column-group:after, .column-group-slim:after { display: block; clear: both; content: ''; }

.column-group { margin-left: -3% !important; margin-right: -3% !important; display: flex; flex-wrap: wrap; }

.column-group-slim { margin: -0.125%; display: flex; flex-wrap: wrap; }
.column-group-slim [class^="col-"] { margin: 0.25%; }

[class^="col-"] { margin-left: 3%; margin-right: 3%; position: relative; }

@media all and (max-width: 38em) { [class^="col-"] { width: 100% !important; margin: 0; }
  .column-group, .column-group-slim { margin-left: 0 !important; margin-right: 0 !important; } }
.col-one_fourth, .portfolio-item, section .portfolio-item { width: 19%; }

.col-three_fourth { width: 69%; }

.col-one_fifth { width: 14%; }

.col-two_fifth { width: 34%; }

.col-three_fifth { width: 54%; }

.col-four_fifth { width: 74%; }

.col-one_sixth { width: 10.6666666667%; }

.col-five_sixth { width: 77%; }

.col-three_sixth, .col-one_half, .col-.two_fourth { width: 44%; }

.col-one_third, .col-two_sixth { width: 27.3333%; }

.col-two_third, .col-four_sixth { width: 60.67%; }

.column-group-slim .col-one_fourth, .column-group-slim .portfolio-item, .column-group-slim .portfolio-item { width: 24.5%; }
.column-group-slim .col-three_fourth { width: 74.5%; }
.column-group-slim .col-one_fifth { width: 19.5%; }
.column-group-slim .col-two_fifth { width: 39.5%; }
.column-group-slim .col-three_fifth { width: 59.5%; }
.column-group-slim .col-four_fifth { width: 79.5%; }
.column-group-slim .col-one_sixth { width: 16.1666666667%; }
.column-group-slim .col-five_sixth { width: 82.5%; }
.column-group-slim .col-three_sixth, .column-group-slim .col-one_half, .column-group-slim .col-two_fourth { width: 49.5%; }
.column-group-slim .col-one_third, .column-group-slim .col-two_sixth { width: 32.8333%; }
.column-group-slim .col-two_third, .column-group-slim .col-four_sixth { width: 66.17%; }

.page-wrap { width: 90%; margin: 0 auto; }
@media all and (min-width: 48em) { .page-wrap { width: 85%; } }

.slim { max-width: 1100px; }

.medium { max-width: 1300px; }

.wide { max-width: 1600px; width: 92%; }

header { padding: 10px 0 70px; text-align: center; }

header.main { position: fixed; width: 100%; z-index: 999; background: #fff; }
header.main .logo { position: relative; z-index: 100; height: 50px; }
header.main .logo img { max-width: 150px; }

header.main nav li { display: inline-block; margin: 0 auto; font-size: 0.875em; text-transform: uppercase; width: 12%; font-weight: 500; letter-spacing: 0.063em; }
header.main nav li:nth-child(2) { margin-right: 12%; }
header.main nav li:nth-child(3) { margin-left: 12%; }
header.main nav li a { margin: 0; color: #304f6d; text-decoration: none; transition: all 0.2s ease; }
@media screen and (max-width: 57em) { header.main { padding: 10px 0 40px 0; }
  header.main nav { margin-top: 30px; }
  header.main nav li { margin: 0 !important; width: 16%; }
  header.main .logo { height: auto; }
  header.main .logo img { max-width: 150px; } }
@media screen and (max-width: 48em) { header.main { padding: 0; }
  header.main .logo { text-align: left; max-height: 72px; overflow: hidden; padding-left: 20px; position: absolute; }
  header.main .logo img { max-width: 250px; margin-top: -115px; } }
header.main #rNav-trigger { display: none; }
@media screen and (max-width: 48em) { header.main { padding: 20px 0 10px; height: 80px; }
  header.main #rNav-wrap { position: relative; }
  header.main #rNav-trigger { width: 6em; position: absolute; right: 0px; top: 0; display: block; height: 65px; line-height: 65px; cursor: pointer; padding: 0; font-size: 1.125em; color: #1e1e1e; font-weight: bold; background: url(/assets/images/icon-menu.svg) center no-repeat; background-size: 40%; }
  header.main nav { margin: 0; }
  header.main nav li { width: 100%; margin: 0; text-align: left; }
  header.main nav ul { /* main nav styles */ margin: 0; padding: 0; z-index: 9999; position: absolute; top: 90px; width: 100%; display: none; }
  header.main nav ul.rNav > li > a { height: auto; line-height: normal; padding: 22px 45px; /*space between main nav items*/ }
  header.main nav ul.rNav li.rNav-back { /*Style Back Hover button*/ background: #304f6d url(/assets/images/icon-arrow-back.png) no-repeat 45px center; }
  header.main nav ul.rNav li.rNav-back:hover { /*Style Back Hover button*/ background: #c5c3c3 url(icon-arrow-back.png) no-repeat 45px center; }
  header.main nav ul.rNav li.rNav-back a { /*Style Back button*/ margin: 0; font-size: 0.750em; font-weight: bold; text-indent: 30px; text-transform: uppercase; letter-spacing: 1px; color: #000; }
  header.main nav ul.rNav ul { position: static; visibility: visible; opacity: 1; margin: 0; }
  header.main nav ul.rNav li, header.main nav ul.rNav li:hover { /*Mobile Navigation Style*/ position: static; display: block; float: none; border-bottom: 1px solid #E4E4E4; background: #d8d7db; }
  header.main nav ul.rNav a { /*Link Style*/ display: block; float: none; font-weight: bold; color: #000; text-decoration: none; }
  header.main nav ul.rNav a:hover { /*Hover Style*/ color: #d3d3d3; }
  header.main nav ul.rNav ul a { padding: 0; width: auto; }
  header.main nav ul.rNav ul li:first-child a:after, header.main nav ul.rNav ul ul li:first-child a:after { border: 0; }
  header.main nav a.rNav-parent { /*Style parents only*/ background: url(icon-arrow-forward.png) no-repeat 95% center !important; }
  header.main nav ul.rNav-trans { display: block; position: absolute; overflow: hidden; }
  header.main nav ul.rNav-trans li, header.main nav ul.rNav-trans li a { overflow: hidden; white-space: nowrap; } }

main { position: relative; }

hr { border-top: none; border-bottom: 1px solid; border-color: #e5e4e7; border-left: none; border-right: none; margin: 0 auto; max-width: 90%; }

/*------------------------------------------------
	SECTIONS
------------------------------------------------*/
section { padding: 8em 0; }

section.portfolio { background: #304f6d; text-align: center; }

section header { text-align: center; padding: 0 0 30px 0; }
section header a { text-transform: uppercase; text-decoration: none; color: #d8d7db; font-weight: 500; letter-spacing: 0.050em; }
section header a:hover { color: #fff; }
section header h2 { font-family: "champagne__limousinesregular", "Roboto", Arial, Helvetica, sans-serif; font-size: 3em; color: #d8d7db; text-transform: uppercase; margin-bottom: .250em; }

section#about h2 { color: #70757f; text-align: left; }

section#logos .logo-soup { display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(2, 1fr); gap: 40px; }
@media all and (max-width: 48em) { section#logos .logo-soup { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(5, 1fr); gap: 20px; }
  section#logos .logo-soup img { max-width: 90%; } }
section#logos .logo-soup img { max-width: 100%; margin: auto; }

section.full-width-image { background-image: url("/assets/images/img-full-width-section.jpg"); height: 30vh; width: 100%; background-attachment: fixed; background-position: center; background-size: cover; }
@media all and (max-width: 48em) { section.full-width-image { height: 20vh; background-attachment: scroll; } }

section.services h2 { color: #70757f; }
section.services h3 { font-family: "champagne__limousinesregular", "Roboto", Arial, Helvetica, sans-serif; max-width: 80%; color: #304f6d; margin-top: 10px; }

section.contact { color: white; background: #192938; background-image: url("/assets/images/contact-background.jpg"); background-size: cover; }
section.contact #form { transition: opacity 0.5s ease; }
section.contact header { text-align: left; }
section.contact h1, section.contact h2, section.contact h3, section.contact h4, section.contact h5, section.contact h6, section.contact p, section.contact label { color: white; }
section.contact #msg { display: none; padding: 20px; background: #364e6b; font-weight: 500; margin-bottom: 30px; position: absolute; width: 90%; }

.opacity-0 { opacity: 0; }

footer { padding: 25px 0 0 0; background: #192938; }
footer div.logo { background: url(../images/bg-logo.png) no-repeat center bottom; background-size: 80%; padding: 0 0 70px 0; text-align: center; }
footer img.logo { max-width: 150px; width: 60%; }
@media all and (max-width: 75em) { footer { padding: 30px 0 20px; }
  footer .address { display: none; }
  footer div.logo { width: 25% !important; background-image: none; padding: 0; text-align: left; }
  footer .links { width: 72% !important; margin-top: 0.9em !important; } }
@media all and (max-width: 48em) { footer { padding: 0; }
  footer div.logo { width: 100% !important; text-align: center; background-image: none; padding: 20px 0; }
  footer div.address { display: none; }
  footer .links { width: 100% !important; padding: 0 !important; margin: 0 !important; }
  footer nav ul { text-align: center; }
  footer nav ul li { margin: 0 0 20px 0 !important; padding: 0 1em; } }
@media all and (max-width: 28em) { footer nav { display: none; } }

/*------------------------------------------------
	BANNER
------------------------------------------------*/
.banner { position: relative; width: 100%; height: 800px; box-sizing: border-box; background-size: cover; background-position: center center; transform-style: inherit; background-repeat: no-repeat; }
@supports (perspective: 1px) and (not (-webkit-overflow-scrolling: touch)) { .banner { background-attachment: fixed; -webkit-transform: translate3d(0, 0, 0); } }
@media screen and (max-width: 57em) { .banner { height: 600px; background-attachment: inherit; } }
@media screen and (max-width: 48em) { .banner { height: 500px; background-attachment: inherit; } }
@media screen and (max-width: 38em) { .banner { height: 300px; background-attachment: inherit; } }

.banner.home { height: 100vh !important; }
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation: portrait) { .banner.home { height: 1024px; background-attachment: scroll; } }
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation: landscape) { .banner.home { height: 1024px; background-attachment: scroll; } }
@media screen and (device-aspect-ratio: 40 / 71) { .banner.home { height: 600px; background-attachment: scroll; } }
.banner.home .intro { background: url(../images/tni-symbol-lg.png) no-repeat 0% 100%; width: 100%; height: 100%; z-index: 100; position: relative; background-size: 1100px; }
@media screen and (max-width: 48em) { .banner.home .intro { background-size: 600px; background-position: -200px bottom; } }
.banner.home .intro .text { position: absolute; bottom: 0; padding-bottom: 2em; padding-left: 150px; }
@media screen and (max-width: 48em) { .banner.home .intro .text { padding: 0 0 2em 3em; } }
.banner.home .intro .text h1 { font-family: "champagne__limousinesregular", "Roboto", Arial, Helvetica, sans-serif; color: #fff; font-size: 3.250em; text-transform: uppercase; margin: 0; }
@media screen and (max-width: 48em) { .banner.home .intro .text h1 { font-size: 2.15em; } }
.banner.home .intro .text h2 { color: #fff; text-transform: uppercase; font-weight: 500; font-size: 1em; letter-spacing: 0.050em; margin-bottom: .5em; }

button, a.button { background-color: #70757f; border: none; padding: 1em; color: #FFF; text-transform: uppercase; font-weight: 400; text-decoration: none; letter-spacing: 0.1em; }

button:hover, a.button { background: #304f6d; }

button:active, a.button { background: #20354a; }

/*------------------------------------------------
	Portfolio
------------------------------------------------*/
.portfolio-item { margin: 0.25%; float: left; }
@media screen and (max-width: 75em) { .portfolio-item { width: 24.5% !important; } }
@media screen and (max-width: 48em) { .portfolio-item { width: 49.5% !important; } }

section .portfolio-item { margin: 0.25%; float: left; }

.portfolio-item figure { position: relative; float: left; overflow: hidden; width: 100%; color: #FFF; text-align: left; background-color: transparent; }

.portfolio-item figure * { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.35s ease; transition: all 0.35s ease; }

.portfolio-item figure img { backface-visibility: hidden; margin-bottom: -3px; }

.portfolio-item figure figcaption { position: absolute; bottom: -130px; left: 0; height: 80px; width: 100%; z-index: 1; opacity: 1; padding: 20px 10px 0 10px; }
@media all and (max-width: 48em) { .portfolio-item figure figcaption { bottom: 0; } }

.portfolio-item figure figcaption:before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; /*overflow: hidden;*/ /*opacity: 0;*/ width: 100%; /*height: 100%;*/ min-height: 206px; background: rgba(25, 41, 56, 0.786); z-index: -1; -webkit-transform: skewY(7deg); -moz-transform: skewY(7deg); -ms-transform: skewY(7deg); -o-transform: skewY(7deg); transform: skewY(7deg); -webkit-backface-visibility: hidden; }

.portfolio-item figure h3, .portfolio-item figure p { line-height: 0.8em; margin: 0; }

.portfolio-item figure h3 { margin: 5px 0; font-family: "champagne__limousinesregular", "Roboto", Arial, Helvetica, sans-serif; text-transform: uppercase; font-weight: normal; color: #fff; line-height: normal; font-size: 1.1em; padding-left: 15px; }

.portfolio-item figure p { font-size: 0.7em; text-transform: uppercase; color: #ACACAC; font-weight: 500; letter-spacing: 0.15em; }

.portfolio-item figure a { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }

.portfolio-item figure:hover:after, .portfolio-item figure:after, .portfolio-item figure:hover figcaption { bottom: 0; }

#Portfolio .mix { display: none; }

.controls { margin-bottom: 1em; }

@media screen and (max-width: 48em) { .controls button { padding: .5em; font-size: .8em; letter-spacing: normal; margin: .5em .5em .5em 0; } }

@media screen and (max-width: 75em) { .gallery [class^="col-"] { width: 24.5% !important; } }
@media screen and (max-width: 48em) { .gallery [class^="col-"] { width: 49.5% !important; } }

/*--------------------------------------------------- Forms
---------------------------------------------------*/
label { font-weight: 600; vertical-align: top; line-height: 2; font-size: 0.9em; display: block; margin-top: 30px; margin-bottom: 2px; }

small { font-weight: normal; color: #848484; font-size: 0.78em; }

label + p { margin-top: 0; font-size: 0.8em; color: #6E6565; }

@media all and (max-width: 38em) { form { margin-top: 4em; } }

.required { color: #FF0000; }

input[type=text], input[type=email], input[type=password], textarea { width: 70%; display: inline-block; }

select option { padding: 0; }

input[type=text], input[type=email], input[type=password], select, textarea { border: 1px solid #C7C7C7; background: #FFF; font-family: Arial, Helvetica, sans-serif; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-background-clip: padding; -moz-background-clip: padding; background-clip: padding-box; font-size: 12px; margin: 0 0 5px; padding: 10px; width: 100%; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; outline: 0; -webkit-appearance: none; }

select { /*[disabled]background:#FFF url('../images/icon_arrow.png') no-repeat 95% center;*/ margin-bottom: 14px; /*[empty]width:;*/ }

input:focus, textarea:focus { background: #FFFFFF; outline: 0; }

.input-confirmation { opacity: 0; position: absolute; top: 0; left: 0; height: 0; width: 0; z-index: -1; }

.error { font-size: 14px; color: #FF0000; display: block; margin-top: 32px; margin-bottom: -31px; }

#msg p.error { background-color: #FF3838; font-style: italic; }

#msg.success p { background-color: #304f6d; color: #fff; font-style: italic; padding: 1em; margin-bottom: 2em; }

.full-width { width: 100%; height: auto; }

img { max-width: 100%; }

.sl-overlay { position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: #304f6d; opacity: 0.9; display: none; z-index: 1006; }

.sl-wrapper { z-index: 1000; }
.sl-wrapper button { border: 0 none; background: transparent; font-size: 2em; color: #d8d7db; padding: 0; cursor: pointer; }
.sl-wrapper button:hover { opacity: 0.7; }
.sl-wrapper .sl-close { display: none; position: fixed; right: 30px; top: 30px; z-index: 1015; }
.sl-wrapper .sl-counter { display: none; position: fixed; top: 30px; left: 30px; color: #70757f; z-index: 1015; }
.sl-wrapper .sl-navigation { width: 100%; display: none; }
.sl-wrapper .sl-navigation button { position: fixed; top: 50%; margin-top: -10px; height: 30px; width: 30px; line-height: 30px; text-align: center; display: block; z-index: 1015; font-family: arial sans-serif; }
.sl-wrapper .sl-navigation button.sl-next { right: 40px; }
.sl-wrapper .sl-navigation button.sl-prev { left: 40px; }
.sl-wrapper .sl-image { position: fixed; -ms-touch-action: none; touch-action: none; z-index: 10000; }
.sl-wrapper .sl-image img { margin: 0; padding: 0; display: block; }
.sl-wrapper .sl-image iframe { border: 0 none; background: #000; }
.sl-wrapper .sl-image .sl-caption { display: none; padding: 10px; color: #fff; background: #000; opacity: 0.8; position: absolute; bottom: 0; left: 0; right: 0; }
.sl-wrapper .sl-image .sl-caption.pos-top { bottom: auto; top: 0; }
.sl-wrapper .sl-image .sl-caption.pos-outside { bottom: auto; }
.sl-wrapper .sl-image .sl-download { display: none; position: absolute; bottom: 5px; right: 5px; color: #fff; z-index: 1005; }

.sl-spinner { display: none; border: 5px solid #333; border-radius: 40px; height: 40px; left: 50%; margin: -20px 0 0 -20px; opacity: 0; position: fixed; top: 50%; width: 40px; z-index: 1007; -webkit-animation: pulsate 1s ease-out infinite; -moz-animation: pulsate 1s ease-out infinite; -ms-animation: pulsate 1s ease-out infinite; -o-animation: pulsate 1s ease-out infinite; animation: pulsate 1s ease-out infinite; }

.sl-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll; }

@-webkit-keyframes pulsate { 0% { transform: scale(0.1); opacity: 0.0; }
  50% { opacity: 1; }
  100% { transform: scale(1.2); opacity: 0; } }
@keyframes pulsate { 0% { transform: scale(0.1); opacity: 0.0; }
  50% { opacity: 1; }
  100% { transform: scale(1.2); opacity: 0; } }
@-moz-keyframes pulsate { 0% { transform: scale(0.1); opacity: 0.0; }
  50% { opacity: 1; }
  100% { transform: scale(1.2); opacity: 0; } }
@-o-keyframes pulsate { 0% { transform: scale(0.1); opacity: 0.0; }
  50% { opacity: 1; }
  100% { transform: scale(1.2); opacity: 0; } }
@-ms-keyframes pulsate { 0% { transform: scale(0.1); opacity: 0.0; }
  50% { opacity: 1; }
  100% { transform: scale(1.2); opacity: 0; } }