﻿/*Main colors*/
/*Fonts*/
/*standard*/
/*slider*/
/*General*/
/* ===============================================================================
    = Fonts
=============================================================================== */

/*Nunito*/
@font-face {
  font-family: 'Nunito';
  src: url("../../fonts/Nunito-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Nunito';
  src: url("../../fonts/Nunito-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'Nunito';
  src: url("../../fonts/Nunito-Light.ttf") format("truetype");
  font-weight: 600;
  font-style: normal; }

@font-face {
  font-family: 'Nunito';
  src: url("../../fonts/Nunito-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: 'Nunito';
  src: url("../../fonts/Nunito-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal; }

/* ==================================================
    =450px
===================================================== */
@media only screen and (max-width: 450px) {
  /* -------------------------------------------------------------------------- Login page */
  .login-footer {
    position: absolute;
    bottom: 15px;
    right: 10px;
    min-width: 310px; }
  .social li {
    margin-right: 25px; }
  /* -------------------------------------------------------------------------- Dashboards */
  #account-slider .account-box {
    width: 90vw; }
  .account-box.account-bg-1 {
    background: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none; }
  /*.accounts-widget {
        background: $btn2;
    }*/
  #account-slider .slide {
    background: #36b2c9;
    margin: 10px; }
  #account-slider .account-small-slider .slide {
    background: unset;
    margin: 0; }
  .account-list .col-1 {
    width: 100%; }
  .account-list .col-2 {
    width: 100%; }
    .account-list .col-2 .amount {
      font-size: 22px; }
  .widget-grid .widget {
    padding: 0; }
  .custom-table .tag-col {
    padding-left: 50px; }
  .custom-table .text-3 {
    font-size: 14px; }
    .custom-table .text-3 span {
      font-size: 14px; }
  .custom-table.table-2 .tag {
    top: 15px; }
  .widget-tabs li a {
    padding: 10px;
    min-width: 0; }
  .widget-transactions .table-btn.btn-retry {
    display: none; }
  .widget-advertising h2 {
    font-size: 32px;
    line-height: 30px; }
  #page-footer {
    position: relative;
    padding-bottom: 60px; }
    #page-footer .lang-nav {
      width: 100%;
      margin-bottom: 20px;
      text-align: center; }
      #page-footer .lang-nav li {
        display: inline-block;
        float: none;
        margin: 0 20px; }
    #page-footer .social {
      width: 100%;
      text-align: center; }
      #page-footer .social li {
        display: inline-block;
        float: none;
        margin: 0 20px; }
    #page-footer .copy {
      width: 100%;
      position: absolute;
      bottom: 0px;
      left: 0;
      text-align: center; }
  /* ================================================== Payment between accounts */
  .account-row .account-box .account-main {
    padding-left: 0; }
  .account-row .account-box .select-2 {
    width: 66px;
    margin-left: 10px; }
    .account-row .account-box .select-2 div.fancy-select div.trigger {
      font-size: 12px;
      padding: 6px 22px 4px 8px; }
      .account-row .account-box .select-2 div.fancy-select div.trigger:after {
        top: 15px; }
  /* ================================================== Prelogin ATM Branch */
  .map-list li {
    padding: 10px 0; }
  .map-list .item-main {
    padding: 0px 30px 0px 36px; }
    .map-list .item-main i {
      width: 30px;
      height: 30px;
      background-size: 17px;
      margin-top: 0px;
      top: 0; }
  .map-list .name {
    font-size: 14px; }
  .map-list .cat-name {
    font-size: 12px; }
  .map-list .item-info li {
    padding: 5px 0px 5px 36px; }
  .map-list .item-info i {
    width: 30px;
    height: 15px;
    margin-top: 0;
    top: 4px;
    left: 3px;
    background-size: 14px; }
  .map-list .info-txt-1 {
    font-size: 12px; }
  .map-list .info-txt-2 {
    font-size: 14px;
    line-height: 18px; }
  /* ================================================== Prelogin FAQ */
  .accordian-title {
    padding-left: 60px;
    font-size: 13px; }
    .accordian-title .faq-help-icon {
      position: static;
      display: block;
      margin-bottom: 10px; }
    .accordian-title:after {
      top: 10px; }
  .accordian-wrapper .hidden {
    padding-left: 10px; }
  .accordian-wrapper .distance {
    float: none;
    margin-top: 5px; }
  .contact-data-wrapper .data p {
    font-size: 13px; }
    .contact-data-wrapper .data p span {
      font-size: 12px; }
  /* ================================================== Popups */
  .popup-box {
    width: 96%;
    left: 2%;
    top: 60px;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
    .popup-box h3 {
      padding: 0; }
    .popup-box .popup-links li {
      padding: 20px 0; }
  .popup-1 .label-1 {
    margin-top: 0; }
  /* ================================================== Prelogin Product Catalogue */
  .product-info li span {
    display: block;
    width: 100%; }
  .popup-3 {
    width: 100%;
    top: 0;
    left: 0; }
  /* ================================================== self-care notifications */
  .notification-wraper .sub-notification {
    position: relative;
    margin-bottom: 20px; }
  /* ================================================== Tips and tricks */
  .widget.widget-tips-and-tricks:before {
    right: 0; }
  .widget.widget-tips-and-tricks:after {
    right: 6px; }
  .pfm-financial-goals .pfm-goal_info {
    width: 64%; }
    .pfm-financial-goals .pfm-goal_info h3, .pfm-financial-goals .pfm-goal_info p {
      float: left; }
  .pfm-financial-goals .pfm-goal_info__profile {
    float: none;
    margin-bottom: 10px; }
  .pfm-financial-goals .pfm-goal_progress-bar {
    width: 75%; }
  .pfm-financial-goals .hidden {
    padding-top: 170px; }
  .pfm-financial-goals .widget-actions > li {
    float: right;
    margin-left: 10px;
    width: 90%; }
  .pfm-financial-goals .widget-slat {
    padding-top: 60px; }
  .pfm-financial-goals .widget-actions.widget-corner {
    right: 0;
    top: 80px;
    width: 100%; }
    .pfm-financial-goals .widget-actions.widget-corner li {
      margin-left: 0;
      width: 100%;
      padding: 0px 15px; }
  .pfm-financial-goals .pfm-goal {
    padding: 25px 15px; }
  .pfm-financial-goals .widget-buttons {
    padding-right: 0; }
  .pfm-financial-goals .widget-tabs {
    padding-top: 20px; }
    .pfm-financial-goals .widget-tabs.style-2 li {
      font-size: 12px; }
  #side-modal-create-goal-step2 .acc-info {
    float: left;
    margin-left: 0px;
    margin-top: 10px;
    width: 100%; }
  #side-modal-create-goal-step2 .new-account .acc-name {
    padding-top: 15px; }
  #side-modal-create-goal-step2 .btn-1 {
    font-size: 12px; }
  #side-modal-pfm-new-rule2 .custom-table .text-7 {
    font-size: 12px; }
  #side-modal-pfm-new-rule2 .rule-details p {
    font-size: 12px; }
  .custom-table.table-2 .col {
    padding: 8px 0; }
  .transferlistp {
    left: 0; }
  .custom-table .text-6 {
    float: right;
    padding-right: 10px; }
  .custom-table.table-2 .tag {
    top: 11px; }
  .arr-up-tag {
    left: 0; }
  .col-text.text-1.text-cl-1.left.exchange-tranp {
    float: right;
    padding-right: 15px; }
  .custom-table .tag {
    left: 10px; }
  .custom-table .text-1 {
    padding-left: 25px; }
  .popup-box h3 {
    padding: 0; } }

/* ==================================================
    =400px
===================================================== */
@media only screen and (max-width: 400px) {
  #page-header-left.mobile {
    width: 100%; }
    #page-header-left.mobile .site-branding .site-logo a {
      background-size: contain;
      margin-top: -7px; } }

/* ==================================================
    =350px
===================================================== */
@media only screen and (max-width: 350px) {
  .pfm-budget .top-padding h2 {
    margin-bottom: 50px; }
  .pfm-budget .btn-1 {
    font-size: 11px; }
  .pfm-budget .widget-actions > li {
    float: none;
    margin-left: 0px; }
  .pfm-budget .widget-actions.widget-corner {
    top: 65px;
    left: 0px;
    width: 100%;
    padding: 0px 20px; }
  .transferlistp {
    left: 0; }
  .custom-table .text-6 {
    padding-right: 2px; } }

/* ==================================================
    =320px to 480px 
===================================================== */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  #pfm-click-mobile-link {
    display: block !important; } }
