/* *,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: inherit;
} */
a,
a:link,
a:visited,
a:hover,
a:active {
  text-decoration: none;
  outline: none;
}

html {
  font-size: 62.5%;
}

body {
  font-family: 'Poppins', sans-serif;
  line-height: 1.6;
}

p {
  font-size: 1.6rem;
}

/* 
.navbar{

    border-bottom: $primary-green 3px solid;
    opacity: 0.9;
    box-shadow: 0 1rem 2rem rgba(0,0,0,.1);

    -brand{
        color: $primary-blue;
        // font-size: 1.4rem;
        text-align: center;
        line-height: .5rem;
        //opacity: 1;

        &:hover {
            color: $primary-green;
        }

        .coName-main{
            transition: all 0.5s ease-in-out;

            //&:hover {
            //    color: $primary-green;;
            // }
        }

        .tagLine {
            line-height: .3rem;
            font-style: italic;
            color: $primary-green;
        }
    }

    -nav{

        .nav-link{
            font-size: 1.4rem;
            font-weight: 500;
            color: $secondary-gray-dark;
            text-transform: uppercase;
            padding-left: 1.6rem !important;
            padding-right: 1.6rem !important;
            transition: all .5s ease-in-out;

            &:hover {
                color: $primary-green;
            }
        }

        .nav-item {

            &.active{
                border-left: $primary-green 3px solid;
            }
        }

        .active {

            .nav-link {
                color: $primary-green;
                font-weight: 700;
            }
        }
    }
}
 */
.header-hero {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 70% center;
  background-attachment: fixed;
  background-color: #fff;
  position: relative;
  padding: 15rem 0;
  min-height: 100vh;
  color: #e5e5e5;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr minmax(min-content, 120rem) 1fr;
      grid-template-columns: 1fr minmax(-webkit-min-content, 120rem) 1fr;
      grid-template-columns: 1fr minmax(min-content, 120rem) 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* a {
        margin-top: 3rem;
        font-size: 2rem;
        padding: 1rem 2.5rem;
    } */
}

.header-hero__home {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2))), url(../img/home-header-img.jpg);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(../img/home-header-img.jpg);
}

.header-hero__services {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2))), url(../img/services-header-img.jpg);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(../img/services-header-img.jpg);
  background-position: 30% center;
}

.header-hero__contact {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2))), url(../img/contact-header-img.jpg);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(../img/contact-header-img.jpg);
}

.header-hero__wrapper {
  position: relative;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2 / 3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  padding: 5rem;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  grid-auto-rows: -webkit-min-content;
  grid-auto-rows: min-content;
  grid-row-gap: 1rem;
  justify-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: start;
      align-content: start;
  text-align: center;
}

@media only screen and (max-width: 56.25em) {
  .header-hero__wrapper {
    padding: 5rem 10rem;
  }
}

@media only screen and (max-width: 43.75em) {
  .header-hero__wrapper {
    padding: 5rem;
  }
}

@media only screen and (max-width: 25em) {
  .header-hero__wrapper {
    padding: 5rem 2rem;
  }
}

.header-hero h1 {
  /* text-align: center;
        margin-bottom: 25rem;
        text-transform: uppercase; */
  font-weight: 500;
}

@media only screen and (max-width: 56.25em) {
  .header-hero h1 {
    font-size: 6rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .header-hero h1 {
    font-size: 4.5rem;
  }
}

.header-hero h3 {
  font-weight: 300;
  font-size: 2rem;
}

@media only screen and (max-width: 56.25em) {
  .header-hero h3 {
    font-size: 1.75rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .header-hero h3 {
    font-size: 1.5rem;
  }
}

a.myButton {
  margin-top: 3rem;
  font-size: 2rem;
  padding: 1rem 2.5rem;
}

#caring {
  color: #3f3f3f;
}

#why {
  color: #fff;
  text-align: center;
  min-height: 100vh;
  background-image: url(../img/section-why-img.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  background-color: #fff;
  padding: 15rem 0;
  position: relative;
}

#why .why__wrapper {
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

#benefit .card-benefit {
  color: #fafafa;
}

#benefit .card-benefit .card-title__bold {
  font-weight: 400;
  font-size: 2.5rem;
}

#benefit .benefit-img {
  background: url(../img/section-benefit-img.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 100%;
  min-width: 100%;
}

@media only screen and (max-width: 47.9375em) {
  #benefit .benefit-img {
    height: 40rem;
  }
}

