/* ====================================================================== */
/* =========================== Default Screen =========================== */
/* ====================================================================== */

*,
*::after,
*::before {
	font: 400 calc(var(--main-texts) * 1.00)/1.50em 'Dial', Helvetica, Arial, sans-serif;
	background-position: center center;
	background-repeat: no-repeat;
	box-sizing: border-box;
	background-size: cover;
	position: relative;
}

:root {
	--back-color: 246, 245, 241;
	--main-color: 000, 000, 000;
	--main-texts: 1.6rem;
	--main-space: 2.4rem;
}

html,
body {
	overscroll-behavior: none;
}

html {
	height: 100%;
	scroll-behavior: smooth;
	font-size: 0.6945vw;
	cursor: default;
}
	
body {
	height: 100%;
	-webkit-font-smoothing: antialiased !important;
	-webkit-text-size-adjust: none !important;
	font-smoothing: antialiased !important;	
	background-color: rgba(var(--back-color), 1.0);
	transition: background-color 0.6s ease;
	color: rgba(var(--main-color), 1.0);
	line-height: 0;
	padding: 0;
	margin: 0;
}

wrapper {
	width: 100%;
	padding: calc(var(--main-space) * 3) calc(var(--main-space) * 1);
	justify-content: center;
	flex-direction: column;
	align-items: center;
	position: relative;
	display: flex;
}

body:before {
	width: 100%;
	height: 1px;
	top: calc(var(--main-space) * 5);
	background-color: #F00;
	position: fixed;
	z-index: 9999;
	opacity: 0;
	content: "";
}

#home  section wrapper { padding-top: calc(var(--main-space) * 10) !important; }
#book  section wrapper,
#media section wrapper,
#about section wrapper { padding-top: calc(var(--main-space) * 5) !important; }

/* ---------------------------------------- */
/* ----- >>> Structure -------------------- */
/* ---------------------------------------- */

[data-modal] {
	background-color: #E0DADA;
	min-height: 100vh;
}

[data-book] {
	background-color: #A3C6AF;
}

[data-info] columns > item > h1 {
	display: none;
}

[data-info] columns > item:nth-child(1),
[data-info] columns > item:nth-child(2) {
	padding-top: 0;
}

/* ---------------------------------------- */
/* ----- >>> Structure -------------------- */
/* ---------------------------------------- */

header,
footer,
section {
	width: 100%;
	position: relative;
}

header,
footer {
	position: fixed;
	z-index: 1000;
}

footer {
	color: rgba(var(--back-color), 1.0);
	mix-blend-mode: difference;
	z-index: 900;
	bottom: 0;
}

header {
	transition: all 0.25s ease-in-out;
	top: 0;
}

section {
	width: 100%;
	z-index: 100;
}

/* ---------------------------------------- */

header.isHide {
	transform: translateY(-100%);
	opacity: 0;
}

/* ---------------------------------------- */
/* ----- >>> Styles ----------------------- */
/* ---------------------------------------- */

h1		{ font: calc(var(--main-texts) * 1.00)/1.50em 'Basis', sans-serif; margin-bottom: calc(var(--main-space) * 1.0); text-transform: uppercase; }
h2		{ font: calc(var(--main-texts) * 1.00)/1.25em 'Basis', sans-serif; margin-bottom: calc(var(--main-space) * 0.5); }
h3		{ font: calc(var(--main-texts) * 2.00)/1.25em 'Dial',  sans-serif; margin-bottom: calc(var(--main-space) * 0.5); }
h4		{ font: calc(var(--main-texts) * 1.75)/1.25em 'Dial',  sans-serif; margin-bottom: calc(var(--main-space) * 0.5); }
h5		{ font: calc(var(--main-texts) * 1.50)/1.25em 'Dial',  sans-serif; margin-bottom: calc(var(--main-space) * 0.5); }
h6		{ font: calc(var(--main-texts) * 1.25)/1.50em 'Dial',  sans-serif; margin-bottom: calc(var(--main-space) * 0.5); }
p, dl { font: calc(var(--main-texts) * 1.00)/1.50em 'Dial',  sans-serif; margin-bottom: calc(var(--main-space) * 0.5); }
small { font: calc(var(--main-texts) * 0.75)/1.25em 'Dial',  sans-serif; margin-bottom: calc(var(--main-space) * 0.5);  opacity: 0.5 }
a { text-decoration: none;}

