:root {
                --color-primary: rgb(37, 38, 38);
                --color-secondary: #4dbd8b
            }
            * {
                box-sizing: border-box;
                padding: 0;
                margin: 0
            }
            html {
                font-size: 62.5%;
                font-family: sans-serif;
                font-weight: 500;
                color: var(--color-primary)
            }
            .quedate-container, body {
                width: 100%;
            }
            .container-chat {
                font-weight: 400
            }
            .chat, .wrapper {
                display: flex;
                flex-direction: column
            }
            .loading__box-1--hidden {
                display: none !important
            }
            .loading__box-2--hidden {
                display: none !important
            }
            .loading__box-3--hidden {
                display: none !important
            }
            .loading__check-1--hidden {
                display: none !important
            }
            .loading__check-2--hidden {
                display: none !important
            }
            .loading__check-3--hidden {
                display: none !important
            }
            .chat__reactions {
                width: 90%;
                margin: auto ;
                display: flex;
                align-items: center;
                font-size: .95rem
            }
            .chat__reactions-icon {
                align-items: center;
                margin-right: 30px;
              	display: flex;
                float: left;
            }
            .chat__reactions-text {
     		margin-left: 10px;
       		display: flex;
    		align-items: center;
    		float: right;
            }
            .chat__reactions-counter {
                margin-left: 1.8rem
            }
            .chat__actions {
                margin-top: 1rem;
                display: flex;
                justify-content: space-around;
                font-size: 1.2rem;
                border-top: 1.4px solid #b0b0b0;
                border-bottom: .5px solid #d3d3d3
            }
            .chat__actions-box {
                display: flex;
                align-items: center
            }
            .chat__actions img {
                width: 4rem
            }
            .chat__conversation {
                width: 90%;
                margin: 0 auto;
                font-size: 12px;
            }
            .chat__conversation-box {
                display: flex;
                flex-direction: row;
                align-items: center;
                margin-top: 1rem;
                position: relative
            }
            .chat__conversation-box--right {
                margin-left: 20%;
                margin-bottom: 1rem
            }
            .chat__conversation-box-img {
                width: 3.5rem;
                border-radius: 50%;
                margin-right: 1rem;
                align-self: baseline
            }
            .chat__conversation-box-active {
                width: 1rem;
                height: 1rem;
                background-color: var(--color-secondary);
                border-radius: 50%;
                position: absolute;
                top: 2.5rem;
                left: 2.7rem
            }
            .chat__conversation-box-content-comment {
                padding: 1rem;
                background-color: #f2f3f5;
                border-top-left-radius: 14px;
                border-top-right-radius: 14px;
                border-bottom-left-radius: 14px;
                border-bottom-right-radius: 14px
            }
            .chat__conversation-box-content-comment-name {
                color: #726695;
                font-weight: 500;
                margin-right: .4rem
            }
            .chat__conversation-box-content-cta {
                margin-top: .3rem;
                padding-left: 1.5rem;
                color: #726695
            }
            .chat__conversation-box-content-cta-text {
                margin-right: .5rem
            }
            .chat__conversation-box-content-cta--2 {
                font-size: .9rem
            }
            .chat__conversation-reply {
                margin-left: 20%;
                color: gray
            }
            .chat__conversation-reply--efect {
                animation: opacidad 1s infinite
            }
            @keyframes opacidad {
            0
            {
                opacity: 0
            }
            50
            %
            {
                opacity: 1
            }
            100
            %
            {
                opacity: 0
            }
            }
            .chat__conversation-write {
                position: relative;
                margin-bottom: 2rem
            }
            .chat__conversation-write input {
                width: 100%;
                margin-top: 2rem;
                margin-bottom: 1rem;
                border: none;
                background-color: #f2f3f5;
                border-radius: 100px;
                padding: .8rem;
                color: var(--color-primary);
                padding-left: 1rem;
                outline: 0
            }
            .chat__conversation-write-icons {
                display: flex;
                flex-direction: row;
                position: absolute;
                right: 1.2rem;
                top: 1.8rem
            }
            .chat__conversation-write-icons-img {
                width: 1.2rem;
                margin-right: .5rem;
                fill: gray
            }
            .chat__conversation-write-icons-img--svg {
                width: 2rem
            }
            .loading {
                width: 100%;
                height: 220px;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                position: absolute;
                top: 48px;
                z-index: 10;
                background-color: #fff;
                box-shadow: 4px 4px 18px 3px rgba(0, 0, 0, .3)
            }
            .loading__box {
                width: 50%;
                display: flex;
                flex-direction: row;
                align-items: center;
                position: relative
            }
            .loading__animate, .loading__check {
                width: 5rem
            }
            .loading__check {
                position: absolute;
                left: 0
            }
            .loading__txt {
                font-size: 1.2rem;
                color: var(--color-primary);
                margin-left: 1rem
            }
            .loading2 {
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                position: absolute;
                top: 48px;
                z-index: 20;
                background-color: #fff;
                box-shadow: 4px 4px 18px 3px rgba(0, 0, 0, .3)
            }
            .loading2__box {
                text-align: justify;
                padding: 2rem;
                color: var(--color-primary);
                font-size: 14px
            }
            .loading2__permission {
                width: 12rem;
                margin: 0 auto
            }
            .js-hidden {
                display: none !important
            }
            .js-display {
                display: block
            }
            .js-show {
                visibility: hidden !important
            }
            .logo-container {
                width: 100%;
                padding-top: 1.5rem;
                padding-bottom: 1.5rem;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                color: var(--color-primary);
                font-size: 1.8rem
            }
            .quedate-container {
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center
            }
            .quedate {
                width: 100%
            }
            .quedate__fixed {
                background-color: var(--color-primary)
            }
            .quedate__fixed-box {
                width: 90%;
                margin: 0 auto;
                display: flex;
                align-items: center;
                padding: .5rem
            }
            .quedate__fixed-box span {
                margin: 0 auto;
                color: #fff;
                font-size: 1.5rem
            }
            .quedate__company {
                width: 30%;
                border-right: 1px solid var(--color-secondary)
            }
            .quedate__step {
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                padding-top: 0;
            }
            .quedate__step-box {
               width: 80%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        margin: 1rem;
        direction: rtl;
            }
            .quedate__border {
                width: 16px;
        height: 163%;
        background-color: #026c74;
        margin-right: 2rem;
            }
            .quedate__cta-btn {
               width: 55%;
        font-size: 2rem;
        font-weight: 700;
        color: #fff;
        padding: 1rem;
        border: none;
        background-color: var(--color-secondary);
        border-radius: 6px;
        outline: 0;
        margin: 40px ;
            }
            .quedate__cta-btn:active, .quedate__cta-btn:hover {
                background-color: #03a658
            }
            .quedate__cta-btn:active {
                transform: translateY(2px)
            }
            .quedate__loading {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center
    margin: 12px;
            }
            .quedate__svg {
                position: relative
            }
            .quedate__check {
                position: absolute;
                left: 0
            }
            .quedate__porcent {
                margin-top: 1rem;
                margin-bottom: 2rem;
                font-size: 2.5rem;
                font-weight: 700
            }
            .quedate__form {
                border: 1.5px solid #c0bfc3;
                border-top-right-radius: 8px;
                border-top-left-radius: 8px;
                border-bottom-left-radius: 8px;
                border-bottom-right-radius: 8px;
                padding: 1rem;
                position: relative;
                margin-top: 2.5rem;
            }
            .quedate__form-input {
                border: none;
                outline: 0
            }
            .quedate__form-input::placeholder {
                color: #c0bfc3;
                font-family: inherit;
                font-size: 1.5rem
            }
            .quedate__form-separar {
                position: absolute;
                width: 1px;
                height: 100%;
                top: 0;
                background-color: #c0bfc3
            }
            .quedate__form-label {
                font-size: 1.5rem;
                font-weight: 700;
                padding: 2rem
            }
            .quedate__first {
                width: 90%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                margin: 9px auto
            }
            .quedate__load {
                width: 80%;
                font-size: 1.3rem;
                padding: .8rem;
                border: 1px solid var(--color-primary);
                position: relative
            }
            .quedate__load-icon {
                width: 30%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                position: relative;
                border: 1px solid var(--color-primary);
                padding-right: .8rem;
                padding-left: .8rem;
                border-left: none
            }
            .quedate__load-text {
                margin-left: .5rem;
                font-size: 1.2rem;
                font-weight: 700
            }
            .quedate__load-a {
                position: absolute;
                height: 3.2rem;
                top: 0;
                z-index: -1;
                left: 0;
                background-color: var(--color-secondary)
            }
            .permision-container {
                width: 95%;
                margin: 0 auto;
                display: flex;
                flex-direction: column;
                align-items: center;
                background-color: #fff;
                box-shadow: 4px 4px 18px 3px rgba(0, 0, 0, .4);
                position: absolute;
                top: .8rem;
                left: .8rem;
                z-index: 15
            }
            .permision-container-box {
                width: 95%;
                margin: 0 auto
            }
            .permision-container-end, .permision-container-request-text {
                width: 100%;
                padding: 1.2rem;
                background-color: #ededf3;
                font-size: 1.5rem;
                font-weight: 700
            }
            .permision-container-end {
                font-size: 1rem;
                font-weight: 400;
                text-align: center
            }
            .permision-container-data {
                padding: 2rem
            }
            .permision-container-icons {                                           
                width: 60%;
                margin: 0 auto;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-around;
                margin-bottom: 2.5rem
            }
            .permision-container-icons-face, .permision-container-icons-uber {
                width: 8rem
            }
            .permision-container-txt {
                margin: 0 auto;
                font-size: 1.5rem;
                text-align: center;
                margin-bottom: 1.5rem
            }
            .permision-container-form {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: space-between
            }
            .permision-container-input {
                outline: 0;
                padding: 1.2rem;
                width: 100%;
                margin-bottom: 1.5rem;
                border-top-left-radius: 10px;
                border-top-right-radius: 10px;
                border-bottom-left-radius: 10px;
                border-bottom-right-radius: 10px;
                border: 1px solid #b9b9b9;
                color: gray;
                font-size: 1.2rem
            }
            .permision-container-secure {
                margin-top: 1rem;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                color: #a2a2a2
            }
            .permision-container-secure svg {
                width: 1.5rem;
                height: 1.5rem;
                margin-right: 1rem
            }
            .permision-container-cta {
                width: 100%;
                padding: .8rem;
                margin-top: 1rem;
                margin-bottom: 1.5rem;
                margin-left: 0;
                font-size: 1.8rem
            }
            /* Chrome, Safari, Edge, Opera */
            input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
                -webkit-appearance: none;
                margin: 0;
            }
            /* Firefox */
            input[type=number] {
                -moz-appearance: textfield;
            }
    #country{
    font-size: 21px;
        font-family: sans-serif;
    }
    #firstname {
      background-color: yellow;
    }
    
    .quedate__cta-btn {
        width: 55%;
        font-size: 2rem;
        font-weight: 700;
        color: #fff;
        padding: 1rem;
        border: none;
        background-color: var(--color-secondary);
        border-radius: 6px;
        outline: 0;
        margin-top: 0;
    }
        
  .horizontal_text{
   background-color: #f1f1f1;
    padding-top: 10px;
    padding-bottom: 10px;
    font-weight: 600;
    font-size: 16px;
    font-family: Poppins, Droid Arabic Naskh;
  }
  .count-text{
     background-color: #f2bba0;
     text-align: center;
        width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 16px;
    font-family: Poppins, Droid Arabic Naskh;
    font-weight: 500;
  }
  
/* start snowflake styling */
.snowflake {
  color: #fff;
  font-size: 1em;
  font-family: Arial;
  text-shadow: 0 0 1px #000;
}

@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%{-webkit-transform:translateX(0px);transform:translateX(0px)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}100%{-webkit-transform:translateX(0px);transform:translateX(0px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%{transform:translateX(0px)}50%{transform:translateX(80px)}100%{transform:translateX(0px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}
/* Demo Purpose Only*/
.demo {
  font-family: 'Raleway', sans-serif;
	color:#fff;
    display: block;
    margin: 0 auto;
    padding: 15px 0;
    text-align: center;
}
.demo a{
  font-family: 'Raleway', sans-serif;
color: #000;		
}