:root {
  --ratio: 1.5;
  --s-6: calc(var(--s-5) / var(--ratio));
  --s-5: calc(var(--s-4) / var(--ratio));
  --s-4: calc(var(--s-3) / var(--ratio));
  --s-3: calc(var(--s-2) / var(--ratio));
  --s-2: calc(var(--s-1) / var(--ratio));
  --s-1: calc(var(--s0) / var(--ratio));
  --s0: 1rem;
  --s1: calc(var(--s0) * var(--ratio));
  --s2: calc(var(--s1) * var(--ratio));
  --s3: calc(var(--s2) * var(--ratio));
  --s4: calc(var(--s3) * var(--ratio));
  --s5: calc(var(--s4) * var(--ratio));
  --s6: calc(var(--s5) * var(--ratio));
  --gold: #ba9545;
  --cream: #f1ede8;
  --purple: #3c3744;
  --green: #35583b;
  --blue: #54a8d0;
  --red: #ed4337;
  --bg-black: #0f1217;
  --bg-gray: #f8f6f6;
  --text-black: #1b1b1b;
  --text-gray: #7a7a7a;
  --text-gray-light: #b7bec6;
  --button-primary: #1a291b;
  --button-secondary: #f1ede8;
  --button-black: #1c1c1c;
  --border-gray: #bbb;
  --border-gray-med: #e5e5e5;
  --border-gray-light: #f8f8f8;
}


body:before {
    background-color: transparent;
}
.widget-container svg {
    height: auto;
}
#chart-area {
  display: none;
}
#chart.widget-container {
  display: block !important;
  font-family: "Gilda Display" !important;
}
#widget_container {
  width: auto;
  border: 1px solid var(--text-black) !important;
  border-bottom: 2px solid var(--text-black) !important;
  padding: var(--s1);
  position: relative !important;
  background-color: #fff !important;
  text-align:  left !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#widget_container > :first-child {
  display: flex !important;
  justify-content: center !important;
  margin-bottom: var(--s1);
  max-width: 100%;
}

/* logos */
#widget_coa_container {
  position: relative !important;
}
a#coa_astro {
  width: 125px !important;
  margin: var(--s1) auto 0 !important;
  display: block !important;
}
a#bc_astro {
}


.widget-birthchart div, .moon_container div {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.widget-container button {
  cursor: pointer !important;
}
.widget-container input,
.widget-container select,
.widget-container textarea {
  color: #171617 !important;
  font-family: "Gilda Display", sans-serif !important; 
  font-size: 19px !important;
  line-height: 26px !important;
  font-weight: 400 !important;
}
.widget-container button,
.widget-container h1,
.widget-container h2,
.widget-container h3,
.widget-container h4,
.widget-container h5,
.widget-container h6 {
    font-weight: 600 !important;
    color: #171617 !important;
    clear: both !important;
    font-family: "Josefin Sans" !important;
}
.widget-container h1 {
    margin: 26px 0 0 !important;
    font-size: 30px !important;
    line-height: 42px !important;
}
.widget-container h2 {
    margin: 46px 0 15px !important;
    font-size: 22px !important;
    line-height: 30px !important;
}
.widget-container h3 {
    font-size: 19px !important;
    line-height: 26px !important;
}
.widget-container h4 {
    margin: 30px 0 6px !important;
    font-size: 17px !important;
    line-height: 24px !important;
}
.widget-container h5 {
    margin: 24px 0 6px !important;
    font-size: 16px !important;
    line-height: 19px !important;
}
.widget-container h6 {
    margin: 24px 0 9px !important;
    font-size: 18px !important;
    line-height: 18px !important;
}
.widget-container a {
    color: #171617 !important;
    text-decoration: none !important;
    -webkit-transition: all 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95) !important;
    transition: all 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95) !important;
}
.widget-container .section-title h4, .widget-container .widget-title {
    margin-top: 0 !important;
    margin-bottom: 30px !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    border-bottom: 1px solid #3d3e40 !important;
    font-weight: 700 !important;
}

/****************************************************/
/* Tool Info - new info at the bottom of tool pages */
/****************************************************/

.widget-container .new-form h1 {
  font-size: 14px !important;
  line-height: 1.4 !important;
  font-family: "Josefin Sans" !important;
  color: var(--gold) !important;
  padding-bottom: var(--s-3) !important;
  text-transform: uppercase;
  font-weight: 200 !important;
  letter-spacing: 0.8px;
}

.widget-container .new-form p {
  line-height: 1.7 !important;
}

.widget-container .new-form .btn-submit {
  margin: 15px 0 !important;
}

.widget-container .new-form .default-input.center-align {
  text-align: center !important;
}

.widget-container .new-form label {
  font-weight: 200 !important;
  font-family: 'Josefin Sans' !important;
  color: #000 !important;
}

.widget-container .new-form .default-input {
    height: 40px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--text-gray) !important;
    border-radius: 0 !important;
    padding: 0 !important;
    font-size: 20px !important;
    margin-bottom: 10px !important;
}
.widget-container .new-form .default-input.geolocation {
      background-color: #fff !important;
}

