@media only screen and (min-width:320px){
	
html{width: 100%;}
	
#nosignaltext{
  position: absolute;
  bottom: 5%;
  left: 0%;
  width: 100%;
  height: auto;
  text-align: center;
  font-size: 50px;
  margin: 0px;
  font-family: sans-serif;
  color: white;
}
#nosignal{
  z-index: 1;
  position: absolute;
  background-color: red;
  display: none;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
#nosignalimg{
  position: absolute;
  top: 5%;
  left: 30%;
  width: 40%;
  height: auto;
}
#footer{
  position: relative;
  bottom: 0.5px;
  top: 330px;	
  left: 5px;
  right: 5px;	
  font-family: arial;
  color: white;
  font-size: 0%;
  margin: 0px;
  width: 100%;	
}
#countdown{
  border: none;
  color: orange;
  font-family: arial;
  text-decoration: none;
  font-size: 50px;
  background-color: blue;
  position: absolute;
  width: 20%;
  height: auto;
  top: 75%;
  left: 20%;
  text-align: center;
  display: none;
}
.audienceinputboxes{
  width: 20%;
  height: 70px;
  position: relative;
  left: 0%;
  font-size: 25px;
}
	
#audienceinputbutton {
		font-size: 35px;
		padding: 8px;
	}	
	
#phoneresults {
    border: none;
	border-radius: 25px;
    color: white;
    font-family: arial;
    text-decoration: none;
    font-size: 40px;
    background-color: green;
    position: absolute;
    width: 55%;
    height: auto;
    top: 530px;
    left: 30px;
    text-align: center;
    padding: 30px 10px;
	box-shadow: 0 4px 8px 0 rgb(0 0 0), 0 6px 20px 0 rgb(0 0 0);	
    display: none;
}

#setuphelp {
  border: none;
  color: white;
  font-family: arial;
  text-decoration: none;
  font-size: 40px;
  position: absolute;
  width: 70%;
  height: auto;
  top: 70px;
  left: 20px;
  text-align: center;
}
#helptext {
  font-size: 3vw;
}
#audienceresults, #audienceinput{
  border: none;
  border-radius: 50px 50px 0px 50px;	
  color: white;
  font-family: arial;
  text-decoration: none;
  font-size: 40px;
  background-color: #4503c3;
  position: absolute;
  width: 57%;
  height: auto;
  top: 530px;
  left: 30px;
  text-align: center;
  padding: 15px 0;	
 /* box-shadow: 0 4px 8px 0 rgb(0 0 0), 0 6px 20px 0 rgb(0 0 0);	*/
  display: none;
}

.Audarrow:after {
  content: " ";
  position: absolute;
  right: 0px;
  top: 253px;	
  bottom: 32px;
  border-top: 45px solid #4503c3;
  border-right: 25px solid transparent;
  border-left: 15px solid transparent;
  border-bottom: none;
  z-index: 1;	
}
	

	
#prizedetails{
  border: none;
  color: white;
  font-family: arial;
  text-decoration: none;
  font-size: 40px;
  background-color: green;
  position: absolute;
  width: 57%;
  height: auto;
  top: 25px;
  left: 30px;
  text-align: center;
  padding: 15px 0;	
  display: none;
}
#syncfailed{
  width: 4%;
  height: 10px;
  position: absolute;
  top: 70px;
  left: 30px;
  padding: 12px 5px 0 5px;	
  background-color: red;
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  font-size: 30px;
  font-family: arial;
  display:none;
}
#takemoneybutton{
  background-color: red;
  width: 58.4%;
  height: 80px;
  position: absolute;
  top: 25px;
  display: none;
  left: 26px;
  cursor: pointer;
  font-size: 40px;	
}
#newquestionbutton {
	pointer-events: none; 
}
#resetbutton{
  background-color: SteelBlue;
  width: 57%;
  height: auto;
  position: absolute;
  top: 620px;
  display: none;
  left: 30px;
  font-size: 40px;	
  cursor: pointer;
  padding: 20px 0;	
}
#entercodebutton {
    font-size: 40px;
    background-color: orange;
    width: 23%;
    height: 80px;
    position: absolute;
    top: 25px;
    left: 375px;
	border-radius: 5px;
    cursor: pointer;
}
#revealanswerbutton{
  background-color: #e76804;
  width: 57%;
  height: 80px;
  position: absolute;
  top: 440px;
  left: 30px;
  cursor: pointer;
  border-radius: 5px;	
  display: none;
}
#loadquestionbutton{
  background-color: green;
  width: 57%;
  height: 80px;
  position: absolute;
  top: 620px;
  left: 30px;
  cursor: pointer;
  display: none;
}
#codeinput{
  width: 10%;
  height: auto;
  position: absolute;
  top: 25px;
  left: 30px;
  font-size: 30px;
  display:none;
}
#topicselect{
  width: 33.5%;
  height: 80px;
  position: absolute;
  top: 25px;
  left: 30px;
  font-size: 35px;
}
#modeselect{
  width: 4%;
  height: 10px;
  position: absolute;
  top: 25px;
  left: 480px;
  font-size: 40px;
  background-color: green;
  color: white;
  display: none;	
}	
#optionselect{
  width: 42%;
  height: 5%;
  position: absolute;
  top: 5%;
  left: 53%;
  font-size: 30.5px;
  background-color: green;
  color: white;
}
	
