@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: Gotham;
    src: url("../fonts/Gotham-Light.otf");
}

@font-face {
    font-family: Gotham-Bold;
    src: url("../fonts/Gotham-Bold.otf");
    font-weight: bold;
}

@font-face {
    font-family: Gotham-Black;
    src: url("../fonts/Gotham-Black.otf");
    font-weight: bolder;
}

body{font-family: Gotham;color:#333;font-size:15px;line-height: 19px;-webkit-font-smoothing: antialiased;background-image: url("../img/adtecer-bg.jpg");background-repeat: no-repeat;background-size: auto 100%; background-position: bottom right; margin:0;min-height: 100vh;}

a {text-decoration: none;}

section {padding:60px;min-height: calc(100vh - 120px);background: linear-gradient(138deg, #fff 520px, transparent 540px);}

.logo {width:290px;margin: 0;}
.logo img {width:100%;}
.text {width: 395px;margin: 95px 0 30px;}
.ubi {margin:0 0 15px;padding:0 0 0 20px;font-size:14px;background-image: url("../img/adtecer-ubi.svg");background-repeat: no-repeat;background-size: 12px;}
.tel {margin:0;padding:0 0 0 20px;font-size:14px;background-image: url("../img/adtecer-tel.svg");background-repeat: no-repeat;background-size: 12px;}
.contact {width: 145px; background: linear-gradient( 120deg, #f50000, #005581);text-align:center;padding:5px;border-radius:30px;margin: 50px 0 0;}
.contact a {color:#fff;font-family: 'Gotham-Black';cursor: pointer;}
.copy {position: absolute;bottom: 0;width: calc(100% - 120px);padding: 5px 60px 5px;background: linear-gradient(90deg, #fff 215px, transparent 250px);left: 0;font-size:13px;}

/* Formulario */
#website{
    display:none;
}
.form-overlay {width: 100%;height: 100%;position: absolute;left: 0;top: 0;display: none;cursor: pointer;}
form {background: #005581;width:300px;padding:20px 20px 30px;position:absolute;top:25%;left:calc(50vw - 170px);border-radius:20px;color:#fff;text-align: center;
-webkit-box-shadow: 0px 0px 10px -2px rgba(0,85,129,0.81);
-moz-box-shadow: 0px 0px 10px -2px rgba(0,85,129,0.81);
box-shadow: 0px 0px 10px -2px rgba(0,85,129,0.81);
display:none;}
form p {font-size: 25px;font-family: 'Gotham-Black';}
form ul {margin:0;padding:0;}
form li {list-style: none;margin: 0 0 10px;}
form input {background:#f2f2f2;border-radius:30px;color:#999;}
form li button {background: #f50000;border: 0;border-radius: 30px;padding: 5px 30px;font-size: 15px;color:#fff;font-family: 'Gotham-Black';}
form input {background: #f2f2f2;border-radius: 10px;color: #999;border: none;padding: 10px;width: 90%;}
.form-info {
    background: #fff;
    padding: 1em;
    border-radius: 15px;
    margin: 1em 0;
    display:none;
}
#info{font-size: 15px;line-height:18px;}
input[type="radio"] {width: auto;}
textarea#msg {background: #f2f2f2;border: none;border-radius: 15px;padding: 10px;width: 90%;font-family: 'Gotham';}
.li-content {display: flex;}
.li-content input {width: auto;}

@media (min-width:1200px) {
    body {font-size: 1.25vw;line-height: 1.6vw;}

    section {background: linear-gradient(138deg, #fff 43vw, transparent 46vw);}

    .logo {width: 24vw;}

    .text {width: 33vw;margin: 8vw 0 2.8vw;}

    .ubi {margin: 0 0 1.2vw;padding: 0 0 0 1.7vw;font-size: 1.2vw;line-height: 1.6vw;background-size: 1vw;}

    .tel {padding: 0 0 0 1.7vw;font-size: 1.2vw;line-height: 1.6vw;background-size: 1vw;}

    .copy {padding: 0.4vw 5vw;background: linear-gradient(90deg, #fff 17vw, transparent 21vw);font-size: 1.1vw;width: calc(100vw - 10vw);}

    .contact {width: 11.5vw;padding: 0.4vw;border-radius: 1.2vw;margin: 4vw 0 0;}
}

@media (max-width: 700px){
    body{background-size: auto 100vw; max-height: 100vh;}
	section {padding: 2em; background: linear-gradient(180deg, #fff 50%, transparent 55%);}
	.logo {width: 30vw;min-width: 170px;margin: 0 auto;}
	.text {width: 100%;font-size: 2.8vw;line-height: 3.2vw;margin: 9vw 0 6vw;}
	.ubi {font-size: 2.7vw;line-height: 3.1vw;}
	.tel {font-size: 2.7vw;line-height: 3.1vw;}
	.contact {margin: 30px auto 0;}
    .copy {background: #fff;text-align:center;position: fixed;}
}

@media (max-width: 600px){
	section {padding: 2em; background: linear-gradient(180deg, #fff 60%, transparent 65%);}
	.logo {width: 30vw;min-width: 170px;margin: 0 auto;}
	.text {font-size: 16px;line-height: 20px;margin: 55px 0 30px;}
	.ubi {font-size: 15px;line-height: 20px}
	.tel {font-size: 15px;line-height: 20px;}
	.contact {margin: 30px auto 0;}
}