.widget-container.widget-birthchart pre.defaultcode {
    background-color: #eee;
    padding: 8px 20px;
    word-break: break-word;
    white-space: pre-wrap;
    color: #545151;
    font-size: 16px;
}

/**
    For mobile only
*/
.chart-container {
    width: 100% !important;
    max-width: 1000px !important;
}
.widget-container .tight-chart {
    max-width: 760px !important;
}
.widget-container .chart_display {
    position: relative !important;
    width: 100% !important;
    display: block !important;
    background-image:url("/client/common/images/site/loader.8f08b40231d4.gif") !important;
    background-repeat:no-repeat !important;
    background-position: 50% 50% !important;
    margin: 0 auto !important;
    font-family: "Gilda Display" !important;
}
.widget-container .chart_display_wrapper {
    margin-top: 10px !important;
    width: 100% !important;
    display:inline-block !important;
    vertical-align: top !important;
    padding-bottom: 20px !important;
}
.widget-container #raphael {
    padding: 0 !important;
    text-align: center !important;
}
.widget-container .ibox_right {
    display: block !important;
    margin: 0 auto !important;
    padding: 10px !important;
    width: 100% !important;
    vertical-align: top !important;
}

.tab_details .h_attrs {
  padding: 4px 0 !important;
}
.h_attrs {
  padding: 8px 0 !important;
  font-weight: bold !important;
  font-family: "Gilda Display" !important;
}
.h_attrs span {
  font-weight: normal !important;
}
.widget-container #raphael {
    text-align:center !important;
    overflow: visible !important;
}

.widget-container .ibox {
    display: block !important;
    padding: 25px 0 0 !important;
    clear: both !important;
    font-family: "Gilda Display" !important;
}
.widget-container .c2header {
    font-style: italic !important;
    font-size: 16px !important;
    color: #ccc !important;
    font-family: "Gilda Display" !important;
}

:focus-visible {
    outline: none;
}

.tt-hint {
  position: absolute;
  top: 0px;
  left: 0px;
  border-color: transparent;
  box-shadow: none;
  visibility: hidden;
}

.tt-input {
  position: relative;
  vertical-align: top;
  background-color: transparent;
}

.drop-down,
.tt-dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  z-index: 100;
  margin-top: var(--s-2);
  background-color: white;
  border: 2px solid var( --text-black);
  width: 100%;
}


.input-dd-container {
    position: relative;
}

.drop-down li {
  cursor: pointer;
  padding: 0;
  font-family: "Gilda Display" !important;
}

.drop-down li a {
  padding: var(--s0) var(--s-1);
  display: block;
}

.tt-dataset-all-places > * > *,
.tt-dataset-all-people > * > * {
  cursor: pointer;
}

.tt-suggestion:hover,
.drop-down li:hover {
  color: white;
  background-color: var(--purple);
}

.tt-suggestion:hover > *,
.tt-suggestion:hover > * > *,
.tt-suggestion:hover > * > * > *,
.drop-down li:hover > b,
.drop-down li:hover > a {
  color: white !important;
}

.twitter-typeahead .tt-suggestion.tt-is-under-cursor:hover,
.twitter-typeahead .tt-suggestion.tt-cursor:hover {
  color: #fff;
  cursor: pointer;
  background-color: #383a49;
  }



.widget-container .chart_details {
  font-size: 16px !important;
  margin-bottom: 5px !important;
  position: relative !important;
  color: var(--text-black) !important;
}
.new-form h9,
.chart_details h9 {
  font-size: 14px !important;
  text-transform: uppercase !important;
  margin-bottom: 7px !important;
  display: block !important;
}
.new-form h9 {
  border-bottom: 1px solid !important;
  margin-bottom: 20px !important;
  padding-bottom: 7px !important;  
}
.h_attrs > span {
  font-weight: 300 !important;
  line-height: 25px !important;
  display: inline-block !important;
}
.widget-container .tab_details .tab_person {
    width: 49% !important;
    display: inline-block !important;
    vertical-align: top !important;
}
.widget-container.synastry-container .h_attrs.price {
    margin-top: 15px;
}
.widget-container .tab_details {
  margin-top: 0px !important;
  padding: 10px 0 !important;
} 
.widget-container .chart_report{
    display: block !important;
    height: 66px !important;
    background-position: -118px -122px !important;
    background-size: 647% !important;
    width: 51px !important;
    position: absolute !important;
    top: 51px !important;
    right: 25px !important;
}
.widget-container span.logo_area {
    display: inline-block !important;
    width: 62% !important;
    height: 58px !important;
    vertical-align: top !important;
    opacity: .7 !important;
}
.widget-container .logo_area .powered {
    width: 95px !important;
    display: inline-block !important;
    vertical-align: bottom !important;
    margin-left: 10px !important;
    margin-bottom: 10px !important;
}
.widget-container .logo {
    display: block !important;
    height: 53px !important;
    background-position: -471px 0 !important;
    background-size: 300% !important;
    width: 240px !important;
    display: inline-block !important;
}
@media (min-width: 1200px) {
    .c2header {
        width: 100% !important;
    }
}
.widget-container .form-group.focus .form-control, .form-control:focus/*, .form-group.focus .select2-search input[type="text"], .select2-search input[type="text"]:focus */{
  border-color: #6156bd !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.widget-container .form-group.time-group {
  display: block !important;
}
.widget-container .date-group, .widget-container .time-group {
  margin: 10px 0;
}
.widget-container .inner_ibox {
  margin: 5px 0 10px !important;
}

