@font-face {
    	font-family: SourceSans;
    	src: url(../fonts/SourceSans/SourceSansPro-Regular.otf);
    	font-style: normal;
      font-weight: 300;
}
@font-face {
    	font-family: SourceSans;
    	src: url(../fonts/SourceSans/SourceSansPro-Bold.otf);
    	font-style: normal;
      font-weight: 800;
}
@font-face {
    	font-family: SourceSans;
    	src: url(../fonts/SourceSans/SourceSansPro-Semibold.otf);
    	font-style: normal;
      font-weight: 600;
}
@font-face {
    	font-family: SourceSans;
    	src: url(../fonts/SourceSans/SourceSansPro-Light.otf);
    	font-style: normal;
      font-weight: 200;
}
@font-face {
    	font-family: AnikkaSans;
    	src: url(../fonts/AnikkaSans/AnikkaSans-ExtraBold.otf);
    	font-style: normal;
      font-weight: 200;
}
html{
  font-size:16px;
  background: url("background-selfdrivingcar.png") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
body{
  -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
  -webkit-user-select: none;
  width: 1024px;
  margin-left: auto;
  margin-right: auto;
  font-size:80%;/* 1em == 10px*/
  height:100%;
  padding:0px;
}
#ecraGO {
    background: url("background-final.png") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    z-index: 20000;
    display: none;
    bottom: 0px;
    top: 0px;
    position: absolute;
    left: 0;
    right: 0;
}
#boxGO {
  background-color: #999900;
  position: absolute;
  top: 26%;
  left: 20%;
  padding: 4em;
  margin-top: 0em;
  margin-left: 0em;
  width: 52%;
  height: 37%;
}
#textGO {
  position: fixed;
  width: 40em;
  top: 34%;
}
#buttonsGO {
  position:fixed;
  top: 63%;
  right: 25%;
  width: 37em;
}
#buttonOOK {
  background-color: white;
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 300;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 120%;
  right: 29%;
}

#buttonOOK:active {
  background-color: white;
  color: black;
}
#buttonCL {
  background-color: white;
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 300;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 120%;
  right: 0%;
}

#buttonCL:active {
  background-color: #3118FF;
  color: white;
}
#ecra1 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
}
#text1 {
  position: fixed;
  width: 42em;
}
#buttonGO {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: fixed;
  top: 60%;
  right: 20%;
}
#buttonGO:active {
  background-color: #3118FF; /*blue*/
  color: white;
}

#ecra2 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display: none;
}
#text2 {
  position: fixed;
}
#contopt {
}
#buttonHOME {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 150%;
}
#buttonHOME:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#buttonWORK {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 150%;
  right: 58%;
}
#buttonWORK:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#buttonOTHER {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 150%;
  right: 35%;
}
#buttonOTHER:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#sureopt {
}
#buttonDRIVE {
  background-color: grey; /*blue*/
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 150%;
  right: -8%;
}
#buttonDRIVE:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#ecra3 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display: none;
}
#text3 {
  position: fixed;
}
#buttonWHY {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: fixed;
  top: 60%;
  right: 20%;
}
#buttonWHY:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#ecra4 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display: none;
}
#text4 {
  position: fixed;
}
#buttonNEXT {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: fixed;
  top: 60%;
  right: 20%;
}
#buttonNEXT:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#ecra5 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display: none;
}
#text5 {
  position: fixed;
}
#buttonNEXT2 {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: fixed;
  top: 60%;
  right: 20%;
}
#buttonNEXT2:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#ecra6 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display: none;
}
#text6 {
  position: fixed;
}
#buttonNEXT3 {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: fixed;
  top: 60%;
  right: 20%;
}
#buttonNEXT3:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#ecra7 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display: none;
}
#text7 {
  position: fixed;
}
#buttonOK {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: fixed;
  top: 60%;
  right: 20%;
}
#buttonOK:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#ecra8 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  display: none;
}
#text8 {
  position: fixed;
}
#buttonPLAY {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  width: 9em;
  margin-right: 0.3em;
}
#buttonPLAY:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#buttonTV {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  width: 9em;
  margin-right: 0.3em;
  right: -198%;
}
#buttonTV:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#buttonNEWS {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  width: 9em;
  margin-right: 0.3em;
  right: -359%;
}
#buttonNEWS:active {
  background-color: #3118FF; /*blue*/
  color: white;
}