#superb p {
  font-size: 1.7rem;
  font-weight: 300;
  color: #7c7c7c;
}

#superb h4 {
  font-size: 2.5rem;
  font-weight: 400;
}

#superb .row-superb {
  border-bottom: #e2e2e2 1px solid;
}

#superb .row-superb h3 {
  font-weight: 500;
  color: #b9d547;
}

#superb .row-leading .leading-img {
  background: url(../img/section-superb-img.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 100%;
  min-width: 100%;
}

@media only screen and (max-width: 47.9375em) {
  #superb .row-leading .leading-img {
    height: 40rem;
  }
}

@media only screen and (max-width: 35.9375em) {
  #superb {
    text-align: center;
  }
}

#inquire {
  color: #fafafa;
}

#hire {
  color: #555555;
}

#hire .col-hire {
  border-right: #e2e2e2 1px solid;
}

#hire .col-hire h4 {
  font-size: 2.5rem;
  font-weight: 700;
}

#hire .col-hire .hire-img {
  background: url(../img/section-hire-img.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 40rem;
  /* @media only screen and (max-width: 47.9375em) {
                
                height: 40rem;
            } */
}

@media only screen and (max-width: 47.9375em) {
  #hire .col-hire {
    border-right: none;
    border-bottom: #e2e2e2 1px solid;
    padding-bottom: 6rem;
  }
}

#hire .col-schedule .schedule-header {
  font-size: 2rem;
  font-weight: 900;
}

#hire .col-schedule .text-italic {
  font-style: italic;
}

#hire .col-schedule .text-line-height {
  line-height: 1.3;
}

@media only screen and (max-width: 47.9375em) {
  #hire .col-schedule {
    margin-top: 3rem;
  }
}

#main-footer {
  background: #fafafa;
  color: #555555;
  border-top: #e2e2e2 1px solid;
}

#main-footer .row-footer-1 {
  border-bottom: #e2e2e2 1px solid;
}

#main-footer .row-footer-1 .footer-col-title {
  font-size: 1.6rem;
  font-weight: 500;
  color: #4d69b1;
  margin-bottom: 1rem;
}

#main-footer .row-footer-1 .footer-p {
  font-size: 1.3rem;
  font-weight: 400;
}

#main-footer .row-footer-1 a {
  color: #626262;
  font-size: 1.3rem;
  font-weight: 400;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

#main-footer .row-footer-1 a:hover {
  color: #b9d547;
}

@media only screen and (max-width: 35.9375em) {
  #main-footer .row-footer-1 {
    text-align: center;
  }
}

#main-footer .row-footer-2 a {
  color: #626262;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}

#main-footer .row-footer-2 a:hover {
  color: #b9d547;
}

#main-footer .row-footer-2 .footer-manage {
  font-size: 1.2rem;
  color: lighter(#626262, 50%);
}

#main-footer .row-footer-2 .footer-manage .zilchone-link {
  display: block;
  width: 11.2rem;
  height: 3rem;
  -webkit-transform: translateY(-0.8rem);
          transform: translateY(-0.8rem);
}

#main-footer .row-footer-2 .footer-manage .zilchone-link .zilchone-logo {
  display: block;
  width: 11.2rem;
  height: 3rem;
  background: url(../img/zo-top-logo.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

#main-footer .row-footer-2 .footer-manage p {
  display: block;
  width: 11.2rem;
  height: 3rem;
}

/* .navbar-main

    .navbar-branding

        .navbar-logo

        .navbar-name

            .navbar-coName

            .navbar-tagline

    .navbar-btn

    .navbar-icon

        .navbar-icon__line

    .navbar-nav

        .navbar-nav__item

            .navbar-nav__link
 */
.navbar-main {
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100vw;
  padding: 1.5rem 10vw;
  z-index: 100000;
  -webkit-transition: all .8s ease-out;
  transition: all .8s ease-out;
  font-size: 1.6rem;
  color: #fff;
}

.navbar-main a {
  text-decoration: none;
  color: inherit;
  text-transform: uppercase;
}

