@charset "UTF-8";
/*****************************************************************************/
/*
/* Variables 
/*
/*****************************************************************************/
/*****************************************************************************/
/*
/* Layout tweaks
/*
/*****************************************************************************/
/* http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/* Global reset */
/* http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix { zoom: 1; }

.clearfix:before, .clearfix:after { display: table; line-height: 0; content: ""; }

.clearfix:after { clear: both; }

/*****************************************************************************/
/*
/* Extends and mixins
/*
/*****************************************************************************/
.button, .button-secondary, .button-confirm, #footer .button-footer { text-align: center; color: #3a6dc0; border-radius: 6px; border-style: solid; border-width: 1px; border-color: #3399ff; max-width: 250px; width: 100%; margin: 0 auto; }

.button a, .button-secondary a, .button-confirm a, #footer .button-footer a { font-size: 16px; font-size: 1rem; color: #3a6dc0; padding: 10px 20px; padding: 0.6rem 1.25rem; width: 100%; display: block; }

/*****************************************************************************/
/*
/* flexbox
/*
/*****************************************************************************/
.flexbox-nowrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; -ms-flex-wrap: none; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; justify-content: center; width: 100%; max-width: 1200px; margin: auto; text-align: center; }

.flexbox-nowrap.flex-left-text { text-align: left; }

.flexbox-wrapped { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; width: 100%; max-width: 1200px; margin: auto; text-align: center; }

.flexbox { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; margin: auto; max-width: 1200px; }

.flexbox > div:nth-child(1) { -ms-flex: 0 0 auto; -webkit-flex: 0 0 auto; flex: 0 0 auto; }

/*****************************************************************************/
/*
/* Common
/*
/*****************************************************************************/
/* Global Reset */
html, body { height: 100%; }

html { font-size: 18px; }

@media screen and (min-width: 948px) { html { font-size: 18px; } }

@media screen and (min-width: 1120px) { html { font-size: 18px; } }