option{font-size: 12px;}	
	
#startbutton{
  background-color: orange;
  width: 57%;
  height: 80px;
  position: absolute;
  top: 620px;
  left: 30px;
  display: none;
  font-size: 40px;
  border-radius: 5px;	
  cursor: pointer;
}
#buttoncontainer{
  position: absolute;
  top: 20px;
  left: 20px;
  width: 69%;
  height: 450px;
  border: solid black;
}
.button{
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  font-size: 40px;
}
#body{
  background-color: #340044;
  background-repeat: no-repeat;
  background-attachment: fixed;
  position: absolute;
  width: inherit;	
}
	
body{margin: 0px}	
	
#lifelinestable {
    border: none;
    table-layout: fixed;
    width: 60%;
    height: 125px;
    position: relative;
    left: 16px;
    top: 250px;
    bottom: 0px;
}
.lifelineimg{
  width: 70%;
  height: auto;
  position: relative;
  left: 30%;
  display: block;
  text-align: center;
  cursor: pointer;
}
#questiontable {
    border: none;
    table-layout: fixed;
    width: 93%;
    position: relative;
    left: 30px;
    top: 275px;
    bottom: 0px;
}
#questiontable td {
  width: 35vw;
}
.imgcontainer {
  position: relative;
  color: white;
  font-family: arial;
}
.tableimg {
  height: auto;
  width: 100%;
}
#questiontext {
  font-size: 38px;
  display: table-cell; 
  text-align: center;
  vertical-align: middle; 
  position: absolute;
  top: 10%;
  left: 10%;
  width: 80%;
  height: 80%;
}
.answertext {
  font-size: 33px;
  display: table-cell; 
  text-align: left;
  vertical-align: middle; 
  position: absolute;
  top: 13px;
  width: 80%;
  height: 80%;
  cursor: pointer;	
}
.answertextleft {
  left: 12%;
}
.answertextright {
  left: 4%;
}
#prizestable {
    border: 1px solid white;
    font-family: arial;
    color: orange;
    width: 30%;
    position: absolute;
    bottom: 0px;
    right: 35px;
    top: 25px;
}
#prizestable td {
  height: 55px;
  width: 200px;
}
#prizestable tr {
  font-size: 35.5px;
}	
.prizesA {
  /*width: 6.5vw;*/
  width: auto;
  align: right;
  height: 30px;
}
.prizesB {
  /*width: 2vw;*/
  width: auto;
  align: centre;
  height: 30px;
}
.prizesA {
  /*width: 16.5vw;*/
  width: auto;
  align: left;
  height: 30px;
}
	
.logo{display: block;margin: 125px 0 0 12%;}	
#logo{width: 400px;}	
	
}

