@font-face {
    font-family: 'mario_emmaregular';
    src: url('../fonts/mario_emma-webfont.woff2') format('woff2'),
    url('../fonts/mario_emma-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
    background-color: #f0f0f0;
}

h1{
    background: transparent url('../images/h1-bkg.png') no-repeat left;
    color: white;
    padding: 13px 0 17px 21px;
}
.wide {
    background: transparent url('../images/h1-bkg-wide.png') no-repeat left;
    color: white;
    padding: 13px 0 17px 21px;
}
.kozmetik {
    background: transparent url('../images/h1-bkg-wide-kozmetik.png') no-repeat left;
    color: white;
    padding: 13px 0 17px 21px;
}
.maniker {
    background: transparent url('../images/h1-bkg-wide-maniker.png') no-repeat left;
    color: white;
    padding: 13px 0 17px 21px;
}
.pediker {
    background: transparent url('../images/h1-bkg-wide-pediker.png') no-repeat left;
    color: white;
    padding: 13px 0 17px 21px;
}

@media (max-width: 1200px) {  
    h1 {
        padding-top: 18px;
    } 
}
#adresa ul, #telefon ul, #email ul {
    list-style: none;
}

#adresa ul li:nth-child(3), #telefon ul li:nth-child(3), #email ul li:nth-child(3) {
    color: #8f8f8f;
    font-family: 'Poppins', sans-serif!important;
    font-weight: 500;
}

.adresa::before {
    font: var(--fa-font-solid);
    content: "\f549";
    font-size: 29px;
    padding: 10px;
    text-align: center;
}

.telefon::before {
    font: var(--fa-font-solid);
    content: "\f095";
    font-size: 29px;
    padding: 10px;
}

.email::before {
    font: var(--fa-font-solid);
    content: "\f0e0";
    font-size: 29px;
    padding: 10px;
}
#kurz-tetovanie h2 {
    background: transparent url('../images/kurz-tetovanie-h2-bkg.png') no-repeat left;
    color: white;
    padding: 10px 0 15px 21px;
}
#kurz-piercing h2 {
    background: transparent url('../images/kurz-piercing-h2-bkg.png') no-repeat left;
    color: white;
    padding: 10px 0 15px 21px;
}
#kurz-pre-kozmeticky h2, #kurzy-kozmetik-kozmeticka h2 {
    background: transparent url('../images/kurz-pre-kozm-h2-bkg.png') no-repeat left;
    background-size: 99.8%;
    font-size: 1.8rem;
    color: white;
    padding: 10px 0 15px 21px;
}
#kurzy-maniker-manikerka h2 {
    background: transparent url('../images/maniker-h2-bkg.png') no-repeat left;
    background-size: 99.8%;
    font-size: 1.8rem;
    color: white;
    padding: 10px 0 15px 21px;
}
#kurzy-pediker-pedikerka h2 {
    background: transparent url('../images/pediker-h2-bkg.png') no-repeat left;
    background-size: 99.8%;
    font-size: 1.8rem;
    color: white;
    padding: 10px 0 15px 21px;
}

#kurz-microdermal h2 {
    background: transparent url('../images/kurz-microdermal-h2-bkg.png') no-repeat left;
    color: white;
    padding: 10px 0 15px 21px;
}
#kurz-microblading h2 {
    background: transparent url('../images/kurz-microblading-h2-bkg.png') no-repeat left;
    background-size: 99.8%;
    font-size: 1.9rem;
    color: white;
    padding: 10px 0 15px 21px;
}
#kurz-pmu-obocie h2, #kurz-pmu-pery h2 {
    background: transparent url('../images/kurz-pmu-h2-bkg.png') no-repeat left;
    color: white;
    padding: 10px 0 15px 21px;
}
#kurz-pmu-linky h2 {
    background: transparent url('../images/kurz-pmu-linky-h2-bkg.png') no-repeat left;
    color: white;
    padding: 10px 0 15px 21px;
}

#kurz-bankovanie h2 {
    background: transparent url('../images/kurz-pre-kozm-h2-bkg.png') no-repeat left;
    background-size: 99.8%;
    font-size: 1.8rem;
    color: white;
    padding: 10px 0 15px 21px;
}

