/****************************************************************************
* // Browser Resets
****************************************************************************/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
html * {
outline: 0;
}
html {
font-size: 62.5%;
}
body {
overflow-x: hidden;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
color: #333333;
font-weight: normal;
font-size: 16px;
line-height: 2rem;
position: relative;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote {
font-size: 2rem;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* WCAG requirements */
/* BS overrides */
a:focus {
outline: none;
outline-offset: 0;
}
/* Give all <a>s an underline for WCAG */
a:active, a:focus {
text-decoration: underline !important;
}
/* Corporate blue */
a {color: #285ce6;}
a:hover {text-decoration: underline !important;}
/* Add outlines for specific elements */
/* Main logo */
a.logo:focus img,
/* Currency dropdown (focus 'hijacked' by js) */
#currency:focus #select2-currency-container,
/* x3 grey icons */
a.side-nav_support:focus, button.side-nav_support:focus img,
/* js-rendered */
#js-open-widget:focus,
/* generic class (for keyboard-accessed element with class of tab-highlight) */
.tab-highlight:focus,
/* BS override */
.dropdown-toggle:focus,
/* mobile nav 'burger' */
.navbar-toggle:focus,
/* Promo bars */
#guarantee-bar a:focus, #guarantee-bar-mob a:focus, #price-match-bar a:focus,
/* currency selector (js rendered) */
span.select2-selection.select2-selection--single.custom-container:focus .select2-selection__rendered,
/* inputs */
input[type=text]:focus, input[type=email]:focus, textarea:focus, select:focus, input[type=submit]:focus,
/* .button elements */
.button:focus, .button-blue-white:focus, .button-white-blue:focus, .button-blue:focus,
/* .promo-form-submit */
.promo-form-submit:focus,
/* Contact form main select */
#selections .select2-container--focus .selection .select2-selection--single:focus,
/* In-page content tabs */
.nav-tabs li a:focus,
/* Modal dialogue dismiss btn */
.lity-close:focus,
/* Home page product blocks */
.tab-boxed a:focus,
/* BS form element overrides */
input[type=file]:focus, input[type=checkbox]:focus, input[type=radio]:focus,
/* Carousel next/prev buttons */
.carousel-control-prev:focus .carousel-control-prev-icon, .carousel-control-next:focus .carousel-control-next-icon,
/* OneTrust Cookies settings button */
.ot-sdk-show-settings:focus,
/* Currency dropdown now that its a proper <select> */
select#currency:focus, select#quantity:focus, select#variation-dh:focus, select#diagnostic:focus
{
outline: 2px solid #000;
outline-offset: 2px;
border-radius: 2px;
}
/* exclude any element with class of .no-tab-highlight */
.no-tab-highlight:focus {
outline: none;
outline-offset: 0;
border-radius: initial;
}
.tab-highlight.tab-blue:focus {
outline: 2px solid #141380;
}
.tab-highlight.tab-lite:focus {
outline: 1px solid #fff;
}
/* Footer links */
footer a:focus
{
outline: 2px solid #fff;
outline-offset: 2px;
border-radius: 2px;
}
/* BS Override to help stop :focussed elements from getting outline on hover or active (except when JS ones get focus added on click) */
a:active, a:hover {
outline: 0 !important;
}
.form-control {
font-size: 1.6rem;
line-height: 1.8rem;
}
.container {
max-width: 1128px;
}
.clearfix:before,
.clearfix:after {
display: table;
content: "";
line-height: 0;
}
.clearfix:after {
clear: both;
}
.boxfix {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.ui-tooltip {
white-space: pre-line;
}
.center {
text-align: center;
}
.right {
text-align: right;
}
.right-align {
float: right;
}
.right-offset {
margin-right: 1.5rem;
}
.left-offset {
margin-left: -1.5rem;
}
.left {
text-align: left;
}
.left-15 {
margin-left: -1.5rem;
}
.icon {
width: 60px;
}
.fixed-icon {
height: 60px !important;
}
.popover-content {
padding: 9px 14px;
color: #666666;
}
a[data-toggle="popover"] {
text-decoration: underline;
}
.underline {
text-decoration: underline;
}
.img-fluid {
display: block;
max-width: 100%;
height: auto;
}
#color-gradient-defs {position: absolute;}
/****************************************************************************
* // Content Show / Hide
****************************************************************************/
.mob-show {
display: block;
}
.mob-hide,
.hiddenClass,
.off {
display: none;
}
.hiddenClass,
.visible-mobile {
display: none !important;
}
.showClass {
display: block;
}
@media (max-width: 467px) {
.visible-mobile {
display: inline !important;
}
.hidden-mobile {
display: none !important;
}
}
/* JR */
@media only screen and (min-width: 768px) {
.mob-show {
display: none;
}
.mob-hide {
display: block;
}
}
/* END JR */
.tablet-hide {
display: none;
}
.tablet-show {
display: block;
}
@media only screen and (min-width: 1200px) {
.tablet-hide {
display: block;
}
.tablet-show {
display: none;
}
}
/****************************************************************************
* // FONTS
****************************************************************************/
h1 {
font-size: 18px;
font-weight: 600;
line-height: 100%;
padding-bottom: 2.5rem;
}
h2,
.cell-h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
color: #141380;
}
h3 {
font-size: 22px;
font-weight: 300;
line-height: 110%;
letter-spacing: -0.5px;
padding-bottom: 20px;
padding-top: 20px;
}
h4 {
font-size: 22px;
font-weight: 600;
line-height: 110%;
letter-spacing: -0.5px;
margin-top: 0;
color: #ffffff;
}
h5 {
font-size: 1.6rem;
line-height: 2.2rem;
}
h6 {
font-size: 1.6rem;
line-height: 2.6rem;
}
.pre-header-title {
font-size: 20px;
font-weight: 300;
line-height: 115%;
letter-spacing: -0.5px;
color: #626D6F;
display: block;
}
p {
font-size: 16px;
font-weight: 400;
line-height: 140%;
}
p.offer-text {
margin-bottom: 0;
}
#promoCarousel p {
margin-bottom: 0;
}
.ft14 {
font-size: 1.4rem;
}
.small-text {
font-size: 1rem;
padding-bottom: 2rem;
}
.small-text2 {
font-size: 1rem;
padding-bottom: 0;
line-height: 1rem;
}
#feature-chart .best {
margin-top: -2.5rem;
margin-bottom: 1.5rem;
color: orange;
text-decoration: underline;
font-size: 1.1rem;
line-height: 1.4rem;
}
.box-purchase #feature-chart .green-text {
font-size: 12px;
color: #f3f5f5;
font-weight: normal;
line-height: 14px;
margin-bottom: 0;
margin-top: 3.5rem;
}
.banner-header {
font-size: 62px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
color: #141380;
}
.footer-banner {
font-size: 2rem;
line-height: 2.4rem;
letter-spacing: -1px;
font-weight: 600;
margin-top: 3rem;
margin-bottom: 3rem;
}
@media only screen and (min-width: 768px) {
h1 {
padding-bottom: 0;
margin-bottom: 2rem;
}
.banner-header {
font-size: 62px;/*from 62px*/
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
color: #141380;
}
h2,
.cell-h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
color: #141380;
padding-bottom: 10px;
}
h3 {
font-size: 22px;
font-weight: 300;
line-height: 130%;
letter-spacing: -0.5px;
margin-top: 0;
padding-bottom: 20px;
padding-top: 20px;
}
h4 {
font-size: 24px;
font-weight: 300;
line-height: 130%;
letter-spacing: -0.5px;
margin-top: 0;
}
.footer-banner {
font-size: 32px;
font-weight: 400;
line-height: 110%;
letter-spacing: -0.5px;
margin-top: 6rem;
margin-bottom: 6rem;
}
.small-text2 {
line-height: 1rem;
margin-bottom: 1rem !important;
margin-top: -1rem !important;
}
}
@media (max-width: 767px) {
h2, .cell-h2 {
font-size: 36px;
letter-spacing: -0.5px;
}
.banner-header {
font-size: 36px;/*from 46px*/
}
}
/****************************************************************************
* // SPACING
****************************************************************************/
.v30 {
margin-top: 3rem;
}
.v45 {
margin-top: 4.5rem;
}
.v60 {
margin-top: 3rem;
}
.v60tb {
margin-top: 3rem;
margin-bottom: 3rem;
}
.v15tb {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
#usb-headset .v60tb {
margin-top: 3rem;
margin-bottom: 3rem;
}
.v60b {
margin-bottom: 3rem;
}
.v75 {
margin-top: 3.5rem;
}
.mobile-45 {
margin-top: 3rem;
}
.left-neg-15 {
margin-left: -1.5rem;
}
.left-0 {
padding-left: 2rem;
}
.v90 {
margin-top: 4.5rem;
}
.v120 {
margin-top: 15rem;
}
.v30less {
margin-top: -3rem;
}
.grey-expandable {
background-color: #f7f9f9;
padding-bottom: 3rem;
margin-left: 0;
}
.single-line-30,
.single-line-60,
.single-line-90 {
border-bottom: 1px solid #e4e4e4;
margin-top: 3rem;
margin-bottom: 3rem;
}
.long-border {
border-top: 1px solid #e4e4e4;
padding-bottom: 3rem;
margin-top: 3rem;
}
.h15mob {
margin-left: -2rem;
}
.mob-br {
clear: both;
margin-bottom: 3rem;
}
.mob-sp {
padding-top: 5px;
margin-bottom: 3rem;
}
@media only screen and (min-width: 768px) {
.v60tb {
margin-top: 3rem;
margin-bottom: 3rem;
}
.v60b {
margin-bottom: 3rem;
}
#usb-headset .v60tb {
margin-top: 0;
margin-bottom: 3rem;
}
#powermic .pm-30 {
padding-bottom: 3rem;
}
.mobile-45 {
margin-top: 0;
}
.v75 {
margin-top: 7.5rem;
}
.v60 {
margin-top: 6rem;
}
.grey-expandable {
margin-left: -15px;
}
.single-line-60 {
margin-top: 6rem;
margin-bottom: 6rem;
}
.h15mob {
margin-left: 0;
}
.mob-br {
clear: none;
margin-bottom: 0;
}
.mob-sp {
padding-top: 0;
margin-bottom: 0;
}
.long-border {
padding-bottom: 6rem;
margin-top: 6rem;
}
.v90 {
margin-top: 9rem;
}
.single-line-90 {
margin-top: 6rem;
margin-bottom: 6rem;
}
}
/****************************************************************************
* // COLOURS
****************************************************************************/
.primary {
color: #333;
}
.grey {
color: #333;
}
.light-grey {
color: #ccc;
}
.dark-grey {
color: #444;
}
.black {
color: #000;
}
.white {
color: #fff;
}
.blue {
color: #285ce6;
}
.pale-blue {
color: #2DC6D6;
}
.blue-dusk {
color: #2081aa;
}
.full-width-yellow {
background-color: #ffdf00;
}
.full-width-grey {
background-color: #f3f5f5;
}
.blue-bg, .blue-gradient-bg {
background: #131380;
background: linear-gradient(to right, #0173ea 20%,#131380 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0173ea', endColorstr='#131380',GradientType=1 );
}
.bg-dark-blue {
background-color: #1f0d83;
}
.light-blue-bg {
background-color: #2DC6D6;
}
.wcag-blue {
color: #23a0ac;
}
.green {
color: #97db00;
}
.green-bg {
background-color: #97db00;
}
.red-bg {
background-color: #ff0020;
}
.grey-bg {
background-color: #4d5a5d;
}
.light-grey-bg {
background-color: #f3f5f5;
}
/****************************************************************************
* // BUTTONS
****************************************************************************/
.button {
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
}
.button:hover,
.button:focus {
text-decoration: none !important;
}
.button-blue {
background: #3460de; /* Corp bright blue */
color: #ffffff;
display: inline-block;
text-decoration: none !important;
}
.button-blue:hover,
.button-blue:focus {
background: #1c4dd0; /* Corp dark blue */
color: #ffffff;
text-decoration: none !important;
}
.button-white {
background: #ffffff;
color: #000;
display: inline-block;
text-decoration: none !important;
}
.button-white:hover,
.button-white:focus {
background: #F2F5F5; /* Grey */
color: #000;
text-decoration: none !important;
}
.button-red {
background: #CE4400 ;
color: #ffffff;
}
.button-red:hover,
.button-red:focus {
background: #db4900;
color: #ffffff;
text-decoration: none !important;
}
.bt-buynow {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
margin-bottom: 0;
margin-top: 1.6rem;
}
.bt-buysales {
background-color: #3460de ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
}
@media only screen and (min-width: 768px) {
.bt-buynow {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
margin-bottom: 0;
margin-top: 1.6rem;
}
.bt-buysales {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
}
}
@media only screen and (min-width: 968px) {
.button {
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
}
.bt-buynow {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
margin-bottom: 0;
margin-top: 1.6rem;
}
.bt-buysales {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
}
}
@media only screen and (min-width: 1200px) {
.button {
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
}
.bt-buynow {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
margin-bottom: 0;
margin-top: 1.6rem;
}
.bt-buysales {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
}
}
/****************************************************************************
* // font-awesome icons
****************************************************************************/
.listed-features li:before,
.tab-content li:before,
.bullet p:before {
content: "\f00c";
font-family: FontAwesome;
left: 0;
position: absolute;
top: 0;
}
.dragon .fa-chevron-circle-right {
margin-right: 10px;
font-size: 22px;
}
.box-tabs .box:before,
#arrows p:before {
content: "-";
font-family: FontAwesome;
left: 0;
position: absolute;
top: 0;
}
.pm p:before {
content: "-";
font-family: FontAwesome;
left: 0;
position: absolute;
color: #000000;
right: 15px;
}
.green,
.green li::before {
color: #9fca3e;
}
.yellow,
.yellow li::before {
color: #ffdb00;
}
.blue,
.blue li::before {
color: #285ce6;
}
.light-blue,
.light-blue li::before {
color: #2dc6d6;
}
/****************************************************************************
* // List of Features
****************************************************************************/
.listed-features {
margin: 1rem 0 0 0;
padding: 0;
list-style: none;
}
.listed-features li {
font-size: 18px;
position: relative;
color: #333333;
padding-left: 3rem;
margin-top: -1.8rem;
margin-bottom: 1rem;
font-weight: 400;
line-height: 140%;
}
#price-match .listed-features li {
position: relative;
}
.top-fix {
margin-top: 0;
}
.listed-features li {
margin-top: 1.2rem;
}
@media only screen and (max-width: 768px) {
.box-sales .col-xs-5,
.box-sales .col-xs-7,
.tab-pane .content-block2 .col-xs-6,
.system-requirements .col-xs-6,
.features .col-xs-6 {
width: 100%;
}
}
@media only screen and (min-width: 768px) {
.listed-features li {
margin-top: 0;
}
}
/****************************************************************************
* //Nav Bar
****************************************************************************/
header {
height: auto;
border-bottom: 1px solid #eeeeee;
}
.navbar {
position: relative;
max-height: 67px;
margin-bottom: 0;
}
/*
@media only screen and (min-width:769px) {
.nav.navbar-nav .dropdown:nth-child(2) .dropdown-menu {
margin-left: -25vw;
}
}
@media only screen and (min-width:1096px) {
.nav.navbar-nav .dropdown:nth-child(2) .dropdown-menu {
margin-left: -120%;
}
}
*/
/* @media only screen and (min-width: 768px) {
.navbar-brand {
height: 67px;
padding: 21px 15px;
}
}
@media only screen and (min-width: 991px) {
.navbar-brand {
padding: 23px 15px;
}
} */
.navbar-brand img {
width: 227px;
max-width: 227px;
margin-left: -58px;
margin-top: -5px;
}
.navbar-brand img.desktop {
display: none;
}
.navbar-brand img.mobile {
display: block;
}
@media only screen and (min-width: 1099px) {
.navbar-brand img.desktop {
display: block;
}
.navbar-brand img.mobile {
display: none;
}
}
@media only screen and (min-width: 1099px) {
.navbar-brand img.desktop {
margin-left: -58px;
}
}
@media only screen and (min-width: 1275px) {
.navbar-brand img.desktop {
margin-left: 0px;
}
}
@media only screen and (min-width: 1200px) {
.navbar-brand img.desktop {
padding-left: 15px;
}
}
/* .nav.navbar-nav .dropdown:nth-child(1) .dropdown-menu ul li:nth-child(5) {
border-bottom: 0;
} */
.currency select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
color: #333333;
cursor: pointer;
display: inline-block;
font-weight: normal;
font-size: 12px;
height: 37px;
margin: 0;
padding: 18px 25px 0 1px;
position: relative;
border: none;
background: transparent;
}
.navbar-form {
margin-top: 0;
}
select option {
padding: 4px 0 4px 4px;
border: none;
}
.fa-shopping-basket {
color: #333333;
padding: 21px 14px 19px;
margin-right: 0;
margin-top: 0;
font-size: 14px;
}
@media only screen and (min-width: 768px) {
.fa-shopping-basket {
padding: 27px 14px 26px;
}
}
.top-elements {
float: right;
display: flex;
}
.top-elements .side-nav>div.li {
margin-right: 12px;
}
@media only screen and (min-width: 768px) {
.top-elements .side-nav>div.li {
margin-right: 0;
}
}
.top-elements .side-nav>div.li>a {
padding: 16px 0;
display: block;
position: relative;
}
.top-elements .side-nav>div.li>a>img {
display: block;
}
.top-elements .side-nav>div.li.mob-hide {
display: none;
}
@media only screen and (min-width: 991px) {
.top-elements .side-nav>div.li>a {
padding: 23px 0px 22px;
}
.top-elements .side-nav>div.li.mob-hide {
display: block;
}
}
.top-elements .side-nav {
display: flex;
align-items: center;
}
.top-elements .side-nav>div.li:hover>a {
opacity: 0.65;
}
.top-elements .side-nav>div.li.dropdown a:before {
display: none;
}
.top-elements .side-nav>div.li.dropdown>ul.dropdown-menu {
top: calc(100% - 2px);
left: inherit;
right: -34px;
margin-top: 2px;
transform: none;
}
/* @media only screen and (min-width: 768px) {
.top-elements .side-nav>li>.side-nav_support {
padding: 23px 15px 22px;
}
} */
#darkness {
background: rgba(0, 0, 0, 0.6);
display: none;
height: 100%;
left: 0;
position: absolute;
top: 70px;
width: 100%;
z-index: 100;
}
.navbar .navbar-nav {
display: inline-block;
float: none;
margin-top: 0;
margin-left: -15px;
}
.navbar .navbar-collapse {
text-align: center;
}
.navbar-default .navbar-nav>div.li>a,
.navbar-default .navbar-nav>div.li>a:focus,
.navbar-default .navbar-nav>div.li>a:hover {
color: #000000;
font-weight: 600;
background-color: transparent;
letter-spacing: 0;
font-size: 14px;
}
.navbar-default .navbar-nav>div.li.mob-show {
display: block;
}
/* @media only screen and (min-width: 768px) {
.navbar-default .navbar-nav>div.li.mob-show {
display: none;
}
} */
.navbar-default .navbar-nav>.active>a:hover {
text-decoration: underline;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
background-color: transparent;
}
.navbar-nav>div.li>a {
padding-top: 19px;
padding-bottom: 16px;
}
@media only screen and (min-width: 768px) {
.navbar-nav>div.li>a {
padding-top: 25px;
padding-bottom: 22px;
}
}
.dropdown-menu {
left: 50%;
transform: translateX(-50%);
min-width: 300px;
padding: 25px 0;
border: 5px;
border-radius: 0;
-webkit-box-shadow: 5px;
box-shadow: 10px;
margin-left: 0;
position: absolute;
font-size: 16px;
}
.menu-two-col {
width: auto;
left: 50%;
transform: translateX(-50%);
}
/* @media (max-width: 767px) {
.navbar-nav .open .dropdown-menu {
transform: none;
}
} */
.menu-two-col ul {
list-style-type: none;
padding-left: 0;
}
.menu-gap {
margin-left: 20px;
}
.sub-menu-title {
padding: 2px 0 9px 0;
margin: 0px 20px 0 20px;
}
.menu-bottom-border {
border-bottom: 1px solid #666666;
margin: 10px 20px 20px 20px;
}
.menu-bottom-space {
margin: 0px 50px 0px 20px;
height: 20px;
}
.menu-bottom-border-grey {
border-bottom: 1px solid #cccccc;
margin: 20px 50px 20px 20px;
}
.dropdown-menu .sub-menu-title-link a {
padding: 5px 0 5px 20px;
}
.dropdown-menu .sub-menu-title-link a:hover {
color: #666666;
}
.overview-item {
padding-bottom: 10px;
border-bottom: 1px solid #666666;
margin-bottom: 15px;
margin-left: 0;
padding-top: 7px;
}
.sub-menu-item {
padding-bottom: 5px;
}
.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover,
.sub-menu-item:hover,
.dropdown-menu .sub-menu-title-link a:hover {
background-color: #EAEFFC;
}
.menu-right-bar {
border-right: 1px solid #666666;
}
.menu-left-bar {
border-left: 1px solid #666666;
}
.dropdown-menu .col-sm-6 {
padding-left: 0;
padding-right: 0;
}
.dropdown-menu a {
display: block;
padding: 5px 20px 0;
clear: both;
font-size: 16px;
line-height: 1.42857143;
color: #333333;
white-space: nowrap;
margin-bottom: 0;
}
.dropdown-menu a:hover {
text-decoration: none !important;
color: #285CE6 !important;
}
.sub-menu-item a {
margin-bottom: -3px;
}
.dropdown-menu .grey {
color: #999999;
font-size: 12px;
padding: 0 0 5px 0;
display: block;
}
.navbar-default {
background-color: #ffffff;
border-color: #ffffff;
border-bottom: 1px solid #f2f2f2;
}
div.li.dropdown a {
display: block;
position: relative;
}
div.li.dropdown>a:before {
content: "";
position: absolute;
right: 4px;
top: 0px;
display: flex;
align-items: center;
width: 7px;
height: 100%;
background-image: url('../../shared/images/before-arrow.svg');
background-position: center center;
background-repeat: no-repeat;
background-size: 7px 4px;
}
div.li.dropdown-submenu>a:before {
content: "\f107";
font-family: FontAwesome;
position: absolute;
right: 9px;
top: 10px;
font-size: 15px;
}
div.li.dropdown>a.link-swap {
display: inline-block;
}
div.li.dropdown>a.link-swap:hover {
text-decoration: underline;
}
div.li.dropdown>a.original-link {
display: none;
}
.lan-sel {
width: 25px;
border: 1px solid #ccc;
}
.dropbtn {
background-color: transparent;
color: white;
vertical-align: middle;
border: none;
padding-top: 16px;
padding-bottom: 14px;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #ffffff;
min-width: 60px;
box-shadow: none;
z-index: 1;
padding-top: 10px;
padding-bottom: 13px;
}
.dropdown-content a {
color: black;
padding: 3px 16px 6px;
text-decoration: none;
display: block;
}
.dropdown-content a:hover {
background-color: #EAEFFC;
}
.dropdown:hover .dropdown-content {
display: block;
}
.dropdown:hover .dropbtn {
background-color: transparent;
}
@media only screen and (max-width: 1024px) {
div.li.dropdown>a.link-swap {
display: none;
}
div.li.dropdown>a.original-link {
display: inline-block;
}
.navbar-brand img {
margin-left: 0;
margin-top: -3px;
}
}
/* New navbar breakpoint additions Jan 2020
@media only screen and (max-width: 1200px) {
.navbar-default .navbar-nav>div.li>a {
font-size: 11px;
letter-spacing: 0rem;
}
}
@media only screen and (max-width: 1099px) {
.navbar-default .navbar-nav>div.li>a {
font-size: 11px;
letter-spacing: 0rem;
}
.navbar-default .navbar-nav>div.li>a:focus,
.navbar-default .navbar-nav>div.li>a:active,
.navbar-default .navbar-nav>div.li>a:hover {
font-size: 11px;
letter-spacing: 0rem;
}
.navbar-brand img {
width: 46px;
max-width: 46px;
margin-left: 0;
margin-top: 0;
margin-right: 5px;
}
.nav>li>a {
padding-left: 5px;
}
.dropdown-menu,
.menu-two-col {
left: -15px;
}
}
END New navbar breakpoint additions Jan 2020 */
@media only screen and (max-width: 1098px) { /* was 991 */
.navbar-brand img {
width: 46px;
max-width: 46px;
margin-left: 0;
margin-top: 0;
margin-right: 5px;
}
}
@media only screen and (max-width: 990px) {
header {
height: 50px;
}
/* .navbar-brand {
padding: 10px 15px;
} */
.currency select {
padding: 18px 5px 0 1px;
}
.dropbtn {
padding: 15px 3px 12px;
}
.fa-shopping-basket {
padding: 21px 10px 19px 0;
}
#darkness {
background: transparent;
display: none;
z-index: 0;
}
/* .navbar .navbar-nav {
text-align: left;
float: left;
width: 100%;
} */
/* .navbar-toggle {
margin-top: 12px;
border: none;
} */
.navbar-default .navbar-toggle .icon-bar {
background-color: #444444;
}
.menu-right-bar {
border-right: none;
}
.menu-left-bar {
border-left: none;
}
.dropdown-menu {
width: 100%;
position: fixed;
padding-top: 0;
padding-bottom: 0;
}
.dropdown-menu,
.menu-two-col {
left: 0;
}
.navbar-nav .open .dropdown-menu .dropdown-header,
.navbar-nav .open .dropdown-menu>li>a {
padding: 5px 15px 5px 20px;
}
/* div.li.dropdown>a::before {
content: "\f107";
font-family: FontAwesome;
position: absolute;
right: 6%;
top: 30px;
font-size: 40px;
} */
.menu-bottom-border {
border-bottom: none;
margin: 0;
}
/* .navbar-brand img {
width: auto;
max-width: 100%;
margin-left: 0;
margin-top: 0;
height: 30px;
} */
/* .navbar-toggle {
margin-right: 0px;
margin-top: 9px;
} */
.fa-shopping-basket {
background-color: transparent;
}
/* .navbar-default .navbar-nav>div.li>a,
.navbar-default .navbar-nav>div.li>a:focus,
.navbar-default .navbar-nav>div.li>a:hover {
padding: 30px 16px 30px 15px;
border-top: 1px solid #666666;
background-color: #dbdbdb;
} */
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
background-color: #dbdbdb;
border-bottom: 1px solid #666666;
}
.sub-menu-title-link,
.sub-menu-title {
background-color: #ececec;
padding: 30px 0 30px 0;
border-bottom: 1px solid #666666;
}
.dropdown-menu .sub-menu-title-link a {
font-size: 22px;
}
.sub-menu-title {
margin: 0;
padding-left: 20px;
}
.sub-menu-item {
padding: 30px 0 30px 0;
border-bottom: 1px solid #cccccc;
}
.sub-menu-item a {
font-size: 18px;
line-height: 22px;
font-weight: bold;
}
.dropdown-menu .grey {
color: #999999;
font-size: 14px;
padding: 0 0 5px 0;
display: block;
}
.last-drop {
border-bottom: 1px solid #666666;
}
/* #slide-navbar-collapse {
position: fixed;
top: 0;
margin-top: 52px;
left: 15px;
z-index: 999999;
width: 108%;
height: 100%;
background-color: #f9f9f9;
overflow: auto;
bottom: 0;
max-height: inherit;
} */
.caret {
float: right;
}
.dropdown-content {
background-color: #f2f2f2;
}
}
@media only screen and (max-width: 990px) {
.fixedPosition {
position: fixed;
width: 100%;
}
.navbar-fixed-top {
position: fixed !important;
}
.top-elements {
margin-right: 5px;
}
}
@media only screen and (max-width: 990px) and (min-width: 768px) {
.menu-two-col {
margin-left: 0rem;
}
}
.dt {
display: block;
}
.mb {
display: none;
}
@media only screen and (min-width: 768px) {.dt {display: block;} }
@media only screen and (max-width: 767px) {.mb {display: block;} }
/****************************************************************************
* // Guarantee bar
****************************************************************************/
#guarantee-bar, #guarantee-bar-mob {
background-color: #e5ebeb;
}
#guarantee-bar {
display: block;
padding: 1rem 0;
}
#guarantee-bar-mob {
display: none;
}
@media only screen and (max-width: 990px) {
#guarantee-bar {
display: none;
}
#guarantee-bar-mob {
display: block;
}
}
#guarantee-bar p, #guarantee-bar-mob p {
font-size: 1.2rem;
line-height: 1.4rem;
margin: 0;
padding: 0;
color: #333333;
}
#guarantee-bar-mob p {
padding-left: 1.5rem;
}
#guarantee-bar a, #guarantee-bar-mob a {
color: #333333;
}
#guarantee-bar-mob .carousel-inner .item {
padding: 1rem 0;
}
/****************************************************************************
* // Lily Modal
****************************************************************************/
.lity {
z-index: 9990;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
white-space: nowrap;
background: #0b0b0b;
background: rgba(0, 0, 0, 0.6);
}
.lity-close {
position: absolute;
right: 0;
float: right;
z-index: 10000;
}
.lity-content h3 {
font-weight: 700;
padding: 0;
margin-bottom: 10px;
}
.lity-content p {
margin-bottom: 20px;
}
/****************************************************************************
* // Custom select2 for currency
****************************************************************************/
.currency select {
width: 7rem;
}
.select2-container--default .select2-selection--single {
background-color: #fff;
border: none;
border-radius: 0;
height: 100%;
display: flex;
align-items: center;
}
.select2-container .select2-selection--single .select2-selection__rendered {
padding-right: 0;
font-size: 1.35rem;
padding-bottom: 1.3rem;
padding-top: 2px;
font-weight: bold;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #141380;
color: #fff;
}
.select2-container--default .select2-results__option[aria-selected=true] {
background-color: inherit;
}
#select2-currency-results .select2-results__option[aria-selected] {
background-color: #EAEFFC;
color: #285CE6;
}
.li.li-currency {
height: 100%;
display: flex;
}
.select2-results__option[aria-selected=true] {
display: none;
}
.select2-container--default {
font-size: 1.35rem;
}
.select2-dropdown--below {
top: 1.5rem;
}
.select2-results__option {
padding-left: 1.5rem;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
padding-top: 5px;
padding-left: 0.4rem;
}
.custom-dropdown {
padding-top: 0;
padding-bottom: 0;
background-color: #f2f2f2;
border-radius: 0px;
border: 0;
min-width: 7.5rem;
}
@media only screen and (min-width: 767px) {
.custom-dropdown {
background-color: #ffffff;
}
}
/****************************************************************************
* // FOOTER
****************************************************************************/
footer {
background-color: #000000;
}
footer .item {
margin-left: -1.5rem;
}
footer .home-bar {
border-bottom: 1px solid #ffffff;
padding: 1rem 0;
}
footer a {
color: #ffffff;
margin-bottom: 10px;
}
footer a:hover {
color: #ffffff;
}
.footer-links {
padding: 2rem 0 2rem;
}
footer h3 {
font-size: 1.5rem;
line-height: 2.2rem;
color: #ffffff;
font-weight: bold;
letter-spacing: -0.5px;
margin: 0;
}
footer p {
font-weight: normal;
color: #ffffff;
margin: 3rem 0 1.4rem;
}
footer .panel-heading {
padding: 0;
}
footer .panel-title>a {
display: block;
text-decoration: none;
font-size: 1.5rem;
color: #ffffff;
margin-left: -1.3rem;
margin-top: -2rem;
margin-bottom: -3rem;
font-weight: bold;
}
footer .panel-body a {
font-size: 1.3rem;
line-height: 2.2rem;
}
footer .footer-set,
footer .footer-set h4,
footer .footer-set ul {
margin-left: -1.5rem;
}
footer .panel-title {
display: block;
padding: 1.5rem 0;
text-decoration: none;
font-size: 1.5rem;
color: #ffffff;
font-weight: bold;
}
footer .copyright a {
font-size: 1.4rem;
padding: 0 0.5rem;
color: #999;
}
footer .copyright p {
font-size: 1.4rem;
color: #999;
}
footer .footer-set ul {
padding-left: 0;
}
footer .home-bar {
padding: 1.5rem 0;
}
.country-option {
margin-top: 0.5rem;
}
footer a:focus {
color: #ffffff;
text-decoration: none;
}
.country-close {
float: right;
}
footer .fa-home {
padding-left: 2rem;
font-size: 2rem;
}
.home-bar img {
margin-top: -0.3rem;
}
.flag-icon {
width: 3rem;
max-width: 3rem;
padding-right: 0.5rem;
}
.meta {
display: none;
margin-top: 2.8rem;
position: absolute;
background: #ffffff;
z-index: 500;
padding-bottom: 17rem;
}
/****************************************************************************
* // Responsive table - Feature Charts
****************************************************************************/
#feature-chart {
margin-top: 3rem;
}
#feature-chart article {
width: 100%;
margin: 0 auto;
position: relative;
}
#feature-chart ul {
display: flex;
top: 0rem;
z-index: 10;
padding-bottom: 1.4rem;
}
#feature-chart li {
list-style: none;
flex: 1;
}
#feature-chart h3 {
font-size: 3rem;
/* JR */
margin-bottom: 0.5rem;
/* END JR */
}
#feature-chart .currency-sign,
#feature-chart .value,
#feature-chart .value-2,
#feature-chart .value-3 {
font-size: 3rem;
color: #333333;
letter-spacing: -0.05rem;
}
#feature-chart .value {
margin-left: -0.5rem;
}
#feature-chart li:last-child {
border-right: 1px solid #DDD;
}
#feature-chart button {
width: 100%;
border: 1px solid #DDD;
border-right: 0;
border-top: 0;
padding: 1rem;
background: #FFF;
font-size: 1.4rem;
font-weight: bold;
height: 6rem;
color: #999
}
#feature-chart li.active button {
background: #f0f5f5;
color: #000;
}
#feature-chart table {
border-collapse: collapse;
width: 100%;
}
#feature-chart tr {
border-bottom: 1px solid #dddddd;
}
#feature-chart tbody tr:first-of-type {
border-top: 1px solid #dddddd;
}
#feature-chart tr:last-of-type {
border-bottom: none;
}
#feature-chart th {
background: #ffffff;
display: none;
}
#feature-chart th:last-of-type,
#feature-chart th:nth-last-child(2),
#feature-chart td:last-of-type,
#feature-chart td:nth-last-child(2) {
background-color: #f0f5f5;
}
#feature-chart th:last-of-type,
#feature-chart th:nth-last-child(3),
#feature-chart td:last-of-type,
#feature-chart td:nth-last-child(3) {
background-color: #f0f5f5;
}
#feature-chart .white-bg:last-of-type,
#feature-chart .white-bg:nth-last-child(2) {
background-color: #ffffff;
}
#feature-chart .white-bg:last-of-type,
#feature-chart .white-bg:nth-last-child(2) {
background-color: #ffffff;
}
#feature-chart td,
#feature-chart th {
vertical-align: middle;
}
#feature-chart td:first-of-type {
width: 82%;
background-color: #ffffff;
}
#feature-chart .white-bg {
background-color: #ffffff;
}
#feature-chart td,
#feature-chart th {
padding: 1rem;
empty-cells: show;
}
#feature-chart td,
#feature-chart th {
text-align: left;
}
#feature-chart td+td,
#feature-chart th+th {
text-align: center;
display: none;
}
#feature-chart td.default {
display: table-cell;
vertical-align: middle;
}
#feature-chart .sep {
background: #F5F5F5;
font-weight: bold;
}
#feature-chart .txt-l {
font-size: 2.8rem;
font-weight: bold;
}
#feature-chart .txt-top {
position: relative;
top: -.9rem;
left: -.2rem;
}
#feature-chart .tick {
font-size: 2.2rem;
}
#feature-chart .hide {
border: 0;
background: none;
}
.fa-check-circle {
color: #1c76a0;
}
.fa-times-circle {
color: #a2a2a2;
}
#feature-chart tr:hover,
#feature-chart tr:hover td:first-of-type {
background-color: transparent;
}
#feature-chart tr.price-row,
#feature-chart tr:first-child>th:first-of-type {
background-color: white;
}
#feature-chart tr.price-row td:last-child,
#feature-chart tr.price-row td:nth-last-child(2),
#feature-chart tr.price-row td:nth-last-child(3) {
background-color: #ffffff;
}
@media (min-width: 768px) {
#feature-chart tr.price-row td:last-child,
#feature-chart tr.price-row td:nth-last-child(2),
#feature-chart tr.price-row td:nth-last-child(3) {
background-color: #f0f5f5;
}
}
#feature-chart .da-icon {
display: none;
}
#feature-chart a.v-discount {
color: #333333;
text-decoration: underline;
}
#feature-chart .button-box {
margin: .5rem;
float: left;
width: 12rem;
}
#feature-chart .prices,
#feature-chart .vat {
text-align: left;
padding-top: 0;
}
#feature-chart .from {
padding-bottom: 0;
margin-bottom: 0;
}
p.icon-float {
font-size: 1.6rem;
}
.bg-purple,
.bg-blue {
border-top: 1px solid #ddd;
}
@media (min-width: 768px) {
#feature-chart h3 {
text-align: center;
}
}
#feature-chart .currency-sign {
margin-right: -5px;
}
@media (min-width: 1100px) {
#feature-chart ul {
display: none;
}
#feature-chart .white-bg:last-of-type,
#feature-chart .white-bg:nth-last-child(2),
#feature-chart .white-bg {
background-color: #f0f5f5;
}
#feature-chart h3 {
font-size: 2.6rem;
padding-bottom: .5rem;
}
#feature-chart .currency-sign,
#feature-chart .value,
#feature-chart .value-2,
#feature-chart .value-3 {
font-size: 2.6rem;
padding-bottom: .5rem;
}
#feature-chart table {
border-collapse: collapse;
table-layout: fixed;
width: 100%;
}
#feature-chart td,
#feature-chart th {
display: table-cell !important;
}
#feature-chart td,
#feature-chart th {
width: 59%;
}
#feature-chart td,
#feature-chart th {
padding: 2rem .5rem;
empty-cells: show;
}
#feature-chart td+td,
#feature-chart th+th {
width: auto;
}
#feature-chart .prices,
#feature-chart .vat {
text-align: center;
padding-top: .5rem;
}
#feature-chart th {
padding-top: 4.5rem;
padding-bottom: 4.5rem;
}
#feature-chart .da-icon {
display: inline;
height: 2rem;
width: 2rem;
margin-right: .8rem;
float: left;
}
#feature-chart .button-box {
margin: .5rem 1.5rem .5rem;
float: left;
width: 12rem;
}
#feature-chart .prices,
#feature-chart .vat {
text-align: center;
}
#feature-chart .vat {
margin-top: -0.5rem;
}
#feature-chart .tick {
padding-left: 0;
}
.fa-check-circle {
color: #1c76a0;
font-size: 2.6rem;
}
.fa-times-circle {
color: #a2a2a2;
font-size: 2.6rem;
}
.bg-purple,
.bg-blue {
border-top: none;
}
#feature-chart .vat {
padding-top: 0;
}
#feature-chart th p.tiny-text {
font-size: 1.1rem;
line-height: 1.4rem;
}
.tiny-discount {
margin-top: -2.4rem;
}
}
@media (min-width: 1024px) and (max-width: 1100px) {
.tiny-discount {
margin-top: -1rem;
}
.disc-adj {
margin-top: 5rem;
}
}
@media (min-width: 990px) {
#feature-chart .button-box {
width: 16rem;
}
}
@media (min-width: 1100px) {
#feature-chart .button-box {
margin: .5rem 1.5rem .5rem;
float: left;
width: 11rem;
}
}
@media (min-width: 1200px) {
#feature-chart th p {
font-size: 1.8rem;
}
#feature-chart .button-box {
margin: .5rem .5rem .5rem;
float: left;
width: 13rem;
}
}
.cell-p {
font-size: 1.6rem;
line-height: 2.2rem;
margin-bottom: 0 !important;
letter-spacing: 0;
font-weight: normal;
margin-bottom: 0;
}
.feature-gap {
padding-right: .5rem;
}
.feature-image {
padding-left: 4rem;
padding-right: 4rem;
height: 12rem
}
#feature-chart th p.tiny-text {
font-size: 1.1rem;
line-height: 1.4rem;
}
/****************************************************************************
* // Quotes
****************************************************************************/
.quote {
font-size: 2.2rem;
line-height: 2.6rem;
font-weight: bold;
font-style: italic;
padding-left: 2.5rem;
padding-right: 2.5rem;
}
.curly-quotes:before,
.curly-quotes:after {
display: inline-block;
vertical-align: top;
height: 3rem;
line-height: 4.8rem;
font-size: 5rem;
}
.curly-quotes:before {
content: '\201C';
margin-right: .4rem;
margin-left: -.8rem;
margin-top: -1.5rem;
}
.curly-quotes:after {
content: '\201D';
margin-right: -.8rem;
margin-top: 1rem;
}
.quote-by {
display: block;
padding-right: 1rem;
font-size: 1.6rem;
margin-top: 0;
font-style: normal;
}
@media only screen and (max-width: 350px) {
.quote {
display: none;
font-size: 1.2rem;
}
.quote-block {
font-size: 1rem;
}
}
/****************************************************************************
* // Text Block
****************************************************************************/
#text-block {
margin-top: 5rem;
}
#text-block p {
padding-bottom: 3rem;
}
@media only screen and (min-width:768px) {
#text-block {
margin-top: 0;
}
}
/****************************************************************************
* //Two Row Icons
****************************************************************************/
#two-row-icons {
padding-top: 7.5rem;
padding-bottom: 7.5rem;
}
.img-sticky {
position: absolute;
right: 0;
width: 16%;
margin-top: -116px;
}
#two-row-icons .ico-mobile {
clear: both;
margin-bottom: 4rem;
}
#two-row-icons .icon {
margin-top: .5rem;
width: 60%;
}
#two-row-icons p,
#two-row-icons h4 {
margin-left: -30px;
}
@media only screen and (min-width:768px) {
#two-row-icons .ico-mobile {
clear: none;
margin-bottom: 0;
}
#two-row-icons .icon {
margin-top: .5rem;
width: 100%;
}
#two-row-icons p,
#two-row-icons h4 {
margin-left: 0;
}
}
/****************************************************************************
* //Three Panels
****************************************************************************/
#three-panels {
padding-top: 7.5rem;
}
#three-panels h5 {
font-size: 15px;
line-height: 19px;
margin-top: 60px;
}
@media only screen and (min-width:768px) {
#three-panels p.center {
margin-left: 9rem;
margin-right: 9rem;
padding-top: 6rem;
}
}
/****************************************************************************
* // DA Price block
****************************************************************************/
.da-price-block {
background-color: #f3f5f5;
padding: 4.7rem 3rem 2rem;
margin-bottom: 3rem;
border: 1px solid #efefef;
}
.da-price-block:hover {
-moz-box-shadow: 0 0 15px #8e8e8e;
-webkit-box-shadow: 0 0 15px #8e8e8e;
box-shadow: 0 0 15px #8e8e8e;
}
.da-price-block h4 {
font-size: 2.4rem;
line-height: 3rem;
}
.da-price-block p {
font-size: 1.6rem;
line-height: 2.2rem;
color: #057a88;
padding-bottom: 2.8rem;
margin-bottom: 0;
}
.da-price-block p.price {
font-size: 4.8rem;
line-height: 5.5rem;
letter-spacing: -2.5px;
font-weight: 600;
color: #CE4400 ;
padding-bottom: 0;
}
.da-price-block p.price .currency-lower {
font-size: 3rem;
line-height: 3.5rem;
letter-spacing: 0;
padding-left: .5rem;
}
.da-price-block .button-box {
width: 13rem;
margin: 0 auto;
margin-bottom: 2.6rem;
}
.da-price-block h6.ten-plus {
padding-bottom: 2.3rem;
}
.zoom {
transition: transform .2s;
width: 100%;
}
.zoom:hover {
transform: scale(1.2);
overflow: hidden;
height: 29.5rem;
}
@media only screen and (min-width: 768px) {
.da-price-block {
margin-bottom: 0;
}
.da-price-block h6.ten-plus {
font-size: 1.6rem;
}
}
/****************************************************************************
* // DA Access block - Dark
****************************************************************************/
#da-access1 {
background-color: #ffffff;
font-size: 18px;
position: relative;
padding-left: 3rem;
margin-top: 0rem;
margin-bottom: 2rem;
font-weight: 400;
line-height: 140%;
}
ul.da-access-bullets1 {
list-style-type: "-";
margin-bottom: 2rem;
}
ul.da-access-bullets1 li {
margin-left: 1.5rem;
font-size: 18px;
position: relative;
padding-left: 3rem;
margin-top: 2rem;
margin-bottom: 2rem;
font-weight: 400;
line-height: 140%;
}
#da-access1 .apple {
float: left;
}
#da-access1 .google {
float: right;
}
@media only screen and (min-width: 768px) {
#da-access1 {
padding-top: 0rem;
padding-bottom: 0rem;
margin-bottom: 0rem;
margin-top: 0rem;
}
#da-access1 .da-in-hand1 {
margin-top: 0rem;
margin-left: 0;
position: relative;
top: 7px;
}
}
@media only screen and (min-width: 1100px) {
#da-access1 {
margin-top: 2rem;
padding-top: 5rem;
padding-bottom: 0rem;
vertical-align: bottom !important;
}
#da-access1 .apple {
float: left;
padding-right: 15px;
}
#da-access1 .google {
float: left;
}
#da-access1 .da-in-hand {
margin-top: -20rem;
margin-left: 10rem;
vertical-align: bottom !important;
}
}
/****************************************************************************
* // DA Access block
****************************************************************************/
#da-access {
background-color: #ffffff;
padding-top: -0.5rem;
padding-bottom: 5rem;
margin-top: -0.5rem;
}
ul.da-access-bullets {
list-style-type: "-";
margin-bottom: 5.8rem;
}
ul.da-access-bullets li {
margin-left: 1.5rem;
padding-left: 2rem;
margin-bottom: 30px;
line-height: 1.8rem;
}
#da-access .apple {
float: left;
}
#da-access .google {
float: right;
}
@media only screen and (min-width: 768px) {
#da-access {
padding-top: 6rem;
padding-bottom: 4rem;
margin-bottom: -5.5rem;
margin-top: 12rem;
}
}
@media only screen and (min-width: 1100px) {
#da-access {
margin-top: 5rem;
padding-top: 10rem;
padding-bottom: 5rem;
}
#da-access .apple {
float: left;
padding-right: 15px;
}
#da-access .google {
float: left;
}
#da-access .da-in-hand {
/*margin-top: -20rem;
margin-left: 10rem;*/
vertical-align: bottom !important;
}
}
#da-access .da-in-hand {
max-width: 75%;
margin-left: auto;
display: block;
vertical-align: bottom !important;
}
@media only screen and (max-width: 1099px) {
#da-access .da-in-hand {
margin-bottom: 10px;
vertical-align: bottom !important;
}
}
/****************************************************************************
* // DA Bluetooth
****************************************************************************/
#da-bluetooth {
padding-top: 7rem;
padding-bottom: 7rem;
background-color: #f0f5f5;
}
#da-bluetooth p {
margin-bottom: 3rem;
}
@media only screen and (min-width: 768px) {
#da-bluetooth {
padding-top: 8rem;
padding-bottom: 5rem;
}
#da-bluetooth p {
margin-bottom: 0;
}
}
/****************************************************************************
* // Banners
****************************************************************************/
#banners {
padding-top: 6rem;
padding-bottom: 10rem;
}
.yellow-bg {
background-color: #fed60a;
}
#banners h3 {
font-size: 2.4rem;
line-height: 2.8rem;
}
#banners p {
font-size: 1.6rem;
line-height: 2rem;
font-weight: bold;
color: #4d4d4d;
margin-top: 2rem;
}
/* .carousel-indicators {
position: absolute;
margin-bottom: -60px;
left: 28px;
z-index: 3;
width: 60%;
padding-left: 0;
margin-left: -30%;
text-align: center;
list-style: none;
}
.carousel-indicators li {
display: inline-block;
width: 15px;
height: 15px;
margin: 0;
background-color: #ffee75;
border-color: #ffee75;
} */
.carousel-indicators .active {
height: 12px !important;
}
@media only screen and (min-width: 768px) {
#banners {
padding-top: 8rem;
padding-bottom: 12rem;
}
#banners h3 {
font-weight: bold;
font-size: 4rem;
line-height: 4.4rem;
}
#banners p {
font-size: 2.2rem;
line-height: 2.8rem;
font-weight: bold;
color: #4d4d4d;
margin-top: 2rem;
}
}
#carouselButtons {
margin-top: 20px;
}
.carousel-function {
background: transparent;
border: none;
padding: 0 10px;
}
.carousel-function img {
display: block;
}
/****************************************************************************
* // System Requirements
****************************************************************************/
#system-requirements {
padding-top: 5.5rem;
padding-bottom: 5.5rem;
}
#system-requirements .fa-arrow-right {
height: 5rem;
float: left;
padding-right: 3rem;
padding-top: .4rem;
}
@media only screen and (min-width: 768px) {
#system-requirements {
padding-top: 7.5rem;
padding-bottom: 7.5rem;
}
#system-requirements .fa-arrow-right {
height: 2rem;
}
}
/****************************************************************************
* // Home Page
****************************************************************************/
#home-banner {
top: 0;
background: url('../../shared/images/home-hero-banner.webp') center center no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
padding: 6rem 0 8rem;
}
@media only screen and (max-width: 991px) {
#home-banner {
background: linear-gradient(to right, #0073EA 20%,#141380 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0073EA', endColorstr='#141380',GradientType=1 );
}
}
@media only screen and (max-width: 767px) {
#home-banner {
padding: 7rem 0rem 5rem 0rem;
}
}
/* NEW HOME BANNER STARTS HERE */
#new-home-banner {
background: url('../../shared/images/mast-bg-drg-dragon-prov16-06.webp') center center no-repeat;
min-height: 430px;
position: relative;
width: 100%;
background-size: cover;
padding: 10rem 0;
}
@media only screen and (max-width: 767px) {
#new-home-banner {
padding: 7rem 0rem 5rem 0rem;
}
}
.new-home-banner-sup {
display: inline-block;
margin-bottom: 4px;
color: #2fc6d4;
font-weight: 600;
}
#new-home-banner h1 {
font-size: 62px;
color: white;
margin-bottom: 12px;
font-weight: 300;
padding-bottom: 0;
}
.new-home-banner-p {
color: white;
margin-bottom: 20px;
font-size: 24px;
font-weight: 300;
line-height: 130%;
}
.master-banner-p {
color: black;
margin-bottom: 20px;
font-size: 24px;
font-weight: 300;
line-height: 130%;
}
.btn {
font-size: 18px;
text-decoration: none !important;
}
.btn-stroke {
background: transparent;
border: 2px solid white;
border-radius: 3px;
padding: 9px 26px;
padding: 10px 26px;
border-radius: 3px;
display: inline-block;
font-size: 16px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
cursor: pointer;
color: white;
transition: background-color 0.5s ease;
}
.btn-stroke.btn-stroke-blue {
border-color: #3460de;
color: #3460de
}
.btn-stroke:active, .btn-stroke:hover, .btn-stroke:focus {
background-color: white;
color: black;
}
.btn-stroke.btn-stroke-blue:active, .btn-stroke.btn-stroke-blue:hover {
background-color: #3460de;
color: white;
}
/* NEW HOME BANNER ENDS ABOVE HERE */
.new-intro-p {
color: #000000 !important;
margin-bottom: 20px;
font-size: 24px;
font-weight: 300;
line-height: 130%;
}
.new-intro-p.text-white {
color: #fff !important;
}
/* NEW INTRO TEXT */
/* NEW INTRO TEXT ENDS HERE*/
#home-banner .banner-primary {
font-size: 4.63rem;
line-height: 5.0rem;
letter-spacing: -.25rem;
font-weight: bold;
}
#home-banner .banner-secondary {
font-size: 3rem;
line-height: 3.4rem;
font-weight: bold;
padding-bottom: 7rem;
}
#home-banner .curly-quotes:before,
#home-banner .curly-quotes:after {
display: inline-block;
vertical-align: top;
height: 3rem;
line-height: 4.8rem;
font-size: 5rem;
color: #00c9d8;
}
#home-banner .quote {
font-size: 3rem;
padding-left: 0;
}
#home-banner .curly-quotes:before {
position: absolute;
top: -1rem;
}
.home-tab-frame {
width: max-content;
padding: 1rem 1.5rem .6rem;
background-color: #f0f5f5;
margin-left: 1rem;
}
.home-tab {
font-size: 1.6rem;
vertical-align: middle;
}
.tab-icon {
vertical-align: middle;
margin-top: -.5rem;
padding-left: 1rem;
}
.tab-box {
margin-left: 1.5rem;
border: 1px solid #ddd;
padding: 1.8rem 0;
}
.tab-box-2 {
margin-left: 1.5rem;
width: auto;
border: 1px solid #ddd;
padding: 1.8rem 0 1.4rem;
min-height: 225px;
}
.home-box-shot {
width: 16rem;
margin-left: 0.2rem;
padding-top: 24px;
max-width: 112%;
}
#home-products .left-offset {
padding-left: 2rem;
}
.no-left {
margin-left: -0.5rem;
}
#home-products .tab-title,
#home-products .find-out {
margin-top: 0rem;
}
#home-products .title-container {
height: 5rem;
}
#home-products .box-value,
#home-products .box-value-2,
#home-products .box-value-3 {
height: 3rem;
vertical-align: bottom;
}
#home-products .off~.prices {
margin-top: 3rem;
}
#home-products .box-value-3 {
margin-bottom: -1rem;
}
#home-products .box-value td,
#home-products .box-value-2 td,
#home-products .box-value-3 td {
font-size: 1.8rem;
line-height: 2.4rem;
font-weight: normal;
letter-spacing: -0.05rem;
color: #333333;
}
#home-products .prices {
clear: both;
}
#home-products .box-value p.discount,
#home-products .box-value-2 p.discount-2,
#home-products .box-value-3 p.discount-3 {
margin-top: 0rem;
margin-bottom: 0rem;
font-size: 1rem;
}
#home-products .button-blue {
white-space: nowrap;
padding: 10px 17px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 16px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
}
.home-promotion {
margin-top: 1rem;
width: 20rem;
}
.home-promotion p {
font-size: 1.2rem;
line-height: 1.5rem;
color: #CE4400 ;
}
#dragon-for-mobile {
margin-top: 6rem;
position: relative;
}
#dragon-for-mobile .button {
width: 15rem;
}
.tab-boxed .left-0 {
padding-left: 2.5rem;
padding-right: 2.5rem;
}
#dragon-for-mobile .da-phone-case {
top: 0;
background: url('../../shared/images/mobile-mob.webp');
position: relative;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: top;
background-size: auto 100%;
background-size: 100%;
max-width: 40rem;
margin: 0 auto;
margin-bottom: -17rem;
}
#dragon-for-mobile .da-phone-case blockquote {
font-size: 1.8rem;
}
#dragon-for-mobile .da-text {
padding: 20% 10% 80%;
}
#dragon-for-mobile .da-text .button-blue {
font-size: 16px;
font-weight: 400;
padding: 10px 26px;
text-decoration: none !important;
}
#dragon-for-dt {
display: none;
}
#dragon-for-dt .button {
width: 15rem;
}
#dragon-clients {
background-color: #F2F5F5;
padding-bottom: 3rem;
}
#dragon-clients h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
margin-top: 0;
padding-top: 1rem;
padding-bottom: 1.5rem;
}
#dragon-clients img.center-logo {
margin-top: 4rem;
margin-left: auto;
margin-right: auto;
}
#dragon-home-spec h2 {
font-weight: bold;
margin-bottom: 4rem;
margin-top: 6rem;
}
#about-nuance {
background: #2e6ed6;
padding-top: 2rem;
padding-bottom: 2rem;
}
#about-nuance h2 {
margin-bottom: 2rem;
}
#backfade {
background-image: linear-gradient(#ffffff 5%, #e6ecec 95%);
}
.icon-da-home {
width: 8rem;
}
#dragon-home-spec {
padding-bottom: 3rem;
margin-top: 3rem;
}
#home-pm,
#home-bth,
#home-usb {
position: relative;
background-repeat: no-repeat;
background-position: top;
background-size: auto 100%;
background-size: 100%;
padding-bottom: 12rem;
}
#home-pm {
background: url('../../shared/images/mic.webp');
padding-top: 13.5rem;
}
#home-bth {
background: url('../../shared/images/home-bt-new-2.webp');
padding-top: 8.7rem;
}
#home-usb {
background: url('../../shared/images/usb.webp');
padding-top: 8.7rem;
}
#dragon-home-spec h3 {
font-size: 3rem;
line-height: 3rem;
letter-spacing: -0.025rem;
}
#dragon-home-spec .button-box {
width: 16rem;
margin: .5rem auto 3rem;
display: flex;
justify-content: center;
}
#dragon-home-spec .outer-div>div {
min-height: 24rem;
}
.mob-adj {
margin-left: -1.5rem;
}
#feature-chart td:first-of-type {
background-color: transparent;
border-top: none;
}
@media only screen and (min-width: 398px) {
#home-pm,
#home-usb,
#home-bth {
max-width: 40rem;
margin-bottom: 3rem;
margin-left: auto;
margin-right: auto;
}
#dragon-home-spec h2 {
margin-top: 8rem;
color: #141380 !important;
font-weight: 300 !important;
}
}
@media only screen and (min-width: 768px) {
@keyframes moveInLeft {
0% {
opacity: 0;
transform: translateX(-10rem);
}
80% {
transform: translateX(1rem);
}
100% {
opacity: 1;
transform: translate(0);
}
}
@keyframes moveInRight {
0% {
opacity: 0;
transform: translateX(10rem);
}
80% {
transform: translateX(-1rem);
}
100% {
opacity: 1;
transform: translate(0);
}
}
#home-banner {
padding: 11.5rem 0 7.5rem;
}
#home-banner .banner-primary {
font-size: 6.5rem;
line-height: 8rem;
-webkit-animation-name: moveInLeft;
animation-name: moveInLeft;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
#home-banner .banner-secondary {
font-size: 3.6rem;
line-height: 4.2rem;
-webkit-animation: moveInRight 1s ease-out;
animation: moveInRight 1s ease-out;
}
@-webkit-keyframes moveInBottom {
0% {
opacity: 0;
-webkit-transform: translateY(3rem);
transform: translateY(3rem)
}
100% {
opacity: 1;
-webkit-transform: translate(0);
transform: translate(0)
}
}
#home-banner .quote {
font-size: 3rem;
padding-left: 3rem;
padding-right: 0;
}
#home-banner .curly-quotes:before {
position: relative;
margin-left: -4rem;
top: 1rem;
font-size: 7rem;
}
#home-banner .curly-quotes:after {
margin-top: 2.2rem;
font-size: 7rem;
margin-left: -1rem;
}
#home-banner .quote-block {
background: rgba(0, 90, 118, 0.5);
padding: 3rem 0 2rem 2rem;
margin-top: 1rem;
margin-left: -3rem;
position: relative;
-webkit-animation: moveInBottom .5s ease-out .75s;
animation: moveInBottom .5s ease-out .75s;
animation-fill-mode: none;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
#home-banner .quote-by {
font-size: 2.2rem;
}
.tab-boxed {
-webkit-transition: all .2s;
transition: all .2s;
outline-offset: 2rem;
}
.tab-boxed:hover {
transform: scale(1.1);
}
#dragon-for-dt {
display: inline-block;
top: 0;
background: url('../../shared/images/home-dragon-mobile-bg.webp') left top no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
margin-top: 7rem;
padding-top: 6rem;
padding-bottom: 6rem;
}
#dragon-for-dt h2 {
padding-bottom: 3rem;
}
#dragon-for-dt .quote {
padding-top: 11rem;
padding-left: 2.5rem;
margin-left: -9rem;
}
#dragon-for-dt .dt-margin {
padding-left: 3rem;
padding-right: 9rem;
}
#home-products {
margin-top: 3rem;
}
.icon-da-home {
width: 8rem;
}
#dragon-for-dt p {
padding-bottom: 3rem;
}
#dragon-for-dt .curly-quotes:before,
#dragon-for-dt .curly-quotes:after {
font-size: 6rem;
}
#dragon-for-dt .curly-quotes:before {
margin-left: -4rem;
margin-top: -0.5rem;
}
#dragon-for-dt .curly-quotes:after {
margin-top: 2rem;
}
#dragon-for-dt .vertical-phone {
position: absolute;
top: -25rem;
left: -17rem;
}
.tab-box-2 {
margin-left: 1.5rem;
width: 49%;
border: 1px solid #f0f5f5;
padding: 1.5rem 0 1.4rem;
}
#dragon-clients {
padding-top: 7.5rem;
padding-bottom: 3.7rem;
}
#dragon-clients h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
margin-top: 0;
padding-top: 1rem;
padding-bottom: 1.5rem;
}
#dragon-home-spec {
margin-top: 0;
}
#dragon-home-spec h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
margin-top: 0;
margin-top: 6rem;
color: #285ce6;
}
#about-nuance {
padding-top: 10rem;
padding-bottom: 10rem;
}
#about-nuance h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
margin-top: 0;
}
#about-nuance p {
margin-right: 6rem;
}
#home-pm {
padding-top: 8rem;
padding-bottom: 2rem;
}
#home-bth,
#home-usb {
padding-top: 3.5rem;
padding-bottom: 2rem;
}
.tab-box {
min-height: 225px;
}
#home-products .title-container {
height: 5rem;
}
#home-products .box-value,
#home-products .box-value-2,
#home-products .box-value-3 {
height: 4rem;
vertical-align: bottom;
}
#home-products .tab-title {
margin-top: 1.5rem;
}
}
.no-margin .col-sm-4 {
margin-bottom: 30px;
}
@media only screen and (min-width: 967px) {
#dragon-clients {
padding-top: 7.5rem;
padding-bottom: 3.7rem;
}
blockquote {
font-size: 2.2rem;
}
#dragon-clients h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
margin-top: 0;
padding-top: 5rem;
padding-bottom: 3.7rem;
}
#dragon-home-spec h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
margin-top: 0;
color: #141380;
padding-top: 7.5rem;
padding-bottom: 3.7rem;
;
}
.tab-box-2 {
margin-left: 1.5rem;
width: 93%;
border: 1px solid #ddd;
padding: 1.5rem 0 1.4rem;
}
}
@media only screen and (min-width: 1050px) {
#dragon-for-dt .vertical-phone {
top: -25rem;
}
#dragon-clients {
padding-top: 2rem;
margin-top: 6rem;
}
#home-pm {
padding-top: 13.5rem;
padding-bottom: 3rem;
}
#home-bth {
padding-top: 13.5rem;
padding-bottom: 3rem;
}
#home-usb {
padding-top: 13.5rem;
padding-bottom: 3rem;
}
}
@media only screen and (min-width: 1100px) {
#dragon-for-dt {
padding: 9rem 0 8.8rem;
}
#dragon-for-dt .vertical-phone {
position: absolute;
top: -30rem;
}
#home-leader h2 {
font-size: 4.5rem;
line-height: 4.8rem;
letter-spacing: -2.5px;
padding-top: 0.8rem;
}
#dragon-home-spec {
padding-bottom: 3rem;
}
blockquote {
font-size: 3rem;
line-height: 3.4rem;
}
.icon-da-home {
width: 9rem;
margin-bottom: 1.3rem;
}
#dragon-for-dt h2 {
padding-bottom: 2rem;
}
}
@media only screen and (min-width: 1200px) {
#dragon-for-dt .vertical-phone {
position: absolute;
top: -30rem;
}
.outer-div {
height: 365px;
overflow: hidden;
}
#home-pm {
padding-top: 13.5rem;
width: 100%;
height: 100%;
transition: all .5s ease;
}
#home-bth {
padding-top: 13.5rem;
width: 100%;
height: 100%;
transition: all .5s ease;
}
#home-usb {
padding-top: 13.5rem;
width: 100%;
height: 100%;
transition: all .5s ease;
}
#home-pm:hover,
#home-pm:focus,
#home-bth:hover,
#home-bth:focus,
#home-usb:hover,
#home-usb:focus {
transform: scale(1.2);
transition: all .5s ease;
background-color: rgba(45, 132, 214, .5);
background-size: cover;
background-blend-mode: multiply;
}
}
@media only screen and (max-width: 990px) and (min-width: 768px) {
#dragon-home-spec h5 {
font-size: 3.6rem;
}
}
@media only screen and (max-width: 991px) {
#home-products .frame-2 {
margin-top: 2rem;
}
}
@media only screen and (max-width: 767px) {
.line-img {
max-width: 100%;
}
}
/****************************************************************************
* // Page Heading
****************************************************************************/
#page-heading {
padding-top: 2rem;
padding-bottom: 0rem;
}
#page-heading .tooltip-custom {
opacity: 0.5;
display: inline-block;
margin-left: .5rem;
position: relative;
vertical-align: text-bottom;
cursor: pointer;
background-color: #ffffff;
width: 1.5rem;
}
#page-heading .promo-banner {
float: left;
text-align: left;
margin-left: -.5rem;
}
#page-heading a:hover {
text-decoration: none;
}
.offerLeader,
.offer-text-line1 {
color: #f50;
padding-left: .5rem;
vertical-align: middle;
font-size: 14px;
overflow: hidden;
}
.page-breadcrumb a {
color: #333333;
text-decoration: underline;
}
.page-breadcrumb li.page-breadcrumb_dropdown {
display: inline-block;
list-style: none;
position: relative;
}
.page-breadcrumb li.page-breadcrumb_dropdown>a {
font-weight: bold;
padding: 5px 0;
}
.page-breadcrumb li.page-breadcrumb_dropdown a {
text-decoration: none;
}
#faq-block {
clear: both;
margin-top: 0;
}
.offer-text-line1 {
margin-left: 2rem;
display: inline-block;
margin-top: -2.8rem;
line-height: 1.8rem;
}
.sidebar-box {
background-color: #f0f5f5;
padding: 3rem 1.5rem 3.3rem;
clear: both;
box-sizing: border-box;
text-align: center;
margin-bottom: 2rem;
}
@media (min-width: 578px) {
.offer-text-line1 {
margin-left: .5rem;
margin-top: 0;
}
}
@media (min-width: 768px) {
#page-heading {
padding-bottom: 0rem;
}
#purchase-block .offerOn {
margin-top: 1rem;
}
}
@media (min-width: 992px) {
.offer-text-line1 {
padding-left: .5rem;
margin-top: 0;
}
}
@media (min-width: 568px) {
.sidebar-box {
padding: 3rem 2.5rem 2.5rem;
}
.sidebar-box_padded {
padding: 5rem 2.5rem;
}
}
.sidebar-box p {
margin: 0 0 5px;
}
.sidebar-box p.large {
font-size: 2rem;
}
@media (min-width: 1100px) {
#page-heading .promo-banner {
float: right;
text-align: right;
margin-left: 0;
}
}
/****************************************************************************
* // Thumbnail Gallery
****************************************************************************/
#product-container {
overflow: hidden;
position: relative;
}
#gallery #image-panel {
width: 26rem;
float: left;
vertical-align: top;
position: relative;
}
#gallery #thumbs img,
#gallery #largeImage {
background-color: white;
cursor: pointer;
}
#gallery #thumbs {
position: absolute;
width: 4rem;
}
#gallery #thumbs img {
margin-bottom: .8rem;
border: 1px solid #ccc;
padding: .4rem;
margin-top: .8rem;
}
/****************************************************************************
* // Additional Products
****************************************************************************/
#dragon-options input {
width: 2rem;
margin-left: -.3rem;
margin-top: 0;
}
#dragon-options a {
color: #285ce6;
font-weight: normal;
}
#dragon-options label {
margin-bottom: 0;
font-size: 14px;
font-weight: 400;
line-height: 140%;
}
#dragon-options .fa {
color: #333333;
}
#dragon-options .showClass {
display: inline;
}
#dragon-options p.play-text {
margin-left: 1.5rem;
}
#dragon-options .action-link {
margin-top: 1.6rem;
}
#dragon-options .popover {
width: 100%;
}
#dragon-options p.offer-text {
color: #CE4400 ;
text-align: right;
padding-top: 0;
font-size: 16px;
font-weight: 400;
line-height: 140%;
}
#dragon-options .offer-text .popover {
min-width: 100%;
color: #333333;
}
#dragon-options .custom-control ul {
margin-left: 1.5rem;
list-style-type: "-";
}
#dragon-options .custom-control span, #dragon-options .custom-control a {
font-size: 14px;
}
#dragon-options .custom-control span {
margin-right: 5px;
}
/* Accessory Upsells */
.accessory-ups {
padding: 10px;
margin-top: 2rem;
background-color: #fff;
border-radius: 3px;
border: 1px solid #efefef;
}
/* Space them out a bit when there's more than one upsell option */
.accessory-ups .custom-checkbox + .custom-checkbox {
margin-top: 5px;
}
/****************************************************************************
* // Purchase Block
****************************************************************************/
#purchase-block {
clear: both;
}
.box-value p.discount {
color: #5e5d5d;
font-size: 1.2rem;
font-weight: normal;
letter-spacing: 0;
line-height: 1rem;
margin-bottom: .4rem;
text-decoration: line-through;
clear: both;
float: left;
margin-left: 0;
margin-top: 1.2rem;
}
#purchase-block .prices {
float: left;
clear: both;
}
.windows-logos {
margin-top: -3rem;
}
@media screen and (max-width: 767px) {
.box-shot {
max-width: 55%;
}
}
.windows-img {
max-width: 45%;
margin: 18px 0 20px 0;
}
.windows-img.anywhere {
max-width: 60%;
margin-left: -42px;
}
.windows-img.centred {
margin: 18px auto;
}
@media screen and (max-width: 767px) {
.windows-img {
max-width: 100px !important;
margin: 18px 0 20px 0;
}
.windows-img.anywhere {
margin-left: -42px;
max-width: 140px !important;
}
}
.windows-text {
vertical-align: middle;
padding-left: 1rem;
}
.box-value .value,
.box-value-2 .value-2,
.box-value .value-3 {
color: #CE4400 ;
font-size: 40px;
font-weight: 600;
letter-spacing: -0.075em;
line-height: 1em;
}
.box-value .tax {
font-size: 1.4rem
}
.grey-box, .gray-box {
clear: both;
float: left;
width: 100%;
}
.grey-box .var-detail a,
.grey-box .licences a {
color: #2f2e2e;
text-decoration: none;
font-size: 1.3rem;
font-weight: 700;
line-height: 1.6rem;
vertical-align: center;
}
.box-value p.discount {
text-decoration: none;
}
.box-value p.discount.off {
visibility: hidden;
}
.box-value p.discount>span {
text-decoration: line-through;
}
.box-value .tax {
padding-left: .5rem;
vertical-align: top;
line-height: 1.4rem;
font-size: 1.4rem;
vertical-align: middle;
}
.tooltipster-sidetip.tooltipster-shadow .tooltipster-box {
padding: 1rem;
font-size: 1rem;
text-align: left;
color: #333;
opacity: 1;
}
.currency-sign {
color: #CE4400 ;
font-size: 40px;
font-weight: 600;
letter-spacing: -0.075rem;
line-height: 1rem;
}
#purchase-block .prices .off {
display: none;
}
.box-img>.circle {
background-color: #e8112d;
border-radius: 50%;
position: absolute;
top: -3rem;
left: 11.5rem;
width: 8rem;
height: 8rem;
z-index: 1;
text-align: center;
}
.box-img table.promo-frame {
margin-top: 2rem;
margin-left: 1.7rem;
}
#dragon-anywhere .box-img table.promo-frame {
margin-top: 2rem;
margin-left: 1.3rem;
}
.offerLine1,
.offerLine2,
.circle-offer1,
.circle-offer2 {
color: #ffffff;
}
.box-purchase {
background-color: #f3f5f5;
padding: 3rem 1.5rem 3.3rem;
clear: both;
height: 40rem;
border: 1px solid #efefef;
}
.box-purchase-addons {
background-color: #f3f5f5;
padding: 3rem 1.5rem 3.3rem;
clear: both;
height: 32rem;
border: 1px solid #efefef;
}
#bluetooth-headset .box-purchase,
#usb-headset .box-purchase,
#powermic .box-purchase {
height: 40rem;
}
#bluetooth-headset .box-purchase-addons,
#usb-headset .box-purchase-addons,
#powermic .box-purchase-addons {
height: 32rem;
}
#purchase-block blockquote {
letter-spacing: -0.025rem;
margin-left: -2.4rem;
margin-top: 1.5rem;
font-size: 2rem;
line-height: 2.4rem;
}
#purchase-block .curly-quotes::before,
#purchase-block .curly-quotes::after {
display: inline-block;
vertical-align: top;
height: 2rem;
font-size: 2rem;
}
#purchase-block .curly-quotes::before {
content: '\201C';
margin-right: -.3rem;
margin-left: 0;
margin-top: -1.1rem;
}
#purchase-block .curly-quotes::after {
content: '\201D';
margin-right: 0;
margin-top: -1rem;
margin-left: -.4rem;
}
#purchase-block .quote-by {
display: block;
padding-right: 0;
margin: 0 0 4.5rem -.7rem;
font-style: normal;
}
#purchase-block .secure-basket {
margin: 1rem 0 0 161px;
}
@media (max-width: 1199px) {
#purchase-block .secure-basket {
margin-left: -8px;
}
}
#purchase-block .secure-basket.vla {
margin: 0;
position: absolute;
right: 0;
top: 0px;
}
.vla-spacer {
margin-top: 10px;
}
#purchase-block .secure-basket img {
width: 15rem;
}
#purchase-block p.time-set {
font-size: .8rem;
margin-top: .2rem;
padding-left: -.5rem;
}
#purchase-block p.addons {
font-size: 1.3rem;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
#purchase-block .var-detail p {
font-size: 1.4rem;
margin-top: 1rem;
margin-bottom: -0.8rem;
}
#purchase-block .var-detail p .qty-label,
#purchase-block .var-detail p .language-label,
.var-label, .qty-label {
font-size: 1.3rem;
font-weight: 700;
margin-bottom: -1.5rem;
margin-top: 1rem;
}
.var-label a {
color: #000;
}
.qtd-col {
margin-right: 5%;
}
.qtd,
.qty-label {
width: auto;
}
#quantity {
width: 5.5rem;
max-width: 5.5rem;
}
.variation,
.var-label {
width: 100%;
}
.qty-label, .var-label {
display: block;
}
.var-label {
position: relative;
z-index: 1;
margin-top: 1rem;
}
.language,
.language-label {
float: left;
width: 100%;
margin-right: 5%;
}
@media (min-width: 568px) {
.fixed .language {
margin-top: 5px;
}
}
@media (min-width: 1200px) {
.fixed .language {
margin-top: 0px;
}
}
.language .select2 {
width: 100%!important;
}
.variation-detail-diag .var-detail p .qty-label {
width: 100%;
}
#purchase-block .fa-question-circle {
color: #000;
font-size: 1.5rem;
}
#purchase-block .select2-container .select2-selection--single .select2-selection__rendered {
padding-right: 0;
font-size: 1.5rem;
padding-bottom: 0;
font-weight: normal;
}
#purchase-block .select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #EAEFFC;
color: #333;
}
#varitaion .select2-container--default {
font-size: 1.5rem;
}
.grey-box .select2-results__option {
font-size: 1.5rem;
}
.grey-box select option {
padding: .4rem 0 .4rem 1.4rem;
}
@media (min-width: 568px) {
.box {
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.box-img {
width: 50%;
}
.box-desc {
order: 3;
width: 100%;
padding-right: 20px;
}
.box-purchase {
order: 2;
width: 50%;
}
.box-purchase-addons {
order: 2;
width: 50%;
}
.box-purchase {
padding: 3rem 1.5rem 2.5rem;
height: 42rem;
/*margin-left: -1.5rem;*/
margin-bottom: 3rem;
}
.box-purchase-addons {
padding: 3rem 1.5rem 2.5rem;
height: 32rem;
margin-left: -1.5rem;
margin-bottom: 3rem;
}
#purchase-block p.time-set {
margin-top: -.5rem;
}
#purchase-block .quote-by {
margin: 1rem 0 4.5rem -.7rem;
}
}
@media (min-width: 768px) {
#purchase-block {
clear: both;
margin-top: 0;
}
#purchase-block .quote-by {
margin: 0 0 4.5rem -.7rem;
}
}
@media (min-width: 1200px) {
.box {
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.box-img {
width: 22%;
}
.box-desc {
order: 2;
width: 50%;
}
.box-purchase {
order: 3;
width: 27%;
margin-top: -2.6rem;
height: 100%;
}
.box-purchase-addons {
order: 3;
width: 27%;
margin-top: -2.6rem;
height: 100%;
}
}
.variation select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.variation .select2, .diag .select2 {
width: 100% !important;
max-width: 100%;
}
.variation-white,
.variation-grey {
background-color: #ffffff;
width: 100%;
max-width: 100%;
border: 1px solid #000000;
border-radius: 3px;
padding: 1.1rem 0 .8rem;
margin-bottom: 2rem;
margin-top: 1.1rem;
font-size: 1.5rem;
font-weight: normal;
padding: 1.5rem 1rem 1.4rem;
height: 51px;
}
.variation-grey {
background-color: #e7ebeb;
}
.grey-box .select2-container--default,
.grey-box .select2-selection--single {
background-color: #ffffff;
border: 1px solid #000;
border-radius: 3px;
padding: 1.1rem 0 .8rem;
margin-bottom: 11px;
}
#quantity .grey-box .select2-container--default,
#quantity .grey-box .select2-selection--single {
max-width: 3rem;
}
.grey-box .select2-container,
.grey-box .select2-selection--single,
.grey-box .select2-selection__rendered {
padding-right: 0;
font-size: 1.5rem;
font-weight: normal;
height: 5rem;
}
.grey-box .select2-container--default,
.grey-box .select2-results__option--highlighted[aria-selected] {
background-color: #ffffff;
color: #333;
margin-top: 0;
}
.grey-box .select2-container--default,
.grey-box .select2-results__option[aria-selected=true] {
background-color: inherit;
}
.grey-box .select2-results__option[aria-selected=true] {
display: none;
}
.grey-box .select2-container--default {
font-size: 1.5rem;
border: none;
}
.grey-box .select2-dropdown--below {
top: 1rem;
}
.grey-box .select2-results__option {
padding-left: 1.5rem;
}
.custom-dropdown2 {
padding-top: 0;
background-color: #ffffff;
border-top: none;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
border-radius: 0;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
margin-top: -6px;
padding-top: 1.5rem;
padding-bottom: 1.7rem;
}
.select2-dropdown--above {
border-top: 1px solid #000 !important;
margin-top: 12px !important;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
.select2-container--default .select2-results>.select2-results__options {
max-height: 32rem;
}
#quantiity .select2-container {
width: 4rem !important;
}
.grey-box .select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #888 transparent transparent transparent;
border-style: solid;
border-width: .5rem .4rem 0 .4rem;
height: 0;
left: 50%;
margin-left: -.4rem;
margin-top: 1.4rem;
position: absolute;
top: 75%;
width: 0;
}
.product-name {
display: none;
}
@media (min-width: 768px) {
#purchase-block h4 {
padding-top: 2rem;
padding-bottom: 1rem;
}
#purchase-block blockquote {
margin-top: 1.5rem;
}
.grey-box .select2-container .select2-selection--single .select2-selection__rendered {
padding-right: 0;
font-size: 1.5rem;
padding-bottom: 1.3rem;
font-weight: normal;
}
}
@media (min-width: 1024px) {
.box-purchase .box-purchase-addons {
width: 35rem;
margin-left: 12rem;
}
}
@media (min-width: 1200px) {
.box-purchase .box-purchase-addons {
width: 30rem;
margin-left: 0;
}
}
/****************************************************************************
* // Buy Now Bar Floating
****************************************************************************/
.fixed.buy-now-bar,
.fixed .lcs,
.fixed p.addons {
display: none;
}
.fixed .box-value p.discount {
margin-top: -.5rem;
margin-bottom: 0;
}
@media (min-width: 991px) {
.fixed.buy-now-bar {
display: inline;
}
.fixed .box-buy-now-content {
width: 71.5rem;
margin: 0 auto;
position: relative;
height: 7rem;
}
#dragon-professional .fixed .box-buy-now-content {
height: 7rem;
}
.fixed .variation-detail,
.fixed .secure-basket,
.fixed .licences,
.fixed .licences .offerOff,
.fixed .product-name,
.fixed #dragon-options {
display: none;
}
.buy-now-bar.fixed .box-buy-now {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 10;
padding-top: .5rem;
padding-bottom: .5rem;
border-bottom: 1px solid #e4e4e4;
-webkit-box-shadow: 0 1px 4px 0 rgba(50, 50, 50, 0.4);
-moz-box-shadow: 0 1px 4px 0 rgba(50, 50, 50, 0.4);
box-shadow: 0 1px 4px 0 rgba(50, 50, 50, 0.4);
background-color: #fcffff;
}
.fixed .box-value,
.fixed #selections,
.fixed .td-button,
.fixed .td-sales {
position: absolute;
top: 0;
height: 6.5rem;
}
.fixed .box-value {
left: 0;
width: 22rem;
padding-top: 1.5rem;
}
.fixed #selections {
left: 16.5rem;
width: 32rem;
padding-top: 1.3rem;
}
.fixed .td-button {
width: 15rem;
right: 0;
margin-top: 0;
}
.fixed .td-sales {
width: 18rem;
right: 0;
margin-top: 0;
}
.fixed .product-name h3 {
font-size: 2rem;
line-height: 2.2rem;
font-weight: bold;
margin-top: 1.9rem;
}
.fixed .variation {
margin-top: 0;
}
.fixed .box-value p.discount.off {
margin-top: 3.8rem;
}
.fixed .grey-box select {
width: 25.5rem;
}
.fixed .bt-buynow,
.fixed .bt-buysales {
background-color: #CE4400 ;
white-space: nowrap;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 16px;
font-weight: 400;
letter-spacing: 0 !important;
}
.fixed .grey-box .select2-container--default,
.fixed .grey-box .select2-selection--single {
border-radius: 3px;
padding: .4rem 0 .1rem;
margin-bottom: 0;
}
.fixed .variation-white,
.fixed .variation-grey {
/*background-color: #e7ebeb;*/
padding: 1.1rem 1rem;
margin-top: .3rem;
height: 4rem;
}
.fixed .grey-box .select2-container,
.fixed .grey-box .select2-selection--single,
.fixed .grey-box .select2-selection__rendered {
padding-right: 0;
font-size: 1.5rem;
padding-bottom: 0;
font-weight: normal;
height: 3.6rem;
}
.fixed .grey-box .select2-container--default .select2-selection--single .select2-selection__arrow b {
top: 20%;
}
#purchase-block .fixed p.addons {
margin-top: 0;
}
}
@media (min-width: 1100px) {
.fixed .box-buy-now-content {
width: 95rem;
margin: 0 auto;
}
.fixed .box-value,
.fixed #selections,
.fixed #dragon-options,
.fixed .td-button {
position: absolute;
top: 0;
display: inline;
}
.fixed #dragon-options {
left: 51rem;
width: 28rem;
padding-top: 1rem;
}
}
@media (min-width: 1200px) {
.fixed .box-buy-now-content {
width: 110rem;
margin: 0 auto;
}
.fixed .box-value {
left: 0;
width: 22rem;
padding-top: 1.6rem;
}
.fixed #selections {
left: 22rem;
}
.fixed #selections .qtd {
float: left;
width: 6rem;
margin-right: 1rem;
padding-bottom: 1rem;
overflow: hidden;
}
.fixed #selections .variation {
float: right;
width: 240px;
}
.fixed #dragon-options {
left: 64rem;
}
.fixed #dragon-options {
left: 64rem;
}
#powermic3 .fixed #dragon-options {
left: 52rem;
}
}
/****************************************************************************
* // Buy Now Bar Floating
****************************************************************************/
#vertical {
height: 28rem;
overflow: hidden;
}
.lSSlideOuter.vertical .lSGallery {
position: absolute !important;
right: 0;
top: 0;
margin-left: 0 !important;
}
.lSSlideOuter {
padding-right: 0 !important;
width: 22.5rem;
}
.lSSlideOuter img {
width: 20rem;
}
.lSPager {
padding-top: .9rem;
}
.prod-img-holder {
width: 22.5rem;
height: 25rem;
overflow: hidden;
margin-bottom: 6rem;
}
#powermic .prod-img-holder,
#usb-headset .prod-img-holder,
#bluetooth-headset .prod-img-holder {
height: 20rem;
}
.lSSlideOuter .lSPager.lSGallery li.active,
.lSSlideOuter .lSPager.lSGallery li:hover {
border-radius: 0;
}
.lSSlideOuter .lSPager.lSGallery li {
height: 58px !important;
border: 1px solid #ccc;
border-radius: 0;
padding: 3px;
}
.lg-toolbar .lg-icon {
-webkit-transition: color 0s linear;
-o-transition: color 0s linear;
transition: color 0s linear;
}
.lg-toolbar .lg-icon:hover {
color: #333;
}
.lg-outer {
background: rgba(0, 0, 0, 0.6);
}
.lg {
width: 500px !important;
margin-top: 100px;
background-color: #ffffff;
height: 650px !important;
font-family: 'arial';
}
.lg-backdrop {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1040;
background-color: #ccc;
opacity: 1;
-webkit-transition: opacity 0.15s ease 0s;
-o-transition: opacity 0.15s ease 0s;
transition: opacity 0.15s ease 0s;
transition-duration: 0.15s;
}
.lg-backdrop.in {
opacity: 0;
}
.lg-toolbar {
background-color: transparent;
}
.lg-toolbar .lg-close::after {
content: "x";
}
.lg-actions .lg-prev::after {
content: "<";
color: white;
}
.lg-actions .lg-next::before {
content: ">";
color: white;
}
.lg-download {
display: none;
}
.video-panel {
position: absolute;
width: 5rem;
top: 19.2rem;
left: 20rem;
}
.video-panel img {
width: 4rem;
border: 1px solid #ccc;
padding: 3px;
}
.video-panel img:last-of-type {
border: 0;
}
.lg-outer .lg-image {
width: 70% !important;
margin-top: -10rem;
}
#dragon-anywhere .lSSlideOuter .lSPager.lSGallery li {
height: 68px !important;
}
#dragon-anywhere .video-panel {
top: 22.5rem;
}
@media (min-width: 768px) {
.lg-image {
width: 100%;
margin-top: 1rem !important;
}
}
/****************************************************************************
* // BOX TABS
****************************************************************************/
.box-tabs {
margin-top: 3rem;
}
.box-tabs .tab-pane {
padding: 4.6rem 0 3rem 0;
}
.box-tabs .tab-pane.pl {
padding-right: 6.4rem;
}
.box-tabs .nav-tabs,
.box-tabs .nav-tabs li a {
border: none;
font-size: 1.8rem;
font-weight: bold;
color: #333333;
}
.box-tabs .nav-tabs li a {
padding: 1rem 0;
width: 30rem;
}
.box-tabs .nav-tabs>li+li {
margin-left: 0;
}
.box-tabs .nav-tabs>li>a:hover,
.box-tabs .nav-tabs>li>a:focus {
background: none;
}
.box-tabs .nav-tabs>li.active,
.box-tabs .nav-tabs>li.active>a:hover,
.box-tabs .nav-tabs>li.active>a:focus,
.box-tabs .nav-tabs li {
border: none;
}
.box-tabs .nav-tabs>li.active {
border-bottom: 1px solid #565656;
}
.box-tabs .tab-pane .content-block1 ul,
.box-tabs .tab-pane .content-block2 ul {
list-style: none;
margin: 0;
padding: 0;
}
.box-tabs .tab-pane li,
.box-tabs .tab-pane li,
.content-block2 ul li {
position: relative;
margin-bottom: 2rem;
padding-left: 2.3rem;
}
.box-tabs p {
margin-bottom: 2rem;
}
.box-tabs .tab-pane .content-block2 h4 {
margin-top: 0;
font-weight: bold;
line-height: 2rem;
color: #333;
}
.low-height {
margin-bottom: 0;
}
.box-tabs .tab-pane .framed {
padding-top: 2.6rem;
border-bottom: 1px solid #e4e4e4;
margin-bottom: 3.4rem;
}
.box-tabs .tab-pane .content-block2 h3,
.box-tabs .tab-pane .content-block1 h3 {
margin-top: 0;
font-weight: bold;
color: #666666;
line-height: 2.6rem;
letter-spacing: -0.5px;
margin-bottom: 1.5rem;
font-size: 1.6rem;
}
.box-tabs .tab-pane .content-block2 .box {
font-weight: normal;
color: #333333;
margin: 0 0 3rem;
margin-top: 0px;
padding-left: 28px;
position: relative;
vertical-align: top;
}
.box-tabs .fa-arrow-right {
display: none;
}
.box-tabs .tab-pane .content-block2 .box {
margin-top: -2rem;
}
.blue-icon li::before,
.blue-icon .box::before {
color: #285ce6;
}
.light-blue-icon li::before,
.light-blue-icon .box::before {
color: #2dc6d6;
}
@media (min-width: 768px) {
.box-tabs .tab-pane {
padding: 4.6rem 0 0rem 0;
}
.box-tabs .nav-tabs li a {
width: 100%;
}
.box-tabs .nav-tabs>li+li {
margin-left: 1.8rem;
}
.box-menu-tab {
border-bottom: 1px solid #e4e4e4;
}
}
@media (min-width: 967px) {
.box-tabs .nav-tabs li a {
width: 100%;
}
.box-tabs .nav-tabs>li+li {
margin-left: 6.8rem;
}
}
/****************************************************************************
* // Accordion Panels
****************************************************************************/
h2.section-title {
font-size: 27px;
line-height: 3.8rem;
letter-spacing: -1px;
font-weight: bold;
}
.panel-group {
margin-right: 0;
}
.panel-group .panel {
border-radius: 0;
box-shadow: none;
border-color: transparent;
}
.panel-default>.panel-heading {
padding: 0;
border-radius: 0;
color: #212121;
background-color: transparent;
border-color: transparent;
}
.panel-default>.panel-heading:hover {
background-color: #e5ebeb;
}
.panel-title>a {
font-size: 27px;
font-weight: 400;
line-height: 110%;
letter-spacing: -0.5px;
display: block;
padding: 2.5rem 1.5rem;
text-decoration: none;
color: #212121;
margin-left: -1.5rem;
}
.panel-body {
margin-left: -1.5rem;
padding-bottom: 6rem;
padding-top: 3rem;
}
.panel-default>.panel-heading+.panel-collapse>.panel-body {
border-top-color: transparent;
}
div[id^="accordion"] .panel-body p {
margin-bottom: 1.5rem;
}
div[id^="accordion"] .panel-title {
padding: 0;
}
div[id^="accordion"] .panel-title>a {
display: flex;
align-items: center;
height: 84px;
font-size: 20px;
position: relative;
padding: 0;
color: #285ce6;
margin: 0;
padding: 0 42px 0 0;
}
div[id^="accordion"] .panel-title>a:hover {
color: #285CE6;
}
div[id^="accordion"] .panel-title>a.accordion-toggle.collapsed:before, div[id^="accordion"] .panel-title>a.accordion-toggle:before {
display: block;
content: '';
position: absolute;
right: 0;
top: -2px;
width: 30px;
height: 100%;
background-position: center 53%;
background-repeat: no-repeat;
background-image: url('../../shared/images/toggle_plus_25x25.webp');
background-size: 30px 30px;
}
div[id^="accordion"] .panel-title>a.accordion-toggle:before {
background-image: url('../../shared/images/toggle_minus_25x25.webp');
background-size: 30px 30px;
}
div[id^="accordion"] .panel-body {
padding: 0;
margin: 0;
padding-left: 42px;
padding-top: 20px;
padding-bottom: 30px;
}
@media (max-width: 768px) {
div[id^="accordion"] .panel-body {
padding-left: 0;
}
}
div[id^="accordion"] .panel.panel-default {
padding: 0;
margin: 0;
border-bottom: 0;
border-top: 1px solid #c8c8c8;
}
div[id^="accordion"] .panel.panel-default:last-child {
border-bottom: 1px solid #c8c8c8;
}
.listed-punc {
line-height: 1.5;
}
.more-less {
float: left;
color: #0277c0;
font-size: 3.2rem;
margin-right: 2rem;
margin-top: -0.5rem;
}
@media (min-width: 768px) {
.more-less {
margin-bottom: 4rem;
margin-top: -0.5rem !important;
margin-top: 0;
}
}
/****************************************************************************
* // DPI Feature 2
****************************************************************************/
#dpi-feature2 {
margin-top: 3rem;
}
.creation {
display: none;
}
.speak-circle {
display: none;
}
#dpi-feature2 p {
margin-bottom: 2rem;
}
@media (min-width: 967px) {
#dpi-feature2 {
margin-top: 6rem;
}
#dpi-feature2 h2 {
margin-bottom: 0;
}
#dpi-feature2 p:first-of-type {
margin-top: 13rem;
}
.creation {
display: inline-block;
margin-left: -4.5rem;
margin-top: -3rem;
width: 600px;
}
.speak-circle {
display: inline;
position: absolute;
top: 13rem;
left: -7rem;
}
}
/****************************************************************************
* // Four columns icons text below
****************************************************************************/
#four-icons {
margin-bottom: 3rem;
margin-top: 3rem;
}
#four-icons h4,#four-icons h3 {
font-size: 20px;
font-weight: 600;
line-height: 110%;
letter-spacing: -0.5px;
margin-top: 0;
letter-spacing: initial;
}
#four-icons .icons {
float: left;
margin-top: .5rem;
}
#four-icons .icons-text {
display: block;
overflow: hidden;
padding-left: 2rem;
margin-bottom: 3rem;
}
@media (min-width: 768px) {
#four-icons {
margin-bottom: 6rem;
margin-top: 0;
}
#four-icons .icons {
float: none;
margin-top: 0;
margin-bottom: 1rem;
}
#four-icons .icons-text {
display: inline;
padding-left: 0;
margin-bottom: 0;
}
}
@media (min-width: 768px) {
#four-icons {
margin-bottom: 6rem;
margin-top: 0;
}
}
/****************************************************************************
* // Text ticks
****************************************************************************/
#text-ticks {
margin-bottom: 3rem;
}
#text-ticks .circle-tick {
margin-top: .5rem;
}
#text-ticks .bullets-right {
margin-top: 6rem;
}
#text-ticks p {
margin-bottom: 1.5rem;
}
/****************************************************************************
* // Two col text tick
****************************************************************************/
.bullets-right .fa-check-circle-o, .fa-check,
.app .fa-check-circle-o {
font-size: 1.5rem;
padding-top: 3px;
color: #9fca3e;
margin-left: 2;
padding-right: 1.5rem;
}
.bullet-points {
margin-top: 3rem;
}
.bullet-points p {
margin-left: -3rem;
margin-bottom: 1rem;
}
@media (min-width: 768px) {
#two-col-text-tick .bullet-points {
padding-right: 3rem;
border-left: 1px solid #cccccc;
}
.bullet-points {
margin-top: 0;
margin-left: 2;
}
.bullet-points p {
margin-left: 2;
}
}
/****************************************************************************
* // Row over two col
****************************************************************************/
#row-over-two-col .try-app {
margin-top: .5rem;
}
#row-over-two-col .bullet-block {
margin-top: 0;
}
#row-over-two-col .bullet-block .row {
margin-top: 1.5rem;
}
#row-over-two-col .bullet-block p {
margin-left: -2.5rem;
}
@media (min-width: 768px) {
#row-over-two-col {
padding-top: 3rem;
padding-bottom: 6rem;
}
#row-over-two-col .try-app {
margin-top: .5rem;
margin-bottom: 6rem;
}
#row-over-two-col .bullet-block {
margin-top: -3rem;
}
}
@media (min-width: 967px) {
#row-over-two-col .bullet-block {
margin-top: -1.5rem;
}
#row-over-two-col .try-app {
margin-top: 2rem;
margin-bottom: 6rem;
}
}
/****************************************************************************
* // Carousel
****************************************************************************/
#references .carousel .fa {
font: normal normal normal 36px/1 FontAwesome;
}
#references .carousel {
height: 35rem;
margin-bottom: 0;
}
#references .carousel .item {
height: 35rem;
}
#references .carousel-caption {
padding-bottom: 1rem;
text-align: left;
text-shadow: none;
top: 50px;
left: 0;
right: 0;
}
#references {
padding-top: 3rem;
}
#references .nav>li>a {
padding: 1rem 0 0 0;
margin-right: 1.5rem;
}
#references li {
padding-bottom: 3rem;
}
#references .nav-tabs>li {
margin-right: 1.5rem;
color: #ffffff;
font-size: 1.6rem;
}
#references .nav-tabs>li>a {
margin-right: 2px;
line-height: 1.42857143;
border: none;
border-radius: 0;
font-size: 1.6rem;
color: #ffffff;
}
#references .nav-tabs {
border-bottom: none;
}
#references .banner-fix {
margin-top: -2rem;
}
#references .nav-tabs>li.active>a,
#references .nav-tabs>li.active>a:focus,
#references .nav-tabs>li.active>a:hover {
color: #ffffff;
cursor: default;
background-color: transparent;
border: none;
border-bottom-color: transparent;
font-size: 1.6rem;
padding-left: 0;
padding-right: 0;
}
#references .nav li:hover a {
border: none;
background: none;
color: #ffffff;
}
#references .nav-tabs>li.active a,
#references .tab ul li.active a {
border-bottom: 1px solid #ffffff;
}
#references .banners-top {
margin-top: -2rem;
}
#references .tab ul {
list-style: outside none none;
margin: 0;
padding: 0;
}
#references .tab ul li {
display: inline-block;
margin-right: 2.8rem;
}
#references .tab ul li a {
color: #ffffff;
font-size: 1.6rem;
line-height: 1rem;
padding-bottom: 1.6rem;
text-decoration: none;
}
#references .item h3 {
color: #ffffff;
font-weight: normal;
margin-top: -5rem;
margin-bottom: 0;
letter-spacing: -0.05rem;
}
#references .item .content-block {
margin: 0 10%;
}
#references .item p {
color: #ffffff;
font-size: 1.6rem;
line-height: 1.9rem;
padding-top: 2rem;
}
.item p.black {
color: #000000;
margin-top: 0;
padding-top: 0;
}
#references .item p.grey {
color: #666666;
font-size: 1.2rem;
margin-top: 0;
padding-top: 0;
}
#references .item p a {
color: #ffffff;
}
@media (min-width: 768px) {
#references {
padding-top: 6rem;
}
#references .item h3 {
font-size: 27px;
line-height: 3.2rem;
}
#references .carousel {
height: 30rem;
margin-bottom: 0;
}
#references .carousel .item {
height: 30rem;
}
#bluetooth-headset #references .carousel,
#usb-headset #references .carousel,
#powermic #references .carousel {
height: 32rem;
margin-bottom: 0;
}
#bluetooth-headset #references .carousel .item,
#usb-headset #references .carousel .item,
#powermic #references .carousel .item {
height: 30rem;
}
}
/****************************************************************************
* // Text-image
****************************************************************************/
#text-image p:first-of-type {
margin-top: 3rem;
margin-bottom: 3rem;
}
#text-image img {
margin-top: 0;
}
@media (min-width: 768px) {
#text-image .single-line-30 {
margin-top: .5rem;
margin-bottom: .5rem;
}
}
@media (min-width: 768px) {
#text-image .single-line-30 {
margin-top: .5rem;
margin-bottom: .5rem;
}
}
@media (min-width: 968px) {
#text-image p:first-of-type {
margin-top: 6rem;
}
#text-image img {
margin-top: -6rem;
}
#text-image .single-line-30 {
margin-top: 3rem;
margin-bottom: 3rem;
}
}
/****************************************************************************
* // Speech recognition for Professionals
****************************************************************************/
#business {
background: url('../../shared/images/dragon-over-head-01.webp') right top no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
padding-bottom: 7rem;
}
#srfp .button-white-blue,
#srfp .button-blue-white {
margin: .5rem .5rem;
text-align: center;
}
#srfp .button-blue-white {
float: right;
}
#srfp .buts {
margin: auto;
width: 400px;
}
#srfp .dragon-icon2 {
padding-top: 5.5rem;
padding-bottom: 2rem;
width: 4rem;
}
#business-2 .icon {
margin-top: 3rem;
}
#srfp .banner-p {
margin-bottom: 5rem;
}
#srfp .fa-quote-left,
#srfp .fa-quote-right,
#srfp .underline,
#srfp .img-set {
display: none;
}
#srfp .quotation {
padding-left: 2rem;
}
#srfp .pack-top {
z-index: 1;
}
#srfp .button-reduced2 {
padding-top: 8px;
width: 86%;
}
#srfp .mob-center {
text-align: center;
}
#srfp .button-icon {
text-align: center;
width: 15rem;
}
#business-5 .icones {
margin-bottom: 1.5rem;
height: 9rem;
}
#srfp .group-box {
width: 16rem;
}
@media only screen and (min-width: 768px) {
#srfp .fa-quote-left,
#srfp .fa-quote-right {
display: none;
}
#srfp .quotation {
padding-left: 0;
margin-top: 0;
}
#srfp .set-height {
height: 80px;
}
#srfp .business-logo {
position: absolute;
bottom: 0;
left: -12rem;
}
}
@media only screen and (max-width: 435px) {
#srfp .button-white-blue,
#srfp .button-blue-white {
margin: .5rem .5rem;
text-align: center;
float: none;
}
#srfp .buts {
width: 20rem;
}
}
@media only screen and (min-width: 1100px) {
#srfp .banner-p {
margin-bottom: 5rem;
padding: 0 32rem;
}
}
@media only screen and (min-width: 1200px) {
#srfp .fa-quote-left,
#srfp .fa-quote-right {
font-size: 1.4rem;
vertical-align: bottom;
margin-bottom: 0;
display: inline;
}
#srfp .fa-quote-right {
padding-left: 1rem;
}
#srfp .quotation {
padding-left: 2rem;
margin-top: -2.5rem;
}
#srfp .img-set {
display: inline;
position: absolute;
right: 1.5rem;
top: -.4rem;
}
#srfp .mob-center {
text-align: left;
}
#srfp .underline {
display: block;
margin-top: .6rem;
border-bottom: 1px solid #cccccc;
}
}
/****************************************************************************
* // Benefits page
****************************************************************************/
#benefits-top {
background: url('../../shared/images/benefits.webp') left top no-repeat;
min-height: 330px;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
padding-top: 6rem;
padding-bottom: 6rem;
}
.benefits-lead {
line-height: 5rem;
letter-spacing: 0;
font-weight: bold;
padding-bottom: 3rem;
padding-top: 2rem;
margin-top: 0;
margin-bottom: 0;
}
#benefits-1 {
padding: 6rem 0;
}
#benefits-2 {
background-color: #e4eceb;
padding-bottom: 6rem;
padding-top: 6rem;
}
#benefits {
background: #fff;
}
#benefits-2 h2 {
margin-bottom: 3rem;
color: #111a7b;
}
#benefits-3 {
background-color: #005a76;
padding-top: 6rem;
padding-bottom: 6rem;
}
#benefits-3 .white-height {
padding-top: 6rem;
line-height: 2.2rem;
}
@media only screen and (max-width: 767px) {
#benefits-top {
margin-top: 0;
background-position: left;
}
.benefits-lead {
font-size: 3.5rem;
line-height: 4rem;
}
#benefits-3 .white-height {
padding-top: 3rem;
}
#benefits-2 {
padding-bottom: 3rem;
padding-top: 3rem;
}
}
/****************************************************************************
* // thankyou
****************************************************************************/
.thankyou #feature-1 {
margin-top: 6rem;
margin-bottom: 1.7rem;
}
.thankyou .bullets {
margin-top: 3rem;
margin-left: -1.5rem;
}
.thankyou .bullets p {
margin-bottom: 0;
}
.thankyou .fa-check-circle-o {
padding-right: 1.5rem;
color: #666666;
font-size: 1.8rem;
}
@media(max-width: 767px) {
.thankyou #feature-1 {
margin-top: 3rem;
margin-bottom: 3rem;
}
}
/****************************************************************************
* // Form
****************************************************************************/
.dragon-icon2 {
padding-top: 5.5rem;
width: 4rem;
}
#block-6 form {
margin-top: 2rem;
}
input,
textarea,
select {
width: 100%;
margin-top: 10px;
border-radius: 3px;
border: 1px solid #a19aa2;
font-size: 1.6rem;
background-color: #faf9fa;
padding: 1.5rem 2.5rem;
box-sizing: border-box;
margin-top: 2rem;
color: #a19aa2;
}
textarea {
height: 6.1rem;
}
input[type=text]:focus,
input[type=email]:focus,
textarea:focus,
select:focus {
background-color: #ffffff;
border-color: #999999;
color: #333333;
}
label.radio input[type="radio"] {
display: none;
}
label.radio span {
display: inline-block;
border: 1px solid #a19aa2;
border-radius: 3px;
width: 3rem;
height: 3rem;
background: #faf9fa;
vertical-align: middle;
margin-right: 1.5rem;
position: relative;
transition: width 0.1s, height 0.1s, margin 0.1s;
margin-top: -2rem;
}
label.radio :checked+span {
background: #ffffff;
width: 3rem;
height: 3rem;
}
label.radio :checked+span:after {
content: '\2714';
font-size: 20px;
position: absolute;
top: -2px;
left: 5px;
color: #333333;
}
label {
color: #333333;
font-size: 14px;
font-weight: normal;
}
.form-break {
border-bottom: 1px solid #dcdcdc;
margin-bottom: 40px;
}
.label-text {
margin-left: -30px;
line-height: 2px;
color: #a19aa2;
padding-left: 10px;
}
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"],
.radio input[type="radio"],
.radio-inline input[type="radio"] {
position: absolute;
margin-top: 0;
margin-left: -3px;
}
.radio {
margin-top: 13px;
}
.radio-row {
margin-top: 20px;
}
select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
input:focus::-webkit-input-placeholder {
color: transparent;
}
input:focus:-moz-placeholder {
color: transparent;
}
/* Firefox 18- */
input:focus::-moz-placeholder {
color: transparent;
}
/* Firefox 19+ */
input:focus:-ms-input-placeholder {
color: transparent;
}
/* oldIE ;) */
.light-text {
font-size: 14px !important;
line-height: 19px;
color: #999999;
letter-spacing: 0;
margin-top: 60px;
}
.LV_validation_message {
font-weight: bold;
font-size: 12px;
margin: 0;
line-height: 1.2;
}
.LV_valid, .LV_invalid {
position: relative;
top: -15px;
display: block;
}
.LV_valid {
color: #008253;
}
.LV_invalid {
color: #cd1a1a;
}
.LV_valid::after {
content: "";
position: absolute;
top: 20px;
right: 10px;
width: 22px;
height: 22px;
background-size: 22px 22px;
background-image: url('../../shared/images/validation-tick.webp');
background-repeat: no-repeat;
}
.individual-fix .LV_valid::after {
top: 20px;
}
.LV_invalid::after {
content: "";
position: absolute;
top: 20px;
right: 10px;
width: 22px;
height: 22px;
background-size: 22px 22px;
background-image: url('../../shared/images/validation-cross.webp');
background-repeat: no-repeat;
}
#formElement3 .LV_invalid::after,
#formElement4 .LV_invalid::after,
#formElement5 .LV_invalid::after,
#formElement3 .LV_valid::after,
#formElement4 .LV_valid::after,
#formElement5 .LV_valid::after,
.individual-fix .LV_invalid::after,
.individual-fix .LV_valid::after {
top: 20px;
}
.LV_valid_field,
input.LV_valid_field:hover,
input.LV_valid_field:active,
textarea.LV_valid_field:hover,
textarea.LV_valid_field:active {
border: 1px solid #00CC00;
}
.LV_valid_field::after,
input.LV_valid_field:after {
display: inline-block;
position: absolute;
right: 30px;
top: 0;
content: "\f00c";
color: green;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
font-size: 28px;
}
.LV_invalid_field,
input.LV_invalid_field:hover,
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover,
textarea.LV_invalid_field:active {
border: 1px solid #CC0000;
}
@media(max-width: 1100px) {
.label-text {
padding-top: 25px;
margin-left: 0;
}
label.checkbox span {
margin-top: 0;
}
.light-text {
margin-top: 50px;
}
}
@media(max-width: 767px) {
.label-text {
margin-left: -60px;
}
.light-text {
margin-top: 20px;
}
input,
textarea,
select {
font-size: 14px;
}
}
@media(max-width: 467px) {
.label-text {
margin-left: -20px;
}
}
/****************************************************************************
* // Form placeholders
****************************************************************************/
.field-wrapper {
position: relative;
}
.control:focus~.floating-label,
.control:not(:focus):valid~.floating-label {
top: 21px;
left: 41px;
font-size: 11px;
opacity: 0.4;
color: #666666;
}
.control {
font-size: 16px;
height: 58px;
padding-top: 10px;
color: #333;
opacity: 0.8;
}
textarea.control {
height: 61px;
overflow: hidden;
padding-top: 14px;
}
.floating-label {
position: absolute;
pointer-events: none;
left: 40px;
top: 38px;
color: #a19aa2;
transition: 0.3s ease all;
font-size: 16px;
}
/****************************************************************************
* // Contact Forms
****************************************************************************/
.elq-item-select {
z-index: 10;
}
#trial-banner .form-field {
height: auto;
}
#trial-banner .select2-dropdown {
box-shadow: 0px 1px 10px #ccc;
}
#trial-banner .select2-results__option {
color: #000000;
font-weight: 700;
padding: 10px 12px;
}
#trial-banner .select2-results__option:first-child {
opacity: 0.5;
}
#trial-banner .select2-results__option[aria-selected]:hover {
cursor: pointer;
background-color: #dcecf3;
color: #a19aa2;
}
#trial-banner h2,
#trial-banner p {
display: inline-block;
margin-bottom: 0;
}
#trial-banner .step-row {
border-top: 2px solid #e4e4e4;
padding: 36px 0;
}
#trial-banner .variation {
width: 100%;
}
#trial-banner .control1:focus~.floating-label2,
.control1:not(:focus):valid~.floating-label2 {
top: 9px;
font-size: 9px;
opacity: 0.4;
color: #666666;
padding-left: 0;
}
#trial-banner .col-sm-6 .LV_valid::after,
#trial-banner .col-sm-6 .LV_invalid::after {
top: -40px;
}
#trial-banner .col-sm-12 .LV_valid::after,
#trial-banner .col-sm-12 .LV_invalid::after {
top: -40px;
}
#trial-banner .step-row.no-border {
border: none;
}
#trial-banner .step-row * {
align-self: center;
}
#trial-banner .step-row.contact-sales,
#trial-banner .step-row.vla-form,
#trial-banner .step-row.lookuporder,
#trial-banner .step-row.managesubscription,
#trial-banner .step-row.selectproduct,
#trial-banner .step-row.whatyoucando,
#trial-banner .step-row.customer-service-contact,
#trial-banner .step-row.customer-service-form,
#trial-banner .step-row.customer-service-call-team,
#trial-banner .step-row.customer-service-how {
display: none;
}
#trial-banner .step-row.contact-sales.showrow,
#trial-banner .step-row.vla-form.showrow,
#trial-banner .step-row.lookuporder.showrow,
#trial-banner .step-row.managesubscription.showrow,
#trial-banner .step-row.selectproduct.showrow,
#trial-banner .step-row.whatyoucando.showrow,
#trial-banner .step-row.customer-service-contact.showrow,
#trial-banner .step-row.customer-service-form.showrow,
#trial-banner .step-row.customer-service-call-team.showrow,
#trial-banner .step-row.customer-service-how.showrow {
display: block;
}
@media (min-width: 767px) {
#trial-banner .step-row.whatyoucando.showrow,
#trial-banner .step-row.customer-service-call-team.showrow,
#trial-banner .step-row.managesubscription.showrow,
#trial-banner .step-row.lookuporder.showrow {
display: flex;
}
}
#trial-banner .managesubscription .button {
white-space: normal;
text-align: center;
}
#trial-banner .step-row.add-padding {
padding: 0 12px;
}
#trial-banner .step-row.no-bottom-padding {
padding-bottom: 0;
}
#trial-banner .step-row.no-top-padding {
padding-top: 0;
}
#trial-banner .banner-header {
margin-bottom: 20px;
}
.select-styling {
position: relative;
}
.select-styling+.LV_validation_message::after {
display: none !important;
}
.select-styling:after,
.grey-box .select2-container--default .select2-selection--single .select2-selection__arrow b {
content: "";
position: absolute;
right: 13px;
top: 45px;
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #000;
pointer-events: none;
}
#contact-sales-form .grey-box .select2-container--default .select2-selection--single .select2-selection__arrow b {
content: "";
position: absolute;
right: 13px;
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #000;
left: -3px;
top: 18px;
}
.grey-box .select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #000 transparent transparent transparent;
border-style: solid;
border-width: .5rem .4rem 0 .4rem;
height: 0;
left: 50%;
margin-left: -.4rem;
margin-top: 1.4rem;
position: absolute;
top: 75%;
width: 0;
}
.select-styling:before {
content: "";
position: absolute;
right: 37px;
top: 25px;
width: 0;
height: 46px;
border-left: 1px solid #000;
z-index: 1;
}
.helper-text {
font-size: 16px;
}
.helper {
opacity: 0;
}
.helper-show {
opacity: 1;
display: flex;
}
@media (max-width: 767px) {
.helper {
display: none !important;
}
}
#trial-banner .step-row .helper-image {
width: 40px;
margin-right: 28px;
}
.step-row h2 {
margin-right: 30px;
}
#trial-banner .small {
display: block;
}
#trial-banner .grey-box .select2-selection--single {
box-shadow: 0px 1px 10px #ccc;
}
#trial-banner .grey-box .select2-container .select2-selection--single .select2-selection__rendered {
line-height: 2.8;
color: #000000;
font-weight: 700;
padding-left: 18px;
}
#trial-banner input,
#trial-banner textarea,
#trial-banner select {
margin-top: 10px;
width: 100%;
border-radius: 0;
border: 1px solid #c7c7c7;
font-size: 14px;
background-color: #eef6f6;
padding: 12px 0 12px 24px;
box-sizing: border-box;
color: #333333;
text-align: left;
font-weight: normal;
}
#trial-banner input[type="checkbox"],
input[type="radio"] {
float: left;
width: 40px;
margin-top: 10px;
transform: scale(1.2);
margin-left: 15px;
}
#trial-banner label {
color: #000;
text-align: left;
float: left;
}
#trial-banner h2 {
margin-bottom: 15px;
}
::placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #000;
opacity: 1; /* Firefox */
}
:-ms-input-placeholder,
::-ms-input-placeholder {
/* Internet Explorer 10-11 */
color: #000;
}
#trial-banner textarea {
height: 45px;
}
#trial-banner select {
margin-top: 10px;
text-align: left;
padding: 12px 0 11px 24px;
margin-top: 0;
}
#trial-banner .control1:focus~.floating-label2,
#trial-banner .control1:not(:focus):valid~.floating-label2 {
top: 11px;
font-size: 9px;
opacity: 0.4;
color: #666666;
padding-left: 0px;
}
.control1 {
font-size: 14px;
padding-top: 12px;
color: #333;
padding-top: 14px;
}
textarea.control1 {
height: 30px;
overflow: hidden;
padding-top: 2px;
}
.floating-label2 {
position: absolute;
pointer-events: none;
text-align: left;
left: 40px;
top: 22px;
color: #333333;
font-weight: normal;
transition: 0.3s ease all;
font-size: 14px;
}
#trial-banner .LV_invalid::after {
top: 15px;
}
#trial-banner .LV_valid::after {
top: 15px;
}
#trial-banner .align-notes {
margin-top: 35px;
}
#trial-banner .align-notes .col-sm-4 {
padding-left: 0;
}
#trial-banner ul.icon-align li {
font-size: 12px;
color: #626d6f;
margin-left: -25px;
margin-top: -2px;
text-align: left;
}
#trial-banner .tech-adv {
font-size: 10px;
margin-top: 0;
text-align: right;
margin-right: 0px;
margin-left: -15px;
}
#trial-banner .fa-check-circle {
color: #3ed38f;
}
#trial-banner .form-frame {
padding-left: 80px;
padding-right: 80px;
}
#trial-banner .fit-3 {
margin-left: -20px;
}
#trial-banner .fit-2 {
margin-left: -5px;
}
#trial-banner .fa {
float: left;
}
#trial-banner .purchase-banner {
margin-top: 15px;
}
#trial-banner .fa-check-circle {
font-size: 14px;
padding-right: 5px;
}
.rating-stars {
padding-left: 15px;
margin-top: -5px;
width: 80px;
}
#trial-banner input[type="submit"] {
background: #3460de;
color: #ffffff;
padding: 10px 26px;
line-height: 18px;
border-radius: 3px;
display: inline-block;
font-size: 18px;
font-weight: 400;
letter-spacing: 0 !important;
text-decoration: none !important;
white-space: normal;
text-align: center;
border: 0;
vertical-align: baseline;
position: relative;
}
#trial-banner input[type=submit]:hover {
background: #2851c8;
color: #f2f2f2;
}
/* What you can do options layout */
#trial-banner .step-row.whatyoucando .phone p {
margin-bottom: 20px;
}
#trial-banner .step-row.whatyoucando .phone .button {
margin-bottom: 20px;
}
#trial-banner .step-row.whatyoucando .phone .bold-grey {
font-weight: 300;
}
#trial-banner .step-row.whatyoucando .phone .bold-grey a {
font-weight: 700;
color: #565656;
}
#trial-banner .step-row.whatyoucando .phone .flex {
display: flex;
width: 50%;
margin-bottom: 10px;
}
#trial-banner .step-row.whatyoucando .phone hr {
display: inline-block;
width: 32%;
}
/* What you can do options layout */
#trial-banner .step-row.customer-service-how .phone p {
margin-bottom: 20px;
text-align: left;
width: 365px;
}
#trial-banner .step-row.customer-service-how .phone .button {
margin-bottom: 20px;
}
#trial-banner .step-row.customer-service-how .phone .bold-grey {
font-weight: 300;
}
#trial-banner .step-row.customer-service-how .phone .bold-grey a {
font-weight: 700;
color: #565656;
}
#trial-banner .step-row.customer-service-how .phone .flex {
display: flex;
width: 50%;
margin-bottom: 15px;
}
#trial-banner .step-row.customer-service-how .phone hr {
display: inline-block;
width: 32%;
}
@media (max-width: 1200px) {
#trial-banner .form-frame {
padding-left: 0;
padding-right: 0;
}
}
@media (max-width: 1100px) {
#trial-banner .tech-adv {
margin-left: -45px;
}
}
@media (max-width: 767px) {
#trial-banner .fit-3,
#trial-banner .fit-2,
#trial-banner input[type="submit"],
#trial-banner .tech-adv {
margin-left: 0;
}
#trial-banner ul.icon-align li {
text-align: left;
}
}
/* Tablet and above styles */
@media (min-width: 767px) {
#trial-banner .step-row {
display: flex;
}
#trial-banner .label {
margin-left: 40px;
}
#trial-banner .variation {
width: 85%;
}
#trial-banner .step-row.contact-sales.showrow,
#trial-banner .step-row.your-details.showrow,
#trial-banner .step-row.your-company.showrow,
#trial-banner .step-row.enquiry.showrow {
display: flex;
}
#trial-banner .banner-header {
margin-bottom: 22px;
}
}
#trial-banner input,
#trial-banner textarea,
#trial-banner select {
width: 100%;
border-radius: 0;
border: 1px solid #000;
font-size: 14px;
background-color: #fff;
padding: 12px 0 12px 14px;
box-sizing: border-box;
margin-top: 5px;
color: #000;
text-align: left;
font-weight: normal;
margin-bottom: 20px;
}
.floating-label2 {
position: absolute;
pointer-events: none;
text-align: left;
left: 40px;
top: 22px;
color: #000;
font-weight: normal;
transition: 0.3s ease all;
font-size: 14px;
}
.control1:focus~.floating-label2,
.control1:not(:focus):valid~.floating-label2 {
top: 11px;
font-size: 9px;
opacity: 0.4;
color: #666666;
padding-left: 4px;
}
#trial-banner .LV_invalid::after {
top: 15px;
}
#trial-banner .LV_valid::after {
top: 22px;
}
#trial-banner .text-left {
padding-top: 30px;
}
/****************************************************************************
* // Contact form icons and logos
****************************************************************************/
.form-contact .fa-check-circle {
font-size: 30px;
color: #37cd84;
padding-right: 15px;
padding-top: 40px;
}
ul.icon-align {
list-style-type: none;
}
ul.icon-align li {
margin-top: -25px;
font-size: 14px;
color: #626d6f;
}
.align-notes {
margin-top: -10px;
}
.feint {
color: #626d6f;
font-size: 14px;
}
.field-wrapper p {
margin: 0;
}
@media(max-width: 1200px) {
ul.icon-align li {
font-size: 12px;
}
}
@media(max-width: 1100px) {
ul.icon-align li {
font-size: 10px;
}
}
@media(max-width: 767px) {
.form-contact .fa-check-circle {
padding-top: 10px;
margin-left: -15px;
}
}
/****************************************************************************
* // Accessories Overview
****************************************************************************/
.accessories-overview-1 h5 {
color: #696767;
margin-top: 0;
margin-bottom: 4.5rem;
}
#accessories-overview-2 .values {
color: #212222;
font-size: 3.3rem;
font-weight: bold;
letter-spacing: -0.075em;
line-height: 3.3rem;
text-align: center;
padding-bottom: 2rem;
}
#accessories-overview-2 .vat {
color: #333333;
font-size: 1rem;
line-height: 1.4rem;
padding-left: 0;
font-weight: normal;
letter-spacing: -0.075em;
vertical-align: top;
padding-bottom: 2rem;
}
#accessories-overview-2 .button-purchase {
padding: .6rem .6rem;
background: #CE4400 ;
color: #ffffff;
border-radius: .3rem;
font-size: 1.4rem;
font-weight: bold;
text-align: center;
width: 11rem;
margin: 0 auto;
display: inline-block;
}
.v-column {
border-right: 1px solid #dedede;
}
.accessories-block {
height: 25rem;
min-height: 25rem;
}
#accessories-ov .box-value .value,
#accessories-ov .box-value-2 .value-2,
#accessories-ov .box-value-3 .value-3 {
color: #212222;
font-size: 3rem;
font-weight: bold;
letter-spacing: -0.075em;
line-height: 1em;
}
#accessories-ov .currency-sign {
color: #212222;
font-size: 3rem;
font-weight: bold;
letter-spacing: -0.075em;
line-height: 1em;
}
#accessories-ov .acc-img {
max-width: 150px;
}
#accessories-ov h2.section-header {
font-size: 1.6rem;
line-height: 2.2rem;
margin-top: 1rem;
margin-bottom: 1rem;
letter-spacing: 0;
height: 3rem;
}
.right-align a {
float: right;
}
@media (max-width: 1200px) {
.accessories-block {
height: 20rem;
min-height: 20rem;
}
}
@media (max-width: 1000px) {
#accessories-overview-2 h5 {
height: 3rem;
}
#accessories-overview-2 .values {
font-size: 2.3rem;
line-height: 3.3rem;
}
#accessories-overview-2 .vat {
font-size: .8rem;
line-height: .8rem;
padding-bottom: .6rem;
}
}
@media (max-width: 767px) {
.v-column {
border-right: none;
}
.accessories-block {
height: 100%;
min-height: 100%;
margin-bottom: 3rem;
}
#accessories-overview-2 .values {
font-size: 3.3rem;
letter-spacing: -0.075em;
line-height: 3.3rem;
}
#accessories-overview-2 .vat {
font-size: 1rem;
line-height: 1.4rem;
padding-left: .7rem;
padding-bottom: .2rem;
}
.sp-gap {
margin-top: -.7rem;
}
}
@media (min-width: 767px) {
.accessories-block {
height: 38rem;
min-height: 38rem;
}
}
@media (min-width: 1100px) {
.accessories-block {
height: 25rem;
min-height: 25rem;
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
.right-align {
margin: 1.5rem 2rem 0 1.5rem;
float: left;
}
}
/****************************************************************************
* // Dragon professional Anywhere
****************************************************************************/
#dragon-pro-anywhere {
top: 0;
background: url('../../shared/images/right-header-dpa.webp') right top no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
}
#dragon-anywhere-pro h5 {
margin-bottom: 1.5rem;
}
#dragon-pro-any-5 ul {
padding-left: 1.2rem;
list-style-type: "-";
}
#dragon-pro-any-5 li {
padding-left: 1rem;
}
#dragon-pro-any-6 .lista-features li {
padding-left: 3rem;
color: #666666;
}
.enterprise-circle {
margin-left: -7rem;
margin-top: -6rem;
}
.anywhere-logo {
position: absolute;
bottom: 0;
right: 0;
}
.video-container {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.button-white-blue {
background: #ffffff;
color: #0277c0;
padding: .6rem 0;
border: 2px solid #0277c0;
border-radius: 3px;
font-size: 1.4rem;
font-weight: bold;
width: 17rem;
text-align: center;
margin-bottom: 1rem;
display: inline-block;
margin-right: 1.5rem;
}
.button-white-blue:hover {
background: #0277c0;
color: #ffffff;
border: 2px solid #ffffff;
text-decoration: none;
}
.button-blue-white {
background: #0277c0;
color: #ffffff;
padding: .7rem 0 .6rem;
border: 2px solid #0277c0;
border-radius: 3px;
font-size: 1.4rem;
font-weight: bold;
width: 17rem;
text-align: center;
display: inline-block;
}
.button-blue-white:hover {
background: #ffffff;
color: #0277c0;
border: 2px solid #0277c0;
text-decoration: none;
}
#dragon-pro-any-3 .icones {
height: 8rem;
}
#dragon-pro-any-6 .row {
margin-left: 0;
}
#dragon-anywhere-pro .button-white-blue,
#dragon-anywhere-pro .button-blue-white {
margin: .5rem .5rem;
text-align: center;
float: none;
}
@media (max-width: 1200px) {
.enterprise-circle {
margin-left: -2rem;
margin-top: 0;
width: 98%;
}
}
@media (max-width: 1100px) {
.shift {
margin-top: -3rem;
}
}
@media (max-width: 850px) {
.anywhere-logo {
display: none;
}
}
@media (max-width: 767px) {
#dragon-anywhere-pro h5 {
font-size: 1.6rem;
line-height: 2rem;
}
#dragon-anywhere-pro .v60less {
margin-top: 0;
}
#dragon-pro-any-6 .row {
margin-left: -.1rem;
margin-right: 1rem;
}
#dragon-pro-any-6 .v90 {
margin-top: 1.5rem;
}
.enterprise-circle {
margin-left: -1.5rem;
margin-top: 0;
width: 50%;
}
}
/****************************************************************************
* // Dragon Professional Group
****************************************************************************/
#compare-8 {
top: 0;
background: url('../../shared/images/group-background-1.webp') right top no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
}
#compare-8 h2 {
padding-right: 10rem;
}
#compare-8 .group-icon {
width: 20rem;
margin-top: 10rem;
}
#compare-8 .circle {
background-color: #336699;
border-radius: 50%;
position: absolute;
top: 7rem;
right: 0;
width: 15rem;
height: 15rem;
text-align: center;
}
#compare-4 ul.bullet-fix {
list-style-type: "-";
}
#compare-8 .circle.pink {
background-color: #d544ad;
}
#compare-8 .minimum-small {
font-size: 1rem;
color: #ffffff;
margin-top: -.6rem;
}
#compare-8 .circle p {
margin-bottom: 0;
}
#compare-8 .price-block {
margin-top: 3.5rem;
margin-left: .5rem;
}
#compare-8 .circle.pink .price-block {
margin-left: 2rem;
margin-top: 2rem;
}
#compare-8 .from {
font-size: 18px;
color: #ffffff;
text-align: center;
}
#compare-8 .from2 {
font-size: 1rem;
color: #ffffff;
text-align: center;
}
#compare-8 .copyright {
font-size: 1rem;
}
#compare-8 .from-price {
font-size: 3.5rem;
line-height: 4rem;
letter-spacing: -3px;
color: #ffffff;
font-weight: bold;
padding-right: .5rem;
}
.bt-nudge {
margin-left: -4rem;
}
#compare-8 .vla-banner {
float: right;
}
#dragon-group .discount-text {
color: #ffffff;
font-size: 1rem;
line-height: 1rem;
letter-spacing: 0;
}
#compare-8 .circle p {
font-size: 1.1rem;
line-height: 1.1rem;
color: #ffffff;
}
@media (max-width: 1200px) {
#compare-8 .circle {
display: none;
}
#compare-8 .price-block {
margin-top: 2.5rem;
margin-left: 1rem;
}
}
@media (max-width: 1050px) {
#compare-8 h2,
#compare-8 p {
margin-right: 0;
}
#compare-8 .left-break {
margin-left: 0;
margin-top: 1.5rem;
}
#compare-8 .banner-button {
margin-top: -2rem;
}
#compare-8 .fixed .td-type {
width: 20rem;
}
}
@media (max-width: 768px) {
#compare-8 .group-icon,
#compare-8 .circle,
#compare-8 .vla-banner {
display: none;
}
#compare-8 p {
margin-right: 0;
padding-right: 0;
}
#compare-8 .button {
margin-top: 0;
}
#compare-8 h2 {
padding-right: 0;
}
#compare-8 .no-pad {
margin-top: 3rem;
}
.bt-nudge {
margin-left: 0;
}
#compare-3 .icon {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
}
/****************************************************************************
* // Compare 5 - Dragon Professional Group
****************************************************************************/
#compare-5 .grey-section {
background-color: #f0f3f4;
padding-top: 6rem;
padding-bottom: 6rem;
}
#compare-5 h2 {
text-align: center;
}
.bullet-fix {
padding-left: 1.5rem;
}
#compare-5 h2 span {
color: #2299a3;
font-weight: bold;
}
#compare-5 h3 {
font-size: 3rem;
line-height: 3.4rem;
font-weight: bold;
letter-spacing: -2px;
color: #26719a;
text-align: center;
margin-top: 6rem;
margin-bottom: 3rem;
}
#compare-5 h5 {
font-weight: bold;
color: #333333;
text-align: center;
margin-bottom: 3rem;
}
#compare-5 p {
color: #6e6e6e;
text-align: center;
margin-bottom: 0;
}
#compare-5 h6 {
font-size: 1.6rem;
line-height: 2.4rem;
color: #666666;
text-align: center;
margin-top: 3rem;
}
/****************************************************************************
* // Speech recognition TY
****************************************************************************/
#feature-ty1 .dl-button-frame {
width: 35rem;
margin: 0 auto;
margin-top: 1.5rem;
}
#legal #banners h3 {
font-size: 3.8rem;
line-height: 4.4rem;
color: #ffffff;
}
#legal #banners p {
font-size: 1.6rem;
line-height: 2.2rem;
color: #ffffff;
}
@media (max-width:1200px) {
#legal #banners h3 {
font-size: 3rem;
line-height: 3.4rem;
}
}
@media (max-width:767px) {
#feature-ty1 .dl-button-frame {
width: 30rem;
margin: 0 auto;
margin-top: 1.5rem;
}
#legal #banners h3 {
font-size: 1.8rem;
line-height: 2.4rem;
}
#legal #banners .carousel,
#legal #banners .carousel .item {
height: 40rem;
}
}
/****************************************************************************
* // Software Upgrades
****************************************************************************/
#software-upgrades .bt-buynow {
padding: .6rem .6rem;
background: #CE4400 ;
color: #ffffff;
border-radius: .3rem;
font-size: 1.4rem;
font-weight: bold;
text-align: center;
width: 11rem;
margin: 0 auto;
display: inline-block;
}
#software-upgrades .home-box-shot {
margin-left: -1rem;
}
#software-upgrades .software-content {
margin-left: -3rem;
padding-top: 4rem;
}
.upgrades-icons img {
margin-bottom: 1.5rem;
margin-top: 1.5rem;
}
@media (min-width:767px) {
#software-upgrades .software-content {
margin-left: 0;
}
}
/****************************************************************************
* // Financial and Legal Pages
****************************************************************************/
#speech-fa #feature-1 {
background: url('../../shared/images/Fin-Banner-01.webp') top center no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
clear: both;
}
#speech-legal #feature-1 {
background: url('../../shared/images/legal-header.webp') top center no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
clear: both;
}
.fa-carousel .carousel {
height: 47rem;
margin-bottom: 0;
}
.fa-carousel .carousel .item {
height: 47rem;
}
.fa-carousel .carousel-caption {
text-align: left;
text-shadow: none;
top: 0;
left: 0;
right: 0;
}
#banners .fa-carousel h3,
#banners .fa-carousel p {
color: #ffffff;
}
.fa-set .callout {
background-color: rgba(255, 255, 255, 0.5);
height: 67.5rem;
min-height: 67.5rem;
width: 100%;
position: relative;
padding: 3.5rem 5rem 5.5rem;
-webkit-box-shadow: 0 1px 9px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0 3px 9px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.fa-set #feature-1 h2:first-of-type {
padding-top: 200px;
}
#fin-contact label {
color: #333;
text-align: left;
margin-left: 4rem;
float: left;
margin-top: -.5rem;
}
#fin-contact input[type="checkbox"] {
float: left;
width: 4rem;
transform: scale(1.2);
margin-left: 1.5rem;
}
.fa-set ul.icon-align li {
margin-top: -2rem;
font-size: 1.4rem;
padding-left: 4rem;
}
@media (max-width: 867px) {
.fa-set .callout {
padding: 1.7rem;
}
}
@media (max-width: 767px) {
#fin-contact {
margin-top: 3rem;
}
.fa-set #feature-1 {
background: #ffffff;
}
.fa-set #feature-1 h2:first-of-type {
padding-top: 3rem;
}
.fa-set #feature-1 .white {
color: #333333;
}
#speech-fa #feature-1,
#speech-legal #feature-1 {
background: none;
}
}
.fa-set input,
.fa-set textarea,
.fa-set select {
width: 100%;
border-radius: 0;
border: 1px solid #bfc9ce;
font-size: 1.4rem;
background-color: #ffffff;
padding: 1.2rem 0 1.2rem 2.4rem;
box-sizing: border-box;
margin-top: .9rem;
color: #666666;
text-align: left;
font-weight: normal;
}
.fa-set .floating-label2 {
position: absolute;
pointer-events: none;
text-align: left;
left: 4.4rem;
top: 2.2rem;
color: #666666;
font-weight: normal;
transition: 0.3s ease all;
font-size: 1.4rem;
}
.fa-set .control1:focus~.floating-label2,
.fa-set .control1:not(:focus):valid~.floating-label2 {
top: 1.1rem;
font-size: .9rem;
opacity: 0.4;
color: #666666;
padding-left: 0;
}
.fa-set select {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.fa-set .select:after {
content: "\f078";
font-family: FontAwesome;
color: #ccc;
padding: 2rem .8rem;
position: absolute;
right: 2rem;
top: 30;
z-index: 1;
text-align: center;
pointer-events: none;
box-sizing: border-box;
font-size: 1.8rem;
}
.fa-set ul.icon-align {
list-style-type: none;
}
.fa-set .icon-align li {
margin-left: -2rem;
margin-top: -2rem;
}
.fa-set .fa-check-circle {
font-size: 1.6rem;
color: #077898;
margin-top: 2rem;
}
.fa-set .button-submit {
padding: 2rem 1rem;
border: none;
background: #a7e127;
cursor: pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
font-size: 2.8rem;
letter-spacing: 0;
color: #333333;
font-weight: bold;
margin-top: 2rem;
width: 100%;
text-align: center;
}
.fa-set .button-submit:hover {
background: #8fc021;
}
.fa-set .download-icon {
margin-top: -.5rem;
}
.fa-set .icones {
margin-bottom: 1.45rem;
}
.fa-set .LV_validation_message {
font-weight: bold;
margin: 0;
}
.fa-set .LV_valid {
color: #00CC00;
}
.fa-set .LV_valid::after,
.fa-set .LV_invalid::after {
top: 2rem;
}
.fa-set p.sub-section {
margin-left: 3rem;
}
.fa-set #feature-4 ul {
list-style-type: "-";
margin-left: 4.5rem;
}
.fa-set #feature-4 li {
padding-left: 1.5rem;
}
.fa-set #feature-4 .sub-image {
margin-left: -3rem;
}
.fa-set .right-border {
border-right: 1px solid #666666;
}
@media (max-width: 1300px) {
.fa-set #feature-4 .sub-image {
margin-top: 11rem;
}
}
@media (max-width: 1100px) {
.fa-set #feature-4 .sub-image {
margin-top: 12rem;
}
.fa-set #feature-4 .v90 {
margin-top: 2rem;
}
.fa-set .grey-expandable {
padding-top: 3rem;
}
}
@media (max-width: 980px) {
.fa-set #feature-4 .sub-image {
margin-bottom: 6rem;
}
.fa-set #feature-4 h5 {
margin-bottom: 6rem;
}
}
@media (max-width: 767px) {
.fa-set p.sub-section {
margin-left: 0;
}
.fa-set #feature-4 ul {
list-style-type: disc;
margin-left: 0;
}
.fa-set #feature-4 ul {
padding-left: 1.5rem;
}
.fa-set #feature-4 li {
padding-left: 0;
}
.fa-set #feature-4 .sub-image {
margin-top: 0;
margin-bottom: 3rem;
}
}
.fa-set #feature-5 {
padding-top: 7rem;
padding-bottom: 7rem;
}
.fa-set #feature-5 h5 {
margin-top: 2rem;
}
@media (max-width: 767px) {
.fa-set #feature-5 {
padding-top: 3rem;
padding-bottom: 3rem;
}
}
.fa-set #feature-1 h1 {
font-size: 2.4rem;
line-height: 2.8rem;
font-weight: bold;
letter-spacing: -0.015rem;
margin-bottom: 0;
}
.fa-set #feature-1 h2 {
font-size: 7.2rem;
font-weight: bold;
line-height: 7.6rem;
letter-spacing: -0.05rem;
margin-top: 0;
margin-bottom: 0;
}
.fa-set #feature-1 h3 {
font-size: 3rem;
line-height: 3.8rem;
letter-spacing: -1px;
font-weight: bold;
margin-top: 6rem;
margin-bottom: 6rem;
}
.fa-set #feature-1 .fa-set h4 {
font-size: 2rem;
line-height: 2.5rem;
letter-spacing: -0.05rem;
margin-top: -.5rem;
}
.fa-set #feature-1 .fa-set h5 {
font-size: 1.8rem;
line-height: 2.4rem;
letter-spacing: -0.5px;
}
.fa-set #feature-1 .fa-set h6 {
font-size: 1.6rem;
line-height: 2.6rem;
margin-top: 0;
}
@media only screen and (max-width : 768px) {
.fa-set #feature-1 .fa-set h1 {
font-size: 1.6rem;
line-height: 2rem;
}
.fa-set #feature-1 .fa-set h2 {
font-size: 3.2rem;
line-height: 3.8rem;
}
.fa-set #feature-4 .col-md-6 {
margin-left: -1rem;
}
}
.fa-set .grey-expandable {
background-color: #f7f9f9;
margin-left: calc(50% - 50vw);
width: 100vw;
padding-top: 12rem;
margin-top: 9rem;
padding-bottom: 0;
}
.fa-set .grey-expandable .row {
margin-left: 0;
}
.fa-set .small-image {
width: 80%;
}
@media (max-width: 767px) {
.fa-set #feature-1 {
margin-bottom: 3rem;
}
.fa-set #feature-1 h1 {
font-size: 1.8rem;
line-height: 2.2rem;
}
.fa-set #feature-1 h2 {
font-size: 3.2rem;
font-weight: bold;
line-height: 3.5rem;
letter-spacing: -0.05rem;
margin-top: 0;
margin-bottom: 0;
}
.fa-set .grey-expandable {
padding-top: 0;
margin-top: 3rem;
padding-bottom: 3rem;
}
.fa-set .container-fluid {
padding-right: 1.5rem;
padding-left: 1rem;
margin-right: auto;
margin-left: -1.5rem;
}
.fa-set .v90 {
margin-top: 3rem;
}
.fa-set #bar {
display: none;
}
}
/****************************************************************************
* // fa Bar Floating
****************************************************************************/
.fa-set .box-buy-now {
display: none;
}
.fa-set .fixed .box-buy-now {
display: inline;
}
.fa-set .fixed .button-submit {
width: 30rem;
float: right;
margin-top: .5rem;
}
.fa-set .buy-now-bar.fixed .box-buy-now h4 {
font-size: 2rem;
line-height: 2.5rem;
letter-spacing: -0.05rem;
margin-top: 0;
margin-bottom: 0;
padding-top: 2.5rem;
}
@media (max-width:667px) {
.fa-set .buy-now-bar.fixed .box-buy-now h4 {
font-size: 1.1rem;
line-height: 1.6rem;
letter-spacing: 0;
padding-top: 2rem;
}
.fa-set .buy-now-bar.fixed .box-buy-now p {
font-size: 1.1rem;
line-height: 1.6rem;
letter-spacing: 0;
}
.fa-set .fixed .button-submit {
padding: 1rem 1rem;
font-size: 1.4rem;
margin-top: 2rem;
width: 16rem;
}
}
@media (max-width:468px) {
.fa-set .fixed .button-submit {
padding: 1rem 1rem;
font-size: 1.2rem;
margin-top: 2.7rem;
width: 14rem;
}
}
#fin-contact label {
color: #333;
text-align: left;
margin-left: 4rem;
float: left;
margin-top: -.5rem;
}
#fin-contact input[type="checkbox"] {
float: left;
width: 4rem;
transform: scale(1.2);
margin-left: 1.5rem;
}
@media (max-width:768px) {
#fin-contact input[type="checkbox"] {
margin-left: 0;
}
}
/****************************************************************************
* // Thankyou feature 1
****************************************************************************/
#feature-ty1 h3 {
margin-top: 0;
margin-bottom: 0;
}
.legty .button-blue {
padding: 2rem 2.5rem;
border: none;
background: #0079c7;
cursor: pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
font-size: 2.8rem;
letter-spacing: 0;
color: #ffffff;
font-weight: bold;
text-align: center;
}
.legty .button-blue:hover {
background: #2851c8;
text-decoration: none;
color: #ffffff;
}
.legty .dl-left {
padding-top: 2rem;
padding-bottom: 2rem;
}
.legty .right-border {
border-right: 1px solid #666666;
}
.legty .dl-button-frame {
margin-top: 2.5rem;
}
@media (max-width:767px) {
.legty .text-center {
text-align: left;
}
}
@media (max-width:468px) {
.legty .button-blue {
padding: 2rem 1.5rem;
font-size: 2.2rem;
}
}
/****************************************************************************
* // Thankyou feature 2
****************************************************************************/
.legty .ebook-img {
margin-left: -1.5rem;
}
.legty .blue-small {
padding: 1.5rem 3rem;
font-size: 2.2rem;
}
@media (max-width:1200px) {
.legty .blue-small {
padding: 1.5rem 2rem;
font-size: 1.8rem;
}
.legty .link-text {
height: 8rem;
min-height: 8rem;
}
}
@media (max-width:1200px) {
.legty .blue-small {
padding: 1.5rem 1rem;
font-size: 1.6rem;
}
.legty .link-text {
height: 9rem;
min-height: 9rem;
margin-top: -4rem;
}
}
@media (max-width:767px) {
.legty .mob-gap {
margin-top: 6rem;
}
.legty .right-border {
border-right: none;
}
}
@media (max-width:468px) {
.legty .blue-small {
padding: 1.5rem 1rem;
font-size: 1.4rem;
}
.legty .link-text {
height: 7rem;
min-height: 7rem;
margin-top: -4rem;
font-size: 1.2rem;
}
}
/*=============================================
= TB Additions =
=============================================*/
/* Center-align grey menu items */
.tb_flex-helper {
display: flex;
flex-direction: row;
justify-content: center;
}
/* Lined button effect*/
.accessories-button {
margin-left: 2rem;
margin-right: 2rem;
}
.lined-button {
padding-top: 2rem;
}
.accessories-button__click {
padding: 8px 20px;
cursor: pointer;
}
.find-out {
margin-bottom: 1rem;
}
.partners-logo {
max-width: 160px;
}
/*============ End TB Additions =============*/
/****************************************************************************
* // Responsive table - Feature Chart - OVERVIEW PAGE
****************************************************************************/
#feature-chart1 {
margin-top: 3rem;
}
#feature-chart1 article {
width: 100%;
margin: 0 auto;
position: relative;
}
#feature-chart1 ul {
display: flex;
top: 0rem;
z-index: 10;
padding-bottom: 1.4rem;
}
#feature-chart1 li {
list-style: none;
flex: 1;
}
#feature-chart1 h4 {
font-size: 3rem;
}
#feature-chart1 .currency-sign,
#feature-chart1 .value,
#feature-chart1 .value-2 {
font-size: 3rem;
color: #333333;
letter-spacing: -0.05rem;
}
#feature-chart1 .value
{
margin-left: -0.5rem;
}
#feature-chart1 li:last-child {
border-right: 1px solid #DDD;
}
#feature-chart1 button {
width: 100%;
border: 1px solid #DDD;
border-right: 0;
border-top: 0;
padding: 1rem;
background: #FFF;
font-size: 1.4rem;
font-weight: bold;
height: 6rem;
color: #999
}
#feature-chart1 li.active button {
background: #f0f5f5;
color: #000;
}
#feature-chart1 table {
border-collapse: collapse;
width: 100%;
}
#feature-chart1 tr {
border-bottom: 1px solid #dddddd;
}
#feature-chart1 tbody tr:first-of-type {
border-top: 1px solid #dddddd;
}
#feature-chart1 tr:last-of-type {
border-bottom: none;
}
#feature-chart1 th {
background: #ffffff;
display: none;
}
#feature-chart1 th:last-of-type,
#feature-chart1 th:nth-last-child(2),
#feature-chart1 td:last-of-type,
#feature-chart1 td:nth-last-child(2) {
background-color: #f0f5f5;
}
#feature-chart1 .white-bg:last-of-type,
#feature-chart1 .white-bg:nth-last-child(2) {
background-color: #ffffff;
}
#feature-chart1 td,
#feature-chart1 th {
vertical-align: middle;
}
#feature-chart1 td:first-of-type {
width: 82%;
background-color: #ffffff;
}
#feature-chart1 .white-bg {
background-color: #ffffff;
}
#feature-chart1 td,
#feature-chart1 th {
padding: 1rem;
padding-left: 0;
empty-cells: show;
}
#feature-chart1 td,
#feature-chart1 th {
text-align: left;
}
#feature-chart1 td+td,
#feature-chart1 th+th {
text-align: center;
display: none;
}
#feature-chart1 td.default {
display: table-cell;
vertical-align: middle;
}
#feature-chart1 .sep {
background: #F5F5F5;
font-weight: bold;
}
#feature-chart1 .txt-l {
font-size: 2.8rem;
font-weight: bold;
}
#feature-chart1 .txt-top {
position: relative;
top: -.9rem;
left: -.2rem;
}
#feature-chart1 .tick {
font-size: 2.2rem;
padding-left: 1rem;
}
#feature-chart1 .hide {
border: 0;
background: none;
}
.fa-check-circle {
color: #1c76a0;
}
.fa-times-circle {
color: #a2a2a2;
}
#feature-chart1 tr:hover,
#feature-chart1 tr:hover td:first-of-type {
background-color: #dee8ee;
}
#feature-chart1 tr:hover td,
#feature-chart1 tr:last-child:hover>td {
background-color: transparent;
}
#feature-chart1 tr.price-row:hover,
#feature-chart1 tr:first-child:hover>th:first-of-type {
background-color: white;
}
#feature-chart1 tr.price-row:hover td:last-child,
#feature-chart1 tr.price-row:hover td:nth-last-child(2) {
background-color: #f0f5f5;
}
#feature-chart1 .da-icon {
display: none;
}
#feature-chart1 a.v-discount {
color: #333333;
text-decoration: underline;
}
#feature-chart1 .button-box {
margin: 0 1rem 2rem 0;
float: left;
width: 12rem;
}
#feature-chart1 .prices,
#feature-chart1 .vat {
text-align: left;
padding-top: 0;
}
#feature-chart1 .from {
padding-bottom: 0;
margin-bottom: 0;
}
p.icon-float {
font-size: 1.6rem;
}
.bg-purple,
.bg-blue {
border-top: 1px solid #ddd;
}
#feature-chart1 .currency-sign {
margin-right: -5px;
}
@media (min-width: 640px) {
#feature-chart1 ul {
display: none;
}
#feature-chart1 .white-bg:last-of-type,
#feature-chart1 .white-bg:nth-last-child(2),
#feature-chart1 .white-bg {
background-color: #f0f5f5;
}
#feature-chart1 h4 {
font-size: 2.6rem;
padding-bottom: .5rem;
}
#feature-chart1 .currency-sign,
#feature-chart1 .value,
#feature-chart1 .value-2 {
font-size: 2.6rem;
padding-bottom: .5rem;
}
#feature-chart1 table {
border-collapse: collapse;
table-layout: fixed;
width: 100%;
}
#feature-chart1 td,
#feature-chart1 th {
display: table-cell !important;
}
#feature-chart1 td,
#feature-chart1 th {
width: 59%;
}
#feature-chart1 td,
#feature-chart1 th {
padding: 2rem .5rem;
empty-cells: show;
}
#feature-chart1 td+td,
#feature-chart1 th+th {
width: auto;
}
#feature-chart1 .prices,
#feature-chart1 .vat {
text-align: center;
padding-top: .5rem;
}
#feature-chart1 th {
padding-top: 4.5rem;
padding-bottom: 4.5rem;
}
#feature-chart1 .da-icon {
display: inline;
height: 2rem;
width: 2rem;
margin-right: .8rem;
float: left;
}
#feature-chart1 .button-box {
margin: .5rem 1.5rem .5rem;
float: left;
width: 12rem;
}
#feature-chart1 .prices,
#feature-chart1 .vat {
text-align: center;
}
#feature-chart1 .vat {
margin-top: -0.5rem;
}
#feature-chart1 .tick {
padding-left: 0;
}
.fa-check-circle {
color: #1c76a0;
font-size: 2.6rem;
}
.fa-times-circle {
color: #a2a2a2;
font-size: 2.6rem;
}
.bg-purple,
.bg-blue {
border-top: none;
}
#feature-chart .bg-purple,
#feature-chart .bg-blue {
border-top: 1px solid #dddddd;
}
#feature-chart1 .vat {
padding-top: 0;
}
#feature-chart1 th p.tiny-text {
font-size: 1.1rem;
line-height: 1.4rem;
}
.tiny-discount {
margin-top: -2.4rem;
}
}
@media (min-width: 1024px) and (max-width: 1100px) {
.tiny-discount {
margin-top: -1rem;
}
.disc-adj {
margin-top: 5rem;
}
}
@media (min-width: 990px) {
#feature-chart1 .button-box {
width: 16rem;
}
}
@media (min-width: 1100px) {
#feature-chart1 td,
#feature-chart1 th {
width: 69%;
}
#feature-chart1 .button-box {
margin: .5rem 1.5rem .5rem;
float: left;
width: 11rem;
}
}
@media (min-width: 1200px) {
#feature-chart1 th p {
font-size: 1.8rem;
}
#feature-chart1 .button-box {
margin: .5rem 1.5rem .5rem;
float: left;
width: 13rem;
}
#feature-chart .bg-purple,
#feature-chart .bg-blue {
border-top: none;
}
}
.cell-p1 {
font-size: 1.6rem;
line-height: 2.2rem;
margin-bottom: 0 !important;
letter-spacing: 0;
font-weight: normal;
margin-bottom: 0;
}
.feature-gap1 {
padding-right: .5rem;
}
.feature-image1 {
padding-left: 4rem;
padding-right: 4rem;
height: 12rem
}
#feature-chart1 th p.tiny-text {
font-size: 1.1rem;
line-height: 1.4rem;
}
#feature-chart1 .best {
margin-top: -2.5rem;
margin-bottom: 1.5rem;
color: orange;
text-decoration: underline;
font-size: 1.1rem;
line-height: 1.4rem;
}
#feature-chart1 .green-text {
font-size: 12px;
color: #19b811;
font-weight: normal;
line-height: 14px;
margin-bottom: 0;
margin-top: 3.5rem;
}
/****************************************************************************
* // Top Elements - Currency selector and icons.
****************************************************************************/
.top-elements .currency {
display: block;
}
.top-elements .currency .select2-container {
height: 100%;
width: auto !important;
}
.top-elements .currency .select2-container .selection {
height: 100%;
display: block;
}
.top-elements .currency .select2-container .selection .custom-container {
height: 100%;
display: flex;
align-items: center;
}
.top-elements .select2-container .select2-selection--single .select2-selection__rendered {
padding: 0;
margin-right: 10px;
}
.top-elements .currency .select2-container .selection .custom-container .select2-selection__arrow {
padding: 0;
height: auto;
width: auto;
position: inherit;
top: inherit;
right: inherit;
}
.custom-dropdown {
top: 0px;
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
#purchase-block .select2-container .select2-selection--single .select2-selection__rendered {
display: inline-block;
height: 34px;
}
/* Promo Signup Widget ARIA amends JR 24-02-22 */
.promo-signup-widget {
display: none;
}
.promo-signup-widget.open {
display: block;
}
.promo-form-checkbox {
outline: none;
}
/* One Trust Cookies Settings button (css loaded remotely) */
#ot-sdk-btn.nuance-btn.ot-sdk-show-settings:focus {
border: 1px solid #000;
}
#js-price-text {
color: #CE4400;
font-size: 16px;
}
.d-inline-block {
display: inline-block;
}
/* From healthcare-03.css */
#healthcare #home-banner {
top: 0;
background: url('../../shared/images/healthcare.webp') center center no-repeat;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
background-size: cover;
padding: 6rem 0 8rem;
}
#healthcare #home-banner .banner-primary {
font-size: 4.63rem;
line-height: 5.0rem;
letter-spacing: -.25rem;
font-weight: bold;
}
#healthcare #home-banner .banner-secondary {
font-size: 3rem;
line-height: 3.4rem;
font-weight: bold;
padding-bottom: 7rem;
}
@media only screen and (max-width: 991px) {
#home-banner {
background: linear-gradient(to right, #0073EA 20%,#141380 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0073EA', endColorstr='#141380',GradientType=1 );
}
}
@media only screen and (max-width: 767px) {
#home-banner {
padding: 7rem 0rem 5rem 0rem;
}
}
@media only screen and (min-width: 768px) {
@keyframes moveInLeft {
0% {opacity: 0;transform: translateX(-10rem); }
80% {transform: translateX(1rem); }
100% {opacity: 1;transform: translate(0); }
}
@keyframes moveInRight {
0% {opacity: 0;transform: translateX(10rem); }
80% {transform: translateX(-1rem); }
100% {opacity: 1;transform: translate(0); }
}
#healthcare #home-banner {
background-position: right;
padding: 11.5rem 0 7.5rem;
}
#healthcare #home-banner .banner-primary {
font-size: 6.75rem;
line-height: 6.8rem;
-webkit-animation-name: moveInLeft;
animation-name: moveInLeft;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
#healthcare #home-banner .banner-secondary {
font-size: 4rem;
line-height: 4.4rem;
-webkit-animation: moveInRight 1s ease-out;
animation: moveInRight 1s ease-out;
}
@-webkit-keyframes moveInBottom {
0% {opacity:0;-webkit-transform:translateY(3rem);transform:translateY(3rem)
}
100% {opacity:1;-webkit-transform:translate(0);transform:translate(0)
}
}
}
@media only screen and (max-width: 767px) {
#healthcare #home-banner .banner-primary {
line-height: 5rem;
}
}
/****************************************************************************
* // Price match / Promo bar
****************************************************************************/
.price-match-bar, .price-match-bar-mob {
padding: 12px 0;
background-color: #CE4400;
}
@media screen and (max-width:990px) {
.price-match-bar {
display: none;
}
}
.promo-msg-wrapper {
display: flex; justify-content: center; align-items: center; flex-wrap: wrap;
gap: 8px;
}
@media screen and (max-width:990px) {
.promo-msg-wrapper {
justify-content: flex-start;
flex-direction: row;
}
.promo-msg-wrapper p {
text-align: left !important;
}
}
.price-match-bar-mob {
display: none;
}
@media screen and (max-width:990px) {
.price-match-bar-mob {
display: block;
}
.promo-msg-wrapper p {
font-size: 14px;
}
}
.promo-msg-wrapper p {
color: white;
}
/* * legal */
#dragon-legal .wanner {
background-image: url("../../shared/images/legal-banner-03.webp");
background-position: 70% center;
background-size: cover;
background-repeat: no-repeat;
}
#dragon-legal .circle-offer1 {
font-size: 1.15rem !important;
}
#dragon-legal .circle-offer2 {
font-size: 1.15rem !important;
}
#dragon-legal .box-img table.promo-frame {
margin-top: 2rem !important;
margin-left: 1.7rem;
}
@media only screen and (min-width: 1200px) {
.top-elements .side-nav>div.li>.side-nav_support {
padding: 21px 15px 21px !important;
}
}
/* * Anywhere */
#dragon-anywhere .hide-promo-bar {
display: none;
}
/* * BT headset */
#bluetooth-headset .out-stock {
background-color: #999999;
font-size: 1.4rem;
padding: 1.8rem 2.8rem;
margin-top: 1rem;
width: 100%;
margin-bottom: .7rem;
}
/* * professional */
#dragon-professional .circle-offer1 {
font-size: 1.15rem !important;
}
#dragon-professional .circle-offer2 {
font-size: 1.15rem !important;
}
#dragon-professional .box-img table.promo-frame {
margin-top: 2rem !important;
margin-left: 1.7rem;
}
@media (min-width: 1200px) {
#dragon-professional .box-img {
width: 22%;
}
}
/* * dragon home */
#dragon-home .circle-offer1 {
font-size: 1.15rem !important;
}
#dragon-home .circle-offer2 {
font-size: 1.15rem !important;
}
#dragon-home .box-img table.promo-frame {
margin-top: 2rem !important;
margin-left: 1.7rem;
}
/* * dragon group */
#dragon-group .sm-flex-helper {
display: flex;
flex-direction: row;
justify-content: center;
width: 100%;
}
/* JR new 10-01-23 */
.sr-only {
border: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.sr-only-focusable:active, .sr-only-focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: relative;
width: auto;
background-color: white;
z-index: 10000;
}
.nav-fix {
display: block;
}
/* The following can be used as simple alternative to js animation, to show/hide dropdown menus on hover */
/*
.dropdown:hover .dropdown-menu {
display: block;
}
*/
/* Make link text focus state visible */
#onetrust-policy-text a:hover, #onetrust-policy-text a:focus {
outline: 2px solid #000;
outline-offset: 1px;
}
.top-elements .side-nav>div.li {
margin-right: 12px;
}
.top-elements .side-nav div.li.dropdown-support-option {
margin-right: 24px;
}
/* END JR new 10-01-23 */
/* Fix position of dropdown in currency dropdown */
li.li-currency {
display: flex;
height: 100%;
}
li.li-currency .select2-dropdown--below {
top: 2.5rem;
}
/* Additional class for a currency dropdown with a single currency, as it can no longer be a <select> */
.li-currency.single-currency {
align-items: center;
}
.li-currency.single-currency label.currency, .li-currency.single-currency span.currency {
white-space: nowrap;
font-weight: 600;
font-size: 14px;
}
.li-currency.single-currency label span.select2 {
display: none;
}
/* joe added for email widget */
.open-widget {
display:block;
}
/* JR 16-01-23 */
button.side-nav_support {
background-color: transparent;
border: none;
line-height: 1;
}
button.side-nav_support:focus {
outline: none;
}
button.side-nav_support:hover img {
opacity: 0.65;
}
.top-elements .select2-container--default .select2-selection--single {
background-color: transparent;
}
/* END JR 16-01-23 */
/* Make modal dialogue close button higher contrast */
.lity-close, .lity-close:hover, .lity-close:active, .lity-close:visited, .lity-close:focus {
color: #000;
text-shadow: none;
background-color: white;
}
#references h2 {
font-size: 46px;
font-weight: 300;
line-height: 110%;
letter-spacing: -1px;
color: #ffffff;
margin-top: 20px;
}
@media (max-width: 767px) {
#references h2 {
font-size: 36px;
}
}
.sup-text {
position: relative;
}
.sup-text:after {
display: block;
position: absolute;
content: "NEW";
color: #38a05c;
left: 100%;
top: 0px;
margin-left: 5px;
font-size: 12px;
}
.sup-text:after:focus {
text-decoration: none;
}
.home-h1 {
font-weight: 300;
font-size: 4.25rem;
line-height: 108%;
color: white;
margin-bottom: 1.5rem;
}
.home-h1-quotation {
font-size: 2rem;
letter-spacing: -0.5px;
margin-bottom: 0;
font-weight: 300;
color: white;
}
.home-h1-attribution {
font-size: 1.25rem;
font-weight: 600;
color: white;
}
@media only screen and (max-width: 1199px) {
.hide-below-1200 {
display: none;
}
}
/* promo-signup-widget */
.promo-signup-widget-wrapper {
position: absolute;
left: 0;
top: 0;
z-index: 10000;
}
.promo-signup-widget {
background-color: #fff;
position: absolute;
width: 325px;
top: 0;
box-shadow: 0 1px 5px #b7b7b7;
border: 1px solid #0278c6;
height: px;
left: -325px;
transition: 0.15s ease-in-out;
}
.promo-signup-widget.open {
left: 0;
transition: 0.2s ease-in-out;
}
.open-widget {
width: 0;
height: 0;
border-bottom: 60px solid transparent;
border-left: 60px solid #0078c6;
position: relative;
z-index: 10000;
}
.promo-signup-widget__header {
text-align: center;
padding: 0 36px;
margin-top: 35px;
font-weight: 700;
font-size: 16px;
}
.promo-signup-widget__form {
padding: 0;
}
.promo-form-input {
padding: 7px 15px;
background: #ffffff;
font-size: 14px;
margin: 8px 0 12px 0;
border: 1px solid #003693;
height: 42px;
}
.promo-form-checkbox-label {
margin: 0 0 20px 10px;
}
.promo-form-thankyou {
display: none;
text-align: left;
color: white;
}
.promo-form-thankyou--show {
display: block;
}
.promo-form-submit {
padding: 10px 26px;
background: #ffffff;
font-size: 18px;
font-weight: 400;
color: #285ce6;
text-align: center;
display: inline-block;
margin: 12px 0 40px 0;
border-radius: 3px;
border: 0;
}
.open-widget-icon {
position: absolute;
left: -46px;
top: 10px;
color: #fff;
}
.open-widget-open-icon {
width: 18px;
margin-left: -3px;
}
@media only screen and (max-width : 768px) {
.promo-signup-widget-wrapper {
display: none;
}
}
.no-padding {
padding: 0 !important;
}
.temp-point-item {
display: flex;
align-items: center;
padding: 10px 0;
}
.visually-hidden {
border-width: 0 !important;
clip: rect(1px, 1px, 1px, 1px) !important;
height: 1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
/* DMO Stuff, JR, started 27-03-2023 */
/* Utilities */
.text-white {color: white;}
.text-primary {color: #141380;}
.w-100 {width: 100%;}
.h-100 {height: 100%;}
.position-relative {position: relative !important;}
.position-absolute {position: absolute !important;}
.position-fixed {position: fixed !important;}
.position-static {position: static !important;}
.invisible {
visibility: hidden;
}
.mt-0 {margin-top: 0 !important;}
.mt-1 {margin-top: 1rem !important;}
.mt-2 {margin-top: 2rem !important;}
.mt-3 {margin-top: 3rem !important;}
.mt-4 {margin-top: 4rem !important;}
.mt-5 {margin-top: 5rem !important;}
.mt-6 {margin-top: 6rem !important;}
.mt-8 {margin-top: 8rem !important;}
.mt-10 {margin-top: 10rem !important;}
.mr-0 {margin-right: 0 !important;}
.mr-1 {margin-right: 1rem !important;}
.mr-2 {margin-right: 2rem !important;}
.mr-3 {margin-right: 3rem !important;}
.mr-4 {margin-right: 4rem !important;}
.mr-5 {margin-right: 5rem !important;}
.mr-6 {margin-right: 6rem !important;}
.mr-8 {margin-right: 8rem !important;}
.mr-10 {margin-right: 10rem !important;}
.mb-0 {margin-bottom: 0 !important;}
.mb-1 {margin-bottom: 1rem !important;}
.mb-2 {margin-bottom: 2rem !important;}
.mb-3 {margin-bottom: 3rem !important;}
.mb-4 {margin-bottom: 4rem !important;}
.mb-5 {margin-bottom: 5rem !important;}
.mb-6 {margin-bottom: 6rem !important;}
.mb-8 {margin-bottom: 8rem !important;}
.mb-10 {margin-bottom: 10rem !important;}
.ml-0 {margin-left: 0 !important;}
.ml-1 {margin-left: 1rem !important;}
.ml-2 {margin-left: 2rem !important;}
.ml-3 {margin-left: 3rem !important;}
.ml-4 {margin-left: 4rem !important;}
.ml-5 {margin-left: 5rem !important;}
.ml-6 {margin-left: 6rem !important;}
.ml-8 {margin-left: 8rem !important;}
.ml-10 {margin-left: 10rem !important;}
.pt-0 {padding-top: 0 !important;}
.pt-1 {padding-top: 1rem !important;}
.pt-2 {padding-top: 2rem !important;}
.pt-3 {padding-top: 3rem !important;}
.pt-4 {padding-top: 4rem !important;}
.pt-5 {padding-top: 5rem !important;}
.pt-6 {padding-top: 6rem !important;}
.pt-8 {padding-top: 8rem !important;}
.pt-10 {padding-top: 10rem !important;}
.pr-0 {padding-right: 0 !important;}
.pr-1 {padding-right: 1rem !important;}
.pr-2 {padding-right: 2rem !important;}
.pr-3 {padding-right: 3rem !important;}
.pr-4 {padding-right: 4rem !important;}
.pr-5 {padding-right: 5rem !important;}
.pr-6 {padding-right: 6rem !important;}
.pr-8 {padding-right: 8rem !important;}
.pr-10 {padding-right: 10rem !important;}
.pb-0 {padding-bottom: 0 !important;}
.pb-1 {padding-bottom: 1rem !important;}
.pb-2 {padding-bottom: 2rem !important;}
.pb-3 {padding-bottom: 3rem !important;}
.pb-4 {padding-bottom: 4rem !important;}
.pb-5 {padding-bottom: 5rem !important;}
.pb-6 {padding-bottom: 6rem !important;}
.pb-8 {padding-bottom: 8rem !important;}
.pb-10 {padding-bottom: 10rem !important;}
.pl-0 {padding-left: 0 !important;}
.pl-1 {padding-left: 1rem !important;}
.pl-2 {padding-left: 2rem !important;}
.pl-3 {padding-left: 3rem !important;}
.pl-4 {padding-left: 4rem !important;}
.pl-5 {padding-left: 5rem !important;}
.pl-6 {padding-left: 6rem !important;}
.pl-8 {padding-left: 8rem !important;}
.pl-10 {padding-left: 10rem !important;}
/* hidden on md-down */
@media only screen and (max-width : 991px) {
.hidden-md-down {
display: none !important;
}
}
/* hidden on sm-down */
@media only screen and (max-width: 767px) {
.hidden-sm-down {
display: none !important;
}
}
/* margin-top on md and down */
@media only screen and (max-width : 991px) {
.mt-2-md-down {
margin-top: 2rem;
}
}
/* margin-bot on md and down */
@media only screen and (max-width : 991px) {
.mb-2-md-down {
margin-bottom: 2rem;
}
}
.my-0 {margin-top: 0 !important; margin-bottom: 0 !important;}
.my-2 {margin-top: 2rem !important; margin-bottom: 2rem !important;}
.my-3 {margin-top: 3rem !important; margin-bottom: 3rem !important;}
.my-4 {margin-top: 4rem !important; margin-bottom: 4rem !important;}
.my-6 {margin-top: 6rem !important; margin-bottom: 6rem !important;}
.my-8 {margin-top: 8rem !important; margin-bottom: 8rem !important;}
.my-10 {margin-top: 10rem !important; margin-bottom: 10rem !important;}
.mx-neg-15 {margin-left: -15px !important; margin-right: -15px !important;}
.py-0 {padding-top: 0 !important; padding-bottom: 0 !important;}
.py-2 {padding-top: 2rem !important; padding-bottom: 2rem !important;}
.py-3 {padding-top: 3rem !important; padding-bottom: 3rem !important;}
.py-4 {padding-top: 4rem !important; padding-bottom: 4rem !important;}
.py-6 {padding-top: 6rem !important; padding-bottom: 6rem !important;}
.py-8 {padding-top: 8rem !important; padding-bottom: 8rem !important;}
.py-10 {padding-top: 10rem !important; padding-bottom: 10rem !important;}
/* Flexbox responsive utilities */
@media (min-width: 1200px) {
.justify-content-lg-end {
-ms-flex-pack: end !important;
justify-content: flex-end !important;
}
}
.fw-300 {
font-weight: 300;
}
.fw-400 {
font-weight: 400;
}
.fw-600 {
font-weight: 600;
}
.fw-700 {
font-weight: 700;
}
.btn-filled {
background: white;
border: 2px solid white;
border-radius: 4px;
padding: 8px 12px;
color: #3460de;
transition: background-color 0.5s ease;
}
.btn-filled:active, .btn-filled:hover {
background-color: #3460de;
color: white;
}
.btn-taller {
padding: 1.8rem 2.8rem;
font-size: 2rem;
}
.btn-shorter {
padding: 9px 26px;
}
.btn-wider {
padding: 6px 22px;
text-decoration: none !important;
}
.btn-extra-wide {
padding: 6px 32px;
font-size: 18px;
}
.h3-black-semi {
font-size: 20px;
font-weight: 600;
}
/* END Utilities */
/* DMO (Product page) */
.dmo-boxshot, .includes-pm-img {
margin-bottom: 20px;
}
@media only screen and (min-width : 1200px) {
.dmo-boxshot {
max-width: 86%;
}
}
@media only screen and (max-width : 767px) {
.dmo-boxshot {
max-width:240px;
}
}
/* 'Includes PowerMic' img */
@media only screen and (min-width : 1200px) {
.includes-pm-img {
max-width: 76%;
}
}
@media only screen and (max-width : 767px) {
.includes-pm-img {
max-width:240px;
}
}
p.intro {
font-size: 20px;
}
ul.dmo-list {
margin: 0;
padding: 0;
list-style-type: none;
}
ul.dmo-list li {
padding: 0 0 0 30px;
background: url(../../shared/images/dmo-li-tick.webp) left 6px no-repeat;
background-size: 20px 15px;
margin-bottom: 15px;
}
/* payment block grey wrapper */
.dmo-payment-block {
background-color: #fafafa;
border: 1px solid #c1c1c1;
padding: 40px 25px;
margin-bottom: 40px;
}
.dmo-payment-pref {
background-color: white;
padding: 10px;
margin-bottom: 30px;
}
.dmo-payment-pref > span {
display: inline-block;
font-weight: 700;
margin-right: 50px;
}
@media only screen and (max-width : 767px) {
.dmo-payment-pref > span {
display: block;
margin-bottom: 8px;
width: 100%;
}
}
/* Why buy direct block white wrapper */
.dmo-why-block {
background-color: #fff;
border: 1px solid #c1c1c1;
padding: 40px 40px;
margin-bottom: 50px;
}
@media only screen and (max-width : 991px) {
.dmo-why-block p {
font-size: 16px;
}
.dmo-why-block svg {
max-width: 48px;
height: auto;
}
}
@media only screen and (max-width : 480px) {
.dmo-why-block svg {
max-width: 40px;
}
}
/* DMO form stuff */
@media only screen and (max-width : 640px) {
.dmo-term-selectors {
flex-wrap: wrap;
}
}
.dmo-payment-block input[type="radio"] {
float: none;
width: auto;
transform: none;
margin: 0 12px 0 0;
position: relative;
top: 2px;
}
.term-label {
display: block;
padding: 2em;
background-color: #f7f7f7;
border: 2px solid #a1a1a1;
text-align: center;
width: 33.333%;
cursor: pointer;
}
.term-label:nth-of-type(1), .term-label:nth-of-type(2) {
margin-right: 2%;
}
@media only screen and (max-width : 640px) {
.term-label { width: 100%; }
.term-label:nth-of-type(1), .term-label:nth-of-type(2) {
margin-right: 0;
margin-bottom: 2%;
}
}
input[name="term-options"]:checked + label {
background-color: white;
border-color: #CE4400 ;
}
input[name="term-options"]:focus + label {
outline: 2px solid #000;
outline-offset: 2px;
}
.term-label span {
display: block;
}
.term-price {
font-size: 40px;
line-height: 48px;
font-weight: 600;
}
@media only screen and (max-width : 767px) {
.term-price {
font-size: 32px;
line-height: 32px;
}
}
input[name="term-options"]:checked + label .term-price {
color: #CE4400;
}
.dmo-breakdown-block {
padding-bottom: 20px;
border-bottom: 1px solid #d6d6d6;
}
@media only screen and (max-width : 1199px) {
.dmo-breakdown-block {
margin-top: 2rem;
}
}
.dmo-breakdown-block > span {
display: inline-block;
font-weight: 700;
margin-bottom: 20px;
}
.dmo-breakdown-block table {
border: 0;
width: 100%;
}
.dmo-breakdown-block table tr td:first-child {
padding-right: 20px;
}
.dmo-total-block .bt-buynow {
margin: 0;
font-size: 18px;
}
@media only screen and (max-width : 450px) {
.dmo-total-block .td-button, .dmo-total-block .td-sales {
margin-top: 1rem;
}
}
.dmo-total-text {
display: block;
font-weight: 700;
}
@media only screen and (max-width : 1199px) {
.dmo-total-text {
margin-top: 2rem;
}
}
.mb-2px {
margin-bottom: 2px;
}
.dmo-total-price {
display: block;
font-weight: 600;
font-size: 40px;
line-height: 40px;
color: #CE4400 ;
margin-bottom: 10px;
}
.input-counter {
margin-right: 32px;
border-radius: 3px;
border: 1px solid #333;
background-color: #ffffff;
width: fit-content;
}
.input-counter__input {
margin: 0;
width: 40px;
color: #333;
text-align: center;
padding: 8px 10px;
border-top: 0;
border-bottom: 0;
border-radius: 0;
background-color: transparent;
}
.input-counter__plus, .input-counter__minus {
display: inline-block;
width: 40px;
text-align: center;
padding: 8px 10px;
font-size: 20px;
line-height: 20px;
cursor: pointer;
border: none;
background: none;
}
.input-counter__plus:hover, .input-counter__minus:hover {
background-color: #fff;
}
.full-size-bg {
width: 100%;
background-size: cover;
background-repeat: no-repeat;
padding: 10rem 0;
}
.full-size-bg.dmo-bg {
background-image: url('../../shared/images/dmo-full-width-bg2.webp');
background-position: left bottom;
}
.full-size-bg.mobility-bg {
background-image: url('../../shared/images/mobility-full-width-bg3.webp');
background-position: right bottom;
}
.full-size-bg.powermic-bg {
background-image: url('../../shared/images/mast-bg-hc-speech-recognition-powermicIV-v6.webp');
background-position: right bottom;
}
.full-size-bg.powermic2-bg {
background-image: url('../../shared/images/mast-bg-pc-dragon-legal-anywhere-powermic.webp');
background-position: right bottom;
}
.full-size-bg.btheadset-bg {
background-image: url('../../shared/images/bg-ent-professional-services-plan.webp');
background-position: 50% bottom;
}
.full-size-bg.cis-bg {
background-image: url('../../shared/images/cis-full-width-bg.webp');
background-position: center center;
}
.full-size-bg.healthcare-home-bg {
background-image: url('../../shared/images/healthcare-home-bg.webp');
background-position: right center;
}
.full-size-bg.benefits-home-bg {
background-image: url('../../shared/images/mast-bg-drg-dragon-professional-anywhere-int.webp');
background-position: right center;
}
.full-size-bg.dragonpro-bg {
background-image: url('../../shared/images/dragon-v16-dmo1.webp');
background-position: 60% center;
}
.full-size-bg.legal-bg {
background-image: url('../../shared/images/legal-v16-dmo1.webp');
background-position: 75% center;
}
.full-size-bg.about-nuance-bg {
background-image: url('../../shared/images/about-nuance-bg.webp');
background-position: left bottom;
}
.full-size-bg.da-training-bg {
background-image: url('../../shared/images/da-training-bg.webp');
background-position: right center;
}
/* DMO background image overrides */
@media only screen and (max-width : 1199px) {
.full-size-bg.dmo-bg {
background-position: 20% bottom;
}
.full-size-bg.mobility-bg {
background-position: 60% bottom;
}
}
@media only screen and (max-width : 991px) {
.full-size-bg.dmo-bg, .full-size-bg.mobility-bg, .full-size-bg.healthcare-home-bg, .full-size-bg.powermic-bg, .full-size-bg.powermic2-bg, .full-size-bg.btheadset-bg, .full-size-bg.benefits-home-bg, .full-size-bg.da-training-bg, .full-size-bg.dragonpro-bg, .full-size-bg.legal-bg, #dragon-legal .wanner {
background-image: none;
background-color: #f2f5f5;
}
.full-size-bg.dmo-bg {
background-color: #f2f5f5;
}
.full-size-bg.mobility-bg {
background-color: #ffffff;
}
#da-access1 {
background-image: none !important;
background-color: #333 !important;
}
}
@media only screen and (max-width : 768px) {
.full-size-bg.cis-bg {
background-image: none;
background-color: #383c3d;
}
}
#by-the-numbers {
padding: 60px 0;
}
#by-the-numbers .figure {
display: block;
text-align: center;
color: white;
font-size: 80px;
font-weight: 300;
line-height: 80px;
margin-bottom: 1rem;
}
#by-the-numbers .figure sup {
vertical-align: -3px;
font-size: 60%;
}
#by-the-numbers .byline {
display: block;
text-align: center;
color: white;
font-size: 18px;
font-weight: 600;
margin-bottom: 2rem;
}
#by-the-numbers small {
font-size: 30px;
display: inline-block;
padding: 0 0 0 6px;
}
.by-the-num-pad {
padding: 0 10%;
margin-bottom: 40px;
}
.quotation {
padding: 2rem 0;
}
.quotation h2 {
color: white;
margin-bottom: 2rem;
}
.quotation-text {
font-size: 2.6rem;
line-height: 3rem;
letter-spacing: -0.05rem;
color: white;
margin-bottom: 2rem;
}
.quotation-source {
color: white;
}
.dmo-block-hr {
margin: 48px 0 45px 0;
border-bottom: 1px solid #d6d6d6;
}
.klas-img {
padding: 0 40px;
}
@media only screen and (max-width :768px) {
.klas-img {
max-width: 75%;
margin-bottom: 2rem;
}
}
.inner-white {
background-color: #fff;
padding: 30px 20px;
height: 100%;
}
.cis-header{display: block;font-size: 22px;font-weight: 600;margin-bottom: 16px; line-height: 130%;}
.cis-ul {
list-style-type: none;
}
.cis-ul li {padding-left: 20px;margin-bottom: 15px;}
.cis-ul li:last-of-type {margin-bottom: 0;}
.cis-ul li:before {
content: '\2013';
position: absolute;
margin-left: -20px;
}
.mobility-byline {
display: block;
font-size: 14px;
margin-bottom: 20px;
}
/* New style sticky bar */
.buy-now-reminder {
display: none;
position: fixed;
z-index: 100;
width: 100%;
background-color: #fff;
left: 0;
top: 0;
right: 0;
padding: 20px;
border-bottom: 1px solid #f2f2f2;
box-shadow: 1px 2px 9px -2px rgba(0,0,0,0.75);
-webkit-box-shadow: 1px 2px 9px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 9px -2px rgba(0,0,0,0.75);
}
.buy-now-reminder.fixed {
display: flex;
}
@media only screen and (max-width :990px) {
.buy-now-reminder {
display: none;
}
}
.buy-now-reminder .product-title {
font-weight: 600;
}
/* DMO updates 10th October 2023 */
@media only screen and (max-width :990px) {
.in-page-nav-block {
padding: 20px 0;
}
}
@media only screen and (min-width :991px) {
.in-page-nav-block {
border-bottom: 1px solid #e4e4e4;
padding-top: 20px;
}
}
.in-page-nav-list li {
margin-right: 3rem;
margin-bottom: 20px;
width: max-content;
}
@media only screen and (max-width :990px) {
.in-page-nav-list li {
width: 50%;
margin-right: 0;
}
.in-page-nav-list li:last-of-type {
margin-bottom: 0;
}
}
.buy-now-reminder .in-page-nav-list li {
margin-right: 3rem;
}
.buy-now-reminder .in-page-nav-list li {
margin-bottom: 0;
}
@media only screen and (max-width :1199px) {
.buy-now-reminder .in-page-nav-list li:nth-child(n+6) {
margin-top: 2rem;
}
}
.in-page-nav-list li a {
font-size: 1.8rem;
text-decoration: underline;
}
.modal-video-thumb {
cursor: pointer;
}
.modal-video-btn {
position: absolute;
width: 60px;
height: 60px;
background-color: rgba(40, 92, 230, 0.65);
border-radius: 50%;
border: none;
cursor: pointer;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.modal-video-btn span {
font-size: 30px;
color: white;
display: inline-block;
position: relative;
left: 53%;
top: 50%;
transform: translate(-50%,-50%);
}
/* END DMO (Product page) */
/* Healthcare Home */
/* Splash page */
.light-blue-purple-gradient {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0081d5+0,a034d5+65 */
background: #0081d5; /* Old browsers */
background: -moz-linear-gradient(left, #0081d5 0%, #a034d5 65%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #0081d5 0%,#a034d5 65%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #0081d5 0%,#a034d5 65%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
h1.splash {
font-size: 46px;
font-weight: 300;
line-height: 100%;
letter-spacing: -1px;
color: #141380;
margin: 0;
padding: 5.5rem 0 0 0;
margin-bottom: 2rem;
}
.splash-col-left, .splash-col-right {
min-height: 400px;
background-position: center center;
background-size: cover;
transition: all .25s;
}
.splash-col-left {
background-image: url('../../shared/images/splash-col-left-bg.webp');
}
.splash-col-left.splash-col-left--support {
background-image: url('../../shared/images/support-splash-col-left-bg.webp');
}
.splash-col-left.splash-col-left--contact {
background-image: url('../../shared/images/contact-splash-col-left-bg.webp');
}
.splash-col-right {
background-image: url('../../shared/images/splash-col-right-bg.webp');
margin-bottom: 10rem;
}
.splash-col-right.splash-col-right--support {
background-image: url('../../shared/images/support-splash-col-right-bg.webp');
}
.splash-col-right.splash-col-right--contact {
background-image: url('../../shared/images/contact-splash-col-right-bg.webp');
}
.splash-col-left:hover, .splash-col-left:focus, .splash-col-right:hover, .splash-col-right:focus {
transform: scale(105%);
}
/* Removes animation for accessibility */
@media (prefers-reduced-motion) {
a:hover .splash-col-left, a:focus .splash-col-left, a:hover .splash-col-right, a:focus .splash-col-right {
transform: none;
}
}
.splash-col-inner {
text-align: center;
width: auto;
margin: 0 auto;
}
.splash-col-inner--support, .splash-col-inner--contact {
padding: 0 2rem;
}
@media only screen and (min-width : 992px) {
.splash-col-inner {
width: 100%;
margin: 0;
}
}
a.splash-col-link {
text-decoration: none !important;
}
h2.splash-option {
font-size: 40px;
line-height: 44px;
}
h2.splash-option--support, h2.splash-option--contact {
font-size: 36px;
padding: 0;
}
h2.splash-option--support a:hover, h2.splash-option--support a:focus, h2.splash-option--contact a:hover, h2.splash-option--contact a:focus {
color: white;
}
@media only screen and (max-width : 991px) {
h2.splash-option {
text-align: center;
}
}
@media only screen and (max-width : 767px) {
h2.splash-option {
font-size: 32px;
}
}
@media only screen and (max-width : 560px) {
h2.splash-option {
font-size: 28px;
}
}
@media only screen and (max-width : 500px) {
.splash-col-left {
margin-bottom: 30px;
}
}
.col-break-500 {
transition: all .25s;
}
@media only screen and (min-width : 768px) {
.col-break-500:hover {
transform: scale(105%);
}
}
.col-break-500 a {
cursor: pointer;
}
.col-break-500 a:hover .btn-extra-wide {
background-color: #f2f5f5;
color: #3460de;
text-decoration: none;
}
.col-break-500 a:focus .btn-extra-wide {
outline: 2px solid #3460de;
outline-offset: 2px;
}
@media only screen and (max-width : 500px) {
.col-break-500 {
width: 100% !important;
}
}
/* END Splash page */
/* Main Nav updates 24-04-23 */
/* flex wrapper for main nav blocks */
.menuprod {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
margin: 0 auto;
}
@media only screen and (min-width : 768px) {
.menuprod {
width: 750px;
}
}
@media only screen and (min-width : 992px) {
.menuprod {
width: 970px;
}
}
@media (min-width: 1200px) {
.menuprod {
width: 1154px;
}
}
@media only screen and (min-width: 1275px) {
.menuprod {
width: 100%;
max-width: 1600px;
}
}
header {
border: none;
}
.navbar {
max-height: none;
}
/* @media (min-width: 768px) {
.navbar-nav>div.li {
margin-top: 4px;
}
} */
.navbar-default .navbar-nav>div.li>a {
font-size: 14px;
font-weight: 600;
line-height: 16px;
}
@media only screen and (min-width: 768px) {
.navbar-nav>div.li>a {
padding-top: 15px;
padding-bottom: 15px;
}
.navbar-nav>div.li {
float: none !important;
}
}
@media only screen and (min-width: 991px) {
.navbar-nav>div.li>a {
text-align: center;
}
}
.navbar-brand {
height: auto;
padding-right: 0;
}
/* make the dropdown arrow appear on side-nav links with class of dropdown-toggle*/
div.li.dropdown>a.side-nav_support.dropdown-toggle:before {
display: flex;
right: 2px;
top: 0px;
height: 100%;
}
@media only screen and (max-width: 1199px) {
div.li.dropdown>a.side-nav_support.dropdown-toggle:before {
right: -6px;
}
}
a.side-nav_support {
font-size: 14px;
font-weight: 600;
line-height: 16px;
color: #000;
}
.navbar-brand img {
margin-left: 0;
margin-top: 0;
}
.navbar .navbar-nav {
margin-left: 0;
}
.navbar .navbar-collapse {
width: 100%;
}
@media only screen and (min-width: 991px) {
.navbar .navbar-nav {
margin-right: 10px;
display: flex;
justify-content: space-between;
align-items: center;
}
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
background: transparent;
}
/* @media only screen and (max-width: 767px) {
.navbar-collapse {padding-left: 0;padding-right: 0;}
#slide-navbar-collapse {left:0; width: 100%; margin-top: 50px;}
} */
/* Hide guarantee bar as it's getting covered by the main nav
and add some padding to the body instead */
/* @media only screen and (max-width: 767px) {
#guarantee-bar {
display: none;
}
body {
padding-top: 50px ;
}
} */
footer li {
font-size: 15px;
}
/* End Main Nav updates 24-04-23 */
/* ben's additions */
@media only screen and (max-width: 990px) {
.navbar-toggle {
margin-top: 12px;
border: none;
}
.navbar-toggle {
margin-right: 0px;
margin-top: 9px;
display: block;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #444444;
}
/* .navbar-collapse.collapse {
display: none !important;
} */
#slide-navbar-collapse {
left: 0;
width: 100%;
margin-top: 50px;
}
#slide-navbar-collapse {
position: fixed;
top: 0;
margin-top: 52px;
left: 15px;
z-index: 999999;
width: 108%;
height: 100%;
background-color: #f9f9f9;
overflow: auto;
bottom: 0;
max-height: inherit;
}
.navbar-collapse {padding-left: 0;padding-right: 0;}
#slide-navbar-collapse {
left:0; width: 100%;
margin-top: 50px;
height: calc(100vh - 50px);
overflow: auto;
}
.navbar-default .navbar-nav>div.li>a, .navbar-default .navbar-nav>div.li>a:focus, .navbar-default .navbar-nav>div.li>a:hover {
padding: 30px 50px 30px 15px;
border-top: 1px solid #666666;
background-color: #dbdbdb;
}
.navbar-default .navbar-nav>div.li>a, .navbar-default .navbar-nav>div.li>a:focus, .navbar-default .navbar-nav>div.li>a:hover {
color: #000000;
background-color: transparent;
letter-spacing: 0;
}
.navbar .navbar-nav {
text-align: left;
float: left;
width: 100%;
}
div.li.dropdown>a::before {
content: "\f107";
font-family: FontAwesome;
position: absolute;
right: 4%;
font-size: 40px;
background-image: none;
width: auto;
}
.navbar-brand {
padding: 10px 15px;
}
/* sub menu stuff */
.dropdown-menu, .menu-two-col {
left: 0;
}
.dropdown-menu {
width: 100%;
position: fixed;
padding-top: 0;
padding-bottom: 0;
overflow: hidden;
}
.navbar-nav .open .dropdown-menu {
transform: none;
}
.navbar-nav .open .dropdown-menu {
position: static;
float: none;
width: auto;
margin-top: 0;
background-color: transparent;
border: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.sub-menu-title-link, .sub-menu-title {
background-color: #ececec;
padding: 30px 0 30px 0;
border-bottom: 1px solid #666666;
}
.sub-menu-item {
padding: 30px 0 30px 0;
border-bottom: 1px solid #cccccc;
}
.sub-menu-item a {
font-size: 18px;
line-height: 22px;
font-weight: bold;
}
.sub-menu-title {
margin: 0;
padding-left: 20px;
display: block;
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
background-color: #dbdbdb;
border-bottom: 1px solid #666666;
}
.menu-bottom-border {
border-bottom: none;
margin: 0;
}
}
@media (min-width: 991px) {
/* .menuprod .navbar-collapse.collapse {
display: block !important;
height: auto !important;
padding-bottom: 0;
overflow: visible !important;
} */
.navbar-default .navbar-nav>div.li.mob-show {
display: none;
}
/*
.navbar-brand {
padding: 23px 15px;
} */
.top-elements .side-nav>div.li>.side-nav_support {
padding: 21px 5px 21px;
}
.navbar-nav>div.li {
margin-top: 4px;
}
.mob-show {
display: none;
}
.mob-hide {
display: block;
}
.navbar-nav>div.li {
float: left !important;
/*Needed when taking the <br>s out of the main nav titles*/
width: min-content;
}
}
.desktop-nav {
width: 100%;
}
@media only screen and (max-width: 990px) {
.navbar .navbar-nav.desktop-nav {
display: none;
}
}
@media only screen and (min-width: 991px) {
.navbar .navbar-nav.mobile-nav {
display: none;
}
}
.dropdown-backdrop {
display: none;
}
/* NEW HOME BANNER ENDS ABOVE HERE */
.new-intro-p {
color: #000000 !important;
margin-bottom: 20px;
font-size: 24px;
font-weight: 300;
line-height: 130%;
}
.new-intro-p1 {
color: #ffffff !important;
margin-bottom: 20px;
font-size: 24px;
font-weight: 300;
line-height: 130%;
}
/* NEW INTRO TEXT */
.terms-page p {
margin-bottom: 3rem;
}
.terms-page ol {
margin-left: 2rem;
margin-bottom: 2rem;
}
.terms-page ol li {
font-size: 18px;
margin-bottom: 2rem;
line-height: 1.4;
}
/* DA ACCESS */
#da-access1 {
background-color: #333333;
background-image: url('../../shared/images/phone-bg-1600x897.webp');
background-size: cover;
background-repeat: no-repeat;
background-position: 50% center;
padding: 30px 0;
}
@media only screen and (min-width: 1100px) {
#da-access1 {
padding-top: 12rem;
padding-bottom: 13rem;
margin-top: 0;
}
}
#da-access1 p {
margin-bottom: 44px;
}
#da-access1 img {
max-width: 400px;
margin-left: -10vw;
}
@media only screen and (max-width : 1100px) {
#da-access1 img {
margin-left: -3vw;
}
}
#da-access1 ul li {
margin-bottom: 12px;
list-style: none;
}
#da-access1 li:before {
content: '';
background: url('../../shared/images/tick-white.webp') center no-repeat;
background-size: contain;
height: 15px;
width: 20px;
position: absolute;
margin-left: -40px;
margin-top: 6px;
}
@media only screen and (max-width : 767px) {
.temp-width-parent { flex-grow: 1; }
.temp-width { min-width: 100% !important; }
}
/* Col order for moving buying widget elements around when page responds
BUT this contravenes the source order flow, changing the expected tabbing order and challenging a11y */
.col-order-a {
order: 1;
}
.col-order-b {
order: 2;
}
.col-order-c {
order: 3;
}
@media only screen and (max-width : 991px) {
.col-order-b {
order: 3;
}
.col-order-c {
order: 2;
}
}
/* ...adding margin-bot to the DMO total block instead, to align its base with the base of the dropdown in the neighbouring col */
@media only screen and (min-width : 1200px) {
.dmo-total-block--adjusted-one-acc {
margin-bottom: 50px;
}
}
/* if there are 2 accessory options... */
@media only screen and (min-width : 1200px) {
.dmo-total-block--adjusted-two-acc {
margin-bottom: 74px;
}
}
/* If it's on a page that has secure logo added... */
@media only screen and (min-width : 1200px) {
.dmo-total-block--adjusted-secure-logo {
margin-bottom: 6px;
}
}
/* If version is passed in the URL and we hide one of the accessory options, add a bit of margin to the bottom of the options block... */
@media only screen and (min-width : 1200px) {
.accessory-option-removed {
margin-bottom: 24px;
}
}
/* DMO in action */
.dmo-promo-brick {
padding: 60px 0;
background: #0073EA;
background: url('../../shared/images/healthcare/bg-hc-dax-promo.webp') center center no-repeat;
background-size: cover;
}
.dmo-in-action-bg {
width: 100%;
background: url('../../shared/images/bg-corp-about-us-mast-500-what-we-do-video.webp') center center no-repeat;
background-size: cover;
padding: 40px 0 60px 0;
}
.dmo-in-action-block-link h4 {
font-size: 22px;
font-weight: 600;
line-height: 110%;
letter-spacing: -0.5px;
margin-bottom: 2rem;
color: #285ce6 !important;
}
.dmo-in-action-block-link:hover {
text-decoration: none !important;
}
.dmo-in-action-block-link p {
color: initial;
}
/* Testimonials carousels */
.carousel-show-hide {
margin-top: 16px;
border: 0;
background: transparent;
padding: 4px;
font-size: 1rem;
color: white;
font-weight: 600;
}
.carousel-show-hide:hover, .carousel-show-hide:focus {
text-decoration: underline;
}
/* Guarantee bar ('#myCarousel') carousels */
.myCarousel-controls {
position: absolute;
width: 82px;
height: 26px;
right: 0px;
top: 4px;
background: #e5ebeb;
z-index: 2;
padding-right: 10px;
}
.myCarousel-controls button {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
border: 0;
cursor: pointer;
}
.myCarousel-controls button:last-of-type {
margin-top: 2px;
}
/* BS Modal dialogue overrides from _custom-modal.scss */
.modal-dialog {
width: auto;
}
@media screen and (max-width: 575px) {
.modal-dialog {
max-width: 100%;
}
}
@media screen and (min-width: 991px) {
.modal-dialog {
max-width: 75%;
}
}
.modal.in .modal-dialog {
transform: none;
}
.modal-header {
border-bottom: none;
background-color: transparent;
padding-bottom: 0;
}
.modal-content {
border-radius: 0;
box-shadow: none;
border: none;
background-color: transparent;
}
.modal-header .close {
padding: 1rem 1rem;
margin: -1rem auto -1rem 0;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
color: #ffffff;
font-size: 4rem;
line-height: 2rem;
font-weight: 700;
opacity: 1;
background: none;
border: 0;
}
#dmo .video-modal.fade.in {
background-color: rgb(0 0 0 / 75%);
}
.try-it-num {
border-radius: 50%;
width: 50px;
min-width: 50px;
height: 50px;
background: #141380;
font-size: 36px;
padding: 7px;
line-height: 100%;
color: white;
text-align: center;
}
@media screen and (max-width: 990px) {
.desktop-nav {
display: none;
}
}
/* Windows High Contrast Mode */
@media screen and (forced-colors: active) and (prefers-color-scheme: dark) {
/* Select2 dropdowns */
/* Disable forced-color-adjust on parent element first */
.select2-results__options {
forced-color-adjust: none;
}
.select2-results__option {
color: #ffffff;
}
/* Select2 highlighted option */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #ffffff;
color: black;
}
/* Select2 dropdowns > arrows at end of 'combobox' */
/* Disable forced-color-adjust on parent element first */
.select2-container--default .select2-selection--single .select2-selection__arrow {
forced-color-adjust: none;
}
.select-styling:after {
forced-color-adjust: none;
border-color: #ffffff transparent transparent transparent;
}
.grey-box .select2-container--default .select2-selection--single .select2-selection__arrow b {
background-color:transparent;
border-color: #ffffff transparent transparent transparent;
}
.grey-box .select2-selection--single {
border-color: #ffffff;
}
/* Make testimonial active indicator white */
.carousel-indicators {
forced-color-adjust: none;
}
.carousel-indicators .active {
background-color: #fff;
}
.carousel-indicators li {
border-top-color: transparent;
background-color: #fff;
border-bottom-color: transparent;
}
/* Change the outline colour on radio label */
input[name="term-options"]:focus + label {
outline: 2px solid #fff;
outline-offset: 2px;
}
/* swap to white arrow svg on dark mode */
div.li.dropdown>a:before {
background-image: url('../../shared/images/before-arrow-white.svg');
}
/* make burger icon bars white */
.navbar-default .navbar-toggle .icon-bar {
forced-color-adjust: none;
background-color: #fff;
}
}
.shown-light-mode {
display: none !important;
}
@media screen and (forced-colors: active) and (prefers-color-scheme: light) {
/* Shown or hidden in light modes */
.hidden-light-mode {
display: none !important;
}
.shown-light-mode {
display: block !important;
}
/* Select2 dropdowns */
/* Disable forced-color-adjust on parent element first */
.select2-results__options {
forced-color-adjust: none;
}
.select2-results__option {
color: #000000;
}
/* Select2 highlighted option */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #000000;
color: rgb(255, 255, 255);
}
/* Select2 dropdowns > arrows at end of 'combobox' */
/* Disable forced-color-adjust on parent element first */
.select2-container--default .select2-selection--single .select2-selection__arrow {
forced-color-adjust: none;
}
.grey-box .select2-container--default .select2-selection--single .select2-selection__arrow b, .select-styling:after {
background-color:transparent;
border-color: #000000 transparent transparent transparent;
}
/* Make testimonial active indicator black */
.carousel-indicators {
forced-color-adjust: none;
}
.carousel-indicators .active {
background-color: #000;
}
.carousel-indicators li {
border-top-color: #fff;
background-color: #000;
border-bottom-color: #fff;
}
/* Swap testimonial carousel images for black ones */
.carousel-control-prev-icon {
background-image: url('../../shared/images/frame-c-arrow-left-black.svg');
}
.carousel-control-next-icon {
background-image: url('../../shared/images/frame-c-arrow-right-black.svg');
}
/* Shown or hidden in light modes */
.hidden-light-mode {
display: none !important;
}
.shown-light-mode {
display: block !important;
}
.dropdown-menu {forced-color-adjust: none;}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .sub-menu-item:hover, .dropdown-menu .sub-menu-title-link a:hover {
background-color: #000;
color: #fff;
}
.dropdown-menu a:hover {color: #fff !important;}
}
/* Step blocks */
.step-block {
min-height: 88px;
}
@media screen and (max-width: 1199px) {
.step-block {
margin-bottom: 20px;
}
}
.step-svg {
height: auto;
margin-right: 20px;
}
.step-arrow {
margin: 0 24px;
}
.step-subtitle {
font-weight: 300;
text-transform: uppercase;
font-size: 38px;
line-height: 100%;
display: block;
margin-bottom: 4px;
width: max-content;
}
.step-text {
font-weight: 300;
line-height: 100%;
font-size: 22px;
}
@media screen and (max-width: 1199px) {
.step-subtitle {
font-size: 36px;
}
.step-text {
font-size: 20px;
}
}
.hover-underline-animation {
display: inline-block;
position: relative;
color: #fff;
}
.hover-underline-animation::after {
content: '';
position: absolute;
width: 100%;
transform: scaleX(0);
height: 2px;
bottom: -1px;
left: 0;
background-color: #fff;
transform-origin: bottom right;
transition: transform 0.35s ease-out;
}
p.hover-underline-animation::after {
bottom: -2px;
}
.hover-underline-animation-trigger:hover .hover-underline-animation::after {
transform: scaleX(1);
transform-origin: bottom left;
}
/* Cols as 5ths / 20% width */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
.col-xs-5ths {
width: 20%;
float: left;
}
@media (min-width: 768px) {
.col-sm-5ths {
width: 20%;
float: left;
}
}
@media (min-width: 992px) {
.col-md-5ths {
width: 20%;
float: left;
}
}
@media (min-width: 1200px) {
.col-lg-5ths {
width: 20%;
float: left;
}
}
.h3-alt {
padding: 0;
font-size: 28px;
}
.use-case-link {
appearance: none;
margin: 0;
padding: 0;
background: transparent;
border: 0;
text-align: left;
}
.use-case-link:hover p {
text-decoration-color: #000;
text-decoration: underline;
}
.use-case-link-text {
color: black;
font-size: 14px;
}
@media (max-width: 991px) {
.use-case-link-text {
margin-bottom: 20px;
}
}
/* currency dropdown - non select2 */
#currency {
height: 100%;
padding: 0;
text-align: center;
font-size: 14px;
font-weight: 600;
position: relative;
}
#currency:focus {
outline: none;
}
label.currency {
position: relative;
}
label.currency::before {
content: "";
position: absolute;
right: 4px;
top: 0px;
display: flex;
align-items: center;
width: 7px;
height: 100%;
background-image: url('../../shared/images/before-arrow.svg');
background-position: center center;
background-repeat: no-repeat;
background-size: 7px 4px;
z-index: 1;
}
/* <select> styling for non-select2 */
#selections select {
position: relative;
padding: 12px;
border-radius: 0;
border-color: #000;
height: auto;
font-size: 1.5rem;
line-height: 2rem;
}
#selections select:focus {
-webkit-box-shadow: none;
box-shadow: none;
}
.selections--select-wrapper {
position: relative;
}
#selections .selections--select-wrapper:after {
content: "";
position: absolute;
right: 13px;
bottom: 20px;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #000;
pointer-events: none;
}
#selections .selections--select-wrapper:before {
content: "";
position: absolute;
right: 37px;
bottom: 0px;
width: 0;
height: 46px;
border-left: 1px solid #000;
z-index: 1;
}
/* Microsite DA Training */
.da-pad-white {
padding: 10px;
background-color: white;
}
.da-pad-grey {
padding: 10px;
background-color: #efefef;
}
.number {
display: inline-block;
margin-right: 5px;
font-weight: bold;
}
@media (min-width: 1200px) {
.action-image {
margin-left: -40px;
}
}
.action-link p {
margin-bottom: 8px;
margin-left: -15px;
}
.action-link .fa-chevron-circle-right {
padding-right: 10px;
}
/* fa icons beside text links in accordion panels */
div[id^="accordion"] .panel-body span.fa {
padding-right: 5px;
}
.da-training-img {
box-shadow: 1px 1px 5px 0px rgb(0 0 0 / 0.2);
}
@media (max-width: 768px) {
.da-training-img {
max-width: 75%;
margin-bottom: 3rem;
}
}
.buy-dpi-img {
max-width: 100%;
height: auto;
}
@media (max-width: 768px) {
.buy-dpi-img {
max-width: 35%;
margin-bottom: 2rem;
}
}
/* Feedback buttons */
.h3-short-mb {
margin-bottom: 35px;
}
.feedback-btn {
background-color: #f2f2f2;
margin: 0 auto 2rem auto;
}
@media (min-width: 992px) and (max-width: 1199px) {
.feedback-btn {
height: 50px;
}
}
@media (min-width: 1200px) {
.feedback-btn {
height: 60px;
}
}
.feedback-btn span {
display: block;
padding: 30% 0;
}
.feedback-btn span a {
color: #333;
font-weight: bold;
font-size: 15px;
text-align: center;
display: block;
}
/* Dragon Legal Anywhere */
@media only screen and (max-width: 991px) {
#dpa-access1 {
padding-top: 3rem !important;
padding-bottom: 3rem !important;
}
}