body {
    font-family: "Ubuntu", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #004165;
    background-color: #ffffff;
    font-size: 16px;
    margin: 0px 0px 0px 0px;
    overflow-y: scroll;
    overflow-x: hidden;
}

a:hover {
    color: #e39479;
    text-decoration: underline;
}

.xcontainer {
    max-width: 1400px;
}

/* GENERAL */
.name {
    font-family: "Ubuntu", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 32px;
    color: #004165;
    line-height: 1.2;
}

.name-small {
    font-family: "Ubuntu", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    color: #004165;
    line-height: 1.2;
}

.title {
    font-family: "Ubuntu", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 24px;
    color: #004165;
    line-height: 1.2;
}

.text {
    font-family: "Ubuntu", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #004165;
    font-size: 16px;
    line-height: 1.4;
}

.text a:link,
.text a:visited {
    color: #e39479;
    text-decoration: underline;
}

.text a:hover,
.text a:active {
    color: #ce7152;
    text-decoration: underline;
}

.text-500 {
    font-weight: 500;
}

h2 {
    font-family: "Ubuntu", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 24px;
    color: #004165;
    line-height: 1.2;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: var(--bs-nav-pills-link-active-color);
    background-color: #e39479;
}

.color-salmon {
    color: #e39479;
}

.photo-zespol {
    border-radius: 20px;
}

.page-title-person {
    font-weight: 600;
    font-size: 30px;
    line-height: 1.2;
}

.page-title-type {
    color: #e39479;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.2;
}

.page-text-specialization {
    font-size: 16px;
    line-height: 1.4;
}

.more {
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 15px;
    color: #000000;
    text-transform: uppercase;
}

.more a:link,
.more a:visited {
    color: #000000;
    text-decoration: none;
    border: 1px solid #ffa500;
    border-radius: 30px;
    padding: 15px 50px;
}

.more a:hover,
.more a:active {
    color: #364c5c;
    text-decoration: none;
}

.europa-bold {
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
}

/* NAVBAR */
.navbar-logo-size {
    max-width: 400px;
    height: auto;
}

/*
.navbar {
  --bs-navbar-padding-y: 1.3rem;
    background-color: #B2CADA;
}

.navbar-expand-md .navbar-nav .nav-link {
    padding-right: .8rem;
    padding-left: .8rem;
}

.navbar-nav {
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;
    font-style: normal;
    color: #004165;
}

.nav-link {
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;
    font-style: normal;
    color: #004165;
    font-size: 17px;
    line-height: 1.2;

    display: block;
    /*padding: .5rem 1rem;* /
    padding: 10px 10px !important;
}

.navbar-logo-size {}

.dropdown-menu {
  border: solid 1px #9FBDD0;
}

.dropdown-item {
    color: #004165;
}

.dropdown-item:focus, .dropdown-item:hover {
  color: #004165;
  background-color: #ECF1F5;
}

.navbar-phone {
    display: inline;
    float: left;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 600;
    font-size: 17px;
    font-style: normal;
    color: #ffffff;
    background-color: #004165;
    padding: 12px 20px;
    border-radius: 10px;
    margin: 0px 0px 0px 30px;
}


.navbar-registration {
    display: inline;
    float: left;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 600;
    font-size: 17px;
    font-style: normal;
    color: #ffffff;
    margin: 12px 0px 0px 10px;
}


.navbar-registration a:link, .navbar-registration a:visited {
    color: #ffffff;
    background-color: #E39479;
    text-decoration: none;
    padding: 15px 20px;
    border-radius: 10px;
}

.navbar-registration a:hover, .navbar-registration a:active {
    color: #ffffff;
    background-color: #ce7152;
    text-decoration: none;
    padding: 15px 20px;
    border-radius: 10px;
}
*/

/* HEADER */
.front-header {
    padding: 0rem;
    background-color: transparent;
    background-image: url(../images/header-bg-desktop.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    position: relative;
    z-index: 10;
    height: 720px;
    background-size: cover;
    width: 100vi;
}

.front-header-info {
    padding-bottom: 120px;
}

.front-header .header-name {
    font-size: 70px;
    text-align: left;
    line-height: 1.1;
}

.front-header .header-title {
    font-size: 50px;
    text-align: left;
    color: #ffffff;
    font-weight: 300;
    margin: 20px 0px 0px 0px;
}

/* .front-header a,
.front-header a:hover {
    transition: none;
} */

.header-btn-item {
    display: inline-flex;
    width: 100%;
}

a.header-btn-link {
    color: #ffffff;
    display: flex;
    align-items: center;
    padding: 14px;
    border-radius: 10px;
    width: 100%;
    gap: 14px;
    font-size: 22px;
    font-weight: 600;
    font-family: "Ubuntu", sans-serif;
    font-style: normal;
    text-decoration: none;
    min-height: 74px;
}

a.header-btn-link span {
    word-break: break-word;
    white-space: pre-wrap;
}

a.header-btn-link:hover {
    text-decoration: none;
}

a.header-btn-link.blue {
    background-color: #004165;
    border: 2px solid #004165;
}

a.header-btn-link.orange {
    background-color: #e39479;
    border: 2px solid #e39479;
}
a.header-btn-link.orange:hover,
a.header-btn-link.orange:active {
    background-color: #ce7152;
    border: 2px solid #ce7152;
}

a.header-btn-link .header-btn-icon-wrapper {
    display: flex;
    align-items: flex-start;
    height: 100%;
}

a.header-btn-link .header-btn-icon {
    width: auto;
    height: 54px;
}

.header-info {
    margin-top: 76px;
}

.header-phone-item {
    display: flex;
    height: 100%;
}

.header-phone a:link,
.header-phone a:visited,
.header-phone a:hover,
.header-phone a:active {
    background-image: url(../images/icon-header-001.png);
    background-position: left 15px top 15px;
    background-repeat: no-repeat;
    display: inline;
    float: left;
    font-family: "Ubuntu", sans-serif;
    font-weight: 600;
    font-size: 22px;
    font-style: normal;
    color: #ffffff;
    padding: 27px 25px 27px 85px;
    background-color: #004165;
    border: 2px solid #004165;
    border-radius: 10px;
}

.header-phone a:link,
.header-phone a:visited,
.header-phone a:hover,
.header-phone a:active {
    text-decoration: none;
    color: #ffffff;
}

.header-phone,
.header-registration {
    display: flex;
}

.header-registration-item {
    display: flex;
}

.header-phone,
.header-registration {
    display: flex;
    width: 100%;
    float: left;
    font-family: "Ubuntu", sans-serif;
    font-weight: 600;
    font-size: 22px;
    font-style: normal;
    color: #ffffff;
}

.header-phone a,
.header-registration a {
    display: block;
    width: 100%;
}

.header-registration a:link,
.header-registration a:visited {
    background-image: url(../images/icon-header-002.png);
    background-position: left 20px top 15px;
    background-repeat: no-repeat;
    color: #ffffff;
    background-color: #e39479;
    text-decoration: none;
    padding: 32px 25px 32px 85px;
    border-radius: 10px;
}

.header-registration a:hover,
.header-registration a:active {
    background-image: url(../images/icon-header-002.png);
    background-position: left 20px top 15px;
    background-repeat: no-repeat;
    color: #ffffff;
    background-color: #ce7152;
    text-decoration: none;
    padding: 32px 25px 32px 85px;
    border-radius: 10px;
}

.header-registration p {
    margin: 0;
}

.front-head-banner {
    display: block;
    margin-top: 120px;
    margin-bottom: 30px;
}

/* OFERTA */
#oferta {
    padding: 60px 0px 80px 0px;
    background-color: #ffffff;
}

#oferta .name-small {
    margin-bottom: 40px;
}

#oferta .item-bg {
    background-color: #ffffff;
    border-radius: 20px;
    border: 2px solid #b2cada;
    margin: 12px 0px 12px 0px;
    height: 120px;
}

#oferta .item-bg:hover {
    background-color: #ffffff;
    border-radius: 20px;
    border: 2px solid #e39479;
    margin: 12px 0px 12px 0px;
    height: 120px;
}

#oferta .title-oferta {
    font-size: 21px;
    font-weight: 600;
    line-height: 1.2;
    padding-left: 15px;
}

section#oferta a:link {
    text-decoration: none !important;
}

section#oferta a:visited {
    text-decoration: none !important;
}

section#oferta a:hover {
    text-decoration: none !important;
}

section#oferta a:active {
    text-decoration: none !important;
}

/* PAGE TITLE  */
#page-content-title-bg {
    background-image: url(../images/page-bg-2.jpg);
    background-position: left top;
    background-repeat: repeat-x;
    height: 130px;
    border-top: 1px solid #c2d5e3;
    width: 100%;
}

#page-content-title-bg .page-content-title {
    margin-top: 50px;
}

/* PAGE CONTENT */
#page-content-text-bg {
    padding: 0px 0px 100px 0px;
}

#page-content-text-bg .page-content-text {
    color: #004165;
}

.cennik {
    color: #004165;
}

.table td {
    color: #004165 !important;
}

.tbody,
td,
tfoot,
th,
thead,
tr {
    border-color: #b7cddd;
}

/* Gutenberg */
.photos-border-radius img {
    border-radius: 10px;
}

/* Google Maps */
.google-maps {
    position: relative;
    padding-bottom: 75%;
    height: 0;
    overflow: hidden;
}

.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/* TEAM */
#zespol {
    padding: 0rem;
    background-color: transparent;
    background-image: url(../images/home-bg-1.png), url(../images/bg-zab.png);
    background-position:
        left bottom 70px,
        right -100px bottom;
    background-repeat: no-repeat, no-repeat;
    position: relative;
    z-index: 10;
    height: 720px;
}

#zespol .zespol-photo-size {
    border-radius: 20px;
}

#zespol .title {
    padding: 0px 0px 0px 20px;
}

#zespol .name-zespol {
    font-size: 48px;
    line-height: 1.2;
    padding: 20px 0px 20px 20px;
}

#zespol .text {
    font-size: 18px;
    padding: 10px 0px 00px 20px;
}

#zespol .signature {
    font-family: "Satisfy", cursive;
    font-size: 36px;
    color: #004165;
    padding: 30px 0px 0px 20px;
}

/* ZESPOL KARUZELA */
#team-carousel {
    padding: 0rem;
}

#team-carousel .team-item-bg {
    border: 2px solid #e39479;
    border-radius: 20px;
    margin: 160px 10px 20px 10px;
    height: 260px;
}

#team-carousel .title-person {
    font-weight: 600;
    font-size: 24px;
    line-height: 1.2;
}

#team-carousel .title-type {
    color: #e39479;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.2;
}

#team-carousel .text-specialization {
    font-size: 16px;
    line-height: 1.4;
}

#team-carousel .photo-person {
    margin: -124px 0px 0px 15px;
}

#team-carousel .photo-person img[src=""] {
    display: inline-block;
    margin-top: 140px;
}

.team-carousel-more {
    display: inline;
    float: left;
    font-family: "Ubuntu", sans-serif;
    font-weight: 500;
    font-size: 16px;
    font-style: normal;
    color: #ffffff;
    margin: 20px 0px 0px 0px;
}

.team-carousel-more a:link,
.team-carousel-more a:visited {
    color: #ffffff;
    background-color: #e39479;
    text-decoration: none;
    padding: 10px 15px;
    border-radius: 8px;
}

.team-carousel-more a:hover,
.team-carousel-more a:active {
    color: #ffffff;
    background-color: #ce7152;
    text-decoration: none;
    padding: 10px 15px;
    border-radius: 8px;
}

/* CAROUSEL */
@media (max-width: 767px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }

    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

@media (min-width: 768px) {
    .carousel-inner .carousel-item-end.active,
    .carousel-inner .carousel-item-next {
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%);
    }

    .carousel-inner .carousel-item-start.active,
    .carousel-inner .carousel-item-prev {
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }

    .carousel-inner .carousel-item-end,
    .carousel-inner .carousel-item-start {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

.carousel-control-prev {
    -webkit-box-align: left;
    -ms-flex-align: left;
    align-items: left;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    margin-top: 140px;
    margin-left: -80px;
}

.carousel-control-next {
    -webkit-box-align: right;
    -ms-flex-align: right;
    align-items: right;
    -webkit-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right;
    margin-top: 140px;
    margin-right: -80px;
}

.carousel-control-next-icon {
    background-image: url(../images/arrow-next.png);
}

.carousel-control-prev-icon {
    background-image: url(../images/arrow-prev.png);
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    width: 34px;
    height: 66px;
}

/* O NAS */

#aboutus {
    margin: 60px 0px;
    padding: 30px 0px 80px 0px;
    background-color: transparent;
    background-image: url(../images/home-bg-2a.png);
    background-position: right bottom;
    background-repeat: no-repeat;
    position: relative;
    z-index: 10;
    height: 720px;
}

#aboutus .aboutus-photo-size {
    border-radius: 20px;
}

#aboutus .name {
    font-size: 48px;
    padding: 0px 20px 0px 0px;
    margin-bottom: 30px;
}

#aboutus .title {
    font-weight: 600;
    padding: 30px 20px 10px 0px;
}

#aboutus .text {
    padding: 0px 20px 0px 0px;
}

.aboutus-more {
    font-family: "Ubuntu", sans-serif;
    font-weight: 500;
    font-size: 16px;
    font-style: normal;
    color: #ffffff;
    margin: 60px 20px 0px 0px;
    text-align: right;
}

.aboutus-more a:link,
.aboutus-more a:visited {
    color: #ffffff;
    background-color: #e39479;
    text-decoration: none;
    padding: 10px 15px;
    border-radius: 8px;
}

.aboutus-more a:hover,
.aboutus-more a:active {
    color: #ffffff;
    background-color: #ce7152;
    text-decoration: none;
    padding: 10px 15px;
    border-radius: 8px;
}

.aboutus-icon-size {
    margin-right: 20px;
}

/* BLOG FRONT PAGE */
#blog-fp {
    padding: 0px 0px 100px 0px;
    background-image: url(../images/home-bg-3.jpg);
    background-position: left top;
    background-repeat: repeat-x;
    /*background-color: #B2CADA;*/
}

