/*------------∞
|  reset.css  |
∞------------*/
/* ∞∞ postcss ∞∞ */

/* ∞∞ font ∞∞ */
@import url(https://fonts.googleapis.com/css?family=Lato:300,900);
body {
	font-family: 'Lato', sans-serif;
}
/* ∞∞ global ∞∞ */
	* {
		position: relative;
		margin: 0;
		padding: 0;
		box-sizing: border-box;
		border-color: inherit;
	}

	body {
		width: 100vw;
		height: 100vh;
		overflow-x: hidden;
		overflow-y: scroll;
		font-size: 100%;
		font-style: normal;
		font-weight: 300;
		line-height: 1;
		margin: 0;
		padding: 0;
	}
	
/* ∞∞ text styling ∞∞ */
	h1, h2, h3, h4, h5, h6, p, em, a, b, strong {
		font-style: normal;
		font-weight: 300;
	}

	strong {
		font-size: 1.15em;
	}

	small {
  	font-size: .85em;
	}

	ul,
	ol,
	menu {
		list-style: none;
	}

	sub,
	sup {
  	font-size: .75em;
  	line-height: 0;
  	position: relative;
  	vertical-align: baseline;
	}
	
	sup {
  	top: -0.5em;
	}
	
	sub {
  	bottom: -0.25em;
	}

	code,
	kbd,
	pre,
	samp {
  	font-family: monospace, monospace;
  	font-size: 1em;
	}

	abbr[title] {
  	border-bottom: 1px dotted;
	}
	
	dfn {
  	font-style: italic;
	}

/* ∞∞ form elements ∞∞ */
	button,
	input,
	optgroup,
	select,
	textarea {
  	color: inherit;
  	font: inherit;
  	margin: 0;
  	background: transparent;
		outline: none;
		border: none;
		border-radius: 0;
		-webkit-appearance: none;
		   -moz-appearance: none;
		        appearance: none;
	}
	
	button,
	select {
  	text-transform: none;
  	cursor: pointer;
	}

	button[disabled],
	html input[disabled] {
  	cursor: default;
	}
	
	fieldset {
  	border: none;
  	margin: 0;
  	padding: 0;
		min-width: 0;
	}

	textarea {
		resize: none;
	}

/* ∞∞ link styling ∞∞ */
	a {
		display: inline;
		text-decoration: none;
		color: inherit;
		cursor: pointer;
	}

	a:active,
	a:hover {
  	outline: 0;
	}

	/* a::before {
		width: 100%;
		height: .2rem;
		position: absolute;
		bottom: 0;
		left: 0;
		background-color: #7ac;
	}

	a:hover::before {
		background-color: #49e;
		height: .35rem;
	} */

/* ∞∞ hr using box ∞∞ */
	hr {
		border: none;
  	box-sizing: border-box;
  	height: .075rem;
	}

/* ∞∞ hidden ∞∞ */
	[hidden],
	template {
  	display: none;
	}

/* ∞∞ media specific ∞∞ */
	audio:not([controls]) {
  	display: none;
  	height: 0;
	}

/* ∞∞ tables ∞∞ */
	table {
  	border-collapse: collapse;
  	border-spacing: 0;
  	border: none;
	}

	td,
	th {
		margin: 0;
  	padding: 0;
  	font-weight: inherit;
		text-align: inherit;
	}


/*====================================================== ∞∞ browser specific ∞∞ */

/* ∞∞ IE ∞∞ */
	article,
	aside,
	details,
	figcaption,
	figure,
	footer,
	header,
	main,
	menu,
	nav,
	section,
	summary {
  	display: block;
	}
	
	audio,
	canvas,
	progress,
	video {
  	display: inline-block;
  	vertical-align: baseline;
	}

	a {
  	background-color: transparent;
	}

	button {
  	overflow: visible;
	}

	html {
  	-ms-text-size-adjust: 100%;
	}

	img {
  	border: none;
	}

	input[type="checkbox"],
	input[type="radio"] {
  	box-sizing: border-box;
  	padding: 0;
	}

	legend {
  	border: none;
  	padding: 0;
	}

	mark {
  	background: #ff0;
  	color: #000;
	}

	svg:not(:root) {
  	overflow: hidden;
	}

	textarea {
  	overflow: auto;
	}

/* ∞∞ moz ∞∞ */
	body {
		-moz-osx-font-smoothing: grayscale;
	}

	button::-moz-focus-inner,
	input::-moz-focus-inner {
  	border: none;
  	padding: 0;
	}

	input {
  	line-height: normal;
	}

/* ∞∞ webkit ∞∞ */
	* {
		-webkit-margin-before: 0;
		-webkit-margin-after: 0;
	}

	html {
  	-webkit-text-size-adjust: 100%;
	}

	body {
		-webkit-font-smoothing: antialiased !important;
	}

	blockquote {
		-webkit-margin-before: 0;
		-webkit-margin-after: 0;
		-webkit-margin-start: 0;
		-webkit-margin-end: 0;
	}

	fieldset {
		-webkit-margin-start: 0;
		-webkit-margin-end: 0;
		-webkit-padding-before: 0;
		-webkit-padding-start: 0;
		-webkit-padding-end: 0;
		-webkit-padding-after: 0;
	}

	input[type=number]::-webkit-inner-spin-button, 
	input[type=number]::-webkit-outer-spin-button { 
  	-webkit-appearance: none; 
  	margin: 0; 
  	height: auto;
	}

	input[type="search"] {
  	-webkit-appearance: textfield;
  }

  input[type="search"]::-webkit-search-cancel-button,
	input[type="search"]::-webkit-search-decoration,
	progress {
  	-webkit-appearance: none;
	}
body {background: black;}

main {
	height: 150px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	
}

main time {
		display: block;
		width: 310px;
		text-align: center;
		color: white;
		font-size: 4rem;
		font-weight: 900;
		text-align: center;
	}

main button {
		padding: .5em 1.25em;
		position: absolute;
		bottom: 0;
		color: white;
		border: 1px solid white;
		border-radius: .5em;
		text-transform: uppercase;
		font-size: 1.25rem;
	}

main #toggle {right: 0}

main #clear {
		transition: all 300ms cubic-bezier(.4,.25,.3,1);
		left: 0;
		opacity: 0;
		pointer-events: none;
	}

