/****************
*** Libraries ***
****************/
@import url("https://fonts.googleapis.com/css?family=Nunito&display=swap");
.blocker {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  z-index: 9999;
  padding: 20px;
  box-sizing: border-box;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75);
  text-align: center;
}

.blocker.behind {
  background-color: transparent;
}

.modal {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  z-index: 9999999999;
  max-width: 1000px;
  box-sizing: border-box;
  width: 90%;
  background: #fff;
  padding: 15px 30px;
  border-radius: 8px;
  -o-box-shadow: 0 0 10px #000;
  -ms-box-shadow: 0 0 10px #000;
  box-shadow: 0 0 10px #000;
  text-align: left;
}

.modal a.close-modal {
  position: absolute;
  top: -12.5px;
  right: -12.5px;
  display: block;
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAANjr9RwUqgAAACBjSFJNAABtmAAAc44AAPJxAACDbAAAg7sAANTIAAAx7AAAGbyeiMU/AAAG7ElEQVR42mJkwA8YoZjBwcGB6fPnz4w/fvxg/PnzJ2N6ejoLFxcX47Rp036B5Dk4OP7z8vL+P3DgwD+o3v9QjBUABBALHguZoJhZXV2dVUNDgxNIcwEtZnn27Nl/ZmZmQRYWFmag5c90dHQY5OXl/z98+PDn1atXv79+/foPUN9fIP4HxRgOAAggRhyWMoOwqKgoq6GhIZe3t7eYrq6uHBDb8/Pz27Gysloga/jz588FYGicPn/+/OapU6deOnXq1GdgqPwCOuA31AF/0S0HCCB0xAQNBU4FBQWB0NBQublz59oADV37Hw28ePHi74MHD/6ii3/8+HEFMGQUgQ6WEhQU5AeZBTWTCdkigABC9ylIAZeMjIxQTEyMysaNG/3+/v37AGTgr1+//s2cOfOXm5vbN6Caz8jY1NT0a29v76/v37//g6q9sHfv3khjY2M5YAgJgsyEmg0PYYAAQreUk4+PT8jd3V1l1apVgUAzfoIM2rlz5x9gHH5BtxAdA9PB1zNnzvyB+R6oLxoopgC1nBPZcoAAgiFQnLIDMb+enp5iV1eXBzDeHoI0z58//xcwIX0mZCkMg9S2trb+hFk+ffr0QCkpKVmQ2VA7QHYxAgQQzLesQMwjIiIilZWVZfPu3bstMJ+SYikyBmUzkBnA9HEMyNcCYgmQHVC7mAACCJagOEBBbGdnp7lgwYJEkIavX7/+BcY1SvAaGRl9tba2xohjMTGxL8nJyT+AWQsuxsbG9vnp06e/QWYdPHiwHmiWKlBcCGQXyNcAAQSzmBuoSQqYim3u37+/EKR48uTJv5ANB+bVr7Dga2xs/AkTV1JS+gq0AJyoQIkPWU9aWtoPkPibN2/2A/l6QCwJ9TULQADB4hcY//xKXl5eHt++fbsAUmxhYYHiM1DiAsr9R7ZcVVUVbikIdHd3/0TWIyws/AWYVsByAgICdkAxRSAWAGI2gACClV7C4uLiOv7+/lEgRZ8+ffqLLd6ABck3ZMuB6uCWrlu37je29HDx4kVwQisvL88FFqkaQDERUHADBBAomBl5eHiYgQmLE1hSgQQZgIUD1lJm69atf4HR8R1YKoH5QIPAWWP9+vV/gOI/gHkeQw+wGAXTwAJJ5t+/f/BUDRBA4NIEKMDMyMjICtQIiniG379/4yza7t69+//Lly8oDrty5co/bJaCAEwcZCkwwTJDLWYCCCCwxcDgY3z16hXDnTt3voP4EhISWA0BFgZMwNqHExh3jMiG1tbWsgHjnA2bHmAeBtdWwOL1MycnJ7wAAQggBmi+kgIW/OaKiorJwOLuFShO0LMSMPF9AUYBSpz6+vqixHlOTs4P9MIEWHaDsxSwYMoE2mEGFJcG5SKAAGJCqjv/AbPUn8ePH98ACQQHB6NUmZqamkzABIgSp5s3bwbHORCA1QDLAWZkPc7OzszA8oHl5cuXVy5duvQBGIXwWgoggGA+FgO6xkBNTS28r69vDrT2+Y1cIMDyJchX6KkXVEmAshd6KB06dAic94EO3AzkBwGxPhCLg8ptgACCZyeQp9jZ2b2AmsuAefM8tnxJCk5ISPgOLTKfAdNEOVDMA2QHLDsBBBC8AAFlbmCLwlZISCg5JSVlJizeQAaQaimoWAUFK0g/sGGwHiiWCMS2yAUIQAAxI7c4gEmeFZi4OJ48ecLMzc39CRiEmgEBASxA/QzA8vYvAxEgNjaWZc2aNezAsprp2LFjp4FpZRdQ+AkQvwLij0AMSoC/AQIIXklAC3AVUBoBxmE8sPXQAiyvN8J8fuPGjR/h4eHf0eMdhkENhOPHj8OT+NGjR88BxZuBOA5kJtRseCUBEECMSI0AdmgBDooDaaDl8sASTSkyMlKzpqZGU1paGlS7MABLrX83b978A6zwwakTmE0YgIkSnHpBfGCV+gxYh98qKSk5CeTeAxVeQPwUiN8AMSjxgdLNX4AAYkRqCLBAXcMHtVwSaLkMMMHJAvOq9IQJE9R8fHxElJWV1bEF8aNHj+7t27fvLTDlXwXGLyhoH0OD+DnU0k/QYAa1QP8BBBAjWsuSFWo5LzRYxKFYAljqiAHzqxCwIBEwMTERBdZeoOYMA7Bl+RFYEbwB5oS3IA9D4/IFEL+E4nfQ6IDFLTgvAwQQI5ZmLRtSsINSuyA0uwlBUyQPMPWD20/AKo8ByP4DTJTfgRgUjB+gFoEc8R6amGDB+wu5mQsQQIxYmrdMUJ+zQTM6NzQEeKGO4UJqOzFADQMZ/A1qCSzBfQXi71ALfyM17sEAIIAY8fQiWKAYFgIwzIbWTv4HjbdfUAf8RPLhH1icojfoAQKIEU8bG9kRyF0aRiz6YP0k5C4LsmUY9TtAADEyEA+IVfufGEUAAQYABejinPr4dLEAAAAASUVORK5CYII=") no-repeat 0 0;
}

.modal-spinner {
  display: none;
  width: 64px;
  height: 64px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-right: -32px;
  margin-top: -32px;
  background: url("data:image/gif;base64,R0lGODlhIAAgAPMAABEREf///0VFRYKCglRUVG5ubsvLy62trTQ0NCkpKU5OTuLi4vr6+gAAAAAAAAAAACH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAIAAgAAAE5xDISWlhperN52JLhSSdRgwVo1ICQZRUsiwHpTJT4iowNS8vyW2icCF6k8HMMBkCEDskxTBDAZwuAkkqIfxIQyhBQBFvAQSDITM5VDW6XNE4KagNh6Bgwe60smQUB3d4Rz1ZBApnFASDd0hihh12BkE9kjAJVlycXIg7CQIFA6SlnJ87paqbSKiKoqusnbMdmDC2tXQlkUhziYtyWTxIfy6BE8WJt5YJvpJivxNaGmLHT0VnOgSYf0dZXS7APdpB309RnHOG5gDqXGLDaC457D1zZ/V/nmOM82XiHRLYKhKP1oZmADdEAAAh+QQACgABACwAAAAAIAAgAAAE6hDISWlZpOrNp1lGNRSdRpDUolIGw5RUYhhHukqFu8DsrEyqnWThGvAmhVlteBvojpTDDBUEIFwMFBRAmBkSgOrBFZogCASwBDEY/CZSg7GSE0gSCjQBMVG023xWBhklAnoEdhQEfyNqMIcKjhRsjEdnezB+A4k8gTwJhFuiW4dokXiloUepBAp5qaKpp6+Ho7aWW54wl7obvEe0kRuoplCGepwSx2jJvqHEmGt6whJpGpfJCHmOoNHKaHx61WiSR92E4lbFoq+B6QDtuetcaBPnW6+O7wDHpIiK9SaVK5GgV543tzjgGcghAgAh+QQACgACACwAAAAAIAAgAAAE7hDISSkxpOrN5zFHNWRdhSiVoVLHspRUMoyUakyEe8PTPCATW9A14E0UvuAKMNAZKYUZCiBMuBakSQKG8G2FzUWox2AUtAQFcBKlVQoLgQReZhQlCIJesQXI5B0CBnUMOxMCenoCfTCEWBsJColTMANldx15BGs8B5wlCZ9Po6OJkwmRpnqkqnuSrayqfKmqpLajoiW5HJq7FL1Gr2mMMcKUMIiJgIemy7xZtJsTmsM4xHiKv5KMCXqfyUCJEonXPN2rAOIAmsfB3uPoAK++G+w48edZPK+M6hLJpQg484enXIdQFSS1u6UhksENEQAAIfkEAAoAAwAsAAAAACAAIAAABOcQyEmpGKLqzWcZRVUQnZYg1aBSh2GUVEIQ2aQOE+G+cD4ntpWkZQj1JIiZIogDFFyHI0UxQwFugMSOFIPJftfVAEoZLBbcLEFhlQiqGp1Vd140AUklUN3eCA51C1EWMzMCezCBBmkxVIVHBWd3HHl9JQOIJSdSnJ0TDKChCwUJjoWMPaGqDKannasMo6WnM562R5YluZRwur0wpgqZE7NKUm+FNRPIhjBJxKZteWuIBMN4zRMIVIhffcgojwCF117i4nlLnY5ztRLsnOk+aV+oJY7V7m76PdkS4trKcdg0Zc0tTcKkRAAAIfkEAAoABAAsAAAAACAAIAAABO4QyEkpKqjqzScpRaVkXZWQEximw1BSCUEIlDohrft6cpKCk5xid5MNJTaAIkekKGQkWyKHkvhKsR7ARmitkAYDYRIbUQRQjWBwJRzChi9CRlBcY1UN4g0/VNB0AlcvcAYHRyZPdEQFYV8ccwR5HWxEJ02YmRMLnJ1xCYp0Y5idpQuhopmmC2KgojKasUQDk5BNAwwMOh2RtRq5uQuPZKGIJQIGwAwGf6I0JXMpC8C7kXWDBINFMxS4DKMAWVWAGYsAdNqW5uaRxkSKJOZKaU3tPOBZ4DuK2LATgJhkPJMgTwKCdFjyPHEnKxFCDhEAACH5BAAKAAUALAAAAAAgACAAAATzEMhJaVKp6s2nIkolIJ2WkBShpkVRWqqQrhLSEu9MZJKK9y1ZrqYK9WiClmvoUaF8gIQSNeF1Er4MNFn4SRSDARWroAIETg1iVwuHjYB1kYc1mwruwXKC9gmsJXliGxc+XiUCby9ydh1sOSdMkpMTBpaXBzsfhoc5l58Gm5yToAaZhaOUqjkDgCWNHAULCwOLaTmzswadEqggQwgHuQsHIoZCHQMMQgQGubVEcxOPFAcMDAYUA85eWARmfSRQCdcMe0zeP1AAygwLlJtPNAAL19DARdPzBOWSm1brJBi45soRAWQAAkrQIykShQ9wVhHCwCQCACH5BAAKAAYALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiRMDjI0Fd30/iI2UA5GSS5UDj2l6NoqgOgN4gksEBgYFf0FDqKgHnyZ9OX8HrgYHdHpcHQULXAS2qKpENRg7eAMLC7kTBaixUYFkKAzWAAnLC7FLVxLWDBLKCwaKTULgEwbLA4hJtOkSBNqITT3xEgfLpBtzE/jiuL04RGEBgwWhShRgQExHBAAh+QQACgAHACwAAAAAIAAgAAAE7xDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfZiCqGk5dTESJeaOAlClzsJsqwiJwiqnFrb2nS9kmIcgEsjQydLiIlHehhpejaIjzh9eomSjZR+ipslWIRLAgMDOR2DOqKogTB9pCUJBagDBXR6XB0EBkIIsaRsGGMMAxoDBgYHTKJiUYEGDAzHC9EACcUGkIgFzgwZ0QsSBcXHiQvOwgDdEwfFs0sDzt4S6BK4xYjkDOzn0unFeBzOBijIm1Dgmg5YFQwsCMjp1oJ8LyIAACH5BAAKAAgALAAAAAAgACAAAATwEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GGl6NoiPOH16iZKNlH6KmyWFOggHhEEvAwwMA0N9GBsEC6amhnVcEwavDAazGwIDaH1ipaYLBUTCGgQDA8NdHz0FpqgTBwsLqAbWAAnIA4FWKdMLGdYGEgraigbT0OITBcg5QwPT4xLrROZL6AuQAPUS7bxLpoWidY0JtxLHKhwwMJBTHgPKdEQAACH5BAAKAAkALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GAULDJCRiXo1CpGXDJOUjY+Yip9DhToJA4RBLwMLCwVDfRgbBAaqqoZ1XBMHswsHtxtFaH1iqaoGNgAIxRpbFAgfPQSqpbgGBqUD1wBXeCYp1AYZ19JJOYgH1KwA4UBvQwXUBxPqVD9L3sbp2BNk2xvvFPJd+MFCN6HAAIKgNggY0KtEBAAh+QQACgAKACwAAAAAIAAgAAAE6BDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfYIDMaAFdTESJeaEDAIMxYFqrOUaNW4E4ObYcCXaiBVEgULe0NJaxxtYksjh2NLkZISgDgJhHthkpU4mW6blRiYmZOlh4JWkDqILwUGBnE6TYEbCgevr0N1gH4At7gHiRpFaLNrrq8HNgAJA70AWxQIH1+vsYMDAzZQPC9VCNkDWUhGkuE5PxJNwiUK4UfLzOlD4WvzAHaoG9nxPi5d+jYUqfAhhykOFwJWiAAAIfkEAAoACwAsAAAAACAAIAAABPAQyElpUqnqzaciSoVkXVUMFaFSwlpOCcMYlErAavhOMnNLNo8KsZsMZItJEIDIFSkLGQoQTNhIsFehRww2CQLKF0tYGKYSg+ygsZIuNqJksKgbfgIGepNo2cIUB3V1B3IvNiBYNQaDSTtfhhx0CwVPI0UJe0+bm4g5VgcGoqOcnjmjqDSdnhgEoamcsZuXO1aWQy8KAwOAuTYYGwi7w5h+Kr0SJ8MFihpNbx+4Erq7BYBuzsdiH1jCAzoSfl0rVirNbRXlBBlLX+BP0XJLAPGzTkAuAOqb0WT5AH7OcdCm5B8TgRwSRKIHQtaLCwg1RAAAOwAAAAAAAAAAAA==") #111 no-repeat center center;
  border-radius: 8px;
}

/*
 * Container style
 */
.ps {
  overflow: hidden;
  overflow-anchor: none;
  -ms-overflow-style: none;
  touch-action: auto;
  -ms-touch-action: auto;
}

/*
* Scrollbar rail styles
*/
.ps__rail-x {
  display: none;
  opacity: 0;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  height: 15px;
  /* there must be 'bottom' or 'top' for ps__rail-x */
  bottom: 0px;
  /* please don't change 'position' */
  position: absolute;
}

.ps__rail-y {
  display: none;
  opacity: 0;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  width: 15px;
  /* there must be 'right' or 'left' for ps__rail-y */
  right: 0;
  /* please don't change 'position' */
  position: absolute;
}

.ps--active-x > .ps__rail-x,
.ps--active-y > .ps__rail-y {
  display: block;
  background-color: transparent;
}

.ps:hover > .ps__rail-x,
.ps:hover > .ps__rail-y,
.ps--focus > .ps__rail-x,
.ps--focus > .ps__rail-y,
.ps--scrolling-x > .ps__rail-x,
.ps--scrolling-y > .ps__rail-y {
  opacity: 0.6;
}

.ps .ps__rail-x:hover,
.ps .ps__rail-y:hover,
.ps .ps__rail-x:focus,
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
  background-color: #eee;
  opacity: 0.9;
}

/*
   * Scrollbar thumb styles
   */
.ps__thumb-x {
  background-color: #aaa;
  border-radius: 6px;
  transition: background-color 0.2s linear, height 0.2s ease-in-out;
  -webkit-transition: background-color 0.2s linear, height 0.2s ease-in-out;
  height: 6px;
  /* there must be 'bottom' for ps__thumb-x */
  bottom: 2px;
  /* please don't change 'position' */
  position: absolute;
}

.ps__thumb-y {
  background-color: #aaa;
  border-radius: 6px;
  transition: background-color 0.2s linear, width 0.2s ease-in-out;
  -webkit-transition: background-color 0.2s linear, width 0.2s ease-in-out;
  width: 6px;
  /* there must be 'right' for ps__thumb-y */
  right: 2px;
  /* please don't change 'position' */
  position: absolute;
}

.ps__rail-x:hover > .ps__thumb-x,
.ps__rail-x:focus > .ps__thumb-x,
.ps__rail-x.ps--clicking .ps__thumb-x {
  background-color: #999;
  height: 11px;
}

.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
  background-color: #999;
  width: 11px;
}

/* MS supports */
@supports (-ms-overflow-style: none) {
  .ps {
    overflow: auto;
  }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .ps {
    overflow: auto;
  }
}

/*************
*** abstracts ***
*************/
.login-master-wrapper .login-content .login-body .form-group input, #settings .settings-container .credentials button, .cookie-for-all-pages-bottom-fixed-button button {
  border-radius: 2px;
}

#chat-container .chat-page__wrapper .chat-menu, .profile-view-wrapper .profile-view .about-me__wrapper .profile-about__description--edit, #content-container .modalHolder .confirmMailModal .row:not(.row3) input, .wide-header .search-menu .search-form-wrapper form .search_input, .wide-header--menu__item {
  border-radius: 4px;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner {
  border-radius: 8px;
}

.profile-view-wrapper .profile-view .reading__wrapper--feature, .profile {
  border-radius: 12px;
}

.activeMember_inner,
.checkSub_inner, .message__wrapper--container .message-item, .message__wrapper--container .message-item.new_msg::after, .message__wrapper--container .message-item .message-content, .unsubscribe-prompt, .tarot__cards--advisor__wrapp, #horoscope-wrapp .horoscope_advisor__wrapp, #logout-prompt, #dimScreen .dimScreenInner {
  border-radius: 16px;
}

/* END COLORS: */
/*********************
*** App blades ***
*********************/
.login__page {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.login__page--bg, .register__page--bg, .forgot-password__page--bg {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9) 3.25%, rgba(0, 0, 0, 0) 51.56%, rgba(0, 0, 0, 0.83) 68.75%, #000000 100%), linear-gradient(0deg, rgba(42, 45, 67, 0.5), rgba(42, 45, 67, 0.5)), url("/astro/astro-v1/img/background.jpg");
  filter: blur(1px);
  z-index: -1;
  background-size: cover;
  background-position: center;
  transition: transform 0.1s linear;
  transform: scale(1.05);
}

.login__page--bg.zoom, .zoom.register__page--bg, .zoom.forgot-password__page--bg {
  filter: blur(4px);
  transform: scale(1.1);
}

.login__page--header {
  position: relative;
  display: block;
  max-width: 400px;
  width: 100%;
  margin: auto;
  margin-top: 16px;
  z-index: 3;
}

.login__page--header__left {
  position: absolute;
  left: 12px;
}

.login__page--header__left img {
  display: none;
  cursor: pointer;
  height: 32px;
}

.login__page--header__more {
  position: absolute;
  right: 12px;
}

.login__page--header__more img {
  cursor: pointer;
  height: 32px;
}

.login__page--header .logo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

.login__page--header .logo a {
  display: inline-block;
  font-size: 32px;
  line-height: 1;
  font-weight: bold;
  color: #08273C;
  text-decoration: none;
  transition: all 0.1s;
}

.login-master-wrapper {
  max-width: 400px;
  width: 100%;
  margin: 80px auto;
  padding: 0 20px;
}

.login-master-wrapper .wellcome-msg {
  transform: scale(1);
}

.login-master-wrapper .wellcome-msg.hidden {
  display: none;
  transform: scale(0);
}

.login-master-wrapper .wellcome-msg h4 {
  line-height: 3.3rem;
  text-align: center;
  color: #ffffff;
  font-weight: 500;
}

.login-master-wrapper .login-content {
  opacity: 0;
  visibility: hidden;
  height: 0;
  transform: translateY(20px);
}

.login-master-wrapper .login-content.show {
  height: 100%;
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  height: auto;
  transition: transform 0.1s;
  margin-bottom: 0 !important;
}

.login-master-wrapper .login-content.show .login-body {
  height: auto;
  overflow: visible;
}

.login-master-wrapper .login-content .login-header h4 {
  color: #ffffff;
  font-weight: 500;
}

.login-master-wrapper .login-content .login-body {
  margin-bottom: 15px;
  height: 0;
  overflow: hidden;
}

.login-master-wrapper .login-content .login-body .login-p {
  color: #A0A0A0;
  font-size: 12px;
  line-height: 14.5px;
}

.login-master-wrapper .login-content .login-body label {
  display: block;
  line-height: 16px;
  color: #ffffff;
  margin-top: 21px;
  margin-bottom: 8px;
}

.login-master-wrapper .login-content .login-body label i {
  color: #08273C;
}

.login-master-wrapper .login-content .login-body .form-group {
  position: relative;
}

.login-master-wrapper .login-content .login-body .form-group input {
  display: block;
  width: 100%;
  background-color: #77E0FC;
  border: 1px solid #A0A0A0;
  outline: none;
  padding: 15px;
  padding-left: 40px;
  color: #A0A0A0;
}

.login-master-wrapper .login-content .login-body .form-group img {
  position: absolute;
  top: 24px;
  left: 12px;
  transform: translateY(-50%);
  width: 16px;
}

.login-master-wrapper .login-content .login-body .form-group p {
  font-size: 1.4rem;
  color: #FC5185;
  line-height: 1.3;
  text-shadow: 0 0 15px #000000;
}

.login-master-wrapper .login-content .login-body .forgot-password {
  display: block;
  text-align: right;
  margin: 8px 0 12px;
}

.login-master-wrapper .login-content .login-body .forgot-password a {
  color: #A0A0A0;
  font-size: 12px;
  display: inline-block;
}

.login-master-wrapper .login-content .login-body #log_spinner {
  text-align: center;
  margin-top: 8px;
}

.register__box {
  margin: 40px auto 0;
}

.register__box--btn {
  color: #ffffff;
  text-align: center;
  text-decoration: none;
}

.register__box--btn:last-child {
  margin-top: 14px;
}

.tos__layout {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.tos__box {
  display: none;
}

.tos__box--btn {
  position: absolute;
  top: 50%;
  left: calc(50% - 20px);
  transform: translate(-50%, -50%);
  background: #77E0FC;
  border: 1px solid #A0A0A0;
  border-radius: 4px;
  min-width: 220px;
  width: auto;
  margin: 0 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.tos__box--btn img {
  margin: 10px;
}

.tos__box--btn span {
  color: #ffffff;
  padding: 8px;
  padding-left: 0;
  font-size: 1.4rem;
  font-weight: 500;
}

.register__page {
  height: 100%;
  overflow: auto;
}

.register__page .login__page--header {
  height: 32px;
}

.register__page .login__page--header__left img {
  display: block;
}

.register__page .login__page--header .logo a {
  font-weight: bold;
  transform: scale(0.8);
}

.register__page .login-master-wrapper {
  position: static;
  left: initial;
  transform: initial;
  height: 100%;
  margin-top: 60px;
  margin-bottom: 0;
}

.register__page .login-master-wrapper .login-content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  height: auto;
}

.register__page .login-master-wrapper .login-content .login-body .form-group.mb32 {
  margin-bottom: 21px;
}

.register__page .login-master-wrapper .login-content .login-body #reg_spinner {
  text-align: center;
}

.register__page .login-master-wrapper .login-content .login-body .register.btn, .register__page .login-master-wrapper .login-content .login-body .register.pricing__container--btn {
  margin-top: 21px;
}

.forgot-password__page {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.forgot-password__page .login__page--header__left img {
  display: block;
}

.forgot-password__page .login__page--header .logo a {
  font-weight: bold;
  transform: scale(0.8);
}

.forgot-password__page .login-master-wrapper .login-content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  height: auto;
}

.forgot-password__page .login-master-wrapper .login-content .login-body .form-group {
  margin-bottom: 32px;
}

.forgot-password__page .login-master-wrapper .login-content .login-body .form-group input:-internal-autofill-selected {
  background-color: #77E0FC;
}

.forgot-password__page .login-master-wrapper .login-content .login-body .form-group #msg_password {
  position: absolute;
}

.forgot-password__page .login-master-wrapper .login-content .login-body .form-group #msg_password span {
  color: #FC5185 !important;
  font-size: 14px !important;
}