#blog-fp .bg-teeth {
    background-image: url(../images/bg-zab.png);
    background-position: left -50px top;
    background-repeat: no-repeat;
}

#blog-fp .text-numbers-item {
    margin: 180px 0px 100px 0px;
}

#blog-fp .text-numbers {
    size: 30px;
    text-align: center;
    position: relative;
    z-index: 100;
}

#blog-fp .text-numbers-bg {
    color: #b2cada;
    font-weight: 600;
    font-size: 200px;
    text-align: center;
    margin: -190px auto 0px auto;
    position: relative;
    z-index: 10;
}

#blog-fp .entry-item {
    height: calc(100% - 80px);
    margin: 40px 0px 40px 0px;
    padding: 0px 0px 40px 0px;
    border-radius: 20px;
    background-color: #ffffff;
}

#blog-fp .entry-photo {
    position: relative;
    z-index: 10;
}

#blog-fp .entry-photo-size {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    width: 100%;
}

#blog-fp .entry-category {
    margin: -20px 25px 0px 25px;
    position: relative;
    z-index: 100;
}

#blog-fp .entry-category a {
    display: inline-block;
    padding: 8px 12px;
}

#blog-fp .entry-category a:link,
#blog-fp .entry-category a:visited {
    color: #ffffff;
    text-decoration: none;
}

#blog-fp .entry-category a:hover,
#blog-fp .entry-category a:active {
    color: #ffffff;
    text-decoration: none;
}

#blog-fp .entry-category-bg {
    display: inline-block;
    background-color: #e39479;
    border-radius: 10px;
    padding: 0px;
}

#blog-fp .entry-category-bg:hover {
    background-color: #ce7152;
}

#blog-fp .entry-title {
    margin: 30px 25px 0px 25px;
}

#blog-fp .entry-title a:link,
#blog-fp .entry-title a:visited {
    color: #004165;
    text-decoration: none;
}

#blog-fp .entry-title a:hover,
#blog-fp .entry-title a:active {
    color: #004165;
    text-decoration: underline;
}

#blog-fp .morefp a:link,
#blog-fp .morefp a:visited {
    color: #004165;
    text-decoration: underline;
}

#blog-fp .morefp a:hover,
#blog-fp .morefp a:active {
    color: #004165;
    text-decoration: none;
}

/* BLOG HOME */

#blog-home-title-bg {
    background-color: #b2cada;
    height: 130px;
    border-top: 1px solid #c2d5e3;
}

#blog-home-title-bg .page-content-title {
    margin-top: 50px;
}

#blog-home-text-bg {
    background-color: #b2cada;
    padding: 0px 0px 100px 0px;
}

/* FOOTER */

#footer {
    padding: 100px 0px 0px 0px;
    background-image: url(../images/bg-zab.png);
    background-position: right -200px bottom -200px;
    background-repeat: no-repeat, no-repeat;
    background-color: #004165;
}

#footer .logo {
    margin: 0px 0px 50px 0px;
    width: 260px;
    height: auto;
}

#footer .name {
    font-size: 70px;
    color: #ffffff;
    line-height: 1.2;
}

#footer .title {
    color: #ffffff;
    font-size: 20px;
    padding-bottom: 30px;
}

#footer .text {
    color: #ffffff;
    line-height: 1.9;
}

#footer ul {
    font-family: "Ubuntu", sans-serif;
    font-weight: 500;
    font-style: normal;
    list-style-type: none;
    margin: -4px 0px 0px 0px;
    padding: 0;
    font-size: 16px;
    line-height: 1.9;
}

#footer ul li a:link,
#footer ul li a:visited {
    color: #ffffff;
    text-decoration: underline;
}

#footer ul li a:hover,
#footer ul li a:active {
    color: #e39479;
    text-decoration: underline;
}

#footer .social-item {
    margin: 80px 0px;
    text-align: left;
}

#footer .social-icon {
    padding: 0px 0 0px 0px;
    text-align: left;
}

#footer .text-social {
    margin-left: 10px;
    font-family: "Ubuntu", sans-serif;
    font-weight: 500;
    color: #eb9e84;
}

#footer .text-social a:link,
#footer .text-social a:visited {
    color: #eb9e84;
    text-decoration: none !important;
}

#footer .text-social a:hover,
#footer .text-social a:active {
    color: #eb9e84;
    text-decoration: none !important;
}

.page-footer {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

/* COPYRIGHT */

.copyright-text {
    font-family: "Ubuntu", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #ffffff;
    font-size: 14px;
    padding: 0px 0px 40px 0px;
}

/* =========================== * main-media-queries =========================== */
/* Large desktops and TV */
/* Large desktops and laptops */
@media (min-width: 1400px) and (max-width: 1599px) {
    /* GENERAL */

    .name {
        font-size: 30px;
        line-height: 1.4;
    }

    .name-small {
        font-size: 16px;
        line-height: 1.4;
    }

    .title {
        font-size: 22px;
        line-height: 1.2;
    }

    .text {
        font-size: 15px;
        line-height: 1.4;
    }

    /* HEADER */

    .front-header {
        padding: 0rem;
        height: 620px;
    }

    .front-header-info {
        padding-bottom: 80px;
    }

    .front-header .header-name {
        font-size: 62px;
        margin: -100px 0px 20px 0px;
    }

    .front-header .header-title {
        font-size: 40px;
        margin: 20px 0px 0px 0px;
    }

    .header-photos-size {
        width: 90%;
    }

    /* NAVBAR */

    .navbar-logo-size {
        max-width: 340px;
        height: auto;
    }

    /* .nav-link { font-size: 16px; line-height: 1.2; display: block; padding: 10px 10px !important; } .navbar-phone { font-size: 16px; padding: 12px 20px; border-radius: 10px; margin: 0px 0px 0px 20px; } .navbar-registration {   font-size: 16px;  margin: 12px 0px 0px 8px; } .navbar-registration a:link, .navbar-registration a:visited { padding: 15px 20px; border-radius: 10px; } .navbar-registration a:hover, .navbar-registration a:active { padding: 15px 20px; border-radius: 10px; } */
    /* OFERTA */

    #oferta {
        padding: 60px 0px 80px 0px;
    }

    #oferta .name-small {
        margin-bottom: 40px;
    }

    #oferta .item-bg {
        margin: 12px 0px 12px 0px;
        height: 120px;
    }

    #oferta .item-bg:hover {
        margin: 12px 0px 12px 0px;
        height: 120px;
    }

    #oferta .title-oferta {
        font-size: 20px;
        font-weight: 600;
        line-height: 1.2;
    }

    /* ZESPOL */

    #zespol {
        background-image: url(../images/home-bg-1.png), url(../images/bg-zab.png);
        background-position:
            left -300px bottom 70px,
            right -250px bottom;
        height: 720px;
    }

    #zespol .name-zespol {
        font-size: 40px;
        line-height: 1.2;
        padding: 20px 0px 20px 20px;
    }

    #zespol .text {
        font-size: 17px;
        padding: 10px 0px 00px 20px;
    }

    #zespol .signature {
        font-family: "Satisfy", cursive;
        font-size: 32px;
        color: #004165;
        padding: 30px 0px 0px 20px;
    }

    /* ZESPOL KARUZELA */

    #team-carousel .team-item-bg {
        border-radius: 20px;
        /* out */
        margin: 160px 10px 20px 10px;
        /* out */
        height: 260px;
        /* out */
    }

    #team-carousel .title-person {
        font-size: 22px;
        line-height: 1.2;
    }

    #team-carousel .title-type {
        font-size: 17px;
        line-height: 1.2;
    }

    #team-carousel .text-specialization {
        font-size: 16px;
        line-height: 1.4;
    }

    .team-carousel-more {
        font-size: 15px;
    }

    .carousel-control-prev {
        margin-top: 140px;
        margin-left: -40px;
    }

    .carousel-control-next {
        margin-top: 140px;
        margin-right: -40px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 30px;
        height: 58px;
    }

    /* O NAS */

    #aboutus {
        margin: 60px 0px;
        padding: 30px 0px 80px 0px;
        background-image: url(../images/home-bg-2a.png);
        background-position: right -300px bottom;
        z-index: 10;
        height: 720px;
    }

    #aboutus .name {
        font-size: 40px;
        padding: 0px 20px 0px 0px;
        margin-bottom: 30px;
        line-height: 1.2;
    }

    .aboutus-more {
        font-size: 15px;
    }

    /* BLOG FRONT PAGE */

    #blog-fp {
        padding: 0px 0px 100px 0px;
        background-image: url(../images/home-bg-3.jpg);
        background-position: left top;
    }

    #blog-fp .bg-teeth {
        background-image: url(../images/bg-zab.png);
        background-position: left -200px top;
    }

    #blog-fp .text-numbers {
        size: 28px;
    }

    #blog-fp .text-numbers-bg {
        font-size: 220px;
        margin: -205px auto 0px auto;
    }
}

/* Large desktops and laptops */
@media (min-width: 1200px) and (max-width: 1399px) {
    /* GENERAL */

    .name {
        font-size: 28px;
        line-height: 1.4;
    }

    .name-small {
        font-size: 15px;
        line-height: 1.4;
    }

    .title {
        font-size: 20px;
        line-height: 1.2;
    }

    .text {
        font-size: 15px;
        line-height: 1.4;
    }

    /* HEADER */

    a.header-btn-link {
        font-size: 18px;
    }

    a.header-btn-link .header-btn-icon {
        width: auto;
        height: 42px;
    }

    .front-header {
        padding: 0rem;
        height: 520px;
    }

    .front-header .header-name {
        font-size: 60px;
        margin: -100px 0px 20px 0px;
    }

    .front-header .header-title {
        font-size: 38px;
        margin: 20px 0px 0px 0px;
    }

    .header-photos-size {
        width: 90%;
    }

    .front-header-info {
        padding-bottom: 50px;
    }

    .header-phone a:link,
    .header-phone a:visited,
    .header-phone a:hover,
    .header-phone a:active {
        background-image: url(../images/icon-header-001.png);
        background-position: left 15px top 10px;
        background-repeat: no-repeat;
        display: inline;
        float: left;
        font-family: "Ubuntu", sans-serif;
        font-weight: 600;
        font-size: 18px;
        font-style: normal;
        color: #ffffff;
        /* margin: 80px 0px 0px 0px; */
        padding: 22px 25px 23px 85px;
        background-color: #004165;
        border: 2px solid #004165;
        border-radius: 10px;
    }

    .header-registration {
        font-size: 18px;
        /* margin: 80px 0px 0px 0px; */
    }

    .header-registration a:link,
    .header-registration a:visited {
        background-image: url(../images/icon-header-002.png);
        background-position: left 20px top 10px;
        background-repeat: no-repeat;
        padding: 28px 25px 28px 85px;
        border-radius: 10px;
    }

    .header-registration a:hover,
    .header-registration a:active {
        background-image: url(../images/icon-header-002.png);
        background-position: left 20px top 10px;
        background-repeat: no-repeat;
        padding: 28px 25px 28px 85px;
        border-radius: 10px;
    }

    /* NAVBAR */

    .navbar-logo-size {
        max-width: 280px;
        height: auto;
    }

    /* .nav-link { font-size: 16px; line-height: 1.2; display: block; padding: 10px 10px !important; } .navbar-phone { font-size: 16px; padding: 12px 20px; border-radius: 10px; margin: 0px 0px 0px 20px; } .navbar-registration {   font-size: 16px;  margin: 12px 0px 0px 8px; } .navbar-registration a:link, .navbar-registration a:visited { padding: 15px 20px; border-radius: 10px; } .navbar-registration a:hover, .navbar-registration a:active { padding: 15px 20px; border-radius: 10px; }     */
    /* OFERTA */

    #oferta {
        padding: 60px 0px 80px 0px;
    }

    #oferta .name-small {
        margin-bottom: 40px;
    }

    #oferta .item-bg {
        margin: 12px 0px 12px 0px;
        height: 110px;
    }

    #oferta .item-bg:hover {
        margin: 12px 0px 12px 0px;
        height: 110px;
    }

    #oferta .title-oferta {
        font-size: 18px;
        font-weight: 600;
        line-height: 1.2;
    }

    /* ZESPOL */

    #zespol {
        background-image: url(../images/home-bg-1.png), url(../images/bg-zab.png);
        background-position:
            left -360px bottom 70px,
            right -230px bottom;
        background-size:
            727px 302px,
            500px 578px;
        height: 590px;
    }

    #zespol .name-zespol {
        font-size: 34px;
        line-height: 1.2;
        padding: 20px 0px 20px 20px;
    }

    #zespol .text {
        font-size: 17px;
        padding: 10px 0px 00px 20px;
    }

    #zespol .signature {
        font-family: "Satisfy", cursive;
        font-size: 28px;
        color: #004165;
        padding: 30px 0px 0px 20px;
    }

    /* ZESPOL KARUZELA */

    #team-carousel .team-item-bg {
        border-radius: 20px;
        /* out */
        margin: 140px 10px 20px 10px;
        /* out */
        height: 240px;
        /* out */
    }

    #team-carousel .title-person {
        font-size: 20px;
        line-height: 1.2;
    }

    #team-carousel .title-type {
        font-size: 16px;
        line-height: 1.2;
    }

    #team-carousel .text-specialization {
        font-size: 15px;
        line-height: 1.4;
    }

    #team-carousel .photo-person {
        margin: -90px 0px 0px 15px;
    }

    #team-carousel .photo-person-size {
        width: 240px;
    }

    .team-carousel-more {
        font-size: 15px;
    }

    .carousel-control-prev {
        margin-top: 140px;
        margin-left: -40px;
    }

    .carousel-control-next {
        margin-top: 140px;
        margin-right: -40px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 30px;
        height: 58px;
    }

    /* O NAS */

    #aboutus {
        margin: 60px 0px;
        padding: 30px 0px 80px 0px;
        background-image: url(../images/home-bg-2a.png);
        background-position: right -360px bottom;
        z-index: 10;
        height: 600px;
    }

    #aboutus .name {
        font-size: 34px;
        padding: 0px 20px 0px 0px;
        margin-bottom: 30px;
        line-height: 1.2;
    }

    .aboutus-more {
        font-size: 15px;
    }

    /* BLOG FRONT PAGE */

    #blog-fp {
        padding: 0px 0px 100px 0px;
        background-image: url(../images/home-bg-3.jpg);
        background-position: left top;
    }

    #blog-fp .bg-teeth {
        background-image: url(../images/bg-zab.png);
        background-position: left -200px top;
        background-size: 500px 578px;
    }

    #blog-fp .text-numbers-item {
        margin: 150px 0px 70px 0px;
    }

    #blog-fp .text-numbers {
        size: 28px;
    }

    #blog-fp .text-numbers-bg {
        font-size: 180px;
        margin: -170px auto 0px auto;
    }
}

