<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="content bg-blue">
<h1 class="tab center bounds padding active"><span>Products</span></h1>
<div class="bounds padding">
<a href="/Main/Page/Products" class="item zoom active">
<div class="column">
<div class="image">
<img id="ctl00_body_rptProducts_ctl00_imgProduct" class="cover accelerate" src="https://bufiles.blob.core.windows.net/co3657/products/bvh_products1.jpg" alt="antimicrobial alphasan additive prevents odors" />
<div class="link-abs">
<p class="link-col-text">View More...</p>
</div>
</div>
</div>
<div class="column">
<div class="text">
<h2>HENKEL POLYBIT CONSTRUCTION CHEMICALS</h2>
<p><span class="text-smaller">Waterproofing. Industrial Flooring. Structural Repair. Sealants and Adhesleves.</span></p>
</div>
</div>
</a>
<a href="/dispersitech-pigment-dispersion/" class="item zoom active">
<div class="column">
<div class="image">
<img id="ctl00_body_rptProducts_ctl01_imgProduct" class="cover accelerate" src="https://bufiles.blob.core.windows.net/co3657/products/bvh_products2.jpg" alt="Dispersitech Pigment Dispersion" />
<div class="link-abs">
<p class="link-col-text">View More...</p>
</div>
</div>
</div>
<div class="column">
<div class="text">
<h2>PIGMENTS FOR CONCRETE</h2>
<p><span class="text-smaller"></span></p>
</div>
</div>
</a>
<a href="/liquitint-polymeric-colorants/" class="item zoom active">
<div class="column">
<div class="image">
<img id="ctl00_body_rptProducts_ctl02_imgProduct" class="cover accelerate" src="https://bufiles.blob.core.windows.net/co3657/products/bvh_products5.jpg" alt="Transparent polypropylene polymeric colorants" />
<div class="link-abs">
<p class="link-col-text">View More...</p>
</div>
</div>
</div>
<div class="column">
<div class="text">
<h2>INDUSTRIAL CHEMICALS</h2>
<p><span class="text-smaller"></span></p>
</div>
</div>
</a>
<a href="/reactint-polymeric-colorants/" class="item zoom active">
<div class="column">
<div class="image">
<img id="ctl00_body_rptProducts_ctl03_imgProduct" class="cover accelerate" src="https://bufiles.blob.core.windows.net/co3657/products/bvh_products4.jpg" alt="reactint coloring technology polyurethane thermoset resins" />
<div class="link-abs">
<p class="link-col-text">View More...</p>
</div>
</div>
</div>
<div class="column">
<div class="text">
<h2>LIGHT INDUSTRIAL EQUIPMENT</h2>
<p><span class="text-smaller"></span></p>
</div>
</div>
</a>
<a href="/reactint-polymeric-colorants/" class="item zoom active">
<div class="column">
<div class="image">
<img id="ctl00_body_rptProducts_ctl03_imgProduct" class="cover accelerate" src="https://bufiles.blob.core.windows.net/co3657/products/bvh_products3.jpg" alt="reactint coloring technology polyurethane thermoset resins" />
<div class="link-abs">
<p class="link-col-text">View More...</p>
</div>
</div>
</div>
<div class="column">
<div class="text">
<h2>POLYPLAST CONSTRUCTION CHEMICALS</h2>
<p><span class="text-smaller">Concrete Production. Other Products.</span></p>
</div>
</div>
</a>
</div>
</div>
.link-abs {
position: absolute;
left: 0;
right: 0;
bottom: 0;
text-align: center;
background: transparent;
transition: all 0.5s ease;
opacity: 0;
}
.link-abs:hover {
position: absolute;
left: 0;
right: 0;
bottom: 0;
text-align: center;
background: rgba(0, 0, 0, 0.45);
opacity: 1;
}
.link-col-text {
color: #fff;
font-size: 24px;
text-align: center;
text-transform: uppercase;
font-family: 'Segoe UI';
font-weight: 100;
display: inline-block;
padding-top: 5px;
}
ol,
ul {
list-style: none
}
blockquote,
q {
quotes: none
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: none
}
table {
border-collapse: collapse;
border-spacing: 0
}
* {
margin: 0;
padding: 0
}
* {
outline: none
}
.row:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0
}
a {
color: #043189;
text-decoration: none;
cursor: pointer;
cursor: hand
}
a:hover {
color: #1c4fb3
}
a:not(.slide),
span:not(.slide) {
-webkit-transition-duration: .1s;
-webkit-transition-property: color, background-color, opacity, outline;
-moz-transition-duration: .1s;
-moz-transition-property: color, background-color, opacity, outline;
transition-duration: .1s;
transition-property: color, background-color, opacity, outline
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 1em;
margin: .6em 0
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
margin-top: 0
}
h1 {
font-size: 220%
}
h2 {
font-size: 160%
}
h3 {
font-size: 135%
}
h4 {
font-size: 110%;
margin-top: 2em
}
h6 {
font-size: 110%
}
p+h2,
ul+h2,
ol+h2,
p+h3,
ul+h3,
ol+h3 {
margin-top: 1.2em
}
p,
ul,
ol,
table {
line-height: 1.6em;
margin: .9em 0
}
ul,
ol {
margin-left: 2em
}
ol {
list-style-type: decimal
}
ul {
list-style-type: square
}
em {
font-style: italic
}
.text-caps {
text-transform: uppercase
}
.text-right {
text-align: right
}
.text-smaller {
font-size: 80%;
line-height: 1.4em
}
.text-large {
font-size: 110%
}
.text-larger {
font-size: 135%
}
.text-lighter {
color: #878787
}
.widow-killer {
white-space: nowrap
}
.image-left {
float: left;
max-width: 50%;
margin: 0 30px 8px 0
}
.image-right {
float: right;
max-width: 50%;
margin: 0 0 8px 30px
}
.image-full {
width: 100%;
margin: 15px 0
}
.moreInfo {
background: #f2f1f1;
padding: 20px;
display: block
}
.moreInfo img {
margin-right: 15px;
margin-bottom: 25px;
max-width: 60px
}
@media only screen and (min-device-width: 768px)and (max-device-width: 1024px) {
h1.tab {
top: -89px!important
}
}
@media screen and (max-width: 1080px) {
header nav ul.main>li:not(#search)>a {
padding-left: 11px!important;
padding-right: 11px!important
}
}
@media screen and (max-width: 1010px) {
.logo.active img.logo-chemical {
height: 90%!important;
top: -6%!important
}
}
@media screen and (max-width: 640px) {
.mobile-hide {
display: none!important
}
h1.tab {
text-align: center!important;
opacity: 1!important;
height: auto!important;
top: auto!important;
margin: 0 0 20px!important;
background: none!important;
border-color: transparent!important
}
h1.tab span {
display: inline!important;
position: relative;
background: none!important;
border-color: transparent!important;
line-height: 1.2em!important;
height: auto!important;
margin: 0!important;
padding: 0!important;
font-size: 110%!important
}
h1.tab span:before,
h1.tab span:after {
display: none!important
}
.column {
display: block;
width: 100%!important;
height: auto!important;
float: none!important;
margin: 0 0 40px!important
}
.column .column {
padding-left: 0!important;
padding-right: 0!important
}
.products-table .column {
margin-bottom: 0!important;
padding-left: 0!important;
padding-right: 0!important
}
.products-table .description {
border: none!important;
padding-top: 0!important
}
.kickers {
min-width: 0!important
}
.kickers .column {
border-bottom: 1px solid #ccc;
padding-bottom: 10px!important
}
a.item {
height: auto!important
}
a.item .column:first-child {
height: 160px!important
}
a.item .column:first-child .image {
line-height: 160px!important
}
a.item .column>.text {
width: auto!important;
padding-left: 50px!important;
background-position: 10px top!important
}
.bounds,
.hero {
min-width: 0!important
}
header {
z-index: 4!important;
height: 50px!important
}
header .bounds {
height: 100%!important
}
.logo {
top: 50%!important;
height: 45px!important;
margin-top: -18px!important
}
.logo img.logo-chemical {
left: 85px!important;
top: -10%!important;
height: 110%!important
}
.menu-toggle {
position: absolute;
right: 10px;
top: 10px;
height: 30px;
width: 30px;
background: url(/cassette.axd/file/images/nav-menu-toggle-194b500530457e8cbacc91b6b7e81b9bc4f3ed26.png) center no-repeat
}
body.menu-active header nav {
display: block!important
}
body.menu-active header {
position: fixed!important;
left: 0;
width: 100%;
background: #fff
}
header {
opacity: 1!important
}
header nav {
display: none!important;
position: fixed!important;
left: 0;
top: 50px;
margin-top: 0!important;
bottom: 0!important;
width: 100%;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
background: #656565;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
header nav ul,
header nav .dropdown {
visibility: visible!important;
opacity: 1!important;
position: relative!important;
left: auto!important;
top: auto!important;
padding: 0!important
}
header nav ul.main {
padding-top: 44px!important
}
header nav li {
float: none!important;
margin: 0!important;
padding: 0!important;
border: none!important
}
header nav a {
margin: 0!important;
padding: 10px!important;
color: #fff!important;
font-size: 135%!important;
border-bottom: 1px solid #787878;
background: none!important
}
header nav ul ul a {
font-size: 100%!important
}
header #search a {
background: none!important;
position: fixed;
top: 4px;
right: 45px;
padding: 0!important;
border: 0!important
}
#search .icon-dark {
opacity: 1!important
}
header.search-active #search>a .icon-dark {
opacity: 0!important;
display: none
}
#search .icon-x {
background-image: url(/css/../images/icon-x-dark-2x.png)!important;
background-size: 16px
}
#search:hover>a .icon-light {
display: none!important
}
.search-field {
visibility: visible!important;
opacity: 1!important;
z-index: 2!important;
top: 0!important;
left: 0!important;
right: 0!important;
height: 44px!important
}
#search input[type="submit"] {
width: 44px!important;
-webkit-border-radius: 0
}
#search label {
z-index: 2!important;
top: 3px!important
}
.search-field input[type="text"] {
background: #dfdfdf!important;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
right: 44px!important;
top: 3px!important
}
#share a {
width: auto!important;
height: auto!important;
text-indent: 0!important
}
header nav ul .dropdown {
display: none!important;
background: #4c4c4c!important;
-webkit-box-shadow: none!important;
-moz-box-shadow: none!important;
box-shadow: none!important
}
header nav li.active .dropdown {
display: block!important
}
header nav .image {
display: none!important
}
header nav li .nav-toggle {
position: absolute;
right: 0;
top: 0;
width: 44px;
height: 44px;
border-left: 1px solid #787878;
background: #4c4c4c url(/cassette.axd/file/images/nav-toggle-2x-29bfa026054930272ebd6aa761f8e03ed3833bf9.png) center no-repeat;
background-size: 12px 6px
}
.hero:not(.full-screen) {
height: 100px!important
}
.scroller {
height: 0!important;
visibility: hidden!important
}
.content {
min-width: 0!important;
padding-bottom: 10px!important
}
.content.sketches {
background: url(/cassette.axd/file/images/sketch-top-left-cac4da711b026ec6abc0fc491849f09dd1a3ff01.png) top left no-repeat!important
}
.hero {
min-height: 250px
}
.hero .text {
top: auto!important;
bottom: 50px!important;
margin: 0!important;
padding: 15px!important;
background-color: rgba(102, 102, 102, .9)!important;
-webkit-transform: translateY(20px)!important;
-moz-transform: translateY(20px)!important;
transform: translateY(20px)!important
}
.hero .slide.current .text {
-webkit-transform: translateY(0)!important;
-moz-transform: translateY(0)!important;
transform: translateY(0)!important
}
.slideshow .arrow {
width: 50%!important;
height: 50px!important;
top: auto!important;
bottom: 0;
margin-top: 0!important
}
.hero .text .paragraph {
font-size: 100%!important
}
.form .column {
margin-bottom: 0!important
}
.button {
width: 100%
}
.img-responsive {
max-width: 100%!important
}
.embed,
.embed embed {
max-width: 100%!important
}
}
html {
height: 100%
}
body {
height: 100%;
background: #fff
}
form {
height: 100%
}
.accelerate {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden
}
.image,
.images {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #252525;
overflow: hidden;
display: block
}
.row {
margin-top: 20px;
margin-bottom: 20px
}
.row.nomargin {
margin: 0
}
.row.top {
margin-top: 0
}
header {
position: fixed;
width: 100%;
z-index: 4;
background: #fff;
-webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
-moz-box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
-webkit-transition: opacity 1000ms;
-moz-transition: opacity 1000ms;
transition: opacity 1000ms
}
header.active {
opacity: .95;
filter: alpha(opacity=95)
}
header .bounds {
height: 120px
}
a.logo {
position: absolute;
left: 10px;
top: 20%;
height: 60%;
-webkit-transition-property: height, top, margin-top;
-webkit-transition-duration: 300ms;
-moz-transition-property: height, top, margin-top;
-moz-transition-duration: 300ms;
transition-property: height, top, margin-top;
transition-duration: 300ms
}
.logo.active {
top: 50%;
height: 51px;
margin-top: -18px
}
.logo img.logo-main {
position: absolute;
top: 0;
height: 75%;
width: auto
}
.logo img.logo-chemical {
position: absolute;
z-index: -1;
left: 0;
top: 56%;
height: 75%;
-webkit-transition-property: height, left, top;
-webkit-transition-duration: 300ms;
-moz-transition-property: height, left, top;
-moz-transition-duration: 300ms;
transition-property: height, left, top;
transition-duration: 300ms
}
.logo.active img.logo-chemical {
left: 95px;
top: -10%;
height: 110%
}
input[type=text]::-ms-clear {
display: none
}
.bg-gray {
background-color: #f2f2f2;
padding: 25px;
margin-top: 30px
}
nav {
position: absolute;
z-index: 999;
right: 10px;
top: 50%;
margin-top: -16px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 85%
}
nav ul {
margin: 0;
list-style: none
}
nav li,
nav a {
display: block
}
nav a {
line-height: normal;
white-space: nowrap;
font-weight: 700
}
header nav ul.main>li {
position: relative;
float: left;
margin: 0
}
header nav ul.main>li>a {
color: #666;
font-size: 100%;
padding: 10px 14px 8px;
text-transform: uppercase;
border-right: 1px solid #d0d0d0
}
header nav ul.main>li:hover>a {
background-color: #656565;
color: #fff
}
header nav ul.main .dropdown {
display: block;
position: absolute;
visibility: hidden;
opacity: 0;
filter: alpha(opacity=0);
background-color: #fff;
-webkit-transition: opacity .1s, visibility 0;
-webkit-transition-delay: 0, .1s;
-moz-transition: opacity .1s, visibility 0;
-moz-transition-delay: 0, .1s;
transition: opacity .1s, visibility 0;
transition-delay: 0, .1s;
padding: 10px;
left: 0;
top: 100%;
min-width: 100%;
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
-moz-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
box-shadow: 0 2px 5px rgba(0, 0, 0, .5)
}
header nav ul.main .dropdown.has-image {
padding: 10px 10px 10px 220px
}
header nav ul.main .dropdown.right {
left: auto;
right: 0
}
header nav .dropdown .image {
display: block;
position: absolute;
left: 10px;
top: 10px;
bottom: 10px;
height: auto;
width: 200px;
overflow: hidden
}
header nav ul.main ul li {
position: relative
}
header nav ul.main li:hover .dropdown {
visibility: visible;
opacity: 1;
filter: alpha(opacity=100);
-webkit-transition: opacity .1s;
-moz-transition: opacity .1s;
transition: opacity .1s
}
header nav ul.main ul a {
padding: 10px 18px;
color: #303030
}
header nav ul.main ul li>a:hover {
background-color: #f2f2f2;
color: #303030
}
#search {
position: static;
padding: 0;
margin-left: 10px
}
#share {
padding: 0
}
#search>a,
#share>a {
position: relative;
display: block;
padding: 0;
width: 35px;
height: 35px;
overflow: hidden;
text-indent: -9999em;
border-right: none
}
#share>a {
background-image: url(/cassette.axd/file/images/icon-nav-share-4727c904440f429d04be7771241f97d8abe2c585.png);
background-position: left top;
background-repeat: no-repeat
}
#share>a:hover {
background-position: left bottom
}
header.search-active #search>a {
background-color: #4566a2
}
#search a span {
position: absolute;
display: block;
width: 100%;
height: 100%;
background-position: center;
background-repeat: no-repeat;
-webkit-transition: opacity 100ms, -webkit-transform 100ms;
-moz-transition: opacity 100ms, -moz-transform 100ms;
transition: opacity 100ms, transform 100ms
}
#search .icon-dark {
opacity: 1;
filter: alpha(opacity=100);
background-image: url(/cassette.axd/file/images/icon-search-dark-dacb4540280768289542548ba9f2a25fe021c918.png)
}
#search .icon-light {
opacity: 0;
filter: alpha(opacity=0);
background-image: url(/cassette.axd/file/images/icon-search-light-113fc6130442a2c47423ae97680a323388fe1a9b.png);
-webkit-transition: opacity 100ms, -webkit-transform 100ms;
-webkit-transform: scale(1);
-moz-transition: opacity 100ms, -moz-transform 100ms;
-moz-transform: scale(1);
transition: opacity 100ms, transform 100ms;
transform: scale(1)
}
#search .icon-x {
opacity: 0;
filter: alpha(opacity=0);
background-image: url(/cassette.axd/file/images/icon-x-light-4f60ae717973ddb2f6ff4bf62e19d6cef6d258a3.png);
-webkit-transition: opacity 100ms, -webkit-transform 100ms;
-webkit-transform: scale(0);
-moz-transition: opacity 100ms, -moz-transform 100ms;
-moz-transform: scale(0);
transition: opacity 100ms, transform 100ms;
transform: scale(0)
}
#search:hover>a .icon-dark,
header.search-active #search>a .icon-dark {
opacity: 0;
filter: alpha(opacity=0);
display: none
}
#search:hover>a .icon-light {
opacity: 1;
filter: alpha(opacity=100);
display: block
}
header.search-active #search>a .icon-light {
opacity: 0;
filter: alpha(opacity=0);
display: none;
-webkit-transform: scale(0);
-moz-transform: scale(0);
transform: scale(0)
}
header.search-active #search>a .icon-x {
opacity: 1;
filter: alpha(opacity=100);
display: block;
-webkit-transform: scale(1);
-moz-transform: scale(1);
transform: scale(1)
}
.search-field {
visibility: hidden;
position: absolute;
opacity: 0;
filter: alpha(opacity=0);
left: 0;
right: 0;
top: 0;
height: 35px;
background: #e1e1e1;
-webkit-transition: opacity 200ms, visibility;
-webkit-transition-delay: 0, 200ms;
-moz-transition: opacity 200ms, visibility;
-moz-transition-delay: 0, 200ms;
transition: opacity 200ms, visibility;
transition-delay: 0, 200ms
}
header.search-active .search-field {
visibility: visible;
opacity: 1;
filter: alpha(opacity=100);
display: block;
-webkit-transition-delay: 200ms;
-moz-transition-delay: 200ms;
transition-delay: 200ms
}
#search input[type="text"],
#search label {
position: absolute!important;
left: 0;
right: 35px;
top: 0;
background: transparent;
border: none;
padding: 8px 12px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
-webkit-font-smoothing: antialiased;
font-size: 120%
}
#search label {
left: 1px;
top: -2px;
color: #666
}
#search input[type="submit"] {
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 35px;
background: #4566a2 url(/cassette.axd/file/images/icon-search-light-2x-aef9ba91690404b10cd9377789afd38a3081a82e.png) center no-repeat;
background-size: 16px;
border: none
}
.hero {
min-width: 960px;
position: relative;
width: 100%;
height: 275px;
background-color: #202020;
overflow: hidden;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.hero .bounds {
display: block;
height: 100%
}
.slideshow .arrow {
cursor: pointer;
position: absolute;
z-index: 3;
width: 70px;
height: 70px;
top: 50%;
margin-top: -35px;
background-color: #404040;
background-position: center center;
background-repeat: no-repeat;
opacity: .8;
filter: alpha(opacity=80);
-webkit-transition: opacity 200ms;
-moz-transition: opacity 200ms;
transition: opacity 200ms
}
.slideshow .arrow:hover {
opacity: .9;
filter: alpha(opacity=90)
}
.slideshow .sPrev {
left: 0;
background-image: url(/cassette.axd/file/images/arrow-left-light-70676ea06cc1a39edc17a2911618084f5203ad7b.png)
}
.slideshow .sNext {
right: 0;
background-image: url(/cassette.axd/file/images/arrow-right-light-77e723e288f3f50726e4d25ae7333a7ad6ec2d9c.png)
}
.hero .slide .text {
position: absolute;
display: block;
top: 50%;
background: #666;
padding: 35px;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transform: translateX(-20px);
-webkit-transition-property: opacity, -webkit-transform;
-webkit-transition-duration: 500ms;
-moz-transform: translateX(-20px);
-moz-transition-property: opacity, -moz-transform;
-moz-transition-duration: 500ms;
transform: translateX(-20px);
transition-property: opacity, transform;
transition-duration: 500ms
}
.hero .slide.current .text {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
transform: translateX(0);
opacity: 1;
filter: alpha(opacity=100)
}
.slider-learn-more {
font-size: 90%;
text-transform: uppercase;
color: #fff;
margin-top: 12px;
display: block
}
.slider-learn-more span {
cursor: pointer
}
.slider-learn-more span:hover {
color: #e1e1e1
}
.hero .slide.transitioning img {
-webkit-animation-name: image-zoom;
-webkit-animation-duration: 750ms;
-webkit-animation-fill-mode: forwards;
-webkit-animation-iteration-count: 1;
-webkit-animation-timing-function: ease;
-moz-animation-name: image-zoom;
-moz-animation-duration: 750ms;
-moz-animation-fill-mode: forwards;
-moz-animation-iteration-count: 1;
-moz-animation-timing-function: ease;
animation-name: image-zoom;
animation-duration: 750ms;
animation-fill-mode: forwards;
animation-iteration-count: 1;
animation-timing-function: ease
}
@-webkit-keyframes image-zoom {
0% {
-webkit-transform: scale(1.02)
}
100% {
-webkit-transform: scale(1)
}
}
@-moz-keyframes image-zoom {
0% {
-moz-transform: scale(1.02)
}
100% {
-moz-transform: scale(1)
}
}
@keyframes image-zoom {
0% {
transform: scale(1.02)
}
100% {
transform: scale(1)
}
}
.hero .text .heading {
display: block;
color: #aaa;
font-size: 90%;
padding-bottom: 15px;
margin-bottom: 10px;
border-bottom: 1px solid #aaa;
text-transform: uppercase;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif
}
.hero .text .paragraph {
display: block;
color: #fff;
font-size: 150%;
line-height: 1.5em;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif
}
.compact .text {
padding: 25px
}
.compact .text .paragraph {
font-size: 130%
}
.hero h2 {
position: absolute;
left: 10px;
bottom: 15px;
color: #fff
}
.scroller {
cursor: pointer;
display: block;
position: absolute;
z-index: 2;
left: 0;
top: 0;
width: 100%;
height: 70px;
line-height: 70px;
text-align: center;
opacity: 0;
filter: alpha(opacity=0);
background: #fff;
visibility: hidden;
-webkit-transition-property: opacity, visibility;
-webkit-transition-duration: 200ms;
-moz-transition-property: opacity, visibility;
-moz-transition-duration: 200ms;
transition-property: opacity, visibility;
transition-duration: 200ms;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.scroller.active {
opacity: 1;
filter: alpha(opacity=100);
visibility: visible
}
.scroller img {
margin-left: 4px
}
.breadcrumbs {
position: relative;
font-size: 90%;
padding: 10px 0;
overflow: hidden;
min-height: 23px
}
.breadcrumbs ul {
margin-top: 0;
margin-bottom: 0;
list-style: none
}
.breadcrumbs .bounds ul {
margin-left: 0;
padding-right: 160px
}
.breadcrumbs li {
display: block;
float: left;
padding-right: 20px;
margin-right: 10px;
background: url(/cassette.axd/file/images/breadcrumb-arrow-137ac04a41ac94f62e7213d8c8a5c42d0f8688f7.png) right center no-repeat
}
.breadcrumbs li.back {
padding-left: 20px;
padding-right: 0;
background: url(/cassette.axd/file/images/breadcrumb-arrow-left-3f49a22d4779e36552a0a19de00c3d01f04a9499.png) left center no-repeat
}
.breadcrumbs li.last {
background: none
}
.breadcrumbs a {
display: block
}
.breadcrumbs a.print,
.breadcrumbs a.share {
position: absolute;
right: 10px;
border: 1px solid #b3b3b3;
padding: 4px 8px;
border-radius: 3px;
color: #404040;
background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .1)
}
.breadcrumbs .page-tools {
position: absolute;
right: 10px
}
.breadcrumbs .page-tools a {
display: inline-block;
position: relative!important;
right: auto!important
}
.breadcrumbs a.print:hover,
.breadcrumbs a.share:hover {
background-color: rgba(255, 255, 255, .5);
border-color: #999
}
.breadcrumbs a.print:before,
.breadcrumbs a.share:before {
content: "";
display: inline-block;
width: 14px;
height: 14px;
vertical-align: -2px;
margin-right: 5px;
opacity: .3
}
.breadcrumbs a.print:before {
background: url(/cassette.axd/file/images/icon-print-e04e4ef07c795ef9da958647977b4c9bf5cbacb8.png)
}
.breadcrumbs a.share:before {
background: url(/cassette.axd/file/images/icon-share-8fc2d23fe4f32153e49dc83e0dbd55e9055e6b37.png)
}
.sidenav ul {
margin: 20px 0 0;
list-style: none;
border-top-width: 1px;
border-style: solid;
border-color: #ddd
}
.sidenav li {
display: block;
font-size: 130%;
border-bottom-width: 1px;
border-style: inherit;
border-color: inherit
}
.sidenav a {
display: block;
padding: 6px 0;
-webkit-transition: -webkit-transform 200ms ease;
-moz-transition: -moz-transform 200ms ease;
transition: transform 200ms ease
}
.sidenav a:hover {
-webkit-transform: translateX(6px);
-moz-transform: translateX(6px);
transform: translateX(6px)
}
.sidenav a.selectedtrue {
color: #202020
}
.file-download,
.sidenav-link {
position: relative;
padding-left: 23px!important
}
a.file-download:before {
content: "";
position: absolute;
left: 0;
top: 5px;
width: 16px;
height: 18px;
background: url(/cassette.axd/file/images/icon-document-0372cde6085d9eabcd71cd77d89c6e4c0ac2e0d9.png)
}
a.icon-news:before {
content: "";
display: inline-block;
width: 16px;
height: 16px;
margin-right: 6px;
vertical-align: -1px;
background: url(/cassette.axd/file/images/icon-news-f2298c6d52d1fa36423b332447582cc675698220.png)
}
.content {
min-width: 960px;
position: relative;
padding: 40px 0 80px
}
.content .column.span8 h2 {
color: #24abdd
}
.bg-light-grey {
background-color: #f2f2f2;
border-color: #f2f2f2
}
.bg-blue {
background-color: #0e0e0e;
border-color: #0e0e0e;
color: #f2f2f2
}
.content.sketches {
background: url(/cassette.axd/file/images/sketch-top-left-cac4da711b026ec6abc0fc491849f09dd1a3ff01.png) top left no-repeat, url(/cassette.axd/file/images/sketch-top-right-1fea00c0f6f4b896d885d32d37924b93867fb6bc.png) top right no-repeat
}
h1.tab {
opacity: 0;
filter: alpha(opacity=0);
width: 100%;
height: 0;
z-index: 2;
top: -90px;
margin: 0 auto;
font-weight: 300;
font-size: 160%;
text-transform: uppercase;
background: inherit;
border-color: inherit;
-webkit-transition: opacity 200ms;
-moz-transition: opacity 200ms;
transition: opacity 200ms
}
h1.tab.center {
text-align: center
}
h1.tab.active {
opacity: 1;
filter: alpha(opacity=100)
}
h1.tab span {
display: inline-block;
position: relative;
background: inherit;
border-color: inherit;
line-height: 75px;
height: 50px;
font-size: 140%;
padding: 0 20px;
margin-left: -20px
}
h1.tab.center span {
margin-left: 0
}
h1.tab span:before,
h1.tab span:after {
display: block;
content: "";
position: absolute;
z-index: -1;
bottom: 0;
border: 50px solid transparent;
border-bottom-color: inherit;
border-top-width: 0
}
h1.tab span:before {
left: -50px
}
h1.tab span:after {
right: -50px
}
.kickers {
min-width: 920px;
padding: 0 20px;
overflow: hidden
}
.kicker {
display: block
}
.kicker>.text {
display: block;
padding: 5px 0 15px
}
.kicker p {
color: #303030
}
.kickers .column {
padding: 0 20px;
height: 100%
}
.kickers .image-wrapper {
position: relative;
display: block;
height: 150px;
line-height: 150px;
font-size: 140%;
margin-bottom: 15px
}
.image .overlay {
display: block;
position: absolute;
opacity: 0;
filter: alpha(opacity=0);
z-index: 100;
left: 0;
top: 0;
right: 0;
bottom: 0;
text-align: center;
color: #fff;
text-transform: uppercase;
font-family: "museo-sans-condensed", sans-serif;
background: rgba(20, 20, 20, .8);
-webkit-transition: opacity 300ms ease;
-moz-transition: opacity 300ms ease;
transition: opacity 300ms ease
}
.ie8 .image .overlay {
background: url(/cassette.axd/file/images/alpha-black80-8dfd8bbe39d16a69a1af2d973e44819d07847e2a.png) repeat
}a
.image .text {
position: relative;
-webkit-transition-property: padding-right;
-webkit-transition-duration: 300ms;
-webkit-transition-timing-function: ease;
-moz-transition-property: padding-right;
-moz-transition-duration: 300ms;
-moz-transition-timing-function: ease;
transition-property: padding-right;
transition-duration: 300ms;
transition-timing-function: ease
}
.image .arrow {
display: block;
position: absolute;
opacity: 0;
filter: alpha(opacity=0);
right: 0;
top: 0;
height: 100%;
width: 12px;
background: url(/cassette.axd/file/images/kicker-arrow-f8808763f45ec0b51515a162e376753854d5deec.png) center center no-repeat;
-webkit-transition-property: opacity;
-webkit-transition-duration: 300ms;
-webkit-transition-timing-function: ease;
-moz-transition-property: opacity;
-moz-transition-duration: 300ms;
-moz-transition-timing-function: ease;
transition-property: opacity;
transition-duration: 300ms;
transition-timing-function: ease
}
.image .play {
background: url(/cassette.axd/file/images/play-arrow-538a9f64a73d8b33aa6f8946298571efd718ec15.png) center center no-repeat
}
.zoom:hover .image .text {
padding-right: 24px;
-webkit-transition-delay: 400ms;
-moz-transition-delay: 400ms;
transition-delay: 400ms
}
.zoom:hover .image .arrow {
opacity: 0.5;
filter: alpha(opacity=100);
-webkit-transition-delay: 400ms;
-moz-transition-delay: 400ms;
transition-delay: 400ms
}
.zoom .image img {
-webkit-transition: -webkit-transform 400ms ease;
-moz-transition: -moz-transform 400ms ease;
transition: transform 400ms ease
}
.zoom:hover .image img {
-webkit-transition-duration: 6s;
-webkit-transform: scale(1.1);
-moz-transition-duration: 6s;
-moz-transform: scale(1.1);
transition-duration: 6s;
transform: scale(1.1)
}
.zoom:hover .image .overlay {
opacity: 1;
filter: alpha(opacity=100)
}
a.item {
display: block;
opacity: .6;
height: 235px;
overflow: hidden;
background: #fff;
color: #303030;
margin: 20px 0;
outline: 2px solid rgba(0, 0, 0, .3);
-webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
-moz-box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
box-shadow: 0 2px 6px rgba(0, 0, 0, .25)
}
a.item.active {
opacity: 1;
filter: alpha(opacity=100);
outline: 2px solid rgba(0, 0, 0, 0)
}
a.item:hover {
background: #f6f6f6
}
a.item .column {
position: relative;
width: 50%;
padding: 0;
height: 100%
}
a.item .image {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
line-height: 235px;
font-size: 180%
}
a.item .column>.text {
width: 385px;
padding: 0 30px 0 40px;
margin: 45px auto 0;
background: url(/cassette.axd/file/images/hex-red-e93d9680540c7a03d478e9abea5c3e7eebdf4bb6.png) left top no-repeat
}
a.item .column>.text p {
font-family: "museo-sans-condensed", sans-serif;
font-size: 165%;
line-height: 1.4em
}
a.arrow,
.post span.arrow {
position: relative;
display: inline-block;
background: #234086;
color: #fff;
padding: 8px 30px 8px 8px;
font-weight: 700
}
a.arrow:hover,
.post span.arrow:hover {
background-color: #1c4fb3
}
a.view-case-studies {
position: relative;
background: #234086;
padding: 20px 35px 20px 50px;
font-size: 130%;
color: #fff;
font-family: "museo-sans-condensed", sans-serif;
margin-top: 30px;
background-image: url(/cassette.axd/file/images/icon-case-study-9931bf6db65297fd3f8c7c190f3080c3ef4bdd5b.png);
background-position: 20px center;
background-repeat: no-repeat;
-webkit-transform: none!important;
-moz-transform: none!important;
transform: none!important;
-webkit-transition: background-color 200ms;
-moz-transition: background-color 200ms;
transition: background-color 200ms
}
a.view-case-studies:after,
a.arrow:after,
.post span.arrow:after {
content: "";
display: block;
position: absolute;
right: 15px;
top: 50%;
width: 8px;
height: 16px;
margin-top: -8px;
background: url(/cassette.axd/file/images/kicker-arrow-f8808763f45ec0b51515a162e376753854d5deec.png)
}
a.view-case-studies:hover {
background-color: #2b4ea3
}
.playButton {
display: block;
position: absolute;
z-index: 1;
opacity: .9;
left: 50%;
top: 50%;
width: 63px;
height: 63px;
margin: -31px 0 0 -31px;
background: url(/cassette.axd/file/images/icon-play-d9f6fef714ee14b78cb471ca2a4cafcfd47e144d.png) 0 0 no-repeat;
-webkit-transition: .2s opacity cubic-bezier(.51, .01, .37, .98);
-moz-transition: .2s opacity cubic-bezier(.51, .01, .37, .98);
-ms-transition: .2s opacity cubic-bezier(.51, .01, .37, .98);
-o-transition: .2s opacity cubic-bezier(.51, .01, .37, .98);
transition: .2s opacity cubic-bezier(.51, .01, .37, .98)
}
a:hover .playButton {
opacity: 1
}
.products-table h3 {
background-color: #ccc;
margin-bottom: 0;
padding: 10px
}
.bg-blue .products-table h3 {
background-color: #036
}
.products-table ul {
margin: 0 0 30px;
list-style: none;
border: 1px solid #ccc;
border-bottom-width: 0;
background: #fff
}
.bg-blue .products-table ul {
border-color: #162a5d;
border-width: 5px;
border-bottom-width: 5px;
border-top-width: 0;
background: #d9dce3
}
.products-table li {
position: relative;
border-bottom: 1px solid #ccc
}
.products-table .image-wrapper {
position: absolute;
left: 10px;
top: 10px;
width: 100px;
height: 100px;
overflow: hidden
}
.products-table a {
position: relative;
display: block;
line-height: 1.4em;
padding: 0 10px;
overflow: hidden
}
.products-table.has-photos a {
padding: 0 10px 0 120px;
min-height: 120px
}
.products-table .description {
color: #333
}
.products-table a:hover {
background: #f2f2f2
}
.content .column .products-table .column {
display: block;
padding-top: 8px;
padding-bottom: 8px
}
.tip {
position: fixed;
z-index: 999;
font-size: 125%;
padding: 10px 15px;
background: #4466a3;
color: #fff
}
.tip::before {
content: "";
display: block;
position: absolute;
left: 50%;
margin-left: -5px;
bottom: 100%;
border: 10px solid transparent;
border-top-width: 0;
border-bottom-color: #4466a3
}
a.sidenav-button {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
cursor: pointer;
position: relative;
padding: 12px 15px!important;
font-size: 100%;
display: block;
color: #fff;
background: #183f8d;
margin-bottom: 12px;
background-image: -moz-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, .2)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -ms-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to bottom, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px
}
.sidenav-button img {
float: right;
width: 27px;
height: 27px;
margin-top: -5px;
-webkit-transition: -webkit-transform 200ms ease;
-moz-transition: -moz-transform 200ms ease;
transition: transform 200ms ease
}
.sidenav-button:hover img {
-webkit-transform: translateX(4px);
-moz-transform: translateX(4px);
transform: translateX(4px)
}
.sidenav-small {
position: relative;
padding: 45px 25px 25px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px
}
a+.sidenav-small,
.sidenav-small+.sidenav-small {
margin-top: 50px
}
.sidenav-small:before {
content: "Learn More";
position: absolute;
left: 20px;
top: -33px;
height: 60px;
background: url(/cassette.axd/file/images/icon-info-926e18af18c32517b0051259811537f8a67f20e4.png);
background-repeat: no-repeat;
color: #234086;
padding: 10px 0 0 70px;
font-weight: bold;
font-size: 18px
}
.sidenav-small.people-mark:before {
background-image: url(/cassette.axd/file/images/icon-people-b3468c27aee2593ed16f79a6beee5a9456f696ff.png);
content: "";
width: auto
}
.sidenav-small p {
margin-top: 0;
font-size: 14px;
margin-bottom: 15px
}
.sidenav-small h4 {
margin-top: 1.5em;
text-transform: uppercase;
font-size: 15px
}
.sidenav-small h4:first-child {
margin-top: 0
}
.sidenav-small ul {
margin: 0;
border-top-width: 0
}
.sidenav-small li {
font-size: 100%;
border-bottom-width: 0
}
.sidenav-small a {
padding: 5px 0;
line-height: 1.2
}
.sidenav-small.bg-blue a {
color: #fff
}
.sidenav-small.bg-blue h4 {
opacity: .4;
padding-bottom: 5px;
border-bottom: 1px solid rgba(255, 255, 255, .5)
}
.sidenav-small a.kicker,
.sidenav-small a.sidenav-button {
-webkit-transform: none;
-moz-transform: none;
transform: none
}
.sidenav-small a.kicker .image-wrapper {
height: 120px;
line-height: 120px;
margin-bottom: 6px
}
.bg-blue a.file-download:before {
background: url(/cassette.axd/file/images/icon-document-white-92097ab729a6da86312cf43621a1706b6b5ae765.png)
}
.bg-blue a.sidenav-link:before {
content: "";
position: absolute;
left: 0;
top: 5px;
width: 17px;
height: 18px;
background: url(/cassette.axd/file/images/icon-arrow-right-f0229fc34d054b873df5288f46a02143f8c13fae.png)
}
.button {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
cursor: pointer;
position: relative;
padding: 12px 20px;
font-size: 120%;
display: block;
color: #fff;
text-decoration: none;
background-color: #4566a2;
background-position: 8px center;
background-repeat: no-repeat;
border: none;
-webkit-backface-visibility: hidden;
-webkit-appearance: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.popup-button-wrapper {
padding: 10px 0;
text-align: center
}
.button.download {
display: inline-block;
padding: 15px 35px
}
.button.download:hover {
color: #fff
}
.button:hover {
background-color: #3b5992
}
.button.icon {
padding-left: 34px
}
.icon.email {
background: url(/images/icon-mail.png) 0 center no-repeat;
padding: 4px 0 4px 20px;
line-height: 12px;
margin-right: 7px
}
.icon.phone {
background: url(/images/icon-phone.png) 0 center no-repeat;
padding: 4px 0 4px 20px;
line-height: 12px
}
.input-wrapper {
position: relative;
background: #fff;
margin-bottom: 20px
}
.input-wrapper label {
line-height: normal;
left: 12px;
top: 10px;
color: #999;
overflow: hidden;
height: 20px;
padding-right: 10px
}
.input-wrapper.textarea label {
left: 11px
}
.input-wrapper input[type="text"],
.input-wrapper input[type="password"],
.input-wrapper textarea {
width: 100%;
max-width: 100%;
padding: 9px 10px;
border: 1px solid #999;
background: transparent;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased
}
textarea {
min-height: 150px
}
.validator {
position: absolute;
z-index: 2;
right: 0;
top: 0;
width: 36px;
height: 100%;
background: #912028 url(/cassette.axd/file/images/icon-validation-e7f7f98dc0abb0cde3511571523066ee5aef9fba.png) center no-repeat
}
.ss-wrapper {
background: #fff url(/cassette.axd/file/images/select-arrow-5359cc09b80248267189200dbc06af5287d329c4.png) right center no-repeat;
padding: 11px 10px 10px;
border: 1px solid #999;
-webkit-transition: background 200ms;
-moz-transition: background 200ms;
transition: background 200ms
}
.ss-wrapper.focus {
background-color: #eee
}
#backToTop {
display: block;
visibility: hidden;
opacity: 0;
position: fixed;
z-index: 100;
background: #90918f;
right: 0;
bottom: 10%;
width: 43px;
height: 39px;
-webkit-border-radius: 20px 0 0 20px;
-moz-border-radius: 20px 0 0 20px;
-ms-border-radius: 20px 0 0 20px;
-o-border-radius: 20px 0 0 20px;
border-radius: 20px 0 0 20px;
-webkit-transition: opacity 200ms linear, visibility 1ms linear 200ms;
-moz-transition: opacity 200ms linear, visibility 1ms linear 200ms;
-o-transition: opacity 200ms linear, visibility 1ms linear 200ms;
transition: opacity 200ms linear, visibility 1ms linear 200ms
}
#backToTop .arrow {
position: absolute;
background: #a9aaa9 url(/cassette.axd/file/images/arrow-up-a88641dbf3f4329beecc70cb29764e8fe10a8350.png) center no-repeat;
top: 4px;
right: 8px;
bottom: 4px;
left: 4px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
-webkit-transition: .2s color linear, .2s background-color linear, .2s border-color linear, .2s opacity linear;
-moz-transition: .2s color linear, .2s background-color linear, .2s border-color linear, .2s opacity linear;
-ms-transition: .2s color linear, .2s background-color linear, .2s border-color linear, .2s opacity linear;
-o-transition: .2s color linear, .2s background-color linear, .2s border-color linear, .2s opacity linear;
transition: .2s color linear, .2s background-color linear, .2s border-color linear, .2s opacity linear
}
#backToTop:hover .arrow {
background-color: #c3c3c3
}
#backToTop.show {
opacity: 1;
visibility: visible;
-webkit-transition: opacity 200ms linear;
-moz-transition: opacity 200ms linear;
-o-transition: opacity 200ms linear;
transition: opacity 200ms linear
}
.list-item a {
line-height: 1.3em
}
footer {
background: #656565;
padding: 30px 0 40px;
color: #b3b3b3
}
footer p {
font-size: 80%;
color: #e1e1e1
}
.tweetWrapper {
background-color: #707070;
padding: 10px 0
}
.tweetWrapper {
color: #fff!important;
line-height: 40px;
padding-left: 20px;
font-size: 90%
}
.tweetWrapper a {
color: #fff!important;
font-weight: bold;
text-decoration: underline
}
footer h5 {
color: #fff;
text-shadow: 1px -1px 0 rgba(0, 0, 0, .1)
}
footer a:hover {
color: #fff
}
footer a {
color: #e1e1e1;
font-size: 90%
}
footer a:hover {
color: #fff
}
footer ul {
margin: 0;
list-style: none;
font-size: 90%;
line-height: 1.3em
}
footer li {
margin: .5em 0
}
footer ul.social {
line-height: 29px
}
footer ul.social li {
margin: 1em 0
}
footer ul.social a {
display: block;
height: 29px;
padding-left: 36px;
background-position: left top;
background-repeat: no-repeat;
opacity: .8;
filter: alpha(opacity=80)
}
footer ul.social a:hover {
opacity: 1;
filter: alpha(opacity=100)
}
footer ul.social a.twitter {
background-image: url(/cassette.axd/file/images/icon-twitter-interestinger-01b60387744548db5eb485176be4f1c87e70e90f.png)
}
footer ul.social a.linkedin {
background-image: url(/cassette.axd/file/images/icon-linkedin-interestinger-c760f78662f63d8ecfcd02133b6208aeafd54b19.png)
}
footer ul.social a.youtube {
background-image: url(/cassette.axd/file/images/icon-youtube-interestinger-275dc1ecf4a0b8ab4f0ea2d75f442c0923b3e992.png)
}
footer ul.social a.Gplus {
background-image: url(/cassette.axd/file/images/google_plus-a8ed219664d2038d409c6937457322e4037164be.png)
}
footer .signature {
font-size: 90%;
padding-top: 30px;
border-top: 1px solid #606060;
box-shadow: 0 -1px 0 rgba(255, 255, 255, .1)
}
footer .app-store-logo {
width: 120px;
margin-top: 2px;
margin-bottom: 5px
}
.video-container {
width: auto;
height: auto
}
.bounds {
position: relative;
max-width: 1140px;
min-width: 960px;
margin-left: auto;
margin-right: auto
}
.bounds.padding {
padding: 0 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.column {
position: relative;
float: left;
padding: 0 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.reverse>.column {
float: right
}
.span1 {
width: 8.333333%
}
.span11 .span1 {
width: 9.090909%
}
.span10 .span1 {
width: 10%
}
.span9 .span1 {
width: 11.111111%
}
.span8 .span1 {
width: 12.5%
}
.span7 .span1 {
width: 14.285714%
}
.span2,
.span6 .span1 {
width: 16.666666%
}
.span11 .span2 {
width: 18.181818%
}
.span5 .span1,
.span10 .span2 {
width: 20%
}
.span9 .span2 {
width: 22.222222%
}
.span3,
.span4 .span1,
.span8 .span2 {
width: 25%
}
.span11 .span3 {
width: 27.272727%
}
.span7 .span2 {
width: 28.571428%
}
.span10 .span3 {
width: 30%
}
.span4,
.span3 .span1,
.span6 .span2,
.span9 .span3 {
width: 33.333333%
}
.span11 .span4 {
width: 36.363636%
}
.span8 .span3 {
width: 37.5%
}
.span5 .span2,
.span10 .span4 {
width: 40%
}
.span5 {
width: 41.666666%
}
.span7 .span3 {
width: 42.857142%
}
.span9 .span4 {
width: 44.444444%
}
.span11 .span5 {
width: 45.454545%
}
.span6,
.span2 .span1,
.span4 .span2,
.span6 .span3,
.span8 .span4,
.span10 .span5 {
width: 50%
}
.span11 .span6 {
width: 54.545454%
}
.span9 .span5 {
width: 55.555555%
}
.span7 .span4 {
width: 57.142857%
}
.span7 {
width: 58.333333%
}
.span5 .span3,
.span10 .span6 {
width: 60%
}
.span8 .span5 {
width: 62.5%
}
.span11 .span7 {
width: 63.636363%
}
.span8,
.span3 .span2,
.span6 .span4,
.span9 .span6 {
width: 66.666666%
}
.span10 .span7 {
width: 70%
}
.span7 .span5 {
width: 71.428571%
}
.span11 .span8 {
width: 72.727272%
}
.span9,
.span4 .span3,
.span8 .span6 {
width: 75%
}
.span9 .span7 {
width: 77.777777%
}
.span5 .span4,
.span10 .span8 {
width: 80%
}
.span11 .span9 {
width: 81.818181%
}
.span10,
.span6 .span5 {
width: 83.333333%
}
.span7 .span6 {
width: 85.714285%
}
.span8 .span7 {
width: 87.5%
}
.span9 .span8 {
width: 88.888888%
}
.span10 .span9 {
width: 90%
}
.span11 .span10 {
width: 90.90909%
}
.span11 {
width: 91.666666%
}
.span12 {
width: 100%
}
.column .column:first-child {
padding-left: 0
}
.column .column:last-child {
padding-right: 0
}
.gap1 {
margin: 0 0 0 8.333333%
}
.gap2 {
margin: 0 0 0 16.666666%
}
.gap3 {
margin: 0 0 0 25%
}
.gap4 {
margin: 0 0 0 33.333333%
}
.gap5 {
margin: 0 0 0 41.666666%
}
.gap6 {
margin: 0 0 0 50%
}
.gap7 {
margin: 0 0 0 58.333333%
}
.gap8 {
margin: 0 0 0 66.666666%
}
.gap9 {
margin: 0 0 0 75%
}
.gap10 {
margin: 0 0 0 83.333333%
}
.gap11 {
margin: 0 0 0 91.666666%
}
.gap12 {
margin: 0 0 0 100%
}
.reverse .gap1 {
margin: 0 8.333333% 0 0
}
.reverse .gap2 {
margin: 0 16.666666% 0 0
}
.reverse .gap3 {
margin: 0 25% 0 0
}
.reverse .gap4 {
margin: 0 33.333333% 0 0
}
.reverse .gap5 {
margin: 0 41.666666% 0 0
}
.reverse .gap6 {
margin: 0 50% 0 0
}
.reverse .gap7 {
margin: 0 58.333333% 0 0
}
.reverse .gap8 {
margin: 0 66.666666% 0 0
}
.reverse .gap9 {
margin: 0 75% 0 0
}
.reverse .gap10 {
margin: 0 83.333333% 0 0
}
.reverse .gap11 {
margin: 0 91.666666% 0 0
}
.reverse .gap12 {
margin: 0 100% 0 0
}
.loading-popup {
position: fixed;
z-index: 9999;
left: 50%;
top: 50%;
width: 56px;
height: 56px;
margin-top: -28px;
margin-left: -28px;
background: #000 url(/cassette.axd/file/images/loading-d57771cfbda232bf2e32ccacbae3330e5ed8ff5f.gif) center center no-repeat;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
opacity: .8
}
.input-table {
margin: 0
}
.input-table input {
margin-right: 10px
}
.input-table label {
vertical-align: middle
}
p.small {
font-size: 11px
}
.aspNetDisabled {
visibility: hidden
}
@media print {
* {
background: none;
color: #303030
}
body {
background: none;
padding: 30px
}
.web-address {
position: absolute;
right: 0;
top: 20px;
font-size: 220%;
color: #999
}
.page-header .info {
max-height: 100%;
overflow: hidden
}
.cs-container-fullwidth,
.cs-container-fullwidth-alt {
background-image: none!important
}
.blue-callout {
display: none
}
.bread-crumbs {
display: none
}
.toggle {
display: none!important
}
.no-print,
.breadcrumbs,
.sPrev,
.sNext,
.share,
.languages,
.back {
display: none
}
.bg-blue .products-table ul {
border: none!important
}
.post-image {
position: relative;
overflow: hidden;
background-color: rgba(0, 0, 0, .2);
width: 100%
}
.post-image img {
width: 100%
}
.date {
position: absolute;
top: 0;
left: 0;
color: #fff;
background-color: #00abd4;
width: 60px;
padding: 15px;
font-weight: bold;
text-align: center
}
.date .month {
text-transform: uppercase
}
.date .day {
font-size: 180%;
opacity: .6
}
.post {
display: block
}
.posts-wrapper {
width: 100%
}
}
/*! fancyBox v2.1.4 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
padding: 0;
margin: 0;
border: 0;
outline: none;
vertical-align: top
}
.fancybox-wrap {
position: absolute;
top: 0;
left: 0;
z-index: 8020
}
.fancybox-skin {
position: relative;
background: #f9f9f9;
color: #444;
text-shadow: none;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px
}
.fancybox-opened {
z-index: 8030
}
.fancybox-opened .fancybox-skin {
-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, .5);
-moz-box-shadow: 0 10px 25px rgba(0, 0, 0, .5);
box-shadow: 0 10px 25px rgba(0, 0, 0, .5)
}
.fancybox-outer,
.fancybox-inner {
position: relative
}
.fancybox-inner {
overflow: hidden
}
.fancybox-type-iframe .fancybox-inner {
-webkit-overflow-scrolling: touch
}
.fancybox-error {
color: #444;
font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: 0;
padding: 15px;
white-space: nowrap
}
.fancybox-image,
.fancybox-iframe {
display: block;
width: 100%;
height: 100%
}
.fancybox-image {
max-width: 100%;
max-height: 100%
}
#fancybox-loading,
.fancybox-close,
.fancybox-prev span,
.fancybox-next span {
background-image: url('/cassette.axd/file/fancybox/fancybox_sprite-17df19f97628e77be09c352bf27425faea248251.png')
}
#fancybox-loading {
position: fixed;
top: 50%;
left: 50%;
margin-top: -22px;
margin-left: -22px;
background-position: 0 -108px;
opacity: .8;
cursor: pointer;
z-index: 8060
}
#fancybox-loading div {
width: 44px;
height: 44px;
background: url('/cassette.axd/file/fancybox/fancybox_loading-48673ea547f521de42a1a2057df6939cafda7ae5.gif') center center no-repeat
}
.fancybox-close {
position: absolute;
top: -18px;
right: -18px;
width: 36px;
height: 36px;
cursor: pointer;
z-index: 8040
}
.fancybox-nav {
position: absolute;
top: 0;
width: 40%;
height: 100%;
cursor: pointer;
text-decoration: none;
background: transparent url('/cassette.axd/file/fancybox/blank-2daeaa8b5f19f0bc209d976c02bd6acb51b00b0a.gif');
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
z-index: 8040
}
.fancybox-prev {
left: 0
}
.fancybox-next {
right: 0
}
.fancybox-nav span {
position: absolute;
top: 50%;
width: 36px;
height: 34px;
margin-top: -18px;
cursor: pointer;
z-index: 8040;
visibility: hidden
}
.fancybox-prev span {
left: 10px;
background-position: 0 -36px
}
.fancybox-next span {
right: 10px;
background-position: 0 -72px
}
.fancybox-nav:hover span {
visibility: visible
}
.fancybox-tmp {
position: absolute;
top: -99999px;
left: -99999px;
visibility: hidden;
max-width: 99999px;
max-height: 99999px;
overflow: visible!important
}
.fancybox-lock {
overflow: hidden
}
.fancybox-overlay {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
display: none;
z-index: 8010;
background: url('/cassette.axd/file/fancybox/fancybox_overlay-b3a4ee645ba494f52840ef8412015ba0f465dbe0.png')
}
.fancybox-overlay-fixed {
position: fixed;
bottom: 0;
right: 0
}
.fancybox-lock .fancybox-overlay {
overflow: auto;
overflow-y: scroll
}
.fancybox-title {
visibility: hidden;
font: normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
position: relative;
text-shadow: none;
z-index: 8050
}
.fancybox-opened .fancybox-title {
visibility: visible
}
.fancybox-title-float-wrap {
position: absolute;
bottom: 0;
right: 50%;
margin-bottom: -35px;
z-index: 8050;
text-align: center
}
.fancybox-title-float-wrap .child {
display: inline-block;
margin-right: -100%;
padding: 2px 20px;
background: transparent;
background: rgba(0, 0, 0, .8);
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
text-shadow: 0 1px 2px #222;
color: #fff;
font-weight: bold;
line-height: 24px;
white-space: nowrap
}
.fancybox-title-outside-wrap {
position: relative;
margin-top: 10px;
color: #fff
}
.fancybox-title-inside-wrap {
padding-top: 10px
}
.fancybox-title-over-wrap {
position: absolute;
bottom: 0;
left: 0;
color: #fff;
padding: 10px;
background: #000;
background: rgba(0, 0, 0, .8)
}
