body {
  font: sans-serif;
  padding-left: 0px !important;
  padding-right: 0px !important; }

header {
 background-color: #5488A4;
  color: #FFF; }

section {
  padding-top: 20px;
  margin-left: auto;
  margin-right: auto; }

.logo
{
    margin: auto;
    min-width: 355px;
    padding: 0px 0 0 50px;
}

.call {
  min-width: 355px;
  padding: 5px 100px 0px 5px; }
  .call h2 {
    display: inline-block;
    margin: 0px;
    letter-spacing: -1.5px;
    padding-left: 45px;
    padding-top: 10px;
    background: url(../../images/call.png) no-repeat 0; }

/*PANE=TAB*/
.pane {
  margin: 0px !important; 
  }
 
 /*A: TAB HEADING*/
 .pane h4
{
    background: #D8E6EF; /*Background*/
    color: #000000; /*Text Colour*/
    margin: 5px 0 30px -20px;
    padding: 15px 40px;
    display: inline-block;
    position: relative;
}
  .pane h4.deposit 
  {
    margin-top: 30px; 
  }
    
  /*B: TAB DROP SHADOW*/
  .pane h4:before
{
    content: " ";
    position: absolute;
    top: 49px;
    left: 0px;
    border-style: solid;
    border-width: 0 20px 10px 0;
    border-color: transparent #B8D1E2 transparent transparent; /*DROP SHADOW*/
}

/*C: TEXT COLOUR-MAIN PANEL*/
.txttitle
{
    color: #FFFFFF; /*TEXT COLOUR*/
}

/*D: PANEL-LEFT*/
.pane.left
{
    background: #5488A4;
    min-height: 300px;
}

/*E: PANEL-RIGHT*/
.pane.right
{
    background: #D8E6EF;
    min-height: 300px;
}

/*F: REPRESENTATIVE EXAMPLE*/
.bottom
{
    min-height: 150px;
    background: #FFFFFF;
    color: #315060;
}

.pane.right:before
{
    content: " ";
    width: 0;
    position: absolute;
    top: 230px;
    display: block;
    border-style: solid;
    border-width: 20px;
    border-color: transparent transparent transparent #CCCCCC;
    z-index: 5;
}

.amount {
  margin-left: 10px;
  padding-top: 20px; }
  .amount .fa {
    margin-right: 10px;
    margin-left: 7px;
    color: #FFF; }
  .amount div.slider {
    width: 70% !important; }
    .amount div.slider .tooltip {
      opacity: 1 !important;
      top: -15px; }
    .amount div.slider .tooltip-inner {
      background: #98e901;
      padding: 7px 10px 7px 10px;
      font-weight: bold;
      font-size: 170%;
      width: 59px; }
    .amount div.slider .tooltip-arrow {
      border-top-color: #98e901; }
  .amount .slider-handle.round {
    background: #98e901; }

/*F: DEPOSIT SELECTION*/
.deposit {
  margin-left: 20px; }
  .deposit .btn {
    min-height: 40px;
    max-width: 100px;
    font-weight: bolder;
    font-size: 13px; }
  .deposit .active
{
    background: #666666;
    color: #FFF;
}

/*FINANCE PLAN*/
/*J: PLAN VALUE*/
.result
{
    color: #669999;
    margin: 0px;
    width: 100%;
    font-weight: bolder;
    font-size: 120%;
}
  .result .singleResult td {
    height: 150px !important; }
  .result .amount {
    padding-right: 20px;
    height: 60px; }
   
/*H: LOAN AMOUNT TEXT*/
    .result .amount span
{
    color: rgb(0, 0, 0); /* LOAN AMOUNT */
    padding-right: 20px;
}
/*G: SELECTED PLAN */
  .result .price
{
    height: 50px;
    background: #315060 !important;
}

/*FINANCE PLAN*/
    .result .price .product {
      padding-left: 20px;
      color: rgba(255, 255, 255, 0.8);  /*I: AMOUNT VALUE*/
      width: 50%; }
    .result .price .or {
      font-weight: 200; }
  .result .lead {
    font-weight: 900;
    font-size: 22px; }
  .result .select-apr select {
    margin-top: 20px;
    width: 300px; }

.apr div.apr-text {
  font-weight: normal;
  padding: 0px 30px 10px 30px; }
  .apr div.apr-text .repT {
    font-size: 14px;
    font-weight: lighter;
    letter-spacing: -0.5px;
    line-height: 18px; }

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important; }

@media (min-width: 1140px) {
  .pane.left, .pane.right {
    width: 550px; }
  section {
    width: 1140px; }
  .bottom {
    width: 1000px; } }

@media (min-width: 940px) and (max-width: 1140px) {
  .pane.left, .pane.right {
    width: 450px; }
  section {
    width: 940px; }
  .bottom {
    width: 800px; } }

@media (min-width: 740px) and (max-width: 940px) {
  .pane.left, .pane.right {
    width: 350px; }
  section {
    width: 740px; }
  .bottom {
    width: 600px; } }

@media (max-width: 740px) {
  .call {
    padding-top: 0px !important;
    padding-right: 5px !important; }
    .call h2 {
      font-size: 170%; }
  .logo {
    padding-left: 5px !important; }
  .pane.left, .pane.right {
    min-width: 350px;
    width: 100%; }
  header {
    min-width: 380px;
    width: 100%; }
    header div.span6 {
      min-width: 350px;
      width: 100%; }
  section {
    padding-top: 0px;
    min-width: 350px;
    width: 100%; }
  .bottom {
    min-width: 350px;
    width: 100%; }
  .pane.right:before {
    top: 460px;
    left: 50%;
    border-color: #00ade9 transparent transparent transparent !important; } }