body {
	font-family: Arial;
}
section {
	height: 100vh;
	position: relative;
	background-color: #262626;
}
a {
	text-decoration: none;
	color: inherit;
}
h1 {
	font-size: 40px;
	font-weight: bold;
	color: #fff;
	text-align: center;
}
h2 {
	font-size: 30px;
	color: #fff;
}
h3 {
	font-size: 30px;
	font-weight: bold;
	color: #262626;
	/*text-align: center;*/
	margin-bottom: 30px;
}
h3 + p {
	line-height: 22px;
	margin-bottom: 30px;
	max-width: 400px;
}
p {
	font-size: 16px;
	color: #262626;
}
/*.content {
	width: 450px;
	height: 450px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -225px 0 0 -225px;
}*/
#sitcomForm .slide {
	display: none;
}
.slide-0 {
	width: 450px;
	height: 300px;
	position: absolute;
	top: 50% !important;
	left: 50% !important;
	margin: -150px 0 0 -225px;
}
.slide-0 .heading-intro,
.slide-0 .btn-begin {
	display: none;
}
.slide-0 .heading-intro {
	margin-bottom: 50px;
}
.slide-0 .btn-begin {
	width: 200px;
	margin: 0 auto;
	left: 50%;
	right: 0;
	margin-left: -123px;
	bottom: auto;
}
#sitcomForm .slide-1 {
	left: 100%;
	top: -100%;
}
#sitcomForm .slide-2 {
	right: 50%;
	top: -100%;
}
#sitcomForm .slide-3 {
	left: -100%;
	top: -100%;
}
#sitcomForm .slide-4 {
	left: 70%;
	top: -100%;
}
#sitcomForm .slide-5 {
	right: 300%;
	top: -200%;
}
section .final-content {
	left: 50%;
	top: -100%;
}
.slide-1,
.slide-2,
.slide-3,
.slide-4,
.slide-5,
.final-content {
	background-color: #fff;
	padding: 50px;
	width: 450px;
	height: 450px;
	position: absolute;
	/*left: 50%;
	top: 50%;*/
	margin: -275px 0 0 -275px;
}
.fields-with-descriptors {
	display: flex;
}
.fields-with-descriptors div {
	margin-right: 5px;
}
.field-with-descriptor {
	margin-bottom: 20px;
}
.small-descriptor {
	font-style: italic;
	font-size: 12px;
	max-width: 181px;
	line-height: 14px;
	color: #9f9f9f;
}
.btn {
	background-color: #dbdbdb;
	color: #262626;
	font-size: 14px;
	text-transform: uppercase;
	text-align: center;
	padding: 15px 20px;
	position: absolute;
	right: 50px;
	bottom: 50px;
	transition: background-color .5s;
}
.btn:hover {
	background-color: #ffdd5a;
	color: #262626;
}
/*.btn-next {
	display: none;
}*/
.submit-btn {
	cursor: pointer;
	margin: 0;
}

input {
	border: #c1c1c1 solid .5px;;
	padding: 10px 15px;
	margin: 0 5px 10px 0;
}
input.with-descriptor {
	margin-bottom: 5px;
}
.spacer {
	height: 1px;
	width: 100%;
	margin-bottom: 9px;
	color: transparent;
}

.final-content {
	width: 460px;
	height: 600px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -350px 0 0 -255px;
	display: none;
}

.final-content h1 {
	font-size: 35px;
	margin-bottom: 50px;
	color: #262626;
}
.final-content p {
	color: #6f6f6f;
}
.final-content .author {
	font-size: 20px;
	text-align: center;
	margin-bottom: 40px;
}
.submission-script {
	line-height: 40px
}

#insertion1 {
	font-size: 38px;
	text-decoration: underline;
}
.submission-script span {
	font-size: 18px;
}
.author span {
	font-size: 22px;
}
#insertion1,
.submission-script span,
.author span {
	text-decoration: underline;
	font-style: italic;
	margin: 0 3px;
}

#insertion1,
#insertion1819,
#insertion16,
#insertion9,
#insertion10,
#insertion11,
#insertion12,
#insertion9a,
#insertion10a,
#insertion11a,
#insertion12a,
#insertion13 {
	text-transform: capitalize;
}

#insertion2,
#insertion5,
#insertion6,
#insertion3,
#insertion4,
#insertion14 {
	text-transform: lowercase;
}
.restart-btn {
	display: none;
}



.rotate-straight {
	animation: rotateStraight 1s forwards 2s;
}
.rotate-straight-quick {
	animation: rotateStraight 2s forwards 1s;
}
.rotate-back {
	animation: rotateBack 2s forwards;
}

@keyframes rotateStraight {
  0% {
  	transform: rotate(-25deg);
  }
  25% {
  	transform: rotate(-10deg);
  }
  55% {
  	transform: rotate(-5deg);
  }
  100% {
  	transform: rotate(0deg);
  }
}

@keyframes rotateBack {
  0% {
  	transform: rotate(0deg);
  }
  35% {
  	transform: rotate(10deg);
  }
  100% {
  	transform: rotate(20deg);
  }
}







