/* HEADER */

.br {
  display: none;
}

@media only screen and (max-width: 600px) {
  .br {
    display: inline-block;  
  }
}


/* RKN  */

.rkn-title {
  font-size: 18px;
  margin-top: 40px;
}

.rkn-entry {
  font-size: 16px;
}

.rkn-entry:last-of-type {
  margin-bottom: 80px;
}

/* BANNER */

.page__banner {
  width: 100%;
  margin-bottom: 20px;
  border-radius: 3px;
}

.banner__bots {
  background: linear-gradient(to top right, #ffe5e5, #ffece5, #fff2e5, #fff9e5, #ffffe5, #f9ffe5, #f2ffe5, #ecffe5, #e5ffe5, #e5ffec, #e5fff2, #e5fff9, #e6ffff, #e5f9ff, #e5f2ff, #e5ecff, #e5e5ff, #ece5ff, #f2e5ff, #f9e5ff, #ffe5ff, #ffe5f9, #ffe5f2, #ffe5ec, #ffe5e5);
}

.banner__tg {
  background: linear-gradient(to top right, #ffe5e5, #ffece5, #fff2e5, #fff9e5, #ffffe5, #f9ffe5, #f2ffe5, #ecffe5, #e5ffe5, #e5ffec, #e5fff2, #e5fff9, #e6ffff, #e5f9ff, #e5f2ff, #e5ecff, #e5e5ff, #ece5ff, #f2e5ff, #f9e5ff, #ffe5ff, #ffe5f9, #ffe5f2, #ffe5ec, #ffe5e5);
}

.banner__socials {
  padding-top: 5px;
  padding-bottom: 10px;
}

.banner__socials-item {
  display: inline-block;
  width: 50%;
}

.banner__socials-item-content {
  border-radius: 3px;
}
.banner__socials .banner__socials-item:first-child .banner__socials-item-content {
  margin-right: 10px;
}

.banner__socials .banner__socials-item:last-child .banner__socials-item-content {
  margin-left: 10px;
}

.banner__block {
  display: inline-block;
}

.banner__block-image {
  padding: 10px;
  margin: 0px;
}

.banner__block-image img {
  padding-left: 20px;
  height: 60px;
  /* data url */
  /*margin-left: 20px;*/
  /*width: 60px;*/
  /*display: inline-block;*/
  /*background-size: cover;*/
  /*content: "";*/
}

.banner_socials-title {
  font-weight: bold;
  font-size: 16px;
}

.banner_socials-followers {
  margin-bottom: 9px;
}

.banner_socials-new {
  padding-left: 6px;
  color: red;
  font-style: italic;
}

.banner_socials-verified {
  padding-left: 6px;
  padding-top: 4px;
  background: no-repeat 50%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m2.25%206.75%202.25%202.25%205.25-5.25%22%20fill%3D%22none%22%20stroke%3D%22%235c9ce6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%3C%2Fsvg%3E");
}

.banner__socials-button:hover {
  text-decoration: none;
  background-color: MediumVioletRed;
  box-shadow: 4px 4px DodgerBlue;
}

.banner__socials-button {
  color: white;
  background-color: purple;
  border-radius: 3px;
  padding: 6px 25px;  
  font-size: 15px;
  box-shadow: 4px 4px MediumBlue;
  transition: 0.1s ease-in-out;
}


@media only screen and (max-width: 768px) {
  .banner__socials-button {
    font-weight: bold;
  }
}


/**/

.page__banner-title {
  text-align: center;
  /*font-size: 18px;*/
  font-size: 20px;
  font-weight: bold;
  padding-top: 15px;
  padding-left: 15px;
  padding-right: 15px;
}

.page__banner-text {
  /*font-size: 16px;*/
  font-size: 18px;
  padding: 0px 60px;
}

.page__banner-text ul {
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 15px;
}

.page__banner-text li {
  padding-top: 10px;
  list-style-position: outside;
  list-style-type: square;
  color: crimson;
}

.page__banner-text li span {
  color: #333;
}

.page__banner-text div {
  padding-top: 10px;
}

.page__banner-text a {
  font-weight: bold;
  font-style: italic;
}

.page__banner-link {
  text-align: center;
  font-size: 16px;
  padding-top: 20px;
  padding-bottom: 20px; 
  font-style: italic;
  font-weight: bold;
}

.page__banner-button {
  display: inline-block;
  color: #0077cc;
  cursor: pointer;
  border: 2px solid;
  padding: 5px 20px 6px;
  border-radius: 22px;
}

.page__banner-button_ok {
  border-color: #0077cc;
  transition: 0.1s ease-in-out;
}

.page__banner-button_ok:hover {
  background-color: white;
  border-color: #0077cc;
  color: #0077cc;
  text-decoration: none;
}

.page__banner-button_ok:active {
  background-color: #0077cc;
  border-color: #0077cc;
  color: #fafbfc;
}

@media only screen and (max-width: 375px) {
  .page__banner-button_ok:hover {
    background-color: #0077cc;
    border-color: #0077cc;
    color: #fafbfc;
  }

  .page__banner-button_ok:active {
    background-color: white;
    border-color: #0088cc;
    color: #0077cc;
  }
}

@media only screen and (max-width: 768px) {
  .page__banner-text {
    padding-left: 25px;
    padding-right: 25px;
  }
}



/* LAST BOXES (CARDS LIST) */

.page__main {
  margin-top: 35px;
}

.page__main--no-padding {
}

.page__main ul {
  padding-bottom: 0px;
}

.page__box {
  margin-top: 15px;
  white-space: nowrap;
  margin-bottom: 40px;
  text-align: center;
}

.page__box.flex {
  display: flex;
}

.page__box:nth-child(1) .page__box-rating {
  color: rgb(201, 176, 55);
  text-shadow: 4px 4px 0px rgb(175, 149, 0);
}

.page__box:nth-child(2) .page__box-rating {
  color: rgb(215, 215, 215);
  text-shadow: 4px 4px 0px rgb(180, 180, 180);
}

.page__box:nth-child(3) .page__box-rating {
  color: rgb(173, 138, 86);
  text-shadow: 4px 4px 0px rgb(106, 56, 5);
}

.page__box:nth-child(n+4) .page__box-rating {
  color: lightslategray;
  font-size: 120px;
}

.page__box-rating {
  flex-basis: 30%;

  vertical-align: center;
  align-self: center;

  font-size: 150px;
}

@media only screen and (max-width: 768px) {
  .page__box-rating {
    font-size: 100px;
  }

  .page__box:nth-child(n+4) .page__box-rating {
    font-size: 70px;
  }
}

@media only screen and (max-width: 414px) {
  .page__box-rating {
    font-size: 100px;
  }
  .page__box:nth-child(n+4) .page__box-rating {
    font-size: 70px;
  }
}

.page__box-wrapper.flex {
  flex-basis: 60%;
}


.page__box-wrapper {
  width: 50%;
  display: inline-block;
}

.box__image {
  width: 100%;
  height: 100%; /* override img tag height used to fix reflow which  */
  border-radius: 3px;
  background-size: cover;
  object-fit: cover;
}

.box__title {
  padding-top: 8px;
  /*padding-bottom: 8px;*/
}


/* SKELETON */

.skeleton {
  animation: skeleton-loading 1s linear infinite alternate;
}

@keyframes skeleton-loading {
  0% {
    background-color: hsl(200, 20%, 80%);
  }
  100% {
    background-color: hsl(200, 20%, 95%);
  }
}


/* CARD BUTTONS */

.box__buttons {
  padding-top: 8px;
}

.box__buttons .box__buttons-block {
  width: 50%;
}

.box__buttons .box__buttons-block:first-child {
  float: left;
}

.box__buttons .box__buttons-block:last-child {
  float: right;
}


.box__buttons .box__buttons-block--socials {
  margin-top: 4px;
}

.box__buttons .box__buttons-block--socials div {
  float: left;
}


.box__buttons .box__buttons-block--socials .box__buttons-likes-block .box__buttons-likes {
  width: 24px;
  height: 24px;
  background: no-repeat 50%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ctitle%3Elike_outline_24%3C%2Ftitle%3E%3Cpath%20d%3D%22M0%2C0H24V24H0Z%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M17%2C2.9A6.43%2C6.43%2C0%2C0%2C1%2C23.4%2C9.33c0%2C3.57-1.43%2C5.36-7.45%2C10l-2.78%2C2.16a1.9%2C1.9%2C0%2C0%2C1-2.33%2C0L8.05%2C19.37C2%2C14.69.6%2C12.9.6%2C9.33A6.43%2C6.43%2C0%2C0%2C1%2C7%2C2.9a6.46%2C6.46%2C0%2C0%2C1%2C5%2C2.54A6.46%2C6.46%2C0%2C0%2C1%2C17%2C2.9ZM7%2C4.7A4.63%2C4.63%2C0%2C0%2C0%2C2.4%2C9.33c0%2C2.82%2C1.15%2C4.26%2C6.76%2C8.63l2.78%2C2.16a.1.1%2C0%2C0%2C0%2C.12%2C0L14.84%2C18c5.61-4.36%2C6.76-5.8%2C6.76-8.63A4.63%2C4.63%2C0%2C0%2C0%2C17%2C4.7c-1.56%2C0-3%2C.88-4.23%2C2.73L12%2C8.5l-.74-1.07C10%2C5.58%2C8.58%2C4.7%2C7%2C4.7Z%22%20fill%3D%22%23828a99%22%2F%3E%3C%2Fsvg%3E");
  padding-left: 15px;
  transition: 0.1s ease-in-out;
}

.box__buttons .box__buttons-block--socials .box__buttons-likes-block:hover .box__buttons-likes {
  opacity: 0.7;
}

.box__buttons .box__buttons-block--socials .box__buttons-likes-block .box__buttons-likes-clicked {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m0%200h24v24h-24z%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22m17%202.9a6.43%206.43%200%200%201%206.4%206.43c0%203.57-1.43%205.36-7.45%2010l-2.78%202.16a1.9%201.9%200%200%201%20-2.33%200l-2.79-2.12c-6.05-4.68-7.45-6.47-7.45-10.04a6.43%206.43%200%200%201%206.4-6.43%205.7%205.7%200%200%201%205%203.1%205.7%205.7%200%200%201%205-3.1z%22%20fill%3D%22%23ff3347%22%2F%3E%3C%2Fsvg%3E");
}


.box__buttons .box__buttons-block--socials .box__buttons-comments-block .box__buttons-comments {
  width: 24px;
  height: 24px;
  background: no-repeat 50%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m0%200h24v24h-24z%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22m7.84%2022.53a2%202%200%200%201%20-.74-1.53v-2.1h-1.6a3.26%203.26%200%200%201%20-3.4-3.4v-9a3.26%203.26%200%200%201%203.4-3.4h13a3.26%203.26%200%200%201%203.4%203.4v9a3.26%203.26%200%200%201%20-3.4%203.4h-4.66l-3.72%203.26a1.69%201.69%200%200%201%20-2.28.37zm4.93-5.09a1.4%201.4%200%200%201%20.92-.35h4.81a1.47%201.47%200%200%200%201.6-1.6v-9a1.47%201.47%200%200%200%20-1.6-1.6h-13a1.47%201.47%200%200%200%20-1.6%201.61v9a1.47%201.47%200%200%200%201.6%201.6h2.5c.7.2.7.2.9.9v2.83z%22%20fill%3D%22%23828a99%22%2F%3E%3C%2Fsvg%3E");
  padding-left: 15px;
  transition: 0.1s ease-in-out;
}

.box__buttons .box__buttons-block--socials .box__buttons-comments-block:hover .box__buttons-comments {
  opacity: 0.7;
}


.box__buttons .box__buttons-block--socials .box__buttons-counts {
  color: #67707a;
  font-family: 'Helvetica Neue', sans-serif;
  /*font-family: '-apple-system', BlinkMacSystemFont, Roboto, 'Open Sans', 'Helvetica Neue', 'Noto Sans Armenian', 'Noto Sans Bengali', 'Noto Sans Cherokee', 'Noto Sans Devanagari', 'Noto Sans Ethiopic', 'Noto Sans Georgian', 'Noto Sans Hebrew', 'Noto Sans Kannada', 'Noto Sans Khmer', 'Noto Sans Lao', 'Noto Sans Osmanya', 'Noto Sans Tamil', 'Noto Sans Telugu', 'Noto Sans Thai', sans-serif;*/
  line-height: 22px;
  font-size: 16px;
  /*height: 16px;*/
}


.box__buttons .box__buttons-block--badges {
  margin-top: 4px;
}


.box__buttons .box__buttons-block--badges .box__badges-promocode {
  float: left;

  background-color: rgb(138, 43, 226, 0.8); /* blueviolet; */

/*  border-color: darkorchid;*/
/*  border-color: indigo;*/
/*  border-color: darkmagenta;*/
  
/*  border-width: 0px;*/
/*  border-style: solid;*/
  border-radius: 20px;

  color: ghostwhite;
  font-size: 11px;
  padding: 4px 13px;

  transition: 1.3s ease-in-out;
}

.box__buttons .box__buttons-block--badges .box__badges-promocode:hover {
  background-color: orchid;
}


.box__buttons .box__buttons-block--action {}

.box__buttons .box__buttons-block--action div {
  float: right;

  background-color: Crimson;
  border-radius: 3px;
  padding: 4px 20px;
  color: white;
  font-size: 15px;

  transition: 0.1s ease-in-out;
}

.box__buttons .box__buttons-block--action div:hover {
  background-color: red;
}


.box__buttons .box__buttons-block--disabled {}

.box__buttons .box__buttons-block--disabled div {
  background-color: darkgray;
}

.box__buttons .box__buttons-block--disabled div:hover {
  background-color: gray;
}


@media only screen and (max-width: 768px) {
  .page__box-wrapper {
    width: 70%;
  }

  .box__buttons-likes, .box__buttons-comments {
    opacity: 1;
  }

  .box__buttons .box__buttons-block--badges {
    font-weight: bold;
  }

  .box__buttons .box__buttons-block--badges .box__badges-promocode {
    padding-top: 5px;
  }

  .box__buttons .box__buttons-block--action div {
    font-weight: bold;
  }

  .box__buttons .box__buttons-block--disabled div {
    font-weight: bold;
  }
}

@media only screen and (max-width: 414px) {
  .page__box-wrapper {
    width: 80%;
  }
}

@media only screen and (max-width: 320px) {
  .page__box-wrapper {
    width: 80%;
  } 
}




/* RESET */

* {
  padding: 0;
  margin: 0;
}

body {
  font: 14px/18px "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Verdana, sans-serif;
  color: #333;
  line-height: 1.5;
  background-color: white;
}




/* CONTAINER */

.page_container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
}


@media (min-width: 768px) {
  .page_container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .page_container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .page_container {
    width: 1170px;
  }
}

.page_content_wrap {
  padding-top: 15px;
  padding-bottom: 20px;
  max-width: 700px;
  margin: 0 auto;
}

.page_navbar_container {
  margin-right: auto;
  margin-left: auto;
  width: 700px;
  padding-top: 15px;
}

.page_navbar {
  border-width: 0 0 0px;
  border-style: solid;
  border-color: #eee;
  /*min-height: 48px;*/
  min-height: 78px;
}

.clearfix:before {
  content: " ";
  display: table;
}

.clearfix:after {
  content: " ";
  display: table;
  clear: both;
}


@media only screen and (max-width: 768px) {
  .page_content_wrap {
    padding-bottom: 10px;
  }

  .page_navbar_container {
    width: 100%;

    padding-left: 20px;
    padding-right: 20px;
  }
  
  .page_container, .page_navbar {
    padding-left: 20px;
    padding-right: 20px;
  }
}

@media only screen and (max-width: 414px) {
  .page_content_wrap {
    padding-bottom: 0px;
  }

  .page_navbar_container {
    padding-left: 0px;
    padding-right: 0px;
  }
}




/* FOOTER */

.footer {
  border-top: 1px solid #e8e8e8;
  max-width: 825px;
  margin: 10px auto 0;
  padding: 10px 0 34px;
}

.footer__wrap {
  padding: 0 0 0 63px;
  margin: 0;
}

.footer__column {
  display: inline-block;
  vertical-align: top;
  padding-right: 60px;
}

.footer__column:first-child {
  max-width: 270px;
  padding-right: 40px;
}

.footer__column:last-child {
  padding-right: 0px;
}

.footer__block {
  padding-top: 20px;
}

.footer__header {
  font-size: 16px;    
  padding-bottom: 8px;
}

.footer__description {
  font-size: 14px;
}

.footer__link {
  display: block;
  padding-top: 2px;
}

.copyright {
  font-size: 15px;
  text-align: center;
  padding-bottom: 25px;
}

@media only screen and (max-width: 768px) {
  .footer {
    border-top-width: 0px;
    padding-top: 10px;
    padding-bottom: 20px;
    background-color: WhiteSmoke;
  }

  .footer__wrap {
    padding-left: 20px;
  }

  .footer__column {
    display: block;
  }

  .copyright {
    background-color: WhiteSmoke;
  }
}

@media only screen and (max-width: 414px) {
  .footer__wrap {
    padding-left: 20px;
  }
}




/**/

.promo {
  max-width: 700px;
}

a {
  color: #0088cc;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

ul {
  padding: 10px 0;
  list-style-type: none;
}

ul li {
    background: none;
    padding-left: 0;
    padding-top: 1px;
    padding-bottom: 2px;
}

h4 {
  font-size: 16px;
  font-weight: bold;
  
  margin-top: 21px;
  margin-bottom: 7px;
}

p {
  font-size: 14px;
  line-height: 1.5;
  
  margin-bottom: 8.5px;
}

/* nav */

.brand-block {
  display: inline-block;
  white-space: nowrap;
}

.brand-block__link {
  display: inline-block;
}

.brand-block__image {
  /*padding-right: 6px;*/
  margin-right: 6px;
  height: 80px;
  border-radius: 50%;
  /* data url */
  /*margin-right: 6px;*/
  /*width: 80px;*/
  /*display: inline-block;*/
  /*background-size: cover;*/

  /*content: "";*/
  /*width: 80px;*/
  /*display: block;*/  
  /*height: 94px;*/
  /*padding-right: 8px;*/
}

.brand-block__image--small {
/*  margin-right: 6px;*/
  height: 60px;
  border-radius: 50%;
}

/*.brand-block__name--center {
  text-align: center;
  display: inline-block;
  vertical-align: top;
}
*/
.brand-block__name {
  display: inline-block;
  vertical-align: top;
  padding-left: 5px;
}

.brand-block__name h1 {
  font-size: 20px;
  /*font-size: 24px;*/
  margin-top: 6px;
  padding-top: 5px;
}

.brand-block__name h2 {
  display: inline-block;
  font-size: 16px;
  /*font-size: 18px;*/
  font-weight: normal;
  margin-bottom: 12px;
}

@media only screen and (max-width: 414px) {
  .brand-block__name h1 {
    padding-top: 0px;
  }

  .brand-block__name h2 {
    line-height: 20px;
  }
}

@media only screen and (max-width: 768px) {
  .promo {
    width: 100%;
  }
}