#ecrasure1 {
  position: absolute;
  top: 35%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display:none;
}
#textsure1 {
  position: fixed;
}
#buttons1 {
  position:fixed;
  top: 63%;
  right: 25%;
  width: 37em;
}
#buttonYES1 {
  background-color: grey;
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 300;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 120%;
  right: 29%;
}

#buttonYES1:active {
  background-color: white;
  color: black;
}
#buttonNO1 {
  background-color: white;
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 300;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 120%;
  right: 0%;
}

#buttonNO1:active {
  background-color: #3118FF;
  color: white;
}
#ecrasure2 {
  position: absolute;
  top: 35%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display:none;
}
#textsure2 {
  position: fixed;
}
#buttons2 {
  position:fixed;
  top: 63%;
  right: 25%;
  width: 37em;
}
#buttonYES2 {
  background-color: grey;
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 300;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 120%;
  right: 29%;
}

#buttonYES2:active {
  background-color: white;
  color: black;
}
#buttonNO2 {
  background-color: white;
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 300;
  padding: 0.3em 0.9em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  top: 120%;
  right: 0%;
}

#buttonNO2:active {
  background-color: #3118FF;
  color: white;
}
#ecrasure3 {
  position: absolute;
  top: 20%;
  left: 20%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display:none;
}
#predict1 {
  position: fixed;
}
#predict2 {
  position: fixed;
  left: 41%;
  top: 25%;
}
#predict3 {
  position: fixed;
  left: 50%;
  top: 22%;
}
#textsure3 {
  position: fixed;
  width: 46em;
  top: 35%;
}
#buttons {
  display: block;
  width: 50em;
  margin-top: 57%;
}
#buttonSOLUTIONISM {
  background-color: #999900; /*C6BD00;*/
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 300;
  padding: 0.3em 0.9em;
  text-align: left;
  text-decoration: underline;
  display: inline-block;
  font-size: 1.8em;
  text-transform: uppercase;
}

#buttonSOLUTIONISM:active {
  color: #3118FF;
}
#buttonEDIT {
  background-color: white;
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 800;
  padding: 0.3em 0.9em;
  text-align: left;
  display: inline-block;
  font-size: 1.8em;
  text-decoration: underline;
}

#buttonEDIT:active {
  color: #3118FF;
  text-decoration: underline;
}


a:link {
  text-decoration: none;
}
.B0 {
  font-family: AnikkaSans;
  font-size: 3em;
  color: #808080; /*grey*/
  letter-spacing: 0.1em;
  text-align: left;
  font-weight: 300;
  width: 19em;
  margin: 0;
  display: block;
  position: relative;
}
.B1 {
  font-family: SourceSans;
  font-size: 3em;
  color: white;
  letter-spacing: 0.15em;
  text-align: left;
  font-weight: 800;
  width: 8em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 150%;
}
.B1_1 {
  font-family: SourceSans;
  font-size: 2.8em;
  color: white;
  letter-spacing: 0.15em;
  text-align: left;
  font-weight: 400;
  width: 19em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 150%;
}
.B1_2 {
  font-family: SourceSans;
  font-size: 2.5em;
  color: white;
  letter-spacing: 0.15em;
  text-align: left;
  font-weight: 400;
  margin: 0;
  width: 18em;
  display: block;
  position: relative;
  line-height: 125%;
}
.B1_3 {
  font-family: SourceSans;
  font-size: 2.8em;
  color: white;
  letter-spacing: 0.05em;
  text-align: left;
  font-weight: 800;
  width: 15em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 150%;
  text-transform: uppercase;
}
.B2 {
  font-family: SourceSans;
  font-size: 2.5em;
  color: white;
  letter-spacing: 0.1em;
  text-align: left;
  font-weight: 300;
  width: 22em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 130%;
}
.B3 {
  font-family: SourceSans;
  font-size: 1.5em;
  color: white;
  letter-spacing: 0.1em;
  text-align: left;
  font-weight: 300;
  width: 22em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 130%;
}
.B4 {
  font-family: SourceSans;
  font-size: 1.6em;
  color: white;
  letter-spacing: 0.05em;
  text-align: center;
  font-weight: 300;
  width: 12em;
  line-height: 200%;
}
.B5 {
  font-family: SourceSans;
  font-size: 2em;
  color: white;
  letter-spacing: 0.05em;
  text-align: left;
  font-weight: 300;
  width: 20em;
  display: block;
  position: relative;
  line-height: 130%;
}