/*****************************/
/* Chart Product Widget CTAs */
/*****************************/

.cta-widget {
  display: block !important;
  position: relative !important;
  margin: 20px 0 !important;
}
.cta-wrapper {
  padding: 20px 15px !important;
  text-align: center !important;
}
.cta-wrapper {
  border: 4px solid #484848 !important;
}
.cta-widget img.banner-desktop-image {
  display: block;
  margin: 0 auto;
}
.cta-wrapper h2,
.cta-wrapper p {
  color: #000 !important;
}
.cta-wrapper h2 {
  font-weight: bold !important;
  margin-top: 22px
}
.cta-widget .button-primary {
  font-size: 26px !important;
  text-transform: none !important;
  font-weight: 800 !important;
  letter-spacing: 1.6px !important;
  color: #484848 !important;
  padding: 10px !important;
  outline: 0 !important;
}

@media (max-width: 320px) {
  .cta-widget .button-primary {
    font-size: 22px !important;
    padding: 16px !important;
  }
}

@media (min-width: 768px){
  #bc-cta .cta-widget {
    padding: 20px !important;
    margin: 0 !important;
  }
  .cta-wrapper h2 {
    margin-top: 15px !important;
  }
}

.widget-container .product-col-left p {
  line-height: 25px !important;
}
.widget-container .chart-cta.cta-widget {
  width: 100% !important;
}
.widget-container .chart-cta .cta-wrapper h2 {
  font-size: 27px !important;
  line-height: 40px !important;
  margin-top: 20px !important;
}
.widget-container .chart-cta .cta-wrapper p {
  padding: 0 !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
  margin-bottom: var(--s1);
}

@media (min-width: 768px) {
  .widget-container .chart-cta .cta-wrapper h2 {
    font-size: 32px !important;
    margin-top: 0 !important;
  }
}

.widget-container #bc-cta .cta-wrapper {
  border: 2px solid var(--text-black)!important;
  padding: 20px 15px !important;
}

@media (min-width: 768px) {
  .widget-container #bc-cta .cta-wrapper {
    padding: var(--s0) 15px !important;
  }
  .widget-container #bc-cta .chart-cta.cta-widget {
    width: 100% !important;
    margin-left: 0 !important;
  }
  .widget-container #bc-cta img.banner-desktop-image {
    width: 95% !important;
  }
}
.chart-cta.cta-widget {
  width: 100% !important;
}
.chart-cta .cta-wrapper h2 {
  font-size: 27px !important;
  line-height: 34px !important;
}
.chart-cta .cta-wrapper p {
  padding: 0 !important;
  line-height: 34px !important;
}
.chart-cta .corner.bottom-left {
  bottom: 32px !important;
  left: 32px !important;
}
.chart-cta .corner.bottom-right {
  bottom: 32px !important;
  right: 32px !important;
  transform: rotate(-90deg) !important;
}
.chart-cta .corner.top-left {
  top: 32px !important;
  left: 32px !important;
  transform: rotate(90deg) !important;
}
.chart-cta .corner.top-right {
  top: 32px !important;
  right: 32px !important;
  transform: rotate(-180deg) !important;
}

@media (min-width: 768px) {
  .chart-cta .cta-wrapper h2 {
    font-size: 32px !important;
  }
  .chart-cta .cta-wrapper p {
    padding: 0 15px !important;
    font-size: 21px !important;
  }
  .chart-cta.cta-widget .corner {
    width: 25px !important;
  }
}

/* Planet Positions */
.widget-container .planet {
    display:block !important;
    clear:both !important;
    height:auto !important;
    padding-bottom: 5px !important;
}
.widget-container img.pl_icon {
    border: 0 !important;
    padding: 0 !important;
    margin: 0 4px 0 0 !important;
    width: 24px !important;
    display: inline-block;
}
.widget-container .p_ret {
    display: inline-block !important;
    color: #555 !important;
    font-style: italic !important;
    font-size: 13px !important;
    margin: 0 !important;
}
.widget-container .p_attr {
    display:inline-block !important;
    vertical-align:top !important;
    margin:0 !important;
    font-size:16px !important;
    margin-top:3px !important;
    max-width: 81% !important;
    line-height: 20px !important;
}
.widget-container .p_name {
    display:inline-block !important;
    text-transform:capitalize !important;
}
.widget-container .planet .p_name {
    font-size: 16px !important;
    margin: 0 !important;
}
.widget-container .p_pos, .widget-container .p_sign {
    display:inline-block !important;
    font-size:15px !important;
    color:#357aed !important;
    margin: 0 !important;
}


@media (max-width: 475px) {
    .widget-container .p_attr {
        max-width: 80% !important;
    }
    .widget-container .planet {
        height:auto !important;
    }
    .widget-container .sec_desc {
        width: 100% !important;
        margin-left: 0 !important;
    }
    .widget-container .inner_ibox {
        padding-left:0 !important;
    }
}


