/*
Theme Name: SOS ANIMAL TESTIMONIALS 2026
Theme URI: sosanimal.es
Description: Tema creado para SOS Animal. Todos los derechos reservados.
Author: SOS ANIMAL
Author URI: sosanimal.es
Version: 0.9b

*/

:root {
	--main-color: #0357a5;
	--alt-color: #52acfb;
	--alt-2-color: #223645;
	--alt-3-color: #08172b;


	--grey_900: #333;
	--grey_800: #454545;
	--grey_700: #4f4f4f;
	--grey_600: #5d5d5d;
	--grey_500: #6d6d6d;
	--grey_400: #888888;
	--grey_300: #b0b0b0;
	--grey_200: #d1d1d1;
	--grey_100: #e7e7e7;
	--grey_50: #f6f6f6;

	--dark-grey: #6d6d6d;
	--grey: #b0b0b0;
	--light-grey: #f6f6f6;


	--main-color_800: #074985;
	--main-color_700: #0357a5;
	--main-color_600: #026bc7;
	--main-color_500: #0e89e9;
	--main-color_400: #38a5f8;
	--main-color_300: #7dc3fc;
	--main-color_200: #baddfd;
	--main-color_100: #e0eefe;
	--main-color_50: #f0f7ff;

	--alt-color_100: #dbedfe;
	--alt-color_200: #bee0ff;

	--alt-2-color_100: #daedf3;
	--alt-2-color_200: #b9dce8;

	--alt-3-color_100: #e2edfc;
	--alt-3-color_200: #bfdbf8;
	
	
	--font-main-color: #1d1d1b;
	--h-color: #223645;

	--green: #27ae60;
	--red:  #e74c3c;

	--font-family-main-regular: 'Poppins Regular';
    --font-family-main-italic: 'Poppins Italic';

    --font-family-main-light: 'Poppins Light';
    --font-family-main-light-italic: 'Poppins Light Italic';

    --font-family-main-thin: 'Poppins Thin';
    --font-family-main-thin-italic: 'Poppins Thin Italic';

    --font-family-main-medium: 'Poppins Medium';
    --font-family-main-medium-italic: 'Poppins Medium Italic';

    --font-family-main-bold: 'Poppins Bold';
    --font-family-main-bold-italic: 'Poppins Bold Italic';

    --font-family-main-black: 'Poppins Black';
    --font-family-main-black-italic: 'Poppins Black Italic';

    --font-family-alt-black: 'Arson Pro Black';
    --font-family-alt-black-italic: 'Arson Pro Black Italic';

    --font-family-alt-bold: 'Arson Pro Bold';
    --font-family-alt-bold-italic: 'Arson Pro Bold Italic';

    --font-family-alt-medium: 'Arson Pro Medium';
    --font-family-alt-medium-italic: 'Arson Pro Medium Italic';

    --font-family-alt-regular: 'Arson Pro Regular';
    --font-family-alt-regular-italic: 'Arson Pro Regular Italic';

    --font-family-alt-light: 'Arson Pro Light';
    --font-family-alt-light-italic: 'Arson Pro Light Italic';

    --font-family-alt-narrow-bold: 'Arson Pro Narrow Bold';
    --font-family-alt-narrow-medium: 'Arson Pro Narrow Medium';

	--font-size: 14px;
	--font-size-xs: 0.75em;
	--font-size-sm: 0.85em;
	--font-size-normal: 1em;
	--font-size-md: 1.25em;
	--font-size-lg: 1.5em;
	--font-size-xl: 2em;
	--font-size-2xl: 3em;
	--font-size-3xl: 4em;
	--font-size-4xl: 5em;
	--font-size-5xl: 6em;

	--header-heigth: 64px;

	--whatsapp-color: #25d366;
	--whatsapp-color-teal-green: #128C7E;
	--whatsapp-color-teal-green-dark: #075E54;

}

@media( min-width: 768px ){
	:root{
		--header-heigth: 64px;
		--font-size: 14px;
	}
}

/*--------------------------------------------------------------
HTML TAGS
--------------------------------------------------------------*/

body{
	font-family: var(--font-family-main-regular);
	font-size: var(--font-size);
	line-height: 1.5;
	color: var(--font-main-color);
}

small, .small{
	line-height: 1;
	font-size: var(--font-size-xs);
}

/*----------HGROUP---------*/
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: var(--font-family-alt-black);
  font-weight: 500;
  line-height: 1.1;
  color: var(--h-color);

}

h1, .h1, h2, .h2, h3, .h3{
	margin-top: 10px;
}

/*----------P---------*/
p{
	margin-bottom: 1.5em;
}

