:root {
  --color-gray: #E8ECF0;
  --color-gray-50-rgba: 232,236,240,0.8;
  --color-primary: #00ac99;
  --color-primary-hover: #009688;
  --color-primary-light: #e6f7f5;
  --color-primary-normal: rgba(0, 172, 153, 0.75);
  --bs-link-color: #00ac99;
  --bs-link-hover-color: #009688;
  --block-bg-color: rgba(232, 236, 240, 0.5);
  --block-bg-color-solid: rgba(232, 236, 240, 0.85);
  --swiper-navigation-color: black;
  --bs-gutter-x: 3rem;
  --bs-bg-opacity: 1;
  --color-secondary: #402479;
}
#hero {
    background-size: cover;
    background-position: bottom;
    background-color: #4c4c4c;
}
#hero img.hero-sign {
    width: 290px;
}


@font-face {
    font-family: 'ermilovbold';
    src: url('../fonts/GruntGrotesk-Bold.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/Inter-Regular.ttf') format('truetype');
}
h1, h2, h3, h4, h5, h6, .btn-primary, .text_footer_bold, #numbers .counter, .ermilov-font {
  font-family: 'ermilovbold' !important;
}

.inter-font {
    font-family: 'Inter' !important;
}

html, body { 
  height: 100%; 
  margin: 0; 
  font-family: 'Inter';
  font-style: normal;
  color: black;
} 
section {
	overflow: hidden;
}

.bg-primary {
    background-color: var(--color-primary);
}

.bg-accent {
	background-color: var(--color-gray);
}

body::-webkit-scrollbar {
    width: 0.6em;
}
 
body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0.6em rgba(0,0,0,0.3);
}
 
body::-webkit-scrollbar-thumb {
  background-color: darkgrey;
}

.anchor {
    display: block;
    position: relative;
    top: -75px;
    visibility: hidden;
}


.btn {
    --bs-btn-bg: var(--color-primary);
    --bs-btn-border-color: var(--color-primary);
    --bs-btn-hover-border-color: var(--color-primary);
    --bs-btn-hover-bg: var(--color-primary-hover);
    --bs-btn-active-bg: var(--color-primary);
    --bs-btn-active-border-color: var(--color-primary-hover);
    --bs-btn-border-radius: 0;
    --bs-btn-border-width: 2px;
    --bs-btn-color:  white;
    transition: 0.4s;
}
a.btn {
    min-width: 215px;
}
.btn.hover-transition {
    transition: 0.4s !important;
}
.btn-outline-primary {
    --bs-btn-bg: transparent;
    --bs-btn-outline-color: transparent;
    --bs-btn-hover-bg: var(--color-primary);
    --bs-btn-hover-color:  white;
}

.btn-color-primary {
    --bs-btn-color:  var(--color-primary) ;
}

.btn-color-black {
    --bs-btn-color:  black;
}
form .btn-outline-primary {
    --bs-btn-hover-bg: var(--color-primary-hover);
}

.smooth-underline {
    text-decoration: none;
}

.card-author {
    position: relative;
    display: inline-block;
}

.bg-primary {
    background-color: var(--color-primary) !important;
}

.block-bg, .events-swiper .swiper-slide {
    background-color: var(--block-bg-color);
}
.bg-black {
    background: black;
}
.swiper-button-next, .swiper-button-prev {
    transform: translateY(-50%);
}

.events-swiper .swiper-slide {
    width:  360px;
    height: 580px;
}

.card-body {
    margin: 0 2em;
    position: relative;
}
.card-author, .text-primary {
    color: var(--color-primary) !important;
}
.card-title-media {
    height: 130px;
    display: table-cell;
    vertical-align: middle;
    font-size: 21px;
}
.card-title { 
    height: 180px;
    align-items: flex-end;
    display: flex;
    vertical-align: bottom;
    font-size: 21px;
}

.card-text {
    height: 160px;
    font-size: 16px;
    overflow: hidden;
}

.back-text {
    font-family: 'ermilovbold';
    font-style: normal;
    font-weight: 700;
    color: rgba(2, 173, 153, 0.1);
    position: absolute;
}
.back-text-wide {
    font-size: 95px;
    line-height: 60px;
}
.text-cols .col {
    padding: 0 !important;
    text-align: center;
}
.card-number {
    top: 60px;
    font-size: 120px;
}
.card-img-top {
    background-size: cover;
    height: 200px;
}
.back-text.et-cetera {
    bottom: 14px;
    font-size: 60px;
    line-height: 50px;
}
.vh-50 {
    height: 50vh;
}

.text-opacity-75 {
    color: rgba(255,255,255, 0.75);
}

.transition * {
    transition: ease-in-out 0.4s;
}

.primary-text-inputs .form-control {
    border-color: var(--color-primary);
    border-radius: 0;
    
    padding: .75rem;
}

.table-striped {
    --bs-table-bg: var(--color-primary-light);
    --bs-table-striped-bg: white;
}
th {
    font-weight: normal;
}

.font-less {
    font-size: .95rem;
}
.font-less-2 {
    font-size: .85rem;
}
textarea {
    height: 5rem;
    resize: none;
}

.tooltip  {
    transition: opacity 1250ms cubic-bezier(0.19, 1, 0.22, 1);
    pointer-events: none;
}
@keyframes fadeinout {
    0%,100% { opacity: 0; }
    20%,66% { opacity: 1; }
  }
.btn-outline-animation {
    outline: 0 solid;
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
    outline-color: rgba(255, 255, 255, .5);
    transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
} 

.btn-outline-animation:hover {
    outline: 1px solid;
    outline-color: rgba(255, 255, 255, 0);
    outline-offset: 15px;
}


.btn-outline-animation-primary {
    outline: 10px rgba(1,148,131, 1);
    transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
} 

.btn-outline-animation-primary:hover {
    cursor: pointer;
    outline: 140px rgba(1,148,131, 1);
    box-shadow: inset 0 0 15px 15px rgba(1,148,131, 0.4), 0 0 15px 15px rgba(1,148,131, 0.4);
}

.fade {
    transition: opacity .15s linear !important;
}

.fs-5_5 {
    font-size: large;
}

/* Placeholder field animation */

.placeholder-field + label {
    position: absolute;
    pointer-events: none;
    top: .9rem;
    left: 25px;
    transition: 0.2s ease all;
    font-size: 15px;
}
.placeholder-field:focus ~ label, 
input.placeholder-field:not(:placeholder-shown) ~ label, 
textarea.placeholder-field:not(:placeholder-shown) ~ label, 
select.placeholder-field:valid ~ label {
    top: 0;
    font-size:12px;
}

/* BS updates */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.form-check-input:checked { 
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}


@media (max-width: 992px) {
    .block-bg {
        background-color: var(--block-bg-color-solid);
    }
    .swiper.events-swiper {
        margin-left: 2.7em;
        margin-right: 2.7em;
    }
    .card-number {
        left: 0;
        right: 0;
    }
    .card-title-media {
        font-size: 20px;
    }
}
/*
@media (max-width: 768px) {
    section h1, section h2, section h3, section h4, section h5, section h6 {
        font-size: 0.9rem;
    }
}*/

@media (min-width: 768px) {
    .container-narrow {
        max-width: 1183px;
    }
    .container-narrow-1 {
        max-width: 900px;
    }
    .container-narrow-2 {
        max-width: 700px;
    }
    .swiper {
        width: 90%;
    }
}