.navbar-main .navbar-branding {
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.navbar-main .navbar-branding .navbar-name {
  text-align: center;
}

.navbar-main .navbar-branding .navbar-name .navbar-coName {
  font-weight: 700;
  -webkit-transition: all .5s ease-out;
  transition: all .5s ease-out;
  display: block;
}

.navbar-main .navbar-branding .navbar-name .navbar-coName::after {
  content: '';
  display: block;
  height: 2px;
  width: 0;
  background-color: rgba(185, 213, 71, 0.05);
  -webkit-transform: translateY(-3px);
          transform: translateY(-3px);
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}

.navbar-main .navbar-branding .navbar-name .navbar-coName:hover::after {
  width: 100%;
  background-color: #b9d547;
}

.navbar-main .navbar-branding .navbar-name .navbar-tagline {
  font-size: 1rem;
  font-style: italic;
  line-height: .8;
  display: block;
  -webkit-transition: all .5s ease-out;
  transition: all .5s ease-out;
  letter-spacing: .9rem;
  color: #e16941;
  text-transform: uppercase;
  font-weight: 600;
}

.navbar-main .navbar-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  list-style: none;
  padding: 1rem 0;
}

.navbar-main .navbar-nav .navbar-nav__item .navbar-nav__link {
  margin: .32rem;
  padding: 1.6rem .8rem;
  position: relative;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.navbar-main .navbar-nav .navbar-nav__item .navbar-nav__link::after {
  content: '';
  display: block;
  position: absolute;
  bottom: 1.6rem;
  left: 0;
  height: 1px;
  width: 0;
  background-color: transparent;
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}

.navbar-main .navbar-nav .navbar-nav__item .navbar-nav__link:hover {
  color: #b9d547;
}

.navbar-main .navbar-nav .navbar-nav__item .navbar-nav__link:hover::after {
  width: 100%;
  background-color: #b9d547;
}

.navbar-main .navbar-nav .navbar-nav__item .active {
  color: #b9d547;
}

.navbar-main .navbar-nav .navbar-nav__item .active::after {
  content: '';
  display: block;
  position: absolute;
  bottom: 1.6rem;
  left: 0;
  height: 1px;
  width: 100%;
  background-color: #b9d547;
}

.navbar-main .navbar-icon {
  position: relative;
  padding: 2.6rem 1rem;
  cursor: pointer;
  z-index: 100001;
  display: none;
}

.navbar-main .navbar-icon__line {
  display: block;
  position: relative;
  background: #fff;
  height: .2rem;
  width: 2rem;
  border-radius: .4rem;
  -webkit-transition: all .8s ease;
  transition: all .8s ease;
}

.navbar-main .navbar-icon__line::before, .navbar-main .navbar-icon__line::after {
  content: '';
  display: block;
  position: absolute;
  height: 100%;
  width: 100%;
  border-radius: .4rem;
  background: white;
  -webkit-transition: all .8s ease;
  transition: all .8s ease;
}

.navbar-main .navbar-icon__line::before {
  -webkit-transform: translateY(-0.5rem);
          transform: translateY(-0.5rem);
}

.navbar-main .navbar-icon__line::after {
  -webkit-transform: translateY(0.5rem);
          transform: translateY(0.5rem);
}

@media only screen and (max-width: 47.9375em) {
  .navbar-main .navbar-icon {
    display: block;
  }
  .navbar-main .navbar-icon__line {
    -webkit-animation: closedMid 0.8s backwards;
            animation: closedMid 0.8s backwards;
    animation-direction: reverse;
  }
  .navbar-main .navbar-icon__line::before {
    -webkit-animation: closedTop 0.8s backwards;
            animation: closedTop 0.8s backwards;
    animation-direction: reverse;
  }
  .navbar-main .navbar-icon__line::after {
    -webkit-animation: closedBtm 0.8s backwards;
            animation: closedBtm 0.8s backwards;
    animation-direction: reverse;
  }
  .navbar-main .navbar-nav {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 10rem 0;
    width: 100vw;
    height: 100vh;
    font-size: 3.2rem;
    color: #fff;
    background: #3f3f3f;
    -webkit-transition: opacity .8s .5s,
 -webkit-clip-path 1s .5s;
    transition: opacity .8s .5s,
 -webkit-clip-path 1s .5s;
    transition: opacity .8s .5s,
 clip-path 1s .5s;
    transition: opacity .8s .5s,
 clip-path 1s .5s,
 -webkit-clip-path 1s .5s;
    -webkit-clip-path: circle(200px at top right);
            clip-path: circle(200px at top right);
  }
  .navbar-main .navbar-nav .navbar-nav__item {
    margin: 2rem 0;
    opacity: 0;
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    text-align: center;
  }
  .navbar-main .navbar-nav .navbar-nav__item .navbar-nav__link {
    display: block;
  }
  .navbar-main .navbar-btn:checked ~ .navbar-nav {
    opacity: 1;
    -webkit-clip-path: circle(100% at center);
            clip-path: circle(100% at center);
  }
  .navbar-main .navbar-btn:checked ~ .navbar-nav .navbar-nav__item {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-transition: opacity 0.4s ease-in-out, -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: opacity 0.4s ease-in-out, -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: opacity 0.4s ease-in-out, transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: opacity 0.4s ease-in-out, transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  }
  .navbar-main .navbar-btn:checked ~ .navbar-nav .navbar-nav__item:nth-of-type(1) {
    -webkit-transition-delay: .8s;
            transition-delay: .8s;
  }
  .navbar-main .navbar-btn:checked ~ .navbar-nav .navbar-nav__item:nth-of-type(2) {
    -webkit-transition-delay: .9s;
            transition-delay: .9s;
  }
  .navbar-main .navbar-btn:checked ~ .navbar-nav .navbar-nav__item:nth-of-type(3) {
    -webkit-transition-delay: 1s;
            transition-delay: 1s;
  }
  .navbar-main .navbar-btn:checked ~ .navbar-icon {
    border-radius: 50%;
    -webkit-animation: pulse 1s forwards;
            animation: pulse 1s forwards;
  }
  .navbar-main .navbar-btn:checked ~ .navbar-icon .navbar-icon__line {
    background: #b9d547;
    -webkit-animation: openMid 0.8s forwards;
            animation: openMid 0.8s forwards;
  }
  .navbar-main .navbar-btn:checked ~ .navbar-icon .navbar-icon__line::before {
    background: #b9d547;
    -webkit-animation: openTop 0.8s forwards;
            animation: openTop 0.8s forwards;
  }
  .navbar-main .navbar-btn:checked ~ .navbar-icon .navbar-icon__line::after {
    background: #b9d547;
    -webkit-animation: openBtm 0.8s forwards;
            animation: openBtm 0.8s forwards;
  }
}

.navbar-main .navbar-btn {
  display: none;
}

.navbar-main.scrolled {
  background: white;
  color: #3f3f3f;
  border-bottom: #b9d547 3px solid;
  -webkit-box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
}

.navbar-main.scrolled .navbar-icon__line, .navbar-main.scrolled .navbar-icon__line::before, .navbar-main.scrolled .navbar-icon__line::after {
  background: #b9d547;
}

.navbar-main.scrolled .navbar-coName {
  color: #4d69b1;
}

.navbar-main.scrolled .navbar-coName span {
  color: #b9d547;
  font-weight: 300;
}

@-webkit-keyframes pulse {
  from {
    -webkit-box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.6);
            box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.6);
  }
  to {
    -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0);
            box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0);
    background: rgba(255, 255, 255, 0);
  }
}

