* {
  margin: 0px;
  padding: 0px;
  font-family: Georgia;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

html,body { height: 100%; background-color: white; font-size: 17px; -webkit-text-size-adjust: 100%; }

object { position: absolute }

a {
  color: #00f;
}

a:visited {
  color: #00f;
}

mark {
  font-size: 1.18em;
  padding: 0.15em;
  background-color: #ff0;
}

.rot {
  -webkit-transform: rotate( -6.3deg );
  -moz-transform: rotate( -6.3deg );
  -o-transform: rotate( -6.3deg );
  -ms-transform: rotate( -6.3deg );
  transform: rotate( -6.3deg );
}

.list {
  text-align: left;
  display: inline-block;
}

.link {
  text-decoration: underline;
  cursor: pointer;
  color: #00f;
}

#frame {
  visibility: hidden;
  position: absolute;
  top: 2em;
  bottom: 2em;
  left: 2em;
  right: 2em;
}

#content {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 5em;
  border: .3em solid black;
  background: -moz-linear-gradient( 234deg, #008dd2, #ebecec );
  background: -webkit-linear-gradient( 234deg, #008dd2, #ebecec );
  background: -o-linear-gradient( 234deg, #008dd2, #ebecec );
  background: -ms-linear-gradient( 234deg, #008dd2, #ebecec );
  background: linear-gradient( 234deg, #008dd2, #ebecec );
  overflow: hidden;
}

#mask {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
  border-radius: 5em;
  border: .4em solid black;
  z-index: 100;
  pointer-events: none;
}

#mask2 {
  position: absolute;
  left: -1.7em;
  top: -1.7em;
  right: -1.7em;
  bottom: -1.7em;
  border-radius: 6.6em;
  border: 1.8em solid #fff;
  z-index: 101;
  pointer-events: none;
}

#mask 

#ie9background {
  position: absolute;
  width: 100%;
  height: 100%;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#008dd2', EndColorStr='#ebecec')";
}

#header {
	left: -3em;
	top: -5.3em;
	width: 47.2em;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#kontaktformular {
	right: 2em;
	top: -3.1em;
	width: 28.3em;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#kontaktButton {
	position: absolute;
	left: 49.2em;
	top: 0em;
	width: 13.5em;
	height: 2.7em;
	cursor: hand;
	cursor: pointer;
	z-index: 100;
	background-color: rgba(255,255,255,0.0001);
}

#pageContainer {
  position: absolute;
  width: 200em;
  top: 30%;
  margin-top: -14em;
  z-index: 5;
}

#messageBox {
  display: none;
  position: absolute;
  left: 15em;
  top: 16em;
  width: 40em;
  height: 15em;
  border: .25em solid #444;
  border-radius: 2em;
  background-color: #fffbdb;
  z-index: 10;
}

#message {
  display: table-cell;
  font-size: 1.6em;
  text-align: center;
  vertical-align: middle;
  padding: 1em;
}

#message_closeButton {
  position: absolute;
  right: 1.2em;
  top: .9em;
  width: 2em;
  cursor: hand;
  cursor: pointer;
}

.page {
  display: none;
}

.page h1 {
  position: absolute;
  text-align: center;
  font-size: 2.65em;
  font-weight: normal;
  -webkit-transform: rotate( -6.3deg );
  -moz-transform: rotate( -6.3deg );
  -o-transform: rotate( -6.3deg );
  -ms-transform: rotate( -6.3deg );
  transform: rotate( -6.3deg );
  color: #222;
  -webkit-backface-visibility: hidden;
}

.page div {
  
}

.text, .text2, .text3, .text4, .text5, .note, .note2, .note3, .label, .label2 , .label3{
  position: absolute;
  -webkit-transform: rotate( -6.3deg );
  -moz-transform: rotate( -6.3deg );
  -o-transform: rotate( -6.3deg );
  -ms-transform: rotate( -6.3deg );
  transform: rotate( -6.3deg );
  text-align: center;
  -webkit-backface-visibility: hidden;
}

.thumb {
  position: absolute;
  border: .15em solid black;
  background-color: #fff;
  padding: .5em;
  cursor: hand;
  cursor: pointer;
}

.formbox {
  position: absolute;
  left: 29em;
  top: 11.3em;
  padding: 1em 1em 3em;
  background-color: rgba(0,0,0,.1);
  width: 26.5em;
  height: 26.7em;
}

.formbox label {
  float: left;
  clear: left;
  padding: .4em;
  width: 7.8em;
  font-size: 1.2em;
  margin-right: .3em;
  text-align: right;
}