@media only screen and (min-device-width:600px){
	
#nosignaltext{
  bottom: 5%;
  left: 0%;
  font-size: 50px;
  margin: 0px;
}
#nosignal{
  top: 0px;
  left: 0px;
}
#nosignalimg{
  top: 5%;
  left: 30%;
  width: 40%;
}
#footer{
  bottom: 0.5px;
  top: 330px;	
  left: 5px;
  right: 5px;	
  font-size: 0%;
  margin: 0px;
}
#countdown{
  font-size: 50px;
  width: 20%;
  top: 75%;
  left: 20%;
}
.audienceinputboxes{
  width: 20%;
  height: 70px;
  left: 0%;
  font-size: 25px;
}
	
#audienceinputbutton {
		font-size: 35px;
		padding: 8px;
	}	
	
#phoneresults {
    font-size: 26px;
	border-radius: 25px 25px 0px 25px;
    width: 24%;
    top: 425px;
    left: 30px;
    padding: 20px 10px;
}
#setuphelp {
  font-size: 40px;
  width: 70%;
  top: 70px;
  left: 20px;
}
#helptext {
  font-size: 3vw;
}
#audienceresults, #audienceinput{
  border-radius: 35px;	
  font-size: 26px;
  width: 35%;
  top: 425px;
  left: 300px;
  padding: 15px 0;	
}
	
.Audarrow:after {
  right: 50px;
  top: 178px;	
}	
#prizedetails{
  font-size: 28px;
  width: 63%;
  top: 25px;
  left: 30px;
  padding: 10px 0;	
}
#syncfailed{
  width: 10%;
  height: 110px;
  top: 70px;
  left: 30px;
  padding: 12px 5px 0 5px;	
  font-size: 30px;
}
#takemoneybutton{
  width: 63%;
  height: 60px;
  top: 25px;
  left: 26px;
  font-size: 28px;	
}

#resetbutton{
  width: 63%;
  top: 465px;
  left: 30px;
  font-size: 28px;	
  padding: 15px 0;	
}
#entercodebutton {
    font-size: 25px;
    width: 23%;
    height: 60px;
    top: 25px;
    left: 420px;
}
#revealanswerbutton{
  width: 21%;
  height: 60px;
  top: 360px;
  left: 30px;
}
#loadquestionbutton{
  width: 63%;
  height: 60px;
  top: 480px;
  left: 30px;
}
#codeinput{
  width: 40%;
  top: 25px;
  left: 30px;
  font-size: 25px;
}
#topicselect{
  width: 37%;
  height: 60px;
  top: 25px;
  left: 30px;
  font-size: 25px;
}
#modeselect{
  width: 48%;
  height: 110px;
  top: 86px;
  left: 480px;
  font-size: 30px;
}	
#optionselect{
  width: 42%;
  height: 5%;
  top: 5%;
  left: 53%;
  font-size: 20px;
}
	
option{font-size: 18px;}	
	
#startbutton{
  width: 63%;
  height: 60px;
  top: 480px;
  left: 30px;
  font-size: 25px;	
}
#buttoncontainer{
  top: 20px;
  left: 20px;
  width: 69%;
  height: 450px;
}
.button{
  font-size: 25px;
}
	
#lifelinestable {
    width: 60%;
    height: 90px;
    left: 47px;
    top: 200px;
    bottom: 0px;
}
.lifelineimg{
  width: 50%;
  left: 30%;
}
#questiontable {
    width: 65%;
    left: 25px;
    top: 200px;
    bottom: 0px;
}
#questiontable td {
  width: 35vw;
}
#questiontext {
  font-size: 25px;
  top: 9%;
  left: 7%;
  width: 85%;
  height: 80%;
}
.answertext {
  font-size: 21px;
  top: 9px;
  width: 85%;
  height: 65%;
}
.answertextleft {
  left: 12%;
}
.answertextright {
  left: 4%;
}
#prizestable {
    width: 25%;
    bottom: 0px;
    right: 35px;
    top: 25px;
}
#prizestable td {
  height: 52px;
  width: 200px;
}
#prizestable tr {
  font-size: 25px;
}	
	
.logo{margin: 100px 0 0 19%;}	
#logo{width: 300px;}	
}


