@font-face {
    font-family: "Gotham Book";
    src: url("./fonts/GothamBook.eot");
    src: url("./fonts/GothamBook.eot?#iefix") format("embedded-opentype"), url("./fonts/GothamBook.woff2") format("woff2"),
    url("./fonts/GothamBook.woff") format("woff"), url("./fonts/GothamBook.ttf") format("truetype"),
    url("./fonts/GothamBook.svg#GothamBook") format("svg");
}

@font-face {
    font-family: "Gotham Light";
    src: url("./fonts/Gotham-Light.eot");
    src: url("./fonts/Gotham-Light.eot?#iefix") format("embedded-opentype"),
    url("./fonts/Gotham-Light.woff2") format("woff2"), url("./fonts/Gotham-Light.woff") format("woff"),
    url("./fonts/Gotham-Light.ttf") format("truetype"), url("./fonts/Gotham-Light.svg#Gotham-Light") format("svg");
}

@font-face {
    font-family: "Gotham Medium";
    src: url("./fonts/Gotham-Medium.eot");
    src: url("./fonts/Gotham-Medium.eot?#iefix") format("embedded-opentype"),
    url("./fonts/Gotham-Medium.woff2") format("woff2"), url("./fonts/Gotham-Medium.woff") format("woff"),
    url("./fonts/Gotham-Medium.ttf") format("truetype"), url("./fonts/Gotham-Medium.svg#Gotham-Medium") format("svg");
}

@font-face {
    font-family: "Gotham Bold";
    src: url("./fonts/GothamBold.eot");
    src: url("./fonts/GothamBold.eot?#iefix") format("embedded-opentype"), url("./fonts/GothamBold.woff2") format("woff2"),
    url("./fonts/GothamBold.woff") format("woff"), url("./fonts/GothamBold.ttf") format("truetype"),
    url("./fonts/GothamBold.svg#GothamBold") format("svg");
}

*{outline: none;box-sizing: border-box;font-family: "Gotham Book", sans-serif;font-weight: 400;}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
    font-family: "Gotham Book", sans-serif;
    font-weight: 400;
    background: #08528d;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