/* Aspect Area */
.widget-container .aspect_box {
    display:block !important;
    margin:5px !important;
    width:590px !important;
    padding:8px !important;
    margin-bottom:10px !important;
    border-bottom:1px solid #eee !important;
    clear:both !important;
}
.widget-container .aspect_head {
    display:inline-block !important;
    vertical-align:top !important;
    font-size:16px !important;
}
.widget-container .aspect_img {
    width:25px !important;
    display:inline-block !important;
    vertical-align:top !important;
    margin-right:10px !important;
}
.widget-container .aspect_p {
    text-transform:capitalize !important;
}
.widget-container .aspect_orb {
    display:inline-block !important;
    color: #357aed !important;
    font-size:13px !important;
    margin-left: 25px !important;
    vertical-align: top !important;
    float:right !important;
}
.widget-container .chart_heading {
    color: #061662 !important;
    font-size: 28px !important;
    text-align: center !important;
    padding-top: 25px !important;
    padding-bottom: 19px !important;
    border-bottom: 1px solid #000 !important;
    margin-bottom: 17px !important;
}
.widget-container .aspect_b_link {
    display:inline !important;
    font-size: 16px !important;
    max-width: 70% !important;
    vertical-align: middle !important;
    line-height: 23px !important;
}
.widget-container .aspect_b_orb {
    display: inline-block !important;
    font-size: 14px !important;
    color: #357aed !important;
    width: 50px !important;
    line-height: 13px !important;
}
.widget-container .as_icon {
    width: 24px !important;
    margin-right: 4px !important;
    margin-top: 0px !important;
    padding: 0 !important;
    border: 0 !important;
}
.widget-container .as_container {
  margin: 0 !important;
  padding: 0 0 2px 0 !important;
}
.widget-container .as_text {
    display: inline-block !important;
    max-width: 80% !important;
    margin: 0 0 0 !important;
    vertical-align: top !important;
}
@media (min-width: 475px) {
    .widget-container .as_icon {
        width: 24px !important;
        margin-top: 1px !important;
        margin-right: 10px !important;
    }
}


/** Aspect Patterns */
.widget-container .aspect_pattern_box {
    display:block !important;
    margin:5px !important;
    padding:0px 8px 0 !important;
    margin-bottom: 15px !important;
    border-bottom: 1px solid #eee !important;
    clear: both !important;
    text-align: center !important;
}
.widget-container .aspect_pattern_box:last-of-type{
    border-bottom: none !important;
}
.widget-container .ap_raphael {
    display: block !important;
    height: 180px !important;
    vertical-align: top !important;
    margin-top: 5px !important;
}
.widget-container .ap_info {
    display: block !important;
    min-height:70px !important;
    vertical-align:top !important;
    line-height: 25px !important;
    margin-top: 17px !important;
}
.widget-container .ap_type {
    font-weight: bold !important;
    font-size: 17px !important;
}
.widget-container .ap_planets {
    font-size: 16px !important;
    margin-top: 5px !important;
}


