 :root {
 
    font-size: 17px;
    --body-width: 1400px;
    --border-radius: 20px;
    --swiper-navigation-color: #808080;
    --swiper-navigation-sides-offset: 10px;
    --swiper-navigation-size: 44px;
    --detail-icon-color: var(--ion-color-primary, #808080);
    --border-width:1px!important;
    --ion-section-light:#FFFFFF;
    --ion-color-star: rgb(255, 180, 0) !important;
  
    --ion-toolbar-background:#ffffff;
    --ion-header-background:#ffffff;
    --ion-footer-background:#eceeed;
    --ion-card-background: #ffffff;
    --ion-line-color:  rgba(0,0,0,0.1);
    --ion-line-color-hover:  rgba(100,100,100,0.2);
    --ion-color: #333333;
    --ion-color-step-600: #333333;
    --ion-text-color-step-400: #333333;
  
    /*--ion-font-family: 'Open Sans'!important;*/
    --ion-font-family: 'Gucina', sans-serif;
    
    --color: #333333!important;
    --ion-text-color: rgba(0,0,0,0.8)!important;
    --ion-card-color: rgba(0,0,0,0.8)!important;
    --ion-item-color: rgba(0,0,0,0.8)!important;
    
  
    --ion-item-background: transparent;
    
    --ion-page-background-color: #040a0a;
    --background:  #F2EDE6!important;
    --background-color:  #F2EDE6!important;
    --ion-background-color: #F2EDE6;
  
  
}


.info-list ion-card-content,
.info-list ion-button{
  font-size: 0.8rem!important;
}

iframe{
  border-radius: var(--border-radius);
    border: 1px solid #e1e1e1;
}
ion-modal,
.modal-wrapper {
  --border-radius: 20px;
  border-radius: 20px!important;
}
.large-margin div.boxed {
  padding:70px 90px;
}
section {
  scroll-margin-top: 150px;
}
section.boxed {
  padding: 0 50px;
  }

  .page-width{
    max-width:  var(--body-width);
    margin-left:auto;
    margin-right:auto;
    position: relative;
  }
  
  .page-width.inset{
    max-width:  calc(var(--body-width) - 10%);
  }
  
  .page-width.boxed{
    max-width:  calc(6% + var(--body-width));
  }
  .page-width.boxed.inset{
    margin-right: 200px;
  }
  .sticky {
    position: sticky!important;
    top:0px;
  }
  ion-header.scrolling .page-width.top-menu{
    /*max-width: 100%;
    padding-left:10%;
    margin-right: 0;*/
  }
  ion-toolbar.top-bar {
  position: absolute
}

  .page-width.top-menu{
    padding: 2em 20px 0 20px;
    
  }
  ion-app.desktop .procent-130 {
    width:130%;
  }
 


/*** PAGE-LAYOUT***/
.page-item {
  padding: 25px 20px;
  max-width: calc(var(--body-width) - 33%);
  margin: 0 auto;
  
  border-radius: var(--border-radius);
  
  border-left: 1px solid #e1e1e1;
  box-shadow: none;
   
}
.page-item:hover,
.shadow-page {
 /*box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;*/
 box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}
.page-item .data-table{
  margin-left: 35px !important;
  padding-left: 24px;
  
}




section[color=light],
ion-header[color=light] {
  background-color: var(--ion-section-light);
}
section[color=primary],
ion-header[color=primary]
{
  background-color: var(--ion-color-primary);
}
section[color=secondary],
section div[color=secondary],
ion-header[color=secondary]{
  background-color: var(--ion-color-secondary);
}
section[color=tertiary],
ion-header[color=tertiary]
{
  background-color: var(--ion-color-tertiary);

}
section[color=dark],
ion-header[color=dark]{
background-color: var(--ion-color-dark);

}
.swiper.scrollbar .swiper-wrapper {
  margin-bottom: 40px;
}
.swiper-slide {
  background-color: var(--background-color);
}
.swiper {
  --swiper-scrollbar-drag-bg-color: rgba(0,0,0,0.8)!important;
  --swiper-scrollbar-size: 2px!important;
}

.swiper-scrollbar-drag{
  height: 4px!important;
  margin-top: -1px;
  
}
section[color=primary] h2,
ion-card[color=primary] h2,
ion-card[color=primary] ion-text,
ion-card[color=primary] ion-card-content
{
color: var(--ion-color-primary-contrast) !important;
}

section[color=secondary]>h2,
ion-card[color=secondary] h2,
ion-card[color=secondary] ion-text
{
color: var(--ion-color-secondary-contrast) !important;
}

section[color=tertiary]>h2,
ion-card[color=tertiary] h2,
ion-card[color=tertiary] ion-text
{
color: var(--ion-color-tertiary-contrast) !important;
}
section[color=dark] h2,
section[color=dark] h3,
section[color=dark] ion-card-content,
section[color=dark] ion-text
{
color: var(--ion-color-dark-contrast) !important;
}
section[color=light]>h2
{
color: var(--ion-color-primary) !important;
}
div.boxed {
  
  background-color: var(--ion-color-light);
  border-radius: calc(var(--border-radius) * 2);
}
ion-grid:not(.grid), 
ion-grid:not(.grid) ion-row, 
ion-grid:not(.grid) ion-col{
  padding:0;
}
ion-list.masonry,
ion-grid.masonry ion-row {
  display: block;
  column-count: 3;
}
ion-list.masonry.col2{
  column-count: 2;
}
ion-col.v-align-center {
  align-content: center;
}
.do-wrap{
  white-space:normal!important;
}
/*** ELEMENTS ***/
ion-chip{
  border-radius: 6pt;
  white-space: nowrap;
  padding-inline: 6px;
  display: inline-flex;
  overflow: hidden;
    position: relative;
    align-items: center;
    height: 24px;
    box-sizing: border-box;
    margin: 0 2px 0 0!important;
    
}
ion-note ion-chip {
  min-height: 22px;
    /* align-self: revert; */
    margin-top: -5px !important;
}
ion-chip[size=small]{
zoom: 0.8;
}
ion-card:not(.no-border) {
  border: 1px solid var(--ion-line-color);
}
ion-card {
      break-inside: avoid;
      cursor:pointer;
      padding-bottom:0px;
      margin:0px;
      height: fit-content;
      overflow: unset;
      box-shadow:none;

}

ion-accordion {
  background-color: transparent;
}
ion-accordion ion-item ion-icon,
ion-accordion ion-item ion-avatar
 {
  -webkit-margin-end: 10px;
  margin-inline-end: 15px;
  
}
ion-item div.percircle {
  margin: 0px 0px 0 0;
}
ion-accordion div.percircle {
  margin: 0px 15px 0 0;
}

.main-menu ion-accordion ion-item{
  height: 35px;
}
ion-item.large ion-avatar{
  width: 77px;
  height: 77px;
}
.content {
  margin-bottom:1em;
}
.border-less{
  border:0!important;
}
.pricing-card{
  /*backgroundss: linear-gradient(180deg, rgba(255,255,255,1) 10%, rgba(236,238,237,1) 100%);*/
  border-radius: var(--border-radius);
  height: 350px!important;
  padding: 40px 30px;
  position:relative;
    display:block;
  
}
.pricing-card.chevron{
  margin-right:20px;
}
.step-chip ion-chip{
  position:absolute;
  right:30px;
  top: 30px;
  z-index:100;
  border-radius: var(--border-radius); 
  padding: 15px;
  --background: var(--ion-color-dark);;
    --color: var(--ion-color-dark-contrast);;
}
ion-col.chevron:after {
  position:absolute;
  margin-top:-42%;
  margin-left:93%;
  content: ' ';
  display: inline-block;
  border-bottom: 3px solid var(--ion-color-primary);;
  border-right: 3px solid var(--ion-color-primary);;
  height: 15px;
  width: 15px;
  transform: rotate(-45deg);
}


ion-button,
ion-title,
ion-content,
.card-content-md,
.card-content-ios  {
  font-size: 1rem!important;
  line-height: 1.4em;
  letter-spacing: unset;
}
ion-title{
  letter-spacing: 1.1px;
}
h1,

h2.large {
  margin:0;
  margin-bottom: 0em;
  line-height: 1.5em;
  font-family: GucinaSemBd;
  
  font-size: 2.6rem!important;
}
h2.large {
  font-size: 3.7rem!important;
}
h2
 {
  font-family: GucinaSemBd;
  font-size: 2.1rem !important;
  
  margin-bottom: 0.5em;
  }
  .card-title{
    font-size: 1.8rem !important;
    line-height: 1.1em;
    margin-bottom: 0.5em;
  }
  .card-subtitle{
    font-size: 1.4rem !important;
    line-height: 1.4em;
    margin-bottom: 0.6em;
  }
  
  h3 {
    font-family: GucinaSemBd;
    font-size: 1.6rem !important;
    line-height: 1.4em;
    }
      h3.large {
    font-family: GucinaSemBd;
    font-size: 2.6rem !important;
    line-height: 1.4em;
    }
    h4 {
      font-family: GucinaSemBd;
    font-size: 1.2rem !important;
    line-height: 1.4em;
    }
    .stat-parts h2 {
      margin-bottom: 0.1em;
    }
    .stat-parts .star{
      zoom: 1.3!important;
      margin-right:0.2em;
    }
    blockquote  {
      font-weight:bold;
      display: block;
      font-size:1em;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 24px;
      margin-inline-end: 0px;
      unicode-bidi: isolate;
    }
    blockquote:before {  
      content: '"';  
      font-size: 24pt;  
      text-align: center;  
      line-height: 42px;  
     
      float: left;  
      position: relative;  
     margin-left:-30px;
     margin-top:-10px;
     margin-right: 0.1em;
        /** define it as a block element **/  
      display: block;  
      height: 25px;  
      width: 25px;  
  }  
  blockquote:after {  
      content: '"';  
      font-size: 24pt;  
      text-align: center;  
      line-height: 42px;  
      float: right;  
      position: relative;  
      margin-top:-10px;   
      margin-right:-10px;
      /** define it as a block element **/  
      display: block;  
      height: 25px;  
      width: 25px;  
  }  

  .blockquote {
    color: var(--ion-color-primary);
    font-size: 2em;
    width: 90%;
    margin: 0 auto;
  }
  .blockquote h1 {
    font-size: 4rem;
  }
  .blockquote p {
    font-style: italic;
    margin-bottom: 0;
    opacity: 0.8;
    font-size: 1em;
  }
  
  .blockquote p::before,
  .blockquote p::after {
    content: "“";
    font-family: Georgia;
    font-size: 6rem;
    margin: -2rem 0 0 -4rem;
    position: absolute;
    opacity: 0.5;
  }
  
  .blockquote p::after {
    content: "”";
    margin: -1rem -4rem 0 0;
  }
  
  .blockquote cite {
    font-size: 1.5rem;
  }

ion-card-header:not(.ion-padding),
ion-card-content:not(.ion-padding) {
  padding: 0!important;
  padding-inline-start: 0!important;
  padding-inline-end: 0!important;
}

ion-note.super {
  margin-bottom:20px;
}
ion-note.footer {
  display: block
}
ion-button
 {
  margin: 0px;
  --box-shadow: none;
  height: 53px;
  font-weight:normal!important;
   --background-hover: #9ce0be;
   
}
ion-fab-button {
  --box-shadow: none;
}
ion-button.button-round.button-solid:hover{
  --background: var(--ion-color-light);
  --color: var(--ion-color-light-contrast);
}
ion-button.button-round.button-solid:hover ion-icon{
  color: var(--ion-color-primary);
}
ion-button.button-round{
  height: 55px;
  /*--padding-start: 40px;
  --padding-end: 40px;*/
}
ion-badge {
  font-weight: normal;
}
ion-button ,
ion-button .button-native,
ion-segment-button {
  border-width:1px!important;
  --border-width:1px!important;
  text-transform: unset;
}
ion-button.button-clear {
  padding:0;
  --padding-start: 0;
}



/**** HEADER ***/
ion-header {
  top:0px;  
  transition: background 0.25s ease-in;
}
html.scrolled
ion-header.sticky{
  background: var(--ion-header-background);
  z-index:1000;
  padding-bottom:15px;
  
}
.show-scroll {
  display: none;
}
html.scrolled .show-scroll {
  display: block;
}
ion-app.desktop ion-header.scrolling{
  background: var(--ion-header-background);
  z-index:1000;
  
  border-bottom-left-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
  padding-bottom:15px;
  
}


ion-searchbar {
  padding-top: 15px;

  --background: transparent;
 
  transition-delay: 0ms !important;
  transition-duration: 0ms !important;
  cursor:pointer;
  

}

.logo-part{
  margin-right:7%;
}
.has-focus{
  transition: width 0.2s linear ;
  -webkit-transition: width 0.2s linear ;
  -moz-transition: width 0.2s linear ;
  -o-transition: width 0.2s linear ;
  
}
.center-item {
  margin-left:auto;
  margin-right:auto;
  display: block;
}
ion-img.grayscale > img,
img.grayscale,
ion-avatar.grayscale {
    -webkit-filter: grayscale(100%)!important; /* Safari 6.0 - 9.0 */
    filter: grayscale(100%)!important;
    mix-blend-mode: multiply!important;
    
}
.mirror{
  -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}
ion-searchbar.mini.has-focus {
  width: 100%;
}

@keyframes slideDown {
0% {
  transform: translateY(-100%);
}

100% {
  transform: translateY(0%);
}		
}

@-webkit-keyframes slideDown {
  0% {
    -webkit-transform: translateY(-100%);
  }
  
  100% {
    -webkit-transform: translateY(0%);
  }	
}
ion-header {
  box-shadow: none !important;
}
.top-menu{
  margin-top:5px;
  border-radius:10px;
  padding: 0 10px;
}

ion-avatar.small {
  width:48px;
  height:48px;
}
ion-avatar.large {
  width:64px;
  height:64px;
}
ion-avatar.xlarge {
  width:96px;
  height:96px;
}
.page-logo {
  width: 284px;
  
}
.footer-logo {
  width: 284px;
  
}
.card-image{
  height:75px!important;
  display:inline-block;
  float: right;
  
  border-radius: 20px;
  margin-left:auto;
  margin-right:10px;
  background-color: rgba(255,255,255,0.8)!important;
}
.card-image img {
  border-radius: 20px!important;
}
.page-banner{
  position:absolute;
  width:100%;
}
.top-menu ion-buttons{
  
  justify-content: space-evenly;
  width:50%;
  max-width: 800px;
}

ion-item ion-buttons {
  margin-top:3px;
    align-self: baseline;
}
.page-height {
  min-height: calc(100vh - 125px);
}
ion-footer{
  
  -webkit-box-shadow: none!important;
  box-shadow: none!important;
  
}
#SECTIONfooter {
  padding-bottom:100px;
}
ion-footer a {
    color: var(--ion-color-medium-contrast);
    text-decoration: none;
   
}

