form {
  padding:0 !important;
}

#mainTabContent {
  margin-top:80px;
}

.content {
  padding:.5rem .75rem  ;
  padding-top:0 !important;
  margin-bottom:1rem !important;
}

.form-control {
  border-radius: 0 !important;
  margin: 0.75rem 0 !important;
  font-size: 14px !important;
}

table input, table select {
  outline: none !important;
}

table th.right, table input[type="number"] {
  text-align: right;
}

#commitmentTable .tooltip {
  margin-top:.5rem;
  margin-left:0;
}

.memberContent {
  position: fixed;
  width:100%;
  margin:0;
  background-color: #efefef;
  z-index:1;
  height:110px;
}

.memberContent .progress {
  height:100%;
  width:100%;
  padding:0;
  background-color:#efefef;
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.35) !important;
  -webkit-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.35) !important;
  -moz-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.35) !important;
  z-index:-1;
}

#mainTab {
  width:100%;
  margin:0 auto;
  border:none;
}

#mainTab li {
  width:33.33%;
  margin-top:50px;
  padding:0 !important;
  border:none;
  display:flex;
  justify-content: center;
  padding-left:10px;
  position:relative;

}
#main-content .row div.content {
  background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(239,239,239,1) 100%);
}

#main-content .row div.content-button button {
  width:auto;
}

#mainTab li a {
  padding:0 !important;
  color:#000;
  display: flex;
  font-size:11px;
  align-items: center;
  width: 100%;
  height: 100%;
  justify-content: center;
  font-family: Roboto-Thin;
  font-weight: 600;
  letter-spacing: 0.1em;
}

#mainTab li a:last-child {
  border-right:none;
  overflow: hidden;
}

#mainTab li a.active {
  color:#fff;
  background:transparent;
  border:none;
  z-index:2;
}

#mainTab li a .pointer {
  width: 100%;
  height: 60px;
  position: relative;
  background-color:transparent;
  position: absolute;
  z-index:-2;
}
#mainTab li a  .pointer:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 0;
  height: 0;
  border-left: 1px solid transparent;
  border-top: 40px solid transparent;
  border-bottom: 40px solid transparent;
}
#mainTab li:first-child a  .pointer:after {
  border-left: 1px solid transparent;
}
#mainTab li a .pointer:before {
  content: "";
  position: absolute;
  right: -40px;
  bottom: 0;
  width: 0;
  height: 0;
  border-left: 40px solid #efefef;
  border-top: 40px solid transparent;
  border-bottom: 40px solid transparent;
}

#mainTab li a.active .pointer {
  width: 100%;
  height: 80px;
  position: relative;
  background: linear-gradient(270deg, rgb(218, 172, 45) 0%, rgba(143,124,0,1) 100%);
  position: absolute;
  z-index:-1;
}
#mainTab li a.active .pointer:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-left: 40px solid transparent;
  border-top: 40px solid transparent;
  border-bottom: 40px solid transparent;
}

#mainTab li a.active .pointer:before {
  content: "";
  position: absolute;
  right: -9px;
  bottom: 60%;
  width: 0;
  height: 0;
  border-left: 0px solid #D9AB2C;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

.float-message {
  right:10px;
}
.float-message-inner #message {
  white-space: pre-wrap;
}


.btn-extra {
  float: left;
  margin-top: 0.5rem;
}

.btn-extra i {
  color:#222;
  transition: all .2s ease-in-out;
}

.btn-extra:hover i {
  color:#ffd96c;
}

.content .btn-primary{
  margin:0.5rem 0 !important;
}
table td {
  padding:.5rem !important;
}
table td.right {
  text-align: right;
}

#main-content .row div table th {
  background: linear-gradient(180deg, rgb(50 50 50) 0%, #111 100%);
  color: #ddd;
}

.summary .col-md-6 {
  text-align: center;
  padding:0;
  position: relative;
}

.summary .col-md-6 h3 {
  margin:2rem 0 !important;
}

#main-content .row div.content .disclaimer {
  margin-bottom:0;
}

.info {
  background:linear-gradient(180deg, rgb(50 50 50) 0%, #111 100%);
  padding:.75rem;
  margin-bottom:1rem;
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.35) !important;
  -webkit-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.35) !important;
  -moz-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.35) !important;
}

.tab-content {
  padding:0;
}

.info table {
  width:100%;
}

.info table tr td:first-child {
  width:70px !important;
  text-align: center;
}
.info table tr td:first-child i {
  font-size:40px;
  vertical-align: middle;
  margin-left:.5rem;
}
.info table tr td:first-child i.fa-home {
  color:#15bd73;
}
.info table tr td:first-child i.fa-car, .info table tr td:first-child i.fa-coins {
  color:#2dd2e7;
}
.info table tr td:first-child i.fa-user-alt, .info table tr td:first-child i.fa-wallet {
  color:#df3327;
}
.info table tr td:first-child i.fa-credit-card, .info table tr td:first-child i.fa-percent {
  color:#b24b94;
}
.info table tr td p {
  margin:0;
  display: inline-block;
  font-size:14px;
  color:#fff;
  letter-spacing: 0.1em;
  font-family: Roboto-Thin;
  margin-left:.5rem;
}
.info table tr td p:last-child {
  color:#ffd96c;
  font-size:16px;
}
.info .tooltip {
  color:#ddd;
}
.info table tr td:last-child {
  text-align: left !important;
  line-height: 1.8;
}
.dsrInfo {
  display:flex;
  align-items: center;
  position: relative;
}

.summary .col-md-6:first-child table {
  margin:2rem auto;
  margin-bottom:1rem;
  width:60%;
}

.form-select {
  border-radius: 0 !important;
  margin: 0.75rem 0 !important;
  font-size: 14px !important;
}
.summary .col-md-6:first-child table td {
  width:40%;
  text-align: left !important;
  padding:0 .5rem !important;
  font-size:14px;
  font-weight: normal !important;
  text-align: center;
}

td.principal {
  background-color:#15bd73;
  width:10% !important;
}
td.interest {
  background-color:#df3327;
  width:10% !important;
}
@media only screen and (min-width: 500px) {
  #mainTab li a {
    font-size:14px;
  }
}

@media only screen and (min-width: 768px) {
  #commitmentTable .tooltip {
    margin-left:.5rem !important;
    margin-top:0 !important;
  }
  #mainTab li {
    margin-top:60px !important;
  }
  #mainTab li a {
    font-size:16px;
  }
  
  #mainTab li a.active .pointer:before {
    bottom: 19%;
  }

  #mainTab li a.active .pointer:before {
    right: -14px;
    border-left: 15px solid #D9AB2C;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
  }
  #mainTab li a.active .pointer:after {
    border-left: 15px solid #efefef;
  }
  #mainTab li:first-child a.active .pointer:after {
    border-left: 15px solid transparent;
  }
  .summary .col-md-6 {
    padding:1rem;
  }
}


@media only screen and (min-width: 913px) {
  #mainTab li a {
    font-size:24px;
  }
  .memberContent {
    height:140px;
  }
  #mainTabContent {
    margin-top:100px;
  }
  #mainTab li a.active .pointer:before {
    content: "";
    position: absolute;
    right: -40px;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 40px solid #D9AB2C !important;
    border-top: 40px solid transparent !important;
    border-bottom: 40px solid transparent !important;
  }
  #mainTab li a.active .pointer:after {
    border-left: 40px solid #efefef;
  }
  #mainTab li:first-child a.active .pointer:after {
    border-left: 40px solid transparent;
  }
}
