/*
Theme Name: StageCulture LLC
Theme URI: N/A
Description: A base theme for porting an existing design to WordPress.
Version: 1.0
Author: Jacob Frame
Author URI: https://jacobfra.me/

/* Styles go below */

@import "normalize.min.css";

button,html,input,select,textarea,section a{color:#1f1c1d}html{font-size:4.26vw;line-height:1.4;height:100%}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}a{text-decoration:none}textarea{resize:vertical}

body {
	font: 3vw/4.875vw Avenir, Helvetica, Helvetica Neue, Arial, sans-serif;
	width: 100%;
	height: 100vh;
	background: #f9f9f9;
	letter-spacing: .0185em;
}
#shamelessPlug {
	font-size: .6rem;
	background: #1f1c1d;
	color: #333;
	line-height: 1.5rem;
}
#shamelessPlug > a {
	font-size: .6rem;
	color: #444;
}
#shamelessPlug > a:hover {
	color: #888;
}
* {
	transition: all .2s ease-in-out;
	transform: scale(1.0);
	-webkit-transform: translate3d(0,0,0);
}
figure > img {
	width: auto;
	height: auto;
}
main {
	display: block;
	background: #f9f9f9;
}

header#mainHeader, section, main {
	width: 100%;
}
header#mainHeader {
	color: #fff;
	height: 59.4vw;
	background: #000;
	background-image: -webkit-image-set(
	url("img/headerBG/600.jpg") 1x,
	url("img/headerBG/1200.jpg") 2x
);
	background-image: image-set(
	url("img/headerBG/600.jpg") 1x,
	url("img/headerBG/1200.jpg") 2x
);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

#sitewrap {
	width: 100%;
	-webkit-transform: translate3d(0,0,0);
}
#secSiteWrap {
	position: relative;
	width: 100vw;
	max-width:100%;
	left: 0;
	z-index: 100;
	transition: left .7s ease-in-out;
	filter: drop-shadow(.1rem 0 .3rem #090909);
	-webkit-transform: translate3d(0,0,0);
}

#navigation {
	height: 1.32rem;
	padding: .74rem;
}
#mainNav {
	display: none;
}
#mainNav li:hover a {
	transition: all .15s ease-in-out;
	transform: scale(1.15);
}
#navToggle i:hover {
	transition: all .15s ease-in-out;
	transform: scale(1.1);
}
#navigation img {
	height: 1.875rem;
	display: block;
}
#navigation img, #navigation span {
	float: left;
}
#navigation span, #navigation a {
	color: #fff;
	display: block;
	font: .81rem "Avenir-Black", "Arial", sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	padding: .33825rem .6525rem;
	line-height: 1.4rem;
}
#sidebartoggler {
	display: none;
}
#navDrawer {
	position: absolute;
	background-color: #1f1c1d;
	top: 0;
	left: 0;
	width: 100vw;
	max-width:100%;
	height: 100vh;
	z-index: 10;
	transition: left .7s ease-in-out;
	overflow-x: hidden;
	-webkit-transform: translate3d(0,0,0);
}
#navDrawer ul {
	padding: .8rem 0;
	overflow: hidden;
}
#navDrawer li {
	text-indent: .75rem;
	font: 1rem/2rem "Avenir-Light", "Helvetica-Light", Arial, sans-serif;
}
#navDrawer li a {
	padding: .3rem;
	display: block;
	cursor: pointer;
	color: #f9f9f9;
	transform-origin: 0 50%;
}
#navDrawer li span {
	position: absolute;
	left: 3.3rem;
	transform-origin: 0 50%;
}
#navDrawer li:hover a, #navDrawer li:hover span  {
	transition: all .15s ease-in-out;
	transform: scale(1.1);
}
#navDrawer li:nth-child(odd) {
	background: #221e20;
}

#sidebartoggler:checked + #sitewrap {
	background-color: #1f1c1d;
}
#sidebartoggler:checked + #sitewrap #navDrawer {
	left: 40%;
	width: 60%;
	-webkit-transform: translate3d(0,0,0);
	transition: left .7s ease-in-out, width .7s ease-in-out;
}
#sidebartoggler:checked + #sitewrap {
	position: fixed;
	-webkit-transform: translate3d(0,0,0);
}
#sidebartoggler:checked + #sitewrap #secSiteWrap {
	left: -60%;
	position: fixed;
	-webkit-transform: translate3d(0,0,0);
	overflow-y: hidden;
	max-height: 100vh;
}
#navToggle label {
	float: right;
	font-size: 1.5rem;
	cursor: pointer;
}