main #clear[data-state='visible'] {
			opacity: 1;
			pointer-events: auto;
		}


.article {
	color:white;
}




input[type='checkbox'] {
	display: none;
}
.wrap-collabsible {
	margin: 1.2rem 0;
}
.lbl-toggle {
	display: block;
	font-weight: bold;
	font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	font-size: 1.2rem;
	text-transform: none;
	text-align: center;
	padding: 1rem;
	color: #DDD;
	background: rgba(128, 128, 128, 0);
	cursor: pointer;
	border-radius: 7px;
	transition: all 0.25s ease-out;
}
.lbl-toggle:hover {
	color: #FFF;
}
.lbl-toggle::before {
	content: ' ';
	display: inline-block;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid currentColor;
	vertical-align: middle;
	margin-right: .7rem;
	transform: translateY(-2px);
	transition: transform .2s ease-out;
}
.toggle:checked+.lbl-toggle::before {
	transform: rotate(90deg) translateX(-3px);
}
.collapsible-content {
	max-height: 0px;
	overflow: auto;
	transition: max-height .25s ease-in-out;
}
.toggle:checked + .lbl-toggle + .collapsible-content {
	max-height: 350px;
}
.toggle:checked+.lbl-toggle {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
.collapsible-content .content-inner {
	background: grey(0, 105, 255, .2);
	border-bottom: 1px solid grey;
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 7px;
	padding: .5rem 1rem;
}
.collapsible-content p {
	margin-bottom: 0;
}