/*****************************/
/* Tool Forms */
/*****************************/
.widget-container input {
  width: 100% !important;
  margin:0 !important;
}
.widget-container button {
  margin:0 !important;
}
.widget-container h3 {
  margin: 0 !important;
}
.widget-container #error {
  width: 100% !important;
  font-size: 17px !important;
  color: #ed4337;
  display: none;
  font-style: italic !important;
}
.widget-container .tools-forms {
  width: 100% !important;
}
.widget-container .new_box {
  padding: 0 !important;
  font-size: 24px !important;
}
.widget-container .chart-info,
.widget-container .new_box p {
  font-size: 16px !important;
}
.widget-container .tt-dropdown-menu {
  width: 100% !important;
  font-family: "Gilda Display" !important;
}
.widget-container .twitter-typeahead {
  width: 100% !important;
  font-family: "Gilda Display" !important;
}
.widget-container .twitter-typeahead .tt-dropdown-menu {
  width: 100% !important;
  margin-top: 5px !important;
  background-color: #fff !important;
  border: 2px solid #3C3744 !important;
  border-radius: 6px !important;
}
.widget-container .twitter-typeahead .tt-suggestion p {
  padding: 15px 0px !important;
  margin: 0 !important;
  font-size: 16px !important;
  line-height: 1 !important;
}
.widget-container .twitter-typeahead .tt-suggestion.tt-is-under-cursor,
.widget-container .twitter-typeahead .tt-suggestion.tt-cursor {
  color: #fff !important;
  cursor: pointer !important;
  background-color: #383a49 !important;
}
.widget-container .new-form label {
  font-size: 20px;
}
.widget-container .month,
.widget-container .day,
.widget-container .hour,
.widget-container .min {
  width: 70px !important;
}
.widget-container .year {
  width: 110px !important;
}
.widget-container .month,
.widget-container .day,
.widget-container .hour,
.widget-container .min,
.widget-container .year,
.widget-container .ampm_form_set,
.widget-container .form_set,
.widget-container .date-group,
.widget-container .time-group,
.widget-container .form_set.ampm_form_set label.radio {
  display: inline-block !important;
}
.widget-container .ampm_form_set {
  margin-right: 0 !important;
}
.widget-container .ampm_form_set > * {
  display: flex !important;
}
.widget-container .form_set {
  margin-right: 4px !important;
}
.widget-container .form_set:last-child {
  margin-right: 0 !important;
}
.widget-container .form_set.ampm_form_set,
.widget-container .form_set label,
.widget-container .person-label {
  display: inline-block !important;
}
.widget-container .btn-submit {
  margin-top: 20px !important;
  color: #fff !important;
  width: 100% !important;
  margin-bottom: 90px !important;
}
.widget-container #get_report {
  width: 100% !important;
  background-color: var(--purple) !important;
  color: white !important;
  font-family: var(--font-sans-serif) !important;
  font-weight: 400 !important;
  padding: var(--s0) !important;
}
.widget-container.synastry-container #get_report, .widget-container.synastry-container #get_report:hover {
  background-color: #C44536!important;
}
.widget-container .date-group,
.widget-container .time-group {
  vertical-align: top !important;
}
.widget-container #payment-area .date-group {
  margin: 0 !important;
}
.widget-container .has-error label {
  color: #e74c3c !important;
}
.widget-container.widget-birthchart .form_set.ampm_form_set label.radio {
  margin-left: 5px !important;
  min-width: 65px !important;
  padding: 0 !important;
}
.widget-container.widget-birthchart .form_set.ampm_form_set input {
  display: inline-block !important;
  width: 25px !important;
  vertical-align: middle !important;
  margin-top: -4px !important;
}
.widget-container.widget-birthchart .date-container {
  text-align: left !important;
}
.widget-container.widget-birthchart .form-group {
  position: relative !important;
  margin-bottom: 0 !important;
}
.widget-container.widget-birthchart .btn.btn-primary{
  background-color: var(--purple) !important;
  color: #fff !important;
  padding: var( --s0) 0 !important;
  text-transform: uppercase !important;
  outline: 0 !important;
  border: 0 !important;
  font-size: 18px !important;
  letter-spacing: 1.2px;
  font-weight: 200 !important;
}
.widget-container .btn.btn-primary:focus {
  background-color: #9096af !important;
}
.widget-container .btn.btn-primary:hover{
  background-color: #383a49 !important;
}

.widget-container .widget-container .btn {
  padding: 13px 15px 9px !important;
  font-size: 16px !important;
  font-weight: normal !important;
  line-height: 16px !important;
  border: none !important;
  border-radius: 4px !important;
  -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear !important;
  transition: border .25s linear, color .25s linear, background-color .25s linear !important;
  -webkit-font-smoothing: subpixel-antialiased !important;
}

.widget-container .btn-primary {
  color: #fff !important;
  background-color: #6156bd !important;
}
.widget-container .btn-primary:hover, .btn-primary.hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
  color: #fff !important;
  background-color: #48c9b0 !important;
  border: 0 !important;
}
.widget-container .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
  background: #383a49 !important;
  border-color: #383a49 !important;
}



/* chart of moment */
.coa-container {
  max-width: 255px !important;
  border: 1px solid var(--text-black) !important;
  border-bottom: 2px solid var(--text-black) !important;
  padding-top: var(--s-3) !important;
  font-family: "Gilda Display" !important;
  text-align: center !important;
}
.coa-container .coa-title h4{
  color: var(--gold) !important;
  padding: var(--s-1) 0 var(--s1) !important;
  font-size: 18px !important;
  margin: 0 !important;
  font-weight: 700 !important;
  font-family: 'Gilda Display' !important;
}
.widget-container #coa_chart_display {
  margin: 0 auto !important;
  display: block !important;
  position: relative !important;
}
.widget-container.coa-container .logo {
  display: block !important;
  height: 35px !important;
  background-position: -260px 0 !important;
  background-size: 298% !important;
  width: 134px !important;
  display: inline-block !important;
}
.widget-container.coa-container .logo_area .powered {
  width: 88px !important;
  display: inline-block !important;
  vertical-align: bottom !important;
  margin-bottom: 10px !important;
  font-size: 16px !important;
}
.widget-container ul.product-summary {
  padding-inline-start: 18px !important;
  margin: 0 0 26px 25px !important;
  line-height: 25px !important;
}
.widget-container .coa_links a, .widget-container .bc_links a {
  padding: 12px 0 8px !important;
  text-transform: uppercase;
  font-family: 'Josefin Sans';
  letter-spacing: 1.2px;
  font-size: 15px !important;
  color: var(--blue) !important;
  border-bottom: 1px dotted;
  display: inline !important;
}
.widget-container .coa_links a {
  font-size: 12px !important;
}
.widget-container .coa_links {
  padding: 10px 0 var(--s1) !important;
  font-size: 14px !important;
}
.pp-img-wrapper img {
  max-width: 100%;
}
.widget-container .coa_links, .widget-container .bc_links {
  padding-top: 10px !important;
}
.widget-container.coa-container span.logo_area {
  width: 100% !important;
}
.widget-container.coa-container .ibox {
  display: block !important;
  padding: 0 !important;
  padding-top: var(--s-1) !important;
}
.widget-container .section-title h4 {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  border-bottom: 0 !important;
}

