@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-environment.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: 36em;
}
#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: 40%;
  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;
  width: 38em;
}
#buttonSTART {
  background-color: white; /*blue*/
  border: none;
  color: black;
  font-family: SourceSans;
  font-weight: 600;
  padding: 0.3em 0.6em;
  text-align: left;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  margin-top: 7%;
}
#buttonSTART:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#buttonOWN {
  background-color: grey;
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 500;
  padding: 0.3em 0.6em;
  text-align: left;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  margin-top: 25%;
}
#buttonOWN:active {
  background-color: #3118FF; /*blue*/
  color: white;
}
#ecra3 {
  position: absolute;
  top: 15%;
  left: 4%;
  margin-top: 0em;
  margin-left: 0em;
  width: 100px;
  height: 100px;
  display:none;
}
#text3 {
  position: fixed;
  top: 39%;
  left: 33%;
}
#clean {
  width: 100%;
  height: 800px;
}

#ecra4 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display:none;
}
#text4 {
  position: fixed;
}
#buttonCLICK {
  background-color: transparent;;
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 500;
  padding: 0em;
  text-align: left;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  margin-top: 3%;
  text-decoration: underline;
}
#buttonCLICK:active {
  color: #3118FF; /*blue*/
}
#ecra5 {
  position: absolute;
  top: 15%;
  left: 4%;
  margin-top: 0em;
  margin-left: 0em;
  width: 100px;
  height: 100px;
  display:none;
}
#text5 {
  position: fixed;
  top: 25%;
  left: 15%;
}

#imgs {
  display: table-cell;
}

#trash {
  width: 15em;
  vertical-align: bottom;
  margin-top: 15%;
}
#dragcup {
  vertical-align: bottom;
  width: 6em;
  padding-right: 1em;

}
#dragbanana {
  vertical-align: bottom;
  width: 6em;
  padding-right: 1em;

}
#dragthing {
  vertical-align: bottom;
  width: 6em;
  padding-right: 1em;

}
#dragpaper {
  vertical-align: bottom;
  width: 6em;
  padding-right: 1em;

}
#dragbag {
  vertical-align: bottom;
  width: 6em;

}
#ecra6 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display:none;
}
#text6 {
  position: fixed;
}
#buttonCLICK2 {
  background-color: transparent;;
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 500;
  padding: 0em;
  text-align: left;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  margin-top: 3%;
  text-decoration: underline;
}
#buttonCLICK2:active {
  color: #3118FF; /*blue*/
}
#ecra7 {
  position: absolute;
  top: 25%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display:none;
}
#text7 {
  position: fixed;
}
#buttonSEE {
  background-color: transparent;;
  border: none;
  color: white;
  font-family: SourceSans;
  font-weight: 500;
  padding: 0em;
  text-align: left;
  text-decoration: none;
  display: inline-block;
  font-size: 1.8em;
  position: absolute;
  margin-top: 3%;
  text-decoration: underline;
}
#buttonSEE:active {
  color: #3118FF; /*blue*/
}

#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: 35%;
  left: 25%;
  margin-top: 0em;
  margin-left: 0em;
  width: 60%;
  height: 40%;
  display:none;
}
#textsure3 {
  position: fixed;
}
#buttons3 {
  position:fixed;
  top: 63%;
  right: 25%;
  width: 37em;
}
#buttonYES3{
  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%;
}

#buttonYES3:active {
  background-color: white;
  color: black;
}
#buttonNO3 {
  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%;
}

#buttonNO3:active {
  background-color: #3118FF;
  color: white;
}
#ecrasure4 {
  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%;
}
#textsure4 {
  position: fixed;
  width: 46em;
  top: 35%;
}
#buttons {
  display: block;
  width: 50em;
  margin-top: 7%;
}
#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: 10em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 130%;
}
.B1_1 {
  font-family: SourceSans;
  font-size: 2.5em;
  color: white;
  letter-spacing: 0.15em;
  text-align: left;
  font-weight: 400;
  width: 22em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 115%;
}
.B1_2 {
  font-family: SourceSans;
  font-size: 2em;
  color: white;
  letter-spacing: 0.15em;
  text-align: left;
  font-weight: 800;
  margin: 0;
  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: 2.2em;
  color: white;
  letter-spacing: 0.1em;
  text-align: left;
  font-weight: 300;
  width: 19em;
  margin: 0;
  display: block;
  position: relative;
  line-height: 130%;
}
.B4 {
  font-family: SourceSans;
  font-size: 1.2em;
  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%;
}