.forgot-password__page .login-master-wrapper .login-content .login-body #email-link-box p {
  font-size: 14px;
  color: #ffffff;
}

#maindata.blured {
  filter: blur(10px);
}

#maindata .home__wrapp {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  row-gap: 16px;
  max-width: 500px;
}

@media screen and (min-width: 800px) {
  #maindata .home__wrapp {
    max-width: 900px;
    row-gap: 24px;
  }
}

@media screen and (min-width: 1200px) {
  #maindata .home__wrapp {
    max-width: 1240px;
    row-gap: 48px;
  }
}

#maindata .home__wrapp--profiles {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}

@media screen and (min-width: 800px) {
  #maindata .home__wrapp--profiles {
    row-gap: 32px;
  }
}

@media screen and (min-width: 1200px) {
  #maindata .home__wrapp--profiles {
    row-gap: 64px;
  }
}

#maindata .home__wrapp--profiles .section {
  /*  &.guidance-clarity {
            .section__wrapp--slider {
              .swiper {
              }
            }
          } */
  /* &.energy-wellness {
            .section__wrapp--slider {
              .swiper {
                &-swiper {
                }
              }
            }
          } */
}

#maindata .home__wrapp--profiles .section__wrapp {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}

#maindata .home__wrapp--profiles .section__wrapp--back {
  display: flex;
  flex-direction: row;
  column-gap: 4px;
  align-items: center;
  border-radius: 4px;
  background: #092C43;
  padding: 4px 16px 4px 6px;
  margin-left: 0;
  margin-right: auto;
  color: #ffffff;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  cursor: pointer;
}

#maindata .home__wrapp--profiles .section__wrapp--head {
  display: flex;
  flex-direction: row;
  gap: 16px;
}

#maindata .home__wrapp--profiles .section__wrapp--head__title {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#maindata .home__wrapp--profiles .section__wrapp--head__title div {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  column-gap: 8px;
}

#maindata .home__wrapp--profiles .section__wrapp--head__title div img {
  display: block;
  width: 48px;
  height: auto;
}

@media screen and (max-width: 37.5em) {
  #maindata .home__wrapp--profiles .section__wrapp--head__title div img {
    width: 32px;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--head__title div h4 {
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@media screen and (max-width: 37.5em) {
  #maindata .home__wrapp--profiles .section__wrapp--head__title div h4 {
    font-size: 1.8rem;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--head__title p {
  font-size: 1.6rem;
  line-height: 1.4;
  color: #ffffff;
}

@media screen and (max-width: 37.5em) {
  #maindata .home__wrapp--profiles .section__wrapp--head__title p {
    font-size: 1.4rem;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--head > button {
  display: none;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 4px;
  padding: 4px 0 4px 8px;
  border: none;
  outline: none;
  border-radius: 4px;
  background: #092c43;
  cursor: pointer;
  margin: auto;
}

#maindata .home__wrapp--profiles .section__wrapp--head > button span {
  white-space: nowrap;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 14px;
}

@media (min-width: 800px) {
  #maindata .home__wrapp--profiles .section__wrapp--head > button {
    display: flex;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--slider {
  overflow-y: auto;
}

@media screen and (max-width: 31.25em) {
  #maindata .home__wrapp--profiles .section__wrapp--slider {
    margin: 0 -16px;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper {
  width: 100%;
  height: 100%;
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper-wrapper {
  display: flex;
  flex-direction: row;
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  min-width: 290px;
  background: url("/astro/astro-v1/img/bg.png"), -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  border-radius: 12px;
  cursor: grab;
  padding: 8px 12px;
}

@media screen and (max-width: 22.4375em) {
  #maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide {
    min-width: 270px;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide img {
  flex-shrink: 0;
  display: block;
  width: 48px;
  height: auto;
  margin-right: 4px;
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide p {
  flex-grow: 1;
  color: #ffffff;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.2;
  margin-right: 8px;
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide span {
  flex-shrink: 0;
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide span img {
  display: block;
  width: 12px;
  height: auto;
}

#maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide:not(:last-of-type) {
  margin-right: 16px;
}

@media screen and (max-width: 31.25em) {
  #maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide:first-of-type {
    margin-left: 16px;
  }
}

@media screen and (max-width: 31.25em) {
  #maindata .home__wrapp--profiles .section__wrapp--slider .swiper-slide:last-of-type {
    margin-right: 16px;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--profiles {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  margin: 0 auto;
  gap: 24px;
}

@media screen and (min-width: 800px) {
  #maindata .home__wrapp--profiles .section__wrapp--profiles {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
  }
}

@media screen and (min-width: 1200px) {
  #maindata .home__wrapp--profiles .section__wrapp--profiles {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (min-width: 1200px) {
  #maindata .home__wrapp--profiles .section__wrapp--profiles .profile:last-child {
    display: none;
  }
}

#maindata .home__wrapp--profiles .section__wrapp > button {
  background: transparent;
  border: none;
  outline: none;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 4px;
  padding: 4px 0;
  cursor: pointer;
  margin: auto;
}

#maindata .home__wrapp--profiles .section__wrapp > button span {
  white-space: nowrap;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 14px;
}

@media (min-width: 800px) {
  #maindata .home__wrapp--profiles .section__wrapp > button {
    display: none;
  }
}

#maindata .home__wrapp--profiles .section.recommended {
  border-radius: 24px;
  background: #0c2535;
  padding: 48px;
}

@media screen and (max-width: 62.5em) {
  #maindata .home__wrapp--profiles .section.recommended {
    padding: 32px;
  }
}

@media screen and (max-width: 37.5em) {
  #maindata .home__wrapp--profiles .section.recommended {
    padding: 24px 16px;
  }
}

#maindata .home__wrapp--profiles .section.recommended .section__wrapp--head button {
  border-radius: 4px;
  background: #031d2e;
}

#maindata .home__wrapp--profiles .section.recommended .section__wrapp--head button span {
  background: var(--blue-gradian, linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#maindata .home__wrapp--profiles .section.recommended button {
  display: flex;
  background: #031d2e;
  column-gap: 4px;
  padding: 4px 0 4px 8px;
  border-radius: 4px;
}

#maindata .home__wrapp--profiles .section.career-insights .section__wrapp--slider .swiper-slide {
  background-color: #16db93;
  background-image: url("/astro/astro-v1/img/bg.png");
}

#maindata .home__wrapp--profiles .section.love-relationship-family .section__wrapp--slider .swiper-slide {
  background-color: #2575c3;
  background-image: url("/astro/astro-v1/img/bg.png");
}

#maindata .perfect-advisor {
  position: fixed;
  inset: 0;
  z-index: 9;
  background-image: url("/astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, #031d2e 0%, #1184d1 100.54%);
  background-size: cover;
  background-attachment: fixed;
  padding: 32px;
  overflow-y: auto;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor {
    padding: 16px;
  }
}

#maindata .perfect-advisor.welcome {
  background-image: none;
  background-color: #031d2e;
}

#maindata .perfect-advisor .quiz__nav {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

#maindata .perfect-advisor .quiz__nav--back {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  border-radius: 4px;
  background: #0c4980;
  padding: 8px;
  cursor: pointer;
}

#maindata .perfect-advisor .quiz__nav--back img {
  display: block;
  width: auto;
  height: 16px;
}

#maindata .perfect-advisor .quiz__nav--back label {
  color: #ffffff;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

#maindata .perfect-advisor .quiz__nav--back::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#maindata .perfect-advisor .quiz__nav--close {
  display: block;
  margin-left: auto;
  width: 24px;
}

#maindata .perfect-advisor .quiz__nav--close img {
  display: block;
  width: 100%;
  height: auto;
  cursor: pointer;
}

#maindata .perfect-advisor .quiz__dots {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 8px;
  width: auto;
  margin: 0 auto;
}

#maindata .perfect-advisor .quiz__dot {
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: rgba(188, 168, 244, 0.4);
}

#maindata .perfect-advisor .quiz__dot.active {
  background-color: #33b9de;
}

#maindata .perfect-advisor .quiz__question {
  text-align: center;
  color: #ffffff;
  font-size: 3.2rem;
}

@media screen and (max-width: 47.9375em) {
  #maindata .perfect-advisor .quiz__question {
    font-size: 2.6rem;
  }
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor .quiz__question {
    font-size: 2.2rem;
  }
}

#maindata .perfect-advisor .quiz__description {
  text-align: center;
  color: #ffffff;
}

#maindata .perfect-advisor .quiz__percentage {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 3.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor .quiz__percentage {
    font-size: 2.4rem;
  }
}

#maindata .perfect-advisor .quiz__percentage img {
  display: block;
  width: 52px;
  height: auto;
}

#maindata .perfect-advisor .quiz__spinner {
  display: block;
  width: 175px;
  height: 175px;
  background: url("/astro/astro-v1/img/perfect_advisor/spinner.svg");
  background-size: cover;
  background-position: center;
}

#maindata .perfect-advisor .quiz__spinner.animate {
  animation: spinner 1s infinite linear;
}

@media screen and (max-width: 56.25em) {
  #maindata .perfect-advisor .quiz__spinner {
    width: 140px;
    height: 140px;
  }
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor .quiz__spinner {
    width: 130px;
    height: 130px;
  }
}

#maindata .perfect-advisor__top {
  width: 100%;
  padding: 0 68px;
  margin-bottom: 80px;
  display: flex;
  flex-direction: column;
  row-gap: 26px;
}

@media screen and (max-width: 56.25em) {
  #maindata .perfect-advisor__top {
    padding: 0;
    margin-bottom: 48px;
  }
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__top {
    margin-bottom: 32px;
    row-gap: 16px;
  }
}

#maindata .perfect-advisor__start {
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  row-gap: 48px;
}

@media screen and (max-width: 56.25em) {
  #maindata .perfect-advisor__start {
    row-gap: 32px;
  }
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__start {
    row-gap: 24px;
  }
}

#maindata .perfect-advisor__start > div {
  display: flex;
  flex-direction: column;
  padding: 0 64px;
  row-gap: 24px;
}

@media screen and (max-width: 56.25em) {
  #maindata .perfect-advisor__start > div {
    padding: 0 32px;
  }
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__start > div {
    padding: 0;
    row-gap: 16px;
  }
}

#maindata .perfect-advisor__start > div h4 {
  text-align: center;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#maindata .perfect-advisor__start > div p {
  text-align: center;
  color: rgba(255, 255, 255, 0.7);
}

#maindata .perfect-advisor__start button {
  max-width: 388px;
  width: 100%;
  outline: none;
  border: none;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  color: #ffffff;
  border-radius: 100px;
  margin: 0 auto;
  padding: 16px 32px;
  cursor: pointer;
}

#maindata .perfect-advisor__feeling, #maindata .perfect-advisor__topic, #maindata .perfect-advisor__insights {
  max-width: 570px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  row-gap: 56px;
}

#maindata .perfect-advisor__feeling--q, #maindata .perfect-advisor__topic--q, #maindata .perfect-advisor__insights--q {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

#maindata .perfect-advisor__feeling--a {
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px;
}

#maindata .perfect-advisor__feeling--a span {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  border: 1px solid #fff;
  cursor: pointer;
  width: 130px;
  height: 96px;
}

#maindata .perfect-advisor__feeling--a span::after {
  position: absolute;
  inset: 0;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__feeling--a span {
    width: 120px;
    height: 86px;
  }
}

@media screen and (max-width: 22.4375em) {
  #maindata .perfect-advisor__feeling--a span {
    width: 116px;
    height: 76px;
  }
}

#maindata .perfect-advisor__feeling--a span img {
  display: block;
  width: 48px;
  height: auto;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__feeling--a span img {
    width: 42px;
  }
}

@media screen and (max-width: 22.4375em) {
  #maindata .perfect-advisor__feeling--a span img {
    width: 36px;
  }
}

#maindata .perfect-advisor__topic--a, #maindata .perfect-advisor__insights--a {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__topic--a, #maindata .perfect-advisor__insights--a {
    gap: 16px;
  }
}

#maindata .perfect-advisor__topic--a span, #maindata .perfect-advisor__insights--a span {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 156px;
  height: 127px;
  padding: 0 16px;
  border-radius: 8px;
  border: 2px solid #1d4cb3;
  background: #e8e8fc;
  cursor: pointer;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__topic--a span, #maindata .perfect-advisor__insights--a span {
    width: 136px;
    height: 116px;
    padding: 0 12px;
  }
}

@media screen and (max-width: 22.4375em) {
  #maindata .perfect-advisor__topic--a span, #maindata .perfect-advisor__insights--a span {
    width: 116px;
    height: 96px;
    padding: 0 12px;
    gap: 6px;
  }
}

#maindata .perfect-advisor__topic--a span img, #maindata .perfect-advisor__insights--a span img {
  display: block;
  width: auto;
  height: 48px;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__topic--a span img, #maindata .perfect-advisor__insights--a span img {
    height: 36px;
  }
}

@media screen and (max-width: 22.4375em) {
  #maindata .perfect-advisor__topic--a span img, #maindata .perfect-advisor__insights--a span img {
    height: 26px;
  }
}

#maindata .perfect-advisor__topic--a span label, #maindata .perfect-advisor__insights--a span label {
  color: #08273c;
  text-align: center;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.4;
}

@media screen and (max-width: 22.4375em) {
  #maindata .perfect-advisor__topic--a span label, #maindata .perfect-advisor__insights--a span label {
    font-size: 1.4rem;
    line-height: 1.2;
  }
}

#maindata .perfect-advisor__progres, #maindata .perfect-advisor__final {
  max-width: 540px;
  width: 100%;
  border-radius: 26px;
  background: rgba(15, 53, 97, 0.7);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  padding: 48px;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__progres, #maindata .perfect-advisor__final {
    row-gap: 24px;
    padding: 24px 16px;
  }
}

#maindata .perfect-advisor__progres--loader, #maindata .perfect-advisor__final--loader {
  position: relative;
  margin: 0 auto;
}

#maindata .perfect-advisor__progres ul li, #maindata .perfect-advisor__final ul li {
  display: none;
}

#maindata .perfect-advisor__progres ul li.active, #maindata .perfect-advisor__final ul li.active {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 16px;
}

#maindata .perfect-advisor__progres ul li.active > span, #maindata .perfect-advisor__final ul li.active > span {
  color: #FFF;
  animation: change-color .7s 1s ease-in forwards;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__progres ul li, #maindata .perfect-advisor__final ul li {
    column-gap: 8px;
  }
}

#maindata .perfect-advisor__progres ul li > img, #maindata .perfect-advisor__final ul li > img {
  display: block;
  width: auto;
  height: 28px;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__progres ul li > img, #maindata .perfect-advisor__final ul li > img {
    height: 22px;
  }
}

#maindata .perfect-advisor__progres ul li > span, #maindata .perfect-advisor__final ul li > span {
  color: #ffffff;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

#maindata .perfect-advisor__progres ul li:not(:last-of-type), #maindata .perfect-advisor__final ul li:not(:last-of-type) {
  margin-bottom: 24px;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__progres ul li:not(:last-of-type), #maindata .perfect-advisor__final ul li:not(:last-of-type) {
    margin-bottom: 16px;
  }
}

#maindata .perfect-advisor__progres ul li > div p, #maindata .perfect-advisor__final ul li > div p {
  font-style: normal;
  font-weight: 700;
}

#maindata .perfect-advisor__progres ul li > div span, #maindata .perfect-advisor__final ul li > div span {
  color: #ffffff;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

@media screen and (max-width: 47.9375em) {
  #maindata .perfect-advisor__progres ul li > div span, #maindata .perfect-advisor__final ul li > div span {
    font-size: 1.4rem;
  }
}

#maindata .perfect-advisor__final ul > li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 16px;
}

#maindata .perfect-advisor__final ul > li > img {
  height: 40px;
}

#maindata .perfect-advisor__final > button {
  display: block;
  max-width: 388px;
  width: 100%;
  margin: 0 auto;
  border-radius: 32px;
  border: 1px solid #1d4cb3;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  cursor: pointer;
  padding: 16px 24px;
  color: #ffffff;
  text-align: center;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

@media screen and (max-width: 31.25em) {
  #maindata .perfect-advisor__final > button {
    font-size: 1.4rem;
  }
}

@keyframes change-color {
  0% {
    color: #FFF;
  }
  100% {
    color: #21D1FF;
  }
}

.search__modal {
  position: fixed;
  left: 50%;
  transform: translate(-50%, 100%);
  bottom: 0;
  max-width: 500px;
  width: calc(100% - 32px);
  background-color: #ffffff;
  z-index: 5;
  transition: transform 0.2s ease-in-out;
}

.search__modal.show {
  transform: translate(-50%, calc(0% - 50px));
}

.search__modal--header {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  column-gap: 16px;
  margin-bottom: 24px;
  color: #08273C;
}

.search__modal--header__title {
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.search__modal--header__btn {
  position: absolute;
  top: 50%;
  right: 0;
  cursor: pointer;
  transform: translateY(-50%);
}

.search__modal--age {
  margin-bottom: 32px;
}

.search__modal--age__title {
  color: #ffffff;
  font-size: 1.4rem;
  margin-bottom: 1rem;
  text-align: left;
}

.search__modal--age__form {
  font-size: 1.6rem;
}

.search__modal--age__form--select, .search__modal--interests__form--select {
  width: 75px;
  color: #08273C;
  font-weight: 700;
  padding: 3px 0;
  padding-left: 5px;
  line-height: 1;
}

.search__modal--age__form span {
  display: inline-block;
  margin: 0 16px;
  font-size: 1.4rem;
}

.search__modal--interests {
  margin-bottom: 0;
}

.search__modal--interests__form {
  position: relative;
  overflow: hidden;
  background-color: #d6e8fb;
  background-image: url("/astro/astro-v1/icons/arrow_down.svg");
  background-repeat: no-repeat;
  background-position: calc(100% - 16px) center;
  background-size: 24px 24px;
}

.search__modal--interests__form--select {
  width: 100%;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  border: none;
  outline: none;
  background-color: transparent;
  background-image: none;
  -webkit-appearance: none;
  appearance: none;
  padding: 16px;
}

@media screen and (max-width: 31.25em) {
  .search__modal--interests__form--select {
    padding: 12px 16px;
  }
}

.search__modal--choseninterest {
  margin-bottom: 32px;
}

.search__modal--choseninterest li {
  position: relative;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  color: #08273C;
  background: #d6e8fb;
  margin: 8px 0;
  padding: 16px 40px 16px 16px;
}

@media screen and (max-width: 31.25em) {
  .search__modal--choseninterest li {
    padding: 12px 40px 12px 16px;
  }
}

.search__modal--choseninterest li span {
  display: block;
}

.search__modal--choseninterest li img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 21px;
  width: 14px;
  height: 14px;
  cursor: pointer;
}

.search__modal .button-bar .btn, .search__modal .button-bar .pricing__container--btn {
  max-width: 230px;
  width: 100%;
  margin: 0 auto;
}

.activeMember,
.checkSub {
  position: fixed;
  background: url("../../../astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  background-size: cover;
  background-position: center;
  width: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 99;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow-y: scroll;
  padding: 5rem 1.6rem;
}

@media screen and (max-width: 31.25em) {
  .activeMember,
  .checkSub {
    align-items: flex-start;
  }
}

.activeMember_inner,
.checkSub_inner {
  max-width: 550px;
  width: 100%;
  background-color: #ffffff;
}

.activeMember_inner_btn-holder,
.checkSub_inner_btn-holder {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.activeMember_inner__img,
.checkSub_inner__img {
  display: block;
  width: 100px;
  margin: 0 auto;
}

.activeMember_inner.uns-box,
.checkSub_inner.uns-box {
  max-width: 600px;
}

.activeMember_inner.confirm,
.checkSub_inner.confirm {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

@media screen and (max-width: 31.25em) {
  .activeMember_inner.confirm,
  .checkSub_inner.confirm {
    gap: 16px;
  }
}

.activeMember_inner.confirm button,
.checkSub_inner.confirm button {
  cursor: pointer;
  max-width: 370px;
}

.activeMember_inner.confirm button.skipIntro,
.checkSub_inner.confirm button.skipIntro {
  color: rgba(8, 39, 60, 0.7);
  text-align: center;
  font-style: normal;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: underline;
  border: none;
  outline: none;
  background: transparent;
  margin-top: 0;
}

.activeMember_inner.introduce,
.checkSub_inner.introduce {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

@media screen and (max-width: 31.25em) {
  .activeMember_inner.introduce,
  .checkSub_inner.introduce {
    gap: 16px;
  }
}

.activeMember_inner.introduce ul,
.checkSub_inner.introduce ul {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

@media screen and (max-width: 31.25em) {
  .activeMember_inner.introduce ul,
  .checkSub_inner.introduce ul {
    gap: 16px;
  }
}

.activeMember_inner.introduce ul li,
.checkSub_inner.introduce ul li {
  color: rgba(8, 39, 60, 0.8);
}

.activeMember_inner.introduce ul li.spec,
.checkSub_inner.introduce ul li.spec {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.activeMember_inner.introduce ul li .btn, .activeMember_inner.introduce ul li .pricing__container--btn,
.checkSub_inner.introduce ul li .btn,
.checkSub_inner.introduce ul li .pricing__container--btn {
  display: inline-flex;
  padding: 1rem 2rem;
}

.activeMember_inner.introduce .close-intro,
.checkSub_inner.introduce .close-intro {
  position: absolute;
  top: 24px;
  right: 24px;
  cursor: pointer;
  display: block;
  width: 24px;
}

@media screen and (max-width: 47.9375em) {
  .activeMember_inner.introduce .close-intro,
  .checkSub_inner.introduce .close-intro {
    top: 12px;
    right: 12px;
  }
}

@media screen and (max-width: 31.25em) {
  .activeMember_inner.introduce .close-intro,
  .checkSub_inner.introduce .close-intro {
    top: 8px;
    right: 8px;
  }
}

.activeMember_inner h3,
.checkSub_inner h3 {
  color: #08273C;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
}

.activeMember_inner img,
.checkSub_inner img {
  display: block;
  width: 136px;
  margin: 0 auto;
}

.activeMember_inner p,
.checkSub_inner p {
  color: #08273C;
  text-align: center;
  font-style: normal;
  font-weight: 400;
  line-height: 1.3;
}

.activeMember_inner button,
.checkSub_inner button {
  min-width: 180px;
  margin: 1.6rem auto 0;
}

.activeMember h4,
.checkSub h4 {
  color: #08273C;
  margin-bottom: 1.6rem;
}

.activeMember .reasons,
.checkSub .reasons {
  display: grid;
  text-align: left;
  margin: 0 auto;
  margin-bottom: 1.6rem;
  max-width: 420px;
}

.activeMember .reasons > div,
.checkSub .reasons > div {
  display: flex;
  margin-bottom: 1rem;
}

.activeMember .reasons > div input,
.checkSub .reasons > div input {
  display: inline-block;
  margin-right: 0.8rem;
}

.activeMember .reasons > div label,
.checkSub .reasons > div label {
  display: inline-block;
  font-size: 1.6rem;
  color: #031D2E;
}

.activeMember .btns,
.checkSub .btns {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.activeMember .btns button,
.checkSub .btns button {
  margin: 0.5rem;
}

.message {
  display: grid;
  grid-template-rows: min-content 1fr;
  row-gap: 32px;
}

.message__header {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  max-width: 454px;
  width: 100%;
  margin: 0 auto;
  background-color: #08273C;
}

.message__header > div {
  flex: 0 1 50%;
}

.message__header > div span {
  display: block;
  color: #FFF;
  text-align: center;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.3px;
  padding: 6px 1.6rem;
  cursor: pointer;
}

@media screen and (max-width: 37.5em) {
  .message__header > div span {
    padding: 8px 1.6rem;
  }
}

.message__header > div span.active {
  border-radius: 4px;
  background: linear-gradient(57deg, #1D4CB3 14.34%, #33B9DE 85.66%);
}

.message__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  /* list unread and read messages START */
}

.message__wrapper--container {
  position: absolute !important;
  display: block;
  inset: 0;
  padding-top: 2px;
  z-index: 1;
  /* list unread and read messages END */
}

.message__wrapper--container .no__messages {
  font-size: 1.4rem;
  text-align: center;
}

.message__wrapper--container .message-item {
  position: relative;
  display: block;
  width: calc(100% - 2px);
  margin: 0 auto;
}

.message__wrapper--container .message-item.new_msg::after {
  content: '';
  display: block;
  position: absolute;
  inset: -1px;
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  z-index: -1;
}

.message__wrapper--container .message-item .message-content {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  transition: background .2s;
  background-color: #08273C;
}

.message__wrapper--container .message-item .message-content .avatar {
  position: relative;
  width: 48px;
  height: 48px;
  border: 1px solid #08273C;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
}

.message__wrapper--container .message-item .message-content .avatar span {
  position: absolute;
  right: 0px;
  bottom: 0px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
}

.message__wrapper--container .message-item .message-content .avatar span.online {
  background-color: #00F0C7;
}

.message__wrapper--container .message-item .message-content .avatar span.offline {
  background-color: #FC5185;
}

.message__wrapper--container .message-item .message-content__details {
  flex: 1;
  padding: 0 1.4rem;
  text-align: left;
  overflow: hidden;
}

.message__wrapper--container .message-item .message-content__details .name {
  font-size: 1.4rem;
  color: #ffffff;
  margin-bottom: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
}

.message__wrapper--container .message-item .message-content__details .msg {
  font-size: 1.4rem;
  color: #A0A0A0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.message__wrapper--container .message-item .message-content__details .msg span.new {
  font-weight: 700;
}

.message__wrapper--container .message-item .message-content__details .msg span img {
  display: inline-block;
  height: 1.4rem;
  margin-right: 8px;
  margin-bottom: -2px;
}

.message__wrapper--container .message-item .message-content__details .msg.blur {
  filter: blur(3px);
}

.message__wrapper--container .message-item .message-content .time {
  max-width: 95px;
  width: auto;
  height: 100%;
  display: flex;
  margin-bottom: auto;
}

.message__wrapper--container .message-item .message-content .time span[id*="msgtime_"] {
  width: 100%;
  font-size: 1.1rem;
  color: #A0A0A0;
  text-align: right;
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}

.message__wrapper--container .message-item .message-content .time span[id*="msgtime_"] span:nth-child(even) {
  font-size: 1rem;
}

/* chat START */
#chat-container {
  text-align: center;
  position: absolute;
  transition: transform 0.3s ease;
  background-image: url("/astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, #031d2e 0%, #1184d1 100.54%);
  background-size: cover;
  background-position: center;
  /* chat END */
}

#chat-container .chat-page {
  display: grid;
  grid-template-columns: 1fr min-content;
  column-gap: 24px;
  justify-content: center;
  height: 100%;
  padding: 8rem 1.6rem 3.2rem;
}

@media screen and (max-width: 62.5em) {
  #chat-container .chat-page {
    padding: 4rem 1.6rem 2rem;
  }
}

@media screen and (max-width: 56.25em) {
  #chat-container .chat-page {
    column-gap: 0;
  }
}

@media screen and (max-width: 47.9375em) {
  #chat-container .chat-page {
    padding: 1rem 1.6rem 1rem;
  }
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page {
    position: absolute;
    inset: 0;
  }
}

@media screen and (max-width: 25em) {
  #chat-container .chat-page {
    padding: 1rem 1rem 1rem;
  }
}

#chat-container .chat-page__wrapper {
  width: 100%;
  height: 100%;
  max-width: 664px;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  background-color: #08273C;
  display: grid;
  grid-template-rows: min-content 1fr max-content;
}

@media screen and (max-width: 62.5em) {
  #chat-container .chat-page__wrapper {
    margin: 0 auto;
  }
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper {
    position: absolute;
    top: 1rem;
    bottom: 1rem;
    left: 1.6rem;
    right: 1.6rem;
    width: auto;
    height: auto;
  }
}