.formbox label[for=fv_licnum] {
  font-size: 1em;
  width: 10.08em !important;
  margin-top: -.3em;
}

.formbox label[for=fv_licnum] span {
  display: block;
  font-size: .8em;
}

.formbox input, .formbox textarea {
  float: left;
  position: relative;
  top: .2em;
  width: 9.8em;
  border: 0.1em solid #555;
  font-size: 1.3em;
  padding: .05em .3em;
}

.anmeldungButton:hover, .sendenButton {
  cursor: hand;
  cursor: pointer;
}

.arrow {
	border: solid black;
	border-width: 0 0.1em 0.1em 0;
	display: inline-block;
	padding: 0.23em;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	margin-right: 0.6em;
}

#kontaktFormular h1 {
  left: 7.8em;
}

#kontaktFormular .formbox {
  left: 11em;
  top: 13.4em;
  width: 43.5em;
  height: 21em;
  padding-top: 1.5em;
}

#kontaktFormular label {
  width: 5em;
}

#kontaktFormular .formbox p {
  float: left;
  margin-top: .6em;
}

#kontaktFormular .formbox div {
  float: left;
  margin-left: 1.4em;
  width: 20em;
  height: 12.5em;
  margin-top: 0.2em;
}

#kontaktFormular .formbox div label {
  width: auto;
}

#kontaktFormular textarea {
  width: 100%;
  height: 93.6%;
  border: 0.1em solid #555;
}

#kontaktFormular .sendenButton {
  left: 16em;
  top: 18.3em;
}


#vorgehensweise object {
  left: 1.3em;
  top: 7.7em;
  width: 26.4em;
}

#vorgehensweise h1 {
  left: 7.9em;
  top: 3.05em;
}

#vorgehensweise .text {
  left: 13.3em;
  top: 11.5em;
  font-size: 1.24em;
  line-height: 1.23em;
}

#nothelferkurse h1 {
	left: 8.9em;
	top: 2.65em;
}

#nothelferkurse object {
  left: 2.7em;
  top: 6.7em;
  width: 61em;
}

#nothelferkurse .label {
	font-size: 1.3em;
	font-weight: bold;
	left: 7.7em;
	top: 10.75em;
	text-align: right;
}

#nothelferkurse .label span {
	font-size: 0.7em;
	position: relative;
	top: -0.5em;
}

#nothelferkurse .label2 {
  font-size: 1.3em;
  left: 22.3em;
  top: 11.35em;
}

#nothelferkurse .label3 {
  font-size: 1.3em;
  font-weight: bold;
  left: 22.8em;
  top: 19.95em;
}

#nothelferkurse .list {
  font-size: 1.3em;
  left: 8.2em;
  top: 15.75em;
  text-align: left;
}

#nothelferkurse .list b {
  width: 7.5em;
  text-align: right;
  display: inline-block;
}

#nothelferkurse .list b:nth-of-type(2) {
	top: -0.2em;
	position: relative;
}

#nothelferkurse .list table {
	display: inline;
}

#nothelferkurse .list td:nth-of-type(1) {
	text-align: right;
	padding-right: 0.7em;
}

#nothelferkurse .text4 b {
	margin-bottom: 0.2em;
}

#nothelferkurse .text4 {
	left: 13.9em;
	top: 11em;
	font-size: 1.15em;
	width: 13em;
}

#nothelferkurse .text5 b {
	margin-bottom: -0.3em;
}

#nothelferkurse .text5 {
	left: 26em;
	top: 9.2em;
	font-size: 1.15em;
	width: 16em;
}

#nothelferkurse .text4 b, #nothelferkurse .text5 b {
  background-color: yellow;
	position: relative;
	top: -.6em;
	padding: .3em .7em;
	display: inline-block;
	border-radius: 0.3em;
}

#nothelferkurse .note {
	font-size: .95em;
	left: 3.8em;
	top: 20.25em;
	width: 14em;
}

#nothelferkurse .note2 {
  font-size: 1.15em;
  left: 40.3em;
  top: 11.7em;
  width: 16em;
}

#nothelferkurse .note3 {
  font-size: 1.3em;
  left: 21em;
  top: 27.55em;
}


#theorie object {
	left: 1.7em;
	top: 6.3em;
	width: 10em;
}

#theorie h1 {
  left: 10.4em;
  top: 3.45em;
}

#theorie .text {
	left: 9em;
	top: 10.8em;
	font-size: 1.28em;
	width: 33.3em;
	text-align: justify;
}

