body
{
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-position:center;
	background-size:100% 100%;
	user-select : none;
  overflow: hidden;
}
.se-pre-con 
{
	position: fixed;
	left: 0px;
	top:150px;
	width:100%;
	height: 100px;
	z-index: 9999;
	background-repeat: no-repeat;
	background-position:center;
}
.pos
{
	position:fixed;
	bottom:0px;
}
.showletter{
 	  position: absolute;
    top: 50%;
    left:55%;
    transform: translate(-50%, -50%);
    color:#ffffff;
  	font-size: 3vw;
}
#mainDiv{
    margin-top: -1%;
}
.stars{
 margin-left:5%;
}
#starDiv2{
 margin-left:9%; 
}
.cards{
	margin-top: 0.5%;
 	position: relative;
  text-align: center;
}
.cardsImg{
	height:35vh;
  pointer-events:none;
}
.modalImg{
	height:50vh;
}
.letter{
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color:#ffffff;
  font-size: 7vw;
}
.noPadding
{
	padding : 0%;
}
#logos
{
	 margin-top:0.5%;
}
/* #soundDiv{
  margin-left: 2%;
} */
#starDiv{
  margin-left: 31%;
}
.modal-content
{
background-color: #9e599c;
}
.modal 
{
   display: none; /* Hidden by default */
   position: fixed; /* Stay in place */
   z-index: 1; /* Sit on top */
   padding-top: 100px; /* Location of the box */
   left: 0;
   top: 0;
   width: 100%; /* Full width */
   height: 100%; /* Full height */
   overflow: hidden; 
   background-color: rgba(0,0,0,0.6); 
   padding:10%;
}
#lastMsg{
    margin-top: 15%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    font-size: 9vw;
}
@media only screen and (max-width: 480px) {
#mainDiv{
  margin-top:0%;
}
}
@media only screen and (min-width: 1900px) {
.showletter {
    position: absolute;
    top: 50%;
    left: 51%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    font-size: 3vw;
}

#modalImg{
    height: -webkit-fill-available;
}
#responseBox{
  width: 17vw;
  height: 26vh;
}
}