@media (max-width: 1200px) {  
    #kurz-pre-kozmeticky h2 {
        font-size: 1.4rem;
    }
    #kurz-microblading h2 {
        font-size: 1.5rem;
    }
    #kurz-bankovanie h2 {
        font-size: 1.4rem;
    }
    #kurz-tetovanie h2, #kurz-piercing h2, #kurz-pre-kozmeticky h2, #kurz-microdermal h2, #kurz-microblading h2, 
    #kurz-pmu-obocie h2, #kurz-pmu-pery h2, #kurz-pmu-linky h2, #kurz-bankovanie h2, #kurzy-kozmetik-kozmeticka h2, #kurzy-maniker-manikerka h2, #pediker-pedikerka h2 {
        padding-top: 15px;
    }
}
#kurz-kozmetik-kozmeticka, #kurz-maniker-manikerka, #kurz-pediker-pedikerka {
    background: white url('../images/akreditovany-kurz.png') no-repeat center;
    background-size: 20%;
    background-position-y: 2%;
    background-position-x: 97%;
}
#kurzy-kozmetik-kozmeticka, #kurzy-maniker-manikerka, #kurzy-pediker-pedikerka {
    background: white url('../images/akreditovany-kurz.png') no-repeat center;
    background-size: 20%;
    background-position-y: 65%;
    background-position-x: 96%;
}

#kurz-tetovanie {
    background: white url('../images/kurz-tetovanie.png') no-repeat center;
    background-size: 50%;
    background-position-y: 16%;
    background-position-x: 107%;
}
#kurz-piercing {
    background: white url('../images/kurz-piercing.png') no-repeat center;
    background-size: 50%;
    background-position-y: 16%;
    background-position-x: 107%;
}
#kurz-pre-kozmeticky {
    background: white url('../images/kurz-pre-kozmeticky.png') no-repeat center;
    background-size: 50%;
    background-position-y: 16%;
    background-position-x: 107%;
}
#kurz-microdermal {
    background: white url('../images/kurz-microdermal.png') no-repeat center;
    background-size: 50%;
    background-position-y: 68%;
    background-position-x: 107%;
}
#kurz-microblading {
    background: white url('../images/kurz-microblading.png') no-repeat center;
    background-size: 50%;
    background-position-y: 68%;
    background-position-x: 107%;
}
#kurz-pmu-obocie {
    background: white url('../images/kurz-pmu-obocie.png') no-repeat center;
    background-size: 50%;
    background-position-y: 68%;
    background-position-x: 107%;
}
#kurz-pmu-linky {
    background: white url('../images/kurz-pmu-linky.png') no-repeat center;
    background-size: 50%;
    background-position-y: 68%;
    background-position-x: 107%;
}
#kurz-pmu-pery {
    background: white url('../images/kurz-pmu-pery.png') no-repeat center;
    background-size: 50%;
    background-position-y: 68%;
    background-position-x: 107%;
}

#kurz-bankovanie {
    background: white url('../images/kurz-bankovanie.png') no-repeat center;
    background-size: 50%;
    background-position-y: 68%;
    background-position-x: 107%;
}

#home-tetovanie {
    background-color: transparent;
}

#home-piercing {
    background-color: transparent;
}

#home-makeup {
    background-color: transparent;
}

#home-kurzy {
    background-color: transparent;
}

#custom-cards h2 {
    background: transparent url('../images/h1-bkg.png') no-repeat left;
    color: white;
    position: relative;
    background-size: 100%;
    height: 100%;
    bottom: 20px;
}
@media (max-width: 1200px) {  
    #custom-cards h2 {
        font-size:1.05rem;
        padding-top: 6px;
    } 
}
#custom-cards a {
    text-decoration: none;
    display: block;
    height: 100%;
    
}
#custom-cards img:hover {
    -webkit-filter: drop-shadow(8px 8px 10px gray) sepia(100%);
    filter: drop-shadow(8px 8px 10px gray) sepia(100%);
}

h5 {
    background: transparent url('../images/h5-bkg.png') no-repeat left;
    color: white;
    padding: 12px 0 0 16px;
    height: 50px;
    background-size: 46%;
}
#foto-vsetko {
    background: transparent url('../images/h5-bkg.png') no-repeat left;
    color: white;
    padding: 9px 0 13px 21px;
    margin-left: 0px;
    width: 100%;
    font-size: 1.75rem;
}