#theorie .text2 {
	left: 12em;
	top: 19.9em;
	width: 20.3em;
	text-align: left;
	white-space: pre-line;
	font-size: 1.1em;
}

#theorie .arrow {
	vertical-align: top;
	margin-top: 0.3em;
}

#theorie .text2 span {
	display: inline-block;
	width: 18.7em;
}
  

#theorie .thumb {
	left: 36.6em;
	top: 18.7em;
	width: 18em;
}

#theorie .anmeldungButton {
	position: absolute;
	left: 30em;
	top: 34.3em;
	width: 14em;
	-webkit-transform: rotate( -6.3deg );
	-moz-transform: rotate( -6.3deg );
	-o-transform: rotate( -6.3deg );
	-ms-transform: rotate( -6.3deg );
	transform: rotate( -6.3deg );
}

#verkehrskunde h1 {
  left: 8.9em;
  top: 3.15em;
}

#verkehrskunde object {
  left: 2.9em;
  top: 6.7em;
  width: 49em;
}

#verkehrskunde .text {
  left: 9.4em;
  top: 10.85em;
  font-size: 1.35em;
  width: 31em;
}

#verkehrskunde .text b {
  width: 5em;
  text-align: right;
  display: inline-block;
}

#verkehrskunde .note {
  left: 21.4em;
  top: 31.75em;
  font-size: 1.15em;
  width: 22em;
}

#fahrstunden h1 {
  left: 9.4em;
  top: 3.15em;
}

#fahrstunden object:nth-of-type(1) {
	left: 1.8em;
	top: 7.6em;
	width: 62em;
}

#fahrstunden object:nth-of-type(2) {
	width: 8em;
	top: 36em;
	left: 13em;
}

#fahrstunden > div {
	background-color: rgba(27,151,213,1);
	border: .1em solid rgba(255,255,255,.4);
	padding: 0.6em 1.2em .4em;
	transform: rotate(-7deg);
	position: absolute;
	left: 9em;
	top: 20.3em;
	color: white;
	z-index: 1;
}

#fahrstunden > div > div {
  float: right;
  margin-left: 1em;
}

#fahrstunden > div > div > div {
	border: .1em solid rgba(255,255,255,.4);
	padding: 0.1em .5em .1em;
	position: absolute;
	background-color: rgba(27,127,187,0.9);
	transform: rotate(4deg);
	left: 20em;
	top: 2.3em;
	height: 3.1em;
	line-height: 1.2em;
}

#fahrstunden > div > div > div > small {
	position: absolute;
	left: 5.6em;
	top: 1.4em;
	text-align: right;
	padding-right: 0.6em;
	line-height: 1em;
}

#fahrstunden .text {
	left: 17em;
	top: 9.95em;
	font-size: 1.3em;
	line-height: 1.4em;
}

#fahrstunden .text b {
  width: 7.5em;
  text-align: right;
  display: inline-block;
}

#fahrstunden .text2 {
	left: 10.5em;
	top: 21.75em;
	font-size: 1.2em;
	width: 27em;
	text-align: left;
}

#fahrstunden .note {
  left: 2em;
  top: 14.15em;
  font-size: 1.05em;
  width: 19em;
}

/*#fahrstunden .note2 {
  left: 42.7em;
  top: 22.65em;
  font-size: 1em;
  width: 20em;
}*/

#fahrstunden .thumb {
	left: 47.3em;
	top: 16em;
	width: 16em;
	z-index: 1;
}


#fahrstunden_fahrzeug object {
	width: 8.1em;
	top: 7.5em;
	left: 2em;
}

#fahrstunden_fahrzeug h1 {
	left: 6.6em;
	top: 3.65em;
}

#fahrstunden_fahrzeug .text, #fahrstunden_fahrzeug .text2 {
  font-size: 1.6em;
	line-height: 1.4em;
	font-weight: bold;
	text-align: left;
	list-style-type: circle;
}

#fahrstunden_fahrzeug .text {
	left: 7.2em;
	top: 10.55em;
}

#fahrstunden_fahrzeug .text li i {
    font-size: 0.7em;
    font-weight: normal;
    display: block;
    margin-top: -0.4em;
}

#fahrstunden_fahrzeug .text2 {
  left: 22.5em;
  top: 20.35em;
}

#fahrstunden_fahrzeug .thumb:nth-of-type(1) {
	left: 5.2em;
	top: 22em;
	width: 25em;
}