p.isAlt {
	margin-top: calc(var(--main-space) * 2);
	font-family: 'Basis', sans-serif;
	text-transform: uppercase;
	font-size: 90%;
}

p > a {
	text-decoration: underline;
}

ol > li {
	padding: calc(var(--main-space) / 4) 0.0rem;
	border-bottom: thin dashed currentColor;
}

ol > li:first-child {
	padding-top: 0;
}

ol > li:last-child {
	padding-bottom: 0;
	border: none;
}

ol > li:hover:before {
	margin-right: calc(var(--main-space) / 4);
	width: calc(var(--main-space) / 3);
}

ol > li:before {
	width: 0.0rem;
	background-image: url(../assets/SVG/SVG_ARW.svg?100);
	transition: all 0.25s ease-in-out;
	margin-bottom: 0.2rem;
	vertical-align: middle;
	display: inline-block;
	aspect-ratio: 1 / 1;
	content: "";
}

ol > li > div {
	width: 100%;
	padding: calc(var(--main-space) / 2) 0.0rem;
	gap: calc(var(--main-space) / 2);
	display: flex;
}

ol > li > div > img {
	width: calc(50% - calc(var(--main-space) / 2));
}

/* ---------------------------------------- */
/* ----- >>> Navegation ------------------- */
/* ---------------------------------------- */

header wrapper,
footer wrapper {
	padding: calc(var(--main-space) / 2) calc(var(--main-space) * 1.25) !important;
}

nav {
	width: 100%;
}

nav > ul {
	gap: var(--main-space);
	align-items: center;
	white-space: nowrap;
	display: flex;
}

nav > ul > li {
	align-items: center;
	display: flex;
}

nav > ul > li:first-child { width: 40%; }
nav > ul > li:last-child  { margin-left:	auto; }

header nav > ul > li > ul {
	padding-top: calc(var(--main-space) / 4);
	transition: all 0.25s ease-in-out;
	gap: var(--main-space);
	position: absolute;
	visibility: hidden;
	display: flex;
	top: 1.6rem;
	opacity: 0;
}

nav > ul > li:hover > ul {
	visibility: visible;
	opacity: 1;
}

nav > ul > li > a {
	display: inline-block;
	line-height: 1.2em;
	position: relative;
}

nav ul > li > a {
	font-size: calc(var(--main-texts) * 0.9);
}

header > wrapper > nav > ul > li:last-child {
	text-transform: uppercase;
	font-size: 90%;
}

nav > ul > li:not(:first-child) > a,
mobile > nav > ul > li > a,
body#home nav > ul:hover > li:not(:hover, :first-child, :last-child, .current-menu-item) > a {
	opacity: 0.25;
}

body#home nav > ul > li > a,
body#tattoo nav > ul > li:first-child > a,
nav > ul > li:is(.current-menu-item, :hover, :last-child) > a {
	opacity: 1;
}

body:not(#tattoo) footer > wrapper > nav > ul > li:not(:nth-child(1), :nth-child(2), :last-child) {
	display: none !important;
}

footer > wrapper > a {
	text-transform: uppercase;
	display: none;
}

footer > wrapper > nav > ul > li:nth-child(1) { width: auto; }
footer > wrapper > nav > ul > li:nth-child(2) { width: calc(40% - 6.0rem) }

mobile {
	width: 100%;
	padding: 0 calc(var(--main-space) * 1) !important;
	position: fixed;
	display: none;
	top: 0;
}

mobile > a {
	top: calc(var(--main-space) * 1.2);
	transform: translateY(-3px);
	position: absolute;
	z-index: 9999;
}

mobile > nav {
	width:  100dvw;
	height: 100vh;
	background: rgba(var(--back-color), 1.0);
	transition: all 0.25s ease-in-out;
	transform: translateY(-100%);
	justify-content: center;
	align-items: center;
	position: fixed;
	display: flex;
	left: 0;
	top: 0;
}

mobile > nav > ul {
	margin-top: calc(var(--main-space) * 8.0);
	gap: calc(var(--main-space) * 0.75);
	flex-direction: column;
}

mobile > nav > ul > li {
	width: auto !important;
	flex-direction: column;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}

mobile > nav > ul > li > a {
	position: relative;
}


mobile > nav > ul > li:last-child > a {
	display: none !important;
}


mobile.isOpen > nav {
	transform: translateY(0%);
}

