/* General */
html { height: 100%; font-family: 'neue-haas-unica', sans-serif; font-size: 15px; }
body { margin: 0; padding: 0; height: 100%; color: #333333; background: url(../media/bg.body.jpg) no-repeat left top; }
strong { color: #0066cc; }
.flex-row { display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: flex-start; align-items: flex-start; }
.flex-column { display: flex; flex-wrap: nowrap; flex-direction: column; justify-content: flex-start; align-items: flex-start; }
.wrapper { margin: 0 auto; width: 100%; max-width: 1140px; }

/* Page */
.page { align-items: stretch; min-height: 100%; }
.page .main { flex-grow: 1; }

/* Navbar */
*.navbar nav { position: relative; z-index: 10; flex-basis: 100%; height: 5rem; }
*.navbar nav .menu { height: 100%; align-items: center; }
*.navbar nav .menu .item { position: relative; z-index: 20; justify-content: center; align-items: center; padding: 0 1rem; min-width: 10rem; height: 100%; font-size: 1.33em; color: #FFF; text-decoration: none; white-space: nowrap; box-sizing: border-box; }
*.navbar nav .menu .item:hover { background: url(../media/bg.menu.item.active.png) repeat-x left top; }
*.navbar nav .menu .item.active { font-weight: bold; background: url(../media/bg.menu.item.active.png) repeat-x left top; }
*.navbar nav .menu .item::after { position: absolute; top: 0; right: 0; z-index: 21; display: block; width: 3px; height: 100%; content: ""; background: url(../media/bg.menu.sep.png) no-repeat; }
*.navbar nav .menu .item:last-child::after { display: none; }
*.navbar nav .menu .item[target='_blank'] span { padding: 0 .5rem 0 1rem; background: url(../media/icon.link.white.15.png) no-repeat -3px 66%; }
*.navbar nav .options {  padding-left: 1rem; align-self: center; align-items: center; }
*.navbar nav .options .icon { display: block; margin: 0 1rem 0 0; width: 2rem; overflow: hidden; text-decoration: none; background-size: 100% auto !important; }
*.navbar nav .options .icon img { display: block; width: 2rem; height: auto; opacity: .75; }
*.navbar nav .options .icon:hover img,
*.navbar nav .options .icon.active img { opacity: 1; }
*.navbar nav .options .icon.index:hover { background-position: 0 -2rem; }
*.navbar nav .options .sub { display: none; position: relative; z-index: 100; height: 2rem; overflow: visible; }
*.navbar nav .options .sub ul { display: none; position: absolute; right: 0; z-index: 101; margin: 0 -100% 0 0; padding: .5rem 0 0; list-style: none; }
*.navbar nav .options .sub:hover ul { display: block; }
*.navbar nav .options .sub li { padding: .75rem 1.25rem .75rem .75rem; white-space: nowrap; border-top: 1px dotted #CCC; background: #FFF; }
*.navbar nav .options .sub li:first-child { border: 0; }
*.navbar nav .options .sub li a { color: #003366; text-decoration: none; }
*.navbar nav .options .sub li a:hover { color: #0066cc; }
*.navbar nav .options .lang.sub a { align-items: center; }
*.navbar nav .options .lang.sub img { display: block; margin: 0 .5rem 0 0; width: auto; height: 1rem; }

header.navbar { margin-top: 4rem; justify-content: space-between; align-items: stretch; }
header.navbar .logo { margin: 0 2rem 0 0; padding: 0; height: 5rem; font-size: 1rem; }
header.navbar .logo img { display: block; margin-left: -5px; width: auto; height: 100%; }
header.navbar nav { padding: 0 1rem 0 0; }
header.navbar nav::after { position: absolute; top: 0; right: 0; z-index: 11; display: block; width: 1rem; height: 100%; content: ""; background: #0066cc; }
header.navbar nav .menu { flex-basis: 100%; height: 100%; align-items: center; background: url(../media/bg.menu.item.png) repeat-x left top; }
header.navbar nav .options { justify-content: flex-end; height: calc(100% - 1rem); background: #ebebeb; }
header.navbar nav .options .icon.index { height: 2rem; background: url('../media/icon.index.blue.30.png') no-repeat left top; }
header.navbar nav .options .icon.lang { background: url('../media/icon.lang.blue.30.png') no-repeat left top; }
header.navbar nav .options .icon.links { background: url('../media/icon.link.blue.30.png') no-repeat left top; }
header.navbar nav .options .sub ul { top: 1.75rem; }
footer.navbar { background: url(../media/bg.menu.item.png) repeat-x left top; }
footer.navbar nav { justify-content: space-between; align-items: center; }
footer.navbar nav .menu { padding-left: 3px; }
footer.navbar nav .menu .item:first-child::before { position: absolute; top: 0; left: -3px; z-index: 21; display: block; width: 3px; height: 100%; content: ""; background: url(../media/bg.menu.sep.png) no-repeat; }
footer.navbar nav .options .icon.index { margin: 0; height: 2rem; background: url('../media/icon.index.white.30.png') no-repeat left top; }
footer.navbar nav .options .icon.lang { background: url('../media/icon.lang.white.30.png') no-repeat left top; }
footer.navbar nav .options .icon.links { background: url('../media/icon.link.white.30.png') no-repeat left top; }
footer.navbar nav .options .sub ul { bottom: 2.25rem; }
footer.navbar .copy { display: block; width: 100%; line-height: 2rem; font-size: .75rem; color: #FFF; text-align: center; background: #003366; }

/* Index */
.index .heading { position: relative; z-index: 10; margin: 2em 0 1.25em; font-size: 2.66rem; font-weight: 300; color: #003366; text-align: center; line-height: 1.375em; }
.index .heading span { position: relative; z-index: 13; }
.index .heading::before { position: absolute; top: 0; left: 0; z-index: 11; display: block; width: 50%; height: 100%; content: ""; background: url(../media/bg.body.video.lft.png) no-repeat -2rem 55%; }
.index .heading::after { position: absolute; top: 0; right: 0; z-index: 11; display: block; width: 50%; height: 100%; content: ""; background: url(../media/bg.body.video.rgt.png) no-repeat calc( 100% + 2rem ) 55%; }
.index .video { display: flex; align-items: center; justify-content: space-between; margin: 0 0 4rem; }
.index .video video { width: 60%; border-top: 3px solid #003366; }
.index .video .side { flex-shrink: 0; flex-basis: 20%; text-align: center; }
.index .video .side img { width: 100%; max-width: 50%; height: auto; max-height: 6rem; }
.index .video .next { opacity: .75; }
.index .video .next:hover { opacity: 1; }
.index .engineers { padding: 4rem 0 6rem; background: #FFF url(../media/bg.body.engineers.jpg) no-repeat center top; }
.index .engineers .features { display: flex; align-items: stretch; justify-content: space-between; margin: 0 0 0 -2rem; padding: 0; list-style: none; }
.index .engineers .features li { position: relative; z-index: 10; flex-basis: calc(25% - 2rem); margin: 0 0 0 2rem; background: #FFF; }
.index .engineers .features li.flex { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; background: none; }
.index .engineers .features li.flex p { background: #FFF; }
.index .engineers .features li.flex a { position: relative; display: block; margin: .75rem 0 0; padding: 1rem 1rem 1rem 2.75rem; width: 100%; color: #FFF; text-decoration: none; box-sizing: border-box; background: #003366; }
.index .engineers .features li.flex a::after { position: absolute; top: calc(50% - 1rem); left: .5rem; display: block; width: 2rem; height: 2rem; content: ""; background: url(../media/icon.link.white.30.png) no-repeat; }
.index .engineers .features li.flex a:hover { background: #0066cc; }
.index .engineers .features li:not(:first-child)::before { position: absolute; top: 0; left: -1rem; display: block; width: 1rem; height: 100%; content: ""; border-left: 1px dashed #FFF; }
.index .engineers .features p { margin: 0; padding: 1.5rem; font-size: 1.33rem; }
.index .engineers .c2a { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; margin: 0 auto; width: 45rem; font-size: 2.33rem; }
.index .engineers .c2a .title { margin: 2em 0 1em; font-size: inherit; font-weight: 300; color: #003366; text-align: center; line-height: 1.25em; }
.index .engineers .c2a a { position: relative; display: block; margin: 0 110px; width: calc(100% - 220px); line-height: 90px; font-size: inherit; font-weight: bold; color: #FFF; text-align: center; text-decoration: none; box-sizing: border-box; background: linear-gradient(135deg, #ff4801, #ff1901); }
.index .engineers .c2a a::before { position: absolute; top: 0; left: -110px; display: block; width: 110px; height: 100%; content: ""; background: url(../media/icon.c2a.lft.png) no-repeat; }
.index .engineers .c2a a::after { position: absolute; top: 0; right: -110px; display: block; width: 110px; height: 100%; content: ""; background: url(../media/icon.c2a.rgt.png) no-repeat; }

/* Content */
.content { position: relative; z-index: 12; margin: 4rem auto 0; display: flex; align-items: flex-start; justify-content: flex-start; }
.content .title { position: relative; flex-shrink: 0; flex-basis: 10rem; height: 40rem; font-size: 10rem; font-weight: bold; text-align: right; color: #0066cc; opacity: .08; }
.content .title span { position: absolute; top: .5rem; left: 0; width: 40rem; height: 10rem; transform: rotate(-90deg) translatex(-100%) translatey(-2rem); transform-origin: top left; }
.content .inner { margin: 0 0 4rem 2rem; flex-basis: 100%; }
.content .inner .heading { position: relative; margin: 0 0 1em; padding: 0 0 1em; font-size: 2.33rem; font-weight: 300; color: #003366; line-height: 1.375em; }
.content .inner .heading::after { position: absolute; bottom: 0; left: 0; display: block; width: 66%; height: 3px; content: ""; background: #003366; }
.content .inner p { margin: 0 0 1em; width: 89%; font-size: 1.2rem; font-weight: 300; line-height: 2em; }

/* Form */
.row { margin: 0 0 1rem; width: 100%; }
input { margin: 0; padding: 0 1rem; width: 100%; height: 3rem; font-family: 'neue-haas-unica', sans-serif; font-size: 1.2rem; box-sizing: border-box; border: 0; background: #FFF; }
textarea { margin: 0; padding: 1rem; width: 100%; height: 10rem; font-family: 'neue-haas-unica', sans-serif; font-size: 1.2rem; resize: none; box-sizing: border-box; border: 0; background: #FFF; }
.submit { display: flex; align-items: center; justify-content: flex-start; }
.submit button { padding: .5rem 1rem; font-size: 1.2rem; font-weight: bold; color: #FFF; cursor: pointer; border: 0; background: #003366; }
.submit button:hover { background: #0066cc; }
.submit .required { flex-basis: 100%; margin: 0 0 0 1rem; font-size: 12px; color: #003366; }
.submit .required::before { content: "* "; }

.contact { display: flex; flex-wrap: nowrap; width: 100%; }
.contact form { flex-basis: 60%; padding: 0 2em 0 0; }
.contact aside { flex-basis: 40%; }
.contact aside iframe { display: block; margin: 0 0 2px; padding: 0; width: 100%; height: 20em; box-sizing: border-box; border: 2px solid #FFF; }
.contact aside address { display: block; padding: .5em .75em .75em; font-style: normal; color: #003366; background: #FFF; }