h1 {
	text-transform: uppercase;
	font: 2.0rem "Avenir-Black", -apple-system, BlinkMacSystemFont, "Arial-Black", sans-serif;
	font-weight: bold;
	margin-top: 2.25rem;
}
.noSub {
	margin-top: 2.75rem;
}
h2 {
	text-transform: uppercase;
	font: 1.875rem "Avenir-Heavy", -apple-system, BlinkMacSystemFont, "Helvetica-Bold", "Arial", sans-serif;
	font-weight: bold;
	margin: 0;
}
h3 {
	text-transform: uppercase;
	font: 1.35rem "Avenir-Medium", -apple-system, BlinkMacSystemFont, "Helvetica", "Arial", sans-serif;
	margin: 0;
}
p {
	font: .75rem "Avenir-Book", -apple-system,BlinkMacSystemFont, "Helvetica-Light", "Arial", sans-serif;
	font-weight: 100;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.3rem;
}

header#mainHeader p {
	margin: -1.52rem auto 0;
	width: 65%;
	font: .75rem/.9375rem "Avenir-Light", "Helvetica-Light", Arial, sans-serif;
	text-transform: uppercase;
}
section, #owner article, #partner article {
	padding: 4rem 0;
}
footer, footer section {
	padding: 4rem 0 0;
}
.nav-button {
	display: inline-block;
	background: #ed2127;
	width: 50%;
	padding: .75rem 0;
	margin: 1rem auto 0;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	font: 1rem "Avenir-Roman", "Helvetica", "Arial", sans-serif;
	border-radius: .75rem;
}
.nav-button:hover, #contactForm input[type=submit]:hover {
	transition: all .1s ease-in-out;
	transform: scale(1.05);
}
section, footer, p, h1, h2, h3, #shamelessPlug {
	text-align: center;
}
#services img, #projects img {
	width: 50%;
	margin: 2rem auto 0;
	aspect-ratio: 1 / 1;
}
.wp-block-image img {
	width: 80%;
	margin: 2rem auto 0;
	aspect-ratio: 1 / 1;
}
#projects img, .wp-block-image img {
	background: #ccc;
	border: .65rem solid #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.05), 0 1px 2px rgba(0,0,0,0.1);
	  /* transition: all 0.3s cubic-bezier(.25,.8,.25,1); */
}
/* #projects img:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
} */
.projectPost {
	padding-top:0;
}
.projectPost article header img {
	min-width: 100%;
	max-width: 100%;
	height:auto;
	aspect-ratio: 1 / 1;
}
#services h3, #projects h3 {
	margin: 1rem 0 .375rem;
}
#services p, #projects p, .projectPost p {
	width: 75%;
	margin: 0 auto 1rem;
}
.projectPost p {
	text-align:left;
}
#projects p {
	text-align: justify;
}

#mission {
	background: #000;
	background-image: -webkit-image-set(
	url("img/servicesBG/600.jpg") 1x,
	url("img/servicesBG/1200.jpg") 2x
);
	background-image: image-set(
	url("img/servicesBG/600.jpg") 1x,
	url("img/servicesBG/1200.jpg") 2x
);
	background-position: right center;
	background-size: cover;
	background-repeat: no-repeat;
	color: #fff;
}
#mission h3, #contactUs h3 {
	margin-top: -.2rem;
	margin-bottom: .75rem;
}
#mission p {
	width: 89%;
	margin-bottom: .5rem;
	line-height: 1.3rem;
}

footer {
	background-color: #1f1c1d;
	line-height: 1.2rem;
	font: .75rem/1.3rem "Avenir-Light", "Helvetica-Light", Arial, sans-serif;
}
footer a {
	font-size: .75rem;
	color: #fff;
	display: inline-block;
}
footer a:hover {
	transition: all .15s ease-in-out;
	transform: scale(1.15);
}