/* Landscape tablets and medium desktops */
@media (min-width: 992px) and (max-width: 1199px) {
    /* GENERAL */

    .name {
        font-size: 22px;
        line-height: 1.4;
    }

    .name-small {
        font-size: 14px;
        line-height: 1.4;
    }

    .title {
        font-size: 17px;
        line-height: 1.2;
    }

    .text {
        font-size: 14px;
        line-height: 1.4;
    }

    /* HEADER */
    a.header-btn-link {
        font-size: 16px;
    }

    a.header-btn-link .header-btn-icon {
        width: auto;
        height: 42px;
    }

    .front-header {
        padding: 0rem;
        height: 420px;
    }

    .front-header-info {
        padding-bottom: 50px;
    }

    .front-header .header-name {
        font-size: 50px;
        line-height: 1.2;
        margin: -80px 0px 20px 0px;
    }

    .front-header .header-title {
        font-size: 30px;
        line-height: 1.2;
        margin: 20px 0px 0px 0px;
    }

    .header-photos-size {
        width: 90%;
    }

    .header-info {
        margin-top: 49px;
    }

    .header-phone a:link,
    .header-phone a:visited,
    .header-phone a:hover,
    .header-phone a:active {
        background-image: url(../images/icon-header-001.png);
        background-position: left 15px top 10px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        display: inline;
        float: left;
        font-family: "Ubuntu", sans-serif;
        font-weight: 600;
        font-size: 16px;
        font-style: normal;
        color: #ffffff;
        /* margin: 49px 0px 0px 0px; */
        padding: 18px 25px 18px 85px;
        background-color: #004165;
        border: 2px solid #004165;
        border-radius: 10px;
    }

    .header-registration {
        font-size: 16px;
        /* margin: 49px 0px 0px 0px; */
    }

    .header-registration a:link,
    .header-registration a:visited {
        background-image: url(../images/icon-header-002.png);
        background-position: left 20px top 12px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        padding: 24px 25px 24px 70px;
        border-radius: 10px;
    }

    .header-registration a:hover,
    .header-registration a:active {
        background-image: url(../images/icon-header-002.png);
        background-position: left 20px top 12px;
        background-repeat: no-repeat;
        padding: 24px 25px 24px 70px;
        border-radius: 10px;
    }

    /* NAVBAR */

    /* .navbar-logo-size { width: 210px; } .nav-link { font-size: 15px; line-height: 1.2; display: block; padding: 8px 8px !important; } .navbar-phone { font-size: 15px; padding: 12px 8px; border-radius: 6px; margin: 0px 0px 0px 6px; } .navbar-registration {   font-size: 15px;  margin: 12px 0px 0px 4px; } .navbar-registration a:link, .navbar-registration a:visited { padding: 15px 8px; border-radius: 6px; } .navbar-registration a:hover, .navbar-registration a:active { padding: 15px 8px; border-radius: 6px; } */
    /* OFERTA */

    #oferta {
        padding: 40px 0px;
    }

    #oferta .name-small {
        margin-bottom: 40px;
    }

    #oferta .item-bg {
        margin: 12px 0px 12px 0px;
        height: 100px;
    }

    #oferta .item-bg:hover {
        margin: 12px 0px 12px 0px;
        height: 100px;
    }

    #oferta .title-oferta {
        font-size: 17px;
        font-weight: 600;
        line-height: 1.2;
        padding-left: 25px;
    }

    #oferta .icon-oferta-size {
        width: 60px;
    }

    /* ZESPOL */

    #zespol {
        background-image: url(../images/home-bg-1.png), url(../images/bg-zab.png);
        background-position:
            left -420px bottom 30px,
            right -180px bottom;
        background-size:
            727px 302px,
            400px 462px;
        height: 460px;
    }

    #zespol .name-zespol {
        font-size: 30px;
        line-height: 1.2;
        padding: 20px 0px 20px 20px;
    }

    #zespol .text {
        font-size: 14px;
        padding: 10px 0px 0px 20px;
    }

    #zespol .signature {
        font-family: "Satisfy", cursive;
        font-size: 24px;
        color: #004165;
        padding: 20px 0px 0px 20px;
    }

    /* ZESPOL KARUZELA */

    #team-carousel .team-item-bg {
        border-radius: 20px;
        /* out */
        margin: 80px 10px 0px 10px;
        /* out */
        height: 200px;
        /* out */
    }

    #team-carousel .title-person {
        font-size: 18px;
        line-height: 1.2;
    }

    #team-carousel .title-type {
        font-size: 15px;
        line-height: 1.2;
    }

    #team-carousel .text-specialization {
        font-size: 15px;
        line-height: 1.4;
    }

    #team-carousel .photo-person {
        margin: -48px 0px 0px 0px;
    }

    #team-carousel .photo-person-size {
        width: 180px;
    }

    .team-carousel-more {
        font-size: 15px;
    }

    .carousel-control-prev {
        margin-top: 140px;
        margin-left: -20px;
    }

    .carousel-control-next {
        margin-top: 140px;
        margin-right: -20px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 24px;
        height: 46px;
    }

    /* O NAS */

    #aboutus {
        margin: 30px 0px;
        padding: 30px 0px 80px 0px;
        background-image: url(../images/home-bg-2a.png);
        background-position: right -420px bottom;
        z-index: 10;
        height: 540px;
    }

    #aboutus .name {
        font-size: 30px;
        padding: 0px 20px 0px 0px;
        margin-bottom: 30px;
    }

    .aboutus-more {
        font-size: 15px;
    }

    .aboutus-icon-size {
        margin-right: 20px;
        width: 60px;
    }

    /* BLOG FRONT PAGE */

    #blog-fp {
        padding: 0px 0px 100px 0px;
        background-image: url(../images/home-bg-3.jpg);
        background-position: left top;
    }

    #blog-fp .bg-teeth {
        background-image: url(../images/bg-zab.png);
        background-position: left -200px top;
        background-size: 500px 578px;
    }

    #blog-fp .text-numbers-item {
        margin: 130px 0px 70px 0px;
    }

    #blog-fp .text-numbers {
        size: 28px;
    }

    #blog-fp .text-numbers-bg {
        font-size: 158px;
        margin: -140px auto 0px auto;
    }

    /* FOOTER */

    #footer {
        padding: 80px 0px 0px 0px;
        background-color: #004165;
    }

    #footer .logo {
        margin: 0px 0px 50px 0px;
    }

    #footer .title {
        font-size: 17px;
        padding-bottom: 30px;
    }

    #footer ul {
        font-size: 15px;
        line-height: 1.9;
    }

    /* COPYRIGHT */

    #copyright {
        padding: 0px 0px 40px 0px;
        background-color: #004165;
    }

    #copyright .text {
        font-size: 13px;
    }
}

/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
    /* GENERAL */

    .name {
        font-size: 22px;
        line-height: 1.4;
    }

    .name-small {
        font-size: 14px;
        line-height: 1.4;
    }

    .title {
        font-size: 17px;
        line-height: 1.2;
    }

    .text {
        font-size: 14px;
        line-height: 1.4;
    }

    /* HEADER */

    a.header-btn-link {
        font-size: 16px;
    }

    a.header-btn-link .header-btn-icon {
        width: auto;
        height: 42px;
    }

    .front-header {
        padding: 0rem;
        height: 420px;
    }

    .front-header-info {
        padding-bottom: 0;
    }

    .front-header .header-name {
        font-size: 40px;
        line-height: 1.2;
        margin: -100px 0px 20px 0px;
    }

    .front-header .header-title {
        font-size: 26px;
        line-height: 1.2;
        margin: 20px 0px 0px 0px;
    }

    .header-photos-size {
        width: 100%;
    }

    .header-info {
        margin-top: 49px;
    }

    .header-phone a:link,
    .header-phone a:visited,
    .header-phone a:hover,
    .header-phone a:active {
        background-image: url(../images/icon-header-001.png);
        background-position: left 15px top 10px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        display: inline;
        float: left;
        font-family: "Ubuntu", sans-serif;
        font-weight: 600;
        font-size: 16px;
        font-style: normal;
        color: #ffffff;
        /* margin: 49px 0px 0px 0px; */
        padding: 18px 25px 18px 68px;
        background-color: #004165;
        border: 2px solid #004165;
        border-radius: 10px;
    }

    .header-registration {
        font-size: 16px;
        /* margin: 49px 0px 0px 0px; */
    }

    .header-registration a:link,
    .header-registration a:visited {
        background-image: url(../images/icon-header-002.png);
        background-position: left 20px top 12px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        padding: 24px 25px 24px 70px;
        border-radius: 10px;
    }

    .header-registration a:hover,
    .header-registration a:active {
        background-image: url(../images/icon-header-002.png);
        background-position: left 20px top 12px;
        background-repeat: no-repeat;
        padding: 24px 25px 24px 70px;
        border-radius: 10px;
    }

    /* NAVBAR */

    /* .navbar-logo-size { width: 210px; } .nav-link { font-size: 15px; line-height: 1.2; display: block; padding: 8px 8px !important; } .navbar-phone { font-size: 15px; padding: 12px 8px; border-radius: 6px; margin: 0px 0px 0px 6px; } .navbar-registration {   font-size: 15px;  margin: 12px 0px 0px 4px; } .navbar-registration a:link, .navbar-registration a:visited { padding: 15px 8px; border-radius: 6px; } .navbar-registration a:hover, .navbar-registration a:active { padding: 15px 8px; border-radius: 6px; }     */
    .navbar-toggler {
        border: 1px solid #c2d5e3;
    }

    .navbar-toggler-icon {
        display: inline-block;
        width: 1.5em;
        height: 1.5em;
        background-image: var(--bs-navbar-toggler-icon-bg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
    }

    /* OFERTA */

    #oferta {
        padding: 40px 0px;
    }

    #oferta .name-small {
        margin-bottom: 40px;
    }

    #oferta .item-bg {
        margin: 12px 0px 12px 0px;
        height: 90px;
    }

    #oferta .item-bg:hover {
        margin: 12px 0px 12px 0px;
        height: 90px;
    }

    #oferta .title-oferta {
        font-size: 15px;
        font-weight: 600;
        line-height: 1.2;
        padding-left: 15px;
    }

    .icon-oferta-size {
        width: 46px;
        height: auto;
    }

    /* ZESPOL */

    #zespol {
        background-image: url(../images/home-bg-1.png), url(../images/bg-zab.png);
        background-position:
            left -520px bottom 80px,
            right -200px bottom;
        background-size:
            727px 302px,
            350px 404px;
        height: 420px;
    }

    #zespol .name-zespol {
        font-size: 26px;
        line-height: 1.2;
        padding: 0px 0px 0px 20px;
    }

    #zespol .text {
        font-size: 14px;
        padding: 10px 0px 0px 20px;
    }

    #zespol .signature {
        font-family: "Satisfy", cursive;
        font-size: 20px;
        color: #004165;
        padding: 10px 0px 0px 20px;
    }

    /* ZESPOL KARUZELA */

    #team-carousel .team-item-bg {
        border-radius: 20px;
        /* out */
        margin: 50px 10px 0px 10px;
        /* out */
        height: 200px;
        /* out */
    }

    #team-carousel .title-person {
        font-size: 16px;
        line-height: 1.2;
    }

    #team-carousel .title-type {
        font-size: 14px;
        line-height: 1.2;
    }

    #team-carousel .text-specialization {
        font-size: 14px;
        line-height: 1.3;
    }

    #team-carousel .photo-person {
        margin: 6px 0px 0px 0px;
    }

    #team-carousel .photo-person-size {
        width: 140px;
    }

    .team-carousel-more {
        font-size: 15px;
        margin: 15px 0px 0px 0px;
    }

    .team-carousel-more a:link,
    .team-carousel-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .team-carousel-more a:hover,
    .team-carousel-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .carousel-control-prev {
        margin-top: 50px;
        margin-left: -20px;
    }

    .carousel-control-next {
        margin-top: 50px;
        margin-right: -20px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 24px;
        height: 46px;
    }

    /* O NAS */

    #aboutus {
        margin: 30px 0px;
        padding: 30px 0px 80px 0px;
        background-image: url(../images/home-bg-2a.png);
        background-position: right -520px bottom;
        z-index: 10;
        height: 460px;
    }

    #aboutus .name {
        font-size: 26px;
        padding: 0px 20px 0px 0px;
        margin-bottom: 0px;
    }

    #aboutus .title {
        padding: 20px 20px 0px 0px;
    }

    .aboutus-more {
        font-size: 15px;
        margin: 30px 20px 0px 0px;
    }

    .aboutus-more a:link,
    .aboutus-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-more a:hover,
    .aboutus-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-icon-size {
        margin-right: 20px;
        width: 46px;
        height: auto;
    }

    /* BLOG FRONT PAGE */

    #blog-fp {
        padding: 0px 0px 40px 0px;
        background-image: url(../images/home-bg-3.jpg);
        background-position: left bottom;
    }

    #blog-fp .bg-teeth {
        background-image: url(../images/bg-zab.png);
        background-position: left -200px top;
        background-size: 350px 404px;
    }

    #blog-fp .text-numbers-item {
        margin: 100px 0px 70px 0px;
    }

    #blog-fp .text-numbers {
        size: 20px !important;
        line-height: 1.3;
    }

    #blog-fp .text-numbers-bg {
        font-size: 120px;
        margin: -115px auto 0px auto;
    }

    /* FOOTER */

    #footer {
        padding: 100px 0px 0px 0px;
        background-image: url(../images/bg-zab.png);
        background-position: right -60px bottom -60px;
        background-size: 350px 404px;
        background-repeat: no-repeat, no-repeat;
        background-color: #004165;
    }

    #footer .logo {
        margin: 0px 0px 50px 0px;
    }

    #footer .title {
        font-size: 17px;
        padding-bottom: 30px;
    }

    #footer ul {
        font-size: 15px;
        line-height: 1.9;
    }

    #footer .local {
        padding: 0px 0px 50px 0px;
    }

    /* COPYRIGHT */

    #copyright {
        padding: 0px 0px 40px 0px;
        background-color: #004165;
    }

    #copyright .text {
        font-size: 13px;
    }
}

