@font-face {

  font-family: Montserrat;

  font-weight: 400;

  font-style: normal;

  font-display: swap;

  src: url(../fonts/Montserrat-Regular/Montserrat-Regular.eot);

  src: url(../fonts/Montserrat-Regular/Montserrat-Regular.eot?#iefix) format("embedded-opentype"), url(../fonts/Montserrat-Regular/Montserrat-Regular.woff) format("woff"), url(../fonts/Montserrat-Regular/Montserrat-Regular.ttf) format("truetype")

}



@font-face {

  font-family: Montserrat;

  font-weight: 500;

  font-style: normal;

  font-display: swap;

  src: url(../fonts/Montserrat-Medium/Montserrat-Medium.eot);

  src: url(../fonts/Montserrat-Medium/Montserrat-Medium.eot?#iefix) format("embedded-opentype"), url(../fonts/Montserrat-Medium/Montserrat-Medium.woff) format("woff"), url(../fonts/Montserrat-Medium/Montserrat-Medium.ttf) format("truetype")

}



@font-face {

  font-family: Montserrat;

  font-weight: 600;

  font-style: normal;

  font-display: swap;

  src: url(../fonts/Montserrat-SemiBold/Montserrat-SemiBold.eot);

  src: url(../fonts/Montserrat-SemiBold/Montserrat-SemiBold.eot?#iefix) format("embedded-opentype"), url(../fonts/Montserrat-SemiBold/Montserrat-SemiBold.woff) format("woff"), url(../fonts/Montserrat-SemiBold/Montserrat-SemiBold.ttf) format("truetype")

}



@font-face {

  font-family: Montserrat;

  font-weight: 700;

  font-style: normal;

  font-display: swap;

  src: url(../fonts/Montserrat-Bold/Montserrat-Bold.eot);

  src: url(../fonts/Montserrat-Bold/Montserrat-Bold.eot?#iefix) format("embedded-opentype"), url(../fonts/Montserrat-Bold/Montserrat-Bold.woff) format("woff"), url(../fonts/Montserrat-Bold/Montserrat-Bold.ttf) format("truetype")

}



@font-face {

  font-family: Montserrat;

  font-weight: 800;

  font-style: normal;

  font-display: swap;

  src: url(../fonts/Montserrat-ExtraBold/Montserrat-ExtraBold.eot);

  src: url(../fonts/Montserrat-ExtraBold/Montserrat-ExtraBold.eot?#iefix) format("embedded-opentype"), url(../fonts/Montserrat-ExtraBold/Montserrat-ExtraBold.woff) format("woff"), url(../fonts/Montserrat-ExtraBold/Montserrat-ExtraBold.ttf) format("truetype")

}



*, ::after, ::before {

  -webkit-box-sizing: border-box;

  box-sizing: border-box

}



html {

  font-family: sans-serif;

  line-height: 1.15;

  -webkit-text-size-adjust: 100%;

  -ms-text-size-adjust: 100%;

  -ms-overflow-style: scrollbar;

  -webkit-tap-highlight-color: transparent

}



@-ms-viewport {

  width: device-width

}



article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section {

  display: block

}



body {

  margin: 0;

  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

  font-size: 1rem;

  font-weight: 400;

  line-height: 1.5;

  color: #212529;

  text-align: left;

  background-color: #fff

}



[tabindex="-1"]:focus {

  outline: 0 !important

}



hr {

  -webkit-box-sizing: content-box;

  box-sizing: content-box;

  height: 0;

  overflow: visible

}



h1, h2, h3, h4, h5, h6 {

  margin-top: 0;

  margin-bottom: .5rem

}



p {

  margin-top: 0;

  margin-bottom: 1rem

}



abbr[data-original-title], abbr[title] {

  text-decoration: underline;

  -webkit-text-decoration: underline dotted;

  text-decoration: underline dotted;

  cursor: help;

  border-bottom: 0

}



address {

  margin-bottom: 1rem;

  font-style: normal;

  line-height: inherit

}



dl, ol, ul {

  margin-top: 0;

  margin-bottom: 1rem

}



ol ol, ol ul, ul ol, ul ul {

  margin-bottom: 0

}



dt {

  font-weight: 700

}



dd {

  margin-bottom: .5rem;

  margin-left: 0

}



blockquote {

  margin: 0 0 1rem

}



dfn {

  font-style: italic

}



b, strong {

  font-weight: bolder

}



small {

  font-size: 80%

}



sub, sup {

  position: relative;

  font-size: 75%;

  line-height: 0;

  vertical-align: baseline

}



sub {

  bottom: -.25em

}



sup {

  top: -.5em

}



a {

  color: #007bff;

  text-decoration: none;

  background-color: transparent;

  -webkit-text-decoration-skip: objects

}



a:hover {

  color: #0056b3;

  text-decoration: underline

}



a:not([href]):not([tabindex]) {

  color: inherit;

  text-decoration: none

}



a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {

  color: inherit;

  text-decoration: none

}



a:not([href]):not([tabindex]):focus {

  outline: 0

}



code, kbd, pre, samp {

  font-family: monospace, monospace;

  font-size: 1em

}



pre {

  margin-top: 0;

  margin-bottom: 1rem;

  overflow: auto;

  -ms-overflow-style: scrollbar

}



figure {

  margin: 0 0 1rem

}



img {

  vertical-align: middle;

  border-style: none

}



svg:not(:root) {

  overflow: hidden

}



table {

  border-collapse: collapse

}



caption {

  padding-top: .75rem;

  padding-bottom: .75rem;

  color: #6c757d;

  text-align: left;

  caption-side: bottom

}



th {

  text-align: inherit

}



label {

  display: inline-block;

  margin-bottom: .5rem

}



button {

  border-radius: 0

}



button:focus {

  outline: 1px dotted;

  outline: 5px auto -webkit-focus-ring-color

}



button, input, optgroup, select, textarea {

  margin: 0;

  font-family: inherit;

  font-size: inherit;

  line-height: inherit

}



button, input {

  overflow: visible

}



button, select {

  text-transform: none

}



[type=reset], [type=submit], button, html [type=button] {

  -webkit-appearance: button

}



[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {

  padding: 0;

  border-style: none

}



input[type=checkbox], input[type=radio] {

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  padding: 0

}



input[type=date], input[type=datetime-local], input[type=month], input[type=time] {

  -webkit-appearance: listbox

}



textarea {

  overflow: auto;

  resize: vertical

}



fieldset {

  min-width: 0;

  padding: 0;

  margin: 0;

  border: 0

}



legend {

  display: block;

  width: 100%;

  max-width: 100%;

  padding: 0;

  margin-bottom: .5rem;

  font-size: 1.5rem;

  line-height: inherit;

  color: inherit;

  white-space: normal

}



progress {

  vertical-align: baseline

}



[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {

  height: auto

}



[type=search] {

  outline-offset: -2px;

  -webkit-appearance: none

}



[type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration {

  -webkit-appearance: none

}



::-webkit-file-upload-button {

  font: inherit;

  -webkit-appearance: button

}



output {

  display: inline-block

}



summary {

  display: list-item;

  cursor: pointer

}



template {

  display: none

}



[hidden] {

  display: none !important

}



::-webkit-input-placeholder {

  color: #61656f

}



::-moz-placeholder {

  color: #61656f

}



:-ms-input-placeholder {

  color: #61656f

}



::-ms-input-placeholder {

  color: #61656f

}



::placeholder {

  color: #7f9dcb

}



::-moz-selection {

  background-color: #0463e4;

  color: #fff

}



::selection {

  background-color: #0463e4;

  color: #fff

}



body {

  font-size: 16px;

  min-width: 320px;

  position: relative;

  line-height: 1.65;

  font-family: Montserrat, sans-serif;

  overflow-x: hidden;

  background-color: #0c1b32;

  color: #61656f

}



body input, body textarea {

  border: #666 1px solid;

  outline: 0

}



a {

  -webkit-transition: .25s all ease-in-out;

  -o-transition: .25s all ease-in-out;

  transition: .25s all ease-in-out

}



button {

  cursor: pointer;

  -webkit-transition: .25s all ease-in-out;

  -o-transition: .25s all ease-in-out;

  transition: .25s all ease-in-out

}



button:focus {

  outline: 0

}



img {

  pointer-events: none

}



b, strong {

  font-weight: 700

}



.container {

  max-width: 1030px;

  margin: 0 auto

}



.btn {

  cursor: pointer;

  padding: 23px 54px;

  background-color: #0d3f8c;

  border-radius: 8px;

  font-size: 21px;

  line-height: 1.2;

  font-weight: 700;

  color: #f0f5f8;

  -webkit-transition: .25s all ease-in-out;

  -o-transition: .25s all ease-in-out;

  transition: .25s all ease-in-out;

  text-align: center;

  border: none

}



.btn:hover {

  background-color: #1049a1;

  text-decoration: none;

  color: #f0f5f8

}



.btn.gray {

  background-color: #2c384b

}



.btn.gray:hover {

  background-color: #324159

}



.title {

  font-size: 45px;

  line-height: 1.23;

  font-weight: 700;

  color: #fff

}



.pretitle {

  font-size: 32px;

  line-height: 1;

  font-weight: 700;

  color: #fff;

  margin-bottom: 35px

}



.header {

  padding-top: 65px;

  margin-bottom: 65px

}



.header .container {

  max-width: 1440px

}



.header__container {

  display: flex;

  align-items: center;

  justify-content: space-between;

}



.header__logo {

  display: block;

  font-size: 20px;

  line-height: 1.25;

  font-weight: 700;

  color: #ffffff;

}



.header__logo img {

  width: 100%;

  height: auto;

  -o-object-fit: contain;

  object-fit: contain

}



.header__logo:hover {

  opacity: .8;

  text-decoration: none;

  color: #ffffff;

}



.main {

  margin: 60px 0

}



.quiz__item {

  display: none

}



.quiz__item.active {

  display: block

}



.quiz__itemTop {

  margin-bottom: 40px

}



.quiz__itemStep {

  font-size: 35px;

  line-height: 1.2;

  font-weight: 600;

  color: #7f9dcb

}



.quiz__itemInfo {

  max-width: 880px;

  margin-bottom: 50px

}



.quiz__itemInfoTitle {

  font-size: 40px;

  line-height: 1.2;

  font-weight: 700;

  color: #fff

}



.quiz__itemInfoText {

  font-size: 22px;

  line-height: 1.45;

  font-weight: 500;

  color: #7f9dcb;

  margin-top: 15px

}



.quiz__itemContent input {

  width: 100%;

  height: 65px;

  background-color: #122440;

  border: 1px solid #20385d;

  border-radius: 3px;

  padding: 0 30px;

  font-size: 20px;

  line-height: 1.2;

  font-weight: 400;

  color: #7f9dcb

}



.quiz__itemContent select {

  width: 100%;

  height: 65px;

  background-color: #122440;

  border: 1px solid #20385d;

  border-radius: 3px;

  padding: 0 30px;

  font-size: 20px;

  line-height: 1.2;

  font-weight: 400;

  color: #7f9dcb;

  cursor: pointer;

  -webkit-appearance: none;

  -moz-appearance: none;

  appearance: none;

  outline: 0;

  background-image: url(../img/dropdown.png);

  background-repeat: no-repeat;

  background-position: calc(100% - 15px) center

}



.quiz__itemBottom {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 15px 30px;

  margin-top: 60px;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap

}



.quiz__color {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  gap: 25px;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center

}



.quiz__colorBlock {

  -webkit-box-flex: 0;

  -ms-flex: none;

  flex: none;

  width: 75px;

  height: 70px;

  border-radius: 5px

}



.quiz__colorBlock img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover

}



.quiz__colorRating {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 8px

}



.quiz__colorRating span {

  width: 32px;

  height: 32px;

  display: block;

  padding: 0;

  cursor: pointer;

  background-image: url(../img/quiz__colorRating.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: contain

}



.quiz__colorRating span.active {

  background-image: url(../img/quiz__colorRatingHover.png)

}



.quiz__drag {

  margin: 0;

  padding: 0;

  max-width: 710px;

  display: grid;

  grid-template-columns: 1fr;

  gap: 20px

}



.quiz__dragItem {

  padding: 25px 30px;
  margin-bottom: 10px;
  border: 1px solid #20385d;

  background-color: #122440;

  border-radius: 3px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;
	
  touch-action: auto;

  -ms-flex-align: center;

  align-items: center;

  gap: 15px;

  list-style: none;

  position: relative;

  cursor: pointer

}



.quiz__dragItem input {

  position: absolute;

  width: 1.75em;

  left: .25em;

  top: .25em;

  border: 0;

  text-align: center;

  background: 0 0;

  opacity: 0

}



.quiz__dragItemTitle {
  pointer-events: painted;
  font-size: 20px;

  line-height: 1.4;

  font-weight: 600;

  color: #fff;

  -webkit-box-flex: 1;

  -ms-flex: 1;

  flex: 1

}

/* New color blocks */
.quiz__dragItem.quiz__dragItemColor {
  padding: 0;
  border: 0;
  background: none;
  border-radius: 0;
}
.quiz__dragItemColorBlock {
  width: 100%;
  max-width: 585px;
  height: 126px;
  border-radius: 3px;
  margin-right: 15px;
}
.quiz__dragItemColorBlock.white {
  background-color: #fff;
}
.quiz__dragItemColorBlock.red {
  background-image: linear-gradient(90deg, #a11314 0%, #fe1213 100%);
}
.quiz__dragItemColorBlock.green {
  background-image: linear-gradient(90deg, #66c104 0%, #c0f04f 100%);
}
.quiz__dragItemColorBlock.silver {
  background-image: linear-gradient(90deg, #b8aebd 0%, #f0def1 50%, #b8aebd 100%);
}
.quiz__dragItemColorBlock.blue {
  background-image: linear-gradient(90deg, #0a38ae 0%, #0030ff 100%);
}
.quiz__dragItemColorBlock.orange {
  background-image: linear-gradient(90deg, #ff7701 0%, #ff9c00 100%);
}
.quiz__dragItemColorBlock.purple {
  background-image: linear-gradient(90deg, #8900fe 0%, #ff00ff 100%);
}
.quiz__dragItemColorBlock.black {
  background-image: linear-gradient(90deg, #000000 0%, #171717 100%);
}
.quiz__dragItemColorBlock.lightblue {
  background-image: linear-gradient(90deg, #02c2b6 0%, #82f7fe 100%);
}
.quiz__dragItemColorBlock.yellow {
  background-image: linear-gradient(90deg, #ffcc00 0%, #fffe41 100%);
}
@media (max-width:575px) {
  .quiz__dragItemColorBlock {
    margin-right: 5px;
    height: 90px;
  }
}
/* New color blocks */

.quiz__dragItemList {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 20px;

  -webkit-box-flex: 0;

  -ms-flex: none;

  flex: none

}



.quiz__dragItemTop {

  width: 22px;

  height: 26px;

  background-image: url(../img/quiz__dragItemTop.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: contain;

  cursor: pointer;

  -webkit-transition: .25s all ease-in-out;

  -o-transition: .25s all ease-in-out;

  transition: .25s all ease-in-out;

  opacity: .7;

}







.quiz__dragItemBottom {

  width: 22px;

  height: 26px;

  background-image: url(../img/quiz__dragItemBottom.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: contain;

  cursor: pointer;

  -webkit-transition: .25s all ease-in-out;

  -o-transition: .25s all ease-in-out;

  transition: .25s all ease-in-out;

  opacity: .7;

}







.quiz__dragItem.dragged {

  position: absolute;

  opacity: .5;

  z-index: 2000

}



.quiz__drag .placeholder {

  position: relative;

  background: #abaec0;

  list-style: none

}



.quiz__drag .placeholder:before {

  position: absolute;

  content: "";

  width: 0;

  height: 0;

  margin-top: -5px;

  left: -5px;

  top: 0;

  border: 5px solid transparent;

  border-left-color: #0463e4;

  border-right: none

}



.quiz__finishTitle {

  font-size: 40px;

  line-height: 1.2;

  font-weight: 700;

  color: #fff

}



.quiz__finishText {

  font-size: 22px;

  line-height: 1.4;

  font-weight: 500;

  color: #7f9dcb;

  margin-top: 20px

}



.quiz__1Block {

  display: block;

  max-width: 830px

}



.quiz__1Block+* {

  margin-top: 60px

}



.quiz__1Grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 25px

}



.quiz__1Input p {

  display: none;

  color: red;

  margin: 0;

  font-size: 14px;

  margin-top: 15px;

}



.quiz__1Input p.active {

  display: block;

}



.error {

  display: none;

  color: red;

  margin: 0;

  font-size: 18px;

  font-weight: 500;

}



.error.active {

  margin-top: 30px;

  display: block;

}



.quiz__1Grid2 {

  display: grid;

  grid-template-columns: 512px 1fr;

  gap: 55px

}



.quiz__1Grid2+* {

  margin-top: 25px

}



.quiz__1Date {

  display: grid;

  grid-template-columns: 100px 6fr 5fr;

  gap: 25px

}



.quiz__1Time {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 10px

}



.quiz__1CheckBlock {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;

  gap: 20px 40px

}







.custom-checkbox {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  cursor: pointer;

  margin-bottom: 0

}



.custom-checkbox input {

  position: absolute;

  z-index: -1;

  opacity: 0;

  width: 10px

}



.custom-checkbox span {

  display: block;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  font-size: 20px;

  line-height: 1.5;

  font-weight: 500;

  color: #7f9dcb;

  padding-left: 38px;

  position: relative

}



.custom-checkbox span a {

  font-size: 17px;

  line-height: 1.2;

  font-weight: 500;

  color: #1351b1;

  border-bottom: 1px solid #0c3779;

  text-decoration: none

}



.custom-checkbox span a:hover {

  border-bottom-color: transparent

}



.custom-checkbox span::before {

  content: "";

  display: block;

  width: 24px;

  height: 24px;

  background-color: #122440;

  border-radius: 3px;

  border: 1px solid #20385d;

  background-repeat: no-repeat;

  background-position: center;

  background-size: 18px;

  position: absolute;

  left: 0;

  top: 2px

}



.custom-checkbox input:checked+span::before {

  border-color: #2a4570;

  background-color: #1b355c;

  background-image: url(../img/check.png)

}



.custom-checkbox input:disabled+span {

  /* opacity: .5 */

}



.container-fluid {

  max-width: 1730px;

  margin: 0 auto;

}



.headerPanel {

  background-color: #0e203b;

  padding: 39px 0;

  margin-bottom: 110px;

}



.headerPanel__container {

  display: grid;

  grid-template-columns: 250px 1fr;

  align-items: center;

  gap: 50px

}



.header__info {

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 10px

}



.header__infoTitle {

  color: #7f9dcb;

  font-size: 18px;

  font-weight: 500;

  line-height: 1;

}



.header__infoName {

  color: #ffffff;

  font-size: 35px;

  font-weight: 600;

  line-height: 1;

}



.panel {

  margin-bottom: 100px;

}



.panel__container {

  display: grid;

  grid-template-columns: 250px 1fr;

  gap: 50px

}



.panel__sidebar {



}



.panel__menu {

  border-radius: 5px;

  background-color: #122440;

}



.panel__menu ul {

  margin: 0;

  padding: 30px 0px;

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 0px;

}



.panel__menu ul li {

  width: 100%;

  list-style: none;

  display: block;

  color: #7f9dcb;

  font-size: 17px;

  font-weight: 500;

  line-height: 1.45;

  display: flex;

  align-items: flex-start;

  gap: 15px;

  text-decoration: none;

  transition: .25s all ease-in-out;

  cursor: pointer;

  padding: 12px 30px;

}



.panel__menu ul li img {

  flex: none;

  height: 20px;

  object-fit: contain;

  margin-top: 2px;

  opacity: .7;

  transition: .25s all ease-in-out;

}



.panel__menu ul li:hover {

  color: #a5c0e9;

}



.panel__menu ul li:hover img {

  opacity: 1;

}



.panel__menu ul li.active {

  background-color: #263f67;

}



.panel__tab {

  display: none;

}



.panel__tab.active {

  display: block;

}



.panel__main {

  position: relative;

}



.panel__mainTitle {

  color: #7f9dcb;

  font-size: 24px;

  font-weight: 500;

  line-height: 1.2;

  position: absolute;

  left: 0;

  bottom: calc(100% + 30px)

}



.panel__mainContainer {

  display: grid;

  grid-template-columns: repeat(30, 1fr);

  gap: 30px;

}



.panel__item {

  border-radius: 5px;

  background-color: #122440;

  padding: 30px 40px;

  position: relative;
 

}



.panel__item.blocked:before {

  content: '';

  background-color: rgba(18, 36, 64, .8);

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  background-repeat: no-repeat;

  background-position: center;

  background-image: url(../img/lock.png);

  z-index: 3;

}



.panel__itemTitle {

  color: #7f9dcb;

  font-size: 21px;

  font-weight: 600;

  line-height: 1.3;

  margin-bottom: 25px;

}



.panel__mainContainer .panel__item:nth-child(1) {

  grid-column: 1/11

}



.panel__mainContainer .panel__item:nth-child(2) {

  grid-column: 11/17

}



.panel__mainContainer .panel__item:nth-child(3) {

  grid-column: 17/23

}



.panel__mainContainer .panel__item:nth-child(4) {

  grid-column: 23/31

}



.panel__mainContainer .panel__item:nth-child(5) {

  grid-column: 1/23;

  grid-row: 2/4;

}



.panel__mainContainer .panel__item:nth-child(6) {

  grid-column: 23/31

}



.panel__mainContainer .panel__item:nth-child(7) {

  grid-column: 23/31

}



.lock {



}



.lock__list {

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 25px;

}



.lock__item {

  display: flex;

  align-items: center;

  gap: 20px

}



.lock__itemNum {

  color: #f20d30;

  font-size: 29px;

  font-weight: 700;

  line-height: 23.96px;

  text-transform: uppercase;

}



.lock__itemTitle {

  color: #ffffff;

  font-size: 18px;

  font-weight: 600;

  line-height: 23.96px;

}



.money {



}



.money__list {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 20px 40px

}



.money__item {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 1px;

  position: relative;

}



.money__item:nth-child(even):before {

  content: '';

  position: absolute;

  left: -18px;

  top: 5px;

  background-color: #0c1b32;

  width: 2px;

  height: 76px;

}



.money__itemNum {

  color: #3cc544;

  font-size: 55px;

  font-weight: 700;

  line-height: 1;

  text-transform: uppercase;

}



.money__itemTitle {

  color: #ffffff;

  font-size: 17px;

  font-weight: 600;

  line-height: 23px;

  text-align: center;

  word-break: break-word;

}



.meta {

  padding: 30px 40px 40px;

}



.meta__list {

  display: flex;

  flex-direction: column;

  gap: 20px

}



.meta__item {

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 5px

}



/* .meta__item:nth-child(2) .meta__itemProgressbar>span>span {

  background-color: #ffbc2e;

}



.meta__item:nth-child(3) .meta__itemProgressbar>span>span {

  background-color: #f20d30;

}



.meta__item:nth-child(4) .meta__itemProgressbar>span>span {

  background-color: #f20d30;

} */



.meta__itemTitle {

  color: #ffffff;

  font-size: 17px;

  font-weight: 600;

  line-height: 1.2

}



.meta__itemProgressbar {

  display: flex;

  justify-content: space-between;

  width: 100%;

  align-items: flex-end;

}



.meta__itemProgressbar:after {

  content: attr(data-progress)'%';

  color: #7f9dcb;

  font-size: 16px;

  font-weight: 500;

  line-height: 1;

}



.meta__itemProgressbar>span {

  width: 220px;

  height: 4px;

  border-radius: 2px;

  background-color: #223b61;

  display: block;

  position: relative;

  overflow: hidden;

  margin-bottom: 3px;

}



.meta__itemProgressbar>span>span {

  position: absolute;

  width: 0%;

  height: 100%;

  background-color: #3cc544;

  left: 0;

  top: 0;

  border-radius: 2px;

  transition: 1s all ease-in-out;

}



.func {

  padding: 38px 40px 45px 40px;

}



.func__list {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 25px

}



.func__item {

  background-color: #132643;
	border-radius: 3px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 25px 20px;

}



.func__item.border {
  background-color: #1d365c;
	border-radius: 3px;
}



.func__itemProgressbar {

  display: flex;

  flex-direction: column;

  align-items: center;

  width: 100%;

  gap: 12px;

}

.func__itemProgressbar2 {

  display: flex;

  flex-direction: column;

  align-items: center;

  width: 100%;

  gap: 12px;

}



.func__itemProgressbar:before {

  content: attr(data-progress)'%';

  color: #7f9dcb;

  font-size: 16px;

  font-weight: 500;

  line-height: 1;

}

.func__itemProgressbar2:before {

  content: attr(data-progress)'%';

  color: #7f9dcb;

  font-size: 16px;

  font-weight: 500;

  line-height: 1;

}



.func__itemProgressbar>span {

  width: 120px;

  height: 4px;

  border-radius: 2px;

  background-color: #223b61;

  display: block;

  position: relative;

  overflow: hidden;

  margin-bottom: 3px;

}

.func__itemProgressbar2>span {

  width: 120px;

  height: 4px;

  border-radius: 2px;

  background-color: #223b61;

  display: block;

  position: relative;

  overflow: hidden;

  margin-bottom: 3px;

}



.func__itemProgressbar>span>span {

  position: absolute;

  width: 0%;

  height: 100%;

  background-color: #3cc544;

  left: 0;

  top: 0;

  transition: 1s all ease-in-out;

  border-radius: 2px;

}

.func__itemProgressbar2>span>span {

  position: absolute;

  width: 0%;

  height: 100%;

  background-color: #3cc544;

  left: 0;

  top: 0;

  transition: 1s all ease-in-out;

  border-radius: 2px;

}



.func__itemTitle {

  color: #ffffff;

  font-size: 17px;

  font-weight: 600;

  line-height: 1.2;

  text-align: center;

  margin-top: 15px;

  word-break: break-word;

}



.func__item:nth-child(2) .func__itemProgressbar>span>span {

  background-color: #f20d30;

}

.func__item:nth-child(2) .func__itemProgressbar2>span>span {

  background-color: #f20d30;

}



.func__item:nth-child(4) .func__itemProgressbar>span>span {

  background-color: #ffbc2e;

}

.func__item:nth-child(4) .func__itemProgressbar2>span>span {

  background-color: #ffbc2e;

}



.func__item:nth-child(5) .func__itemProgressbar>span>span {

  background-color: #ffbc2e;

}

.func__item:nth-child(5) .func__itemProgressbar2>span>span {

  background-color: #ffbc2e;

}



.func__item:nth-child(7) .func__itemProgressbar>span>span {

  background-color: #ffbc2e;

}

.func__item:nth-child(7) .func__itemProgressbar2>span>span {

  background-color: #ffbc2e;

}



.func__item:nth-child(8) .func__itemProgressbar>span>span {

  background-color: #f20d30;

}

.func__item:nth-child(8) .func__itemProgressbar2>span>span {

  background-color: #f20d30;

}



.super {



}



.super__item {



}



.super__itemProgress {



}



.super__itemTitle {

  color: #ffffff;

  font-size: 20px;

  font-weight: 700;

  line-height: 1.2;

  margin-top: 15px;

}



.mission {



}



.mission__item {



}



.mission__itemProgress {

  margin: 0 auto;

}



.mission__itemTitle {

  color: #ffffff;

  font-size: 20px;

  font-weight: 700;

  line-height: 1.2;

  margin-top: 15px;

}



.person {

  display: flex;

  flex-direction: column;

}



.person__container {

  display: grid;

  grid-template-columns: 160px 1fr;

  /* align-items: center; */

  gap: 30px;

  height: 100%;

}





.person__content {

  



}



.person__num {

  color: #ffffff;

  font-size: 65px;

  font-weight: 600;

  line-height: 1;

  text-transform: uppercase;

}



.person__num span{

  color: #7f9dcb;

}



.person__title {

  margin-top: 14px;

  color: #ffffff;

  font-size: 28px;

  font-weight: 700;

  line-height: 1;

}



.person__text {

  color: #7f9dcb;

  font-size: 18px;

  font-weight: 500;

  line-height: 1.35;

  margin-top: 14px;

}



.panel__blockTitle .green {

  color: #3cc544;

}



.panel__blockTitle .red {

  color: #f20d30;

}



.panel__blockTitle .orange {

  color: #ffbc2e;

}



.person__title2 {

  color: #ffffff;

  font-size: 35px;

  font-weight: 1000;

  line-height: 1;
  /* width: 100%; */
  white-space: nowrap;

}



.person__text2 {

  color: #7f9dcb;

  font-size: 20px;

  font-weight: 500;

  line-height: 1.35;

  margin-top: 14px;

  max-width: 1000px;
  /* width: 100%; */
  white-space: nowrap;

}



.panel__contentTop {

  border-bottom: 1px solid #122440;

  padding-bottom: 50px;

  padding-left: 40px;

  padding-top: 55px;

}



.panel__contentBlock {

  /* margin: 50px 0; */

  border-bottom: 1px solid #122440;

  padding: 50px 40px;

}



.panel__contentGrid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 80px;

}



.panel__contentBlock:last-child {

  border-bottom: none;

}



.panel__block {



}



.panel__blockTitle {

  color: #ffffff;

  font-size: 23px;

  font-weight: 700;

  line-height: 1.2;

  margin-bottom: 20px;

}



.panel__blockOl {

  counter-reset: myCounter;

  margin: 0;

  padding: 0;

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 10px

}



.panel__blockOl li {

  list-style: none;

  color: #7f9dcb;

  font-size: 19px;

  font-weight: 400;

  line-height: 1.4;

  padding-left: 40px;

  position: relative;

}



.panel__blockOl li:before {

  counter-increment: myCounter;

  content: counter(myCounter, decimal-leading-zero)'.';

  color: #34517c;

  font-size: 17px;

  font-weight: 400;

  line-height: 1.2;

  position: absolute;

  left: 0;

  top: 3px;

}



.panel__blockUl {

  margin: 0;

  padding: 0;

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 10px

}



.panel__blockUl li {

  list-style: none;

  color: #7f9dcb;

  font-size: 19px;

  font-weight: 400;

  line-height: 1.6;

  padding-left: 24px;

  position: relative;

}



.panel__blockUl li:before {

  content: '';

  width: 10px;

  height: 4px;

  border-radius: 2px;

  background-color: #223b61;

  position: absolute;

  left: 0;

  top: 13px;

}



.panel__blockUl.minus li:before {

  content: '';

  width: 10px;

  height: 4px;

  border-radius: 2px;

  background-color: #c71131;

  position: absolute;

  left: 0;

  top: 13px;

}



.panel__blockUl.plus li:before {

  content: '';

  width: 13px;

  height: 3px;

  border-radius: 2px;

  background-color: #3cc544;

  position: absolute;

  left: 0;

  top: 13px;

}



.panel__blockUl.plus li:after {

  content: '';

  width: 3px;

  height: 13px;

  border-radius: 2px;

  background-color: #3cc544;

  position: absolute;

  left: 5px;

  top: 8px;

}



.panel__contentHeader {

  display: flex;

  align-items: flex-start;

  gap: 25px;

  margin-bottom: 45px;

}



.panel__contentHeaderNum {

  color: #f20d30;

  font-size: 90px;

  font-weight: 700;

  line-height: 1;

  text-transform: uppercase;

  min-width: 166px;

}



.panel__contentHeaderNum.green {

  color: #3cc544;

}



.panel__contentHeaderBlock {

  display: flex;

  flex-direction: column;

  gap: 20px

}



.panel__contentHeaderTitle {

  color: #ffffff;

  font-size: 35px;

  font-weight: 700;

  line-height: 1.2;

  margin-top: 5px;

}



.panel__contentHeaderText {

  max-width: 420px;

  color: #7f9dcb;

  font-size: 20px;

  font-weight: 500;

  line-height: 1.5;

}



.panel__grid {

  display: grid;

  grid-template-columns: 1fr 1fr 1fr;

  gap: 30px;

}



.panel__gridItem {

  width: 100%;

  border-radius: 5px;

  background-color: #0d1d35;

  padding: 38px 43px;

  display: flex;

  flex-direction: column;

  align-items: flex-start;

}



.panel__gridItem.accent {

  border: 2px solid #284166;

  background-color: #122440;

}



.panel__gridItem .meta__itemProgressbar{

  width: auto;

  gap: 15px

}



.panel__gridItemTitle {

  color: #ffffff;

  font-size: 25px;

  font-weight: 700;

  line-height: 1.3;

  margin-bottom: 20px;

}



.panel__gridItemText {

  color: #7f9dcb;

  font-size: 18px;

  font-weight: 400;

  line-height: 28px;

  margin-top: 25px;

}





@media (max-width:1460px) {

  .header .container {

    max-width: 1030px

  }

}



@media (max-width:1100px) {

  .container, .header .container {

    max-width: 960px

  }

}



@media (max-width:991px) {

  .container, .header .container {

    max-width: 720px

  }



  .title {

    font-size: 40px

  }



  .pretitle {

    font-size: 28px

  }



  .quiz__1Grid2 {

    grid-template-columns: 1fr;

    gap: 25px

  }



  .quiz__1Time {

    max-width: 300px

  }



  .quiz__itemInfoTitle {

    font-size: 32px

  }



  .quiz__itemInfoText {

    font-size: 20px

  }



  .quiz__itemStep {

    font-size: 38px

  }



  .quiz__dragItemTitle {

    font-size: 18px

  }



  .quiz__drag {

    max-width: 100%

  }

}



@media (max-width:767px) {

  .container, .header .container {

    max-width: 540px

  }



  .title {

    font-size: 32px

  }



  .pretitle {

    font-size: 23px;

    margin-bottom: 25px

  }



  .quiz__1Block+* {

    margin-top: 40px

  }



  .quiz__itemTop {

    margin-bottom: 40px

  }



  .quiz__itemBottom {

    margin-top: 60px

  }



  .quiz__itemInfoTitle {

    font-size: 28px

  }



  .quiz__itemInfoText {

    font-size: 18px

  }



  .quiz__itemStep {

    font-size: 32px

  }



  .quiz__colorBlock {

    width: 52px;

    height: 49px

  }



  .quiz__color {

    gap: 18px

  }



  .quiz__colorRating span {

    width: 22px;

    height: 22px

  }

}



@media (max-width:575px) {

  .container, .header .container {

    max-width: 100%;

    padding-left: 20px;

    padding-right: 20px

  }



  .header {

    padding-top: 20px;

    margin-bottom: 50px

  }



  .header__logo {

    max-width: 97px

  }



  .title {

    font-size: 30px;

    text-align: center

  }



  .pretitle {

    font-size: 21px;

    margin-bottom: 25px

  }



  .quiz__itemTop {

    margin-bottom: 27px

  }



  .quiz__1Grid {

    grid-template-columns: 1fr;

    gap: 20px

  }



  .quiz__itemContent input {

    height: 55px;

    font-size: 17px;

    padding: 0 20px

  }



  .quiz__itemContent select {

    height: 55px;

    font-size: 17px;

    padding: 0 20px;

    background-size: 12px;

    background-position: calc(100% - 10px) center

  }



  .quiz__1Block+* {

    margin-top: 40px

  }



  .quiz__1Grid2 {

    grid-template-columns: 1fr;

    grid-gap: 20px

  }



  .quiz__1Time {

    gap: 8px;

    max-width: 210px

  }



  .quiz__1Date {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    gap: 20px;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap

  }



  .quiz__1Date select:nth-child(1) {

    width: calc(30% - 10px)

  }



  .quiz__1Date select:nth-child(2) {

    width: calc(70% - 10px)

  }



  .quiz__1Date select:nth-child(3) {

    width: 40%

  }



  .custom-checkbox span {

    padding-left: 26px

  }



  .custom-checkbox span::before {

    width: 18px;

    height: 18px;

    background-size: 14px;

    top: 3px

  }



  .polit span {

    font-size: 15px

  }



  .polit span a {

    font-size: 15px

  }



  .btn {

    font-size: 18px;

    padding: 18px 36px

  }



  .quiz__itemBottom {

    margin-top: 30px;

    gap: 15px

  }



  .quiz__itemBottom .btn {

    -webkit-box-flex: 1;

    -ms-flex: 1;

    flex: 1

  }



  .quiz__itemStep {

    font-size: 28px

  }



  .quiz__itemInfoTitle {

    font-size: 30px

  }



  .quiz__itemInfoText {

    font-size: 17px

  }



  .quiz__itemInfo {

    margin-bottom: 30px

  }



  .quiz__colorBlock {

    width: 52px;

    height: 49px

  }



  .quiz__color {

    gap: 18px

  }



  .quiz__colorRating span {

    width: 22px;

    height: 22px

  }



  .quiz__dragItemTitle {

    font-size: 17px

  }



  .quiz__dragItem {
    padding: 15px 12px 15px 15px;
    gap: 5px

  }



  .quiz__drag {

    gap: 15px

  }



  .quiz__dragItemTop {


    height: 19px

  }



  .quiz__dragItemBottom {

    width: 17px;

    height: 19px

  }



  .quiz__dragItemList {

    gap: 10px;

  }



  .quiz__finishTitle {

    font-size: 30px;

    text-align: center

  }



  .quiz__finishText {

    font-size: 17px;

    text-align: center

  }



  .quiz__itemBottom.last {

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center

  }



  .quiz__itemBottom.last .btn {

    -webkit-box-flex: 0;

    -ms-flex: none;

    flex: none

  }

}



.person__progress {

    width: 160px;

    height: 160px;

    border-radius: 50%;

    background: #3cc544;

    position: relative;

    overflow: hidden;

}

.person__progress::before {

    content: '';

    display: block;

    position: absolute;

    top:20px;

    left:20px;

    right:20px;

    bottom:20px;

    border-radius: 50%;

    background: #122440;

    z-index: 3;

    opacity: 1;

}

.person__progress .piece {

    width: 100%;

    height: 100%;

    left: 0;

    right: 0;

    overflow: hidden;

    position: absolute;

}

.person__progress .piece::before {

    content: '';

    display: block;

    position: absolute;

    width: 50%;

    height: 100%;

}

.person__progress .piece.left {

    transform: rotate(0deg);

    z-index: 2;

    border-radius: 50%; /* only FireFox < 75.0v (fix bug)*/

}

.person__progress.over_50 .piece.left {

    transform: rotate(180deg);

}

.person__progress .piece.right {

    transform: rotate(180deg);

    z-index: 1;

    border-radius: 50%; /* only FireFox < 75.0v (fix bug)*/

}

.person__progress.over_50 .piece.right {

    transform: rotate(360deg);

}

.person__progress .left::before {

    background: #223b61;

}

.person__progress.over_50 .left::before {

    background: #3cc544;

}

.person__progress .right::before {

    background: #223b61;

}

.person__progress:before {

  content: attr(data-percent)'%';

  position: absolute;

  z-index: 3;

  text-align: center;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  font-size: 35px;

  font-weight: 600;

  line-height: 1;

  text-align: center;

}



.mission__itemProgress {

    width: 120px;

    height: 120px;

    border-radius: 50%;

    background: #3cc544;

    position: relative;

    overflow: hidden;

}

.mission__itemProgress::before {

    content: '';

    display: block;

    position: absolute;

    top: 12px;

    left: 12px;

    right: 12px;

    bottom: 12px;

    border-radius: 50%;

    background: #122440;

    z-index: 3;

    opacity: 1;

}

.mission__itemProgress .piece {

    width: 100%;

    height: 100%;

    left: 0;

    right: 0;

    overflow: hidden;

    position: absolute;

}

.mission__itemProgress .piece::before {

    content: '';

    display: block;

    position: absolute;

    width: 50%;

    height: 100%;

}

.mission__itemProgress .piece.left {

    transform: rotate(0deg);

    z-index: 2;

    border-radius: 50%; /* only FireFox < 75.0v (fix bug)*/

}

.mission__itemProgress.over_50 .piece.left {

    transform: rotate(180deg);

}

.mission__itemProgress .piece.right {

    transform: rotate(180deg);

    z-index: 1;

    border-radius: 50%; /* only FireFox < 75.0v (fix bug)*/

}

.mission__itemProgress.over_50 .piece.right {

    transform: rotate(360deg);

}

.mission__itemProgress .left::before {

    background: #223b61;

}

.mission__itemProgress.over_50 .left::before {

    background: #3cc544;

}

.mission__itemProgress .right::before {

    background: #223b61;

}

.mission__itemProgress:before {

  content: attr(data-percent)'%';

  position: absolute;

  z-index: 3;

  text-align: center;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  font-size: 26px;

  font-weight: 600;

  line-height: 1;

  text-align: center;

}



.circular-progress{

    position: relative;

    height: 160px;

    width: 160px;

    border-radius: 50%;

    background: conic-gradient(#3cc544 3.6deg, #223b61 0deg);

    display: flex;

    align-items: center;

    justify-content: center;

}

.circular-progress::before{

    content: "";

    position: absolute;

    height: 130px;

    width: 130px;

    border-radius: 50%;

    background-color: #122440;

}

.progress-value{

    position: relative;

    color: #ffffff;

    font-size: 35px;

    font-weight: 600;

    line-height: 1;

    text-align: center;

}



.circular-progress.min {

    position: relative;

    height: 120px;

    width: 120px;

    border-radius: 50%;

    background: conic-gradient(#3cc544 3.6deg, #223b61 0deg);

    display: flex;

    align-items: center;

    justify-content: center;

}



.circular-progress.center {

    margin: 0 auto;

}

.circular-progress.min::before{

    content: "";

    position: absolute;

    height: 96px;

    width: 96px;

    border-radius: 50%;

    background-color: #122440;

}



.circular-progress.min .progress-value{

    font-size: 26px;

}


.rate {
  float: left;
  height: 46px;
  padding: 0 10px;
  display: flex; /* Используем flexbox для расположения звезд */
  align-items: center; /* Выравниваем по центру по вертикали */
  flex-direction: row-reverse; /* Размещаем звезды в обратном порядке (исправляем неправильное отображение) */
}
.rate:not(:checked) > input {
  position:absolute;
  top:-9999px;
}
.rate:not(:checked) > label {
  float:right;
  width:1em;
  overflow:hidden;
  white-space:nowrap;
  cursor:pointer;
  font-size:30px;
  color:rgba(72, 108, 162, 1);
}
.rate:not(:checked) > label:before {
  content: '★ ';
}
.rate > input:checked ~ label {
  color: #FFFFFF;    
}
.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
  color: #FFFFFF;  
}
.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
  color: #FFFFFF;
}

.rate input {
  position: absolute;
  top: -9999px; /* Скрываем элементы input от визуализации */
}
@media only screen and (max-width:450px){
  .rate{
      height: 18px;
  }
  .rate:not(:checked) > label {

      font-size:18px;
  }
}


.resource {
  float: left;
  height: 46px;
  padding: 0 10px;
}
.resource:not(:checked) > input {
  position:absolute;
  top:-9999px;
}
.resource:not(:checked) > label {
  float:right;
  width:1em;
  overflow:hidden;
  white-space:nowrap;
  cursor:pointer;
  font-size:30px;
  color:rgba(72, 108, 162, 1);
}
.resource:not(:checked) > label:before {
  content: '★ ';
}
.resource > input:checked ~ label {
  color: #FFFFFF;    
}
.resource:not(:checked) > label:hover,
.resource:not(:checked) > label:hover ~ label {
  color: #FFFFFF;  
}
.resource > input:checked + label:hover,
.resource > input:checked + label:hover ~ label,
.resource > input:checked ~ label:hover,
.resource > input:checked ~ label:hover ~ label,
.resource > label:hover ~ input:checked ~ label {
  color: #FFFFFF;
}

@media only screen and (max-width:450px){
  .resource{
      height: 18px;
  }
  .resource:not(:checked) > label {

      font-size:18px;
  }
}


.pretitle_info_text {
  font-size: 22px;
  line-height: 1.45;
  font-weight: 500;
  color: #7f9dcb;
  padding-bottom: 20px;
}

/* cookie-notice */
#cookie-notice {
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
    max-width: 870px;
    margin: auto;
    background-color: #0c1b32;
    color: #7f9dcb;
    border: 2px solid #20385d;
    padding: 16px 40px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    z-index: 99999;
    opacity: 0;
    transform: translateY(100%);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
#cookie-notice.show {
    opacity: 1;
    transform: translateY(0);
}
#cookie-notice a {
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid #7f9dcb;
    transition: .25s all ease-in-out;
}
#cookie-notice a:hover {
    color: inherit;
    border-bottom-color: transparent;
}
#cookie-notice button {
    height: 50px;
    font-size: 16px;
    padding: 0 40px;
    font-weight: bold;
    color: #f0f5f8;
    background-color: #0d3f8c;
    border-radius: 8px;
    font-weight: 700;
    margin-left: 20px;
    flex-shrink: 0;
    border: none;
    cursor: pointer;

    margin-left: 20px;
    flex-shrink: 0;
    transition: .25s all ease-in-out;
}
#cookie-notice button:hover {
    text-decoration: none;
    color: #f0f5f8;
    background-color: #1049a1;
}
@media (max-width: 575px) {
    #cookie-notice {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px;
    }
    #cookie-notice button {
        margin: 15px 0 0 0;
        width: 100%;
        height: 38px;
        font-size: 14px;
    }
}
/* cookie-notice */