@media screen and (max-width: 25em) {
  #chat-container .chat-page__wrapper {
    top: 1rem;
    bottom: 1rem;
    left: 1rem;
    right: 1rem;
  }
}

#chat-container .chat-page__wrapper .header {
  position: relative;
  width: 100%;
  padding-bottom: 12px;
  border-bottom: 1px solid #1D4CB3;
}

#chat-container .chat-page__wrapper .header--chat {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0;
  position: relative;
  overflow: hidden;
}

#chat-container .chat-page__wrapper .header--chat__avatar {
  flex-shrink: 0;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  text-decoration: none;
}

@media screen and (max-width: 25em) {
  #chat-container .chat-page__wrapper .header--chat__avatar {
    width: 36px;
    height: 36px;
  }
}

#chat-container .chat-page__wrapper .header--chat__user {
  display: flex;
  width: 100%;
  justify-content: space-evenly;
  align-items: start;
  flex-direction: column;
  margin-left: 1.6rem;
  margin-right: 2.4rem;
  overflow: hidden;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .header--chat__user {
    margin-left: 1rem;
    margin-right: 1.4rem;
  }
}

#chat-container .chat-page__wrapper .header--chat__user--name {
  position: relative;
  display: block;
  max-width: 300px;
  width: 100%;
  font-size: 1.6rem;
  line-height: 1;
  font-weight: 700;
  color: #ffffff;
  text-align: left;
  white-space: nowrap;
  overflow-y: visible;
  overflow-x: hidden;
  text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .header--chat__user--name {
    font-size: 1.4rem;
  }
}

#chat-container .chat-page__wrapper .header--chat__user--status {
  position: relative;
  line-height: 1;
}

#chat-container .chat-page__wrapper .header--chat__user--status__icon {
  display: inline-block;
  width: 8px;
  height: 8px;
  background-color: #00F0C7;
  border-radius: 50%;
  margin-right: 4px;
  text-align: left;
}

#chat-container .chat-page__wrapper .header--chat__user--status__icon.online {
  background-color: #00F0C7;
}

#chat-container .chat-page__wrapper .header--chat__user--status__icon.offline {
  background-color: #FC5185;
}

#chat-container .chat-page__wrapper .header--chat__user--status__text {
  font-size: 1.2rem;
  color: #ffffff;
  text-transform: lowercase;
}

#chat-container .chat-page__wrapper .header--chat__menu {
  width: 0.8rem;
  height: 100%;
  cursor: pointer;
}

#chat-container .chat-page__wrapper .header--chat__menu > div {
  display: table;
  width: 100%;
  height: 100%;
}

#chat-container .chat-page__wrapper .header--chat__menu > div > div {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
}

#chat-container .chat-page__wrapper .header--chat__menu > div > div > div {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #ffffff;
  margin: 4px auto 0;
}

@media screen and (max-width: 25em) {
  #chat-container .chat-page__wrapper .header--chat__menu > div > div > div {
    width: 3px;
    height: 3px;
  }
}

#chat-container .chat-page__wrapper .header--chat__menu > div > div > div:first-child {
  margin-top: 0;
}

#chat-container .chat-page__wrapper .chat-menu {
  position: absolute;
  right: 5px;
  top: 50px;
  width: auto;
  padding: 8px 12px;
  background: #ffffff;
  z-index: 2;
  display: block;
}

#chat-container .chat-page__wrapper .chat-menu__btns {
  position: relative;
  width: auto;
  display: flex;
  flex-direction: row;
  gap: 1.6rem;
}

#chat-container .chat-page__wrapper .chat-menu__btns .delete-btn {
  cursor: pointer;
  color: #08273C;
  position: relative;
}

#chat-container .chat-page__wrapper .chat-menu__btns .delete-btn .btn-img__box {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  border-radius: 50%;
  background-color: #031D2E;
}

#chat-container .chat-page__wrapper .chat-menu__btns .delete-btn .btn-img__box img {
  position: relative;
  display: block;
  width: 70%;
  border-radius: 50%;
}

#chat-container .chat-page__wrapper .chat-menu__btns .delete-btn span {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1;
  color: #08273C;
  margin-top: 4px;
}

#chat-container .chat-page__wrapper .chat-body {
  position: relative;
  margin: 0;
}

#chat-container .chat-page__wrapper .chat-body.full-height {
  bottom: 0 !important;
}

#chat-container .chat-page__wrapper .chat-body__floating-date {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.2rem;
  color: #ffffff;
  background-color: #031D2E;
  opacity: 0.6;
  padding: 2px 6px;
  border-radius: 0 0 4px 4px;
  z-index: 1;
}

#chat-container .chat-page__wrapper .chat-body__scroll {
  position: absolute;
  inset: 0;
  padding: 0 10px;
}

#chat-container .chat-page__wrapper .chat-body__scroll .ps__rail-y {
  width: 8px;
}

#chat-container .chat-page__wrapper .chat-body__scroll .ps__rail-y:hover {
  opacity: 1;
}

#chat-container .chat-page__wrapper .chat-body__scroll .ps__rail-y:hover .ps__thumb-y {
  width: 7px;
}

#chat-container .chat-page__wrapper .chat-body__scroll .day-divider {
  margin: 0;
}

#chat-container .chat-page__wrapper .chat-body__scroll .day-divider:first-of-type {
  margin-top: 16px;
}

#chat-container .chat-page__wrapper .chat-body__date {
  display: block;
  margin-bottom: 24px;
  font-size: 1.1rem;
  font-weight: 400;
  color: #ffffff;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .chat-body__date {
    margin-bottom: 16px;
  }
}

#chat-container .chat-page__wrapper .chat-body .message_sent {
  text-align: right;
  margin-right: auto;
  margin-bottom: 24px;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .chat-body .message_sent {
    margin-bottom: 16px;
  }
}

#chat-container .chat-page__wrapper .chat-body .message_sent.opacity {
  transition: opacity .3s;
  opacity: .64;
}

#chat-container .chat-page__wrapper .chat-body .message_sent.error, #chat-container .chat-page__wrapper .chat-body .message_sent.loading {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  column-gap: 8px;
}

#chat-container .chat-page__wrapper .chat-body .message_sent.error img, #chat-container .chat-page__wrapper .chat-body .message_sent.loading img {
  cursor: pointer;
}

#chat-container .chat-page__wrapper .chat-body .message_sent.error .spinner, #chat-container .chat-page__wrapper .chat-body .message_sent.loading .spinner {
  display: block;
  height: 20px;
  width: 20px;
  padding: 2px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
  --_m: conic-gradient(#0000 10%, #000),
                  linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
  mask: var(--_m);
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  animation: spinner 1s infinite linear;
}

#chat-container .chat-page__wrapper .chat-body .message_sent .bubble {
  text-align: right;
  width: auto;
  max-width: calc(70% - 20px);
  display: inline-block;
  padding: 6px 1rem;
  background: #77E0FC;
  border-radius: 8px 8px 0px 8px;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .chat-body .message_sent .bubble {
    max-width: calc(90% - 20px);
  }
}

#chat-container .chat-page__wrapper .chat-body .message_sent .bubble__msg {
  color: #08273C;
  font-size: 1.4rem;
  line-height: 1.2;
  font-weight: 400;
  word-wrap: break-word;
  margin-bottom: 6px;
  text-align: left;
}

#chat-container .chat-page__wrapper .chat-body .message_sent .bubble__msg a {
  color: #08273C;
}

#chat-container .chat-page__wrapper .chat-body .message_sent .bubble__status {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 4px;
  justify-content: flex-end;
}

#chat-container .chat-page__wrapper .chat-body .message_sent .bubble__sent {
  width: 14px;
  height: 14px;
  background-image: url("/astro/astro-v1/icons/status_sent.svg");
  background-size: cover;
  background-position: center;
}

#chat-container .chat-page__wrapper .chat-body .message_sent .bubble__pending {
  width: 14px;
  height: 14px;
  background-image: url("/astro/astro-v1/icons/status_pending.svg");
  background-size: cover;
  background-position: center;
}

#chat-container .chat-page__wrapper .chat-body .message_sent .bubble__time {
  margin-left: auto;
  font-size: 1.2rem;
  font-weight: 300;
  color: rgba(8, 39, 60, 0.7);
}

#chat-container .chat-page__wrapper .chat-body .message_received {
  text-align: left;
  margin-left: auto;
  margin-bottom: 24px;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .chat-body .message_received {
    margin-bottom: 16px;
  }
}

#chat-container .chat-page__wrapper .chat-body .message_received .bubble {
  text-align: left;
  width: auto;
  max-width: calc(70% - 20px);
  display: inline-block;
  padding: 6px 1rem;
  background: #ffffff;
  border-radius: 0px 8px 8px 8px;
}

@media screen and (max-width: 37.5em) {
  #chat-container .chat-page__wrapper .chat-body .message_received .bubble {
    max-width: calc(90% - 20px);
  }
}

#chat-container .chat-page__wrapper .chat-body .message_received .bubble-relaod {
  color: #009f4d;
  text-decoration: underline;
}

#chat-container .chat-page__wrapper .chat-body .message_received .bubble__msg {
  color: #08273C;
  font-size: 1.4rem;
  line-height: 1.2;
  font-weight: 400;
  word-wrap: break-word;
  margin-bottom: 6px;
}

#chat-container .chat-page__wrapper .chat-body .message_received .bubble__msg.blur {
  filter: blur(3px);
}

#chat-container .chat-page__wrapper .chat-body .message_received .bubble__time {
  font-size: 1.2rem;
  font-weight: 300;
  color: rgba(8, 39, 60, 0.7);
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins, #chat-container .chat-page__wrapper .chat-body .message_stayinchat {
  max-width: 300px;
  width: 100%;
  border-radius: 12px;
  background: url("/astro/astro-v1/img/bg.png"), linear-gradient(#21D1FF, #21D1FF);
  background-size: cover;
  background-position: center;
  padding: 12px;
  margin-bottom: 24px;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .chat-body .message_outofcoins, #chat-container .chat-page__wrapper .chat-body .message_stayinchat {
    margin-bottom: 16px;
  }
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins .bubble__msg, #chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 4px;
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins .bubble__msg .box__left, #chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg .box__left {
  flex-shrink: 0;
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins .bubble__msg .box__left img, #chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg .box__left img {
  display: block;
  width: 50px;
  height: auto;
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins .bubble__msg .box__right, #chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg .box__right {
  flex-grow: 1;
  text-align: left;
  color: #ffffff;
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins .bubble__msg .box__right > p, #chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg .box__right > p {
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin-bottom: 4px;
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins .bubble__msg .box__right > span, #chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg .box__right > span {
  display: block;
  margin-bottom: 8px;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins .bubble__msg .box__right > a, #chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg .box__right > a {
  display: inline-block;
  min-width: 130px;
  border-radius: 30px;
  background: linear-gradient(57deg, #1D4CB3 14.34%, #33B9DE 85.66%);
  padding: 8px 16px;
  text-align: center;
  font-size: 10px;
  color: #ffffff;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

#chat-container .chat-page__wrapper .chat-body .message_outofcoins {
  margin-left: auto;
}

#chat-container .chat-page__wrapper .chat-body .message_stayinchat {
  margin-right: auto;
}

#chat-container .chat-page__wrapper .chat-body .message_stayinchat .bubble__msg .box__left img {
  width: 56px;
  border-radius: 50%;
}

#chat-container .chat-page__wrapper .out-of-coins-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  transform: translateY(150%);
  display: block;
  z-index: 99;
  background: linear-gradient(to left, rgba(8, 39, 60, 0.2), rgba(8, 39, 60, 0.2)), #031D2E;
  border: 1px solid #08273C;
  padding: 2.8rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, transform 0.5s;
}

#chat-container .chat-page__wrapper .out-of-coins-footer::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 115px;
  height: 100%;
  background: url("/img/ctv-2-v1/vips.gif");
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
  z-index: -1;
}

#chat-container .chat-page__wrapper .out-of-coins-footer.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0%);
}

#chat-container .chat-page__wrapper .out-of-coins-footer--wrapp {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2.8rem;
}

@media screen and (max-width: 37.5em) {
  #chat-container .chat-page__wrapper .out-of-coins-footer--wrapp__top {
    text-align: center;
  }
}

#chat-container .chat-page__wrapper .out-of-coins-footer--wrapp__top--title {
  display: block;
  color: #ffffff;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  margin-bottom: 8px;
}

#chat-container .chat-page__wrapper .out-of-coins-footer--wrapp__top--description {
  display: block;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
  color: #ffffff;
}

#chat-container .chat-page__wrapper .out-of-coins-footer .accented {
  display: inline-block;
  min-width: 120px;
  width: auto;
  font-weight: 400;
  line-height: 1;
  border-radius: 4px;
  padding: 10px 30px;
  height: auto;
  text-transform: none;
}

#chat-container .chat-page__wrapper .chat-footer {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
  z-index: 1;
  grid-column: 1 / -1;
  margin-top: 6px;
}

#chat-container .chat-page__wrapper .chat-footer__controls {
  background-color: #031D2E;
  border-radius: 12px;
  overflow: hidden;
  padding: 12px;
}

#chat-container .chat-page__wrapper .chat-footer__controls--wrapp {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  min-height: 24px;
  height: auto;
  column-gap: 8px;
}

#chat-container .chat-page__wrapper .chat-footer__controls--icebtn {
  position: relative;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

#chat-container .chat-page__wrapper .chat-footer__controls--icebtn::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
}

#chat-container .chat-page__wrapper .chat-footer__controls--textarea {
  position: relative;
  flex-grow: 1;
}

#chat-container .chat-page__wrapper .chat-footer__controls--textarea textarea {
  display: block;
  width: 100%;
  color: #ffffff;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.3;
  padding: 0;
  background-color: transparent;
  border: none;
  overflow-y: scroll;
  word-wrap: break-word;
  min-height: 18px;
  resize: none;
}

#chat-container .chat-page__wrapper .chat-footer__controls--textarea textarea::placeholder {
  color: #ffffff;
}

#chat-container .chat-page__wrapper .chat-footer__controls--textarea textarea::-webkit-scrollbar {
  display: none;
}

#chat-container .chat-page__wrapper .chat-footer__controls--send-btn {
  position: relative;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  overflow: hidden;
  background-color: transparent;
  outline: none;
  border: none;
}

#chat-container .chat-page__wrapper .chat-footer__controls--send-btn:disabled {
  opacity: 0.4;
}

#chat-container .chat-page__wrapper .chat-footer__controls--send-btn img {
  display: block;
  width: 100%;
  height: auto;
}

#chat-container .chat-page__wrapper .chat-footer__icebreakers {
  position: relative;
  min-height: 37px;
  overflow-y: auto;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .chat-footer__icebreakers {
    min-height: 35px;
  }
}

#chat-container .chat-page__wrapper .chat-footer__icebreakers--wrapper {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

#chat-container .chat-page__wrapper .chat-footer__icebreakers--wrapper ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

#chat-container .chat-page__wrapper .chat-footer__icebreakers--wrapper ul li {
  display: flex;
  padding: 8px 16px;
  border-radius: 100px;
  border: 1px solid #1D4CB3;
  color: #ffffff;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
}

#chat-container .chat-page__wrapper .chat-footer__icebreakers--wrapper ul li:not(:last-of-type) {
  margin-right: 16px;
}

@media screen and (max-width: 31.25em) {
  #chat-container .chat-page__wrapper .chat-footer__icebreakers--wrapper ul li {
    font-size: 14px;
  }
}

#chat-container .chat-page__wrapper .chat-footer__icebreakers--wrapper ul li.selected {
  border-radius: 300px;
  border: 1px solid #1d4cb3;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

#chat-container .chat-page__profile {
  position: relative;
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 62.5em) {
  #chat-container .chat-page__profile {
    display: none !important;
  }
}

#chat-container .chat-page__profile .profile {
  width: 360px;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  background-color: #08273C;
  height: 100%;
}

#chat-container .chat-page__profile .profile__data {
  display: grid;
  grid-template-rows: min-content min-content min-content 1fr;
  position: relative;
}

#chat-container .chat-page__profile .profile__data--close {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  cursor: pointer;
}

#chat-container .chat-page__profile .profile__data--about {
  position: relative;
  height: auto;
}

#chat-container .chat-page__profile .profile__data--about__box {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

#chat-container .custommodal {
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.profile-view-wrapper .profile-view {
  display: grid;
  row-gap: 32px;
  /* START about section*/
  /* END about section*/
  /* START reading section */
  /* END reading section */
}

.profile-view-wrapper .profile-view .user__profile {
  width: 100%;
  margin: 0 auto;
  padding: 2.4rem;
  background-color: #08273C;
  display: grid;
  row-gap: 2.4rem;
}

.profile-view-wrapper .profile-view .user__profile--image {
  display: block;
  position: relative;
  margin: 0 auto;
}

.profile-view-wrapper .profile-view .user__profile--image__box {
  display: block;
  width: 156px;
  height: 156px;
  overflow: hidden;
  border-radius: 50%;
}

@media screen and (max-width: 31.25em) {
  .profile-view-wrapper .profile-view .user__profile--image__box {
    width: 120px;
    height: 120px;
  }
}