/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
    /* GENERAL */

    .name {
        font-size: 22px;
        line-height: 1.4;
    }

    .name-small {
        font-size: 15px;
        line-height: 1.4;
    }

    .title {
        font-size: 17px;
        line-height: 1.2;
    }

    .text {
        font-size: 15px;
        line-height: 1.4;
    }

    /* HEADER */
    a.header-btn-link {
        font-size: 15px;
    }

    a.header-btn-link .header-btn-icon {
        width: auto;
        height: 42px;
    }

    .front-header {
        padding: 0rem;
        height: 420px;
    }

    .front-header-info {
        padding-bottom: 20px;
    }

    .front-header .header-name {
        font-size: 30px;
        line-height: 1.2;
        margin: 0px 0px 20px 0px;
    }

    .front-header .header-title {
        font-size: 22px;
        line-height: 1.2;
        margin: 20px 0px 0px 0px;
    }

    .header-photos-size {
        width: 100%;
    }

    .header-info {
        margin-top: 49px;
    }

    .header-phone a:link,
    .header-phone a:visited,
    .header-phone a:hover,
    .header-phone a:active {
        background-image: url(../images/icon-header-001.png);
        background-position: left 10px top 10px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        display: inline;
        float: left;
        font-family: "Ubuntu", sans-serif;
        font-weight: 600;
        font-size: 15px;
        font-style: normal;
        color: #ffffff;
        /* margin: 49px 0px 0px 0px; */
        padding: 18px 25px 18px 60px;
        background-color: #004165;
        border: 2px solid #004165;
        border-radius: 10px;
    }

    .header-registration {
        font-size: 15px;
        /* margin: 49px 0px 0px 0px; */
    }

    .header-registration a:link,
    .header-registration a:visited {
        background-image: url(../images/icon-header-002.png);
        background-position: left 10px top 12px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        padding: 24px 32px 24px 64px;
        border-radius: 10px;
    }

    .header-registration a:hover,
    .header-registration a:active {
        background-image: url(../images/icon-header-002.png);
        background-position: left 10px top 12px;
        background-repeat: no-repeat;
        padding: 24px 32px 24px 64px;
        border-radius: 10px;
    }

    /* NAVBAR */

    /* .navbar-logo-size { width: 230px; } .nav-link { font-size: 15px; line-height: 1.2; display: block; padding: 8px 8px !important; } .navbar-phone { font-size: 15px; padding: 12px 8px; border-radius: 6px; margin: 0px 0px 0px 6px; } .navbar-registration {   font-size: 15px;  margin: 12px 0px 0px 4px; } .navbar-registration a:link, .navbar-registration a:visited { padding: 15px 8px; border-radius: 6px; } .navbar-registration a:hover, .navbar-registration a:active { padding: 15px 8px; border-radius: 6px; }     */
    .navbar-toggler {
        border: 1px solid #c2d5e3;
    }

    .navbar-toggler-icon {
        display: inline-block;
        width: 1.5em;
        height: 1.5em;
        background-image: var(--bs-navbar-toggler-icon-bg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
    }

    /* OFERTA */

    #oferta {
        padding: 20px 0px 40px 0px;
    }

    #oferta .name-small {
        margin-bottom: 40px;
    }

    #oferta .item-bg {
        margin: 12px 0px 12px 0px;
        height: 80px;
    }

    #oferta .item-bg:hover {
        margin: 12px 0px 12px 0px;
        height: 80px;
    }

    #oferta .title-oferta {
        font-size: 15px;
        font-weight: 600;
        line-height: 1.2;
        padding-left: 15px;
    }

    .icon-oferta-size {
        width: 46px;
        height: auto;
    }

    /* ZESPOL */

    #zespol {
        background-image: url(../images/bg-zab.png);
        background-position: right -160px bottom 0px;
        background-size: 350px 404px;
        height: auto;
    }

    #zespol .title {
        padding: 100px 0px 0px 20px;
    }

    #zespol .name-zespol {
        font-size: 32px;
        line-height: 1.2;
        padding: 40px 0px 0px 20px;
    }

    #zespol .text {
        font-size: 15px;
        padding: 10px 0px 0px 20px;
    }

    #zespol .signature {
        font-family: "Satisfy", cursive;
        font-size: 24px;
        color: #004165;
        padding: 20px 0px 40px 20px;
    }

    /* ZESPOL KARUZELA */

    #team-carousel .team-item-bg {
        border-radius: 20px;
        /* out */
        margin: 110px 10px 0px 10px;
        /* out */
        height: 200px;
        /* out */
    }

    #team-carousel .title-person {
        font-size: 17px;
        line-height: 1.2;
    }

    #team-carousel .title-type {
        font-size: 15px;
        line-height: 1.2;
    }

    #team-carousel .text-specialization {
        font-size: 15px;
        line-height: 1.3;
    }

    #team-carousel .photo-person {
        margin: -62px 0px 0px 0px;
    }

    #team-carousel .photo-person-size {
        width: 190px;
    }

    .team-carousel-more {
        font-size: 15px;
        margin: 15px 0px 0px 0px;
    }

    .team-carousel-more a:link,
    .team-carousel-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .team-carousel-more a:hover,
    .team-carousel-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .carousel-control-prev {
        margin-top: 50px;
        margin-left: -20px;
    }

    .carousel-control-next {
        margin-top: 50px;
        margin-right: -20px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 24px;
        height: 46px;
    }

    /* O NAS */

    #aboutus {
        margin: 30px 0px;
        padding: 30px 0px 30px 0px;
        height: auto;
        background-image: none;
    }

    #aboutus .name {
        font-size: 26px;
        padding: 0px 20px 0px 0px;
        margin-bottom: 0px;
    }

    #aboutus .title {
        padding: 20px 20px 0px 0px;
    }

    .aboutus-more {
        font-size: 15px;
        margin: 30px 20px 50px 0px;
    }

    .aboutus-more a:link,
    .aboutus-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-more a:hover,
    .aboutus-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-icon-size {
        margin-right: 20px;
        width: 56px;
        height: auto;
    }

    /* BLOG FRONT PAGE */

    #blog-fp {
        padding: 0px 0px 40px 0px;
        background-image: url(../images/home-bg-3.jpg);
        background-position: left bottom;
    }

    #blog-fp .bg-teeth {
        background-image: url(../images/bg-zab.png);
        background-position: left -200px top;
        background-size: 350px 404px;
    }

    #blog-fp .text-numbers-item {
        margin: 100px 0px 70px 0px;
    }

    #blog-fp .text-numbers {
        size: 20px !important;
        line-height: 1.3;
    }

    #blog-fp .text-numbers-bg {
        font-size: 100px;
        margin: -125px auto 0px auto;
    }

    /* FOOTER */

    #footer {
        padding: 100px 0px 0px 0px;
        background-image: url(../images/bg-zab.png);
        background-position: right -60px bottom -60px;
        background-size: 350px 404px;
        background-repeat: no-repeat, no-repeat;
        background-color: #004165;
    }

    #footer .logo {
        margin: 0px 0px 50px 0px;
    }

    #footer .title {
        font-size: 17px;
        padding-bottom: 30px;
    }

    #footer ul {
        font-size: 15px;
        line-height: 1.9;
    }

    #footer .local {
        padding: 0px 0px 50px 0px;
    }

    /* COPYRIGHT */

    #copyright {
        padding: 0px 0px 40px 0px;
        background-color: #004165;
    }

    #copyright .text {
        font-size: 13px;
    }
}

/* Portrait phones and smaller */
@media (max-width: 576px) {
    /* GENERAL */

    .name {
        font-size: 22px;
        line-height: 1.4;
    }

    .name-small {
        font-size: 15px;
        line-height: 1.4;
    }

    .title {
        font-size: 17px;
        line-height: 1.2;
    }

    .text {
        font-size: 15px;
        line-height: 1.4;
    }

    /* HEADER */

    .front-header {
        padding: 0rem;
        height: 820px;
        background-image: url(../images/header-bg-mobile.webp);
    }

    .front-header .header-name {
        font-size: 36px;
        line-height: 1.3;
        margin: 20px 0px 20px 0px;
        text-align: center;
    }

    .front-header .header-title {
        font-size: 24px;
        line-height: 1.2;
        margin: 20px 0px 0px 0px;
        text-align: center;
    }

    .header-photos-size {
        width: 80%;
    }

    .header-phone-item {
        margin: 0px auto;
        -ms-flex-line-pack: center;
        align-content: center;
        justify-content: center;
    }

    .header-info {
        margin-top: 49px;
    }

    .header-phone a:link,
    .header-phone a:visited,
    .header-phone a:hover,
    .header-phone a:active {
        background-image: url(../images/icon-header-001.png);
        background-position: left 10px top 10px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        display: block;
        float: none;
        font-family: "Ubuntu", sans-serif;
        font-weight: 600;
        font-size: 15px;
        font-style: normal;
        color: #ffffff;
        /* margin: 49px auto 0px auto; */
        padding: 18px 25px 18px 60px;
        background-color: #004165;
        border: 2px solid #004165;
        border-radius: 10px;
        width: 238px;
    }

    .header-registration-item {
        justify-content: center;
    }

    .header-registration {
        display: block;
        float: inherit;
        font-size: 15px;
        /* margin: 49px auto 0px auto; */
        text-align: center;
    }

    .header-registration a:link,
    .header-registration a:visited {
        background-image: url(../images/icon-header-002.png);
        background-position: left 10px top 12px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        padding: 24px 32px 24px 64px;
        border-radius: 10px;
    }

    .header-registration a:hover,
    .header-registration a:active {
        background-image: url(../images/icon-header-002.png);
        background-position: left 10px top 12px;
        background-repeat: no-repeat;
        padding: 24px 32px 24px 64px;
        border-radius: 10px;
    }

    .front-header .photos {
        text-align: center;
        margin: 70px auto 0px auto;
    }

    .header-photos-size {
        text-align: center;
        margin: 0px auto;
    }

    /* NAVBAR */

    /* .navbar-logo-size { width: 230px; } .nav-link { font-size: 15px; line-height: 1.2; display: block; padding: 8px 8px !important; } .navbar-phone { font-size: 15px; padding: 12px 8px; border-radius: 6px; margin: 0px 0px 0px 6px; } .navbar-registration {   font-size: 15px;  margin: 12px 0px 0px 4px; } .navbar-registration a:link, .navbar-registration a:visited { padding: 15px 8px; border-radius: 6px; } .navbar-registration a:hover, .navbar-registration a:active { padding: 15px 8px; border-radius: 6px; }     */
    .navbar-toggler {
        border: 1px solid #c2d5e3;
    }

    .navbar-toggler-icon {
        display: inline-block;
        width: 1.5em;
        height: 1.5em;
        background-image: var(--bs-navbar-toggler-icon-bg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
    }

    /* OFERTA */

    #oferta {
        padding: 140px 0px 40px 0px;
    }

    #oferta .name-small {
        margin-bottom: 30px;
    }

    /* #oferta .icon-oferta { margin: 0px auto; text-align: center; } #oferta .icon-oferta-size { margin: 0px auto; text-align: center; }*/
    #oferta .item-bg {
        border-radius: 18px;
        /* out */
        margin: 5px 0px 5px 0px;
        /* out */
        height: auto;
        padding: 10px 0px;
    }

    #oferta .item-bg:hover {
        margin: 5px 0px 5px 0px;
        height: auto;
    }

    #oferta .title-oferta {
        font-size: 16px;
        font-weight: 600;
        line-height: 1.2;
        padding-left: 15px;
        text-align: left;
    }

    .icon-oferta-size {
        width: 56px;
        height: auto;
    }

    /* ZESPOL */

    #zespol {
        background-image:
            /*url(../images/home-bg-1.png), */ url(../images/bg-zab.png);
        background-position:
            /*left -540px bottom 400px, */ right -160px bottom 0px;
        background-size:
            /*727px 302px,*/ 350px 404px;
        height: 880px;
    }

    #zespol .title {
        padding: 100px 0px 0px 20px;
    }

    #zespol .name-zespol {
        font-size: 32px;
        line-height: 1.2;
        padding: 40px 0px 0px 0px;
    }

    #zespol .text {
        font-size: 15px;
        padding: 10px 0px 0px 0px;
    }

    #zespol .signature {
        font-family: "Satisfy", cursive;
        font-size: 24px;
        color: #004165;
        padding: 20px 0px 0px 0px;
    }

    /* ZESPOL KARUZELA */

    #team-carousel .team-item-bg {
        border-radius: 20px;
        /* out */
        margin: 80px 10px 0px 10px;
        /* out */
        height: 180px;
        /* out */
    }

    #team-carousel .title-person {
        font-size: 16px;
        line-height: 1.2;
        margin-left: 40px;
        margin-top: -20px;
    }

    #team-carousel .title-type {
        font-size: 14px;
        line-height: 1.2;
        margin-left: 40px;
    }

    #team-carousel .text-specialization {
        font-size: 14px;
        line-height: 1.3;
        margin-left: 40px;
    }

    #team-carousel .photo-person {
        margin: -41px 0px 0px 0px;
    }

    #team-carousel .photo-person-size {
        width: 160px;
    }

    .team-carousel-more {
        font-size: 14px;
        margin: 15px 0px 0px 35px;
    }

    .team-carousel-more a:link,
    .team-carousel-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .team-carousel-more a:hover,
    .team-carousel-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .carousel-control-prev {
        margin-top: 50px;
        margin-left: -20px;
    }

    .carousel-control-next {
        margin-top: 50px;
        margin-right: -20px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 24px;
        height: 46px;
    }

    /* O NAS */

    #aboutus {
        margin: 10px 0px 30px 0px;
        padding: 30px 0px 80px 0px;
        background-image: none;
        /*background-position: right -520px bottom 200px;*/
        z-index: 10;
        height: 940px;
    }

    #aboutus .name {
        font-size: 32px;
        padding: 0px 20px 0px 0px;
        margin-bottom: 0px;
        line-height: 1.2;
    }

    #aboutus .title {
        padding: 20px 20px 10px 0px;
    }

    .aboutus-more {
        font-size: 15px;
        margin: 40px 20px 80px 0px;
        text-align: left;
    }

    .aboutus-more a:link,
    .aboutus-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-more a:hover,
    .aboutus-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-icon-size {
        margin-right: 20px;
        width: 56px;
        height: auto;
    }

    #aboutus .text-end {
        text-align: left !important;
    }

    /* BLOG FRONT PAGE */

    #blog-fp {
        padding: 0px 0px 40px 0px;
        background-image: url(../images/home-bg-3.jpg);
        background-position: left bottom;
    }

    #blog-fp .bg-teeth {
        background-image: url(../images/bg-zab.png);
        background-position: left -200px top 60px;
        background-size: 350px 404px;
    }

    #blog-fp .entry-item {
        height: calc(100% - 40px);
        margin: 20px 0px 20px 0px;
        border-radius: 20px;
    }

    #blog-fp .text-numbers-item {
        margin: 80px 0px 30px 0px;
    }

    #blog-fp .text-numbers {
        size: 20px !important;
        line-height: 1.3;
    }

    #blog-fp .text-numbers-bg {
        font-size: 110px;
        margin: -110px auto 0px auto;
    }

    /* FOOTER */

    #footer {
        padding: 100px 0px 0px 0px;
        background-image: url(../images/bg-zab.png);
        background-position: right -60px bottom 280px;
        background-size: 350px 404px;
        background-repeat: no-repeat, no-repeat;
        background-color: #004165;
    }

    #footer .logo {
        margin: 0px 0px 50px 0px;
    }

    #footer .title {
        font-size: 17px;
        padding-bottom: 30px;
        padding-top: 30px;
    }

    #footer .text {
        font-size: 14px;
        line-height: 1.6;
    }

    #footer ul {
        font-size: 14px;
        line-height: 1.8;
    }

    /* COPYRIGHT */

    #copyright {
        padding: 0px 0px 40px 0px;
        background-color: #004165;
    }

    #copyright .text {
        font-size: 13px;
    }
}