#fahrstunden_fahrzeug .thumb:nth-of-type(2) {
	left: 36.2em;
	top: 14em;
	width: 25em;
}



#preise h1 {
  left: 11em;
  top: 2.9em;
}

#preise .list {
	position: relative;
	left: 21.5em;
	top: 9.7em;
	font-size: 1.05em;
	width: 43em;
	text-align: left;
}

#preise .list img {
	display: block;
	position: absolute;
	margin-left: -5.4em;
	margin-top: 1.6em;
	cursor: hand;
	cursor: pointer;
}

#preise small {
	position: absolute;
	left: 2.5em;
	top: 7.3em;
	font-size: 0.83em;
}

#preise .list img:nth-of-type(1) {
	width: 3.8em;
  margin-top: 0.6em;
}

#preise .list img:nth-of-type(2) {
	margin-left: -4.5em;
	width: 2.5em;
	top: 5.7em;
}

#preise .list img:nth-of-type(3) {
	margin-left: -4.9em;
	width: 2.9em;
	margin-top: 1.7em;
}

#preise .list img:nth-of-type(4) {
	margin-left: -5.1em;
	width: 4.7em;
	margin-top: 1.7em;
}

#preise .list h6 {
  padding-top: 1em;
  font-size: 1.2em;
}

#preise .list h6:first-of-type {
  padding-top: 0;
}

#preise .list .arrow {
	vertical-align: top;
	top: 0.4em;
	position: relative;
}

#preise .list .sep {
  height: .5em;
}

#preise .list b {
  width: 16em;
  display: inline-block;
  font-size: 1.05em;
  font-weight: normal;
}

#preise .list i {
  display: inline-block;
  font-size: 1.05em;
}

.form h1 {
  left: 6em;
  top: 3.2em;
}

.form .text {
  position: absolute;
  font-size: 1.3em;
  left: 9em;
  top: 12em;
  text-align: center;
}

.form .text span {
  font-weight: bold;
}

.form .monthTable {
  position: absolute;
  left: 10.7em;
  top: 20em;
  cursor: auto;
  width: 16.5em;
}

.form .monthTable:hover {
  border-color: transparent;
}

.form .monthTable span {
  font-size: 1.5em;
  position: relative;
  text-align: center;
  top: -0.7em;
  width: 11em;
}

.form .monthTable div {
  display: table;
  width: 1.9em;
  height: 1.9em;
  margin: 0.1em;
}

.form .monthTable div i {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

.form .label {
  font-size: 1.5em;
  position: absolute;
  left: 9em;
  top: 11em;
}

.form .formbox p {
  text-align: center;
  padding: .2em;
  font-size: .9em;
}

.form img {
	position: absolute;
	left: 11em;
	top: 26.3em;
	width: 14em;
}

#lerncd_bestellung h1 {
  left: 7.6em;
}

#lerncd_bestellung .formbox {
	left: 20.4em;
	top: 12.8em;
	width: 26em;
	height: 24em;
}

#lerncd_bestellung img {
	top: 21.3em;
	left: 10.3em;
}

#verkehrskunde_anmeldung .formbox {
	height: 27.5em;
	top: 11.1em;
}

#verkehrskunde_anmeldung label {
  width: 8.4em;
}

#verkehrskunde_anmeldung img {
	top: 26.6em;
	left: 11em;
}

#fahrstunden_anmeldung .formbox {
	left: 20.5em;
	top: 12.4em;
	width: 26em;
	height: 25em;
}

#fahrstunden_anmeldung img {
  top: 24.2em;

}

[id$=_handy], [for$=_handy] { display: none }


#imageView {
  position: absolute;
  width: 36em;
  left: 14em;
  top: 8em;
  border: .3em solid black;
  background-color: white;
  padding: 1em;
}

#imageView_img {
  width: 100%;
}

#darken {
  display: none;
  position: absolute;
  width: 100em;
  height: 250em;
  margin-top: -50em;
  background-color: rgba(0,0,0,0.5);
}

#closeButton {
  display: none;
  width: 2.5em;
  left: 52.7em;
  top: 5.3em;
}

#closeButton_flat {
  position: absolute;
  left: 55em;
  top: -1em;
  width: 2em;
}

.monthTableContainer {
  float: left;
  margin-right: 1em;
  position: relative;
}

.monthTable {
  border: .1em dashed transparent;
  padding: .5em;
  cursor: hand;
  cursor: pointer;
  float: left;
}

.monthTable:hover {
  border-color: #999;
}