#foto-tetovanie {
    background: transparent url('../images/kurz-tetovanie-h2-bkg.png') no-repeat left;
    color: white;
    padding: 9px 0 13px 21px;
    margin-left: 0px;
    width: 100%;
    font-size: 1.75rem;
}

#foto-piercing  {
    background: transparent url('../images/kurz-piercing-h2-bkg.png') no-repeat left;
    color: white;
    padding: 9px 0 13px 21px;
    margin-left: 0px;
    width: 100%;
    font-size: 1.75rem;
}

#foto-makeup {
    background: transparent url('../images/kurz-microblading-h2-bkg.png') no-repeat left;
    color: white;
    padding: 9px 0 13px 21px;
    margin-left: 0px;
    width: 100%;
    font-size: 1.75rem;
}

#foto-kurzy {
    background: transparent url('../images/kurz-microdermal-h2-bkg.png') no-repeat left;
    color: white;
    padding: 9px 0 13px 21px;
    margin-left: 0px;
    width: 100%;
    font-size: 1.75rem;
}
@media (max-width: 1200px) {  
    #foto-vsetko, #foto-tetovanie, #foto-piercing, #foto-makeup, #foto-kurzy {
        padding-top: 16px;
    } 
}
@media (max-width: 1200px) {  
    h5 {
        padding-top: 14px;
    } 
}
#onas-img {
    overflow: hidden;
}
#map {
    height: 100%;
}

.info-window {
    width: 100%;
}

.my_carousel {
    height: 400px;
    perspective: 880px;
}

.my_carousel .my_carousel-item {
    height: 200px;
    
    box-shadow: 0px 0px 5px black;
    
}
.my_carousel .indicators .indicator-item {
    border: 1px solid gray;
}
.my_carousel .indicators .indicator-item.active {
    background-color: #000 !important;
    border: 1px solid #000;
}

.galeria a img {
    border: 2px solid #fff;
    -webkit-transition: -webkit-transform .15s ease;
    -moz-transition: -moz-transform .15s ease;
    -o-transition: -o-transform .15s ease;
    -ms-transition: -ms-transform .15s ease;
    transition: transform .15s ease;
    position: relative;
}
  /* line 46, ../sass/demo.scss */
.galeria a:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
    z-index: 5;
}
  /* line 57, ../sass/demo.scss */
.galeria a.big img {
    width: 40%;
}
#btn-back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
}
.Phone {
    position: relative;
    display: block;
    margin: 0;
    width: 1em;
    height: 1em;
    font-size: 10vmin;
    background-color: #000;
    border-radius: 0.5em;
    box-shadow: 0 0 0 0em rgba(52, 152, 219, 0), 0em 0.05em 0.1em rgba(0, 0, 0, 0.2);
    transform: translate3d(0, 0, 0) scale(1);
}

.Phone::before,
.Phone::after {
    position: absolute;
    content: "";
}

.Phone::before {
    top: 0;
    left: 0;
    width: 1em;
    height: 1em;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 100%;
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(0);
}

.Phone::after {
    top: 0.25em;
    left: 0.25em;
    width: 0.5em;
    height: 0.5em;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTYuNiAxMC44YzEuNCAyLjggMy44IDUuMSA2LjYgNi42bDIuMi0yLjJjLjMtLjMuNy0uNCAxLS4yIDEuMS40IDIuMy42IDMuNi42LjUgMCAxIC40IDEgMVYyMGMwIC41LS41IDEtMSAxLTkuNCAwLTE3LTcuNi0xNy0xNyAwLS42LjQtMSAxLTFoMy41Yy41IDAgMSAuNCAxIDEgMCAxLjIuMiAyLjUuNiAzLjYuMS40IDAgLjctLjIgMWwtMi4zIDIuMnoiIGZpbGw9IiNmZmZmZmYiLz48L3N2Zz4=);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    transform: translate3d(0, 0, 0);
}

.Phone.is-animating {
    -webkit-animation: phone-outer 3000ms infinite;
    animation: phone-outer 3000ms infinite;
}

.Phone.is-animating::before {
    -webkit-animation: phone-inner 3000ms infinite;
    animation: phone-inner 3000ms infinite;
}

.Phone.is-animating::after {
    -webkit-animation: phone-icon 3000ms infinite;
    animation: phone-icon 3000ms infinite;
}