.profile-view-wrapper .profile-view .user__profile--image__box--img {
  position: relative;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

.profile-view-wrapper .profile-view .user__profile--image .profileImgApproval {
  padding: 6px 4px;
  background: rgba(8, 39, 60, 0.64);
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  font-size: 1.4rem;
  font-weight: normal;
  text-align: center;
}

.profile-view-wrapper .profile-view .user__profile--image__add-photo {
  position: absolute;
  bottom: 0;
  right: -8px;
  cursor: pointer;
}

.profile-view-wrapper .profile-view .user__profile--image__add-photo img {
  width: 4.8rem;
}

@media screen and (max-width: 31.25em) {
  .profile-view-wrapper .profile-view .user__profile--image__add-photo img {
    width: 4rem;
  }
}

.profile-view-wrapper .profile-view .user__profile--box {
  position: relative;
  color: #ffffff;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1.6rem;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 37.5em) {
  .profile-view-wrapper .profile-view .user__profile--box {
    flex-direction: column;
    justify-content: center;
  }
}

.profile-view-wrapper .profile-view .user__profile--box__data--name {
  line-height: normal;
  font-style: normal;
  font-weight: 700;
}

.profile-view-wrapper .profile-view .user__profile--box__action {
  max-width: 169px;
  width: 100%;
}

.profile-view-wrapper .profile-view .user__profile--box__action button {
  font-size: 1.4rem;
  padding: 1.2rem 0.5rem;
}

.profile-view-wrapper .profile-view .tab__container {
  display: none;
}

.profile-view-wrapper .profile-view .tab__container.active {
  display: block;
}

.profile-view-wrapper .profile-view__tabs {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.profile-view-wrapper .profile-view__tabs::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #1D4CB3;
}

.profile-view-wrapper .profile-view__tabs > div {
  line-height: normal;
  font-weight: 700;
  text-align: center;
  padding: 1.6rem;
  cursor: pointer;
  transition: 0.2s;
}

.profile-view-wrapper .profile-view__tabs > div:hover {
  background-color: #08273C;
  color: #ffffff;
  border-radius: 4px 4px 0px 0px;
}

.profile-view-wrapper .profile-view .about-me__wrapper {
  /* profile-about end */
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about {
  padding: 1.6rem;
  margin: 1.2rem 0 2.4rem;
  position: relative;
  word-break: break-all;
  background-color: #08273C;
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about__description {
  position: relative;
  width: 100%;
  margin: 0;
  padding-right: 3.5rem;
  white-space: pre-line;
  overflow-wrap: break-word;
  display: inline-block;
  z-index: 1;
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about__description--edit {
  /* textarea*/
  position: relative;
  width: calc(100% - 3.5rem);
  display: block;
  z-index: 1;
  line-height: 1.5;
  color: #ffffff;
  padding: 0.8rem;
  background: #08273C;
  border: 1px solid #A0A0A0;
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about__btn {
  position: absolute;
  display: inline-block;
  top: 50%;
  right: 2rem;
  transform: translateY(-50%);
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about__btn.save {
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about__btn img {
  display: block;
  width: 24px;
  height: 24px;
}

@media screen and (max-width: 47.9375em) {
  .profile-view-wrapper .profile-view .about-me__wrapper .profile-about__btn img {
    width: 21px;
    height: 21px;
  }
}

@media screen and (max-width: 31.25em) {
  .profile-view-wrapper .profile-view .about-me__wrapper .profile-about__btn img {
    width: 18px;
    height: 18px;
  }
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about.edit {
  display: none;
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about:not(.edit) {
  cursor: pointer;
}

.profile-view-wrapper .profile-view .about-me__wrapper .profile-about .empty {
  color: #ffffff;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box {
  display: flex;
  width: 100%;
  gap: 1.6rem;
}

@media screen and (max-width: 56.25em) {
  .profile-view-wrapper .profile-view .about-me__wrapper--box {
    flex-direction: column;
  }
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block {
  position: relative;
  width: 100%;
  background-color: #08273C;
  padding: 2.4rem;
}

@media screen and (max-width: 47.9375em) {
  .profile-view-wrapper .profile-view .about-me__wrapper--box__block {
    padding: 1.6rem;
  }
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block h4 {
  position: relative;
  color: #ffffff;
  font-size: 2rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
  margin-bottom: 2.4rem;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block--btns button {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  border: none;
  outline: none;
  background-color: transparent;
  cursor: pointer;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block--btns button img {
  display: block;
  width: 24px;
  height: 24px;
}

@media screen and (max-width: 47.9375em) {
  .profile-view-wrapper .profile-view .about-me__wrapper--box__block--btns button img {
    width: 21px;
    height: 21px;
  }
}

@media screen and (max-width: 31.25em) {
  .profile-view-wrapper .profile-view .about-me__wrapper--box__block--btns button img {
    width: 18px;
    height: 18px;
  }
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block--btns button.save {
  display: none;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table {
  width: 100%;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  row-gap: 2.4rem;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row label {
  display: table-cell;
  width: 45%;
  padding: 0px;
  padding-right: 1rem;
  color: #ffffff;
  line-height: normal;
  overflow-wrap: break-word;
  text-transform: lowercase;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row label:first-letter {
  text-transform: uppercase;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span {
  display: flex;
  padding-bottom: 0px;
  align-items: center;
  justify-content: flex-end;
  overflow-wrap: break-word;
}

@media screen and (max-width: 37.5em) {
  .profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span {
    padding-left: 0;
  }
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span select {
  width: 100%;
  display: inline-block;
  background-color: #ffffff;
  margin-left: 3px;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span select option {
  direction: ltr;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span select#year {
  min-width: 65px;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span select.disabled {
  color: #ffffff;
  background-color: transparent;
  border: none;
  font-weight: 700;
  overflow: hidden;
  overflow: -moz-hidden-unscrollable;
  -webkit-appearance: none;
  appearance: none;
  text-align: right;
  text-align-last: right;
  direction: rtl;
  pointer-events: none;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span select.disabled#year {
  min-width: 4ch;
}

.profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span strong {
  font-weight: 700;
  padding-left: 0.5rem;
  font-size: 1.4rem;
  color: #ffffff;
}

.profile-view-wrapper .profile-view .reading__wrapper {
  padding: 1.2rem 0;
}

.profile-view-wrapper .profile-view .reading__wrapper--feature {
  position: relative;
  overflow: hidden;
  padding: 3rem 2.4rem;
}

@media screen and (max-width: 31.25em) {
  .profile-view-wrapper .profile-view .reading__wrapper--feature {
    padding: 2rem 1.6rem;
  }
}

.profile-view-wrapper .profile-view .reading__wrapper--feature:not(:last-child) {
  margin-bottom: 2.4rem;
}

.profile-view-wrapper .profile-view .reading__wrapper--feature:nth-child(odd) {
  background: linear-gradient(57deg, #1D4CB3 14.34%, #33b9de 85.66%);
}

.profile-view-wrapper .profile-view .reading__wrapper--feature:nth-child(even) {
  background: linear-gradient(57deg, #6a4dbc 14.34%, #33b9de 85.66%);
}

.profile-view-wrapper .profile-view .reading__wrapper--feature__offer {
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 4px;
  background: #21d1ff;
  color: #08273C;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding: 4px 10px;
}

@media screen and (max-width: 31.25em) {
  .profile-view-wrapper .profile-view .reading__wrapper--feature__offer {
    padding: 3px 10px;
  }
}

.profile-view-wrapper .profile-view .reading__wrapper--feature__content {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 1.6rem;
}

@media (max-width: 500px) {
  .profile-view-wrapper .profile-view .reading__wrapper--feature__content {
    flex-direction: column;
  }
}

.profile-view-wrapper .profile-view .reading__wrapper--feature__content p {
  color: #ffffff;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
}

.profile-view-wrapper .profile-view .reading__wrapper--feature__content--btns {
  margin-left: auto;
}

@media (max-width: 500px) {
  .profile-view-wrapper .profile-view .reading__wrapper--feature__content--btns {
    margin-right: auto;
  }
}

.profile-view-wrapper .profile-view .reading__wrapper--feature__content--btns > a {
  display: inline-block;
  color: #1D4CB3;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding: 8px 2.4rem;
  background-color: #ffffff;
  border-radius: 60px;
}

#settings .settings-container {
  max-width: 380px;
  width: 100%;
  margin: 0 auto;
}

#settings .settings-container .credentials {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

#settings .settings-container .credentials .row {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}

#settings .settings-container .credentials .row span {
  color: #ffffff;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

#settings .settings-container .credentials .row .box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  padding: 16px;
  background-color: #08273C;
}

#settings .settings-container .credentials .row .box__input {
  display: flex;
  flex-direction: column;
  width: auto;
}

#settings .settings-container .credentials .row .box__input h3 {
  text-align: left;
  font-weight: normal;
  font-size: 1.4rem;
  margin: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}

#settings .settings-container .credentials .row .box__input h3 img {
  display: inline-block;
  height: 26px;
  width: auto;
}

@media (max-width: 600px) {
  #settings .settings-container .credentials .row .box__input h3 img {
    height: 20px;
  }
}

#settings .settings-container .credentials .row .box__input span {
  display: block;
  text-align: left;
  font-size: 1.4rem;
  line-height: 1.2;
  font-weight: normal;
}

#settings .settings-container .credentials .row .box__input input,
#settings .settings-container .credentials .row .box__input select {
  display: inline-block;
  width: auto;
  border: none;
  border-bottom: 2px solid #ffffff;
  padding-bottom: 2px;
  outline: none;
  background-color: transparent;
  color: #ffffff;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 400;
  transition: border 0.3s;
}

#settings .settings-container .credentials .row .box__input input.disabled,
#settings .settings-container .credentials .row .box__input select.disabled {
  color: #ffffff;
  font-weight: 700;
  cursor: pointer;
  border-color: transparent;
}

#settings .settings-container .credentials .row .box__input select:not(.disabled) {
  background-color: #08273C;
}

#settings .settings-container .credentials .row .box__input select {
  width: calc(100% - 10px);
  cursor: pointer;
}

#settings .settings-container .credentials .row .box__input select.disabled {
  -webkit-appearance: none;
}

#settings .settings-container .credentials .row .box__input select.disabled::-ms-expand {
  display: none;
}

#settings .settings-container .credentials .row .box__btn {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  height: 24px;
}

#settings .settings-container .credentials .row .box__btn .switch {
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  width: 30px;
  height: 16px;
  margin: 0;
  cursor: pointer;
}

#settings .settings-container .credentials .row .box__btn .switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ffffff;
  border-radius: 34px;
  transition: 0.4s;
}

#settings .settings-container .credentials .row .box__btn .switch .slider::before {
  position: absolute;
  content: "";
  height: 12px;
  width: 12px;
  left: 3px;
  bottom: 2px;
  background: #FC5185;
  transition: 0.4s;
  border-radius: 50%;
}

#settings .settings-container .credentials .row .box__btn .switch input:checked + .slider::before {
  transform: translateX(13px);
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

#settings .settings-container .credentials .row .box__btn span {
  cursor: pointer;
}

#settings .settings-container .credentials .row .box__btn span img {
  display: inline-block;
  margin-top: 2px;
}

#settings .settings-container .credentials .row .box__btn--show {
  margin-right: 8px;
}

#settings .settings-container .credentials .row .box__btn--show img {
  margin-top: 0 !important;
  width: 20px;
}

#settings .settings-container .credentials .row .box__btn--edit {
  position: relative;
  display: block;
}

#settings .settings-container .credentials .row .box__btn--edit::after {
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#settings .settings-container .credentials .row .box__btn--save {
  padding: 4px 8px;
  border-radius: 0;
}

#settings .settings-container .credentials button {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2.4rem;
  background: transparent;
}

#settings .settings-container .credentials button span {
  display: inline-block;
  font-size: 1.4rem;
}

#settings .settings-container .credentials button:hover {
  background: #08273C;
}

#settings .settings-container .credentials button img {
  display: inline-block;
  height: 20px;
  margin-right: 0.8rem;
}

#settings .settings-container__logout {
  text-align: center;
  margin-top: 48px;
  margin-bottom: 48px;
}

#settings .settings-container__logout a {
  display: inline-block;
  color: #A0A0A0;
  font-size: 1.4rem;
  line-height: 1.2;
  cursor: pointer;
}

#settings .settings-container__logout a:hover {
  text-decoration: underline;
}

.unsubscribe-prompt {
  max-width: 460px;
  width: calc(100% - 32px);
  width: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  padding: 48px;
  z-index: 5;
}

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

.unsubscribe-prompt__box p {
  color: #08273C;
  font-size: 2rem;
  margin-bottom: 2rem;
}

.unsubscribe-prompt__box button {
  display: inline-block;
  min-width: 160px;
  width: auto;
}

#tos-page .contact-main-page {
  width: 100%;
  height: 100%;
}

#tos-page .tos-main-page .tos-main-menu {
  display: flex;
  flex-direction: column;
  max-width: 430px;
  width: 100%;
  margin: 0 auto;
  margin-bottom: 60px;
}

#tos-page .tos-main-page .tos-main-menu__item {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  background: #08273C;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
}

#tos-page .tos-main-page h1 {
  display: none;
}

#tos-page .tos-main-page h2, #tos-page .tos-main-page h3 {
  margin-bottom: 2.8rem;
}

#tos-page .tos-main-page h4 {
  margin-bottom: 2.8rem;
}

#tos-page .tos-main-page p {
  margin-bottom: 2rem;
  line-height: 1.3;
}

#tos-page .tos-main-page .link {
  color: #77E0FC;
  cursor: pointer;
}

#tos-page .tos-main-page ul, #tos-page .tos-main-page ol {
  list-style: none;
  margin-bottom: 1.6rem;
  padding-left: 20px;
}

#tos-page .tos-main-page ul li, #tos-page .tos-main-page ol li {
  margin-bottom: 8px;
  line-height: 1.3;
}

#tos-page .tos-main-page table {
  margin-bottom: 2rem;
}

#tos-page .tos-main-page table tr td, #tos-page .tos-main-page table tr th {
  border-color: #ffffff;
  font-size: 1.8rem;
}

@media screen and (max-width: 47.9375em) {
  #tos-page .tos-main-page table tr td, #tos-page .tos-main-page table tr th {
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 37.5em) {
  #tos-page .tos-main-page table tr td, #tos-page .tos-main-page table tr th {
    font-size: 1.2rem;
  }
}

#tos-page .tos-main-page .tos-section .see-more {
  color: #77E0FC;
  margin-bottom: 1.6rem;
}

#tos-page .tos-main-page .tos-section .arrow svg {
  fill: #77E0FC;
}

#tos-page .tos-main-page .backBtn {
  display: none;
}

.thanks__page, .declined_page {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow-y: scroll;
}

@media (max-width: 360px) {
  .thanks__page, .declined_page {
    align-items: flex-start;
  }
}

.thanks__page.subscription, .subscription.declined_page {
  background: #ffffff;
}

.thanks__page--background, .declined_page--background {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9) 3.25%, rgba(0, 0, 0, 0) 51.56%, rgba(0, 0, 0, 0.83) 68.75%, #000000 100%), linear-gradient(0deg, rgba(42, 45, 67, 0.5), rgba(42, 45, 67, 0.5)), url("/astro/astro-v1/img/background.jpg");
  background-size: cover, cover;
}

.thanks__page--background img, .declined_page--background img {
  max-width: 1000px;
  width: 100%;
  position: absolute;
  left: 50%;
  top: 0%;
  transform: translate(-50%, -50%);
}

.thanks__page--modal, .declined_page--modal {
  display: inline-flex;
  flex-direction: column;
  position: relative;
  max-width: 604px;
  width: calc(100% - 32px);
  padding: 64px;
  gap: 64px;
  border-radius: 16px;
  background: linear-gradient(180deg, #3c4392 0%, #162365 100%);
  box-shadow: 0px 8px 6px 0px rgba(0, 0, 0, 0.25);
}

@media screen and (max-width: 56.25em) {
  .thanks__page--modal, .declined_page--modal {
    gap: 24px;
    padding: 40px;
  }
}

@media screen and (max-width: 31.25em) {
  .thanks__page--modal, .declined_page--modal {
    padding: 16px;
    margin-top: 30px;
    margin-bottom: 16px;
  }
}

.thanks__page--modal__header {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 16px;
}

.thanks__page--modal__header h2 {
  color: #ffffff;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}

.thanks__page--modal__body p {
  color: #ffffff;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}

.thanks__page--modal__footer {
  display: flex;
  justify-content: center;
}

.thanks__page--modal__footer--btn {
  display: inline-flex !important;
  width: auto !important;
}

.thanks__subscription {
  max-width: 400px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.thanks__subscription--modal {
  display: flex;
  flex-direction: column;
}

.thanks__subscription--modal__content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.thanks__subscription--modal__success {
  padding: 12px;
  border-radius: 10px;
  background: #f6e7c0;
  color: #13234b;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.thanks__subscription--modal__title {
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
  color: #000000;
  text-align: center;
}

.thanks__subscription--modal__title.hightlight {
  color: #2f69dd;
}

.thanks__subscription--modal__description {
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  color: rgba(0, 0, 0, 0.8);
  text-align: center;
}

.declined_page--modal__header h4 {
  margin: 0;
  padding: 0;
  color: #FC5185;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}

.declined_page--modal__header img {
  display: block;
  height: 60px;
  margin: 0 auto;
}

.declined_page--modal__body h5 {
  margin: 0;
  padding: 0;
  color: #ffffff;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 16px;
}

.declined_page--modal__body p {
  color: #ffffff;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

.declined_page--modal__footer {
  display: flex;
  justify-content: center;
}

.declined_page--modal__footer--btn {
  display: inline-flex !important;
  width: auto !important;
}

#horoscope-wrapp {
  background: #031D2E;
}

#horoscope-wrapp .horoscope {
  display: flex;
  flex-direction: column;
}

#horoscope-wrapp .horoscope_signs {
  overflow: hidden;
}

#horoscope-wrapp .horoscope_signs .swiper {
  width: 100%;
  height: 100%;
}

#horoscope-wrapp .horoscope_signs--wrapp {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  cursor: grab;
  padding: 4px 6px 0;
  -webkit-user-select: none;
  user-select: none;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign:hover > div, #horoscope-wrapp .horoscope_signs--wrapp__sign.active > div {
  background: linear-gradient(to left, #3d9aff, #2c4fbd);
}

#horoscope-wrapp .horoscope_signs--wrapp__sign:hover > div::before, #horoscope-wrapp .horoscope_signs--wrapp__sign.active > div::before {
  background: linear-gradient(to left, #3d9aff, #2c4fbd);
  inset: -4px;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign:hover > div::after, #horoscope-wrapp .horoscope_signs--wrapp__sign.active > div::after {
  background-color: #031d2e;
  inset: -2px;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign > div {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: #27408e;
  transition: all 0.3s;
  position: relative;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign > div::after, #horoscope-wrapp .horoscope_signs--wrapp__sign > div::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  overflow: hidden;
  transition: all 0.1s;
  z-index: -1;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign > div img {
  position: relative;
}

#horoscope-wrapp .horoscope_signs--wrapp__sign > span {
  color: #fff;
  text-align: center;
  font-family: "SF Pro Display", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.3px;
  text-transform: capitalize;
}

#horoscope-wrapp .horoscope_type {
  overflow-y: auto;
  background: rgba(8, 39, 60, 0.8);
}

#horoscope-wrapp .horoscope_type--wrapp {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

#horoscope-wrapp .horoscope_type--wrapp__btn {
  min-width: 200px;
  flex: 0 1 20%;
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.3px;
  text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 4px;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}

#horoscope-wrapp .horoscope_type--wrapp__btn.active, #horoscope-wrapp .horoscope_type--wrapp__btn:hover {
  color: #fff;
  background: linear-gradient(57deg, #1D4CB3 14.34%, #33b9de 85.66%);
}

#horoscope-wrapp .horoscope_for p {
  color: #fff;
  text-align: center;
  font-style: normal;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.3px;
}

#horoscope-wrapp .horoscope_for p > span:last-child {
  text-transform: capitalize;
}

#horoscope-wrapp .horoscope_content {
  display: grid;
  grid-template-rows: auto auto auto;
  grid-template-columns: repeat(2, 1fr);
  gap: 48px;
}

@media screen and (max-width: 56.25em) {
  #horoscope-wrapp .horoscope_content {
    gap: 36px;
  }
}

@media screen and (max-width: 47.9375em) {
  #horoscope-wrapp .horoscope_content {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

#horoscope-wrapp .horoscope_content--sign {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

@media screen and (max-width: 47.9375em) {
  #horoscope-wrapp .horoscope_content--sign {
    flex-direction: column-reverse;
  }
}

#horoscope-wrapp .horoscope_content--sign__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#horoscope-wrapp .horoscope_content--sign__info > p {
  color: #fff;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.3px;
  text-transform: capitalize;
}

#horoscope-wrapp .horoscope_content--sign__info > span {
  color: #fff;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

#horoscope-wrapp .horoscope_content--sign img {
  max-width: 220px;
  width: 100%;
  margin: 0 auto;
}

@media screen and (max-width: 25em) {
  #horoscope-wrapp .horoscope_content--sign img {
    max-width: 160px;
  }
}

#horoscope-wrapp .horoscope_content--data {
  padding: 24px 16px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  column-gap: 12px;
  background: #08273C;
}

#horoscope-wrapp .horoscope_content--data:last-of-type {
  grid-column: 1 / -1;
}

#horoscope-wrapp .horoscope_content--data h3 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 16px;
  margin-bottom: 12px;
}

#horoscope-wrapp .horoscope_content--data h3 span {
  color: #fff;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

#horoscope-wrapp .horoscope_content--data p {
  color: rgba(255, 255, 255, 0.7);
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.3px;
}

#horoscope-wrapp .horoscope_advisor h3 {
  max-width: 520px;
  background: linear-gradient(91deg, #21d1ff 0%, #5068e7 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
}

#horoscope-wrapp .birthdate,
#horoscope-wrapp .horoscope-error {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #031D2E;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 14px;
}

#horoscope-wrapp .birthdate--modal,
#horoscope-wrapp .horoscope-error--modal {
  border-radius: 16px;
  background: #ffffff;
  padding: 40px;
  display: flex;
  flex-direction: column;
  max-width: 414px;
  width: 100%;
}

@media screen and (max-width: 31.25em) {
  #horoscope-wrapp .birthdate--modal,
  #horoscope-wrapp .horoscope-error--modal {
    padding: 32px 24px;
  }
}

@media screen and (max-width: 25em) {
  #horoscope-wrapp .birthdate--modal,
  #horoscope-wrapp .horoscope-error--modal {
    padding: 16px;
  }
}

#horoscope-wrapp .birthdate--modal__top,
#horoscope-wrapp .horoscope-error--modal__top {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}

#horoscope-wrapp .birthdate--modal__top h3,
#horoscope-wrapp .horoscope-error--modal__top h3 {
  color: #031d2e;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.3px;
}

#horoscope-wrapp .birthdate--modal__top p,
#horoscope-wrapp .horoscope-error--modal__top p {
  color: rgba(3, 29, 46, 0.7);
  text-align: center;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.3px;
}

#horoscope-wrapp .birthdate--modal__bottom,
#horoscope-wrapp .horoscope-error--modal__bottom {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
}

#horoscope-wrapp .birthdate--modal__bottom--birth,
#horoscope-wrapp .horoscope-error--modal__bottom--birth {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

#horoscope-wrapp .birthdate--modal__bottom--birth__select,
#horoscope-wrapp .horoscope-error--modal__bottom--birth__select {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: 100%;
  gap: 16px;
}

@media screen and (max-width: 31.25em) {
  #horoscope-wrapp .birthdate--modal__bottom--birth__select,
  #horoscope-wrapp .horoscope-error--modal__bottom--birth__select {
    flex-direction: column;
  }
}

#horoscope-wrapp .birthdate--modal__bottom--birth__select select,
#horoscope-wrapp .horoscope-error--modal__bottom--birth__select select {
  flex: 0 1 33%;
  border-radius: 4px;
  border: 1px solid #aeb3bc;
  padding: 14px;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

@media screen and (max-width: 31.25em) {
  #horoscope-wrapp .birthdate--modal__bottom--birth__select select,
  #horoscope-wrapp .horoscope-error--modal__bottom--birth__select select {
    padding: 10px 14px;
  }
}

#horoscope-wrapp .birthdate--modal__bottom--birth > p,
#horoscope-wrapp .horoscope-error--modal__bottom--birth > p {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  color: #FC5185;
}

#horoscope-wrapp .birthdate--modal__bottom--birth > p:empty,
#horoscope-wrapp .horoscope-error--modal__bottom--birth > p:empty {
  display: none;
}

#horoscope-wrapp .birthdate--modal__bottom--btn,
#horoscope-wrapp .horoscope-error--modal__bottom--btn {
  display: flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 16px;
  justify-content: center;
  align-items: center;
  padding: 0 1.6rem !important;
}

#horoscope-wrapp .birthdate--modal__bottom--btn span:last-child,
#horoscope-wrapp .horoscope-error--modal__bottom--btn span:last-child {
  padding: 1.6rem 0;
}

#horoscope-wrapp .birthdate--modal__bottom--btn__loader,
#horoscope-wrapp .horoscope-error--modal__bottom--btn__loader {
  display: block;
  height: 35px;
  width: 35px;
  padding: 4px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
  --_m: conic-gradient(#0000 10%, #000),
              linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
  mask: var(--_m);
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  animation: spinner 1s infinite linear;
}

#horoscope-wrapp .subscribe {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  overflow: auto;
  padding: 24px 14px;
}

#horoscope-wrapp .subscribe.show {
  display: flex;
  justify-content: center;
  align-items: center;
}

@media screen and (max-width: 37.5em) {
  #horoscope-wrapp .subscribe.show {
    align-items: flex-start;
  }
}

#horoscope-wrapp .subscribe--modal {
  border-radius: 16px;
  background: #091641;
  display: flex;
  flex-direction: column;
  max-width: 414px;
  width: 100%;
}

#horoscope-wrapp .subscribe--modal__top {
  position: relative;
}

#horoscope-wrapp .subscribe--modal__top--hands {
  display: block;
  width: 232px;
  height: 232px;
  margin: 0 auto;
}

@media screen and (max-width: 47.9375em) {
  #horoscope-wrapp .subscribe--modal__top--hands {
    width: 160px;
    height: 160px;
  }
}

#horoscope-wrapp .subscribe--modal__top--close {
  position: absolute;
  display: block;
  top: -24px;
  right: -24px;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

@media screen and (max-width: 47.9375em) {
  #horoscope-wrapp .subscribe--modal__top--close {
    top: 0;
    right: 0;
  }
}

#horoscope-wrapp .subscribe--modal__middle h3 {
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.3px;
  color: #ffffff;
  margin-bottom: 8px;
}

#horoscope-wrapp .subscribe--modal__middle p {
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.3px;
}

#horoscope-wrapp .subscribe--modal__bottom {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

#horoscope-wrapp .subscribe--modal__bottom button {
  max-width: 336px;
  width: 100%;
  margin: 0 auto;
}

#horoscope-wrapp .subscribe--modal__bottom p {
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.3px;
}

#tarot-wrapp {
  background-image: url("/astro/astro-v1/img/tarot/background.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#tarot-wrapp .tarot, #tarot-wrapp .tarot__cards {
  display: flex;
  flex-direction: column;
}

#tarot-wrapp .tarot h1, #tarot-wrapp .tarot__cards h1 {
  color: #ffffff;
  text-align: center;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.3px;
}

#tarot-wrapp .tarot .cards, #tarot-wrapp .tarot__cards .cards {
  position: relative;
  max-width: 331px;
  width: 100%;
  margin: 0 auto;
}

#tarot-wrapp .tarot .cards__card img, #tarot-wrapp .tarot__cards .cards__card img {
  display: block;
  width: 100%;
  transition: opacity 0.3s;
}

#tarot-wrapp .tarot .cards__card:nth-child(1), #tarot-wrapp .tarot__cards .cards__card:nth-child(1) {
  position: absolute;
  top: 0;
  left: 0;
  background-image: url("../../../astro/astro-v1/img/tarot/card_01.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#tarot-wrapp .tarot .cards__card:nth-child(1) img, #tarot-wrapp .tarot__cards .cards__card:nth-child(1) img {
  opacity: 0;
  width: auto;
  height: 175px;
  height: 100%;
}

@media screen and (max-width: 25em) {
  #tarot-wrapp .tarot .cards__card:nth-child(1) img, #tarot-wrapp .tarot__cards .cards__card:nth-child(1) img {
    height: 140px;
  }
}

@media screen and (max-width: 22.4375em) {
  #tarot-wrapp .tarot .cards__card:nth-child(1) img, #tarot-wrapp .tarot__cards .cards__card:nth-child(1) img {
    height: 120px;
  }
}

#tarot-wrapp .tarot .cards__card:nth-child(2), #tarot-wrapp .tarot__cards .cards__card:nth-child(2) {
  position: relative;
  max-width: 98px;
  width: 100%;
  margin: 0 auto;
  background-image: url("../../../astro/astro-v1/img/tarot/card_02.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
  width: 98px;
  height: auto;
}

@media screen and (max-width: 25em) {
  #tarot-wrapp .tarot .cards__card:nth-child(2), #tarot-wrapp .tarot__cards .cards__card:nth-child(2) {
    width: 80px;
  }
}

@media screen and (max-width: 22.4375em) {
  #tarot-wrapp .tarot .cards__card:nth-child(2), #tarot-wrapp .tarot__cards .cards__card:nth-child(2) {
    width: 70px;
  }
}

#tarot-wrapp .tarot .cards__card:nth-child(2) img, #tarot-wrapp .tarot__cards .cards__card:nth-child(2) img {
  opacity: 0;
}

#tarot-wrapp .tarot .cards__card:nth-child(3), #tarot-wrapp .tarot__cards .cards__card:nth-child(3) {
  position: absolute;
  top: 0;
  right: 0;
  background-image: url("../../../astro/astro-v1/img/tarot/card_03.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#tarot-wrapp .tarot .cards__card:nth-child(3) img, #tarot-wrapp .tarot__cards .cards__card:nth-child(3) img {
  opacity: 0;
  width: auto;
  height: 175px;
}

