/*CSS specific to the activity goes here. Anything related to the template, the headers, the footers will be at a higher folder level*/
.suggestions {
	height: 67%;
	width: 22%;
	margin: 1%;
	padding-top: 1%;
	border: 2px solid #91DEB6;
	text-align: center;
	display: inline-block;
}

.speechBubble {
	margin: 10% auto;
	width: 98%;
	height: 50%;
}

/*page5*/

.imageSection{
	width: 10%;
	margin: 3% 11%;
}

.imageWhole {
	width: 20%;
	margin: 1% 5%;

}

#brandWhole {
	display: none;
}


/*page6*/

.imageLogo {
	width: 30%;	
}


/*page9*/

.brandList li {
	height: 2em;
}

#brandListLeft {
	padding-left: 11%;
	float: left;
}

#totalCorrectHolder {
	text-align: center;
	padding: 2% 0;
	font-size: 1.4em;
	font-weight: bold;
	color: #F26454;
	float: left;
}

.sortingActivity{
	padding: 0;
	float: left;
}

.sortingActivity li{
	font-size: 0.9em;
	/* line-height: 1.2em; */
	height: 1.5em;
	list-style-type: none;
	color: #fff;
	border: 2px solid #fff;
	padding: 0.1em 0.3em;
	cursor: pointer;
}

.sortingleft {
	width: 25%;
}

.sortingleft li{
	
	background-color: #35213B;
	
}
.sortingright {
	width: 70%;
	background-color: #262626;
}

.sortingright li{
	background-color: #91DEB6;
	color: #262626;


}

/*page11 to page16*/
.singleAdvert {
	text-align: center;
}

 .singleButton.activityButton{
	margin: 1% 36%;
}

#catAdvert{
	height:60%;
}

.brandList {
	float: left;
	width: 45%;
}



.advert{
	max-width:inherit;
	height:75%;	
}



/*MEDIA QUERIES*/

@media only screen and (max-height: 700px) {
	.imageWhole {
		width: 10%;
		margin: 3% 4%;
	}
}