@media (min-width: 400px){
  .widget-container.coa-container .aspect_brief_box, .widget-container.coa-container .aspect_extended_box, .widget-container.coa-container .planet_brief_box {
    column-count: 1 !important;
    columns: auto !important;
    margin-left: 0px !important; 
  }
}
.coa_pattern {
  padding: 2px 0 25px !important;
}
.coa_pattern .coa-container .pat_img {
  width: 20px !important;
}
.widget-container.coa-container .planet {
  height: 30px !important;
  margin-right: 4px !important;
}
.widget-container.coa-container .planet .p_name {
  font-size: 16px !important;
  margin: 0 !important;
  line-height: 20px !important;
}
.widget-container.coa-container .p_pos, .widget-container.coa-container .p_sign {
  font-size: 15px !important;
  margin: 0 !important;
  line-height: 20px !important;
}
.widget-container.coa-container .p_attr {
  font-size: 14px !important;
  margin: 4px 0 0 0 !important;
  min-width: 146px !important;
}
.widget-container.coa-container .pl_icon {
  width: 24px !important;
  margin-right: 3px !important;
  border: 0 !important;
  padding: 0 !important;
}
.coa_pattern .pat_img {
    width: 60px !important;
    display: block !important;
    border: 0 !important;
    vertical-align: middle !important;
    margin: 0 auto !important;
    margin-bottom: 10px !important;
}
.coa_pattern span {
    display: inline-block !important;
    width: 97% !important;
    padding-left: 5px !important;
    vertical-align: middle !important;
    font-size: 16px !important;
    line-height: 19px !important;
}
.widget-container.coa-container .chart_details {
    font-size: 14px !important;
    line-height: 19px !important;
    padding-bottom: 18px !important;
}
.widget-container.coa-container #chart_date {
    padding-bottom: 5px !important;
}
.widget-container.coa-container .chart_display_wrapper {
  padding-bottom: 0 !important;
}