@media screen and (max-width: 25em) {
  #tarot-wrapp .tarot .cards__card:nth-child(3) img, #tarot-wrapp .tarot__cards .cards__card:nth-child(3) img {
    height: 140px;
  }
}

@media screen and (max-width: 22.4375em) {
  #tarot-wrapp .tarot .cards__card:nth-child(3) img, #tarot-wrapp .tarot__cards .cards__card:nth-child(3) img {
    height: 120px;
  }
}

#tarot-wrapp .tarot__slider {
  width: 100%;
  height: 100%;
  overflow: hidden;
  transition: opacity 0.4s;
  position: relative;
}

#tarot-wrapp .tarot__slider--wrapp {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

#tarot-wrapp .tarot__slider--wrapp__card {
  position: relative;
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  background-color: #08273C;
}

#tarot-wrapp .tarot__slider--wrapp__card img {
  transition: opacity 0.2s;
}

#tarot-wrapp .tarot__slider--wrapp__card img.disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

#tarot-wrapp .tarot__slider .swiper-button-next,
#tarot-wrapp .tarot__slider .swiper-button-prev {
  width: 40px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  bottom: 0;
}

@media screen and (max-width: 37.5em) {
  #tarot-wrapp .tarot__slider .swiper-button-next,
  #tarot-wrapp .tarot__slider .swiper-button-prev {
    display: none;
  }
}

#tarot-wrapp .tarot__slider .swiper-button-next.swiper-button-disabled,
#tarot-wrapp .tarot__slider .swiper-button-prev.swiper-button-disabled {
  opacity: 0;
  visibility: hidden;
}

#tarot-wrapp .tarot__slider .swiper-button-next {
  background: linear-gradient(to left, #031D2E, rgba(3, 7, 18, 0));
  right: 0;
}

#tarot-wrapp .tarot__slider .swiper-button-prev {
  background: linear-gradient(to right, #031D2E, rgba(3, 7, 18, 0));
  left: 0;
}

#tarot-wrapp .tarot__cards {
  max-width: 812px !important;
}

#tarot-wrapp .tarot__cards--wrapp {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

#tarot-wrapp .tarot__cards--wrapp__card {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  border-radius: 8px;
  background: #08273C;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.04), 0px 8px 16px 0px rgba(0, 0, 0, 0.08);
}

@media screen and (max-width: 37.5em) {
  #tarot-wrapp .tarot__cards--wrapp__card {
    flex-direction: column;
  }
}

#tarot-wrapp .tarot__cards--wrapp__card--content {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#tarot-wrapp .tarot__cards--wrapp__card--content h4 {
  font-size: 2rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
  background: linear-gradient(90deg, #3d9aff 8.45%, #2c4fbd 99.9%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#tarot-wrapp .tarot__cards--wrapp__card--img {
  position: relative;
  max-width: 145px;
  width: 100%;
  overflow: hidden;
  margin-bottom: auto;
  flex-shrink: 0;
}

@media screen and (max-width: 37.5em) {
  #tarot-wrapp .tarot__cards--wrapp__card--img {
    max-width: 180px;
  }
}

#tarot-wrapp .tarot__cards--wrapp__card--img > div {
  width: 100%;
  padding-top: 150%;
  overflow: hidden;
}

#tarot-wrapp .tarot__cards--wrapp__card--img > div img {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

#tarot-wrapp .tarot__cards--wrapp__card--keywords {
  color: #ffffff;
  font-style: italic;
  font-weight: 600;
  line-height: 1.4;
}

#tarot-wrapp .tarot__cards--wrapp__card--content {
  color: rgba(255, 255, 255, 0.8);
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

#tarot-wrapp .tarot__loader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

#tarot-wrapp .tarot__loader img {
  max-width: 400px;
  width: 100%;
}

.tarot__cards--advisor, #horoscope-wrapp .horoscope_advisor {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 40px;
}

.tarot__cards--advisor h3, #horoscope-wrapp .horoscope_advisor h3 {
  max-width: 520px;
  background: linear-gradient(91deg, #21d1ff 0%, #5068e7 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
}

.tarot__cards--advisor__wrapp, #horoscope-wrapp .horoscope_advisor__wrapp {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 36px;
  width: 100%;
  background-color: #08273C;
}

.tarot__cards--advisor__wrapp p, #horoscope-wrapp .horoscope_advisor__wrapp p {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}

.tarot__cards--advisor__wrapp--detailes, #horoscope-wrapp .horoscope_advisor__wrapp--detailes {
  max-width: 460px;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 16px;
}

.tarot__cards--advisor__wrapp--avatar, #horoscope-wrapp .horoscope_advisor__wrapp--avatar {
  position: relative;
  width: 88px;
  height: 88px;
  border-radius: 50%;
}

.tarot__cards--advisor__wrapp--avatar img, #horoscope-wrapp .horoscope_advisor__wrapp--avatar img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 50%;
}

.tarot__cards--advisor__wrapp--avatar::after, #horoscope-wrapp .horoscope_advisor__wrapp--avatar::after {
  content: '';
  position: absolute;
  right: 6px;
  bottom: 6px;
  display: block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
}

.tarot__cards--advisor__wrapp--avatar.online::after, #horoscope-wrapp .online.horoscope_advisor__wrapp--avatar::after {
  border: 1px solid #219653;
  background: #7AC098;
}

.tarot__cards--advisor__wrapp--avatar.offline::after, #horoscope-wrapp .offline.horoscope_advisor__wrapp--avatar::after {
  border: 1px solid #FC5185;
  background: #FC5185;
}

.tarot__cards--advisor__wrapp--property, #horoscope-wrapp .horoscope_advisor__wrapp--property {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 16px;
}

@media screen and (max-width: 22.4375em) {
  .tarot__cards--advisor__wrapp--property, #horoscope-wrapp .horoscope_advisor__wrapp--property {
    flex-direction: column;
    display: grid;
  }
}

.tarot__cards--advisor__wrapp--property__experience {
  text-transform: lowercase;
}

.tarot__cards--advisor__wrapp--property > div .row, #horoscope-wrapp .horoscope_advisor__wrapp--property > div .row {
  font-size: 16px;
}

.tarot__cards--advisor__wrapp--property > div .row .stars, #horoscope-wrapp .horoscope_advisor__wrapp--property > div .row .stars {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.tarot__cards--advisor__wrapp--property > div .row .stars img, #horoscope-wrapp .horoscope_advisor__wrapp--property > div .row .stars img {
  display: block;
  width: 18px;
  height: 18px;
}

.tarot__cards--advisor__wrapp--property > div .row:first-of-type, #horoscope-wrapp .horoscope_advisor__wrapp--property > div .row:first-of-type {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  column-gap: 4px;
}

.tarot__cards--advisor__wrapp--property > div .row:first-of-type span, #horoscope-wrapp .horoscope_advisor__wrapp--property > div .row:first-of-type span {
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
}

.tarot__cards--advisor__wrapp--property > div .row:last-of-type span, #horoscope-wrapp .horoscope_advisor__wrapp--property > div .row:last-of-type span {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

.tarot__cards--advisor__wrapp--interest, #horoscope-wrapp .horoscope_advisor__wrapp--interest {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
}

.tarot__cards--advisor__wrapp--interest span, #horoscope-wrapp .horoscope_advisor__wrapp--interest span {
  color: #ffffff;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 1;
  background-color: #1A4094;
  padding: 8px 16px;
  border-radius: 100px;
}

#advisor .advisor__wrapper {
  display: flex;
  flex-direction: column;
}

#advisor .advisor__wrapper--profile {
  display: grid;
  background-color: #08273C;
  border-radius: 1.6rem;
  column-gap: 10px;
  row-gap: 1.6rem;
  grid-template-columns: min-content 1fr max-content;
}

@media screen and (max-width: 37.5em) {
  #advisor .advisor__wrapper--profile {
    grid-template-columns: min-content 1fr;
    grid-template-rows: repeat(2, min-content);
  }
}

#advisor .advisor__wrapper--profile__col:nth-child(1) {
  flex: 0 1;
}

#advisor .advisor__wrapper--profile__col:nth-child(2) {
  flex: 1 0;
  display: flex;
  flex-direction: column;
}

#advisor .advisor__wrapper--profile__col:nth-child(3) {
  display: flex;
  flex-direction: column;
}

@media screen and (max-width: 37.5em) {
  #advisor .advisor__wrapper--profile__col:nth-child(3) {
    grid-column: 1 / -1;
  }
}

#advisor .advisor__wrapper--profile__col:nth-child(3) > div {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

@media screen and (max-width: 37.5em) {
  #advisor .advisor__wrapper--profile__col:nth-child(3) > div {
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.6rem;
  }
}

#advisor .advisor__wrapper--profile__col:nth-child(3) a {
  display: inline-block;
  min-width: 118px;
  padding: 16px;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  color: #ffffff;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  border-radius: 32px;
  margin-top: auto;
}

@media screen and (max-width: 47.9375em) {
  #advisor .advisor__wrapper--profile__col:nth-child(3) a {
    padding: 10px 16px;
  }
}

#advisor .advisor__wrapper--profile__img {
  display: block;
  width: 15rem;
  height: 15rem;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 50%;
}

@media screen and (max-width: 47.9375em) {
  #advisor .advisor__wrapper--profile__img {
    width: 10rem;
    height: 10rem;
  }
}

@media screen and (max-width: 25em) {
  #advisor .advisor__wrapper--profile__img {
    width: 7rem;
    height: 7rem;
  }
}

#advisor .advisor__wrapper--profile__name {
  font-size: 2.4rem;
  font-weight: 600;
}

@media screen and (max-width: 47.9375em) {
  #advisor .advisor__wrapper--profile__name {
    font-size: 2rem;
  }
}

@media screen and (max-width: 37.5em) {
  #advisor .advisor__wrapper--profile__name {
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 25em) {
  #advisor .advisor__wrapper--profile__name {
    font-size: 1.6rem;
  }
}

#advisor .advisor__wrapper--profile__expertise {
  display: flex;
  flex-direction: column;
}

#advisor .advisor__wrapper--profile__expertise ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px;
}

#advisor .advisor__wrapper--profile__expertise ul li {
  color: #ffffff;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  padding: 9px 16px;
  border-radius: 20px;
  border: 1px solid #1D4CB3;
}

@media screen and (max-width: 47.9375em) {
  #advisor .advisor__wrapper--profile__expertise ul li {
    padding: 6px 12px;
  }
}

#advisor .advisor__wrapper--profile__star {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  column-gap: 8px;
}

#advisor .advisor__wrapper--profile__star span {
  font-weight: 600;
}

@media screen and (max-width: 37.5em) {
  #advisor .advisor__wrapper--profile__star span {
    font-size: 1.8rem !important;
  }
}

#advisor .advisor__wrapper--profile__star img {
  display: block;
  width: 40px;
  height: 40px;
}

@media screen and (max-width: 47.9375em) {
  #advisor .advisor__wrapper--profile__star img {
    width: 25px;
    height: 25px;
  }
}

@media screen and (max-width: 37.5em) {
  #advisor .advisor__wrapper--profile__star img {
    width: 20px;
    height: 20px;
  }
}

#advisor .advisor__wrapper--profile__review {
  color: #ffffff;
  text-align: right;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 21px;
}

#advisor .advisor__wrapper--tabs {
  padding: 16px;
  border-bottom: 1px solid #1D4CB3;
}

#advisor .advisor__wrapper--tabs ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 16px;
}

#advisor .advisor__wrapper--tabs ul li {
  min-width: 100px;
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  cursor: pointer;
  text-align: left;
}

#advisor .advisor__wrapper--tabs ul li.active {
  font-weight: 600;
}

#advisor .advisor__wrapper--about {
  display: flex;
  flex-direction: column;
}

#advisor .advisor__wrapper--about__row {
  display: flex;
  flex-direction: column;
  background-color: #08273C;
  row-gap: 16px;
}

#advisor .advisor__wrapper--about__row--head {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  font-weight: 600;
  column-gap: 8px;
}

#advisor .advisor__wrapper--about__row--head span {
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

#advisor .advisor__wrapper--about__bio {
  color: rgba(255, 255, 255, 0.8);
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}

#advisor .advisor__wrapper--about__experience {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

#advisor .advisor__wrapper--about__experience li {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  border-radius: 16px;
  background-color: #031D2E;
  justify-content: center;
  align-items: center;
}

#advisor .advisor__wrapper--about__experience li img {
  display: block;
  width: 64px;
  height: 64px;
}

@media screen and (max-width: 47.9375em) {
  #advisor .advisor__wrapper--about__experience li img {
    width: 32px;
    height: 32px;
  }
}

#advisor .advisor__wrapper--about__experience li p {
  color: #ffffff;
  font-style: normal;
  text-align: center;
  font-weight: 400;
  line-height: 1.2;
}

#advisor .advisor__wrapper--about__experience li p span {
  font-weight: 600;
}

#advisor .advisor__wrapper--about__expertise {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
}

#advisor .advisor__wrapper--about__expertise li {
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  background-color: #031D2E;
  padding: 16px;
  border-radius: 16px;
}

#advisor .advisor__wrapper--reviews {
  background-color: #08273C;
}

#advisor .advisor__wrapper--reviews ul {
  display: flex;
  flex-direction: column;
}

#advisor .advisor__wrapper--reviews ul li {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

#advisor .advisor__wrapper--reviews ul li > div {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 8px;
  color: #ffffff;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

#advisor .advisor__wrapper--reviews__user {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 12px;
}

#advisor .advisor__wrapper--reviews__un {
  display: flex;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
  width: 40px;
  height: 40px;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  border-radius: 50px;
}

#advisor .advisor__wrapper--reviews__text {
  color: rgba(255, 255, 255, 0.8);
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

#advisor .advisor__wrapper--reviews__line {
  width: 100%;
  height: 1px;
  background: linear-gradient(81deg, rgba(29, 76, 179, 0.5) 14.34%, rgba(51, 185, 222, 0.5) 85.66%);
  margin-top: 4px;
}

#advisor .advisor__wrapper--reviews__seemore {
  display: block;
  width: 100%;
  text-align: center;
  padding: 64px 0 24px 0;
}

#advisor .advisor__wrapper--reviews__seemore--btn {
  display: inline-block;
  position: relative;
  padding: 12px 36px;
  cursor: pointer;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  outline: none;
  border: none;
  border-radius: 40px;
  z-index: 2;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

#advisor .advisor__wrapper--reviews__seemore--btn::before {
  content: "";
  position: absolute;
  display: block;
  inset: 1px;
  z-index: -1;
  background: #08273C;
  border-radius: 42px;
}

#advisor .advisor__wrapper--reviews__seemore--btn span {
  display: block;
  min-width: 116px;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#advisor .advisor__wrapper--reviews__seemore--spinner {
  display: flex;
  width: 32px;
  padding: 4px;
  margin: 0 auto;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
  --_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
  mask: var(--_m);
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  animation: lds-ring 1s infinite linear;
}

.pricing__wrapp {
  display: flex;
  flex-direction: column;
}

.pricing__container {
  position: relative;
  max-width: 620px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  row-gap: 24px;
  border-radius: 16px;
  background: linear-gradient(151deg, #031d2e 0%, #1184d1 100.54%);
}

.pricing__container--wrapp {
  display: flex;
  flex-direction: column;
  row-gap: 40px;
  max-width: 300px;
  margin: 0 auto;
}

.pricing__container--banner {
  display: block;
  width: 100%;
}

.pricing__container--title {
  color: #ffffff;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
}

.pricing__container--title .highlight {
  color: #2f69dd;
}

.pricing__container--benefits {
  display: grid;
  justify-content: center;
  row-gap: 16px;
}

.pricing__container--benefits li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  column-gap: 8px;
}

.pricing__container--benefits li span.highlight {
  font-weight: 700;
}

.pricing__container--card {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  border-radius: 8px;
  border: 2px solid #77E0FC;
  background: #dce6ff;
  padding: 16px;
}

.pricing__container--card.center {
  justify-content: center;
}

