@keyframes typing {
	/*
  from { width: 0 }
  to { width: 100% }
  */
   from, to {color:green  }
  50% { color:red; 
  }
  
}
 
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: orange; 
  background:green;
  color:white;
  }
}
@keyframes blink-wrong {
  from, to { border-color: transparent }
  50% { border-color: orange; 
  background:red;
  color:white;
  }
}

.row
{
	display:block;
}

.mainCard
{
	display:block;

}
.mycard 
{
	border:2px solid black; 
	width:20%;
	float:left;
	border-radius: 20px;
	margin-right:10px;
	
}

.mychead 
{
	border:1px solid black; 
}

.cardbig
{
	font-size:25px;
}

.clsques
{
	font-size:20px;
	padding:5px;min-height:54px
}

.clsans
{
	font-size:14px;
}
.Qmaindiv
{
	margin-top:10px;
}
.ansdiv
{
	margin-top:15px;
}

.divq
{
	float:left;
	border: 2px solid green;
	border-radius: 20px;
	margin-top:10px;
	width:calc(100% - 17px);
	min-height:42px;
	padding : 5px 10px 5px 10px;
	background-color: aliceblue;
	margin-bottom:5px;
    
}

.divqe
{
	/*overflow: scroll;
	white-space: nowrap;*/
	/*animation:  typing 3.5s steps(40, end);*/
	/*animation:  typing .75s steps(40, end); ;*/
    /*blink-caret .75s step-end infinite;*/
}
.diva
{
	float:left;
	border: 2px solid green;
	border-radius: 20px;
	margin:1px 5px 5px 5px; /*10px 5px 5px 5px;*/
	width: calc(100% - 27px);
	min-height:30px; /*42*/
	padding : 5px 10px 5px 10px;
	background-color: beige;
	font-size:20px; /*30*/
	display:inline;
	
}

.divae
{
	/*overflow: scroll;
	white-space: nowrap;
	animation:  typing 3.5s steps(40, end);*/
	display:none;
    
}

.clsAnim
{
	animation:   blink-caret .75s step-end infinite;
}
.clsRedAnim
{
	animation:   blink-wrong .75s step-end infinite;
}


.divar
{
	/*float:right;*/
}



.divnp
{
	float:left;
	border: 2px solid orange;
	border-radius: 20px;
	margin:1px 1px 5px 5px;
	width:85px;
	min-height:42px;
	padding : 5px 10px 5px 10px;
	background-color: orange;
	font-size:20px;
	display:inline;
	color:white;
	
}

.clstime
{
	font-size:27px;
	font-weight:700;
	border:2px solid white;
    border-radius: 34px;
	
	padding:5px;
	background-color:green;
	color:white;
	width:60px;
	text-align:center;
	float:left;
	margin-left:10%;
	display:inline-block;
}

.clsmark
{
	font-size:27px;
	font-weight:700;
	border:2px solid white;
    border-radius: 34px;
	
	padding:5px;
	background-color:orange;
	color:white;
	width:85px;
	text-align:center;
	float:left;
	
	display:inline-block;
}

.timee
{
	display:none;
	/*position: relative;*/
   
}

.divScore
{
	float:left;
	border: 2px solid green;
	border-radius: 20px;
	margin-top:10px;
	width:calc(100% - 17px);
	min-height:42px;
	padding : 5px 10px 5px 10px;
	background-color: aliceblue;
	margin-bottom:5px;
    font-size: 30px;
	text-align:center;
    
}

.body {
 opacity: .7; background-image:url(../img/logo.png);  
 background-repeat: no-repeat;
  background-size: 350px 350px;background-position-x: center;
}