/*------------------------------------*\
    MIXINS
\*------------------------------------*/
.clearsave-rent-receipt-page {
  font-family: "Roboto", "Source Sans Pro", sans-serif; }

.pan-number-placeholder {
  position: absolute;
  top: 0.75rem !important;
  font-size: 1rem !important;
  transform: none !important;
  color: #AAA !important;
  text-transform: uppercase;
  z-index: 0;
  left: .75rem;
  opacity: 0; }
  .pan-number-placeholder.active {
    opacity: 1; }

.receipts-closed {
  max-height: 200px;
  overflow: hidden; }

.receipt-header {
  margin-bottom: 0;
  border-collapse: collapse; }
  .receipt-header img {
    height: 30px;
    position: relative;
    top: 8px; }

.center-text {
  text-align: center; }

.uppercase {
  text-transform: uppercase; }

.capitalcase {
  text-transform: capitalize; }

.receipt {
  border: thin solid #EAEAEA;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
  margin-top: 1rem;
  margin-bottom: 3rem;
  padding-bottom: 0;
  color: #000; }
  .receipt td,
  .receipt th {
    padding: 20px; }
  .receipt table tr td p {
    margin: 0;
    line-height: 2.5; }

.nomargin {
  margin: 0; }

.rentreceipt {
  min-height: 90vh;
  position: relative;
  margin-bottom: 0;
  background-color: #2C80B2;
  background-image: url("/img/clearsave/bg-gradient.png");
  background-attachment: fixed;
  background-size: 2px 100%; }

.rentreceipt-illustrations {
  position: relative;
  height: 90vh; }
  .rentreceipt-illustrations::after, .rentreceipt-illustrations::before {
    content: "";
    width: 50%;
    height: 25%;
    background-repeat: no-repeat;
    background-image: url("https://assets1.cleartax-cdn.com/clearsave/house.png");
    background-position: bottom left;
    position: absolute;
    bottom: 0;
    left: 0; }
  .rentreceipt-illustrations::after {
    background-image: url("https://assets1.cleartax-cdn.com/clearsave/right%20tree.png");
    left: auto;
    background-position: bottom right;
    right: 0; }

.rentreceipt-results {
  margin-bottom: 0;
  padding-bottom: 5rem; }

.rentreceipt-left {
  position: relative; }
  .rentreceipt-left p {
    font-size: 1.25rem; }
  @media screen and (min-width: 768px) {
    .rentreceipt-left {
      min-height: 90vh; } }

.owner-name {
  margin-bottom: 0;
  margin-top: 30px;
  text-transform: capitalize; }

.rentreceipt-form {
  position: absolute;
  min-height: 280px;
  width: 100%;
  max-width: 500px;
  padding: 2rem;
  padding-bottom: 0;
  right: 0;
  top: 47%;
  z-index: 2;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transform: translateY(150%);
  -moz-transform: translateY(150%);
  transform: translateY(150%);
  background-color: #EEE; }
  .rentreceipt-form.active {
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    transform: translateY(-60%);
    background-color: #FFF;
    z-index: 1; }
  .rentreceipt-form.form1-state1 {
    -webkit-transform: translateY(-250px) scaleX(0.9);
    -moz-transform: translateY(-250px) scaleX(0.9);
    transform: translateY(-250px) scaleX(0.9);
    transition: all 0.3s ease;
    z-index: 1;
    background-color: #EEE; }
  .rentreceipt-form.form2-state1 {
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    background-color: #FFF; }
  .rentreceipt-form.form1-state2 {
    -webkit-transform: translateY(-250px) scaleX(0.93);
    -moz-transform: translateY(-250px) scaleX(0.93);
    transform: translateY(-250px) scaleX(0.93);
    background-color: #FFF;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease; }
  .rentreceipt-form.form2-state2 {
    transform: translateY(-48%) scaleX(0.95);
    background-color: #EEE;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease; }
  .rentreceipt-form.form1-state3 {
    background-color: #FFF;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transform: translateY(-250px) scaleX(1);
    -moz-transform: translateY(-250px) scaleX(1);
    transform: translateY(-250px) scaleX(1);
    z-index: 3; }
  .rentreceipt-form.form2-state3 {
    -webkit-transform: translateY(-50%) scaleX(0.9);
    -moz-transform: translateY(-50%) scaleX(0.9);
    transform: translateY(-50%) scaleX(0.9);
    background-color: #EEE;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 1; }
  .rentreceipt-form .btn {
    margin-top: .5rem;
    width: 100%; }
  .rentreceipt-form .input-field label {
    font-size: .9rem;
    top: 0; }
  .rentreceipt-form .input-field label.active {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    transform: translateY(-100%); }

.error-state#form1 {
  -webkit-transform: translateY(-280px) scale(1, 0.9);
  -moz-transform: translateY(-280px) scale(1, 0.9);
  transform: translateY(-280px) scale(1, 0.9);
  background-color: #FFF; }
.error-state#form2 {
  -webkit-transform: translateY(-20%) scale(1, 0.9);
  -moz-transform: translateY(-20%) scale(1, 0.9);
  transform: translateY(-20%) scale(1, 0.9);
  background-color: #FFF; }

.collapsible-header.active {
  background-color: #EAEAEA; }

#fixed-button {
  margin-top: 1rem; }
  #fixed-button.pinned {
    width: 29vw;
    margin-top: 12rem; }
  #fixed-button.pin-bottom {
    margin-top: 12rem; }

.rentreceipt-form-wrap {
  overflow: hidden;
  height: 100%; }
  @media screen and (min-width: 480px) {
    .rentreceipt-form-wrap {
      position: absolute;
      right: 0;
      bottom: 0;
      width: 90% !important;
      min-width: 400px; } }

.rentreceipt-form-parent {
  position: relative; }
  @media screen and (min-width: 480px) {
    .rentreceipt-form-parent {
      height: calc(90vh - 65px); } }

.clearsave-rent-receipt-page .btn {
  border-radius: 20px; }
.clearsave-rent-receipt-page footer {
  margin-top: 0;
  margin-bottom: -1.25rem; }

.transparent {
  background-color: transparent !important;
  background-attachment: fixed; }

.print-receipts h4 {
  margin-bottom: 2.5rem;
  margin-top: 2.25rem; }

.print-receipts-btn {
  margin: 1.5rem 0; }

div.tips {
  margin: 0 0 2rem 0; }
  div.tips .small {
    font-size: 0.75rem; }
  div.tips .checked-list {
    list-style: none;
    display: inline-block;
    margin: 1.5rem 0; }
    div.tips .checked-list li::before {
      content: '';
      background: url(/img/success.png) no-repeat top left;
      width: 14px;
      height: 14px;
      display: inline-block;
      background-size: 14px 14px;
      margin-right: 20px; }
  div.tips .btn {
    margin: 0.4rem 0; }
  div.tips .tip-text {
    font-size: 1.2rem; }

.socialbox .btn {
  margin: 0.4rem 0; }

.nowrap {
  white-space: nowrap; }

.faqcontainer {
  padding-top: 5rem;
  margin-bottom: 0;
  border-top: thin solid #999; }

.faq-title {
  text-align: center;
  margin-bottom: 3rem;
  font-size: 1.64rem;
  line-height: 110%; }

.collapsible-body p {
  padding: 1.5rem; }

.receipt-body {
  padding-bottom: 0 !important;
  padding-top: 0 !important; }

@media (min-width: 1600px) {
  .clearsave-rent-receipt-page .btn {
    height: 5vh;
    line-height: 5vh; }

  #fixed-button.pinned {
    width: 30vw; } }
@media (max-width: 480px) {
  .clearsave-rent-receipt-page footer {
    padding-top: 4rem; }

  .faqcontainer {
    border-bottom: thin solid #CCC; }

  .rentreceipt-form {
    background-color: #FFF !important;
    position: static;
    height: auto !important;
    transform: translateY(0);
    box-shadow: none;
    min-height: 0; }

  #form1,
  #form2 {
    transform: none !important;
    background-color: white !important; }

  .collapsible-header {
    line-height: 1.5rem;
    padding: .5rem 1rem; }

  .rentreceipt-illustrations {
    height: auto; }
    .rentreceipt-illustrations::after, .rentreceipt-illustrations::before {
      content: none; }

  .rentreceipt-left {
    transform: none;
    text-align: center; }
    .rentreceipt-left h4 {
      font-size: 1.9rem; }

  .rentreceipt {
    height: auto;
    overflow: hidden; }

  #form1 {
    padding-bottom: 0;
    padding-top: 1.75rem; }

  #form2 {
    padding-top: 0;
    padding-bottom: 1.75rem; }

  .no-mb-mobile {
    margin-bottom: 0; }

  .input-field label {
    line-height: 1.5rem;
    font-size: 1rem !important;
    top: 0;
    color: #000; }

  .input-field.col.m6.l6.s12 {
    margin-bottom: 20px; }

  /*.rentreceipt-form-wrap {
      position: static;
      height: auto;
      overflow: auto;
      min-width: 0;
      width: 100% !important;
  }
  .rentreceipt-form .input-field label.active {
      @include transform(translateY(-80%));
  }*/
  footer {
    text-align: center; } }
@media print {
  body {
    margin: 0;
    padding: 0; }

  .owner-name {
    margin-top: 20px; }

  .hide-print,
  .clearsave-rent-receipt-page::before,
  .clearsave-rent-receipt-page::after {
    display: none; }

  .print-receipt-wrap {
    padding-bottom: 20px; }

  .faqcontainer {
    border: 0; }

  .print-receipts {
    width: 100% !important; }

  table {
    table-layout: fixed; }

  .receipt {
    page-break-before: auto;
    position: relative;
    width: 100% !important;
    box-shadow: none;
    margin-bottom: 1rem;
    border: thin solid black;
    page-break-inside: avoid !important; }

  .print-receipt-wrap:nth-child(4n) {
    page-break-after: always !important; }

  .clearfix {
    display: none; }

  body {
    font-size: 8pt; }

  p {
    font-size: 8pt;
    line-height: 2; } }
.field-validation-error {
  font-size: 0.8rem;
  color: #e65100;
  font-style: italic; }

.panMsg {
  font-size: 0.8rem;
  color: #e65100;
  position: relative;
  top: -.75rem; }

.cs-landing .clearsave-banner {
  min-height: 220px;
  background-image: url("https://assets1.cleartax-cdn.com/clearsave/hero_img.png");
  background-repeat: no-repeat;
  background-position: 75% 100%;
  background-size: 600px; }
.cs-landing .container-smaller {
  max-width: 1000px; }
.cs-landing .vert-divider {
  border-right: 2px solid rgba(0, 0, 0, 0.2); }
.cs-landing .confusion {
  position: relative;
  background-color: yellow;
  min-height: 300px; }
.cs-landing .confusion-body {
  position: absolute;
  top: 50%;
  transform: translate(15%, -50%);
  -webkit-transform: translate(15%, -50%);
  -moz-transform: translate(15%, -50%);
  transform: translate(15%, -50%); }

.rentreceipt-content .title {
  font-size: 30px;
  font-weight: 600; }
  @media screen and (max-width: 768px) {
    .rentreceipt-content .title {
      font-weight: 400;
      font-size: 18px; } }
.rentreceipt-content .list {
  margin-left: 15px;
  padding-left: 15px;
  text-align: left; }
  .rentreceipt-content .list,
  .rentreceipt-content .list li {
    list-style-type: disc; }
  .rentreceipt-content .list li {
    padding-left: 10px;
    padding-bottom: 0.5rem; }

@media screen and (min-width: 600px) {
  .rentreceipt-content {
    position: absolute;
    top: 50%;
    left: 0;
    padding: 0 0.75rem;
    -webkit-transform: translateY(-75%);
    -moz-transform: translateY(-75%);
    transform: translateY(-75%); } }
ul {
  padding-left: 40px; }

.faqs-list {
  list-style: none; }

.faqs-list .faq-question,
.faqs-list .faq-answer {
  line-height: 1.6;
  position: relative;
  padding: 0 1.5em;
  display: block; }

.faqs-list .faq-question {
  margin-bottom: 1.2em;
  font-weight: 600; }

.faqs-list .faq-answer {
  color: #888888;
  margin-bottom: 2.5em; }

.faqs-list .faq-question:before,
.faqs-list .faq-answer:before {
  top: 3px;
  margin: 0;
  padding: 0;
  left: -30px;
  width: 20px;
  height: 20px;
  content: " ";
  position: absolute;
  background-size: 100%;
  background-repeat: no-repeat; }

.faqs-list .faq-question:before {
  background-image: url("https://assets1.cleartax-cdn.com/s/images/faq_question_2.png"); }

.faqs-list .faq-answer:before {
  background-image: url("https://assets1.cleartax-cdn.com/s/images/faq_answer.png"); }

.material-layout-nav nav {
  background: initial;
  width: initial;
  box-shadow: none; }
.material-layout-nav .row {
  margin-bottom: 0; }