textarea,
input[type="text"],
input[type="number"],
input[type="button"],
input[type="submit"],
input[type="tel"]{
    -webkit-appearance: none;
    border-radius: 0;
    font-size: 16px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

button{cursor: pointer;}
img{max-width: 100%;}

.container{display: flex;width: 100%;min-height: 100vh;align-items: center;justify-content: center;}
.content{display: flex;flex-direction: column;position: relative;margin: 0 auto;width: 1140px;max-width: 96%;}

.header{display: flex;align-items: center;justify-content: space-between;margin-bottom: 10px;}
.header img{width: 128px;}

.main{background: #fff;display: flex;align-items: stretch;justify-content: space-between;border-radius: 5px;}
.main .left{display: flex;flex-direction: column;padding: 30px;border-radius: 4px 0 0 4px;width: 570px;max-width: 100%;gap: 25px;}
.main .left header{display: flex;flex-direction: column;gap: 15px;}
.main .left header h1{font-weight: 700;font-size: 22px;line-height: 25px;color: #0D5EA1FF;}
.main .left header p{font-weight: 400;font-size: 14px;line-height: 21px;color: #333;}
.main .left header p strong{font-weight: 700;color: #000;font-size: 15px;}
.main .left header p b{font-weight: 700;color: #000;}
.main .left label{display: flex;flex-direction: column;gap: 5px;}
.main .left label span{font-size: 14px;color: rgb(17,17,17);}
.main .left label input{}
.main .left .links{display: flex;align-items: flex-start;flex-wrap: wrap;}
.main .left .links span{display: block;align-items: center;width: 50%;font-size: 14px;color: #459ad8;margin-bottom: 13px;}
.main .left .links span:nth-child(2), .main .left .links span:nth-child(4){text-align: right;}
.main .left .links span:hover{text-decoration: underline;cursor: pointer;color: #08528d;}
.main .left .links span:last-child{margin-bottom: 0;}
.main .left .buttons{display: flex;align-items: center;justify-content: space-between;}
.main .left .buttons .btn_next{display: flex;align-items: center;justify-content: center;width: 253px;height: 44px;background: #0066b3;font-size: 13px;font-weight: 400;color: #fff;border-radius: 30px;border: 1px solid #0066b3;transition: background .2s ease-in-out;letter-spacing: .03em;gap: 10px;}
.main .left .buttons .btn_next:hover{border-color: #005ca1;background: #005ca1;}
.main .left .buttons .btn_next:disabled{border-color: #b7b6b5;background: #b7b6b5;}
.main .left .buttons .btn_next:disabled p{color: #666;font-weight: 700;font-size: 14px;}
.main .left .buttons .btn_next .loader{display: block;width: 18px;height: 18px;border: 3px solid rgba(255,255,255,.3);border-radius: 50%;border-top-color: rgba(0,0,0,.3);animation: loader-btn .8s ease-in-out infinite;}
.main .left .buttons .recordar{display: flex;align-items: center;gap: 10px;cursor: pointer;}
.main .left .buttons .recordar p{font-size: 14px;color: #999;}

@keyframes loader-btn {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

.main .right{display: flex;flex-direction: column;border-radius: 0 4px 4px 0;width: 570px;max-width: 100%;border-left: 1px solid #f1f1f1;}
.main .right .cima img{border-radius: 0 4px 0 0;}
.main .right .info{display: flex;flex-direction: column;padding: 15px 30px;gap: 15px;}
.main .right .info h1{font-family: "Gotham Medium", sans-serif;font-weight: 400;font-size: 22px;line-height: 25px;color: #0066b3;text-align: center;padding-bottom: 10px;border-bottom: 3px solid #ffcb05;}
.main .right .info p{font-weight: 400;font-size: 13.5px;line-height: 21px;color: rgb(17,17,17);text-align: center;}

.input{display: flex;padding: 0 10px;border: 1px solid #459ad8;border-radius: 5px!important;height: 39px;accent-color: #08528d;font-size: 14px!important;color: rgb(85,85,85);}

.footer{display: flex;align-items: center;justify-content: space-between;margin-top: 10px;}
.footer .logo{display: flex;align-items: center;}
.footer .logo img{width: 99px;}
.footer ul{display: flex;align-items: center;gap: 10px;}
.footer ul li.link{font-size: 13px;line-height: 13px;color: hsla(0, 0%, 100%, .5);}
.footer ul li.link:hover{color: #fff;cursor: pointer;text-decoration: underline;}
.footer ul li.final{font-size: 13px;line-height: 13px;color: #fff;position: relative;padding: 0 0 0 10px;}
.footer ul li.final:after{content: "|";position: absolute;top: 0;left: 0;color: #ffcb05;}

.links_mobile, .copy_mobile{display: none;}

.error{display: none;align-items: center;justify-content: center;gap: 10px;background: rgba(255,0,0,.1);padding: 10px;border: 1px solid #900;border-radius: 4px;}
.error img{width: 16px;}
.error p{font-size: 13px;color: #900;font-weight: 600;line-height: 1.5em;}

.error2{display: flex;align-items: center;justify-content: center;gap: 10px;background: rgba(255,0,0,.1);padding: 10px;border: 1px solid #900;border-radius: 4px;}
.error2 img{width: 16px;}
.error2 p{font-size: 13px;color: #900;font-weight: 600;line-height: 1.5em;}

.infor{display: flex;align-items: center;justify-content: center;gap: 10px;background: rgba(0,102,179,.1);padding: 10px;border: 1px solid #08528d;border-radius: 4px;}
.infor img{width: 24px;}
.infor p{font-size: 12px;color: #08528d;font-weight: 600;line-height: 1.5em;}

.show_loader{display: flex;align-items: center;justify-content: center;width: 100%;margin: 60px auto;}
.show_loader .loader{display: block;width: 80px;height: 80px;border: 6px solid #ffcb05;border-top-color: #08528d;border-radius: 50%;animation: animar-loader-grande .5s ease-in-out infinite;box-shadow: 0 0 15px 3px rgba(255,203,5,.3);}

@keyframes animar-loader-grande {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

@media only screen and (max-width: 800px){
    body{background: #fff;}
    .container{align-items: flex-start;min-height: auto;}
    .content{max-width: 100%;}

    .header{border-bottom: 8px solid #ffcb05;margin-bottom: 0;padding: 20px 0;justify-content: center;background: #0066b3;}
    .header img{width: 99px;}

    .main{flex-direction: column;border-radius: 0;}
    .main .left{border-radius: 0;padding: 40px 10px 20px 10px;margin: 0 auto;}

    .main .left .links{display: none;}

    .main .left .buttons{flex-direction: column;gap: 50px;}
    .main .left .buttons .btn_next{width: 100%;}
    .main .left .buttons .recordar{width: 100%;justify-content: center;}

    .main .right{display: none;}

    .footer{display: none;}

    .links_mobile{display: flex;flex-direction: column;gap: 15px;margin-top: 20px;}
    .links_mobile span{font-size: 14px;color: #459ad8;text-align: center;}
    .copy_mobile{display: flex;align-items: center;justify-content: center;text-align: center;line-height: 1.5em;font-size: 13px;color: #999999;}

    .infor{flex-direction: column;}
    .infor img{width: 35px;}
    .infor p{text-align: center;}
}