/* 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 (@buttonColor = @footerColor) {
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 (@buttonColor = @footerColor) {
border-color: @whiteColor;
}
/* 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;
}
}