/*---------FORMS & BUTTONS-----------*/
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: var(--dark-grey);
  opacity: 0.8;
}
::-moz-placeholder { /* Firefox 19+ */
  color: var(--dark-grey);
  opacity: 0.8;
}
:-ms-input-placeholder { /* IE 10+ */
  color: var(--dark-grey);
  opacity: 0.8;
}
:-moz-placeholder { /* Firefox 18- */
  color: var(--dark-grey);
  opacity: 0.8;
}

input[type="checkbox"] + label, label.checkbox{
	font-weight: normal;
	max-width: 90%;
	padding-left: 0.5em;
}
legend{
	color: var(--main-color);
	font-weight: bold;
}
input, select, textarea{
	padding: 5px 15px;
	border: 1px solid var(--grey);
	border-radius: 0.5em;
	max-width: 100%;
	margin-bottom: 0.5em;
	margin-bottom: 0.5em;
	background: transparent;
	vertical-align:top;
}
	textarea{
		resize: none;
		min-height: 5em;
		width: 100%;
	}
	input, select{
		height: 38.5px;
	}
	input:hover, textarea:hover, select:hover,
	input:focus, textarea:focus, select:focus,
	input:active, textarea:active, select:active {
		border-color: var(--grey);
		outline: none;
  		box-shadow: 0 0 0 3px var(--alternative-color);
	}
	input[type=checkbox], input[type=radio]{
		height: auto;
		width: auto;
		display: inline-block;
	}

input[type=submit], input[type="cancel"], input[type=reset], button, .btn, .button{
	border: 3px solid transparent;
	background: var(--main-color);
	border-radius: 0.5em;
	
	font-family: var(--font-family-main-medium);
	font-size: inherit;
	color: #fff;
	text-decoration: none;

	height: auto;
	padding: 5px 10px;
	margin: 0.5em;
	display: inline-block;

	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.btn{
	vertical-align: initial;
	line-height: inherit;
	text-decoration: none;
	white-space: normal;
}
input[type=reset]{
	border-color: #000;
	background: transparent;
	color: #000;
}

	input[type=submit]:hover, input[type=reset]:hover, button:hover, .btn:hover, .button:hover,
	input[type=submit]:focus, input[type=reset]:focus, button:focus, .button:focus, .button:hover{
		color: #fff;
		background: var(--alt-color);
		border-color: var(--main-color);
		text-decoration: none;
		box-shadow: none;
	}
	input[type=reset]:hover, input[type=reset]:focus{
		border-color: #000;
		background: #000;
		color: #fff;
	}

	.required{
		color: var(--red);
	}
	.invalid{
		border: 1px solid var(--red);
	}

/**********BTN ICON************/
.btn-icon{
	display: inline-flex;
	flex-direction: row;
	align-items: center;
}
	.btn-icon-text{
		margin-right: 1em;
	}
	.btn-icon-text + .btn-icon-img{
		margin-left: 1em;
		margin-left: auto;
	}
	.btn-icon-img{
		max-height: 20px;
		max-width: 100%;
	}
	.btn-icon-img + .btn-icon-text{
		margin-left: 1em;
	}

/**********BTN ICON************/

.btn-icon:hover .btn-icon-on-hover + .btn-icon-img{
	display: none;
}
.btn-icon .btn-icon-on-hover{
	display: none;
}
	.btn-icon:hover .btn-icon-on-hover{
		display: inherit;
	}

/***********************************
 * 
 * THEME
 * 
 * ********************************/
.testimonial_catcha_content .entry-header .content{
	padding-top: 2em;
	padding-bottom: 2em;
	background-color: var(--alt-color);
	color: #fff;
}

.testimonial_catcha_content .entry-header .the_title{
	color: #fff;
}

.testimonial_catcha_content .entry-content .content{
	padding-top: 2em;
}

.testimonial{
	padding: 1em;
	border: 2px solid var(--grey);
	border-radius: 0.7em;

	margin-bottom: 1em;
}

.testimonial-rate{
	margin-bottom: 1em;
}

.testimonial-name{
	text-align: right;
	display: none;
}


.testimonial_catcha_content .entry-footer{
	margin-bottom: 2em;
}

.mz_btn_testimonial{
	font-size: 1.15em;
}

.site-logo{
	width: 100%;
	max-width: 256px;
	height: auto;
	display: block;

	margin-left: auto;
	margin-right: auto;

	padding-left: 15px;
	padding-right: 15px;
}


.testimonial_catcha_no_results .entry-header .content{
	padding-top: 2em;
	padding-bottom: 2em;
}

.content-no-found-icon{
	margin-top: 2em;
	margin-bottom: 2em;
	margin-left: auto;
	margin-right: auto;

	max-width: 100%;
	height: auto;
	display: block;

}

.testimonial_catcha_no_results .entry-header .content .entry-title,
.testimonial_catcha_no_results .entry-header .content .entry-description{
	text-align: center;
}