@-webkit-keyframes phone-outer {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
        box-shadow: 0 0 0 0em rgba(52, 152, 219, 0), 0em 0.05em 0.1em rgba(0, 0, 0, 0.2);
    }

    33.3333% {
        transform: translate3d(0, 0, 0) scale(1.1);
        box-shadow: 0 0 0 0em rgba(52, 152, 219, 0.1), 0em 0.05em 0.1em rgba(0, 0, 0, 0.5);
    }

    66.6666% {
        transform: translate3d(0, 0, 0) scale(1);
        box-shadow: 0 0 0 0.5em rgba(52, 152, 219, 0), 0em 0.05em 0.1em rgba(0, 0, 0, 0.2);
    }

    100% {
        transform: translate3d(0, 0, 0) scale(1);
        box-shadow: 0 0 0 0em rgba(52, 152, 219, 0), 0em 0.05em 0.1em rgba(0, 0, 0, 0.2);
    }
}

@keyframes phone-outer {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
        box-shadow: 0 0 0 0em rgba(52, 152, 219, 0), 0em 0.05em 0.1em rgba(0, 0, 0, 0.2);
    }

    33.3333% {
        transform: translate3d(0, 0, 0) scale(1.1);
        box-shadow: 0 0 0 0em rgba(52, 152, 219, 0.1), 0em 0.05em 0.1em rgba(0, 0, 0, 0.5);
    }

    66.6666% {
        transform: translate3d(0, 0, 0) scale(1);
        box-shadow: 0 0 0 0.5em rgba(52, 152, 219, 0), 0em 0.05em 0.1em rgba(0, 0, 0, 0.2);
    }

    100% {
        transform: translate3d(0, 0, 0) scale(1);
        box-shadow: 0 0 0 0em rgba(52, 152, 219, 0), 0em 0.05em 0.1em rgba(0, 0, 0, 0.2);
    }
}

@-webkit-keyframes phone-inner {
    0% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(0);
    }

    33.3333% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(0.9);
    }

    66.6666% {
        opacity: 0;
        transform: translate3d(0, 0, 0) scale(0);
    }

    100% {
        opacity: 0;
        transform: translate3d(0, 0, 0) scale(0);
    }
}

@keyframes phone-inner {
    0% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(0);
    }

    33.3333% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(0.9);
    }

    66.6666% {
        opacity: 0;
        transform: translate3d(0, 0, 0) scale(0);
    }

    100% {
        opacity: 0;
        transform: translate3d(0, 0, 0) scale(0);
    }
}

@-webkit-keyframes phone-icon {
    0% {
        transform: translate3d(0em, 0, 0);
    }

    2% {
        transform: translate3d(0.01em, 0, 0);
    }

    4% {
        transform: translate3d(-0.01em, 0, 0);
    }

    6% {
        transform: translate3d(0.01em, 0, 0);
    }

    8% {
        transform: translate3d(-0.01em, 0, 0);
    }

    10% {
        transform: translate3d(0.01em, 0, 0);
    }

    12% {
        transform: translate3d(-0.01em, 0, 0);
    }

14% {
        transform: translate3d(0.01em, 0, 0);
    }

    16% {
        transform: translate3d(-0.01em, 0, 0);
    }

    18% {
        transform: translate3d(0.01em, 0, 0);
    }

    20% {
        transform: translate3d(-0.01em, 0, 0);
    }

    22% {
        transform: translate3d(0.01em, 0, 0);
    }

    24% {
        transform: translate3d(-0.01em, 0, 0);
    }

    26% {
        transform: translate3d(0.01em, 0, 0);
    }

    28% {
        transform: translate3d(-0.01em, 0, 0);
    }

    30% {
        transform: translate3d(0.01em, 0, 0);
    }

    32% {
        transform: translate3d(-0.01em, 0, 0);
    }

    34% {
        transform: translate3d(0.01em, 0, 0);
    }

    36% {
        transform: translate3d(-0.01em, 0, 0);
    }

    38% {
        transform: translate3d(0.01em, 0, 0);
    }

    40% {
        transform: translate3d(-0.01em, 0, 0);
    }

    42% {
        transform: translate3d(0.01em, 0, 0);
    }

    44% {
        transform: translate3d(-0.01em, 0, 0);
    }

    46% {
        transform: translate3d(0em, 0, 0);
    }
}

