﻿html	{	-webkit-text-size-adjust: 100%; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body 	{	font-size: clamp(15px, 1.00vw, 24px); line-height: 1.0; }

a, button	{	text-decoration: none; cursor: pointer; }
a, .nob		{	display: inline-block; white-space: nowrap; }
.btn:hover	{	text-decoration: none; }
p a:hover, 
ul a:hover	{	text-decoration: underline; }

small		{	}
strong		{	}
			    
h1, h2, h3, h4	{	font-weight: normal; font-weight: normal; }
			h1	{	font-size: 6.00rem; }
			h2	{	font-size: 6.00rem; text-transform: uppercase; }
			h3	{	font-size: 1.20rem; }
			h4	{	font-size: 1.00rem; text-transform: uppercase; }


p 		{	line-height: 1.40; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; }

h2 + p 	{	font-size: 1.50rem; line-height: 1.20; letter-spacing: 0.06em; }

#quick > div > a	{	font-size: 1.50rem; line-height: 1.00; letter-spacing: 0.15em; text-transform: uppercase; }

body.artists #intro + #start:after				{	font-size: 1.80rem; line-height: 2.00; letter-spacing: 0.15em; text-transform: uppercase; }

.date table tr:nth-child(1) td:nth-child(1)		{	font-size: 6.00rem; line-height: 0.66; }

#quote p	{	font-size: 5.40rem; line-height: 1.0; text-align: center; margin-bottom: 3.00vh; -ms-hyphens: none; -webkit-hyphens: none; hyphens: none; }

/* --- Story --- */

#story p 		{	line-height: 2.00; }
#story p + p 	{	margin-top: 2.00em; }

/* --- Footer --- */

ul 			{	display: inline-block; margin: 0 -0.30rem; }
ul li		{	display: inline-block; list-style: none; margin: 0 0.30rem; }
.copyright	{	text-align: center; }

/* --- Legal --- */

.legal p.ein	{	margin-left: 1.00em; text-indent: -1.00em; }   

	.legal p > span.item		{	display: block; margin-left: 0.90em; text-indent: -0.90em; }   
	.legal p > span.item:before	{	content: '•'; display: inline-block; margin-left: 0.90em; } 

/* --- Thanks --- */

#thanks *		{	text-align: center; }

/* --- Cookies--- */

#cookies	{	text-align: center; }
	
/* --- Spacing --- */

h1 + div,
h2 + p + div	{	margin-top: 4.00vw; }

h1 + p,
h2 + p,
p + h3,
p + ul 			{	margin-top: 2.00vw; }

h3 + h4,
h3 + h3, 	
h3 + p, 	
h4 + h4,
h4 + p,
p + h4, 	
p + p, 
span + p, 
p + span		{	margin-top: 1.00vw; }

/*	=================================
		FONTS
	================================= */
	
	{	font-weight: normal; font-style: normal; font-family: 'sofo-300', Arial, Helvetica, sans-serif; }	
i
	{	font-weight: normal; font-style: normal; font-family: 'sofo-310', Arial, Helvetica, sans-serif; }  
body, textarea
	{	font-weight: normal; font-style: normal; font-family: 'sofo-400', Arial, Helvetica, sans-serif; }  
h3
	{	font-weight: normal; font-style: normal; font-family: 'sofo-600', Arial, Helvetica, sans-serif; }  
h1, h2, nav	> div > span:first-child, #quick > div > a, #quote p
	{	font-weight: normal; font-style: normal; font-family: 'sofo-700', Arial, Helvetica, sans-serif; } 
.date table tr:nth-child(1) td:nth-child(1)
	{	font-weight: normal; font-style: normal; font-family: 'sofo-900', Arial, Helvetica, sans-serif; } 	

@font-face 	{   font-family: 'sofo-300'; src: url('../fonts/titilliumweb-300-light-gw.woff2') format('woff2'); }
@font-face 	{   font-family: 'sofo-310'; src: url('../fonts/titilliumweb-300-lightitalic-gw.woff2') format('woff2'); }
@font-face 	{   font-family: 'sofo-400'; src: url('../fonts/titilliumweb-400-regular-gw.woff2') format('woff2'); }
@font-face 	{   font-family: 'sofo-600'; src: url('../fonts/titilliumweb-600-semibold-gw.woff2') format('woff2'); }
@font-face 	{   font-family: 'sofo-700'; src: url('../fonts/titilliumweb-700-bold-gw.woff2') format('woff2'); }
@font-face 	{   font-family: 'sofo-900'; src: url('../fonts/titilliumweb-900-black-gw.woff2') format('woff2'); }
 
/*	=================================
		SCREENS
	================================= */
		
@media screen and (min-width : 0) and (max-width : 767px)
{	
	h1			{	font-size: 3.00rem; }
	h2			{	font-size: 3.00rem; }
	#quote p	{	font-size: 3.00rem; }

	@media screen and (orientation : portrait)
	{	
	html	{	font-size: 1.00rem; }
	}
	@media only screen and (orientation : landscape)
	{	
	html	{	font-size: 1.00rem; }
	}
}
@media screen and (min-width : 768px) and (max-width : 1024px)
{	
	@media screen and (orientation : portrait)
	{
	html	{	font-size: 1.00rem; }
	}
	@media screen and (orientation : landscape)
	{	
	html	{	font-size: 1.00rem; }
	}
}
@media screen and (min-width : 1025px)
{		
	html	{	font-size: 1.00rem; }
}    
         
/*	=================================
		END
	================================= */