/* moon container */
.moon_container.horizontal a.moon_astro {
  display: block !important;
  position: relative !important;
  background: url("/client/common/images/site/widget-logo.8b0d65bfbd2c.svg") no-repeat !important;
  height: 25px !important;
  width: 125px !important;
  margin: var(--s-1) auto 10px !important;
}
.moon_container.vertical a.moon_astro {
  display: block !important;
  position: relative !important;
  background: url("/client/common/images/site/widget-logo.8b0d65bfbd2c.svg") no-repeat !important;
  height: 25px !important;
  width: 125px !important;
  margin: 35px auto 0 !important;
}
.moon_container {
  font-family: "Gilda Display" !important;
  text-align: center !important;
  border: 1px solid var(--text-black) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.moon_container h1 {
  color: var(--gold) !important;
  padding: var(--s-1) 0 var(--s0) !important;
  font-size: 26px !important;
  margin: 0 !important;
  font-family: 'Gilda Display' !important;
  font-weight: 500 !important;
}
.moon_container.vertical {
  width: 250px !important;
  padding: 3px 0 10px !important;
}
.moon_container .date {
  font-size: 16px !important;
}
.moon_container .m_tz, .moon_container .m_hemi {
  font-size: 16px;
  letter-spacing: -0.2px;
}
.moon_container.vertical img {
  width: 125px;
  padding: 10px 0;
  border: 0;
  margin: 0 auto;
}
.moon_container .m_sign {
  color: #357aed;
  padding: 0;
  font-size: 18px;
}
.moon_container .m_name {
  font-size: 21px;
  padding-bottom: 16px;
}
.moon_container .m_full {
  padding-bottom: 3px !important;
}
.moon_container.horizontal {
  width: 100% !important;
  min-width: 350px !important;
  max-width: 400px !important;
  padding-top: 0 !important;
}
.moon_container.horizontal .m_img {
  width: 44% !important;
  display: inline-block !important;
  vertical-align: top !important;
  text-align: center !important;
  margin-top: 15px !important;
}
.moon_container.horizontal .m_img img {
  width: 100% !important;
  max-width: 140px !important;
  border: 0;
  outline: 0;
}
.moon_container.horizontal .m_info {
  width: 50% !important;
  display: inline-block !important;
  margin-top: var(--s1) !important;
  margin-bottom: 15px !important;
  text-align: left !important;
  line-height: 17px !important;
  font-size: 16px !important;
}
.moon_container.horizontal .date,
.moon_container.horizontal .m_tz,
.moon_container.horizontal .m_hemi {
  padding-bottom: var(--s-3)!important;
  font-size: 14px !important;
  font-weight: 300 !important;
}
.moon_container.vertical .m_name {
  padding-bottom: 4px !important;
}
.moon_container.horizontal .m_name {
  font-size: 18px !important;
  padding: var(--s-2) 0 !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.moon_container.horizontal .m_full {
  padding-bottom: 3px !important;
}
.moon_container.horizontal .m_sign {
  padding: var(--s-4) 0 var(--s1) !important;
  font-size: 16px !important;
}
.moon_container.horizontal h1 {
  margin-top: var(--s-1) !important;
}
.moon_container.horizontal .widget-footer {
  padding-bottom: 5px !important;
  border-bottom: 3px solid var(--text-black) !important;
}
.payment-logos {
  text-align: right !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
}
.moon_container.horizontal .moon-icon {
  margin: var(--s0) auto !important;
}
.moon-icon > * {
  width: 120px;
}

/* iframe */
.shop-item {
  display: none;
}
.product-col-right {
  text-align: center !important;
}
.
@media (max-width: 375px) {
  .wframe .widget-container .year {
    width: 95px !important;
  }
  .wframe .widget-container .month, .wframe .widget-container .day, .wframe .widget-container .hour, .wframe .widget-container .min {
    width: 57px !important;
  }
  .wframe .widget-container .form_set.ampm_form_set label.radio {
    margin-left: 0;
    min-width: 55px !important;
  }
  .wframe .widget-container .form_set {
    margin-right: 0 !important;
  }

  .wframe .widget-container .tab_details {
    padding-right: 0 !important;
  }
  .wframe .widget-container .ap_info {
    margin-top: 0 !important;
    margin-left: 0 !important;
  }
  .wframe .widget-container .aspect_pattern_box {
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body {
    margin: 8px 1px;
  }
}

@media (min-width: 400px) {
    .widget-container .chart_display {
        height: 400px !important;
        width: 400px !important;
    }
    .widget-container .c2header {
        margin-left: 0 !important;
    }
    .widget-container .aspect_brief_box, .aspect_extended_box, .planet_brief_box, .houses_extended_box {
        column-count:2 !important;
        font-size: 17px !important;
    }
    .widget-container .aspect_brief_box > div, .aspect_extended_box > div {
        padding: 2px 0 !important;
        padding-bottom: 9px !important;
    }
    .widget-container .ap_planets {
        display: block !important;
    }

}
@media (min-width: 450px) {
    .widget-container .chart_display {
        height: 400px !important;
        width: 400px !important;
    }
    .widget-container .aspect_pattern_box {
      text-align: left !important;
    }
    .widget-container .ap_raphael {
        display: inline-block !important;
        width: 180px !important;
        display: inline-block !important;
    }
    .widget-container .ap_planets {
        width: 180px !important;
        display: inline-block !important;
    }
    .widget-container .ap_info {
        display: inline-block !important;
        max-width: 178px !important;
        margin-left: 10px !important;
    }
    .widget-container .form_set.ampm_form_set label.radio {
      min-width: 75px !important;
    }
}
@media (max-width: 500px){
    #content {
        margin-top: 10px !important;
    }
}
@media (max-width: 767px) {
    .widget-container .no-mobile {
        display: none !important;
    }
    .mobile-only {
        display: inline-block !important;
    }
}
@media (min-width: 768px) {
    #widget_container {
        width: auto;
        min-width: 400px;
        max-width: 575px;
        padding: 20px 40px 40px !important;
    }
    .widget-container .chart_display {
        height: 400px !important;
    }
    .widget-container #raphael {
        display: block !important;
        margin: 0 auto !important;
    }
    .widget-container .chart-container {
        /*min-width: 740px !important;*/
        margin: 0 auto !important;
    }
    .widget-container .ibox_right {
        margin: 0 !important;    
        padding-top: 10px !important;
        width: 40% !important;
    }
    .ibox_right.bc_ibox_right, .ibox_right.coa_ibox_right{ 
        padding-top: 40px !important;
    }
    .widget-container .aspect_brief_box, .widget-container .aspect_extended_box, .widget-container .planet_brief_box {
        columns:90px 2 !important;
        -webkit-columns:90px 2 !important; 
        -moz-columns:90px 2 !important;
        -ms-columns:none !important;
        margin: 0 0 0 15px !important;
        margin-left:10px !important;
        font-size: 16px !important;
        max-width: 765px !important;
    }
    .aspect_pattern_box {
        text-align: left !important;
    }
    .note-text {
        display: block !important;
    }
    .ap_raphael {
        width: 230px !important;
    }
    .ap_planets {
        width: 300px !important;
    }
    .ap_info {
        max-width: 400px !important;
    }
}
@media (min-width: 1200px) {
    .chart_display {
        height: 450px !important;
        width: 450px !important;
        margin: 0 auto !important;
    }
    .ibox_right.coa_ibox_right { 
        padding-top: 10px !important;
    }
    .tight-chart {
        max-width: 960px !important;
    }
}
@media (min-width: 1500px) {
    .chart_display {
        height: 480px !important;
        width: 480px !important;
        margin: 0 auto !important;
    }
    .tight-chart {
        max-width: 1060px !important;
    }
}

/*
  Confirmation Page
*/
.confirmation_container {
  width: auto;
  min-width: auto;
  max-width: 575px;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  border-top: 5px solid #6156bd;
  border-bottom: 5px solid #6156bd;
  padding: 20px 25px;
  font-family: "Gilda Display" !important;
}
.confirmation_container .confirmation {
  line-height: 27px;
  font-size: 19px;
  margin-bottom: 40px;
}
.confirmation_container .confirmation div{    
  font-size: 36px;
  padding-top: 40px;
  padding-bottom: 10px;
  color: #6055bd;
}