@keyframes phone-icon {
    0% {
        transform: translate3d(0em, 0, 0);
    }

    2% {
        transform: translate3d(0.01em, 0, 0);
    }

    4% {
        transform: translate3d(-0.01em, 0, 0);
    }

    6% {
        transform: translate3d(0.01em, 0, 0);
    }

    8% {
        transform: translate3d(-0.01em, 0, 0);
    }

    10% {
        transform: translate3d(0.01em, 0, 0);
    }

    12% {
        transform: translate3d(-0.01em, 0, 0);
    }

    14% {
        transform: translate3d(0.01em, 0, 0);
    }

    16% {
        transform: translate3d(-0.01em, 0, 0);
    }

    18% {
        transform: translate3d(0.01em, 0, 0);
    }

    20% {
        transform: translate3d(-0.01em, 0, 0);
    }

    22% {
        transform: translate3d(0.01em, 0, 0);
    }

    24% {
        transform: translate3d(-0.01em, 0, 0);
    }

    26% {
        transform: translate3d(0.01em, 0, 0);
    }

    28% {
        transform: translate3d(-0.01em, 0, 0);
    }

    30% {
        transform: translate3d(0.01em, 0, 0);
    }

    32% {
        transform: translate3d(-0.01em, 0, 0);
    }

    34% {
        transform: translate3d(0.01em, 0, 0);
    }

    36% {
        transform: translate3d(-0.01em, 0, 0);
    }

    38% {
        transform: translate3d(0.01em, 0, 0);
    }

    40% {
        transform: translate3d(-0.01em, 0, 0);
    }

    42% {
        transform: translate3d(0.01em, 0, 0);
    }

    44% {
        transform: translate3d(-0.01em, 0, 0);
    }

    46% {
        transform: translate3d(0em, 0, 0);
    }
}

#call-us h2 {
    background-image: none;
    color: #000;
}
#call-us i {
    bottom: 20px;
}
.is-checked {
    color: #fff;
    background-color: #000;
}

.nav-link.active::before {
    content: "\2022";
}
.nav-link.active::after {
    content: "\2022";
}
.navbar-toggler {
    border: 2px solid #fff;
    background-color: #000;
}
.fa-bars {
    color: #fff;
}
.btn:focus:not(:focus-visible) {
    outline: 0 !important;
    box-shadow: none !important;
}
.btn:focus, .btn:active {
    outline: none !important;
    box-shadow: none !important;
}

#banner {
    background-color: #eee6d3;
    width: 80%;
    text-align: center;
    margin: 20px auto 0 auto;
    display: block;
}

.banner-title {
    background: transparent url('../images/kurz-pre-kozm-h2-bkg.png') no-repeat left;
    background-size: auto;
    background-size: 28%;
    font-size: 1.8rem;
    color: white;
    padding: 10px 0 15px 21px;
}

@media (max-width: 1200px) {  
    .banner-title {
        background-size: 78%;
    } 
}
#kurz-microdermal-banner {
    background: white url('../images/kurz-microdermal.png') no-repeat center;
    background-size: 40%;
    background-position-y: 92%;
    background-position-x: 94%;
}
#kurz-piercing-banner {
    background: white url('../images/kurz-piercing.png') no-repeat center;
    background-size: 40%;
    background-position-y: 92%;
    background-position-x: 94%;
}

#kurz-tetovanie-banner {
    background: white url('../images/kurz-tetovanie.png') no-repeat center;
    background-size: 40%;
    background-position-y: 92%;
    background-position-x: 94%;
}
#kurz-microdermal-banner a {
    text-decoration: none;     
}

#kurz-bankovanie-banner {
    background: white url('../images/kurz-bankovanie.png') no-repeat center;
    background-size: 40%;
    background-position-y: 92%;
    background-position-x: 94%;
}

.pass-date {
    text-decoration: line-through;
    color: #BFBFBF;
}
.btn-dark:hover {
    border: 1px solid black;
    background-color: white;
    color: black;
}
#kurzy-kozmetik-kozmeticka a, #kurzy-maniker-manikerka a, #kurzy-pediker-pedikerka a {
    text-align: center;
    margin: 0 auto;
    display: block;
    width: 30%;
}