html, body {
    width:100%;
    height:100%;
}
body {
    font-family: "Nunito", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size:16px;
    background-image: url('../img/bg.jpg');
    background-size: cover;
    background-attachment: fixed;
}

.btn-alt {
    padding: 10px 20px;
    border-radius: 20px;
    color:#fff;
    text-decoration: none;
    font-weight: bold;
    display: inline-block;
    text-align: center;
}
.btn-green {
    background: rgb(48,107,67);
    background: -moz-linear-gradient(90deg, rgba(48,107,67,1) 0%, rgba(89,146,67,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(48,107,67,1) 0%, rgba(89,146,67,1) 100%);
    background: linear-gradient(90deg, rgba(48,107,67,1) 0%, rgba(89,146,67,1) 100%);
}
.btn-green:hover {
    background: rgb(48,107,67);
    background: -moz-linear-gradient(59deg, rgba(48,107,67,1) 0%, rgba(89,146,67,1) 66%);
    background: -webkit-linear-gradient(59deg, rgba(48,107,67,1) 0%, rgba(89,146,67,1) 66%);
    background: linear-gradient(59deg, rgba(48,107,67,1) 0%, rgba(89,146,67,1) 66%);
}
.btn-blue {
    background: rgb(39,69,110);
    background: -moz-linear-gradient(90deg, rgba(39,69,110,1) 0%, rgba(54,97,139,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(39,69,110,1) 0%, rgba(54,97,139,1) 100%);
    background: linear-gradient(90deg, rgba(39,69,110,1) 0%, rgba(54,97,139,1) 100%);
}
.btn-blue:hover {
    background: rgb(39,69,110);
    background: -moz-linear-gradient(59deg, rgba(39,69,110,1) 0%, rgba(54,97,139,1) 63%);
    background: -webkit-linear-gradient(59deg, rgba(39,69,110,1) 0%, rgba(54,97,139,1) 63%);
    background: linear-gradient(59deg, rgba(39,69,110,1) 0%, rgba(54,97,139,1) 63%);
}
.btn-red {
    background: rgb(238, 6, 6);
    background: -moz-linear-gradient(90deg, rgba(238, 6, 6) 0%, rgb(216, 80, 80) 100%);
    background: -webkit-linear-gradient(90deg, rgba(238, 6, 6) 0%, rgba(216, 80, 80,1) 100%);
    background: linear-gradient(90deg, rgba(238, 6, 6) 0%, rgba(216, 80, 80,1) 100%);
}
.btn-red:hover {
    background: rgb(211, 10, 10);
    background: -moz-linear-gradient(59deg, rgba(211, 10, 10,1) 0%, rgb(216, 80, 80) 63%);
    background: -webkit-linear-gradient(59deg, rgba(211, 10, 10,1) 0%, rgba(216, 80, 80,1) 63%);
    background: linear-gradient(59deg, rgba(211, 10, 10,1) 0%, rgba(216, 80, 80,1) 63%);
}
.btn-large {
    border-radius: 30px;
    padding: 20px 40px;
    font-size: 18px;   
}
.btn-medium {
    padding: 15px 30px;
    font-size: 16px;   
}
.btn-pulse {
    animation: pulse infinite 1s;
}
.main {
    position:relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
}
.main .pics {
    position: relative;
    flex: 0 1 auto;
    overflow: initial;
}
.doctor {
    animation: slideInLeft .5s;
    position: relative;
    z-index:10;
}
.ambulance {
    animation: slideInRight .5s;
    width: 250px;
    height: auto;
    position:absolute;
    left:0;
    bottom:0;
    z-index:11;
}
.infos {
    animation: slideInRight .5s;
    background-color: #ffffffbd;
    overflow-x: initial;
    display: flex;
    flex: 0 1 auto;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
}
.infos .box-infos {
    width:100%;
    height: 100%;
    text-align: center;
    padding:40px;
    padding-bottom:100px;
}
.infos .title {
    color:rgb(39,69,110);
}
.logotipo {
    width: 250px;
    height: auto;
}
.whats {
    position:fixed;
    left:20px;
    bottom:20px;
    z-index:10000;
    animation: shakeY 2s infinite;
}
.whats.right {
    left:unset;
    right: 20px;
}
.whats a {
    background-color:#00bf49;
    color:#fff;
    padding:10px 15px;
    border-radius: 40px;
    display: block;
}
.whats a:hover {
    background-color:#13d45d;
}
.btn-mw {
    max-height: 60px;
}
@media (min-width: 992px) {
    .main {
        flex-direction: row;
    }
    .main .pics {
        flex: 0 1 50%;
        overflow: hidden;
        align-items: flex-end;
        display: flex;
    }
    .ambulance {
        width: auto;
        height: auto;
    }
    .infos {
        overflow-x: hidden;
        flex: 0 1 50%;
    }
}