.monthTable h6 {
  float: left;
  clear: both;
  font-size: 1.5em;
  font-weight: normal;
}

.monthTable span {
  float: left;
  clear: both;
}

.monthTable div {
  float: left;
  margin: .05em;
  width: 1em;
  height: 1em;
  /*box-shadow: 0 0 0.1em 0.002em #444;*/
  border: .1em solid #444;
  background-color: #fff;
}

.courseFull {
	filter: grayscale(100%);
	cursor: default;
	opacity: .6;
}

.courseFull:hover {
  border-color: transparent;
}

.courseFullLabel {
	position: absolute;
	background-color: rgba(176, 0, 0, 0.8);
	font-size: 1.1em;
	padding: .3em .8em;
	border: .1em solid #d82a2a;
	border-radius: .3em;
	transform: rotate(-24deg);
	top: 3.1em;
	left: -0.7em;
	color: #fff;
}

.weekStart {
  clear: left;
}

.dayOutOfMonth {
  background-color: #bbb !important;
}

.dayWeekend {
  background-color: #ddd !important;
}

.dayHighlight {
  background-color: #ffd800 !important;
}

#nothelferkurseTables  {
  position: absolute;
  left: 14.6em;
  top: 27.4em;
}

#nothelferkurseTables .monthTable h6 {
  font-size: 1.4em;
}

#nothelferkurseTables .monthTable span {
  font-size: 1.2em;
}

#nothelferkurseTables .monthTable div {
  width: .7em;
  height: .6em;
}

#nothelferkurseTables .courseFullLabel {
	font-size: 1em;
	top: 5.1em;
}

#verkehrskundeTables {
  position: absolute;
  left: 12.3em; /*15.4em;*/
  top: 24em;
}

#verkehrskundeTables .monthTable {
  font-size: .92em;
}

#paper {
  display: none;
  left: 3em;
  top: 4em;
  width: 57.5em;
  pointer-events: none;
}

#formPage {
  display: none;
  left: 3em;
  top: 4em;
  width: 57.5em;
  height: 40em;
  background-color: red;
}

#menu {
  left: 7%;
  top: 18%;
  width: 53em;
}

#carInfo {
	width: 7em;
	right: 2.7em;
	bottom: 3em;
  z-index: 100;
}

#linksButton {
  right: -2em;
  bottom: -2.2em;
  width: 18em;
  z-index: 3;
}

@-webkit-keyframes carAnimation1 {
  0%  { width: .3em; right: 3.2em; bottom: 10.5em; transform: rotate(51deg) }
  24%  { width: 1em; right: 4.8em; bottom: 10.6em; transform: rotate(17deg) }
  70%  { width: 1.3em; right: 10em; bottom: 8.8em; transform: rotate(-14deg) }
  100% { width: 1.8em; right: 14.2em; bottom: 5.8em; transform: rotate(-34deg) }
}

@-webkit-keyframes carAnimation2 {
  0% { width: 1.8em; right: 18em; bottom: 12em; transform: rotate(38deg); z-index: 1 }
  14%  { width: 2em; right: 20em; bottom: 11.9em; transform: rotate(-12deg) }
  42%  { right: 21em; bottom: 9.7em; transform: rotate(-28deg) }
  55%  { width: 2.3em; right: 22em; bottom: 8.3em; transform: rotate(-10deg) }
  75%  { width: 2.8em; right: 26em; bottom: 9.3em; transform: rotate(10deg) }
  100% { width: 3.5em; right: 32em; bottom: 4.1em; transform: rotate(-44deg); z-index: 1 }
}

@-webkit-keyframes carAnimation3 {
  0% { width: 3.5em; right: 38em; bottom: 14em; transform: rotate(44deg); z-index: 2 }
  7%  { right: 40em; bottom: 14.5em; transform: rotate(6deg) }
  50%  { right: 53em; bottom: 7.7em; transform: rotate(-29deg) }
  /*60%  { right: 56em; bottom: 7.5em; transform: rotate(-29deg) }*/
  100% { width: 5em; right: 65em; bottom: -6em; transform: rotate(-34deg); z-index: 2 }
}

@keyframes carAnimation1 {
  0%  { width: .3em; right: 3.2em; bottom: 10.5em; transform: rotate(51deg) }
  24%  { width: 1em; right: 4.8em; bottom: 10.6em; transform: rotate(17deg) }
  70%  { width: 1.3em; right: 10em; bottom: 8.8em; transform: rotate(-14deg) }
  100% { width: 1.8em; right: 14.2em; bottom: 5.8em; transform: rotate(-34deg) }
}

