/* = Framework
----------------------------------------------------------------------------------------------------------------- */
header { position: relative; padding-bottom: 16px; text-align: right; width: 100%; vertical-align: bottom; background-color: #0064B1; color: #fff; background-image: -webkit-linear-gradient(45deg, #0064B1, #0499DB); background-image: -o-linear-gradient(45deg, #0064B1, #0499DB); background-image: linear-gradient(45deg, #0064B1, #0499DB); -webkit-box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2); z-index: 4; }
header .container { padding-top: 0; padding-bottom: 0; }
footer { font-family: 'Lato', arial, sans-serif; background-color: #2D3A41; color: #fff; }
footer .container { max-width: 960px; }
footer .logo { float: none; width: 180px; opacity: 0.5; margin-bottom: 48px; }
footer h6 { font-family: 'Montserrat', sans-serif; font-size: 0.9em; font-weight: bold; letter-spacing: 2px; color: #04BDDB; }
footer hr { border-color: #707070; margin: 16px 0; }
footer a { color: #19C5A3; }

footer .quickLinks { font-size: 0.8em; }
footer .quickLinks ul { list-style: none; padding: 0; margin: 0; }
footer .quickLinks ul li { display: inline-block; padding-right: 16px; }
footer .quickLinks ul li:after { content: '/'; margin-left: 16px; }
footer .quickLinks ul li:last-child:after { content: none; }
footer .quickLinks ul li a { color: #fff; }
footer .quickLinks ul li a:hover { text-decoration: underline; }

footer #copyrght,
footer #copyrght span { display: inline-block; }
footer .twitter { float: right; padding: 0; margin: 0; }

.container { max-width: 1560px; padding: 64px; width: 100%; margin: 0 auto; position: relative; }
.container img { max-width: 100%; }

@media screen and (max-width: 1520px) {
    .container,
    header .container { max-width: 1280px; }
}

@media screen and (max-width: 1200px) {
    .container { padding: 48px; }

    header .container { padding-left: 32px; padding-right: 32px; }
}

@media screen and (max-width: 960px) {
    .container { padding: 32px; }
}

@media screen and (max-width: 440px) {
    footer .twitter { float: none; }
    footer .twitter img { width: 32px; }
}

@media screen and (max-width: 400px) {
    .container.noPadMobile { padding: 0; }
    .containerMobile { padding: 0 24px 24px; }

    header .container { padding-left: 25px; padding-right: 25px; }
    footer #copyrght { font-size: .9em; }
}

@media screen and (max-width: 360px) {
    header .container { padding-left: 20px; padding-right: 20px; }
}

/* = Templates
----------------------------------------------------------------------------------------------------------------- */
.template2col section { width: calc(100% - 350px); float: left; }
.template2col aside { width: 310px; margin-left: 40px; float: right; }
.template2col aside .stickymenu { width: 310px; }
.template2col aside img { width: 100%; }

@media screen and (max-width: 1024px) {
    .template2col section { width: 100%; }
    .template2col aside { width: 100%; }
    .template2col aside .stickymenu { width: auto; position: relative; top: 0; }
}

/* = Templates and zones
----------------------------------------------------------------------------------------------------------------- */
.template { background-color: #EFF3F5; }
#zone1 { background-color: #90A4AE; color: #fff; position: relative; min-height: 260px; text-align: center; }
#zone2:after { content: ''; display: table; clear: both; }

#noGreyBoxPadding.hasPaywall #zone2 { background-image: url(/_img/subscribe/prompt-background.png); background-repeat: no-repeat; background-size: cover; }
#noGreyBoxPadding.hasPaywall #zone2 input.text { background-color: #fff; }
#noGreyBoxPadding.hasPaywall #zone2 hr { display: none; }
#noGreyBoxPadding.hasPaywall #zone2 a { color: inherit; padding: 4px 0; text-decoration: underline; }
#noGreyBoxPadding.hasPaywall #zone2 a:hover { background-color: #19C5A3; text-decoration: none; }

/* ===== templateGreyShifted ===== */
#templateGreyShifted #zone2 { background-color: #DBE4EC; margin-top: -128px; }
#templateGreyShifted #zone2 { position: relative; z-index: 3; }
#templateGreyShiftedDown #zone3 { background-color: #DBE4EC; margin-top: -128px; }
#templateGreyShiftedDown #zone3 { position: relative; z-index: 3; }
#noGreyBoxShift #templateGreyShifted #zone1 .paddedTall { padding: 128px 64px 32px; }
#noGreyBoxShift #templateGreyShifted #zone2 { background-color: transparent; padding: 0; margin-top: 0; }
#noGreyBoxPadding #templateGreyShifted #zone2 { padding: 0; }

/* ===== templateWhiteSkinny ===== */
.whiteBackground { background-color: #fff; }

#templateWhiteSkinny #zone1 { position: relative; z-index: 1; }
#templateWhiteSkinny #zone2 { position: relative; z-index: 1; }
#templateWhiteSkinny #zone3 { position: relative; z-index: 1; }

.smallContainer { max-width: 1280px; margin-left: auto; margin-right: auto; }

.extraSmallContainer { max-width: 700px; margin: auto; }

.wideWhiteOnly .extraSmallContainer { max-width: 960px; }

#notExtraSmallContainer .extraSmallContainer { max-width: 960px; }

@media screen and (max-width: 1520px) {
    .smallContainer { max-width: 1080px; }
}

@media screen and (max-width: 1200px) {
    #noGreyBoxShift #templateGreyShifted #zone1 .paddedTall { padding: 128px 48px 32px; }
}

@media screen and (max-width: 960px) {
    #noGreyBoxShift #templateGreyShifted #zone1 .paddedTall { padding: 128px 32px 32px; }
}

@media screen and (max-width: 400px) {
    #zone2 > .leader { padding: 32px; }
}

/* ===== templateWhiteAndGreySkinny ===== */
#templateWhiteAndGreySkinny { background-color: #90A4AE; }
#templateWhiteAndGreySkinny #zone1, #templateWhiteAndGreySkinny #zone2 { color: #0B2538; text-align: left; }
#templateWhiteAndGreySkinny #zone1 h1 { font-family: 'Lato', sans-serif; font-weight: 700; }
#templateWhiteAndGreySkinny #zone1 .btn { margin-bottom: 20px; }
#templateWhiteAndGreySkinny #zone1 .leader { max-width: 50%; }
#templateWhiteAndGreySkinny #zone2 h2 { margin-bottom: 50px; }
.logoBackground:before { background-image: url('/_img/logo-blue.svg'); background-repeat: no-repeat; background-size: contain; content: ''; display: block; height: 34px; left: 64px; position: absolute; top: 100px; width: 87px; z-index: 2; }
.greyBackground { background-color: #EFF3F5; }
.smartphoneBackground { background-image: url(/_img/smartphone.png); background-position: bottom 0 right 30px; background-repeat: no-repeat; background-size: 45% auto; }
.macBackground { background-image: url(/_img/mac.png); background-position: bottom 0 right 30px; background-repeat: no-repeat; background-size: 45% auto; }
.macSubBackground { background-image: url(/_img/mac-sub.png); background-position: bottom 0 right 30px; background-repeat: no-repeat; background-size: 45% auto; }

@media screen and (max-width: 1520px) {
    .smartphoneBackground, .macBackground { background-size: 40%; }
}

@media screen and (max-width: 1200px) {
    .logoBackground:before { left: 48px; top: 50px; }
}

@media screen and (max-width: 960px) {
    .logoBackground:before { left: 32px; top: 95px; }
}

@media screen and (max-width: 900px) {
    #templateWhiteAndGreySkinny #zone1 .leader { max-width: 60%; }
}

@media screen and (max-width: 768px) {
    .logoBackground:before { top: 93px; }
    .smartphoneBackground, .macBackground, .macSubBackground { background-size: 25%; }
}

@media screen and (max-width: 640px) {
    .smartphoneBackground, .macBackground, .macSubBackground { background-size: 33%; }
}

@media screen and (max-width: 480px) {
    .smartphoneBackground, .macBackground, .macSubBackground { background-image: none; }
}

@media screen and (max-width: 400px) {
    #templateWhiteAndGreySkinny #zone1 .leader { max-width: 75%; }
}

/* = Logo
----------------------------------------------------------------------------------------------------------------- */
.logo { width: 190px; height: 74px; float: left; display: inline-block; background: url(/_img/logo.svg) no-repeat top left; background-size: contain; margin-top: 16px; }

@media screen and (max-width: 960px) {
    .logo { width: 160px; }
}

@media screen and (max-width: 480px) {
    .logo { width: 180px; height: 66px; background-size: auto 100%; }
}

/* = Black Box
----------------------------------------------------------------------------------------------------------------- */
.burgerContainer { /* needed on mobile */ -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.aboveMenu { display: inline-block; margin-bottom: 16px; }
header .blackBox { display: inline-block; width: auto; background-color: #1C1C2D; font-family: 'Montserrat', sans-serif; font-size: 0.8em; font-weight: normal; }
header .blackBox { margin: 0; padding: 0; list-style: none; }
header .blackBox li { display: inline-block; position: relative; margin: 0; }
header .blackBox li a { display: inline-block; color: #fff; padding: 10px 16px 10px 38px; text-align: center; background-repeat: no-repeat; background-position: left 12px center; background-size: 16px; }
header .blackBox li a:hover { background-color: rgba(255, 255, 255, 0.2); }

#search { background-image: url(/_img/icons/search.png); background-image: url(/_img/icons/search.svg); }
#login,
#profile { background-image: url(/_img/icons/profile.png); background-image: url(/_img/icons/profile.svg); background-size: 14px; }
#logout { background-image: url(/_img/icons/lock.png); background-image: url(/_img/icons/lock.svg); background-size: 13px; }
#basket, .basketIcon { background-image: url(/_img/icons/basket.png); background-image: url(/_img/icons/basket.svg); }
#favourites {  background-image: url(/_img/icons/icon-reading-list.svg);}

.hdr-icons { display: inline-block; }

.twitter { display: inline-block; margin: 2px 10px 2px 10px; padding: 6px 2px; }
.hdr-contact { display: inline-block; margin: 2px 0 2px 0; padding: 8px 2px; }

.hdr-contact,
.hdr-twitter { vertical-align: middle; }

.twitter:hover,
.hdr-contact:hover { opacity: 0.8; }

@media screen and (max-width: 900px) {
    .aboveMenu { display: block; width: 100%; margin: 0; }
    header .blackBox { padding: 12px; display: block; margin: 20px 0 10px; }
    header .blackBox li,
    header .blackBox li a { display: block; text-align: left; }
    header .blackBox li a { padding: 10px 10px 10px 38px; }

    .hdr-icons { display: block; text-align: left; position: absolute; top: 43px; right: 85px; }

    .hdr-twitter,
    .hdr-contact { display: inline-block; padding: 2px; text-align: left; margin: 0 8px; }
}

@media screen and (max-width:480px) {
    header .blackBox { padding: 10px; margin: 22px 0 10px; }
    header .blackBox li a { padding: 8px 10px 8px 37px; background-size: 14px; }
    header .blackBox li #login { background-size: 13px; }

    .hdr-icons { top: 38px; right: 80px; }

    .hdr-twitter,
    .hdr-contact { margin: 0 6px; }
}

@media screen and (max-width:400px) {
    .hdr-icons { right: 70px; }

    .hdr-twitter,
    .hdr-contact { margin: 0 5px; }

    header .blackBox li a { padding: 7px 8px 7px 37px; background-size: 13px; }
    header .blackBox li #login { background-size: 12px; }
}

@media screen and (max-width: 360px) {
    .hdr-icons { right: 60px; }
}

@media screen and (max-width: 340px) {
    .hdr-icons { right: 56px; }
    .hdr-twitter,
    .hdr-contact { margin: 0 4px; }
}

/* = Menu
----------------------------------------------------------------------------------------------------------------- */
.menu { margin-right: -12px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-size: 0.9em; font-weight: normal; }
.menu ul { margin: 0; padding: 0; list-style: none; }
.menu ul li { display: inline-block; position: relative; margin: 0; }
.menu ul li a { display: inline-block; color: #fff; padding: 10px 16px; text-align: center; }
.menu ul li a:hover { background: rgba(255, 255, 255, 0.2); text-decoration: none; }
.menu ul li a.on:after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); border-radius: 10px; display: block; background-color: #fff; width: 50%; height: 3px; }

.menu ul ul { width: 200px; display: none; position: absolute; top: calc(100% + 16px); padding: 15px 0; left: 50%; transform: translateX(-50%); background: #1C1C2D; z-index: 8; }
.menu ul li:hover ul { display: block; }
.menu ul ul li { display: block; margin: 0; }
.menu ul ul li a { display: block; padding: 10px 20px; }

.menu ul li.liHasChildren > a span { position: relative; }
.menu ul li.liHasChildren > a span:after { content: ''; position: absolute; top: 15px; height: 42px; left: 0; width: 100%; }

.menuTrigger { display: none; width: 32px; height: 32px; margin-top: 37px; font-size: 0; background: url(/_img/icons/menu.svg) no-repeat center center; }
.menuTriggerClose { background-image: url(/_img/icons/cross.svg); }

@media screen and (max-width: 1520px) {
    .menu { font-size: 0.8em; }
    .menu ul li a { padding: 8px 12px; }
}

@media screen and (max-width: 1200px) {
    .menu { margin-right: -10px; }
    .menu ul li a { padding: 8px 10px; }
}

@media screen and (max-width: 900px) {
    .burgerContainer { overflow: hidden; width: 100%; display: block; max-height: 0; }

    .menu { font-size: 0.9em; margin-bottom: 25px; margin-right: 0; }
    .menu ul li { display: block; margin-right: 0; }
    .menu ul li a { display: block; text-align: left; padding: 12px 18px; }
    .menu ul li:hover ul { display: none; }
    .menu ul li a.on:after { width: 30px; left: 16px; transform: none; }
    .menu ul ul { width: 100%; display: block; position: relative; top: 0; padding: 0; left: 0; transform: none; background: transparent; }
    .menu ul ul li a { padding: 12px 18px; }

    .menuTrigger { display: inline-block; }
}

@media screen and (max-width: 480px) {
    .menuTrigger { margin-top: 33px; }

    .menu { margin-bottom: 20px; }
    .menu ul li a,
    .menu ul ul li a { padding: 10px 16px; }
}

@media screen and (max-width: 400px) {
    .menuTrigger { margin-right: -5px; }

    .menu ul li a,
    .menu ul ul li a { padding: 9px 15px; }
}

.extended { max-height: 800px; }


/* = Sub Menu
----------------------------------------------------------------------------------------------------------------- */
.submenu { margin: 0 0 20px; }
.submenu ul { margin: 0; padding: 0; list-style: none; }
.submenu ul li { display: block; margin: 0; border-bottom: 1px solid #ccc; }
.submenu ul li a { display: block; padding: 10px 15px; color: #333; background: #eee; }
.submenu ul li a:hover { background: #ddd; }
.submenu ul li a.on { font-weight: bold; background: #ddd; }
.submenu ul li:last-child { border-bottom: 0; }


/* = Search bar
----------------------------------------------------------------------------------------------------------------- */
.search-bar { padding: 20px 25px; background: #f4f4f4; }
.search-bar .sb-exact { font-size: .95em; margin-bottom: 10px; }
.search-bar .sb-exact input { display: inline-block; vertical-align: bottom; margin: 0 0 1px 6px; -webkit-transform: scale(1.1); transform: scale(1.1); }
.search-bar > div { margin: 0; }
.search-bar .sb-field { float: left; width: calc(50% - 70px); margin: 0 10px 4px 0; background: #fff; }
.search-bar .btn { width: 120px; text-align: center; }

.search-reset { display: block; margin-bottom: 10px; text-decoration: underline; }

@media screen and (max-width: 700px) {
    .search-bar { padding: 25px; }
    .search-bar .sb-field { float: none; width: 100%; margin: 0 0 10px; }
}

/* = Hero Image
----------------------------------------------------------------------------------------------------------------- */
#zone1 h1 { position: relative; z-index: 2; }
#zone1 .td .static * { position: relative; z-index: 2; }
#zone1 .td .static .heroImage { position: absolute; z-index: 1; }
.hasHero { padding: 0; }
.heroImage { background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }
.hasHero .heroImage:after { content: -webkit-gradient(linear, left top, left bottom, from(rgba(28, 28, 45, 0)), to(rgba(28, 28, 45, 0.8))); content: -webkit-linear-gradient(rgba(28, 28, 45, 0), rgba(28, 28, 45, 0.8)); content: linear-gradient(rgba(28, 28, 45, 0), rgba(28, 28, 45, 0.8));  position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
.hasHero .heroImage--deals:after { content: linear-gradient(rgba(28, 28, 45, 0), rgba(28, 28, 45, 0.45)); }

@media screen and (max-width: 480px) {
    .hasHero .heroImage--deals:after { content: linear-gradient(rgba(28, 28, 45, 0), rgba(28, 28, 45, 0.3)); }
}


/* = Decorative Arrows
----------------------------------------------------------------------------------------------------------------- */
.arrowsContainer { width: 100%; overflow: hidden; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.decorativeArrow { position: absolute; width: 260px; z-index: 1; }
#arrow1 { opacity: 0.2; transform: rotate(180deg); top: -40px; right: 240px; }
#arrow2 { opacity: 0.2; width: 700px; top: 54px; right: -120px; }
#arrow3 { transform: rotate(180deg); top: 800px; right: 40px; z-index: 0; }
#arrow4 { width: 400px; opacity: 0.2; top: 1200px; left: -80px; z-index: 0; }

/* = Checkout
----------------------------------------------------------------------------------------------------------------- */
/* Address */
section div.colsAddressDetails:last-of-type { margin-bottom: 24px; }
.moveon { margin-bottom: 0; }

p span.checkbox { margin-right: 20px; }

.goBackFromSummary { margin-bottom: 0; }
.paymentButtons .btn.btnImpact { background-color: #19C5A3; }
.paymentButtons .btn.btnImpact { background-color: #63E0C2; }

.coDeliveryAddress { margin-bottom: 24px; }
.acceptTerms { margin-bottom: 32px; }
.coForm-dept {display:none;}

@media screen and (max-width: 400px) {
    /* p.paymentButtons, */
    .checkoutBackContinue .btn,
    .moveon,
    .moveon .btn { width: 100%; }

    .goBackFromSummary,
    .checkoutBackContinue .textLeft { margin-bottom: 16px; }

    .moveon { margin-bottom: 16px; }
    .moveon:last-child { margin-bottom: 0; }
}

/* = News
----------------------------------------------------------------------------------------------------------------- */
.news { margin: 0; }
.news ul { padding: 0; margin: 0; list-style: none; }
.news ul.paddedSmall { padding: 32px; }
.news ul li { display: block; margin: 0 0 32px;  position: relative;}
.news ul.noLiMargin li { margin: 0;      }
.news ul li a { display: block; color: #0B2538; }
.news ul.pagination li a { color: #A8AEB0; }
.news ul.pagination li a.on { color: #0B2538; }
.news ul li a.border { border-bottom: 2px solid #2D3A41; }
.news ul li h3 { line-height: 1.1em; margin: 0 0 10px; }
.news ul li h4 { font-size: 1.2em; line-height: 1.3em; margin: 0 0 10px; -webkit-transition: color 400ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: color 400ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: color 400ms cubic-bezier(0.165, 0.84, 0.44, 1); }
.news ul li small { font-family: 'Lato', sans-serif; display: block; font-weight: bold; text-transform: uppercase; margin-bottom: 10px; }
a .arrowBox { -webkit-transition: transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1); }
.news ul li a .arrowBox { margin-bottom: 16px; }
.news ul li .meta { margin: 0 0 20px; }

.news ul li a:hover label.type { opacity: 0.8; }
.news ul li a:hover h4 { color: #185078; }
a:hover .arrowBox { transform: translateX(10px); }

.news ul li .locked { background-image: url(/_img/icons/lock.svg); background-repeat: no-repeat; background-position: center; }

.newsview h1, .hasPaywall h1 { font-family: 'Lato', sans-serif; font-size: 2em; font-weight: bold; margin-bottom: 24px; }
.newsview h2 { margin: 0 0 5px; }
.newsview small { display: inline-block; margin-bottom: 24px; }
.newsview img { width: 40%; float: right; margin: 0 0 20px 20px; }
.newsview .meta { margin: 0 0 20px; }

.table .news,
.table .news ul li {
    height: 100%;
}

.table .news.readinglist {height: auto;}

.paging ul li { display: inline-block; }

@media screen and (max-width: 480px) {
    .news ul li img { width: 100%; float: none; }
    .newsview img { width: 100%; float: none; margin-left: 0; }
}

@media screen and (min-width: 960px) {
    .news .colsHalf a,
    .news .colsFourth a { position: relative; }
    .news .colsHalf a > label.type,
    .news .colsFourth a > label.type { position: absolute; top: 0; }

    .news .colsHalf a > label.type + h4,
    .news .colsFourth a > label.type + h4 { padding-top: 74px; min-height: 148px; }
}

/* = News favourites
----------------------------------------------------------------------------------------------------------------- */
.news .icon--favourite,
.newsview .icon--favourite { width:26px; height: 26px;  position: absolute; top:0; right: 0; color:#0B2538; border:1px solid #c4c4c4; background: #fff url(/_img/icons/icon-reading--add.svg?v2) center no-repeat; background-size: auto 24px; z-index: 1;}

.news .icon--favourite-liked,
.newsview   .icon--favourite-liked  { boder-color:#19C5A3; background: #fff url(/_img/icons/icon-reading--remove.svg?v2) center no-repeat; background-size: auto 24px; } 

.newsview .icon--favourite { position: absolute;  top:0; right:0; margin: 0;  width: 26px;   height: 26px;  display: inline-block; vertical-align: baseline;  background-size: auto 20px;  }

.news .icon--favourite-disabled,
.newsview .icon--favourite-disabled { display: none;  }

@media screen and (min-width: 1201px) {
    .icon--favourite:not(.icon--favourite-liked):hover,
    .icon--favourite:not(.icon--favourite-liked):focus  {color:#0064B1; border:solid 1px #0064B1; box-shadow: 2px 2px rgba(35, 148, 235, 0.3); }
}

@media screen and (max-width: 600px) {
    .news .icon--favourite { background-size: auto 22px; }
}

@media screen and (max-width: 400px) {
    .news  .icon--favourite { background-size: auto 20px; }
}

/* = Article share
----------------------------------------------------------------------------------------------------------------- */
.article-share { margin:40px 0; padding:40px; background: #efefef;}
.article-share:last-child {margin-bottom: 0;}
.article-share input.text {    padding: 13px 16px; vertical-align: middle; background: #fff;  }   
.article-share .btn {vertical-align: middle; } 
.article-share .webForm  > div {display: -webkit-flex; display: flex; margin: 0 0 5px;}

@media screen and (max-width: 600px) {
    .article-share { margin:30px 0; padding:30px; }
    .article-share .btn {   padding: 16px 20px;  }
}

@media screen and (max-width: 480px) {
    .article-share .webForm  > div {   -webkit-flex-wrap: wrap; flex-wrap: wrap;     }
    .article-share input.text {    width:100%; }   
    .article-share .btn {width: 100%; margin:10px 0 0; }
}

@media screen and (max-width: 400px) {
    .article-share { margin:25px 0;  }
}

/* = Listings with filter panel
----------------------------------------------------------------------------------------------------------------- */
.filteredList { background-color: #D5DDE2; }
.filteredList #searchBar { display: none; width: 100%; background-color: rgba(0, 0, 0, 0.2); padding: 16px; text-align: right; margin-bottom: 32px; cursor: pointer; }
.filteredList #searchBar #barSearch { display: inline-block; }
.filteredList #searchBar #barClose { display: none; }
.filteredList #searchBar.active { position: absolute; background-color: transparent; }
.filteredList #searchBar.active #barSearch { display: none; }
.filteredList #searchBar.active #barClose { display: inline-block; }
.filteredList #searchBar:active { background-color: rgba(0, 0, 0, 0.3); }

/* Filter Panel */
.filteredList aside {  top: 32px; font-size: 0.8em; display: inline-block; background-color: #2D3A41; color: #fff; width: 300px; vertical-align: top; }
.filteredList aside .scrollY { overflow-y: auto; max-height: 300px; }
.filteredList aside .btn { font-size: 1em; }
.filteredList aside h3 { font-family: 'Montserrat', sans-serif; font-size: 1.2em; font-weight: normal; text-transform: uppercase; }
.filteredList aside .select:after { border-top-color: #fff; }

/* .filteredList aside h3 { margin-bottom: 6px; } */
.filteredList aside .webForm div { margin: 0 0 6px; }
.filteredList aside .webForm > div:last-child { margin-top: 16px; margin-bottom: 0; }
.filteredList aside .webForm label { float: none; width: 100%; margin-bottom: 8px; }
.filteredList aside .webForm input,
.filteredList aside .webForm .select { float: none; width: 100%; }
.filteredList aside .webForm  input[type=checkbox]{ width: auto; margin: -1px 2px 0 0; }

.filteredList aside a { display: block; vertical-align: middle; margin-bottom: 16px; }
.filteredList aside a span { display: inline-block; vertical-align: middle; }
.filteredList aside label.type { max-width: 164px; cursor: pointer; vertical-align: middle; margin: 0; }
.filteredList aside label.type:hover { opacity: 0.8; }
.filteredList aside label.type.on { border-left: 10px solid #fff; }

.filteredList.unsearched { text-align: center; }
.filteredList.unsearched aside { width: 500px; max-width: 100%; }

/* List on right */
.filteredList aside + section { display: inline-block; width: 60%; width: calc(100% - 305px); padding-left: 32px; }
.filteredList .mainList ul { list-style: none; padding: 0; margin: 0; }
.filteredList .mainList ul li { margin-bottom: 16px; }
.filteredList .mainList ul li span:nth-child(2) { display: inline-block; }

.mainList h3 {padding-right: 25px;}

/* only for deals data list */
.filteredList .dealsData { font-size: 14px; margin-bottom: 32px; word-break: keep-all; border-spacing: 0 16px; z-index: 4; }
.filteredList .dealsData .table { table-layout: initial; border: 1px solid black; }
.filteredList .dealsData a.tr { /* display: table-row; */ background-color: #fff; color: inherit; height: initial; }
.filteredList .dealsData a.tr:hover { background-color: #fafafa; }
.filteredList .dealsData .tr .td,
.filteredList .dealsData .tr .th { padding: 16px; }
.filteredList .dealsData .tr .td:first-child,
.filteredList .dealsData .tr .th:first-child { padding-left: 32px; border-left: 4px solid transparent; }
.filteredList .dealsData .tr .td:last-child,
.filteredList .dealsData .tr .th:last-child { padding-right: 32px; }

.filteredList .dealsData .tr .td:nth-child(2),
.filteredList .dealsData .tr .th:nth-child(2),
.filteredList .dealsData .tr .td:last-child,
.filteredList .dealsData .tr .th:last-child { text-align: center; }

.filteredList .dealsData .itemBR { display: none; }

/* description flyout */
.filteredList .dealsData .description { display: none; background-color: #19C5A3; color: #0B2538; width: 100%; position: absolute; left: 0; z-index: 10; transform: translateY(32px); -webkit-box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1); }
.filteredList .dealsData .description:before { content: ''; position: absolute; top: -10px; left: 49%; left: calc(50% - 5px); width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #19C5A3; }
.filteredList .dealsData .tr.on,
.filteredList .dealsData .tr.on:hover { background-color: #eaeaea; }
.filteredList .dealsData .tr.on .td:first-child { border-left: 4px solid #19C5A3; }
.filteredList .dealsData .tr.on .description { display: block; }

/* when its shown as related articles in white template */
.whiteBackground #zone2 .filteredList.paddedSmall,
.whiteBackground #zone3 .filteredList.paddedSmall { padding: 0; }

.whiteBackground #zone3 .filteredList .dealsData a.tr { -webkit-box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1); }

/* only for news listing */
.filteredList .news ul li { width: 100%; margin-bottom: 48px; }
.filteredList .news ul.pagination li { width: auto; margin-bottom: initial; }
.filteredList .news h3 { font-size: 1.2em; line-height: 1.4em; margin-bottom: 16px; }
.filteredList .news p { font-size: 1em; }
.filteredList .newsLeft { display: inline-block; width: 160px; vertical-align: top; }
.filteredList .newsRight { display: inline-block; width: 60%; width: calc(100% - 165px); padding-left: 16px; }

.filteredList .readMore { text-align: right; margin-bottom: 16px; }
.filteredList .readMore span { display: inline-block; text-transform: uppercase; margin-right: 8px; }
.filteredList .readMore .arrowBox { display: inline-block; }

/* only for news global search */
#globalSearch input.btn { font-size: 1em; padding: 11px 24px; }
section #globalSearch .search-wrap p:last-child { margin-bottom: 25px; }

/*news filter expand styling*/
.filteredList .newsFilter aside h3 { margin-bottom: 32px; }
.filteredList .newsFilter > div:nth-of-type(n+9) { display: none; }
.filteredList .newsFilter.expanded > div:nth-of-type(n+9) { display: block; }

#expandArrow { color: inherit; display: block; text-transform: uppercase; font-family: 'Montserrat', sans-serif; letter-spacing: 1px; text-align: center; margin-bottom: 0; margin-top: 32px; cursor: pointer; }
#expandArrow:hover { opacity: 0.8; }
#expandArrow:after { content: url(/_img/icons/downArrow.png); display: block; margin-top: 8px; }
.expanded #expandArrow:after { transform: rotate(180deg); }

.readinglist { list-style: none; margin:15px 0 0 ; padding:0; } 
.readinglist  li {    margin-bottom: 30px; position: relative;}
.readinglist  li:last-child {margin-bottom: 0;}
.readinglist a {color:#fff; text-decoration: none;}
.readinglist h5 {  font-size: 1.25em;   line-height: 1.25em; line-height: normal;  margin: 0; padding-right: 40px;}
.readinglist h5:hover {text-decoration: underline;}
.readinglist .newsLeft  label {margin-right: 5px;}

.readinglist + .paging {margin-top:40px;}
.readinglist + .paging ul li a  {    box-shadow: 0 0 0px 1px #3d4d56; }
.readinglist + .paging ul li + li {margin-left: 2px;}
.readinglist + .paging ul li a.on  { background: #d3dddf; box-shadow: 0 0 0px 1px #d3dddf;}
.readinglist + .paging ul li a:hover {color:#fff;}

@media screen and (max-width: 1100px) {
    .filteredList #searchBar { display: block; }

    .filteredList aside { display: block; position: static; width: 100%; margin-bottom: 32px; }
    .filteredList aside + section,
    .filteredList section { display: block; width: 100%; padding: 0; }

    .filteredList #searchBar + aside { display: none; }
    .filteredList #searchBar.active + aside { display: block; width: 100%; }

    /*news filter expand styling*/
    .filteredList .newsFilter > div { display: inline-block; margin-right: 16px; }
    .filteredList .newsFilter > div.webForm { margin-left: auto; margin-right: auto;  max-width: 400px; display: block;  }
    .filteredList .newsFilter > div:nth-of-type(n+9) { display: none; }
    .filteredList .newsFilter.expanded > div:nth-of-type(n+9) { display: inline-block; }
}

@media screen and (max-width: 768px) {
    .filteredList .dealsData .thead { display: none; }
    .filteredList .dealsData .tr { position: relative; padding: 16px; margin-bottom: 16px; line-height: 1.8em; }
    .filteredList .dealsData .tr .td { display: inline-block; padding: 0; border: 0; }
    .filteredList .dealsData .tr .td:first-child { padding-left: 0; }
    .filteredList .dealsData .tr .td:last-child { padding-right: 0; }

    .filteredList .dealsData .date { min-width: 140px; padding: 2px 6px; background-color: rgba(40, 40, 40, 0.1); margin-right: 8px; text-align: center; }
    .filteredList .dealsData .itemBR { display: block; }

    .filteredList .dealsData .description { top: 100%; transform: none; }

    .filteredList .newsLeft,
    .filteredList .newsRight { display: block; width: 100%; padding-left: 0; }

    .mainList h3 {padding-right: 0;}

    .readinglist {  margin:5px 0 0;  } 
    .readinglist h5 {  font-size: 1.2em;  padding-right: 0;}
}

/* = Companies card list
----------------------------------------------------------------------------------------------------------------- */
.cards-list > ul { list-style: none; margin: 0 0 30px; padding: 0; list-style: none; display: flex; flex-wrap: wrap; }
.cards-list > ul li { margin: 20px 0 0; width: 100%; min-height: 170px; border: 1px solid #c2d2d9; background: #fff; background: rgba(255, 255, 255, 0.9); position: relative; }
.cards-list > ul li a { position: relative; display: block; top: 0; left: 0; width: 100%; height: 100%; color: #111; }
.cards-list .arrowBox { position: absolute; bottom: 0; right: 0; }
.cards-list a:hover .arrowBox { transform: none; }

.cards-list .cl-content { padding: 20px 20px 55px; }
.cards-list .cl-title { margin: 0 0 20px; color: #0B2538; }
.cards-list .cl-summary:last-child { margin-bottom: 0; }
.cards-list .cl-image { width: 200px; }

@media screen and (min-width: 481px) and (max-width: 800px) {
    .cards-list > ul li { width: calc(50% - 10px); margin: 20px 20px 0 0; min-height: 175px; }
    .cards-list > ul li:nth-child(even) { margin-right: 0; clear: right; }
    .cards-list > ul li:nth-child(odd) { clear: left; }
    .cards-list > ul li:nth-child(-n+2) { margin-top: 0; }
}

@media screen and (min-width: 801px) and (max-width: 1200px) {
    .cards-list > ul li { width: calc(33.333% - 13.333px); margin: 20px 20px 0 0; min-height: 180px; }
    .cards-list > ul li:nth-child(3n+3) { margin-right: 0; clear: right; }
    .cards-list > ul li:nth-child(3n+1) { clear: left; }
    .cards-list > ul li:nth-child(-n+3) { margin-top: 0; }
}

@media screen and (min-width: 1201px) {
    .cards-list > ul li { width: calc(25% - 15px); margin: 20px 20px 0 0; min-height: 200px; }
    .cards-list > ul li:nth-child(4n+4) { margin-right: 0; clear: right; }
    .cards-list > ul li:nth-child(4n+1) { clear: left; }
    .cards-list > ul li:nth-child(-n+4) { margin-top: 0; }
    .cards-list .cl-content { padding: 25px 25px 55px; }
}

@media screen and (max-width: 600px) {
    .cards-list--related > ul li,
    .cards-list--related > ul li:nth-child(-n+2) { width: 100%; float: none; margin: 20px 0 0; }
    .cards-list--related > ul li:first-child { margin-top: 0; }
}

/* = Companies list
----------------------------------------------------------------------------------------------------------------- */
.rows-list { max-width: 800px; margin:0 auto; }
.rows-list ul { list-style: none; margin:0; padding:0; }

.rows-list ul li {margin-bottom: 15px;}

.rows-list ul li a {
    display: block;
    color: #0B2538;
    border:1px solid #c2d2d9;
    background-color: #fff;
    position: relative;
}

.rows-list ul li a:hover,
.rows-list ul li a:focus {
    text-decoration: none;
}

.rows-list .cl-title {  margin: 0; color: #0B2538;}
.rows-list .company--basic .cl-title { font-size: 1.1em; }

.rows-list .cl-title:last-child { margin: 0;}
.rows-list .cl-content { padding:25px; }

.rows-list .arrowBox { position: absolute; top: calc(50% - 16px); right: 25px;  width: 32px; height: 32px; }
.rows-list a:hover .arrowBox { transform: none; }

.rows-list .cl-summ-img {
    display: flex;
    padding-right: 60px;
}

.rows-list .cl-image-wrap  {
    width: 120px;
    height: 120px;
    padding:12px;
    flex: 0 0 120px;
    margin: 25px 25px 0 0;
    border: 1px solid #dbe6eb;
    display: flex;
    justify-content: center;
    align-items: center;
}

.rows-list .cl-image {
    object-fit: contain;
}

.rows-list .cl-summary {
    margin:25px 0 0;
}

.rows-list a:hover .arrowBox,
.rows-list a:focus .arrowBox { background-color: #0064B1; }

.rows-list a:hover .cl-title,
.rows-list a:focus .cl-title { text-decoration: underline;}

@media screen and (max-width: 480px) {
    .cl-summ-img {
        flex-wrap: wrap;
    }

    .rows-list .cl-summ-img {padding-right: 50px;}
}

@media screen and (max-width: 400px) {
    .rows-list .cl-summary { font-size: 13px;} 
}

/* = Companies in issue list
----------------------------------------------------------------------------------------------------------------- */
.companies-issue ul {
 list-style: none;
 padding:0;
}
.companies-issue ul li {
    margin: 0 0 5px;
}

.companies-issue ul li a {
    padding:8px 15px;
    display: block;
    background-color: rgba(255, 255, 255, 0.5);
    transition: all .3s ease;
    text-underline-offset: 2px;
}

.companies-issue ul li a:hover {
    background-color: #fff;
    text-decoration: none;
}

.companies-issue .cl-title {
    font-size: 0.9em;
}

.companies-issue .cl-title:last-child {
    margin-bottom: 0;
}




/* = Companies view
----------------------------------------------------------------------------------------------------------------- */
.company-summary { margin: 0 0 35px; padding: 25px; background: #efefef; }
.company-summary h1 { margin-bottom: 0; }
.company-summary.company-summary--extended h1 { margin-bottom: 24px; }
.company-summary p:last-of-type { margin-bottom: 0; }
.company-summary .cs-img { display: block; margin: 0 auto 20px; padding: 20px; background: #fff; }
.company-summary img { float: none; margin: 0; width: 100%; }

.company-articles .readMore { text-align: right; }
.company-articles .readMore .arrowBox { display: inline-block; }
.company-articles .readMore span { margin-right: 8px; display: inline-block; }

@media screen and (min-width: 601px) {
    .company-summary { padding: 30px; }
    .company-summary h1,
    .company-summary p { float: left; width: calc(68% - 30px); }
    .company-summary .cs-img { float: right; top: 0; right: 0; width: 32%; padding: 15px; background: #fff; }
}

@media screen and (min-width: 1201px) {
    .company-summary .cs-img { padding: 20px; }
}


/* = Insights 
----------------------------------------------------------------------------------------------------------------- */
.news .company-articles--insights { max-width: 960px; margin: 0 auto; }

.company-articles--insights li { position: relative; }
.company-articles--insights .readMore { margin-bottom: 10px; }

.insights-img { position: relative; }
.ii-inner { position: relative; width: 100%; height: 0; padding-bottom: 60%; background-size: cover; background-position: center; background-repeat: no-repeat; }
.insights-content { margin-top: 20px; }

.insight-view .inline-image { width: 100%; margin: 30px 0; float: none; }
.insight-view .inline-image--left-half { float: left; margin: 5px 5% 5% 0; width: 50%; }
.insight-view .inline-image--right-half { float: right; margin: 5px 0 5% 5%; width: 50%; }

.insight-view .inline-image--left-third { float: left; margin: 5px 4% 4% 0; width: 33.3%; }
.insight-view .inline-image--right-third { float: right; margin: 5px 0 4% 4%; width: 33.3%; }

.insight-meta { color: #004B98; }
.insight-meta span + span { margin-left: 10px; padding-left: 10px; border-left: 1px solid #0064B1; }

@media screen and (min-width: 481px) {
    .insights-img { float: left; width: 30%; margin: 0 25px 25px 0; }
    .ii-inner { width: 100%; padding-bottom: 100%; }

    .insights-content { float: left; width: calc(70% - 25px); margin: 0; padding-bottom: 70px; }

    .company-articles--insights .readMore { position: absolute; bottom: 5px; right: 0; }
}

@media screen and (min-width: 1025px) {
    .news .company-articles--insights { margin: 35px auto 0; }

    .insights-img { float: left; width: 300px; margin: 0 30px 30px 0; }
    .insights-content { float: left; width: calc(100% - 330px); margin: 0; }
}

@media screen and (max-width: 1024px) {
    .insight-view .inline-image--left-third { margin: 5px 5% 5% 0; width: 50%; }
    .insight-view .inline-image--right-third { margin: 5px 0 5% 5%; width: 50%; }
}

@media screen and (max-width: 650px) {
    .insight-view .inline-image--left-half,
    .insight-view .inline-image--right-half,
    .insight-view .inline-image--left-third,
    .insight-view .inline-image--right-third { float: none; margin: 30px 0; width: 100%; }

    .insight-meta { font-size: .9em; }
}


/* = Stock List for subscribing
----------------------------------------------------------------------------------------------------------------- */
.prodImages { margin-bottom: 16px; }
.stockList { list-style: none; padding: 0; margin: 0; }
.stockList .select { float: none; margin-bottom: 16px; }

/* = Subscribe Options Table
----------------------------------------------------------------------------------------------------------------- */
.subOptions { background-color: #D5DDE2; }

.subOptions.desktop { display: block; }
.subOptions.mobile { display: none; }

.subOptions { font-family: 'Lato', sans-serif; color: #0B2538; overflow: auto; }
.subOptions .table { table-layout: fixed; border-collapse: collapse; margin: 48px 0; }
.subOptions .table .th { background-color: transparent; color: #0B2538; border: 0; border-right: 1px solid #2D3A41; margin-right: 1px solid #2D3A41; text-align: center; vertical-align: bottom; }
.subOptions .table .th:last-child { border-right: 0; }
.subOptions .table img { max-width: 150px; }

.subOptions .table .tr:nth-child(2n) { background-color: #E6EBEF; }
.subOptions .table .tr .td { border-right: 1px solid #2D3A41; text-align: center; vertical-align: middle; padding: 16px 24px; }
.subOptions .table .tr .td:first-child { text-align: left; }
.subOptions .table .tr .td:last-child { border-right: 0; }
.subOptions .table .tr .td img { width: 20px; }

.subOptions .circle { background-color: #19C5A3; color: #fff; width: 140px; height: 140px; padding: 10px; border: 3px solid #fff; border-radius: 100%; margin: auto; margin-bottom: 24px; word-wrap: normal; white-space: nowrap; -webkit-box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2); }
.subOptions .circle span { display: block; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); vertical-align: middle; }
.subOptions .circle.darkBlue { background-color: #0064B1; }
.subOptions .circle.lightBlue { background-color: #04BDDB; }

.subOptions .poundsign { font-size: 1.2em; line-height: 1em; font-weight: bold; vertical-align: top; }
.subOptions .price { font-size: 3.4em; line-height: 0.8em; font-weight: bold; vertical-align: top; }
.subOptions .vat { font-size: 1.4em; line-height: 1em; font-weight: bold; vertical-align: bottom; }
.subOptions .annum { font-size: 1em; line-height: 1em; font-weight: normal; margin: 24px 0; }
.subOptions .btn { margin-bottom: 24px; }

.subOptions.mobile ul { list-style: none; padding: 0; }
.subOptions.mobile ul li { background: url(/_img/icons/green-tick.png) no-repeat left 5px; background-size: 20px; padding: 2px 0 2px 32px; }

.subOptions hr { border-color: #0B2538; }
.subOptions.mobile .topOptions .btn { padding: 16px 8px; margin-left: 4px; margin-right: 4px; }
.subOptions.mobile .topOptions .btn.notProfit { background-color: #0064B1; }
.subOptions.mobile .topOptions .btn.corporate { background-color: #0499DB; }
.subOptions.mobile .topOptions .btn:hover,
.subOptions.mobile .topOptions .btn:active { opacity: 0.8; }
.subOptions.mobile .annum { margin: 12px 0 24px; }

@media screen and (max-width: 768px) {
    .subOptions.desktop { display: none; }
    .subOptions.mobile { display: block; }
}

@media screen and (max-width: 480px) {
    .subOptions.mobile .topOptions .btn { width: 100%; max-width: 240px; }
}

/* = Banners
----------------------------------------------------------------------------------------------------------------- */
.banner { margin: 0; }
.banner img { max-width: 100%; margin: 0; }

.bannersrepeater ul { margin: 0; padding: 0; list-style: none; }
.bannersrepeater ul li { margin: 0; }

/* = Cookie
----------------------------------------------------------------------------------------------------------------- */
.cookie-notice { display: none; position: fixed; left: 0; bottom: 0; right: 0; z-index: 9999; }
.cookie-notice-inner { margin: 0 auto; max-width: 1150px; display: table; background: #333; position: relative; }
.cookie-notice p { color: #d4d4d4; }
.cookie-notice p:last-child { margin-bottom: 0; }
.cookie-notice .cookie-info { display: table-cell; vertical-align: middle; padding: 30px 35px; }
.cookie-notice .cookie-info .cookie-reject { display: none; }
.cookie-notice .cookie-info .cookie-links a:first-of-type { margin-left: 0; }
.cookie-notice .cookie-info p:first-child { margin-bottom: 8px; }
.cookie-notice .cookie-info a { color: #fff; text-decoration: underline; }
.cookie-notice .cookie-info .cookie-links a { display: inline-block; margin: 0 10px; }
.cookie-notice .cookie-info .cookie-links a:last-of-type { margin-right: 0; }
.cookie-notice .cookie-button { display: table-cell; vertical-align: middle; padding: 30px 35px; min-width: 295px; background: #3d3d3d; text-align: center; }
.cookie-notice .cookie-button .btn { padding: 15px 20px 15px 70px; position: relative; text-transform: uppercase; border: 0; -webkit-border-radius: 4px; border-radius: 4px; color: #fff; background: #0064B1; }
.cookie-notice .cookie-button .btn:before { content: ''; color: #fff; background: #004B98 url(/_img/icons/cookie-check.svg) no-repeat 50% 50%; position: absolute; left: 0; top: 0; bottom: 0; height: 100%; width: 50px; -webkit-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; }

@media screen and (max-width: 770px) {
    .cookie-notice .cookie-info .cookie-links a { display: block; margin: 6px 0 0; }
    .cookie-notice .cookie-info .cookie-links a + span { display: none; }
    .cookie-notice .cookie-info .cookie-reject .cookie-links a { display: inline-block; margin: 5px 10px 0; }
    .cookie-notice .cookie-info .cookie-reject .cookie-links a:first-of-type { margin-left: 0; }
}

@media screen and (max-width: 650px) {
    .cookie-notice .cookie-info { padding: 30px 25px 25px; display: block; }
    .cookie-notice .cookie-button { padding: 0 25px 30px; background: none; display: block; position: absolute; bottom: 0; right: 0; text-align: right; }
    .cookie-notice .cookie-info .cookie-links { width: calc(100% - 220px); min-height: 60px; }
    .cookie-notice .cookie-info .cookie-reject .cookie-links a { margin: 10px 0 0; display: inline-block; width: 44%; }
    .cookie-notice .cookie-button .btn { padding: 12px 15px 12px 65px; }
}

@media screen and (max-width: 420px) {
    .cookie-notice { font-size: .9em; }
    .cookie-notice .cookie-info { padding: 30px 25px 25px; }
    .cookie-notice .cookie-info .cookie-links { width: 100%; min-height: 0; }
    .cookie-notice .cookie-info .cookie-reject .cookie-links a { margin: 0 15px 0 0; width: auto; }
    .cookie-notice .cookie-button { position: relative; text-align: left; }
    .cookie-notice .cookie-button .btn { padding: 10px 15px 10px 65px; }
}

/* = Twitter Panels
----------------------------------------------------------------------------------------------------------------- */
.twitterPanels { max-width: 1280px; margin-left: auto; margin-right: auto; }
.twitterPanels .col { vertical-align: middle; }
.twitterPanels .twitterBlock { height: 100%; padding: 32px; }
.twitterPanels .twitterBlock a:hover { text-decoration: underline; }

/* = Store + Checkout
----------------------------------------------------------------------------------------------------------------- */
.coPaypalBtn { display: block; text-align: right; margin-top: 16px; }
.coPaypalBtn input { vertical-align: top; }
.coDeliveryAddress h2 { display: none; }
th.colVat { text-transform: uppercase }

@media screen and (min-width: 650px) {
    table.coOrderSummary { min-width: unset; }

    .colsHalf .colHasSummary { width: 100%; }
    /*.colsHalf .coTerms, .colsHalf .coDeliveryAddress { float: left; width: 50%; clear: both; }*/
}


.completedOrderInfo { display: none; }

.formSubmit input.btn { margin-bottom: 16px; }

.previousIssues { line-height: unset; }
.previousIssues li { list-style: none; margin: 0 0 4px; }

/* = Slider
----------------------------------------------------------------------------------------------------------------- */
.lSSlideOuter .lSPager.lSpg > li a { background: #DBE4EC; border-radius: 0; height: 12px; width: 12px; }

.lSSlideOuter .lSPager.lSpg > li.active a, .lSSlideOuter .lSPager.lSpg > li:hover a { background: #19C5A3; }

@media screen and (max-width: 768px) {
    .slider { display: none; }
}

/* = Testimonials
----------------------------------------------------------------------------------------------------------------- */
.testimonials { background: #0B2538; color: #fff; padding-left: 256px; padding-right: 256px; text-align: center; }
.testimonials:after { background: url('/_img/icons/arrow-white.svg') no-repeat bottom right/auto 80%; bottom: 0; content: ''; display: block; height: 100%; opacity: 0.2; position: absolute; right: 0; width: 100%; }
.testimonials h6 { font-weight: 600; text-transform: uppercase; }
.testimonials blockquote { border-left: none; padding-left: 0; }
.testimonials blockquote p { font-size: 1.1em; }
.testimonials blockquote cite { color: #19C5A3; }
.testimonials .prevQuote { background: url(/_img/icons/chevron-left.svg) no-repeat center/contain; cursor: pointer; display: block; height: 27px; left: 124px; position: absolute; top: 50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 8px; z-index: 1; }
.testimonials .nextQuote { background: url(/_img/icons/chevron-right.svg) no-repeat center/contain; cursor: pointer; display: block; height: 27px; position: absolute; right: 124px; top: 50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 8px; z-index: 1; }

@media screen and (max-width: 1520px) {
    .testimonials { padding-left: 96px; padding-right: 96px; }
    .testimonials .prevQuote { left: 41px; }
    .testimonials .nextQuote { right: 41px; }
}

@media screen and (max-width: 1200px) {
    .testimonials { padding-left: 64px; padding-right: 64px; }
    .testimonials .prevQuote { left: 28px; }
    .testimonials .nextQuote { right: 28px; }
}

@media screen and (max-width: 768px) {
    .testimonials:after { background-image: none; }
}

/* = Tabs
----------------------------------------------------------------------------------------------------------------- */
.navtabs { margin-top: 32px; }
.navtabs ul { bottom: 100%; left: 0; list-style: none; margin-bottom: 0; overflow: auto; padding-left: 0; position: absolute; }
.navtabs ul li { float: left; margin: 0 4px 0 0; }
.navtabs ul li a, .navtabs-export a { background: #a8aeb0; color: #fff; display: inline-block; padding: 16px; text-transform: uppercase; vertical-align: bottom; }
.navtabs ul li:hover a, .navtabs ul li.on a { background: #DBE4EC; color: #0b2538; text-decoration: none; }
.navtabs ul li a svg, .navtabs-export a svg { height: 24px; margin-right: 8px; padding: 4px 0; vertical-align: bottom; }
.navtabs ul li:hover a svg path, .navtabs ul li.on a svg path { fill: #0b2538 !important; }
.navtabs + .filteredList { background: transparent; }
.navtabs-export { float: right; margin: 0 0 20px 20px; }
.navtabs-export a { line-height: 24px; padding-left: 41px; position: relative; }
.navtabs-export a::before { background: url(/_img/icons/export_icon.svg) no-repeat center/contain; content: ''; display: block; height: 16px; left: 16px; top: 50%; position: absolute; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 17px; }

@media screen and (max-width: 1200px) {
    .navtabs { margin-top: 48px; }
}

@media screen and (max-width: 960px) {
    .navtabs { margin-top: 64px; }
}

@media screen and (max-width: 480px) {
    .navtabs-export { display: inline-block; float: none; margin-left: 0; }
}

/* = Graph Filters
----------------------------------------------------------------------------------------------------------------- */
.graph-filters span { display: block; margin-bottom: 8px; }
.filteredList .mainList .graph-filters ul li { background: #2d3a41; border-radius: 3px; color: #fff; display: inline-block; font-size: 11px; font-weight: 700; line-height: 22px; padding: 4px 8px 4px 30px; position: relative; }
.filteredList .mainList .graph-filters ul li::before { background: #dbe4ec url(/_img/icons/arrow-right.svg) no-repeat center/auto 10px; border-radius: 50%; content: ''; display: inline-block; height: 16px; left: 8px; position: absolute; top: 50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 16px; }

/* = Report builder new 14/03.23 
----------------------------------------------------------------------------------------------------------------- */
.progress.progress-report li  { font-size: 13px; }

.progress.progress-report li:not(:last-child):after {
    content:'\2192';
    display: inline-block;
    vertical-align: middle;
    margin-left: 14px;
    color: #607D8B;
}

.progress.progress-report li a { font-size: 13px;  padding: 0; color: #607D8B; background: none; background-position: left center; }

.progress.progress-report .progressSuccess a,
.progress.progress-report .progressActive a { color:#0176bf; text-decoration: underline; }

.graph-builder {
    padding: 50px 40px;
    background-color: #fff;
    position: relative;
}

.gb-inner {
    position: relative;
}

.graph-builder .content  { margin-top: 40px; }


.graph-builder--stage1 .btn { min-width:145px; }

.webForm .gp-select, 
.gp-select {
    display: flex;
    justify-content: center;
    margin: 0 auto 20px;
    max-width: 600px;
}

.gp-select .select {
   margin:0; 
}

.gp-select .btn { border-radius: 0 3px 3px 0;}

.gb-radios {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 40px;
}

.gb-reset {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
}

.gb-reset a {
    text-decoration: underline;
}

.graph-builder .graph-filters  ul{ 
 margin:30px 0 15px; 
} 

.graph-builder .graph-filters > span { font-weight: 600;}


.filteredList .mainList .graph-builder .graph-filters ul li {
    margin: 0 10px 0 0;
    padding: 8px 12px;
    line-height: normal;
    font-weight: 600;
}
.filteredList .mainList .graph-builder .graph-filters ul li:before {
 content:none;
}



@media screen and (max-width: 650px) {

    .progress.progress-report li {
        margin-right: 10px;
        font-size: 12px;
    }

    .progress.progress-report li:not(:last-child):after { 
        margin-left: 10px;
    }

    .progress.progress-report li a {
        font-size: 12px;
    }

    .graph-builder {
        padding: 40px 30px;
    }

    .filteredList .mainList  .graph-builder--stage1 li {
        display: block;
        margin: 30px 0 15px;
    }

    .filteredList .mainList .graph-builder--stage1 li:first-child {  margin:0; } 

        .webForm .gb-radios,
        .gb-radios {
            margin:0;
            flex-wrap: wrap;
        }

        .gb-radios > div { width: 100%; margin:0;      text-align: center;}

        .radList  {
            margin:0 0 30px;
        }
}

@media screen and (max-width: 600px) {

    .progress.progress-report li {
        margin-right: 8px;
        font-size: 10px;
    }

    .progress.progress-report li:not(:last-child):after { 
        margin-left: 8px;
    }

    .progress.progress-report li a {
        font-size: 10px;
    } 

    .filteredList .mainList .graph-builder .graph-filters ul li {
        margin: 10px 10px 0 0;
        font-size: 9px;
    }
}

@media screen and (max-width: 480px) {

    .progress.progress-report li {
        margin-right: 6px;
        font-size: 9px;
    }

    .progress.progress-report li:last-child {margin-right: 0;}

    .progress.progress-report li:not(:last-child):after { 
        margin-left: 6px;
    }

    .progress.progress-report li a {
        font-size: 9px;
    } 

    .filteredList .mainList .graph-builder .graph-filters ul li {
        font-size: 9px;
    }
}

@media screen and (max-width: 440px) {
    .graph-builder {
        padding: 40px 25px;
    }

    .filteredList .mainList .graph-builder .graph-filters ul li {
        font-size: 7px;
    }
}