footer address {
	margin-top: 1.6rem;
	color: #fff;
}
footer > div > div {
	margin-top: 2rem;
}
footer > div > div > a {
	color: #ffffff;
	font-size: 2rem;
	display: inline-block;
	margin: 0 1rem;
}
footer > div > div > a:hover i {
	transition: all .15s ease-in-out;
	transform: scale(1.15);
}
footer > div > div > a > span {
	display: none;
}

/* Index.html */
#blog {
	background: #eaeaea;
}
#blog h2 {
	padding: 1.5rem 0 0;
}
#blog li {
	width: 80%;
	background: #fff;
	margin: 1.5rem auto 0;
	text-align: left;
}
.blogHeader {
	background: #1f1c1d;
	position: relative;
}
.blogHeader:after {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: .8;
	background-color: #1f1c1d;
}
.blogHeader img {
	width: 100%;
	margin: 0 auto;
}
.blogHeader h3 {
	text-align: left;
	position: absolute;
	z-index: 100;
	padding: 1rem 1.5rem;
	color: #fff;
}
#blog p {
	padding: 1rem 1rem 0;
	text-align: left;
	font-size: .7rem;
}

#blog li a {
	display: inline-block;
	margin: 0 1rem 1rem;
	color: #4488ff;
	font-size: .7rem;
}
#blog ul {
	margin-bottom: 1rem;
}

/* About.html */
#owner, #partner {
	padding: 0;
}
#owner img, #partner img {
		width: 100%;
		margin: 0 auto;
}
#owner p, #partner p, #history p  {
	padding: .75rem 1.5rem 0;
}
#owner p, #partner p  {
	text-align: justify;
}

/* Contact.html */
form {
	width: 100%;
	display: block;
}
.contactFlex {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
}
.contactFlex input, .contactFlex textarea, #contactForm input[type=submit]{
  display: block;
  width: 90%;
  margin: 0 auto;
  font-size: .75rem;
  padding: .75rem .65rem;
  border: solid 1px #ddd;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
 -webkit-transform: translate3d(0,0,0);
  transition: all .1s ease-out;
  z-index: 1000;
  border-radius: .125rem;
}
.contactFlex textarea {
	height: 8rem;
	max-height: 15rem;
}
.contactFlex label {
	order: -1;
	display: block;
	width: 90%;
	margin: .65rem auto 0;
    font-size: .7rem;
    opacity: 1;
    transform: translateY(0);
    transition: all 0.1s ease-out;
	text-align: left;
}
.contactFlex input:placeholder-shown, .contactFlex textarea:placeholder-shown {
	transform: translateY(-1rem);
}
.contactFlex input:placeholder-shown + label, .contactFlex textarea:placeholder-shown + label {
    opacity: 0;
    transform: translateY(1rem);
}
#contactForm input[type=submit] {
	margin-top: 1.25rem;
	background: #ed2127;
	width: 90%;
	padding: .75rem 0;
	color: #fff;
	text-transform: uppercase;
	font: 1rem "Avenir-Roman", "Helvetica", "Arial", sans-serif;
	border-radius: .75rem;
}
.g-recaptcha div{
		display: block;
		margin: 1rem auto 2rem;
		position: relative;
}