mobile nav > ul > li > ul {
	all: unset;
	transition: all 0.3s ease-in-out;
	font-size: calc(var(--main-texts) * 1.1);
	gap: calc(var(--main-space) * 0.25);
	flex-direction: column;
	overflow: hidden;
	display: flex;
	max-height: 0;
}

mobile nav > ul > li > ul.active {
	opacity: 1;
	padding-top: calc(var(--main-space) * 1.0);
	max-height: 500px;
}

mobile > nav > ul > li:nth-last-child(2) {
	margin-top: calc(var(--main-space) * 6.0);
	text-transform: uppercase;
}

mobile > nav > ul > li:nth-last-child(1) {
	margin-top: calc(var(--main-space) * -0.5);
	font-size: calc(var(--main-texts) * 1.0);
}

mobile > nav > ul > li 						  > a {font-size: calc(var(--main-texts) * 1.5); }
mobile > nav > ul > li:nth-last-child(2) > a {font-size: calc(var(--main-texts) * 1.2); }
mobile > nav > ul > li:nth-last-child(1) > a {font-size: calc(var(--main-texts) * 1.0); }

/* ---------------------------------------- */

.setSocial {
	margin-right: calc(var(--main-texts) * 1.0);
	gap: var(--main-space);
	line-height: 1em;
	display: none;
}

nav > ul > li > a > i {
	width: 1.6rem;
	background: url(../assets/SVG/SVG_CLS.svg?100) no-repeat center center / cover;
	vertical-align: middle;
	display: inline-block;
	margin-top: -0.2rem;
	aspect-ratio: 1 / 1;
	cursor: pointer;
}

/* ---------------------------------------- */
/* ----- >>> Category --------------------- */
/* ---------------------------------------- */

filter {
	width: calc(100% - calc(var(--main-space) * 1));
	gap: calc(var(--main-space) / 2);
	margin-bottom: var(--main-space);
	display: flex;
}

filter > * {
	font-size: calc(var(--main-texts) * 0.9);
	transition: all 0.25s ease-in-out;
	line-height: 1.8em;
	position: relative;
	cursor: pointer;
}

filter > item:first-child {
	font: calc(var(--main-texts) * 0.8)/2.00em 'Basis', Helvetica, Arial, sans-serif;
	margin-right: 0.8rem;
	cursor: default;
}

filter > item:not(:first-child, :hover, .isCurrent) {
	opacity: 0.25;
}

filter > clear {
	font: calc(var(--main-texts) * 0.7)/3.20rem 'Basis', Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	padding-right: 2.0rem;
	white-space: nowrap;
	position: relative;
	margin-left: auto;
	overflow: hidden;
	display: none;
}

filter > clear > span {
	background-color: rgba(var(--back-color), 1.0);
	transform: translateY(-45%);
	line-height: 1.6rem;
	text-align: center;
	position: absolute;
	font-size: 2.4rem;
	height: 1.6rem;
	width: 1.6rem;
	right: 0rem;
	top: 50%;
}

/* ---------------------------------------- */
/* ----- >>> General ---------------------- */
/* ---------------------------------------- */

img {
	width: 100%;
	height: auto !important;
	display: block;
}

item[data-click] {
	cursor: pointer;
}

/* ---------------------------------------- */

columns {
	width: 100%;
	gap: calc(var(--main-space) * 2);
	align-items: flex-start;
	display: flex;
}

columns > item {
	top: calc(var(--main-space) * 3);
	flex-direction: column;
	position: sticky;
	display: flex;
	gap: 0.8rem;
	width: 50%;
}

columns > item > h1 {
	margin-bottom: 1.6rem;
}

body:not(#about, #book) columns > item:nth-child(2) {
	padding-top: calc(var(--main-space) * 2);
}

columns > item ul:not(.isActive) {
	list-style-position: outside;
	margin-bottom: 1.6rem;
	padding-left: 1.4rem;
}

columns > item ul > li {
	list-style-type: disc;
}

columns > item > img,
columns > item > video {
	width: 100%;
	max-width: 80%;
	margin: 0 auto;
}

columns > item:nth-child(1) { width: 40%; }
columns > item:nth-child(2) { width: 60%; }

/* ---------------------------------------- */

