@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@400;500;600;700&display=swap');

*{
    font-family: 'Red Hat Display', sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    width: 100%;
    height: 100vh;
    background-image: url('../img/Fondo.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
h1{
    position: absolute;
    right: 10%;
    top: 8%;
    color: #00205B !important;
    font-size: 40px !important;
    font-weight: 600 !important;
}
.fech{
    left: 10%;
    position: relative;
}
.logo{
    width: 250px;
    position: absolute;
    left: 80px;
    top: -60px;
}
.data{
    position: absolute;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-20%);
    padding: 10px 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 2px 1px 10px #e3e3e3;
    width: 70%;
}
.data .client,
.data .adviser,
.data .car{
    border: 1px solid #00215F;
    border-radius: 5px;
    margin: 10px 0px;
}
.data .client h5,
.data .adviser h5,
.data .car h5{
    background: #00205B;
    color: #fff;
    text-align: center;
    padding: 3px 0px;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.data .client h5 .fa.fa-caret-right,
.data .adviser h5 .fa.fa-caret-right,
.data .car h5 .fa.fa-caret-right{
    color: #FF0000;
}
.data i.fa{
    color: #00205B;
    text-align: right;
    font-size: 15px;
}
.data .client .inputbox,
.data .adviser .inputbox,
.data .car .inputbox{
    padding: 5px 10px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: end;
}
.data .car .inputbox{
    display: block;
    width: 100%;
}
.data .car .row .col-sm-6:first-child .inputbox{
    padding: 15px 0px 15px 25px;
}
.data .car .row .col-sm-6:last-child .inputbox{
    padding: 15px 25px 15px 0px;
}
.data .car .inputbox p{
    color: #00205B;
    font-weight: 500;
    margin-bottom: 0px;
}
.data .client .inputbox:last-child,
.data .adviser .inputbox:last-child,
.data .car .inputbox:last-child{
    padding-bottom: 15px;
}
.data .client .inputbox input,
.data .adviser .inputbox input,
.data .car .inputbox input,
.data .car .inputbox select{
    width: 92%;
    border: none;
    border-bottom: 1px solid #00205B;
    outline: none;
    padding: 2px 10px;
    color: #00205B;
}
.data .car .inputbox input,
.data .car .inputbox select{
    width: 100%;
}
.data .client .inputbox input::placeholder,
.data .adviser .inputbox input::placeholder,
.data .car .inputbox input::placeholder{
    color: #00205B75;
}
input[type="submit"]{
    color: #fff;
    background: #00205B;
    border: none;
    padding: 5px 35px;
    border-radius: 5px;
    font-size: 18px;
    text-align: right;
    margin-bottom: 15px;
}
.redes{
    padding: 10px;
    width: 300px;
}
@media(max-width: 1024px){
    .logo{
        width: 250px;
        top: -30px;
    }
    .data{
        width: 1000px;
    }
    h1{
        font-size: 48px !important;
        right: 5%;
    }
}
@media(max-width: 960px){
    .logo{
        left: 20px;
        width: 150px;
        top: -25px;
    }
    h1{
        right: 20px;
        top: 80px;
        color: #00205B !important;
        font-size: 30px !important;
        z-index: 100;
    }
    .data{
        top: 120px;
        left: 0;
        transform: none;
        width: auto;
        margin: 0px 5px;
    }
    .data .client h5,
    .data .adviser h5,
    .data .car h5{
        font-size: 14px;
    }
    .data .client .inputbox input,
    .data .adviser .inputbox input,
    .data .car .inputbox input,
    .data .car .inputbox select{
        font-size: 11px;
    }
    .data i.fa{
        font-size: 12px;
    }
    .data .client .inputbox,
    .data .adviser .inputbox,
    .data .car .inputbox{
        padding: 5px 15px;
    }
    .data .car .row .col-sm-6:first-child .inputbox{
        padding: 5px 15px;
    }
    .data .car .row .col-sm-6:last-child .inputbox{
        padding: 5px 15px;
    }
    input[type="submit"]{
        font-size: 14px;
        margin-left: 20px;
        margin-top: 10px;
    }
    .redes{
        padding: 10px;
        width: 200px;
    }
}