/* Portrait phones and smaller */
@media (max-width: 480px) {
    /* GENERAL */

    .name {
        font-size: 22px;
        line-height: 1.4;
    }

    .name-small {
        font-size: 15px;
        line-height: 1.4;
    }

    .title {
        font-size: 17px;
        line-height: 1.2;
    }

    .text {
        font-size: 15px;
        line-height: 1.4;
    }

    /* HEADER */

    .front-header {
        padding: 0rem;
        height: 760px;
        background-image: url(../images/header-bg-mobile.webp);
    }

    .front-header .header-name {
        font-size: 40px;
        line-height: 1.1;
        margin: 20px 0px 20px 0px;
        text-align: center;
    }

    .front-header .header-title {
        font-size: 24px;
        line-height: 1.2;
        margin: 20px 0px 0px 0px;
        text-align: center;
    }

    .header-photos-size {
        width: 80%;
    }

    .header-phone-item {
        margin: 0px auto;
        -ms-flex-line-pack: center;
        align-content: center;
    }

    .header-info {
        margin-top: 49px;
    }

    .header-phone a:link,
    .header-phone a:visited,
    .header-phone a:hover,
    .header-phone a:active {
        background-image: url(../images/icon-header-001.png);
        background-position: left 10px top 8px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        display: block;
        float: none;
        font-family: "Ubuntu", sans-serif;
        font-weight: 600;
        font-size: 15px;
        font-style: normal;
        color: #ffffff;
        /* margin: 49px auto 0px auto; */
        padding: 18px 25px 18px 60px;
        background-color: #004165;
        border: 2px solid #004165;
        border-radius: 10px;
        width: 238px;
    }

    .header-registration {
        display: block;
        float: inherit;
        font-size: 15px;
        /* margin: 49px auto 0px auto; */
        text-align: center;
    }

    .header-registration a:link,
    .header-registration a:visited {
        background-image: url(../images/icon-header-002.png);
        background-position: left 10px top 12px;
        background-size: 40px 42px;
        background-repeat: no-repeat;
        padding: 24px 32px 24px 64px;
        border-radius: 10px;
    }

    .header-registration a:hover,
    .header-registration a:active {
        background-image: url(../images/icon-header-002.png);
        background-position: left 10px top 12px;
        background-repeat: no-repeat;
        padding: 24px 32px 24px 64px;
        border-radius: 10px;
    }

    .front-header .photos {
        text-align: center;
        margin: 70px auto 0px auto;
    }

    .header-photos-size {
        text-align: center;
        margin: 0px auto;
        width: 300px;
    }

    /* NAVBAR */

    /* .navbar-logo-size { width: 230px; } .nav-link { font-size: 15px; line-height: 1.2; display: block; padding: 8px 8px !important; } .navbar-phone { font-size: 15px; padding: 12px 8px; border-radius: 6px; margin: 0px 0px 0px 6px; } .navbar-registration {   font-size: 15px;  margin: 12px 0px 0px 4px; } .navbar-registration a:link, .navbar-registration a:visited { padding: 15px 8px; border-radius: 6px; } .navbar-registration a:hover, .navbar-registration a:active { padding: 15px 8px; border-radius: 6px; }     */
    .navbar-toggler {
        border: 1px solid #c2d5e3;
    }

    .navbar-toggler-icon {
        display: inline-block;
        width: 1.5em;
        height: 1.5em;
        background-image: var(--bs-navbar-toggler-icon-bg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
    }

    /* OFERTA */

    #oferta {
        padding: 90px 0px 40px 0px;
    }

    #oferta .name-small {
        margin-bottom: 30px;
    }

    #oferta .item-bg {
        border-radius: 18px;
        /* out */
        margin: 5px 0px 5px 0px;
        /* out */
        height: auto;
        padding: 10px 0px;
    }

    #oferta .item-bg:hover {
        margin: 5px 0px 5px 0px;
        height: auto;
    }

    #oferta .title-oferta {
        font-size: 16px;
        font-weight: 600;
        line-height: 1.2;
        padding-left: 15px;
        text-align: left;
    }

    .icon-oferta-size {
        width: 56px;
        height: auto;
    }

    /* ZESPOL */

    #zespol {
        background-image:
            /*url(../images/home-bg-1.png),*/ url(../images/bg-zab.png);
        background-position:
            /*left -540px bottom 390px,*/ right -160px bottom 0px;
        background-size:
            /*727px 302px,*/ 350px 404px;
        height: auto;
    }

    #zespol .title {
        padding: 100px 0px 0px 20px;
    }

    #zespol .name-zespol {
        font-size: 32px;
        line-height: 1.2;
        padding: 40px 0px 0px 0px;
    }

    #zespol .text {
        font-size: 15px;
        padding: 10px 0px 0px 0px;
    }

    #zespol .signature {
        font-family: "Satisfy", cursive;
        font-size: 24px;
        color: #004165;
        padding: 20px 0px 40px 0px;
    }

    /* ZESPOL KARUZELA */

    #team-carousel .team-item-bg {
        border-radius: 20px;
        /* out */
        margin: 60px 10px 0px 10px;
        /* out */
        height: 180px;
        /* out */
    }

    #team-carousel .title-person {
        font-size: 16px;
        line-height: 1.2;
        margin-left: 40px;
        margin-top: -20px;
    }

    #team-carousel .title-type {
        font-size: 14px;
        line-height: 1.2;
        margin-left: 40px;
    }

    #team-carousel .text-specialization {
        font-size: 14px;
        line-height: 1.3;
        margin-left: 40px;
    }

    #team-carousel .photo-person {
        margin: -41px 0px 0px 0px;
    }

    #team-carousel .photo-person-size {
        width: 160px;
    }

    .team-carousel-more {
        font-size: 14px;
        margin: 15px 0px 0px 35px;
    }

    .team-carousel-more a:link,
    .team-carousel-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .team-carousel-more a:hover,
    .team-carousel-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .carousel-control-prev {
        margin-top: 50px;
        margin-left: -20px;
    }

    .carousel-control-next {
        margin-top: 50px;
        margin-right: -20px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        width: 24px;
        height: 46px;
    }

    /* O NAS */

    #aboutus {
        margin: 20px 0px 30px 0px;
        padding: 00px 0px 80px 0px;
        background-image: none;
        /*background-position: right -520px bottom 0px;*/
        z-index: 10;
        height: 940px;
    }

    #aboutus .name {
        font-size: 32px;
        padding: 0px 20px 0px 0px;
        margin-bottom: 0px;
    }

    #aboutus .title {
        padding: 20px 20px 10px 0px;
    }

    .aboutus-more {
        font-size: 15px;
        margin: 40px 20px 80px 0px;
        text-align: left;
    }

    .aboutus-more a:link,
    .aboutus-more a:visited {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-more a:hover,
    .aboutus-more a:active {
        padding: 8px 12px;
        border-radius: 8px;
    }

    .aboutus-icon-size {
        margin-right: 20px;
        width: 56px;
        height: auto;
    }

    #aboutus .text-end {
        text-align: left !important;
    }

    /* BLOG FRONT PAGE */

    #blog-fp {
        padding: 0px 0px 40px 0px;
        background-image: url(../images/home-bg-3.jpg);
        background-position: left bottom;
    }

    #blog-fp .bg-teeth {
        background-image: url(../images/bg-zab.png);
        background-position: left -200px top;
        background-size: 350px 404px;
    }

    #blog-fp .entry-item {
        height: calc(100% - 40px);
        margin: 20px 0px 20px 0px;
        border-radius: 20px;
    }

    #blog-fp .text-numbers-item {
        margin: 80px 0px 30px 0px;
    }

    #blog-fp .text-numbers {
        size: 20px !important;
        line-height: 1.3;
    }

    #blog-fp .text-numbers-bg {
        font-size: 110px;
        margin: -110px auto 0px auto;
    }

    /* FOOTER */

    #footer {
        padding: 80px 0px 0px 0px;
        background-color: #004165;
    }

    #footer .logo {
        margin: 0px 0px 50px 0px;
    }

    #footer .title {
        font-size: 17px;
        padding-bottom: 30px;
        padding-top: 30px;
    }

    #footer .text {
        font-size: 14px;
        line-height: 1.6;
    }

    #footer ul {
        font-size: 14px;
        line-height: 1.8;
    }

    /* COPYRIGHT */

    #copyright {
        padding: 0px 0px 40px 0px;
        background-color: #004165;
    }

    #copyright .text {
        font-size: 13px;
    }
}

/* =========================== * animations =========================== */
/******************
* Bounce in right *
*******************/
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.slow {
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.slower {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.slowest {
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

/* Added by Andy Meetan */
.delay-250 {
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s;
}

.delay-500 {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

.delay-750 {
    -webkit-animation-delay: 0.75s;
    animation-delay: 0.75s;
}

.delay-1000 {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.delay-1250 {
    -webkit-animation-delay: 1.25s;
    animation-delay: 1.25s;
}

.delay-1500 {
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
}

.delay-1750 {
    -webkit-animation-delay: 1.75s;
    animation-delay: 1.75s;
}

.delay-2000 {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}

.delay-2500 {
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s;
}

.delay-2000 {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}

.delay-2500 {
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s;
}

.delay-3000 {
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
}

.delay-3500 {
    -webkit-animation-delay: 3.5s;
    animation-delay: 3.5s;
}

.bounceInRight,
.bounceInLeft,
.bounceInUp,
.bounceInDown {
    opacity: 0;
    -webkit-transform: translateX(400px);
    -ms-transform: translateX(400px);
    transform: translateX(400px);
}

.fadeInRight,
.fadeInLeft,
.fadeInUp,
.fadeInDown {
    opacity: 0;
    -webkit-transform: translateX(400px);
    -ms-transform: translateX(400px);
    transform: translateX(400px);
}

.flipInX,
.flipInY,
.rotateIn,
.rotateInUpLeft,
.rotateInUpRight,
.rotateInDownLeft,
.rotateDownUpRight,
.rollIn {
    opacity: 0;
}

.lightSpeedInRight,
.lightSpeedInLeft {
    opacity: 0;
    -webkit-transform: translateX(400px);
    -ms-transform: translateX(400px);
    transform: translateX(400px);
}

/***********
* bounceIn *
************/
@-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.3);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
    }

    70% {
        -webkit-transform: scale(0.9);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

@keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.3);
        transform: scale(0.3);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    70% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.bounceIn.go {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
}

/****************
* bounceInRight *
****************/
@-webkit-keyframes bounceInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(400px);
    }

    60% {
        -webkit-transform: translateX(-30px);
    }

    80% {
        -webkit-transform: translateX(10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes bounceInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(400px);
        transform: translateX(400px);
    }

    60% {
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px);
    }

    80% {
        -webkit-transform: translateX(10px);
        transform: translateX(10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.bounceInRight.go {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight;
}

/******************
* Bounce in left *
*******************/
@-webkit-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-400px);
    }

    60% {
        -webkit-transform: translateX(30px);
    }

    80% {
        -webkit-transform: translateX(-10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes bounceInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-400px);
        transform: translateX(-400px);
    }

    60% {
        -webkit-transform: translateX(30px);
        transform: translateX(30px);
    }

    80% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.bounceInLeft.go {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}

/******************
* Bounce in up *
*******************/
@-webkit-keyframes bounceInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(400px);
    }

    60% {
        -webkit-transform: translateY(-30px);
    }

    80% {
        -webkit-transform: translateY(10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes bounceInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(400px);
        transform: translateY(400px);
    }

    60% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    80% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.bounceInUp.go {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp;
}

/******************
* Bounce in down *
*******************/
@-webkit-keyframes bounceInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-400px);
    }

    60% {
        -webkit-transform: translateY(30px);
    }

    80% {
        -webkit-transform: translateY(-10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes bounceInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-400px);
        transform: translateY(-400px);
    }

    60% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
    }

    80% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.bounceInDown.go {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown;
}