@keyframes pulse {
  from {
    -webkit-box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.6);
            box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.6);
  }
  to {
    -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0);
            box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0);
    background: rgba(255, 255, 255, 0);
  }
}

@-webkit-keyframes openTop {
  0% {
    -webkit-transform: translateY(-5px) rotate(0deg);
            transform: translateY(-5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

@keyframes openTop {
  0% {
    -webkit-transform: translateY(-5px) rotate(0deg);
            transform: translateY(-5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

@-webkit-keyframes closedTop {
  0% {
    -webkit-transform: translateY(-5px) rotate(0deg);
            transform: translateY(-5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

@keyframes closedTop {
  0% {
    -webkit-transform: translateY(-5px) rotate(0deg);
            transform: translateY(-5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

@-webkit-keyframes openMid {
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
}

@keyframes openMid {
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
}

@-webkit-keyframes closedMid {
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
}

@keyframes closedMid {
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
}

@-webkit-keyframes openBtm {
  0% {
    -webkit-transform: translateY(5px) rotate(0deg);
            transform: translateY(5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

@keyframes openBtm {
  0% {
    -webkit-transform: translateY(5px) rotate(0deg);
            transform: translateY(5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

@-webkit-keyframes closedBtm {
  0% {
    -webkit-transform: translateY(5px) rotate(0deg);
            transform: translateY(5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

@keyframes closedBtm {
  0% {
    -webkit-transform: translateY(5px) rotate(0deg);
            transform: translateY(5px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
            transform: translateY(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(90deg);
            transform: translateY(0px) rotate(90deg);
  }
}

/* ****************************************** */
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

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

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