@media only screen and (min-device-width:769px){

#nosignaltext{
  bottom: 5%;
  left: 0%;
  font-size: 50px;
  margin: 0px;
}
#nosignal{
  top: 0px;
  left: 0px;
}
#nosignalimg{
  top: 5%;
  left: 30%;
  width: 40%;
}
#footer{
  bottom: 0.5px;
  top: 330px;	
  left: 5px;
  right: 5px;	
  font-size: 0%;
  margin: 0px;
}
#countdown{
  font-size: 50px;
  width: 20%;
  top: 75%;
  left: 20%;
}
.audienceinputboxes{
  width: 20%;
  height: 70px;
  left: 0%;
  font-size: 25px;
}
	
#audienceinputbutton {
		font-size: 35px;
		padding: 8px;
	}	
	
#phoneresults {
    font-size: 22px;
    width: 32%;
    top: 370px;
    left: 30px;
    padding: 20px 10px;
}

#audienceresults, #audienceinput{
  font-size: 22px;
  width: 35%;
  top: 370px;
  left: 38.5%;
  padding: 10px 0;	
}
.Audarrow:after {
  right: 100px;
  top: 140px;	
}		
#prizedetails{
  font-size: 22px;
  width: 70%;
  top: 25px;
  left: 30px;
  padding: 5px 0;	
}
#syncfailed{
  width: 40%;
  height: 110px;
  top: 70px;
  left: 30px;
  padding: 12px 5px 0 5px;	
  font-size: 20px;
}
#takemoneybutton{
  width: 70%;
  height: 54px;
  top: 25px;
  left: 26px;
  font-size: 23px;	
}

#resetbutton{
  width: 70%;
  top: 415px;
  left: 30px;
  font-size: 22px;	
  padding: 12px 0;	
}
#entercodebutton {
    font-size: 20px;
    width: 29%;
    height: 50px;
    top: 25px;
    left: 425px;
}
#revealanswerbutton{
  width: 24%;
  height: 50px;
  top: 315px;
  left: 30px;
}
#loadquestionbutton{
  width: 70%;
  height: 50px;
  top: 420px;
  left: 30px;
}
#codeinput{
  width: 40%;
  top: 25px;
  left: 30px;
  font-size: 20px;
}
#topicselect{
  width: 37%;
  height: 50px;
  top: 25px;
  left: 30px;
  font-size: 20px;
}
#modeselect{
  width: 48%;
  height: 110px;
  top: 86px;
  left: 480px;
  font-size: 20px;
}	
#optionselect{
  width: 42%;
  height: 5%;
  top: 5%;
  left: 53%;
  font-size: 20px;
}
	
option{font-size: 16px;}	
	
#startbutton{
  width: 70%;
  height: 50px;
  top: 420px;
  left: 30px;
  font-size: 23px;	
}
#buttoncontainer{
  top: 20px;
  left: 20px;
  width: 69%;
  height: 450px;
}
.button{
  font-size: 23px;
}
	
#lifelinestable {
    width: 60%;
    height: 60px;
    left: 80px;
    top: 160px;
    bottom: 0px;
}

.lifelineimg{
  width: 40%;
  left: 30%;
}
#questiontable {
    width: 70%;
    left: 32px;
    top: 157px;
    bottom: 0px;
}
#questiontable td {
  width: 35px;
}
#questiontext {
  font-size: 22px;
  top: 9%;
  left: 7%;
  width: 85%;
  height: 80%;
}
.answertext {
  font-size: 18px;
  top: 9px;
  width: 85%;
  height: 65%;
}
.answertextleft {
  left: 12%;
}
.answertextright {
  left: 4%;
}
#prizestable {
    width: 21%;
    bottom: 0px;
    right: 30px;
    top: 25px;
}
#prizestable td {
  height: 45px;
  width: 200px;
}
#prizestable tr {
  font-size: 23px;
}	
	
.logo{margin: 80px 0 0 24%;}	
#logo{width: 280px;}	
	
}