/**********
* Fade In *
**********/
@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
        display: block;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
        display: block;
    }
}

.fadeIn {
    opacity: 0;
}

.fadeIn.go {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}

/**********
* Grow in *
***********/
@-webkit-keyframes growIn {
    0% {
        -webkit-transform: scale(0.2);
        opacity: 0;
    }

    50% {
        -webkit-transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        opacity: 1;
    }
}

@keyframes growIn {
    0% {
        -webkit-transform: scale(0.2);
        transform: scale(0.2);
        opacity: 0;
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
}

.growIn {
    -webkit-transform: scale(0.2);
    -ms-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0;
}

.growIn.go {
    -webkit-animation-name: growIn;
    animation-name: growIn;
}

/********
* Shake *
********/
@-webkit-keyframes shake {
    0%,
    100% {
        -webkit-transform: translateX(0);
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-10px);
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(10px);
    }
}

@keyframes shake {
    0%,
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px);
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(10px);
        transform: translateX(10px);
    }
}

.shake.go {
    -webkit-animation-name: shake;
    animation-name: shake;
}

/********
* ShakeUp *
********/
@-webkit-keyframes shakeUp {
    0%,
    100% {
        -webkit-transform: translateY(0);
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateY(-10px);
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateY(10px);
    }
}

@keyframes shakeUp {
    0%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
    }
}

.shakeUp.go {
    -webkit-animation-name: shakeUp;
    animation-name: shakeUp;
}

/*************
* FadeInLeft *
*************/
@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-400px);
        transform: translateX(-400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.fadeInLeft {
    opacity: 0;
    -webkit-transform: translateX(-400px);
    -ms-transform: translateX(-400px);
    transform: translateX(-400px);
}

.fadeInLeft.go {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}

/*************
* FadeInRight *
*************/
@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(400px);
        transform: translateX(400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.fadeInRight {
    opacity: 0;
    -webkit-transform: translateX(400px);
    -ms-transform: translateX(400px);
    transform: translateX(400px);
}

.fadeInRight.go {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
}

/*************
* FadeInUp *
*************/
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(400px);
        transform: translateY(400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.fadeInUp {
    opacity: 0;
    -webkit-transform: translateY(400px);
    -ms-transform: translateY(400px);
    transform: translateY(400px);
}

.fadeInUp.go {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

/*************
* FadeInDown *
*************/
@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-400px);
        transform: translateY(-400px);
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.fadeInDown {
    opacity: 0;
    -webkit-transform: translateY(-400px);
    -ms-transform: translateY(-400px);
    transform: translateY(-400px);
}

.fadeInDown.go {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}

/*****************
* rotateIn *
*****************/
@-webkit-keyframes rotateIn {
    0% {
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(-200deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(0);
        opacity: 1;
    }
}

@keyframes rotateIn {
    0% {
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }
}

.rotateIn.go {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn;
}

/*****************
* rotateInUpLeft *
*****************/
@-webkit-keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(0);
        opacity: 1;
    }
}

@keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }
}

.rotateInUpLeft.go {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft;
}

/*******************
* rotateInDownLeft *
*******************/
@-webkit-keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(-90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(0);
        opacity: 1;
    }
}

@keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }
}

.rotateInDownLeft.go {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft;
}

/******************
* rotateInUpRight *
*******************/
@-webkit-keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: right bottom;
        -webkit-transform: rotate(0);
        opacity: 1;
    }
}

@keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }
}

.rotateInUpRight.go {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight;
}

/********************
* rotateInDownRight *
********************/
@-webkit-keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: right bottom;
        -webkit-transform: rotate(0);
        opacity: 1;
    }
}

@keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0;
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }
}

.rotateInDownRight.go {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight;
}

/*********
* rollIn *
**********/
@-webkit-keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%) rotate(-120deg);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0px) rotate(0deg);
    }
}

@keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%) rotate(-120deg);
        transform: translateX(-100%) rotate(-120deg);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0px) rotate(0deg);
        transform: translateX(0px) rotate(0deg);
    }
}

.rollIn.go {
    -webkit-animation-name: rollIn;
    animation-name: rollIn;
}

/*********
* wiggle *
**********/
@-webkit-keyframes wiggle {
    0% {
        -webkit-transform: skewX(9deg);
    }

    10% {
        -webkit-transform: skewX(-8deg);
    }

    20% {
        -webkit-transform: skewX(7deg);
    }

    30% {
        -webkit-transform: skewX(-6deg);
    }

    40% {
        -webkit-transform: skewX(5deg);
    }

    50% {
        -webkit-transform: skewX(-4deg);
    }

    60% {
        -webkit-transform: skewX(3deg);
    }

    70% {
        -webkit-transform: skewX(-2deg);
    }

    80% {
        -webkit-transform: skewX(1deg);
    }

    90% {
        -webkit-transform: skewX(0deg);
    }

    100% {
        -webkit-transform: skewX(0deg);
    }
}

@keyframes wiggle {
    0% {
        -webkit-transform: skewX(9deg);
        transform: skewX(9deg);
    }

    10% {
        -webkit-transform: skewX(-8deg);
        transform: skewX(-8deg);
    }

    20% {
        -webkit-transform: skewX(7deg);
        transform: skewX(7deg);
    }

    30% {
        -webkit-transform: skewX(-6deg);
        transform: skewX(-6deg);
    }

    40% {
        -webkit-transform: skewX(5deg);
        transform: skewX(5deg);
    }

    50% {
        -webkit-transform: skewX(-4deg);
        transform: skewX(-4deg);
    }

    60% {
        -webkit-transform: skewX(3deg);
        transform: skewX(3deg);
    }

    70% {
        -webkit-transform: skewX(-2deg);
        transform: skewX(-2deg);
    }

    80% {
        -webkit-transform: skewX(1deg);
        transform: skewX(1deg);
    }

    90% {
        -webkit-transform: skewX(0deg);
        transform: skewX(0deg);
    }

    100% {
        -webkit-transform: skewX(0deg);
        transform: skewX(0deg);
    }
}

.wiggle.go {
    -webkit-animation-name: wiggle;
    animation-name: wiggle;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}

/********
* swing *
*********/
@-webkit-keyframes swing {
    20%,
    40%,
    60%,
    80%,
    100% {
        -webkit-transform-origin: top center;
    }

    20% {
        -webkit-transform: rotate(15deg);
    }

    40% {
        -webkit-transform: rotate(-10deg);
    }

    60% {
        -webkit-transform: rotate(5deg);
    }

    80% {
        -webkit-transform: rotate(-5deg);
    }

    100% {
        -webkit-transform: rotate(0deg);
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg);
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg);
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg);
    }

    100% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

.swing.go {
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing;
}

/*******
* tada *
********/
@-webkit-keyframes tada {
    0% {
        -webkit-transform: scale(1);
    }

    10%,
    20% {
        -webkit-transform: scale(0.9) rotate(-3deg);
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale(1.1) rotate(3deg);
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale(1.1) rotate(-3deg);
    }

    100% {
        -webkit-transform: scale(1) rotate(0);
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    10%,
    20% {
        -webkit-transform: scale(0.9) rotate(-3deg);
        transform: scale(0.9) rotate(-3deg);
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale(1.1) rotate(3deg);
        transform: scale(1.1) rotate(3deg);
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale(1.1) rotate(-3deg);
        transform: scale(1.1) rotate(-3deg);
    }

    100% {
        -webkit-transform: scale(1) rotate(0);
        transform: scale(1) rotate(0);
    }
}

.tada.go {
    -webkit-animation-name: tada;
    animation-name: tada;
}

/*********
* wobble *
**********/
@-webkit-keyframes wobble {
    0% {
        -webkit-transform: translateX(0%);
    }

    15% {
        -webkit-transform: translateX(-25%) rotate(-5deg);
    }

    30% {
        -webkit-transform: translateX(20%) rotate(3deg);
    }

    45% {
        -webkit-transform: translateX(-15%) rotate(-3deg);
    }

    60% {
        -webkit-transform: translateX(10%) rotate(2deg);
    }

    75% {
        -webkit-transform: translateX(-5%) rotate(-1deg);
    }

    100% {
        -webkit-transform: translateX(0%);
    }
}

@keyframes wobble {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }

    15% {
        -webkit-transform: translateX(-25%) rotate(-5deg);
        transform: translateX(-25%) rotate(-5deg);
    }

    30% {
        -webkit-transform: translateX(20%) rotate(3deg);
        transform: translateX(20%) rotate(3deg);
    }

    45% {
        -webkit-transform: translateX(-15%) rotate(-3deg);
        transform: translateX(-15%) rotate(-3deg);
    }

    60% {
        -webkit-transform: translateX(10%) rotate(2deg);
        transform: translateX(10%) rotate(2deg);
    }

    75% {
        -webkit-transform: translateX(-5%) rotate(-1deg);
        transform: translateX(-5%) rotate(-1deg);
    }

    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
}

.wobble.go {
    -webkit-animation-name: wobble;
    animation-name: wobble;
}

/********
* pulse *
*********/
@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.pulse.go {
    -webkit-animation-name: pulse;
    animation-name: pulse;
}

/***************
* lightSpeedInRight *
****************/
@-webkit-keyframes lightSpeedInRight {
    0% {
        -webkit-transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: translateX(-20%) skewX(30deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: translateX(0%) skewX(-15deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@keyframes lightSpeedInRight {
    0% {
        -webkit-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: translateX(-20%) skewX(30deg);
        transform: translateX(-20%) skewX(30deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: translateX(0%) skewX(-15deg);
        transform: translateX(0%) skewX(-15deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

.lightSpeedInRight.go {
    -webkit-animation-name: lightSpeedInRight;
    animation-name: lightSpeedInRight;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}

/***************
* lightSpeedInLeft *
****************/
@-webkit-keyframes lightSpeedInLeft {
    0% {
        -webkit-transform: translateX(-100%) skewX(30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: translateX(20%) skewX(-30deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: translateX(0%) skewX(15deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@keyframes lightSpeedInLeft {
    0% {
        -webkit-transform: translateX(-100%) skewX(30deg);
        transform: translateX(-100%) skewX(30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: translateX(20%) skewX(-30deg);
        transform: translateX(20%) skewX(-30deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: translateX(0%) skewX(15deg);
        transform: translateX(0%) skewX(15deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

.lightSpeedInLeft.go {
    -webkit-animation-name: lightSpeedInLeft;
    animation-name: lightSpeedInLeft;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}

/*******
* Flip *
*******/
@-webkit-keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotateY(0);
        -webkit-animation-timing-function: ease-out;
    }

    40% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);
        -webkit-animation-timing-function: ease-out;
    }

    50% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
        -webkit-animation-timing-function: ease-in;
    }

    80% {
        -webkit-transform: perspective(400px) rotateY(360deg) scale(0.95);
        -webkit-animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: perspective(400px) scale(1);
        -webkit-animation-timing-function: ease-in;
    }
}

@keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotateY(0);
        transform: perspective(400px) rotateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    40% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);
        transform: perspective(400px) translateZ(150px) rotateY(170deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    50% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
        transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    80% {
        -webkit-transform: perspective(400px) rotateY(360deg) scale(0.95);
        transform: perspective(400px) rotateY(360deg) scale(0.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: perspective(400px) scale(1);
        transform: perspective(400px) scale(1);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
}

.flip.go {
    -webkit-backface-visibility: visible !important;
    -webkit-animation-name: flip;
    backface-visibility: visible !important;
    animation-name: flip;
}

/**********
* flipInX *
**********/
@-webkit-keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotateX(-10deg);
    }

    70% {
        -webkit-transform: perspective(400px) rotateX(10deg);
    }

    100% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}

@keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotateX(-10deg);
        transform: perspective(400px) rotateX(-10deg);
    }

    70% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        transform: perspective(400px) rotateX(10deg);
    }

    100% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}

.flipInX.go {
    -webkit-backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    backface-visibility: visible !important;
    animation-name: flipInX;
}

/**********
* flipInY *
**********/
@-webkit-keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotateY(-10deg);
    }

    70% {
        -webkit-transform: perspective(400px) rotateY(10deg);
    }

    100% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
}

@keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotateY(-10deg);
        transform: perspective(400px) rotateY(-10deg);
    }

    70% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg);
    }

    100% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
}

.flipInY.go {
    -webkit-backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    backface-visibility: visible !important;
    animation-name: flipInY;
}

/*****************
* Out animations *
*****************/
/************
* bounceOut *
*************/
@-webkit-keyframes bounceOut {
    0% {
        -webkit-transform: scale(1);
    }

    25% {
        -webkit-transform: scale(0.95);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.1);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(0.3);
    }
}

@keyframes bounceOut {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    25% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(0.3);
        transform: scale(0.3);
    }
}

.bounceOut.goAway {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut;
}

/************
* bounceOutUp *
*************/
@-webkit-keyframes bounceOutUp {
    0% {
        -webkit-transform: translateY(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateY(20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
    }
}

@keyframes bounceOutUp {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        transform: translateY(-2000px);
    }
}

.bounceOutUp.goAway {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp;
}

/************
* bounceOutDown *
*************/
@-webkit-keyframes bounceOutDown {
    0% {
        -webkit-transform: translateY(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateY(-20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
    }
}

@keyframes bounceOutDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
        transform: translateY(2000px);
    }
}

.bounceOutDown.goAway {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown;
}

/************
* bounceOutLeft *
*************/
@-webkit-keyframes bounceOutLeft {
    0% {
        -webkit-transform: translateX(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateX(20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
    }
}

@keyframes bounceOutLeft {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
        transform: translateX(-2000px);
    }
}

.bounceOutLeft.goAway {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft;
}

/************
* bounceOutRight *
*************/
@-webkit-keyframes bounceOutRight {
    0% {
        -webkit-transform: translateX(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateX(-20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
    }
}

@keyframes bounceOutRight {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    20% {
        opacity: 1;
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px);
    }
}

.bounceOutRight.goAway {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight;
}

/************
* fadeOut *
*************/
@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.fadeOut.goAway {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}

/************
* fadeOutUp *
*************/
@-webkit-keyframes fadeOutUp {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
    }
}

@keyframes fadeOutUp {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        transform: translateY(-2000px);
    }
}

.fadeOutUp.goAway {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp;
}

/************
* fadeOutDown *
*************/
@-webkit-keyframes fadeOutDown {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
    }
}

@keyframes fadeOutDown {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
        transform: translateY(2000px);
    }
}

