@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,500;0,600;0,700;0,900;1,300&display=swap');
/*  font-family: 'Montserrat', sans-serif;    */
html
{
  background: #1c0855;
  min-height: 100vh;
  height: 100%;
}
/* Base */
body
{
  line-height: 1.7;
  color: gray;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  font-size: 1rem;
  background: none;
  position: relative;
  padding-bottom: 80px;
  background: #1a0a55;
}

::-moz-selection {
  background: #000;
  color: #fff;
}

::selection {
  background: #000;
  color: #fff;
}

a {
  -webkit-transition: .3s all ease;
  -o-transition: .3s all ease;
  -moz-transition: .3s all ease;
  transition: .3s all ease;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
#container-holder, .site-legal-content
{
    padding: 2rem 1.5rem;
    color: #fff;
}
#container-holder a[href="#top"], .site-legal-content a
{
    color: #f8a790;
    text-decoration: underline;
}
#container-holder button, .site-legal-content button
{
        border: none;
    background: #5330ac;
    background-color: #5330ac;
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 30px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    color: #fff;
    text-transform: capitalize;
    font-size: 18px;
}
table.contact td
{
    display: block;
},
table.contact tr
{
    padding-top:10px;
}
table.contact textarea
{
    width: 100%;
}
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {
  font-family: 'Montserrat', sans-serif;
}
.avatar_icon
{
  vertical-align: middle;
  width: 50px;
  height: 50px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
  -webkit-filter: drop-shadow(0px 0px 6px #e39dfa);
  filter: drop-shadow(0px 0px 6px #e39dfa);
}
.avatar_icon img
{
  width: 100%;
}
.custom-toggler .navbar-toggler-icon
{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='41' height='30' viewBox='0 0 41 30'%3E%3Cg id='Group_53' data-name='Group 53' transform='translate(-1216.5 -147.5)'%3E%3Cline id='Line_1' data-name='Line 1' x2='37' transform='translate(1218.5 149.5)' fill='none' stroke='%23bcb9e1' stroke-linecap='round' stroke-width='4'/%3E%3Cpath id='Path_547' data-name='Path 547' d='M0,0H37' transform='translate(1218.5 162.5)' fill='none' stroke='%23bcb9e1' stroke-linecap='round' stroke-width='4'/%3E%3Cline id='Line_3' data-name='Line 3' x2='37' transform='translate(1218.5 175.5)' fill='none' stroke='%23bcb9e1' stroke-linecap='round' stroke-width='4'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.navbar-expand .navbar-toggler
{
  display: block;
}
.background_0
{
  background:url("../images/bg.jpg");
  background-repeat:no-repeat;
  height: 100vh;
  -moz-background-size: cover;
  background-size: cover;
  background-position: -27vw top;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
background-color: #000;
}
.background_1
{
  background:url("../images/bg_1.png");
  background-repeat:no-repeat;
  height: 100vh;
  -moz-background-size: cover;
  background-size: 110%;
  background-position: center bottom;
  position: absolute;
  top: 15vh;
  left: 0;
  right: 0;
}
.background_1:after
{
  content: '';
  position: absolute;
  right: 0;
  left: 0;
  bottom: -59px;
  height: 61px;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  transform: translateZ(0);
  z-index: 1;
  background: #1a0a55;
}
.flexbox
{
  -webkit-box-align: center;
    -ms-flex-align: center;
        -webkit-align-items: center;
           -moz-box-align: center;
          align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -moz-box;
display: flex;
height: 100vh;
-webkit-box-pack: center;
    -ms-flex-pack: center;
        -webkit-justify-content: center;
           -moz-box-pack: center;
        justify-content: center;
        overflow-x: hidden;
}
.index0{z-index:  0;}
.index1{z-index:  1;}
.index2{z-index:  2;}
.index3{z-index:  3;}
.index4{z-index:  4;}
.index5{z-index:  5;}
.index6{z-index:  6;}
.navbox
{
  right: 0;
  left: 0;
  margin: auto;
}
.navbar
{
  font-weight: 900;
  color: #fff;
}
.navbar-dark .navbar-nav .nav-link
{
  color: #fff;
  border-bottom: 2px solid rgb(255 255 255 / 0%);
}
.navbar-dark .navbar-nav .nav-link:hover
{
  color: #fff;
  border-bottom: 2px solid #FA43C6;
}
.navbar-dark .navbar-nav .nav-active
{
  color: #fff;
  border-bottom: 2px solid #FA43C6;
}
.btn
{
  font-size: 16px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  padding: 10px 30px;
}
.btn:hover, .btn:active, .btn:focus
{
  outline: none;
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
       box-shadow: none !important;
}
.btn.btn-primary
{
  border-width: 2px;
  background: #00d2b5;
  border-color: #00d2b5;
  color: #fff;
  -webkit-box-shadow: 0 4px 20px -5px rgba(0, 210, 181, 0.4);
  -moz-box-shadow: 0 4px 20px -5px rgba(0, 210, 181, 0.4);
       box-shadow: 0 4px 20px -5px rgba(0, 210, 181, 0.4);
}
.btn.btn-primary:hover
{
  background: #6d2b75;
  border-color: #6d2b75;
  color: #fff;
}
.site-section.site-section-sm
{
  padding: 4em 0;
}
.relative
{
  position: relative;
}

.background
{
  position: fixed;
  bottom: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  margin: auto;
  background: url(../images/bg.png);
  background-position: center bottom;
  background-repeat: no-repeat;
}
.logo
{
    max-width: 150px;
    width: 100%;
    margin: auto;
    padding: 0;
}
.welcomes
{
  top:35vh;
  right: 0;
  left: 0;
}
.welcome_big
{
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  font-size: 50px;
  text-align: center;
  color: #F5927D;
  padding-bottom: 0;
  margin-bottom: 0;
}
.welcome_big > span
{
  color: #fff;
}
.welcome_small
{
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 35px;
  text-align: center;
  color: #bcb9e1;
  line-height: 1.2;
  text-shadow: 0px 0px 15px #1c0153;
}
.content_box
{
  -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
          border-radius: 10px;
  background: #471fab;

}
.content_box .title_book
{
  font-family: 'Montserrat', sans-serif;
  font-weight: bold;
  font-size: 20px;
  line-height: 1.2;
  text-align: left;
  color: #fff;
}
.content_box .category_book
{
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  background: #5330ac;
  padding: 10px 3px;
  font-size: 15px;
  text-align: center;
  color: #BCB9E1;
  font-weight: 600;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-transform: capitalize;
}
.content_box .time_book
{
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 15px;
  text-align: left;
  color: #bcb9e1;
  padding: 10px 0;
}
.gamecover
{
  -webkit-transform-style: preserve-3d;
     -moz-transform-style: preserve-3d;
          transform-style: preserve-3d;
  position: relative;
  height: 150px;
  cursor: pointer;
  -webkit-backface-visibility: visible;
     -moz-backface-visibility: visible;
          backface-visibility: visible;
}
.gamecover .front
{
      -webkit-border-radius: 0.5em;
      -moz-border-radius: 0.5em;
      border-radius: 0.5em;
      width: 150px;
}

.book {
  -webkit-transform-style: preserve-3d;
     -moz-transform-style: preserve-3d;
          transform-style: preserve-3d;
  position: relative;
  height: 150px;
  cursor: pointer;
  -webkit-backface-visibility: visible;
     -moz-backface-visibility: visible;
          backface-visibility: visible;
}

.front, .back, .page1, .page2, .page3, .page4, .page5, .page6
{
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  position: absolute;
  width: 150px;
  height: 100%;
  top: 0;
  left: 0;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -ms-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
  -webkit-transition: -webkit-transform .5s ease-in-out, -webkit-box-shadow .35s ease-in-out;
  transition: -webkit-transform .5s ease-in-out, -webkit-box-shadow .35s ease-in-out;
  -o-transition: box-shadow .35s ease-in-out, -o-transform .5s ease-in-out;
  -moz-transition: transform .5s ease-in-out, box-shadow .35s ease-in-out, -moz-transform .5s ease-in-out, -moz-box-shadow .35s ease-in-out;
  transition: transform .5s ease-in-out, box-shadow .35s ease-in-out;
  transition: transform .5s ease-in-out, box-shadow .35s ease-in-out, -webkit-transform .5s ease-in-out, -moz-transform .5s ease-in-out, -o-transform .5s ease-in-out, -webkit-box-shadow .35s ease-in-out, -moz-box-shadow .35s ease-in-out;
}
.front, .back
{
  background: navy;
}
.front, .page1, .page3, .page5
{
  -webkit-border-bottom-right-radius: .5em;
     -moz-border-radius-bottomright: .5em;
          border-bottom-right-radius: .5em;
  -webkit-border-top-right-radius: .5em;
     -moz-border-radius-topright: .5em;
          border-top-right-radius: .5em;
}
.back, .page2, .page4, .page6
{
  -webkit-border-bottom-right-radius: .5em;
     -moz-border-radius-bottomright: .5em;
          border-bottom-right-radius: .5em;
  -webkit-border-top-right-radius: .5em;
     -moz-border-radius-topright: .5em;
          border-top-right-radius: .5em;
}
.page1
{
  background: #efefef;
}
.page2
{
  background: #efefef;
}
.page3
{
  background: #f5f5f5;
}
.page4
{
  background: #f5f5f5;
}
.page5
{
  background: #fafafa;
}
.page6
{
  background: #fdfdfd;
}
.front
{
-moz-background-size: cover;
     background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.playbutton
{
  max-width: 100px;
}
.howBox
{
  margin-top: 25px;
}
.howBox .row
{
  padding-top: 10px
}
.title
{
  font-size: 50px;
  line-height: 1;
  color: #fff;
}
button.button
{
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#5330ac+0,5330ac+100 */
  background: #5330ac; /* Old browsers */
  background: -moz-linear-gradient(top,  #5330ac 0%, #5330ac 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #5330ac 0%,#5330ac 100%); /* Chrome10-25,Safari5.1-6 */
  background: -webkit-gradient(linear,  left top, left bottom,  from(#5330ac),to(#5330ac));
  background: -moz-linear-gradient(top,  #5330ac 0%,#5330ac 100%);
  background: -o-linear-gradient(top,  #5330ac 0%,#5330ac 100%);
  background: linear-gradient(to bottom,  #5330ac 0%,#5330ac 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5330ac', endColorstr='#5330ac',GradientType=0 ); /* IE6-9 */
  border: none;
  color: #BCB9E1;
  text-transform: capitalize;
  font-size: 15px;
  width: 100%;
  padding: 14px 0;
  -webkit-border-radius:100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  font-weight: 500;
}
button.button.dark
{
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#201360+0,#201360+100 */
  background: #201360; /* Old browsers */
  background: -moz-linear-gradient(top,  #201360 0%, #201360 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #201360 0%,#201360 100%); /* Chrome10-25,Safari5.1-6 */
  background: -webkit-gradient(linear,  left top, left bottom,  from(#201360),to(#201360));
  background: -moz-linear-gradient(top,  #201360 0%,#201360 100%);
  background: -o-linear-gradient(top,  #201360 0%,#201360 100%);
  background: linear-gradient(to bottom,  #201360 0%,#201360 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#201360', endColorstr='#201360',GradientType=0 ); /* IE6-9 */
  border: none;
  color: #bcb9e1;
  text-transform: capitalize;
  font-size: 15px;
  width: 100%;
  max-width: 180px;
  padding: 14px 0;
  -webkit-border-radius:100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  font-weight: 500;
}
.legal
{
  font-size: 10px;
  font-weight: 500;
  font-style: italic;
  color: #fff;
  margin:auto;
  text-align: center
}
.navbar-dark .navbar-toggler
{
  border: none;
  color: #fff;
}
.navbar-toggler:focus
{
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}
.navbar-dark .navbar-toggler[aria-expanded="true"]
{
  position: fixed;
  top: 8px;
  right: 12px;
}
.navbar-dark .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon
{

}
.navbar-dark .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon
{
    background: url(../images/x.png);
    -webkit-filter: invert(1) grayscale(100%) brightness(200%);
            filter: invert(1) grayscale(100%) brightness(200%);
    background-repeat: no-repeat;
    -moz-background-size: cover;
            background-size: cover;
    background-position: center;
}
.navbar-dark .navbar-nav .nav-link
{
    color: #fff;
}
.gradient_bg
{
  background: url("../images/gradient.png");
  position: fixed !important;
  background-position: top;
  -moz-background-size: contain;
  background-size: contain;
}
a.moreButton
{
  border: none;
  background: #5330ac;
  background-color: #5330ac;
  text-align: center;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px 30px;
  -webkit-border-radius: 100px;
     -moz-border-radius: 100px;
          border-radius: 100px;
  color: #fff;
  text-transform: capitalize;
  font-size: 18px;
}
a.moreButton:hover
{
  background: #0A064C;
  background-color: #0A064C;
  cursor:pointer
}
.chat
{
  background: #0A064C;
}
.video
{
  background:#201360;
}
.uppertitle_talking
{
  font-weight: 600;
  font-size: 16px;
  text-align: left;
  color: #bcb9e1;
}
.title_book_talking
{
  font-weight: 900;
  font-size: 38px;
  text-align: left;
  color: #f5927d;
  line-height: 1.2;
}
.shadow
{
  -webkit-box-shadow: 0 4px 20px 0 rgba(64, 64, 64, 0.2);
     -moz-box-shadow: 0 4px 20px 0 rgba(64, 64, 64, 0.2);
          box-shadow: 0 4px 20px 0 rgba(64, 64, 64, 0.2);
}
.shootingstar_box
{
  -webkit-transform: rotate(45deg);
     -moz-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
       -o-transform: rotate(45deg);
          transform: rotate(45deg); /* Equal to rotateZ(45deg) */
  position: absolute;
  left: 0;
  top: 0;
  height: 100px;
  width: 100px;
}
.shooting_star
{
  position: absolute;
  left: 0;
  top: 0;
  height: 2px;
  background: -webkit-linear-gradient(135deg, #5f91ff, rgba(0, 0, 255, 0));
  background: -moz-linear-gradient(135deg, #5f91ff, rgba(0, 0, 255, 0));
  background: -o-linear-gradient(135deg, #5f91ff, rgba(0, 0, 255, 0));
  background: linear-gradient(-45deg, #5f91ff, rgba(0, 0, 255, 0));
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  border-radius: 999px;
  -webkit-filter: drop-shadow(0 0 6px #699bff);
  filter: drop-shadow(0 0 6px #699bff);
  -webkit-animation: tail 3000ms ease-in-out infinite, shooting 3000ms ease-in-out 3;
  -moz-animation: tail 3000ms ease-in-out 3, shooting 3000ms ease-in-out 3;
  animation: tail 3000ms ease-in-out 3, shooting 3000ms ease-in-out 3;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg); /* Equal to rotateZ(45deg) */
}
.shooting_star::before
{
  content: "";
  position: absolute;
  top: -webkit-calc(50% - 1px);
  top: -moz-calc(50% - 1px);
  top: calc(50% - 1px);
  right: 0;
  height: 2px;
  background: -webkit-linear-gradient(135deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  background: -moz-linear-gradient(135deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  background: -o-linear-gradient(135deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  background: linear-gradient(-45deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  -webkit-transform: translateX(50%) rotateZ(45deg);
  -moz-transform: translateX(50%) rotateZ(45deg);
  -ms-transform: translateX(50%) rotate(45deg);
  -o-transform: translateX(50%) rotateZ(45deg);
  transform: translateX(50%) rotateZ(45deg);
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -webkit-animation: shining 3000ms ease-in-out 3;
  -moz-animation: shining 3000ms ease-in-out 3;
  animation: shining 3000ms ease-in-out 3;
}
.shooting_star::after
{
  content: "";
  position: absolute;
  top: -webkit-calc(50% - 1px);
  top: -moz-calc(50% - 1px);
  top: calc(50% - 1px);
  right: 0;
  height: 2px;
  background: -webkit-linear-gradient(135deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  background: -moz-linear-gradient(135deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  background: -o-linear-gradient(135deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  background: linear-gradient(-45deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
  -webkit-transform: translateX(50%) rotateZ(45deg);
  -moz-transform: translateX(50%) rotateZ(45deg);
  -ms-transform: translateX(50%) rotate(45deg);
  -o-transform: translateX(50%) rotateZ(45deg);
  transform: translateX(50%) rotateZ(45deg);
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -webkit-animation: shining 3000ms ease-in-out 3;
  -moz-animation: shining 3000ms ease-in-out 3;
  animation: shining 3000ms ease-in-out 3;
  -webkit-transform: translateX(50%) rotateZ(-45deg);
  -moz-transform: translateX(50%) rotateZ(-45deg);
  -ms-transform: translateX(50%) rotate(-45deg);
  -o-transform: translateX(50%) rotateZ(-45deg);
  transform: translateX(50%) rotateZ(-45deg);
}
.shooting_star:nth-child(1)
{
  -webkit-animation-delay: 1ms;
  -moz-animation-delay: 1ms;
  animation-delay: 1ms;
}
.shooting_star:nth-child(1)::before, .shooting_star:nth-child(1)::after
{
  -webkit-animation-delay: 1ms;
          -moz-animation-delay: 1ms;
       animation-delay: 1ms;
}
@-webkit-keyframes tail
{
  0% {
    width: 0;
  }
  30% {
    width: 100px;
  }
  100% {
    width: 0;
  }
}

@-moz-keyframes tail
{
  0% {
    width: 0;
  }
  30% {
    width: 100px;
  }
  100% {
    width: 0;
  }
}

@keyframes tail
{
  0% {
    width: 0;
  }
  30% {
    width: 100px;
  }
  100% {
    width: 0;
  }
}
@-webkit-keyframes shining
{
  0% {
    width: 0;
  }
  50% {
    width: 30px;
  }
  100% {
    width: 0;
  }
}
@-moz-keyframes shining
{
  0% {
    width: 0;
  }
  50% {
    width: 30px;
  }
  100% {
    width: 0;
  }
}
@keyframes shining
{
  0% {
    width: 0;
  }
  50% {
    width: 30px;
  }
  100% {
    width: 0;
  }
}
@-webkit-keyframes shooting
{
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(50vh);
            transform: translateX(50vh);
  }
}
@-moz-keyframes shooting
{
  0% {
    -moz-transform: translateX(0);
         transform: translateX(0);
  }
  100% {
    -moz-transform: translateX(50vh);
         transform: translateX(50vh);
  }
}
@keyframes shooting
{
  0% {
    -webkit-transform: translateX(0);
       -moz-transform: translateX(0);
         -o-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(50vh);
       -moz-transform: translateX(50vh);
         -o-transform: translateX(50vh);
            transform: translateX(50vh);
  }
}

.dashboard .account
{
  background: #0A064C;



}
.dashboard .account_inner
{
  background:#201360;
}
.dashboard .account_inner .title_text>span
{
  font-weight: 600;
  font-size: 16px;
  text-align: left;
  color: #bcb9e1;
  text-transform: capitalize;
  display: block;
}
.dashboard .account_inner .title_text
{
  font-weight: 900;
  font-size: 38px;
  text-align: left;
  color: #f5927d;
  line-height: 1.2;
  display: block;
  text-transform: uppercase;
}

.dashboard .account_inner .account_inner_components
{
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  background: #471fab;
}
.dashboard .account_inner .account_inner_components .list-group-item
{
  line-height:1.2;
  padding:0.4em 0px;
}
.dashboard .account_inner .account_inner_components a
{
  color:#a899d6;
  text-decoration:underline;
}
.settings_icon
{
  background: #fff;
  border: 1px solid #be92c2;
  -webkit-filter: drop-shadow(0px 0px 10px #e39dfa);
  filter: drop-shadow(0px 0px 10px #e39dfa);
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  display: block;
  text-align: center;
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  width: 30px;
  height: 30px;
}
.settings_icon svg
{
  width: 15px;
  height: 15px;
}
.icon_small
{
  background: #fff;
  border: 1px solid #be92c2;
  -webkit-filter: drop-shadow(0px 0px 10px #e39dfa);
  filter: drop-shadow(0px 0px 10px #e39dfa);
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  text-align: center;
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  width: 30px;
  height: 30px;
  line-height: 1.2;
  margin-right: 1rem;
}
.icon_small svg
{
  width: 15px;
  height: 15px;
}
.avatar
{
  position: relative;
  width: 180px;
  margin: auto;
}
.inside_avatar
{
  width: 180px;
  height: 180px;
  background: #0a064c;
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  border-radius: 9999px;
  border: 2px solid #be92c2;
  display: block;
  margin: auto;
  -webkit-filter: drop-shadow(0px 0px 15px #e39dfa);
  filter: drop-shadow(0px 0px 15px #e39dfa);
  overflow: hidden;
  -moz-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.avatar img
{
  width:100%;
}
.avatar .edit
{
  position: absolute;width: 30px;
  height: 30px;
  background: #386cb4;

  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  text-align: center;
}
.avatar .edit svg
{
  width: 15px;
  height: 15px;
}
.dashboard .name_and_surname
{
  font-weight: 700;
  font-size: 20px;
  color: #fff;
  line-height: 1.2;
}
.dashboard .email
{
  font-weight: 600;
  font-size: 14px;

  color: #bcb9e1;
  line-height: 1.2;
}
.dashboard .join_date
{
  font-weight: 300;
  font-style: italic;
  font-size: 9px;
  color: #bcb9e1;
}
.dashboard .subtitle
{
  font-weight: 700;
  font-size: 20px;
  color: #fff;
  line-height: 1.5;
}
hr
{
  background-color: #bd95c5;
}
div.gender
{
  font-weight: 600;
  font-size: 14px;
  color: #bcb9e1;
  line-height: 1.2;
  text-transform: capitalize;
  padding: 10px 0;
}
.switch
{
  position: relative;
  display: inline-block;
  width: 75px;
  height: 36px;
  line-height: 2.3;
}
.switch input
{
  opacity: 0;
  width: 0;
  height: 0;
}
.slider
{
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  -webkit-transition: .4s;
  -o-transition: .4s;
  -moz-transition: .4s;
  transition: .4s;
  -webkit-border-radius: 100px;
     -moz-border-radius: 100px;
          border-radius: 100px;
-moz-box-shadow:inset 0 0 8px #787878;
 -webkit-box-shadow:inset 0 0 8px #787878;
 box-shadow:inset 0 0 8px #787878;
}
.slider:before
{
  position: absolute;
  content: "";
  height: 32px;
  width: 32px;
  left: 2px;
  bottom: 2px;
  background-color: #471FAB;
  -webkit-transition: .4s;
  -o-transition: .4s;
  -moz-transition: .4s;
  transition: .4s;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
  -webkit-filter: drop-shadow(0px 0px 2px #787878);
  filter: drop-shadow(0px 0px 2px #787878);
}

input:checked + .slider
{
  background-color: #ffffff;
}

input:focus + .slider
{
  -webkit-box-shadow: 0 0 1px #2196F3;
     -moz-box-shadow: 0 0 1px #2196F3;
          box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before
{
  -webkit-transform: translateX(39px);
  -ms-transform: translateX(39px);
  -moz-transform: translateX(39px);
    -o-transform: translateX(39px);
       transform: translateX(39px);
}
a.edit_storyteller_link,
a.edit_storyteller_link:hover
{
  font-weight: 300;
  font-style: italic;
  font-size: 10px;
  color: #bcb9e1;
  text-decoration: underline;
}
.favorite .subtitle
{
  font-weight: 700;
  font-size: 12px;
  color: #fff;
  line-height: 1.5;
}
.list-group-item
{
  background: none;
  color: #fff;
  border:none;
   font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  line-height: 1.5;
  padding-left: 0;
  font-weight: 700;
}
.achievement,.storyteller
{
  width: 100%;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  background: #5330AC;
  border: 2px solid transparent;
}
.achievement .icon_small, .storyteller .icon_small
{
  height: 50px;
  width: 50px;
  line-height: 2.8;
}
.storyteller .icon_small
{
  overflow:hidden;
}
.question-label
{
  width:100%;
}
.headcheck:checked + .storyteller{
  border:2px solid #be92c2;
}
.achievement .icon_small svg
{
  height: 35px;
  width: 35px;
}
.achievement .subtitle,.storyteller .subtitle
{
  font-weight: 700;
  font-size: 12px;
  color: #fff;
  line-height: 1.5;
}

.achievement .basic_text, .storyteller .basic_text
{
  font-weight: 500;
  font-size: 10px;
  line-height: 12px;
  text-align: left;
  color: #fff;

}
.account_inner_components .form-label.subtitle
{
    font-weight: 700;
    font-size: 12px;
    color: #fff;
    line-height: 1.5;
}
.carousel-indicators [data-bs-target]
{
  width: 10px;
  height: 10px;
  -webkit-border-radius: 100%;
     -moz-border-radius: 100%;
          border-radius: 100%
}
.radioslider
{
  /* Color variables */
  --bar-color: #fff;
  --fill-color: #F5927D;
  --fill-color-inverse: #F5927D;
  --handle-color: white;
}
label.radioslider__label .radioslider__text
{
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  font-size: 12px;
  text-align: center;
  color: #fff;
  padding: 0px 2px;
  padding-top: 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.storyteller .form-check-input[type=radio]
{
  display: none;
}
.arrow{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}
.arrow span{
    display: block;
    width: 20px;
    height: 20px;
    border-bottom: 5px solid #b7b2e5;
    border-right: 5px solid #b7b2e5;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    margin: -10px;
    -webkit-animation: animate 2s infinite;
       -moz-animation: animate 2s infinite;
            animation: animate 2s infinite;
}
.arrow span:nth-child(2){
    -webkit-animation-delay: -0.2s;
       -moz-animation-delay: -0.2s;
            animation-delay: -0.2s;
}
.arrow span:nth-child(3){
    -webkit-animation-delay: -0.4s;
       -moz-animation-delay: -0.4s;
            animation-delay: -0.4s;
}
@-webkit-keyframes animate {
    0%{
        opacity: 0;
        -webkit-transform: rotate(45deg) translate(-20px,-20px);
                transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        -webkit-transform: rotate(45deg) translate(20px,20px);
                transform: rotate(45deg) translate(20px,20px);
    }
}
@-moz-keyframes animate {
    0%{
        opacity: 0;
        -moz-transform: rotate(45deg) translate(-20px,-20px);
             transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        -moz-transform: rotate(45deg) translate(20px,20px);
             transform: rotate(45deg) translate(20px,20px);
    }
}
@keyframes animate {
    0%{
        opacity: 0;
        -webkit-transform: rotate(45deg) translate(-20px,-20px);
           -moz-transform: rotate(45deg) translate(-20px,-20px);
             -o-transform: rotate(45deg) translate(-20px,-20px);
                transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        -webkit-transform: rotate(45deg) translate(20px,20px);
           -moz-transform: rotate(45deg) translate(20px,20px);
             -o-transform: rotate(45deg) translate(20px,20px);
                transform: rotate(45deg) translate(20px,20px);
    }
}
.pensil_icon
{
  position: absolute;
    bottom: 10px;
    right: 20px;
    width: 15px;
    height: 15px;
}
.form-control
{
 background-color: #5330AC;
 color: #BCB9E1;
 font-family: 'Montserrat', sans-serif;
 font-weight: 600;
 -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
         border-radius: 100px;
 border: none;
}

.form-control::-webkit-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #BCB9E1;
  opacity: 1; /* Firefox */
}

.form-control::-moz-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #BCB9E1;
  opacity: 1; /* Firefox */
}
.form-control:-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #BCB9E1;
  opacity: 1; /* Firefox */
}
.form-control::-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #BCB9E1;
  opacity: 1; /* Firefox */
}
.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #BCB9E1;
  opacity: 1; /* Firefox */
}
.form-control:focus
{
  color: #201360;
    background-color: #fff;
    border-color: #8956cc;
    outline: 0;
    -webkit-box-shadow: 0 0 0 0.25rem rgb(227 157 250 / 40%);
       -moz-box-shadow: 0 0 0 0.25rem rgb(227 157 250 / 40%);
            box-shadow: 0 0 0 0.25rem rgb(227 157 250 / 40%)
}
.form-control:disabled, .form-control[readonly]
{
  background-color: #201460;
}
.headcheck
{
  display: none;
}

.block-27 .pagination
{
  display: inline-block;
  padding: 0;
  margin: 0;
  margin-bottom: 4px;
  font-weight: 400;
}
.block-27 div a, .block-27 div span, .block-27 div em{
  display: inline-block;
  color: #BCB9E1;
  text-align: center;
  width: 40px;
  height: 40px;
  line-height: 40px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #BCB9E1;
}
.block-27 div .previous_page, .block-27 div .next_page
  {
    visibility:hidden;
  }

.block-27 div .previous_page:after,
.block-27 div .next_page:after
{
  content:'<';
  visibility: visible;
  display: inline-block;
  color: #BCB9E1;
  text-align: center;
  width: 40px;
  height: 40px;
  line-height: 40px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #BCB9E1;
}
.block-27 div .next_page:after
{
  content:'>';
}
.block-27 div em.current
{
  background: #5330AC;
  color: #fff;
  border: 1px solid transparent;
  font-style: normal;
}
.content_box .play_now_button
{
  background: #f4a390;
  color: #1a0a55;
}
.main_ebook_header_img
{
  background-repeat: no-repeat;
  -moz-background-size: cover;
  background-size: cover;
  background-position: bottom;
  border: 2px solid rgb(188 185 225);
}
.main_ebook_button .playbutton
{
  display:none;
}
h2.main_ebook_title,.regular_title
{
  letter-spacing: -.03em;
  font-weight: 700;
  line-height: 110%;
  width: 100%;
  margin: auto;
  display: block;
  color: #fff;
  text-transform: capitalize;
}
h2.main_ebook_title>span
{
  text-transform: lowercase;
  color: #6c38ef;
}
.main_ebook_basic_text
{
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -.01em;
  font-weight: 500;
  opacity: .7;
  color: #fff;
  text-align: justify;
}
.main_ebook_basic_text > b
{
  color:#F5927D;
  opacity:1;
  font-size: 16px

}
.part_ebook:nth-child(odd),.regular_info_part:nth-child(odd)  {
}
.part_ebook:nth-child(odd) .image_box_ebooks>img, .regular_info_part:nth-child(odd) img
{
  -webkit-transform: rotate(5deg);
     -moz-transform: rotate(5deg);
      -ms-transform: rotate(5deg);
       -o-transform: rotate(5deg);
          transform: rotate(5deg);
}
.part_ebook:nth-child(even) .image_box_ebooks>img, .regular_info_part:nth-child(even) .image_box_ebooks>img,.hero,video.intro
{
  -webkit-transform: rotate(-5deg);
     -moz-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
       -o-transform: rotate(-5deg);
          transform: rotate(-5deg);
}
.part_ebook:nth-child(even),.regular_info_part:nth-child(even){
  background:#0a064c;
}
.hero
{
  background:url('../videos/bts_product_video_placeholder.jpg');
  -moz-background-size: contain !important;
  background-size: cover!important;
  background-repeat: no-repeat!important;
  background-position: top right!important;
  background-color: #d4d3cf!important;
  -webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
width: 80%;
margin: auto;
border:none;
}
.vid
{
  -webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
width: 80%;
margin: auto;
}
video.intro
{
  -webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
  overflow: hidden;
  -webkit-box-shadow: 0 19px 51px 0 rgba(0,0,0,0.16), 0 14px 19px 0 rgba(0,0,0,0.07);
     -moz-box-shadow: 0 19px 51px 0 rgba(0,0,0,0.16), 0 14px 19px 0 rgba(0,0,0,0.07);
          box-shadow: 0 19px 51px 0 rgba(0,0,0,0.16), 0 14px 19px 0 rgba(0,0,0,0.07);
}
.play-button-vid
{
  width: 80px;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: 0;
  bottom: 0;
  height: 80px;
}
.play-button-vid:hover
{
  cursor: pointer;
}
@media screen and (min-width: 280px)
{
  .hero
  {
       -moz-background-size: cover!important;
            background-size: cover!important;
       background-position: top center!important;
  }
  /* unsub */
  .container>.col-xs-12.text-center.offset3:first-child
  {
    padding-top: 100px;
  }
  .container>.col-xs-12.text-center.offset3:first-child>h2
  {
    font-weight: 600;
    font-size: 35px;
    text-align: center;
    color: #bcb9e1;
    line-height: 1.2;
    text-shadow: 0px 0px 15px #1c0153;
  }
  .col-xs-12.text-center.offset3>h3
  {
    font-weight: 700;
    font-size: 20px;
    color: #fff;
    line-height: 1.5;
    margin-bottom: 0;
  }
  .col-xs-12.text-center.offset3 .input-group-addon
  {
    display: block;
    font-weight: 700;
    font-size: 12px;
    color: #fff;
    line-height: 1.5;
    margin-bottom: 7px;
  }
  .col-xs-12.text-center.offset3
  {
    color: #fff;
    line-height: 1.2;
    text-align: center !important;
  }
  .col-xs-12.text-center.offset3:last-child
  {
    display: block;
    background-color: #471fab;
    padding: 2.25em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: .5em;
    border-radius: 0.5em;
    margin: auto;
    margin-top: 0;
    max-width: 400px;
  }
  .col-xs-12.text-center.offset3 input.form-control
  {
    color: #212529;
    display: inline-block;
    height: 50px;
    transition: box-shadow .2s linear, border-color .25s ease-out, -webkit-box-shadow .2s linear, -moz-box-shadow .2s linear;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-border-radius: 100px !important;
    -moz-border-radius: 100px !important;
    border-radius: 100px !important;
    background-color: #5330AC;
    color: #BCB9E1;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    border: none;
    padding: 0.4em 1em 0.5em;
    margin: 0 0 1em !important;
  }
  .col-xs-12.text-center.offset3 input[type="submit"].btn
  {
    background: #201360;
    background: -moz-linear-gradient(top, #201360 0%, #201360 100%);
    background: -webkit-linear-gradient(top, #201360 0%,#201360 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(#201360),to(#201360));
    background: -moz-linear-gradient(top, #201360 0%,#201360 100%);
    background: -o-linear-gradient(top, #201360 0%,#201360 100%);
    background: linear-gradient(to bottom, #201360 0%,#201360 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#201360', endColorstr='#201360',GradientType=0 );
    border: none;
    color: #bcb9e1;
    text-transform: capitalize;
    font-size: 15px;
    width: 100%;
    max-width: 180px;
    padding: 14px 0;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    font-weight: 500;
    margin: auto;
    width: 100%;
    max-width: 400px;
  }
  /* end - unsub */

  .collapsing {
   -webkit-transition-delay:0s;
   -moz-transition-delay: 0s;
     -o-transition-delay: 0s;
        transition-delay: 0s;
   -webkit-transition: height 0s ease;
   -o-transition: height 0s ease;
   -moz-transition: height 0s ease;
   transition: height 0s ease;
 }

 .collapse.show
 {
   position: fixed;
   z-index: 9999999;
   width: 100%;
   height: 100vh;
   top: 0;
   margin: auto;
 left: 0;right: 0;}
 .collapse.show>.bg-dark
 {
   background-color: #1a0a55 !important;
   height: 100vh;
   text-align: center;
    background: url(../images/small_stars.png);
 }
 .bg-dark_talk
 {
   background-color: #1a0a55 !important;
   background: url(../images/small_stars.png);
   position: inherit;
   height: 100vh;
   z-index: 0;
   left: 0;
   right: 0;
   margin: auto;
 }
 .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='47.577' height='31.73' viewBox='0 0 47.577 31.73'%3E%3Cg id='Group_228' data-name='Group 228' transform='translate(-1577.493 -45.081)'%3E%3Cpath id='Path_548' data-name='Path 548' d='M0,0,32.753,2.964,44.6,4.036' transform='translate(1583.479 48.048) rotate(30)' fill='none' stroke='%23bcb9e1' stroke-linecap='round' stroke-width='4'/%3E%3Cpath id='Path_549' data-name='Path 549' d='M.009,4.136,32.763,1.172,44.61.1' transform='translate(1580.402 70.267) rotate(-30)' fill='none' stroke='%23bcb9e1' stroke-linecap='round' stroke-width='4'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.skewedBG
{
  display: block;
  position: absolute;
  right: -40vw;
  top: 0;
  width: 50vw;
  height: 100vh;
  background: #5330ac;
  -webkit-transform: skewX(-5deg);
  -moz-transform: skewX(-5deg);
  -ms-transform: skewX(-5deg);
  -o-transform: skewX(-5deg);
  transform: skewX(-5deg);
  -webkit-animation: slide 0.5s forwards;
  -webkit-animation-delay: 2s;
  -moz-animation: slide 0.5s forwards;
  animation: slide 0.5s forwards;
  -webkit-animation-delay: 0.1s;
  -moz-animation-delay: 0.1s;
  animation-delay: 0.1s;
  background: url("../images/bg_2.png");
  background-repeat: no-repeat;
  -moz-background-size: cover;
       background-size: cover;
  background-position: left top;
}
#avatar_upload{
  background: #1a0a55;
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  z-index: 10;
}
.inside_avatar
{
  width: 80px;
  height: 80px;
}
.inside_avatar_upload
{
  position: absolute;
  left: 0;
  right: 0;

  top: 0;
  z-index: 999999999999999999999999;
  width: 100%;
  margin: auto;
  margin-top: 100px;
  width: 90%;
  display: block;
  background: #fff url(../images/fileupload_bg.png) center center repeat;
  border: 2px dashed #c2cdda;
  -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
          border-radius: 10px;
  text-align: center;
  -webkit-transition: background-color 0.2s ease;
  -o-transition: background-color 0.2s ease;
  -moz-transition: background-color 0.2s ease;
  transition: background-color 0.2s ease;
}
.inside_avatar_upload .draganddrop img
{
  display: block;
  max-width: 64px;
  margin: 0 auto;
  margin-bottom: 30px;
  -webkit-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.inside_avatar_upload input[type="file"]
{
  opacity: 0;
  width: 0.1px;
  height: 0.1px;
  position: absolute;
}
.inside_avatar_upload #label_for_file {
  display: block;
  width: 100px;
  height: 100px;
  background: url(../images/fileupload_dd.png) center center no-repeat;
  -moz-background-size: contain;
  background-size: contain;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  -webkit-transition: -webkit-transform .2s ease-out;
  transition: -webkit-transform .2s ease-out;
  -o-transition: -o-transform .2s ease-out;
  -moz-transition: transform .2s ease-out, -moz-transform .2s ease-out;
  transition: transform .2s ease-out;
  transition: transform .2s ease-out, -webkit-transform .2s ease-out, -moz-transform .2s ease-out, -o-transform .2s ease-out;
  margin: 20px auto;
}
.inside_avatar_upload .avatar_upload_text
{
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 17px;
  text-align: center;
  color: #5330ac;
  line-height: 1.2;

margin-bottom: 0;padding-bottom: 0;
}
.inside_avatar_upload input[type="submit"]
{
  border: none;
  background: #5330ac;
  background-color: #5330ac;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px 30px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  color: #fff;
  text-transform: capitalize;
  font-size: 18px;
}
.inside_avatar_upload #label_for_file.img-preview
{
  height: 180px;
  width: 180px;
  -moz-background-size: cover;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border: 2px solid #be92c2;
  margin: 20px auto;
  -webkit-filter: drop-shadow(0px 0px 15px #e39dfa);
  filter: drop-shadow(0px 0px 15px #e39dfa);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
img.beer
{
  position: absolute;
  right: -207px;
  bottom: 80px;
height: 23vh;
width: auto;
-webkit-animation: slide_beer 0.5s forwards;
-moz-animation: slide_beer 0.5s forwards;
animation: slide_beer 0.5s forwards;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
animation-delay: 0.5s;
}

@-webkit-keyframes slide {
    100% { right: -15vw; }
}

@-moz-keyframes slide {
  100% { right: -15vw; }
}

@keyframes slide {
  100% { right: -15vw; }
}
@-webkit-keyframes slide_beer {
    100% { right: -0; }
}

@-moz-keyframes slide_beer {
  100% { right: -0; }
}

@keyframes slide_beer {
  100% { right: -0; }
}

 .menu_button
 {
   width: 100%;
   display: block;
   padding: 14px 0;
   color: #bcb9e1;
   position: relative;
   z-index: 1;
   text-shadow: 1px 3px 3px rgb(0 0 0 / 16%);
 font-size: 25px;}
 .menu_button:hover
 {
   color:#f4a390;
 }
  .menu_button.disabled
  {
    color: #5139aa;
    pointer-events: none;
  }
  .welcomes {
    top: 18vh;
  }
  .welcome_big
  {
    font-size: 30px;
    line-height: 1.2;
  }
  .welcome_small
  {
    font-size:  18px;
  }
  .background_0
  {
    background-position: -27vw top;
  }
  .background_1:after
  {
    bottom: -300vw;
    height: 300vw;
  }
  .background_1
  {
    top: -25px;
    -moz-background-size: 330%;
    background-size: 330%;
  }
  .arrow
  {
    top: 80vh;
  }
  .content_box .title_book
  {
    font-size: 15px;
  }
  .content_box .category_book
  {
    font-size: 10px;
  }
  .content_box .time_book
  {
    font-size: 12px;
  }
  .avatar
  {
    width: 80px;
    padding-left: 0;
  }
  .avatar .edit
  {
    right: 0;
    top: 0;
  }
  .account
  {
    position: relative;
  }
  .settings_icon
  {
    position: absolute;
    right: 10px;
    top: 10px
  }
  .dashboard .name_and_surname
  {
    font-size: 15px;
  }
  .dashboard .email
  {
    font-size: 10px;
    line-height: 1.5;
  }
  .dashboard .subtitle
  {
    font-size: 15px;
  }
  .dashboard .account
  {
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
            border-radius: 10px;
  }

  .dashboard .account_inner
  {
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
            border-radius: 10px;
  }
  .dashboard .account_inner .title_text>span
  {
    font-size: 15px;
  }
  .dashboard .account_inner .title_text
  {
    font-size: 30px;
  }
  .icon_small
  {
    line-height: 1.8;
  }
  div.gender
  {
    font-size: 12px;
  }
  label.radioslider__label .radioslider__text
  {
    font-size: 9px;
  }
  .footer
  {
    font-size: 10px;
    color:#fff;
    -webkit-box-shadow: 0px -10px 20px -8px rgba(0,0,0,0.46);
    -moz-box-shadow: 0px -10px 20px -8px rgba(0,0,0,0.46);
    box-shadow: 0 -8px 5px -5px rgb(0 0 0 / 24%);
    background: #1a0a55;
  }
  .footer a
  {
    font-weight: 900;
    color:#fff;
  }
  .book_info
  {
    padding-left: 1.3rem;
  }
  .book:hover .front
  {
            -webkit-transform: rotateY(0) scale(1);
               -moz-transform: rotateY(0) scale(1);
                    transform: rotateY(0) scale(1);
            -webkit-box-shadow: none;
               -moz-box-shadow: none;
                    box-shadow: none;
  }
  .book:hover .page1
  {
    -webkit-transform: rotateY(0) scale(1);
       -moz-transform: rotateY(0) scale(1);
            transform: rotateY(0) scale(1);
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .book:hover .page2
  {
    -webkit-transform: rotateY(0) scale(1);
       -moz-transform: rotateY(0) scale(1);
            transform: rotateY(0) scale(1);
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .book:hover .page3
  {
    -webkit-transform: rotateY(0) scale(1);
       -moz-transform: rotateY(0) scale(1);
            transform: rotateY(0) scale(1);
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .book:hover .page4
  {
    -webkit-transform: rotateY(0) scale(1);
       -moz-transform: rotateY(0) scale(1);
            transform: rotateY(0) scale(1);
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .book:hover .page5
  {
    -webkit-transform: rotateY(0) scale(1);
       -moz-transform: rotateY(0) scale(1);
            transform: rotateY(0) scale(1);
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .book:hover .page6
  {
    -webkit-transform: rotateY(0) scale(1);
       -moz-transform: rotateY(0) scale(1);
            transform: rotateY(0) scale(1);
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .book:hover .back {
    -webkit-transform: rotateY(0) scale(1);
       -moz-transform: rotateY(0) scale(1);
            transform: rotateY(0) scale(1);
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  div[accomplished="false"]> .achievement
  {
    position: relative;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  div[accomplished="false"]> .achievement::before{
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='pensil_icon' viewBox='0 0 11.429 15'%3E%3Cpath id='lock_FILL0_wght400_GRAD0_opsz48' d='M13.714,2a3.271,3.271,0,0,1,2.4.991,3.271,3.271,0,0,1,.991,2.4V7.107h1.25a1.067,1.067,0,0,1,1.071,1.071v7.75A1.067,1.067,0,0,1,18.357,17H9.071A1.067,1.067,0,0,1,8,15.929V8.179A1.067,1.067,0,0,1,9.071,7.107h1.25V5.393a3.271,3.271,0,0,1,.991-2.4A3.271,3.271,0,0,1,13.714,2Zm0,1.071a2.317,2.317,0,0,0-2.321,2.321V7.107h4.643V5.393a2.317,2.317,0,0,0-2.321-2.321ZM9.071,15.929h9.286V8.179H9.071v7.75Zm0-7.75h0v7.75h0V8.179Z' transform='translate(-8 -2)' fill='%23bcb9e1'%3E%3C/path%3E%3C/svg%3E"),url("../images/bg_pat.png");
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    position: absolute;
    left: 0;
    right: 0;
    top:0;
    bottom: 0;
    background-position: center;
    margin: auto;
    width: 100%;
    height: 100%;
    z-index: 5;
    background-repeat: no-repeat,repeat;
    -moz-background-size: 20px 20px,cover;
         background-size: 20px 20px,cover;
         -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
                 border-radius: 10px;
  }
  .main_ebook_header_img
  {
    height: 100px;
    -webkit-border-radius: 15px;
       -moz-border-radius: 15px;
            border-radius: 15px;
  }
  h2.main_ebook_title,.regular_title
  {
    font-size: 28px;
    margin: 3rem auto;
  }
  .part_ebook,.regular_info_part
  {
    padding: 3rem 1.5rem;
    -webkit-border-radius: 15px;
       -moz-border-radius: 15px;
            border-radius: 15px;
  }
  .image_box_ebooks>img
  {
    -webkit-border-radius: 15px;
       -moz-border-radius: 15px;
            border-radius: 15px;
    width: 80%;
  }
  .part_ebook:last-child,.regular_info_part:last-child{
    margin-bottom:3rem;
  }
  .image_box_ebooks
  {
    margin-top: 2rem
  }
}
@media screen and (min-width: 768px)
{
  .welcomes
  {
    top: 35vh;
  }
  .welcome_big
  {
    font-size: 50px;
  }
  .welcome_small {
      font-size: 30px;
  }
  .background_0
  {
    background-position: center top;
  }
  .background_1
  {
    top: 0;
    -moz-background-size: 110%;
         background-size: 110%;
  }
  .background_1:after
  {
    bottom: -377px;
    height: 377px;
  }
  .content_box .title_book
  {
    font-size: 20px;
  }
  .content_box .category_book
  {
    font-size: 15px;
  }
  .content_box .time_book
  {
    font-size: 15px;
  }
  .arrow
  {
   top: 90vh;
  }
  .dashboard .name_and_surname
  {
    font-size: 20px;
  }
  .dashboard .email
  {
    font-size: 14px;
  }
  label.radioslider__label .radioslider__text
  {
    font-size: 12px;
  }
  .inside_avatar
  {
    width: 180px;
    height: 180px;
  }
  h2.main_ebook_title,.regular_title
  {
    font-size: 40px;
  }
  .main_ebook_header_img {
    height: 230px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
  }
  .part_ebook,.regular_info_part
  {
    padding: 5rem 3rem;
    -webkit-border-radius: 30px;
       -moz-border-radius: 30px;
            border-radius: 30px;
  }
  .image_box_ebooks>img
  {
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    width: 80%;
    margin: auto;
  }
   .ratio-16x9 iframe
   {
     -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
             border-radius: 30px;
             width: 80%;
             left:0;
             right:0;
             margin: auto;
   }
  .part_ebook:last-child, .regular_info_part:last-child{
    margin-bottom:3rem;
  }
  .image_box_ebooks
  {
    margin-top: inherit;
    text-align: center;
  }
}
@media screen and (min-width: 992px)
{
  .settings_icon
  {
    position: inherit;
  }
  .avatar
  {
    position: relative;
    width: 180px;
    margin: auto;
  }
  .avatar .edit
  {
    right: 28px;
    top: 0;
  }
  .account
  {
    position: relative;
  }
  .dashboard .email
  {
    font-size: 10px;
    line-height: 1.5;
  }
  .dashboard .account
  {
    -webkit-border-radius: 10px 0 0 10px;
        -moz-border-radius: 10px 0 0 10px;
        border-radius: 10px 0 0 10px;
        margin-top: 0;
  }

  .dashboard .account_inner
  {
    -webkit-border-radius: 0 10px 10px 0;
       -moz-border-radius: 0 10px 10px 0;
            border-radius: 0 10px 10px 0;
  }
  .dashboard .account_inner .title_text>span
  {
    font-size: 15px;
  }
  .dashboard .account_inner .title_text
  {
    font-size: 30px;
  }
  .book_info
  {
    padding-left: 0;
  }
  .book:hover .front
  {
    -webkit-transform: rotateY(-88deg) scale(1.1);
       -moz-transform: rotateY(-88deg) scale(1.1);
            transform: rotateY(-88deg) scale(1.1);
    -webkit-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
            box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
  }
  .book:hover .page1
  {
    -webkit-transform: rotateY(-88deg) scale(1.1);
       -moz-transform: rotateY(-88deg) scale(1.1);
            transform: rotateY(-88deg) scale(1.1);
    -webkit-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
            box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
  }
  .book:hover .page2
  {
    -webkit-transform: rotateY(-30deg) scale(1.1);
       -moz-transform: rotateY(-30deg) scale(1.1);
            transform: rotateY(-30deg) scale(1.1);
    -webkit-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
            box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
  }
  .book:hover .page3
  {
    -webkit-transform: rotateY(-88deg) scale(1.1);
       -moz-transform: rotateY(-88deg) scale(1.1);
            transform: rotateY(-88deg) scale(1.1);
    -webkit-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
            box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
  }
  .book:hover .page4
  {
    -webkit-transform: rotateY(-35deg) scale(1.1);
       -moz-transform: rotateY(-35deg) scale(1.1);
            transform: rotateY(-35deg) scale(1.1);
    -webkit-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
            box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
  }
  .book:hover .page5
  {
    -webkit-transform: rotateY(-88deg) scale(1.1);
       -moz-transform: rotateY(-88deg) scale(1.1);
            transform: rotateY(-88deg) scale(1.1);
    -webkit-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
            box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
  }
  .book:hover .page6
  {
    -webkit-transform: rotateY(-40deg) scale(1.1);
       -moz-transform: rotateY(-40deg) scale(1.1);
            transform: rotateY(-40deg) scale(1.1);
    -webkit-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
            box-shadow: 0 1em 3em 0 rgba(0, 0, 0, .2);
  }
  .book:hover .back {
    -webkit-transform: rotateY(-20deg) scale(1.1);
       -moz-transform: rotateY(-20deg) scale(1.1);
            transform: rotateY(-20deg) scale(1.1);
  }
  .main_ebook_header_img {
    height: 300px;
  }
}
@media screen and (min-width: 1400px)
{
  .background_0
  {
  top: -3vh;
  }
  .background_1
  {
    top: 6vh;
  }
  .dashboard .subtitle
  {
    font-size: 20px;
  }
  .icon_small
  {
    line-height: 1.2;
  }
}

@media screen and (min-width: 1600px)
{

}