.pricing__container--card__tape {
  position: absolute;
  top: 0;
  right: 16px;
  transform: translateY(-50%);
  padding: 8px 16px;
  border-radius: 4px;
  background: linear-gradient(93deg, #766fcd -3.62%, #1c3ca1 161.36%);
  color: #ffffff;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  white-space: nowrap;
}

.pricing__container--card__description {
  color: #000000;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.pricing__container--card__description span {
  font-weight: 400;
}

.pricing__container--card__description span.highlight {
  font-weight: 700;
  color: #1d4cb3;
}

.pricing__container--card__details {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: start;
  gap: 4px;
}

.pricing__container--card__details span:first-of-type {
  color: #1d4cb3;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
}

.pricing__container--card__details span:last-of-type {
  color: #0f1e43;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
}

.pricing__container--bottom {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.pricing__container--disclaimer {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 8px;
}

.pricing__container--disclaimer span {
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

/*********************
*** Reports blades ***
*********************/
.reports__wrapp {
  position: relative;
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  row-gap: 16px;
  max-width: 500px;
}

@media screen and (min-width: 800px) {
  .reports__wrapp {
    max-width: 900px;
    row-gap: 24px;
  }
}

@media screen and (min-width: 1200px) {
  .reports__wrapp {
    max-width: 1240px;
    row-gap: 48px;
  }
}

.reports__wrapp .paid__reports, .reports__wrapp .all__reports {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  background: #0c2535;
  padding: 48px;
}

@media screen and (max-width: 62.5em) {
  .reports__wrapp .paid__reports, .reports__wrapp .all__reports {
    padding: 32px;
  }
}

@media screen and (max-width: 37.5em) {
  .reports__wrapp .paid__reports, .reports__wrapp .all__reports {
    padding: 24px 16px;
  }
}

.reports__wrapp .paid__reports--head, .reports__wrapp .all__reports--head {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

.reports__wrapp .paid__reports--head p, .reports__wrapp .all__reports--head p {
  color: rgba(255, 255, 255, 0.7);
}

.reports__wrapp .paid__reports--body, .reports__wrapp .all__reports--body {
  display: grid;
  grid-template-columns: 1fr;
  margin-left: auto;
  margin-right: auto;
  gap: 1rem;
  width: 100%;
}

@media screen and (min-width: 800px) {
  .reports__wrapp .paid__reports--body, .reports__wrapp .all__reports--body {
    grid-template-columns: repeat(2, minmax(300px, 1fr));
  }
}

@media screen and (min-width: 1200px) {
  .reports__wrapp .paid__reports--body, .reports__wrapp .all__reports--body {
    grid-template-columns: repeat(3, minmax(300px, 1fr));
  }
}

.reports__wrapp .paid__report, .reports__wrapp .all__report {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  border: 1px solid #031d2e;
  background: linear-gradient(101deg, #0f1e43 4.4%, #1d3774 83.38%);
  background: -webkit-linear-gradient(101deg, #0f1e43 4.4%, #1d3774 83.38%);
  transition: all 0.3s;
  overflow: hidden;
  padding: 32px;
}

@media screen and (max-width: 47.9375em) {
  .reports__wrapp .paid__report, .reports__wrapp .all__report {
    padding: 32px 16px;
  }
}

.reports__wrapp .paid__report:hover, .reports__wrapp .all__report:hover, .reports__wrapp .paid__report.active, .reports__wrapp .active.all__report {
  border-color: #21d1ff;
}

.reports__wrapp .paid__report--ilustration, .reports__wrapp .all__report--ilustration {
  position: absolute;
  bottom: 0;
  right: 0;
}

.reports__wrapp .paid__report--status {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding: 4px 12px;
  align-items: center;
  gap: 4px;
  border-radius: 0 4px 4px 0;
}

.reports__wrapp .paid__report--status span {
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 1;
}

.reports__wrapp .paid__report--status.ready {
  background: #0db39e;
}

.reports__wrapp .paid__report--status.ready span {
  color: #ffffff;
}

.reports__wrapp .paid__report--status.inprogress {
  background: #f7dc8f;
}

.reports__wrapp .paid__report--status.inprogress span {
  color: #031D2E;
}

.reports__wrapp .paid__report.notice, .reports__wrapp .notice.all__report {
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(101deg, rgba(15, 30, 67, 0.25) 4.4%, rgba(29, 55, 116, 0.25) 83.38%);
  background: -webkit-linear-gradient(101deg, rgba(15, 30, 67, 0.25) 4.4%, rgba(29, 55, 116, 0.25) 83.38%);
  min-height: 260px;
}

.reports__wrapp .paid__report--head, .reports__wrapp .all__report--head {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

.reports__wrapp .paid__report--head h4, .reports__wrapp .all__report--head h4 {
  color: #5f85fc;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 4px;
}

.reports__wrapp .paid__report--head p, .reports__wrapp .all__report--head p {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

.reports__wrapp .paid__report--head p.animate, .reports__wrapp .all__report--head p.animate {
  animation: opacity .4s linear infinite;
}

.reports__wrapp .paid__report--head__created {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 8px;
}

.reports__wrapp .paid__report--head__created span {
  color: rgba(255, 255, 255, 0.5);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.reports__wrapp .paid__report--btns, .reports__wrapp .all__report--btns {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: auto;
}

.reports__wrapp .paid__report--btns a, .reports__wrapp .all__report--btns a {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

.reports__wrapp .paid__report--btns a.inprogress, .reports__wrapp .all__report--btns a.inprogress {
  opacity: .5;
  cursor: not-allowed;
}

.reports__wrapp .paid__report--view {
  padding: 8px 16px;
}

.reports__wrapp .paid__report--download {
  padding: 8px 16px;
  column-gap: 8px;
  border-color: #21d1ff;
}

.reports__wrapp .paid__report--download span {
  color: #ffffff;
}

.reports__wrapp .paid__report--notice {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 180px;
}

.reports__wrapp .paid__report--notice svg {
  margin: 0 auto;
}

.reports__wrapp .paid__report--notice p {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

.reports__wrapp .all__report {
  /****************/
  /****************/
}

.reports__wrapp .all__report--label {
  position: absolute;
  top: 0;
  right: 0;
  padding: 6px 10px;
  border-radius: 0 0 0 8px;
  font-size: 12px;
  font-weight: 500;
}

.reports__wrapp .all__report--content {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.reports__wrapp .all__report--content p {
  color: #ffffff;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5;
}

.reports__wrapp .all__report--content ul {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.reports__wrapp .all__report--content ul li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  column-gap: 10px;
}

.reports__wrapp .all__report--content ul li span {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}

.reports__wrapp .all__report--progress {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 4px;
  margin-top: auto;
  border-radius: 12px;
  padding: 16px;
  background: rgba(3, 29, 46, 0.25);
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.04), 0 8px 16px 0 rgba(0, 0, 0, 0.08);
}

.reports__wrapp .all__report--progress__head {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 8px;
  justify-content: space-between;
}

.reports__wrapp .all__report--progress__head span {
  color: #5f85fc;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.reports__wrapp .all__report--progress__bar {
  position: relative;
  width: 100%;
  height: 8px;
  border-radius: 8px;
  background: #ede6e6;
  overflow: hidden;
}

.reports__wrapp .all__report--progress__bar span {
  top: 0;
  bottom: 0;
  position: absolute;
  width: 100%;
  transform: translateX(-8%);
  border-radius: 32px;
  background: linear-gradient(90deg, #5f85fc 0%, #2d9e9e 100%);
  background: -webkit-linear-gradient(90deg, #5f85fc 0%, #2d9e9e 100%);
}

.reports__wrapp .all__report--btns {
  position: relative;
  margin-top: 0;
}

.reports__wrapp .all__report--btns a {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  padding: 8px 16px;
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report:hover {
  border-color: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report--label {
  background: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report--head h4 {
  color: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report--content ul li svg path {
  fill: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report--progress__head span {
  color: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report--progress__bar span {
  background: linear-gradient(90deg, #5f85fc 0%, #2d9e9e 100%);
  -webkit-background: linear-gradient(90deg, #5f85fc 0%, #2d9e9e 100%);
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report--btns a {
  transition: all 0.2s;
  background: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 2) .all__report--btns a:hover {
  background: #4164d2;
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report:hover {
  border-color: #0db39e;
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report--label {
  background: #0db39e;
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report--head h4 {
  color: #0db39e;
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report--content ul li svg path {
  fill: #0db39e;
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report--progress__head span {
  color: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report--progress__bar span {
  background: linear-gradient(90deg, #236a64 0%, #14c7b7 100%);
  background: -webkit-linear-gradient(90deg, #236a64 0%, #14c7b7 100%);
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report--btns a {
  transition: all 0.2s;
  background: #36aa9f;
}

.reports__wrapp .all__report:nth-child(3n + 3) .all__report--btns a:hover {
  background: #18c4b4;
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report:hover {
  border-color: #8272d5;
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report--label {
  background: #8272d5;
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report--head h4 {
  color: #8272d5;
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report--content ul li svg path {
  fill: #8a7bd8;
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report--progress__head span {
  color: #5f85fc;
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report--progress__bar span {
  background: linear-gradient(90deg, #5642ba 0%, #7c68e5 100%);
  background: -webkit-linear-gradient(90deg, #5642ba 0%, #7c68e5 100%);
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report--btns a {
  transition: all 0.2s;
  background: linear-gradient(190deg, #8272d5 1.06%, #aa9fe3 98.95%);
  background: -webkit-linear-gradient(190deg, #8272d5 1.06%, #aa9fe3 98.95%);
}

.reports__wrapp .all__report:nth-child(3n + 1) .all__report--btns a:hover {
  background: linear-gradient(93deg, #766fcd -3.62%, #1c3ca1 161.36%);
  background: -webkit-linear-gradient(93deg, #766fcd -3.62%, #1c3ca1 161.36%);
}

.iframe--overlay {
  position: fixed;
  inset: 0;
  z-index: 9;
  background-image: url("../../../astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  background-image: url("../../../astro/astro-v1/img/confirm_acc.png"), -webkit-linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: center;
}

.iframe--content {
  max-width: 744px;
  margin: 0 auto;
  width: 100%;
  height: 100%;
}

.iframe--close {
  position: absolute;
  right: 40px;
  bottom: 40px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.64);
  background: #fff;
  outline: none;
  border: none;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  line-height: 1;
  font-weight: bolder;
}

@media screen and (max-width: 62.5em) {
  .iframe--close {
    right: 32px;
    bottom: 32px;
    width: 54px;
    height: 54px;
  }
}

@media screen and (max-width: 37.5em) {
  .iframe--close {
    right: 24px;
    bottom: 24px;
    width: 48px;
    height: 48px;
  }
}

.compatibility-reading iframe {
  width: 100%;
  height: 100%;
}

.compatibility-reading__wrapp {
  width: 100%;
  height: 100%;
}

.compatibility-reading__option {
  display: flex;
  flex-direction: column;
  row-gap: 96px;
}

@media screen and (max-width: 22.4375em) {
  .compatibility-reading__option {
    row-gap: 64px;
  }
}

.compatibility-reading__add {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 24px;
  justify-content: center;
}

.compatibility-reading__add .your-sign,
.compatibility-reading__add .your-partner {
  width: 124px;
  height: 124px;
}

@media screen and (max-width: 22.4375em) {
  .compatibility-reading__add .your-sign,
  .compatibility-reading__add .your-partner {
    width: 100px;
    height: 100px;
  }
}

.compatibility-reading__add .your-partner {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 2px dashed #0db39e;
  background: linear-gradient(358deg, #0d0015 2.08%, #0654b8 98.48%);
  background: -webkit-linear-gradient(358deg, #0d0015 2.08%, #0654b8 98.48%);
  overflow: hidden;
  cursor: pointer;
}

.compatibility-reading__notification {
  max-width: 536px;
  margin: 32px auto 0;
  text-align: center;
  color: #FC5185;
  font-size: 16px;
  font-weight: 400;
  font-style: normal;
  line-height: normal;
}

.compatibility-reading__quiz {
  position: relative;
  width: 100%;
  height: 100%;
}

.compatibility-reading__quiz--close {
  position: absolute;
  top: 0px;
  right: 16px;
  display: block;
  max-width: 30px;
  width: 100%;
  padding: 8px 4px;
  margin: 0 auto;
  text-align: right;
}

@media screen and (max-width: 47.9375em) {
  .compatibility-reading__quiz--close {
    right: 0;
  }
}

.compatibility-reading__quiz--close img {
  display: inline-block;
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.compatibility-reading__slider {
  max-width: 536px;
  width: 100%;
  margin: 0 auto;
}

.compatibility-reading__slider .swiper {
  width: 100%;
  height: 100%;
}

.compatibility-reading__slider .swiper-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.compatibility-reading__slider .swiper-slide {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 4px;
  padding: 12px;
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  text-decoration: none;
  min-width: 260px;
  border-radius: 8px;
  background: linear-gradient(101deg, #1d3774 4.4%, #0f1e43 83.38%);
  background: -webkit-linear-gradient(101deg, #1d3774 4.4%, #0f1e43 83.38%);
  overflow: hidden;
}

.compatibility-reading__slider .swiper-slide:not(:last-of-type) {
  margin-right: 16px;
}

@media screen and (max-width: 31.25em) {
  .compatibility-reading__slider .swiper-slide:first-of-type {
    margin-left: 16px;
  }
}

@media screen and (max-width: 31.25em) {
  .compatibility-reading__slider .swiper-slide:last-of-type {
    margin-right: 16px;
  }
}

.compatibility-reading__slider .swiper-slide > img {
  display: block;
  width: 64px;
  height: 64px;
}

.compatibility-reading__slider .swiper-slide > div {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 4px;
  color: #fff;
  font-style: normal;
  line-height: normal;
}

.compatibility-reading__slider .swiper-slide > div p {
  font-size: 14px;
  font-weight: 700;
}

.compatibility-reading__slider .swiper-slide > div span {
  font-size: 12px;
  font-weight: 400;
}

.compatibility-reading__slider .swiper-slide > div button {
  width: 100%;
  text-decoration: none;
  background-color: #fff;
  border-radius: 32px;
  overflow: hidden;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
}

.compatibility-reading__slider .swiper-slide > div button span {
  display: inline-block;
  text-align: center;
  font-size: 12px;
  font-weight: 400;
  border-radius: 32px;
  padding: 4px 24px;
  color: #fff;
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

.compatibility-reading__slider .swiper-slide > div button.download {
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

.compatibility-reading__slider .swiper-slide > div button.download span {
  width: 100%;
}

.birth-chart__wrapp {
  width: 100%;
  height: 100%;
}

/*********************
*** App Components ***
*********************/
.google__btn--box {
  margin: 0 auto 0px;
}

.google__btn--box.hidden {
  margin: 0 auto;
  display: none;
}

.google__btn--box .separator {
  position: relative;
  text-align: center;
}

.google__btn--box .separator p {
  position: relative;
  display: inline-block;
  padding: 0 10px;
}

.google__btn--box .separator p::after {
  height: 1px;
  width: 100%;
}

.google__btn--box #buttonGoogle {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 15px;
}

.google__btn--box #buttonGoogle > div {
  width: auto !important;
  height: 50px !important;
}

.google__btn--box #buttonGoogle > div iframe {
  margin: 0 !important;
}

.google__btn--box #buttonGoogle > div > div > div {
  max-width: 100% !important;
  width: 100% !important;
  height: 50px !important;
  border-radius: 2px !important;
}

.google__btn--box #buttonGoogle > div > div > div > div > div {
  width: 24px !important;
  height: 24px !important;
}

.google__btn--box #buttonGoogle span {
  font-size: 1.6rem;
}

#content-container .loader-fix-bottom {
  width: calc(100% - 64px);
}

#content-container .loader-fix-bottom {
  display: none;
  position: fixed;
  bottom: 50px;
  text-align: center;
  z-index: 9;
}

/* loader position for allmessages and unread messages tab START*/
.loader-list-msg {
  position: absolute;
  bottom: 50px;
  left: 50%;
  transform: translateX(50%);
  -webkit-transform: translateX(50%);
  -moz-transform: translateX(50%);
  -ms-transform: translateX(50%);
  -o-transform: translateX(50%);
}

/* loader position for allmessages and unread messages tab END*/
/* show loader when open chat body START*/
.loader-body-msg {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
}

/* show loader when open chat body END*/
/* loader on send button when user send message START*/
.chat-footer__controls--send-btn .loader-send-msg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(119, 224, 252, 0.64);
}

.chat-footer__controls--send-btn .loader-send-msg .loader {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}

/* loader on send button when user send message END*/
.loader {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
}

.loader div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 34px;
  height: 34px;
  margin: 8px;
  border: 4px solid #00F0C7;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #00F0C7 transparent transparent transparent;
}

.loader div:nth-child(1) {
  animation-delay: -0.45s;
}

.loader div:nth-child(2) {
  animation-delay: -0.3s;
}

.loader div:nth-child(3) {
  animation-delay: -0.15s;
}

@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* bottom cookie bar */
.cookie-for-all-pages-bottom-fixed {
  display: none;
  position: fixed;
  width: 100%;
  background: rgba(8, 39, 60, 0.9);
  z-index: 999;
  left: 0;
  bottom: 0;
}

.cookie-for-all-pages-bottom-fixed-inner {
  width: 360px;
  display: block;
  margin: 0 auto;
  text-align: center;
  padding: 3rem 0 0;
}

.cookie-for-all-pages-bottom-fixed-text {
  color: #ffffff;
  font-size: 1.6rem;
}

@media screen and (max-width: 37.5em) {
  .cookie-for-all-pages-bottom-fixed-text {
    font-size: 1.8rem;
  }
}

.cookie-for-all-pages-bottom-fixed-text p a {
  color: #08273C;
  text-decoration: underline;
}

.cookie-for-all-pages-bottom-fixed-button {
  display: flex;
  align-items: center;
  justify-content: center;
}

.cookie-for-all-pages-bottom-fixed-button button {
  max-width: 220px;
  width: 100%;
  background-color: #08273C;
  color: #ffffff;
  padding: 1rem 2rem;
  cursor: pointer;
  margin: 1.5rem 0;
  font-size: 1.6rem;
}

.cookie-for-all-pages-bottom-fixed-button button:hover {
  background-color: rgba(8, 39, 60, 0.8);
}

/* bottom cookie bar end */
/* cookie info */
.cookie-bar-popup-full {
  position: fixed;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.75);
  width: 100vw;
  height: 100vh;
  overflow-y: auto;
  top: 0;
  left: 0;
  z-index: 9999;
}

@media screen and (max-width: 56.25em) {
  .cookie-bar-popup-full {
    background: #ffffff;
  }
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner {
  max-width: 1024px;
  width: 100%;
  background: #ffffff;
  position: absolute;
  top: 50px;
  left: calc(50% - 512px);
  overflow-y: scroll;
}

@media screen and (max-width: 56.25em) {
  .cookie-bar-popup-full .cookie-bar-popup-full-inner {
    left: 0;
    right: 0;
    margin: 0 auto;
  }
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-title {
  padding: 10px 0;
  position: relative;
  border-radius: 5px 5px 0 0;
  background: #77E0FC;
  top: 0;
  left: 0;
  width: 100%;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-title p {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 1.8rem;
  padding: 0.3rem 0;
  margin: 0;
  width: 30px;
  height: 30px;
  text-align: center;
  vertical-align: middle;
  font-family: "Quicksand", sans-serif !important;
  font-weight: bold;
  cursor: pointer;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-title h3 {
  margin: 0;
  padding: 0 4rem 0 1rem;
  font-size: 1.8rem;
  text-align: center;
}

@media screen and (max-width: 56.25em) {
  .cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-title {
    position: fixed;
  }
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content {
  padding: 0 2rem 2rem 2rem !important;
  width: calc(100% - 4rem);
  margin: 0 auto;
}

@media screen and (max-width: 56.25em) {
  .cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content {
    padding: 0 0.5rem 2rem 0.5rem !important;
    width: calc(100% - 1rem);
  }
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content p {
  line-height: 1.5;
  margin: 0.5rem 0;
  color: #000000;
  font-size: 1.6rem;
}

@media screen and (max-width: 56.25em) {
  .cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content p {
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 37.5em) {
  .cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content p {
    font-size: 1.6rem;
  }
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content ul {
  display: inline-block;
  list-style: none;
  margin: 1rem 0;
  padding: 0;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content ul li {
  display: inline-block;
  margin: 0 1rem;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content ul li img {
  width: 40px;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content #cookie-btn {
  display: block;
  margin: 1rem auto 0 auto;
  max-width: 480px;
  width: 100%;
  padding: 0.6rem;
  background-color: #08273C;
  border: 1px solid #1D4CB3;
  font-size: 1.6rem;
  text-align: center;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner .cookie-bar-popup-full-html-content #cookie-btn strong {
  line-height: 1.8rem;
  color: #ffffff;
  cursor: pointer;
}

.cookie-bar-popup-full .cookie-bar-popup-full-inner::-webkit-scrollbar {
  display: none;
}

/* cookie info end */
/* cookie info 2 */
.cookie-bar-popup-2-full {
  position: fixed;
  z-index: 9999;
  background: #fff;
  width: 100vw;
  height: 100vh;
  overflow-y: auto;
  top: 0;
}

/* .cookie-bar-popup-2-full-inner{} */
.cookie-bar-popup-2-full-html-title {
  padding: 1rem 0;
  position: fixed;
  background: #f8f8f8;
  top: 0;
  left: 0;
  width: 100%;
}

.cookie-bar-popup-2-full-html-title p {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 1.8rem;
  padding: 0.3rem 0;
  margin: 0;
  width: 30px;
  height: 30px;
  text-align: center;
  vertical-align: middle;
  font-family: "Quicksand", sans-serif !important;
  font-weight: bold;
}

.cookie-bar-popup-2-full-html-title h3 {
  margin: 0;
  padding: 0 4rem 0 1rem;
  font-size: 1.8rem;
  text-align: center;
}

.cookie-info-popup-2-off {
  cursor: pointer;
}

.cookie-bar-popup-2-full-html-content {
  padding: 1rem 2rem 1rem;
  width: 100%;
  height: 589px;
  overflow-y: scroll;
  line-height: 1.5;
}

@media screen and (max-width: 56.25em) {
  .cookie-bar-popup-2-full-html-content .cookie-bar-popup-2-full-html-content {
    height: auto;
  }
}

.cookie-bar-popup-2-full-html-content ol {
  padding: 1rem 3rem;
}

.cookie-bar-popup-2-full-html-content h4 {
  margin: 1rem 0;
  font-weight: 700;
}

@media screen and (max-width: 56.25em) {
  .cookie-bar-popup-2-full-html-content h4 {
    font-size: 1.6rem;
  }
}

.cookie-bar-popup-2-full-html-content ul li {
  cursor: pointer;
}

.cookie-bar-popup-2-full-html-content::-webkit-scrollbar {
  display: none;
}

/* cookie info 2 end */
.cookie-bar-popup-2-full-inner {
  font-size: 1.4rem;
}

@media screen and (max-width: 37.5em) {
  .cookie-bar-popup-2-full-inner {
    font-size: 1.6rem;
  }
}

.cookie-bar-popup-2-full-html-title {
  position: absolute;
  border-radius: 5px 5px 0 0;
}

.ps__rail-x {
  /***/
}

.ps-container {
  touch-action: none;
  -ms-touch-action: none;
  overflow: hidden !important;
}

.ps .ps__rail-x:hover,
.ps .ps__rail-y:hover,
.ps .ps__rail-x:focus,
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
  background-color: transparent;
  opacity: 0.9;
}

.sidebar__toggle {
  position: fixed;
  top: 0;
  left: 0;
  width: 71px;
  height: 71px;
  z-index: 8;
  background-color: #08273C;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.sidebar__toggle span {
  display: block;
  width: 28px;
  height: 28px;
}

.sidebar__toggle span.open {
  background-image: url("/astro/astro-v1/icons/menu_close.svg");
  background-size: cover;
  background-position: center;
}

.sidebar__toggle span.close {
  background-image: url("/astro/astro-v1/icons/menu_open.svg");
  background-size: cover;
  background-position: center left;
}

#sidebar {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #08273C;
  border-right: 1px solid #1D4CB3;
  z-index: 7;
  width: 72px;
  padding-top: 72px;
}

#sidebar .sidebar__box {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  -ms-touch-action: initial;
  scrollbar-width: none;
}

#sidebar .sidebar__box::-webkit-scrollbar {
  display: none;
}

#sidebar .sidebar__box--menu {
  display: flex;
  flex-direction: column;
  height: 100%;
}

@media screen and (max-width: 56.25em) {
  #sidebar .sidebar__box--menu {
    touch-action: initial;
  }
}

#sidebar .sidebar__box--menu > a {
  position: relative;
  flex-shrink: 0;
  display: flex;
  justify-content: start;
  align-items: center;
  column-gap: 10px;
  position: relative;
  width: 100%;
  height: 71px;
  line-height: normal;
  padding: 0 24px;
  margin: 0 auto;
  text-decoration: none;
  cursor: pointer;
  color: #ffffff;
  transition: 0.2s;
}

#sidebar .sidebar__box--menu > a:last-child {
  margin-top: auto;
}

#sidebar .sidebar__box--menu > a:not(:first-child):hover {
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

#sidebar .sidebar__box--menu > a.active {
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

#sidebar .sidebar__box--menu > a img {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  margin-right: 0;
}

#sidebar .sidebar__box--menu > a img.round {
  border-radius: 50%;
}

#sidebar .sidebar__box--menu > a > span {
  opacity: 0;
  transition: opacity 0.3s;
}

#sidebar .sidebar__box--menu > a > span > span {
  text-align: left;
  width: 100%;
  font-size: 1.4rem;
  font-weight: 500;
  white-space: nowrap;
}

#sidebar.open {
  width: 234px;
  transition: width 0.3s;
  transition-timing-function: ease-in;
}

#sidebar.open .sidebar__box--menu a > span {
  opacity: 1;
  transition: opacity 0.3s;
  transition-delay: 0.1s;
}

#sidebar.close {
  width: 72px;
  transition: width 0.3s ease-in, border-right 0.3s ease-out 0.2s;
}

@media screen and (max-width: 31.25em) {
  #sidebar.close {
    width: 0px;
    border-right: 1px solid transparent;
    transition: width 0.3s ease-in, border-right 0.3s ease-out 0.15s;
  }
}

#sidebar.close .sidebar__box a > span {
  opacity: 0;
  transition: opacity 0.3s;
  transition-delay: 0.1s;
}

#logout-prompt {
  position: absolute;
  max-width: 460px;
  width: calc(100% - 32px);
  z-index: 9;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 24px;
  background: #ffffff;
  color: #08273C;
}

#logout-prompt .text {
  text-align: center;
  margin-bottom: 36px;
}

#logout-prompt .text p {
  font-size: 20px;
  line-height: 1.5;
}

#logout-prompt .buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex-direction: row;
  flex-wrap: wrap;
}

.ui-tooltip {
  padding: 10px 12px;
  position: absolute;
  z-index: 9999 !important;
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
}

.ui-tooltip::after {
  content: "";
  position: absolute;
  border-style: solid;
  display: block;
  width: 0;
  top: 50%;
  left: -8px;
  border-color: transparent #1d4cb3;
  border-width: 8px 8px 8px 0;
  transform: translateY(-50%);
}

.ui-corner-all {
  border-radius: 4px;
}

.ui-widget-shadow {
  box-shadow: 0 0 3px #08273C;
}

.ui-widget-content {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  color: #ffffff;
}

.ui-helper-hidden-accessible {
  opacity: 0 !important;
}

.confirmMailBox {
  max-width: 320px;
  width: 100%;
  z-index: 999;
  position: relative;
  box-shadow: 0px 5px 10px #757575;
}

.confirmMailBox .top {
  padding: 1rem;
  background-color: #d72020;
  overflow: hidden;
  position: relative;
}

.confirmMailBox .top .title {
  font-size: 1.5rem;
  text-align: center;
  margin: auto;
  color: #ffffff;
}

.confirmMailBox .top .mailIcon {
  max-width: 150px;
  display: block;
  margin: 1rem auto -8rem;
}

.confirmMailBox .bottom {
  background-color: #ffffff;
  padding: 1rem;
}

.confirmMailBox .bottom p {
  margin: 0 auto 1rem;
  line-height: 1;
  color: #757575;
  text-align: center;
}

.confirmMailBox .bottom .mail {
  font-weight: bold;
}

.confirmMailBox .bottom .buttons {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

#dimScreen {
  position: absolute;
  padding: 0;
  margin: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../../../astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  background-size: cover;
  background-position: center;
  z-index: 99999999;
}

#dimScreen .dimScreenInner {
  position: absolute;
  display: block;
  max-width: 500px;
  width: calc(100% - 32px);
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  text-align: center;
  background: #ffffff;
}

#dimScreen .dimScreenInner .holder_dimScreen {
  width: 100%;
}

#dimScreen .dimScreenInner .holder_dimScreen .editableInner h2:not(.pass-text) {
  margin: 0;
  color: #08273C;
  margin-bottom: 1.6rem;
}

#dimScreen .dimScreenInner .holder_dimScreen .pass-text {
  font-weight: 400;
  margin-bottom: 3%;
}

#dimScreen .dimScreenInner .holder_dimScreen > div.hr-bottom {
  border-bottom: 1px solid #A0A0A0;
  margin-bottom: 1rem;
}

#dimScreen .dimScreenInner .holder_dimScreen > div p {
  margin: 0;
  line-height: 1.5;
  color: #08273C;
  margin-bottom: 6px;
}

#dimScreen .dimScreenInner .holder_dimScreen > div a .confirmMail {
  border: none;
  cursor: pointer;
}

#dimScreen .dimScreenInner .holder_dimScreen > div .btn, #dimScreen .dimScreenInner .holder_dimScreen > div .pricing__container--btn {
  margin: 1.6rem auto 0;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  align-items: center;
  width: auto;
  white-space: nowrap;
}

#dimScreen .dimScreenInner .holder_dimScreen > div .btn.provider, #dimScreen .dimScreenInner .holder_dimScreen > div .provider.pricing__container--btn {
  margin-bottom: 1rem;
}

#dimScreen .dimScreenInner .holder_dimScreen > div .countdown {
  display: none;
}

#dimScreen .dimScreenInner .holder_dimScreen > div .countdown .btncount {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 2px solid #08273C;
  background-color: transparent;
  line-height: initial;
  min-width: 100px;
  display: block;
  margin: 1rem auto;
  font-size: 4rem;
  color: #08273C;
}

#dimScreen .dimScreenInner .holder_dimScreen > div .mailsended p {
  font-size: 1.4rem;
  margin-top: .4rem;
  color: #08273C;
}

#dimScreen .dimScreenInner .holder_dimScreen > div input {
  font-size: 1.6rem;
  padding: 8px 15px;
  width: 100%;
  max-width: 278px;
  margin: 3% auto 0;
  display: block;
}

#dimScreen .dimScreenInner .holder_dimScreen .sendConfirm {
  font-weight: bold;
  cursor: pointer;
  font-size: 1.4rem;
}

.hotmailclass {
  display: block;
  height: 28px;
}

.hotmailclass img {
  display: block;
  width: auto;
  height: 100%;
  margin: 0 auto;
}

.yahooclass {
  display: block;
  height: 28px;
}

.yahooclass img {
  display: block;
  width: auto;
  height: 100%;
  margin: 0 auto;
}

.gmailclass {
  display: block;
  height: 28px;
}

.gmailclass img {
  display: block;
  width: auto;
  height: 100%;
  margin: 0 auto;
}

#content-container.wide .modalHolder .confirmMailModal {
  left: calc(50% + 118px);
}

@media screen and (max-width: 47.9375em) {
  #content-container.wide .modalHolder .confirmMailModal {
    left: 50%;
  }
}

#content-container.small .modalHolder .confirmMailModal {
  left: calc(50% + 32px);
}

#content-container.closed .modalHolder .confirmMailModal {
  left: 50%;
}

#content-container .modalHolder {
  background: rgba(119, 224, 252, 0.8);
}

#content-container .modalHolder .confirmMailModal {
  max-width: 432px;
  width: 90%;
  background-color: #031D2E;
  color: #ffffff;
}

#content-container .modalHolder .confirmMailModal .closeModal {
  color: #ffffff;
}

#content-container .modalHolder .confirmMailModal .row:not(.row3) input {
  background-color: #77E0FC;
  border: 1px solid #A0A0A0;
  padding: 1rem 0.8rem;
  color: #ffffff;
}

#content-container .modalHolder .confirmMailModal .row3 #sendConfirmMailCoins {
  padding: 1.6rem;
  border-radius: 2px;
  border: 1px solid #08273C;
  transition: all 0.4s;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1;
  background-color: #08273C;
  color: #ffffff;
}

button.primary.disabled,
button.primary[disabled],
span.btn-primary.primary.disabled,
span.btn-primary.primary[disabled] {
  color: #ffffff;
  background: #08273C;
}

.btn, .pricing__container--btn, .btn-large, .btn-small {
  background-color: transparent;
}

.btn, .pricing__container--btn {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.6rem 3rem;
  border-radius: 100px;
  transition: all 0.4s;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1;
  height: auto;
  text-transform: none;
  text-align: center;
  cursor: pointer;
  border: none;
  outline: none;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  color: #ffffff;
}

.btn-full {
  width: 100%;
}

.btn-transparent {
  background: transparent;
  border: 1px solid #08273C;
  color: #08273C;
}

.btn-transparent:hover {
  background: #08273C;
  color: #ffffff;
}

.btn-action {
  border: 1px solid #00F0C7;
  color: #00F0C7;
}

.btn-action:hover {
  background: #00F0C7;
  color: #ffffff;
}

.profile {
  display: grid;
  background: #08273C;
  overflow: hidden;
  padding: 32px;
  gap: 32px;
  container-type: inline-size;
}

@media (max-width: 420px) {
  .profile {
    padding: 18px 16px;
  }
}

.profile__data {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.profile__data--box {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: center;
  gap: 16px;
}

@container (max-width: 400px) {
  .profile__data--box {
    gap: 8px;
  }
}

.profile__data--box__picture {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}

@container (max-width: 400px) {
  .profile__data--box__picture {
    width: 65px;
    height: 65px;
  }
}

.profile__data--box__picture--img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: top center;
  object-position: top center;
}

.profile__data--box__detiles {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.profile__data--box__detiles--name {
  font-weight: 500;
  text-align: left;
  color: #ffffff;
  margin-right: auto;
}

.profile__data--box__detiles--ratingbox {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

@container (max-width: 000px) {
  .profile__data--box__detiles--ratingbox {
    align-items: flex-start;
    flex-direction: column;
  }
}

.profile__data--box__detiles--ratingbox__rating {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  font-size: 16px;
  font-weight: 500;
  text-align: left;
}

@container (max-width: 400px) {
  .profile__data--box__detiles--ratingbox__rating {
    font-size: 12px;
  }
}

.profile__data--box__detiles--ratingbox__rating img {
  width: 2.2rem;
  height: 2.2rem;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: center;
  object-position: center;
}

.profile__data--box__detiles--ratingbox__review {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1px;
  text-align: left;
}

@container (max-width: 300px) {
  .profile__data--box__detiles--ratingbox__review {
    margin-left: 0;
  }
}

.profile__data--box__detiles--status {
  position: relative;
  font-size: 12px;
  font-weight: 400;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
}

.profile__data--box__detiles--status::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.profile__data--box__detiles--status.online {
  color: #77E0FC;
}

.profile__data--box__detiles--status.online::after {
  background-color: #00F0C7;
}

.profile__data--box__detiles--status.offline {
  color: #FC5185;
}

.profile__data--box__detiles--status.offline::after {
  background-color: #FC5185;
}

.profile__data--benefits {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 16px;
}

.profile__data--benefits > span {
  flex: 0 1 50%;
  font-size: 1.6rem;
  font-weight: 400;
  text-align: left;
  line-height: 1.4;
  color: #ffffff;
}

.profile__data--benefits > span span span {
  color: #33b9de;
}

.profile__data--interests {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
}

.profile__data--interests__btn {
  font-size: 12px;
  color: #ffffff;
  font-weight: normal;
  background-color: #1A4094;
  padding: 8px 16px;
  letter-spacing: 1px;
  border-radius: 100px;
}

.profile__data--about {
  display: block;
  width: 100%;
  max-width: 400px;
  overflow: hidden;
}

@media screen and (max-width: 62.5em) {
  .profile__data--about {
    max-width: 100%;
  }
}

.profile__data--about p, .profile__data--about a {
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.3;
  text-align: left;
}

.profile__data--about a {
  display: inline-block;
  color: #77E0FC;
  text-decoration: underline;
  cursor: pointer;
  margin-top: 1.6rem;
}

.profile__action {
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
  margin-top: auto;
  gap: 24px;
}

@media screen and (max-width: 62.5em) {
  .profile__action {
    gap: 16px;
  }
}

.profile__action--detail {
  display: flex;
  justify-content: center;
  align-items: center;
}

.profile__action--detail span {
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
}

.profile__action--btn {
  padding: 12px 3rem !important;
}

#modal_user_info {
  max-width: 520px;
  padding: 0;
  overflow: hidden;
  background: #ffffff;
}

#modal_user_info.modal {
  border-radius: 16px;
}

@media (max-width: 480px) {
  #modal_user_info {
    padding: 20px 10px;
  }
}

#modal_user_info h3 {
  text-align: center;
  margin: 8px auto;
  color: #08273C;
}

#modal_user_info .lineHolder {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: flex-start;
  margin-bottom: 20px;
  font-size: 20px;
  padding: 0px 10px;
}

#modal_user_info .lineHolder span {
  width: 100%;
  font-weight: 400;
  font-size: 16px;
  color: #08273C;
  margin-bottom: 4px;
}

#modal_user_info .lineHolder p {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 5px;
  justify-content: space-between;
  margin: 0;
}

#modal_user_info .lineHolder p input {
  width: 100%;
  border: 1px solid #A0A0A0;
  height: 36px;
  background: #fff;
  border-radius: 36px;
  font-size: 14px;
  font-weight: 700;
  padding: 8px 10px;
  color: #08273C;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 480px) {
  #modal_user_info .lineHolder p input {
    padding: 8px 5px;
  }
}