@media only screen and (min-device-width:1024px){
	
#nosignaltext{
  bottom: 5%;
  left: 0%;
  font-size: 50px;
  margin: 0px;
}
#nosignal{
  top: 0px;
  left: 0px;
}
#nosignalimg{
  top: 5%;
  left: 30%;
  width: 40%;
}
#footer{
  bottom: 0.5px;
  top: 330px;	
  left: 5px;
  right: 5px;	
  font-size: 0%;
  margin: 0px;
}
#countdown{
  font-size: 50px;
  width: 20%;
  top: 75%;
  left: 20%;
}
.audienceinputboxes{
  width: 20%;
  height: 70px;
  left: 0%;
  font-size: 25px;
}
	
#audienceinputbutton {
		font-size: 35px;
		padding: 8px;
	}	
	
#phoneresults {
    font-size: 18px;
    width: 33%;
    top: 330px;
    left: 30px;
    padding: 15px 10px;
}

#audienceresults, #audienceinput{
  font-size: 18px;
  width: 35%;
  top: 330px;
  left: 39%;
  padding: 8px 0;	
}
.Audarrow:after {
  right: 138px;
  top: 117px;
  bottom: 30px;
  border-top: 25px solid #4503c3;
  border-right: 20px solid transparent;
  border-left: 15px solid transparent;	
}	
#prizedetails{
  font-size: 18px;
  width: 69.2%;
  top: 25px;
  left: 30px;
  padding: 5px 0;	
}
#syncfailed{
  width: 40%;
  height: 110px;
  top: 70px;
  left: 30px;
  padding: 12px 5px 0 5px;	
  font-size: 20px;
}
#takemoneybutton{
  width: 70%;
  height: 45px;
  top: 25px;
  left: 26px;
  font-size: 18px;	
}

#resetbutton{
  width: 30%;
  top: 370px;
  left: 23%;
  font-size: 18px;	
  padding: 10px 0;	
}
#entercodebutton {
    font-size: 18px;
    width: 310px;
    height: 40px;
    top: 25px;
    left: 42%;
}
#revealanswerbutton{
  width: 265px;
  height: 40px;
  top: 285px;
  left: 30px;
}
#loadquestionbutton{
  width: 30%;
  height: 40px;
  top: 375px;
  left: 23%;
}
#codeinput{
  width: 40%;
  top: 25px;
  left: 30px;
  font-size: 20px;
}
#topicselect{
  width: 350px;
  height: 40px;
  top: 25px;
  left: 30px;
  font-size: 18px;
}
#modeselect{
  width: 48%;
  height: 110px;
  top: 86px;
  left: 480px;
  font-size: 20px;
}	
#optionselect{
  width: 42%;
  height: 5%;
  top: 5%;
  left: 53%;
  font-size: 20px;
}
	
option{font-size: 17px;}	
	
#startbutton{
  width: 30%;
  height: 40px;
  top: 375px;
  left: 23%;
  font-size: 18px;	
}
#buttoncontainer{
  top: 20px;
  left: 20px;
  width: 69%;
  height: 450px;
}
.button{
  font-size: 18px;
}
	
#lifelinestable {
    width: 55%;
    height: 60px;
    left: 10%;
    top: 130px;
    bottom: 0px;
}

.lifelineimg{
  width: 40%;
  left: 30%;
}
#questiontable {
    width: 65%;
    left: 5%;
    top: 125px;
    bottom: 0px;
}
#questiontable td {
  width: 35px;
}
#questiontext {
  font-size: 18px;
  top: 9%;
  left: 7%;
  width: 85%;
  height: 80%;
}
.answertext {
  font-size: 15px;
  top: 12px;
  width: 85%;
  height: 60%;
}
.answertextleft {
  left: 12%;
}
.answertextright {
  left: 4%;
}
#prizestable {
    width: 22%;
    bottom: 0px;
    right: 30px;
    top: 25px;
}
#prizestable td {
  height: 39.5px;
  width: 200px;
}
#prizestable tr {
  font-size: 18px;
}	
	
.logo{margin: 70px 0 0 26%;}	
#logo{width: 250px;}	
}

@media only screen and (min-device-width:1366px){


#nosignaltext{
  bottom: 5%;
  left: 0%;
  font-size: 50px;
  margin: 0px;
}
#nosignal{
  top: 0px;
  left: 0px;
}
#nosignalimg{
  top: 5%;
  left: 30%;
  width: 40%;
}
#footer{
  bottom: 0.5px;
  top: 330px;	
  left: 5px;
  right: 5px;	
  font-size: 0%;
  margin: 0px;
}
#countdown{
  font-size: 50px;
  width: 20%;
  top: 75%;
  left: 20%;
}
.audienceinputboxes{
  width: 20%;
  height: 70px;
  left: 0%;
  font-size: 25px;
}
	
