CSS
Fri Aug 08 2025 07:42:00 GMT+0000 (Coordinated Universal Time)
Saved by @andresrivera #ampscript
* {
box-sizing: border-box;
}
body {
margin: 0;
font-family: "RoobertENEL", Arial, Helvetica, sans-serif;
background-color: #ffffff;
color: #000;
}
.header {
background-color: #0066FF;
padding: 20px;
}
.header img {
height: 30px;
}
.container {
padding: 40px 20px;
max-width: 800px;
margin: auto;
text-align: center;
}
.container .title {
font-size: 28px;
margin-bottom: 10px;
}
.container > p {
font-size: 16px;
color: #333;
margin-bottom: 30px;
}
.bold {
font-weight: bold;
}
.error-banner {
border-radius: 10px;
background-color: #F6D5DD;
display: inline-block;
}
.error-text {
margin: 0;
font-weight: normal;
font-style: normal;
font-size: 16px;
line-height: 1.5;
letter-spacing: -0.2px;
font-family: inherit;
text-decoration: none;
color: #000000;
padding: 15px 40px;
}
.text-bold {
font-weight: bold;
font-size: 20px
}
.text-light {
font-weight: 200;
font-size: 16px
}
.image-error {
padding: 20px 0
}
.endesa-form {
display: inline-block;
position: relative;
margin: 0;
padding: 30px;
background: #ffffff;
width: 100%;
margin-bottom: 65px;
max-width: 512px;
}
.endesa-form__group {
display: block;
width: 100%;
position: relative;
text-align: left;
margin-bottom: 25px;
}
.endesa-form__group--invalid input {
border: 2px solid #d42c54;
border-radius: 0;
box-shadow: none;
outline: none;
}
.endesa-form__group--invalid span {
width: 100%;
position: relative;
display: block;
font-family: "RoobertENEL", Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 14px;
color: #d42c54;
font-style: normal;
font-stretch: normal;
line-height: 1.29;
letter-spacing: -0.2px;
text-align: left;
}
.endesa-form__group--col-2-lf {
display: inline-block;
width: calc(50% - 2.5px);
margin: 0;
position: relative;
left: 0;
padding-right: 10px;
text-align: left;
vertical-align: top;
}
.endesa-form__group--col-2-rg {
display: inline-block;
width: calc(50% - 2.5px);
margin: 0;
position: relative;
left: 0;
text-align: left;
padding-left: 10px;
vertical-align: top;
}
.endesa-form__label--visible {
display: block;
border: none;
font-weight: normal;
font-style: normal;
font-size: 16px;
line-height: 1.5;
letter-spacing: -0.2px;
font-family: inherit;
text-decoration: none;
box-sizing: border-box;
padding-right: 10px;
color: #000000;
margin-bottom: 5px;
}
.endesa-form__select {
position: relative;
display: block;
width: 100%;
height: 44px;
font-family: "RoobertENEL Light", Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.33;
letter-spacing: normal;
color: #757575;
border-radius: 0px;
border: none;
border: 2px solid #dddddd;
box-shadow: none;
margin-bottom: 23px;
padding: 9px 14px;
padding-right: 35px;
margin: 0;
background: url(https://image.digital.endesaclientes.com/lib/fe341570756405757c1478/m/1/e7e44424-f980-4bdd-a536-3cbbfec0ab0f.png) 95% center no-repeat, linear-gradient(#ffffff, #ffffff);
background-size: 10px 5px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
select::-ms-expand {
display: none;
}
.endesa-form__input {
position: relative;
display: block;
width: 100%;
height: 44px;
font-family: "RoobertENEL Light", Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.33;
letter-spacing: normal;
color: #000000;
background: #ffffff;
border-radius: 0;
border: 2px solid #dddddd;
box-shadow: none;
padding: 1rem;
margin-bottom: 5px;
}
.submit-wrapper {
max-width: 800px;
margin: 0 auto;
text-align: right;
}
.endesa-form__btn {
position: relative;
display: inline-block;
width: auto;
height: 46px;
font-family: "RoobertENEL Bold", Arial, Helvetica, sans-serif;
font-size: 15px;
color: #ffffff;
letter-spacing: 1px;
text-align: left;
border-radius: 0;
border: none;
background: #d3135a;
text-align: center;
height: auto;
min-height: 46px;
overflow: hidden;
cursor: pointer;
text-transform: uppercase;
margin: 23px 0;
}
.endesa-form--sending .endesa-form__btn {
display: inline-block;
}
.endesa-form--sending .endesa-form__btn-text {
padding-right: 10px;
}
.endesa-form--sending .endesa-form__btn:after {
content: "";
display: inline-block;
position: relative;
width: 20px;
height: 20px;
margin-left: 8px;
border: 3px solid #ffffff;
border-radius: 50%;
border-top-color: transparent;
animation-name: spin;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-timing-function: linear;
vertical-align: middle;
}
.endesa-form__btn {
position: relative;
padding: 0 30px;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.endesa-form__btn--disable {
background: #FFE5EE;
cursor: not-allowed;
}
.endesa-form--sending {
display: block;
}
.endesa-form--sending:after {
content: "";
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #ffffff;
opacity: 0.5;
}
.footer {
background-color: #000;
color: #fff;
padding: 40px 20px;
font-size: 14px;
}
.footer-content {
max-width: 1000px;
margin: 0 auto;
padding: 0 40px; /* controla márgenes laterales */
}
.footer-title {
font-size: 16px;
font-weight: bold;
margin: auto;
margin-bottom: 20px;
}
.footer-divider {
width: 100%;
height: 1px;
background-color: white;
margin: 20px 0;
}
.footer-columns {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
gap: 40px;
max-width: 1000px;
margin: auto;
}
.footer-column {
min-width: 200px;
margin-bottom: 20px;
}
.footer-column h4 {
font-size: 16px;
margin-bottom: 10px;
}
.footer-column ul {
list-style: none;
padding: 0;
}
.footer-column ul li {
margin-bottom: 6px;
}
.footer-links {
text-align: center;
margin-top: 20px;
}
.footer-links a {
color: #00AEEF;
text-decoration: none;
margin: 0 10px;
}
.footer-links .separator {
color: #999;
}



Comments