/* stylesheet for nervousdata.com */

/* FONTS */
@font-face {
			 font-family: 'Ronzino';
			 src: url('load/Ronzino-Regular.otf') format('otf'),
						url('load/Ronzino-Regular.woff2') format('woff2'),
						font-weight: normal;
						font-style: normal;
}
@font-face {
			 font-family: 'Ronzino-Oblique';
			 src: url('load/Ronzino-Oblique.otf') format('otf'),
						url('load/Ronzino-Oblique.woff2') format('woff2'),
						font-weight: normal;
						font-style: normal;
}
@font-face {
			 font-family: 'Ronzino-Bold';
			 src: url('load/Ronzino-Bold.otf') format('otf'),
						url('load/Ronzino-Bold.woff2') format('woff2'),
						font-weight: normal;
						font-style: normal;
}

/* BASICS */
html, body {
		padding: 0;
		margin: 0;
}

body {
	color: #1A001A;
	background: #F5F5F5;
	font: 16px/1.5 'Ronzino', Arial, Helvetica, sans-serif;
	font-size: 1.35rem;
	font-style: normal;
}

a {
	color: #8533ff;
	text-decoration: none;
}

p {
	max-width: 54rem;
	margin: 1.2rem 1.5rem;
}

h1 {
	margin: 2.5rem 1.5rem 1.2rem 0;
	font-size: 3.2rem;
}

h2 {
	font-size: 2.125rem;
}

h2, h3, h4 {
	margin: 2rem 1.5rem 1.2rem 1.5rem;
}

section {
	background: #F6F6F6;
	max-width: 64rem;
	margin: 2rem auto;
	padding: 1.5rem 0 0.75rem 0;
}


b, strong {
	font-family: 'Ronzino-Bold', Arial, Helvetica, sans-serif;
	font-style: normal;
}

hr {
	border: 1px dashed RebeccaPurple;
	margin: 1.5rem 0 1.5rem 0;
}

code {
	border-right: 1px solid RebeccaPurple;
	margin: 0 1.5rem 0 0;
}

img {
	max-width: 100%;
  height: auto;
}

ul {
	list-style-type: square;
	padding: 0 1.5rem;
}

li {
	margin: 0 0 0 1.5rem;
}

video {
	max-width: 100%;
  height: auto;
}

/* TOP SECTION */

.intro {
	background: none;
	max-width: 64rem;
	margin: 2rem auto;
	padding: 0 0 0.75rem 0;
}

.high {
  background-color: #c299ff;
	padding: 0 0.5rem;
}

/* FLEXBOX */
.flex-c {
  display: flex;
  flex-wrap: wrap;
	justify-content: flex-start;
	gap: 2rem;
	margin: 0.75rem;
	padding: 0;
}

.flex-i {
	flex: 65%;
	max-width: 60rem;
	margin: 0;
	padding: 0.75rem;
}

.flex-l {
	flex: 35%;
	max-width: 50rem;
	margin: 0;
	padding: 0.75rem;
}

.flex-pic {
  display: flex;
  flex-wrap: wrap;
	justify-content: center;
	gap: 1rem;
}

.flex-pic-item {
	max-width: 28rem;
	margin: 0;
}

.flex-pic-item-full {
	max-width: 100%;
	margin: 0;
}


.flex-list {
  display: flex;
  flex-wrap: wrap;
	justify-content: flex-start;
	gap: 1rem;
}

.flex-list-li {
	margin: 0;
}



/* ----------- RESPONSIVE ----------- */

@media screen and (max-width:45rem) {
		h1 { margin: 2.5rem 1.5rem 1.2rem 1.5rem;
				 font-size: 2.6rem; }
		section { max-width: 100vw;  }
}