@import url(//fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,700,700italic);
@font-face {
  font-family: 'Graphik Web';
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-MediumItalic-Web.eot');
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-MediumItalic-Web.eot?#iefix') format('embedded-opentype'), url('https://3form.s3.amazonaws.com/fonts/Graphik-MediumItalic-Web.woff2') format('woff2'), url('https://3form.s3.amazonaws.com/fonts/Graphik-MediumItalic-Web.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-stretch: normal;
}
.Graphik-MediumItalic-Web {
  font-family: 'Graphik Web';
  font-weight: 500;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: 'Graphik Web';
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-Medium-Web.eot');
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-Medium-Web.eot?#iefix') format('embedded-opentype'), url('https://3form.s3.amazonaws.com/fonts/Graphik-Medium-Web.woff2') format('woff2'), url('https://3form.s3.amazonaws.com/fonts/Graphik-Medium-Web.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
}
.Graphik-Medium-Web {
  font-family: 'Graphik Web';
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: 'Graphik Web';
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-RegularItalic-Web.eot');
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-RegularItalic-Web.eot?#iefix') format('embedded-opentype'), url('https://3form.s3.amazonaws.com/fonts/Graphik-RegularItalic-Web.woff2') format('woff2'), url('https://3form.s3.amazonaws.com/fonts/Graphik-RegularItalic-Web.woff') format('woff');
  font-weight: 400;
  font-style: italic;
  font-stretch: normal;
}
.Graphik-RegularItalic-Web {
  font-family: 'Graphik Web';
  font-weight: 400;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: 'Graphik Web';
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-Regular-Web.eot');
  src: url('https://3form.s3.amazonaws.com/fonts/Graphik-Regular-Web.eot?#iefix') format('embedded-opentype'), url('https://3form.s3.amazonaws.com/fonts/Graphik-Regular-Web.woff2') format('woff2'), url('https://3form.s3.amazonaws.com/fonts/Graphik-Regular-Web.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}
.Graphik-Regular-Web {
  font-family: 'Graphik Web';
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}
body {
  font-family: 'Graphik Web';
}
a.orange-link {
  color: #ff9e1b;
}
a.orange-link:hover {
  color: #e78500;
}
.feature {
  height: 300px;
  margin-bottom: 15px;
}
.feature > .content {
  width: 555px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.feature > .content p {
  padding-bottom: 30px;
  color: #ffffff;
}
#hero-image {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/seeyond/seeyond-hero.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image > .content h3 {
  margin-bottom: 70px;
}
#hero-image-tetria {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/tetria/tetria-gallery-banner.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-tetria > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-tetria > .content h3 {
  margin-bottom: 70px;
}
#hero-image-clario {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/clario/clario-gallery-banner.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-clario > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-clario > .content h3 {
  margin-bottom: 70px;
}
#hero-image-velo {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/velo/velo-gallery-banner.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-velo > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-velo > .content h3 {
  margin-bottom: 70px;
}
#hero-image-shapes {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/shapes/shapes-gallery-banner.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-shapes > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-shapes > .content h3 {
  margin-bottom: 70px;
}
#hero-image-edge {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/edge/edge-gallery-banner.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-edge > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-edge > .content h3 {
  margin-bottom: 70px;
}
#hero-image-divy {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/systems/divy/divy-sola-felt-net-nickel-black-oxide-partition-ceiling-baffle-install-rendering.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-divy > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-divy > .content h3 {
  margin-bottom: 70px;
}
#hero-image-hush-blocks {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/systems/hush-blocks/hush-blocks-sola-felt-cast-armor-hunter-ebony-install.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-hush-blocks > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-hush-blocks > .content h3 {
  margin-bottom: 70px;
}
#hero-image-duet {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/systems/duet/duet-paragon-geotic-hitch-black-oxide-hardware-partitions.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-duet > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-duet > .content h3 {
  margin-bottom: 70px;
}
#hero-image-iltuo {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(//images.3-form.com/systems/iltuo/iltuo-header.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-iltuo > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-iltuo > .content h3 {
  margin-bottom: 70px;
}
#hero-image-hoodoo {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(//images.3-form.com/systems/hoodoo/hoodoo-header.jpg);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-hoodoo > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-hoodoo > .content h3 {
  margin-bottom: 70px;
}
#hero-image-hush-swoon {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://dummyimage.com/1170x450/);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#hero-image-hush-swoon > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#hero-image-hush-swoon > .content h3 {
  margin-bottom: 70px;
}
#tetria-configurator {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/tetria/tetria-installation.png);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#tetria-configurator > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#velo-configurator {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/velo/velo-installation.png);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#velo-configurator > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#seeyond-configurator {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/landing/seeyond.png);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#seeyond-configurator > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#clario-configurator {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/ceilings/clario/clario-installation.png);
  background-size: cover;
  height: 450px;
  color: #ffffff;
}
#clario-configurator > .content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.video-container {
  position: relative;
}
.video-container span {
  position: absolute;
  color: #ff9e1b;
  font-size: 85px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#videoModal .modal-header {
  padding: 0;
  border: none;
}
#videoModal .modal-header .close {
  margin-top: -25px;
  margin-right: -25px;
  border-radius: 15px;
  background-color: rgba(0, 0, 0, 0.2);
  color: #ffffff;
  opacity: 1;
  width: 25px;
  height: 25px;
}
#videoModal .modal-body {
  padding: 0;
}
.seeyond-description {
  margin-top: 40px;
}
.acoustic-solution {
  margin-top: 60px;
}
.acoustic-solution h4 {
  margin-top: 24px;
}
.absorption-image {
  margin-top: 26px;
}
.nrc-logo {
  margin-left: 10px;
  border-radius: 40px;
  border: 2px solid #FF9E1B;
  width: 80px;
  height: 80px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
  padding-top: 18px;
}
.nrc-logo-seeyond {
  margin-left: 0px;
  border-radius: 40px;
  border: 2px solid #FF9E1B;
  width: 80px;
  height: 80px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
  padding-top: 18px;
}
#wall {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/seeyond/features/wall.png);
}
#wall-to-ceiling {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/seeyond/features/wall_to_ceiling.png);
}
#linear-partition {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/seeyond/features/linear_partition.png);
}
#curved-partition {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/seeyond/features/curved_partition.png);
}
#ceiling {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/seeyond/features/ceiling.jpg);
}
#questions {
  background: radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url(https://images.3-form.com/seeyond/questions.jpg);
}
.seeyond-nav {
  margin: 10px 0 0 0;
}
.seeyond-nav ul li.techdocs {
  border-right: 1px solid #666666;
}
.seeyond-nav ul li.rep a {
  color: #ff9e1b;
}
.pattern-container:hover .view-details-link {
  visibility: visible;
}
.pattern-container .img-container {
  position: relative;
}
.pattern-container p.title {
  margin-top: 15px;
  font-weight: 500;
}
.pattern-container .view-details-link {
  color: #ffffff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 22px;
  margin: 0 auto;
  display: block;
  width: 58%;
  visibility: hidden;
}
.pattern-container .view-details-link .circle-chevron {
  border: 2px solid #ff9e1b;
  border-radius: 50%;
  color: #ff9e1b;
  width: 35px;
  text-align: center;
  display: inline-block;
}
.duet-hardware-container {
  margin: 60px 0;
  background-color: #f1f1f1;
  padding: 50px;
}
.duet-hardware-container img {
  margin-top: 25px;
}
.duet-hardware-container ul li > p {
  margin-top: 5px;
}
.duet-hardware-container ul li > img {
  width: 68px;
}
.simplespec-container {
  margin: 60px 0;
  background-color: #f1f1f1;
  padding: 30px;
}
.simplespec-container .simplespec-link {
  font-size: 28px;
  margin-top: 15px;
}
.simplespec-container .simplespec-link .circle-chevron {
  border: 2px solid #ff9e1b;
  border-radius: 50%;
  color: #ff9e1b;
  width: 45px;
  text-align: center;
  display: inline-block;
}
.specs-container {
  background-color: #f1f1f1;
  padding-top: 60px;
  padding-bottom: 60px;
}
.specs-container .spec-container {
  border-right: 1px solid #cdcdcd;
  min-height: 150px;
}
.specs-container .spec-container:last-child {
  border-right: none;
}
.specs-container .spec-container .content {
  border-top: 5px solid #000000;
}
.specs-container .spec-container .content .title {
  margin-top: 15px;
  font-size: 22px;
  font-weight: 500;
}
.square-carousel-control {
  color: #000000;
  border: 1px solid #000000;
  padding: 5px;
}
@media (max-width: 767px) {
  .swatches {
    margin-top: 30px;
  }
}
.margin-top-20 {
  margin-top: 20px;
}
.margin-top-30 {
  margin-top: 30px;
}
.margin-top-40 {
  margin-top: 40px;
}
.margin-top-60 {
  margin-top: 60px;
}
.margin-top-100 {
  margin-top: 100px;
}
.margin-bottom-20 {
  margin-bottom: 20px;
}
.margin-bottom-30 {
  margin-bottom: 30px;
}
.margin-bottom-40 {
  margin-bottom: 40px;
}
.margin-bottom-60 {
  margin-bottom: 60px;
}
.circle {
  border-radius: 50%;
}
.button.orange {
  border: 1px solid #ff9e1b;
  color: #666666;
}
.button.orange-white {
  border: 1px solid #ff9e1b;
  color: #ffffff;
}
.button.orange:hover {
  background-color: #ff9e1b;
  color: #ffffff;
}
.button.orange-white:hover {
  background-color: #ff9e1b;
  color: #ffffff;
}
.download-link {
  color: #ff9e1b;
}
.download-link:hover {
  color: #e78500;
}
.center {
  text-align: center;
}
.swatches {
  text-align: center;
  margin-top: 10px;
}
.rtg-group {
  border: 1px solid #cdcdcd;
  min-height: 350px;
  padding: 5px;
  margin-bottom: 30px;
}
.img-compare-container {
  width: 778px;
  margin: 0 auto;
}
.carousel-indicators li {
  border: 1px solid #ff9e1b;
}
.carousel-indicators .active {
  background-color: #ff9e1b;
}
.black-oxide {
  width: 68px;
  height: 68px;
  background-color: #000000;
}
.detail-header-copy-box {
  padding-top: 90px;
}
.custom-configurations {
  margin-top: 15%;
}
img.full-panel {
  margin: 0 auto;
}
img.nrc-icon {
  margin-right: 10px;
}
div.markerboard-swatches {
  text-align: center;
}
div.markerboard-swatches div.markerboard-swatch {
  width: 64px;
  height: 64px;
  margin: 0 auto;
}
div.markerboard-swatches div.markerboard-swatch.chalk {
  background-color: #FFFFFF;
  border: 1px solid #cdcdcd;
}
div.markerboard-swatches div.markerboard-swatch.index {
  background-color: #DFDFD7;
}
div.markerboard-swatches div.markerboard-swatch.journal {
  background-color: #D1C7B2;
}
div.markerboard-swatches div.markerboard-swatch.note {
  background-color: #B3B7BB;
}
div.markerboard-swatches div.markerboard-swatch.gum {
  background-color: #EDD8D3;
}
div.markerboard-swatches div.markerboard-swatch.memo {
  background-color: #C8DBDC;
}
ul.materials-list {
  color: #ffffff;
  list-style-type: none;
  padding: 0;
}
ul.materials-list li.material {
  position: relative;
  margin-bottom: 10px;
}
ul.materials-list li.material a {
  color: #ffffff;
}
ul.materials-list li.material a:visited {
  color: #ffffff;
}
ul.materials-list li.material a:hover {
  color: #ff9e1b;
}
ul.materials-list li.material p {
  position: absolute;
  top: 30%;
  padding-left: 25px;
}