/* User defined general CSS */ body { font-size: 14px; line-height: 1.7; font-family: 'Encode Sans', sans-serif; font-weight: normal; color: #6d6b6f; background: @whiteColor; position: relative; right: 0; -webkit-transition: 0.5s right ease; transition: 0.5s right ease; } a { text-decoration: none; color: #6d6b6f; -webkit-transition: 0.3s all ease; transition: 0.3s all ease; } a:visited { opacity: 0.8; } a:hover, a:focus { text-decoration: none; color: @blackColor; outline: none; } img { width: 100%; } /* Overrides */ .no-pad { padding: 0; } .btn { display: inline-block; border-radius: 5px; border: 1px solid @whiteColor; background: transparent; font-size: 14px; line-height: normal; color: @whiteColor; padding: 8px 11px 9px 11px; } .btn when (@brandCode = PantheraFX) { color: @blackColor; } .btn when (@brandCode = Greengage) { color: #A3FF92; } .btn:hover, .btn:focus { border-color: @whiteColor; background: @whiteColor; color: @blackColor; } .clearfix::after, .clearfix::before { display: table; content: ""; } .clearfix::after { clear: both; } .i-block { display: inline-block; vertical-align: middle; } .pos-static { position: static; } .sec-title { text-align: center; } .sec-title h2 { margin-bottom: 10px; } .sec-title p { font-size: 16px; line-height: 24px; font-weight: 400; } .nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover { background: none; } .clear { clear: both; } /****** Custome selectbox JS ******/ .sbHolder { width: auto; margin: 0 15px; position: relative; width: 40px !important; padding-right: 10px; outline: none; } .sbOptions { position: absolute; padding: 0; left: 0; } .sbSelector { border: 0; color: #6d6b6f; text-align: center; cursor: pointer; outline: none; } .sbSelector img { display: inline-block; vertical-align: middle; width: 27px; margin-right: 10px; } .sbSelector { color: @blackColor; } .sbSelector a { display: inline-block; vertical-align: middle; color: @blackColor; } .sbOptions { width: 140% !important; z-index: 99; top: 140% !important; background: #6d6b6f; list-style: none; padding: 4px 0; -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2); box-shadow: 0 2px 4px rgba(0,0,0,0.2); text-align: left; margin: 0; border-radius: 3px; } .sbOptions::before { position: absolute; content: ""; bottom: 100%; left: 10px; width: 0; height: 0; border-style: solid; border-width: 0 5px 3px 5px; border-color: transparent transparent #6d6b6f transparent; } .sbOptions li { padding: 0; cursor: pointer; } .sbOptions li:hover a { background: @whiteColor; color: #6d6b6f; } .sbOptions li img { width: 27px; display: inline-block; vertical-align: middle; margin-right: 10px; } .sbOptions li a { display: inline-block; vertical-align: middle; color: @whiteColor; display: block; padding: 4px 10px; } /* DDSlick overrides */ .dd-container { max-width: 170px; width: 100% !important; height: 40px; display: inline-block; position: relative; } .dd-container label { cursor: pointer; color: @blackColor; font-size: 16px; line-height: normal; } .dd-select { width: 100% !important; height: 40px; border-radius: 5px; position: relative; cursor: pointer; background: #f4f4f4 !important; } a.dd-selected { display: block; text-align: left; padding: 7px 15px; position: relative; } a.dd-selected .dd-selected-image { max-width: 23px; margin-right: 11px; display: inline-block; vertical-align: middle; } a.dd-selected .dd-selected-text { margin: 0; line-height: normal !important; display: inline-block; vertical-align: middle; } .dd-select .dd-pointer.dd-pointer-down { padding: 0; width: 9px; height: 9px; background: url(../../images/arrow-down.png); background-position: center center; background-repeat: no-repeat; background-size: auto; border: 0; right: 9px; position: absolute; top: 50%; -webkit-transform: translateY(-50%) rotate(0); transform: translateY(-50%) rotate(0); margin: 0; } .dd-select .dd-pointer.dd-pointer-down.dd-pointer-up { -webkit-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg); } .dd-options { width: 100% !important; position: absolute; padding: 0; top: 100%; z-index: 99; text-align: left; background: #f4f4f4; padding: 5px 0; display: none; margin-top: -4px; list-style: none; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } .dd-options > li { margin: 0; } .dd-options > li > .dd-option { display: block; padding: 5px 15px; cursor: pointer; } .dd-options > li > .dd-option:hover, .dd-options > li > .dd-option.dd-option-selected { background: #e1e1e1; } .dd-option > .dd-option-image { max-width: 23px; margin-right: 11px; display: inline-block; vertical-align: middle; } .dd-option > .dd-option-text { margin: 0; line-height: normal !important; display: inline-block; vertical-align: middle; } /* Dropkick select overrides */ .dk-select { width: 100%; } .dk-select.dk-select-open-up .dk-select-options { border-radius: 6px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-bottom: 0; border-top: 1px solid @blackColor; } .dk-select .dk-selected { width: 100%; height: 50px; padding: 13px 15px; color: #9f9f9f; border-color: #d8d8d8; } .dk-selected img { width: 27px; margin-right: 10px; } .dk-selected:before { content: ""; width: 9px; height: 9px; background: url(../../images/arrow-down.png); background-position: center center; background-repeat: no-repeat; background-size: auto; border: 0; right: 9px; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin: 0; } .dk-selected:after { display: none; } .dk-select .dk-select-options { border-color: @blackColor; padding: 0; right: 0; width: 100%; left: auto; border-radius: 6px; border-top-left-radius: 0; border-top-right-radius: 0; border-top: 0; max-height: 180px; } .dk-select .dk-select-options .dk-option { padding: 10px 15px; } .dk-select-options .dk-option-highlight, .dk-select-options .dk-option-selected { background: #d8d8d8; color: @whiteColor; } .dk-selected:hover { border-color: #d8d8d8; } .dk-selected:focus { border-color: @blackColor; } /* Custom scroll js CSS overrides */ .mCSB_horizontal.mCSB_inside > .mCSB_container { margin-bottom: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal { height: 14px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { opacity: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { background: #dedede; } header .dk-select { height: auto; } header .dk-select .dk-selected { border: 0; height: auto; padding: 0 21px 0 7px; } header .dk-select .dk-select-options { width: 100%; left: 0; right: 0; top: 100%; text-align: left; border: 1px solid @brandColor; border-radius: 0; } header .dk-select .dk-select-options .dk-option { padding: 5px 6px; } header .dk-selected:before { width: 5px; height: 5px; } header .dk-select-options .dk-option-highlight, header .dk-select-options .dk-option-selected { background: @brandColor; color: @whiteColor; } /* Typography */ h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; margin-bottom: 15px; } h1 { font-family: 'Roboto Slab', serif; font-size: 48px; line-height: 1.12; font-weight: 400; } h2 { font-family: 'Roboto Slab', serif; font-size: 36px; color: @brandColor; text-transform: uppercase; line-height: normal; font-weight: 400 } h3 { font-family: 'Roboto Slab', serif; font-size: 30px; color: @blackColor; text-transform: uppercase; line-height: normal; font-weight: 400; } h4 { font-family: 'Roboto Slab', serif; font-size: 24px; color: @blackColor; text-transform: uppercase; line-height: normal; font-weight: 400; } h5 { font-family: 'Roboto Slab', serif; font-size: 20px; line-height: normal; font-weight: 400; text-transform: uppercase; } h6 { font-family: 'Encode Sans', sans-serif; font-size: 16px; line-height: 1.2; font-weight: 700; } /* Form elements */ input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], select, textarea { border: 1px solid #d8d8d8; font-size: 14px; padding: 0 13px; width: 100%; border-radius: 4px; background: rgba(0,0,0,0); margin-bottom: 20px; -webkit-box-shadow: none; box-shadow: none; color: #9f9f9f; } input[type="submit"], button { color: @whiteColor; font-size: 20px; -webkit-transition: 0.3s all ease; transition: 0.3s all ease; -webkit-box-shadow: none; box-shadow: none; } input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="number"]:focus, select:focus, textarea:focus { outline: none; -webkit-box-shadow: none; box-shadow: none; border-color: @blackColor; } input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"] { height: 50px; } select { height: 50px; max-width: 275px; } textarea { padding: 10px 20px; resize: none; } input[type="submit"]:focus, button:focus, input[type="submit"]:hover, button:hover { background: transparent; color: #000000; outline: none; -webkit-box-shadow: none; box-shadow: none; border-color: inherit; } input[type="submit"], button { height: 48px; } .form-group { margin-bottom: 0; } /* Custom checkbox */ [type="checkbox"] { position: absolute; z-index: -99999; left: -99999; -webkit-appearance: none; } [type="checkbox"]:not(:checked) + label, [type="checkbox"]:checked + label { cursor: pointer; position: relative; padding-left: 30px; } [type="checkbox"] + label::after { content: ""; position: absolute; left: calc(100% + 10px); left: -webkit-calc(100% + 10px); top: -4px; width: 25px; height: 25px; border-radius: 50%; background: url(../../images/check.svg); background-position: center center; background-size: contain; background-repeat: no-repeat; -webkit-transition: 0.25s transform ease; -webkit-transition: 0.25s -webkit-transform ease; transition: 0.25s -webkit-transform ease; transition: 0.25s transform ease; transition: 0.25s transform ease, 0.25s -webkit-transform ease; -webkit-transform: scale(0); transform: scale(0); } [type="checkbox"] + label:hover::after { /*transform: scale(1);*/ } [type="checkbox"]:checked + label::after { -webkit-transform: scale(1); transform: scale(1); } [type="radio"] { position: absolute; z-index: -99999; left: -99999; -webkit-appearance: none; } [type="radio"]:not(:checked) + label, [type="radio"]:checked + label { cursor: pointer; position: relative; padding-left: 30px; } [type="radio"] + label::after { content: ""; position: absolute; left: calc(100% + 10px); left: -webkit-calc(100% + 10px); top: -4px; width: 25px; height: 25px; border-radius: 50%; background: url(../../images/check.svg); background-position: center center; background-size: contain; background-repeat: no-repeat; -webkit-transition: 0.25s transform ease; -webkit-transition: 0.25s -webkit-transform ease; transition: 0.25s -webkit-transform ease; transition: 0.25s transform ease; transition: 0.25s transform ease, 0.25s -webkit-transform ease; -webkit-transform: scale(0); transform: scale(0); } [type="radio"] + label:hover::after { /*transform: scale(1);*/ } [type="radio"]:checked + label::after { -webkit-transform: scale(1); transform: scale(1); } [hidden] { display: none; } [href^="tel"], [href^="callto"], [href^="mailto"] { color: inherit; text-decoration: none; } /* Keyframes animations */ @keyframes slide-header { 0% { top: -100%; } 100% { top: 0; } } @-webkit-keyframes slide-header { 0% { top: -100%; } 100% { top: 0; } } /* Header */ header { padding: @mainHeaderPadding; background: @headerColor; position: absolute; z-index: 99; width: 100%; right: 0; top: 0; -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2); box-shadow: 0 0 5px rgba(0,0,0,0.2); -webkit-transition: 0.5s right ease; transition: 0.5s right ease; } header.affix { -webkit-animation: slide-header 0.5s ease forwards; animation: slide-header 0.5s ease forwards; } header .site-logo { /*max-width: 177px;*/ width: 100%; margin: 0 26px 0 0; } header .site-logo when (@brandCode= BondfordMarkets) { margin: 18px 26px 0 0; } header .site-logo when (@brandCode= Nexdi), (@brandCode = CapitexFX), (@brandCode = Greengage), (@brandCode = AquaProperties), (@brandCode = ClearerFX), (@brandCode = MonroeGlobal) { margin: 8px 26px 8px 0; } header .site-logo a { display: block; } .separator { background: #e3e0e3; width: 1px; height: 40px; } header .site-logo a img { width: @logoWidth } header .user-name when (@brandCode = FairFX) { color: @whiteColor !important } header .manage-account li a when (@brandCode = FairFX) { color: @whiteColor !important } header .manage-account li a.btn-primary:hover when (@brandCode = FairFX) { background: @buttonColor !important } header .manage-account li a.btn-primary:focus::after when (@brandCode = FairFX) { background: @buttonColor !important } header .manage-account { padding: 0; margin: 0 5px 0 0; list-style: none; } header .manage-account li { display: inline-block; vertical-align: middle; margin-left: 20px; } header .manage-account li a:hover { opacity: 0.5; } header .manage-account li a.btn-primary { padding: 0 11px 0 11px; border-color: @buttonColor; background: @buttonColor; background-repeat: no-repeat; background-size: 13px; background-position: 91% center; position: relative; } header .manage-account li a.btn-primary:hover, header .manage-account li a.btn-primary:focus { border-color: @buttonColor; background: @whiteColor; background-repeat: no-repeat; background-size: 13px; background-position: 91% center; opacity: 1; color: @buttonColor; } .openAccountArrow { transition: 0.2s all ease; -webkit-transition: 0.2s all ease; fill: @whiteColor; } .openAccountArrow when (@brandCode = PantheraFX) { fill: @blackColor; } .openAccountArrow when (@brandCode = Greengage) { fill: #A3FF92; } header .manage-account li a.btn-primary:hover .openAccountArrow, header .manage-account li a.btn-primary:focus .openAccountArrow { transition: 0.2s all ease; -webkit-transition: 0.2s all ease; fill: @buttonColor; } header .header-left when (@brandCode = LansmithGlobalPartners) { margin-top: 2px; } header .header-left when (@brandCode= NewAgeCapital), (@brandCode= Capsa), (@brandCode= PayFX), (@brandCode= LemontMoney), (@brandCode= GlobalConnectFX), (@brandCode = JacksonSwiss) { margin-top: 3px; } header .header-left when (@brandCode= TheDaviesExchange), (@brandCode = SierraFX), (@brandCode = CountingKing), (@brandCode = CambridgeGlobalPartners), (@brandCode = Sterlex) { margin-top: 4px; } header .header-left when (@brandCode= Blockzo), (@brandCode = VelaFX), (@brandCode = PayiO), (@brandCode = MondoGlobalPayments), (@brandCode = StellarCapital), (@brandCode = CambridgeCurrencies), (@brandCode = ClaremontCS) { margin-top: 5px; } header .header-left when (@brandCode = EqualsPay), (@brandCode = AlbaFX), (@brandCode= CurrencyFarm), (@brandCode= SwiftFX), (@brandCode= CenturaFX), (@brandCode= CashForInvoices), (@brandCode= Axius), (@brandCode= GypsyMoth), (@brandCode = RegencyFX), (@brandCode= PathfinderFX), (@brandCode= GoodFX), (@brandCode= SapphireFX), (@brandCode = GolfFX), (@brandCode = RossAndCoPrivate) { margin-top: 6px; } header .header-left when (@brandCode= SpartanFX), (@brandCode = SpartanFXPrivate), (@brandCode = CaptivaCM), (@brandCode= Neoflow), (@brandCode= PlanetFX) { margin-top: 9px; } header .header-left when (@brandCode = AbacusFX), (@brandCode = TransferConnex), (@brandCode= KeyFX), (@brandCode = IntegritasWealthPartners), (@brandCode = PantherPay), (@brandCode= Monivise) { margin-top: 11.5px; } header .header-left when (@brandCode = QuantumFX), (@brandCode= CurrencyOnlineGroup), (@brandCode= VGroupFX) { margin-top: 7.5px; } header .header-left when (@brandCode= Excel121), (@brandCode= BREADx), (@brandCode = ForeignMoney), (@brandCode = SpectrumFX) { margin-top: 8px; } header .header-left when (@brandCode = MontraPartners), (@brandCode = OctopiFinancial), (@brandCode = ProntoSwap), (@brandCode= Paysbridge), (@brandCode= SFCPayments), (@brandCode= VerticalFX), (@brandCode= Karmenta), (@brandCode = Abire), (@brandCode = MayfairFX), (@brandCode = BPAYD), (@brandCode= SynergyExchange) { margin-top: 10px; } header .header-left when (@brandCode = MotoMoney), (@brandCode = NoxtiMoney), (@brandCode = GainFX) { margin-top: 17px; } header .header-left when (@brandCode= ArcanumFX), (@brandCode= LucidFinancialMarkets), (@brandCode= TotalCurrencyExchange), (@brandCode= ClearviewFX), (@brandCode= GentiumFX), (@brandCode= Transmony) { margin-top: 15px; } header .header-left when (@brandCode= FXBoutique), (@brandCode= WorldwideRemit), (@brandCode = ClaricoPay), (@brandCode = BriskPay) { margin-top: 13px; } header .header-left when (@brandCode = SNBPartners), (@brandCode = Finsense), (@brandCode = HalcyonMarkets), (@brandCode= YourwayFX) { margin-top: 7px; } header .header-right { text-align: right; padding: 5px 0px; } header .header-right when not (@brandCode = Equals) { padding: 11px 0px; } header .header-right when (@brandCode = SNBPartners), (@brandCode = Finsense), (@brandCode = HalcyonMarkets) { padding: 5px 0px; } header .header-right when (@brandCode = NumexFX), (@brandCode =SolisFX), (@brandCode =SterlingWellCapital), (@brandCode= EviqeEstates), (@brandCode= UFSConsulting), (@brandCode= OccamPartners), (@brandCode = SierraFX), (@brandCode = TuchDigital), (@brandCode = OvalPeakPartners) { padding: 21px 0px; } header .header-right when (@brandCode = NumexFX), (@brandCode = AlexFin), (@brandCode = AgileFX), (@brandCode = EscapeCurrencies), (@brandCode = OrbisExchangeUAE), (@brandCode = CurrencyWave), (@brandCode = RIFFX), (@brandCode = MoneyMatters), (@brandCode = ApexCurrency), (@brandCode = JacksonSwiss), (@brandCode = Elev8Exchange), (@brandCode = EdgeMoney) { padding: 19px 0px; } header .header-right when (@brandCode = OceanCapital), (@brandCode = OpalFX), (@brandCode= WillUFX), (@brandCode = ExchangeGlobal), (@brandCode= PremierForex), (@brandCode= SouthWestForeignExchange), (@brandCode= CashForInvoices), (@brandCode= HenleyOaks), (@brandCode= OACapital), (@brandCode= DCEBrokers), (@brandCode= TheMintedApp), (@brandCode= PHGlobalPay), (@brandCode= GoldhurstPartners), (@brandCode= ChartwellInternational), (@brandCode = SovereignInternational), (@brandCode= IFAMarkets) { padding: 16px 0px; } header .header-right when (@brandCode = CapitexFX), (@brandCode =MagnaFinancial), (@brandCode = FGCMoney){ padding: 12px 0px; } header .header-right when (@brandCode= CompetitiveMortgagesFS), (@brandCode= WorldCurrency), (@brandCode = FCGlobalPayments) { padding: 23px 0px; } header .header-right when (@brandCode = CanterburyPartners), (@brandCode = GrantaPayments), (@brandCode = SolCapitalMarkets) { padding: 24px 0px; } header .header-right when (@brandCode = NewBridgeFX) { padding: 3px 0px; } header .header-right when (@brandCode = MerchantPartnersGroup), (@brandCode = Reb8), (@brandCode = SwiftFX), (@brandCode = FGMedien), (@brandCode= BrightSparkEnterprises), (@brandCode= Harlowesphere), (@brandCode = ADCapitalMarkets) { padding: 25px 0px; } header .header-right when (@brandCode = OneFX), (@brandCode = ForeignCurrencyPartners) { padding: 33px 0px; } header .header-right when (@brandCode = PangeaFX) { padding: 10px 0px; } header .header-right when (@brandCode = EqualsPay) { padding: 0px 0px; } header .header-right when (@brandCode = Kratos) { padding: 8px 0px; } header .header-right when (@brandCode = ClaydonPartners), (@brandCode = ManagedMarkets), (@brandCode = MonroeGlobal) { padding: 7px 0px; } header .header-right when (@brandCode = DKKPartners), (@brandCode = FhundIT), (@brandCode = LavaERemit ), (@brandCode = Nexdi ), (@brandCode= Ibanista) { padding: 27px 0px; } header .header-right when (@brandCode = FreedomForex), (@brandCode = EakoCapital), (@brandCode = ForeignExchangeBroker), (@brandCode = IQFX), (@brandCode = PaymentsInternational) { padding: 18px 0px; } header .header-right when (@brandCode = BlissPartners), (@brandCode= PropertyFXPartners) { padding: 19px 0px; } header .header-right when (@brandCode = GlobalCurrencies) { padding: 38px 0px; } header .header-right when (@brandCode = KnightsbridgePlace), (@brandCode = FortunaFX) { padding: 36px 0px; } header .header-right when (@brandCode = FairwayCurrencies){ padding: 28px 0px; } header .header-right when (@brandCode = OptimalCurrency) { padding: 48px 0px; } header .header-right when (@brandCode= PantheraGlobalPayments){ padding: 30px 0px; } header .header-right when (@brandCode= LucidFinancialMarkets), (@brandCode= ProntoPay), (@brandCode= ReciprocalPayments), (@brandCode= SapphireFX), (@brandCode= MMCExpress), (@brandCode = Currencies4You) { padding: 14px 0px; } header .header-right when (@brandCode = NumusCapital), (@brandCode = MisanoPayments) { padding: 25px 0px; } header .header-right when (@brandCode = SamieCapital), (@brandCode = MabuhayInternational), (@brandCode= UnityFX), (@brandCode = VasudaInternational), (@brandCode = CoverPoint), (@brandCode = OakleighExchange) { padding: 20px 0px; } header .manage-account a when (@brandCode = FGCMoney), (@brandCode = MonetaeFX) { color: @whiteColor } .header .user-name when (@brandCode = FGCMoney), (@brandCode = MonetaeFX) { color: @whiteColor } header .primary-menu { margin-left: 10px; } header .primary-menu .menu-icon { width: 24px; height: 24px; display: block; } header .primary-menu .menu { list-style: none; display: block; position: fixed; background: @whiteColor; top: 0; right: 0; right: -250px; height: 100vh; height: 100%; width: 250px; text-align: left; -webkit-box-shadow: -3px 0 10px rgba(0,0,0,0.1); box-shadow: -3px 0 10px rgba(0,0,0,0.1); padding: 0; transition: 0.5s right ease; -webkit-transition: 0.5s right ease; -moz-transition: 0.5s right ease; -ms-transition: 0.5s right ease; padding: 15px 20px; overflow: auto; top: 80px; } header .primary-menu .menu li { display: block; border-bottom: 1px solid rgba(33,32,33,0.1); } header .primary-menu .menu li a { display: block; padding: 5px 10px; font-size: 18px; text-transform: uppercase; } header .primary-menu .menu li a:hover { color: @brandColor; } header .primary-menu .menu li.active a { color: @brandColor; } /* Menu */ .menu-icon { position: relative; cursor: pointer; margin-top: 5px; } .menu-icon span { width: 24px; height: 3px; border-radius: 1px; background: #6d6b6f; display: block; position: absolute; top: 0; left: 0; -webkit-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform-origin: center center; transform-origin: center center; -webkit-transition: 0.2s all ease; transition: 0.2s all ease; } .menu-icon span:nth-of-type(1) { top: 0px; } .menu-icon span:nth-of-type(2) { top: 8px; } .menu-icon span:nth-of-type(3) { top: 16px; } .menu-icon.active span:nth-of-type(1) { -webkit-transform: translate(0, 8px) rotate(135deg); transform: translate(0, 8px) rotate(135deg); } .menu-icon.active span:nth-of-type(2) { -webkit-transform: translate(0, 0px); transform: translate(0, 0px); opacity: 0; } .menu-icon.active span:nth-of-type(3) { -webkit-transform: translate(0, -8px) rotate(-135deg); transform: translate(0, -8px) rotate(-135deg); } /* Menu open */ html.menu-open { overflow-y: hidden; } /*body.menu-open{ right: 300px; }*/ body.menu-open .menu { right: 0; } /*body.menu-open header.affix{ right: 300px; }*/ /* Page */ .main-content { overflow: hidden; } .banner.fix-banner { height: 470px; background-position: center center; background-repeat: no-repeat; background-size: cover; } .banner .banner-content { text-align: center; color: @whiteColor; padding-top: 147px; } .banner .banner-content .bt-group { padding-top: 7px; } .banner .banner-content .bt-group .btn { font-size: 18px; padding: 7px 20px 8px 18px; margin: 0 17px 15px 0; line-height: normal; } .banner .banner-content .bt-group .btn:last-child { margin-right: 0; background: @whiteColor; color: @blackColor; } .banner .banner-content .bt-group .btn:last-child:hover { margin-right: 0; background: transparent; color: @whiteColor; } .who-we-are-section { padding: 68px 0 42px; } .services-block { padding-top: 25px; } .services-block .block { text-align: center; margin-bottom: 30px; } .services-block .thumb { max-width: 167px; margin: 0 auto 9px; } .services-block figcaption h4 { text-transform: uppercase; } .financial-services { padding: 71px 0 72px; background-position: center center; background-repeat: no-repeat; background-size: cover; height: 530px; } .financial-services .sec-title p { color: rgba(255,255,255,0.5) } .financial-services .sec-title .bt-group { font-size: 24px; line-height: normal; color: @whiteColor; margin-top: -6px; font-weight: 500; } .financial-services .sec-title .bt-group a:hover { color: @brandColor; } .financial-services .fin-services { color: @whiteColor; padding-top: 36px; } .financial-services .fin-services .thumb .hover { display: none; } .financial-services .fin-services .block { padding-top: 30px; padding-bottom: 30px; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; cursor: pointer; } /*.financial-services .fin-services .block:first-child{ padding-left: 0; } .financial-services .fin-services .block:last-child{ padding-right: 0; }*/ .financial-services .fin-services { margin: 0 -33px; } .financial-services .fin-services .block { padding: 30px 33px; } .financial-services .fin-services .inner-content { padding-bottom: 20px; } .financial-services .fin-services .inner-content h4 { text-transform: uppercase; margin-bottom: 12px; color: @whiteColor; } .financial-services .fin-services .inner-content p { line-height: 24px; opacity: 0.5; } .financial-services .fin-services .block:hover p { opacity: 1; } .financial-services .fin-services .thumb { max-width: 38px; width: 100%; margin-bottom: 8px; height: 38px; } .financial-services .fin-services .read-more { color: @brandColor; opacity: 0; font-family: 'Muli', sans-serif; position: relative; } .financial-services .fin-services .read-more::after { content: ""; position: absolute; bottom: -3px; left: 0; background: @brandColor; display: block; height: 1px; width: 100%; -webkit-transition: 0.25s all ease; transition: 0.25s all ease; } .financial-services .fin-services .read-more:hover::after { width: 0; } .financial-services .fin-services .read-more span { display: inline-block; vertical-align: middle; font-weight: 500; } .financial-services .fin-services .read-more i { width: 13px; height: 13px; background: url(../../images/arrow-orange.svg); background-position: center center; background-repeat: no-repeat; background-size: auto; display: inline-block; vertical-align: middle; } .financial-services .fin-services .block:hover .inner-content h4 { color: @blackColor; } .financial-services .fin-services .block:hover .thumb img { display: none; } .financial-services .fin-services .block:hover .thumb .hover { display: block; } .financial-services .fin-services .block:hover .read-more { opacity: 1; } .financial-services .fin-services .block:hover .more-text { display: inline; } .financial-services .fin-services .block:hover { padding: 30px 33px; background: @whiteColor; color: #6d6b6f; border-radius: 4px; -webkit-box-shadow: 0 5px 40px 5px rgba(0,0,0,0.20); box-shadow: 0 5px 40px 5px rgba(0,0,0,0.20); } .tab-inner .img-sec { padding-left: 96px; } .how-it-works { padding: 38px 0 61px; position: relative; } .step-progress-bar { position: absolute; width: 100%; height: 1px; left: 0; top: 54px; background: #c3c1c6; } .step-progress-bar .progress-line { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: @brandColor; width: 500px; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; } #how-it-works-tab { margin-top: 25px; border: 0; } #how-it-works-tab li { width: 25%; margin: 0; text-align: center; position: relative; z-index: 9; } #how-it-works-tab li a { font-family: 'Roboto Slab', serif; text-transform: uppercase; color: #c3c1c6; font-size: 18px; line-height: normal; padding: 0; position: static; background: none; border: 0; margin: 0; } #how-it-works-tab li a:hover, #how-it-works-tab li a:focus { background: transparent; outline: none; } #how-it-works-tab li a > .count { width: 60px; height: 60px; background: transparent; display: block; margin: 0 auto 7px; font-size: 24px; line-height: 38px; text-align: center; color: #c3c1c6; font-weight: 300; font-family: 'Encode Sans', sans-serif; } #how-it-works-tab li a > .count i { width: 42px; height: 42px; position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-style: normal; display: block; border: 1px solid #c3c1c6; background: @whiteColor; border-radius: 50%; margin: 0 auto; -webkit-transition: 0.2s all ease; transition: 0.2s all ease; } #how-it-works-tab li a > .step-name { width: 100%; height: 35px; display: table; text-align: center; } #how-it-works-tab li a > .step-name i { display: table-cell; font-style: normal; vertical-align: middle; font-weight: 300; } #how-it-works-tab li.active a > .count { font-size: 36px; color: @whiteColor; } #how-it-works-tab li.active a > .count i { border-color: @brandColor; background: @brandColor; height: 60px; width: 60px; line-height: 56px; -webkit-box-shadow: 0 10px 30px rgba(244, 153, 25, 0.3); box-shadow: 0 10px 30px rgba(244, 153, 25, 0.3); } #how-it-works-tab li.active a > .step-name i { font-weight: 500; } #how-it-works-tab li.active a { background: none; color: #000000; font-size: 18px; color: @brandColor; } .tab-inner { padding-top: 39px; } .tab-inner .thumb { width: 80px; height: 80px; padding: 13px; background: @whiteColor; margin-bottom: 42px; -webkit-box-shadow: 0 5px 40px 5px rgba(33,32,33,0.10); box-shadow: 0 5px 40px 5px rgba(33,32,33,0.10); position: relative; } .tab-inner .thumb::after { position: absolute; ; content: ""; width: 100%; height: 2px; background: @brandColor; left: 0; top: 125%; display: block; } .tab-inner .inner-content { max-width: 280px; width: 100%; padding-top: 67px; margin-left: 84px; } .tab-inner .inner-content h3 { text-transform: uppercase; margin-bottom: 4px; } .tab-inner .inner-content p { font-size: 18px; line-height: 30px; } .testmonials { background: #fffaf3; padding: 75px 0 40px; } #testimonial-slider { margin-top: 20px; } #testimonial-slider .testimonial-title { font-size: 24px; font-family: 'Muli', sans-serif; display: block; text-align: center; font-weight: 500; color: @blackColor; margin-bottom: 16px; } #testimonial-slider blockquote { max-width: 695px; margin: 0 auto; text-align: center; border: 0; padding: 0 30px; position: relative; } #testimonial-slider blockquote::before { content: ""; position: absolute; left: -5px; top: -7px; width: 26px; height: 26px; display: block; background: url(../../images/quote-open.png); background-position: center center; background-size: contain; background-repeat: no-repeat; } #testimonial-slider blockquote::after { content: ""; position: absolute; right: 110px; bottom: -7px; width: 26px; height: 26px; display: block; background: url(../../images/quote-close.png); background-position: center center; background-size: contain; background-repeat: no-repeat; } #testimonial-slider blockquote p { font-size: 14px; line-height: 24px; letter-spacing: -0.2px; } #testimonial-slider .author { text-align: center; margin-top: 23px; } #testimonial-slider .author .ratings { max-width: 86px; margin: 0 auto; display: block; } #testimonial-slider .author .author-name { font-size: 20px; text-transform: uppercase; color: @blackColor; } #testimonial-slider .owl-nav { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; } #testimonial-slider .owl-nav .owl-prev, #testimonial-slider .owl-nav .owl-next { position: absolute; width: 30px; height: 30px; font-size: 0; } #testimonial-slider .owl-nav .owl-prev:hover, #testimonial-slider .owl-nav .owl-next:hover { opacity: 0.7; } #testimonial-slider .owl-nav .owl-prev { left: 0; background: url(../../images/carousel-arr-left.png); background-position: center center; background-repeat: no-repeat; background-size: contain; } #testimonial-slider .owl-nav .owl-next { right: 0; background: url(../../images/carousel-arr-right.png); background-position: center center; background-repeat: no-repeat; background-size: contain; } .rating-score-sec { max-width: 322px; margin: 0 auto; border: 1px solid #e5daca; border-radius: 3px; padding: 13px 7px 17px 21px; margin-top: 45px; } .rating-score-sec img { width: 51%; display: inline-block; vertical-align: middle; } .rating-score-sec .score-details { width: 44%; display: inline-block; vertical-align: middle; padding-left: 13px; font-size: 18px; color: #6d6b6f; } .rating-score-sec .score-details strong { color: @blackColor; font-weight: 500; } .blog-faq-sec .inner-content { max-width: 430px; margin: 0 auto; text-align: center; color: @whiteColor; padding: 52px 0 58px; position: relative; z-index: 5; } .blog-faq-sec .inner-content h2 { margin-bottom: 10px; } .blog-faq-sec .inner-content p { line-height: 24px; font-size: 16px; } .faq-sec .inner-content p { height: 48px !important; } .blog-faq-sec .inner-content .bt-group { padding-top: 24px; } .blog-faq-sec .inner-content .btn { border-color: @brandColor; color: @brandColor; font-size: 18px; line-height: normal; padding: 10px 37px 11px; } .blog-faq-sec .inner-content .btn:hover, .blog-faq-sec .inner-content .btn:focus { background: @brandColor; color: @whiteColor; } .blog-faq-sec .blog-sec, .blog-faq-sec .faq-sec { cursor: pointer; position: relative; overflow: hidden; } .blog-faq-sec .background-img { position: absolute; left: 0; top: 0; right: 0; bottom: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: 0.3s all ease; transition: 0.3s all ease; } .blog-faq-sec .blog-sec:hover .background-img, .blog-faq-sec .faq-sec:hover .background-img { -webkit-transform: scale(1.2); transform: scale(1.2); } /* Footer */ footer { padding: 32px 0 0; } footer h5 { color: @blackColor; margin-bottom: 9px; } footer .footer-main { padding-bottom: 6px; } footer .footer-main a:hover { color: @brandColor; } footer .menu-sec ul { list-style: none; padding: 0; display: inline-block; width: 25%; } footer .quicks { padding-left: 93px; padding-top: 12px; } footer .quicks ul { list-style: none; padding: 0; } footer .quicks ul li { margin-bottom: 1px; } footer .footer-social { padding: 0; list-style: none; padding-top: 1px; margin-left: -5px; } footer .footer-social li { display: inline-block; } footer .footer-social i { height: 15px; width: 21px; display: inline-block; vertical-align: middle; margin-right: 10px; } footer .footer-social i img { height: 100%; text-align: center; vertical-align: top; } footer .footer-social a:hover { opacity: 0.5; } footer .address-sec { padding-top: 12px; padding-left: 65px; } footer .address-sec span { display: block; } footer .address-sec address { line-height: 24px; margin-bottom: 32px; } footer .licenses { margin-top: 12px; } footer .licenses h5 { margin-bottom: 9px; } footer .licenses .inner-content { padding-right: 71px; } footer .licenses span { display: block; line-height: 24px; position: relative; margin-bottom: 24px; } /*footer .licenses span::before{ position: absolute; content: ""; width: 2px; height: 16px; background: @brandColor; top: 3px; left: 0; display: block; }*/ footer .licenses span em { color: @brandColor; font-style: normal; } footer .deep-footer { padding: 18px 0 21px; background: @footerColor; color: rgba(255,255,255,0.3); font-size: 13px; } footer .deep-footer a { color: rgba(255,255,255,0.3); font-size: 13px; } footer .deep-footer a:hover { color: rgba(255,255,255,1); } footer .deep-footer .company-name { color: @whiteColor; } footer .deep-footer .company-name when (@brandCode= BestRateGlobal), (@brandCode= SynergyExchange), (@brandCode= NumexFX), (@brandCode= JacksonSwiss), (@brandCode= APFX), (@brandCode= CapitexFX), (@brandCode= FGCMoney), (@brandCode= MagnaFinancial), (@brandCode= DollarEastUK), (@brandCode= FairFX), (@brandCode= Hybridge), (@brandCode= IBanex), (@brandCode= ExchangeCapital), (@brandCode= NewBridgeFX), (@brandCode= MerchantPartnersGroup), (@brandCode= OneFX), (@brandCode= Kratos), (@brandCode= FhundIT), (@brandCode= EqualsPay), (@brandCode= AlbaFX), (@brandCode= GlobalCurrencies), (@brandCode= LavaERemit), (@brandCode= PerFX), (@brandCode= CosmosCurrencyExchange), (@brandCode= CosmosCurrencyExchangeUS), (@brandCode= RedFX), (@brandCode= PCCWealth), (@brandCode= Badlx), (@brandCode= MisanoPayments), (@brandCode= PureCurrencies), (@brandCode= FibrePayments), (@brandCode= EviqeEstates), (@brandCode= PremierForex), (@brandCode= BondfordMarkets), (@brandCode= UFSConsulting), (@brandCode= SDFXSolutions), (@brandCode= SierraFX), (@brandCode= SNBPartners), (@brandCode= Equals), (@brandCode= Abire), (@brandCode = Finsense), (@brandCode = HalcyonMarkets), (@brandCode= SapphireFX), (@brandCode= BREADx) { color: @brandColor; } footer .deep-footer .company-name when (@brandCode= PropertyFXPartners), (@brandCode= SpartanFX), (@brandCode = SpartanFXPrivate) { color: @buttonColor; } footer .deep-footer .row when (@brandCode = ExchangeCapital) { color: #5660ad; } footer .deep-footer .policy-links { list-style: none; margin-bottom: 0; text-align: right; padding-left: 0; } footer .deep-footer .policy-links li { display: inline-block; padding: 0 6px; position: relative; } footer .deep-footer .policy-links li::after { display: block; content: ""; height: 13px; width: 1px; background: rgba(255,255,255,0.3); right: 0; top: 6px; position: absolute; } footer .deep-footer .policy-links li:last-child { padding-right: 0; } footer .deep-footer .policy-links li:last-child::after { display: none; } footer .deep-footer when (@brandCode = MonetaeFX) { color: white !important; } .no-click { pointer-events: none; } /* Others */ .res-div { display: none; } /* Preload */ .icon-preload { display: none; } /*inner pages*/ .inner-page .banner.fix-banner { height: 150px } .inner-page .banner .banner-content { padding-top: 55px; } .inner-page .banner.fix-banner h1 { font-size: 34px; text-transform: uppercase; } .open-account-section { text-align: center; padding: 72px 0 50px; } .open-account-section .container { max-width: 900px } .open-account-section h5 { text-transform: none; line-height: 30px; color: @blackColor; font-family: 'Encode Sans', sans-serif; font-weight: normal; } .open-account-section h5 a { font-weight: 500; } .open-account-section h5 a:hover { font-weight: 500; color: @brandColor } .btn-primary { background: @buttonColor; border-color: @buttonColor; padding: 0px 12px; line-height: 36px; position: relative; outline: none; } .btn-primary.black-btn { background: @blackColor; border-color: @blackColor; } .btn-primary.black-btn:focus, .btn-primary.black-btn:hover { background: @whiteColor; border-color: @blackColor; color: @blackColor; } .btn-primary.green-btn { background: #00a658; border-color: #00a658; } .btn-primary.green-btn:focus, .btn-primary.green-btn:hover { background: @whiteColor; border-color: #00a658; color: #00a658; } .btn-primary.white-btn { background: @whiteColor; border-color: @whiteColor; color: @brandColor; } .btn-primary.white-btn:focus, .btn-primary.white-btn:hover { background: @whiteColor; border-color: @brandColor; color: @brandColor; } .btn-primary.grey-btn { background: #b6b6b6; border-color: #b6b6b6; } .btn-primary.grey-btn:focus, .btn-primary.grey-btn:hover { background: @whiteColor; border-color: #b6b6b6; color: #b6b6b6; } .btn-primary.red-btn { background: #D92D20; border-color: #D92D20; } .btn-primary.red-btn:focus, .btn-primary.red-btn:hover { background: @whiteColor; border-color: #D92D20; color: #D92D20; } .btn-primary.blackCop-btn { background: #363842; border-color: #363842; } .btn-primary.blackCop-btn:focus, .btn-primary.blackCop-btn:hover { background: @whiteColor; border-color: #363842; color: #363842; } .btn-primary i { display: inline-block; width: 13px; height: 13px; margin: 0 5px; vertical-align: middle; } .btn-primary i .hover-state { display: none; } .btn-primary i img { vertical-align: top; } .btn-primary:hover i .hover-state { display: inline-block; } .btn-primary:hover i .normal-state { display: none; } .btn-primary:active { background: @buttonColor; border-color: @buttonColor; color: @whiteColor; -webkit-box-shadow: none; box-shadow: none; } .btn-primary:hover, .btn-primary:focus { border-color: @buttonColor; color: @buttonColor; outline: none; } .btn-white { background: @whiteColor; border-color: @whiteColor; color: @buttonColor; outline: none; } .btn-white:hover, .btn-white:focus { border-color: @buttonColor; outline: none; } .btn-primary:active:hover { background-color: @whiteColor; border-color: @buttonColor; color: @buttonColor; } .btn-primary:active:focus { background-color: @whiteColor; border-color: @buttonColor; color: @buttonColor; } .open-account-section .services-block { padding-top: 35px; } /* CTA Section */ .cta-section { background: @footerColor; text-align: center; padding: 56px 0; } .cta-section when (@brandCode= FGCMoney), (@brandCode= DollarEastUK), (@brandCode= MontraPartners), (@brandCode= TesoraPay), (@brandCode= EFX), (@brandCode= WhitehallBarr), (@brandCode= ForwardFX), (@brandCode= CraftCurrency), (@brandCode= EviqeEstates), (@brandCode= VGroupFX) { background: @blackColor !important } .cta-section p { font-size: 18px; line-height: 24px; } .cta-section p span { display: block; padding-top: 8px; } .cta-section p span a { font-size: 22px; line-height: normal; color: @whiteColor } .cta-section p span when (@brandCode = ExchangeCapital) { color: @buttonColor !important; } .cta-section p span a when (@brandCode = ExchangeCapital) { color: @buttonColor !important; } .cta-section p span a:hover when not (@brandCode = Reb8) { color: @brandColor } .cta-section p span a:hover when (@brandCode = PangeaFX), (@brandCode = ClearviewFX), (@brandCode = ThamesLock), (@brandCode = ClaydonPartners), (@brandCode = AbacusFX), (@brandCode = MoneyMechanix), (@brandCode = NumusCapital), (@brandCode = AlpineFX), (@brandCode = LudRates), (@brandCode = SimplyiPay), (@brandCode = VaultFX), (@brandCode = PureCurrencies), (@brandCode= ProntoSwap), (@brandCode= AffinityExchange), (@brandCode= BLKFX), (@brandCode= WhitehallBarr), (@brandCode= ForwardFX), (@brandCode= TheDaviesExchange), (@brandCode= OACapital), (@brandCode= WorldCurrency), (@brandCode= PantheraGlobalPayments), (@brandCode= CremelloCurrency), (@brandCode = VasudaInternational), (@brandCode= PlanetFX), (@brandCode = TuchDigital), (@brandCode = Capsa), (@brandCode = VortoTrading), (@brandCode = DCEBrokers), (@brandCode = PayiO), (@brandCode = GoXchange), (@brandCode = SpectrumFX) { color: @whiteColor } .cta-section p span a:hover when (@brandCode = Reb8), (@brandCode = ExchangeCapital), (@brandCode = ClearviewFX), (@brandCode = PangeaFX), (@brandCode = ThamesLock), (@brandCode = ClaydonPartners), (@brandCode = AbacusFX), (@brandCode= BLKFX) { opacity: 0.5 } .cta-section .bt-group { padding-top: 15px; } .cta-section .bt-group .btn-primary { padding: 0px 38px; font-size: 18px; line-height: 45px; margin: 0 10px } .cta-section .bt-group .btn-primary:hover when not (@transperantButtonBackground = False) { background: transparent; color: @brandColor; } .cta-section .bt-group .btn-primary when (@brandCode = GoXchange), (@brandCode = SpectrumFX) { background: @whiteColor; color: @brandColor; } .cta-section .bt-group .btn-primary:hover when (@brandCode = GoXchange), (@brandCode = SpectrumFX) { background: @whiteColor; color: @brandColor; } /* Sign up section */ .left-image { width: 60%; overflow: hidden; height: 100vh; float: left; } .left-image img { width: 100% !important; height: 100% !important; left: 0px !important; top: 0% !important; -o-object-fit: fill; object-fit: fill; } .left-image img when (@brandCode = Currencies4You) { left: 0px !important; } .left-image img when (@brandCode = CurrencyOnlineGroup), (@brandCode= PremierForex), (@brandCode = KnightsbridgePlace), (@brandCode= PropertyFXPartners), (@brandCode= CashForInvoices), (@brandCode= HenleyOaks), (@brandCode= FXBoutique), (@brandCode= ArcanumFX), (@brandCode= RIFFX), (@brandCode= PathfinderFX), (@brandCode= Ibanista), (@brandCode= LucidFinancialMarkets), (@brandCode= Neoflow) { width: 100% !important; left: 0px !important; -o-object-fit: fill; object-fit: fill; } .left-image img when (@brandCode= GypsyMoth), (@brandCode= KeyFX) { width: 100% !important; left: 0px !important; -o-object-fit: contain; object-fit: contain; } .left-image img when (@brandCode = FGMedien), (@brandCode= PrimeCurrencies), (@brandCode = Karmenta), (@brandCode = FreedomForex) { -o-object-fit: none; object-fit: none; } @media (max-width: 767px) { .left-image img when (@brandCode= PrimeCurrencies) { -o-object-fit: contain !important; object-fit: contain !important; position: absolute !important; width: inherit !important; height: inherit !important; padding-left: 5% !important; padding-right: 5% !important; } } .left-image img when (@brandCode= PremierForex), (@brandCode= Blockzo), (@brandCode= BondfordMarkets), (@brandCode= UFSConsulting), (@brandCode= VGroupFX), (@brandCode= OACapital) { width: 100% !important; height: 100% !important; left: 0px !important; -o-object-fit: fill; object-fit: fill; } .left-image img when (@brandCode = EviqeEstates), (@brandCode= Axius) { width: 100% !important; left: 0px !important; -o-object-fit: contain; object-fit: contain; } .left-image img when (@brandCode = PantheraGlobalPayments), (@brandCode = VortoTrading), (@brandCode= GlobalConnectFX) { width: 100% !important; height: 100% !important; left: 0px !important; -o-object-fit: contain; object-fit: contain; } .left-image img when (@brandCode= PMNTTechnologies), (@brandCode= GoodFX) { width: 100% !important; height: 90% !important; left: 0px !important; -o-object-fit: contain; object-fit: contain; top: 5% !important; } .left-image img when (@brandCode = MoneyMatters) { width: 95% !important; height: 85% !important; left: 5% !important; -o-object-fit: contain; object-fit: contain; top: 5% !important; } .left-image img when (@brandCode = VasudaInternational) { width: 70% !important; height: 85% !important; left: 15% !important; -o-object-fit: contain; object-fit: contain; top: 5% !important; } .left-image img when (@brandCode = TuchDigital) { width: 70% !important; height: 85% !important; left: 15% !important; -o-object-fit: contain; object-fit: contain; top: 9% !important; } .left-image img when (@brandCode = BrandOrganic) { width: 70% !important; height: 85% !important; top: 5% !important; left: 17% !important; -o-object-fit: contain; object-fit: contain; } .left-image img when (@brandCode = SecureaFinancial), (@brandCode = FCGlobalPayments), (@brandCode = InterlinkFX) { -o-object-fit: cover; object-fit: cover; } .left-image img when (@brandCode = Abire), (@brandCode= PaysbridgeUK) { width: 90% !important; left: 5% !important; -o-object-fit: contain; object-fit: contain; } .left-image img when (@brandCode = IntegritasWealthPartners), (@brandCode = EakoCapital), (@brandCode = IQFX) { -o-object-fit: contain; object-fit: contain; } .signinpanel when (@brandCode = DKKPartners) { margin: 6% auto 0 auto; } .signinpanel when (@brandCode = SwiftFX) { margin: 6% auto 0 auto !important; } .signinpanel when (@brandCode = EviqeEstates), (@brandCode= Ibanista) { margin: 8% auto 0 auto !important; } .sign-up-form { float: left; width: 38%; padding-top: 180px; position: relative; padding-left: 15px; padding-right: 15px; } .sign-up-form when (@brandCode = DKKPartners), (@brandCode = AgileFX), (@brandCode = VaultFX), (@brandCode = AlpineFX), (@brandCode = LudRates), (@brandCode = EdgeMoney), (@brandCode= WillUFX), (@brandCode= PropertyFXPartners), (@brandCode= SDFXSolutions), (@brandCode= LucidFinancialMarkets), (@brandCode= SouthWestForeignExchange), (@brandCode= UnicornCurrencies), (@brandCode= HenleyOaks), (@brandCode= AltPay), (@brandCode= InsightCurrency), (@brandCode= BrandOrganic), (@brandCode= LemontMoney), (@brandCode= GartonGlobal), (@brandCode= LixFx) { padding-top: 102px !important; } .sign-up-form when (@brandCode = PerFX), (@brandCode = MerchantPartnersGroup), (@brandCode = EscapeCurrencies), (@brandCode = MoneyMechanix), (@brandCode = SolisFX), (@brandCode = CurrencyWave), (@brandCode = PureCurrencies), (@brandCode = ClearcapExchange), (@brandCode = Reb8), (@brandCode= VGroupFX), (@brandCode= CaptivaCM), (@brandCode= NewAgeCapital), (@brandCode= WorldwideRemit), (@brandCode= TheDaviesExchange), (@brandCode= GoodFX), (@brandCode= Capsa), (@brandCode= VortoTrading), (@brandCode= LansmithGlobalPartners), (@brandCode= ReciprocalPayments), (@brandCode = SolCapitalMarkets), (@brandCode = OvalPeakPartners), (@brandCode = IQFX), (@brandCode= Britto), (@brandCode= IFAMarkets), (@brandCode = OakleighExchange) { padding-top: 110px !important; } .sign-up-form when (@brandCode = ClearviewFX), (@brandCode = CapitexFX), (@brandCode = OpalFX), (@brandCode = IslandFX), (@brandCode = SocietyFinancial), (@brandCode = LighthouseFX), (@brandCode = ActaPacific), (@brandCode = VisionFX), (@brandCode = NumusCapital), (@brandCode = RedFX), (@brandCode = PCCWealth), (@brandCode = SterlingWellCapital), (@brandCode = MisanoPayments), (@brandCode = CurrencyOnlineGroup), (@brandCode= BondfordMarkets), (@brandCode= ArcanumFX), (@brandCode= KeyFX), (@brandCode= PlanetFX), (@brandCode = ApexCurrency), (@brandCode = Abire), (@brandCode = IntegritasWealthPartners), (@brandCode = OceanCapital), (@brandCode = CambridgeGlobalPartners), (@brandCode = TheMintedApp), (@brandCode= AzureGlobal), (@brandCode = 1FX), (@brandCode = CambridgeCurrencies), (@brandCode = FibrePayments), (@brandCode= SuisseCapital), (@brandCode= OptimumFinance), (@brandCode = ADCapitalMarkets), (@brandCode= GoldhurstPartners), (@brandCode= Sterlex), (@brandCode= YourwayFX), (@brandCode= ChartwellInternational), (@brandCode = SovereignInternational), (@brandCode = SullivanFX), (@brandCode = SpectrumFX), (@brandCode = AquaProperties) { padding-top: 130px !important; } .sign-up-form when (@brandCode = CosmosCurrencyExchange), (@brandCode = CosmosCurrencyExchangeUS), (@brandCode = MedlockAndThames), (@brandCode = BerkshireExchange), (@brandCode = OrangeFX), (@brandCode = OctopiFinancial), (@brandCode = SimplyiPay), (@brandCode = TesoraPay), (@brandCode= CenturaFX), (@brandCode= FCIPremier), (@brandCode = ForeignMoney), (@brandCode= PHGlobalPay), (@brandCode = InterlinkFX), (@brandCode= TactMoney), (@brandCode = AlexFin), (@brandCode = HorizonCurrency), (@brandCode= MMCExpress), (@brandCode = ECAPIOM) { padding-top: 120px !important; } .sign-up-form when (@brandCode = DJMForex), (@brandCode = SwiftFX), (@brandCode = ExchangeGlobal), (@brandCode= OACapital), (@brandCode = PaysbridgeUK), (@brandCode = ZodiacPartners), (@brandCode = PaymentsInternational) { padding-top: 90px !important; } .sign-up-form when (@brandCode = ProntoPay), (@brandCode = PayFX), (@brandCode = Currencies4You), (@brandCode = ProvisionCurrency) { padding-top: 99px !important; } .sign-up-form when (@brandCode= SpartanFX), (@brandCode = SpartanFXPrivate), (@brandCode= GypsyMoth), (@brandCode= EakoCapital), (@brandCode = FCGlobalPayments), (@brandCode = SendMoneyOverseas) { padding-top: 115px !important; } .sign-up-form when (@brandCode= Paysbridge), (@brandCode= EviqeEstates), (@brandCode= FXBoutique), (@brandCode= SFCPayments), (@brandCode= Excel121), (@brandCode= TotalCurrencyExchange), (@brandCode = JacksonSwiss), (@brandCode = StellarCapital), (@brandCode = Greengage), (@brandCode = ClaremontCS) { padding-top: 125px !important; } .sign-up-form when (@brandCode = CurrencyFarm), (@brandCode= PremierForex), (@brandCode= Neoflow), (@brandCode= PMNTTechnologies), (@brandCode= CurrencyExpert), (@brandCode = PayiO), (@brandCode = CoverPoint), (@brandCode = Monerva), (@brandCode = CamExCapital) { padding-top: 100px !important; } .sign-up-form when (@brandCode = LavaERemit), (@brandCode = MabuhayInternational), (@brandCode = FGMedien), (@brandCode= UnityFX), (@brandCode= WorldCurrency), (@brandCode = VasudaInternational), (@brandCode = GrantaPayments), (@brandCode = FreedomForex){ padding-top: 85px !important; } .sign-up-form when (@brandCode = Nexdi), (@brandCode = SierraFX), (@brandCode = DCEBrokers), (@brandCode = FairwayCurrencies), (@brandCode = ProvisionCurrency) { padding-top: 95px !important; } .sign-up-form when (@brandCode= CashForInvoices), (@brandCode= Axius), (@brandCode = RegencyFX), (@brandCode= PathfinderFX), (@brandCode= VerticalFX), (@brandCode= Caspa), (@brandCode = CountingKing), (@brandCode= PantheraFX), (@brandCode = Elev8Exchange), (@brandCode = GoXchange), (@brandCode = ManagedMarkets), (@brandCode = ClearerFX), (@brandCode = PaymentsInternational) { padding-top: 108px !important; } .sign-up-form when (@brandCode= RIFFX), (@brandCode= CremelloCurrency), (@brandCode= Blockzo), (@brandCode= Flowbrite) { padding-top: 96px !important; } .sign-up-form when (@brandCode= CompetitiveMortgagesFS) { padding-top: 41px !important; } .sign-up-form when (@brandCode= PantheraGlobalPayments) { padding-top: 36px !important; } .sign-up-form when (@brandCode = TuchDigital) { padding-top: 56px !important; } .sign-up-form when (@brandCode = Harlowesphere), (@brandCode = GoGlobalFX) { padding-top: 78px !important; } .sign-up-form when (@brandCode = OrbisExchangeUAE), (@brandCode = PantherPay), (@brandCode= SapphireFX), (@brandCode= CredenceExchange), (@brandCode = MondoGlobalPayments), (@brandCode = InternationalPaymentSolutions), (@brandCode= MangalMoneyTransfer), (@brandCode= ECAP), (@brandCode = RBKPayments), (@brandCode = AurumPrivateOffice), (@brandCode= JNFX), (@brandCode= SynergyExchange), (@brandCode = ZXTech), (@brandCode = MonroeGlobal) { padding-top: 140px !important; } .sign-up-form when (@brandCode = VertexFinancialPartners), (@brandCode = GolfFX), (@brandCode = BPAYD), (@brandCode= GentiumFX) { padding-top: 145px !important; } .sign-up-form when (@brandCode= BREADx), (@brandCode = BriskPay), (@brandCode = NoxtiMoney), (@brandCode = Bnking), (@brandCode= Transmony) { padding-top: 155px !important; } .sign-up-form when (@brandCode= MotoMoney), (@brandCode = MayfairFX), (@brandCode = RossAndCoPrivate) { padding-top: 160px !important; } .sign-up-form when (@brandCode = ClaricoPay) { padding-top: 72px !important; } .sign-up-form when (@brandCode= OccamPartners), (@brandCode = CanterburyPartners), (@brandCode = YPClub) { padding-top: 65px !important; } .sign-up-form when (@brandCode= BrightSparkEnterprises), (@brandCode= UFSConsulting), (@brandCode= Ibanista), (@brandCode= ThePaymentsPractice), (@brandCode= PrimeCurrencies), (@brandCode = MoneyMatters), (@brandCode = ForeignCurrencyPartners), (@brandCode= GlobalConnectFX) { padding-top: 80px !important; } .sign-up-form .close-btn { width: 16px; position: absolute; right: 49px; top: 45px; -webkit-transition: 0.5s all ease; transition: 0.5s all ease } .sign-up-form .close-btn:hover { opacity: 0.5; } .sign-up-form .inner-content { max-width: 474px; margin: 0 auto; width: 100%; } .sign-up-form .inner-content .logo-signup { max-width: 177px; display: block; margin: 0 auto 18px; } .sign-up-form .inner-content .logo-signup when (@brandCode = EviqeEstates), (@brandCode = ZXTech), (@brandCode = PaysbridgeUK) { max-width: 50px; } .sign-up-form .inner-content .logo-signup when (@brandCode = Nexdi), (@brandCode = ApexCurrency), (@brandCode = DCEBrokers), (@brandCode = ForeignExchangeBroker), (@brandCode = YPClub), (@brandCode = ZodiacPartners), (@brandCode= GoGlobalFX) { max-width: 96px; } .sign-up-form .inner-content .logo-signup when (@brandCode = Hybridge), (@brandCode = LighthouseFX), (@brandCode= WorldwideRemit), (@brandCode = OceanCapital), (@brandCode= SynergyExchange), (@brandCode= ClearerFX) { max-width: 243px; } .sign-up-form .inner-content .logo-signup when (@brandCode= GlobalConnectFX) { max-width: 60px !important; } .sign-up-form .inner-content .logo-signup when (@brandCode= Blockzo), (@brandCode= PantheraFX), (@brandCode= AurumPrivateOffice) { max-width: 70px !important; } .sign-up-form .inner-content .logo-signup when (@brandCode = LavaERemit), (@brandCode = AgileFX), (@brandCode = RedFX), (@brandCode = LudRates), (@brandCode= WillUFX), (@brandCode= SuisseCapital), (@brandCode = SolCapitalMarkets) { max-width: 80px !important; } .sign-up-form .inner-content .logo-signup when (@brandCode = MonetaeFX), (@brandCode = EscapeCurrencies), (@brandCode = PureCurrencies), (@brandCode = ClearcapExchange), (@brandCode= SpartanFX), (@brandCode = SpartanFXPrivate), (@brandCode= SFCPayments), (@brandCode= TotalCurrencyExchange), (@brandCode= PantherPay) { max-width: 224px; } .sign-up-form .inner-content .logo-signup when (@brandCode = Reb8), (@brandCode = NewBridgeFX), (@brandCode= CashForInvoices), (@brandCode= SapphireFX), (@brandCode= VertexFinancialPartners) { max-width: 218px; } .sign-up-form .inner-content .logo-signup when (@brandCode = OneFX), (@brandCode = OpalFX), (@brandCode = DJMForex), (@brandCode = AlpineFX), (@brandCode = SecureaFinancial), (@brandCode = JacksonSwiss) { max-width: 134px; } .sign-up-form .inner-content .logo-signup when (@brandCode = FhundIT), (@brandCode = SwiftFX), (@brandCode= PHGlobalPay), (@brandCode = InterlinkFX) { max-width: 158px; } .sign-up-form .inner-content .logo-signup when (@brandCode = ThamesLock), (@brandCode = OrangeFX), (@brandCode = Karmenta), (@brandCode = Abire), (@brandCode = IntegritasWealthPartners), (@brandCode = CredenceExchange), (@brandCode = InternationalPaymentSolutions), (@brandCode = StellarCapital), (@brandCode = Currencies4You), (@brandCode = AquaProperties) { max-width: 210px; } .sign-up-form .inner-content .logo-signup when (@brandCode = ClaydonPartners), (@brandCode = ActaPacific){ max-width: 270px; } .sign-up-form .inner-content .logo-signup when (@brandCode = PangeaFX), (@brandCode = Kratos), (@brandCode = MotoMoney) { max-width: 194px; } .sign-up-form .inner-content .logo-signup when (@brandCode = DKKPartners) { max-width: 280px; } .sign-up-form .inner-content .logo-signup when (@brandCode = FortunaFX), (@brandCode = LavaERemit), (@brandCode = VisionFX), (@brandCode = AgileFX), (@brandCode = SolisFX), (@brandCode= BrightSparkEnterprises), (@brandCode= OccamPartners), (@brandCode = TuchDigital), (@brandCode = TheMintedApp), (@brandCode= ChartwellInternational), (@brandCode= IFAMarkets) { max-width: 120px; } .sign-up-form .inner-content .logo-signup when (@brandCode =PantheraGlobalPayments), (@brandCode = CountingKing), (@brandCode = OvalPeakPartners), (@brandCode = HorizonCurrency) { max-width: 127px; } .sign-up-form .inner-content .logo-signup when (@brandCode = CanterburyPartners), (@brandCode = Elev8Exchange), (@brandCode = SullivanFX), (@brandCode= MMCExpress) { max-width: 123px; } .sign-up-form .inner-content .logo-signup when (@brandCode = CambridgeGlobalPartners){ max-width: 228px; } .sign-up-form .inner-content .logo-signup when (@brandCode = GlobalCurrencies), (@brandCode = OctopiFinancial) { max-width: 300px; } .sign-up-form .inner-content .logo-signup when (@brandCode = OptimalCurrency), (@brandCode= PropertyFXPartners), (@brandCode= ForeignCurrencyPartners), (@brandCode= MangalMoneyTransfer), (@brandCode= TactMoney), (@brandCode= JNFX) { max-width: 140px; } .sign-up-form .inner-content .logo-signup when (@brandCode = 1FX), (@brandCode = FCGlobalPayments), (@brandCode = ProvisionCurrency), (@brandCode = Monerva) { max-width: 144px; } .sign-up-form .inner-content .logo-signup when (@brandCode = Reb8), (@brandCode = SendMoneyOverseas), (@brandCode = LixFx) { max-width: 150px; } .sign-up-form .inner-content .logo-signup when (@brandCode = RIFFX) { max-width: 109px; margin-left: 186px; } .sign-up-form .inner-content .logo-signup when (@brandCode = SovereignInternational), (@brandCode = EdgeMoney) { max-width: 180px; } .sign-up-form .inner-content .logo-signup when (@brandCode = Ibanista), (@brandCode = MoneyMatters), (@brandCode= OACapital), (@brandCode= AzureGlobal) { max-width: 108px; } .sign-up-form .inner-content .logo-signup when (@brandCode = VasudaInternational), (@brandCode = ReciprocalPayments) { max-width: 113px; } .sign-up-form .inner-content .logo-signup when (@brandCode = CornerstoneFX), (@brandCode = ManagedMarkets) { max-width: 300px; } .sign-up-form .inner-content .logo-signup when (@brandCode = PCCWealth) { max-width: 350px; } .sign-up-form .inner-content .logo-signup when (@brandCode = UFSConsulting), (@brandCode= UnityFX), (@brandCode = AlexFin) { max-width: 67px; } .sign-up-form .inner-content .logo-signup when (@brandCode = Harlowesphere) { max-width: 87px; } .sign-up-form .inner-content .logo-signup when (@brandCode = Lydiam) { max-width: 27px; } .sign-up-form .inner-content h5 { text-transform: none; letter-spacing: -0.6px; color: @blackColor; text-align: center; } .sign-up-form .inner-content form { padding-top: 30px; padding-bottom: 33px; border-bottom: 1px solid #d8d8d8; } .sign-up-form .inner-content .form-control { width: 100%; } .sign-up-form .inner-content .submit-btn { padding-top: 9px; } .sign-up-form .inner-content .submit-btn input[type="sumit"] { padding-top: 9px; } .sign-up-form .login-page-redirect { margin-top: 21px; text-align: center; color: #9f9f9f; } .sign-up-form .login-page-redirect a { color: @brandColor; text-decoration: underline; } .sign-up-form .login-page-redirect a:hover, .sign-up-form .login-page-redirect a:focus { color: #202120; } .page-content { padding: 72px 0 41px; text-align: center; } .page-content p { margin-bottom: 21px; line-height: 24px; margin-bottom: 24px; } .page-content p strong { font-size: 20px; font-weight: 400; color: @blackColor; line-height: 30px; margin-bottom: 18px; } .page-content h5 { text-transform: none; } .team-section .thumb-block { margin-bottom: 22px; } .team-section { padding-top: 20px; padding-bottom: 38px; } .team-section figure { margin-bottom: 23px; } .team-section figure:nth-of-type(3n+1) { clear: left; } .team-section .mem-name { margin-bottom: 7px; } .team-section .mem-name span { display: inline-block; padding: 0 7px 0 2px; } .team-section .mem-name .name { font-size: 18px; color: @blackColor; font-weight: 600; position: relative; padding-left: 0; } .team-section .mem-name .name::after { content: ""; position: absolute; width: 2px; height: 18px; top: 8px; right: 0; display: block; background: #d9d9d9; } .team-section .mem-name .designation { letter-spacing: 0.5px; } .team-section figure figcaption p { line-height: 24px; } /* Application form page */ .about-us-section { padding: 50px 0 60px; } .about-us-section .fade { -webkit-transition: all 0.15s linear; transition: all 0.15s linear; -webkit-transform: translateY(50px); transform: translateY(50px); } .about-us-section .fade.in { -webkit-transform: translateY(0); transform: translateY(0); } .application-form { padding: 50px 0 60px; } .application-form tab-content .fade { -webkit-transition: all 0.15s linear; transition: all 0.15s linear; -webkit-transform: translateY(50px); transform: translateY(50px); } .application-form tab-content .fade.in { -webkit-transform: translateY(0); transform: translateY(0); } #application-form-steps { border: 0; } #application-form-steps > li { float: none; width: 100%; border-bottom: 1px solid #e1e1e1; margin-bottom: 0; } #application-form-steps > li:last-child { border: 0; } #application-form-steps > li > a { font-size: 20px; color: #aeaeae; margin: 0; display: block; font-family: 'Roboto Slab', serif; font-weight: 400; padding: 23px 30px 24px 0; border: 0; position: relative; pointer-events: none; } #application-form-steps > li > a::after { content: ""; position: absolute; width: 15px; height: 15px; display: block; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 0; background: url(../../images/arrow-right-tab.svg); background-position: center center; background-repeat: no-repeat; background-size: auto; display: none; } #application-form-steps > li > a:hover::after { display: block; } #application-form-steps > li.active > a::after { background: url(../../images/arrow-right-tab.svg); background-position: center center; background-repeat: no-repeat; background-size: auto; display: block; } #application-form-steps > li.completed > a { pointer-events: auto; } #application-form-steps > li.completed > a::after { content: ""; background: url(../../images/check-icon-tab.png); background-position: center center; background-repeat: no-repeat; background-size: auto; display: block; } #application-form-steps > li.active > a { -webkit-box-shadow: none; box-shadow: none; border-radius: 0; border: 0; margin: 0; color: @blackColor; pointer-events:; } #application-form-steps > li > a:hover { background: none; } .form-message { font-size: 14px; color: #aeaeae; display: block; margin-bottom: 15px; letter-spacing: 0.6px; } .form-message strong { letter-spacing: 0.3px; color: @blackColor; } .application-form .tab-content { padding-top: 10px; } .application-form .tab-content p { font-size: 18px; line-height: 26px; letter-spacing: -0.2px; } .application-form .tab-content p.head-text { padding-bottom: 13px; border-bottom: 1px solid #e1e1e1; } .application-form .tab-content .tab-pane { background: @whiteColor; border-radius: 6px; -webkit-box-shadow: 0 8px 30px 8px rgba(29,29,29,0.15); box-shadow: 0 8px 30px 8px rgba(29,29,29,0.15); } .application-form .tab-content .tab-pane#fx-requiremnt .tab-inner-content { padding-bottom: 68px; } .application-form .tab-pane .tab-inner-content { padding: 24px 30px 8px; } .application-form .tab-pane .tab-footer { background: #f4f4f4; } .application-form .tab-pane .tab-footer .bt-group { text-align: right; } .application-form .tab-pane .tab-footer .bt-group a { margin: 0; margin-left: 7px; min-width: 112px; text-align: center; padding: 8px 13px 8px 19px; } .application-form .tab-pane .tab-footer .bt-group a.btn-white { background: @whiteColor; color: @brandColor; padding: 8px 13px 8px 13px; outline: none; } .tab-footer { background: #f4f4f4; padding: 23px 19px 20px; } .card-footer { padding: 23px 19px 20px; } .tab-footer .bt-group { text-align: right; } .tab-footer .bt-group a { margin: 0; margin-left: 7px; min-width: 112px; text-align: center; padding: 8px 13px 8px 19px; } .tab-footer .bt-group a.btn-white { background: @whiteColor; color: @brandColor; padding: 8px 13px 8px 13px; outline: none; } .application-form input { padding: 0 15px; } .application-form .tab-content .btn-primary { height: auto; padding: 9px 19px 8px 15px; line-height: normal; margin-bottom: 20px; } .application-form .tab-content .btn-primary i { display: inline-block; width: 13px; height: 13px; margin: 0 5px; vertical-align: middle; } .application-form .tab-content .btn-primary i img { vertical-align: top; margin-top: -2px } .application-form .tab-footer .btn-primary i img { margin-top: 0; } .add-joint-applicant { display: none; } .form-control.date-picker { background: transparent url(../../images/calender-icon.png); background-position: 96% center; background-repeat: no-repeat; background-size: auto; } .application-form .btn-primary .hover-state { display: none; } .application-form .tab-content .btn-primary .minus-ico { display: none; } .application-form .tab-content .btn-primary.active-btn i { display: none; } .application-form .tab-content .btn-primary.active-btn .minus-ico { display: inline-block; } .application-form .btn-primary:hover .hover-state, .application-form .btn-primary:focus .hover-state { display: block; } .application-form .btn-primary:hover .normal-state, .application-form .btn-primary:focus .normal-state { display: none; } .input-select { position: relative; } .input-select .dk-select { width: 60px; display: inline-block; vertical-align: middle; position: absolute; top: 1px; bottom: 1px; height: 48px; } .input-select .dk-select .dk-selected { padding: 13px 8px 14px; border-top-right-radius: 0; border-bottom-right-radius: 0; background: transparent; border: 0; border-right: 1px solid #e1e1e1; height: auto; } .input-select .dk-select .dk-select-options { border-color: #e1e1e1; } .input-select input { margin-left: 0; width: 100%; display: inline-block; display: inline-block; vertical-align: middle; padding-left: 72px; } .tab-inner-content .dk-select { margin-bottom: 20px; } #document-identification .tab-inner-content { padding: 24px 30px 29px; } /*#document-identification ul{ padding-left: 16px; padding-top: 16px; list-style: none; margin-bottom: 16px; } #document-identification ul li{ font-size: 16px; line-height: 20px; margin-bottom: 12px; letter-spacing: -0.2px; position: relative; } #document-identification ul li::before{ width: 6px; height: 6px; content: ""; position: absolute; border-radius: 50%; background: @brandColor; display: block; left: -15px; top: 7px; }*/ #document-identification #add-document { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; margin-bottom: 14px; } #document-identification table { width: 100%; margin-bottom: 23px; border: 1px solid #e1e1e1; } #document-identification table th { padding: 12px 20px 11px; color: @blackColor; border: 1px solid #e1e1e1; } #document-identification table th:nth-child(2) { width: 11%; } #document-identification table td { padding: 8px 21px 9px; border: 1px solid #e1e1e1; } #document-identification table td:nth-child(2n) { text-align: center; } #document-identification table td i { display: inline-block; width: 16px; cursor: pointer; } #document-identification table tr:nth-child(2n-1) td { background: #f7f6f3; } .application-form #document-identification .tab-inner-content .btn-primary { margin-bottom: 14px; } #document-identification .date-of-application { padding-top: 6px; } #document-identification .date-of-application h6 { letter-spacing: -0.25px; margin-bottom: 3px; } /* Corporate Application form page */ .corporate-application-form.application-form .tab-content p.head-text { border-bottom: 0; padding-bottom: 0; } .corporate-application-form.application-form #ancknowledge-signature p { margin-bottom: 17px; } .corporate-application-form.application-form #ancknowledge-signature .tab-inner-content { padding: 24px 30px 82px; } .corporate-application-form.application-form #ancknowledge-signature .date-of-application h6 { margin-bottom: 3px; } .tab-pane.active input[type="checkbox"]:checked + label, .tab-pane.active input[type="checkbox"]:not(:checked) + label { position: relative; font-size: 16px; line-height: 24px; margin: 0; padding-left: 32px; cursor: pointer; text-align: left; display: inline-block; margin-top: 24px; font-weight: 300; } .tab-pane.active input[type="checkbox"] + label::before { content: ""; width: 23px; height: 23px; border-radius: 4px; display: block; position: absolute; background: @whiteColor; left: 0; top: 0; border: 1px solid @brandColor; } .tab-pane.active input[type="checkbox"] + label::after { content: ""; width: 23px; height: 23px; border-radius: 4px; display: block; position: absolute; background: url(../../images/check-icon-tab.png); background-position: center center; background-repeat: no-repeat; background-size: auto; left: 0; top: 0; -webkit-transform: scale(0); transform: scale(0); } .tab-pane.active label .expiry-date { margin-left: 41px; } .tab-pane.active input[type="checkbox"]:checked + label::after { -webkit-transform: scale(1); transform: scale(1); } .tab-pane.active selected input[type="checkbox"]:checked + label::before { background: #00609f; -webkit-transition: 0.3s all ease; transition: 0.3s all ease; } .terms-and-condition-check input { opacity: 0 } /* Application form page ends */ /* Corporate form page */ .auth-contact-table { width: 100%; border: 1px solid #d8d8d8; margin-bottom: 20px; } .auth-contact-table table { width: 100%; border: 0; } .auth-contact-table .details { padding: 5px 0; } .auth-contact-table table tr > td { padding: 5px 15px; font-size: 12px; border: 0; } .auth-contact-table tr > td { width: 50%; padding: 13px 15px 12px; border: 1px solid #d8d8d8; border-radius: 6px; } .tb-button { display: block; width: 14px; height: 14px; } .tb-button:hover { opacity: 0.7; } .tb-button img { vertical-align: top; } .tab-content .btn-primary.find-address { padding: 9px 8px 8px 8px; width: 100%; margin-top: 7px; } .tab-content .btn-primary.find-contact { padding: 9px 8px 8px 8px; width: 100%; margin-top: 7px; } .row.no-pad { margin: 0; } .row.no-pad > .form-group { margin: 0; padding: 0; margin-left: -1px; z-index: 2; } .row.no-pad > .form-group input, .row.no-pad > .form-group .dk-selected { border-radius: 0; } .row.no-pad > .form-group:first-child { margin: 0; } .row.no-pad > .form-group:first-child input, .row.no-pad > .form-group:first-child .dk-selected { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .row.no-pad > .form-group:last-child input, .row.no-pad > .form-group:last-child .dk-selected { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .row.no-pad > .form-group input:focus { z-index: 9; } /* Corporate form page ends */ .tag-wrapper { border: 1px solid #d8d8d8; font-size: 14px; padding: 8px 10px 2px 19px; width: 100%; border-radius: 4px; background: rgba(0,0,0,0); margin-bottom: 20px; -webkit-box-shadow: none; box-shadow: none; color: #9f9f9f; min-height: 50px; } .tag-wrapper input { height: auto; width: auto; border: 0; margin-bottom: 0; height: 100%; padding: 8px 0; max-width: 75px; line-height: normal; } .tag-wrapper .tags { font-size: 14px; background: #f7f7f7; text-transform: uppercase; display: inline-block; padding: 5px; margin-right: 16px; margin-bottom: 5px; } .tag-wrapper .tags .remove-tag { margin-left: 5px; width: 15px; height: 15px; display: inline-block; background: url(../../images/cross.png); background-position: center center; background-repeat: no-repeat; background-size: auto; vertical-align: top; margin-top: 5px; cursor: pointer; } .expand-sec { display: none; } /***************************** Dashboard **********************************/ .status-pill { display: inline-block; padding: 6px 15px 5px 15px; border-radius: 15px; background: red; text-align: center; color: @whiteColor; } .status-pill.green { background: #00a65a; } .status-pill.red { background: #ef1b1b; } .status-pill.grey { background: #8e8f8d; } .no-pad { padding: 0; } .row.pad-10 { margin-left: -10px; margin-right: -10px; } .row.pad-10 [class^="col-"] { padding: 0 10px; } .card { -webkit-box-shadow: 0 8px 30px 6px rgba(29,29,29,0.15); box-shadow: 0 8px 30px 6px rgba(29,29,29,0.15); border-radius: 5px; margin-bottom: 30px; } .card .card-title { padding-bottom: 5px; padding: 12px 20px 0; } .card .card-title .title { margin-bottom: 0; padding-bottom: 15px; border-bottom: 1px solid #e6e6e6; color: @blackColor; } .card .card-content { padding: 0 20px 20px; } .card .card-footer { padding: 10px 20px 20px; } .card ul { padding: 0; margin: 0; list-style: none; padding-top: 19px; } .card-title strong { letter-spacing: -0.2px; font-weight: 500; display: block; } .full-width { width: 100% !important; display: block !important; } .dashboard header { padding: @dashboardHeaderPadding; -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2); box-shadow: 0 0 5px rgba(0,0,0,0.2); } .dashboard header .site-logo { width: 150px; } .dashboard header .user-name { letter-spacing: 0.5px; line-height: normal; margin-top: 4px; font-size: 14px; } .dashboard header .primary-menu .menu-icon { margin-top: 9px; } .dashboard header .menu-icon { width: 20px; height: 20px; } .dashboard header .menu-icon span { height: 2px; width: 19px; left: auto; right: 0; } .dashboard header .menu-icon span:nth-of-type(2) { top: 7px; } .dashboard header .menu-icon span:nth-of-type(3) { top: 14px; } .dashboard header .menu-icon.active span:nth-of-type(1) { transform: translate(0, 7px) rotate(135deg); -webkit-transform: translate(0, 7px) rotate(135deg); } .dashboard header .menu-icon.active span:nth-of-type(3) { transform: translate(0, -7px) rotate(-135deg); -webkit-transform: translate(0, -7px) rotate(-135deg); } .dashboard header .header-left when (@brandCode = AbacusFX) { margin-top: 8px; } .dashboard header .header-left when (@brandCode = AlbaFX) { margin-top: 3px; } .dashboard header .primary-menu .menu { padding: 15px; top: 57px; } .dashboard header .primary-menu .menu li a { padding: 7px 10px; font-size: 16px; } .dashboard-page { padding-top: 20px; } .dashboard-page .note { padding: 0; border: 1px solid #ffbe50; background: @whiteColor; position: relative; margin-bottom: 24px; display: table; width: 100%; } .dashboard-page .note strong { display: table-cell; vertical-align: middle; background: #ffbe50; padding: 6px 14px 5px 14px; height: 100%; font-size: 16px; vertical-align: middle; color: @whiteColor; font-weight: normal; text-align: center; } .dashboard-page .note span { display: inline-block; font-size: 14px; vertical-align: top; width: 100%; padding: 7px 0 7px 16px; color: #8e8f8d; } .dashboard-page .note .discard-note { width: 22px; height: 22px; display: block; position: absolute; right: -11px; top: -11px; background: #e5e5e5 url(../../images/alert-discard-icon.png); background-position: center center; background-repeat: no-repeat; background-size: auto; border-radius: 50%; cursor: pointer; } .dashboard-page .content-outer { padding-bottom: 20px; } .dashboard-page .content-outer h5 { margin-bottom: 10px; color: @blackColor; } .tab-list { list-style: none; padding: 0; margin-bottom: 32px; } .tab-list li { } .tab-list .tab-title { position: relative; padding: 18px 6px 16px 20px; border-radius: 5px; -webkit-box-shadow: 0 2px 4px rgba(33, 32, 33, 0.2); box-shadow: 0 2px 4px rgba(33, 32, 33, 0.2); display: block; background-position: 0 0, 100% 0; background-repeat: no-repeat; background-image: none; -webkit-transition: 0.25s all ease; transition: 0.25s all ease; } .tab-list .tab-title span.tab-icon { width: 23%; display: inline-block; vertical-align: middle; position: relative; z-index: 9; } .tab-list .tab-title span.tab-name { width: 65%; display: inline-block; vertical-align: middle; font-size: 18px; text-transform: uppercase; color: @blackColor; line-height: 26px; margin-left: 11px; position: relative; z-index: 9; -webkit-transition: 0.25s all ease; transition: 0.25s all ease; } .tab-list .tab-title::after { content: ""; position: absolute; left: 2px; right: 2px; top: 2px; bottom: 2px; background: @whiteColor; border: 0; -webkit-box-sizing: content-box; box-sizing: content-box; border-radius: 5px; display: block; } .tab-list .tab-title:hover, .tab-list .tab-title.active { background-image: -webkit-gradient(linear, left top, left bottom, from(@orangeColor), to(#b76d37)), -webkit-gradient(linear, left top, left bottom, from(@orangeColor), to(#b76d37)); background-image: linear-gradient(to bottom, @orangeColor 0%, #b76d37 100%), linear-gradient(to bottom, @orangeColor 0%, #b76d37 100%); -webkit-box-shadow: 0 2px 4px rgba(244, 153, 25, 0.2); box-shadow: 0 2px 4px rgba(244, 153, 25, 0.2); } .tab-list .tab-title:hover .tab-name, .tab-list .tab-title.active .tab-name { color: @buttonColor; } .card.send-money-card ul { padding-top: 19px; } .card.send-money-card ul li { margin-bottom: 10px; } .card.send-money-card ul li span { width: 48%; display: block; float: left; vertical-align: bottom; padding-left: 21px; padding-top: 11px; } .card.send-money-card ul li .select-wrap { width: 52%; display: block; float: left; vertical-align: middle; text-align: right; } .card.send-money-card ul li .form-control { height: 40px; margin-bottom: 0; border-color: #f4f4f4; background: #f4f4f4; } .card.send-money-card .dd-container label { font-size: 14px; font-weight: 500; } .card.send-money-card a.dd-selected { padding: 7px 17px; font-weight: 500; } .card.send-money-card .dd-options > li > .dd-option { padding: 5px 17px; } .card.send-money-card .dd-options { padding: 5px 0; } .card.send-money-card .dd-options > li { margin-bottom: 0; } .card.send-money-card ul li .dk-select { display: inline-block; max-width: 170px; text-align: left; height: 40px; background: #f4f4f4; border-radius: 3px; border: 0; } .card.send-money-card ul li .dk-select .dk-selected { height: 40px; background: #f4f4f4; border-radius: 3px; border: 0; padding: 10px 18px 10px 16px; font-size: 14px; font-weight: 500; } .card.send-money-card ul li .dk-select .dk-select-options { border: 0; padding: 0; } .card.send-money-card ul li .dk-select .dk-select-options li { margin: 0; padding: 5px 17px; } .card.send-money-card ul li .dk-select .dk-select-options li.dk-option-highlight, .card.send-money-card ul li .dk-select .dk-select-options li.dk-option-selected { color: @blackColor; } .card.send-money-card .select-currency-wrap .dk-selected { text-transform: uppercase; color: @blackColor; } .card.send-money-card .card-footer { background: none; } .card.send-money-card .card-content { padding-bottom: 0; } .card.funds-available .avail-fund-list { padding-top: 20px; margin-bottom: 17px; } .card.funds-available .avail-fund-list li { margin-bottom: 20px; width: 49%; display: inline-block; } .card.funds-available .card-content { padding-bottom: 0; } .card.funds-available i { display: inline-block; max-width: 23px; vertical-align: middle; margin-right: 10px; } .card.funds-available span { display: inline-block; vertical-align: middle; font-size: 16px; letter-spacing: -0.2px; font-weight: 500; line-height: normal; } .card.funds-available .card-footer { padding-top: 4px; background: none; } .card .btn-primary { width: 100%; font-size: 16px; padding: 1px 12px; } .card .btn-primary i { margin-left: 20px; } .full-width .dk-select { width: 100% !important; max-width: 100% !important; display: block !important; } .account-detail-tab-outer .table-wrap { margin-top: 20px; } .table-wrap { margin-top: 20px; } .table-wrap table { border: 1px solid #d8d8d8; width: 100%; } .table-wrap th { font-size: 16px; color: @brandColor; font-weight: normal; padding: 15px 10px 14px; line-height: normal; border: 1px solid #d8d8d8; } .table-wrap td { font-size: 14px; padding: 11px 10px 10px; line-height: normal; border: 1px solid #d8d8d8; } .account-detail-tab-outer .tab-inner-content { padding: 0 20px 17px; } .account-detail-tab-outer .nav-tabs { padding: 0; } .account-detail-tab-outer .tab-button { padding: 13px 20px 0; } .account-detail-tab-outer .tab-footer a { line-height: normal; width: auto; font-size: 14px; padding: 7px 13px 9px 19px; } .account-detail-tab-outer .tab-footer a i { margin-left: 6px; } #account-detail-tab > li { margin-bottom: 0; margin-right: 49px; } #account-detail-tab > li > a { padding: 0 0 14px; font-size: 18px; font-family: 'Roboto Slab', serif; color: @blackColor; font-weight: 700; border: 0; margin: 0; position: relative; } #account-detail-tab > li > a::after { content: ""; position: absolute; width: 100%; height: 3px; background: @blackColor; width: 100%; bottom: -1px; left: 0; display: none; } #account-detail-tab > li.active > a::after { display: block; } #account-detail-tab > li > a:hover { background: none; } .dashboard footer { border-top: 1px solid #e1e1e1; } /* Deals overview page */ .deals-overview-page { padding-top: 24px; } .deals-overview-page .back-to { text-align: right; } .deals-overview-page .back-to .btn-primary { min-width: 100px; margin-top: -5px; padding: 9px 10px 8px; line-height: normal; } .deals-overview-page .card h6 { font-family: 'Roboto Slab', serif; font-size: 18px; line-height: normal; font-weight: 400; margin-bottom: 10px; } .deals-overview-page .card.order-details .card-title { padding: 15px 20px 0; } .deals-overview-page .card.order-details .card-content { padding: 0 20px 7px; } .deals-overview-page .card.order-details .details { padding-top: 14px; } .deals-overview-page .card.order-details .details li { margin-bottom: 11px; } .deals-overview-page .card.order-details .details span { display: inline-block; vertical-align: middle; width: 43%; font-size: 16px; line-height: normal; } .deals-overview-page .card.order-details .details span.ttl { color: #9f9f9f; } .deals-overview-page .card.order-details .details span.desc { width: 55%; padding-left: 2px; color: @blackColor; } .deals-overview-page .card.user-payment-details .card-title { padding: 15px 20px 0; } .user-payment-details .table-wrap td { padding: 16px 10px; } .banificiaries-table-card .card-title { padding: 14px 20px 0; } .banificiaries-table-card .card-title .title { padding-bottom: 14px; } .banificiaries-table-card table td > span { display: inline-block; margin-right: 16px; } .banificiaries-table-card table td > i { max-width: 23px; display: block; } .banificiaries-table-card table th { padding: 15px 22px 14px; } .banificiaries-table-card table td { padding: 11px 19px 10px; } .banificiaries-table-card table td > .details-view { max-width: 33px; display: block; } .banificiaries-table-card table td > .details-view:hover, .banificiaries-table-card table td > .details-view:focus { opacity: 0.7; } .info-block { display: inline-block; padding: 5px 10px; background: #e6e6e6; } .balance-due.info-block { display: block; text-align: center; } /* Deals overview page */ .card.search-by-dates .card-title { padding: 14px 20px 0; } .card.search-by-dates .card-title .title { padding-bottom: 14px; } .card.search-by-dates .card-content { padding-top: 20px; } .card.search-by-dates .input-wrap { margin: 0 -10px; } .card.search-by-dates .i-block { display: block; margin: 0; padding: 0 10px; float: left; width: 20%; } .card.search-by-dates .form-control { height: 35px; margin-bottom: 0; } /*.card.search-by-dates .dk-select{ width: 1; }*/ .card.search-by-dates .dk-selected { height: 35px; padding: 6px 15px; font-size: 14px; } .card.search-by-dates .form-control.date-picker { background-position: 93% center; padding: 0px 35px 0px 13px; } .card.search-by-dates button { line-height: normal; padding: 8px 13px 8px 14px; font-size: 14px; height: auto; } .card.search-by-dates button i { margin: 0; margin-right: 5px; } .card.search-by-dates button.clear-btn { background: #eeeeee; color: @blackColor; border-color: #d8d8d8; } .card.search-by-dates button.clear-btn:hover { opacity: 0.6; } .card.search-by-dates .btn { max-width: 99px; } .card.search-by-dates .card-footer { padding: 26px 30px 23px; background: #f4f4f4; } .card.search-by-dates .dk-select .dk-select-options .dk-option { padding: 7px 15px; } .advance-search-toggle-btn { font-size: 16px; display: inline-block; } .advance-search-box { padding-top: 15px; } .advance-search-toggle-btn i { max-width: 10px; display: inline-block; } .advance-search-toggle-btn.active-btn i { -webkit-transform: rotate(180deg); transform: rotate(180deg); } /* Make payment tab */ .make-payment-page { padding: 24px 0 51px; } .make-payment-page .application-form { padding: 0; } .make-payment-page .application-form .payment-tabs { width: 19.5%; } .make-payment-page .application-form .payment-tab-content { width: 80.5%; } .make-payment-page .application-form .tab-content .tab-inner-content { padding: 0; } .make-payment-page .application-form .tab-content .tab-header { padding: 20px 19px 8px; position: relative; } .make-payment-page .application-form .tab-content .tab-header::after { content: ""; position: absolute; top: 100%; left: 19px; right: 19px; margin: 0 auto; height: 1px; background: #e1e1e1; display: block; } .make-payment-page .application-form .tab-content .tab-header #upload-file-payment { display: none; } .make-payment-page .application-form .tab-content .tab-detail { padding: 0 20px; } .make-payment-page .application-form .tab-content .tab-footer { padding: 20px 20px 20px 13px; } .make-payment-page .application-form .tab-content .tab-footer a { padding: 9px 13px 8px 14px; min-width: 80px; } .make-payment-page .application-form .tab-content .table-wrap { margin-top: 21px; } .make-payment-page .application-form .payment-tab-content strong { display: block; line-height: normal; margin-top: 10px; letter-spacing: -0.35px; } .make-payment-page .application-form .payment-tab-content .tab-header a { margin-bottom: 0; } .make-payment-page .application-form .payment-tab-content .add-btn { text-align: right; } .make-payment-page .application-form .tab-content { padding-top: 0; } .payment-tabs #application-form-steps { -webkit-box-shadow: 0 8px 30px 8px rgba(29,29,29,0.15); box-shadow: 0 8px 30px 8px rgba(29,29,29,0.15); } .payment-tabs #application-form-steps > li > a { padding: 23px 30px 24px 29px; } .payment-tabs #application-form-steps > li > a::after { right: 27px; } .make-payment-page .application-form .table-wrap { margin-bottom: 20px; } .make-payment-page .application-form .table-wrap th { min-width: 10px; padding: 4px 5px 5px 14px; } .make-payment-page .application-form .table-wrap td { padding: 1px 12px 0; height: 50px; } .make-payment-page .application-form .table-wrap td .i-block { width: 20%; } .make-payment-page .application-form .table-wrap td .i-block .fa { font-size: 18pt; color: @buttonColor; } .table-wrap td .i-block i { max-width: 25px; display: block; } .make-payment-page .application-form .table-wrap td strong { margin: 0; color: @blackColor; } .make-payment-page .application-form .table-wrap .dk-select { margin-bottom: 0; } .make-payment-page .application-form .table-wrap .dk-select .dk-selected { height: 35px; padding: 6px 15px; } .make-payment-page .application-form .table-wrap .form-control { height: 35px; margin-bottom: 0; } .make-payment-page .application-form .table-wrap .form-control.amount { font-weight: 700; color: @blackColor; } .make-payment-page .application-form .tab-pane.active input[type="checkbox"]:checked + label, .make-payment-page .application-form .tab-pane.active input[type="checkbox"]:not(:checked) + label { margin: 0; padding: 0; vertical-align: top; display: block; width: 23px; height: 23px; } .make-payment-page .application-form .tab-pane.active input[type="checkbox"]:not(:checked) + label::before { border-color: #d8d8d8; } .tooltip-box { position: relative; display: inline-block; vertical-align: top; } .tooltip-box .icon { width: 20px; height: 20px; display: block; border-radius: 50%; color: @whiteColor; background: @blackColor; font-style: normal; text-align: center; line-height: 20px; font-size: 11px; font-weight: 700; cursor: pointer; } .tooltip-box .tooltip-description { display: none; position: absolute; width: 200px; height: auto; top: 130%; background: rgba(36,36,36,0.9); right: -10px; z-index: 999; padding: 15px; border-radius: 6px; color: @whiteColor; font-size: 14px; } .tooltip-description::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 0 5px 5px 5px; border-color: transparent transparent rgba(36,36,36,0.9) transparent; position: absolute; bottom: 100%; right: 15px; } .tooltip-box .icon:hover + .tooltip-description { display: block; } .application-form .tooltip { margin-left: 0px; } .card-footer ul.legend { text-align: left; } .legend .usedamountlegend { background-color: #5cb85c; } .legend .remainingamountlegend { background-color: @brandColor; } .legend span { float: left; width: 15px; height: 15px; margin: 4px; } ul.legend { padding-top: 0px !important; } .authrorise-multipayment-wrapper { position: relative; margin-right: 35px; height: 35px; width: 35px; padding: 0px; fill: @brandColor; } .authrorise-multipayment-wrapper:hover .authrorise-multipayment { fill: @brandColor; } .headermenu .open > .dropdown-toggle.btn-primary { background-color: #fff; border-color: @brandColor; } .headermenu .open > .dropdown-toggle.btn-primary .authrorise-multipayment { fill: @brandColor; } .authrorise-multipayment { width: 25px; fill: @whiteColor; margin-top: 5px; } .authrorise-notification { position: absolute; top: -10px; right: -10px; height: 20px; width: 20px; background-color: white; border: 1px solid @brandColor; border-radius: 5px; color: @brandColor; } .authrorise-notification-count { position: inherit; right: 5px; top: -9px; } // Dropdown for authorization .dropdown-list li { padding: 15px; overflow: hidden; border-bottom: 1px solid #eee; } .dropdown-list li:last-child { border-bottom: 0; } .dropdown-list .thumb { width: 36px; float: left; } .dropdown-list .thumb img { width: 100%; display: block; vertical-align: middle; } .dropdown-list .desc { margin-left: 10px; display: block; } .dropdown-list .desc h5 { font-size: 13px; margin-top: 7px; } .dropdown-list li:last-child { padding: 7px 5px; } .dropdown-list li .badge { float: right; } .user-list { width: 300px; } .gen-list li a { display: block; } .gen-list li a:hover { color: #333 !important; text-decoration: none; } .gen-list li .name { font-size: 15px; line-height: 21px; display: block; } .gen-list li .msg { font-size: 12px; line-height: normal; color: #999; display: block; } .gen-list > li { display: inline-block; float: left; position: relative; } .headermenu { list-style: none; float: right; } .headermenu > li { display: inline-block; float: left; position: relative; } .headermenu .dropdown-menu { border: 0; margin-top: 8px; margin-right: -1px; -moz-border-radius: 2px 0 2px 2px; -webkit-border-radius: 2px 0 2px 2px; border-radius: 2px 0 2px 2px; -moz-box-shadow: 3px 3px 0 rgba(12,12,12,0.05); -webkit-box-shadow: 3px 3px 0 rgba(12,12,12,0.05); box-shadow: 3px 3px 0 rgba(12,12,12,0.05); padding: 5px; } .headermenu .dropdown-menu:after { border-bottom: 6px solid @brandColor; border-left: 6px solid transparent; border-right: 6px solid transparent; content: ""; display: inline-block; right: 25px; position: absolute; top: -6px; } .headermenu .dropdown-menu li { display: block; margin: 0; float: none; background: none; padding: 10px 5px; } .headermenu .dropdown-menu-usermenu li { padding: 0; } .headermenu .dropdown-menu li a { color: #bbbec6; font-size: 13px; padding: 7px 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .headermenu .dropdown-menu li a:hover { background: @orangeColor; color: @whiteColor; } .headermenu .dropdown-menu li i { font-size: 11px; margin-right: 5px; } .headermenu .dropdown-menu-head { padding: 0; min-width: 300px; } .headermenu .tp-icon { padding: 12px 15px; height: 50px; font-size: 16px; background: @whiteColor; color: #333; border-color: @whiteColor; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .headermenu .tp-icon + .dropdown-menu:after { right: 17px; } .headermenu .chat-icon { border-right: 0; } .headermenu .dropdown-menu-usermenu { background: @blackColor; min-width: 200px; } .headermenu .dropdown-menu-head ul { border: 1px solid #ddd; border-top: 0; padding: 0 10px; } .headermenu .dropdown-menu-head li a { color: #333; padding: 0; opacity: 1; } .headermenu .dropdown-menu-head li a:hover { background: none; color: #428BCA; text-decoration: none; } /*.headermenu .btn-group { margin-bottom: 0; }*/ .dropdown-menu-head { background: @whiteColor; } .dropdown-menu-head .title { background: @brandColor; color: #fff; padding: 15px; text-transform: uppercase; font-size: 15px; margin: 0; } .authrorise-multipayment-wrapper:focus { background-color: @brandColor; } .authrorise-multipayment-wrapper:focus .authrorise-multipayment { fill: @whiteColor; } .legend .usedamountlegend { background-color: #5cb85c; } .legend .remainingamountlegend { background-color: @brandColor; } .legend span { float: left; width: 15px; height: 15px; margin: 4px; } ul.legend { padding-top: 0px !important; } /*==================================================*/ .switch { position: relative; display: inline-block; width: 35px; height: 20px; margin-left: 10px; margin-top: 5px; } .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 12px; width: 12px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; } input:checked + .slider { background-color: @brandColor; } input:focus + .slider { box-shadow: 0 0 1px #2196F3; } input:checked + .slider:before { -webkit-transform: translateX(17px); -ms-transform: translateX(17px); transform: translateX(17px); } /* Rounded sliders */ .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; } /* Media */ @media (min-width: 1670px){ header .primary-menu .menu{ top: 0; } .dashboard header .primary-menu .menu{ top: 0; } } @media (max-width: 1200px){ .financial-services { height: 750px; } .tab-inner .img-sec{ padding-left: 15px; } .tab-content .btn-primary.find-address{ margin-top: 0px; width: auto; } .tab-content .btn-primary.find-contact{ margin-top: 0px; width: auto; } .tab-list .tab-title span.tab-name{ font-size: 16px; } .card.search-by-dates .btn{ padding: 8px 2px 8px 2px; max-width: 80px; } /* Make payment page */ .payment-tabs #application-form-steps > li > a{ padding: 15px 20px 15px 20px; } .payment-tabs #application-form-steps > li > a::after{ right: 10px; } .make-payment-page .application-form .payment-tab-content strong{ margin-top: 0; } .make-payment-page .application-form .table-wrap th{ min-width: 166px; width: auto; } } @media (max-width: 1024px){ #banner{ height: 480px; } #full-width-image{ height: 480px; } h1{ font-size: 36px; } h2{ font-size: 30px; } h3{ font-size: 28px; } .financial-services{ background-attachment: scroll; background-position: center center !important; } } @media (max-width: 991px){ header .manage-account{ margin: 0 10px 0 0; } header .primary-menu{ margin-left: 10px; } .who-we-are-section{ padding: 40px 0; } .financial-services{ height: auto; } .financial-services{ padding: 40px 0; } .financial-services .fin-services .read-more{ opacity: 1; } .financial-services .fin-services .block{ height: auto !important; } .financial-services .fin-services .inner-content{ padding-bottom: 0; } .financial-services .fin-services .block:hover{ padding: 30px 15px; background: transparent; color: @whiteColor; border-radius: 0; box-shadow: none; } .tab-inner .inner-content{ margin-left: 20px; padding-top: 20px; } .testmonials{ padding: 40px 0; } #testimonial-slider .testimonial-title{ line-height: normal; } .tab-inner{ padding-top: 30px; } #testimonial-slider blockquote::before{ left: 0; } #testimonial-slider blockquote::after{ bottom: -20px; } .financial-services .fin-services{ margin: 0 -15px;text-align: center; } .financial-services .fin-services .block{ padding-left: 15px; padding-right: 15px; } .financial-services .fin-services .block:hover .inner-content h4{ color: @whiteColor; } .financial-services .fin-services .block:nth-of-type(2n+1){ clear: left; } footer .quicks, footer .address-sec{ padding-left: 15px; } footer .licenses .inner-content{ padding-right: 0; } .financial-services .fin-services .thumb{display: inline-block;} .left-image{ width: 100%; float: none; height: 300px; } .sign-up-form{ width: 100%; float: none; padding-top: 100px; padding-bottom: 60px; } .sign-up-form .close-btn{ top: 30px; right: 30px; } .sign-up-img{height:400px !important} /* About us page */ .page-content{ padding: 50px 0; } .team-section figure:nth-of-type(3n+1){ clear: none; } .team-section figure:nth-of-type(2n+1){ clear: left; } /* Application page */ #application-form-steps > li > a{ font-size: 16px; padding: 20px 20px 20px 0; } .tab-list .tab-title{ padding: 10px; } .tab-list .tab-title span.tab-icon{ width: 50px; display: block; margin: 0 auto 15px; } .tab-list .tab-title span.tab-name{ width: 100%; display: block; margin: 0; text-align: center; line-height: normal; } .card.search-by-dates .i-block{ width: 50%; margin-bottom: 15px; } .card.search-by-dates .i-block:last-child{ width: 50%; margin: 0 auto 15px; float: none; text-align: center; } .card.search-by-dates .i-block .btn{ max-width: 48%; } /* Make payment page */ .make-payment-page .application-form .payment-tab-content strong{ margin-bottom: 15px; } .make-payment-page .application-form .tab-content .tab-header .text-right{ text-align: left; } .make-payment-page .application-form .payment-tabs{ width: 25%; margin-bottom: 20px; } .make-payment-page .application-form .payment-tab-content{ width: 75%; } .deals-overview-page .same-height .card{ height: auto !important; } } @media (max-width: 768px){ body{ font-size: 16px; } h2{ font-size: 28px; } h3{ font-size: 24px; } h4{ font-size: 22px; } h5{ font-size: 18px; } h6{ font-size: 16px; } } @media (max-width: 767px){ .banner.fix-banner{ height: auto; } .banner.fix-banner .banner-content{ padding: 40px 0; } .who-we-are-section{ padding: 25px 0; } .financial-services .fin-services .block:hover{ padding: 30px 15px; border-radius: 0; } .financial-services{ padding: 30px 0; } .how-it-works{ padding: 30px 0; } .testmonials{ padding: 25px 0; } .blog-faq-sec .inner-content p{ height: auto !important; } .tab-inner .inner-content{ margin-left: 0; max-width: 100%; padding-top: 20px; text-align: center; } .tab-inner .thumb{ margin: 0 auto 50px; } .tab-inner .img-sec{ max-width: 400px; margin: 0 auto; display: block; } .blog-faq-sec .inner-content{ padding: 30px 0; } .services-block .block{ padding-bottom: 18px; padding-top: 15px; margin-bottom: 0; position: relative; } .services-block .block::after{ content: ""; width: 50%; margin: 0 auto; left: 0; right: 0; position: absolute; bottom: 0; height: 1px; background: rgba(33,32,33,0.1); } .services-block .block:last-child::after{ display: none; } #testimonial-slider .testimonial-title{ margin-bottom: 5px; } .banner.fix-banner{ position: relative; } .banner.fix-banner::after{ content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,0.6); } .banner .banner-content{ z-index: 9; position: relative; } .financial-services .fin-services .block{ text-align: center; padding-top: 20px; padding-bottom: 20px; } .financial-services .fin-services .block::after{ content: ""; position: absolute; top: 100%; width: 60%; height: 1px; left: 0; right: 0; margin: 0 auto; background: rgba(255,255,255,0.1); } .financial-services .fin-services .block:last-child::after{ display: none; } .financial-services .fin-services .block .thumb{ margin: 0 auto 8px; } .financial-services .fin-services .block:hover{ padding-top: 20px; padding-bottom: 20px; } #testimonial-slider blockquote::after{ bottom: -7px; right: 10px; } #testimonial-slider .item{ padding: 0 30px; } .deep-footer .pull-right{ float: none !important; } footer{ padding-top: 20px; } footer .deep-footer{ text-align: center; } footer .deep-footer .policy-links{ text-align: center; } h1{font-size: 32px;} .inner-page .banner.fix-banner h1{font-size: 30px;} .inner-page .banner .banner-content{ padding: 61px 0 0; } .open-account-section { padding: 38px 0 30px; } .open-account-section .services-block { padding-top: 10px; } h5 { font-size: 17px; } .cta-section{ padding: 25px 0; } .sign-up-img{height:200px !important} /* About us page */ .page-content{ padding: 25px 0; } .team-section .thumb-block{ margin-bottom: 10px; } .team-section figure{ margin-bottom: 30px; } .team-section{ padding: 20px 0; } .page-content p{ margin-bottom: 15px; } .page-content p strong{ font-size: 18px; line-height: 1; } .about-us-section{ padding: 25px 0; } .application-form{ padding: 25px 0; } .application-form .tab-content .tab-pane#fx-requiremnt .tab-inner-content{ padding-bottom: 20px; } .application-form .tab-pane .tab-inner-content, #document-identification .tab-inner-content{ padding: 15px; } .corporate-application-form.application-form #ancknowledge-signature .tab-inner-content{ padding: 15px; } .application-form .tab-content p{ font-size: 16px; } #application-form-steps > li > a{ padding: 15px 15px 15px 0; } .application-form .tab-content .tab-pane{ box-shadow: 0 2px 10px 1px rgba(29,29,29,0.15); } .tab-list .tab-title{ margin-bottom: 10px; } #account-detail-tab > li{ margin-right: 20px; } #account-detail-tab > li > a{ font-size: 16px; } .account-detail-tab-outer th, .account-detail-tab-outer td{ padding: 10px; font-size: 14px; } .deals-overview-page .card.order-details .details span{ width: 46%; } .deals-overview-page .card.order-details .details span.desc{ width: 52%; } /* Make payment page */ .make-payment-page .application-form .payment-tabs{ width: 100%; } .make-payment-page .application-form .payment-tab-content{ width: 100%; } .remaining-balance-block.info-block{ display: block; text-align: center; margin-top: 15px; } } @media (max-width: 640px){ header{ padding: 10px 0; } header .primary-menu .menu{ top: 55px; } header .primary-menu .menu li a{ font-size: 16px; padding: 5px 10px; } header .primary-menu .menu li.mobile-append:last-child a{ text-align: center; border-radius: 4px; margin-top: 10px; padding: 10px 5px; line-height: normal; } header .site-logo{ width: 120px; margin-top: 7px; } .res-div{ display: block; } .mobile-append .btn-primary{ background: @brandColor; border-radius: 0; text-align: left; } .mobile-append .btn-primary:hover{ background: @whiteColor; border-radius: 0; text-align: left; border-color: @brandColor; } .header-right .separator:nth-of-type(1){ display: none; } #how-it-works-tab li a>.count{ width: 40px; height: 40px; font-size: 18px; line-height: 28px; } #how-it-works-tab li a>.count i{ width: 30px; height: 30px; } #how-it-works-tab li a>.step-name{ font-size: 0; display: none; } #how-it-works-tab li.active a>.count{ font-size: 28px; } #how-it-works-tab li.active a>.count i{ height: 40px; width: 40px; line-height: 34px; } #testimonial-slider .testimonial-title{ font-size: 20px; } footer .licenses span{ margin-bottom: 15px; } footer .licenses, footer .address-sec, footer .quicks{ width: 100%; text-align: center; } .cta-section .bt-group .btn-primary{padding: 0 7px;margin:0 5px;font-size: 14px;line-height: 35px} .left-image{ height: 200px; } .sign-up-form{ padding-top: 60px; padding-bottom: 30px; } .sign-up-form .close-btn{ top: 10px; right: 10px; } .sign-up-form .inner-content form{ padding: 15px 0; } input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"]{ margin-bottom: 10px; } .sign-up-form .inner-content .submit-btn{ padding-top: 0; } .application-form .tab-content .btn-primary{ width: 100%; margin-top: 10px; } .application-form .tab-pane .tab-footer .bt-group a{ width: 100%; margin: 0; margin-bottom: 10px; } .inner-page .banner.fix-banner h1{ font-size: 26px; } .tab-inner-content .dk-select{ margin-bottom: 10px; } #account-detail-tab > li{ margin-right: 15px; } #account-detail-tab > li > a{ font-size: 12px; padding: 0 0 6px; } .application-form .tab-pane .tab-footer .bt-group > div{ width: 100%; } .application-form .tab-pane .add-buttons > div{ width: 100%; } .application-form .tab-pane .add-buttons > div a{ margin-bottom: 10px; } .make-payment-page .application-form .tab-content .tab-footer{ padding: 20px; } .dashboard header .primary-menu .menu{ top: 58px; } .dashboard header .site-logo{ width: 120px; } } @media (max-width: 480px){ .rating-score-sec .score-details{ font-size: 14px; } /*header .primary-menu .menu{ width: 250px; } body.menu-open{ right: 250px; } body.menu-open header.affix{ right: 250px; }*/ .cta-section .bt-group .btn-primary{display: block;margin:0px 0 20px} .open-account-section{text-align: center;padding: 72px 0 30px;} .tab-list .tab-title span.tab-name{ font-size: 14px; } .deals-overview-page .card.order-details .details span{ width: 100%; } .deals-overview-page .card.order-details .details span.desc{ width: 100%; } .card.search-by-dates .i-block{ width: 100%; margin-bottom: 10px; } .card.search-by-dates .i-block:last-child{ width: 100%; margin: 0 auto 10px; } .card.search-by-dates .i-block .btn{ max-width: 100%; margin: 0 0 10px; } } body{ color: @blackColor;} label { font-weight: 500; } .PhoneNumberTextContainer { position: relative; } .PhoneNumberTextContainer em { background: #e6e6e6; display: inline-block; position: absolute; left: 0; top: 0; bottom: 0; color: #adadad; font-size: 14px; line-height: 18px; padding: 17px; z-index: 1; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .btn-disable { color: #6F6F6F; background: #ccc; border-color: #ccc; } .btn-disable:hover, .btn-disable:focus { color: #6F6F6F; background: #ccc; border-color: #ccc; } .casco-country-span { display: inline !important; } /* Drop down datepicker */ .Date { width: 33%; min-width: 400px; padding-top: 15px; display: inline-block; box-sizing: border-box; /*text-align: center;*/ } .Date:first-of-type { position: relative; /*bottom: 35px;*/ top: -12px !important; } .Date h2 { font-family: "Roboto Condensed", helvetica, arial, sans-serif; font-size: 1.3em; margin: 15px 0; color: #4F5462; } .Date input { display: block; margin: 0 auto 20px auto; width: 150px; padding: 8px 10px; border: 1px solid #CCCCCC; border-radius: 3px; background: #F2F2F2; text-align: center; font-size: 1em; letter-spacing: 0.02em; font-family: "Roboto Condensed", helvetica, arial, sans-serif; } .Date select { padding: 10px; background: @whiteColor; border: 1px solid #CCCCCC; border-radius: 0.4em; margin: 0 3px; max-width: 122px !important; } .Date select.invalid { color: #E9403C; } select option:hover { color: #000 !important; box-shadow: inset 20px 20px #00f !important; } .Date input[type="submit"] { margin-top: 10px; } .Date input[type="submit"]:hover { cursor: pointer; background-color: #e5e5e5; } /* Code Blocks */ pre.code-wrapper { padding: 15px 30px; margin-top: 20px; background: #F4F6F4; color: #393D3F; text-align: left; border: 1px solid #DCDFDC; border-radius: 3px; } pre code { font-family: 'Source Code Pro', monospace, monospace; font-weight: 400; font-size: 14px; } /* Highlighted Code Blocks */ pre code span.highlight { color: #EF6F6C; } .application-form .tab-content #fx-requiremnt.tab-pane .tab-inner-content { padding: 24px 30px 8px; } /*Datatables css*/ .dataTables_length { float: left; } .dataTables_info { margin: -4px 44px 10px; } .dataTables_paginate { float: right; } .dataTables_paginate ul.pagination { padding-top: 0px; } .dataTables_length .chosen-container { width: 60% !important; } .paging_full_numbers li.paginate_button, .paging_full_numbers li.active { border: 1px solid #ddd; padding: 1px 4px; margin-right: 5px; cursor: pointer; color: #636E7B; line-height: 21px; float: left; position: relative; background: @whiteColor; display: inline-block; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .paging_full_numbers li.active { background-color: @brandColor; border-color: @brandColor; color: @whiteColor; } .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover { background-color: @brandColor; border-color: @brandColor; } .pagination > li > a, .pagination > li > span { border: none; color: #636E7B; } div.dataTables_processing { position: absolute; top: 50%; left: 50%; width: 250px; height: 50px; margin-left: -125px; margin-top: -15px; padding: 14px 0 2px 0; border: 0px; text-align: center; color: #999; font-size: 32px; background-color: @whiteColor; background: none; } /*legend color-profile datatable css*/ /* Media */ @media(max-width: 847px) { .Date:first-of-type { bottom: 0; } } @media (max-width: 640px) { .view-detail-block { width: 99.5% !important; } } .dk-select-options { max-height: 250px !important; } .chosen-container { width: 100% !important; border-radius: 4px !important; } .chosen-container-multi { margin-bottom: 20px !important; } .active-result { font-family: 'Encode Sans', sans-serif !important; color: #6d6b6f !important; font-weight: normal !important; } .search-choice { padding: 14px 30px 13px 21px !important; margin: 6px 0 0 6px !important; } .default { width: 100% !important; } em { font-style: normal !important; } .chosen-container-multi .chosen-choices li.search-field .default { color: #aeaeae !important; font-size: 15px !important; } .aLink, .aLink:hover { text-decoration: underline; cursor: pointer; color: @brandColor; } .fx-page p { text-align: justify; } .fx-page .thumb img { height: 100px; } .about-us-section { padding: 0px !important; } .about-us-section h5, .about-us-section ul { text-align: justify !important; } .rating-score-sec { padding: 21px; } #testimonial-slider blockquote::after { right: 0px; } /*Signup page*/ .btn-submit { height: 48px; font-size: 20px; } .btn-submit:hover, .btn-submit:focus { background: transparent !important; color: #000000 !important; outline: none; -webkit-box-shadow: none; box-shadow: none; border-color: inherit !important; } .input-validation-error { border-style: solid; border-width: 1px !important; } /*Validation Error Formatting*/ .field-validation-error { color: #EC3633; } .input-validation-error { border-color: #EC3633 !important; border-width: 2px; } input.input-validation-error[type="radio"] { outline: 1px solid #ff0000; } .custom-select.input-validation-error { border: 1px solid #EC3633 !important; border-radius: 4px; } .chosen-container.input-validation-error { border: 1px solid #EC3633 !important; } .custom-control.input-validation-error { border: 1px solid #EC3633 !important; } .dropkick.input-validation-error { border: 1px solid #EC3633 !important; border-radius: 4px; } /* Better red border around controls with errors*/ .has-error .form-control { border-color: #EC3633; border-width: 2px; /*outline: solid 2px #EC3633;*/ } .has-error .form-control[type="checkbox"] { border-color: #EC3633; border-width: 2px; outline: solid 2px #EC3633 !important; } .form-control-noborder { box-shadow: none; border-width: 2px; border-color: @whiteColor; } .form-control-nopadding { box-shadow: none; border-width: 2px; border-color: @whiteColor; padding: 0; } input.has-error[type="checkbox"] { border-color: #EC3633; border-width: 2px; outline: solid 2px #EC3633; } input.has-error[type="radio"] { border-color: #EC3633; border-width: 2px; outline: solid 2px #EC3633; } #beneficiary-form .custom-select, #beneficiary-form .input-group { margin-bottom: 20px; } #beneficiary-form [type="radio"] { z-index: 1; margin: 5px; -webkit-appearance: radio; height: 18px; width: 18px; cursor: pointer; } #beneficiary-form #btnSubmit { margin-right: 55px; margin-left: 20px; margin-bottom: 10px; } #AddressPopup table tr td { cursor: pointer !important; } /* preloader */ #preloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #e4e7ea; z-index: 10000; } .upDownArrow { width: 12px; height: 10px; display: none; margin-top: 0px; } #status { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; font-size: 32px; } #message { font-size: small; position: fixed; max-width: 10% !important; text-align: center; left: 45%; right: 45%; } /* preloader */ #partialPreloader { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #e4e7ea; z-index: 10000; } #partialStatus { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; font-size: 32px; } #partialMessage { font-size: small; position: fixed; max-width: 20% !important; text-align: center; left: 40%; right: 40%; } .alert-message { padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px; text-shadow: 0 1px 0 rgba(255,255,255,0.2); -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), 0 1px 2px rgba(0,0,0,0.05); box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), 0 1px 2px rgba(0,0,0,0.05); } .alert-message-success { background-color: #dff0d8; border-color: #d6e9c6; color: #3c763d; background-image: -webkit-linear-gradient(top, #dff0d8 0, #c8e5bc 100%); background-image: -o-linear-gradient(top, #dff0d8 0, #c8e5bc 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #dff0d8), to(#c8e5bc)); background-image: linear-gradient(to bottom, #dff0d8 0, #c8e5bc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0); border-color: #b2dba1; } .alert-message-danger { background-color: #f2dede; border-color: #ebccd1; color: #a94442; background-image: -webkit-linear-gradient(top, #f2dede 0, #e7c3c3 100%); background-image: -o-linear-gradient(top, #f2dede 0, #e7c3c3 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f2dede), to(#e7c3c3)); background-image: linear-gradient(to bottom, #f2dede 0, #e7c3c3 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@whiteColor2dede', endColorstr='#ffe7c3c3', GradientType=0); border-color: #dca7a7; } table#tblInvalidPayment tr td { color: red; } #select-payment .btn-link { color: @brandColor; } #beneficiary-form .radio-inline { margin-bottom: 10px !important; margin-left: 28px !important; } .make-payment-page .application-form .payment-tab-content strong { letter-spacing: 1px !important; } /* steps */ .steps-content .card.send-money-card ul li span { width: 100%; } .steps-content .card.send-money-card ul li .select-wrap { width: 75%; } .steps-content .card { box-shadow: none; } .steps-content .card .card-content, .steps-content .card .card-footer { padding: 0px 0px; } .steps-content .card .card-content { max-width: 600px; } .steps-content .card .btn-primary { width: auto; } .steps-content .card.send-money-card ul li .normal-input { background-color: @whiteColor; border-color: #9f9f9f; border-width: 0 0 1px 0; border-radius: 0px; } .account-number em { color: #0499ff; padding-left: 5px; } .step-outer { position: relative; } .step-outer:before { content: ""; position: absolute; left: 35px; top: -29px; bottom: 0; background: #d9d9d9; width: 1px; } .step-outer .steps:last-child { margin-bottom: 0; } .steps { position: relative; margin-bottom: 20px; } .steps.active .step-number-outer { width: 20%; } .step-number-outer { display: inline-block; vertical-align: top; width: 100%; padding-left: 10px; z-index: 1; position: relative; } .steps.active .step-number-outer { padding-left: 0; } .step-number a { display: inline-block; } .step-number i { font-size: 24px; line-height: 28px; color: #202122; display: inline-block; vertical-align: middle; margin-left: 5px; display: none; } .step-number { pointer-events: none; display: inline-block; } .steps.complete .step-number { width: 25%; } .steps .step-number img.complete-img { display: none !important; left: 12px; position: absolute; top: 15px; } .steps.complete .step-number img.complete-img { display: block !important; width: auto; } .steps.complete .step-number b { color: #000; } .complete .step-number em:before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; border-radius: 100%; background: rgba(35,215,90,0.9); } .steps.active .step-number em, .complete .step-number em { -webkit-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1); box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1); } .complete .step-number span { color: #23d75a; } .complete .complete-img { display: block; } .steps.active .step-number em { background: @brandColor; height: 70px; width: 70px; padding: 14px 19px; } .steps.active i { display: inline-block; } .steps.active span { display: none; } .steps-content h4 { text-transform: uppercase; } .steps.active .step-number b { display: none; } .steps.active .step-number img { display: inline-block; position: absolute; left: 50%; top: 50%; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: auto; } .step-number img { display: none; } .step-number b { display: inline-block; color: #d9d9d9; font-size: 24px; line-height: 28px; font-weight: normal; } .step-number em { background: @whiteColor; height: 50px; width: 50px; display: inline-block; border-radius: 100%; vertical-align: middle; padding: 10px 17px; border: 1px solid #d9d9d9; position: relative; } .step-number span { display: inline-block; vertical-align: middle; font-size: 16px; line-height: 20px; color: #929396; margin-left: 18px; } .complete.steps .step-number span { width: 65%; } .wizard-steps { padding: 29px 0; } /*.left-grid{float:left;width:74.5%;} .right-grid{float:left;width:25.5%;}*/ .steps-content { padding-left: 34px; width: 75%; display: none; float: right; } .steps.active .steps-content { display: inline-block; } .steps .form-inline { margin: 10px 0 159px; } .steps .rate-block { padding-top: 20px; text-align: left; } .steps .rate-block ul { padding: 0px 6px 2px; border: 1px solid @brandColor; background: @whiteColor; position: relative; margin-bottom: 24px; display: table; width: 100%; margin-left: 0; border-top-left-radius: 5px; border-bottom-left-radius: 5px; /*background:#eff9ff;position:relative;padding:25px 6px 6px;margin-bottom:30px;*/ } .steps .rate-block ul:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; background: @brandColor; width: 4px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .steps .rate-block ul li:after, .steps .rate-block ul li:before { display: none; } .steps .rate-block ul:after { display: none; } .steps .rate-block ul li { padding: 0 0 0px 15px; ; } .steps .rate-block ul li p { font-size: 14px; line-height: 18px; color: #202122; } .steps .rate-block ul li p em { width: 25%; display: inline-block; font-style: normal; } .steps .rate-block ul li p i { float: right; } .steps .rate-block ul li p span { display: inline-block; padding-left: 12px; float: none; } .edit-details-block { display: none; vertical-align: middle; width: 74%; text-align: right; padding-left: 10px; float:right; } .edit-details-inner-block { position: relative; display: table; padding: 0px 20px; -webkit-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1); box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1); border-radius: 5px; width: 100%; text-align: left; min-height: 95px; } .view-detail-block { width: 92.5%; } .complete .edit-details-block { display: inline-block; } .edit-details-inner-block:before { content: ""; position: absolute; left: 0; bottom: 0; top: 0; width: 4px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background: @brandColor; } .edit-details-block .left-block { width: 80%; display: table-cell; margin-bottom: 0; vertical-align: middle; height: 95px; list-style: none; padding-left: 0; } .edit-details-block .left-block li { margin-bottom: 6px; } .edit-details-block .left-block li:last-child { margin-bottom: 0px; letter-spacing: -0.4px; } .edit-details-block .right-block { width: 20%; display: table-cell; text-align: right; height: 95px; vertical-align: middle; } .edit-details-block .right-block .primary-btn { padding: 4px 15px; } .edit-details-block ul li p { font-size: 16px; line-height: 18px; color: #929396; margin-bottom: 0px; } .edit-details-block .detail-edit-content li p { text-transform: capitalize; } .edit-details-block .detail-edit-content li p i.email { text-transform: lowercase; } .edit-details-block .edit-details-inner-block p span { display: inline-block; max-width: 200px; width: 50%; } .edit-detail-btn { height: 36px; } .edit-details-block ul li p em { margin-left: 6px; display: inline-block; } .edit-details-block ul li p i { color: #202122; letter-spacing: 0.1px; font-weight: 700; font-style: normal; } .edit-details-block .flag-block img, .edit-details-block .flag-block i { display: inline-block; vertical-align: middle; font-style: normal; margin-right: 6px; } .card-footer .terms-link { color: @brandColor; font-weight: 500; } .add-new-benificiary, .beneficiary-back-btn { display: none; } .add-later-block { background: @whiteColor; position: relative; padding: 13px 15px 13px 19px; border-radius: 5px; margin-bottom: 21px; margin-top: 21px; border: 1px solid @brandColor; } /*.add-later-block .beneficiary-list { border-bottom: 1px solid #cecece; padding-bottom: 5px; margin-bottom: 5px; }*/ .add-later-block::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; background: @brandColor; border-top-left-radius: 5px; border-bottom-left-radius: 5px; width: 4px; } .add-later-block p, .add-later-block .later-link { display: inline-block; vertical-align: middle; } .add-later-block p { width: 75%; font-size: 16px; line-height: 20px; color: #202122; margin-bottom: 0px; } .add-later-block .later-link { text-align: right; } .add-later-block .later-link a { color: @brandColor; font-weight: 500; } .add-later-block .later-link { width: 24%; } .add-later-block ul { list-style: none; } .text-right { text-align: right; } .pad-l-8 { padding-left: 22px !important; } /*span for forexcalculator*/ .card.send-money-card ul li span { padding-left: 0px; padding-top: 0px; } span.forex-view { width: 100%; padding-left: 0px; } span.forex-lbl { width: auto !important; padding-left: 0px !important; padding-top: 0px !important; } span.forex-rate { font-weight: bold; } div.beneficiary-name { min-width: 30%; float: left; } div.left-text { text-align: left !important; } p.bold-text { font-weight: bold; } p.red-text { color: #E40046 !important; } p.green-text { color: #23d75a !important; } em.tooltip-box { line-height: 21px !important; } span.input-group-addon { display: table-cell !important; } ul.trade-summary { height: 150px !important; } ul.trade-summary-large { height: 190px !important; } .edit-details-beneficiary { padding-top: 12px; padding-bottom: 12px; } .dd-select .dd-pointer.dd-pointer-down { width: 9px !important; } .dd-select span.dd-pointer-up { border-bottom: none !important; } #spot-trade-forex .tooltip-box .tooltip-description { right: 0px !important; left: -10px !important; } #spot-trade-forex .tooltip-description::before { right: 0px !important; left: 15px !important; } #spot-trade-summary .add-later-block p { width: 100% !important; } /*#divMessage{ padding: 10px 15px; }*/ .bestdealpayment { text-align: right; } .selectallpayment { margin-left: 22px !important; } #columnmapping-form .custom-select { margin-bottom: 20px; } /*date picker style start*/ .bootstrap-datetimepicker-widget .list-unstyled { padding-top: 0px !important; } .bootstrap-datetimepicker-widget .list-unstyled li { margin-bottom: 0px !important; } .datepicker span { padding-left: 0px !important; padding-top: 0px !important; float: none !important; width: auto !important; vertical-align: middle !important; } .bootstrap-datetimepicker-widget table td span { width: 54px !important; display: inline-block !important; } /*date picker style end*/ .payment-summary .left-block { padding-left: 0; } .payment-summary .add-later-block p { width: 100%; color: #929396; } .payment-summary .left-block span { display: inline-block !important; max-width: 200px; width: 50%; } .payment-summary .left-block em { color: #202122; font-weight: 700; } .payment-summary strong { color: #202122; font-weight: 700; } .confirm-dialog { text-align: center; } .confirm-dialog .modal-content { padding: 25px 15px; } .modal .modal-footer .btn { display: inline-block; padding: 5px 10px; font-size: 15px; height: initial; line-height: 19px; vertical-align: top; border-radius: 5px; min-width: 100px; } .title { margin-top: 10px; } .make-payment-page .application-form .table-wrap td .i-block { width: 30% !important; } .mb15 { margin-bottom: 15px; } .btn-success { background-color: @brandColor; border-color: @brandColor; } .btn-success:hover { border-color: @brandColor; color: @brandColor; } .btn-default { background: #e4e7ea; color: #636e7b; border-color: #e4e7ea; } .btn-default:hover { border-color: #e4e7ea; } h3.popover-title { text-transform: none; } .remove-row { cursor: pointer; } .application-form .tab-pane .tab-footer .bt-group { cursor: not-allowed; } /*Beneficiary Management*/ td p img { height: 28px; width: 28px; margin-top: -4px; } td p:first-child { float: left; margin: 0px; margin-right: 10px; } td p:nth-child(2) { text-align: left; margin: 0px; } td p em { height: 40px; width: 40px; text-align: center; vertical-align: middle; border-radius: 50%; background: #e6e3e3; border: 12px solid #e6e3e3; } .modal-body .message .alert { padding: 8px; } .cursor-pointer { cursor: pointer; } /*checkbox design*/ input[type="checkbox"] + label::before { content: ""; width: 23px; height: 23px; border-radius: 4px; display: block; position: absolute; background: @whiteColor; left: 0; top: 0; border: 1px solid @brandColor; } input[type="checkbox"] + label::after { content: ""; width: 23px; height: 23px; border-radius: 4px; display: block; position: absolute; background: url(../../images/check-icon-tab.png); background-position: center center; background-repeat: no-repeat; background-size: auto; left: 0; top: 0; -webkit-transform: scale(0); transform: scale(0); } label { font-weight: normal; } .login-page-redirect { text-align: right !important; } /*.trade-beneficiary-model { width:600px; }*/ input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], select, textarea { color: @blackColor; } .dk-select .dk-selected[aria-activedescendant^="dk"] { color: @blackColor; } .dk-select .dk-selected[aria-activedescendant$="-"], .dk-select .dk-selected[aria-activedescendant$="-0"] { color: #6d6b6f; } .application-form .tab-content p { font-size: 17px; } .orange-link { color: @brandColor; } .text-red { color: red !important; } .highlightDates { background-color: #ffeed6; } .page-msg { margin-bottom: 20px; padding: 15px 30px; text-align: center; padding-bottom: 0px; } .page-msg .success-msg { color: #23d75a; text-transform: inherit; } @keyframes highlight { 0% { color: @brandColor; } 100% { color: @brandColor; } } .highlight { animation: highlight 3s; } @keyframes red-highlight { 0% { color: @whiteColor; background-color: red; } 80% { color: @whiteColor; background-color: red; } } .red-highlight { animation: red-highlight 5s; } @keyframes green-highlight { 0% { color: @whiteColor; background-color: #4fa951; } 80% { color: @whiteColor; background-color: #4fa951; } } .green-highlight { animation: green-highlight 5s; } #multiple-payment-summary input[type="checkbox"]:checked + label, #multiple-payment-summary input[type="checkbox"]:not(:checked) + label { width: 200px; padding-left: 35px; } .make-payment-page .back-to { text-align: right; } .make-payment-page .back-to .btn-primary { min-width: 100px; margin-top: -5px; padding: 9px 10px 8px; line-height: normal; } #your-incoming-fund span.balance-due { font-size: medium; margin-top: 15px; } #your-payments span.balance-due { font-size: medium; margin-top: 15px; } .make-payment-page .card.order-details .details span.ttl { color: #9f9f9f; } .make-payment-page .card.order-details .details span { display: inline-block; vertical-align: middle; width: 43%; font-size: 16px; line-height: normal; } .make-payment-page .card.order-details .details span.desc { width: 55%; padding-left: 2px; color: @blackColor; } .make-payment-page .card.order-details .details span { display: inline-block; vertical-align: middle; width: 43%; font-size: 16px; line-height: normal; } .make-payment-page .card.order-details .details li { margin-bottom: 11px; } .make-payment-page .card h6 { font-family: 'Roboto Slab', serif; font-size: 18px; line-height: normal; font-weight: 400; margin-bottom: 10px; } .card.user-payment-details ul li a { font-weight: 400 !important; } #tblBookPayment input[type="checkbox"]:checked + label, #tblBookPayment input[type="checkbox"]:not(:checked) + label { margin-left: 34px; } .iban-loading, .ifsc-loading { background: url(../../images/loader1.gif) no-repeat @whiteColor right center !important; background-position-x: 97.00% !important; } .iban-correct, .ifsc-correct { background: url(../../images/check-icon-tab.png) no-repeat @whiteColor right center !important; background-position-x: 97.00% !important; } .main-content { overflow: visible; } .popover { color: #6d6b6f; } .tooltip-box .icon { width: 16px; height: 16px; line-height: 15px; font-size: 10px; } .mar-top-14 { margin-top: 14px; } .mar-top-7 { margin-top: 7px; } .mar-top-4 { margin-top: 4px; } .pad-top-20 { padding-top: 20px !important; } .orange-text { color: @brandColor !important; font-weight: bold !important; } .action-link { display: flex; } .action-link .fa-trash-o { margin-left: 10px; } .add-later-block .action-link { width: 100%; } .grey-background { background: #e8e8e8; } .darkgrey-background { background: #ccc; } .action-icon { font-size: 21px; } /*Enity tabs input beneficiary*/ #choose-entity li { width: 50%; text-align: center; border: 1px solid #CCCCCC; } #choose-entity > li.active > a, #choose-entity > li.active > a:focus, #choose-entity > li.active:hover, #choose-entity > li.active { background-color: @brandColor !important; border-color: @brandColor !important; color: @whiteColor; } #choose-entity > li:hover { border-color: #eee #eee #ddd !important; background-color: #eee !important; } /*Private registration document upload step*/ #ActivateAccount { margin-bottom: 0px !important; } #ActivateAccount.disabled { cursor: auto !important; } .remove-btn { display: none; } .btn-document { margin-bottom: 0px !important; float: right; } .add-file { margin-top: 5px; } .add-file-div { /*margin-top: 7px;*/ padding: 0px; } .add-later-msg-div { display: none; } .add-later { margin-top: 4px !important; } .add-later-div { text-align: right; margin-top: 8px; } .lblAddLater { font-size: 16px; color: @brandColor; font-weight: 500; margin-top: 1px; margin-bottom: 0px; } small-box { width: 120px; } .select2-container { width: 100% !important; right: 0 !important; } .select2 span.selection { width: 100%; } .select2-container--default .select2-selection--single { width: 100%; border-radius: 5px; height: 50px; border: 1px solid #d8d8d8; } .select2-container--default .select2-selection--single .select2-selection__rendered { font-size: 14px; color: #202122; font-weight: 400; line-height: 39px; padding: 4px 24px 0 12px; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 50px; top: 0; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border: none; background: url(../../images/bg-down-arrow.png)no-repeat; width: 6px; height: 6px; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -moz-transform: rotate(-180deg); border: none; margin-top: -4px; } .small-box .select2-dropdown { border: 1px solid #f4f4f4 !important; width: 314px !important; } .select2-container--default .select2-search--dropdown .select2-search__field { font-size: 14px; color: #202122; font-weight: 400; text-transform: capitalize; border-radius: 5px; border-color: #e6e6e6; width: 100% !important; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #f4f4f4; } .select2-container--default .select2-results > .select2-results__options { max-height: 150px; } .select2-dropdown .icon-flag { width: 16px; } .select2-dropdown span.flag-text { display: inline-block; right: 0 !important; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #f4f4f4; color: #202122; } .select2-results__option { padding: 8px; } .large-box .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 59px; font-size: 24px; text-transform: capitalize; } .large-box .select2-container, .large-box .select2-container--default .select2-selection--single { height: 59px; } .large-box .select2-container--default .select2-selection--single .select2-selection__arrow { height: 59px; } .large-box .icon-flag { margin-top: -5px; margin-right: 10px; } .large-box-outer label.inner-text { padding: 21px 0 21px 25px; margin-bottom: 0; } .large-box { width: calc(100% - 50px); display: inline-block; vertical-align: middle; float: right; } .dd-selected-image { width: 30px !important; margin-right: 5px !important; float: none !important; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: 1px solid #d8d8d8; } .select2-container--default .select2-selection--multiple { border-radius: 5px; } .select2-container .select2-selection--multiple { min-height: 50px; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { padding: 4px 24px 0 12px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { margin-right: 5px; } div.account-image { max-height: 98px; overflow: hidden; } div.account-image img{ width: 115px; } .padding-left-zero { padding-left: 0px; padding-top: 15px; } .padding-top-four { padding-top: 4px !important; } .margin-top-zero { margin-top: 0px; } .padding-top-zero { padding-top: 0px !important; } .padding-bottom-zero { padding-bottom: 0px !important; } .margin-bottom-20 { margin-bottom: 20px; } .triangle-div.active:after { content: ''; position: absolute; top: 100%; left: 50%; margin-left: -18px; width: 0; height: 0; border-top: solid 10px @brandColor; border-left: solid 15px transparent; border-right: solid 15px transparent; background-color: @whiteColor; } /*Corporate registration shareholder*/ .share-holder-table { width: 100%; border: 1px solid #d8d8d8; margin-bottom: 20px; } .share-holder-table tr > td { padding: 13px 15px 12px; border: 1px solid #d8d8d8; border-radius: 6px; } .action-select { text-align: left; } html input[disabled] { background-color: #eee; cursor: not-allowed; } .beneficiary-list strong { color: #6d6b6f; } .dk-select .dk-select-options { right: auto; left: 0; border-color: #b6b6b6; border-top: 1px solid #b6b6b6; width: auto; min-width: 100%; } #tblPayment .displaymode strong { overflow: hidden; text-overflow: ellipsis; } .mar-top-15 { margin-top: 15px; } .address-not-found { margin-top: 7px; margin-bottom: 8px; } .address-not-found a { color: @brandColor; text-decoration: underline; } .find-address-close { height: 0px; } .confirm-popover { padding: 0px; border-top: unset; } .div-counter { float: left; padding-left: 5px; padding-top: 3px; font-size: xx-large; } .add-mobile-number { display: flex; margin-bottom: 20px; } .add-mobile-number em { background: #e6e6e6; display: inline-block; color: #adadad; font-size: 14px; line-height: 18px; padding: 16.2px; z-index: 1; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .add-mobile-number input { border-top-left-radius: 0px; border-bottom-left-radius: 0px; margin-bottom: 0px; } .padding-top-40 { padding-top: 40px; padding-left: 0px; } .padding-top-40 a { color: @brandColor; } .padding-top-27 { padding-top: 27px !important; } .two-factor-verify { padding-left: 20px; } .two-factor-verify img { height: 20px; width: 20px; margin-bottom: 5px; } .goldenColor { color: @brandColor !important; } .advance-search-link { color: @brandColor !important; } .remaining-bar-color { color: @brandColor !important; } #tradeBeneficiariesTable td .i-block .fa { font-size: 18pt; color: @buttonColor; } h6.login-page-text when not(@brandCode = Equals) { font-weight: 500; text-align: center; } /*Change highlight color in page number dropdown*/ .chosen-container .chosen-results li.highlighted { background-color: lighten(@brandColor, 30%) !important; color: @whiteColor; } header .header-left when (@brandCode = Equals) { margin-top: 7px; } .overflow-x-auto { overflow-x: auto; } .beneficiary-modal { max-height: 85vh; overflow-y: auto; } /*for video background*/ .video-container { position: relative; overflow: hidden; } .video-element { position: absolute; top: 50%; left: 50%; width: auto; min-width: 100%; height: auto; min-height: 100%; transform: translateX(-50%) translateY(-50%); z-index: -1; } /*for video background*/ /*Colors Override*/ .bootstrap-datetimepicker-widget table td.today:before { border-bottom-color: @orangeColor !important; } .bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active:hover { background-color: @orangeColor !important; color: @whiteColor !important; } .bootstrap-datetimepicker-widget table td span.active { background-color: @orangeColor !important; color: @whiteColor !important; } .chosen-container .chosen-results li.highlighted { background-color: @orangeColor !important; color: @whiteColor !important; } .filled-strength-bar-3 { background-color: @orangeColor !important; } #strength-descriptor { color: @blackColor !important; } .orange-color { color: @orangeColor !important; } .orange-bg-color { background-color: @orangeColor !important; } .white-bg-color { background: @whiteColor !important; } .bootstrap-datetimepicker-widget table td.active.today:before { border-bottom-color: @whiteColor !important; } /*Colors Override*/ /*override choosen select functionality*/ .chosen-container-multi .chosen-choices li.search-field { width: 100% !important; } .chosen-container-multi .chosen-choices li.search-field input[type="text"] { width: 100% !important; } /*override choosen select functionality*/ @media (max-width:1199px ) { /* steps */ .steps-left-grid{width:100%;float:none;} .steps-right-grid{display:none;} .steps .form-inline{margin:10px 0 40px;} .steps .rate-block{padding-top:10px;} .next-step-btn.btn-yellow{font-size:18px;line-height:22px;padding:10px 60px 10px 23px;} .steps .rate-block ul{margin-bottom:20px;} .complete .step-number{width:30%;} .edit-details-block{width:69%;} .steps-content{padding-left:16px;} .step-number span{margin-left:12px;} .step-number i{margin-left:10px;} .steps-inner-title{font-size:14px;margin-bottom:10px;line-height:18px;} .steps-inner-title .radio_btn{top:-2px;} } @media (max-width: 767px) { /*Steps*/ .step-number{display:none;} .edit-details-block .left-block{ padding-left: 0; } .step-outer{ padding: 0 15px; } .step-outer:before{display:none;} .wizard-steps .step-outer .steps-content{width:100%;padding-left:0;display:none;padding:20px 0 0px !important;} .wizard-steps{padding:20px 0 0;} .steps .rate-block{padding:0 0px;} /*.edit-details-block{width:100%;display:block;padding-left:0;}*/ .edit-details-block{width:100%;padding-left:0;} .steps.active .step-number-outer{width:100%;} .steps.active .steps-content{display:block;} .step-number-outer{padding-left:0;} .steps .form-inline{margin:10px 0;} .steps .rate-block ul li p em{width:35%;} .steps .rate-block ul li p span{padding-left:16px;} .step-outer .steps:last-child{margin-bottom:0;} .steps.active .edit-details-block .edit-detail-btn{opacity:0;pointer-events:none;} .edit-details-inner-block{padding:0px 15px;} .next-step-btn.btn-yellow{font-size:16px;line-height:20px;padding:10px 50px 10px 16px;} .next-step-btn.btn-yellow img{right:17px;} .bottom-line-form{padding-bottom:5px;} .primary-btn{font-size:14px;line-height:18px;padding:8px 14px;} .choose-outer-selection .choose-inner-selection{margin-bottom:20px;} .choose-outer-selection .choose-inner-selection:last-child{margin-bottom:0px;} .add-recepient-block .btn{padding:12px 20px;} .add-later-block p{font-size:14px;line-height:18px;} .add-later-block a{font-size:14px;line-height:18px;} .add-later-block{padding:15px 15px 15px 19px;margin-bottom:15px;} .add-new-benificiary{margin-bottom:10px;} .btn-grey{font-size:16px;line-height:20px;padding:10px 16px 10px 48px;} .back-step-btn img{left:17px;} .steps:last-child.active .steps-content:before{display:none;} #ColumnMappingModal .modal-dialog, #ColumnMappingModal .modal-content{ width: 100%; } #ColumnMappingModal .modal-dialog { padding: 0px 10px; margin: auto; } #upload-file-control-group .col-sm-8{ display: inline-block; vertical-align: top; width: 67%; padding-right: 0px; } #upload-file-control-group .col-sm-4{ display: inline-block; vertical-align: top; padding-left: 0px; } } @media (max-width: 656px){ #upload-file-control-group .col-sm-8{ display: block; vertical-align: top; padding-right: 15px; } #upload-file-control-group .col-sm-4{ display: block; vertical-align: top; padding-left: 15px; } .application-form .tab-content .btn-primary{ width: 100%; margin-top: 10px; } } @media (max-width:413px) { .edit-details-block ul li p{font-size:12px;line-height:16px;} .wizard-steps .step-outer .steps-content{padding:20px 0px 0px;} .payment-summary .left-block span{ width: auto; } .payment-summary .left-block li{ line-height: 16px; } .steps .rate-block ul{width:98%;} .steps .rate-block ul li p em{width:50%;} .steps .rate-block ul li p i{float:none;} .steps .rate-block ul li p span{padding-left:8px;padding-right:0;} .steps .rate-block ul li p span.fee{width:45%;} .steps .rate-block ul li:last-child{padding-bottom:0;} .steps .rate-block ul{padding:15px 6px;} .edit-details-block .right-block,.edit-details-block .left-block{height:75px;} .edit-details-inner-block{min-height:75px;} .edit-details-block .detail-edit-content li p,.edit-details-block ul li p,.edit-details-block .edit-details-inner-block li p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .edit-details-block .edit-details-inner-block p span{width:auto; max-width:auto;} .edit-details-block .left-block{padding-left:0px;} .add-later-block p{width:100%;} .next-step-btn.btn-yellow{padding:8px 50px 8px 16px;} .btn-grey{padding:8px 16px 8px 48px;} .dd-container, .card.send-money-card ul li .dk-select{ max-width:125px;} } @media (min-width:1024px) { .fund-on-account-content, .calculator-content{ height:164px !important; } .card-footer{ padding-top:10px !important; } #BeneficiaryVerifyModal .modal-dialog{ width:26% !important; } } @media (min-width: 992px) { .card.send-money-card ul li span{ padding-top: 11px !important; } #ForexCal-form ul li:first-child{ margin-bottom: 0px; } #BeneficiaryVerifyModal .modal-dialog{ width:35%; } } @media (min-width: 768px) { .modal-dialog { width:800px; margin: 30px auto; } #BeneficiaryVerifyModal .modal-dialog{ width:56%; } #ColumnMappingModal .modal-dialog, #UploadFileModal .modal-dialog, #ColumnMappingModal .modal-content{ width: 768px; } #ColumnMappingModal .modal-body { padding: 15px 30px; } #ColumnMappingModal .form-horizontal .control-label { text-align: left !important; } }