#audienceinputbutton {
		font-size: 30px;
		padding: 8px;
	}	
	
#phoneresults {
    font-size: 16px;
    width: 290px;
    top: 270px;
    left: 200px;
    padding: 15px 10px;
}

#audienceresults, #audienceinput{
  font-size: 16px;
  width: 315px;
  top: 250px;
  left: 39.5%;
  padding: 5px 0;	
}
.Audarrow:after {
  right: 95px;
  top: 95px;
  bottom: 30px;
  border-top: 25px solid #4503c3;
  border-right: 20px solid transparent;
  border-left: 15px solid transparent;	
}		
#prizedetails{
  font-size: 18px;
  width: 650px;
  top: 25px;
  left: 200px;
  padding: 5px 0;	
}
#syncfailed{
  width: 40%;
  height: 110px;
  top: 70px;
  left: 200px;
  padding: 12px 5px 0 5px;	
  font-size: 15px;
}
#takemoneybutton{
  width: 650px;
  height: 40px;
  top: 25px;
  left: 200px;
  font-size: 18px;	
}

#resetbutton{
  width: 280px;
  top: 290px;
  left: 29%;
  font-size: 18px;	
  padding: 8px 0;	
}
#entercodebutton {
    font-size: 18px;
    width: 280px;
    height: 40px;
    top: 25px;
    left: 550px;
}
#revealanswerbutton{
  width: 225px;
  height: 40px;
  top: 212px;
  left: 200px;
}
#loadquestionbutton{
  width: 280px;
  height: 40px;
  top: 285px;
  left: 29%;
}
#codeinput{
  width: 40%;
  top: 25px;
  left: 30px;
  font-size: 20px;
}
#topicselect{
  width: 280px;
  height: 40px;
  top: 25px;
  left: 200px;
  font-size: 18px;
}
#modeselect{
  width: 48%;
  height: 110px;
  top: 86px;
  left: 480px;
  font-size: 20px;
}	
#optionselect{
  width: 42%;
  height: 5%;
  top: 5%;
  left: 53%;
  font-size: 20px;
}
	
option{font-size: 17px;}	
	
#startbutton{
  width: 280px;
  height: 40px;
  top: 285px;
  left: 29%;
  font-size: 18px;	
}
#buttoncontainer{
  top: 25px;
  left: 200px;
  width: 300px;
  height: 40px;
}
.button{
  font-size: 18px;
}
	
#lifelinestable {
    width: 560px;
    height: 40px;
    left: 255px;
    top: 90px;
    bottom: 0px;
}

.lifelineimg{
  width: 45px;
  left: 30%;
}
#questiontable {
    width: 600px;
    left: 230px;
    top: 90px;
    bottom: 0px;
}
#questiontable td {
  width: 35px;
}
#questiontext {
  font-size: 16px;
  top: 9%;
  left: 7%;
  width: 85%;
  height: 80%;
}
.answertext {
  font-size: 13px;
  top: 10px;
  width: 85%;
  height: 60%;
}
.answertextleft {
  left: 12%;
}
.answertextright {
  left: 4%;
}
#prizestable {
    width: auto;
    bottom: 0px;
    right: 250px;
    top: 25px;
}
#prizestable td {
  height: 31px;
  width: 50px;
}
#prizestable tr {
  font-size: 16px;
}	
	
.logo{margin: 60px 0 0 31.5%;width: fit-content;}	
#logo{width: 200px;}
	
.container {width: 1366px;margin: 0 auto;height: auto;}	
	
.content {
	width: 1366px;
    margin: 0 auto;;
    position: fixed;
}
	
}


#startbutton, #loadquestionbutton, #revealanswerbutton, #resetbutton {
  animation: blink 1s ease-in-out infinite;
}

@keyframes blink {
  50% {background-color: purple;}
}