body { margin: 0; padding: 0; background-color: #003f58; font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 100%; }

.article { border-top-color: #d1d1d1; border-top-style: solid; border-top-width: 8px; background-color: #fff; padding-bottom: 40px; }

.article-two-column { max-width: 1200px; margin: 0 auto; border-style: none; }

@media screen and (max-width: 948px) { .article-two-column { padding-bottom: 8px; } }

.article-two-column h1 { font-size: 1.5em; margin: 0; text-align: left; }

.article-two-column h4 { margin: 0; text-align: left; color: #000; }

a { color: #3a6dc0; text-decoration: none; }

a:hover { color: #3a6dc0; text-decoration: underline; }

a:visited { color: #3a6dc0; text-decoration: none; }

p, li, table { color: #4e4e4e; line-height: 26px; line-height: 1.5rem; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; }

h2 { font-size: 2rem; margin: 1.5rem 0; color: #424242; font-weight: 600; }

h3 { font-size: 26px; margin: 12px 8px; font-size: 1.6rem; margin: 0.75rem 0rem 0.75rem; color: #424242; font-weight: 500; }

h3 a { color: #3a6dc0; }

h4 { font-size: 19px; margin: 0px 0px 5px; font-size: 1.25rem; color: #8e8e8e; font-weight: 300; }

h4 a { color: #3a6dc0; }

h4.versions { font-size: 18px; margin: 12px 8px; font-size: 1.1rem; margin: 0.75rem 0.5rem; color: #253746; font-style: normal; font-weight: 500; }

.versions-wrapper > h4.versions { margin-top: 10px; }

p { margin-bottom: 10px; margin-top: 5px; }

p.versions { font-size: 18px; margin: 12px 8px; font-size: 1.1rem; margin: 0.75rem 0.5rem 1.5rem; color: #253746; font-style: normal; font-weight: 500; }

.wrapper { max-width: 1200px; margin: 0 auto; }

.content-padding, #footer .wrapper { padding: 16px 12px; padding: 1rem 0.75rem; }

li { display: list-item; }

ul { padding-left: 32px; padding-left: 2rem; }

figure { margin: 0; }

img { max-width: 100%; }

b { font-weight: 600; }

h1.main-header { font-size: 3em; font-weight: 300; margin-bottom: 10px; margin-top: 0; line-height: 1.1em; padding-top: 70px; text-align: center; }

p.small-text { font-size: 14px; font-size: 0.9rem; }

ul.editions-list { margin-top: 8px; margin-top: 0.5rem; padding-left: 20px; font-size: 14px; list-style-type: none; }

ul.editions-list li { color: white; line-height: 1.5; }

ul.small-list { margin-top: 8px; margin-top: 0.5rem; padding-left: 0; list-style-type: none; }

ul.small-list li { font-size: 14px; font-size: 0.9rem; padding-bottom: 8px; padding-bottom: 0.5rem; line-height: 22px; line-height: 1.4rem; }

h3.small-header { font-size: 19px; font-size: 1.2rem; margin-bottom: 12px; margin-bottom: 0.75rem; margin-left: 0; }

hr { border: 0; height: 1px; background: #d1d1d1; margin: 40px 0 40px; margin: 2.5rem 0 2.5rem; }

.text-left { text-align: left; }

.text-right { text-align: right; }

.text-center { text-align: center; }

.bottom-border { border-bottom: solid 1px #cccccc; }

.margin-bottom-20 { margin-bottom: 20px; }

.margin-bottom-40 { margin-bottom: 40px; }

.margin-bottom-80 { margin-bottom: 80px; }

.margin-top-40 { margin-top: 40px; }

.breadcrumbs { display: inline-block; margin-top: 10px; padding-left: 15px; }

.breadcrumbs li { display: inline; list-style-type: none; padding-right: 5px; font-size: 15px; }

.breadcrumbs li > a { color: #3b88d4; }

.breadcrumbs li.divider { color: #3b88d4; }

.breadcrumbs li.active { color: #999999; }

/*****************************************************************************/
/*
/* Footer
/*
/*****************************************************************************/
#footer { position: relative; z-index: 1; text-align: center; background-color: #003f58; }

#footer .button-confirm, #footer .button-secondary { max-width: 12rem; margin-top: 1rem; }

#footer .button-footer { margin-top: 7px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-color: #fff; color: #fff; }

#footer .button-footer:hover { border-color: #d4d4d4; color: #d4d4d4; }

#footer .button-footer a { text-shadow: none; }

#footer hr { border: 0; background-color: #d1d1d1; color: #d1d1d1; height: 1px; margin: 8px 0; margin: 0.5rem 0; clear: both; }

@media screen and (min-width: 650px) { #footer hr { display: none; } }

#footer .wrapper { padding-top: 32px; padding-bottom: 48px; padding-top: 2rem; padding-bottom: 3rem; }

#footer p, #footer h3 { font-size: 18px; font-size: 1rem; color: #fff; margin: 4px 0 0; line-height: 25px; margin: 0.25rem 0 0; line-height: 1.3rem; }

#footer h3 { font-weight: 400; margin-top: 16px; margin-top: 1rem; color: #3399ff; }

#footer p > a { color: #fff; }

#footer p > a:visited { color: #fff; }

#footer p > a:hover { color: #fff; }

.button a.contact-button-text, .button-secondary a.contact-button-text, .button-confirm a.contact-button-text, #footer .button-footer a.contact-button-text { color: #fff; }

.button a.contact-button-text:hover, .button-secondary a.contact-button-text:hover, .button-confirm a.contact-button-text:hover, #footer .button-footer a.contact-button-text:hover { color: #fff; }

.button a.contact-button-text:visited, .button-secondary a.contact-button-text:visited, .button-confirm a.contact-button-text:visited, #footer .button-footer a.contact-button-text:visited { color: #fff; }

#footer-company, #footer-contact, #footer-navigation { width: 100%; padding-right: 8px; padding-right: 0.5rem; }

#footer-company img, #footer-contact img, #footer-navigation img { max-width: 172px; max-width: 9rem; }

@media screen and (min-width: 650px) { #footer-company, #footer-contact, #footer-navigation { width: 33.33%; float: left; } }

.column-70 { width: 70%; }

.column-60 { width: 60%; }

.column-40 { width: 40%; }

.column-30 { width: 30%; }

.padding-40 { padding: 40px; }

/*****************************************************************************/
/*
/* Header (& other full width blocks)
/*
/*****************************************************************************/
#header, #home-contact, #evaluate-product, .product-full-width-block { padding: 0; margin: 0; background-color: #004c97; height: 70px; position: relative; z-index: 3; }

#header #logo, #home-contact #logo, #evaluate-product #logo, .product-full-width-block #logo { background: url("/img/header-logo.png") no-repeat center center; background-size: contain; float: left; height: 70px; width: 213px; opacity: 1; }

#header #logo a, #home-contact #logo a, #evaluate-product #logo a, .product-full-width-block #logo a { height: 70px; width: 213px; }

#header #logo p, #home-contact #logo p, #evaluate-product #logo p, .product-full-width-block #logo p { text-indent: -9999px; }

@media screen and (-webkit-min-device-pixel-ratio: 1.3), screen and (min--moz-device-pixel-ratio: 1.3), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 1.3), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) { #header #logo, #home-contact #logo, #evaluate-product #logo, .product-full-width-block #logo { background-image: url("/img/header-logo@2x.png"); } }

#header.home { background: url("/img/header_main.jpg") no-repeat center 65% scroll; }

#header.header-java-sdk { background: url("/img/backgrounds/255891.jpg") no-repeat center center scroll; }

#header.header-online-course { background-color: #dac398; background: url("/img/backgrounds/online_course.jpg") no-repeat center center scroll; }

#header.header-delphi-sdk { background: url("/img/header_sentrol.jpg") no-repeat center center scroll; }

#header.header-sentrol-sdk { background: url("/img/header_sentrol.jpg") no-repeat center center scroll; }

#header.header-historian { background: url("/img/header-product-historian.jpg") no-repeat center center scroll; }

#header.header-modbus-server { background: url("/img/header-product-modbus-server.jpg") no-repeat center center scroll; }

#header.header-forge { background: url("/img/header-product-client-pro_beta.jpg") no-repeat center center scroll; }

#header.header-free-tools { background: #254577; }

#header.header-classic-opc { background: #4d2da5; }

#header.header-file-transfer { background: url("/img/header-product-file-transfer.jpg") no-repeat center center scroll; }

#product-header.opc-ua-product p.version-text { margin: 0 2rem 1.5rem 2rem; font-size: 1rem; }

#home-contact { background: url("/img/contact-home.jpg") no-repeat center center scroll; }

#historian-evaluate { background-color: #0d233b; }

#header.home, #home-contact, #historian-evaluate { height: auto; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }

#header.home h1, #home-contact h1, #historian-evaluate h1 { text-align: center; font-weight: 400; padding-top: 90px; font-size: 40px; font-size: 2.7rem; color: #ffffff; line-height: 50px; margin: 0; }

#header.home h2, #home-contact h2, #historian-evaluate h2 { color: #ffffff; text-align: center; font-weight: 300; font-size: 2rem; margin: 0; padding-top: 5px; padding-bottom: 60px; }

#header.home p, #home-contact p, #historian-evaluate p { font-size: 24px; font-size: 1.3rem; color: #ffffff; line-height: 33px; line-height: 1.9rem; padding: 0; max-width: 850px; margin: 16px 0 0 16px; margin: 1rem 0 0 1rem; font-weight: 300; }

#header.home .nav-collapse a, #home-contact .nav-collapse a, #historian-evaluate .nav-collapse a { background-color: transparent; }

#header.home .nav-collapse a:hover, #home-contact .nav-collapse a:hover, #historian-evaluate .nav-collapse a:hover { background-color: #ffffff; }

#header.home .button-confirm, #home-contact .button-confirm, #historian-evaluate .button-confirm { float: left; margin-left: 1rem; margin-bottom: 2.5rem; max-width: 15rem; }

#header.home .product-logos, #home-contact .product-logos, #historian-evaluate .product-logos { float: left; max-width: 305px; }

@media all and (max-width: 499px) { #header.home .col-s-1, #home-contact .col-s-1, #historian-evaluate .col-s-1 { width: 100%; margin-bottom: 0.8rem; } #header.home .col-s-1:last-child, #home-contact .col-s-1:last-child, #historian-evaluate .col-s-1:last-child { margin-top: -60px; } #header.home .row, #home-contact .row, #historian-evaluate .row { margin-left: 1rem; } }

@media all and (min-width: 500px) { #header.home .col-m-2, #home-contact .col-m-2, #historian-evaluate .col-m-2 { width: 50%; margin-bottom: 0.8rem; } #header.home .row, #home-contact .row, #historian-evaluate .row { margin-left: 1rem; } }

@media all and (min-width: 900px) { #header.home .col-l-4, #home-contact .col-l-4, #historian-evaluate .col-l-4 { width: 25%; } #header.home .row, #home-contact .row, #historian-evaluate .row { margin-left: 0rem; } }

#header.home .row, #home-contact .row, #historian-evaluate .row { margin-top: 2rem; width: 100%; }

#header.home h1 { text-align: center; padding: 0 20px; font-weight: 600; font-family: "calluna-sans"; font-size: 60px; font-size: 4rem; color: #ffffff; line-height: 75px; margin-top: 0; margin-bottom: 40px; }

#header.home h1.home-header-title { margin-bottom: 3px; }

@media all and (max-width: 800px) { #header.home h1 { font-size: 50px; font-size: 3.5rem; line-height: 70px; } }

@media all and (max-width: 600px) { #header.home h1 { font-size: 50px; font-size: 2.5rem; line-height: 55px; } }

#home-contact h1, #home-contact p, #historian-evaluate h1, #historian-evaluate p { text-align: center; }

#home-contact .button-confirm, #historian-evaluate .button-confirm { float: none; margin: 0 auto 2.5rem; }

.request-footer { background-color: #004c97; color: #fff; text-align: center; }

.request-footer h1 { margin: 0; padding-top: 100px; padding-bottom: 5px; font-size: 2.6em; font-weight: 300; }

.request-footer p { padding-top: 0px; padding-bottom: 30px; color: #fff; font-size: 1.4em; font-weight: 300; }

.free-tools-footer { background: #0d233b; padding: 100px 40px 40px 40px; padding-bottom: 0; }

.free-tools-footer .take-a-look-title { background-color: #1e83d6; color: #fff; padding: 10px; border-top-left-radius: 5px; border-top-right-radius: 5px; }

.free-tools-footer .footer-article-test-tools:hover { background-color: #cadce3; border-radius: 10px; }

.free-tools-footer .footer-article-test-tools { padding: 5px; }

.free-tools-footer .row-test_tools a:visited { text-decoration: none; }

.free-tools-footer .row-test_tools a:hover { text-decoration: none; }

.free-tools-footer h2, .free-tools-footer p.free-tools-intro { color: #112237; font-weight: 300; max-width: 1200px; margin: 0 auto; margin-bottom: 25px; margin-top: 20px; }

.free-tools-footer p.free-tools-intro { font-family: "calluna-sans"; font-style: italic; font-size: 1.25em; line-height: normal; font-weight: 300; margin-bottom: 10px; }

.free-tools-box { background-color: #fff; padding: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px; }

/*****************************************************************************/
/*
/* Frontpage News & Articles
/*
/*****************************************************************************/
.main-article h1 { font-size: 3em; font-weight: 300; margin-bottom: 10px; margin-top: 0; line-height: 1.1em; padding-top: 70px; text-align: center; }

@media screen and (max-width: 730px) { .main-article h1 { font-size: 2.5em; } }

.main-article h1.zero-top-padding { padding-top: 0px; }

.main-introduction-case { padding: 10px 15px; }

.main-introduction-case h4, .main-introduction-case p { color: black; text-align: left; margin-top: 0px; margin-bottom: 0px; }

.article-contents-wrapper { max-width: 1200px; }

.article-contents-wrapper > .lead-paragraph { text-align: left; }

.article-contents-wrapper > header > hgroup > h1 { text-align: left; }

.underlined { border-bottom: solid 1px grey; padding-bottom: 13px; margin-bottom: 13px; max-width: 1200px; margin: 0 auto; }

.main-service-item a:hover { text-decoration: none; }

.main-service-item > div > p { padding-top: 5px; border-top: solid 1px #004c97; }

a.main-service-item:hover { text-decoration: none; }

.main-service-item h4 { color: #3a6dc0; }

.main-article.main-article-products { background: url("/img/main_products.jpg") no-repeat center; transition: 0.5s ease; background-size: cover; z-index: 1; padding: 120px 0 100px 0; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -o-filter: grayscale(100%); -ms-filter: grayscale(100%); filter: grayscale(100%); }

.main-article.main-article-products.effectOff, .main-article.main-article-services.effectOff { filter: none; }

.main-article-contents-left { background-color: white; z-index: 50; padding-left: 80px; padding-right: 80px; padding-bottom: 60px; width: calc(100% - 80px); border-top-right-radius: 15px; border-bottom-right-radius: 15px; }

.main-article-contents-left h1, .main-article-contents-left p { text-align: left; max-width: 1200px; margin: 0 auto; margin-bottom: 10px; }

.main-article.main-article-services { background: url("/img/main_services.jpg") no-repeat center; background-size: cover; z-index: 1; transition: 0.5s ease; padding: 100px 0 100px 0px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-end; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -o-filter: grayscale(100%); -ms-filter: grayscale(100%); filter: grayscale(100%); }

.main-article-contents-right { background-color: white; padding-bottom: 60px; z-index: 50; padding-left: 60px; padding-right: 80px; width: calc(100% - 80px); border-top-left-radius: 20px; border-bottom-left-radius: 20px; }

.main-article-contents-right h1, .main-article-contents-right p { text-align: left; max-width: 1200px; margin: 0 auto; margin-bottom: 10px; }

@media screen and (max-width: 950px) { .main-article-contents-left { padding-right: 40px; padding-left: 40px; width: calc(100% - 50px); } .main-article-contents-right { padding-left: 40px; padding-right: 60px; width: calc(100% - 50px); } }

@media screen and (max-width: 750px) { .main-article-contents-left { padding-right: 20px; padding-left: 40px; width: calc(100% - 25px); } .main-article-contents-right { padding-left: 20px; padding-right: 40px; width: calc(100% - 25px); } }

.home_header_contents { min-height: 50vh; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: end; -moz-box-align: end; -ms-flex-align: end; -webkit-align-items: center; align-items: flex-end; -webkit-justify-content: center; justify-content: center; }

#header.home .button-link { background-color: #4242423b; border: solid 2px white; padding: 8%; color: white; font-weight: 400; transition: 0.3s ease; }

#header.home .button-link:hover { background-color: #0073a7; color: white; border: solid 2px #0073a7; }

#flexbox_header-news { display: flex; -moz-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: none; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; color: #fff; overflow: hidden; bottom: 0; -webkit-justify-content: center; justify-content: center; width: 100%; }

#flexbox_header-news > a { padding: 13px; margin: 10px 0px 10px 10px; -webkit-flex-grow: 2; flex-grow: 2; border-radius: 5px; background-color: #545454c9; transition: 0.2s ease; }

#flexbox_header-news > a:hover { background-color: #1d1d1de0; }

#flexbox_header-news > a:last-child { margin-right: 10px; }

@media screen and (max-width: 730px) { #flexbox_header-news { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } #flexbox_header-news > a { margin-right: 10px; margin-bottom: 0; } #flexbox_header-news > a:last-child { margin-bottom: 10px; } }

.enabling-case { background-color: #e6e6e6; position: relative; margin: 5px; border-radius: 15px; width: 390px; }

.middle { transition: 0.5s ease; opacity: 0; width: 100%; height: 100%; border-radius: 10px; position: absolute; background-color: rgba(255, 255, 255, 0.8); top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }

.overlay-text { white-space: nowrap; color: white; font-size: 20px; position: absolute; overflow: hidden; opacity: 1; border-radius: 10px; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); background-color: #027eb4; color: white; font-size: 16px; padding: 16px 32px; }

.enabling-case:hover .middle { opacity: 1; }

.enabling-case-img { object-fit: cover; margin-bottom: 0; width: 100%; height: 250px; border-top-left-radius: 15px; border-top-right-radius: 15px; }

#flexbox_header-news .header-news > p { color: white; margin: 3px 0 0 0; font-weight: 400; font-size: 0.9em; line-height: normal; }

#flexbox_header-news h4 { margin: 0; color: #4b83c6; font-size: 0.85em; text-transform: uppercase; font-weight: 600; border-bottom: 1px solid #949494; padding-bottom: 8px; margin-bottom: 6px; }

#flexbox_header-news .news h4 { color: #d15be0; }

#flexbox_header-news .blog h4 { color: #ff3e3e; }

#flexbox_header-news .events h4 { color: #c7b299; }

#flexbox_header-news .cases h4 { color: #33b5ff; }

#flexbox_header-news a:hover { text-decoration: none; }

#flexbox_header-news a:visited { text-decoration: none; }

.service-logo { max-width: 100px; }

.service-item { max-width: 600px; padding: 20px; }

.service-item.main-service-item { border-radius: 5px; transition: all 0.3s ease; }

.service-item.main-service-item:hover { background-color: #e1e1e1; cursor: pointer; }

@media screen and (max-width: 750px) { .flexbox-nowrap.wrap-small { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } }

@media screen and (max-width: 1400px) { .flexbox-nowrap.wrap-ml { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; flex-shrink: 2; } }

@media screen and (max-width: 950px) { .flexbox-nowrap.wrap-medium-column { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; } .flexbox-nowrap.wrap-medium { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; flex-shrink: 2; } }

.service-item p { font-size: 0.9em; }

.product-ad-wrapper > .main-product-ad-text { text-align: left; }

.product-ad-wrapper > .main-product-ad-text h4, .product-ad-wrapper > .main-product-ad-text p { font-size: 0.8em; line-height: normal; color: black; text-align: center; margin-top: 0px; margin-bottom: 0px; }

.article-item > div > .product-ad-explanation { font-style: italic; font-family: "calluna-sans"; margin: 5px; margin-right: 30px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; text-align: center; }

.article-item > div > .product-ad-explanation h4 { color: #3a6dc0; font-weight: 400; font-size: 1.4rem; margin: 0; }

.article-item > div > .product-ad-explanation p { text-align: center; }

.main-article-events { background: linear-gradient(to right, #484848, #2f2f2f); }

.main-article-events h1 { color: white; }

.main-page-event { position: relative; margin: 10px; border-radius: 10px; width: 420px; max-width: 100%; min-width: 280px; background-color: whitesmoke; }

.main-page-event .middle { border-radius: 10px; background-color: rgba(245, 245, 220, 0.8); }

.main-page-event:hover .middle { opacity: 1; }

.main-page-event-img { object-fit: cover; border-top-left-radius: 10px; border-top-right-radius: 10px; margin-bottom: 0; height: 350px; width: 420px; }

.main-page-event-details { padding: 0 15px; }

.main-page-event-details h3, .main-page-event-details h4, .main-page-event-details p { color: black; text-align: left; }

.main-page-event-details h3 { font-size: 1.5em; margin: 0; }

.main-page-event-details h4 { color: #004c97; }

.main-page-event-list { display: block; }

.product-ad-wrapper { width: calc(100% / 3 - 14px); margin: 5px 7px; background-color: #f4f4f4; padding: 20px; position: relative; border-radius: 12px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }

@media screen and (max-width: 750px) { .product-ad-wrapper { width: calc(100%); } }

.product-ad-logo { max-width: 150px; padding: 0 30px; transition: all 0.5s ease; }

.product-ad-logo_div { margin: 4px; }

.product-ad-wrapper:hover .middle { opacity: 1; }

.main-article { text-align: center; background-color: #fff; padding-bottom: 40px; padding-left: 40px; padding-right: 40px; }

.main-article > .article-item { margin-top: 50px; margin-bottom: 100px; }

.main-article .top-image { width: 140px; margin-top: 70px; margin-bottom: 5px; }

.lead-paragraph { max-width: 1200px; margin: auto; padding-bottom: 40px; font-weight: 300; text-align: center; font-size: 1.2em; line-height: 1.5em; }

.subtitle { font-size: 1.3em; margin-bottom: 18px; }

.button-link_wrapper { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; width: 100%; }

#signUp .button-link_wrapper { margin: 40px 0; }

#signUp .button-link_wrapper a { margin: 0 10px; }

#signUp .button-link { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: column; justify-content: center; align-items: center; }

.button-link_wrapper a { margin-top: 0; margin-bottom: 10px; margin-left: 5px; margin-right: 5px; color: #3a6dc0; }

.button-link_wrapper a:visited { color: #3a6dc0; text-decoration: none; }

.button-link_wrapper a:hover { text-decoration: none; }

.button-link { border-width: 1px; width: 280px; height: 100%; text-align: center; border-style: solid; border-color: #3a6dc0; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; padding: 15%; }

.button-link-white { border-color: white; color: white; }

.button-link-white:hover { border-color: #3a6dc0; color: white; }

.button-link.button-link-white:visited { color: white; }

.button-link:hover { background-color: #3a6dc0; border-color: #3a6dc0; color: white; }

.button-link.services-button { padding: 10px 10px 10px 10px; width: 150px; border: none; }

.button-link.services-button:hover { background-color: #3a6dc0; color: #ffffff; }

.button-link.mainpage-button { width: auto; padding: 30px 40px; transition: 0.5s ease; }

.button-link.button-link-white { color: white; }

.button-link.mainpage-button:hover { background-color: #017fab; color: #ffffff; }

.customer-image-wrapper { display: inline; padding: 20px; }

.customer-logo { width: 160px; max-width: 100%; }

/*****************************************************************************/
/*
/* Product overview page
/*
/*****************************************************************************/
#product-bar { width: 100%; text-align: center; display: inline-block; color: #666; font-size: 0.9em; padding-top: 6px; background-color: #ffffff; border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #9e9e9e; padding-bottom: 4px; }

@media screen and (max-width: 840px) { #product-bar { display: none; } }

.product-bar-logo { margin-left: 25px; margin-right: 25px; }

.product-bar-logo > a > img { max-width: 40px; margin-left: 1px; margin-right: 1px; }

.product-row { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; width: 100%; max-width: 1200px; margin: 0 auto; padding-top: 15px; text-align: center; }

.product-row-center { -webkit-justify-content: center; justify-content: center; }

.row-applications { border-top-style: solid; border-top-color: #aaa; border-top-width: 2px; }

.row-test_tools { border-top-style: solid; border-top-color: #aaa; border-top-width: 2px; }

.row-dev_tools { border-top-style: solid; border-top-color: #aaa; border-top-width: 2px; }

.products-container h1 { background-color: #fff; }

.product-text_div { padding-left: 15px; }

.product-description { font-size: 0.9em; }

.product-title { font-size: 1.3em; }

.product-item { border-top-width: 3px; padding: 20px; margin-bottom: 10px; border-radius: 5px; display: inline-block; background-color: #fff; min-height: 340px; text-align: center; -webkit-transition: all 0.4s ease-out; /* Safari */ transition: all 0.4s ease-out; }

.product-item:hover { background-color: #e4e4e4; }

.video-title { text-align: center; padding-top: 30px; color: #004c97; font-weight: 200; }

.video-item { border-top-width: 3px; padding: 20px; margin-bottom: 20px; border-radius: 5px; color: #004c97; display: inline-block; text-align: center; }

.video-item:hover { background-color: #f4f4f4; }

.video-item p { color: #004c97; }

.product-logos { max-width: 100px; }

.products-article { background-color: #fff; padding: 40px; }

.products-article h1 { width: 100%; max-width: 1200px; margin: auto; font-size: 2.6em; font-weight: 300; margin-bottom: 20px; padding-top: 30px; text-align: left; }

.products-article h3 { text-align: left; width: 100%; max-width: 1200px; margin: 0 auto; font-weight: 300; font-size: 1.2em; }

.products-test-title { color: #1e83d6; }

.products-app-title { color: #50a58c; }

.products-dev-title { color: #285889; }

.fixedBarPaddingToFirstTitle { padding-top: 100px !important; }

.ua-text { color: #999; padding-left: 10px; font-size: 0.8em; }

.product-group_main-title { font-size: 0.85em; font-weight: 300; }

#opc_product-row_1 { padding-left: 0; padding-right: 0; }

#opc_product-row_2 { padding-left: 0; padding-right: 0; }

@media (max-width: 767px) { div[id="opc_product-row_1"] > div:nth-child(1) { padding-left: 0; padding-right: 0; } div[id="opc_product-row_1"] > div:nth-child(2) { padding-left: 0; padding-right: 0; } }

@media (min-width: 768px) { div[id="opc_product-row_1"] > div:nth-child(1) { padding-left: 0; padding-right: 15px; } div[id="opc_product-row_1"] > div:nth-child(2) { padding-left: 15px; padding-right: 0; } }

.product-ad-banner { text-align: center; color: white; margin: 10px; border-radius: 10px; padding: 20px 40px; background-color: #111; }

.product-ad-banner h2 { margin: 0; color: #08aeef; font-size: 19px; }

.product-ad-banner p { color: white; margin: 0; font-size: 16px; }

.product-ad-banner a, .product-ad-banner a:visited { color: #08aeef; }

/*****************************************************************************/
/*
/* OPC UA Product Pages
/*
/*****************************************************************************/
.box-row { display: flex; flex-wrap: nowrap; justify-content: center; }

.box-row.padding-120-top { padding-top: 120px; }

.box-row.effectOff img { transition: 1s ease; filter: grayscale(0%); }

.contents-bar { width: 100%; background-color: #1b3761; color: #ffffff; display: flex; justify-content: center; flex-wrap: nowrap; font-size: 0.8em; font-weight: 600; align-items: center; text-transform: capitalize; height: 70px; }

.contents-bar.online-course, .contents-bar.online-course a { background-color: #dbdecf; color: black; cursor: pointer; }

.contents-bar.news-links { background-color: #e5e5e5; color: #4b83c6; }

@media screen and (max-width: 600px) { .contents-bar.news-links { display: none; } }

.contents-bar.news-links .events { color: #c7b299; }

.contents-bar.news-links .blog { color: #ff3e3e; }

.contents-bar.news-links .news { color: #d15be0; }

.contents-link-bar { height: 70px; width: 100%; }

.contents-bar > div { margin: 0 20px; }

.navigation-links { display: flex; }

.contents-bar a { color: white; text-decoration: none; }

.contents-bar.online-course a, .contents-bar.online-course a:visited { color: black; text-decoration: none; }

.contents-bar a:visited { color: white; }

@media screen and (max-width: 1000px) { .navigation-links.products { display: none; } }

@media screen and (max-width: 700px) { .navigation-links.online-courses { display: none; } }

.navigation-links > div { padding: 15px; cursor: pointer; }

.navigation-buttons > a { margin: 0 5px; cursor: pointer; }

.navigation-links > a { margin: 0 5px; padding: 15px; cursor: pointer; }

.navigation-links > a:hover, .navigation-links > div:hover { background-color: #065f7c; }

.navigation-links.online-courses > a:hover, .navigation-links.online-courses > div:hover { background-color: #cacab6; }

.navigation-links.news-blog-navigation-links > div:hover, .navigation-links.news-blog-navigation-links > a:hover { background-color: #ccc; }

.navigation-buttons { display: flex; }

.bar-button { background-color: #06aae0; border-radius: 5px; padding: 10px; }

.bar-button:hover { background-color: #065f7c; }

.bar-button.online-course { background-color: #dad600; }

.bar-button.online-course:hover { background-color: #cac700; }

.feature-logo { filter: grayscale(100%); }

.content-box { background-color: #eaeaea; border-radius: 10px; padding: 20px; max-width: 560px; text-align: center; color: #000; margin: 0 20px; height: auto; min-height: 70px; }

.content-main-box { background-color: #dae5f1; border-radius: 10px; padding: 20px 20px 40px 20px; text-align: center; color: #000; margin: 0; height: auto; max-width: 1160px; min-height: 70px; }

.text-main-box { column-count: 2; text-align: left; }

.content-list { text-align: left; }

.contents-link-bar-spacer { display: hidden; }

.contents-link-bar-spacer.visible { display: inherit; visibility: hidden; min-height: 70px; transition: none; }

.content-box:first-child { margin-left: 0px; }

.content-box:last-child { margin-right: 0px; }

.content-logo-center { max-width: 120px; margin: 0 auto; margin-top: -60px; }

.content-box h2 { font-weight: 300; line-height: 40px; }

.intro-text-wrapper { max-width: 1200px; text-align: center; margin: 0 auto; }

.intro-text-wrapper h1 { font-weight: 100; font-size: 50px; }

.intro-text-wrapper p { font-size: 24px; line-height: inherit; font-weight: 100; }

.header-logo-wrapper { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; }

.header-java-wrapper { min-height: 40vh; }

.java-header-text-block { background-color: rgba(8, 41, 46, 0.6); }

.online-course-header-text-block { background-color: rgba(255, 255, 255, 0.76); }

.delphi-header-text-block { background-color: #6457aed4; }

.java-sdk-intro { background-color: white; color: #032427; padding: 70px 2rem 0px 2rem; }

.java-sdk-intro h2 { color: #032427; }

.java-sdk-intro p { color: #032427; }

.header-java-sdk { min-height: 35vh !important; }

.header-delphi-sdk { min-height: 35vh !important; }

.header-low { min-height: 35vh !important; }

.technical-details-link { text-align: center; color: black; }

.product-editions-wrapper { display: flex; justify-content: space-around; }

@media screen and (max-width: 750px) { .product-editions-wrapper { flex-direction: column; } }

.product-editions-wrapper > div { text-align: center; padding: 0 20px; }

.technical-details-link a { color: black; }

.case-box { max-width: 560px; background-color: white; margin: 0 20px; position: relative; }

.case-box:first-child { margin-left: 0px; }

.case-box:last-child { margin-right: 0px; }

.case-box:hover .middle { opacity: 1; border-radius: 0; }

.case-text { padding: 20px; font-style: italic; }

.case-text h4 { font-weight: 400; font-style: normal; color: #3c476d; }

.case-image { height: 300px; width: 100%; }

.text-align-center { text-align: center; }

#flir.case-image { background: url(/img/case_traffic.jpg); background-size: cover; }

#awenergy.case-image { background: url(/img/aw-energy-waveroller.jpg); background-size: cover; }

#kruger.case-image { background: url(/img/case_water.jpg); background-size: cover; }

#centria.case-image { background: url(/img/cases/centria.jpg); background-size: cover; }

#valio.case-image { background: url(/img/case_valio.jpg); background-size: cover; }

#nextnine.case-image { background: url(/img/case_factory.jpg); background-size: cover; }

#steria.case-image { background: url(/img/case_traffic_2.jpg); background-size: cover; }

#adpap.case-image { background: url(/img/case_blue_smoke.jpg); background-size: cover; }

#sinopec.case-image { background: url(/img/case_oil.jpg); background-size: cover; }

@media screen and (max-width: 750px) { .box-row { flex-wrap: wrap; } .content-box { margin: 50px 20px; } .content-box:first-child { margin: 50px 20px; } .content-box:last-child { margin: 50px 20px; } .box-row.padding-120-top { padding-top: 0; } .case-box { max-width: 560px; margin: 20px; } .case-box:first-child { margin: 20px; } .case-box:last-child { margin: 20px; } }

.feature-list > p { margin: 0; font-size: 14px; font-size: 0.8em; line-height: 1.25; }

/*****************************************************************************/
/*
/* OPC UA Monitor - Product Launch page
/*
/*****************************************************************************/
.blue-bg { background-color: #1c478a; border-top: 15px solid #ffe783; border-left: 15px solid #00356a; }

.blue-bg h2, .blue-bg p { color: white; }

.opc_ua_landing_page_header_wrapper { height: 100%; min-height: 85vh; padding: 0; position: relative; }

#monitor_header.opc_ua_landing_page_contents { margin-top: 50px; }

#monitor_header.opc_ua_landing_page_contents h2 { color: #ffce00; font-weight: 400; }

#header.header-client-pro { background: url(/img/header-product-client-pro_beta.jpg) no-repeat center center scroll; background-size: cover; }

.ua-monitor-feature_wrapper > div { margin-left: 2rem; }

.ua-monitor-feature_wrapper > div h2 { margin-top: 0; margin-bottom: 0.1rem; }

.opc_ua_landing_page_header_wrapper > #preview_opc-ua-monitor_header_ad.preview_header_block h3 { color: #ffce00; max-width: 1200px; }

.ua-monitor-feature_wrapper { margin-top: 3rem; margin-bottom: 2rem; max-width: 900px; }

@media screen and (max-width: 750px) { .ua-monitor-feature_wrapper { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; } .ua-monitor-feature_wrapper > div { margin-left: 0; } }

.ua-monitor-feature_wrapper > img { width: 10rem; height: 10rem; max-width: 100%; margin-top: 0.65rem; }

.preview_opc-ua-monitor_header { text-align: center; }

#monitor_signup_wrapper > p.signup_text { color: #ffce00; max-width: 100%; font-weight: 400; }

#preview_opc-ua-monitor_header_ad { position: relative; top: 0; margin-top: 50px; }

@media screen and (min-height: 700px) and (min-width: 850px) { #preview_opc-ua-monitor_header_ad { position: absolute; bottom: 10vh; top: auto; } }

#small-uamonitor-text { margin-top: 1rem; }

#small-uamonitor-text p.small-grey { color: #cccccc; padding: 0; margin-top: 0; font-size: 32px; font-size: 1.1rem; line-height: 48px; line-height: 2.3rem; font-family: "futura-pt", "Helvetica Neue", Helvetica, Arial, sans-serif !important; }

@media screen and (min-width: 600px) { #small-uamonitor-text p.small-grey { float: center; } }

#small-uamonitor-text p.small-grey a { color: #cccccc; }

#small-uamonitor-text .small-grey + .small-grey { margin-left: 1rem; }

@media screen and (min-width: 948px) { #small-uamonitor-text .small-grey + .small-grey { margin-left: 3rem; } }

.product-preview-features-row { padding: 15px; text-align: center; min-width: 200px; }

.product-preview-features-row img { width: 100%; max-width: 7rem; }

.product-preview-features-row p { font-weight: bold; font-size: 1rem; }

#monitor_header.opc_ua_landing_page_contents p { max-width: 1200px; }

#preview_opc-ua-monitor_header_ad.preview_header_block p { max-width: 1200px; }

/*****************************************************************************/
/*
/* Content
/*
/*****************************************************************************/
.fixed-position-top { position: fixed; top: 0; z-index: 99; }

#content { padding-top: 0; position: relative; z-index: 2; background: #ffffff; }

#main { width: 100%; }

#main h2 { margin-left: 0; margin-bottom: 8px; clear: both; }

@media screen and (min-width: 1045px) { #main { width: 68%; float: left; } }

@media screen and (min-width: 948px) { #main { padding-left: 1.5rem; } }

@media screen and (min-width: 1120px) { #main { padding-left: 3rem; } }

#aside { width: 100%; margin-top: 32px; margin-top: 2rem; }

@media screen and (min-width: 1045px) { #aside { width: 32%; float: right; padding-left: 32px; margin-top: 16px; padding-left: 1rem; margin-top: 1rem; } }

@media screen and (min-width: 948px) { #aside { padding-right: 1.5rem; } }

@media screen and (min-width: 1120px) { #aside { padding-right: 3rem; } }

#aside .box { margin: 16px 0; margin: 1rem 0; background-color: #e4e4e4; }

#aside .box:first-child { margin-top: 0; }

#aside ul { padding: 0 8px; padding: 0 0.5rem; margin-left: 0; color: #4e4e4e; }

#aside li { color: #4e4e4e; margin-top: 6px; margin-top: 0.4rem; list-style: none; }

#opc-ua-product-main, .opc-ua-product-main, .content-block { padding: 32px 16px 32px; padding: 2rem 1rem 2rem; }

#opc-ua-product-main .product-list h3, .opc-ua-product-main .product-list h3, .content-block .product-list h3 { margin-top: 1.5rem; margin-bottom: 0.25rem; }

#opc-ua-product-main .product-list p, .opc-ua-product-main .product-list p, .content-block .product-list p { margin-bottom: 0.25rem; }

#opc-ua-product-main .product-text h2, .opc-ua-product-main .product-text h2, .content-block .product-text h2 { margin-top: 1rem; text-align: center; }

#opc-ua-product-main .product-text ul, .opc-ua-product-main .product-text ul, .content-block .product-text ul { margin-bottom: 0.5rem; }

#opc-ua-product-main .product-text p, .opc-ua-product-main .product-text p, .content-block .product-text p { margin-bottom: 0; }

#opc-ua-product-main .product-50, #opc-ua-product-main .product-33, #opc-ua-product-main .product-25, .opc-ua-product-main .product-50, .opc-ua-product-main .product-33, .opc-ua-product-main .product-25, .content-block .product-50, .content-block .product-33, .content-block .product-25 { width: 100%; float: none; }

#opc-ua-product-main .product-left, .opc-ua-product-main .product-left, .content-block .product-left { width: 100%; float: none; }

#opc-ua-product-main .product-right, .opc-ua-product-main .product-right, .content-block .product-right { width: 100%; float: none; }

#opc-ua-product-main .product-center, .opc-ua-product-main .product-center, .content-block .product-center { margin: 0 auto 0; width: 100%; max-width: 700px; }

#opc-ua-product-main hr, .opc-ua-product-main hr, .content-block hr { margin: 32px 0; margin: 2rem 0; }

#opc-ua-product-main .editions-wrapper, .opc-ua-product-main .editions-wrapper, .content-block .editions-wrapper { display: flex; max-width: 1200px; text-align: center; margin: 0 auto; justify-content: space-between; }

#opc-ua-product-main .edition-50, .opc-ua-product-main .edition-50, .content-block .edition-50 { width: calc(50% - 50px); padding: 20px; border-radius: 10px; }

@media screen and (min-width: 650px) { #opc-ua-product-main .product-text h2, .opc-ua-product-main .product-text h2, .content-block .product-text h2 { margin-top: 0; } }

@media screen and (min-width: 650px) { #opc-ua-product-main .product-33, .opc-ua-product-main .product-33, .content-block .product-33 { width: 33.33%; float: left; padding: 0.5rem; } #opc-ua-product-main .product-left, .opc-ua-product-main .product-left, .content-block .product-left { width: 50%; float: left; padding: 0.5rem; } #opc-ua-product-main .product-right, .opc-ua-product-main .product-right, .content-block .product-right { width: 50%; float: right; padding: 0.5rem; } #opc-ua-product-main .product-text, .opc-ua-product-main .product-text, .content-block .product-text { padding: 32px; padding: 2rem; } #opc-ua-product-main .product-text p, .opc-ua-product-main .product-text p, .content-block .product-text p { margin-bottom: 0.5rem; } }

@media screen and (min-width: 550px) { #opc-ua-product-main .product-50, #opc-ua-product-main .product-25, .opc-ua-product-main .product-50, .opc-ua-product-main .product-25, .content-block .product-50, .content-block .product-25 { width: 50%; float: left; padding: 0.5rem; } }

@media screen and (min-width: 800px) { #opc-ua-product-main .product-25, .opc-ua-product-main .product-25, .content-block .product-25 { width: 25%; float: left; padding: 0.5rem; } }

@media screen and (min-width: 800px) { #opc-ua-product-main .product-50, .opc-ua-product-main .product-50, .content-block .product-50 { width: 50%; float: left; padding: 0.5rem; } }

/* responsive-nav.js 1.0.23 by @viljamis */
/* MIT License */
/* http://responsive-nav.com */
/* https://github.com/viljamis/responsive-nav.js */
#nav li { text-transform: uppercase; }

#nav ul { text-align: center; }

.nav-collapse, .nav-collapse ul { list-style: none; width: 100%; float: left; margin: 0; padding: 0 0 0 0; }

.nav-collapse li { float: left; width: 100%; }

@media screen and (min-width: 1045px) { .nav-collapse, .nav-collapse ul { float: right; width: auto; padding-top: 0; } .nav-collapse li { width: auto; } }

.nav-collapse a { margin: 0; color: #fff; text-decoration: none; width: 100%; background: #004c97; padding: 8px 16px 8px; padding: 0.5rem 1rem 0.5rem; float: left; font-size: 21px; font-size: 1.3rem; transition: background-color 0.15s ease-in-out 0s; }

.nav-collapse a:hover { color: #004c97; background-color: #ffffff; text-shadow: 0 0 0 rgba(0, 0, 0, 0); }

@media screen and (min-width: 1045px) { .nav-collapse { border: 0; } .nav-collapse a { padding: 3px 13px; padding: 0.3rem 0.7rem; float: left; text-align: center; border: 0; background-color: #004c97; color: #ffffff; } .nav-collapse a:hover { color: #004c97; background-color: #ffffff; text-shadow: 0 0 0 rgba(0, 0, 0, 0); } .nav-collapse ul { margin-bottom: 0; } }

.nav-collapse.disable-pointer-events { pointer-events: none !important; }

.nav-collapse ul ul a { background: #ca3716; padding-left: 1rem; padding-right: 1rem; }

@media screen and (min-width: 1045px) { .nav-collapse ul ul a { display: none; } }

.nav-toggle { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 70px; height: 70px; float: right; margin-top: 0; text-indent: -9999px; overflow: hidden; background: url("/img/icon-hamburger.png") no-repeat center center; }

@media screen and (min-width: 1045px) { .nav-collapse a { font-size: 14px; font-size: 0.8rem; margin-top: 18px; } }

@media screen and (min-width: 948px) { .nav-collapse a { font-size: 14px; font-size: 0.8rem; margin-top: 18px; } }

@media screen and (min-width: 1120px) { .nav-collapse a { font-size: 15px; font-size: 0.9rem; margin-top: 16px; } }

@media screen and (-webkit-min-device-pixel-ratio: 1.3), screen and (min--moz-device-pixel-ratio: 1.3), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 1.3), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) { .nav-toggle { background-image: url("/img/icon-hamburger@2x.png"); -webkit-background-size: 100px 100px; -moz-background-size: 100px 100px; -o-background-size: 100px 100px; background-size: 100px 100px; } }

.nav-collapse ul { display: block; list-style: none; }

.js .nav-collapse { clip: rect(0 0 0 0); max-height: 0; position: absolute; display: block; overflow: hidden; zoom: 1; }

.nav-collapse.opened { max-height: 9999px; }

.nav-toggle { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; }

@media screen and (min-width: 1045px) { .js .nav-collapse { position: relative; } .js .nav-collapse.closed { max-height: none; } .nav-toggle { display: none; } }

/*****************************************************************************/
/*
/* Buttons
/*
/*****************************************************************************/
.button-footer { margin-top: 10px; }

.button .button-footer a, .button-secondary .button-footer a, .button-confirm .button-footer a, #footer .button-footer .button-footer a { color: #fff !important; text-decoration: none; }

.button-footer a:visited { color: #fff !important; text-decoration: none; }

.button-footer a:hover { color: #f4f4f4 !important; text-decoration: none; }

.button a:visited, .button-secondary a:visited, .button-confirm a:visited, #footer .button-footer a:visited { color: #3399ff; text-decoration: none; }

.button a:hover, .button-secondary a:hover, .button-confirm a:hover, #footer .button-footer a:hover { text-decoration: none; }

.button-confirm { background-color: transparent; border-radius: 5px; border-style: solid; border-width: 2px; border-color: #6fb7ff; color: #6fb7ff; }

.button-confirm:disabled { background-color: #e9e9e9; color: #999999; }

.button-confirm:hover { border-color: #4586c8; color: #4586c8; }

.button-confirm a, .button-confirm a:visited { color: #6fb7ff; }

.button-confirm.button-large.button-white { border-color: #fff; color: #fff; }

.button-confirm.button-large.button-white a { color: #fff; text-decoration: none; cursor: pointer; transition: 0.3s ease; }

.button-confirm.button-large.button-white a:visited { color: #fff; text-decoration: none; }

.button-confirm.button-large.button-white a:hover { color: #3a6dc0; background-color: white; text-decoration: none; }

.button-white { border-color: #fff; color: #fff; }

.button-white a { color: #fff; text-decoration: none; cursor: pointer; }

.button-white a:visited { color: #fff; text-decoration: none; }

.button-white a:hover { color: #fff; text-decoration: none; }

.button-secondary { border-radius: 4px; background: #253746; color: #ffffff; }

.button-secondary:hover { background: #fe7c00; /*#264859;*/ }

.button-secondary:disabled { background-color: #e9e9e9; color: #999999; }

.button-large a { font-size: 19px; font-size: 1.2rem; }

input.button-confirm[type="button"] { font-size: 16px; font-size: 1rem; padding: 10px 20px; padding: 0.6rem 1.25rem; margin-left: 0; }

input.margin-left-button[type="button"] { margin-left: 1rem; }

.button-confirm, .button-secondary { margin: 32px 16px 0 0; margin: 2rem 1rem 0 0; }

.button-confirm a, .button-secondary a { color: #3a6dc0; text-decoration: none; cursor: pointer; }

.text-button { cursor: pointer; color: #3a6dc0; }

.text-button:hover { cursor: pointer; color: #3399ff; }

/*****************************************************************************/
/*
/* Home
/*
/*****************************************************************************/
#home-introduction-boxes, #home-products, #home-sdks, #home-services, #home-case-studies, #home-news, #home-resources { width: 100%; margin-top: 12px; margin-bottom: 12px; margin-top: 0.75rem; margin-bottom: 0.75rem; }

@media screen and (min-width: 650px) { #home-introduction-boxes, #home-products, #home-sdks, #home-services, #home-case-studies, #home-news, #home-resources { margin-bottom: 24px; margin-bottom: 1.5rem; } }

#home-our-services { width: 100%; }

@media screen and (min-width: 650px) { #home-our-services { width: 33.33%; float: left; display: table-cell; height: 100%; } }

#home-our-products h3, #home-what-is-opc h3, #home-current-highlight1 h3, #home-current-highlight2 h3, #home-current-highlight3 h3 { margin-top: 12px; margin-top: 0.75rem; }

#home-our-products, #home-what-is-opc, #home-current-highlight1, #home-current-highlight2, #home-current-highlight3 { width: 100%; position: relative; }

@media screen and (min-width: 650px) { #home-our-products, #home-what-is-opc, #home-current-highlight1, #home-current-highlight2, #home-current-highlight3 { width: 33.33%; height: 100%; display: table-cell; vertical-align: top; height: 100%; } }

#home-our-products a, #home-what-is-opc a, #home-current-highlight1 a, #home-current-highlight2 a, #home-current-highlight3 a { position: relative; bottom: 0; }

.home-service-highlight { width: 100%; position: relative; vertical-align: top; padding: 8px 16px 8px 0; padding: 0.5rem 1rem 0.5rem 0; }

@media screen and (min-width: 650px) { .home-service-highlight { width: 50%; height: 100%; display: table-cell; height: 100%; padding-left: 16px; padding-left: 1rem; } }

.home-service-highlight a { position: relative; bottom: 0; }

.home-service-highlight .highlight-text h3 { margin-top: 8px; margin-top: 0.5rem; margin-left: 0.5rem; }

.home-service-highlight .highlight-text p { margin-left: 0.5rem; }

@media screen and (min-width: 650px) { #home-products, #home-sdks, #home-services, #home-case-studies { margin-bottom: 40px; margin-bottom: 2.5rem; margin-top: 40px; margin-top: 2.5rem; } }

#home-products ul, #home-sdks ul, #home-services ul, #home-case-studies ul { padding-left: 0; }

#home-products li, #home-sdks li, #home-services li, #home-case-studies li { list-style-type: none; margin-left: 0; font-size: 16px; padding-bottom: 14px; font-size: 1rem; padding-bottom: 0.8rem; font-weight: 500; }

#home-highlights-table { width: 100%; }

@media screen and (min-width: 650px) { #home-highlights-table { display: table; border-spacing: 0.5rem; margin-right: 0; padding-right: 0; margin-left: 0; padding-left: 0; margin-top: 2rem; } }

.home-products-listing-50 { display: inline; }

@media screen and (min-width: 550px) { .home-products-listing-50 { width: 50%; } }

#home-products-listing, #home-services-listing, #home-case-studies-listing, #home-resources-listing { display: inline; }

#home-products-listing li, #home-services-listing li, #home-case-studies-listing li, #home-resources-listing li { font-size: 18px; font-size: 1.1rem; }

@media screen and (min-width: 550px) { #home-products-listing, #home-services-listing, #home-case-studies-listing, #home-resources-listing { width: 45%; } }

@media screen and (min-width: 650px) { #home-products-listing, #home-services-listing, #home-case-studies-listing, #home-resources-listing { width: 38%; } }

@media screen and (min-width: 650px) { #home-twitter { padding: 0 8px; padding: 0 0.5rem; } }

#home-news-listing, #home-events-listing, #home-blog-listing, #home-twitter { display: inline; padding-top: 24px; padding-top: 1.5rem; }

@media screen and (min-width: 650px) { #home-news-listing, #home-events-listing, #home-blog-listing, #home-twitter { width: 33.33%; padding-left: 8px; padding-right: 8px; padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0; } }

#home-news-listing a, #home-events-listing a, #home-blog-listing a, #home-twitter a { font-size: 14px; font-size: 0.9rem; font-weight: 400; }

#home-news-listing p, #home-events-listing p, #home-blog-listing p, #home-twitter p { font-weight: 400; font-size: 0.12px; font-size: 0.75rem; margin: 0; }

#home-news-listing ul, #home-events-listing ul, #home-blog-listing ul, #home-twitter ul { padding: 0; margin: 0; }

#home-news-listing li, #home-events-listing li, #home-blog-listing li, #home-twitter li { list-style-type: none; padding: 5px 8px; padding: 0.3rem 0.5rem; margin: 0; }

#home-news-listing li:nth-child(even), #home-events-listing li:nth-child(even), #home-blog-listing li:nth-child(even), #home-twitter li:nth-child(even) { background-color: #efefef; }

#home-products-highlight, #home-services-highlight, #home-case-studies-highlight1, #home-case-studies-highlight2, #home-resources-highlight { display: inline; }

@media screen and (min-width: 650px) { #home-products-highlight, #home-services-highlight, #home-case-studies-highlight1, #home-case-studies-highlight2, #home-resources-highlight { width: 55%; } #home-products-highlight .box, #home-services-highlight .box, #home-case-studies-highlight1 .box, #home-case-studies-highlight2 .box, #home-resources-highlight .box { margin-left: 8px; margin-left: 0.5rem; min-height: 220px; } }

@media screen and (min-width: 650px) { #home-products-highlight, #home-services-highlight, #home-case-studies-highlight1, #home-case-studies-highlight2, #home-resources-highlight { width: 62%; } }

.highlight-box { display: inline; }

.highlight-box .box { margin: 16px 0 0; margin: 1rem 0 0; }

.highlight-box.blog-writer { margin-top: 16px; margin-top: 1rem; margin-bottom: 16px; margin-bottom: 1rem; }

.highlight-box.blog-writer img { max-width: 160px; padding-right: 16px; max-width: 10rem; padding-right: 1rem; }

#product-header h2, #case-header h2 { margin-bottom: 8px; margin-bottom: 0.5rem; }

#product-header h3, #case-header h3 { font-size: 21px; margin: 0 0 8px; font-size: 1.3rem; margin: 0 0 0.5rem; color: #8e8e8e; font-weight: 400; }

#product-header .highlight-image, #product-header .highlight-text, #case-header .highlight-image, #case-header .highlight-text { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }

@media screen and (min-width: 650px) { #product-header .highlight-image, #case-header .highlight-image { width: 192px; padding: 24px 32px; width: 12rem; padding: 1.5rem 2rem; } #product-header .highlight-text, #case-header .highlight-text { clear: right; width: calc(100% - 12rem); } }

#product-header img, #case-header img { padding: 0; margin: 0; }

#header.opc-ua-product h3 { font-style: italic; font-family: "calluna-sans"; color: #fff; font-size: 29px; font-size: 1.6rem; margin: 20px 24px; margin: 1.25rem 2rem 0.5rem 1.5rem; margin-top: 3px; max-width: 60rem; }

@media screen and (min-width: 550px) { #header.opc-ua-product h3 { font-size: 35px; font-size: 2rem; margin: 29px 32px; margin: 1.25rem 2rem 0.5rem 1.5rem; margin-top: 3px; } }

#header.opc-ua-product img { max-width: 35em; }

#header.opc-ua-product #product-menu { padding: 0 1rem; }

#header.opc-ua-product .opc-ua-product-button { width: 100%; max-width: 280px; float: left; clear: both; margin-bottom: 0.5rem; }

@media screen and (min-width: 280px) { #header.opc-ua-product .opc-ua-product-button { clear: none; margin-right: 2rem; } }

#header.opc-ua-product .opc-ua-product-button .box-mini { margin-bottom: 0; }

#header.opc-ua-product .opc-ua-product-button h3 { font-size: 1.2rem; font-weight: 400; font-style: normal; text-align: center; }

#header.opc-ua-product .opc-ua-product-button p { font-size: 0.8rem; font-weight: 400; color: #bbb; }

#header.opc-ua-product .opc-ua-product-button .purchase-license, #header.opc-ua-product .opc-ua-product-button .request-evaluation { padding: 0.5rem; }

#header.online-course h3 { color: black; }

#case-header { margin-bottom: 16px; margin-bottom: 1rem; }

#case-header .highlight-image { width: 240px; padding-top: 16px; width: 15rem; padding-top: 1rem; }

@media screen and (min-width: 650px) { #case-header .highlight-image { width: 240px; width: 15rem; padding: 24px 32px 16px; padding: 1.5rem 2rem 1rem; } #case-header .highlight-text { clear: right; width: calc(100% - 15rem); } }

#small-product-text { margin-top: 1rem; }

#small-product-text p.small-grey { color: #cccccc; padding: 0; margin-top: 0; font-size: 32px; font-size: 1.1rem; line-height: 48px; line-height: 2.3rem; font-family: "futura-pt", "Helvetica Neue", Helvetica, Arial, sans-serif !important; }

@media screen and (min-width: 600px) { #small-product-text p.small-grey { float: left; } }

#small-product-text p.small-grey a { color: #cccccc; }

#small-product-text .small-grey + .small-grey { margin-left: 1rem; }

@media screen and (min-width: 948px) { #small-product-text .small-grey + .small-grey { margin-left: 3rem; } }

#product-menu { clear: both; }

#product-menu p, #product-menu p.small-grey { color: #8e8e8e; padding: 0; margin-top: 0; font-size: 14px; font-size: 0.9rem; line-height: 19px; line-height: 1.2rem; font-family: "futura-pt", "Helvetica Neue", Helvetica, Arial, sans-serif !important; }

#product-menu h3 { padding: 0; margin-bottom: 0; font-weight: 600; font-family: "futura-pt", "Helvetica Neue", Helvetica, Arial, sans-serif !important; }

#product-menu #evaluate { background-repeat: no-repeat; background-position: 10px 50%; -webkit-background-size: 40px 40px; -moz-background-size: 40px 40px; background-size: 40px 40px; padding: 3px 0 3px 0px; }

#product-menu #purchase { background-repeat: no-repeat; background-position: 10px 50%; -webkit-background-size: 40px 40px; -moz-background-size: 40px 40px; background-size: 40px 40px; padding: 3px 0 3px 0px; }

#product-description, .product-description { clear: both; }

#product-description h4, .product-description h4 { margin: 24px 8px 12px 0; font-size: 20px; margin: 1.5rem 0.5rem 0.75rem 0; font-size: 1.3rem; color: #253746; font-style: normal; font-weight: 500; }

#product-description .box img, .product-description .box img { padding: 12px; padding: 0.75rem; }

#product-description .box img.two-images, .product-description .box img.two-images { width: 50%; float: left; }

#product-description .box img.three-images, .product-description .box img.three-images { width: 33.33%; float: left; }

#product-description .box img.four-images, .product-description .box img.four-images { width: 25%; float: left; }

img.four-images { width: 50%; float: left; }

@media screen and (min-width: 948px) { img.four-images { width: 25%; } }

/*****************************************************************************/
/*
/* Company
/*
/*****************************************************************************/
.secondary-paragraph { font-size: 1em; padding: 0; text-align: left; }

article.article-company { max-width: 1200px; margin: 0 auto; border-style: none; }

@media screen and (max-width: 948px) { article.article-company { padding-bottom: 8px; } }

article.article-company h1 { font-size: 1.5em; margin: 0; text-align: left; }

.col-25 { width: 25%; }

.col-75 { width: 75%; }

.one-column { background-color: #eeeeee; padding: 40px; }

.two-column-left { width: 50%; padding: 40px; background-color: #eeeeee; }

@media screen and (max-width: 948px) { .two-column-left { width: 100%; } }

.two-column-right { width: 50%; padding: 40px; background-color: #eeeeee; }

@media screen and (max-width: 948px) { .two-column-right { width: 100%; } }

.two-column-image { width: 50%; background-size: cover; background-repeat: no-repeat; background-position: top center; }

@media screen and (max-width: 948px) { .two-column-image { display: none; } }

#iiot div.two-column-image { background-image: url("/img/iiot.png"); }

#roadToOpc div.two-column-image { background-image: url("/img/company_road.jpg"); }

#opcCompetence div.two-column-image { background-image: url("/img/certificate.png"); }

#investment div.two-column-image { background-image: url("/img/company_safe.jpeg"); }

#bestService div.two-column-image { background-image: url("/img/company_service.jpg"); }

/*****************************************************************************/
/*
/* About OPC
/*
/*****************************************************************************/
#opc #endUsers div.two-column-image { background-image: url("/img/user_enduser.jpg"); border-top-right-radius: 10px; }

#opc #deviceMachineVendor div.two-column-image { background-image: url("/img/user_vendor.jpg"); }

#opc #integrators div.two-column-image { background-image: url("/img/user_intergrate.jpg"); }

#opc #companies div.two-column-image { background-image: url("/img/user_company.jpg"); border-bottom-left-radius: 10px; }

#opc .article-opc-users { padding-bottom: 0px; background-color: #d4dce4; }

#opc .article-opc-users > div { border-bottom: solid #fff 20px; }

#opc .article-opc-users > div:last-child { border-bottom: none; }

#opc .article-title { font-size: 3em; font-weight: 300; margin-bottom: 10px; margin-top: 0; line-height: 1.1em; padding-top: 70px; text-align: center; }

#opc .white { color: #fff; }

#opc .white > p { color: #fff; }

#opc .white > h3 { color: #fff; }

#opc .black > p { color: #000; }

#opc .black > h3 { color: #000; }

#opc h1.title-light { font-size: 36px; font-weight: 100; }

#opc .margin-bottom-10 { margin-bottom: 10px; }

/*****************************************************************************/
/*
/* Services
/*
/*****************************************************************************/
.service-logo-column { width: 140px; margin-right: 40px; }

@media screen and (max-width: 800px) and (min-width: 550px) { .service-logo-column { width: 100px; margin-right: 25px; } }

@media screen and (max-width: 550px) { .service-logo-column { display: none; } }

.service-item.services { max-width: 500px; padding: 0px 20px; margin: 30px; border-left: solid 5px #eaeaea; }

.service-item.services:hover { border-left: solid 5px #3a6dc0; transition: all 0.5s ease; }

.service-item.services a:hover { text-decoration: none; }

/*****************************************************************************/
/*
/* Cases
/*
/*****************************************************************************/
.case-product-logo { width: 50px; display: inline-block; vertical-align: middle; }

p.author { font-size: 0.8em; color: #666; text-align: left; margin-top: 0; }

.case-text-block { display: inline-block; vertical-align: middle; padding: 5px; font-size: 0.7em; }

.case-article { padding-bottom: 0; }

.cases-wrapper { max-width: 850px; }

.cases-wrapper h3 { text-align: left; margin-bottom: 5px; margin-top: 30px; }

.cases-wrapper > h3 + p { margin-top: 0; }

.cases-wrapper > figure { margin-top: 30px; margin-bottom: 30px; font-size: 0.9em; }

.cases-wrapper > p { margin-top: 20px; margin-bottom: 20px; }

.case-text-block.primary-text { font-size: 1em; font-weight: 600; margin-left: 5px; }

.case-product-div { display: inline-block; padding: 5px; padding-right: 10px; margin-right: 8px; margin-top: 10px; background-color: #eeeeee; border-radius: 5px; }

.case-product-div.primary-case { width: 200px; background-color: #c4c9d7; margin-top: 30px; }

.two-column-image.case-main_case-logo-column { text-align: left; padding-left: 20px; }

.case-main_case-customer_logo { margin-bottom: 20px; margin-top: 10px; display: block; width: 220px; }

#case_flir div.two-column-image { background-image: url("/img/case_traffic.jpg"); }

#case_awenergy div.two-column-image { background-image: url("/img/aw-energy-waveroller.jpg"); }

#case_nextnine div.two-column-image { background-image: url("/img/case_factory.jpg"); }

#case_kruger div.two-column-image { background-image: url("/img/case_water.jpg"); }

#case_centria div.two-column-image { background-image: url("/img/cases/centria.jpg"); }

#case_valio div.two-column-image { background-image: url("/img/case_valio.jpg"); }

#case_ifae div.two-column-image { background-image: url("/img/cases/IFAE_camera.jpeg"); }

#case_helsingin_energia div.two-column-image { background-image: url("/img/cases/helen-device.png"); }

#case_metso div.two-column-image { background-image: url("/img/cases/metso-machine_cases.jpg"); }

#case_valio___ div.two-column-image { background-image: url("/img/cases/valio-teuvo_cases.png"); }

#case_neste_jacobs div.two-column-image { background-image: url("/img/cases/nj-NAPCONSimulator_Operators_cases.jpg"); }

/*****************************************************************************/
/*
/* News, Events & Blog
/*
/*****************************************************************************/
.blogpost code { tab-size: 2; -moz-tab-size: 2; }

.blog-title { display: inline; }

.blog-title > h1 { text-align: left; display: inline-block; }

.blog-title > a { width: 32px; margin-left: 10px; padding-bottom: 5px; padding-top: 40px; float: right; }

.news-blog-navigation-links > div { padding-left: 30px; padding-right: 30px; display: flex; align-items: center; }

.blog-posts-wrapper { display: flex; flex-wrap: nowrap; }

.blog-writer .highlight-image > img, .blog-writer .highlight-image { margin-top: 0; padding-top: 0; margin-left: 0; padding-left: 0; }

.blog-writer .box { margin-left: 0; padding-left: 0; }

.blog-keywords-block { padding: 10px 25px; border-radius: 10px; background-color: #f4f4f4; width: 20%; height: 100%; margin-left: auto; margin-right: 0; }

.blog-keywords-block a > h3 { font-size: 18px; margin: 2px 0; }

.blog-keywords-block a > h3:hover { text-decoration: underline; }

.events-block { background-color: whitesmoke; padding: 0 40px 40px 40px; }

.events-wrapper { display: flex; justify-content: center; flex-wrap: wrap; max-width: 1500px; margin: 0 auto; }

.event { background-color: white; position: relative; margin: 5px; border-radius: 10px; max-width: 600px; flex: 1; }

@media screen and (max-width: 850px) { .event { max-width: calc(50% - 10px); } }

@media screen and (max-width: 650px) { .event { max-width: calc(100% - 10px); } }

.event:hover .middle { opacity: 1; }

.event-details { padding: 0 20px; }

.event-details h4, .event-details p { font-size: 1em; }

.event-details h3 { color: #666; font-size: 1.5em; font-weight: 600; margin: 0; }

.event-details h4 { color: #3a6dc0; font-weight: 400; }

.event-img { object-fit: cover; border-top-left-radius: 10px; border-top-right-radius: 10px; margin-bottom: 0; height: 200px; width: 100%; }

.spotlight_higlight-title-description { margin: 0; font-size: 0.85em; line-height: 1.2rem; color: #3b3b3b; }

#spotlight .box h4 { font-size: 1em; font-weight: 600; }

#blog .a:visited, #blog h4 a, #blog a { color: #bb0202; text-decoration: none; }

#blog a:hover { text-decoration: underline; }

#news .a:visited, #news h4 a, #news a { color: #88009b; text-decoration: none; }

.sorting-button { display: flex; justify-content: flex-end; margin-bottom: 20px; }

.sorting-button > p { text-align: center; border: solid 2px grey; padding: 10px; font-size: 15px; font-weight: 600; width: 250px; border-radius: 4px; margin: 0; color: grey; cursor: pointer; }

.news-div, .blog-div { width: 1000px; background-color: white; max-width: 100%; height: 100%; padding: 20px 40px; margin: 0 auto; }

.news-wrapper { margin-top: 10px; width: 100%; background-color: white; }

.blog-wrapper { margin-top: 10px; width: 100%; background-color: white; }

@media screen and (max-width: 850px) { .event-img { display: none; } }

@media screen and (max-width: 750px) { .news-div-right { width: 100%; margin-left: 20px; padding-right: 40px; padding-left: 20px; } .news-div-left { width: 100%; padding-left: 40px; padding-right: 20px; margin-right: 20px; } }

.news-div .box { border-bottom: 1px dotted #909090; padding-left: 0; padding-right: 0; }

.blog-div .box { border-bottom: 1px dotted #909090; padding-left: 0; padding-right: 10px; }

.showDetails { margin-top: 40px; color: #3a6dc0; font-weight: 400; padding: 20px; border-radius: 5px; border: 1px solid #3a6dc0; cursor: pointer; transition: 0.3s ease; }

.showDetails:hover { background-color: #3a6dc0; color: white; }

.actual_highlight_block { padding: 10px 10px; margin: 10px 5px; color: white; flex: 1; background-color: #f2f2f2; border-radius: 10px; }

.actual_highlight_block h4 { color: #08aeef; }

.actual_highlight_block h3, .actual_highlight_block p { color: black; }

.actual_highlight_block:hover { text-decoration: none; background-color: #e3e3e3; }

h1.news-header { font-size: 2.5em; font-weight: 300; margin-bottom: 10px; margin-top: 30px; line-height: 1.1em; padding-top: 10px; }

/*****************************************************************************/
/*
/* Random layout stuff
/*
/*****************************************************************************/
.visible { visibility: visible; transition: 2s ease; }

.hidden { display: none; transition: 2s ease; visibility: hidden; }

hr { border: 0; height: 1px; background: #d1d1d1; }

#photo-aside img { max-width: 160px; padding: 8px 16px 0; max-width: 10rem; padding: 0.5rem 1rem 0; }

#photo-aside p { text-align: center; }

.no-wrap { white-space: nowrap; }

.large-quote { font-size: 29px; font-size: 1.8rem; }

.post-content img { max-height: 560px; max-height: 35rem; }

.post-content .post-image-float { padding: 8px 8px 8px 16px; padding: 0.5rem 0.5rem 0.5rem 1rem; }

@media screen and (min-width: 948px) { .post-content .post-image-float { float: right; max-width: 240px; max-width: 15rem; } }

.post-content .post-image-float-left { padding: 8px 8px 8px 16px; padding: 0.5rem 0.5rem 0.5rem 1rem; }

@media screen and (min-width: 948px) { .post-content .post-image-float-left { float: left; max-width: 240px; max-width: 15rem; } }

#content.gray-bg { background-color: #eee; }

.box { background-color: #fff; margin: 0; padding: 20px 15px 20px 15px; }

.box p { margin: 0; color: #4e4e4e; }

.box li { margin: 4px 12px 4px 4px; margin: 0.25rem 0.75rem 0.25rem 0.25rem; color: #4e4e4e; }

.box h3 { margin: 0; }

.box h4 { margin: 0; }

.box h5 { margin: 24px 8px 12px 12px; margin: 1.5rem 0.5rem 0.75rem 0.75rem; }

.box .link-box { background-color: #253746; }

@media screen and (min-width: 650px) { .box { margin-bottom: 0; } }

#case-quote, .case-quote { background: #f9f9f9; border-left: 10px solid #ccc; margin: 24px 0; padding: 8px 12px; margin: 1.5rem 0; padding: 0.5rem 0.75rem; quotes: "“" "”" "“" "”"; }

#case-quote:before, .case-quote:before { color: #ccc; content: open-quote; font-size: 64px; line-height: 2px; margin-right: 2px; vertical-align: -6px; font-size: 4rem; line-height: 0.1em; margin-right: 0.1rem; vertical-align: -0.4em; }

#case-quote p.quote-text, .case-quote p.quote-text { display: inline; font-size: 19px; line-height: 29px; font-size: 1.2rem; line-height: 1.8rem; }

#case-quote p.quote-person, .case-quote p.quote-person { margin: 24px 0 8px 0; margin: 1.5rem 0 0.5rem 0; }

#aside #case-quote p.quote-text, #aside .case-quote p.quote-text { font-size: 15px; line-height: 25px; font-size: 0.95rem; line-height: 1.55rem; }

#aside #case-quote, #aside .case-quote { background: #ffffff; }

#aside .quote-person { font-size: 15px; line-height: 25px; font-size: 0.95rem; line-height: 1.65rem; }

p.quote-link { margin: 0; padding: 0.5rem 0 0; font-size: 13px; font-size: 0.8rem; }

.margin-bottom { margin-bottom: 8px; }

p.small-date { font-size: 14px; font-size: 0.9rem; color: #8e8e8e; }

p.small { font-size: 14px; font-size: 0.9rem; color: #8e8e8e; clear: both; }

p.highlight-small { font-size: 0.8rem; font-size: 0.8rem; color: #8e8e8e; clear: both; float: right; padding-top: 0; margin-top: 0; padding-left: 7px; }

.box-side h3 { margin-top: 18px; font-size: 18px; font-size: 1.1rem; margin-top: 0.5rem; color: #424242; }

.box-side h4 { margin-top: 20px; font-size: 16px; font-size: 0.95rem; color: #6e6e6e; font-style: normal; }

.box-side p, .box-side li { font-size: 14px; line-height: 24px; font-size: 0.9rem; line-height: 1.5rem; }

.fifty-left { margin: 0; width: 100%; }

@media screen and (min-width: 550px) { .fifty-left { float: left; width: 50%; padding: 0 8px 0 0; padding: 0 0.5rem 0 0; clear: left; } }

.fifty-right { width: 100%; margin: 0; }

@media screen and (min-width: 550px) { .fifty-right { float: left; width: 50%; padding: 0 0 0 8px; padding: 0 0 0 0.5rem; clear: right; } }

.box-mini { width: 100%; margin-bottom: 16px; padding: 2px 4px; margin-bottom: 1rem; padding: 0.1rem 0.25rem; float: left; transition: background-color 0.2s ease-in-out 0s; }

.box-mini h3 { margin-top: 4px; font-size: 16px; margin-top: 0.25rem; font-size: 1rem; color: #de7c00; }

.box-mini p, .box-mini li { font-size: 12px; line-height: 18px; font-size: 0.75rem; line-height: 1.15rem; }

.box-mini:hover { background-color: #eaeaea; }

.box-mini a { text-decoration: none; }

#product-menu .request-evaluation { border: 0; border-radius: 4px; background: #06aae0; background: -webkit-linear-gradient(#06aae0, #08aeef); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(#06aae0, #08aeef); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(#06aae0, #08aeef); /* For Firefox 3.6 to 15 */ background: linear-gradient(#06aae0, #08aeef); /* Standard syntax */ -webkit-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.2); }

#product-menu .request-evaluation:hover { background: #08aeef; background: -webkit-linear-gradient(#08aeef, #18beff); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(#08aeef, #18beff); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(#08aeef, #18beff); /* For Firefox 3.6 to 15 */ background: linear-gradient(#08aeef, #18beff); /* Standard syntax */ }

#product-menu .request-evaluation h3, #product-menu .request-evaluation p { margin: 0.5rem; color: #ffffff; font-weight: 500; }

#product-menu .request-evaluation p { font-size: 12px; font-size: 0.75rem; }

#product-menu .purchase-license { border: 0; border-radius: 4px; background: #bf0152; background: -webkit-linear-gradient(#bf0152, #cf0162); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(#bf0152, #cf0162); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(#bf0152, #cf0162); /* For Firefox 3.6 to 15 */ background: linear-gradient(#bf0152, #cf0162); /* Standard syntax */ -webkit-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.2); }

#product-menu .purchase-license:hover { background: #cf0162; background: -webkit-linear-gradient(#cf0162, #df1172); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(#cf0162, #df1172); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(#cf0162, #df1172); /* For Firefox 3.6 to 15 */ background: linear-gradient(#cf0162, #df1172); /* Standard syntax */ }

#product-menu .purchase-license h3, #product-menu .purchase-license p { margin: 0.5rem; color: #ffffff; font-weight: 500; }

#product-menu .purchase-license p { font-size: 12px; font-size: 0.75rem; }

.box-33 { width: 33.33%; padding: 0 8px; padding: 0 0.5rem; }

.box-66 { width: 66.66%; padding: 0 8px; padding: 0 0.5rem; }

.highlight-image { float: left; width: 160px; width: 10rem; padding: 12px 8px 8px 20px; padding: 0.75rem 0.5rem 0.5rem 1.25rem; }

.highlight-image img { padding: 8px 0; padding: 0.5rem 0; }

@media screen and (min-width: 750px) { .highlight-image { width: 160px; padding-left: 16px; width: 10rem; padding-left: 1rem; } }

.highlight-text { width: 100%; clear: both; padding: 0 0.5rem; padding: 0 8px; }

@media screen and (min-width: 750px) { .highlight-text { float: right; width: -webkit-calc(100% - 10rem); width: -moz-calc(100% - 10rem); width: calc(100% - 10rem); clear: right; } }

.highlight-box-small { display: inline; }

@media screen and (min-width: 650px) { .highlight-box-small { width: calc(100% - 3rem); } }

.highlight-box-small .box { margin: 8px 0 0; margin: 0.75rem 0 0; }

.highlight-box-small .highlight-image { width: 96px; width: 6rem; }

@media screen and (min-width: 650px) { .highlight-box-small .highlight-text { float: right; width: -webkit-calc(100% - 6rem); width: -moz-calc(100% - 6rem); width: calc(100% - 6rem); clear: right; } }

.image-caption { font-size: 14px; font-size: 0.9rem; color: #8e8e8e; padding: 4px 16px 24px; padding: 0.25rem 1rem 1.5rem; }

table { border-collapse: collapse; margin: 4px 8px; margin: 0.25rem 0.5rem; }

td { padding: 2px 4px; padding: 0.125rem 0.25rem; }

@media screen and (min-width: 550px) { td { padding: 4px 8px; padding: 0.25rem 0.5rem; } }

table, th, td { font-size: 13px; font-size: 0.8rem; border: 1px solid #d1d1d1; }

@media screen and (min-width: 550px) { table, th, td { font-size: 14px; font-size: 0.9rem; } }

table.sidedtable, table.sidedtable th, table.sidedtable td { border: 0; }

td.centered { vertical-align: middle; }

td.centered input, form.infoForm td.centered input, form.infoForm td.centered select, form.infoForm td.centered textarea { margin-top: 0; margin-bottom: 0; }

#content #main .highlight-box-small + h2, #content #main .highlight-box + h2, #content #main .box + h2 { padding-top: 1.5rem; }

input[type="button"] { margin: 1rem; }

input[type="text"], input[type="email"], select, textarea { border: 1px solid #d1d1d1; height: 32px; font-size: 14px; height: 2rem; font-size: 0.9rem; width: 100%; padding: 0 0.25rem; }

textarea { height: 200px; }

table.sidedtable { margin-top: 0.5rem; margin-bottom: 1.5rem; }

table.sidedtable td { min-width: 9rem; }

form.infoForm { margin: 0.5rem 1rem 1.5rem; }

form.infoForm input, form.infoForm select, form.infoForm textarea { margin-bottom: 0.75rem; max-width: 24rem; display: block; }

form.infoForm label { color: #6e6e6e; font-size: 0.9rem; }

.product-links { float: left; margin-right: 1rem; clear: both; margin: 0.5rem 0.5rem 1rem; font-weight: 600; }

@media screen and (min-width: 650px) { .product-links { clear: none; } }

.long-separator { margin-top: 4rem; margin-bottom: 4rem; border: 1px solid #d1d1d1; border-bottom: 0; }

strong { font-weight: 700; }

.pdf-link { background-image: url(/img/document-icon.png); background-repeat: no-repeat; background-position: 10px 50%; -webkit-background-size: 30px 30px; -moz-background-size: 30px 30px; background-size: 30px 30px; padding: 3px 0 3px 50px; }

p.alert { color: red; }

.china-and-russia { font-size: 17px; }

@media screen and (min-width: 1045px) { .china-and-russia { font-size: 13px; } }

@media screen and (min-width: 948px) { .china-and-russia { font-size: 15px; } }

@media screen and (min-width: 1120px) { .china-and-russia { font-size: 18px; } }

.small-hr-margin { margin: 0.5rem 0; }

.zero-bottom-margin { margin-bottom: 0; }

.opc-classic_form-header { background-color: #4d2da5; margin-top: 18px; padding: 10px; }

.opc-classic_form-header h3 { color: #fff !important; text-align: center; }

/*****************************************************************************/
/*
/* Grid System
/*
/*****************************************************************************/
.container { margin-right: auto; margin-left: auto; }

.container-fluid { padding-right: 0; padding-left: 0; margin-right: auto; margin-left: auto; }

.grid-row { margin-bottom: 20px; }

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; }

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { float: left; }

.col-xs-12 { width: 100%; }

.col-xs-11 { width: 91.66666667%; }

.col-xs-10 { width: 83.33333333%; }

.col-xs-9 { width: 75%; }

.col-xs-8 { width: 66.66666667%; }

.col-xs-7 { width: 58.33333333%; }

.col-xs-6 { width: 50%; }

.col-xs-5 { width: 41.66666667%; }

.col-xs-4 { width: 33.33333333%; }

.col-xs-3 { width: 25%; }

.col-xs-2 { width: 16.66666667%; }

.col-xs-1 { width: 8.33333333%; }

.col-xs-pull-12 { right: 100%; }

.col-xs-pull-11 { right: 91.66666667%; }

.col-xs-pull-10 { right: 83.33333333%; }

.col-xs-pull-9 { right: 75%; }

.col-xs-pull-8 { right: 66.66666667%; }

.col-xs-pull-7 { right: 58.33333333%; }

.col-xs-pull-6 { right: 50%; }

.col-xs-pull-5 { right: 41.66666667%; }

.col-xs-pull-4 { right: 33.33333333%; }

.col-xs-pull-3 { right: 25%; }

.col-xs-pull-2 { right: 16.66666667%; }

.col-xs-pull-1 { right: 8.33333333%; }

.col-xs-pull-0 { right: auto; }

.col-xs-push-12 { left: 100%; }

.col-xs-push-11 { left: 91.66666667%; }

.col-xs-push-10 { left: 83.33333333%; }

.col-xs-push-9 { left: 75%; }

.col-xs-push-8 { left: 66.66666667%; }

.col-xs-push-7 { left: 58.33333333%; }

.col-xs-push-6 { left: 50%; }

.col-xs-push-5 { left: 41.66666667%; }

.col-xs-push-4 { left: 33.33333333%; }

.col-xs-push-3 { left: 25%; }

.col-xs-push-2 { left: 16.66666667%; }

.col-xs-push-1 { left: 8.33333333%; }

.col-xs-push-0 { left: auto; }

.col-xs-offset-12 { margin-left: 100%; }

.col-xs-offset-11 { margin-left: 91.66666667%; }

.col-xs-offset-10 { margin-left: 83.33333333%; }

.col-xs-offset-9 { margin-left: 75%; }

.col-xs-offset-8 { margin-left: 66.66666667%; }

.col-xs-offset-7 { margin-left: 58.33333333%; }

.col-xs-offset-6 { margin-left: 50%; }

.col-xs-offset-5 { margin-left: 41.66666667%; }

.col-xs-offset-4 { margin-left: 33.33333333%; }

.col-xs-offset-3 { margin-left: 25%; }

.col-xs-offset-2 { margin-left: 16.66666667%; }

.col-xs-offset-1 { margin-left: 8.33333333%; }

.col-xs-offset-0 { margin-left: 0; }

@media (min-width: 768px) { .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; } .col-sm-12 { width: 100%; } .col-sm-11 { width: 91.66666667%; } .col-sm-10 { width: 83.33333333%; } .col-sm-9 { width: 75%; } .col-sm-8 { width: 66.66666667%; } .col-sm-7 { width: 58.33333333%; } .col-sm-6 { width: 50%; } .col-sm-5 { width: 41.66666667%; } .col-sm-4 { width: 33.33333333%; } .col-sm-3 { width: 25%; } .col-sm-2 { width: 16.66666667%; } .col-sm-1 { width: 8.33333333%; } .col-sm-pull-12 { right: 100%; } .col-sm-pull-11 { right: 91.66666667%; } .col-sm-pull-10 { right: 83.33333333%; } .col-sm-pull-9 { right: 75%; } .col-sm-pull-8 { right: 66.66666667%; } .col-sm-pull-7 { right: 58.33333333%; } .col-sm-pull-6 { right: 50%; } .col-sm-pull-5 { right: 41.66666667%; } .col-sm-pull-4 { right: 33.33333333%; } .col-sm-pull-3 { right: 25%; } .col-sm-pull-2 { right: 16.66666667%; } .col-sm-pull-1 { right: 8.33333333%; } .col-sm-pull-0 { right: auto; } .col-sm-push-12 { left: 100%; } .col-sm-push-11 { left: 91.66666667%; } .col-sm-push-10 { left: 83.33333333%; } .col-sm-push-9 { left: 75%; } .col-sm-push-8 { left: 66.66666667%; } .col-sm-push-7 { left: 58.33333333%; } .col-sm-push-6 { left: 50%; } .col-sm-push-5 { left: 41.66666667%; } .col-sm-push-4 { left: 33.33333333%; } .col-sm-push-3 { left: 25%; } .col-sm-push-2 { left: 16.66666667%; } .col-sm-push-1 { left: 8.33333333%; } .col-sm-push-0 { left: auto; } .col-sm-offset-12 { margin-left: 100%; } .col-sm-offset-11 { margin-left: 91.66666667%; } .col-sm-offset-10 { margin-left: 83.33333333%; } .col-sm-offset-9 { margin-left: 75%; } .col-sm-offset-8 { margin-left: 66.66666667%; } .col-sm-offset-7 { margin-left: 58.33333333%; } .col-sm-offset-6 { margin-left: 50%; } .col-sm-offset-5 { margin-left: 41.66666667%; } .col-sm-offset-4 { margin-left: 33.33333333%; } .col-sm-offset-3 { margin-left: 25%; } .col-sm-offset-2 { margin-left: 16.66666667%; } .col-sm-offset-1 { margin-left: 8.33333333%; } .col-sm-offset-0 { margin-left: 0; } }

@media (min-width: 992px) { .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; } .col-md-12 { width: 100%; } .col-md-11 { width: 91.66666667%; } .col-md-10 { width: 83.33333333%; } .col-md-9 { width: 75%; } .col-md-8 { width: 66.66666667%; } .col-md-7 { width: 58.33333333%; } .col-md-6 { width: 50%; } .col-md-5 { width: 41.66666667%; } .col-md-4 { width: 33.33333333%; } .col-md-3 { width: 25%; } .col-md-2 { width: 16.66666667%; } .col-md-1 { width: 8.33333333%; } .col-md-pull-12 { right: 100%; } .col-md-pull-11 { right: 91.66666667%; } .col-md-pull-10 { right: 83.33333333%; } .col-md-pull-9 { right: 75%; } .col-md-pull-8 { right: 66.66666667%; } .col-md-pull-7 { right: 58.33333333%; } .col-md-pull-6 { right: 50%; } .col-md-pull-5 { right: 41.66666667%; } .col-md-pull-4 { right: 33.33333333%; } .col-md-pull-3 { right: 25%; } .col-md-pull-2 { right: 16.66666667%; } .col-md-pull-1 { right: 8.33333333%; } .col-md-pull-0 { right: auto; } .col-md-push-12 { left: 100%; } .col-md-push-11 { left: 91.66666667%; } .col-md-push-10 { left: 83.33333333%; } .col-md-push-9 { left: 75%; } .col-md-push-8 { left: 66.66666667%; } .col-md-push-7 { left: 58.33333333%; } .col-md-push-6 { left: 50%; } .col-md-push-5 { left: 41.66666667%; } .col-md-push-4 { left: 33.33333333%; } .col-md-push-3 { left: 25%; } .col-md-push-2 { left: 16.66666667%; } .col-md-push-1 { left: 8.33333333%; } .col-md-push-0 { left: auto; } .col-md-offset-12 { margin-left: 100%; } .col-md-offset-11 { margin-left: 91.66666667%; } .col-md-offset-10 { margin-left: 83.33333333%; } .col-md-offset-9 { margin-left: 75%; } .col-md-offset-8 { margin-left: 66.66666667%; } .col-md-offset-7 { margin-left: 58.33333333%; } .col-md-offset-6 { margin-left: 50%; } .col-md-offset-5 { margin-left: 41.66666667%; } .col-md-offset-4 { margin-left: 33.33333333%; } .col-md-offset-3 { margin-left: 25%; } .col-md-offset-2 { margin-left: 16.66666667%; } .col-md-offset-1 { margin-left: 8.33333333%; } .col-md-offset-0 { margin-left: 0; } }

@media (min-width: 1200px) { .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { float: left; } .col-lg-12 { width: 100%; } .col-lg-11 { width: 91.66666667%; } .col-lg-10 { width: 83.33333333%; } .col-lg-9 { width: 75%; } .col-lg-8 { width: 66.66666667%; } .col-lg-7 { width: 58.33333333%; } .col-lg-6 { width: 50%; } .col-lg-5 { width: 41.66666667%; } .col-lg-4 { width: 33.33333333%; } .col-lg-3 { width: 25%; } .col-lg-2 { width: 16.66666667%; } .col-lg-1 { width: 8.33333333%; } .col-lg-pull-12 { right: 100%; } .col-lg-pull-11 { right: 91.66666667%; } .col-lg-pull-10 { right: 83.33333333%; } .col-lg-pull-9 { right: 75%; } .col-lg-pull-8 { right: 66.66666667%; } .col-lg-pull-7 { right: 58.33333333%; } .col-lg-pull-6 { right: 50%; } .col-lg-pull-5 { right: 41.66666667%; } .col-lg-pull-4 { right: 33.33333333%; } .col-lg-pull-3 { right: 25%; } .col-lg-pull-2 { right: 16.66666667%; } .col-lg-pull-1 { right: 8.33333333%; } .col-lg-pull-0 { right: auto; } .col-lg-push-12 { left: 100%; } .col-lg-push-11 { left: 91.66666667%; } .col-lg-push-10 { left: 83.33333333%; } .col-lg-push-9 { left: 75%; } .col-lg-push-8 { left: 66.66666667%; } .col-lg-push-7 { left: 58.33333333%; } .col-lg-push-6 { left: 50%; } .col-lg-push-5 { left: 41.66666667%; } .col-lg-push-4 { left: 33.33333333%; } .col-lg-push-3 { left: 25%; } .col-lg-push-2 { left: 16.66666667%; } .col-lg-push-1 { left: 8.33333333%; } .col-lg-push-0 { left: auto; } .col-lg-offset-12 { margin-left: 100%; } .col-lg-offset-11 { margin-left: 91.66666667%; } .col-lg-offset-10 { margin-left: 83.33333333%; } .col-lg-offset-9 { margin-left: 75%; } .col-lg-offset-8 { margin-left: 66.66666667%; } .col-lg-offset-7 { margin-left: 58.33333333%; } .col-lg-offset-6 { margin-left: 50%; } .col-lg-offset-5 { margin-left: 41.66666667%; } .col-lg-offset-4 { margin-left: 33.33333333%; } .col-lg-offset-3 { margin-left: 25%; } .col-lg-offset-2 { margin-left: 16.66666667%; } .col-lg-offset-1 { margin-left: 8.33333333%; } .col-lg-offset-0 { margin-left: 0; } }

.col-no-margin { margin: 0; padding: 0; }

/** ---------------------------------------- animation kenburns-top ---------------------------------------- */
.kenburns-top { -webkit-animation: kenburns-top 5s ease-out both; animation: kenburns-top 5s ease-out both; }

@-webkit-keyframes kenburns-top { 0% { -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
    transform-origin: 50% 16%; }
  100% { -webkit-transform: scale(1.25) translateY(-15px);
    transform: scale(1.25) translateY(-15px);
    -webkit-transform-origin: top;
    transform-origin: top; } }

@keyframes kenburns-top { 0% { -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
    transform-origin: 50% 16%; }
  100% { -webkit-transform: scale(1.25) translateY(-15px);
    transform: scale(1.25) translateY(-15px);
    -webkit-transform-origin: top;
    transform-origin: top; } }

/** ---------------------------------------- animation text-blur-in ---------------------------------------- */
.text-blur-in { -webkit-animation: text-blur-in 1s cubic-bezier(0.55, 0.085, 0.68, 0.53) both; animation: text-blur-in 1s cubic-bezier(0.55, 0.085, 0.68, 0.53) both; }

@-webkit-keyframes text-blur-in { 0% { -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0; }
  100% { -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1; } }

@keyframes text-blur-in { 0% { -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0; }
  100% { -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1; } }

/** ---------------------------------------- animation text-blur-out ---------------------------------------- */
.text-blur-out { -webkit-animation: text-blur-out 1.2s cubic-bezier(0.55, 0.085, 0.68, 0.53) both; animation: text-blur-out 1.2s cubic-bezier(0.55, 0.085, 0.68, 0.53) both; }

@-webkit-keyframes text-blur-out { 0% { -webkit-filter: blur(0.01);
    filter: blur(0.01); }
  100% { -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%); } }

@keyframes text-blur-out { 0% { -webkit-filter: blur(0.01);
    filter: blur(0.01); }
  100% { -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%); } }

.rate { float: left; height: 46px; padding: 0 10px; }

.rate:not(:checked) > input { position: absolute; visibility: hidden; }

.rate:not(:checked) > label { float: right; width: 1em; overflow: hidden; white-space: nowrap; cursor: pointer; font-size: 30px; color: #ccc; }

.rate:not(:checked) > label:before { content: '★ '; }

.rate > input:checked ~ label { color: #ffc700; }

.rate:not(:checked) > label:hover, .rate:not(:checked) > label:hover ~ label { color: #deb217; }

.rate > input:checked + label:hover, .rate > input:checked + label:hover ~ label, .rate > input:checked ~ label:hover, .rate > input:checked ~ label:hover ~ label, .rate > label:hover ~ input:checked ~ label { color: #c59b08; }

.form-control { display: block; width: 100%; padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }

.form-control:focus { outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); }

.form-control::placeholder { color: #6c757d; opacity: 1; }

.form-control-sm { min-height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; font-size: 0.875rem; border-radius: 0.2rem; }

textarea.form-control { min-height: calc(1.5em + 0.75rem + 2px); }

textarea.form-control-sm { min-height: calc(1.5em + 0.5rem + 2px); }

.form-select { display: block; width: 100%; padding: 0.375rem 1.75rem 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; vertical-align: middle; background-color: #fff; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 16px 12px; border: 1px solid #ced4da; border-radius: 0.25rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.form-select:focus { border-color: #86b7fe; outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); }

.form-select[multiple], .form-select[size]:not([size="1"]) { padding-right: 0.75rem; background-image: none; }

.form-select:disabled { color: #6c757d; background-color: #e9ecef; }

.form-select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #212529; }

.form-select-sm { padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.5rem; font-size: 0.875rem; }

.form-check { display: block; min-height: 1.5rem; padding-left: 1.5em; margin-bottom: 0.125rem; }

.form-check .form-check-input { float: left; margin-left: -1.65em; }

.form-check-input { width: 1.1em; height: 1.1em; margin-top: 0.5em; vertical-align: top; background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: contain; border: 1px solid rgba(0, 0, 0, 0.25); -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; transition: background-color 0.15s ease-in-out, background-position 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }

@media (prefers-reduced-motion: reduce) { .form-check-input { transition: none; } }

.form-check-input[type=checkbox] { border-radius: 0.25em; }

.form-check-input[type=radio] { border-radius: 50%; }

.form-check-input:active { filter: brightness(90%); }

.form-check-input:focus { border-color: #86b7fe; outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); }

.form-check-input:checked { background-color: #0d6efd; border-color: #0d6efd; }

.form-check-input[type=checkbox]:checked { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); }

.form-check-input[type=radio]:checked { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e"); }

.form-check-input[type=checkbox]:indeterminate { background-color: #0d6efd; border-color: #0d6efd; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e"); }

.form-check-input:disabled { pointer-events: none; filter: none; opacity: 0.5; }

.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label { opacity: 0.5; }

.form-switch { padding-left: 2.5em; }

.form-switch .form-check-input { width: 2em; margin-left: -2.5em; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e"); background-position: left center; border-radius: 2em; }

.form-switch .form-check-input:focus { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2386b7fe'/%3e%3c/svg%3e"); }

.form-switch .form-check-input:checked { background-position: right center; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e"); }

.form-check-inline { display: inline-block; margin-right: 1rem; }

.form-check-label { display: inline-block; }

.is-invalid { color: #dc3545; border: 1px solid #dc3545; padding: 1em; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); border-radius: 0.25em; }

/*# sourceMappingURL=main.css.map */