ion-list.data-table {
  padding: 0;
 
}
.data-table ion-item ion-label{
  margin-top: 2px; 
  margin-bottom: 2px;
}

ion-list.data-table ion-item {
  --min-height: 24px;
  font-size: 14px;
}
ion-input input {
  caret-color: var(--color)!important;
}
ion-list.data-table ion-input {
  min-height: 24px;
}
ion-list.data-table ion-input
{
min-height: 24px;
}
ion-list.data-table ion-toggle{
height:10px;
}
.data-table.border {
  border-left: 1px solid #e1e1e1;
}
/************ LIST STYLE *************/

ion-select.dense {
  --padding-top: 0px;
  --padding-bottom: 0px;
}
ion-list.dense,
ion-list.denser{
  padding: 0;
}

ion-list.dense ion-item,
ion-item.dense {
  --min-height: 28px;
   
   --padding-start: 0;
}
ion-list.dense ion-item{
  --min-height: 21px;
}
ion-list.striped ion-item:nth-child(even) {
  background-color: #f1f1f1;
}
ion-list.menu ion-item ion-icon,
ion-list.dense ion-item ion-icon,
ion-list.denser ion-item ion-icon,
ion-item.dense ion-radio{
  margin-top:0;
  margin-bottom:0;
  margin-inline-end: 12px!important;
}
ion-list.menu ion-item ion-checkbox,
ion-list.denser ion-item ion-checkbox,
ion-list.dense ion-item ion-checkbox{
  margin-inline-end: 12px;
}
ion-list.dense ion-item ion-label{
  margin:0;
}
ion-list.denser ion-item {
  --min-height: 34px!important;
  height: 34px!important;
  --padding-start: 0;
  
   --padding-start: 0;
   height: auto;
   --padding-start: 0;
   overflow: visible;
}
.info-icon {
  font-size: 4em;
  opacity:0.7;
}

