/* Minification failed. Returning unminified contents.
(2,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(4,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(5,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(8,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(9,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(10,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(11,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(13,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(48,35): run-time error CSS1039: Token not allowed after unary operator: '-blue-color'
(54,16): run-time error CSS1039: Token not allowed after unary operator: '-white-color'
(58,13): run-time error CSS1039: Token not allowed after unary operator: '-main-text-color-gray'
(62,21): run-time error CSS1039: Token not allowed after unary operator: '-pink-gradient'
(65,24): run-time error CSS1039: Token not allowed after unary operator: '-pink-gradient-hover'
(68,24): run-time error CSS1039: Token not allowed after unary operator: '-pink-gradient-active'
(72,18): run-time error CSS1039: Token not allowed after unary operator: '-green-color'
(76,21): run-time error CSS1039: Token not allowed after unary operator: '-green-color-hover'
(80,13): run-time error CSS1039: Token not allowed after unary operator: '-blue-color'
(84,16): run-time error CSS1039: Token not allowed after unary operator: '-red-color'
(119,34): run-time error CSS1039: Token not allowed after unary operator: '-gray-color'
(166,19): run-time error CSS1039: Token not allowed after unary operator: '-main-text-color'
(223,21): run-time error CSS1039: Token not allowed after unary operator: '-green-gradient'
(246,21): run-time error CSS1039: Token not allowed after unary operator: '-white-color'
 */
