/*!
Theme Name: Lili
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: pigi
Tags: custom-logo, custom-menu, threaded-comments, translation-ready

*/
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i&display=swap');
@import url('https://fonts.googleapis.com/css?family=Red+Hat+Text:400,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nothing+You+Could+Do&display=swap');

.font-nothy{ font-family: 'Nothing You Could Do', cursive; }
.font-monty{ font-family: 'Montserrat', sans-serif; }
.font-text { font-family: 'Montserrat', sans-serif; }
.font-arrow{ font-family: 'Red Hat Text', sans-serif; }

.font-nothy p { font-family: 'Nothing You Could Do', cursive; }
.font-monty p { font-family: 'Montserrat', sans-serif; }
.font-text  p { font-family: 'Montserrat', sans-serif; }


/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Media
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html { margin: 0; padding: 0; }
body { margin: 0; padding: 0; }

hr { box-sizing: content-box; 	height: 0; overflow: visible; }
pre { font-family: monospace, monospace;   }
a { background-color: transparent; }
abbr[title] {  border-bottom: none; text-decoration: underline;	text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp { font-family: monospace, monospace;  }
small {	font-size: 80%;}
sub, sup { 	font-size: 75%; line-height: 0; 	position: relative; 	vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
img { border-style: none; }
div { margin:0; padding:0; }
p   { margin:0; padding:0; position: relative; }
h1, h2, h3, h4, h5, h6 { clear: both; margin:0 0 12px; position: relative; }

/*--------------------------------------------------------------
# grid layout
--------------------------------------------------------------*/


html, body { overflow-x: hidden;  scroll-behavior: smooth; margin:0; padding:0; position: relative; }

*, *:before, *:after { box-sizing: border-box; }

.page   { position: relative; width:100%; min-height:100vh; margin:0; padding: 0; }
.header { position: relative; width:100%; height: auto; margin:0; padding: 0; }
.footer { position: relative; width:100%; height: auto; margin:0; padding: 0; }

.content{ position: relative; width:100%;  }

.section-full  { position: relative; width:100%; max-width: 100%;   margin:0 auto; }
.section-block { position: relative; width:100%; max-width: 1120px; margin:0 auto; padding-right: 60px; padding-left:60px; }

@media ( max-width: 760px ) {
	.content{ padding-left: 0; }
	.section-block { padding-left:40px; padding-right: 40px; }
}
@media ( max-width: 520px ) {
	.section-block { padding-left:30px; padding-right: 30px; }
}


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
html { scroll-behavior: smooth; }
html, body{ font-size: 18px; line-height: 1.4;  color:#626262; }
dfn, cite, em, i { 	font-style: italic; }
div, p, .page{  }
small{ font-size: 60% }
big { font-size: 125%; }

button,
input,
select,
optgroup,
textarea {  color: #404040;	font-size: 18px; line-height: 1.5; }
	
h1, h2, h3, h4, h5, h6 { font-weight: 700; line-height: 1.25; }
h1 { font-size: 38px; }
h2 { font-size: 32px; }
h3 { font-size: 26px; }
h4 { font-size: 20px; }
h5 { font-size: 18px; }
h6 { font-size: 16px; }

@media ( max-width: 520px ) {
	h1 { font-size: 36px; }
	h2 { font-size: 32px; }
	h3 { font-size: 26px; }
	h4 { font-size: 20px; }
}
.space-1 { letter-spacing: -1px; }
.space-2 { letter-spacing: -2px; }
.space-3 { letter-spacing: -3px; }
.space-4 { letter-spacing: -4px; }
.space-5 { letter-spacing: -5px; }
.space-6 { letter-spacing: -6px; }
.space-7 { letter-spacing: -7px; }
.space-8 { letter-spacing: -8px; }
.space-9 { letter-spacing: -9px; }
.space-10{ letter-spacing: -10px; }


/*--------------------------------------------------------------
# Font families
--------------------------------------------------------------*/
html, body{ font-family: 'Montserrat', sans-serif;  }

.font-nothy{ font-family: 'Nothing You Could Do', cursive; }
.font-monty{ font-family: 'Montserrat', sans-serif; }
.font-text { font-family: 'Montserrat', sans-serif; }
.font-arrow{ font-family: 'Red Hat Text', sans-serif; }

.font-nothy p { font-family: 'Nothing You Could Do', cursive; }
.font-monty p { font-family: 'Montserrat', sans-serif; }
.font-text  p { font-family: 'Montserrat', sans-serif; }


/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

p{ margin: 0 0 12px; }
div p:last{ margin:0; }
hr { background-color: #ccc; border: 0;	height: 1px; margin-bottom: 1.5em; }
blockquote { margin: 0 1.5em; }
address { 	margin: 0 0 1.5em; }
s{ text-decoration: none; color:#FF0066;  }

ul, ol { margin: 0 0 12px; padding-left: 26px; }
ul { list-style: disc; }
ol { list-style: decimal; }
li { margin-bottom: 8px; margin-left: 0; padding-left:0; }

img { height: auto;  max-width: 100%; }
figure { margin: 1em 0; }

table { margin: 0 0 1.5em; 	width: 100%; }


/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"], input[type="reset"], input[type="submit"] {
	padding: 10px 30px; border: 1px solid; 	border-color: #ccc #ccc #bbb; 	border-radius: 3px;
	background: #e6e6e6; color: rgba(0, 0, 0, 0.8);  font-size: 12px;  	line-height: 1;
}

button:hover, input[type="button"]:hover, input[type="reset"]:hover,
input[type="submit"]:hover { border-color: #ccc #bbb #aaa; }

button:active, button:focus, input[type="button"]:active, input[type="button"]:focus,
input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active,
input[type="submit"]:focus { border-color: #aaa #bbb #bbb; }

input, textarea {  color: #666; border: 1px solid #ccc; border-radius: 3px; padding: 10px; }

input:focus, textarea:focus { color: #111; }

select {  border: 1px solid #ccc;  }

textarea { 	width: 100%; }


/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/


/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a, a:visited { color: #626262; text-decoration: none; border-bottom: 1px dotted #EF105E;  }
a:focus, a:active { color:#EF105E;  outline:0; }
a:hover  { opacity:0.7; }

a.link-gold,  a.link-gold:visited  { color:#FDD947; border-color:#FF0066; }
a.link-pinky, a.link-pinky:visited { color:#FF0066; border-color:#626262; }
a.link-light, a.link-light:visited { color:#FAFAFAcc; border-color:#FF0066; }
a.link-white, a.link-white:visited { color:#FFFFFF; border-color:#FF0066; }
a.link-black, a.link-black:visited { color:#000000; border-color:#FF0066; }

a.link-clean, a.link-clean:visited { border:none; text-decoration: none; }

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/

embed, iframe, object { max-width: 100%; }

.bg-cover { background-position: center center; background-size: cover;   background-repeat: no-repeat; }
.bg-image { background-position: center center; background-size: contain; background-repeat: no-repeat; } 
.bg-repeat{ background: repeat; } 
.bg-fixed { background-attachment: fixed; }
.bg-left  { background-position: left center;}
.bg-right { background-position: right center; }



/*--------------------------------------------------------------
# Colors
--------------------------------------------------------------*/

:root{ 
--text  : #626262; 
--light : #F0F0F0; 
--lity  : #FAFAFA;
--lite  : #EEEEEE; 
--gold  : #FFDC00; 
--pinky : #FF0066; 
--mint  : #92FCA4;
--aqua  : #5bc7bc; 
--blue  : #191765; 
--bluew : #2F4858; 
}

.color-text   { color: var(--text); }
.color-light  { color: var(--light); }
.color-lite   { color: var(--lite); }
.color-gold   { color: var(--gold); }
.color-pinky  { color: var(--pinky); }
.color-aqua   { color: var(--aqua); }
.color-mint   { color: var(--mint); }
.color-blue   { color: var(--blue); }
.color-bluew  { color: var(--bluew); }
.color-white  { color: white; }
.color-black  { color: black; }

.color-text  p { color: var(--text); }
.color-light p { color: var(--light); }
.color-lite  p { color: var(--lite); }
.color-gold  p { color: var(--gold); }
.color-pinky p { color: var(--pinky); }
.color-aqua  p { color: var(--aqua); }
.color-mint  p { color: var(--mint); }
.color-blue  p { color: var(--blue); }
.color-bluew p { color: var(--bluew); }
.color-white p { color: white; }
.color-black p { color: black; }



.bg-text      { background-color: var(--pinky); }
.bg-lity      { background-color: var(--lite); }
.bg-light     { background-color: var(--light); }
.bg-lite      { background-color: var(--lite); }
.bg-gold      { background-color: var(--gold); }
.bg-pinky     { background-color: var(--pinky); }
.bg-aqua      { background-color: var(--aqua); }
.bg-mint      { background-color: var(--mint); }
.bg-blue      { background-color: var(--blue); }
.bg-bluew     { background-color: var(--bluew); }
.bg-white     { background-color: white; }
.bg-black     { background-color: black; }

@media (max-width: 520px) {
.mobi-bg-text      { background-color: var(--pinky); }
.mobi-bg-lity      { background-color: var(--lite); }
.mobi-bg-light     { background-color: var(--light); }
.mobi-bg-lite      { background-color: var(--lite); }
.mobi-bg-gold      { background-color: var(--gold); }
.mobi-bg-pinky     { background-color: var(--pinky); }
.mobi-bg-aqua      { background-color: var(--aqua); }
.mobi-bg-mint      { background-color: var(--mint); }
.mobi-bg-blue      { background-color: var(--blue); }
.mobi-bg-bluew     { background-color: var(--bluew); }
.mobi-bg-white     { background-color: white; }
.mobi-bg-black     { background-color: black; }
}	

.border-8 { border: 8px solid black; }
.border-black { border-color: black; }
.border-pinky { border-color: var(--pinky); }

/*--------------------------------------------------------------
# ul lists
--------------------------------------------------------------*/

ul.pinky { list-style: none; padding:0;  }
ul.pinky li{ padding-left: 30px;  margin-bottom:12px; }
ul.pinky li::before { content:"\2022"; display: inline-block; font-weight:bold; font-size:160%; width:22px; height: 22px; margin-left:-20px; line-height: 10px; color:var(--pinky); }


ul.check2,
ul.check { list-style: none; padding:0; }
ul.check2 li,
ul.check li{ padding-left:24px; margin-bottom:12px; }
ul.check2 li::before,
ul.check li::before { content:" "; display:inline-block; width:24px; height:20px; margin-left:-24px;  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewbox='0 0 24 24'%3e%3cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z' fill='%23FF0066'%3e%3c/path%3e%3c/svg%3e"); background-size: 85%; background-repeat: no-repeat; background-position: left bottom; }
ul.check2 li{ padding-left:0;}
ul.check2 li::before{ margin:0;}

ul.border{ padding:30px 0 30px 26px; border-left:4px solid var(--pinky); }

ul.check2 h2, ul.check2 h2,
ul.check2 h3, ul.check2 h3,
ul.check2 h4, ul.check2 h4,
ul.check2 h5, ul.check2 h5,
ul.check2 h6, ul.check2 h6 { display: inline-block; }


/*--------------------------------------------------------------
# Slick slider plugin jQ
--------------------------------------------------------------*/
	
.page-slider { display: none; }	
.page-slider { min-height: 60px; width:100%; padding:0 30px; position: relative; margin:0; height: auto;  }
.page-slider .slide{ display: inline-block; width:100%; padding:0;  margin: 0; position: relative; overflow: hidden; }

.page-slider .slick-prev,
.page-slider .slick-next{ display:inline-block; vertical-align:middle; font-family: 'Red Hat Text'; font-size: 60px; color:black; 
						  position: absolute; z-index:1; height:60px; width:60px; top:calc(50% - 40px); line-height: 60px; }
.page-slider .slick-prev { left: 0; text-align: left; }
.page-slider .slick-next { right:0; text-align: right; }

.page-slider .slick-prev:hover,
.page-slider .slick-next:hover { opacity: 0.4; }	    

.page-slider .slick-next:before,
.page-slider .slick-prev:before { display: none; }

.page-slider .slick-dots { left: 0; }
.page-slider .slick-dots li { margin: 0 8px; }
.page-slider .slick-dots li button{ border:0; background: #34517D; opacity:0.4; border-radius:50%; width:14px; height:14px; } 			 
.page-slider .slick-dots li button::before{ content: ' ' } 			 
.page-slider .slick-dots li button:hover,
.page-slider .slick-dots li.slick-active button{ opacity:1;  } 			 
	
@media ( max-width: 520px ) {
	.page-slider { padding:0;   }
	.page-slider .slick-prev { left: -30px; }
	.page-slider .slick-next { right:-30px; }
}
	

/*--------------------------------------------------------------
# venobox
--------------------------------------------------------------*/
	
.vbox-close {
    font-size: 48px;
    line-height: 40px;
    padding: 0;
}

/*--------------------------------------------------------------
# arrow
--------------------------------------------------------------*/

.arrow { position: relative; border-left: 4px solid var(--pinky);}
.arrow:after, 
.arrow:before{ right: 100%; top: 30px; border: solid transparent; content: " ";
			   height: 0; width: 0; position: absolute; pointer-events: none; }
.arrow:after { border-color: rgba(0,0,0,0); border-right-color: white; border-width: 10px; margin-top: -10px; }
.arrow:before{ border-color: rgba(0,0,0,0); border-right-color: var(--pinky); border-width: 16px; margin-top: -16px; }
	
/*--------------------------------------------------------------
# medium editor
--------------------------------------------------------------*/

.medium-editor-element{ font-size: 18px !important; line-height: 1.4 !important; font-family: 'Montserrat', sans-serif !important; 
						color:var(--text) !important; }
.medium-editor-element em, .medium-editor-element i { font-style: italic !important; }
.medium-editor-element small { font-size: 60% !important; }
.medium-editor-element big   { font-size: 125% !important; }
	
.medium-editor-element h1 { font-weight: 700 !important; line-height: 1.25 !important; font-size: 38px !important; }
.medium-editor-element h2 { font-weight: 700 !important; line-height: 1.25 !important; font-size: 32px !important; }
.medium-editor-element h3 { font-weight: 700 !important; line-height: 1.25 !important; font-size: 26px !important; }
.medium-editor-element h4 { font-weight: 700 !important; line-height: 1.25 !important; font-size: 20px !important; }
.medium-editor-element h5 { font-weight: 700 !important; line-height: 1.25 !important; font-size: 18px !important; }
.medium-editor-element h6 { font-weight: 700 !important; line-height: 1.25 !important; font-size: 16px !important; }

.medium-editor-element .color-text{ color: var(--text) !important; }
.medium-editor-element .color-black{ color: black !important; }
.medium-editor-element s,
.medium-editor-element .color-pinky{ color: var(--pinky) !important; }


/*--------------------------------------------------------------
# Paper Box
--------------------------------------------------------------*/

.paper-box{
	position: relative;
	width: 500px;
	padding: 50px;
	margin: 0 auto;
	background-color: white;
}


/*--------------------------------------------------------------
# Button contacto
--------------------------------------------------------------*/

button, input[type="button"], input[type="reset"], input[type="submit"] {}

.af-submit-button	{
	    padding: 10px 30px;
	    border: none;
		border-radius: 0;
		background: var(--pinky);
		color: white;
		font-size: 16px;
		line-height: 1;
}	

.btn {
    display: inline-block;
    line-height: 40px;
    color: #FFFFFF !important;
    padding: 6px 30px;
    min-width: 200px;
    border-radius: 6px;
    text-decoration: none;
    opacity: 1;
    border: 0;
}
.btn-mini{ line-height: 36px; padding:0 20px; border-radius:3px; font-size: 14px; }

.btn-text      { background-color: var(--pinky); }
.btn-lity      { background-color: var(--lite); }
.btn-light     { background-color: var(--light); }
.btn-lite      { background-color: var(--lite); }
.btn-gold      { background-color: var(--gold); }
.btn-pinky     { background-color: var(--pinky); }
.btn-aqua      { background-color: var(--aqua); }
.btn-mint      { background-color: var(--mint); }
.btn-blue      { background-color: var(--blue); }
.btn-bluew     { background-color: var(--bluew); }
.btn-white     { background-color: white; }
.btn-black     { background-color: black; }