board {
	width: 100%;
	--g: calc(var(--main-space) * 1);
	gap: calc(var(--main-space) * 2) var(--g);
	--col: calc((100cqi - (5 * var(--g))) / 6);
	--w2: calc((2 * var(--col)) + (1 * var(--g)));
	--H: calc(var(--w2) * 4 / 3);
	grid-template-columns: repeat(6, minmax(0, 1fr));
	container-type: inline-size;
	margin-inline: auto;
	align-items: start;
	display: grid;
}

board > item {
	height: var(--H);
	overflow: hidden;
	position: relative;
}

board > item * {
	width:  100% !important;
	height: 100% !important;
	object-position: center;
	object-fit: cover;
	display: block;
}

board > item > a > span {
	position: absolute;
	transition: all 0.25s ease-in-out;
	justify-content: center;
	align-items: center;
	color: #FFFFFF;
	display: flex;
	z-index: 999;
	opacity: 0;
	left: 0;
	top: 0;
}

board > item:hover > a > span {
	opacity: 1;
}

board > item[data-size="S1"] { grid-column: span 2; }
board > item[data-size="S2"] { grid-column: span 3; }
board > item[data-size="S3"] { grid-column: span 6; }

/* ---------------------------------------- */

grid {
	width: 100%;
	gap: calc(var(--main-space) / 2) calc(var(--main-space) / 2);
	grid-template-columns: repeat(12, minmax(0, 1fr));
	margin-inline: auto;
	align-items: start;
	display: grid;
}