.fadeOutDown.goAway {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown;
}

/************
* fadeOutLeft *
*************/
@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
        transform: translateX(-2000px);
    }
}

.fadeOutLeft.goAway {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft;
}

/************
* fadeOutRight *
*************/
@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px);
    }
}

.fadeOutRight.goAway {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight;
}

/************
* flipOutX *
*************/
@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

.flipOutX.goAway {
    -webkit-animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    animation-name: flipOutX;
    backface-visibility: visible !important;
}

/************
* flipOutY *
*************/
@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}

@keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}

.flipOutY {
    -webkit-backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    backface-visibility: visible !important;
    animation-name: flipOutY;
}

/************
* lightSpeedOutRight *
*************/
@-webkit-keyframes lightSpeedOutRight {
    0% {
        -webkit-transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
}

@keyframes lightSpeedOutRight {
    0% {
        -webkit-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
}

.lightSpeedOutRight.goAway {
    -webkit-animation-name: lightSpeedOutRight;
    animation-name: lightSpeedOutRight;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}

/************
* lightSpeedOutLeft *
*************/
@-webkit-keyframes lightSpeedOutLeft {
    0% {
        -webkit-transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(-100%) skewX(30deg);
        opacity: 0;
    }
}

@keyframes lightSpeedOutLeft {
    0% {
        -webkit-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(-100%) skewX(30deg);
        transform: translateX(-100%) skewX(30deg);
        opacity: 0;
    }
}

.lightSpeedOutLeft.goAway {
    -webkit-animation-name: lightSpeedOutLeft;
    animation-name: lightSpeedOutLeft;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}

/************
* rotateOut *
*************/
@-webkit-keyframes rotateOut {
    0% {
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(0);
        opacity: 1;
    }

    100% {
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(200deg);
        opacity: 0;
    }
}

@keyframes rotateOut {
    0% {
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }

    100% {
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0;
    }
}

.rotateOut.goAway {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut;
}

/************
* rotateOutUpLeft *
*************/
@-webkit-keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(0);
        opacity: 1;
    }

    100% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(-90deg);
        opacity: 0;
    }
}

@keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }

    100% {
        -transform-origin: left bottom;
        -transform: rotate(-90deg);
        opacity: 0;
    }
}

.rotateOutUpLeft.goAway {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft;
}

/************
* rotateOutDownLeft *
*************/
@-webkit-keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(0);
        opacity: 1;
    }

    100% {
        -webkit-transform-origin: left bottom;
        -webkit-transform: rotate(90deg);
        opacity: 0;
    }
}

@keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0;
    }
}

.rotateOutDownLeft.goAway {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft;
}

/************
* rotateOutUpRight *
*************/
@-webkit-keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        -webkit-transform: rotate(0);
        opacity: 1;
    }

    100% {
        -webkit-transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        opacity: 0;
    }
}

@keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0;
    }
}

.rotateOutUpRight.goAway {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight;
}

/************
* rollOut *
*************/
@-webkit-keyframes rollOut {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0px) rotate(0deg);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(100%) rotate(120deg);
    }
}

@keyframes rollOut {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0px) rotate(0deg);
        transform: translateX(0px) rotate(0deg);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(100%) rotate(120deg);
        transform: translateX(100%) rotate(120deg);
    }
}

.rollOut.goAway {
    -webkit-animation-name: rollOut;
    animation-name: rollOut;
}