@media only screen and (min-width: 400px) {
	
}
@media only screen and (min-width: 600px) {
	html {
		font-size: 3.26vw;
	}
	#shamelessPlug, #shamelessPlug a {
		font-size: .47rem;
	}
	#navigation {
		padding: .74rem 1.24rem;
	}
	header#mainHeader {
		background-image: -webkit-image-set(
   		url("img/headerBG/900.jpg") 1x,
    	url("img/headerBG/1800.jpg") 2x
	);
		background-image: image-set(
    	url("img/headerBG/900.jpg") 1x,
    	url("img/headerBG/1800.jpg") 2x
	);
	}
	#mission {
		background-image: -webkit-image-set(
		url("img/servicesBG/900.jpg") 1x,
		url("img/servicesBG/1800.jpg") 2x
	);
		background-image: image-set(
		url("img/servicesBG/900.jpg") 1x,
		url("img/servicesBG/1800.jpg") 2x
	);
	}
	
	#navDrawer ul li a {
		font-size: .75rem;
		padding: .1rem .3rem;
	}
	
	header#mainHeader {
		height: 15rem;
	}
	header#mainHeader h1 {
		margin-top: 2.75rem;
	}
	.noSub {
		margin-top: 3rem;
	}
	
	#services img {
		width: 25%;
		margin: 0 7%;
	}
	#projects img {
		margin: 0 calc(7% - .8rem);;
		aspect-ratio: 1 / 1;
	}
	#projects img, .wp-block-image img {
		width: 25%;
		border-width: .4rem;
	}
	.nav-button {
		width:35%;
		font-size: .8rem;
		padding: .6rem 0;
	}
	#services ul, #projects ul, #services li, #projects li, .wp-block-gallery  {
		padding: 1rem 0;
	}
	#services li, #projects li, #blog li, .wp-block-image {
		display: flex;
		align-items: center;
	}
	#services li div, #projects li div {
		width: 54%;
	}
	#blog li h3 {
		font-size: 1rem;
	}
	.blogPreview {
		text-align: left;
	}
	#projects li a {
		display: flex;
		align-items: center;
	} 
	#services li div, #projects li div, .blogPreview {
		display: flex;
		flex-direction: column;
	}
	#services li div h3, #projects li div h3, #services li div p, #projects li div p, .blogPreview, #blog img, .wp-block-image img {
		width: 100%;
	}
	#services li div h3, #projects li div h3 {
		margin-top: 0;
	}
	#services li div p, #projects li div p {
		margin-bottom: 0;
		padding-bottom: .75rem;
		font-size: .6rem;
	}
	#mission p {
		line-height: 1.125rem;
	}
	/*-- Contact.html */
	.contactFlex input, .contactFlex textarea, #contactForm input[type=submit], .contactFlex label {
	 width: 50%;
	}
	#contactForm input[type=submit] {
		margin-top: 2.5rem;
		font-size: .8rem;
	}
	.wp-block-image img {
		width: 60%;
	}
}