:root {
   --white-color: #FFFFFF;
   --pink-gradient: linear-gradient(270deg, #EB2F83 0%, #CF066B 100%), #E92C83;
   --pink-gradient-hover: linear-gradient(270deg, #EB1876 0%, #CF0067 100%), #E92C83;
   --pink-gradient-active: linear-gradient(270deg, #EB5397 0%, #CF257A 100%);
   --green-color: #0CA00F;
   --green-color-hover: #31BA1B;
   --green-gradient: radial-gradient(68.78% 152.17% at 68.78% 50%, rgba(95, 209, 51, 0.65) 0%, rgba(49, 186, 27, 0.65) 100%);
   --blue-color: #3666E1;
   --red-color: #E04C4C;
   --gray-color: rgba(145, 168, 179, 0.5);
   --main-text-color: rgba(0, 0, 0, 0.82);
   --main-text-color-gray: rgba(0, 0, 0, 0.64);
}

/*Text style*/
.bold {
   font-weight: bold;
}

.fs16 {
   font-size: 1.34rem;
}

.fs20 {
   font-size: 1.6rem;
}

.fs22 {
font-size: 1.8rem;
}

.fs32 {
   font-size: 2.6rem;
}

.text-center {
text-align: center;
}

.lowercase {
   text-transform: lowercase;
   letter-spacing: 0.03em;
   font-variant: small-caps;
}

.dotted {
   border-bottom: 1px dashed var(--blue-color);
   padding-bottom: 2px;
}

/*Colors*/
.white {
   color: var(--white-color);
}

.gray-text {
color: var(--main-text-color-gray);
}

.pink-gradient {
   background: var(--pink-gradient);
}
   .pink-gradient:hover {
      background: var(--pink-gradient-hover);
   }
   .pink-gradient:active {
      background: var(--pink-gradient-active);
   }

.green {
background: var(--green-color);
}

.green:hover {
   background: var(--green-color-hover);
}

.blue-text {
color: var(--blue-color);
}

.red-text {
   color: var(--red-color);
}

/*Button*/
.main-button {
   width: 100%;
   max-width: 312px;
   box-sizing: border-box;
   border-radius: 3px;
   text-align: center;
   display: flex;
   cursor: pointer;
   padding: 0.8rem 1rem 1rem;
   align-items: center;
   justify-content: center;
}

   .main-button:hover {
      text-decoration: none;
   }

   .main-button.big {
      padding: 1.6rem 1.5rem 2rem;
   }

/*Elements*/
.corner:after {
   content: '\F105';
   margin-left: 0.5em;
   font-family: FontAwesome;
   font-size: 0.9em;
}

.border-bottom {
   padding-bottom: 1rem;
   border-bottom: 1px solid var(--gray-color);
}

.link, .link:hover {
   text-decoration: none;
   cursor: pointer;
   display: flex;
}

.with-arrow img{
   margin-left: 0.3rem;
}

.card-item-icons {
   width: 60px;
   height: 60px;
   position: absolute;
   top: -8%;
   right: 2%;
}

.cash-icon:before {
   content: url('/Images/page/payment/cash/cash.png');
}

.bank-perevod-icon:before {
   content: url('/Images/page/payment/bank_perevod/bakkperevod.png');
}
/*Main*/
.item-center {
   margin: 0 auto;
}
.main-container {
   width: 100%;
   max-width: 1065px;
   margin: 0 auto;
   font-family: system-ui;
   padding: 4rem 0 11rem;
}

   .main-container > .section ~ .section:not(.template-with-calc) {
      margin-top: 5.6rem;
   }

   .main-container h1 {
      font-size: 3rem;
      line-height: 110%;
      color: var(--main-text-color);
      padding: 0;
      margin-bottom: 2.6rem;
   }

.tpl-card-conteiner {
   display: grid;
   grid-template-columns: repeat(auto-fill,minmax(272px,1fr));
   grid-gap: 2rem;
   margin-top: 2.6rem;
}

.card-item {
   display: grid;
   box-shadow: 0px 2px 10px rgba(33, 84, 109, 0.15), 0px 2px 3px rgba(33, 84, 109, 0.15);
   border-radius: 3px;
   padding: 1.5rem;
   grid-template-rows: auto;
   grid-gap: 1rem;
   position: relative;
}

   .card-item a.main-button {
      max-height: 40px;
      align-self: flex-end;
   }

.tpl-list-container {
   display: grid;
   grid-template-columns: 1fr 1fr;
   grid-gap: 2rem 8rem;
   padding: 3rem 3rem 0 0;
}

.list-item-why {
   display: grid;
   grid-template-columns: 144px 1fr;
   grid-gap: 1.5rem;
}

   .list-item-why p ~ p {
      margin-top: 0.6rem;
   }

   .list-item-why picture {
      display: flex;
      align-items: baseline;
      justify-content: center;
   }

.template-with-calc {
   display: grid;
   grid-template-areas: "calc descr";
   grid-template-columns: 300px 1fr;
   grid-template-rows: 308px;
   grid-gap: 0 3.33rem;
   padding: 0 6.66rem;
   background: var(--green-gradient);
   margin: 9.33rem 0 0 0;
}

   .template-with-calc .calc-column {
      grid-area: calc;
      position: relative;
      top: -56px;
   }

   .template-with-calc .description-calc {
      grid-area: descr;
      justify-content: center;
      display: flex;
      flex-direction: column;
   }

.description-calc h2 {
   margin-bottom: 1rem;
}

.template-with-calc .class_div___element-SidebarCalculator {
   box-shadow: 0px 2px 14px rgba(33, 84, 109, 0.15), 0px 2px 3px rgba(33, 84, 109, 0.15);
   background: var(--white-color);
   border: none;
   box-sizing: border-box;
   border-radius: 3px;
   width: 100%;
   margin: 0;
}

   .template-with-calc .class_div___element-SidebarCalculator form {
      padding: 1.33rem;
   }

.card-payment-icons-container > i ~ i {
margin-left: 1rem;
}

.visa-icon:before {
   content: url('/Images/page/payment/visa/visa.png');
}

.mir-icon:before {
   content: url('/Images/page/payment/mir/mir.png');
}

.mastercard-icon:before {
   content: url('/Images/page/payment/mastercard/mastercard.png');
}

@media screen and (max-width:1064px) {
   .section:not(.template-with-calc) {
      padding: 0 2rem;
   }
   .tpl-card-conteiner {
      grid-gap:2.66rem;
   }
   .tpl-list-container {
      grid-template-columns: repeat(auto-fill,minmax(272px,1fr));
      padding: 3rem 0;
      grid-gap: 2.66rem;
   }
   .list-item-why {
      grid-template-columns: 1fr;
      text-align: center;
   }

   .template-with-calc {
      grid-template-areas: "descr" "calc";
      grid-template-rows: auto 256px;
      padding: 0 2rem;
      margin: 22rem 0 0 0;
      grid-template-columns: 1fr;
      background: none;
   }
      .template-with-calc .calc-column {
         position: relative;
         top: -220px;
      }
      .template-with-calc .description-calc {
         top: -250px;
         position: relative;
      }
   .fs32 {
      font-size: 1.66rem;
   }

   .description-calc p {
      font-size: 1.34rem;
   }
}