#widget_container .widget-container .section-title > * {
  font-size: 13px !important;
  text-transform: uppercase !important;
  margin-bottom: 5px !important;
  display: block !important;
  font-family: 'Josefin Sans' !important;
  letter-spacing: .6px !important;
  color: var(--text-black) !important;
  font-weight: 200 !important;
}
#widget_container .widget-container .section-title + * {
  margin-top: 0px !important;
  padding: 16px 0 !important;
  border-top: 1px solid var(--border-gray-med) !important;
}


#widget_container.alt-form.chart-form form {
  padding: 0 !important;
}
#widget_container.alt-form.chart-form .chart-container {
  max-height: 100% !important;
}
#widget_container.alt-form.chart-form .chart-container > * {
  border-bottom: none !important;
  cursor: default !important;
}
#widget_container.alt-form.chart-form .widget-container .ibox,
#widget_container.alt-form.chart-form .h_attrs {
  font-family: inherit !important;
}
#widget_container.alt-form.chart-form .chart-details > * {
  margin-top: 0 !important;
}
#widget_container.alt-form.chart-form .h_attrs {
  padding: var(--s-3) 0 !important;
}
#widget_container.alt-form.chart-form .section-headline > * {
  text-transform: uppercase !important;
  margin-top: 0 !important;
  margin-bottom: var(--s-3) !important;
  letter-spacing: .08rem !important;
  font-weight: 500 !important;
  font-size: .8rem !important;
  font-family: var(--font-sans-serif) !important;
  color: var(--text-black) !important;
}
#widget_container.alt-form.chart-form .section-headline {
  margin-bottom: var(--s0);
}
#widget_container.alt-form.chart-form .widget-container .chart-cta .cta-wrapper h2 {
  font-family: var(--font-serif-bold) !important;
  margin-top: 0 !important;
}
#widget_container.alt-form.chart-form h8 {
  display: block;
  margin-bottom: var(--s0);
}
#widget_container.alt-form.chart-form .widget-container .shop-item > :first-child {
    margin-bottom: var(--s0);
    padding-bottom: 0;
    border-bottom: none;
}
#widget_container #submit_chart {
  background-color: var(--purple) !important;
}
#payment-area h1 {
  font-family: inherit !important;
}
#payment-area.shop-item span {
  font-size: inherit !important;
}
#payment-area .form-checkout input,
#payment-area .form-checkout label {
  font-size: 18px;
  font-family: var(--font-serif) !important;
  color: var(--text-black);
}

#payment-area .form-checkout .month,
#payment-area .form-checkout .year,
#payment-area .form-checkout .cvc {
  width: 4rem !important;
  padding: var(--s-1) !important;
  text-align: center;
}

#payment-area .widget-slash {
  display: inline!important;
}

#payment-area #submit_payment {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  background-color: var(--purple) !important;
  font-family: var(--font-sans-serif) !important;
  font-weight: 300 !important
}

.shop-item#payment-area .inner-wrap {
  max-width: 100% !important;
}

@media (max-width: 70rem) {
  #widget_container #payment-area form h2 {
      display: block !important;
  }
  #widget_container.chart-form form h2 {
      display: block !important;
  }
}

#widget_container .tt-dataset-all-places > * > * {
    padding: 5px 20px !important;
    margin: 0px !important;
    font-family: "Gilda Display" !important;
}

#widget_container .tt-dataset-all-places p {
    margin: 5px !important;
    text-align: left;
}

#widget_container .tt-dropdown-menu {
    margin-top: var(--s-5) !important;
}

#widget_container h1 {
    font-size: 2rem;
    margin-top: 0;
}

#widget_container .widget-birthchart .date-container > * > * {
    text-align: left;
}

#widget_container .widget-birthchart section,
#widget_container .widget-birthchart .date-container > * > * {
    margin-bottom: 15px !important;
}

#widget_container .widget-birthchart .radio__control {
    display: none !important;
}

#bc_astro a, #coa_astro a, #moon_astro a {
    display: inline;
    color: #54a8d0 !important;
    text-decoration: underline !important;
}

#bc_astro {
    font-family: "Gilda Display" !important;
    margin-top: 0 !important;
    text-align: center;
    display: block;
    font-size: 16px !important;
    font-weight: 500 !important;
    letter-spacing: 0.1px;
}

#coa_astro {
    font-family: "Gilda Display" !important;
    text-align: center;
    display: block;
    font-size: 16px !important;
    font-weight: 500 !important;
    width: 250px;
    line-height: 25px;
    margin-bottom: 20px;
    letter-spacing: 0.1px;
}

#moon_astro {
    font-family: "Gilda Display" !important;
    text-align: center;
    display: block;
    font-size: 16px !important;
    font-weight: 500 !important;
    width: 100% !important;
    max-width: 400px !important;
    line-height: 25px;
    margin-bottom: 20px;
    letter-spacing: 0.1px;
}