.sc-ion-label-md-s>p {
  color: inherit!important;
}
ion-list.menu ion-list-header,
ion-list.dense ion-list-header,
ion-list.denser ion-list-header {
  padding-inline-start : 0;
  padding: 15px 0 0 0;
  margin: 0;
  height: 45px;
}
ion-list.dense ion-toggle {
  height:20px;
  margin-top: -8px;
 
}
ion-list.dense ion-item * {
  margin-top:0;
  margin-bottom:0;
    padding-top: 0!important;
    padding-bottom: 0!important;
}
ion-list.dense ion-item ion-note {
  margin-top:4px;
}
ion-list.dense ion-list-header{
  margin-bottom:8px;
}
.hover-button,
.secondary-button{
  max-height: 32px;
}
.hover-button:hover,
.secondary-button{
  font-weight:bold!important;
  border-bottom: 1px solid var(--ion-color-primary);

}
.footer-button:hover{
  border-bottom: 1px solid var(--ion-color-primary);

}
ion-button.ion-color-dark:hover{
  --ion-color-base: var(--ion-color-primary)!important;
  --color: black!important;
}
.dark ion-button.ion-color-dark:hover{
  --ion-color-base: var(--ion-color-light)!important;
  --color: black!important;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background:rgba(0,0,0,0.2)
}

