/* --- HTML5 RESET --- */

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;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	line-height: 1.8em;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block;}
body { line-height: 1; font-family: 'Roboto', sans-serif; }
ol, ul { list-style: none;}
blockquote, q { quotes: none;}

blockquote:before, blockquote:after,
q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
html {overflow-x: hidden;}

strong {font-weight: 700; line-height: 1em;}
.text-center {text-align: center;}
* { margin: 0; padding: 0; list-style: none; -webkit-font-smoothing: antialiased;}

body {
	background-image: url('https://www.asesoramientogestiones.es/images/bg-registrocivil.jpg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	font-family: 'Work Sans', sans-serif;
}

/* --- TIPOGRAFÍAS --- */

@font-face {
	font-family: 'Roboto'; src: url('https://www.asesoramientogestiones.es/fonts/Roboto-Regular.woff2') format('woff2');
    font-weight: 400; font-style: normal;
}

@font-face {
	font-family: 'Roboto'; src: url('https://www.asesoramientogestiones.es/fonts/Roboto-Bold.woff2') format('woff2');
    font-weight: 700; font-style: normal;
}

/* --- PALETA DE COLORES --- */

:root{
	--main-color: #0084ce;
	--accent-color: #00507c;
	
	--light-color: #ffffff;
	--grey-color: #f3f3f3; 
}

/* --- COMUNES --- */

a {
	text-decoration: none;
	color: #0084ce;
	line-height: 1em;
}

a:hover {
	text-decoration: underline;
	color: #0084ce;
	
} 

p{
	margin-bottom: 1em;
}

h1, .h1{
	font-size: 37px;
	font-weight: 700;
	color: #ffffff;
}

h2, .h2{
	font-size: 19px;
	color: #ffffff;
	line-height: 28px;
}

h3, .h3{
	font-size: 23px;
	color: #ffffff;
	text-align: center;
	line-height: 9px;
}

h4, .h4{
	font-size: 1.2rem;
	font-weight: 700;
	margin-bottom: 0.5em;
}

h5, .h5{
	font-size: 1.1rem;
	font-weight: 700;
	margin-bottom: 0.5em;
}


/* --- HEADER --- */

header {
    background: #043867;
    padding-bottom: 2em;
    padding-top: 4px;
    margin-bottom: 3em;
    height: 67px;
    margin-top: 35px;
}

.logo-box{
	text-align: center;
}

.logo{
	max-width: 300px;
}


/* - Top-bar - */

.top-bar{
	background: var(--grey-color);
	width: 100%;
    transition: ease 0.5s;
}

.top-bar a{
	padding: 0em 1em;
}

.top-bar .top-bar-content > div{
	display: inline-block;
}

.fixed-header{
	position: fixed; 
	z-index: 99999999;
	padding: 0.5em 0;
	background: var(--grey-color);
	top: 0vh;
}


/* --- CONTENIDO  --- */

.content-wrapper{
	margin-bottom: 2em;
}

.lista-servicios {
	line-height: 23px;
	color: #ffffff;
	margin-top: 50px;
}

.lista-servicios li {
	background-image: url('https://www.asesoramientogestiones.es/images/icono-list.png');
	background-repeat: no-repeat;
    background-position: left 6px;
	padding-left: 27px;
}

h2::after {
	width: 120px;
	height: 50px;
	border-top: 2px solid #DCB909;
	content: "";
    position: absolute;
    z-index: -1;
    top: 240px !important;
    bottom: 0;
    left: 14px;
    right: 0;
    
}


/* --- FORMULARIOS  --- */

.form_box {
    background: #043867;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 40px;
    border-top: 6px solid #DCB909;
    padding-bottom: 6px;
}

.txt-destacado {
	font-size: 33px;
	text-align: center;
	font-weight: 700;
	color: #fff;
	margin: 0px;
}

.form_box form {
	text-align: left;
	margin-top: 1em;
}

.form_box .form label {
    width: 100%;
    margin-bottom: 0.3em;
    color: #fff;
}

.form_box .form input[type="text"] {
    width: 100%;
    padding: 0.4em 0em;
    font-size: 1em;
    background: transparent;
    border: 0px;
    border-bottom: 1px solid #fff;
}

.form_box .form textarea {
    width: 100%;
    padding: 0.5em 0em;
    font-size: 1em;
    background: transparent;
    border: 0px;
    border-bottom: 1px solid #fff;
}

.form-group span {
    color: #fff;
    font-size: 12px;
}

.check {
    color: #fff;
}


.form_box input, .form_box textarea {
    color: #fff;
}

.form_box input:focus,
.form_box textarea:focus {
	/*outline: 2px solid #959595;*/
	color: #fff;
    padding-left: 10px !important;
}

.form_box::placeholder,
.form_box:-ms-input-placeholder{
	color: #fff;
	font-size: 1em;
	padding: 5px;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: #fff;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: #fff;
   opacity: 1 /* esto es porque Firefox le reduce la opacidad por defecto */;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: #fff;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #fff;
}


.form_box .check input[type="checkbox"],
.form_box .check label{
	display: inline-block;
	width: auto;
}

.form_box .check label{padding-left: 0em;margin-left: 0px;font-size: 13px;}
.form_box li.check input:focus {outline: none;}

.form_box .wildcard{
	color: red;
    font-size: 1em;
    padding-left: 3px;
    vertical-align: top;
}

input.cta-button {
    width: 100%;
    height: 60px;
    border: 0px;
    background-color: #DCB909;
    text-transform: uppercase;
    color: #043867;
    font-weight: bold;
    font-size: 16px;
}

input.cta-button:hover {
    background-color: #0084ce;
    cursor: pointer;
}

.selector-form {
    width: 100%;
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
    padding-left: 10px;
    padding-right: 20px;
    margin-bottom: 10px;
    padding: .8em 1.4em .8em .8em;
}

.select-css:focus {
    border-radius: 0px
}
  

option.estilo-celda {
	background-color: #043867;
    color: #fff;

}

.mensaje {
	margin-bottom: 0px;
}

.cta-fixed {
	display: none
}

/* - Verificación formulario  - */

.form_box label.error,
#contact-form > ul > li.check > label.error {
	color: #c40000;
	margin: 5px;
}

