:root{
    --color-main-background: hsla(216, 23%, 8%, 1);
    --color-text: #fff;
    --color-gray: #B3B3B3;
    --color-interaction-label--default: #D9D9D9;
    --image-check-mark: url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' height='12px' viewBox='0 0 16 12'%3E%3Cg fill='none'%3E%3Cpolyline fill='%23D9D9D9' points='5.716276912625126,12.000001999999999 0.000001574640847934461,7.09538706191368 0.8507178062690741,6.3393640628990156 5.60357590700913,10.420190173640059 15.049915966739277,0.000001491017911803283 16.000002999259955,0.657550566697882 5.716276912625126,12.000001999999999'/%3E%3C/g%3E%3C/svg%3E);
}

html{
    background: var(--color-main-background);
}

body{
    background: var(--color-main-background);
    color: var(--color-text);
}

h1,h2,h3,h4,h5,h6{
    color: var(--color-text);
}

label{
    color: var(--color-gray);
    transition-duration: .25s;
    transition-timing-function:cubic-bezier(0.75, 0.02, 0.5, 1);
}

input,select, textarea{
    background: transparent;
}

.label_text_focus {
    top: -20px;
    color:var(--color-text);
    font-size: 0.9em;
}

.span_bottom_text{
    position: absolute;
    left: 15px;
    bottom: -40px;
}

div, p{
    color: var(--color-interaction-label--default);
}

.p_datos:hover{
    color: var(--color-text);
}

.a_collapse{
    color: var(--color-interaction-label--default);
}

.button.call-to-action{
    background: #fff;
    color: #000;
}

.button.call-to-action:hover {
    background-color: var(--color-gray);
}

input[type="radio"]:hover + label,
input[type="radio"]:checked + label {
    color: var(--color-gray);
}

.check {
    transition-property: border;
    transition-duration: .25s;
    transition-timing-function:cubic-bezier(0.75, 0.02, 0.5, 1);
}

.check:hover {
    border-color: var(--color-text);
}

.container_check input[type="checkbox"]:checked ~ .check {
    background-size: 16px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' height='12px' viewBox='0 0 16 12'%3E%3Cg fill='none'%3E%3Cpolyline fill='%23D9D9D9' points='5.716276912625126,12.000001999999999 0.000001574640847934461,7.09538706191368 0.8507178062690741,6.3393640628990156 5.60357590700913,10.420190173640059 15.049915966739277,0.000001491017911803283 16.000002999259955,0.657550566697882 5.716276912625126,12.000001999999999'/%3E%3C/g%3E%3C/svg%3E");
}