.rounded,
.rounded img {
    border-radius: var(--border-radius)!important;

}
.rounded-xl,
.rounded-xl img {
    border-radius: var(--border-radius)!important;

}

.read-more {
  display: -webkit-box;
  -webkit-line-clamp: 2; /* Number of lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor:pointer;
  margin-bottom:0.5em;
}
.article {padding-right:20px;}
.fadein {
  animation: fadeIn 0.4s 1;
  animation-fill-mode: forwards;
}
.zoomin {
  animation: zoomIn 0.4s 1;
  animation-fill-mode: forwards;
 }
 .zoomout {
  animation: zoomOut 2;
  animation-fill-mode: forwards;
 }
@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}


@keyframes zoomIn {
  0% {
   zoom:0;
  }
  100% {
    zoom:1;
    
  }
}
@keyframes zoomOut {
  0% {
   zoom:1;
  }
  100% {
    zoom:0.5;
    
  }
}
@keyframes Morph {
  
  0% {
    opacity:0;
    transform: rotate(10deg);
    background-color: lightblue;
  }
  100% {
    border-radius: 50%;
    transform: rotate(0deg);

  }
}

 /* Larger screens */
 @media (min-width: 1280px) {
  .page-width.top-menu{
    max-width:  calc((92% - var(--body-width)) / 2 + var(--body-width));
    margin-left: calc((100% - var(--body-width)) / 2);
    margin-right:0;
  }
  .page-width.right{
    max-width:  calc((100% - var(--body-width)) / 2 + var(--body-width));
    margin-left: calc((100% - var(--body-width)) / 2);
    margin-right:0;
  }
  .page-width.full{
    max-width:  100%;
    margin-left: 0;
    margin-right:0;
  }
} 
/* Larger screens */
@media (max-width: 1680px) {
:root {
  --body-width: 1200px;
  font-size: 16px;
}
} 
@media (max-width: 1480px) {
:root {
  --body-width: 1200px;
  font-size: 15px;
}
} 
/* Larger screens */
@media (max-width: 1280px) {
:root {
  font-size: 14px;
  --body-width: 1024px;
}
} 

/* Smaller tablets and mobiles */
@media (max-width: 1024px) {
:root {
  font-size: 15px;
}
ion-button {
  display: block!important;
}

section:not(.right):not(.full) {
  padding: 0 20px;
  }
  div.boxed {
    padding:30px 20px!important;
    
  }
  .page-width.boxed.inset{
    margin-right: 0px;
  }
  ion-app.mobile .procent-130 {
    width:100%;
  }
  ion-button {
    width: 100%;
    margin-left:0px!important;
  }
  h1 {
    margin-top : 20px!important;
    line-height: 1.3em;
    font-size: 2.1rem!important;
    padding-right:30px;
  }
  .pricing-card {
    height: auto !important;
    padding: 40px 30px 10px;
    margin-left:0px;
    margin-right:0px;
}
.page-logo {
  width: 214px;
  max-width: calc(50% - 16px);
}
.footer-logo {
  width: 232px;
  max-width: 65%;
}
.step-chip {
  height:50px;
}
.step-chip ion-chip {
  height: 45px;
  font-size: 1.3em;
  font-weight: normal;
  top: 40px;
  z-index:100;
  width: 100px;
  /* text-align: center; */
  left: calc(50% - 50px);
  padding-left: 25px;
  border-radius: 25px;
}
.mobile-margin-left {
  margin-left:20px;
}
html.plt-iphone ion-button,
html.plt-iphone ion-title,
html.plt-iphone ion-content,
.card-content-ios  {
  display: contents;
}
}
.ion-color-dark ion-item {
  --ion-color-base: transparent!important;
}
ion-list {

  --ion-background-color: transparent !important;
  
  --ion-border-color: transparent !important;
  }
  
  ion-item {
    background: transparent;
  --background: transparent;
  
  
  }
  .popover-content {
    border-radius: 20px;
  }
  
  ion-avatar.numbered{
    border:0px solid;
    text-align: center;
  }

  ion-avatar.numbered h3 {
    margin: 3px;
  }
  ion-avatar.inititals{
    padding-top:3px;
  }
  ion-avatar.inititals h2 {
    font-size: 1.2em !important;
    margin-top: 6px;
  }
  ion-avatar[color=primary]{
    background-color: rgba(var(--ion-color-primary-rgb), 0.4);
    color: #ffffff;
  }
  ion-avatar[color=secondary]{
    background-color:  rgba(var(--ion-color-secondary-rgb), 0.4);
    color: #ffffff;
  }
  ion-avatar[color=tertiary]{
    background-color: rgba(var(--ion-color-tertiary-rgb), 0.4);
    color: #ffffff;
  }
  ion-select.select-justify-start *{
    width:118px!important;
  }
  .color-white{
    background-color: white;
  }

  input:-webkit-autofill,
  input:-webkit-autofill:focus {
    transition: background-color 0s 600000s, color 0s 600000s !important;
  }
