/* Coloured Boxes ***********************************************************************************************************************/
/**************** Index Pade *************************/
/* dark red cell box */
#flipBox .transparent_cell{
	width: 176px;
	height: 176px;
	color: #000000;
	font-size: 16px;
	text-align: center;
	display: block;
	border: 2px solid #dddddd;
}

/* dark red cell box */
#flipBox .red_cell{
	background: #FF6666;
	width: 180px;
	height: 180px;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* green cell box */
#flipBox .green_cell{
	background:  #66FF66;
	width: 180px;
	height: 180px;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* blue cell box */
#flipBox .blue_cell{
	background: #6666ff;
	width: 180px;
	height: 180px;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* yellow cell box */
#flipBox .yellow_cell{
	background: #FFFF66;
	width: 180px;
	height: 180px;
	color: #000000;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* brown cell box */
#flipBox .brown_cell{
	background: #4E433A;
	width: 180px;
	height: 180px;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* grey cell box */
#flipBox .grey_cell{
	float:left;
	background: #cdcdcd;
	width: 180px;
	height: 180px;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* white cell box */
#flipBox .white_cell{
	background: #ffffff;
	width: 180px;
	height: 180px;
	color: #000000;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* blue violet cell box */
#flipBox .blue_violet_cell{
	background: #21004F;
	width: 180px;
	height: 180px;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	display: block;
}

#flipBox span, .blue_violet_cell:hover>div {
    display: none;
}
#flipBox .blue_violet_cell:hover>span {
    display: block;
	color: #000000;
	background: #000000;
	font-size: 13px;
	width: 180px;
	height: 180px;
}

/* Allow content to be displayed only on hover ********************************************************************************************/
div.cell_text ul {
	display:none; 
	color: #ffffff;
	font-size: 13px;
	text-align: left;
}

div.cell_text:hover ul{
	display:block; 
	color: #ffffff;
	font-size: 13px;
	list-style: none;
	float: left;
}


/* Coloured Retangular Boxes ***********************************************************************************************************************/
.cell_header{
	color:red;
	padding: 10px 10px 10px 10px;
	text-align: center;
}
.grey_cell2{
	background:  #ffffff;
	width: 360px;
	height: 180px;
	color: #252525;
	font-size: 14px;
	text-align: center;
	display: block;
}
.grey_cell2:hover{
	color: #000000;
}

.green_cell_no_height{
	background:  #000000;
	width: 360px;
	height: auto;
	color: #ffffff;
	font-size: 14px;
	text-align: center;
	display: block;
}
.green_cell_no_wh{
	background:  #000000;
	width: auto;
	height: auto;
	color: #ffffff;
	font-size: 14px;
	text-align: center;
	display: block;
}