/* brand colours: blue: 1e2171 im: 650260 sd: 006972 cta: f7a933 */ html { margin: 0px; padding: 0px; -webkit-font-smoothing: antialiased; } body { height: auto !important; width: 100%; margin: 0px; padding: 0px; font-family: Plantin, Arial, Sans-Serif; font-weight: normal; font-size: 14px; color: #555; line-height: 24px; position: relative; } body.grey { background: #e5e5e5; } h1 { font-size: 29px; font-family: Plantin, Arial, Sans-Serif; font-weight: normal; line-height: 29px; color: #555; margin: 0; text-transform: uppercase; } h2 { font: 18px/18px JohnstonMdITCTT; color: #333; margin: 0; text-transform: uppercase; letter-spacing: 2px; } h3 { font: 18px/18px JohnstonMdITCTT; color: #333; margin: 0; text-transform: uppercase; letter-spacing: 2px; } h4 { font: 18px/18px JohnstonMdITCTT; color: #333; margin: 0; text-transform: uppercase; letter-spacing: 2px; } h5 { font: 18px/18px JohnstonMdITCTT; color: #333; margin: 0; text-transform: uppercase; letter-spacing: 2px; } img { border: 0px; } a { cursor: pointer; text-decoration: none; color: #f7a933; } a:hover { text-decoration: none; color: #f7a933; } a:focus { outline: none; -moz-outline-style: none; text-decoration: none; } img { max-width: 100%; } .clear { clear: both; height: 0px; padding: 0px; margin: 0px; overflow: hidden; } .clearfix:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } * html .clearfix { height: 1%; } input { outline: none; } .error, .validation, .ErrorLabel { color: red; } .center { text-align: center; } body.noNavItems #SiteTopMenu, body.noNavItems #MobileMenus, body.noNavItems #SiteNav { display:none !important; } .grayBox { background: #e5e5e5; } .orangeBox { background: #f7a933; color: #fff; } .orangeBox h1, .orangeBox h2, .orangeBox h3, .orangeBox h4 { color: #fff; } table { border-left: 1px solid #999999; border-bottom: 1px solid #999999; max-width: 100%; width: auto !important; } table tr td { border-top: 1px solid #999999; border-right: 1px solid #999999; padding: 5px; } .EditMode input[type=text] { background: none !important; } #Site { position: relative; } .orangeLink a { background: #f7a933; display: inline-block; color: #fff; letter-spacing: 2px; border: none; font-weight: normal; padding: 12px 20px; font: 12px/14px JohnstonMdITCTT; text-transform: uppercase; } .largeHeading { line-height: 36px; } .cta-btn { margin-top: 20px; } .cta-btn a { background: #4A4949; padding: 15px 30px; color: #F7A933; font: 12px/12px JohnstonMdITCTT; line-height: 12px; letter-spacing: 2px; text-transform: uppercase; font-weight: 500; } .svgGrey { fill: #4A4A49; } .svgGold { fill: #F7A933; } #SiteHeader { position: relative; z-index: 100; } #SiteHeader #SiteLogo a { display: block; padding-left: 20px; } #SiteHeader #SiteLogo .svg { display: block; max-width: 100%; height: 84px; } #SiteHeader #SiteHeaderTop { padding: 12px 0 15px; position: relative; z-index: 10; background: #fff; width: 100%; } #SiteHeader #SiteHeaderTop.fixed { position: fixed; top: 0; left: 0; padding: 12px 0; max-height: 74px; -webkit-box-shadow: 0px 0px 5px 0px rgba(239,239,239,1); -moz-box-shadow: 0px 0px 5px 0px rgba(239,239,239,1); box-shadow: 0px 0px 5px 0px rgba(239,239,239,1); } #SiteHeader #SiteHeaderTop.fixed #SiteLogo { width: 13%; } #SiteHeader #SiteHeaderTop.fixed #SiteLogo a { padding-left: 0; } #SiteHeader #SiteHeaderTop.fixed #SiteLogo .svg { max-height: 50px; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu { width: 87%; padding-right: 0; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu > .row {display: flex; justify-content: center; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu #SiteTopMenuLeft { text-align: left; width: 100%; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu #SiteTopMenuLeft a { line-height: 50px; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu #SiteTopMenuRight { float: left !important; width: 48%; padding-top: 7px; padding-left: 0; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu #SiteTopMenuRight .topRightArea.right { display: none; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu #SiteTopMenuRight .topRightArea.left { width: 160px; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu #SiteTopMenuRight .login { display: block; float: left; width: 21%; margin-left: 3%; text-align: center; background: #f7a933; color: #fff; letter-spacing: 1px; border: none; height: 35px; font: 12px/35px JohnstonMdITCTT; text-transform: uppercase; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu #SiteTopMenuRight .login .fa { margin-right: 4px; font-size: 15px; line-height: 36px; vertical-align: top; } #SiteHeader #SiteHeaderTop.fixed .mainContent { display: none; } #SiteHeader #SiteHeaderTop.fixed .fixedContent { display: flex; justify-content: flex-end; } #SiteHeader #SiteHeaderTop.fixed .fixedContent a { vertical-align: top; } #SiteHeader #SiteHeaderTop.fixed .fixedContent .fa { font-size: 20px; line-height: 48px; color: #555; } #SiteTopMenu { text-align: right; font-size: 14px; padding: 10px 0 30px 0; } #SiteTopMenu a { font: 12px/35px JohnstonMdITCTT; color: #555; text-transform: uppercase; } #SiteTopMenu #SiteTopMenuLeft a { padding: 0 8px; } #SiteTopMenu #SiteTopMenuLeft a:hover { color: #f7a933; } #SiteTopMenu #SiteTopMenuLeft { width: 48%; } #SiteTopMenu #SiteTopMenuLeft .fixedContent { display: none; } #SiteTopMenu #SiteTopMenuRight { width: 52%; position: relative; z-index: 2; } #SiteTopMenu #SiteTopMenuRight .login { display: none; } #SiteTopMenu #SiteTopMenuRight .topRightArea { float: left; width: 48%; height: 35px; position: relative; z-index: 2; } #SiteTopMenu #SiteTopMenuRight .topRightArea.left { margin-right: 4%; } #SiteTopMenu #SiteTopMenuRight .topRightArea.right { margin-left: 0; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout { display: block; float: left; height: 35px; background: #fff; border: 2px solid #f7a933; text-align: left; position: absolute; top: 0; right: 0; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout a { display: block; float: right; text-align: left; width: 100%; padding: 0 10px; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout a span { display: inline-block; vertical-align: top; line-height: 33px; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout a i { display: inline-block; float: right; margin-left: 12px; width: 15px; line-height: 30px; font-size: 20px; text-align: right; color: #f7a933; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout a i.fa-times { display: none; color: #999; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout.open a i.fa { display: none; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout.open a i.fa-times { display: block; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner { opacity: 0; height: 0; padding: 10px 20px 28px; overflow: hidden; transition: all 0s 0s; -webkit-transition: all 0s 0s; -moz-transition: all 0s 0s; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout.open .topRightPopoutInner { opacity: 1; height: auto; transition: all .5s .5s; -webkit-transition: all .5s .5s; -moz-transition: all .5s .5s; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner .title { margin-bottom: 13px; color: #333; font-family: Plantin; font-size: 16px; line-height: 14px; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner .popoutForm { } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner .popoutForm .popoutFormCol { padding: 0; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner .popoutForm input { width: 100%; height: 42px; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner .popoutForm input[type=text] { padding: 0 10px; border: 1px solid #cfcfcf; font-family: Plantin; } #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner .popoutForm a, #SiteTopMenu #SiteTopMenuRight .topRightArea .topRightPopout .topRightPopoutInner .popoutForm input[type=submit] { background: #f7a933; height: 42px; display: inline-block; border: none; color: #fff; text-transform: uppercase; font: 12px/42px JohnstonMdITCTT; letter-spacing: 1px; } #SiteTopMenu #HeaderPhone { text-align: right; margin-top: 15px; color: #6e7681; font: 20px/22px Plantin; position: relative; z-index: 1; vertical-align: top; } #SiteTopMenu #HeaderPhone .svg { display: inline-block; margin-right: 5px; height: 22px; width: 22px; fill: #6e7681; vertical-align: top; } #SiteTopMenu #HeaderPhone a { display: inline-block; color: #6e7681 !important; text-decoration: none !important; } #SiteTopMenu #HeaderPhone span { display: inline-block; } #SiteHeaderTop.fixed #HeaderPhone { display: none; } #SiteHeader #SiteNav { background: #4a4949; color: #fff; position: relative; z-index: 1; } #SiteHeader #SiteNav #SiteNavInner { position: relative } #SiteHeader #SiteNav a { color: #fff; } #SiteHeader #SiteNav i.fa { color: #fff; font-size: 18px; } #SiteHeader #SiteNav ul { float: left; margin: 0; padding: 0; list-style: none; } #SiteHeader #SiteNav ul li { display: block; float: left; height: 52px; text-align: center; } #SiteHeader #SiteNav ul li a { display: block; max-height: 100%; padding: 0 12px; font: 13px/52px JohnstonMdITCTT; text-transform: uppercase; } #SiteHeader #SiteNav ul li:hover a { background: #6e6e6d; border-bottom: 4px solid #6e6e6d !important; } #SiteHeader #SiteNav ul li.submenu:hover ul { display: block; } #SiteHeader #SiteNav ul li.current a { border-bottom: 4px solid #f7a933; } #SiteHeader #SiteNav ul li.home { color: transparent; font-size: 0px; margin-left: 12px; } #SiteHeader #SiteNav #SiteNavInner > ul > li:first-child i.fa { font-size: 25px; line-height: 52px; } #SiteHeader #SiteNav ul li.submenu i.fa { padding-left: 5px; font-size: 13px; } #SiteHeader #SiteNav ul li.submenu ul { width: 100%; position: absolute; top: 52px; left: 0; display: none; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu { padding: 30px 30px 35px; background: #fff; border-top: 9px solid #6e6e6d; border-bottom: 9px solid #6e6e6d; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuTop { margin-bottom: 20px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuTop .title { font: 28px/28px Plantin; color: #333333; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuTop .subTitle { font: 16px/16px Plantin; color: #898989; margin-top: 5px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .row { margin-left: -10px; margin-right: -10px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol { padding-left: 10px; padding-right: 10px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol.top { padding-top: 20px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol .title { color: #333333; font: 17px/20px Plantin; text-align: left; padding-bottom: 8px; border-bottom: 2px solid #6e6e6d; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol i.fa { display: inline-block; color: #6e6e6d; padding: 0 14px 0 9px; width: 15px; font-size: 18px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol a { background: none; border-bottom: 1px solid #6e6e6d; padding: 13px 10px 10px 0; color: #333333; text-align: left; font: 18px/18px Plantin; text-transform: none; } #SiteHeader #SiteNav ul li:hover ul .megaMenu .menuCol a { border-bottom: 1px solid #e5e5e9 !important; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .form { margin-top: 20px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .form .pound { float: left; width: 14%; text-align: center; color: #333333; font: 36px/50px Plantin; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .form .validation { float: left; padding-left: 14%; width: 100%; text-align: left; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .form input[type=text] { float: left; width: 86%; height: 48px; color: #333333; line-height: 48px; padding: 0 10px; border: 1px solid #6e6e6d; background: #fff; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .form .formRow { padding-bottom: 12px; border-bottom: 1px solid #e5e5e9; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .form input[type=submit] { float: right; background: #f7a933; margin-top: 12px; color: #fff; letter-spacing: 1px; height: 50px; border: none; font-weight: normal; padding: 0 20px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol .navPromo { display: block; padding: 20px 20px 30px; text-align: left; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol .navPromo .top { margin-bottom: 20px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol .navPromo .title { font: 20px/24px Plantin; color: #fff; margin: 0 0 20px; padding: 0; border: none; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol .navPromo .text { font: 15px/20px Plantin; margin-bottom: 20px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol .navPromo a { font: 10px/30px JohnstonMdITCTT; height: 34px; padding: 0 20px; display: inline-block; text-transform: uppercase; letter-spacing: 1px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.purple .menuCol .navPromo { background: #4a4949; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.purple .menuCol .navPromo .text { color: #fff; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.purple .menuCol .navPromo a { border: 2px solid #fff !important; color: #fff; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.blue .form input[type=text] { float: none; width: 100%; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.blue .form .formRow { border: none; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.blue .menuCol .navPromo { text-align: center; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.blue .menuCol .navPromo { background: #fff; border: 2px solid #6e6e6d; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.blue .menuCol .navPromo .title { color: #333333; text-align: left; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.blue .menuCol .navPromo .text { color: #333333; text-align: left; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu.blue .menuCol .navPromo a { border: 2px solid #6e6e6d !important; color: #333333; } #SiteHeader #SiteNavLogin { float: right; height: 52px; background: #6e6e6d; } #SiteHeader #SiteNavLogin a { display: block; height: 100%; padding: 17px 18px; font: 13px/19px JohnstonMdITCTT; text-transform: uppercase; } #SiteHeader #SiteNavLogin a i, #SiteHeader #SiteNavLogin a span { float: left; margin: 0 1px; } #SiteHeader #SiteNavLogin a i { margin-right: 5px; } #SiteMain { position: relative; z-index: 10; } #HomeBanner { height: 600px; background: #fff; text-align: center; overflow: hidden; position: relative; } #HomeBanner .image { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; background-size: 100% auto; background-size: cover; background-position: top center; } #HomeBanner .content { position: relative; z-index: 2; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); } #HomeBanner .content h1 { color: #4a4949; font: 36px/40px Plantin; text-transform: none; margin-bottom: 25px; padding: 0 10px; } #HomeBanner .content h2 { display: inline-block; } #HomeBanner .content a { display: inline-block; position: relative; width: 250px; margin: 0 20px; padding: 15px 0; border: 2px solid #f7a933; color: #4a4949; text-transform: uppercase; font: 12px/14px JohnstonMdITCTT; letter-spacing: 2px; transition: 0.8s; } #HomeBanner .content a:after { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: #fff; opacity: 1; content: " "; z-index: -1; } #HomeBanner .content a:hover { background: #fff; } #HomeIPOs { padding: 35px 0 40px; text-align: center; } .ipoItem { padding: 0 50px; } .ipoItem a { padding: 10px 20px; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; display: inline-block; } .ipoItem .title { color: #f7a933; font: 20px/22px Plantin; margin: 15px 0 10px; } .ipoItem .text { color: #555555; font: 16px/18px Plantin; } .ipoItem .text img { display: inline-block; margin: 10px 0; float: none !important; } #GetInTouch { background: #4a4949; padding: 40px 0; text-align: center; } #GetInTouch.split { padding: 0; } #GetInTouch.split .item { padding: 40px 8%; } #GetInTouch.split .item.left { border-right: 1px solid #fff; } #GetInTouch .svg { max-height: 55px; margin-bottom: 15px; } #GetInTouch .svg path, #GetInTouch.split .svg path { fill: #f7a933; } #GetInTouch .touch { text-transform: uppercase; color: #fff; font: 16px/16px JohnstonMdITCTT; margin-bottom: 15px; letter-spacing: 2px; } #GetInTouch .phone, #GetInTouch a { color: #fff; font: 30px/30px Plantin; } #GetInTouch .form { margin-top: 35px; } #GetInTouch .form .branch { margin-bottom: 15px; font: 16px/22px Plantin; color: #fff; } #GetInTouch .form input[type=text] { vertical-align: top; padding: 0 10px; display: inline-block; width: 260px; border: 1px solid #e0e0e8; border-right: none; background: #fff; color: #666666; font: 14px/50px Plantin; height: 50px; } #GetInTouch .form input[type=submit] { vertical-align: top; display: inline-block; background: #f7a933; color: #fff; letter-spacing: 2px; height: 50px; border: none; font-weight: normal; padding: 0 25px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } #GetInTouch.split .form input[type=text] { width: 200px; } #GetInTouch.split .form { margin-top: 0; } #Footer { background: #4a4949; color: #fff; } #Footer #FooterTop { background: #fff; padding: 50px 0; } #Footer #FooterTop a { color: #4a4949; display: block; font-size: 14px; line-height: 16px; margin-bottom: 15px; } #Footer #FooterTop a:hover { color: #f7a933; } #Footer #FooterTop .right { display: flex; flex-wrap: wrap; } #Footer #FooterTop .right a { display: inline-block; margin: 0 10px 0 0; } #Footer #FooterTop .right a svg, #Footer #FooterTop .right a img { width: 40px; } #Footer #FooterTop .title { color: #f7a933; font: 14px/14px JohnstonMdITCTT; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 22px; width: 100%; } #Footer #FooterTop .title a { color: #f7a933; } #Footer #FooterBottom { padding: 50px 0; color: #fff; font-size: 14px; line-height: 24px; } #Footer #FooterBottom .svg { display: block; max-width: 100%; max-height: 72px; } #Footer #FooterBottom .svg .svgGrey { fill: #fff; } #InnerBanner { background: #000; text-align: center; overflow: hidden; position: relative; } #InnerBanner.widget { padding-top: 40px; padding-bottom: 20px; } #InnerBanner .image { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; } #InnerBanner .image img { max-width: none; } #InnerBanner .content { position: relative; z-index: 2; padding-bottom: 28px; } #InnerBanner .content .svg { max-height: 30px; } #InnerBanner .content .svg path { fill: #fff; } #InnerBanner .content h3 { color: #1e2171; font: 14px/14px JohnstonMdITCTT; letter-spacing: 2px; text-transform: uppercase; margin-top: 5px; } #InnerBanner .content h1 { color: #fff; font: 40px/44px Plantin; text-transform: none; margin: 12px 0 20px; padding: 0 10px; } #InnerBanner .content .text { font: 18px/24px Plantin; color: #fff; margin: 0 12%; } #InnerBanner .content .text strong { font-weight: normal; font-family: Plantin; } #InnerBanner .content .text a { color: #fff; font-family: Plantin; } #InnerBanner .content .button { margin: 35px 0 45px; position: relative; display: inline-block; border: 2px solid #cdc3c9; padding: 18px 20px 18px 40px; color: #fff; text-transform: uppercase; font: 13px/16px JohnstonMdITCTT; vertical-align: top; letter-spacing: 2px; transition: 0.8s; } #InnerBanner .content .button:after { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: #650260; opacity: 0.4; content: " "; z-index: -1; } #InnerBanner .content .button:hover { background: #fff; color: #000; } #InnerBanner .content .button .fa { font-size: 36px; line-height: 13px; vertical-align: top; margin-left: 20px; } #InnerBanner .content .arrow { font-size: 60px; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; } #InnerBanner .content .arrow a { color: #f6b9ea; } #InnerBanner .content .arrow .fa { line-height: 23px; } .pageBanner, .pageBannerWrapper { text-align: center; overflow: hidden; position: relative; background-color: #000; background-size: 100% auto; background-size: cover; background-position: top center; background-repeat: no-repeat; } .pageBanner { height: auto; min-height: 650px; } .pageBanner .pageBanner__image { position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-fit: cover; height: 100%; width: 100%; } .pageBanner .pageBanner__image--mobile { display: none; } .pageBanner.branch { height: auto; min-height: 0; background: #fff; } #Site .pageBanner.branch .inner h1 { color: #333333; margin: 0 0 10px; font-family: JohnstonMdITCTT; letter-spacing: 2px; text-transform: uppercase; } #Site .pageBanner.branch .inner { top: auto; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; position: relative; padding-top: 0; } .pageBanner.small { min-height: 250px; } .pageBannerWrapper .pageBanner { background-color: transparent; background-color: initial; } /*.pageBanner.widget {padding-top:40px; padding-bottom:20px;}*/ .pageBanner .breadcrumb { text-align: left; font: 12px/12px Plantin; color: #cccccc; position: relative; z-index: 2; margin: 18px 0 18px 30px; } .pageBanner.small .breadcrumb { position: absolute; top: 0; left: 0; width: 100%; } .pageBanner .breadcrumb a { color: #cccccc; } .pageBanner .breadcrumb .fa { margin: 0 2px; } .pageBanner .inner { z-index: 1; padding-top: 30px; padding-bottom: 30px; position: absolute; width: 100%; top: 50%; left: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 2; } /*.pageBanner.small .inner{position:static; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none;}*/ .pageBanner .inner .svg { max-height: 30px; } .pageBanner .inner .svg path { fill: #fff; } .pageBanner .inner h3 { color: #1e2171; font: 14px/14px JohnstonMdITCTT; letter-spacing: 2px; text-transform: uppercase; margin-top: 20px; } .pageBanner .inner h1, .pageBanner .inner h2 { color: #fff; font: 40px/44px Plantin; text-transform: none; margin: 20px 0; padding: 0 10px; } .pageBanner .inner h3 + h1 { margin-top: 12px; } .pageBanner .inner .text { font: 18px/24px Plantin; color: #fff; margin: 0 12% 20px; } .pageBanner .inner .text strong { font-weight: normal; font-family: Plantin; } .pageBanner .inner .text a { color: #fff; font-family: Plantin; } .pageBanner .inner .button { margin: 35px 0 45px; position: relative; display: inline-block; border: 2px solid #f7a933 !important; padding: 18px 20px 18px 40px; color: #555 !important; text-transform: uppercase; font: 13px/16px JohnstonMdITCTT; vertical-align: top; letter-spacing: 2px; transition: 0.8s; background: #fff; } .pageBanner .inner .button:after { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: #555; background: none; opacity: 0.4; content: " "; z-index: -1; } .pageBanner .inner .button:hover { background: #fff; color: #000; } .pageBanner .inner .button .fa { font-size: 36px; line-height: 13px; vertical-align: top; margin-left: 20px; } .pageBanner .inner .arrow { font-size: 60px; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; } .pageBanner .inner .arrow a { color: #f6b9ea; } .pageBanner .inner .arrow .fa { line-height: 23px; } .pageBanner.sd .inner .svg path { fill: #006972; } .pageBanner.sd .inner h3 { color: #1e2171; } .pageBanner.sd .inner h1 { color: #006972; } .pageBanner.sd .inner .button { margin: 15px 0; border-color: #006972; color: #006972; } .pageBanner.markets .inner .svg path { fill: #006972; } .pageBanner.markets .inner h3 { color: #1e2171; } .pageBanner.sdComps .inner .svg path { fill: #006972; } .pageBanner.sdComps .inner h3 { color: #1e2171; } .pageBanner.faq h2 { color: #fff; text-transform: none; margin: 12px 0 0; padding: 0 10px; } .pageBanner.faq h3 { color: #1e2171; } .pageBanner.branch h3 { color: #1e2171; } .pageBanner.ipo .inner .button { margin: 30px 0 0; color: #c4c7d9; border-color: #9095b0; } .pageBanner.mark .inner .svg path { fill: #006972; } .pageBanner.mark .inner h3 { color: #1e2171; } .pageBanner.brochures h2 { color: #fff; text-transform: none; margin: 12px 0 0; padding: 0 10px; } .pageBanner.brochures h3 { color: #1e2171; } .pageBanner.careers h2 { color: #fff; text-transform: none; margin: 12px 0 0; padding: 0 10px; } .pageBanner.careers h3 { color: #1e2171; } .pageBanner.contact h3 { color: #1e2171; } .pageBanner.isa h1 { color: #1e2171; margin-bottom: 0; } .pageBanner.isa h3 { color: #1e2171; } .pageBanner.isa .inner .button { margin-bottom: 0; border-color: #1e2171; color: #1e2171; } .pageBanner.isa .inner .button:after { background: transparent; } /*.pageBannerWrapper #IsaBannerBlue{ position: absolute; width: 100%; left: 0; bottom: 0;}*/ #SearchBranch { background: #f7a933; color: #fff; text-align: center; padding: 15px 0; } #SearchBranch .call { display: inline-block; vertical-align: top; padding: 12px 15px 0 5px; font: 18px/18px Plantin; } #SearchBranch .call .thin { font-size: 16px; } #SearchBranch .search { display: inline-block; vertical-align: top; } #SearchBranch .search input[type=text] { display: inline-block; height: 41px; border: none; background: #fff; color: #626262; font: 14px/37px Plantin; padding: 0 10px; vertical-align: top; } #SearchBranch .search input[type=submit] { display: inline-block; height: 41px; border: none; background: #4a4949; color: #fff; text-transform: uppercase; letter-spacing: 2px; padding: 0 15px; font: 12px/37px JohnstonMdITCTT; vertical-align: top; } .contentArea { padding: 40px 0; font: 16px/24px Plantin; text-align: center; } .contentArea.grey { background: #4a4949; color: #fff; } .contentArea.grey h2, .contentArea.grey h3 { color: #f7a933; } #USP { padding: 35px 0 50px; background: #4a4949; } #USP h2 { color: #fff; text-transform: uppercase; font: 24px/24px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } .imTopItem { margin-top: 40px; position: relative; } .imTopItem .image { float: left; width: 20%; margin-right: 4%; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); } .imTopItem .image img { max-height: 75px; max-width: 100% !important; } .imTopItem .text { float: left; width: 76%; color: #fff; font: 16px/24px Plantin; text-align: left; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); } #InnerBanner .imTopItem .image { top: 50%; height: auto; } #Breadcrumb { text-align: left; font: 12px/12px Plantin; color: #cccccc; text-transform: none; position: relative; z-index: 2; margin: 18px 0 18px 30px; } #Breadcrumb a { color: #cccccc; } #Breadcrumb .fa { margin: 0 2px; } .datetime-ui-datepicker table { background-color: #fff; padding: 15px; display: block; border: 1px solid #000; } .datetime-ui-state-active { border: 1px solid #000; } #ui-datepicker-div .action-buttons .btn:nth-child(1), #ui-datepicker-div .action-buttons .btn:nth-child(2) { display: none; } #ui-datepicker-div .action-buttons .btn { float: right; -webkit-appearance: none; appearance: none; background-color: #f7a933; color: #fff; border-radius: 10px; padding: 0 30px; line-height: 46px; border: 0; font-weight: 700; } .mps-datepicker .control-group-inline { position: relative; } .mps-datepicker .icon-only.btn-icon { background-color: transparent; -webkit-appearance: none; appearance: none; width: auto; height: auto; text-align: left; border: none; outline: none; position: absolute; top: 0; left: 0; right: 0; height: 40px; z-index: 3; width: 100%; } /*.mps-datepicker .icon-only.btn-icon .sr-only { position:static; width:auto; margin: auto; clip:inherit; -webkit-appearance:none; appearance:none; background-color:#f7a933; color:#fff; border-radius: 10px; padding: 0 30px; line-height: 46px; border:0; font-weight: 700; display:block; height: auto; outline:none; }*/ .mps-datepicker .CalendarTextBox { margin-bottom: 10px; } #ui-datepicker-div .datetime-ui-widget-header { background-color: #fff; } .mpsForm:before { height: 400px; width: 100%; background-repeat: no-repeat; background-size: cover; background-image: url(/SiteFiles/Images/mpsimg3.jpg); content: ''; position: absolute; top: 0; left: 0; right: 0; background-position: center; } .mpsForm { margin-bottom: 70px; color: #000; position: relative; padding-top: 440px; overflow: hidden; } .mpsForm .panel.leftPanel { margin-right: 15px; } .mpsForm .panel.rightPanel { margin-left: 15px; } .mpsForm .form .row { width: 100%; } .mpsForm .form .row span.validation { color: red; } .mpsForm .form .row label, .mpsForm .form .row span { color: #000; font-weight: 700; } .mpsForm .form .row label span { color: #000; } .mpsForm input[type=submit] { -webkit-appearance: none; appearance: none; border: none; } .mpsForm .colouredSection .title { } .mpsForm .title { margin-bottom: 20px; margin-top: 20px; } .mpsForm .text { text-align: left; margin: 20px 0; } .mpsForm ul { list-style-position: inside; } .mpsForm li { margin-left: -40px; } .mpsForm ul.docTypes a { font-family: JohnstonMdITCTT; } .mpsForm .agreeTitle { font-size: 30px; text-align: center; font-weight: 400; margin-bottom: 30px; margin-top: 30px; } .mpsForm .smallTitle { margin-bottom: 15px; } .mpsForm .checkboxes { margin-bottom: 20px; } .mpsForm .checkboxes .checkbox { display: block; margin: 10px 0; } .mpsForm .checkboxes .checkbox label { } .mpsForm input[type=checkbox] { display: none; } .mpsForm .infoPanel { position: absolute; right: 20px; top: 11px; border-radius: 50%; color: #fff; background-color: #f7a933; line-height: 18px; width: 18px; text-align: center; z-index: 5; } .mpsForm .infoPanel .infoText { width: 300px; height: auto; padding: 20px; background-color: #eee; color: #000; position: absolute; bottom: 100%; left: 100%; display: none; border-radius: 10px; -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3); box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3); z-index: 5; text-align: left; font-size: 14px; } .mpsForm .infoPanel:focus .infoText, .mpsForm .infoPanel:hover .infoText { display: block; } .mpsForm .imageRight { float: right; margin-left: 10px; } .mpsForm .image { float: left; } .mpsForm .colouredSection { background: #eee; padding: 25px 10px 5px 10px; margin-bottom: 15px; } .mpsForm .colouredSection.extraPadding { padding-bottom: 25px; } .mpsForm .inputSlider { padding-left: 10px; } .mpsForm .inputSlider .radioButtons { display: none; } .mpsForm .inputSlider .ui-slider { height: 11px; top: 0px; border-width: 1px; border-style: solid; border-color: rgb(110,110,110); border-image: initial; border-radius: 1px; background: #fff; width: calc(100% - 100px); display: inline-block; vertical-align: middle; } .mpsForm .inputSlider .ui-slider .ui-slider-handle { border: 2px solid #6e6e6d; height: 22px; width: 22px; top: 0; margin-left: -11px; margin-top: -7px; border-radius: 50%; background-color: #fff; outline: none; } .mpsForm .inputSlider .inputSliderGrowthRateValue { display: inline-block; width: 60px; margin-left: 30px; height: 60px; background-color: #333; color: #fff; font-weight: 700; border-radius: 10px; text-align: center; position: relative; vertical-align: middle; } .mpsForm .inputSlider .inputSliderGrowthRateValue .value { font-weight: 700; color: #fff; } .mpsForm .inputSlider .inputSliderGrowthRateValue .valText { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); left: 0; right: 0; text-align: center; } .mpsForm .inputSlider .ui-slider .ui-slider-range { background-color: #f7a933; } .mpsForm .inputSlider .values { width: calc(100% - 100px); position: relative; top: -15px; } .mpsForm .inputSlider .values .right, .mpsForm .inputSlider .values .left { display: inline-block; } .mpsForm .inputSlider .values .right { float: right; } .mpsForm .form select { -webkit-appearance: none; appearance: none; } .mpsForm .form select::-ms-expand { display: none; } .mpsForm .form .ddStyle { position: relative; } .mpsForm .form .ddStyle:before { content: ''; right: 10px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #000 transparent transparent transparent; position: absolute; } .mpsForm .sectionStyle { } .mpsForm .sectionStyle .title { display: inline-block; vertical-align: middle; } .mpsForm .form input[type=submit].plusIcon { display: inline-block; margin-left: 20px; vertical-align: middle; width: auto; } .mpsForm .figures .figure { margin: 20px 0; text-align: center; } .mpsForm .figures .figure .statLine { width: 2px; display: inline-block; position: relative; height: 100px; background-color: #f7a933; vertical-align: bottom; } .mpsForm .figures .figure .stat { height: auto; position: absolute; background-color: #fff; } .mpsForm .figures .figure .leftStat { top: 0; right: 100%; } .mpsForm .figures .figure .rightStat { top: 45px; left: 100%; } .mpsForm .figures .figure .bottomLine { width: 100%; background-color: #000; height: 2px; } .mpsForm .figures .figure1 .leftStat { padding-right: 10px; } .mpsForm .figures .figure1 .rightStat { padding-left: 10px; } .mpsForm .figures .figure2 .leftStat { padding-right: 20px; } .mpsForm .figures .figure2 .rightStat { padding-left: 20px; } .mpsForm .figures .figure3 .leftStat { padding-right: 30px; } .mpsForm .figures .figure3 .rightStat { padding-left: 30px; } .mpsForm .figures .figure4 .leftStat { padding-right: 40px; } .mpsForm .figures .figure4 .rightStat { padding-left: 40px; } .mpsForm .figures .figure5 .leftStat { padding-right: 50px; } .mpsForm .figures .figure5 .rightStat { padding-left: 50px; } .mpsForm .buttons { text-align: center; } .mpsForm .buttons .button { margin: 0 15px; } .mpsForm .isaFancybox, .mpsForm .button { line-height: 50px; padding: 0 25px; background-color: #f7a933; color: #fff; display: inline-block; text-align: center; font-weight: 400; text-transform: uppercase; border-radius: 0px; font-size: 12px; letter-spacing: 1px; } .mpsForm .chkInit input { visibility: hidden; pointer-events: none; } .mpsForm .radio_2x2 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; } .mpsForm .radio_2x2 li { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-preferred-size: calc(50% - 30px); flex-basis: calc(50% - 30px); -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: flex-start; text-align: left; margin: 0 15px 15px 0px; } .mpsForm .radioButtons { margin: auto; list-style-type: none; padding: 0; } .mpsForm .radioButtons li { margin-left: 0; } .mpsForm input[type=checkbox] + label, .mpsForm .radioButtons li label { display: block; position: relative; padding-left: 30px; padding-bottom: 10px; padding-top: 0; } .mpsForm input[type=checkbox] + label:after, .mpsForm .radioButtons li label::after { content: ''; position: absolute; left: 0; top: 2px; height: 20px; width: 20px; border: 1px solid #000; } .mpsForm .radioButtons li input { display: none; } .mpsForm input[type=checkbox]:checked + label::before, .mpsForm .radioButtons li input:checked + label::before { content: '\2713'; height: 16px; width: 16px; font-size: 18px; top: 1px; left: 3px; position: absolute; color: #f7a933; font-weight: 700; } .mpsForm .redmayneBullets { list-style-type: none; padding: 0; margin: 0; } .mpsForm .redmayneBullets li { padding-left: 20px; position: relative; margin: 10px 0; } .mpsForm .redmayneBullets li span { display: block; margin: 5px 0; padding-left: 30px; } .mpsForm .redmayneBullets li::before { top: 11px; left: 0; content: '\2022'; color: #f7a933; position: absolute; line-height: 0; } .mpsForm .alignRight { text-align: right; margin-top: 20px; } .mpsForm .graphRow { position: relative; z-index: 4; } .mpsForm .graph5050 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; margin: 0px 0; } .mpsForm .graph50 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-preferred-size: calc(50% - 15px); flex-basis: calc(50% - 15px); -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: flex-start; text-align: left; justify-content: center; position: relative; } .mpsForm .graph { position: relative; overflow: hidden; } .mpsForm .graph.questionGraph { transform: translateY(-65px); } .mpsForm .line { position: absolute; top: 0; left: -100%; right: 100%; bottom: 0; z-index: -2; -webkit-animation: animatelines 7.5s infinite; animation: animatelines 7.5s infinite; /*transition: left ease 4s, right ease 4s; -webkit-transition: left ease 4s, right ease 4s;*/ } .mpsForm .loaded .line { left: 0; right: 0; } .mpsForm .questionGraph .line { z-index: 1; } .mpsForm .graphBaseImg { position: relative; } .mpsForm .graphBaseImg:before { position: absolute; width: 19.5%; background-color: #fff; top: 0; bottom: 0; left: 0; z-index: -1; content: ''; } .mpsForm .questionGraph .graphBaseImg:before { background-color: #eee; z-index: 2; } .mpsForm .questionGraph .graphBaseImg img { z-index: 3; position: relative; } .mpsForm .yaxis, .mpsForm .xaxis, .mpsForm .yInfo { position: absolute; } @-webkit-keyframes animatelines { 35% { left: 0; right: 0; } 100% { left: 0; right: 0; } } @keyframes animatelines { 35% { left: 0; right: 0; } 100% { left: 0; right: 0; } } .mpsForm .yaxis { left: -20px; } .mpsForm .yaxis .axisInfo { display: block; margin: 10px 0; text-align: center; } .mpsForm .form input[type=text].amountInput { max-width: 400px; } .mpsForm .panels { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; } .mpsForm .panel { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-preferred-size: calc(50% - 15px); flex-basis: calc(50% - 15px); -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: flex-start; text-align: left; } .mpsForm .otherTxt input[type=text] { margin-bottom: 5px; } .mpsForm .smallText { color: #000; font-size: 9px; display: inline-block; vertical-align: top; margin-left: 2px; margin-top: -2px; } .mpsForm .smallText.left { margin-left: 0; margin-right: 2px; } .mpsForm .text { font-size: 16px; line-height: 22px; } .mpsForm .date input[type=text] { width: 300px; } .mpsForm .sortCodeBoxes input[type=text] { width: 50px; min-width: 50px; max-width: 50px; display: inline-block; margin: 0 5px; } .mpsForm .sortCodeBoxes input[type=text]:nth-child(1) { margin-left: 0; } .mpsForm .buttonsHolder { margin: 20px 0; text-align: right; } .mpsForm .buttonsHolder input + input { float: right; } .mpsForm .buttonsHolder input.cancelButton { background-color: #333; } .mps-thankyou { margin: 100px 0; text-align: center; } .contractSignature { max-width: 700px; margin-right: auto; margin-top: 10px } .contractSignature .signature { width: 100%; padding-top: 40%; position: relative; margin: auto; background-color: #f4f5f9; } .contractSignature .signature canvas { position: absolute; top: 0; left: 0; outline: 1px solid #000; } .contractSignature .signature:before { content: ''; position: absolute; bottom: 10%; width: 80%; left: 10%; border-top: 2px dotted #000; pointer-events: none; } .contractSignature .signature .delete { position: absolute; top: 2px; right: 2px; color: #f7a933; font-size: 32px; width: auto; text-align: center; cursor: pointer; font-weight: 700; } .contractSignature .signature .delete::before { content: 'Clear'; font-size: 16px; line-height: 1; display: inline-block; margin-right: 5px; vertical-align: middle; } .contractSignature .signature .delete::after { content: "\2715"; font-size: 16px; line-height: 1; display: inline-block; vertical-align: middle; } #MpsCalculatorPopup { padding: 30px; color: #666666; font: 16px/18px Plantin; } #MpsCalculatorPopup .title { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #9899a9; } #MpsCalculatorPopup .title svg { float: left; width: 8%; padding-right: 20px; } #MpsCalculatorPopup .title .right { float: left; width: 92%; } #MpsCalculatorPopup .title .right h1 { margin-bottom: 10px; color: #1f1f1f; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #MpsCalculatorPopup .title .right h2 { color: #666666; font: 16px/18px Plantin; text-transform: none; } #MpsCalculatorPopup .isaRow { margin-bottom: 12px; } #MpsCalculatorPopup .isaRow .left { float: left; width: 50%; padding-right: 30px; padding-top: 10px; } #MpsCalculatorPopup .isaRow .right { float: left; width: 50%; } #MpsCalculatorPopup .isaRow .right .sign { float: left; width: 8%; color: #333333; font: 24px/40px Plantin; } #MpsCalculatorPopup .isaRow .right input[type=text] { width: 92%; height: 40px; font: 16px/40px Plantin; border: 1px solid #6e6e6d; background: #fff; color: #333333; padding: 0 10px; } #MpsCalculatorPopup .isaRow .right.split input[type=text] { width: 44%; margin-right: 2%; } #MpsCalculatorPopup .isaRow .right select { width: 44%; height: 40px; font: 16px/40px Plantin; border: 1px solid #6e6e6d; background: #fff; color: #333333; padding: 0 10px; } #MpsCalculatorPopup .isaRow .right .ui-slider { float: left; width: 70%; margin-top: 8px; border: 1px solid #6e6e6d; border-radius: 1px; background: #fff; height: 11px; top: 0; } #MpsCalculatorPopup .isaRow .right .ui-slider .ui-widget-header { background: #f7a933; border-radius: 0; } #MpsCalculatorPopup .isaRow .right .ui-slider .ui-slider-handle { border: 2px solid #6e6e6d; height: 22px; width: 22px; top: 0; margin-left: -11px; margin-top: -7px; border-radius: 50%; background: #fff; outline: none; } #MpsCalculatorPopup .isaRow .right .values { float: left; width: 70%; padding-top: 8px; } #MpsCalculatorPopup .isaRow .right .values .left { padding: 0; } #MpsCalculatorPopup .isaRow .right .values .right { padding: 0; text-align: right; } #MpsCalculatorPopup .isaRow .helpDrop { display: none; margin-top: 10px; font: 12px/14px Plantin; } #MpsCalculatorPopup .isaRow .right .value { float: right; width: 17%; margin-left: 5%; padding-top: 8px; background: #4a4949; color: #fff; height: 42px; text-align: center; font: 24px/24px Plantin; } #MpsCalculatorPopup .isaRow .right .value.years { position: relative; font: 24px/24px Plantin; padding-top: 5px; } #MpsCalculatorPopup .isaRow .right .value.years:after { position: absolute; bottom: 4px; left: 0; width: 100%; content: "Years"; text-transform: uppercase; font: 10px/10px Plantin; } #MpsCalculatorPopup .results { margin: 35px -2px 0; color: #333; } #MpsCalculatorPopup .results .col { float: left; width: 33.3333%; padding: 0 2px; text-align: center; } #MpsCalculatorPopup .results .col.two { width: 66.6666%; } #MpsCalculatorPopup .results .col .inner { padding: 20px; color: #fff; } #MpsCalculatorPopup .results .col.one .inner { background: #4a4949; } #MpsCalculatorPopup .results .col.two .inner { background: #f7a933; } #MpsCalculatorPopup .results .col.three .inner { background: #f7a933; } #MpsCalculatorPopup .results .col .title { height: 45px; padding: 0; margin-bottom: 20px; border: none; font: 16px/20px Plantin; } #MpsCalculatorPopup .results .col .value { font: 24px/24px Plantin; } .mpsForm .countryNo span { float: left; width: 20px; margin-right: 10px; font-weight: 400; line-height: 40px; } .mpsForm .countryNo input { float: right; width: calc(100% - 30px) !important; } .terms { background: #fff; padding: 0px 0 40px; } .terms .container { padding: 0 80px; } .terms .termsLogo { float: left; width: 6%; margin-right: 2.5%; } .terms .termsLogo .svg { max-height: 47px; } .terms .termsLogo .svg path { fill: #999999; } .terms .termsText { float: left; width: 91.5%; color: #333333; font: 16px/22px Plantin; } .terms .termsText a { color: #1e2171; font-family: Plantin; } .terms .termsText a:hover { text-decoration: underline; } .slidePanel .slideItem.right { background: linear-gradient(to right, rgba(254,242,224,1) 0%, rgba(254,242,224,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); } .slidePanel .slideItem.left { background: linear-gradient(to left, rgba(254,242,224,1) 0%, rgba(254,242,224,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); } .slidePanel { background: #fff; overflow: hidden; } .slidePanel .content { padding: 90px 80px 0 90px; background: #fef2e0; } .slidePanel .content .heading { color: #666666; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; margin: 0 0 5px 0; letter-spacing: 2px; } .slidePanel .content .headingBottom .svg { float: left; width: 10%; max-height: 20px; margin-right: 5%; vertical-align: bottom; } .slidePanel .content .headingBottom .svg path { fill: #650260; } .slidePanel .content .headingBottom h2 { float: left; width: 85%; color: #4a4949; font: 18px/20px JohnstonMdITCTT; text-transform: uppercase; vertical-align: bottom; letter-spacing: 2px; } .slidePanel .content .text { color: #333333; font: 16px/24px Plantin; margin: 30px 0 40px; } .slidePanel .content a { padding: 15px 30px; background: #4a4949; color: #f7a933; font: 12px/37px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } .slidePanel .image { padding: 0; position: relative; } .slidePanel .image img { position: relative; z-index: 1; max-width: none; } .slidePanel .image .contentHolder { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .slidePanel .image .content { position: absolute; z-index: 2; top: 0; width: 100%; height: 100%; padding: 90px 80px 0; } .slidePanel .image .content .text { margin-top: 0; } .slidePanel .right .image img { float: left; } .slidePanel .left .image img { float: right; } .slidePanel .right .image .content { left: -100%; } .slidePanel .left .image .content { right: -100%; } #ProductSliderHolder { padding: 70px 0 40px; text-align: center; background: #e5e5e5; } #ProductSliderHolder h2 { color: #333333; font: 18px/18px JohnstonMdITCTT; text-transform: uppercase; margin-bottom: 15px; letter-spacing: 2px; } #ProductSliderHolder .text { color: #666666; font: 16px/20px Plantin; margin-bottom: 40px; } #ProductSliderHolder .productSliderPrev { background: #fff; padding: 40px 70px 30px; -webkit-box-shadow: 0px 0px 4px 0px rgba(153,153,153,0.5); -moz-box-shadow: 0px 0px 4px 0px rgba(153,153,153,0.5); box-shadow: 0px 0px 4px 0px rgba(153,153,153,0.5); } #ProductSliderHolder .productSliderPrev .image { height: 45px; } #ProductSliderHolder .productSliderPrev .image .svg { max-height: 100%; max-width: 57px; } #ProductSliderHolder .productSliderPrev .image path { fill: #f7a933; } #ProductSliderHolder .productSliderPrev h3 { margin: 20px 0 30px; color: #333333; font: 16px/22px JohnstonMdITCTT; text-transform: uppercase; min-height: 44px; letter-spacing: 2px; } #ProductSliderHolder .productSliderPrev a { padding: 15px 30px; color: #f7a933; background: #4a4949; font: 12px/37px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #ProductSliderHolder .slick-dots li { width: 12px !important; height: 12px !important; } #ProductSliderHolder .slick-dots li button { height: 12px !important; width: 12px !important; background: #999999 !important; border-radius: 6px !important; } #ProductSliderHolder .slick-dots li.slick-active button { background: #650260 !important; } .newsCharity { background: #fff; margin-bottom: 10px; } .newsCharity img { float: left; width: 25%; } .newsCharity .content { float: left; width: 75%; padding: 15px 15px 10px 30px; } .newsCharity .content .title { margin-bottom: 8px; font: 18px/20px Plantin; color: #333333; } .newsCharity .content .title a { color: #333333; } .newsCharity .content .date { font: 16px/16px Plantin; color: #666666; border-left: 2px solid #f7a933; padding: 2px 0 0 8px; } #Events .newsCharity { background: #f7f7f7; } .newsLarge a { position: relative; display: block; } .newsLarge img { position: relative; z-index: 1; width: 100%; } .newsLarge .content { position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; padding: 30px; } .newsLarge .content .back { position: absolute; z-index: 1; width: 100%; height: 100%; top: 0; left: 0; background: #fef2e0; opacity: 0.8; } .newsLarge .content .inner { position: relative; z-index: 2; } .newsLarge .content .date { margin-bottom: 10px; color: #4a4949; font: 16px/16px Plantin; display: block; position: relative; z-index: 2; } .newsLarge .content .title { color: #333; font: 22px/28px Plantin; position: relative; z-index: 2; } /* Media centre template */ #InnerBanner.media .content { padding: 20px 0 50px; } #MediaCentre #Promos { background: #f7f7f7; } #MediaCentre #MediaTop { padding: 50px 0; font: 18px/24px Plantin; color: #333333; background: linear-gradient(to right, rgba(254,242,224,1) 0%, rgba(254,242,224,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); text-align: center; } #MediaCentre #MediaTop h2 { font: 18px/22px JohnstonMdITCTT; text-transform: uppercase; margin-bottom: 30px; letter-spacing: 2px; } #MediaCentre #MediaTop .left { color: #333; padding: 0 40px; } #MediaCentre #MediaTop .left h2 { color: #333; } #MediaCentre #MediaTop .left a { padding: 15px 20px; background: #4a4949; display: inline-block; color: #f7a933; text-transform: uppercase; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } #MediaCentre #MediaTop .right { padding: 0 40px; } #MediaCentre #MediaTop .right .quote { padding: 5px 0 5px 30px; } #MediaCentre #MediaTop .right .quote .text { position: relative; } #MediaCentre #MediaTop .right .quote .name { margin-top: 15px; color: #666; font-size: 14px; line-height: 16px; } #MediaCentre #MediaTop .right .quote svg { fill: #8d8ea4; position: absolute; width: 30px; height: 30px; padding: 0; } #MediaCentre #MediaTop .right .quote .left { top: -4px; left: -30px; } #MediaCentre #MediaTop .right .quote .right { bottom: -4px; right: -30px; } #MarketCommentators { background: #f7f7f7; padding: 40px 0 10px; text-align: center; } #MarketCommentators h2 { margin-bottom: 30px; } #MarketCommentatorsRotator .comm .bottom { background: #fff; padding: 30px 20px; text-align: center; box-shadow: 0px 0px 5px 0px rgba(231,231,231,1); } #MarketCommentatorsRotator .comm .bottom .name { font: 16px/16px JohnstonMdITCTT; text-transform: uppercase; color: #333; letter-spacing: 2px; } #MarketCommentatorsRotator .comm .bottom .title { color: #f7a933; font: 13px/15px JohnstonMdITCTT; text-transform: uppercase; margin: 8px 0 15px; text-transform: uppercase; letter-spacing: 2px; } #MarketCommentatorsRotator .comm .bottom a { padding: 15px 20px; border: 2px solid #aeaeae; display: inline-block; color: #aeaeae; text-transform: uppercase; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } #MarketCommentatorsRotator .slick-dots li button { background: #aeaeae; border-radius: 50%; } #MarketCommentatorsRotator .slick-dots li.slick-active button { background: #f7a933; } #MarketCommentatorsDetail { margin-top: 30px; } #MarketCommentatorsDetail .detail { display: none; background: #fff; padding: 30px; margin-bottom: 30px; } #MediaUSPs { background: #4a4949; padding: 40px 0; } #MediaUSPs h2 { font: 24px/24px JohnstonMdITCTT; color: #fff; text-align: center; text-transform: uppercase; letter-spacing: 2px; } #PressReleases { padding: 40px 0 40px; background: #f7f7f7; } #PressReleases h3 { margin-bottom: 0; color: #333333; font: 18px/18px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } #PressReleases .text { color: #333333; font: 16px/22px Plantin; text-align: center; margin: 30px 0; } #PressReleasesMoreHolder { text-align: center; } #PressReleasesLoadMore { padding: 15px 30px; margin-top: 30px; display: inline-block; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; display: none; } #PressReleasesMore { display: none; } #PressReleasesMore .loading { text-align: center; margin-top: 20px; } #PressReleasesMore .loading img { display: inline-block; } #MediaBottom .row { margin-left: 0; margin-right: 0; } #MediaBottom .holder { position: relative; height: 455px; overflow: hidden; padding: 40px; } #MediaBottom h4 { color: #333333; font: 16px/16px JohnstonMdITCTT; text-transform: uppercase; margin-bottom: 20px; letter-spacing: 2px; } #MediaBottom .item { margin-bottom: 25px; font: 16px/22px Plantin; color: #333333; } #MediaBottom .item a { color: #333; } /*#MediaBottom .item.top { font: 20px/26px Plantin; }*/ #MediaBottom .link a { position: absolute; bottom: 60px; left: 40px; padding: 15px 30px; display: inline-block; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #MediaBottom #MediaTwitter { background: #f7f7f7; } #MediaBottom #MediaTwitter .tweetHolder { overflow-y: auto; height: 312px; } #MediaBottom #MediaCaseStudiesRight { background: #fef2e0; } #MediaBottom #MediaCaseStudiesRight .link a { background: #4a4949; color: #f7a933; } #MediaBottom #MediaCaseStudiesRight h4 { color: #333; } #TwitterFeed .top { padding-bottom: 15px; } #TwitterFeed .top > div { display: inline-block; vertical-align: middle; line-height: 1; } #TwitterFeed .top .titleIcon { padding-right: 10px; height: 38px; } #TwitterFeed .top .titleIcon svg { width: 38px; height: 38px; } #TwitterFeed .top h4 { margin-bottom: 5px; } #TwitterFeed .tweet { margin-bottom: 20px; font: 16px/22px Plantin; color: #333; } #TwitterFeed .tweet .date { color: #666; font-size: 14px; line-height: 16px; margin-top: 2px; } #CaseStudiesMoreHolder { text-align: center; } #CaseStudiesLoadMore { padding: 15px 30px; margin-top: 30px; display: inline-block; border: 2px solid #aeaeae; color: #999999; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; display: none; } #CaseStudiesMore { display: none; margin-top: 30px; } #CaseStudiesMore .loading { text-align: center; margin-top: 20px; } #CaseStudiesMore .loading img { display: inline-block; } #PhotoGallery { padding: 40px 0; background: #f7f7f7; } #PhotoGallery h3 { margin-bottom: 0; color: #333333; font: 18px/18px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } #PhotoGallery .text { color: #333333; font: 16px/22px Plantin; text-align: center; margin: 30px 0; } #GalleryRotator { padding: 0 40px; } #GalleryRotator .gallery a { position: relative; display: block; } #GalleryRotator .gallery .bottom { position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; padding: 15px 20px; color: #fff; font: 16px/16px Plantin; } #GalleryRotator .gallery .bottom .back { position: absolute; z-index: 1; width: 100%; height: 100%; top: 0; left: 0; background: #fef2e0; opacity: 0.8; } #GalleryRotator .gallery .bottom .name { position: relative; z-index: 2; color: #333; } /* End of Media centre template */ /* Investment Management template */ #ImSearchBranch { background: #f7a933; color: #fff; text-align: center; padding: 15px 0; } #ImSearchBranch .call { display: inline-block; vertical-align: top; padding: 12px 15px 0 5px; font: 18px/18px Plantin; } #ImSearchBranch .call .thin { font-size: 16px; } #ImSearchBranch .search { display: inline-block; vertical-align: top; } #ImSearchBranch .search input[type=text] { display: inline-block; height: 41px; font: 14px/37px Plantin; padding: 0 10px; vertical-align: top; background: #fff; color: #626262; border: none; } #ImSearchBranch .search input[type=submit] { display: inline-block; height: 41px; text-transform: uppercase; letter-spacing: 2px; padding: 0 15px; font: 12px/37px JohnstonMdITCTT; vertical-align: top; background: #4a4949; color: #fff; border: none; } #ImSearchBranch.darkblue { background: #212a62; color: #fff; border-bottom-color: #515989; } #ImSearchBranch.darkblue .svg path { fill: #7f8acc; } #ImSearchBranch.darkblue .search input[type=text] { border-color: #7f8acc; background: #e0e0e8; color: #626262 } #ImSearchBranch.darkblue .search input[type=submit] { border-color: #7f8acc; background: none; color: #fff; } #ImSearchBranch.white { background: #fff; color: #212a62; border-bottom-color: #515989; } #ImSearchBranch.white .svg path { fill: #212a62; } #ImSearchBranch.white .search input[type=text] { border-color: #7f8acc; background: #fff; color: #212a62 } #ImSearchBranch.white .search input[type=submit] { border-color: #7f8acc; background: #f7a933; color: #fff; } #ImSearchBranch.grey { background: #e5e5e5; color: #000; border-bottom-color: #515989; } #ImSearchBranch.grey .svg path { fill: #000; } #ImSearchBranch.grey .search input[type=text] { border-color: #9192a3; background: #e5e5e5; color: #000 } #ImSearchBranch.grey .search input[type=submit] { border-color: #9192a3; background: #f7a933; color: #fff; } #ImSearchBranch.green { background: #006972; color: #fff; border-bottom-color: #a8d9eb; } #ImSearchBranch.green .svg path { fill: #a8d9eb; } #ImSearchBranch.green .search input[type=text] { border-color: #a8d9eb; background: #eaeaea; color: #626262 } #ImSearchBranch.green .search input[type=submit] { border-color: #a8d9eb; background: none; color: #fff; } #ImTop { padding: 35px 0; background: #4a4949; } #ImTop h2 { color: #fff; text-transform: uppercase; font: 24px/24px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } #ImNewsSection { padding-bottom: 40px; } #ImNewsSection .holder { position: relative; } #ImNewsSection #ImNewsTop .holder { height: 260px; overflow: hidden; } #ImNewsSection #ImNewsBottom .holder { height: 370px; } #ImNewsSection h2 { color: #333333; font: 18px/18px JohnstonMdITCTT; text-transform: uppercase; margin: 40px 0; text-align: center; letter-spacing: 2px; } #ImNewsSection .row { margin: 0; } #ImNewsSection .col-sm-4, #ImNewsSection .col-sm-8 { padding: 0; } #ImNewsSection .newsHolder { padding: 30px 46px !important; text-align: center; } #ImNewsSection h4 { color: #333333; font: 16px/16px JohnstonMdITCTT; text-transform: uppercase; margin-bottom: 20px; line-height: 1.5; letter-spacing: 2px; } #ImNewsSection .item { margin-bottom: 25px; font: 16px/22px Plantin; color: #333333; } /*#ImNewsSection .item.top { font: 20px/26px Plantin; }*/ #ImNewsSection .link { text-align: center; position: absolute; bottom: 30px; left: 0px; width: 100%; } #ImNewsSection .link a { display: inline-block; color: #f7a933; background: #4a4949; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; padding: 15px 30px; } #ImNewsSection #ImFAQs { border-left: 2px solid #f7a933; border-right: 2px solid #f7a933; } #ImNewsSection #ImFAQs h4 { color: inherit; } #ImNewsSection #ImBrochures { background: url(../Images/imBrochures.jpg) no-repeat top right; } #ImNewsSection #ImBrochures h4 { color: #fff; } #ImNewsSection #ImBrochures .item a { color: #e3c5dc; } #ImNewsSection #ImBrochures .item a .fa { margin-right: 5px; } #ImNewsSection #ImBrochures .link a { border-color: #b28ba8; color: #d8bdd1; } #ImNewsSection #ImFAQs .item a { color: #e3c5dc; } #ImNewsSection #ImGlossary .svg { float: left; max-height: 45px; max-width: 57px; margin-bottom: 25px; } #ImNewsSection #ImGlossary .svg path { fill: #650260; } /* End of Investment Management template */ /* Share Dealing Security template */ #InnerBanner.sdSecurity { padding-bottom: 0; background: #fef2e0; } #InnerBanner.sdSecurity #Breadcrumb { color: #333; } #InnerBanner.sdSecurity #Breadcrumb a { color: #333; } #InnerBanner.sdSecurity .content { padding-bottom: 0; color: #333; } #InnerBanner.sdSecurity .content .svg path { fill: #333; } #InnerBanner.sdSecurity .content h2 { color: #333; font: 14px/14px JohnstonMdITCTT; text-transform: uppercase; margin-top: 5px; letter-spacing: 2px; } #InnerBanner.sdSecurity .content .fa-play { display: inline-block; color: #f7a933; vertical-align: middle; margin-top: 28px; } #InnerBanner.sdSecurity .content .fa-play.neg { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg); } #InnerBanner.sdSecurity .content .fa-play.pos { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); transform: rotate(-90deg); } #InnerBanner.sdSecurity .content h1 { color: #333; margin-bottom: 0; display: inline-block; vertical-align: top; } #InnerBanner.sdSecurity .content .prices { margin: 15px 0 15px; } #InnerBanner.sdSecurity .content .prices span { padding: 0 10px; border-right: 1px solid #f7a933; font: 18px/20px Plantin; display: inline-block; } #InnerBanner.sdSecurity .content .prices span.last { border: none; } #InnerBanner.sdSecurity .content .timeDate { margin: 15px 0 35px; font: 18px/20px Plantin; } /* End of Share Dealing Security template */ /* Share Dealing template */ #InnerBanner.sd { padding-bottom: 0; } #InnerBanner.sd #Breadcrumb { color: #212a62; } #InnerBanner.sd #Breadcrumb a { color: #212a62; } #InnerBanner.sd .content { padding-bottom: 0; } #InnerBanner.sd .content .svg path { fill: #006972; } #InnerBanner.sd .content h3 { color: #1e2171; } #InnerBanner.sd .content h1 { color: #006972; margin-bottom: 0; } #InnerBanner.sd .content .button { margin: 40px 0; border-color: #006972; color: #006972; } #InnerBanner .content .button:after { background: none; } #SdSearchBranch { background: #f7a933; color: #fff; text-align: center; padding: 15px 0; } #SdSearchBranch .call { display: inline-block; vertical-align: top; padding: 12px 15px 0 5px; font: 18px/18px Plantin; } #SdSearchBranch .call .thin { /*font-size:16px;*/ } #SdSearchBranch .search { display: inline-block; vertical-align: top; } #SdSearchBranch .search input[type=text] { display: inline-block; height: 41px; border: none; background: #eaeaea; color: #626262; font: 14px/37px Plantin; padding: 0 10px; vertical-align: top; } #SdSearchBranch .search input[type=submit] { display: inline-block; height: 41px; border: none; background: #4a4949; color: #fff; text-transform: uppercase; letter-spacing: 2px; padding: 0 15px; font: 12px/37px JohnstonMdITCTT; vertical-align: top; } #SdTop { padding: 35px 0; background: #4a4949; } #SdTop h2 { color: #fff; text-transform: uppercase; font: 24px/24px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } #SdTop .imTopItem .text { color: #fff; } #ProductSliderHolder.sd .svg path { fill: #f7a933; } #ProductSliderHolder.sd .slick-dots li.slick-active button { background: #f7a933 !important; } #SdSplit { background: linear-gradient(to right, rgba(249,249,249,1) 0%, rgba(249,249,249,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); } #SdSplit .left { padding: 50px 20px 50px; } #SdSplit .left h3 { margin-bottom: 25px; color: #333333; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #SdSplit .right { padding: 50px 50px 50px; } #SdSplit .right h3 { margin-bottom: 25px; color: #333333; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #SdSplit .right .item { margin-bottom: 25px; font: 16px/22px Plantin; color: #333333; } /*#SdSplit .right .item.top { font: 20px/26px Plantin; }*/ #SdSplit .right .link a { padding: 15px 30px; margin-top: 15px; display: inline-block; border: 2px solid #aeaeae; color: #999999; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #SdSplit #SdFAQs { padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #e5e5e5; } #SdSplit #SdGlossary .right { float: right; width: 10%; margin-left: 15%; padding: 0; } #SdSplit #SdGlossary .right .svg { fill: #006972; } #SdSplit #SdGlossary .left { float: left; width: 75%; padding: 0; color: #666666; font: 16px/22px Plantin; } #SdSplit #SdGlossary .left .link a { margin-top: 30px; } #SdBrochures { padding: 50px 0; margin-bottom: 50px; text-align: center; background: url(/SiteFiles/Images/sdBrochures.jpg) no-repeat center top; } #SdBrochures #SdBrochuresInner { padding: 0 35%; } #SdBrochures h4 { margin-bottom: 35px; font: 16px/16px JohnstonMdITCTT; color: #fff; text-align: left; letter-spacing: 2px; } #SdBrochures .item { font: 18px/18px Plantin; color: #c9f0ff; margin-bottom: 22px; text-align: left; } #SdBrochures .item a .fa { margin-right: 5px; } #SdBrochures .link a { padding: 15px 30px; margin-top: 30px; display: inline-block; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #SdMarketKnowledge { padding: 50px 0; text-align: center; } #SdMarketKnowledge h2 { color: #333333; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #SdMarketKnowledge .text { margin: 15px 0 40px; color: #555555; font: 16px/22px Plantin; } #SdMarketKnowledge .link a { margin: 35px 0 30px; background: #f7a933; color: #fff; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; padding: 15px 30px; text-align: center; display: inline-block; text-transform: uppercase; } #SdMarketKnowledge .smallText { color: #666666; font: 14px/20px Plantin; padding: 0 20%; } #SdMarketKnowledge #MarketTeasers { border-top: 1px solid #e2e2e2; border-right: 1px solid #e2e2e2; } #SdMarketKnowledge #MarketTeasers .row { border-bottom: 1px solid #e2e2e2; margin: 0; } #SdMarketKnowledge .sdTeaser { padding: 30px 20px 20px 30px; text-align: left; border-left: 1px solid #e2e2e2; height: 130px; overflow: hidden; } #SdMarketKnowledge .sdTeaser .left { float: left; width: 70%; padding-right: 10px; } #SdMarketKnowledge .sdTeaser .left span { color: #333333; font: 14px/14px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #SdMarketKnowledge .sdTeaser .fa { color: #4a4949; position: absolute; bottom: 0; left: 0; padding: 10px 10px 20px 30px; cursor: pointer; } #SdMarketKnowledge .sdTeaser .right { float: left; width: 30%; text-align: right; } #SdMarketKnowledge .sdTeaser .hover { position: absolute; bottom: -100%; left: -100%; width: 100%; height: 100%; background: #fff; padding: 30px 20px 20px 30px; line-height: 20px; } #SdMarkets { padding: 50px 0; background: #e5e5e5; text-align: center; } #SdMarkets a { color: #555; } #SdMarkets h2 { color: #333333; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #SdMarkets .text { margin: 10px 0 35px; color: #666666; font: 14px/20px Plantin; } #SdMarkets .center { text-align: center; } #SdMarkets .chart { border: 1px solid #999999; display: inline-block; margin-top: 15px; overflow: hidden; width: 100%; } #SdMarkets iframe { margin-top: -30px; border: none; } #SdMarkets .whiteSec { text-align: left; background: #fff; } #SdMarkets .news .whiteSec { padding-bottom: 20px; margin-bottom: 0; } #SdMarkets .whiteSec.markets { padding-bottom: 35px; } #SdMarkets .whiteSec.search { padding: 0 0 30px; margin-bottom: 20px; } #SdMarkets .whiteSec h3 { padding: 18px 20px 16px; color: #333333; font: 18px/20px Plantin; text-transform: none; border-bottom: 1px solid #e5e5e5; } #SdMarkets p.tiny { padding: 12px 20px 0; margin: 0; font-size: 12px; line-height: 18px; } #SdMarkets p.tiny a { color: #006972; } #SdMarkets p.tiny .weeny { font-size: 8px; } #SdMarkets .market { padding: 12px 20px; border-bottom: 1px solid #e5e5e5; } #SdMarkets .market .fa { font-size: 14px; } #SdMarkets .market.neg .fa { color: #cc0033; transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); } #SdMarkets .market.pos .fa { color: #339900; transform: rotate(-90deg); -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } #SdMarkets .market.pos .right { color: #339900; } #SdMarkets .market.neg .right { color: #cc0033; } #SdMarkets .market .name { color: #666666; font: 18px/20px Plantin; text-transform: uppercase; margin-bottom: 4px; } #SdMarkets .market .left { float: left; width: 50%; } #SdMarkets .market .left span { color: #1f1f1f; font: 16px/18px Plantin; margin-left: 5px; } #SdMarkets .market.first .left span { color: #1f1f1f; font: 24px/26px Plantin; margin-left: 5px; } #SdMarkets .market.first .fa { font-size: 18px; } #SdMarkets .market .right { float: left; width: 50%; text-align: right; font: 16px/26px Plantin; } #SdMarkets .marketInfo { padding: 20px 20px 0; } #SdMarkets .searchInner { padding: 20px 20px 0; } #SdMarkets .searchInner .searchText { float: left; width: 65%; height: 50px; font: 16px/48px Plantin; padding: 0 15px; color: #666666; border: 1px solid #e4e4e4; border-right: none; border-bottom: 1px solid #a3a3a3; } #SdMarkets .searchInner .button { float: left; width: 10%; background: #f7a933; text-align: center; padding: 0; height: 50px; font-size: 20px; line-height: 50px; color: #fff; } #SdMarkets .searchInner .compLink { float: right; width: 21%; display: inline-block; height: 50px; background: #4a4949; color: #f7a933; text-align: center; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #SdMarkets .riseFallSec { padding-bottom: 35px; } #SdMarkets .riseFall { padding: 12px 20px 10px; border-bottom: 1px solid #e5e5e5; } #SdMarkets .riseFall .name { float: left; width: 57%; color: #666666; font: 14px/16px Plantin; } #SdMarkets .riseFall .arrow { float: left; width: 6%; text-align: right; margin-top: -5px; } #SdMarkets .riseFall .arrow .fa { color: #339900; font-size: 14px; line-height: 16px; } #SdMarkets .riseFall.neg .fa { color: #cc0033; transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); } #SdMarkets .riseFall.pos .fa { transform: rotate(-90deg); -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } #SdMarkets .riseFall .cp { float: left; width: 18%; text-align: right; color: #1f1f1f; font: 14px/16px Plantin; } #SdMarkets .riseFall .mcPer { float: left; width: 18%; text-align: right; font: 14px/16px Plantin; color: #339900; } #SdMarkets .riseFall.neg .mcPer { color: #cc0033; } #SdMarkets .riseFall.first { background: #f7f7f7; } #SdMarkets .riseFall.first .name { float: none; width: 100%; margin-bottom: 10px; } #SdMarkets .riseFall.first .arrow { font-size: 18px; margin-top: -2px; width: 8%; text-align: left; } #SdMarkets .riseFall.first .cp { font: 20px/22px Plantin; width: 46%; text-align: left; } #SdMarkets .riseFall.first .mcPer { font: 20px/22px Plantin; width: 46%; } #SdMarkets .news { float: right; } #SdMarkets #NewsTabs { background: #fff; border-radius: 0; border: none; padding: 20px 0 0; } #SdMarkets #NewsTabs ul { padding: 0 20px; border-radius: 0; background: none; border: none; border-bottom: 1px solid #e5e5e5; } #SdMarkets #NewsTabs ul li { max-width: none; text-align: left; border: none; background: none; margin: 0; white-space: initial; border-top: 4px solid #eeeeee; border-radius: 0; } #SdMarkets #NewsTabs ul li.ui-state-active { padding-bottom: 0; border-top: 4px solid #666666; border-radius: 0; } #SdMarkets #NewsTabs ul li a { padding: 10px 20px; background: #eeeeee; color: #777777; font: 16px/18px Plantin; border: none; display: block; width: 100%; } #SdMarkets #NewsTabs ul li.ui-state-active a { background: #fff; border-right: 1px solid #dedfe1; border-left: 1px solid #dedfe1; } #SdMarkets #NewsTabs .ui-tabs-panel { padding: 0; } #SdMarkets #NewsTabs .newsItem { display: block; padding: 15px 20px 12px; border-bottom: 1px solid #e5e5e5; } #SdMarkets #NewsTabs .newsItem .name { color: #333333; font: 14px/16px Plantin; } #SdMarkets #NewsTabs .newsItem .date { color: #666666; font: 14px/16px Plantin; } #SdMarkets #NewsTabs .newsItem.directorDeal, #SdMarkets #NewsTabs .newsItem.economicEvent { font: 14px/16px Plantin; } #SdMarkets #NewsTabs .newsItem span.line { color: #f7a933; } #SdMarkets #NewsTabs .link { display: inline-block; margin: 20px 0 0 20px; padding: 0 20px; background: #4a4949; color: #f7a933; height: 50px; text-align: center; font: 12px/48px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #SdNoResults { background: none; } #SdNoResults .searchInner { padding: 20px 10%; } #SdNoResults .searchInner .searchText { float: left; width: 65%; height: 50px; font: 16px/48px Plantin; padding: 0 15px; color: #666666; border: 1px solid #e4e4e4; border-right: none; border-bottom: 1px solid #a3a3a3; } #SdNoResults .searchInner .button { float: left; width: 10%; background: #f7a933; text-align: center; padding: 0; height: 50px; font-size: 20px; line-height: 50px; color: #fff; } #SdNoResults .searchInner .compLink { float: right; width: 21%; display: inline-block; background: #4a4949; height: 50px; color: #f7a933; text-align: center; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #SdNoResults .riseFallSec { padding-bottom: 35px; } .sd-portal { display: flex; } .sd-portal .whiteSec.noBottom { margin-bottom: 0; padding-bottom: 0; flex: 1; } .sd-portal .sd-portal--flex { display: flex; flex-direction: column; } /* End of Share Dealing template */ /* Share Dealing Company template */ #MarketTabs { background: #e5e5e5; padding-bottom: 40px; } #MarketTabs .timeDate { padding: 40px 0 0; text-align: center; font: 16px/22px Plantin; } #MarketTabs ul { padding: 40px 20px 20px; border-radius: 0; background: none; border: none; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; } #MarketTabs ul li { max-width: none; text-align: left; border: none; background: none; margin: 5px 5px 0 0; white-space: initial; border-radius: 0; float: none; display: inline-block; } #MarketTabs ul li.ui-state-active { padding-bottom: 0; border-radius: 0; } #MarketTabs ul li a { padding: 0 25px; height: 50px; display: flex; align-items: center; background: #4a4949; color: #fff; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #MarketTabs ul li.ui-state-active a { background: #6e6e6d; color: #fff; } #MarketTabs .ui-tabs-panel { padding: 0; } #MarketTabsInner { border: none; border-radius: 0; background: none; padding: 0 10px; font: 14px/16px Plantin; color: #666666; } #MarketTabs.sectorInner { padding: 25px 0 40px; } #MarketTabs .portalBackButton a { color: #f7a933; font: 14px/16px Plantin; line-height: 24px; } #MarketTabs.sectorInner .whiteSec.chart { margin-top: 0; } #MarketTabs.sectorInner .whiteSec.chart .chart { overflow: hidden; } #MarketTabs.sectorInner .chart iframe { margin: -30px 20px 0; border: none; width: calc(100% - 40px); } #MarketTabs.sectorInner .whiteSec.comps { margin-top: 20px; } #MarketTabs.sectorInner .comp { padding: 12px 20px; border-bottom: 1px solid #e5e5e5; font: 14px/16px Plantin; color: #666666; } #MarketTabs.sectorInner .comp.head { font-family: Plantin; } #MarketTabs.sectorInner .comp .epic { float: left; width: 14%; } #MarketTabs.sectorInner .comp .name { float: left; width: 36%; } #MarketTabs.sectorInner .comp a { color: inherit; } #MarketTabs.sectorInner .comp .name a { color: #555; } #MarketTabs.sectorInner .comp .curr { float: left; width: 14%; } #MarketTabs.sectorInner .comp .price { float: left; width: 12%; } #MarketTabs.sectorInner .comp .price.neg { color: #cc0033; } #MarketTabs.sectorInner .comp .price.pos { color: #339900; } #MarketTabs.sectorInner .comp .price.neg .fa { color: #cc0033; transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); } #MarketTabs.sectorInner .comp .price.pos .fa { transform: rotate(-90deg); -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } #MarketTabs.sectorInner .comp .price .fa { margin-right: 4px; } #MarketTabs .whiteSec { text-align: left; background: #fff; padding-bottom: 35px; position: relative; } #MarketTabs .whiteSec h2, #MarketTabs .whiteSec h3, #MarketTabs .whiteSec h4 { padding: 18px 20px 16px; margin: 0; color: #333333; font: 18px/20px Plantin; text-transform: none; border-bottom: 1px solid #e5e5e5; } #MarketTabs .whiteSec.chart { margin-top: 20px; } #MarketTabs .whiteSec.chart .item { border-top: 1px solid #e5e5e5; } #MarketTabs .whiteSec.chart .chart { overflow: hidden; } #MarketTabs .chart iframe { margin: -30px 20px 0; border: none; width: calc(100% - 40px); } #MarketTabs .whiteSec.highlights { margin-top: 20px; } #MarketTabs .whiteSec.keyPer { margin-top: 20px; } #MarketTabs .whiteSec.cons { margin-top: 20px; } #MarketTabs .whiteSec.cons .name { width: 26%; padding-top: 2px; } #MarketTabs .whiteSec.cons .barHold { float: left; width: 59%; padding-right: 10px; } #MarketTabs .whiteSec.cons .barHold .bar.sb { background: #006972; } #MarketTabs .whiteSec.cons .barHold .bar.b { background: #006972; } #MarketTabs .whiteSec.cons .barHold .bar.h { background: #339900; } #MarketTabs .whiteSec.cons .barHold .bar.s { background: #f7a933; } #MarketTabs .whiteSec.cons .barHold .bar.ss { background: #cc0033; } #MarketTabs .whiteSec.cons .val { width: 15%; padding-top: 2px; } #MarketTabs .whiteSec.cons .text, #MarketTabs .whiteSec.price .text { padding: 12px 20px 0; font-size: 12px; line-height: 20px; color: #666666; } #MarketTabs .whiteSec.over div { padding: 12px 20px 0; line-height: 20px; color: #666666; } #MarketTabs .item { padding: 12px 20px; border-bottom: 1px solid #e5e5e5; } #MarketTabs .item .name { float: left; width: 45%; color: #666666; font: 14px/16px Plantin; } #MarketTabs .item .name a { color: #f7a933; } #MarketTabs .item .name a:hover { color: #f7a933; } #MarketTabs .item .val { float: left; width: 55%; text-align: right; color: #1f1f1f; font: 14px/16px Plantin; } #MarketTabs .item .val a { color: #f7a933; } #MarketTabs .item .val a:hover { color: #f7a933; } #MarketTabs .item .val.neg { color: #cc0033; } #MarketTabs .item .val.pos { color: #339900; } #MarketTabs .item .val.neg .fa { color: #cc0033; transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); } #MarketTabs .item .val.pos .fa { transform: rotate(-90deg); -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } #MarketTabs .item .val .fa { margin-right: 4px; } #MarketTabs .provided { margin: 0; font-size: 12px; line-height: 18px; position: absolute; top: 0; right: 0; padding: 18px 20px 16px; color: #666666; } #MarketTabs #Charts { background: #fff; } #MarketTabs #Charts .center { text-align: center; } #MarketTabs #Charts iframe { border: none; display: inline-block; margin: 25px 0; } #MarketTabs #News { background: transparent; padding-bottom: 35px; } #MarketTabs #News .whiteSec { padding-bottom: 0; } #MarketTabs #News h3 { padding: 18px 20px 16px; color: #333333; font: 18px/20px Plantin; text-transform: none; border-bottom: 1px solid #e5e5e5; } #MarketTabs #News .newsItem { display: block; padding: 15px 20px 12px; border-bottom: 1px solid #e5e5e5; } #MarketTabs #News .newsItem .name { color: #333333; font: 14px/16px Plantin; } #MarketTabs #News .newsItem .date { color: #666666; font: 14px/16px Plantin; } #MarketTabs #Financials .name { width: 25%; } #MarketTabs #Financials .val { width: 15%; } #MarketTabs #Financials .dividendHistory .val { width: 25%; } #MarketTabs #Financials .whiteSec { margin-bottom: 15px; } #MarketTabs #Financials .whiteSec.bottom { margin-bottom: 0; } /* End of Share Dealing Company template */ /* Share Dealing Markets template */ #InnerBanner.markets { padding-bottom: 50px; } #InnerBanner.markets #Breadcrumb { color: #212a62; } #InnerBanner.markets #Breadcrumb a { color: #212a62; } #InnerBanner.markets .content { padding-bottom: 0; } #InnerBanner.markets .content .svg path { fill: #006972; } #InnerBanner.markets .content h3 { color: #1e2171; } #InnerBanner.markets .content h1 { color: #006972; margin-bottom: 0; } #SdMarkets { padding: 35px 0; background: #ebebeb; text-align: center; } #SdMarkets h2 { font: 20px/20px JohnstonMdITCTT; color: #1f1f1f; text-transform: uppercase; letter-spacing: 2px; } #SdMarkets .text, #MarketTabs .lastUpdatedText { font: 16px/22px Plantin; margin: 30px 0; text-align: center; } #SdMarkets .whiteSec { text-align: left; background: #fff; padding-bottom: 35px; margin-bottom: 20px; } #SdMarkets .whiteSec h2, #SdMarkets .whiteSec h3, #SdMarkets .whiteSec h4 { padding: 18px 20px 16px; color: #333333; font: 18px/20px Plantin; text-transform: none; border-bottom: 1px solid #e5e5e5; } #SdMarkets .item { padding: 12px 20px; border-bottom: 1px solid #e5e5e5; font: 14px/16px Plantin; } #SdMarkets .item.head { font-family: Plantin; } #SdMarkets .item .index { float: left; width: 40%; color: #666666; } #SdMarkets .item .right { float: left; width: 15%; text-align: right; color: #1f1f1f; } #SdMarkets .item .right.neg { color: #cc0033; } #SdMarkets .item .right.pos { color: #339900; } #SdMarkets .item .right.neg .fa { color: #cc0033; transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); } #SdMarkets .item .right.pos .fa { transform: rotate(-90deg); -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } #SdMarkets .item .right .fa { margin-right: 4px; } /* End of Share Dealing Markets template */ /* Share Dealing Company A-Z template */ #InnerBanner.sdComps { padding-bottom: 50px; } #InnerBanner.sdComps #Breadcrumb { color: #212a62; } #InnerBanner.sdComps #Breadcrumb a { color: #212a62; } #InnerBanner.sdComps .content { padding-bottom: 0; } #InnerBanner.sdComps .content .svg path { fill: #006972; } #InnerBanner.sdComps .content h3 { color: #1e2171; } #InnerBanner.sdComps .content h1 { color: #006972; margin-bottom: 0; } #SdCompanyAZ { padding: 35px 0; background: #ebebeb; text-align: center; } #SdCompanyAZ h2 { font: 20px/20px JohnstonMdITCTT; color: #1f1f1f; text-transform: uppercase; letter-spacing: 2px; } #SdCompanyAZ .text { font: 16px/22px Plantin; margin: 30px 0; } #SdCompanyAZ #SdList .text { text-align: center; } #SdCompanyNav { list-style-type: none; padding: 0; margin: 0 0 30px; } #SdCompanyNav li { display: inline-block; } #SdCompanyNav li a { display: inline-block; color: #f7a933; font: 20px/20px JohnstonMdITCTT; margin: 0 8px; padding-bottom: 14px; letter-spacing: 2px; } #SdCompanyNav li a.active { border-bottom: 4px solid #f7a933; } #SdCompanyList { list-style-type: none; background: #fff; padding: 35px 35px 0; text-align: left; } #SdCompanyList #SdLetter { color: #f7a933; font: 28px/28px JohnstonMdITCTT; letter-spacing: 2px; } #SdCompanyList li { display: block; padding-bottom: 35px; color: #666666; font: 14px/20px Plantin; } #SdCompanyList li .title { color: #333333; font: 14px/16px Plantin; margin-bottom: 4px; } #SdCompanyList li .title a { color: #555; font-weight: bold; } /* End of Share Dealing Company A-Z template */ #SdList { list-style-type: none; text-align: left; padding: 0; margin: 0; } #SdList li { display: block; padding: 20px 30px 18px; margin-bottom: 5px; background: #fff; } #SdList li .title { color: #333333; font: 14px/16px Plantin; } #SdList li .title a { color: #555; } #SdList li .info { margin-top: 5px; } /* FAQs template */ #InnerBanner.faq { padding-bottom: 80px; } #InnerBanner.faq .content { padding: 15px 0 0; } #InnerBanner.faq #Breadcrumb { color: #cccccc; } #InnerBanner.faq #Breadcrumb a { color: #cccccc; } #InnerBanner.faq h1 { margin-bottom: 0; } #InnerBanner.faq h2 { color: #fff; font: 40px/44px Plantin; text-transform: none; margin: 12px 0 0; padding: 0 10px; } #InnerBanner.faq h3 { color: #1e2171; } #FAQs { padding: 35px 0; background: #ebebeb; text-align: center; } #FAQs h2 { font: 20px/20px JohnstonMdITCTT; color: #1f1f1f; text-transform: uppercase; letter-spacing: 2px; } #FAQs .text { font: 16px/22px Plantin; margin: 30px 0; } #FAQs select { display: inline-block; background: #fff; margin-bottom: 25px; text-align: center; padding: 0 0 0 10px; height: 50px; text-transform: uppercase; color: #858585; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; border: 2px solid #f7a933; outline: none; } #FAQsAccordion { font: 16px/22px Plantin; } #FAQsAccordion .title { border: 1px solid #d6d6d6; padding: 15px 30px 13px 15px; color: #333333; font: 16px/18px Plantin; background: #fff; text-align: left; border-radius: 0; outline: none; } #FAQsAccordion .text { margin: 0 !important; text-align: left; font: 16px/22px Plantin; padding: 15px; border-radius: 0; } #FAQsAccordion .ui-accordion-header-icon { left: auto; right: 10px; text-indent: unset; text-align: center; } #FAQsAccordion .ui-accordion-header-icon:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: "+"; color: #f7a933; font-size: 22px; font-weight: bold; } #FAQsAccordion .ui-accordion-header-icon.ui-icon-triangle-1-s:after { content: "-"; } /* End of FAQs template */ /* Glossary template */ #InnerBanner.gloss { padding-bottom: 50px; } #InnerBanner.gloss #Breadcrumb { color: #212a62; } #InnerBanner.gloss #Breadcrumb a { color: #212a62; } #InnerBanner.gloss .content { padding-bottom: 0; } #InnerBanner.gloss .content h1 { color: #1e2171; margin-bottom: 0; } #Glossary { padding: 35px 0; background: #ebebeb; text-align: center; } #Glossary h2 { font: 20px/20px JohnstonMdITCTT; color: #1f1f1f; text-transform: uppercase; letter-spacing: 2px; } #Glossary .text { font: 16px/22px Plantin; margin: 10px 0; } #GlossaryNav { list-style-type: none; padding: 0; margin: 0 0 30px; } #GlossaryNav li { display: inline-block; } #GlossaryNav li a { display: inline-block; color: #f7a933; font: 20px/20px JohnstonMdITCTT; margin: 0 8px; padding-bottom: 14px; letter-spacing: 2px; } #GlossaryNav li a.active { border-bottom: 4px solid #f7a933; } #GlossaryNav li a.disabled { opacity: 0.6; } #GlossaryList { list-style-type: none; background: #fff; padding: 35px 35px 0; text-align: left; } #GlossaryList #GlossLetter { color: #f7a933; font: 28px/28px JohnstonMdITCTT; letter-spacing: 2px; } #GlossaryList li { display: block; padding-bottom: 35px; color: #666666; font: 14px/20px Plantin; } #GlossaryList li .title { color: #333333; font: 14px/16px Plantin; margin-bottom: 4px; } /* End of Glossary template */ /* Inner template */ #Inner { padding: 40px 0; background: #fff; } #Inner h2, #Inner h3 { margin-bottom: 20px; font: 18px/18px JohnstonMdITCTT; color: #333; letter-spacing: 2px; } /* End of Inner template */ /* About template */ #InnerBanner.about { padding-bottom: 0; } #InnerBanner.about .content { padding: 50px 0 85px; } #InnerBanner.news .content { padding: 0 0 50px; } #AboutBannerBlue { position: relative; z-index: 2; padding: 35px 0; } #AboutBannerBlue h2 { margin-bottom: 30px; font: 24px/24px JohnstonMdITCTT; color: #fff; text-transform: uppercase; letter-spacing: 2px; text-align: center; } #AboutBannerBlue .background { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background: #4a4949; opacity: 1; } #AboutBannerBlue .container { position: relative; z-index: 2; } #AboutBannerBlue .image { position: relative; z-index: 2; } #AboutBannerBlue .aboutValue .image { position: relative; margin-bottom: 20px; } #AboutBannerBlue .aboutValue .image img { max-height: 80px; } #AboutBannerBlue .aboutValue .image svg { fill: #f7a933; max-height: 80px; height: 80px; width: 60px; } #AboutBannerBlue .aboutValue .text { font: 14px/20px JohnstonMdITCTT; color: #fff; text-align: center; position: relative; text-transform: uppercase; } #AboutBannerBlue .bottomText { font: 16px/22px Plantin; color: #fff; margin-top: 35px; padding: 0 20%; } #AboutBannerBlue .values { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; justify-content: center; } #AboutBannerBlue .value { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: flex-end; -ms-flex-preferred-size: calc(20% - 50px); flex-basis: calc(20% - 50px); padding: 10px; align-items: end; text-align: center; } #AboutBoard { background: #f9f9f9; padding: 65px 0 80px; } #AboutBoard h2 { margin-bottom: 30px; font: 20px/20px JohnstonMdITCTT; color: #1f1f1f; letter-spacing: 2px; } #AboutBoard .ajax__tab_xp a { color: #555; } #AboutBoard .ajax__tab_xp .ajax__tab_body { font: 16px/22px Plantin; border: none; color: #333333; padding: 0; background: none; overflow: unset; margin: 10px 0 0; } #AboutBoard .ajax__tab_xp .ajax__tab_header { font: 16px/22px Plantin; background: none; color: #333333; } #AboutBoard .ajax__tab_xp .ajax__tab_header .ajax__tab_active .ajax__tab_outer { background: none; height: auto; padding: 0; } #AboutBoard .ajax__tab_xp .ajax__tab_header .ajax__tab_active .ajax__tab_inner { background: none; padding: 0; } #AboutBoard .ajax__tab_xp .ajax__tab_header .ajax__tab_active .ajax__tab_tab { background: none; background: #fff; } #AboutBoard .ajax__tab_xp .ajax__tab_header .ajax__tab_tab { height: auto; padding: 0; background: #e8e7e7; padding: 10px 20px; margin-right: 10px; } #AboutBoard .ajax__tab_xp .ajax__tab_header .ajax__tab_outer { padding: 0; background: none; height: auto; } #AboutBoard .ajax__tab_xp .ajax__tab_header .ajax__tab_inner { background: none; padding: 0; } #AboutBoard .boardSlider { position: relative; margin-top: -59px; max-height: 289px; overflow: hidden; } #AboutBoard .boardSlider .boardMember { position: relative; } #AboutBoard .boardSlider .boardMember img { position: relative; z-index: 1; } #AboutBoard .boardSlider .boardMember .name { position: absolute; bottom: 20px; left: 0; width: 100%; padding: 0 30px; z-index: 2; color: #fff; text-align: center; } #AboutBoard .boardSlider .slick-prev, #AboutBoard .boardSlider .slick-next { font-size: 30px; color: #959a99; } #AboutBoard .slick-next:before, #AboutBoard .slick-next:after, #AboutBoard .slick-prev:before, #AboutBoard .slick-prev:after { content: ""; display: none; } #AboutBoard .slick-prev, #AboutBoard .slick-next { width: auto; height: auto; margin-top: 0; top: auto; bottom: 20px; } #AboutBoard .slick-prev { left: 15px; } #AboutBoard .slick-next { right: 15px; } #AboutBoard .peopleRotator { padding-top: 20px; } .peopleRotator .comm .bottom { background: #fff; padding: 30px 20px; text-align: center; box-shadow: 0px 0px 5px 0px rgba(231,231,231,1); } .peopleRotator .comm .bottom .name { font: 16px/16px JohnstonMdITCTT; text-transform: uppercase; color: #333; letter-spacing: 2px; } .peopleRotator .comm .bottom .title { color: #f7a933; font: 13px/15px JohnstonMdITCTT; text-transform: uppercase; margin: 8px 0 15px; text-transform: uppercase; letter-spacing: 2px; } .peopleRotator .comm .bottom a { padding: 15px 20px; border: 2px solid #aeaeae; display: inline-block; color: #aeaeae; text-transform: uppercase; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } .peopleRotator .slick-dots li button { background: #aeaeae; border-radius: 50%; } .peopleRotator .slick-dots li.slick-active button { background: #f7a933; } .peopleRotatorDetail { margin-top: 30px; } .peopleRotatorDetail .detail { display: none; background: #fff; padding: 30px; margin-bottom: 30px; } #AboutHistory { padding: 65px 0 90px; background: url(/SiteFiles/Images/historyBackground.jpg) no-repeat center center #18191D; position: relative; } #AboutHistory #AboutHistoryLine { position: absolute; width: 100%; left: 0; top: 110px; height: 0; border-bottom: 1px solid #fff; z-index: 1; } #AboutHistory .container { position: relative; z-index: 2; } #AboutHistory h2 { margin-bottom: 20px; font: 18px/18px JohnstonMdITCTT; color: #fff; text-align: center; letter-spacing: 2px; } #AboutHistorySliderNav .navItem { text-align: center; color: #999999; font: 16px/16px JohnstonMdITCTT; letter-spacing: 2px; } #AboutHistorySliderNav .navItem .period { padding: 20px 0 12px; cursor: pointer; } #AboutHistorySliderNav .navItem .period:hover { color: #fff; } #AboutHistorySliderNav .navItem.slick-center { color: #fff; position: relative; } #AboutHistorySliderNav .navItem.slick-center:after { position: absolute; top: 0; left: 50%; margin-left: -8px; content: " "; background: #3b3d42; border: 2px solid #fff; width: 16px; height: 16px; border-radius: 8px; } #AboutHistorySliderNav .slick-prev, #AboutHistorySliderNav .slick-next { font-size: 24px; color: #959a99; } #AboutHistorySliderNav .slick-next:before, #AboutHistorySliderNav .slick-next:after, #AboutHistorySliderNav .slick-prev:before, #AboutHistorySliderNav .slick-prev:after { content: ""; display: none; } #AboutHistorySliderNav .slick-prev, #AboutHistorySliderNav .slick-next { width: auto; height: auto; margin-top: 0; top: 15px; } #AboutHistorySlider .historyItem .inner { margin-top: 60px; padding: 0 25%; color: #fff; font: 16px/22px Plantin; } #AboutCharities { background: #f7f7f7; padding: 65px 0 40px; } #AboutCharities h3 { margin-bottom: 25px; color: #333333; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #AboutCharities .text { font: 16px/22px Plantin; } #AboutCharities .more { text-align: center; } #AboutCharities .more a { display: inline-block; margin-top: 30px; padding: 15px 20px; background: #4a4949; display: inline-block; color: #f7a933; text-transform: uppercase; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } #Testimonials { padding: 60px 0 100px; text-align: center; background: #fff; } #Testimonials svg { max-height: 40px; margin-bottom: 15px; } #Testimonials svg path { fill: #f7a933; } #Testimonials h3 { color: #f7a933; font: 18px/18px JohnstonMdITCTT; margin-bottom: 30px; letter-spacing: 2px; } #Testimonials .inner { padding: 0 13%; } #Testimonials .text { color: #333333; font: 18px/24px Plantin; margin-bottom: 30px; position: relative; padding: 0 60px; } #Testimonials .text svg { position: absolute; width: 30px; height: 30px; } #Testimonials .text svg.left { top: -4px; left: 0; } #Testimonials .text svg.right { bottom: -4px; right: 0; } #Testimonials .name { color: #333333; font: 14px/18px Plantin; } #ClientInformation { background: #e5e5e5; padding: 65px 0 85px; } #ClientInformation h3 { text-align: center; margin-bottom: 30px; color: #1f1f1f; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #ClientInfoTabs { background: #fff; border-radius: 0; border: none; padding: 20px; } #ClientInfoTabs ul { padding: 0; border-radius: 0; background: none; border: none; border-bottom: 1px solid #e2e2e2; } #ClientInfoTabs ul li { max-width: none; width: 25%; text-align: left; border: none; background: none; margin: 0; white-space: initial; border-top: 4px solid #eeeeee; border-radius: 0; } #ClientInfoTabs ul li.ui-state-active { padding-bottom: 0; border-top: 4px solid #666666; border-radius: 0; } #ClientInfoTabs ul li a { padding: 15px 15px 11px; background: #eeeeee; color: #777777; font: 16px/18px Plantin; border: none; display: block; min-height: 66px; width: 100%; border-right: 1px solid #fff; } #ClientInfoTabs ul li.ui-state-active a { background: #fff; border-right: 1px solid #dedfe1; border-left: 1px solid #dedfe1; } #ClientInfoTabs .ui-tabs-panel { padding: 35px 15px; } #ClientInfoTabs .ui-tabs-panel .title { margin-bottom: 15px; font: 16px/16px JohnstonMdITCTT; color: #333333; text-transform: uppercase; letter-spacing: 2px; } #ClientInfoTabs .ui-tabs-panel .text { font: 16px/22px Plantin; color: #555555; } #ClientInfoTabs .ui-tabs-panel a { margin-top: 34px; background: #f7a933; color: #fff; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; padding: 15px 0; width: 100%; text-align: center; display: block; text-transform: uppercase; -webkit-box-shadow: 2px 2px 0px 0px rgba(102,102,102,1); -moz-box-shadow: 2px 2px 0px 0px rgba(102,102,102,1); box-shadow: 2px 2px 0px 0px rgba(102,102,102,1); } #AboutAwards { padding: 65px 0; background: #f7f7f7; } #AboutAwards h3 { color: #333333; font: 18px/18px JohnstonMdITCTT; margin-bottom: 30px; text-align: center; letter-spacing: 2px; } #AboutAwards .text { margin-bottom: 45px; font: 16px/22px Plantin; color: #555555; } #AwardsSlider { padding: 0 40px; } #AwardsSlider .awardSlider { text-align: center; } #AwardsSlider .awardSlider img { width: auto; display: inline-block; } #AboutImages { background: #f7f7f7; text-align: center; } #AboutImages a { display: inline-block; margin: 0 1px; position: relative; } #AboutImages a:after { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; background: #18191D; opacity: 0.5; content: " "; } #AboutImages a:hover:after { background: url(/SiteFiles/Images/magnify.png) no-repeat center center; opacity: 1; } /* End of About template */ /* IPO inner template */ #Inner.ipoInner { padding-bottom: 0; } #IpoInner h2 { color: #333333; font: 18px/18px JohnstonMdITCTT; margin-bottom: 30px; text-align: center; letter-spacing: 2px; } #IpoInner .text { font: 16px/22px Plantin; color: #555555; } #IpoInner .info { font: 16px/22px Plantin; color: #555555; margin-bottom: 30px; } #IpoInner .info > div { display: inline-block; vertical-align: middle; float: none; } #IpoInner .info .right { padding-left: 40px; } #IpoInner .info .right h2 { text-align: left; } #IpoInner .buttons { text-align: center; margin-top: 30px; } #IpoInner .buttons input { margin: 0 5px; } #IpoInner .cta { background: #4a4949; color: #bcbdce; font: 16px/18px Plantin; padding: 45px 0; text-align: center; } #IpoInner .cta .title { margin-bottom: 15px; color: #fff; font: 18px/18px JohnstonMdITCTT; text-align: center; text-transform: uppercase; letter-spacing: 2px; } #IpoInner .cta .text { margin-bottom: 20px; color: #fff; } #IpoInner .cta a { vertical-align: top; display: inline-block; background: #f7a933; color: #fff; letter-spacing: 2px; height: 50px; border: none; font-weight: normal; padding: 0 25px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } #IpoInner .return { padding: 45px 0; text-align: center; } #IpoForm h2 { color: #333333; font: 18px/18px JohnstonMdITCTT; margin-bottom: 30px; text-align: center; letter-spacing: 2px; } #IpoForm .info { font: 16px/22px Plantin; color: #555555; margin-bottom: 30px; } #IpoForm .info > div { display: inline-block; vertical-align: middle; float: none; } #IpoForm .info .right { padding-left: 40px; } #IpoForm .info .right h2 { text-align: left; } #IpoForm .waysToApply { margin-top: 30px; } #IpoForm .waysToApply .ipoApply { background: #fef2e0; padding: 30px; } #IpoForm .buttons { text-align: center; margin-top: 30px; } #IpoForm .buttons input { margin: 0 5px; } #IpoForm .checkbox { display: block; } #IpoForm .checkbox label { display: inline-block; vertical-align: top; } #IpoForm .checkbox input { display: inline-block; margin-top: 14px; margin-right: 5px; vertical-align: top; } #IpoForm p.text { font: 16px/22px Plantin; margin-bottom: 10px; } #IpoForm .left { text-align: left; } #IpoForm .left h2 { text-align: left; } #IpoForm .charge strong { font-weight: normal; font-family: Plantin; } #IpoForm .charge p { margin-top: 0; } #IpoForm .total .left { float: left; width: 15%; } #IpoForm .total .right { float: left; width: 15%; } #IpoForm .total.bold { font: 16px/22px Plantin; margin-top: 10px; } .form .row.twoCol { margin-bottom: 0; } .twoCol.bg { padding: 40px 0; } .twoCol.bg.left { background: linear-gradient(to right, rgba(254,242,224,1) 0%, rgba(254,242,224,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); } .twoCol.bg.right { background: linear-gradient(to left, rgba(254,242,224,1) 0%, rgba(254,242,224,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); } .twoCol.bg .col-sm-6 { padding-left: 40px; padding-right: 40px; } .twoCol > div { display: inline-block; float: none; vertical-align: middle; } .twoCol.topAlign > div { vertical-align: top; } .twoCol__title { text-align: center; padding: 12px; } /* End of IPO inner template */ /* Branch inner template */ #Site .pageBanner.branch.team .inner { padding-top: 30px; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } #InnerBanner.branch { padding-bottom: 80px; } #InnerBanner.branch .content { padding: 15px 0 0; } #InnerBanner.branch #Breadcrumb { color: #cccccc; } #InnerBanner.branch #Breadcrumb a { color: #cccccc; } #InnerBanner.branch h1 { margin-bottom: 0; } #InnerBanner.branch h3 { color: #1e2171; } #BranchSet { background: #f7a933; color: #fff; text-align: center; padding: 15px 0; } #BranchSet .text { display: inline-block; vertical-align: top; padding: 0 8px 0 5px; margin: 0 10px; color: #333; font: 18px/40px JohnstonMdITCTT; letter-spacing: 2px; text-transform: uppercase; } #BranchSet .text > span { display: block; float: left; } #BranchSet .text > span:first-of-type { height: 40px; } #BranchSet .text svg { width: 40px; height: 40px; fill: #fff; } #BranchSet .text svg .svgGold { fill: #fff; } #BranchSet a { color: #fff; } #BranchDetails { background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(254,242,224,1) 50%, rgba(254,242,224,1) 100%); padding-bottom: 0; text-align: center; color: #666666; font: 16px/22px Plantin; border-bottom: 2px solid #f7a933; } #BranchDetails .left { padding: 0; } #BranchDetails #Details { padding: 60px 50px 40px; text-align: left; } #BranchDetails #Details h2 { margin-bottom: 20px; text-align: left; color: #333333; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #BranchDetails #BranchLeftTop { padding: 40px 30px 0 30px; } #BranchDetails #BranchLeftTop .title { color: #f7a933; margin-bottom: 8px; font: 16px/18px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #BranchDetails #BranchLeftTop .val { margin-bottom: 20px; } #BranchDetails #BranchLeftTop .val a { color: #555; } #BranchDetails #BranchLeftTop .val.tel { font: 30px/30px Plantin; } #BranchDetails #BranchContacts { margin: 20px; padding: 20px; } #BranchDetails #BranchContacts h3 { margin-bottom: 20px; text-align: center; color: #333333; font: 16px/18px JohnstonMdITCTT; letter-spacing: 2px; border-top: 1px solid #f7a933; color: #f7a933; padding-top: 30px; } #BranchDetails #BranchContacts .contact { padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px dotted #e5e5e5; } #BranchDetails #BranchContacts .contact.last { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } #BranchDetails #BranchContacts .contact a { color: #666666; } #BranchDetails #BranchContacts .name, #BranchDetails #BranchContacts strong { font-family: Plantin; font-weight: normal; } #BranchDetails #BranchContacts .contact .link { font-family: Plantin; color: #f7a933; } #BranchContact { padding: 30px; } #BranchContact a.back { margin-bottom: 20px; display: inline-block; font: 15px/15px Plantin; } #BranchContact .title { border-left: 2px solid #f7a933; padding: 8px 0 1px 10px; margin-bottom: 30px; text-align: left; } #BranchContact .title h2 { color: #333333; font: 22px/26px Plantin; text-transform: none; margin-bottom: 5px; } #BranchContact .title .info { margin: 0 0 8px; font: 16px/18px Plantin; color: #666666; } #BranchContact .title .info a { color: #666666; } #BranchContact .title .info strong { font-family: Plantin; font-weight: normal; } #BranchContact .text { padding-left: 10px; color: #666666; font: 16px/22px Plantin; text-align: left; } #BranchContact .hasImage img { float: left; width: 10%; margin-right: 2%; } #BranchContact .hasImage .right { float: left; width: 88%; } #BranchEvents { margin: 20px; padding: 20px; border: 1px solid #d9d9d9; background: #fff; } #BranchEvents h3 { margin-bottom: 20px; text-align: center; color: #333333; font: 16px/18px JohnstonMdITCTT; letter-spacing: 2px; } #BranchEvents .event { padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px dotted #e5e5e5; } #BranchEvents .event.last { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } #BranchEvents .event .name { font-family: Plantin; } #BranchEvents .event .link { font-family: Plantin; color: #4a7dd0; } /* End of Branch inner template */ /* IPO template */ #InnerBanner.ipo { padding-bottom: 0; } #InnerBanner.ipo .content { padding: 15px 0 80px; } #InnerBanner.ipo #Breadcrumb { color: #cccccc; } #InnerBanner.ipo #Breadcrumb a { color: #cccccc; } #InnerBanner.ipo .content .button { margin: 30px 0 0; color: #c4c7d9; border-color: #9095b0; } #IpoRegister { background: #f7a933; color: #fff; text-align: center; padding: 15px 0; } #IpoRegister .text { display: inline-block; vertical-align: top; padding: 12px 15px 0 5px; margin: 0 10px; font: 18px/18px Plantin; } #IpoRegister .link { display: inline-block; vertical-align: top; } #IpoRegister .link a { background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; padding: 15px 30px; text-align: center; display: inline-block; text-transform: uppercase; } #IpoCurrent { padding-bottom: 60px; } .ipoSection { margin-top: 40px; color: #333333; font: 16px/22px Plantin; } .ipoSection h2 { margin-bottom: 30px; color: #333333; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } .ipoSection .ipoPreview { padding: 10px; border-bottom: 1px solid #6e6e6d; } .ipoSection .ipoPreview:nth-child(even) { background: #f7f7f8; } .ipoSection .ipoPreview div { float: left; padding-right: 20px; } .ipoSection .ipoPreview .name { width: 34%; font-family: Plantin; } .ipoSection .ipoPreview .type { width: 21%; } .ipoSection .ipoPreview .pos { width: 25%; } .ipoSection .ipoPreview .link { width: 20%; padding-right: 0; text-align: right; } .ipoSection .ipoPreview .link a { display: block; padding: 15px 30px; color: #f7a933; text-transform: uppercase; background: #4a4949; text-align: center; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } .ipoSection .ipoPreview .link a.apply { background: #f7a933; color: #fff; } .ipoSection .ipoPreview.head { padding: 10px 0; border-bottom: 2px solid #6e6e6d; background: #fff; font: 14px/16px Plantin; text-transform: uppercase; } .ipoSection .ipoPreview.head .name { font-family: Plantin; } #IpoNews { padding: 50px 0 60px; background: #f7f7f7; } #IpoNews h2 { margin-bottom: 40px; color: #333333; font: 18px/18px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } .ipoSplit .row { margin: 0 -50px; } .ipoSplit .section { padding: 60px 50px; text-align: center; } #IpoSplitTop { background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(229,229,229,1) 50%, rgba(229,229,229,1) 100%); } #IpoSplitTop .svg { fill: #f7a933; max-height: 45px; } #IpoSplitTop .text { color: #555555; font: 16px/22px Plantin; } #IpoSplitTop .left h4 { font: 18px/20px JohnstonMdITCTT; color: #333333; margin: 0 0 20px; letter-spacing: 2px; } #IpoSplitTop .left .link a { background: #f7a933; color: #fff; font: 12px/12px JohnstonMdITCTT; margin-top: 40px; letter-spacing: 2px; padding: 15px 30px; text-align: center; display: inline-block; text-transform: uppercase; } #IpoSplitTop .right h4 { font: 18px/20px JohnstonMdITCTT; color: #333333; letter-spacing: 2px; } #IpoSplitTop .right .item { margin-top: 30px; text-align: left; } #IpoSplitTop .right .item .image { float: left; width: 10%; } #IpoSplitTop .right .item .text { float: left; width: 90%; padding-left: 20px; } #IpoSplitBottom { background: linear-gradient(to right, rgba(247,247,247,1) 0%, rgba(247,247,247,1) 50%, rgba(254,242,224,1) 50%, rgba(254,242,224,1) 100%); } #IpoSplitBottom .left { text-align: left; } #IpoSplitBottom .left .svg { max-height: 45px; max-width: 40px; margin-bottom: 25px; fill: #f7a933; } #IpoSplitBottom .left .link a { padding: 15px 30px; display: inline-block; margin-top: 20px; color: #f7a933; background: #4a4949; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #IpoSplitBottom .left h4 { font: 16px/16px JohnstonMdITCTT; color: #333333; letter-spacing: 2px; } #IpoSplitBottom .left .text { color: #555555; font: 16px/22px Plantin; margin: 20px 0; } #IpoSplitBottom .right { text-align: left; } #IpoSplitBottom .right h4 { color: #333; font: 16px/16px JohnstonMdITCTT; text-transform: uppercase; margin-bottom: 20px; letter-spacing: 2px; } #IpoSplitBottom .right .item { margin-bottom: 25px; font: 16px/22px Plantin; color: #a6adda; } /*#IpoSplitBottom .right .item.top { font: 20px/26px Plantin; }*/ #IpoSplitBottom .right .item a { color: #333; } #IpoSplitBottom .right .link a { padding: 15px 30px; display: inline-block; margin-top: 20px; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } /* End of IPO template */ /* Market news template */ #InnerBanner.mark { padding-bottom: 50px; } #InnerBanner.mark #Breadcrumb { color: #212a62; } #InnerBanner.mark #Breadcrumb a { color: #212a62; } #InnerBanner.mark .content { padding-bottom: 0; } #InnerBanner.mark .content .svg path { fill: #006972; } #InnerBanner.mark .content h3 { color: #1e2171; } #InnerBanner.mark .content h1, #InnerBanner.mark .content h2 { color: #006972; margin: 12px 0 0; font: 40px/44px Plantin; text-transform: none; } #MarketNews { padding: 40px 0 30px; background: #e5e5e5; text-align: center; } #MarketNews h2 { font: 18px/20px JohnstonMdITCTT; color: #333333; text-align: center; letter-spacing: 2px; } #MarketNews .text { margin-bottom: 30px; font: 16px/22px Plantin; margin: 15px 0 20px; } #MarketNews select { display: inline-block; background: #fff; margin-bottom: 25px; text-align: center; padding: 0 0 0 10px; height: 50px; text-transform: uppercase; color: #858585; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; border: 2px solid #f7a933; outline: none; } #MarketNews .news { background: #fff; padding: 12px 12px 10px; margin-bottom: 10px; } #MarketNews .news .left { float: left; width: 90%; padding: 4px 10px 4px 20px; text-align: left; } #MarketNews .news .left .title { margin-bottom: 8px; color: #f7a933; font: 23px/23px Plantin; } #MarketNews .news .left .date { color: #333333; font: 14px/14px Plantin; } #MarketNews .news a { float: right; width: 8%; display: block; height: 50px; color: #fff; text-transform: uppercase; background: #f7a933; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; } #MarketNews #Bottom { margin-top: 30px; text-align: left; } #MarketNews #Bottom a { display: inline-block; padding: 0 30px; height: 50px; color: #fff; text-transform: uppercase; background: #f7a933; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; } #MarketNews #Bottom .pull-right { text-align: right; } /* End of Market news template */ /* Brochures template */ #InnerBanner.brochures { padding-bottom: 80px; } #InnerBanner.brochures .content { padding: 15px 0 0; } #InnerBanner.brochures #Breadcrumb { color: #cccccc; } #InnerBanner.brochures #Breadcrumb a { color: #cccccc; } #InnerBanner.brochures h1 { margin-bottom: 0; } #InnerBanner.brochures h2 { color: #fff; font: 40px/44px Plantin; text-transform: none; margin: 12px 0 0; padding: 0 10px; } #InnerBanner.brochures h3 { color: #1e2171; } #Brochures { padding: 40px 0 30px; background: #e5e5e5; text-align: center; } #Brochures .left { text-align: left; } #Brochures a.back { margin-bottom: 20px; display: inline-block; font: 15px/15px Plantin; } #Brochures h2 { font: 18px/20px JohnstonMdITCTT; color: #333333; text-align: center; letter-spacing: 2px; } #Brochures .text { margin-bottom: 30px; font: 16px/22px Plantin; margin: 15px 0 20px; } #Brochures .cat { background: #fff; padding: 12px 12px 10px; margin-bottom: 10px; } #Brochures .cat .left { float: left; width: 86%; padding: 4px 10px 4px 20px; text-align: left; } #Brochures .cat .left .title { margin-bottom: 8px; color: #f7a933; font: 23px/23px Plantin; } #Brochures .cat .left .title span { color: #333333; font: 16px/23px Plantin; display: inline-block; margin-left: 10px; } #Brochures .cat .left .info { color: #333333; font: 14px/18px Plantin; } #Brochures .cat a { float: right; width: 12%; display: block; height: 50px; color: #fff; text-transform: uppercase; background: #f7a933; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; } /* End of Brochures template */ /* Careers template */ #InnerBanner.careers { padding-bottom: 80px; } #InnerBanner.careers .content { padding: 15px 0 0; } #InnerBanner.careers #Breadcrumb { color: #cccccc; } #InnerBanner.careers #Breadcrumb a { color: #cccccc; } #InnerBanner.careers h1 { margin-bottom: 0; } #InnerBanner.careers h2 { color: #fff; font: 40px/44px Plantin; text-transform: none; margin: 12px 0 0; padding: 0 10px; } #InnerBanner.careers h3 { color: #1e2171; } #Careers { padding: 40px 0 30px; background: #fff; text-align: center; } #Careers h2 { font: 18px/20px JohnstonMdITCTT; color: #333333; text-align: center; letter-spacing: 2px; } #Careers .text { font: 16px/22px Plantin; margin: 15px 0 20px; } #Careers select { display: inline-block; background: #e5e5e5; margin-bottom: 25px; text-align: center; padding: 0 0 0 10px; height: 50px; text-transform: uppercase; color: #858585; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; border: 2px solid #858585; } #Careers .job { background: #fff; padding: 12px 12px 10px; margin-bottom: 10px; } #Careers .job .left { float: left; width: 88%; padding: 4px 10px 4px 20px; text-align: left; } #Careers .job .left .title { margin-bottom: 8px; color: #f7a933; font: 23px/23px Plantin; } #Careers .job .left .date { color: #333333; font: 14px/14px Plantin; } #Careers .job a { float: right; width: 10%; display: block; height: 50px; color: #fff; text-transform: uppercase; background: #f7a933; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; } #Careers .left { text-align: left; } #Careers a.back { margin-bottom: 20px; color: #5d92d8; display: inline-block; font: 15px/15px Plantin; } #CareersBottom h2 { margin-bottom: 15px; } .threeWhiteBoxes { text-align: center; } .threeWhiteBoxes h2 { font: 18px/20px JohnstonMdITCTT; color: #333333; letter-spacing: 2px; } .threeWhiteBoxes .text { margin: 15px 0 30px; font: 16px/24px Plantin; } .threeWhiteBoxes .sec { background: #fff; padding: 25px 20px 30px; color: #666; } .threeWhiteBoxes.greyBoxes .sec { background: #fef2e0; } .threeWhiteBoxes .sec .svg { fill: #4a7dd0; max-height: 45px; } .threeWhiteBoxes .sec h3 { font: 18px/20px JohnstonMdITCTT; color: #333333; margin: 10px 0 15px; letter-spacing: 2px; } .threeWhiteBoxes .sec .text { margin-bottom: 0 !important; } .threeWhiteBoxes .sec strong { font-family: Plantin; } /*#CareersMiddle .sec a { padding:15px 20px; border:2px solid #aeaeae; display:inline-block; color:#999999; text-transform:uppercase; font:12px/12px JohnstonMdITCTT; letter-spacing:1px; }*/ .threeWhiteBoxes h2 { font: 18px/20px JohnstonMdITCTT; color: #333333; margin-bottom: 30px; letter-spacing: 2px; } #JobInner { padding: 40px 0; font: 14px/14px JohnstonMdITCTT; letter-spacing: 2px; } #JobInner .left { padding: 20px 15px 25px; background: #f4f4f4; color: #333; text-align: center; text-transform: uppercase; } #JobInner .left h2 { color: #333; font: 14px/14px JohnstonMdITCTT; padding-bottom: 8px; border-bottom: 1px solid #d9d9d9; text-align: center; letter-spacing: 2px; } #JobInner .left .head { margin: 20px 0 5px; } #JobInner .left .val { font-family: JohnstonMdITCTT; letter-spacing: 2px; } #JobInner .right { padding-left: 30px; margin-top: 35px; } #JobInner .right .title { margin: 5px 0 20px; padding: 15px 0 15px 10px; border-left: 2px solid #f7a933; } #JobInner .right .title .date { margin-bottom: 10px; font: 16px/18px Plantin; color: #cccccc; } #JobInner .right .title h1 { color: #333333; font: 22px/24px Plantin; text-transform: none; } #JobInner .right .details { padding-left: 10px; color: #666666; font: 16px/22px Plantin; } #JobInner .right a { margin: 40px 0 0 10px; height: 50px; display: inline-block; padding: 0 40px; color: #fff; text-transform: uppercase; background: #f7a933; font: 12px/50px JohnstonMdITCTT; letter-spacing: 2px; } #JobInner a.back { margin-bottom: 20px; color: #f7a933; display: inline-block; font: 15px/15px Plantin; } #JobApplication { padding: 40px 0; } #JobApplication h1 { font: 18px/20px JohnstonMdITCTT; color: #333333; text-align: center; letter-spacing: 2px; } #JobApplication .text { font: 16px/22px Plantin; margin: 15px 0 20px; text-align: center; } #JobApplication .InfoLabel { font: 16px/22px Plantin; color: red; } #JobApplication .validation { font: 16px/22px Plantin; color: red; text-align: center; } #JobApplication .left { text-align: left; } #JobApplication a.back { margin-bottom: 20px; color: #f7a933; display: inline-block; font: 15px/15px Plantin; } #JobApplication table { border-left: none; border-bottom: none; } #JobApplication table tr td { border-top: none; border-right: none; } .EditingFormTable { font: 16px/22px Plantin; display: block; } .EditingFormTable tbody { display: block; } .EditingFormTable tr { display: block; margin-bottom: 15px; } .EditingFormTable tr.noShow { display: none; } .EditingFormTable tr:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } .EditingFormTable tr .FieldLabel { float: left; width: 20%; } .EditingFormTable tr .EditingFormValueCell { float: left; width: 30%; } .EditingFormTable tr .EditingFormValueCell input[type=text], .EditingFormTable tr .EditingFormValueCell select { height: 40px; width: 100%; font: 16px/38px Plantin; background: #fff; border: 1px solid #6e6e6d; padding: 0 10px; } .EditingFormTable input[type=submit] { display: inline-block; background: #f7a933; color: #fff; letter-spacing: 2px; height: 50px; border: none; font-weight: normal; padding: 0 25px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } /* End of Careers template */ /* Make a payment template */ .form .row { margin-bottom: 15px; font: 16px/22px Plantin; } .form .row span:not(.EditingFormLabel):not(.checkbox) { color: red; } .form label { padding-top: 10px; display: block; } .form input[type=text], .form input[type=password], .form select, .form textarea { height: 40px; width: 100%; font: 16px/38px Plantin; background: #fff; border: 1px solid #6e6e6d; padding: 0 10px; } .form textarea { height: 160px; line-height: 24px; } .form input.topMargin, .form select.topMargin { margin-top: 15px; } .form select[multiple] { height: 130px; } .form input.top { margin-top: 15px; } .form input[type=submit], .form a.submit { display: inline-block; background: #f7a933; color: #fff; letter-spacing: 2px; height: 50px; border: none; font-weight: normal; padding: 0 25px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } .form input[type=submit].grey, .form a.submit.grey { background: #dedede; color: #555; } .form.fullWidth label { padding-top: 0px; } .form.fullWidth .row { margin-bottom: 0px; } .form.fullWidth .row .row { margin-bottom: 15px; } .form .checkbox { display: block; } .form .checkbox label { display: inline-block; vertical-align: top; } .form .checkbox input { display: inline-block; margin-top: 5px; margin-right: 5px; vertical-align: top; } .form .small { padding-top: 5px; font-size: 13px; } .form.fullWidth .required label:after { content: '*'; color: #f7a933; } #PaymentConf { text-align: center; } #PaymentConf .payCon { margin-bottom: 20px; font: 16px/22px Plantin; } #PaymentConf .payCon .top { font-family: Plantin; } #PaymentConf .edit { margin-bottom: 20px; display: inline-block; } #PaymentConf .submit { display: inline-block; background: #f7a933; color: #fff; letter-spacing: 2px; height: 50px; border: none; font-weight: normal; padding: 0 25px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } /* End of Make a payment template */ /* Contact template */ #InnerBanner.contact { padding-bottom: 80px; } #InnerBanner.contact .content { padding: 15px 0 0; } #InnerBanner.contact #Breadcrumb { color: #cccccc; } #InnerBanner.contact #Breadcrumb a { color: #cccccc; } #InnerBanner.contact h1 { margin-bottom: 0; } #InnerBanner.contact h3 { color: #1e2171; } #ContactTrade { background: #f7a933; color: #fff; text-align: center; padding: 20px 0; } #ContactTrade .text { display: inline-block; vertical-align: top; padding: 0 8px 0 5px; margin: 0 10px; font: 18px/18px Plantin; } #ContactTrade .text span { font-size: 16px; } #ContactTrade .text a { color: #fff; text-decoration: underline; } #ContactTop { overflow: hidden; } #ContactTop .svg { fill: #4a7dd0; max-height: 45px; } #ContactTop .left { position: relative; } #ContactTop .left img { position: absolute; top: 0; right: 0; max-width: none; } #ContactTop .right { padding: 50px 100px; text-align: center; } #ContactTop .right h2 { font: 18px/20px JohnstonMdITCTT; color: #333333; margin: 10px 0 30px; letter-spacing: 2px; } #ContactTop .right .text { margin-bottom: 30px; font: 16px/22px Plantin; } #ContactTop .right .bottom { font: 21px/27px Plantin; } #ContactTop .right .bottom strong { font-family: Plantin; } #ContactMiddle { background: #e5e5e5; padding: 40px 0; text-align: center; } #ContactMiddle h2 { font: 18px/20px JohnstonMdITCTT; color: #333333; letter-spacing: 2px; } #ContactMiddle .text { margin: 15px 0 30px; font: 16px/24px Plantin; } #ContactMiddle .sec { background: #fff; padding: 25px 20px 30px; color: #666; } #ContactMiddle .sec .svg { fill: #4a7dd0; max-height: 45px; } #ContactMiddle .sec h3 { font: 18px/20px JohnstonMdITCTT; color: #333333; margin: 10px 0 15px; letter-spacing: 2px; } #ContactMiddle .sec .text { margin-bottom: 0; } #ContactMiddle .sec strong { font-family: Plantin; } #ContactMiddle .sec a { padding: 15px 20px; background: #4a4949; display: inline-block; color: #f7a933; text-transform: uppercase; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } #ContactComp { background: #fff; padding: 40px 0; text-align: center; } #ContactComp .svg { fill: #4a7dd0; max-height: 45px; } #ContactComp h3 { font: 18px/20px JohnstonMdITCTT; color: #333333; margin: 10px 0 15px; letter-spacing: 2px; } #ContactComp .text { margin: 15px 0 0; font: 16px/24px Plantin; } /*#ContactComp .text a { padding:15px 20px; border:2px solid #aeaeae; display:inline-block; color:#999999; text-transform:uppercase; font:12px/12px JohnstonMdITCTT; letter-spacing:1px; }*/ /* End of Contact template */ /* News template */ #NewsSignUp { background: #f7a933; color: #fff; text-align: center; padding: 15px 0; } #NewsSignUp .text { display: inline-block; vertical-align: top; padding: 12px 15px 0 5px; margin: 0 10px; font: 18px/18px Plantin; } #NewsSignUp .link { display: inline-block; vertical-align: top; } #NewsSignUp .link a { background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; padding: 15px 30px; text-align: center; display: inline-block; text-transform: uppercase; } .EditMode #NewsSignUp .text { min-width: 100px; } .EditMode #NewsSignUp .link { min-width: 100px; } #News { padding: 40px 0 40px; background: #f7f7f7; } #News h2 { margin-bottom: 40px; color: #333333; font: 18px/18px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } #NewsLoadMoreHolder { text-align: center; } #NewsLoadMore { padding: 15px 30px; margin-top: 30px; display: inline-block; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; display: none; } #NewsMore { display: none; margin-top: 30px; } #NewsMore .loading { text-align: center; margin-top: 20px; } #NewsMore .loading img { display: inline-block; } #NewsCats { text-align: center; margin-bottom: 30px; } #NewsCats a { padding: 15px 30px; margin: 0 2px 5px; display: inline-block; color: #fff; background: #4a4949; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; transition: 1s; } #NewsCats a.active, #NewsCats a:hover { background: #6e6e6d; color: #fff; } #Events { padding: 40px 0 40px; } #Events h2 { margin-bottom: 40px; color: #333333; font: 18px/18px JohnstonMdITCTT; text-align: center; } #EventsLoadMoreHolder { text-align: center; } #EventsLoadMore { padding: 15px 30px; margin-top: 30px; display: inline-block; border: 2px solid #aeaeae; color: #999999; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; display: none; } #EventsMore { display: none; margin-top: 30px; } #EventsMore .loading { text-align: center; margin-top: 20px; } #EventsMore .loading img { display: inline-block; } #NewsInner { padding-bottom: 40px; } #NewsInner #Breadcrumb, #NewsInner #Breadcrumb a { color: #cccccc; } #NewsInner h2 { margin-bottom: 35px; color: #333333; font: 18px/18px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } #NewsInner .back { text-align: left; } #NewsInner .back a { margin-bottom: 20px; color: #f7a933; display: inline-block; font: 15px/15px Plantin; } #NewsInner .title { border-left: 2px solid #f7a933; padding: 4px 0 0 10px; margin-bottom: 30px; text-align: left; } #NewsInner .title .date { margin: 0 0 10px; font: 16px/18px Plantin; color: #cccccc; } #NewsInner .title h1 { color: #333333; font: 22px/26px Plantin; text-transform: none; } #NewsInner .text { padding-left: 10px; color: #666666; font: 16px/22px Plantin; text-align: left; } #NewsInnerBottom { background: #e5e5e5; padding: 40px 0; } #NewsInnerBottom h2 { margin-bottom: 35px; color: #333333; font: 18px/18px JohnstonMdITCTT; text-align: center; letter-spacing: 2px; } #NewsInner.market .title .date { color: #666666; } #NewsInner.market { padding-bottom: 0; } #NewsInner.market pre { background: none; border: none; margin: 0; padding: 0 0 0 10px; color: #666666; text-align: left; border-radius: 0; } #NewsletterSignup { background: #f7a933; color: #fff; font: 16px/18px Plantin; padding: 45px 0; text-align: center; } #NewsletterSignup .title { margin-bottom: 15px; color: #fff; font: 18px/18px JohnstonMdITCTT; text-align: center; text-transform: uppercase; letter-spacing: 2px; } #NewsletterSignup .form { margin-top: 20px; } #NewsletterSignup input[type=text] { vertical-align: top; padding: 0 10px; display: inline-block; width: 260px; border: 1px solid #e0e0e8; border-right: none; background: #e0e0e8; color: #666666; font: 14px/50px Plantin; height: 50px; } #NewsletterSignup input[type=submit] { vertical-align: top; display: inline-block; background: #f7a933; color: #fff; letter-spacing: 2px; height: 50px; border: none; font-weight: normal; padding: 0 25px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } #NewsletterSignup a { color: #333; } /* End of News template */ /* ISA template */ #InnerBanner.isa { padding-bottom: 0; } #InnerBanner.isa .content { padding: 35px 0 60px; } #InnerBanner.isa #Breadcrumb { color: #212a62; } #InnerBanner.isa #Breadcrumb a { color: #212a62; } #InnerBanner.isa h1 { color: #1e2171; margin-bottom: 0; } #InnerBanner.isa h3 { color: #1e2171; } #InnerBanner.isa .content .button { margin-bottom: 0; border-color: #1e2171; color: #1e2171; } #InnerBanner.isa .content .button:after { background: transparent; } #IsaBannerBlue { position: relative; z-index: 2; padding: 35px 0; } #IsaBannerBlue h2 { font: 24px/24px JohnstonMdITCTT; color: #fff; text-transform: uppercase; letter-spacing: 2px; text-align: center; } #IsaBannerBlue .background { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background: #4a4949; opacity: 1; } #IsaBannerBlue .container { position: relative; z-index: 2; } #IsaBannerBlue .image { position: relative; z-index: 2; width: 20%; } #IsaOptions { background: #212a62; border-top: 1px solid #404b8b; } #IsaOptions .option { padding: 60px 0; text-align: center; } #IsaOptions .option.left { border-right: 1px solid #404b8b; } #IsaOptions .option .svg { fill: #7f8acc; max-height: 90px; } #IsaOptions .option h2 { margin: 0 0 25px; font: 18px/18px JohnstonMdITCTT; color: #fff; letter-spacing: 2px; } #IsaOptions .option .text { font: 16px/22px Plantin; color: #a6adda; margin-bottom: 50px; } #IsaOptions .option .link a { background: #f7a933; color: #fff; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; padding: 15px 25px; text-align: center; display: inline-block; text-transform: uppercase; -webkit-box-shadow: 2px 2px 0px 0px #0d1127; -moz-box-shadow: 2px 2px 0px 0px #0d1127; box-shadow: 2px 2px 0px 0px #0d1127; } #IsaPayment { background: #616274; padding: 40px 0 50px; color: #fff; text-align: center; } #IsaPayment .svg { fill: #a8a9b5; max-height: 45px; } #IsaPayment h2 { margin: 20px 0; color: #fff; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #IsaPayment .text { color: #e2e3eb; font: 16px/22px Plantin; padding: 0 20%; margin-bottom: 30px; } #IsaPayment .link a { height: 45px; font: 12px/41px JohnstonMdITCTT; letter-spacing: 2px; border: 2px solid #c2c7cd; color: #c2c7cd; padding: 0 30px; display: inline-block; text-transform: uppercase; } #Benefits { padding: 30px 0; text-align: left; background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(254,242,224,1) 50%, rgba(254,242,224,1) 100%); } #Benefits.alt { background: linear-gradient(to right, rgba(254,242,224,1) 0%, rgba(254,242,224,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%); } #Benefits .col-sm-6 { padding: 0 70px; } #Benefits h2, #Benefits h3 { font: 18px/18px JohnstonMdITCTT; color: #333333; padding: 15px 0; letter-spacing: 2px; } #Benefits .text { font: 16px/22px Plantin; color: #555555; } #Benefits ul { list-style-type: none; padding: 0; margin: 0; } #Benefits ul li { margin-bottom: 20px; padding-left: 40px; background: url(/SiteFiles/Images/isaCross.png) no-repeat 0 3px; } #Benefits .left ul li { background: url(/SiteFiles/Images/isaTick.png) no-repeat 0 2px; } #Benefits ul.defaultBullets li { background: url(/SiteFiles/Images/isaBullet.png) no-repeat 0 2px; } #Benefits a { padding: 15px 30px; margin: 10px 0; display: inline-block; border: 2px solid #aeaeae; color: #999999; font: 12px/14px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #IsaCalculator { background: #f7a933; padding: 50px 0; text-align: center; } #IsaCalculator .svg { fill: #fff; width: 41px; height: 56px; display: inline-block; margin-right: 20px; vertical-align: top; } #IsaCalculator .content { display: inline-block; text-align: left; vertical-align: top; margin-right: 30px; } #IsaCalculator .content h2 { color: #fff; margin: 4px 0 12px; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #IsaCalculator .content .text { font: 18px/22px Plantin; color: #fff; } #IsaCalculator .content .text a { color: #fff; text-decoration: underline; } #IsaCalculator .link { display: inline-block; vertical-align: top; } #IsaCalculator .link a { color: #f7a933; background: #4a4949; font: 12px/45px JohnstonMdITCTT; letter-spacing: 2px; margin-top: 5px; padding: 0 30px; height: 45px; text-align: center; display: inline-block; text-transform: uppercase; } #IsaCost { background: #e5e5e5; padding: 60px 0; color: #555555; font: 16px/22px Plantin; } #IsaCost h2 { font: 18px/18px JohnstonMdITCTT; color: #333333; text-align: center; margin-bottom: 25px; letter-spacing: 2px; } #IsaSplit { overflow: hidden; background: #fef2e0; background: linear-gradient(to right, rgba(254,242,224,1) 0%, rgba(254,242,224,1) 50%, rgba(229,229,229,1) 50%, rgba(229,229,229,1) 100%); } #IsaSplit .left { color: #333; } #IsaSplit .newsHolder { position: relative; padding: 65px 40px 60px 70px; height: 420px; } #IsaSplit h4 { color: inherit; font: 16px/16px JohnstonMdITCTT; text-transform: uppercase; margin-bottom: 20px; letter-spacing: 2px; } #IsaSplit .item { margin-bottom: 25px; font: 16px/22px Plantin; color: inherit; } /*#IsaSplit .item.top { font: 20px/26px Plantin; }*/ #IsaSplit .item a { color: inherit; } #IsaSplit .button, #IsaSplit .link a { position: absolute; bottom: 60px; left: 70px; padding: 15px 30px; display: inline-block; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #IsaJisa img { position: absolute; z-index: 1; top: 0; left: -10px; min-width: 1500px; display: none; } #IsaJisa .content { position: relative; z-index: 2; font: 16px/22px Plantin; color: #333333; height: 100%; } #IsaJisa .content .link a { left: 0; bottom: 0; color: #f7a933; } #ProductSliderHolder.isa .svg path { fill: #f7a933; } #ProductSliderHolder.isa .slick-dots li.slick-active button { background: #f7a933 !important; } /* End of ISA template */ #BranchFinderPopup { padding: 25px 20px 20px; background: #f9f9f9; } #BranchFinderPopup .title { margin-bottom: 15px; } #BranchFinderPopup .title .svg { display: inline-block; vertical-align: middle; width: 10%; max-height: 50px; margin-right: 3%; fill: #adaebb; } #BranchFinderPopup .title .right { display: inline-block; vertical-align: middle; width: 87%; } #BranchFinderPopup .title .right h1 { color: #333333; font: 16px/16px JohnstonMdITCTT; margin-bottom: 5px; letter-spacing: 2px; } #BranchFinderPopup .title .right h2 { text-transform: none; color: #555555; font: 16px/18px Plantin; } #BranchFinderPopup h3 { margin-bottom: 10px; font: 12px/12px JohnstonMdITCTT; color: #999999; letter-spacing: 2px; } #BranchFinderPopup .branch { margin-bottom: 6px; background: #fff; padding: 10px; } #BranchFinderPopup .branch .left { float: left; width: 58%; padding-right: 20px; } #BranchFinderPopup .branch .left h2 { color: #333333; font: 20px/22px Plantin; margin-bottom: 8px; text-transform: none; } #BranchFinderPopup .branch .left .details { color: #999999; font: 14px/16px Plantin; } #BranchFinderPopup .branch .left .details a { color: #999999; } #BranchFinderPopup .branch .left .details .fa { margin-right: 2px; } #BranchFinderPopup .branch .button { float: left; width: 20%; margin-left: 1%; padding: 8px 10px; background: #f7a933; color: #fff; font: 14px/15px Plantin; text-align: center; border: none; white-space: normal; } #BranchFinderPopup .bottom { margin-top: 8px; } #BranchFinderPopup .bottom .left { float: left; width: 65%; padding-right: 20px; color: #948c8c; font: 12px/13px Plantin; } #BranchFinderPopup .bottom .left strong { font-family: Plantin; } #BranchFinderPopup .bottom .button { float: left; width: 35%; border: none; background: #4a4949; color: #f7a933; font: 12px/12px JohnstonMdITCTT; padding: 10px 0; text-transform: uppercase; letter-spacing: 2px; } #BranchFinderPopup .error { margin: 20px 0; color: red; line-height: 16px; } #BranchFinderPopup #Search input[type=text] { float: left; width: 80%; padding: 0 10px; border: 1px solid #cfcfcf; font-family: Plantin; height: 42px; } #BranchFinderPopup #Search .button { float: left; width: 20%; background: #f7a933; height: 42px; display: inline-block; border: none; color: #fff; text-transform: uppercase; font: 12px/42px JohnstonMdITCTT; letter-spacing: 2px; } .CMSSiteMapList li a { font-family: Plantin; } .CMSSiteMapList li li a { font-family: Plantin; } #IsaCalculatorPopup { padding: 30px; color: #666666; font: 16px/18px Plantin; } #IsaCalculatorPopup .title { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #9899a9; } #IsaCalculatorPopup .title svg { float: left; width: 8%; padding-right: 20px; } #IsaCalculatorPopup .title .right { float: left; width: 92%; } #IsaCalculatorPopup .title .right h1 { margin-bottom: 10px; color: #1f1f1f; font: 18px/18px JohnstonMdITCTT; letter-spacing: 2px; } #IsaCalculatorPopup .title .right h2 { color: #666666; font: 16px/18px Plantin; text-transform: none; } #IsaCalculatorPopup .isaRow { margin-bottom: 12px; } #IsaCalculatorPopup .isaRow .left { float: left; width: 50%; padding-right: 30px; padding-top: 10px; } #IsaCalculatorPopup .isaRow .right { float: left; width: 50%; } #IsaCalculatorPopup .isaRow .right .sign { float: left; width: 8%; color: #333333; font: 24px/40px Plantin; } #IsaCalculatorPopup .isaRow .right input[type=text] { width: 92%; height: 40px; font: 16px/40px Plantin; border: 1px solid #6e6e6d; background: #fff; color: #333333; padding: 0 10px; } #IsaCalculatorPopup .isaRow .right.split input[type=text] { width: 44%; margin-right: 2%; } #IsaCalculatorPopup .isaRow .right select { width: 44%; height: 40px; font: 16px/40px Plantin; border: 1px solid #6e6e6d; background: #fff; color: #333333; padding: 0 10px; } #IsaCalculatorPopup .isaRow .right .ui-slider { float: left; width: 70%; margin-top: 8px; border: 1px solid #6e6e6d; border-radius: 1px; background: #fff; height: 11px; top: 0; } #IsaCalculatorPopup .isaRow .right .ui-slider .ui-widget-header { background: #f7a933; border-radius: 0; } #IsaCalculatorPopup .isaRow .right .ui-slider .ui-slider-handle { border: 2px solid #6e6e6d; height: 22px; width: 22px; top: 0; margin-left: -11px; margin-top: -7px; border-radius: 50%; background: #fff; outline: none; } #IsaCalculatorPopup .isaRow .right .values { float: left; width: 70%; padding-top: 8px; } #IsaCalculatorPopup .isaRow .right .values .left { padding: 0; } #IsaCalculatorPopup .isaRow .right .values .right { padding: 0; text-align: right; } #IsaCalculatorPopup .isaRow .helpDrop { display: none; margin-top: 10px; font: 12px/14px Plantin; } #IsaCalculatorPopup .isaRow .right .value { float: right; width: 17%; margin-left: 5%; padding-top: 8px; background: #4a4949; color: #fff; height: 42px; text-align: center; font: 24px/24px Plantin; } #IsaCalculatorPopup .isaRow .right .value.years { position: relative; font: 24px/24px Plantin; padding-top: 5px; } #IsaCalculatorPopup .isaRow .right .value.years:after { position: absolute; bottom: 4px; left: 0; width: 100%; content: "Years"; text-transform: uppercase; font: 10px/10px Plantin; } #IsaCalculatorPopup .results { margin: 35px -2px 0; color: #333; } #IsaCalculatorPopup .results .col { float: left; width: 33.3333%; padding: 0 2px; text-align: center; } #IsaCalculatorPopup .results .col .inner { padding: 20px; color: #fff; } #IsaCalculatorPopup .results .col.one .inner { background: #6e6e6d; } #IsaCalculatorPopup .results .col.two .inner { background: #4a4949; } #IsaCalculatorPopup .results .col.three .inner { background: #f7a933; } #IsaCalculatorPopup .results .col .title { height: 45px; padding: 0; margin-bottom: 20px; border: none; font: 16px/20px Plantin; } #IsaCalculatorPopup .results .col .value { font: 24px/24px Plantin; } #CwaIframe { width: 180px; } #CwaIframe .pay { background: #f7a933; color: #fff; width: 100%; display: block; padding: 17px 0; font: 13px/19px JohnstonMdITCTT, Arial, Sans-Serif; text-transform: uppercase; text-align: center; margin: 10px 0; letter-spacing: 2px; } #CwaIframe #Market #Title { background: #6A4F86; color: #fff; font: 13px/19px JohnstonMdITCTT, Arial, Sans-Serif; text-transform: uppercase; padding: 5px 0; text-align: center; letter-spacing: 2px; } #CwaIframe #Market .item { padding: 3px 2px 1px; } #CwaIframe #Market .item .col { float: left; font: 11px/15px Plantin, Arial, Sans-Serif; } #CwaIframe #Market .item:nth-child(even) { background: #f7f7f7; } #CwaIframe #Market .item .col.one { width: 37%; padding-right: 5px; } #CwaIframe #Market .item .col.two { width: 37%; padding-right: 5px; } #CwaIframe #Market .item .col.three { width: 26%; } #CwaIframe #Market .item a { color: #555; } #CwaIframe #Market .item.neg, #CwaIframe #Market .item.neg a { color: #cc0033; } #CwaIframe #Market .item.pos, #CwaIframe #Market .item.pos a { color: #339900; } #CwaIframe #Market .item.neg .fa { margin-right: 2px; } #CwaIframe #Market .item.neg .fa-play { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg); } #CwaIframe #Market .item.pos .fa-play { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); transform: rotate(-90deg); } #CwaIframe p { font: 11px/15px Plantin, Arial, Sans-Serif; } #CwaIframe p strong { font-family: Plantin, Arial, Sans-Serif; } #CwaMyAccount { background: #fff; padding: 40px 0; text-align: center; } #CwaMyAccount #AccountOptions { margin-top: 20px; } #CwaMyAccount #AccountOptions .col { text-align: center; padding: 40px; background: #fef2e0; } #CwaMyAccount #AccountOptions .col h2 { margin-bottom: 20px; } #CwaMyAccount #AccountOptions .col a { padding: 15px 20px; background: #4a4949; display: inline-block; color: #f7a933; text-transform: uppercase; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } #CwaJobApplications { background: #e5e5e5; padding: 40px 0; } #CwaJobApplications .jobApp { background: #fff; padding: 16px 22px 14px 32px; margin-top: 10px; } #CwaJobApplications .jobApp .title { margin-bottom: 8px; color: #f7a933; font: 23px/23px Plantin; } #CwaJobApplications .jobApp .title span { color: #333333; font: 16px/23px Plantin; display: inline-block; margin-left: 10px; } #CwaJobApplications .jobApp .info { color: #333333; font: 14px/18px Plantin; } #CwaJobApplications .jobApp .info strong { font-family: Plantin; } #CwaJobApplications .noResults { background: #fff; padding: 20px; } /*Start of SIPP Template*/ #SIPPAccordion { padding: 20px 0; } #SIPPAccordion .title { border: 1px solid #d6d6d6; padding: 15px 30px 13px 15px; color: #333333; font: 16px/18px Plantin; background: #fff; text-align: left; border-radius: 0; outline: none; } #SIPPAccordion .text { margin: 0 !important; text-align: left; font: 16px/22px Plantin; padding: 15px; border-radius: 0; } #SIPPAccordion .ui-accordion-header-icon { left: auto; right: 10px; text-indent: unset; text-align: center; } #SIPPAccordion .ui-accordion-header-icon:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: "+"; color: #f7a933; font-size: 22px; font-weight: bold; } #SIPPAccordion .ui-accordion-header-icon.ui-icon-triangle-1-s:after { content: "-"; } .sippProductTable { border-left: 0; border-bottom: 0; color: #333333; font: 16px/22px Plantin; width: 100% !important; } .sippProductTable th { padding: 10px; border-bottom: 2px solid #6e6e6d; background: #fff; font: 14px/16px Plantin; text-transform: uppercase; text-align: left; vertical-align: bottom; } .sippProductTable td { border-bottom: 1px solid #6e6e6d; border-right: 0; padding: 10px; } .sippProductTable tr:nth-child(odd) td { background: #f7f7f8; } .sippProductTable td.col1 { font-family: Plantin; } .sippProductTable .col1, .sippProductTable .col2, .sippProductTable .col3, .sippProductTable .col4, .sippProductTable .col5 { width: 20%; } .sippProductTable .button { display: block; padding: 10px; margin: 5px 0; color: #fff; text-transform: uppercase; background: #f7a933; text-align: center; font: 12px/12px JohnstonMdITCTT; letter-spacing: 2px; } /*End of SIPP Template*/ #DisclaimerBar { text-align: center; background: #fff; position: fixed; bottom: 0; left: 0; width: 100%; padding: 15px 0; line-height: 21px; font-size: 15px; z-index: 11; } .cssTabs { max-width: 100%; float: none; list-style: none; padding: 0; } .cssTabs:after { content: ''; display: table; clear: both; } .cssTabs input[type=radio] { display: none; } .cssTabs label { display: inline-block; text-decoration: none; text-align: center; cursor: pointer; height: auto; background: #e8e7e7; padding: 10px 20px; margin-right: 5px; font: 16px/22px Plantin; } .cssTabs input[type=radio]:checked + label { background: #fff; } .cssTabs .tab-content { display: none; width: 100%; float: left; font: 16px/22px Plantin; color: #333333; padding: 15px 0; } #BottomBanners { width: 100%; position: fixed; bottom: 0; left: 0; z-index: 999999999999; } #BottomBanners > div { border-top: 1px solid #333; } #CookieBanner, #AnnouncementBanner { padding: 20px 0; background: #e5e5e5; color: #333; font: 16px/20px JohnstonMdITCTT; } #AnnouncementBanner { background: #4a4949; color: #fff } #CookieBanner .container, #AnnouncementBanner .container { display: flex; align-items: center } #CookieBanner a, #AnnouncementBanner a { color: #333; text-decoration: underline; } #AnnouncementBanner a { color: #fff; } #CookieBanner .icon { width: 5%; } #CookieBanner .icon svg { max-width: 40px; height: auto; } #CookieBanner .icon svg .svgGold { fill: #333; } #CookieBanner .text, #AnnouncementBanner .text { width: 85%; padding: 0 15px; } #AnnouncementBanner .text { width: 90%; } #CookieBanner .button, #AnnouncementBanner .button { width: 10%; } #CookieBanner .button a, #AnnouncementBanner .button a { display: block; height: 40px; padding: 10px 0; border: 2px solid #4a4949; color: #4a4949; font: 12px/14px JohnstonMdITCTT; letter-spacing: 2px; text-align: center; text-transform: uppercase; -webkit-transition: all .35s; -moz-transition: all .35s; transition: all .35s; text-decoration: none; } #AnnouncementBanner .button a { color: #fff; background: #f7a933 } #CookieBanner .button a:hover { background: #4a4949; color: #fff; } #AnnouncementBanner .button a:hover { background: #fff; color: #4a4949; } .signatureHolder { margin: auto; padding-top: 20%; background-color: #ffffff; position: relative; } .signatureHolder canvas { cursor: crosshair; position: absolute; top: 0; left: 0; outline: 1px solid #000; } .signatureHolder .delete { width: 25px; height: 25px; position: absolute; top: 2px; right: 2px; color: #30383c; font-size: 32px; text-align: center; cursor: pointer; } .signatureHolder .delete::before, .signatureHolder .delete::after { content: ""; display: block; width: 100%; border: solid 3px currentColor; border-bottom: none; position: absolute; top: 50%; } .signatureHolder .delete::before { transform: translateY(-50%) rotate(45deg); -webkit-transform: translateY(-50%) rotate(45deg); -moz-transform: translateY(-50%) rotate(45deg) } .signatureHolder .delete::after { transform: translateY(-50%) rotate(-45deg); -webkit-transform: translateY(-50%) rotate(-45deg); -moz-transform: translateY(-50%) rotate(-45deg) } .newsEventsFifty { background: #F7F7F7; padding: 100px 0; } .newsEventsFifty .sides { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; margin: 0 -10px; } .newsEventsFifty .side { margin: 0 10px; background-color: #fff; padding: 40px 30px; } .newsEventsFifty .newsSide { width: calc(60% - 20px); } .newsEventsFifty .eventsSide { width: calc(40% - 20px); } .newsEventsFifty .side .panelTitle { color: #333; font-size: 18px; line-height: 1; font-weight: 500; font-family: JohnstonMdITCTT; margin-bottom: 30px; } .newsEventsFifty .newsCharity { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; } .newsEventsFifty .newsCharity > a { width: 25%; display: inline-block; } .newsEventsFifty .newsCharity > a img { width: 100%; float: none; } .newsEventsFifty .newsCharity .content { width: 75%; position: relative; } .teamListing { padding: 60px 0; } .formPickerWidget { padding: 60px 0; } .formPickerWidget .title { margin-bottom: 20px; } .fifty-fifty { display: flex; gap: 120px; justify-content: flex-end;} .fifty-fifty.text-image { flex-direction: row; } .fifty-fifty.image-text { flex-direction: row-reverse; } .fifty-fifty.grey { background: #f9f9f9; } .fifty-fifty.yellow { background: #FEF2E0; } .fifty-fifty .fifty-fifty__text { max-width: 340px; padding: 60px 0; color: #333; font-family: Plantin; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .fifty-fifty .fifty-fifty__image { width: 50%; height: 520px; } .fifty-fifty .fifty-fifty__image img { height: 100%; width: 100%; object-fit: cover; } .charge-calculator { display: flex; background: #fff; width: 100%; height: 969px; color: #111; } .charge-calculator .charge-calculator__panel { display: flex; flex-direction: column; } .charge-calculator .charge-calculator__form { display: flex; flex-direction: column; overflow: auto; gap: 50px; } .charge-calculator .charge-calculator__fees { width: 53%; padding: 100px 150px; } .charge-calculator .charge-calculator__calculator { width: 53%; padding: 50px 150px; overflow: auto; } .charge-calculator .charge-calculator__intro { display: flex; flex-direction: column; gap: 30px; margin-bottom: 50px; } .charge-calculator .charge-calculator__intro .charge-calculator__title { font-weight: 400; font-size: 45px; line-height: 100%; letter-spacing: -0.01px; } .charge-calculator .charge-calculator__calculator .charge-calculator__intro .charge-calculator__description { font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: -0.04px; } .charge-calculator .charge-calculator__calculator .charge-calculator__section { display: flex; flex-direction: column; gap: 16px; } .charge-calculator .charge-calculator__calculator .charge-calculator__label { display: flex; gap: 10px; font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: -0.04px; } .charge-calculator .charge-calculator__calculator .charge-calculator__label.charge-calculator__label--indent { margin: 8px 0 0 8px; } .charge-calculator .charge-calculator__calculator .charge-calculator__label span { font-weight: 400; } .charge-calculator .charge-calculator__calculator .charge-calculator__input { position: relative; } .charge-calculator .charge-calculator__calculator .charge-calculator__input select, .charge-calculator .charge-calculator__calculator .charge-calculator__input input{ border: 1px solid #4A4949; padding: 20px 28px; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: 0.05px; text-transform: uppercase; outline: none; font-family: JohnstonMdITCTT; appearance: none; width: 100%; } .charge-calculator .charge-calculator__calculator .charge-calculator__input--select::after { content: ""; position: absolute; top: 45%; right: 26px; transform: rotate(-45deg) translateY(-55%); border-left: 1px solid #000000; border-bottom: 1px solid #000000; width: 10px; height: 10px; } .charge-calculator .charge-calculator__calculator .charge-calculator__input--trade-value:focus-within input::placeholder { color: white; } .charge-calculator .charge-calculator__calculator .charge-calculator__input--trade-value:has(input:not(:placeholder-shown))::after, .charge-calculator .charge-calculator__calculator .charge-calculator__input--trade-value:focus-within::after { content: ' \00A3'; position: absolute; top: 21px; left: 20px; font-weight: 700; font-size: 14px; line-height: 20px; font-family: JohnstonMdITCTT; } .charge-calculator .charge-calculator__underline-link { font-family: JohnstonMdITCTT; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: 0.05px; text-transform: uppercase; text-decoration: underline; appearance: none; background: white; border: none; width: 178px; margin-top: 30px; color: #333333; } .charge-calculator .charge-calculator__button { border: 2px solid #F7A933; padding: 16px 24px; font-family: JohnstonMdITCTT; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: 0.05px; text-transform: uppercase; appearance: none; background: white; width: 143px; margin-top: 50px; } .charge-calculator .charge-calculator__fees .charge-calculator__card { display: flex; flex-direction: column; font-weight: 400; font-size: 18px; line-height: 28px; letter-spacing: -0.04px; padding: 50px; gap: 20px; box-shadow: 0px 0px 20px 0px #00000040; margin-bottom: 20px; } .charge-calculator .charge-calculator__fees .charge-calculator__fee {font-weight: 400; font-size: 45px; line-height: 100%; letter-spacing: -0.01px; } .charge-calculator .charge-calculator__fees .charge-calculator__fee span { font-weight: 400; font-size: 24px; line-height: 30px; letter-spacing: -0.01px; } .charge-calculator .charge-calculator__fees .charge-calculator__breakdown { margin-top: 30px; display: flex; flex-direction: column; gap: 20px; max-height: 380px; overflow-y: auto; padding-right: 15px; } .charge-calculator .charge-calculator__fees .charge-calculator__breakdown-label { width: 70%; } .charge-calculator .charge-calculator__fees .charge-calculator__breakdown-fee { display: flex; gap: 7px; align-items: flex-end; } .charge-calculator .charge-calculator__fees .charge-calculator__breakdown-row { display: flex; align-items: center; justify-content: space-between; } .charge-calculator .charge-calculator__fees .charge-calculator__breakdown-row div { font-weight: 400; font-size: 20px; line-height: 28px; letter-spacing: -0.04px; } .charge-calculator .charge-calculator__fees .charge-calculator__breakdown-row span { font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: -0.04px; } .charge-calculator .charge-calculator__fees .charge-calculator__note { font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: -0.04px; } .charge-calculator .charge-calculator__error { color: red; } .charge-calculator .charge-calculator__image { width: 47%; } .charge-calculator .charge-calculator__image img { object-fit: cover; width: 100%; object-position: top; } .form-steps { background: #F9F9F9; padding: 100px 80px; } .form-steps .form-steps__inner { background: #FFFFFF; box-shadow: 0px 0px 20px 0px #0000001A; display: flex; position: relative; justify-content: center; flex-direction: column; padding: 28px 40px; } .form-steps .form-steps__dots { position: absolute; top: 110px; left: 73px; height: 80%; width: 3px; border-left: 3px dashed #F7A933; } .form-steps .form-steps__step-row { display: flex; gap: 87px; padding-top: 48px;} .form-steps .form-steps__step-row:first-child { padding-top: 0;} .form-steps .form-steps__step-row .form-steps__step-number { height: 70px; width: 80px; z-index: 2;} .form-steps .form-steps__step-row .form-steps__step-number img { height: 100%; width: 100%; object-fit: cover; } .form-steps .form-steps__step-row .no-border { border-bottom: none !important; } .form-steps .form-steps__step-row .form-steps__step-content { display: flex; gap: 50px; align-items: flex-start; border-bottom: 1px solid #4A494980; width: 100%; padding-bottom: 48px; } .form-steps .form-steps__step-row .form-steps__step-content a { color: #333333; text-decoration: underline; } .form-steps .form-steps__step-row .form-steps__step-content ul li::marker { color: #F7A933; } .form-steps .form-steps__step-row .form-steps__step-content--col { flex-direction: column; gap: 20px; } .form-steps .form-steps__step-row .form-steps__step-content--row { gap: 50px; align-items: flex-start; } .form-steps .form-steps__step-row .form-steps__step-image { width: 350px; height: 234px; } .form-steps .form-steps__step-row .form-steps__step-image img { width: 100%; height: 100%; object-fit: cover; } .form-steps .form-steps__step-row .form-steps__step-text { font-family: Plantin MT Pro; font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: -0.04px; } .form-steps .form-steps__step-row .form-steps__forms { display: flex; gap: 10px; justify-content: flex-start; } .form-steps .form-steps__step-row .form-steps__form { display: flex; gap: 10px; justify-content: center; flex-direction: column; align-items: center; background: #F9F9F9; padding: 20px; font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: -0.04px; width: 240px; text-align: center; text-decoration: none !important; } .form-steps .form-steps__step-row .form-steps__form-prompt { font-family:JohnstonMdITCTT; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: 0.05px; text-transform: uppercase; padding-bottom: 8px; border-bottom: 2px solid #333333; } .form-steps .form-steps__step-row .form-steps__form-icon { height: 50px; width: 50px; } .form-steps .form-steps__step-row .form-steps__form-icon img { height: 100%; width: 100%; object-fit: cover; } .form-steps .form-steps__step-row .form-steps__location-icons { display: flex; gap: 20px; justify-content: flex-start; } .form-steps .form-steps__step-row .form-steps__location-icon { height: 50px; width: 50px; } .form-steps .form-steps__step-row .form-steps__location-icon img { height: 100%; width: 100%; object-fit: cover; } .charge-calculator .charge-calculator__breakdown-commission { display: flex; flex-direction: column; } .charge-calculator .charge-calculator__breakdown-items { display: flex; flex-direction: column; } .charge-calculator .charge-calculator__breakdown-items .charge-calculator__breakdown-item { display: flex; gap: 6px; padding: 3px 20px; margin-right: 30px; border-bottom: 1px dashed #00000040; font-size: 14px; } .video-banner { background: #4A4949; position: relative; min-height: 650px; position: relative; } .video-banner .svg { position: absolute; top: 0; left: 0; width: 235px; height: 161px; z-index: 2; } .video-banner .video-banner__container { display: flex; gap: 20px; height: 100%; min-height: 650px; position: relative; } .video-banner .video-banner__container .video-banner__text-content { flex: 1; padding-top: 160px; display: flex; flex-direction: column; gap: 20px; color: #fff; font-size: 4.375rem; line-height: 4.375rem; z-index: 2;} .video-banner .video-banner__container .video-banner__video-content { flex: 1; display: flex; align-items: center; justify-content: center; } .video-banner .video-banner__container .video-banner__video-content video { display: none; } .video-banner .video-banner__container .video-banner__video-content video.active { display: block; width: 100%; height: 100%; z-index: 1; position: absolute; bottom: 0; left: 0; } .video-banner .video-banner__container .video-banner__video-content img.hidden { display: none; } .video-banner .video-banner__container .video-banner__text-content .btn { display: inline-block; position: relative; text-align: center; padding: 15px 25px; border: 2px solid #f7a933; color: #4a4949; text-transform: uppercase; font: 12px / 14px JohnstonMdITCTT; letter-spacing: 2px; transition: 0.8s; background: #fff; font-weight: 500; width: fit-content; } .yellow-text { color: #F7A933; } @media (min-width: 1200px) { /* large desktop */ #SiteHeader #SiteNav ul li a { padding: 0 10px; } #SiteHeader #SiteNavLogin a { padding: 17px 28px; } #SiteTopMenu #SiteTopMenuLeft { width: 56%; } #SiteTopMenu #SiteTopMenuRight { width: 44%; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .row { margin-left: -18px; margin-right: -18px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol { padding-left: 18px; padding-right: 18px; } #SiteHeader #SiteNav ul li.submenu ul .megaMenu .menuCol .title { font-size: 20px; } #SiteHeader #SiteHeaderTop.fixed #SiteLogo { width: 15%; } #SiteHeader #SiteHeaderTop.fixed #SiteLogo a { padding-left: 20px; } #SiteHeader #SiteHeaderTop.fixed #SiteTopMenu { padding-right: 30px; width: 85%; padding-top: 0; } #Breadcrumb { margin-left: 10px; } #InnerBanner .content .text { margin: 0 20%; } .slidePanel .container { padding: 0 75px; } #ImNewsSection .container { padding: 0 70px; } #ClientInfoTabs ul li { width: 13%; } .ipoSplit .row { margin: 0 -100px; } .ipoSplit .section { padding: 60px 100px; } } @media (min-width: 991px) { /* above tablet */ #MobileMenu { display: none !important; } #MobileShareSearchMenu { display: none !important; } } @media (max-width: 991px) { /* tablet */ #SiteTopMenu #SiteTopMenuLeft { float: none; width: 100%; } #SiteTopMenu #SiteTopMenuRight { float: none; width: 60%; } .pageBanner { min-height: 400px; } .pageBanner.branch { min-height: 160px; } #InnerBanner .content .text { margin: 0 10px; } .pageBanner .inner .text { margin: 0 10px 20px; } #SearchBranch .search { display: block; margin-top: 10px; } #ImSearchBranch .search { display: block; margin-top: 10px; } #SdSearchBranch .search { display: block; margin-top: 10px; } .slidePanel .content { padding: 30px 30px 20px; } .slidePanel .image .content { padding: 30px 30px 20px; } .terms .container { padding: 0 10px; } #MediaBottom .holder { padding: 30px; } #ImNewsSection .newsHolder { padding: 35px 30px 35px 30px !important; } #ImNewsSection .button { bottom: 35px; left: 30px; } #IsaSplit .newsHolder { padding: 45px 30px 35px 50px !important; } #IsaSplit .button { bottom: 35px; left: 50px; } #GetInTouch.split .item { padding: 40px 40px; } #AboutBannerBlue .bottomText { padding: 0 10px; } #SiteHeader #SiteHeaderTop { padding: 0; } #SiteHeader #SiteHeaderTop.fixed { position: relative; max-height: none; padding: 0; } #SiteHeader #SiteHeaderTop.fixed #SiteLogo { width: 41.66666667%; } #SiteHeader #SiteHeaderTop.fixed #SiteLogo img { max-height: none; } #SiteHeader #SiteLogo a { padding: 15px 0; display: block; } #MobileMenus { padding-right: 0; text-align: right; width: 30%; float: right; } #MobileMenus span { float: left; width: 33.3333%; } #MobileMenus span a { border-left: 1px solid #eff0f1; display: block; padding: 17px 5px 0; text-align: center; color: #666666; font: 10px/12px JohnstonMdITCTT; text-transform: uppercase; letter-spacing: 2px; } #MobileMenus span a .fa { color: #f7a933; font-size: 18px; display: block; min-height: 25px; } #MobileMenus span a .fa-lock { padding-top: 1px; } #MobileMenus span a.on { background: #f7a933; color: #fff; } #MobileMenus span a.on .fa { color: #fff; } #MobileMenus span a.on .mobMenu:before { background: linear-gradient(to bottom, #fff, #fff 20%, #f7a933 20%, #f7a933 40%, #fff 40%, #fff 60%, #f7a933 60%, #f7a933 80%, #fff 80%, #fff 100%); } .mobMenu { position: relative; padding-top: 5px; padding-left: 20px; min-height: 25px; } .mobMenu:before { content: ""; position: absolute; left: 50%; margin: 0 0 0 -10px; top: 5px; width: 20px; height: 12px; background: linear-gradient(to bottom, #f7a933, #f7a933 20%, white 20%, white 40%, #f7a933 40%, #f7a933 60%, white 60%, white 80%, #f7a933 80%, #f7a933 100%); } #MobileMenu { background: #6e6e6d; padding-top: 25px; display: none; z-index: 11; position: absolute; width: 100%; height: 100vh; top: 0; left: 0; } #MobileMenu ul { list-style-type: none; padding: 0; margin: 0; } #MobileMenu ul li { display: block; } #MobileMenu ul li a { display: inline-block; width: 100%; text-align: center; margin-bottom: 25px; color: #fff; text-transform: uppercase; font: 12px/14px JohnstonMdITCTT; letter-spacing: 2px; } #MobileMenu ul li.Highlighted a { color: #f7a933; } #MobileMenu ul li.Highlighted li a { color: #fff; } #MobileMenu ul li.Highlighted li.Highlighted a { color: #f7a933; text-decoration: underline; } #MobileShareSearchMenu { background: #6e6e6d; padding: 25px 10px 0; display: none; z-index: 11; position: absolute; width: 100%; height: 100vh; top: 0; left: 0; } #MobileShareSearchMenu .title { color: #fff; text-transform: uppercase; font: 12px/14px JohnstonMdITCTT; letter-spacing: 2px; margin-bottom: 20px; text-align: center; } #MobileShareSearchMenu .popoutFormCol { padding: 0 !important; width: 100% !important; float: none !important; } #MobileShareSearchMenu .popoutFormCol input[type=text] { margin-bottom: 10px; padding: 0 10px; width: 100%; height: 40px; background: #e0e0e8; color: #666666; font: 14px/40px Plantin; border: none; } #MobileShareSearchMenu .popoutFormCol input[type=submit] { width: 100%; height: 40px; padding: 0; background: #f7a933; color: #fff; font: 12px/40px JohnstonMdITCTT; border: none; text-transform: uppercase; letter-spacing: 2px; } #AboutHistorySliderNav .slick-prev { left: -20px; } #AboutHistorySliderNav .slick-next { right: -20px; } #AboutImages a { width: 24%; } .newsCharity img { width: 35%; } .newsCharity .content { width: 65%; } #Benefits .col-sm-6 { padding: 0 30px; } #SdBrochures #SdBrochuresInner { padding: 0 25%; } #SdMarketKnowledge .smallText { padding: 0 10%; } #SdMarkets .riseFallSec { margin-bottom: 20px; } #SdMarkets .searchInner { text-align: center; } #SdMarkets .searchInner .searchText { width: 85%; text-align: left; } #SdMarkets .searchInner .button { width: 15%; } #SdMarkets .searchInner .compLink { float: none; width: auto; padding: 0 20px; margin-top: 20px; } #IpoRegister .link { display: block; margin-top: 10px; } #NewsSignUp .link { display: block; margin-top: 10px; } #SdCompanyNav li a { margin: 0 4px 8px; padding-bottom: 8px; } #GlossaryNav li a { margin: 0 4px 8px; padding-bottom: 8px; } #SdMarketKnowledge .sdTeaser { padding: 20px; height: 150px; } #SdMarketKnowledge .sdTeaser .fa { left: 0; padding-left: 20px; } #SdMarketKnowledge .sdTeaser .hover { padding: 20px; } #ContactTop .right { padding: 50px 60px; } #Careers .job .left { width: 84%; } #Careers .job a { width: 14%; } #Brochures .cat .left { width: 82%; } #Brochures .cat a { width: 16%; } #MarketNews .news .left { width: 86%; } #MarketNews .news a { width: 12%; } .sippProductTable { font: 14px/18px Plantin; } .sippProductTable th { font: 12px/14px Plantin; } .mpsForm .imageRight, .mpsForm .image { float: none; margin: 20px 0; } .fifty-fifty { gap: 30px; } .fifty-fifty.image-text, .fifty-fifty.text-image { flex-direction: column-reverse; justify-content: center; } .fifty-fifty .fifty-fifty__text { padding: 0 15px 30px 15px; max-width: unset; } .fifty-fifty .fifty-fifty__image { width: 100vw; height: 190px; } } @media (max-width: 767px) { /* mobile */ #SiteHeader #SiteLogo .svg { max-height: none; width: 100%; } #HomeBanner { height: 400px; } #HomeBanner img { max-height: 100%; } #HomeBanner .content a { margin-bottom: 20px; } .fancybox-close { top: -10px !important; right: -10px !important; width: 34px !important; height: 34px !important; } #SiteHeader #SiteHeaderTop.fixed #SiteLogo .svg { max-height: 72px; } #Footer { text-align: center; } #Footer #FooterTop .title { margin-top: 35px; } #Footer #FooterTop .right { justify-content: center; } #Footer #FooterBottom .svg { max-width: 100%; } #Footer #FooterBottom .right { padding-top: 20px; } #GetInTouch .form input[type=text] { border-right: 1px solid #8d8ea0; margin-bottom: 15px; width: 100%; } #GetInTouch.split .form input[type=text] { width: 100%; } #ImNewsSection #ImFAQs { border-left: none; border-right: none; border-top: 2px solid #f7a933; border-bottom: 2px solid #f7a933; } #ImNewsSection #ImNewsTop .holder { height: auto; } #ImNewsSection #ImNewsBottom { border-bottom: 2px solid #aeaeae; } #ImNewsSection #ImNewsBottom .holder { height: auto; } #ImNewsSection .container { padding: 0; } #ImNewsSection h2 { padding: 0 15px; line-height: 1.5; margin: 40px 0 20px; } #ImNewsSection .text { margin-bottom: 20px; } #ImNewsSection .link { position: static; } #ImNewsSection .link a { position: relative; bottom: auto; left: auto; } #ImNewsSection #ImNewsImage img { max-width: 100%; } #MediaBottom .row { margin-left: -10px; margin-right: -10px; } #MediaBottom .holder { height: auto; } #MediaBottom .link a { position: relative; bottom: auto; left: auto; margin-top: 10px; } #MediaBottom #MediaTwitter .tweetHolder { height: auto; overflow-y: visible; } .imTopItem .image { top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); } .imTopItem .text { top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); } #ProductSliderHolder .productSliderPrev { padding: 40px 20px 30px; } .terms .termsText { text-align: center; width: 100%; } #GetInTouch.split .item.left { border-right: none; border-bottom: 1px solid #fff; } #GetInTouch.split .item { padding: 30px 15px; } #AboutBannerBlue .aboutValue { margin-bottom: 20px; } #AboutBannerBlue .aboutValue .image { } #AboutBannerBlue .aboutValue .image .svg { } #AboutBannerBlue .aboutValue .text { } #AboutBannerBlue .value { -ms-flex-preferred-size: calc(100%); flex-basis: calc(100%); } #AboutBoard .col-sm-5.pull-right { float: none !important; } #AboutBoard .boardSlider { margin-top: 20px; } #MobileMenus { width: 58.33333333%; } .slidePanel .content { padding: 40px 20px 40px; text-align: center; } .slidePanel .content .heading { display: none; } .slidePanel .content .headingBottom { text-align: left; } .slidePanel .content .text { text-align: left; } .slidePanel .image img { max-width: 250%; } #ProductSliderHolder { padding-top: 40px; } .newsHolder { text-align: center; } .newsHolder .item { text-align: left; } #ImNewsSection #ImGlossary .svg { float: none; } .terms { padding-top: 40px; } .terms .termsLogo { float: none; margin: 0; width: auto; margin-bottom: 20px; } #Breadcrumb { display: none; } #InnerBanner { padding: 20px 0 30px; } #InnerBanner .content h1 { font: 30px/34px Plantin; } #InnerBanner .content { padding-bottom: 0; } #InnerBanner .content .text { font: 16px/22px Plantin; } #InnerBanner .content .button { margin: 30px 0 0; } .pageBanner .breadcrumb { display: none; } .pageBanner .inner { top: auto; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; } .pageBanner .inner h1, .pageBanner .inner h2 { font: 30px/34px Plantin; } .pageBanner .inner .text { font: 16px/22px Plantin; } .pageBanner .inner .button { margin: 30px 0 0; } .pageBanner .pageBanner__image--desktop { display: none; } .pageBanner .pageBanner__image--mobile { display: block; } #SearchBranch .call .thin { display: block; margin: 15px 0 10px; } #ImSearchBranch .call .thin { display: block; margin: 15px 0 10px; } #SdSearchBranch .call .thin { display: block; margin: 15px 0 10px; } #AboutBoard { padding: 40px 0; } #AboutBoard h2 { text-align: center; } #AboutHistory { padding: 40px 0; } #AboutHistory #AboutHistoryLine { top: 85px; } #AboutHistorySlider .historyItem .inner { margin-top: 20px; padding: 0 10px; } #AboutHistorySliderNav .slick-prev { left: 10px; } #AboutHistorySliderNav .slick-next { right: 10px; } #AboutCharities { padding: 40px 0; } #AboutCharities h3 { text-align: center; } #AboutCharities .text { margin-bottom: 30px; } #AboutImages { display: none; } .newsCharity .content { padding-left: 15px; } #Testimonials { padding: 40px 0; } #Testimonials .text { padding: 0 40px; } #Testimonials .inner { padding: 0; } #Testimonials .slick-prev, #Testimonials .slick-next { display: none !important } #ClientInformation { padding: 40px 0; } #ClientInfoTabs ul li { width: 50%; } #ClientInfoTabs ul li a { min-height: 90px; } #AboutAwards { padding: 40px 0; } #IsaOptions .option { padding: 40px 0; } #IsaOptions .option.left { border-right: none; border-bottom: 1px solid #404b8b; } #IsaOptions .option .text { margin-bottom: 30px; } #IsaBannerBlue { padding-bottom: 15px; } #IsaBannerBlue .aboutValue { margin-bottom: 20px; } #IsaPayment .text { padding: 0 20px; } #Benefits { background: none; padding-bottom: 0; } #Benefits.alt { background: none; } #Benefits .col-sm-6 { background: #f9f9f9; padding: 30px 30px 10px; } #Benefits .col-sm-6.left { background: none; padding: 0 30px 10px; } #IsaCalculator { padding: 40px 0; } #IsaCalculator .svg { margin: 0; } #IsaCalculator .content { text-align: center; margin: 20px 0 10px; display: block; } #IsaCost { padding: 40px 0; } #IsaSplit .newsHolder { height: auto; padding: 35px 30px !important; } #IsaSplit .button, #IsaSplit .link a { position: relative; bottom: auto; left: auto; } #IsaJisa .content .link a { margin-top: 25px; } #IsaJisa img { left: -10px; } #SdSplit { background: none; padding-bottom: 0; } #SdSplit .col-sm-6.left { background: #f9f9f9; padding: 40px 20px; } #SdSplit .col-sm-6.right { background: none; padding: 40px 20px; } #SdSplit #SdGlossary .right { width: 15%; margin-left: 10%; } #SdBrochures { padding: 40px 0; } #SdBrochures #SdBrochuresInner { padding: 0 10px; } #SdBrochures h4 { text-align: center; } #SdMarketKnowledge .smallText { padding: 0 10px; } #SdMarkets { padding: 40px 0; } #SdMarkets .whiteSec.search { margin-top: 20px; } #SdMarkets .news { margin-top: 0; } #SdMarkets #NewsTabs ul li { width: 100%; } #SdMarkets #NewsTabs ul li a { width: 100%; } #MarketTabs .whiteSec.stock { margin-top: 20px; } #MarketTabs .whiteSec.price { margin-top: 20px; } #IpoNews { padding: 40px 0; } #IpoNews .newsLarge { margin-bottom: 10px; } .ipoSplit .row { margin: 0 -10px; } .ipoSplit .section { padding: 40px 30px; } #IpoSplitTop { background: none; } #IpoSplitTop .left { background: #fff; } #IpoSplitTop .right { background: #e5e5e5; } #IpoSplitBottom { background: none; } #IpoSplitBottom .left { background: #f7f7f7; } #News .newsLarge { margin-bottom: 10px; } #NewsMore { margin-top: 0; } #NewsInner { padding-top: 20px; } #NewsInner .col-sm-5 { margin-top: 20px; } #NewsletterSignup input[type=text] { display: block; width: 100%; } #NewsletterSignup input[type=submit] { margin-top: 10px; } .ipoSection .ipoPreview .name { width: 30%; } .ipoSection .ipoPreview .type { width: 30%; } .ipoSection .ipoPreview .pos { width: 40%; } .ipoSection .ipoPreview .clear { float: none; width: auto; } .ipoSection .ipoPreview .link { float: none; width: 100%; margin-top: 8px; text-align: center; } #MarketTabs #Financials .name { width: 30%; padding-right: 10px; } #MarketTabs #Financials .val { width: 35%; padding: 0 5px; } #MarketTabs #Financials .item { padding-left: 10px; padding-right: 10px; } #MarketTabs #Financials .whiteSec h2, #MarketTabs #Financials .whiteSec h3, #MarketTabs #Financials .whiteSec h4 { padding-left: 10px; padding-right: 10px; } #MarketTabs #Financials .whiteSec { margin-left: -10px; margin-right: -10px; } #MarketTabs.sectorInner .whiteSec.chart { margin-bottom: 20px; } #MarketTabs.sectorInner .comp .price { width: 16.6666%; } #MarketTabs #Financials .dividendHistory .name { width: 18%; } #MarketTabs #Financials .dividendHistory .val { width: 27%; } #SdMarketKnowledge .sdTeaser { border-bottom: 1px solid #e2e2e2; } #SdMarketKnowledge #MarketTeasers .row { border-bottom: none; } #BranchDetails { background: #fff; padding-bottom: 0; } #BranchDetails #Details { padding: 0 0 40px 0; } #BranchDetails .right { background: #f7f7f7; padding: 40px 20px; } #BranchEvents { margin: 0; } #ContactTop .left { padding: 0; } #ContactTop .left img { position: relative; max-width: 100%; } #ContactTop .right { padding: 40px 20px; } #ContactMiddle { padding: 40px 0 20px; } #ContactMiddle .sec { margin: 0 10px 20px; } #Careers select { width: 100%; } #Careers .job .left { width: 70%; padding: 2px 0 0 2px; } #Careers .job a { width: 27%; display: inline-block; } .threeWhiteBoxes .sec { margin: 0 0 20px; } #Brochures .cat .left { float: none; width: 100%; padding: 2px 0 0 2px; } #Brochures .cat a { float: none; width: auto; margin-top: 10px; } #MarketNews select { width: 100%; } #MarketNews .news .left { width: 72%; padding: 2px 0 0 2px; } #MarketNews .news a { width: 25%; display: inline-block; } #MarketNews #Bottom a { padding: 0; width: 100%; text-align: center; margin: 5px 0; } #MarketNews #Bottom .pull-right { float: none !important; } #JobInner .right { padding-left: 10px; margin-top: 20px; } #SdMarkets .item .index { width: 20%; } #SdMarkets .item .right { width: 20%; padding: 0 5px; } .EditingFormTable tr .FieldLabel { float: none; display: block; width: 100%; } .EditingFormTable tr .EditingFormValueCell { float: none; display: block; width: 100%; } .EditingFormTable tr .EditingFormButtonCell { display: block; } .EditingFormTable input[type=submit] { width: 100%; display: inline-block; background: #f7a933; color: #fff; letter-spacing: 2px; height: 50px; border: none; font-weight: normal; padding: 0 25px; font: 12px/50px JohnstonMdITCTT; text-transform: uppercase; } .form input[type=submit], .form .submit { width: 100%; } #BranchContact .hasImage img { float: none; width: auto; margin-bottom: 20px; } #BranchContact .hasImage .right { float: none; width: 100%; } #InnerBanner.media .content { padding-bottom: 0; } #MediaCentre #MediaTop { background: none; padding: 0; } #MediaCentre #MediaTop .left { padding: 40px; background: #1c1f55; } #MediaCentre #MediaTop .right { padding: 40px; } .sippProductTable, .sippProductTable thead, .sippProductTable tbody, .sippProductTable th, .sippProductTable td, .sippProductTable tr { display: block; } .sippProductTable thead tr { position: absolute; top: -9999px; left: -9999px; } .sippProductTable tr { border: 1px solid #ccc; } .sippProductTable td { border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 50%; width: 100% !important; } .sippProductTable td:before { content: attr(data-label); position: absolute; top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; font-family: Plantin; } #IpoInner .info .right { padding-left: 10px; padding-top: 20px; } #IpoInner .buttons input { margin: 0; } #IpoInner .buttons .grey { margin-top: 10px; } #IpoForm .info .right { padding-left: 10px; padding-top: 20px; } #IpoForm .waysToApply .right { margin-top: 10px; } #IpoForm .buttons input { margin: 0; } #IpoForm .buttons .grey { margin-top: 10px; } #IpoForm .total .left { width: 50%; } #IpoForm .total .right { width: 50%; } .twoCol .right { padding-left: 10px; padding-top: 20px; } #CookieBanner .container, #AnnouncementBanner .container { display: block } #CookieBanner .text, #AnnouncementBanner .text, #CookieBanner .button, #AnnouncementBanner .button { float: none; width: 100%; padding: 0 10px; } #CookieBanner .text, #AnnouncementBanner .text { margin-bottom: 10px; } .twoCol.bg .col-sm-6 { padding: 20px 10px; } .twoCol.bg { padding: 0; } .twoCol.bg.right { background: none; } .twoCol.bg.right .right { background: rgba(254,242,224,1); } .twoCol.bg.left { background: none; } .twoCol.bg.left .left { background: rgba(254,242,224,1); } .mpsForm .panels { margin: 0; } .mpsForm .graph50, .mpsForm .panel { -ms-flex-preferred-size: calc(100% - 10px); flex-basis: calc(100% - 10px); margin: 0 5px; } .mpsForm .panel.rightPanel, .mpsForm .panel.leftPanel { margin: 0 5px; } .mpsForm .graphBaseImg:before { width: 19%; } .mpsForm .countryNo > div { margin-bottom: 10px; } .newsEventsFifty .sides { margin: 0; } .newsEventsFifty .newsSide, .newsEventsFifty .eventsSide { width: 100%; margin-top: 20px; } .sd-portal { display: block; } .cta-btn { margin-bottom: 20px; } .form-steps { padding: 50px 20px; } .form-steps .form-steps__inner { padding: 0 20px 0; } .form-steps .form-steps__dots { display: none; } .form-steps .form-steps__step-row { flex-direction: column; padding: 28px 0 0; gap: 20px; } .form-steps .form-steps__step-row .form-steps__step-number { height: 50px; width: 50px; } .form-steps .form-steps__step-row .form-steps__step-content { flex-direction: column; gap: 20px; padding-bottom: 28px; } .form-steps .form-steps__step-row .form-steps__step-image { width: 100%; height: 210px; } .form-steps .form-steps__step-row .form-steps__forms { flex-direction: column; } .form-steps .form-steps__step-row .form-steps__form { width: 100%; height: 180px; } .video-banner .video-banner__container { flex-direction: column; gap: 50px; } .video-banner .video-banner__container .video-banner__text-content { font-size: 2.25rem; line-height: 2.5rem; padding-top: 110px; } } @media (max-width: 580px) { #IsaCalculatorPopup .title img { display: none; } #IsaCalculatorPopup .title .right { float: none; width: 100%; } #IsaCalculatorPopup .isaRow .left { float: none; width: 100%; padding-left: 8%; margin-bottom: 10px; } #IsaCalculatorPopup .isaRow .right { float: none; width: 100%; } #IsaCalculatorPopup .isaRow .right .values .left { float: left; width: 50%; } #IsaCalculatorPopup .isaRow .right .values .right { float: left; width: 50%; } #IsaCalculatorPopup .results .col { float: none; width: 100%; margin-bottom: 4px; } #IsaCalculatorPopup .results .col .title { height: auto; } #DisclaimerBar { font-size: 12px; line-height: 15px; padding: 3px 0; } #Careers .job .left { width: 100%; } #Careers .job a { width: 100%; margin-top: 10px; } } @media (max-width: 440px) { #BranchFinderPopup #Search input[type=text] { width: 60%; } #BranchFinderPopup #Search .button { width: 40%; } #BranchFinderPopup .branch .left { width: 100%; float: none; margin-bottom: 10px; } #BranchFinderPopup .branch .button { width: 48%; margin: 0 1%; } #BranchFinderPopup .bottom .left { float: none; width: 100%; margin-bottom: 10px; } #BranchFinderPopup .bottom .button { float: none; width: 100%; } }