@media only screen and (min-width: 900px) {
	html {
			font-size: 18px;
	}
	
	#shamelessPlug, #shamelessPlug a {
		font-size: .6rem;
	}
	#sitewrap {
		background-color: #eaeaea;
	}
	
	#secSiteWrap {
		width: 100%;
		max-width: 100%;
		filter: none;
	}
	#sidebartoggler:checked + #sitewrap {
		background-color: #eaeaea;
	}
	#sidebartoggler:checked + #sitewrap #navDrawer {
		left: 0;
		width: 0;
		-webkit-transform: translate3d(0,0,0);
		transition: left .7s ease-in-out, width .7s ease-in-out;
	}
	#sidebartoggler:checked + #sitewrap {
		position: relative;
		-webkit-transform: translate3d(0,0,0);
	}
	#sidebartoggler:checked + #sitewrap #secSiteWrap {
		left: 0;
		position: relative;
		-webkit-transform: translate3d(0,0,0);
	}
	#navigation, #main, footer div {
		max-width: 1024px;
		margin: 0 auto;
	}
	#navDrawer {
		display: none;
	}
	.nav-button {
		width: 25%;
		padding: .75rem 0;
	}
	.contactFlex input, .contactFlex textarea, #contactForm input[type=submit] {
		font-size: .85rem;
	}
	#contactForm input[type=submit] {
		margin-top: 2.5rem;
		font-size: 1rem;
	}
	.contactFlex label {
		font-size: .9rem;
	}
	
	.g-recaptcha div{
			margin: 2.5rem auto 3.5rem;
	}
	header#mainHeader {
		background-image: -webkit-image-set(
   		url("img/headerBG/1200.jpg") 1x,
    	url("img/headerBG/2400.jpg") 2x
	);
		background-image: image-set(
    	url("img/headerBG/1200.jpg") 1x,
    	url("img/headerBG/2400.jpg") 2x
	);
	}
	
	#mission {
		background-image: -webkit-image-set(
		url("img/servicesBG/1200.jpg") 1x,
		url("img/servicesBG/2400.jpg") 2x
	);
		background-image: image-set(
		url("img/servicesBG/1200.jpg") 1x,
		url("img/servicesBG/2400.jpg") 2x
	);
	}
	
	header#mainHeader {
		height: 20rem;
	}
	
	header#mainHeader h1 {
		margin-top: 3.75rem;
		font-size: 3rem;
	}
	.noSub {
		margin-top: 4.5rem;
	}
	header#mainHeader p {
		font-size: 1rem;
		line-height: 1.45rem;
	}
	
	#navToggle {
		display: none;
	}
	
	#navigation {
		padding: 1rem 1.25rem;
	}
	
	#mainNav {
		float: right;
		position: relative;
		display: block;
		right: 0;
	}
	
	#mainNav li {
		float: left;
	}
	
	#mainNav ul li:last-child a {
		padding-right: 0;
	}
	#projects img, .wp-block-image img {
		border-width: .65rem;
	}
	
	#blog ul {
		margin: 0 2.1875% 1rem;
	}
	
	#blog li {
		width: 27.5%;
		display: inline-flex;
		position: relative;
		flex-direction: column;
	}
	
	#blog li p {
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 5;
		-webkit-box-orient: vertical;
		margin-bottom: 3rem;
	}
	
	#blog li a {
		position: absolute;
		bottom: 0;
		margin-bottom: 1rem;
		line-height: 1rem;
	}
	
	#services ul, #projects ul, #blog ul, .wp-block-gallery {
		display: flex;
		flex-direction: row;
		flex-flow: row wrap;
	}
	.wp-block-gallery {
		clear: both;
	}
	#services li, #projects li, #projects li a, .wp-block-image {
		flex-direction: column;
		flex: 0 1 33.333%;
		display: flex;
	}
	#services li, #projects li, .wp-block-image {
		width: 100%;
	}
	#services img, #projects img, .wp-block-image img {
		width: 60%;
	}
	
	#services ul li div, #projects ul li div {
		width: 100%;
	}
	
	#services ul li div h3, #projects ul li div h3 {
		margin: 1rem 0 .375rem;
	}
	
	#services ul li div p, #projects ul li div p {
		width: 75%;
		float: none;
		margin: 0 auto;
		padding-bottom: 0;		
		font-size: .75rem;
	}
	
	#mission p {
		line-height: 1.3rem;
	}
	footer > div {
		display: flex;
		flex-direction: row;
		padding: .5rem 0;
		align-items: center;
	}
	footer > div * {
		flex: 1;
	}
	footer address, footer > div > div {
		margin-top: 0;
	}
	footer > div > div {
		display: flex;
		flex-direction: column;
	}
	footer > div > div > a {
		color: #ffffff;
		font-size: 2rem;
		padding: .3rem;
		margin: 0 auto;
	}
	#owner {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		width: 100%;
	}
	#partner {
		display: flex;
		flex-direction: row-reverse;
		flex-wrap: wrap;
		width: 100%;
	}
	#owner .imgwrap, #partner .imgwrap {
		flex-direction: column;
		flex: 1;
		background: #1f1c1d;
	}
	#owner .imgwrap img, #partner .imgwrap img {
		object-fit: cover;
		height: 100%;
		width: 100%;
	}
	#owner article, #partner article {
		flex-direction: column;
		flex: 1;
		align-self: center;
	}
	.projectPost {
		padding: 0;
	}
	.projectPost article {		
		padding: 2.5rem 1.5rem 1.5rem;
	}
	.projectPost article header img {
		min-width: 0%;
		max-width: 35%;
		height:auto;
		float: left;
		aspect-ratio: 1 / 1;
		margin: 0 1.5rem 1.5rem 0;
	}
	.projectPost article header {
		padding: 0 1.5rem 0 0;
	}
	.projectPost h1 {
		margin: 0 0 1.5rem 0;
	}
	.projectPost article div {
		padding: 0 1.5rem;
	}
	.projectPost article p {
		width: 100%;
	}
	.projectPost article p::after {
	clear:both;
	}
	.projectPost article header img {
	background: #ccc;
	border: .65rem solid #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.05), 0 1px 2px rgba(0,0,0,0.1);
	  /* transition: all 0.3s cubic-bezier(.25,.8,.25,1); */
	}
	.wp-block-image {
	}
	.wp-block-image img {
		width: 80%;
	}
}