#modal_user_info .lineHolder p input::placeholder {
  font-style: italic;
  font-weight: 400;
  color: #777;
}

#modal_user_info .lineHolder p input[type="text"]:disabled {
  background: #a9d9ab !important;
}

#modal_user_info .lineHolder p span {
  margin-left: 8px;
  width: 20px;
  text-align: right;
}

#modal_user_info .lineHolder p #editUserName,
#modal_user_info .lineHolder p #editUserPass {
  cursor: pointer;
}

#modal_user_info .lineHolder p #userEmail {
  font-size: 14px;
  color: #08273C;
  border: 1px solid #08273C;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  margin: 0;
  border-radius: 2px;
}

#modal_user_info .lineHolder p #saveUserName,
#modal_user_info .lineHolder p #saveUserPass {
  display: none;
}

#modal_user_info .lineHolder p #save_new_email {
  display: inline-block;
  min-width: 120px;
  width: auto;
  height: 36px;
  font-size: 14px;
  line-height: 36px;
  padding: 0 16px;
}

#modal_user_info .lineHolder p #userNameSaved,
#modal_user_info .lineHolder p #userPassSaved,
#modal_user_info .lineHolder p #userEmailSaved {
  display: none;
}

#modal_user_info .lineHolder p #userNameSaved img,
#modal_user_info .lineHolder p #userPassSaved img,
#modal_user_info .lineHolder p #userEmailSaved img {
  display: flex;
  align-items: center;
}

#modal_user_info .lineHolder.email-field-holder {
  border-top: 1px solid #08273C;
  border-bottom: 1px solid #08273C;
  gap: 8px;
  padding: 10px;
  margin: auto;
  position: relative;
}

#modal_user_info .lineHolder.email-field-holder #modal_info_spinner {
  position: relative;
  left: 50%;
  bottom: -5px;
  transform: translateX(-50%);
}

#modal_user_info .lineHolder.email-field-holder #modal_info_spinner .loader {
  margin: 0 auto !important;
}

#modal_user_info .lineHolder.email-field-holder .message-for-user {
  font-size: 16px;
  font-weight: 400;
  color: #08273C;
}

#modal_user_info .lineHolder.email-field-holder #msgError {
  width: 100%;
  font-size: 14px;
  color: #d72020;
  line-height: 1.3;
  text-align: center;
}

#modal_user_info #modal_btn_ok {
  display: block;
  min-width: 120px;
  width: auto;
  font-size: 16px;
  line-height: 1;
  margin: 10px auto;
  padding: 12px 36px;
}

#modal_user_info .close-modal {
  position: absolute;
  top: 12px;
  right: 12px;
  border-radius: 50%;
  background-position: center -4px;
  filter: opacity(0.5);
  width: 20px;
  height: 20px;
}

.blocker {
  background-image: url("../../../astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  background-size: cover;
  background-position: center;
}

@media (max-width: 480px) {
  .blocker {
    padding: 20px 10px;
  }
}

#overlay, .notification__loader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  display: flex;
  justify-content: center;
  align-items: center;
}

#overlay.bg, .bg.notification__loader {
  background-image: url("../../../astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  background-size: cover;
  background-position: center;
}

#overlay span, .notification__loader span {
  width: 64px;
  padding: 6px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
  --_m: conic-gradient(#0000 10%, #000),
          linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
  mask: var(--_m);
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  animation: spinner 1s infinite linear;
}

.iziToast {
  border-radius: 12px !important;
  padding: 12px !important;
  min-width: 260px !important;
  width: 100% !important;
  display: inline-flex !important;
  flex-direction: row-reverse !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
}

.iziToast-wrapper-topRight {
  top: 50px !important;
}

.iziToast > .iziToast-body {
  margin-left: 0 !important;
  flex-grow: 1;
}

.iziToast > .iziToast-cover {
  position: relative !important;
  top: unset !important;
  left: unset !important;
  bottom: unset !important;
  height: 60px !important;
  width: 60px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}

.iziToast > .iziToast-body .iziToast-texts {
  margin: 0 !important;
}

.iziToast > .iziToast-body .iziToast-message {
  margin: 6px 0 0 0 !important;
}

.notification {
  position: fixed;
  width: 100%;
  bottom: 0;
  right: 0;
  z-index: 9;
  background-color: #08273C;
  transform: translateX(100%);
  display: grid;
  grid-template-rows: min-content 1fr;
  max-width: 375px;
  row-gap: 32px;
  transition: transform .2s;
}

@media screen and (max-width: 31.25em) {
  .notification {
    top: 0 !important;
    max-width: 500px;
  }
}

.notification.show {
  transform: translateX(0);
}

.notification__head {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  column-gap: 8px;
  padding: 16px;
  background: rgba(3, 29, 46, 0.05);
  box-shadow: 0px 4px 18px 0px rgba(47, 43, 61, 0.16);
}

.notification__head--btn {
  display: none;
  cursor: pointer;
}

@media screen and (max-width: 31.25em) {
  .notification__head--btn {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    column-gap: 8px;
  }
}

.notification__head--btn img {
  width: 24px;
  height: 24px;
}

.notification__head--btn span {
  color: #ffffff;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.notification__head--new {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 2px 10px;
  border-radius: 4px;
  background: #7367f029;
  margin-left: auto;
  color: #33b9de;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.notification__body {
  position: relative;
  height: auto;
}

.notification__list {
  position: absolute;
  inset: 0;
}

.notification__list a {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  column-gap: 12px;
  text-decoration: none;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  transition: hover 0.3s;
}

.notification__list a:last-of-type {
  margin-bottom: 24px;
}

.notification__list a:hover {
  background: rgba(3, 29, 46, 0.6);
}

.notification__list a.new {
  background: rgba(119, 224, 252, 0.1);
}

.notification__list a.new:hover {
  background: rgba(3, 29, 46, 0.6);
}

.notification__list--img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  flex-shrink: 0;
}

.notification__list--content {
  flex-grow: 1;
}

.notification__list--title {
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.4;
}

.notification__list--msg {
  color: rgba(255, 255, 255, 0.7);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.4px;
}

.notification__list--time {
  display: block;
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.4px;
  margin-top: 4px;
}

.notification__list--status {
  flex-shrink: 0;
  display: block;
  margin-top: 2;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  color: #031D2E;
  font-size: 12px;
  font-style: normal;
  text-align: center;
  font-weight: 400;
  line-height: 16px;
}

.notification__list--status.unread {
  background-color: #00F0C7;
}

.notification__list--no-notification {
  color: rgba(255, 255, 255, 0.4);
  font-size: 16px;
  text-align: center;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.4px;
}

.notification__counter {
  position: relative;
  flex-shrink: 0;
  width: 24px;
  height: 25px;
  background: url("/astro/astro-v1/icons/notification.svg");
  background-position: center;
  background-size: cover;
  margin-left: 14px;
}

.notification__counter--box {
  position: absolute;
  inset: 0;
  cursor: pointer;
}

.notification__counter--box > span {
  position: absolute;
  top: -6px;
  right: -3px;
  width: 17px;
  height: 17px;
  background-color: #FC5185;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 13px;
  line-height: 1;
  color: #ffffff;
}

.download__banner.inside {
  grid-column: 1 / -1;
}

.download__banner.inside .banner__close {
  display: none;
}

.download__banner.popup {
  position: fixed;
  top: 71px;
  left: 71px;
  bottom: 0;
  right: 0;
  padding: 80px 1.6rem;
  z-index: 1;
  background-image: url("../../../astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  opacity: 1;
  visibility: visible;
  transition: opacity .4s;
  overflow: auto;
}

@media screen and (min-width: 800px) {
  .download__banner.popup {
    padding: 40px 1.6rem;
    align-items: center;
  }
}

@media screen and (max-width: 31.25em) {
  .download__banner.popup {
    left: 0;
  }
}

.download__banner.popup.hide {
  opacity: 0;
  visibility: hidden;
}

.download__banner.popup .banner__close {
  position: absolute;
  top: 16px;
  right: 16px;
  cursor: pointer;
}

@media screen and (max-width: 800px) {
  .download__banner.popup .banner__close {
    top: 8px;
    right: 8px;
  }
}

.download__banner--container {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  max-width: 400px;
  width: 100%;
  margin: 0 auto;
  background-color: #08273C;
  border-radius: 1.6rem;
  padding: 40px 80px;
  column-gap: 80px;
}

@media screen and (min-width: 800px) {
  .download__banner--container {
    max-width: 900px;
  }
}

@media screen and (min-width: 1200px) {
  .download__banner--container {
    max-width: 988px;
  }
}

@media screen and (max-width: 56.25em) {
  .download__banner--container {
    padding: 24px;
    column-gap: 32px;
  }
}

@media (max-width: 800px) {
  .download__banner--container {
    flex-direction: column;
    row-gap: 32px;
  }
}

.download__banner--container__content {
  flex: 0 1 50%;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.download__banner--container__content h2 {
  font-size: 3.2rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@media screen and (max-width: 56.25em) {
  .download__banner--container__content h2 {
    font-size: 2.6rem;
  }
}

@media screen and (max-width: 37.5em) {
  .download__banner--container__content h2 {
    font-size: 2.2rem;
  }
}

.download__banner--container__content p {
  color: rgba(255, 255, 255, 0.7);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

.download__banner--container__content p span {
  color: #33b9de;
}

.download__banner--container__content a {
  display: inline-block;
  padding: 8px 40px;
  border-radius: 100px;
  background: -webkit-linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  color: #fafafa;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  margin-right: auto;
  margin-top: 24px;
}

.download__banner--container__image {
  flex: 0 1 50%;
  display: flex;
  flex-direction: column;
  background: url("/astro/astro-v1/img/banner/bg.jpg");
  background-position: center;
  background-size: cover;
  border-radius: 16px;
  width: 100%;
  padding: 32px;
}

@media screen and (max-width: 37.5em) {
  .download__banner--container__image {
    padding: 16px 24px;
  }
}

.download__banner--container__image p {
  color: #ffffff;
  text-align: center;
  font-size: 2rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.4;
  text-transform: uppercase;
}

@media screen and (max-width: 56.25em) {
  .download__banner--container__image p {
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 37.5em) {
  .download__banner--container__image p {
    padding: 1.6rem;
  }
}

.download__banner--container__image p span {
  color: #33b9de;
}

.download__banner--container__image img {
  display: block;
  width: 100%;
}

.feature-slider {
  grid-column: 1 / -1;
  overflow-y: auto;
}

@media screen and (max-width: 31.25em) {
  .feature-slider {
    margin: 0 -16px;
  }
}

.feature-slider .swiper {
  width: 100%;
  height: 100%;
}

.feature-slider .swiper-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.feature-slider .swiper-slide {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 4px;
  align-items: center;
  padding: 8px 12px;
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  text-decoration: none;
  min-width: 298px;
  max-width: 298px;
  height: 88px;
  border-radius: 12px;
  overflow: hidden;
}

@media screen and (max-width: 22.4375em) {
  .feature-slider .swiper-slide {
    min-width: 270px;
    max-width: 270px;
  }
}

.feature-slider .swiper-slide::after {
  content: '';
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(57deg, #1D4CB3 14.34%, #7275EF 85.66%);
  z-index: -1;
}

.feature-slider .swiper-slide:not(:last-of-type) {
  margin-right: 16px;
}

@media screen and (max-width: 31.25em) {
  .feature-slider .swiper-slide:first-of-type {
    margin-left: 16px;
  }
}

@media screen and (max-width: 31.25em) {
  .feature-slider .swiper-slide:last-of-type {
    margin-right: 16px;
  }
}

.feature-slider .swiper-slide > img {
  display: block;
  width: 50px;
  height: auto;
  flex-shrink: 0;
}

.feature-slider .swiper-slide > div {
  flex: 1 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 4px;
}

.feature-slider .swiper-slide > div > p {
  color: #fff;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.feature-slider .swiper-slide > div > span {
  color: #fff;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.report__pending {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  margin: 0 auto;
  max-width: 360px;
}

.report__pending--image img {
  display: block;
  width: 100%;
}

.report__pending--text {
  text-align: center;
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  background: linear-gradient(57deg, #1d4cb3 14.34%, #33b9de 85.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@media screen and (max-width: 25em) {
  .report__pending--text {
    font-size: 24px;
  }
}

.footer-mc {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  column-gap: 16px;
  padding: 5px;
  z-index: 7;
  box-shadow: 0 -2px 3px -1px #33b9de;
}

.footer-mc > svg {
  width: auto;
  height: 18px;
}

.footer-mc > p {
  font-size: 11px;
}

.age-confirmation {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 8;
  padding-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media screen and (max-width: 22.4375em) {
  .age-confirmation {
    align-items: flex-start;
  }
}

.age-confirmation__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url("../../../astro/astro-v1/img/confirm_acc.png"), linear-gradient(151deg, rgba(3, 29, 46, 0.8) 0%, rgba(17, 132, 209, 0.8) 100.54%);
  background-size: cover;
  background-position: center;
}

.age-confirmation__modal {
  position: relative;
  max-width: 490px;
  width: calc(100% - 32px);
  background: #ffffff;
  display: flex;
  flex-direction: column;
  border-radius: 24px;
}

.age-confirmation__modal--top {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.age-confirmation__modal--top img {
  display: block;
  margin-bottom: 16px;
}

.age-confirmation__modal--top h2 {
  color: #e59439;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
}

.age-confirmation__modal--top p {
  color: rgba(8, 39, 60, 0.8);
  text-align: center;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
}

.age-confirmation__modal--bottom {
  display: flex;
  flex-direction: column;
}

.age-confirmation__modal--bottom p {
  color: rgba(8, 39, 60, 0.7);
  text-align: center;
  font-style: normal;
  font-weight: 500;
  line-height: 1.3;
}

:not(#signin)::-webkit-scrollbar,
:not(#coinspayments-billers)::-webkit-scrollbar {
  display: none;
}

*:not(#coinspayments-billers),
*:not(#signin),
*:not(#coinspayments-billers)::after,
*:not(#signin)::after,
*:not(#coinspayments-billers)::before,
*:not(#signin)::before {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: inherit;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

html, body {
  min-height: 100%;
}

html {
  font-size: 62.5%;
}

body {
  box-sizing: border-box;
  background-color: #08273C;
  color: #ffffff;
}

form {
  margin-bottom: 0;
}

:active,
:focus {
  outline: 0;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

textarea:focus,
input:focus {
  outline: 0;
}

footer,
header,
menu,
nav,
section {
  display: block;
}

#root-wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  bottom: 0;
}

#content-container {
  position: relative;
  height: 100%;
  background-color: #031D2E;
  margin-left: 71px;
}

@media screen and (max-width: 31.25em) {
  #content-container {
    margin-left: 0;
    padding-left: 71px;
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes spinner {
  to {
    transform: rotate(1turn);
  }
}

@keyframes kenburns-1 {
  0% {
    opacity: 1;
    transform: scale(1.2);
  }
  1.5625% {
    opacity: 1;
  }
  23.4375% {
    opacity: 1;
  }
  26.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
  98.4375% {
    opacity: 0;
    transform: scale(1.21176);
  }
  100% {
    opacity: 1;
  }
}

@keyframes kenburns-2 {
  23.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  26.5625% {
    opacity: 1;
  }
  48.4375% {
    opacity: 1;
  }
  51.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}

@keyframes kenburns-3 {
  48.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  51.5625% {
    opacity: 1;
  }
  73.4375% {
    opacity: 1;
  }
  76.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}

@keyframes kenburns-4 {
  73.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  76.5625% {
    opacity: 1;
  }
  98.4375% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}

@keyframes shake-input {
  0% {
    transform: scale(0.99);
  }
  33% {
    transform: scale(1.01);
  }
  66% {
    transform: scale(0.99);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes opacity {
  0%, 100% {
    opacity: 0.8;
  }
  50% {
    opacity: 0.5;
  }
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Heavy.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-HeavyItalic.ttf") format("truetype");
  font-weight: 800;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-RegularItalic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Semibold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-SemiboldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-Ultralight.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url("/astro/astro-v1/fonts/SFProDisplay-UltralightItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}

html, body {
  min-height: 100%;
}

body {
  font-family: 'SF Pro Display', sans-serif;
}

h4 {
  font-size: 2.2rem;
}

h5 {
  font-size: 2rem;
}

h6 {
  font-size: 1.8rem;
}

a {
  text-decoration: none;
}

input,
label {
  font-size: 1.4rem;
}

@supports (-webkit-touch-callout: none) {
  input,
  textarea,
  select {
    font-size: 16px !important;
    transform: scale(0.875);
    transform-origin: left center;
  }
}

.wide-header {
  height: 71px;
}

.notification {
  top: 71px;
}

#maindata, .message, #chat-container, .profile-view-wrapper, #settings, #tos-page, .thanks__page, .declined_page, #horoscope-wrapp, #tarot-wrapp, #advisor.advisor, .pricing, .reports, .compatibility-reading, .birth-chart {
  position: absolute !important;
  width: 100%;
  margin: 0;
  top: 71px;
  left: 0;
  right: 0;
  bottom: 0;
}

.message, .profile-view-wrapper .profile-view, #advisor .advisor__wrapper, .pricing__wrapp {
  max-width: 880px;
  width: 100%;
  margin: 0 auto;
}

#chat-container .chat-page, #tos-page .tos-main-page, #horoscope-wrapp .horoscope, #tarot-wrapp .tarot, #tarot-wrapp .tarot__cards {
  max-width: 1080px;
  width: 100%;
  margin: 0 auto;
}

#maindata .perfect-advisor__start > div h4, #horoscope-wrapp .horoscope_for p, .age-confirmation__modal--top h2, h1 {
  font-size: 3.2rem;
}

@media screen and (max-width: 47.9375em) {
  #maindata .perfect-advisor__start > div h4, #horoscope-wrapp .horoscope_for p, .age-confirmation__modal--top h2, h1 {
    font-size: 2.6rem;
  }
}

.activeMember_inner h3,
.checkSub_inner h3, .pricing__container--title, h2 {
  font-size: 2.8rem;
}

@media screen and (max-width: 47.9375em) {
  .activeMember_inner h3,
  .checkSub_inner h3, .pricing__container--title, h2 {
    font-size: 2.4rem;
  }
}

#maindata .home__wrapp--profiles .section__wrapp--head__title div h4, .search__modal--header__title, .profile-view-wrapper .profile-view .user__profile--box__data--name, .thanks__page--modal__header h2, .thanks__subscription--modal__title, .declined_page--modal__header h4, #horoscope-wrapp .horoscope_content--sign__info > p, #horoscope-wrapp .birthdate--modal__top h3,
#horoscope-wrapp .horoscope-error--modal__top h3, #horoscope-wrapp .subscribe--modal__middle h3, #advisor .advisor__wrapper--profile__star span, .pricing__container--title.second, .pricing__container--benefits li span.highlight, .reports__wrapp .paid__reports--head h3, .reports__wrapp .all__reports--head h3, #modal_user_info h3, .age-confirmation__modal--top p, h3 {
  font-size: 2.4rem;
}

@media screen and (max-width: 47.9375em) {
  #maindata .home__wrapp--profiles .section__wrapp--head__title div h4, .search__modal--header__title, .profile-view-wrapper .profile-view .user__profile--box__data--name, .thanks__page--modal__header h2, .thanks__subscription--modal__title, .declined_page--modal__header h4, #horoscope-wrapp .horoscope_content--sign__info > p, #horoscope-wrapp .birthdate--modal__top h3,
  #horoscope-wrapp .horoscope-error--modal__top h3, #horoscope-wrapp .subscribe--modal__middle h3, #advisor .advisor__wrapper--profile__star span, .pricing__container--title.second, .pricing__container--benefits li span.highlight, .reports__wrapp .paid__reports--head h3, .reports__wrapp .all__reports--head h3, #modal_user_info h3, .age-confirmation__modal--top p, h3 {
    font-size: 2.1rem;
  }
}

#tos-page .tos-main-page h2, #tos-page .tos-main-page h3, #dimScreen .dimScreenInner .holder_dimScreen .editableInner h2:not(.pass-text) {
  font-size: 2.2rem;
}

@media screen and (max-width: 47.9375em) {
  #tos-page .tos-main-page h2, #tos-page .tos-main-page h3, #dimScreen .dimScreenInner .holder_dimScreen .editableInner h2:not(.pass-text) {
    font-size: 1.9rem;
  }
}

#tos-page .tos-main-page h4, .declined_page--modal__body h5, #horoscope-wrapp .horoscope_advisor h3, .tarot__cards--advisor h3, .pricing__container--card__description, .reports__wrapp .paid__report--head h4, .reports__wrapp .all__report--head h4 {
  font-size: 2rem;
}

@media screen and (max-width: 47.9375em) {
  #tos-page .tos-main-page h4, .declined_page--modal__body h5, #horoscope-wrapp .horoscope_advisor h3, .tarot__cards--advisor h3, .pricing__container--card__description, .reports__wrapp .paid__report--head h4, .reports__wrapp .all__report--head h4 {
    font-size: 1.8rem;
  }
}

.tarot__cards--advisor__wrapp p, #horoscope-wrapp .horoscope_advisor__wrapp p, .wide-header--title h6 {
  font-size: 1.8rem;
}

@media screen and (max-width: 47.9375em) {
  .tarot__cards--advisor__wrapp p, #horoscope-wrapp .horoscope_advisor__wrapp p, .wide-header--title h6 {
    font-size: 1.7rem;
  }
}

@media screen and (max-width: 22.4375em) {
  .tarot__cards--advisor__wrapp p, #horoscope-wrapp .horoscope_advisor__wrapp p, .wide-header--title h6 {
    font-size: 1.6rem;
  }
}

#maindata .perfect-advisor .quiz__description, #maindata .perfect-advisor__start > div p, #maindata .perfect-advisor__start button, #maindata .perfect-advisor__progres ul li > span, #maindata .perfect-advisor__final ul li > span, .activeMember_inner.confirm button.skipIntro,
.checkSub_inner.confirm button.skipIntro, .activeMember_inner.introduce ul li,
.checkSub_inner.introduce ul li, .activeMember_inner p,
.checkSub_inner p, #chat-container .chat-page__wrapper .out-of-coins-footer .accented, .profile-view-wrapper .profile-view__tabs > div, .profile-view-wrapper .profile-view .about-me__wrapper .profile-about__description, .profile-view-wrapper .profile-view .about-me__wrapper .profile-about__description--edit, .profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row label, .profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span, .profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span select, .profile-view-wrapper .profile-view .reading__wrapper--feature__content p, #tos-page .tos-main-page .tos-main-menu__item, #tos-page .tos-main-page ul li, #tos-page .tos-main-page ol li, #tos-page .tos-main-page .tos-section .see-more, .thanks__page--modal__body p, .declined_page--modal__body p, #horoscope-wrapp .horoscope_content--sign__info > span, #horoscope-wrapp .horoscope_content--data h3 span, #horoscope-wrapp .horoscope_content--data p, #horoscope-wrapp .birthdate--modal__top p,
#horoscope-wrapp .horoscope-error--modal__top p, #tarot-wrapp .tarot__cards--wrapp__card--keywords, #tarot-wrapp .tarot__cards--wrapp__card--content, #advisor .advisor__wrapper--profile__expertise span, #advisor .advisor__wrapper--tabs ul li, #advisor .advisor__wrapper--about__row--head, #advisor .advisor__wrapper--about__bio, #advisor .advisor__wrapper--about__experience li p, #advisor .advisor__wrapper--about__expertise li, #advisor .advisor__wrapper--reviews ul li > div, #advisor .advisor__wrapper--reviews__text, .pricing__container--benefits li span, .pricing__container--card__details span:first-of-type, .reports__wrapp .paid__reports--head p, .reports__wrapp .all__reports--head p, #dimScreen .dimScreenInner .holder_dimScreen .pass-text, #dimScreen .dimScreenInner .holder_dimScreen > div p, .profile__data--box__detiles--name, .age-confirmation__modal--bottom p, p {
  font-size: 1.8rem;
}

@media screen and (max-width: 47.9375em) {
  #maindata .perfect-advisor .quiz__description, #maindata .perfect-advisor__start > div p, #maindata .perfect-advisor__start button, #maindata .perfect-advisor__progres ul li > span, #maindata .perfect-advisor__final ul li > span, .activeMember_inner.confirm button.skipIntro,
  .checkSub_inner.confirm button.skipIntro, .activeMember_inner.introduce ul li,
  .checkSub_inner.introduce ul li, .activeMember_inner p,
  .checkSub_inner p, #chat-container .chat-page__wrapper .out-of-coins-footer .accented, .profile-view-wrapper .profile-view__tabs > div, .profile-view-wrapper .profile-view .about-me__wrapper .profile-about__description, .profile-view-wrapper .profile-view .about-me__wrapper .profile-about__description--edit, .profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row label, .profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span, .profile-view-wrapper .profile-view .about-me__wrapper--box__block .data-table .data-row span select, .profile-view-wrapper .profile-view .reading__wrapper--feature__content p, #tos-page .tos-main-page .tos-main-menu__item, #tos-page .tos-main-page ul li, #tos-page .tos-main-page ol li, #tos-page .tos-main-page .tos-section .see-more, .thanks__page--modal__body p, .declined_page--modal__body p, #horoscope-wrapp .horoscope_content--sign__info > span, #horoscope-wrapp .horoscope_content--data h3 span, #horoscope-wrapp .horoscope_content--data p, #horoscope-wrapp .birthdate--modal__top p,
  #horoscope-wrapp .horoscope-error--modal__top p, #tarot-wrapp .tarot__cards--wrapp__card--keywords, #tarot-wrapp .tarot__cards--wrapp__card--content, #advisor .advisor__wrapper--profile__expertise span, #advisor .advisor__wrapper--tabs ul li, #advisor .advisor__wrapper--about__row--head, #advisor .advisor__wrapper--about__bio, #advisor .advisor__wrapper--about__experience li p, #advisor .advisor__wrapper--about__expertise li, #advisor .advisor__wrapper--reviews ul li > div, #advisor .advisor__wrapper--reviews__text, .pricing__container--benefits li span, .pricing__container--card__details span:first-of-type, .reports__wrapp .paid__reports--head p, .reports__wrapp .all__reports--head p, #dimScreen .dimScreenInner .holder_dimScreen .pass-text, #dimScreen .dimScreenInner .holder_dimScreen > div p, .profile__data--box__detiles--name, .age-confirmation__modal--bottom p, p {
    font-size: 1.6rem;
  }
}

.thanks__subscription--modal__description, .pricing__container--card__details span:last-of-type {
  font-size: 1.6rem;
}

@media screen and (max-width: 47.9375em) {
  .thanks__subscription--modal__description, .pricing__container--card__details span:last-of-type {
    font-size: 1.4rem;
  }
}

.search__modal, .activeMember_inner,
.checkSub_inner, .thanks__subscription, #horoscope-wrapp .subscribe--modal, .pricing__container {
  padding: 4.8rem;
}

@media screen and (max-width: 47.9375em) {
  .search__modal, .activeMember_inner,
  .checkSub_inner, .thanks__subscription, #horoscope-wrapp .subscribe--modal, .pricing__container {
    padding: 3.4rem;
  }
}

@media screen and (max-width: 31.25em) {
  .search__modal, .activeMember_inner,
  .checkSub_inner, .thanks__subscription, #horoscope-wrapp .subscribe--modal, .pricing__container {
    padding: 2rem;
  }
}

