
/*HVR EFFECT*/
.hvrDropdown {
	display: inline-block;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;}
.hvrDropdown:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;}



.dropdownContainer { /*the box that contains the icon that will drop down*/
	overflow: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;}
.dropdownContainer:active {background: black; top: 2px;}
.dropdownContainer:before {
	position: absolute;
	height: 100%;
	width: 100%;
	line-height: 2.5;
	font-size: 180%;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;}
.dropdownContainer:active:before {color: #703b87;}




.hiddenDropdown:before {left: 0; top: -200%;}
.hiddenDropdown:hover:before {top: 0;}
.icon-remove:before {
	text-align: center;
	content:"+";
	color: #000;
	font-size: 72px;
	font-family: urw-din, sans-serif;
}
/*HVR EFFECT*/







/*HVR2 EFFECT*/
.hvrDropdown2 {
	display: inline-block;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;}
.hvrDropdown2:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;}


.dropdownContainer2 { /*the box that contains the icon that will drop down*/
	width: 100%;
	overflow: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;}
	
.dropdownContainer2:active {background: none; top: 2px; color: #000;}
.dropdownContainer2:before {
	position: absolute;
	height: 100%;
	width: 100%;
	line-height: 2.5;
	font-size: 180%;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	color: #000;
}
	
.dropdownContainer2:active:before {color: #000;}

.dropdownContainer2 h2 {
	display: inline-block;
	width: 100%;
	height: 100%;
	-webkit-transition: all 0.3s;
	-webkit-backface-visibility: hidden;
	-moz-transition: all 0.3s;
	-moz-backface-visibility: hidden;
	transition: all 0.3s;
	backface-visibility: hidden;
}



.hiddenDropdown2:before {left: 0; top: -200%;}
.hiddenDropdown2:hover:before {top: 0;}
.icon-remove2:before {
	text-align: center;
	content: "\f00e";
	color: #000;
	font-size: 50px;
	font-family: "Font Awesome 5 Free";
	font-style: normal;
	font-weight:700;
	text-decoration: inherit;
	height: 200px;
	line-height: 200px;
}


.hiddenDropdown2:hover h2 {
	-webkit-transform: translateY(800%);
	-moz-transform: translateY(800%);
	-ms-transform: translateY(800%);
	transform: translateY(800%);
}
/*HVR2 EFFECT*/