@keyframes carAnimation2 {
  0% { width: 1.8em; right: 18em; bottom: 12em; transform: rotate(38deg); z-index: 1 }
  14%  { width: 2em; right: 20em; bottom: 11.9em; transform: rotate(-12deg) }
  42%  { right: 21em; bottom: 9.7em; transform: rotate(-28deg) }
  55%  { width: 2.3em; right: 22em; bottom: 8.3em; transform: rotate(-10deg) }
  75%  { width: 2.8em; right: 26em; bottom: 9.3em; transform: rotate(10deg) }
  100% { width: 3.5em; right: 32em; bottom: 4.1em; transform: rotate(-44deg); z-index: 1 }
}

@keyframes carAnimation3 {
  0% { width: 3.5em; right: 38em; bottom: 14em; transform: rotate(44deg); z-index: 2 }
  7%  { right: 40em; bottom: 14.5em; transform: rotate(6deg) }
  50%  { right: 53em; bottom: 7.7em; transform: rotate(-29deg) }
  /*60%  { right: 56em; bottom: 7.5em; transform: rotate(-29deg) }*/
  100% { width: 5em; right: 65em; bottom: -6em; transform: rotate(-34deg); z-index: 2 }
}

#movingCar {
  display: none;
  right: 3.4em;
  bottom: 8em;
  width: 2em;
  /*width: .3em;*/
  transform: rotate(54deg);
  /*-webkit-animation: carAnimation1 4s linear 2s forwards, carAnimation2 3s linear 7s forwards, carAnimation3 3s linear 11s forwards;
  animation: carAnimation1 4s linear 2s forwards, carAnimation2 3s linear 7s forwards, carAnimation3 3s linear 11s forwards;*/
}

#automatInfo {
	position: absolute;
  right: 21.7em;
  bottom: 2.7em;
  background-color: rgba(20,136,66,0.5);
  color: white;
  font-size: 1.3em;
  padding: 0.3em 1.5em;
  border-radius: 0.2em;
  z-index: 2;
  border: .1em solid rgba(255,255,255,.7);
}

#coronaInfo {
  position: absolute;
  right: 10.7em;
  bottom: 6.7em;
  left: 1em;
  background-color: rgba(136, 74, 20, 0.79);
  color: white;
  font-size: 1.3em;
  padding: 0.3em 1.5em;
  border-radius: 0.2em;
  z-index: 2;
  text-align: center;
  border: .1em solid rgba(255,255,255,.7);
}

#automatInfo p {
	float: right;
	margin-left: 0.7em;
}

#contactInfo {
	position: absolute;
	left: 6.8em;
	bottom: 0.4em;
	color: #fff;
	font-size: 2.3em;
	font-weight: normal;
	z-index: 4;
}

#welcome {
  width: 54.7em;
  right: 2.3em;
  bottom: 11.1em;
}

#hill1 {
  right: 25.8em;
  bottom: -4.6em;
  width: 42em;
  z-index: 2;
}

#hill2 {
  right: 7.6em;
  bottom: -7.5em;
  width: 31.5em;
  z-index: 1;
}

#hill3 {
  right: -3em;
  bottom: -5em;
  width: 20em;
}

@-webkit-keyframes cloudsAnimation {
  25% { -webkit-transform: translate(7em,-1em) }
  50% { -webkit-transform: translate(-4em,2.5em) }
  75% { -webkit-transform: translate(7em,0.5em) }
}

@keyframes cloudsAnimation {
  25% { right: 2.5em; top: -6em }
  50% { right: 5.5em; top: -2.5em }
  75% { right: 16.5em; top: -4.5em }
}

#clouds {
  right: 9.5em;
  top: -5em;
  width: 30em;
  -webkit-animation: cloudsAnimation 200s linear 2s infinite;
  animation: cloudsAnimation 200s linear 2s infinite;
}

/*@-webkit-keyframes sunAnimation {
  0% { left: -24em; top: -3em; width: 50em; }
  20% { left: -21em; top: -9em; }
  50% { left: -28em; top: -14em; }
}

@keyframes sunAnimation {
  20% { left: -21em; top: -9em; }
  50% { left: -28em; top: -14em; }
}*/

#sun {
  left: -24em;
  top: -3em;
  width: 50em;
  /*-webkit-animation: sunAnimation 200s linear 2s infinite forwards;
  animation: sunAnimation 200s linear 2s infinite forwards;*/
}