#chat-container .chat-page__wrapper, .tarot__cards--advisor__wrapp, #horoscope-wrapp .horoscope_advisor__wrapp, #dimScreen .dimScreenInner, .age-confirmation__modal {
  padding: 3.2rem;
}

@media screen and (max-width: 47.9375em) {
  #chat-container .chat-page__wrapper, .tarot__cards--advisor__wrapp, #horoscope-wrapp .horoscope_advisor__wrapp, #dimScreen .dimScreenInner, .age-confirmation__modal {
    padding: 1.6rem;
  }
}

.message__wrapper--container .message-item .message-content, #tos-page .tos-main-page .tos-main-menu__item, #tarot-wrapp .tarot__cards--wrapp__card, #advisor .advisor__wrapper--profile, #advisor .advisor__wrapper--about__row, #advisor .advisor__wrapper--about__experience li, #advisor .advisor__wrapper--reviews {
  padding: 2.4rem;
}

@media screen and (max-width: 47.9375em) {
  .message__wrapper--container .message-item .message-content, #tos-page .tos-main-page .tos-main-menu__item, #tarot-wrapp .tarot__cards--wrapp__card, #advisor .advisor__wrapper--profile, #advisor .advisor__wrapper--about__row, #advisor .advisor__wrapper--about__experience li, #advisor .advisor__wrapper--reviews {
    padding: 1.6rem;
  }
}

@media screen and (max-width: 31.25em) {
  .message__wrapper--container .message-item .message-content, #tos-page .tos-main-page .tos-main-menu__item, #tarot-wrapp .tarot__cards--wrapp__card, #advisor .advisor__wrapper--profile, #advisor .advisor__wrapper--about__row, #advisor .advisor__wrapper--about__experience li, #advisor .advisor__wrapper--reviews {
    padding: 1rem 1.6rem;
  }
}

#maindata .home__wrapp, .message, .profile-view-wrapper .profile-view, #settings .settings-container, #tos-page .tos-main-page, #horoscope-wrapp .horoscope, #tarot-wrapp .tarot, #tarot-wrapp .tarot__cards, #advisor .advisor__wrapper, .pricing__wrapp, .reports__wrapp, .compatibility-reading__option, .birth-chart__quiz, .birth-chart__report, .report__pending {
  padding: 6rem 1.6rem 3.2rem;
}

@media screen and (max-width: 62.5em) {
  #maindata .home__wrapp, .message, .profile-view-wrapper .profile-view, #settings .settings-container, #tos-page .tos-main-page, #horoscope-wrapp .horoscope, #tarot-wrapp .tarot, #tarot-wrapp .tarot__cards, #advisor .advisor__wrapper, .pricing__wrapp, .reports__wrapp, .compatibility-reading__option, .birth-chart__quiz, .birth-chart__report, .report__pending {
    padding: 6rem 1.6rem 2.8rem;
  }
}

@media screen and (max-width: 47.9375em) {
  #maindata .home__wrapp, .message, .profile-view-wrapper .profile-view, #settings .settings-container, #tos-page .tos-main-page, #horoscope-wrapp .horoscope, #tarot-wrapp .tarot, #tarot-wrapp .tarot__cards, #advisor .advisor__wrapper, .pricing__wrapp, .reports__wrapp, .compatibility-reading__option, .birth-chart__quiz, .birth-chart__report, .report__pending {
    padding: 4rem 1.6rem 2.4rem;
  }
}

.message__wrapper--container .message-item:not(:last-of-type) {
  margin-bottom: 3.2rem;
}

@media screen and (max-width: 47.9375em) {
  .message__wrapper--container .message-item:not(:last-of-type) {
    margin-bottom: 2.4rem;
  }
}

@media screen and (max-width: 31.25em) {
  .message__wrapper--container .message-item:not(:last-of-type) {
    margin-bottom: 1.6rem;
  }
}

.thanks__subscription--modal, .reports__wrapp .paid__reports--body, .reports__wrapp .all__reports--body, .reports__wrapp .paid__report, .reports__wrapp .all__report, .age-confirmation__modal {
  gap: 3.2rem;
}

@media screen and (max-width: 62.5em) {
  .thanks__subscription--modal, .reports__wrapp .paid__reports--body, .reports__wrapp .all__reports--body, .reports__wrapp .paid__report, .reports__wrapp .all__report, .age-confirmation__modal {
    gap: 2.4rem;
  }
}

@media screen and (max-width: 47.9375em) {
  .thanks__subscription--modal, .reports__wrapp .paid__reports--body, .reports__wrapp .all__reports--body, .reports__wrapp .paid__report, .reports__wrapp .all__report, .age-confirmation__modal {
    gap: 1.6rem;
  }
}

.profile-view-wrapper .profile-view .reading__wrapper, .thanks__subscription--modal__content, #tarot-wrapp .tarot__cards--wrapp__card, #advisor .advisor__wrapper--profile__col:nth-child(2) {
  gap: 2.4rem;
}

@media screen and (max-width: 47.9375em) {
  .profile-view-wrapper .profile-view .reading__wrapper, .thanks__subscription--modal__content, #tarot-wrapp .tarot__cards--wrapp__card, #advisor .advisor__wrapper--profile__col:nth-child(2) {
    gap: 1.6rem;
  }
}

#horoscope-wrapp .horoscope, #tarot-wrapp .tarot, #tarot-wrapp .tarot__cards {
  row-gap: 8rem;
}

@media screen and (max-width: 62.5em) {
  #horoscope-wrapp .horoscope, #tarot-wrapp .tarot, #tarot-wrapp .tarot__cards {
    row-gap: 6rem;
  }
}

@media screen and (max-width: 47.9375em) {
  #horoscope-wrapp .horoscope, #tarot-wrapp .tarot, #tarot-wrapp .tarot__cards {
    row-gap: 4rem;
  }
}

#horoscope-wrapp .birthdate--modal,
#horoscope-wrapp .horoscope-error--modal, #horoscope-wrapp .subscribe--modal, #advisor .advisor__wrapper--about, #advisor .advisor__wrapper--reviews ul, .reports__wrapp .paid__reports, .reports__wrapp .all__reports {
  row-gap: 4.8rem;
}

@media screen and (max-width: 31.25em) {
  #horoscope-wrapp .birthdate--modal,
  #horoscope-wrapp .horoscope-error--modal, #horoscope-wrapp .subscribe--modal, #advisor .advisor__wrapper--about, #advisor .advisor__wrapper--reviews ul, .reports__wrapp .paid__reports, .reports__wrapp .all__reports {
    row-gap: 32px;
  }
}

@media screen and (max-width: 25em) {
  #horoscope-wrapp .birthdate--modal,
  #horoscope-wrapp .horoscope-error--modal, #horoscope-wrapp .subscribe--modal, #advisor .advisor__wrapper--about, #advisor .advisor__wrapper--reviews ul, .reports__wrapp .paid__reports, .reports__wrapp .all__reports {
    row-gap: 16px;
  }
}

#tos-page .tos-main-page .tos-main-menu, #advisor .advisor__wrapper, .pricing__wrapp {
  row-gap: 2.4rem;
}

@media screen and (max-width: 47.9375em) {
  #tos-page .tos-main-page .tos-main-menu, #advisor .advisor__wrapper, .pricing__wrapp {
    row-gap: 1.6rem;
  }
}

#horoscope-wrapp .horoscope_content--sign__info, #advisor .advisor__wrapper--profile__expertise, .reports__wrapp .paid__report--notice, .age-confirmation__modal--top, .age-confirmation__modal--bottom {
  row-gap: 1.6rem;
}

@media screen and (max-width: 31.25em) {
  #horoscope-wrapp .horoscope_content--sign__info, #advisor .advisor__wrapper--profile__expertise, .reports__wrapp .paid__report--notice, .age-confirmation__modal--top, .age-confirmation__modal--bottom {
    row-gap: .8rem;
  }
}

.tarot__cards--advisor__wrapp--property, #horoscope-wrapp .horoscope_advisor__wrapp--property, #advisor .advisor__wrapper--about__experience {
  column-gap: 2.4rem;
}

@media screen and (max-width: 47.9375em) {
  .tarot__cards--advisor__wrapp--property, #horoscope-wrapp .horoscope_advisor__wrapp--property, #advisor .advisor__wrapper--about__experience {
    column-gap: 1.6rem;
  }
}

.wide-header {
  position: relative;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  background: #08273C;
  padding: 0 2.4rem;
}

@media screen and (max-width: 31.25em) {
  .wide-header {
    padding: 0 2rem 0 0;
  }
}

.wide-header__left {
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
}

.wide-header__left--coins {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 8px;
  color: #ffffff;
  font-size: 1.6rem;
}

.wide-header__left--coins__credit {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 4px;
  cursor: pointer;
}

.wide-header__left--coins__num {
  color: #77E0FC;
  font-weight: 700;
}

.wide-header__left--coins img {
  display: block;
  width: 20px;
}

.wide-header--title {
  width: 100%;
}

.wide-header--title h6 {
  color: #ffffff;
  font-weight: 700;
  text-align: center;
  text-transform: lowercase;
  padding: 0 8px;
}

.wide-header--title h6::first-letter {
  text-transform: uppercase;
}

.wide-header .search-menu {
  color: #031D2E;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.wide-header .search-menu .search-form-wrapper {
  display: flex;
  max-width: 325px;
  align-items: center;
  /* &-btn-src {
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s;
      } */
}

.wide-header .search-menu .search-form-wrapper form {
  position: relative;
  display: flex;
  align-items: center;
  max-width: 248px;
  width: 100%;
}

.wide-header .search-menu .search-form-wrapper form.active .search_input,
.wide-header .search-menu .search-form-wrapper form.active .search-form-wrapper__btn-src {
  opacity: 1;
  visibility: visible;
}

.wide-header .search-menu .search-form-wrapper form.active .search-form-wrapper__btn-src {
  width: 24px;
  height: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.wide-header .search-menu .search-form-wrapper form.active .search-form-wrapper__btn-show {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s;
}

.wide-header .search-menu .search-form-wrapper form .search_input {
  position: absolute;
  right: 0;
  padding: 0 2.6rem 0 0.8rem;
  outline: none;
  border: 0.5px solid #08273C;
  display: inline-block;
  box-sizing: border-box;
  height: 32px;
  line-height: 32px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s;
}

@media screen and (max-width: 25em) {
  .wide-header .search-menu .search-form-wrapper form .search_input {
    max-width: 190px;
  }
}

@media screen and (max-width: 22.4375em) {
  .wide-header .search-menu .search-form-wrapper form .search_input {
    max-width: 154px;
  }
}

.wide-header .search-menu .search-form-wrapper form .search_input.no-text {
  animation: shake-input 0.2s linear forwards;
}

.wide-header .search-menu .search-form-wrapper form button {
  position: absolute;
  right: 5px;
  cursor: pointer;
  outline: none;
  border: none;
  background: transparent;
}

.wide-header .search-menu .search-form-wrapper form button img {
  display: block;
}

.wide-header .search-menu .search-form-wrapper form button:hover {
  background: transparent;
}

.wide-header .search-menu .search-form-wrapper .filter__modal--btn {
  cursor: pointer;
  margin-left: 10px;
}

.wide-header--menu {
  position: relative;
}

.wide-header--menu__hamburger {
  width: 2.4rem;
  cursor: pointer;
}

.wide-header--menu__hamburger div {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #ffffff;
  margin: 4px 0 0 auto;
}

.wide-header--menu__hamburger div:nth-of-type(1) {
  margin-top: 0;
}

.wide-header--menu__item {
  display: none;
  width: 220px;
  position: absolute;
  top: 3rem;
  right: 0;
  padding: 0.8rem;
  background-color: #ffffff;
  transition: all 0.3s;
  z-index: 8;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
}

.wide-header--menu__item ul li:not(:last-child) {
  border-bottom: 1px solid #08273C;
}

.wide-header--menu__item ul li:hover {
  background: rgba(8, 39, 60, 0.1);
}

.wide-header--menu__item ul li a {
  display: block;
  font-size: 1.4rem;
  color: #08273C;
  padding: 0.8rem;
  text-decoration: none;
}

.wide-header--menu__overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}

.tos-footer {
  background-color: rgba(119, 224, 252, 0.94);
  border: 1px solid #A0A0A0;
  color: #ffffff;
  font-size: 1.4rem;
  text-align: center;
  padding: 0;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 1;
  transition: transform 0.6s;
  transition-delay: .3s;
}

.tos-footer.hidde {
  transform: translateY(100%);
}

.tos-footer__show {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 30px;
  top: -17px;
  width: 60px;
  height: 18px;
  background-color: #A0A0A0;
  background-image: linear-gradient(to bottom, #A0A0A0 0%, #77E0FC 74%);
  border-radius: 5px 5px 0 0;
  cursor: pointer;
}

.tos-footer__show img {
  transform: rotate(180deg);
  transition: transform 0.3s;
}

.tos-footer__show img.hidde {
  transform: rotate(0);
}

.tos-footer__wrapp {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .8rem;
  flex-direction: column-reverse;
}

.tos-footer__wrapp .copyright {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
}

.tos-footer__wrapp .copyright .company-name {
  display: flex;
  justify-content: center;
  align-items: center;
}

.tos-footer__wrapp .copyright .company-name span {
  display: inline-block;
  text-align: center;
  font-size: 11px;
}

.tos-footer__wrapp .copyright .company-name #paymentCardsLogo {
  display: inline-block;
  height: 18px;
  margin-right: .8rem;
}

.tos-footer__wrapp .copyright .company-address {
  margin-top: 4px;
  padding: 0;
  font-size: 11px;
}

.tos-footer__wrapp .links {
  display: block;
  padding: .8rem;
}

.tos-footer__wrapp .links span {
  padding: .5rem 1rem;
}

.tos-footer__wrapp .links span a {
  color: #ffffff;
  font-size: 1.2rem;
  line-height: 1.2;
  display: inline-block;
  text-transform: lowercase;
}

.tos-footer__wrapp .links span a::first-letter {
  text-transform: uppercase;
}

.tos-footer__wrapp .links span a:hover {
  color: #ffffff;
}

/* Show company name & registered address START*/
/*This part of css code is using when in 'Preferences' on admin panel enabled 'Show company name & registered address'*/
#footer__injection {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  background: #031D2E;
  z-index: 1;
}

@media (min-width: 401px) {
  #content-container.small:has(#footer__injection) #search-page #maindata,
  #content-container.small:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.small:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .small .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.small:has(#footer__injection) #settings {
    bottom: 35.28px;
  }
}

@media (min-width: 623px) {
  #content-container.small:has(#footer__injection) #search-page #maindata,
  #content-container.small:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.small:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .small .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.small:has(#footer__injection) #settings {
    bottom: 29px;
  }
}

@media (max-width: 400px) {
  #content-container.small:has(#footer__injection) #search-page #maindata,
  #content-container.small:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.small:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .small .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.small:has(#footer__injection) #settings {
    bottom: 48px;
  }
}

@media (min-width: 401px) {
  #content-container.small:has(#footer__injection) #tos-pages {
    height: calc(100% - 9.3rem);
  }
}

@media (min-width: 623px) {
  #content-container.small:has(#footer__injection) #tos-pages {
    height: calc(100% - 8.7rem);
  }
}

@media (max-width: 400px) {
  #content-container.small:has(#footer__injection) #tos-pages {
    height: calc(100% - 10.6rem);
  }
}

@media (min-width: 337px) {
  #content-container.closed:has(#footer__injection) #search-page #maindata,
  #content-container.closed:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.closed:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .closed .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.closed:has(#footer__injection) #settings {
    bottom: 35.28px;
  }
}

@media (min-width: 559px) {
  #content-container.closed:has(#footer__injection) #search-page #maindata,
  #content-container.closed:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.closed:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .closed .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.closed:has(#footer__injection) #settings {
    bottom: 29px;
  }
}

@media (max-width: 336px) {
  #content-container.closed:has(#footer__injection) #search-page #maindata,
  #content-container.closed:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.closed:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .closed .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.closed:has(#footer__injection) #settings {
    bottom: 48px;
  }
}

@media (min-width: 337px) {
  #content-container.closed:has(#footer__injection) #tos-pages {
    height: calc(100% - 9.3rem);
  }
}

@media (min-width: 559px) {
  #content-container.closed:has(#footer__injection) #tos-pages {
    height: calc(100% - 8.7rem);
  }
}

@media (max-width: 336px) {
  #content-container.closed:has(#footer__injection) #tos-pages {
    height: calc(100% - 10.6rem);
  }
}

@media (min-width: 793px) {
  #content-container.wide:has(#footer__injection) #search-page #maindata,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .wide .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.wide:has(#footer__injection) #settings,
  #content-container.wide:has(#footer__injection) #tos-pages {
    bottom: 29px;
  }
}

@media (min-width: 337px) {
  #content-container.wide:has(#footer__injection) #search-page #maindata,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .wide .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.wide:has(#footer__injection) #settings,
  #content-container.wide:has(#footer__injection) #tos-pages {
    bottom: 35.28px;
  }
}

@media (max-width: 336px) {
  #content-container.wide:has(#footer__injection) #search-page #maindata,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer,
  .wide .page-container:has(#footer__injection) #profile-edit-scroll-container,
  #content-container.wide:has(#footer__injection) #settings,
  #content-container.wide:has(#footer__injection) #tos-pages {
    bottom: 48px;
  }
}

@media (min-width: 793px) {
  #content-container.wide:has(#footer__injection) #search-page #maindata #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer #content-container.wide:has(#footer__injection) #tos-pages,
  .wide .page-container:has(#footer__injection) #profile-edit-scroll-container #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #settings #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #tos-pages #content-container.wide:has(#footer__injection) #tos-pages {
    height: calc(100% - 9.3rem);
  }
}

@media (min-width: 337px) {
  #content-container.wide:has(#footer__injection) #search-page #maindata #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer #content-container.wide:has(#footer__injection) #tos-pages,
  .wide .page-container:has(#footer__injection) #profile-edit-scroll-container #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #settings #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #tos-pages #content-container.wide:has(#footer__injection) #tos-pages {
    height: calc(100% - 8.7rem);
  }
}

@media (max-width: 336px) {
  #content-container.wide:has(#footer__injection) #search-page #maindata #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #allMessagesContainer #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #chat-pages-container #chat-page-left #unreadMessagesContainer #content-container.wide:has(#footer__injection) #tos-pages,
  .wide .page-container:has(#footer__injection) #profile-edit-scroll-container #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #settings #content-container.wide:has(#footer__injection) #tos-pages,
  #content-container.wide:has(#footer__injection) #tos-pages #content-container.wide:has(#footer__injection) #tos-pages {
    height: calc(100% - 10.6rem);
  }
}

/* Show company name & registered address END*/

/*# sourceMappingURL=astro-v1.css.map */