@media only screen and (min-width: 1200px) {
	
	#navigation, #main, footer div {
		max-width: 1200px;
	}
	
	#shamelessPlug, #shamelessPlug a {
		font-size: .6rem;
	}
	header#mainHeader {
		background-image: -webkit-image-set(
			url("img/headerBG/1800.jpg") 1x,
			url("img/headerBG/3600.jpg") 2x
		);
		background-image: image-set(
	    	url("img/headerBG/1800.jpg") 1x,
	    	url("img/headerBG/3600.jpg") 2x
			);
	}
	
	.contactFlex input, .contactFlex textarea, #contactForm input[type=submit] {
		width: 90%;
		font-size: .85rem;
	}
	.contactFlex textarea {
		min-height: 6.5rem;
		max-height: 15rem;
		width: 95%;
	}
	.contactMessage {
		width: 100%;
		flex: 1 1 100%;
	}
	#contactForm input[type=submit] {
		width: 45%;
		margin-top: 3rem;
	}
	.g-recaptcha {
		display: flex;
		flex: 1 1 100%;
	}
	.g-recaptcha div{
		float: left;
		width: 45%;
		margin: 1.25rem auto 1.5rem;
	}
	.g-recaptcha div::after {
		clear: both;
	}
	.contactFlex label {
		width: 90%;
		font-size: .9rem;
		margin-bottom: -.6rem;
	}
	label[for=body] {
		width: 95%;
	}
	#contactForm {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		width: 80%;
		margin: 0 auto;
	}
	.contactFlex {
		display: flex;
		width: 50%;
	}
	#mission {
		background-image: -webkit-image-set(
			url("img/servicesBG/1800.jpg") 1x,
			url("img/servicesBG/3600.jpg") 2x
		);
		background-image: image-set(
			url("img/servicesBG/1800.jpg") 1x,
			url("img/servicesBG/3600.jpg") 2x
		);
	}
	
}

@media only screen and (min-width: 1800px) {
	
	#navigation, #main, footer div {
		max-width: 1500px;
	}
	html {
		font-size: 22px;
	}
	header#mainHeader {
		height: 22rem;
	}
	header#mainHeader h1 {
		margin-top: 4.5rem;
		font-size: 4rem;
	}
	.noSub {
		margin-top: 5rem;
	}
	header#mainHeader p {
		margin-top: -3rem;
	}
	header#mainHeader {
		background-image: -webkit-image-set(
   			url("img/headerBG/2560.jpg") 1x,
   			url("img/headerBG/original.jpg") 2x
   		);
		background-image: image-set(
    		url("img/headerBG/2560.jpg") 1x,
			url("img/headerBG/original.jpg") 2x
		);
	}
	
	#mission {
		background-image: -webkit-image-set(
			url("img/servicesBG/2560.jpg") 1x,
			url("img/servicesBG/original.jpg") 2x
		);
		background-image: image-set(
			url("img/servicesBG/2560.jpg") 1x,
			url("img/servicesBG/original.jpg") 2x
		);
	}
}
@media only screen and (min-width: 2560px) {
	html {
		font-size: 32px;
	}
	#navigation, #main, footer div {
		max-width: 2400px;
	}
	header#mainHeader {
		background-image: -webkit-image-set(
   			url("img/headerBG/original.jpg")
   		);
		background-image: image-set(
			url("img/headerBG/original.jpg")
		);
	}
	
	#mission {
		background-image: -webkit-image-set(
			url("img/servicesBG/original.jpg")
		);
		background-image: image-set(
			url("img/servicesBG/original.jpg")
		);
	}
}

.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {
	clear: both;
}

@media print {
	html {
		font-size: 1.5vw;
	}
	
	* {
		background: transparent;
		color: #000;
		box-shadow: none;
		text-shadow: none;
		filter: none;
	}
	
	a, a:visited {
		text-decoration: underline;
	}
	
	a[href]:after {
		content: " (" attr(href) ")";
	}
	
	abbr[title]:after {
		content: " (" attr(title) ")";
	}
	
	pre, blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}
	
	thead {
		display: table-header-group;
	}
	
	tr, img {
		page-break-inside: avoid;
	}
	
	img {
		max-width: 100%;
	}
	
	@page {
	margin: 0.5cm;
	}
	
	p, h2, h3 {
		orphans: 3;
		widows: 3;
	}
	
	h2, h3 {
		page-break-after: avoid;
	}
}