/*****************
* Short Animations
*******************/
/*********************
* fadeInUpShort
*********************/
@-webkit-keyframes fadeInUpShort {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes fadeInUpShort {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.fadeInUpShort {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
}

.fadeInUpShort.go {
    -webkit-animation-name: fadeInUpShort;
    animation-name: fadeInUpShort;
}

/*********************
* fadeInDownShort
*********************/
@-webkit-keyframes fadeInDownShort {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes fadeInDownShort {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.fadeInDownShort {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
}

.fadeInDownShort.go {
    -webkit-animation-name: fadeInDownShort;
    animation-name: fadeInDownShort;
}

/*********************
* fadeInRightShort 
*********************/
@-webkit-keyframes fadeInRightShort {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes fadeInRightShort {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.fadeInRightShort {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
}

.fadeInRightShort.go {
    -webkit-animation-name: fadeInRightShort;
    animation-name: fadeInRightShort;
}

/*********************
* fadeInLeftShort 
*********************/
@-webkit-keyframes fadeInLeftShort {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes fadeInLeftShort {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.fadeInLeftShort {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
}

.fadeInLeftShort.go {
    -webkit-animation-name: fadeInLeftShort;
    animation-name: fadeInLeftShort;
}

/*! ##################################################################################################################### */
:root {
    --oa-body-font-family: "Ubuntu", sans-serif;
    --oa-heading-font-family: "Ubuntu", sans-serif;
    --oa-primary-color: #004165;
    --oa-primary-color-two: #b2cada;
    --oa-secondary-color: #e39479;
    --oa-secondary-color-two: #ce7152;
    --oa-body-font-color: #004165;
    --oa-paragraph-color: #004165;
    --oa-heading-font-color: #004165;
    --oa-menu-highlight-color: #ecf1f5;
    --oa-white: #ffffff;
    /* --oa-primary-color-two: #5956e9;   */
    /* --oa-paragraph-color: #004165;     */
    /* --oa-section-background: #eff7ff;  */
}

.navigation.pager {
    margin-top: 30px;
    color: var(--oa-body-font-color);
}

.navigation.pager ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 0;
    list-style: none;
}

.navigation.pager ul li {
    position: relative;
    padding: 0px 4px;
    margin: 0 4px;
}

.navigation.pager ul li.has-mark:before {
    position: absolute;
    display: block;
    width: 0;
    height: 2px;
    left: 0;
    bottom: 0;
    content: "";
    background-color: var(--oa-primary-color);
    -webkit-transition: width 0.4s ease-in;
    -o-transition: width 0.4s ease-in;
    transition: width 0.4s ease-in;
}

.navigation.pager ul li.has-mark.no-link:before {
    display: none;
}

.navigation.pager ul li.has-mark.active::before,
.navigation.pager ul li.has-mark:hover::before {
    width: 100%;
}

.navigation.pager a {
    color: inherit;
    text-decoration: none;
}

.navigation.pager .nav-btn {
    padding: 0px 7px;
    border-radius: 4px;
    background-color: var(--oa-secondary-color);
}

@media (min-width: 576px) {
    .navigation.pager .nav-btn {
        padding: 4px 12px;
    }
}

.btnBackToTop {
    position: fixed;
    max-width: 100px;
    max-height: 100px;
    padding: 3px 5px;
    right: 30px;
    bottom: 20px;
    border-style: none;
    border-radius: 20px;
    background: none;
    background-color: var(--oa-secondary-color);
    overflow: hidden;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    z-index: 990;
}

.btnBackToTop svg,
.btnBackToTop img {
    max-width: 100%;
    height: auto;
}

.btnBackToTop.is-visible {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.btnBackToTop.btt-default {
    max-width: 40px;
    max-height: 40px;
    padding: 0;
    border-radius: 50%;
    background: none;
    background-color: var(--oa-secondary-color);
}

@media (min-width: 576px) {
    .btnBackToTop.btt-default.is-visible {
        max-width: 64px;
        max-height: 64px;
    }
}

.btnBackToTop.btt-tooth {
    max-width: unset;
    max-height: unset;
    height: 48px;
    width: 48px;
    border-radius: 50%;
    overflow: visible;
}

.btnBackToTop.btt-tooth img {
    position: relative;
    max-width: unset;
    max-height: unset;
    height: 64px;
    width: auto;
    top: -14px;
}

@media (min-width: 576px) {
    .btnBackToTop.btt-tooth {
        height: 64px;
        width: 64px;
    }

    .btnBackToTop.btt-tooth img {
        height: 84px;
        top: -14px;
    }
}

body.admin-bar .mobile-menu {
    top: 50px;
    height: calc(100% - 50px);
}

/* =========================== * Override =========================== */
header {
    z-index: unset;
}

@media (max-width: 576px) {
    .carousel {
        padding-bottom: 50px;
    }

    .carousel-control-prev,
    .carousel-control-next {
        position: absolute;
        display: block;
        height: 30px;
        width: 30px;
        top: calc(100% - 50px);
        left: unset;
        right: 0;
        margin: 10px 0;
        opacity: 1;
    }

    .carousel-control-prev > span,
    .carousel-control-next > span {
        height: 30px;
        width: 30px;
        background-color: var(--oa-secondary-color) !important;
        background-image: none;
        border-radius: 3px;
    }

    .carousel-control-next {
        right: 20px;
    }

    .carousel-control-prev {
        right: 60px;
    }

    .carousel-control-prev > span:before,
    .carousel-control-next > span:before {
        position: relative;
        display: block;
        height: 12px;
        width: 12px;
        top: 10px;
        left: 0;
        border: 0 solid var(--oa-white);
        content: "";
    }

    .carousel-control-prev > span:before {
        left: 10px;
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        border-left-width: 2px;
        border-top-width: 2px;
    }

    .carousel-control-next > span:before {
        left: 8px;
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        border-right-width: 2px;
        border-bottom-width: 2px;
    }
}

/* =========================== * Top Main Menu =========================== */
.custom-container {
    max-width: 1800px;
}

.transparent-header,
.oa-default-header {
    width: 100%;
    height: auto;
    padding: 20px 0;
    font-weight: 500;
    background-color: #b2cada;
    z-index: 1009;
}

.oa-default-header .menu-nav {
    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;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.oa-default-header .navbar-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.oa-default-header .navbar-wrap ~ div {
    padding-left: 5px;
}

.oa-default-header .navbar-wrap ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0 0;
    margin: 0;
}

.oa-default-header .navbar-wrap > ul > li {
    list-style: none;
    display: block;
    position: relative;
    margin-right: 25px;
}

.oa-default-header .navbar-wrap ul li:last-child {
    margin-right: 0;
}

.oa-default-header .navbar-wrap ul li a {
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    text-decoration: none;
    color: var(--oa-body-font-color);
    padding: 10px 0;
    display: block;
    line-height: 1.2;
    position: relative;
    z-index: 1001;
}

.oa-default-header .navbar-wrap > ul > li.menu-item-has-children > a {
    margin-right: 12px;
}

.oa-default-header .navbar-wrap > ul > li.menu-item-has-children > a::after {
    content: "\f0dd";
    font-weight: 700;
    font-family: "Font Awesome 5 Free";
    font-size: 12px;
    line-height: 1em;
    position: absolute;
    right: -12px;
    top: 30%;
    color: var(--oa-heading-font-color);
    -webkit-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
}

.oa-default-header .navbar-wrap > ul > li.menu-item-has-children.active > a::after {
    color: var(--oa-primary-color);
}

.oa-default-header .navbar-wrap > ul > li > a::before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 5px;
    width: 0;
    height: 3px;
    border-radius: 3px;
    background: var(--oa-primary-color);
    -webkit-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
}

.oa-default-header .navbar-wrap > ul > li.active > a::before,
.oa-default-header .navbar-wrap > ul > li > a:hover::before {
    width: 80%;
}

.oa-default-header .navbar-wrap > ul > li.active > a,
.oa-default-header .navbar-wrap > ul > li:hover > a {
    color: var(--oa-primary-color);
}

.oa-default-header .main-menu .navigation li.menu-item-has-children .dropdown-btn {
    display: none;
}

.oa-default-header .navbar-wrap ul li .sub-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    min-width: 230px;
    border: 1px solid #f5f5f5;
    background: var(--oa-white);
    margin: 0 0;
    -webkit-transform: scale(1, 0);
    -ms-transform: scale(1, 0);
    transform: scale(1, 0);
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
    box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
    border-radius: 5px;
    padding: 18px 0;
    display: block;
    visibility: hidden;
    opacity: 0;
    z-index: 1009;
}

.oa-default-header .navbar-wrap ul li .sub-menu .sub-menu {
    right: auto;
    left: 100%;
    top: 0;
}

.oa-default-header .navbar-wrap ul li .sub-menu li {
    margin-left: 0;
    text-align: left;
    display: block;
}

.oa-default-header .navbar-wrap ul li .sub-menu li a {
    padding: 9px 15px 9px 25px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--oa-body-font-color);
    text-transform: capitalize;
    -webkit-transition: background-color 0.4s ease-in-out;
    -o-transition: background-color 0.4s ease-in-out;
    transition: background-color 0.4s ease-in-out;
}

.oa-default-header .navbar-wrap ul li .sub-menu li.active,
.oa-default-header .navbar-wrap ul li .sub-menu li:hover {
    background-color: var(--oa-menu-highlight-color);
}

.oa-default-header .navbar-wrap ul li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.oa-default-header .sticky-menu {
    position: fixed;
    left: 0;
    margin: auto;
    top: 0;
    width: 100%;
    z-index: 1099;
    background: var(--oa-white);
    -webkit-animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown;
    animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    border-radius: 0;
}

.oa-default-header #header-fixed-height.active-height {
    display: block;
    height: 96px;
}

.oa-default-header .navbar-phone,
.oa-default-header .navbar-registration {
    display: inline-block;
    border-radius: 10px;
    font-family: "Ubuntu", sans-serif;
    font-weight: 600;
    font-size: 17px;
    font-style: normal;
    color: #ffffff;
}

.oa-default-header .navbar-phone {
    background-color: #004165;
    margin: 0px 0px 0px 30px;
    padding: 12px 20px;
}

.oa-default-header .navbar-registration {
    margin: 0px 0px 0px 10px;
}

.oa-default-header .navbar-registration a {
    padding: 12px 20px;
    border-radius: inherit;
    color: inherit;
    text-decoration: none;
}

.oa-default-header .navbar-registration a:link,
.oa-default-header .navbar-registration a:visited {
    background-color: #e39479;
}

.oa-default-header .navbar-registration a:hover,
.oa-default-header .navbar-registration a:active {
    background-color: #ce7152;
}

@media (min-width: 1400px) and (max-width: 1599px) {
    .oa-default-header .navbar-wrap ul li a {
        font-size: 16px;
        line-height: 1.2;
    }

    .oa-default-header .navbar-phone,
    .oa-default-header .navbar-registration {
        font-size: 16px;
    }

    .oa-default-header .navbar-phone {
        margin-left: 20px;
    }
}

@media (min-width: 1200px) and (max-width: 1399px) {
    .oa-default-header .navbar-wrap ul li a {
        font-size: 16px;
        line-height: 1.2;
    }

    .oa-default-header .navbar-phone,
    .oa-default-header .navbar-registration {
        font-size: 16px;
    }

    .oa-default-header .navbar-phone {
        margin-left: 20px;
    }

    .oa-default-header .navbar-registration {
        margin-left: 8px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .oa-default-header .navbar-wrap > ul > li {
        margin-right: 15px;
    }

    .oa-default-header .navbar-logo-size {
        width: 210px;
    }

    .oa-default-header .navbar-wrap ul li a {
        font-size: 15px;
        line-height: 1.2;
    }

    .oa-default-header .navbar-phone,
    .oa-default-header .navbar-registration {
        border-radius: 6px;
        font-size: 15px;
    }

    .oa-default-header .navbar-phone {
        padding: 12px 8px;
        margin-left: 6px;
    }

    .oa-default-header .navbar-registration {
        margin-left: 4px;
    }

    .oa-default-header .navbar-registration a {
        padding: 12px 8px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .oa-default-header .navbar-logo-size {
        width: 210px;
    }

    .oa-default-header .navbar-wrap ul li a {
        font-size: 15px;
        line-height: 1.2;
    }

    .oa-default-header .navbar-phone,
    .oa-default-header .navbar-registration {
        border-radius: 6px;
        font-size: 15px;
    }

    .oa-default-header .navbar-phone {
        padding: 12px 8px;
        margin-left: 6px;
    }

    .oa-default-header .navbar-registration {
        margin-left: 4px;
    }
}

@media (max-width: 991px) {
    .oa-default-header .menu-nav {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
}

@media (max-width: 767px) {
    .oa-default-header .navbar-logo-size {
        width: 230px;
    }

    .oa-default-header .navbar-wrap ul li a {
        font-size: 15px;
        line-height: 1.2;
    }

    .oa-default-header .navbar-phone,
    .oa-default-header .navbar-registration {
        border-radius: 6px;
        font-size: 15px;
    }

    .oa-default-header .navbar-phone {
        padding: 12px 8px;
        margin-left: 6px;
    }

    .oa-default-header .navbar-registration {
        margin-left: 4px;
    }
}

.oa-default-header.pinned {
    position: fixed;
    padding: 5px 0;
    border-bottom: 1px solid #e39479;
    -webkit-box-shadow: 0px 5px 5px rgba(137, 139, 142, 0.75);
    box-shadow: 0px 5px 5px rgba(137, 139, 142, 0.75);
}

.oa-default-header.pinned .navbar-logo-size {
    height: 40px;
}

.oa-default-header.pinned .navbar-wrap ul li a {
    padding: 10px 0;
}

/* ============================= * Mobile Menu ============================= */
.nav-outer .mobile-nav-toggler {
    position: relative;
    float: right;
    font-size: 40px;
    line-height: 50px;
    cursor: pointer;
    display: none;
    color: var(--oa-white);
    margin-right: 30px;
    top: 15px;
}

.nav-logo img {
    width: 150px;
}

.mobile-menu {
    position: fixed;
    right: 0;
    top: 0;
    width: 300px;
    padding-right: 30px;
    max-width: 100%;
    height: 100%;
    z-index: 1009;
    border-radius: 0px;
    -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -webkit-transform: translateX(101%);
    -ms-transform: translateX(101%);
    transform: translateX(101%);
}

.mobile-menu .navbar-collapse {
    display: block !important;
}

.mobile-menu .nav-logo {
    position: relative;
    padding: 30px 25px;
    text-align: left;
}

.mobile-menu .navigation li.current > a:before {
    height: 100%;
}

.mobile-menu .menu-box {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--oa-white);
    padding: 0 0;
    z-index: 1005;
    -webkit-box-shadow: -9px 0 14px 0px rgba(0, 0, 0, 0.06);
    box-shadow: -9px 0 14px 0px rgba(0, 0, 0, 0.06);
}

.mobile-menu .mobile-menu-header {
    min-height: 60px;
}

.mobile-menu .close-btn {
    position: absolute;
    right: 15px;
    top: 15px;
    line-height: 30px;
    width: 35px;
    text-align: center;
    font-size: 20px;
    color: var(--oa-heading-font-color);
    cursor: pointer;
    z-index: 1000;
    -webkit-transition: all 0.9s ease;
    -o-transition: all 0.9s ease;
    transition: all 0.9s ease;
}

.mobile-menu a,
.mobile-menu a:hover {
    text-decoration: none;
}

.mobile-menu .navigation {
    position: relative;
    display: block;
    width: 100%;
    float: none;
    margin: 0;
    padding: 0;
}

.mobile-menu .navigation ul {
    padding: 0;
    margin: 0;
}

.mobile-menu .navigation li {
    position: relative;
    display: block;
    border-top: 1px solid var(--oa-menu-highlight-color);
}

.mobile-menu .navigation:last-child {
    border-bottom: 1px solid var(--oa-menu-highlight-color);
}

.mobile-menu .navigation li > ul > li:first-child {
    border-top: 1px solid var(--oa-menu-highlight-color);
}

.mobile-menu .navigation li > a {
    position: relative;
    display: block;
    line-height: 24px;
    padding: 10px 60px 10px 25px;
    font-size: 16px;
    font-weight: 500;
    color: var(--oa-heading-font-color);
    text-transform: capitalize;
    -webkit-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    border: none;
}

.mobile-menu .navigation li ul li > a {
    font-size: 16px;
    margin-left: 20px;
    text-transform: capitalize;
}

.mobile-menu .navigation li ul li ul li a {
    margin-left: 40px;
}

.mobile-menu .navigation li ul li ul li ul li a {
    margin-left: 60px;
}

.mobile-menu .navigation li > a:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 0;
    -webkit-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.mobile-menu .navigation li.menu-item-has-children .dropdown-btn {
    position: absolute;
    right: 15px;
    top: 6px;
    width: 32px;
    height: 32px;
    text-align: center;
    font-size: 16px;
    line-height: 32px;
    color: var(--oa-heading-font-color);
    background: var(--oa-menu-highlight-color);
    cursor: pointer;
    border-radius: 2px;
    -webkit-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    z-index: 1005;
}

.mobile-menu .navigation li.menu-item-has-children .dropdown-btn i {
    -webkit-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.mobile-menu .navigation li.menu-item-has-children .dropdown-btn.open i {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    color: var(--oa-primary-color);
}

.mobile-menu .navigation li.menu-item-has-children .dropdown-btn > span.fas {
    -webkit-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.mobile-menu .navigation li.menu-item-has-children .dropdown-btn.open > span.fas {
    -webkit-transform: rotateZ(180deg);
    -ms-transform: rotate(180deg);
    transform: rotateZ(180deg);
}

.mobile-menu .navigation li > ul,
.mobile-menu .navigation li > ul > li > ul {
    display: none;
}

.mobile-menu .menu-nav-links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    margin-top: 30px;
}

.mobile-menu .menu-nav-links .navbar-phone,
.mobile-menu .menu-nav-links .navbar-registration {
    font-size: inherit;
}

.mobile-menu .menu-nav-links .navbar-phone,
.mobile-menu .menu-nav-links .navbar-registration a {
    padding: 12px 8px;
}

.menu-backdrop {
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1002;
    -webkit-transition: all 700ms ease;
    -o-transition: all 700ms ease;
    transition: all 700ms ease;
    opacity: 0;
    visibility: hidden;
    background: rgba(0, 0, 0, 0.5);
}

.menu-area .mobile-nav-toggler {
    position: relative;
    font-size: 30px;
    cursor: pointer;
    line-height: 1;
    color: var(--oa-primary-color);
    display: none;
    margin-top: 3px;
    margin-right: 10px;
}

.mobile-menu-visible {
    overflow: hidden;
}

.mobile-menu-visible .mobile-menu {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.mobile-menu-visible .mobile-menu .menu-box {
    opacity: 1;
    visibility: visible;
}

.mobile-menu-visible .mobile-menu .mobile-menu .close-btn {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

.mobile-menu-visible .menu-backdrop {
    opacity: 1;
    visibility: visible;
}

/* ============================= * Responsive Menu ============================= */
/* Large devices (desktops, 992px and up) */
@media (max-width: 991px) {
    .container,
    .custom-container {
        max-width: 720px;
    }

    .menu-area {
        padding: 20px 0;
    }

    .menu-area .mobile-nav-toggler {
        display: block;
    }

    .menu-nav {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .menu-outer .navbar-wrap {
        display: block !important;
    }

    .header-action {
        margin-left: auto;
        margin-right: 40px;
    }

    .header-action .offcanvas-menu {
        display: none;
    }
}

.blog-post-list article {
    padding: 20px 15px;
    border: solid 1px #0041650c;
    border-radius: 5px;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition:
        border 0.4s linear,
        -webkit-transform 0.3s linear,
        -webkit-box-shadow 0.3s linear;
    transition:
        border 0.4s linear,
        -webkit-transform 0.3s linear,
        -webkit-box-shadow 0.3s linear;
    -o-transition:
        border 0.4s linear,
        transform 0.3s linear,
        box-shadow 0.3s linear;
    transition:
        border 0.4s linear,
        transform 0.3s linear,
        box-shadow 0.3s linear;
    transition:
        border 0.4s linear,
        transform 0.3s linear,
        box-shadow 0.3s linear,
        -webkit-transform 0.3s linear,
        -webkit-box-shadow 0.3s linear;
}

.blog-post-list article:hover {
    border-color: var(--oa-primary-color);
    -webkit-box-shadow: 0px 0px 5px 1px #00416580;
    box-shadow: 0px 0px 5px 1px #00416580;
    -webkit-transform: scale(1.025);
    -ms-transform: scale(1.025);
    transform: scale(1.025);
}

.blog-post-list .blog-post {
    margin-bottom: 1.5rem;
}

.blog-post-list .post-title {
    margin-bottom: 1.5rem;
}

.blog-post-list .post-title a {
    color: inherit;
    text-decoration: none;
}

.blog-post-list .post-excerpt {
    margin-bottom: 2rem;
    text-align: justify;
}

.blog-post-list .post-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row;
    flex-flow: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.blog-post-list .post-date {
    font-size: 0.875em;
}

.blog-single-post .post-details {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px 0px;
    margin-bottom: 1rem;
}

.blog-single-post .post-details > div:after {
    display: inline-block;
    padding: 0 10px;
    content: "|";
}

.blog-single-post .post-details > div:last-child::after {
    display: none;
    content: "";
}

.blog-single-post .post-author span {
    color: var(--oa-secondary-color);
    font-weight: 700;
}

.blog-post-list.oa-theme .entry-item {
    height: calc(100% - 80px);
    margin: 40px 0px 40px 0px;
    padding: 0px 0px 40px 0px;
    border-radius: 20px;
    background-color: #ffffff;
}

.blog-post-list.oa-theme .entry-photo {
    position: relative;
    z-index: 10;
}

.blog-post-list.oa-theme .entry-photo-size {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    width: 100%;
}

.blog-post-list.oa-theme .entry-category {
    position: relative;
    margin: -20px 25px 0px 25px;
    z-index: 100;
}

.blog-post-list.oa-theme .entry-category a {
    display: inline-block;
    padding: 8px 12px;
}

.blog-post-list.oa-theme .entry-category a:link,
.blog-post-list.oa-theme .entry-category a:visited {
    color: #ffffff;
    text-decoration: none;
}

.blog-post-list.oa-theme .entry-category a:hover,
.blog-post-list.oa-theme .entry-category a:active {
    color: #ffffff;
    text-decoration: none;
}

.blog-post-list.oa-theme .entry-category-bg {
    display: inline-block;
    padding: 0px;
    border-radius: 10px;
    background-color: var(--oa-secondary-color);
}

.blog-post-list.oa-theme .entry-category-bg:hover {
    background-color: var(--oa-secondary-color-two);
}

.blog-post-list.oa-theme .entry-title {
    margin: 30px 25px 0px 25px;
}

.blog-post-list.oa-theme .entry-title a:link,
.blog-post-list.oa-theme .entry-title a:visited {
    color: var(--oa-body-font-color);
    text-decoration: none;
}

.blog-post-list.oa-theme .entry-title a:hover,
.blog-post-list.oa-theme .entry-title a:active {
    color: var(--oa-body-font-color);
    text-decoration: underline;
}

.blog-post-list.oa-theme .entry-content {
    margin: 10px 20px 0;
}

@media (max-width: 576px) {
    .blog-post-list.oa-theme .entry-item {
        height: calc(100% - 40px);
        margin: 20px 0px 20px 0px;
    }
}

/* header mobile */
@media (max-width: 991px) {
    .header-registration-item {
        margin-top: 15px;
    }
}

.homepage-section {
    padding-top: 100px;
}