grid.isAlt {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

grid > item {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	grid-column: span 3;
	position: relative;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	display: flex;
}

grid > item > * {
	width: 100%;
	object-fit: cover;
}

grid > item > div {
	width: 100%;
	height: 100%;
	transition: all 0.25s ease-in-out;
	padding: 0.0rem var(--main-space);
	background: #E0DADA;
	position: relative;
	overflow: hidden;
	overflow-y: auto;
}

grid > item > div::before,
grid > item > div::after {
	width: 100%;
	height: calc(var(--main-space) * 1.5);
	pointer-events: none;
	position: sticky;
	flex-shrink: 0;
	display: block;
	content: '';
	z-index: 1;
	left: 0;
}

grid > item > div::before {
	background: linear-gradient(to bottom, #E0DADA, transparent);
	margin-bottom: calc(var(--main-space) * -0.25);
	top: 0;
}

grid > item > div::after {
	background: linear-gradient(to top, #E0DADA, transparent);
	margin-top: calc(var(--main-space) * -0.25);
	bottom: 0;
}

grid > item > a {
	gap: calc(var(--main-space) / 2);
	flex-direction: column;
	display: flex;
}

grid > item > a > small {
	justify-content: space-between;
	display: flex;
	opacity: 1;
}

grid.isAlt item[data-size="1"] { grid-column: span 12; }
grid.isAlt item[data-size="2"] { grid-column: span 6; }
grid.isAlt item[data-size="3"] { grid-column: span 4; }
grid.isAlt item[data-size="4"] { grid-column: span 3; }

/* ---------------------------------------- */

stack,
stack > item {
	width:  100vw;
	min-height: 100vh;
	position: relative;
	text-align: center;
	display: block; 
}

stack > item {
	top: 0;
}

stack > item:not(:first-child, :last-child) {
	min-height: 150vh;
}

/* ---------------------------------------- */

slider { 
	width: 100%;
}

slider > p {
	font: 300 calc(var(--main-texts) * 0.8)/1em 'Basis', sans-serif;
	transition: opacity 0.6s ease;
	transform: translateX(-50%);
	padding-bottom: 1.6rem;
	position: fixed;
	bottom: 0.0rem;
	margin: 0.0rem;
	opacity: 0;
	left: 50%;
}

slider > items {
	position: relative;
	display: block;
	width: 100%;
}

slider > items > item {
	transition: opacity 0.6s ease;
	position: relative;
	display: block;
	opacity: 0;
}

slider > items > item > img {
	width: auto !important;
	margin: 10vh auto 15vh;
	max-height: 75vh;
	display: block;
}

media {
	width: 100%;
	position: relative;
	overflow: hidden;
	display: block;
}

media > items {
	width: 100%;
	height: 100%;
	display: flex;
}

media > items > item {
	width: 100%;
	height: 100%;
	position: relative;
	flex-shrink: 0;
	display: block;
}

/* ---------------------------------------- */

content {
	width: calc(60% - var(--main-space) - 0.8rem);
	margin-left: calc(40% + var(--main-space));
	margin-bottom: calc(var(--main-space) * 2);
	gap: calc(var(--main-space) * 6);
	display: flex;
}

content > item:nth-child(1) { width: calc(60% - calc(var(--main-space) * 3)); }
content > item:nth-child(2) { width: calc(40% - calc(var(--main-space) * 3)); }

/* ---------------------------------------- */

list > item > p,
list > item > a > p {
	line-height: 4.0rem;
	margin-bottom: 0;
}

list > item > a > img,
list > item > a > excerpt {
	display: none;
}

list.List {
	width: calc(100% - calc(var(--main-space) * 0.5));
	flex-direction: column;
	display: flex;
}

list.List > item:not(:last-child) {
	border-bottom: thin dashed currentColor;
}

list.List > item > p {
	justify-content: space-between;
}

list.List > item > p > span:nth-child(1) { width: 39%; }
list.List > item > p > span:nth-child(2) { width: 50%; }


list.List > item > a > p > span {
	width:	  20vw;
	min-width: 25.6rem;
}

list.List > item > a > p > span:last-child {
	text-align: right;
}

list.List > item > p,
list.List > item > a > p {
	gap: calc(var(--main-space) / 8);
	align-items: center;
	display: flex;
}


list.List > item > p > span:first-child:before,
list.List > item > a > p > span:first-child:before {
	width: 0.0rem;
	background-image: url(../assets/SVG/SVG_ARW.svg?100);
	transition: all 0.25s ease-in-out;
	margin-bottom: 0.2rem;
	vertical-align: middle;
	display: inline-block;
	aspect-ratio: 1 / 1;
	content: "";
}

list.List > item:hover > p > span:first-child:before,
list.List > item:hover > a > p > span:first-child:before {
	margin-right: calc(var(--main-space) / 4);
	width: calc(var(--main-space) / 3);
}

list.Grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: calc(var(--main-space));
	margin-inline: auto;
	align-items: start;
	display: grid;
}

list.Grid > item > a > img {
	display: block;
}

list.Grid > item > a > p > span {
	width:	  auto;
	min-width: 25.6rem;
}

list.Grid > item > a > p > span:last-child {
	font-weight: 700;
	min-width: auto;
	float: right;
}

list.Grid > item > a > p > span:first-child:after {
	content: " - ";
}



/* ---------------------------------------- */

store,
events {
	width: 100%;
	max-width: 64rem;
}

store > select {
	background-position: right 0.8rem center;
	border-bottom: thin dashed currentColor;
	padding-bottom: 0.8rem;
	margin: 1.6rem auto;
}

store > ul:not(.isActive) { 
	display: none;
}

events > ul {
	padding-left: 0 !important;
}

store > ul > li,
events > ul > li {
	border-bottom: thin dashed currentColor;
	justify-content: space-between;
	line-height: 4.0rem;
	display: flex;
	margin: 0;
}

store > ul > li > a {
	text-decoration: underline;
}

events > ul > li > a {
	text-transform: uppercase;
	font-size: calc(var(--main-texts) * 0.9);
}

/* ---------------------------------------- */

dl, dt, dd {
	width: 100%;
	overflow: hidden;
}

dl {
	margin-bottom: calc(var(--main-space) * 2);
}

dt {
	padding: calc(var(--main-space) / 2);
	padding-right: 2.4rem;
	font-size: 1.6rem;
	cursor: pointer;
}

dt:not(:first-of-type) {
	border-top: thin dashed currentColor;
	position: relative;
}

dt:after {
	width:  1.0rem;
	height: 1.0rem;
	transition: all 0.25s ease-in-out;
	transform: translate(-50%, -50%);
	line-height: 1.0rem;
	position: absolute;
	font-size: 1.6rem;
	content: "+";
	top: 50%;
	right: 0;
}

dd {
	padding-right: calc(var(--main-space) / 2);
	padding-left: calc(var(--main-space) / 2);
	transition: max-height 0.4s ease;
	margin-bottom: 0;
	max-height: 0;
}

dd > *:last-child {
	padding-bottom: calc(var(--main-space) / 1.5);
}


dt.isActive:after {
	transform: translate(-50%, -50%) rotate(45deg);
}

dl.isAlt dt {
	font: calc(var(--main-texts) * 1.00)/1.50em 'Basis', sans-serif;
}

/* ---------------------------------------- */
/* ----- >>> Media Form ------------------- */
/* ---------------------------------------- */

form,
form > item {
	width: 100%;
	gap: calc(var(--main-space) / 2);
	flex-direction: column;
	position: relative;
	display: flex;
}

form > item > span {
	position: absolute;
	right: 0.8rem;
	top: 0;
}

::-webkit-input-placeholder	{ opacity: 1; color: currentColor;}
:-ms-input-placeholder			{ opacity: 1; color: currentColor;}
::-moz-placeholder				{ opacity: 1; color: currentColor;}
:-moz-placeholder					{ opacity: 1; color: currentColor;}

input, select, textarea, button {
	box-shadow: none !important;
	-webkit-box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	-webkit-appearance: none !important;
	box-sizing: border-box !important;
}

input, select, textarea, button {
	all: unset;
	width: 100%;
	border-bottom: thin solid rgba(var(--main-color), 0.2);
	line-height: calc( var(--main-texts) * 1.4);
	position: relative;
	resize: none;
}

select {
	background: url(../assets/SVG/SVG_SLT.svg) no-repeat right 2.4rem center / 1.2rem 1.2rem;
}

textarea {
	background: url(../assets/@0x/IMG_LIN.gif) repeat top center / 1.6rem 8.0rem;
	line-height: 1.75em;
	overflow: hidden;
	height: 8.0rem;
	border: none;
}

button {
	font-size: calc(var(--main-texts) * 1.1);
	text-decoration: underline;
	text-transform: uppercase;
	border: none;
}

input[type="file"] {
	display: none;
}

.isFile {
	width: 25.6rem;
	padding: calc(var(--main-space) / 2) calc(var(--main-space) / 2);
	background-color: rgba(var(--main-color), 1.0);
	margin-top: calc(var(--main-space) / 2);
	transition: background-color 0.3s ease;
	color: rgba(var(--back-color), 1.0);
	display: inline-block;
	text-align: center;
	cursor: pointer;
}

.isFile:hover {
	background-color: rgba(30, 30, 30, 1.0);
}

/* ---------------------------------------- */
/* ----- >>> Marquee ---------------------- */
/* ---------------------------------------- */

banner {
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	display: flex;
}

banner:hover > slider > item {
	animation-play-state: paused;
}

banner > slider > item {
	padding: calc(var(--main-space) / 4) calc(var(--main-space) * 1);
	animation: marquee 25s linear infinite;
	will-change: transform;
	display: inline-block;
	font-size: 1.2rem;
}

@keyframes marquee {
	0% { transform: translateX(0); }
	100% { transform: translateX(-100%); }
}

/* ---------------------------------------- */
/* ----- >>> Icon Sets -------------------- */
/* ---------------------------------------- */

.isBND {
	width: 19.2rem;
	height: 1.2rem;
	background: url(../assets/SVG/SVG_BND.svg?100) no-repeat center center / cover;
	display: inline-block;
	position: absolute;
}

/* ---------------------------------------- */
/* ----- >>> Animations ------------------- */
/* ---------------------------------------- */

a,
button {
	transition: all 0.25s ease-in-out;
}

/* ---------------------------------------- */
/* ----- >>> CSS Hacks -------------------- */
/* ---------------------------------------- */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

* html .setClearfix{ 
	height: 1%;
}

.setClearfix{ 
	display: inline-block; 
}

.setClearfix:after {
	content: "\00A0";
	visibility: hidden;
	line-height: 0;
	display: block;
	clear: both;
	height: 0;
}

*:last-child {
	margin-bottom: 0;
}

video::-webkit-media-controls {
	display: none !important;
	-webkit-appearance: none;
}

video::-webkit-media-controls-panel,
video::-webkit-media-controls-play-button,
video::-webkit-media-controls-start-playback-button,
video::-webkit-media-controls-overlay-play-button {
	display: none !important;
	-webkit-appearance: none;
	opacity: 0 !important;
}

video {
	-webkit-appearance: none;
}

/* ----- >>> Dev Tools -------------------- */
/* ---------------------------------------- */

.isDev * {
	box-shadow: inset 0rem 0rem 0rem 0.05rem #FF1DFF;
}

.isDev wrapper {
	background-color: rgba(255, 0, 0, 0.1);
}

.isDev header:before {
	width: 0.1rem;
	height: 100vh;
	background-color: rgba(255, 0, 0, 1);
	position: fixed;
	content: "";
	left: 50%;
	top: 0;
}