.form_box .sms_ok {
	font-size: 16px;
	line-height: 20px;
	font-weight: 400;
	padding: 30px 30px 50px 30px;
}

.form_box .sms_ok h5 {
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 15px;
    line-height: 22px;
    text-align: center;
}

.sms.sms_ok p {
    color: #fff;
    text-align: center;
    line-height: 23px;
}

.sms_ok .tpv_response_code{
    background: #c4e8c4;
    padding: 1em 2em;
    color: #234423;
    font-size: 0.9em;
}

.sms_ko .tpv_response_code{
    background: #e8c4c4;
    padding: 1em 2em;
    color: #981414;
    font-size: 0.9em;
}

/* --- FOOTER  --- */

footer {
    background-color: #043867;
    padding-bottom: 0.5em;
    padding-top: 1.5em;
    margin-top: 2em;
    font-size: 0.8em;
    color: #fff;
}

.list-legales {
    text-align: center;
}

.list-legales li {
    display: inline-flex;
    text-align: center;
    margin-right: 20px;
}

footer p {
	text-align: center;
	line-height: 19px;
}

/* - Firma Idento - */ 

.wrapper-idento {
    display: inline-block;
    vertical-align: middle;
}

.firma-idento {
    background: url(https://www.asesoramientogestiones.es/images/idento.svg);
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    display: inline-block;
    background-size: 53px;
    margin: 0;
    transition: width 0.3s;
    margin-top: 0px;
	vertical-align: middle;
}

.firma-idento.white {
    background-image: url(https://www.asesoramientogestiones.es/images/idento_neg.svg);
}

.firma-idento:hover {
    width: 53px;
}

/* Miel */

#contact-form #mail,
#contact-form2 #mail{
	visibility: hidden;
	position: absolute;
	opacity: 0;
	left: -100vw;
}


.content-legal {
    padding: 2rem;
}

.content-legal p {
    color: #fff;
}

.content-legal ul {
    padding-left: 2rem;
}

.content-legal ul li {
    list-style: disc;
	color:#fff;
}

.content-legal .h2:after {
    display: none;
}

.content-legal table td {
    border: 1px solid #000001;
    padding: 0.5rem;
}

.content-legal table p {
    margin-bottom: 0rem;
}


/* --- RESPONSIVE  --- */

@media only screen and (min-width: 1400px) {
	h2::after {
    top: 265px !important;
}
}
@media only screen and (max-width: 1199px) {}
@media only screen and (max-width: 1024px) {
	h1, .h1 {
    font-size: 38px;
}

h3, .h3 {
    font-size: 19px;

}
}
@media only screen and (max-width: 991px) {

/*Contenido*/
	h2::after {
    top: 191px !important;
}

.form_box .form input[type="text"] {
    padding: 0.5em 0em;
}

.tipo-consulta {
	margin-top:10px;
}

.selector-form {
    width: 95%;
}

.form_box {
    padding-bottom: 20px;
}

}
@media only screen and (max-width: 767px) {

/*Contenido*/

h1, .h1 {
    font-size: 39px;
    font-weight: 700;
    color: #ffffff;
}	
   
}

@media only screen and (max-width: 640px) {

	
}

@media only screen and (max-width: 479px) {

h2::after {
    top: 245px !important;
}
.cta-fixed{
    width: 100%;
    bottom: 0;
    height: 60px;
    border: 0px;
    display: flex;
    background-color: #DCB909;
    text-transform: uppercase;
    position: fixed;
    text-align: center;
    justify-content: center;
    align-items: center;
    z-index: 9;
    transition: 0.5s;
    left: 0px;
}



.cta-fixed a {
    color: #043867;
    font-weight: bold;
    font-size: 18px;

}

.selector-form {
    width: 92%;
}

}


@media only screen and (max-width: 375px) {

/*Header*/
header {
    margin-bottom: 2em;
}
/*Contenido*/
h1, .h1 {
    font-size: 30px;
    padding-right: 100px;
}

h2, .h2 {
    font-size: 18px;
   line-height: 23px;
}
h2::after {
    top: 340px !important;
}
.lista-servicios li {
    line-height: 24px;
}
h3, .h3 {
    font-size: 17px;
}
.txt-destacado {
    font-size: 29px;
}

.form_box {
    padding-left: 40px;
    padding-right: 40px;
}
.selector-form {
    width: 90%;
}
footer {
    padding-bottom: 5.5em;
}
}

@media only screen and (max-width: 360px) {
	h2::after {
    top: 380px !important;
}
}

@media only screen and (max-width: 320px) { 
h1, .h1 {
    font-size: 27px;
	padding-right: 50px;
}

h2, .h2 {
    font-size: 17px;
}

h2::after {
    top: 320px !important;
}

.form_box {
    padding-left: 20px;
    padding-right: 20px;
}

h3, .h3 {
    font-size: 16px;
}
.form_box .check label {
    font-size: 12px;
}
}