html,body {
	height: 100%;
	background-size: 100% 100%;	
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	user-select:none;	
	overflow-y:hidden;
}
#homeDiv
{
	visibility:hidden;
}
.nopadding
{
	padding:0 !important;
}
.bottomClass
{
	position:fixed;
	bottom:0;
}

#question
{
	font-weight: bold;
	color:rgb(221,19,123);
	text-align:center;
}
.options,#questionBoard {
	height: 100%;
	background-size: 100% 100%;	
	background-position: center;
	background-repeat: no-repeat;
	overflow-y:hidden;
}
#questionBoard {
	height: 18vh;
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    overflow-y: hidden;
}
.spanElements
{
	height: 14vh;
    font-size: 2.2vw;
    color: white;
    font-weight: bold;
    text-align: center;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
}
.Quespan
{
	top:7vh;
	font-size: 2.4vw;
	color:white;
	font-weight:bold;
	position: absolute;
	text-align: center;
  
}
.options
{
	height: 14vh;
    position: relative;
    margin-top: 2.5vh;
}
/*............................*/
.rotateOption { 
transform: rotateX(360deg);
animation: one 2s ;
animation-direction: alternate;

}
@keyframes one {
	0% {
	  transform: rotateX(0);
	}
	100% {
	  transform: rotateX(180deg);
	}
  }
/*.............................*/
#creditDiv{
	margin-top:2vh;
}
#NextButtonDiv{
	position: fixed;
	bottom: 0%;
}
  #gameOver
  {
	  color: white;
	  font-size: 7vw;
	  font-weight:bold;
  }
  #acknowledgementDiv 
  {
	  display: block;
  }
  #finalPage
  {
	  display:none;
  }
  #acknowledgementDiv 
  {
	  display: block;
	  margin-top: 2vh;
	  background-color: aliceblue;
	  border: 0.22vw solid black;
	  border-radius: 3vw;
	  text-align:center;
  }
  #developerNameDiv
  {
	  margin-bottom: 2vh;
  }
  .fontClass
  {
	  font-size:1.3vw;
	  margin-top:1.5%;
	  color:black;
  }
  .firstLetter:first-letter
  {
  font-size:1.5vw;
  }
  #finalPage
  {
	  display:none;
  }
  .frogImgStyle{
	  z-index: 10;
	  position: absolute;
  }
  /*First Two options align to right side*/
/*  #parentDiv1{
	 margin-left: 13vw;
 }
 #parentDiv0{
	margin-left: 5vw;
} */
#frogDiv{
	margin-top: 2.5vh;
}
#questionMsg
{
	font-size: 3vw;
    line-height: 10vh;
}
#responseBox {
	margin-top: 25vh;
	background-color: #185b94;
	color: white;
 position:relative;
 top:0;
 left:0;
 height: 59vh;
 padding:2vh;
 }
 #btnDiv
 {
 margin-top:6vh;
 }
 #Yes,#No
 {
 background-color:rgb(249,185,0);
 color:black;
 font-size:2.5vw;
 font-weight:bold;
 }
 @keyframes zoomIn {
  from {
	opacity: 0;
	-webkit-transform: scale3d(0.3, 0.3, 0.3);
	transform: scale3d(0.3, 0.3, 0.3);
  }
 
  50% {
	opacity: 1;
  }
 }
 
 .zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
  animation-duration:1s;
 }
 .modal-content{
 background-color: white;/*rgba(38, 59, 95, 0.611764705882353);*/
 box-shadow:17px 25px 13px rgb(0, 0, 0), inset -98px 0px 180px rgb(60, 59, 130) /*17px 25px 14px rgb(0, 0, 0), inset -98px 0px 100px rgb(38, 59, 95)*/;
 border: 4px solid white;
 position: fixed;
	top: 25vh;
	right: 0;
	bottom: 0;
 left: 25vh;
 height:fit-content;
 }
 .overlay
 {
 z-index: 10;
 background-color: rgba(0,0,0,0.5);
 }
.blink_me
{
    animation:blinker 1s linear infinite;
}
@keyframes blinker
{
    50%
    {
        opacity:0.1;
    }
}